navigation

Breadcrumb

Accessible breadcrumb navigation with nav[aria-label="breadcrumb"] and aria-current="page" support.

Import

import { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator } from '@stella-ds/react'

BreadcrumbBreadcrumbListBreadcrumbItemBreadcrumbLinkBreadcrumbSeparator

Props

Prop	Type	Default	Description
asChild (BreadcrumbLink)	boolean	false	Render as child element (router Link, etc.)
isCurrentPage (BreadcrumbLink)	boolean	false	Marks current page — renders as span with aria-current

Preview

Examples

Basic

<Breadcrumb>
  <BreadcrumbList>
    <BreadcrumbItem><BreadcrumbLink href="/">Home</BreadcrumbLink></BreadcrumbItem>
    <BreadcrumbSeparator />
    <BreadcrumbItem><BreadcrumbLink isCurrentPage>Docs</BreadcrumbLink></BreadcrumbItem>
  </BreadcrumbList>
</Breadcrumb>

← Badge

All Components

Button →