Breadcrumb
Displays the path to the current resource using a hierarchy of links.
Installation
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo
<Breadcrumb />
When to Use
- Navigating deep hierarchies where users need to understand their location
- Multi-level pages such as settings, dashboards, or content management systems
- Providing a quick way to jump back to parent sections without using the browser back button
API Reference
Breadcrumb
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | Breadcrumb content (typically a BreadcrumbList). |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbList
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | List items and separators. |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbItem
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | Item content (typically a BreadcrumbLink or BreadcrumbPage). |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbLink
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | Link text or icon content. |
| Href | string? | "#" | URL the breadcrumb link navigates to. |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbPage
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | Current page label text. |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbSeparator
| Prop |
Type |
Default |
Description |
|---|
| ChildContent | RenderFragment? | null | Custom separator content. Defaults to a chevron icon. |
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
BreadcrumbEllipsis
| Prop |
Type |
Default |
Description |
|---|
| Class | string? | null | Additional CSS classes. |
| AdditionalAttributes | Dictionary<string, object>? | null | Additional HTML attributes. |
- NavigationMenu — For primary site-wide navigation in headers
- Pagination — For navigating between pages of content within a list