docs(textarea): update

This commit is contained in:
Benjamin Canac
2024-07-30 19:18:02 +02:00
parent 4eea9f54c0
commit c4ef5c4db8
3 changed files with 123 additions and 2 deletions

View File

@@ -15,7 +15,7 @@ Use the `v-model` directive to control the value of the Input.
external:
- modelValue
props:
modelValue: 'benjamincanac'
modelValue: ''
---
::

View File

@@ -8,7 +8,127 @@ links:
## Usage
## Examples
Use the `v-model` directive to control the value of the Textarea.
::component-code
---
external:
- modelValue
props:
modelValue: ''
---
::
### Placeholder
Use the `placeholder` prop to set a placeholder text.
::component-code
---
props:
placeholder: 'Type something...'
---
::
### Color
Use the `color` prop to change the ring color when the Textarea is focused.
::component-code
---
ignore:
- placeholder
props:
color: gray
highlight: true
placeholder: 'Type something...'
---
::
::note
The `highlight` prop is used here to show the focus state. It's used internally when a validation error occurs.
::
### Variant
Use the `variant` prop to change the variant of the Textarea.
::component-code
---
ignore:
- placeholder
props:
color: gray
variant: subtle
placeholder: 'Type something...'
---
::
### Size
Use the `size` prop to change the size of the Textarea.
::component-code
---
ignore:
- placeholder
props:
size: xl
placeholder: 'Type something...'
---
::
### Disabled
Use the `disabled` prop to disable the Textarea.
::component-code
---
ignore:
- placeholder
props:
disabled: true
placeholder: 'Type something...'
---
::
### Rows
Use the `rows` prop to set the number of rows. Defaults to `3`.
::component-code
---
props:
rows: 12
---
::
### Autoresize
Use the `autoresize` prop to enable autoresizing the height of the Textarea.
::component-code
---
external:
- modelValue
props:
modelValue: 'This is a long text that will autoresize the height of the Textarea.'
autoresize: true
---
::
Use the `maxrows` prop to set the maximum number of rows when autoresizing. If set to `0`, the Textarea will grow indefinitely.
::component-code
---
external:
- modelValue
props:
modelValue: 'This is a long text that will autoresize the height of the Textarea with a maximum of 4 rows.'
maxrows: 4
autoresize: true
---
::
## API

View File

@@ -133,6 +133,7 @@ export default defineNuxtConfig({
'ULink',
'UProgress',
'UTabs',
'UTextarea',
'UTooltip'
].includes(c.pascalName))