Controls10
Textarea
Grows with its content, up to a limit.
Installation
npx shadcn@latest add @quireui/textareaUsage
<Field>
<FieldLabel>Notes</FieldLabel>
<Textarea minRows={2} maxRows={8} />
</Field>minRows sets the starting height (default 3) and maxRows where it stops growing and scrolls instead (default 12). It uses CSS field-sizing where the browser supports it and measures the content elsewhere. Inside a Field it gets the same label, description and error wiring as Input.
Accessibility
Like Input, the field takes its label and its error message from its Field, so the error is read with the field.
| Key | Action |
|---|---|
| Enter | Adds a new line. |
| Cmd/Ctrl+Enter | Inside a DialogForm or PopoverForm, submits the form. |
API reference
Textarea
Grows with its content. Uses CSS field-sizing where supported and measures scrollHeight elsewhere. Works inside Field like Input does.
Prop
Type
Also takes every <textarea> attribute. Style it with [data-slot="textarea"].