Toolbar
A toolbar groups controls under a single tab stop with roving-tabindex arrow navigation. Navigation is direction-aware: in right-to-left layouts the horizontal arrows mirror, so focus always follows the visual order.
- Axe
- Name
- Roving
- Focus
Preview
Installation
npx shadcn@latest add https://ui.publictheta.com/r/toolbar.jsonConformance
Verified against the @publictheta/ui-spec toolbar specification on both the React and vanilla reference implementations, across Chromium, Firefox, and WebKit.
- Axe — No WCAG 2 A/AA axe-core violations
- Name — The widget container exposes an accessible name
- Roving — Exactly one tab stop; Arrow keys move within the widget
- Focus — A visible focus indicator appears on keyboard focus (WCAG 2.4.7)
See the full conformance matrix across all components.