Forms

Inputs, selects, and the FormField compound — neutral focus chrome.

Primitives · fixture-only

FormField for every control

Wrap Input, Select, and Textarea in FormField — label, hint, and error in one compound.

Workshop: Object create/edit dialogs, settings sections, approval forms.
Avoid: Bare inputs without labels — breaks accessibility and scan patterns.

Fixture data only — behaviour matches production chrome

SearchableSelect for long lists

Use SearchableSelect when options exceed ~8 items — owners, agents, modules.

Workshop: Record assignment fields, agent picker, module configuration.

Fixture data only — behaviour matches production chrome

FormField + Input

Default, error, and disabled states with neutral focus chrome.

Neutral border ramp on focus

Textarea

Select

SearchableSelect

Combobox with typeahead for long option lists.

Field compound (legacy)

Prefer FormField for new work — legacy layout for migration reference.

Helper below control

Validation message

SubmitButton

Server-action submit with built-in pending state.

CollapsibleSection

Progressive disclosure for optional form fields.