This is a highly customizable React JS component that you use within your project to enable OTP Code submissions.
Please note that this component does not make use of any external library and this means that you can literally copy these files
src/otpInputs.js&&src/otpInputs.module.cssinto your project and you're good to go
You can also run the project directly on codeSandbox
After cloning the repo or downloading the source code, run npm install to install all dependencies.
$ npm installWhen the dependencies are installed, and you encounter a babel error, run the command below to resolve this error
$ npm install --save-dev @babel/plugin-proposal-private-property-in-object --legacy-peer-depsNow Fire up your server 🔥
$ npm run startVisit the server at http://localhost:3000 to view the app
-
From
v1.1,autoSubmitis configurable when you call the component<OTPInputGroup autoSubmit={false} />.- If you set this prop to
true, the form will call the submit function once all boxes has been filled, otherwise, you need to hit the submit button for the form to be submitted.
- If you set this prop to
-
This simple app supports both Numbers and Letters.
- If you need only numbers or letters, be sure to modify it to suit your project.
Not playing? click here to view it