On this page:

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

TokenColor forState/Meaning
--par-color-separator-breadcrumbBreadcrumb separatorDefault/Enabled
--par-color-text-breadcrumb-item-activeActive breadcrumb item textActive/Selected
PropTypeDefaultDescription
separator'chevron' | 'dash' | 'slash''chevron'Separator style between items.
breadcrumbListBreadcrumbItemProps[]List of breadcrumb items (see below).
limitnumberMax visible items before truncation/overflow.
menuPropsOmit<MenuProps, 'children'>Props for overflow menu (see Menu component).
...ulPropsHTMLUListElement propsAll native ul props (className, style, etc.)

PropTypeDefaultDescription
isMenuItembooleanfalseRender as a menu item (for overflow).
...InlineLinkPropsSee InlineLinkAll props from InlineLink (size, color, disabled, underline, iconOnly, etc.).

PropTypeDefaultDescription
itemsBreadcrumbItemProps[]Items to show in the overflow menu.
menuPropsOmit<MenuProps, 'children'>Props for the menu (see Menu component).
...buttonPropsHTMLButtonElement propsAll 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.