Skip to content

Field status: tooltip presentation variant, and expose statusVariant on inputs #426

Description

@czarandy

Feature

Today the only status presentation is a text block under the control (src/internal/StatusMessage.tsx:26-40). Field has statusVariant: 'attached' | 'detached' (src/components/Field/Field.tsx:14,100), but that only controls spacing/attachment of the box, and individual inputs don't even expose it — only Field and InputGroup (src/components/InputGroup/InputGroup.tsx:76) accept it.

Two additions:

  1. statusVariant="tooltip" — hides the message box entirely and surfaces the status message as a tooltip on the field's existing status icon (getStatusIcon in src/components/Field/inputUtils.tsx:20-30). The icon becomes a focusable button so keyboard users can reach it; the tooltip is dismissible with Escape. Useful for dense forms/toolbars where a message box breaks the layout.
  2. Plumb statusVariant through the individual inputs (TextInput, TextArea, NumberInput, Select, MultiSelect, TagsInput, AutocompleteInput, SearchFilterInput, DateInput, DateRangeInput, TimeInput, FileInput, PinInput) so consumers don't need to drop down to Field to use any variant.

Default stays 'attached' — no behavior change for existing usage.

Notes

  • A11y: with the tooltip variant the message must still be programmatically associated (keep aria-describedby wiring to a visually hidden or tooltip-content element) so the status is announced even when the box is hidden.
  • Tests per variant; Storybook examples showing all three presentations.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requestlargeApproximately large amount of work

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions