Toggle

zyra-toggle

Pressable button that holds a boolean pressed/unpressed state — for toolbar actions, formatting controls, and filter pills.

API

All inputs and configuration options for zyra-toggle.

PropTypeDefaultDescription
pressedbooleanfalseCurrent pressed state; two-way bindable via [(pressed)]
size'sm' | 'md' | 'lg''md'Physical size of the button
disabledbooleanfalseDisables interaction
aria-labelstring | nullnullAccessible name when the projected content is icon-only
changed (output)boolean-Emits the new pressed value whenever the toggle changes

Accessibility

Built to meet WCAG 2.0 AA. These notes cover the key ARIA, keyboard, and interaction behaviours.

  • Renders as a native <button> with aria-pressed to communicate state
  • Provide aria-label when the projected content is icon-only
  • Keyboard-operable via Space/Enter and Tab to focus