InputGrid Block

A powerful and customizable input grid component, building upon the capabilities of the original DigitGrid, designed to handle various types of structured inputs like PINs, OTPs, codes, and more.

Key Features:

• Dynamic Input Generation: Automatically generate multiple input fields based on a specified length or configuration.

• Flexible Input Type: Choose between:

  • Clear: Regular visible text input

  • Password: Masked input for secure data entry

• Advanced Pre-Validation Options: Control what users can enter in the inputs:

  • AnyInput: No restrictions

  • Digits: Only allows numbers

  • Letters: Only letters

  • LettersAndDigits: Letters and numbers only (no spaces/special characters)

  • Custom: Provide your own RegEx for custom filtering

• Smart Clipboard Support: Users can paste the entire input sequence anywhere, and it will automatically distribute characters across the grid.

• Smooth Focus Management: Automatically shifts focus between fields as users type or delete.

• State Styling: Easily customize styles for:

  • Normal

  • Active

  • Filled

  • Error states

• Secure Input Support: With the Password type and validation mechanisms, ensure safe handling of sensitive data.

• Validation: Ensures input length and content match your configuration.

• Event Handling: Capture and respond to input changes and focus events.