forms contract
Textarea
Multi-line text entry. Use when expected input exceeds ~80 characters.
Variants
- default
- Resizable, fixed minimum 3 rows
- auto
- Auto-grows up to a max-height, then scrolls
Sizes
- sm
- Min 2 rows, max 4 rows
- md
- Min 3 rows, max 8 rows (default)
- lg
- Min 5 rows, max 12 rows — long-form composer
Example
<Textarea name="bio" rows={4} maxLength={280} aria-describedby="bio-count" />
<span id="bio-count">{value.length}/280</span>Usage rule
Resize handle defaults to vertical only; horizontal resize is always disabled.
The full Textarea contract has 4 more rules, plus the do-not patterns. Get the full recipe.