0.0.2 • Published 2 years ago
react-otpjs v0.0.2
react-otpjs
A react-otpjs is a simple fully customizable react OTP field component.
Demo
Codesandbox Demo | Interactive Demo |
---|
Installation
To install the latest stable version:
Using yarn
yarn add react-otpjs
Using npm
npm i react-otpjs
Basic Usage
import React, { useState } from 'react';
import { OTPInput } from "react-otpjs";
const App = () => {
const [value, setValue] = useState('');
return (
<OTPInput
value={value}
onChange={(otp)=>setValue(otp)}
numInputs={4}
/>
);
};
API
Name | Type | Required | Default |
---|---|---|---|
numOfInputs | number | true | |
fieldWidth | string | false | 50px |
fieldHeight | sring | false | 50px |
placeHolder | string | false | * |
fieldSeperator | ReactNode | false | - |
filedClassName | string | false | |
containerClassName | string | false | |
autoFocus | boolean | false | false |
disabled | boolean | false | false |
isError | boolean | false | false |
isTypeNumber | boolean | false | true |
errorStyle | Object | false | Visit Documentation` |
inpuStyle | Object | false | Visit Documentation` |
inputFocusStyle | Object | false | Visit Documentation` |
onChange | Function | true | Visit Documentation` |