Skip to content

A simple and fully customizable React Native component for TextInputs

License

Notifications You must be signed in to change notification settings

amirito/react-native-password-eye

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

npm version GitHub license

react-native-password-eye

enter image description here

Installation

  1. install react-native-vector-icon
  2. Run: $ npm install --save react-native-password-eye

usage

 import TextBox from 'react-native-password-eye'; 

place <TextBox> tag wherever you want to have it.

<TextBox onChangeText={(text) => console.log('onChangeText: ', text)} />

Methods

props required
onChangeText YES

Properties

props value default value
alertType one of success, warning, error null
blurOnSubmit bool false
hint string null
hintColor string #818181
hintStyles style
inputStyle style
placeholder string
placeholderTextColor string #C5C5C5
rtl bool false
returnKeyType enum ( similar to default TextInput ) next
secureTextEntry bool false
style style

styles

props description
containerStyles styling for view containing the input and the hint message
inputStyle styling for Input Component
hintStyles styling for hint text in the bottom of the input

customize icons

props description default value
iconFamily one of the icon sets of react-native-vector-icon Feather
iconSuccess icon name for the success icon smile
iconSuccessColor icon color for the success icon #28a745
iconWarning icon name for the warning icon alert-triangle
iconWarningColor icon color for the warning icon #ffc107
iconAlert icon name for the error icon alert-circle
iconAlertColor icon color for the error icon #dc3545
eyeColor icon color for the eye icon #2E2E2E

example:

import TextBox from 'react-native-password-eye';

<TextBox 
	iconFamily={'MaterialCommunityIcons'}
	iconSuccess={'emoticon-happy-outline'}
	iconWarning={'alert-outline'}
	iconAlert={'alert-octagon-outline'}
/>

About

A simple and fully customizable React Native component for TextInputs

Resources

License

Stars

Watchers

Forks

Packages

No packages published