Conceptual question about lerna monorepo & styled-components

Viewed 307

So we are building a monorepo for components that will be consumed via a seperate react-app later on.

So we started using styled-components and have a question regarding the themeing of the isolated components. What is best practice? My ideal thought was to create a package called "@org/theme" that exported a theme that all the components should import from like such:

const defaultTheme = { ... };

export default function ThemeProvider({ children }) {
  return <StyledThemeProvider theme={defaultTheme}>{children}</StyledThemeProvider>;
}

But let's say you want to overrule the themes from the react-app, how would you accomplish that?

Another solution would be to not wrap the components with a theme in the components library and use a <ThemeProvider /> in the react-app. Appreciate some opinions on what's best-practice. Thanks community!

0 Answers
Related