@mozaic-ds/vue
Version:
Mozaic-Vue is the Vue.js implementation of ADEO Design system
26 lines (19 loc) • 1.73 kB
Markdown
# MTextArea
A text area is an input designed for multi-line text entry, allowing users to input longer content compared to a standard text input. It is commonly used for comments, feedback, descriptions, and messaging. Text areas can be resizable or fixed in height, depending on the context, and often include placeholder text, character limits, and validation messages to guide users.<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#textarea).
## Props
| Name | Description | Type | Default |
| --- | --- | --- | --- |
| `id*` | A unique identifier for the textarea, used to associate the label with the form element. | `string` | - |
| `name` | The name attribute for the textarea element, used for form submission. | `string` | - |
| `modelValue` | The current value of the textarea field. | `string` `number` | - |
| `placeholder` | Text displayed when the textarea is empty. | `string` | - |
| `isInvalid` | If `true`, the textarea is marked as invalid. | `boolean` | - |
| `disabled` | If `true`, the textarea is disabled and non-interactive. | `boolean` | - |
| `rows` | The number of visible text lines in the textarea. | `number` | `2` |
| `minLength` | Minimum number of characters required for the textarea. | `number` | - |
| `maxLength` | Maximum number of characters allowed in the textarea. | `number` | - |
| `readonly` | If `true`, the textarea is read-only (cannot be edited). | `boolean` | - |
## Events
| Name | Description | Type |
| --- | --- | --- |
| `update:modelValue` | Emits when the textarea value changes, updating the modelValue prop. | [value: string | number] |