component-input

What problem does it solve?

This Skill solves the problem of creating accessible text inputs with consistent validation, error/hint wiring, and predictable controlled versus uncontrolled behavior without hand-writing repetitive aria and styling logic.

Core Features & Use Cases

• Accessible validation & messaging: Generates an input that supports validationState (none/valid/invalid) plus errorMessage and hintText linked via aria-describedby.
• Disabled/read-only patterns: Implements the kit-builder accessible disabled behavior (aria-disabled) and supports readOnly with the correct ARIA attributes.
• Controlled/uncontrolled support: Works with value/defaultValue patterns while handling Enter-key behavior via onEnter.

Quick Start

Tell the AI to run the component-input skill to create an fpkit-style Input by providing the input type (e.g., email or number), the required label id, whether it should be controlled (value/onChange) or uncontrolled (defaultValue), and the validation/error state behavior you want.