# MActionListbox

An action list is a contextual menu that presents a list of available actions related to a specific element or interface area. It allows users to quickly access functions such as editing, sharing, deleting, or navigating to sub-actions. Action Lists are commonly triggered by buttons, icons (e.g., three-dot menus), or right-click interactions, ensuring a clean and efficient UI.


## Props

| Name | Description | Type | Default |
| --- | --- | --- | --- | 
| `title` | title displayed in mobile version. | `string` | - |
| `position` | Defines the position of the listbox relative to its trigger or container. | `"bottom"` `"top"` `"left"` `"right"` | `"bottom"` |
| `items*` | An array of objects that allows you to provide all the data needed to generate the content for each item. | `{ id?: string` `undefined; icon?: Component` `undefined; label: string; disabled?: boolean` `undefined; appearance?: "standard"` `"danger"` `undefined; divider?: boolean` `undefined; }[]` | - |

## Slots

| Name | Description |
| --- | --- |
| `activator` | Activator element that triggers the listbox. |

## Events

| Name | Description | Type |
| --- | --- | --- |
| `close` | Emits when the close button is clicked. | [] |
| `action` | Emits when an item is clicked, providing its id or index. | [value: string | number] |

## Dependencies

### Depends on

- [MDivider](../divider)
- [MIconButton](../iconbutton)

### Graph

```mermaid
graph TD;
  MActionListbox --> MIconButton
  MActionListbox --> MDivider
style MActionListbox fill:#008240,stroke:#333,stroke-width:4px
```