@pierre/theming
Use @pierre/theming to manage runtime themes. The package separates theme
metadata, theme resolution, selected state, and UI color mapping.
Install
pnpm add @pierre/theming
Install optional peer dependencies only for the selected entry. The React entry
needs react. The themes entry needs @pierre/theme, @shikijs/themes, and
shiki.
Select an API reference
| Need | Reference |
|---|---|
| Create a collection, catalog, descriptor, or bundled theme set | Collections API |
| Register, load, seed, or cache theme objects | Resolver API |
| Track the color mode and selected light and dark themes | Controller API |
| Normalize workbench colors or derive colors | Colors API |
| Read controller state in React | React API |
Select a controller recipe
| Situation | Recipe |
|---|---|
| One app or page shares one color mode and one light/dark selection | Use one controller |
| Independent areas need separate selections or separate controller lifecycles | Use multiple controllers |
Use one controller by default. Use multiple controllers only when the theme state must differ between areas.
Select a framework recipe
| Host | Recipe |
|---|---|
| Vanilla JavaScript or another framework | Use vanilla JavaScript |
| React | Use React |