react-otp-input-rc-18
v2.4.1
Published
A fully customizable, one-time password input component for the web built with React
Downloads
951
Maintainers
Readme
react-otp-input
A fully customizable, one-time password input component for the web built with React.
Installation
To install the latest stable version:
npm install --save react-otp-input
Basic usage:
import React, { Component } from 'react';
import OtpInput from 'react-otp-input';
export default class App extends Component {
state = { otp: '' };
handleChange = (otp) => this.setState({ otp });
render() {
return (
<OtpInput
value={this.state.otp}
onChange={this.handleChange}
numInputs={6}
separator={<span>-</span>}
/>
);
}
}
API
Breaking changes when porting to v1.0.0
react-otp-input
is now a controlled component to facilitate functionalities that weren't possible before from the application using it, such as clearing or pre-assigning values. For v1.0.0
and above, a value
prop needs to be passed in the component for it to function as expected.
Development
To run the development server:
npm run dev
Checklist
- [x] Add flowtypes
- [x] Add ESLint, Prettier for code quality
- [x] Add styling support for states including focus/disabled
- [ ] Write tests
Contributing
Feel free to open issues and pull requests!
License
Contributors ✨
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!