Theme Switch
Drop-in theme picker button wired directly to ZyraThemeService — a compact toggle or a full 5-theme menu.
API
All inputs and configuration options for zyra-theme-switch.
| Prop | Type | Default | Description |
|---|---|---|---|
mode | 'menu' | 'toggle' | 'menu' | Whether the trigger opens a theme menu or toggles dark/light directly |
disabled | boolean | false | Disables the trigger button |
aria-label | string | 'Toggle theme' | Accessible name for the trigger button |
Accessibility
Built to meet WCAG 2.0 AA. These notes cover the key ARIA, keyboard, and interaction behaviours.
- Trigger has a 44×44px hit-slop for touch targets (WCAG 2.5.5) despite a 36px visual size
- Menu options use role="menuitemradio" with aria-checked reflecting the active theme
- Dropdown panel repositions to stay inside the viewport on any screen size