Sobes.tech
Senior

Authorization code component Summary AuthCodeInput is a 6-character authorization code input used for 2FA-style flows. It renders six single-character fields, and integrates with a backend to validate the entered code. User story As a user, I want to enter a 6-character authorization code and submit it, so that I can verify my identity in a familiar 2FA-style flow. Anatomy - 6 input fields aligned in a row (single character per field) - In the middle of the input fields, render a dash (-) Core behavior Inputs - Each of the 6 fields accepts a single character. - Only digits 0–9 and letters A-Z are allowed. - Typing a valid character: o Stores the character in the current field. o If the entered character is in lowercase, it must uppercase it automatically. o Automatically focuses on the next field. - OTP completeness: o The component considers the value “complete” only when all 6 fields are filled.