BottomNavigation
Thumb-zone navigation for app-like layouts. Three to five destinations, current one marked.
Example
<BottomNavigation
current="/components"
items={[
{ label: "Home", href: "/" },
{ label: "Library", href: "/components" },
}}
/>With icons
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | Array | - | Label + href + optional iconSvg string. |
current | string | - | Href of the current destination. |
label | string | Primary | Nav landmark name. |
Accessibility
- Real links with
aria-current="page"; the bar is 56px tall for thumbs. - Icons are decorative; the label does the talking.