2.4.1 • Published 2 years ago

otp-input-react-18 v2.4.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

otp-input-react-18

npm version npm npm All Contributors

A fully customizable, one-time password input component for the web built with React. This is forked from react-opt-input to solve compatibility with react 18.

see here

Live Demo

CodeSandbox

Installation

NPM

To install the latest stable version:

npm install --save otp-input-react-18

Basic usage:

import React, { Component } from 'react';
import OtpInput from 'otp-input-react-18';

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

PRs Welcome Open Source Love

  • Add flowtypes
  • Add ESLint, Prettier for code quality
  • Add styling support for states including focus/disabled
  • Write tests

Contributing

GitHub issues GitHub pull requests

Feel free to open issues and pull requests!

License

NPM

Contributors ✨

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!

2.4.1

2 years ago

2.4.0

2 years ago