Input Group

DESIGN RATIONALE

A form input component that combines a label, input field, helper text, and validation state into a single composable unit. Error states use a red left-border accent and shake animation on the input. Valid states use a subtle green checkmark icon. Labels use sentence case and always sit above the input for accessibility.

USAGE GUIDELINES

Use in any form context: login, onboarding, wallet creation, or settings. Supports text, number, password, and address types.