Textarea
Multi-line text input, with the same label, description, and error treatment as Input.
Focus
Same treatment as Input: a thicker neutral border, not an accent-colored ring. An invalid field keeps its red border while focused, so the error doesn't disappear as you fix it.
With a description
Shown on your public profile. Markdown is supported.
Error
error takes the place of description when both are set, so validation never pushes the layout around.
Give us at least a sentence so support can act on it.
Height
Character count
There's no built-in counter; drive the description from the value's own length.
0/140
Props
Every other native attribute is forwarded to the underlying <textarea>.
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | Field label above the textarea. | |
| description | string | Helper line under the field. | |
| error | string | Error message. Replaces the description and switches the field to its error styling. | |
| rows | number | Visible rows, same as the native attribute. | |
| placeholder | string | Placeholder text. | |
| value | string | Controlled value. | |
| disabled | boolean | false | Disables the field. |
| onChange | (e: ChangeEvent<HTMLTextAreaElement>) => void | Fires on input. |
Why it works this way
Why
- It matches Input's states exactly (focus, error, disabled), so a form mixing both feels like one system.
Don't
- Don't use it for short single-line values. Use Input.