Chapter 26: Input

Core Idea

The plain single-part text input primitive — a controlled/uncontrolled <input> with the same shared field-state data attributes as every other form control, for when a control doesn't need NumberField/OTPField-style specialized formatting.

Key Concepts

• Anatomy: single part, <Input /> — no sub-parts.
• Accessible naming (usage guideline): same rule as every form control — a native <label> or Field.Label/Field.Root is required; no built-in visible label part.
• Value control: value/defaultValue/onValueChange — the same controlled/uncontrolled convention used throughout the library.

Reference Tables

Part	Notable props	Notable data attributes
Input	value/defaultValue/onValueChange	data-valid/data-invalid, data-dirty, data-touched, data-filled, data-focused, data-disabled

Key Takeaways

1. Use plain Input for free-text fields; switch to NumberField (ch031) for numeric input with formatting/stepping, or OTPField (ch032) for fixed-length code entry — don't hand-roll those behaviors on top of Input.
2. Wrap in Field.Root rather than a bare <label> once the input needs validation/error display — it's the same Input either way, just with the accessibility/validation wiring added for free.

Connects To

• ch023 (Field): labeling/validation wrapper.
• ch031 (Number Field), ch032 (OTP Field): specialized siblings for numeric and code-entry input.