Breadcrumb
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
List
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Preview
index.tsx
Design Tokens for Breadcrumb
Token | Color for | State/Meaning |
---|
--par-color-separator-breadcrumb | Breadcrumb separator | Default/Enabled |
--par-color-text-breadcrumb-item-active | Active breadcrumb item text | Active/Selected |
Breadcrumb API Reference
<Breadcrumb />
Prop | Type | Default | Description |
---|
separator | 'chevron' | 'dash' | 'slash' | 'chevron' | Separator style between items. |
breadcrumbList | BreadcrumbItemProps[] | | List of breadcrumb items (see below). |
limit | number | | Max visible items before truncation/overflow. |
menuProps | Omit<MenuProps, 'children'> | | Props for overflow menu (see Menu component). |
...ulProps | HTMLUListElement props | | All native ul props (className, style, etc.) |
<BreadcrumbItem />
Prop | Type | Default | Description |
---|
isMenuItem | boolean | false | Render as a menu item (for overflow). |
...InlineLinkProps | See InlineLink | | All props from InlineLink (size, color, disabled, underline, iconOnly, etc.). |
Prop | Type | Default | Description |
---|
items | BreadcrumbItemProps[] | | Items to show in the overflow menu. |
menuProps | Omit<MenuProps, 'children'> | | Props for the menu (see Menu component). |
...buttonProps | HTMLButtonElement props | | All native button props (className, style, etc.) |
Note: BreadcrumbItem extends all props from InlineLink. Breadcrumb and BreadcrumbMenu extend all native props from their respective HTML elements.