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

<Meta of={AlertStories} />

<Title />
<Subtitle>Inline message banners for contextual feedback.</Subtitle>

<Description />

<Primary />

## Controls
<Controls />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **Icons** — Always pair an alert with a matching semantic icon from `lucide-react`.
> - **Placement** — Alerts are persistent inline elements. For temporary feedback, use `Sonner`.
> - **Content** — Keep alert descriptions concise and actionable.