react-otp-ui v1.0.6

react-otp-ui

One-time password input component for React.

How to Install

Make sure you have Node.js and NPM installed.

npm install react-otp-ui

Or

yarn add react-otp-ui

How to Use

import React from 'react'
import OtpForm from 'react-otp-ui'

const OTPDemo = () => {
  const handleOnChange = (data) => {
    console.log('data', data)
    
    /* data object like this {digit: '1', digit2: '2', digit3: '3', digit4: '4', otpValue: '1234'} */
  }

  return (
    <OtpForm
      onChange={handleOnChange}
    />
  )
}

Demo

Check out Online Demo here.

import React from 'react'
import OtpForm from 'react-otp-ui'

const OTPDemoAdvanced = () => {
  const handleOnChange = (data) => {
    console.log('data', data)
  }

  return (
    <OtpForm
      onChange={handleOnChange}
      numberOfInputs={6}
      showSeparator
      separtor=":"
      secureInput
    />
  )
}

Available Props