Navigation
Breadcrumb
Hierarchical navigation trail. The last item renders as the current page (no link, bolder); intermediate items are links.
Examples
Default
<Breadcrumb items={[
{label: 'Home', href: '/'},
{label: 'Library', href: '/library'},
{label: 'Recently Added'},
]} />Custom separator
<Breadcrumb items={…}>
{#snippet separator()}›{/snippet}
</Breadcrumb>Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | {label, href?}[] | — | Trail of crumbs. Items without href are non-interactive labels; the last item is treated as the current page. |
separator | Snippet | — | Override the default "/" separator (e.g. with "›" or a chevron SVG). |
ariaLabel | string | 'Breadcrumb' | Accessible name for the <nav>. |
Install
CLI
npx @a3tai/mittsu add breadcrumb