Breadcrumb

Organism

nav aria-label="Breadcrumb" sarıcı ile erişilebilir. Son öge aria-current="page" ile işaretlenir, ayrılıcı aria-hidden.

Default

Preview
Code
<Breadcrumb items={[
  { label: 'Home', href: '/' },
  { label: 'Components', href: '/components' },
  { label: 'Breadcrumb' },
]} />

Long path

Preview
Code
<Breadcrumb items={[
  { label: 'Dashboard', href: '/' },
  { label: 'Users', href: '/users' },
  { label: 'Settings', href: '/users/settings' },
  { label: 'Permissions' },
]} />

Custom separator

Preview
Code
<Breadcrumb items={[...]} separator={<span>/</span>} />

Overflow / ellipsis

Preview
Code
<Breadcrumb items={[/* 6 items */]} maxItems={3} />
Sourcemodules/ui/Breadcrumb.tsx