An aside in one of four flavours. The body is Markdown, so links, `code` and
lists all work inside one.

## Usage

::preview
:::callout{type="tip" title="Nothing else is required"}
The body is Markdown too — links, `code` and lists all work inside one.
:::

#code
```mdc
::callout{type="tip" title="Nothing else is required"}
The body is Markdown too — links, `code` and lists all work inside one.
::
```
::

## Types

::preview
:::callout{type="info"}
`info` — the default, for context the page assumes.
:::

:::callout{type="tip"}
`tip` — something that makes the task easier.
:::

:::callout{type="warning"}
`warning` — a way to get this wrong.
:::

:::callout{type="danger"}
`danger` — data loss, or a change that cannot be undone.
:::

#code
```mdc
::callout{type="info"}
`info` — the default, for context the page assumes.
::
```
::

## API

### Props

| Prop    | Type                                  | Default  | Notes                                  |
| :------ | :------------------------------------ | :------- | :------------------------------------- |
| `type`  | `info` · `tip` · `warning` · `danger` | `info`   | Picks the colour, the icon and the role |
| `title` | `string`                              | —        | Bold first line; the body follows       |
| `icon`  | `string`                              | per type | Any Iconify name, overriding the default |

### Slots

| Slot      | What goes in it            |
| :-------- | :------------------------- |
| `default` | The body, as Markdown      |

## Notes

A `danger` callout carries `role="alert"`; the others do not. An alert interrupts
a screen reader mid-sentence, which is right for "this deletes your data" and
wrong for a tip.