---

## Alert
Persistent inline notification for communicating status, warnings, errors,
or informational messages. Supports icons, titles, descriptions, actions, and dismissal.
The announced live-region role follows `intent`: `danger` and `warning` render
`role="alert"` (implicitly assertive — it interrupts whatever a screen reader is saying),
every other intent renders `role="status"` (polite). An explicit `role` always wins —
pass `role="alert"` where a success or info message must interrupt, `role="note"` for a
static callout that announces nothing, and `role={undefined}` to drop the attribute when
the Alert already sits inside a live region of its own.

**Import:** `import { Alert } from '@urbicon-ui/blocks';`

### Examples
```svelte
<Alert intent="success" title="Saved successfully">
  Your changes have been saved.
</Alert>
```

```svelte
<Alert intent="danger" variant="inline" dismissible onDismiss={() => (visible = false)}>
  {#snippet icon()}<AlertCircleIcon size={20} />{/snippet}
  Something went wrong. Please try again.
  {#snippet actions()}<Button size="sm" variant="ghost">Retry</Button>{/snippet}
</Alert>
```

### Variants
- intent: danger, info, neutral, primary, success, warning (default: primary)
- variant: filled, inline, soft (default: soft)
- size: lg, md, sm (default: md)

### Api
| Prop | Type | Required | Default | Description |
| --- | --- | :---: | --- | --- |
| ...AlertVariants | `VariantProps` | no |  | Styling variants from AlertVariants |
| ...HTMLAttributes<HTMLDivElement> | `HTMLAttributes` | no |  | HTML attributes (excluding: 'title' | 'children') |
| actions | `Snippet` | no |  | Action buttons snippet |
| children | `Snippet` | no |  | Description content (children slot) |
| class | `string` | no |  | Custom CSS class. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| dismissible | `boolean` | no | false | Show dismiss/close button |
| icon | `Snippet` | no |  | Icon snippet, rendered ahead of the title and text in a box sized by `size` and tinted by `intent`. An Alert draws no icon of its own: without this snippet there is none. |
| intent | `'primary' | 'info' | 'success' | 'warning' | 'danger' | 'neutral'` | no | 'primary' | Semantic color intent — and the announced urgency with it: `danger` and `warning` render `role="alert"` (assertive), every other intent `role="status"` (polite). An explicit `role` overrides the derived one. Only this prop sets the urgency: an `intent` from a `BlocksProvider` theme — a `defaults` entry or a preset, also one named here with `preset` — colours the alert and leaves it `status`. |
| onDismiss | `() => void` | no |  | Callback when dismissed |
| preset | `string` | no |  | Apply a named preset registered via `<BlocksProvider presets={{ Alert: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
| size | `'sm' | 'md' | 'lg'` | no | 'md' | Size |
| slotClasses | `Partial<Record<AlertSlots, string>>` | no |  | Per-slot class overrides. Slots: base | icon | content | title | description | actions | dismissButton. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| title | `string` | no |  | Alert title (bold header text) |
| unstyled | `boolean` | no |  | Remove default styles |
| variant | `'soft' | 'inline' | 'filled'` | no | 'soft' | Visual style |

Inherited from:
- AlertVariants (external)
- Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'children'> (omit-pattern)

### Slots (slotClasses keys)
`base`, `icon`, `content`, `title`, `description`, `actions`, `dismissButton`