# `m-check-list-menu`

A check-list menu is a structured vertical list where each item represents a distinct section of content. It enables users to navigate through and validate different parts of an interface in any order. Unlike linear steppers, this component offers flexibility by allowing non-sequential completion, making it ideal for user profile setup, application settings, or flexible onboarding processes where users can choose their own path through the experience.

## Props

| Name | Description | Type | Default |
|------|-------------|------|---------|
| `items*` | Defines the menu items, each of which sets a checked state and act as a button, link, or router-link. | `CheckListMenuItem[]` |   |
| `selected` | Specifies the key of the currently selected menu item. It allows the component to highlight or style the corresponding item to indicate it is selected or currently in use. | `number` | `$bindable()` |
| `outlined` | When enabled, adds a visible border around the wrapper to highlight or separate its content. | `boolean` |   |

## Dependencies

### Depends on

- [m-built-in-menu](../builtinmenu/README.md)
- [m-built-in-menu-item](../builtinmenuitem/README.md)

### Graph

```mermaid
graph TD;
  m-check-list-menu --> m-built-in-menu
  m-check-list-menu --> m-built-in-menu-item
style m-check-list-menu fill:#008240,stroke:#333,stroke-width:4px
```

