I have a context and theme to apply in a components lib, these components need to apply that theme. The client repository will choose the theme, but how do I make my components use the theme in the lib repository without the ThemeProvider in App.tsx that does not exist in libs?

my button.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;
`;

my theme.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"
};

my context.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);