Pattern
Forms and validation
Labels, help text, inline errors, the error summary and validation timing.
Rules
- Every field has a visible label above it; placeholders are examples, never labels.
- Validate on submit, then on blur. Never per keystroke, and never for a date of birth while it is being typed.
- Errors sit next to the field (danger text with an icon, linked by aria-describedby) and in a summary at the top that takes focus and links to each field.
- Schemas from
@edflow/sharedraise message keys; the form translates them, so copy stays in the catalogue. - Selects are full width with a popup that matches the field; long lists are grouped and scroll.