Documentation
Documentation Hub

Radius

Textarea can have different radius factors. Use the rounded prop to change the radius of the textarea component.

Default props of all <BaseTextarea> can be set in your <app>/app.config.ts.
Show code
vue

Contrast:default+

Textarea can have different contrasts. Use the contrast prop to change the contrast of the textarea component.

Show code
vue

Contrast:muted

Textarea can have different contrasts. Use the contrast prop to change the contrast of the textarea component.

Show code
vue

Contrast:muted+

Textarea can have different contrasts. Use the contrast prop to change the contrast of the textarea component.

Show code
vue

Label:float

Textarea can have floating labels. Use the label-float prop to enable the floating label.

Show code
vue

Focus

Textarea can have a primary colored focus. Use the color-focus prop to enable the colored focus.

Show code
vue

Error

Textarea can be shown in an error state. Use the error prop to show the error and the error message.

Please enter a message
Please enter a message
Show code
vue

Loading

Textarea can be shown in a loading state. Use the loading prop to enable the loading state.

Show code
vue

Disabled

Textarea can be shown disabled. Use the disabled prop to disable the textarea.

Show code
vue

Custom addons

Textarea can have custom addons. Use the addon slot to add your own custom addons.

Maya

Maya

Show code
vue

#<BaseTextarea>

•Model

v-model
modifiers

v-model.trim

v-model.lazy

Show example
vue

•Properties

addon
Whether to display an addon element in the textarea.
Show example
vue
autogrow
Whether to automatically grow the textarea as text is entered.
Show example
vue
classes
A set of classes to apply to the various elements of the textarea.
Show example
vue
color-focus
Whether to apply the focus color to the textarea.
Show example
vue
disabled
Whether the textarea is disabled.
Show example
vue
error
The error message for the textarea, or whether it is in an error state.
Show example
vue
id
The form input identifier.
Show example
vue
label
The label for the textarea.
Show example
vue
label-float
If the label should be floating.
Show example
vue
loading
Whether the textarea is in a loading state.
Show example
vue
max-height
The maximum height of the textarea when autogrow is enabled.
Show example
vue
name
The name of the textarea.
Show example
vue
placeholder
The placeholder text for the textarea.
Show example
vue
readonly
Whether the textarea is read-only.
Show example
vue
resize
Whether to allow the user to resize the textarea.
Show example
vue
rows
The number of rows to display in the textarea.
Show example
vue

•Properties (with app.config)

rounded
The radius of the textarea.

@since

2.0.0

Show example
vue
contrast
The contrast of the textarea.
Show example
vue
size
The size of the textarea.
Show example
vue

•Slots

#label
This slot has no inherted props
Show example
vue
#addon
This slot has no inherted props
Show example
vue

•Exposed

rounded
The radius of the textarea.
Show example
vue
contrast
The contrast of the textarea.
Show example
vue
size
The size of the textarea.
Show example
vue
el
The underlying HTMLTextAreaElement element.
Show example
vue
fitSize
A method to resize the textarea to fit its content.
Show example
vue