I&#39;m trying to create a UI library in which every little component would be responsible to style itself according to its props. I have props like size, color and some other modifiers like rounded, centered and so on.
The cool part is that you can display a button wherever you want with the style that you want. The not cool part is that you have to specify these props every single time, for example every time you render an custom input component you have to pass the style modifier rounded, because in another part of application we want the same component without rounded corners.
React <a href="https://facebook.github.io/react/docs/context.html">Context</a> helps us a lot to specify theme parameters in the root components. But as they say it&#39;s an experimental feature. I don&#39;t think we should build upon it.
Have you ever experienced the same issue before? Is there any library you used that can help? Maybe a pattern or something?

I'm trying to create a UI library in which every little component would be responsible to style itself according to its props. I have props like size, color and some other modifiers like rounded, centered and so on.

The cool part is that you can display a button wherever you want with the style that you want. The not cool part is that you have to specify these props every single time, for example every time you render an custom input component you have to pass the style modifier rounded, because in another part of application we want the same component without rounded corners.

React [Context](https://facebook.github.io/react/docs/context.html) helps us a lot to specify theme parameters in the root components. But as they say it's an experimental feature. I don't think we should build upon it.

Have you ever experienced the same issue before? Is there any library you used that can help? Maybe a pattern or something?

Is there any alternative to React Context?

Product

Explore

Company

Blogs

Support