https://github.com/ezranbayantemur/react-native-passmeter
Simple password strength meter for React Native.
https://github.com/ezranbayantemur/react-native-passmeter
mobile-development password password-meter password-strength react react-native
Last synced: 20 days ago
JSON representation
Simple password strength meter for React Native.
- Host: GitHub
- URL: https://github.com/ezranbayantemur/react-native-passmeter
- Owner: ezranbayantemur
- License: mit
- Created: 2020-02-12T12:40:44.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-03-02T16:18:37.000Z (over 2 years ago)
- Last Synced: 2025-05-13T13:14:05.953Z (20 days ago)
- Topics: mobile-development, password, password-meter, password-strength, react, react-native
- Language: JavaScript
- Homepage:
- Size: 241 KB
- Stars: 51
- Watchers: 2
- Forks: 11
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# React Native Simple Passmeter
Simple password strength meter for React Native.
[](https://github.com/Naereen/StrapDown.js/blob/master/LICENSE)
[](http://makeapullrequest.com)
## Description
PassMeter has 5 level of security. It's checks the typed password string has any upper case, lower case, numbers and special characters. Password string can be at least 4 character.
| Strength Level | Description | Example |
| -------------- | :------------------------------------------------------------------------------: | --------------------------------------------: |
| 0 | Length of the password is below then gived or default minLenght | "ac", "A2b", "1&", ... |
| 1 | Password has at least one upper case, lower case, numbers and special characters | "example", "PASSWORD", "%+%&/!", ... |
| 2 | Password contains only two condition of the required | "exAmpLe", "pa22w0rd", "PA\$\$W%RD!", ... |
| 3 | Password contains only three condition of the required | "3xAmpL3", "^!22w0rd&6", "pA\$\$W%RD!", ... |
| 4 | Password contains all of the required conditions | "eX@mpL3", "^P@22w0rd", "pA22\$\$W%R1D!", ... |
## Installation
```
npm install react-native-passmeter
```
or
```
yarn add react-native-passmeter
```
## Usage
```javascript
import React, { useState } from "react";
import { SafeAreaView, TextInput } from "react-native";
import PassMeter from "react-native-passmeter";
const MAX_LEN = 15,
MIN_LEN = 6,
PASS_LABELS = ["Too Short", "Weak", "Normal", "Strong", "Secure"];
export default App = () => {
const [password, setPassword] = useState("");
return (
setPassword(password)}
/>
);
};
const styles = {
container: { flex: 1, justifyContent: "center" },
input: {
margin: 5,
padding: 6,
borderRadius: 8,
marginBottom: 8,
paddingHorizontal: 10,
backgroundColor: "#eceff1"
}
};
```
## Properties
| Prop | Type | Description | isRequired | Default Value |
| ---------- | :-----: | :--------------------------: | ---------: | :-----------: |
| password | String | Typed password | true | |
| labels | Array | Strength levels of password | true | |
| minLength | Number | Minimum length of password | false | 4 |
| maxLength | Number | Maximum length of password | false | 15 |
| showLabels | Boolean | Visibilty of strength labels | false | true |
## **@0.0.5**
# Contribute
Feel free to contribute, any PR will be welcomed!
# LICENSE
**MIT**