# Inline field error

Inline field error: a free component, built on your design tokens, to use for a value in a form that can't be accepted as typed. A form field that says what is wrong right under it and how to fix it, keeps what the person typed, and clears the message once it's right.

Prompt: Add the OpenDesigner component field-error to this project: https://opendesigner.dev/library/field-error.html. Keep its markup and states; map its --ds-* variables to my tokens.

States: error, fixed, submitted, hover, focus.

Accessibility: The label wraps the input; the input is aria-invalid while wrong and described by the message and the hint (the script gives each copy its own ids). The message is a polite live region, checked on leaving the field and on submit, never on every key, and it clears as soon as the value is right; on a failed submit, focus moves to the field.

File: https://opendesigner.dev/library/field-error.html

Catalog entry (parts, data limits, states, tokens): https://opendesigner.dev/library/field-error.json

Download: `curl -fsSLo field-error.html https://opendesigner.dev/library/field-error.html`