One-time code
One-time code and verification blocks for shadcn/ui. OTP inputs for email, SMS and authenticator codes with resend timers, device trust options and backup code fallbacks. Built for shadcn/ui.
Email verification Card for shadcn/ui: logo, "Check your email" title with the masked recipient, a six-slot InputOTP split 3+3 by an InputOTPSeparator, an expiry hint, a "Verify" submit Button and an outline "Resend code (0:29)" Button that stays disabled until a useEffect countdown reaches zero. A "Use a different method" link sits in the CardFooter. The default magic-code screen for sign-in and sign-up.
Two-factor page in shadcn/ui: the left column holds the authenticator form with six evenly spaced InputOTP slots, a pre-checked "Trust this device for 30 days" Checkbox with explanation, a Verify Button and a recovery link, plus a signed-in-as footer. The right bg-muted panel lists other methods (authenticator marked Current with a Badge, text message, backup code, security key) as icon rows inside a RadioGroup, highlighted with a primary ring when selected.
Verification Card for shadcn/ui using Tabs to switch between two methods. Text message shows six numeric, auto-focused InputOTP slots, a Verify Button and a "Call me instead" fallback; Backup code shows a single wide font-mono tracking-widest Input with an xxxx-xxxx-xxxx placeholder, a "7 remaining" note and its own Verify. A MapPin footer reports the device and location. Ideal when SMS is the primary factor but users need an offline escape hatch.