Components
Toolbar
A row of controls for one thing, like a table’s: one stop for Tab, and the arrow keys through its buttons, toggles and fields.
Import
import { Toolbar, ToolbarSeparator } from '@rinzai/zen';Examples
Vertical
Upright beside what it controls, e.g. a chart: ↑↓ move through it, and its toggle group stacks too.
API reference
<Toolbar>
A row of controls for one thing, e.g. a table's or an editor's: buttons, ToggleGroups, Selects, a search field. Tab enters it once; ←→ (↑↓ when orientation="vertical") move between its controls, Home and End jump to the ends. Divide it with ToolbarSeparator. Give it an aria-label.
| Prop | Type | Default |
|---|---|---|
orientation | "horizontal" | "vertical" | horizontal |
<ToolbarSeparator>
A hairline between groups of a Toolbar's controls, across its direction.
| Prop | Type | Default |
|---|---|---|
decorativeOnly visual: hidden from screen readers. | boolean | — |