Breadcrumb
A navigation aid that shows the user's location within a site hierarchy.
Installation
tsx
import { Breadcrumb, BreadcrumbItem } from "madagent";Default
Two Levels
Deep Navigation
BreadcrumbItem Props
| Prop | Type | Default | Description |
|---|---|---|---|
href | string | - | URL to navigate to. Omit for the current (last) page. |
children | ReactNode | - | Item label content |
className | string | - | Additional CSS class |
RTL Support
Components automatically adapt to right-to-left languages using CSS logical properties.
Preview
Usage
tsx
<Breadcrumb>
<BreadcrumbItem href="/">الرئيسية</BreadcrumbItem>
<BreadcrumbItem href="/docs">التوثيق</BreadcrumbItem>
<BreadcrumbItem>المكونات</BreadcrumbItem>
</Breadcrumb>