Skip to content

feat: add HelperText input primitive#646

Draft
isaquebock wants to merge 1 commit into
mainfrom
feat/inputs-helper-text
Draft

feat: add HelperText input primitive#646
isaquebock wants to merge 1 commit into
mainfrom
feat/inputs-helper-text

Conversation

@isaquebock

Copy link
Copy Markdown
Contributor

Summary

Introduce @aziontech/webkit/inputs/helper-text — auxiliary text below a form field, with a kind prop that drives the visual tone:

  • helper (default) — muted, neutral copy.
  • required — warning-tone copy paired with the Required tag treatment.
  • invalid — danger-tone copy for validation errors; usually wired to aria-describedby on the input.
  • disabled — muted with a leading lock icon.

The component is the helper line only — wrapping form-field components own the wiring of aria-describedby and the conditional rendering.

Test plan

  • pnpm --filter @aziontech/webkit lint — clean.
  • Storybook → Webkit/Inputs/HelperText → all four kind variants render with the expected tokens.

Introduce `@aziontech/webkit/inputs/helper-text` — a small text element
that renders auxiliary copy below a form field. The `kind` prop drives
the visual tone:

- `helper` (default): muted token, neutral copy.
- `required`: warning-tone copy paired with the Required tag treatment.
- `invalid`: danger-tone copy for validation errors; usually wired to
  `aria-describedby` on the input.
- `disabled`: muted with a leading lock icon.

The component is the helper line only — wrapping form-field components
own the wiring of `aria-describedby` and the conditional rendering.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

1 participant