Tengo un contexto y un tema para aplicar en una biblioteca de componentes, estos componentes necesitan aplicar ese tema. El repositorio del cliente elegirá el tema, pero ¿cómo hago para que mis componentes usen el tema en el repositorio lib sin ThemeProvider en App.tsx que no existe en libs?

mi botón.tsx:

 const ButtonCircular = (props: ButtonCircularProps) => ( <Container {...props}> {children} </Container> ); const Container = styled.button` width: {use theme}; height: {use theme}; display: flex; justify-content: center; align-items: center; border: none; `;

mi tema.ts

 export const lightTheme: IThemeProps = { primary: "#FFF", secondary: "#F8F8F8", textColor: "#585280", header: "#585280", headerNumber: "#FFF", activeMenu: "#585280" }; export const darkTheme: IThemeProps = { primary: "#302C40", secondary: "#2C2839", textColor: "#FFF", header: "#FFF", headerNumber: "#585280", activeMenu: "#FFF" };

mi contexto.ts

 import { createContext, useContext } from "react"; export enum Theme { LightTheme, DarkTheme, } export type ThemeContextType = { theme: Theme; setTheme: (Theme: Theme) => void; }; export const ThemeContext = createContext<ThemeContextType>({ theme: Theme.LightTheme, setTheme: (Theme) => console.warn("No theme provider"), }); export const useTheme = (): ThemeContextType => useContext<ThemeContextType>(ThemeContext);