Breadcrumbs
Show where users are in the application.
General
The basic Breadcrumbs usage.
Separator
Custom separator in characters.
Icons
Show more information with icons.
With NextJS
Example for use with next.js: keep the href and navigate with the router on click.
APIs
Breadcrumbs.Props
| Attribute | Description | Type | Accepted values | Default |
|---|---|---|---|---|
| separator | separator string | string | - | / |
| ... | native props | HTMLAttributes | 'id', 'className', ... | - |
Breadcrumbs.Item.Props
| Attribute | Description | Type | Accepted values | Default |
|---|---|---|---|---|
| href | link address | string | - | - |
| nextLink | render as a link even without href | boolean | - | false |
| onClick | click event | (event: MouseEvent) => void | - | - |
| ... | native props | AnchorHTMLAttributes | 'id', 'className', ... | - |
Breadcrumbs.Separator.Props
| Attribute | Description | Type | Accepted values | Default |
|---|---|---|---|---|
| ... | native props | HTMLAttributes | 'id', 'className', ... | - |