Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA six-digit code screen with the numeric keypad, a Verify button pinned above the keyboard, paste support, a resend timer and error handling that clears the code and refocuses the field. Use this when you verify a phone number or email with a one-time code on a phone.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it when you verify a phone number or email with a one-time code on a phone.
Do not use it for long codes or recovery codes with letters (use a text field) or magic-link flows.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
length | number | 6 | Code length. |
onVerify | (code: string) => Promise<boolean> | required | Return false for a wrong code. |
onResend | () => void | required | Send a new code. |
cooldown | number | 30 | Seconds before Resend is allowed. |
autocomplete="one-time-code" with the numeric keypad; the slots read as one field labelled "Verification code".role="alert" message, the code is cleared and focus returns to the field.The pattern ships with a Testing Library test (otp-sticky-verify.test.tsx) that drives it through roles and the keyboard.