react-password-strength-meter

react component to display password strength meter

Usage no npm install needed!

<script type="module">
  import reactPasswordStrengthMeter from 'https://cdn.skypack.dev/react-password-strength-meter';
</script>

README

React Password Strength Meter

React Component to display password strength meter with message and warning

Dependencies

This Component is built using Dropbox zxcvbn password strength estimator library

Installation & Usage

npm install react-password-strength-meter --save

Password Strength Meter and values

This component will 'strength' meter as prop value (type: object).

strength default value :
strength : {
  0: "Worst ☹",
  1: "Bad ☹",
  2: "Weak ☹",
  3: "Good ☺",
  4: "Strong ☻"
}

Include the Component

var React = require('react');
var PasswordStrengthMeter = require('react-password-strength-meter');

class Component extends React.Component {
  constructor(props){
    super(props);
    this.onChange = this.onChange.bind(this);
  }

  onChange(event){

  }

  render() {
    return <PasswordStrengthMeter passwordText={"Enter Password"} onChange={this.onChange} />;
  }
}

License

MIT © Abhijeet Mishra