form
Input
Recessed input with rim lighting and neon focus ring.
Canonical sourcePreview
This newly registered component is fully installable and documented. Its dedicated interactive showcase is generated in the extended preview pass; use the canonical source and API contract below in the meantime.
Installation
$bash
npx neoncite@latest add input
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | — | Extends the Neoncite classes without replacing semantic behavior. |
| …native / primitive props | varies | — | Forwards the underlying React/HTML props where exposed by the component type. |
States
- • default
- • hover
- • focus-visible
- • disabled
- • selected/checked/open where applicable
- • invalid when composed with validation
Accessibility
- • Uses native HTML semantics where practical; provide an accessible name for icon-only or content-dependent controls.
- • Neoncite focus-visible treatment must remain visible against OLED surfaces.
- • Decorative glow, scan, pulse, and transition effects must not be the only indication of state.
- • All non-essential animation must respect prefers-reduced-motion.
Keyboard interactions
Tab / Shift+TabMoves focus through interactive controls in document order.
Enter / SpaceActivates the focused control when supported by its native or primitive semantics.
Composition
- • Install with `npx neoncite add input`; registry dependencies are resolved recursively.
- • Can be composed with other Neoncite primitives without a private styling runtime.
Token contract
--surface-0…3--hairline--foreground--muted-foreground--primary / --ringsemantic neon/glow tokens where usedSSR / hydration
No special SSR requirement beyond the underlying React/Radix dependency. Interactive client components are marked where required.
RTL
Layout uses logical flow where practical; verify icon direction for directional controls in RTL products.