Dynamic Variants
nmhieu1896 opened this issue · comments
Hello guys,
Firstly, I just want to know if this project is still in developing or not, because I'm sooooo in love with Stitches. Looking it haven't got any commits for the last 5 months is so sad :(
If this's still in progress, I hope that we can have dynamic variants or component scope utils. For details, we can pass a dynamic values to variants as a function argument like we did with utils.
hope to see your comeback.
Hey @nmhieu1896 👋
We don't plan on adding dynamic variants as part of the library as most of the cases for dynamic variants can be achieved with normal variants and custom css properties.
I've made a demo here and the a bit of a discussion about it is available on discord
if i wouldlike create progressbar and i passed progress how can i do this without dinamic variant?
As an option (not a real code I tested)
const ProgressBar = styled('div', {
width: '100%',
transform: 'scaleX(var(--progress-bar-status, 0))',
})
const App = ({ progress }) => {
return <ProgressBar style={{ --progress-bar-status: progress / 100 } as SomethingToSurpressReactStyleBeingUnhappy) />;
}