otp-react-input

one-time password input component for the web built with React.

To install the latest stable version:

npm install --save otp-react-input

Basic usage:

import React from 'react';
import React0tp from 'otp-react-input';

export default const App =()=> {
 const handleSend = (v) => {
        console.log("Entered OTP is ", v)
    }
     return (
          <React0tp
             title="otp"
             borderColor="#ccc"
             borderWidth="2px"
             borderRadius="5px"
             width="50px"
             height="50px"
             hasError={true}
             errorText="please enter all fields"
             fieldsNumber={4}
             handleSend={handleSend}
        />
     );
}

API

Name	Type	Required	Default	Description
title	string	false	''	title of card.
fieldsNumber	number	true	4	Number of OTP inputs.
handleSend	function	true	console.log	Returns OTP code typed in inputs.
borderColor	string	false	''	change border color of inputs
borderWidth	string /px	false	2px	change width of inputs border
borderRadius	string /px	false	5px	change Radius border of inputs
width	string /px	false	5px	change width of inputs
height	string /px	false	5px	change height of inputs
hasError	boolean	false	false	Indicates there is an error in the inputs.
errorText	style	false	''	error message that show when the error occurred.