stitchesjs / stitches

[Not Actively Maintained] CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
https://stitches.dev
MIT License
7.75k stars 253 forks source link

Docs: Recipe on how to create styles with dynamic values using scoped tokens #1034

Open hadihallak opened 2 years ago

hadihallak commented 2 years ago

Showcase how to create styles that map to dynamic values using scoped tokens for cases mentioned here #721

If you have any examples you'd like us to cover please share them in the comments.

bbg commented 2 years ago

Hi @hadihallak,

I have a few questions.

We are implementing a huge E-Commerce platform UI on Stitches and what we need most is to send dynamic values to variants via props.

[I'm asking for clarity. "https://github.com/stitchesjs/stitches/pull/721#issue-966540684" seems to have merged the suggested codes made here. Will this proposition be released?](https://github.com/stitchesjs/stitches/pull/721#issue-966540684 Is there a way to do the proposition mentioned here right now?. Is the topic you opened here to share the ways to do this?)

In my review "https://github.com/stitchesjs/stitches/pull/721#issue-966540684" the PR of the proposition made here has been accepted and merged into the canary branch. In which version will this development be published?

bbg commented 2 years ago

Hi @hadihallak, I have been waiting for your answer to our questions for a long time. Your answers on this matter are important to us. Thanks.

hadihallak commented 2 years ago

@bbg sorry this got burred in my notifications. In general and by design Stitches tries to re-use styles whenever is possible to optimize performance. However, we can achieve something similar to dynamic variants by using css properties. will try to create an example/package for this in the following days and share it with you here

bbg commented 2 years ago

Thank you @hadihallak, I'm patiently waiting for your example/package.

bbg commented 2 years ago

Hello @hadihallak, Any progress on this?

hadihallak commented 2 years ago

@bbg Working on this right now. will share ASAP

hadihallak commented 2 years ago

@bbg Take a look at the code here https://github.com/hadihallak/stitches-dynamic-variants live demo https://codesandbox.io/s/damp-hill-m4gwwc?file=/src/App.tsx