# `m-popover`

A popover is a small overlay that appears above other content, typically triggered by a user interaction such as clicking or hovering over an element. It is used to display contextual information, additional actions, or interactive content without navigating away from the main interface. Popovers often include a title, description, and action buttons, and they automatically close when clicking outside or selecting an action.

## Props

| Name | Description | Type | Default |
|------|-------------|------|---------|
| `open*` | If `true`, display the popover. | `boolean` | `$bindable()` |
| `appearance` | Allows to define the popover appearance. | `'standard'` `'inverse'` | `standard` |
| `position` | Defines the preferred position of the popover relative to its activator. | `'top'` `'right'` `'bottom'` `'left'` | `top` |
| `pointer` | Controls the visibility of the popover pointer (arrow). | `boolean` | `true` |
| `size` | Determines the size of the popover. | `'s'` `'m'` `'l'` | `s` |
| `closable` | if `true`, display the close button. | `boolean` | `true` |
| `title` | Title displayed at the top of the popover. | `string` |   |
| `description` | Supplementary text displayed below the title. | `string` |   |

## Slots

| Name | Description |
|------|-------------|
| `activator` | Activator element that triggers the popover. |
| `default` | Main content of the popover. |
| `footer` | Use this slot to insert buttons or link in the footer. |

