# `m-modal`

A modal is a dialog window that appears on top of the main content, requiring user interaction before returning to the main interface. It is used to focus attention on a specific task, provide important information, or request confirmation for an action. Modals typically include a title, description, and primary/secondary actions and should be used for single, focused tasks to avoid disrupting the user experience.

## Props

| Name | Description | Type | Default |
|------|-------------|------|---------|
| `open` | if `true`, display the modal. | `boolean` |   |
| `title*` | Title of the modal. | `string` |   |
| `description` | Description of the modal. | `string` |   |
| `closable` | if `true`, display the close button. | `boolean` | `true` |
| `onUpdateOpen` | Callback fired when the modal open state changes. | `(open: boolean) => void` |   |

## Slots

| Name | Description |
|------|-------------|
| `icon` | Use this slot to insert an icon next to the title of the modal. |
| `default` | Use this slot to insert the content of the modal. |
| `link` | Use this slot to insert a link in the footer. |
| `footer` | Use this slot to insert buttons in the footer. |

## Events

| Name | Description | Type |
|------|------|-------------|
| `update:open` | Fired when the open state changes. | `CustomEvent<boolean>` |

