React OTP

Content Type: Widget
Categories: Utility,User Interface

Overview

A versatile React component for one-time password inputs, allowing full customization. Perfect for secure web authentication interfaces.

Documentation

Demo urlhttps://reactotp-sandbox.mxapps.io/login.html?profile=Responsive

A versatile React component for one-time password inputs, allowing full customization. Perfect for secure web authentication interfaces.

 

Features

  • Value: The value of the OTP passed into the component
  • Num Inputs: Number of OTP inputs to be rendered. Default is 4.
  • Render Separator: Input that is supposed to be rendered for each of the input fields. Default is -.
  • Input Type: 'password' | 'text' | 'number' | 'tel'. Default is 'text'.
  • Placeholder: Specify an expected value of each input. The length of this string should be equal to Num Inputs.
  • Input Style: class passed to each input.
  • Container Style: class passed to container of inputs.

 

Demo URL:

https://reactotp-sandbox.mxapps.io/login.html?profile=Responsive

 

Credentials:

demo_administrator

MXGH4LbjhgtF

 

Dependencies:

•          Mendix modeler 9.12.4.

 

Issues, suggestions and feature requests

https://github.com/bharathidas/ReactOTP/issues

 

Releases

Version: 1.0.0
Framework Version: 9.24.12
Release Notes: A versatile React component for one-time password inputs, allowing full customization. Perfect for secure web authentication interfaces. **Features** • **Value**: The value of the OTP passed into the component • **Num Inputs**: Number of OTP inputs to be rendered. Default is 4. • **Render Separator**: Input that is supposed to be rendered for each of the input fields. Default is -. • **Input Type**: 'password' | 'text' | 'number' | 'tel'. Default is 'text'. • **Placeholder**: Specify an expected value of each input. The length of this string should be equal to Num Inputs. • **Input Style**: class passed to each input. • **Container Style**: class passed to container of inputs. **Demo URL**: https://reactotp-sandbox.mxapps.io/login.html?profile=Responsive **Credentials**: demo_administrator MXGH4LbjhgtF **Dependencies**: • Mendix modeler 9.12.4. **Issues, suggestions and feature requests** https://github.com/bharathidas/ReactOTP/issues