Input
Text input with built-in label, description, error state, and ARIA wiring.
Example
At least 8 characters
Username is already taken
Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
label | string | — | Required | Accessible label text |
description | string | — | No | Helper text below the input |
error | string | — | No | Error message (triggers error state) |
required | boolean | — | No | Marks the field as required |
hideLabel | boolean | false | No | Visually hides label (still accessible) |
Accessibility
- Auto-generated IDs link label, description, and error via aria-labelledby/aria-describedby
- aria-invalid set when error is present
- aria-required when required
Related Tokens
--input-surface--input-on-surface--input-border--input-focus--input-gap--input-label-font-weight