Komponen / Navigasi
Breadcrumbs
Jejak lokasi halaman dalam hierarki modul: "Order & pengadaan › PO Customer". Biasanya dipakai di dalam PageHeader, di atas judul.
Import
tsx
import { Breadcrumbs, BreadcrumbItem, BreadcrumbOverflow } from '@divistant/circca-react';Props · Breadcrumbs
Juga menerima semua atribut <nav>. Pemisah ditambahkan otomatis di antara item.
| Prop | Tipe | Default | Keterangan |
|---|---|---|---|
| children | ReactNode | — | BreadcrumbItem / BreadcrumbOverflow, urut dari level teratas. |
| aria-label | string | 'Jejak' | Nama landmark navigasi. |
| className | string | — | Kelas tambahan (digabung aman dengan tailwind-merge). |
Props · BreadcrumbItem
Juga menerima semua atribut <a>.
| Prop | Tipe | Default | Keterangan |
|---|---|---|---|
| href | string | — | Tujuan tautan. Tanpa href dan tanpa asChild, item tampil sebagai teks biasa (fg/muted). |
| current | boolean | false | Halaman saat ini: fg/default, bukan tautan, aria-current="page". Hanya untuk item terakhir. |
| asChild | boolean | false | Render sebagai elemen anak (mis. <Link> Next.js) dengan gaya tautan jejak. |
| className | string | — | Kelas tambahan. |
Props · BreadcrumbOverflow
Juga menerima semua atribut <span>.
| Prop | Tipe | Default | Keterangan |
|---|---|---|---|
| label | string | 'Level lain disembunyikan' | Teks pembaca layar untuk "…". Sebutkan level yang disembunyikan bila memungkinkan. |
Sumber
Kode komponen ada di packages/react/src/components/breadcrumbs. Gaya hanya memakai kelas token Circca HIG — tidak ada warna, spasi, atau radius mentah.