react-native-password-eye

react-native-password-eye

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'}
/>