Skip to content

BreadcrumbItem

<ts-breadcrumb-item> vv0.4.0

The ts-breadcrumb-item component.

Open in Storybook for interactive demos.

<ts-breadcrumb-item>Content</ts-breadcrumb-item>
PropertyAttributeTypeDefaultDescription
currentcurrentbooleanfalseMarks this item as the current page.
hrefhrefstring | undefinedIf set, renders as a link.
separatorseparatorstring | undefinedSeparator character (set by parent ts-breadcrumb).
NameDescription
*(default)*Default slot for label text.

Use ::part() to style internal elements:

PartDescription
linkThe anchor or span element.
separatorThe separator element.
ts-breadcrumb-item::part(link) {
/* your custom styles */
}
<ts-breadcrumb-item>Content</ts-breadcrumb-item>
import { TsBreadcrumbItem } from '@tessera-ui/react';
<TsBreadcrumbItem>Content</TsBreadcrumbItem>