A semantic path with links, callback steps, muted labels, and a current-page marker.
LinkActionCurrent
<Breadcrumb items={crumbs} />Installation
pnpm add @chanrg/4uiImport the stylesheet once, at the root of your app:
import '@chanrg/4ui/styles.css';Usage
import { Breadcrumb } from '@chanrg/4ui';<Breadcrumb items={crumbs} />API reference
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | BreadcrumbItem[] | [] | Ordered path items. |
label | string | Breadcrumb | Navigation label. |
CSS variables
| Variable | Description |
|---|---|
--4ui-surface | Primary component surface. |
--4ui-text | Primary foreground color. |
--4ui-border | Default control and panel border. |
Accessibility
- Uses nav, ordered-list, and aria-current semantics.