# Input

Single-line text, number, search and code inputs. 40px on desktop, 44px and 16px text on the phone so iOS never zooms.

- **Group:** Form controls · **family:** `form-controls` · **shadcn:** Input
- **Build:** shadcn `Input`.
- **In apps/admin today:** `ui/input.tsx` exists (h-9). Restyle to 40/44px, `--input` edge and the halo focus.
- **Client component:** no. 

## Content rules

- Placeholders show an example in the real format ("navy-birdseye-two-piece"), never the label.

## Do

- Use `inputMode` for numbers on the phone.

## Don't

- Font under 16px on the phone.

## Motion

- Border on `--motion-hover`; halo on `--motion-focus` (140ms).

## Accessibility

- **Keyboard:** Tab moves in; typing edits; Escape does not clear.
- **ARIA:** `aria-invalid` + `aria-describedby` from Field.
- **ARIA:** Search inputs: `type="search"`, `aria-label` when there is no visible label.
- **Focus:** Halo ring (`--focus-ring`), never removed.

## Tokens

`--ring` `--focus-ring` `--control-h-m` `--control-h` `--input` `--r-control` `--s-2` `--s-3` `--background` `--motion-hover` `--motion-focus` `--muted-foreground` `--destructive` `--muted` `--input-hover` `--text-input-m`

## Files

`input.html` live specimen · `input.css` kit rules · `input.d.ts` props · full page: `docs/components/input/` (phone: `m/`).
