Input OTP
OTP input component - individual bordered slots with spring animation on input
案例展示
InputOTP 组件在实际场景中的使用示例
验证码输入
Value: empty
带分隔符
PIN 码（掩码显示）
For secure input, content displayed as dots
6位安全码（掩码）
6-digit security code with separator
禁用状态
邮箱验证场景
Verify your email
We've sent a verification code to user@example.com
Didn't receive the code?
手机验证场景
Enter SMS Code
A 4-digit code was sent to +1 (555) ***-1234
银行安全码场景（带掩码）
Secure Transaction
Enter your 6-digit PIN
两步验证（掩码）
Two-Factor Authentication
Enter the code from your authenticator app
形状变体
通过 className 自定义 OTP 槽位的形状
圆角槽位
圆形槽位
方形槽位
大尺寸
紧凑尺寸
强调色边框
下划线样式
状态
InputOTP 组件的不同状态