TextareaField renders a field composed of a Textarea, a Label and a InlineMessage. It is the preferred way to render a form field for multi-line text.
In addition to text Label (required) and a validation error (optional), TextareaField accepts all the same props as Textarea and will pass them on to the textarea it renders. However, as with all our composed components, TextareaField’s className will be applied to a containing div — the styling of the individual components inside TextareaField cannot be altered.
<Form>
<TextareaField
label="Write something"
name="example"
id="example"
className="w-80"
/>
</Form>
API Reference
| Prop | Type | Default | Required |
|---|---|---|---|
appearance | "standard" | "modern" | - | - |
as | JSX.IntrinsicElements | - | - |
description | string | - | - |
error | string | - | - |
hideLabel | boolean | - | - |
label | string | - | |
prompt | { link?: string | undefined; label: string; onClick?: (() => void) | undefined; } | - | - |
state | "error" | - | - |
theme | "white" | "grey" | - | - |
validation | ValidationOptions | - | - |