One-Time Password Component
"One invisible input, any UI you can imagine:
input-otpis an accessible, unstyled, fully featured one-time-password component for React.It renders exactly one real text input, paints it invisible, and hands you the state to draw whatever you want on top. Everything the browser gives a text field keeps working, because there is still a text field."
- SMS autofill –
autocomplete="one-time-code"only means something on a single field- Screen readers – one control, one name, one value, one caret, one tab stop
- Every keybinding you didn't implement – select-all, word-delete, shift-arrow ranges, undo, the iOS long-press menu
- Real paste – including a partial paste into the middle of a half-filled code
- Form semantics – one
name, one entry inFormData, a real<label>that focuses it- Unstyled – no theme, no class names to override, no CSS to import
- Small – zero dependencies
Guilherme Rodz
@guilherme_rodz