formaat-design / reshaped

Community repository for storing examples, reporting issues and tracking roadmap
https://reshaped.so
110 stars 3 forks source link

Ability to toggle theme #127

Closed kyh closed 1 year ago

kyh commented 1 year ago

Currently, you can set the colorMode with

const theme = useTheme();
theme. setColorMode(...);

I have a use case where I would like the user to be able to toggle the theme as well. Use cases include:

blvdmitry commented 1 year ago

That's a good point. Right now you can do this in the place where your theme is passed to the Reshaped provider with your own state, but adding it to the useTheme hook can be a good DX improvement. Going to add it for the next release

blvdmitry commented 1 year ago

https://user-images.githubusercontent.com/887379/217664326-17b7e10b-ba49-4820-a8b5-6d3deea49ce5.mov

Added support for switching themes with useTheme and a defaultTheme property in Reshaped provider / Theme provider to make its value uncontrolled for the hook to work. Going to ship in the next release. Testing with a fake theme on the video which had no token values so it becomes unstyled.