TkxOTP

import { TkxOTP } from 'tekivex-ui';

Live demo

Basic

Basic — 6-digit code (default)

Current value: (empty)

Custom Length

Custom lengths — 4 and 8 digits

4-digit PIN:

8-digit security code:

With Complete

With onComplete — fires when all digits filled

Accessibility

• Keyboard navigation supported on all interactive elements
• :focus-visible outline at 2px (theme-token primary)
• ARIA roles and properties applied per WAI-ARIA 1.2
• Respects prefers-reduced-motion
• Minimum 44×44 touch target where applicable

Source

Implementation in src/components/TkxOTP.tsx.

For the full interactive sandbox, open the playground.