Mroom-react-otp-input NPM

Mroom-UI: OTP Component for react

🔑 A simple One Time Password verification input for your react application.

Installation

bower install mroom-react-otp-input

# or

npm install mroom-react-otp-input

Example

import React from "react";
import OneTimePasswordInput from "./components/OneTimePasswordInput";

function App() {
  return (
    <OneTimePasswordInput onVerifyCode={(input) => input === "000000"} />
  );
}

export default App;

Features

Configure inputs numbers based on your needs.
Supports tab and backspace keyboard events.

API

Props	Type	Description	Default
digitInputCount	Number	Specify how many input you want for your otp verification length	6
disableVerificationStatus	Boolean	Hide the verification status below the digit inputs.	false
wrapperStyle	Object	Customize the global wrapper style containing the inputs	{}
inputStyle	Object	Customize the style of the inputs	{}
onVerifyCode	function	A callback function required to use in order to verify the input with a backend verification code.	-

TODOS

[] Migrate it to typescript
[] Improve performance.
[] Write tests

Note

This is my first time building a small component for the open-source 🌎. I will be so thunkfull 🙏 if you send me your feedback and recommendations.

Socials

Made with ❤️ by Mounir Hamzaoui

react-otp one-time-password otp-input react component ui

@testing-library/jest-dom @testing-library/react @testing-library/user-event react react-dom react-scripts web-vitals

@infinitebrahmanuniverse/nolb-mr @everything-registry/sub-chunk-2211 @zalastax/nolb-mr

0.1.2

2 years ago

0.1.1

2 years ago

0.1.0

2 years ago