react-native-awesome-text-input

A simple lib to share an easy to implement animated custom text input for React native

How to install

With npm: npm i react-native-awesome-text-input

With yarn: yarn add react-native-awesome-text-input

Examples

Simple label input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput label="Simple label" />
  );
}

Password input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput label="Password" secureTextEntry={true} />
  );
}

All round bordered input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput 
      label="Bordered input" 
      customStyles={{ 
        container: { 
          borderWidth: 1, 
          borderColor: 'grey', 
          borderRadius: 10 
        }, 
        title: { 
          backgroundColor: "white" 
        } 
      }} />
  );
}

API

| Prop | Values | Example | | ---- | -------- | ---- | | label | string | Example label | | customStyles | { container?: ReactNative.ViewStyle, title?: ReactNative.TextStyle, inputContainer?: ReactNative.ViewStyle } | { container: { borderRadius: 5, backgroundColor: 'purple' } , title: { color: "white" }, inputContainer: { backgroundColor: 'blue' } } | | ...any ReactNative.TextInput props | ReactNative.TextInput props | secureTextEntry: true // Hide the text input for passwords |

Are pull requests and feature requests welcomed?

For sure! Don't hesitate to open issues with the enhancement tag or open pull requests for bugfixes/enhancements.