@mozaic-ds/vue/src/components/select/README.md

Mozaic-Vue is the Vue.js implementation of ADEO Design system

# MSelect

A select component allows users to choose a single option from a predefined list within a native dropdown menu. It helps simplify input by displaying only relevant choices, reducing the need for manual text entry. Select components are commonly used in forms, settings, and filters where structured selection is required.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field section](/docs/form-elements-field--docs#select).


## Props

| Name | Description | Type | Default |
| --- | --- | --- | --- | 
| `id*` | A unique identifier for the select, used to associate the label with the form element. | `string` | - |
| `name` | The name attribute for the select element, used for form submission. | `string` | - |
| `options*` | Define the available choices for the select element. | `{ id?: string` `undefined; text: string; value: string` `number; attributes?: Record<string` `string` `number` `boolean>` `undefined; disabled?: boolean` `undefined; }[]` | - |
| `modelValue` | The current value of the select. | `string` `number` | - |
| `placeholder` | Text displayed when the select has no selected value. | `string` | - |
| `isInvalid` | If `true`, the select is marked as invalid. | `boolean` | - |
| `disabled` | If `true`, the select is disabled and non-interactive. | `boolean` | - |
| `size` | Determines the size of the select. | `"s"` `"m"` | `"m"` |
| `readonly` | If `true`, the select is read-only (cannot be edited). | `boolean` | - |

## Events

| Name | Description | Type |
| --- | --- | --- |
| `update:modelValue` | Emits when the select value changes, updating the modelValue prop. | [value: string | number] |