Components / core

Breadcrumb

Navigation Trail Joined by →

01 Preview

02 Usage

Location trail using the → glyph. Last item is the current page (not a link).

<Breadcrumb
  items={[
    { label: 'Home', href: '/' },
    { label: 'Writing', href: '/writing' },
    { label: 'Interaction Mining' },
  ]}
/>

Override separator (e.g. /) if needed; → is the house style.

03 Props

PropTypeDefaultNotes
items* Crumb[] — —
separator string → Glyph between crumbs.

Also accepts every attribute of React.HTMLAttributes<HTMLElement> — they are spread onto the root element. className is merged, not replaced, and ref is forwarded.

04 Crumb

PropTypeDefaultNotes
label* React.ReactNode — —
href string — —

05 Import

import { Breadcrumb } from '@denizarsan/darsan.design';
import '@denizarsan/darsan.design/styles.css';