Components

Breadcrumbs

Path trail where hovering a link slides a soft lumen underline in from the left.

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal

npx lumora-ui@latest add breadcrumbs

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx

import { Breadcrumbs } from "@lumora/ui/components/breadcrumbs";
// or from the barrel:
import { Breadcrumbs } from "@lumora/ui";

Props worth knowing

items take { label, href? } — the last renders as the current page. maxVisible (default 4) collapses the middle into an ellipsis you can expand; separator swaps the glyph. Hovering a link slides a lumen underline in from the left. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.