Skip to main content

جعبه‌های OTP

کاربرد و حالت‌ها​

ورود کد شش‌رقمی: یک input واقعی که زیر شش خانهٔ نمایشی پنهان شده است (LTR، ارقام فارسی). خانه‌ها ورودی مستقل نیستند — این معماری عمدی است.

اندازه‌ها: خانه‌ها حدود ۴۶×۵۲px با فاصلهٔ ۸ و در عرض‌های کم کوچک می‌شوند. ورودی فارسی هنگام تایپ یا Paste به لاتین نرمال می‌شود؛ Backspace رقم آخر را حذف می‌کند. خطا متنی اعلام می‌شود و لرزش از تنظیم reduced-motion پیروی می‌کند. دکمهٔ تأیید، حالت انتظار و شمارش معکوس ارسال مجدد در صفحهٔ ورود مدیریت می‌شوند، نه در این کنترل.

پلتفرم و دسترس‌پذیری​

OtpInput وب یک input عددی با one-time-code است که به Field وصل می‌شود؛ نام و خطای خوانا لازم است. اندروید هم کد ۶ رقمی دارد (OTP_LENGTH=6 در feature/account/.../AuthStateHolder.kt)؛ شکل کنترل دو پلتفرم یکسان نیست.

منبع وب: apps/calendar-web/src/components/ui/otp-input.tsx. این قرارداد هدف است؛ وضعیت اجرا در پذیرش واقعی. قواعد مشترک: کنتراست، فوکوس، لمس و حرکت.

نمونهٔ هدف