Cascading Themes

[moelp]

When using multiple themes, you currently need to set both [data-color-mode=dark][data-theme=pastel] on every element to apply the correct tokens. Ideally, tokens should cascade—setting [data-color-mode=dark] at the root and [data-theme=pastel] on child elements should be sufficient. Tokens should resolve based on the closest [data-theme=...], inheriting the color mode from the root if not explicitly overridden.

There is already a comment on https://github.com/chakra-ui/panda/blob/main/packages/generator/src/artifacts/css/token-css.ts line 79 - 82

See the following example: https://play.panda-css.com/kZ8hP0OAi4

It would be great to have at least an option to set how themes are generated.

Request that addresses a similar topic: #3145

Or is there any other way to achieve this?

[segunadebayo]

This is a good point. Will consider implementing this pretty soon.

It might be a config option to handle how to selector is resolved.