Installation
Usage
import BreadcrumbSeparator from "@/components/ruixen/breadcrumb-separator";
const items = [
{ label: "Home", href: "/" },
{ label: "Products", href: "/products" },
{ label: "Electronics" },
];
export default function MyBreadcrumb() {
return <BreadcrumbSeparator items={items} separator="slash" />;
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | BreadcrumbItem[] | - | Array of breadcrumb items |
separator | "chevron" | "slash" | "dot" | "arrow" | "dash" | "chevron" | Separator style |
className | string | - | Additional CSS classes |
BreadcrumbItem
| Property | Type | Description |
|---|---|---|
label | string | Display text for the item |
href | string | Optional link URL |
Separator Styles
| Style | Preview |
|---|---|
chevron | > |
slash | / |
dot | · |
arrow | → |
dash | — |