Forms
TextField & Textarea
Text inputs with label, hint, error and adornments — all ARIA wiring handled by the shared Field wrapper.
TextField Textarea Field
import { TextField, Textarea, Field } from '@anomalia/ui'; Notes
- Inputs render at 16px on coarse pointers: below that, iOS Safari zooms the page on focus and never zooms back.
- Pass
errorand the field flips to the danger ring and announces the message viarole="alert". - Use
Fielddirectly when you need the same label/hint/error scaffolding around a custom control.
Examples
Basics
Label, hint, error and adornments all come from the shared Field wrapper, which owns the id and the aria-describedby wiring.
@
Textarea
`autosize` grows and shrinks with the content; `counter` needs a `maxlength` to count against.
API
TextField
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Bindable value. |
label / hint / error | string | — | Field scaffolding; `error` replaces `hint`. |
size | 'sm' | 'md' | 'lg' | 'md' | Control height. |
leading / trailing | Snippet | — | Adornments inside the border. |
fieldClass | string | — | Class for the wrapper (`class` goes to the input). |
Textarea
| Prop | Type | Default | Description |
|---|---|---|---|
autosize | boolean | false | Grow and shrink with the content. |
counter | boolean | false | Show `n / maxlength`. |
Every component also forwards the native attributes of its root element, plus class, so anything not listed here still works.