import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Canvas } from '@storybook/addon-docs/blocks';
import * as BreadcrumbStories from './breadcrumb.stories';

<Meta of={BreadcrumbStories} />

<Title />
<Subtitle>A hierarchical navigation trail showing the user&apos;s current position.</Subtitle>

<Description />

<Primary />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **Last Item** — The final element represents the current page and must use `BreadcrumbPage`.
> - **Injected Breadcrumbs** — Prefer using the `breadcrumbs` prop on the `Header` component for automatic management.
> - **Separators** — Always include a `BreadcrumbSeparator` between items.