Canonical inventory
Forms · core
Textarea
field.textareaTextarea: An input control that gathers, changes, or validates a value.
textareathe place you enter a valuethe input control
States8
Touch target44px
Evidence6
Introduced by8 kits
Visual specimen
Same contract. Every kit voice.
Translation table
What code calls it.
Web<textarea>The closest native or standardized web primitive.direct
ARIAtextbox + aria-multilineThe primary accessibility role or state pattern.direct
SwiftUITextEditorThe nearest named SwiftUI API.direct
AppKitNSTextViewThe nearest named AppKit API.direct
Anatomy
Every part, named.
- 1Label
- 2Input surface
- 3Current value or placeholder
- 4Supporting or error text
- 5Focus and validation treatment
Often confused with
Similar shape. Different contract.
Text field
field.textShares a visual family, but has a different role, state model, or interaction contract.
Search fieldfield.searchShares a visual family, but has a different role, state model, or interaction contract.
Prompt composerfield.composerShares a visual family, but has a different role, state model, or interaction contract.
Prompt · paste into your agent
Ask for the exact thing.
Implement the canonical Textarea component (field.textarea). Textarea: An input control that gathers, changes, or validates a value. Support these states: default, hover, focus-visible, active, disabled, filled, error, loading. Use semantic design tokens rather than raw visual values. Preserve a minimum 44px touch target where interactive. Provide and verify: implementation, state-matrix, responsive, keyboard, touch, reduced-motion. Keep the component API stable so every Studio kit can supply its own rendering without changing the behavior contract.Studio contract
What must be proven.
Required states
default · hover · focus-visible · active · disabled · filled · error · loading
Required evidence
implementation · state-matrix · responsive · keyboard · touch · reduced-motion
Source union
mavan · jade · lumen · aurora · cabana · purple-rain · spatial · margin