@my_name_is_nero/input-phone v1.0.8

React Native Phone Input

Phone number input field.

React Native Phone Input With Mask

Phone number input field with supporting mask

Installation

npm i --save @my_name_is_nero/input-phone

Basic Usage

import React from 'react';
import {View, StyleSheet} from 'react-native';
import {InputPhone, InputPhoneWithMask} from '@my_name_is_nero/input-phone';

const styles = StyleSheet.create({
  containerStyle: {
    flex:1,
  }
});

export default function App() {
  const [phoneNumber, setPhoneNumber] = React.useState({countryCode: '', phoneNumber: ''});
  const [phoheNumberWithMask, setPhoneNumberWithMask] = React.useState({countryCode: '', phoneNumber: '', phoneWithMask:""})
  
  return (
    <View style={styles.containerStyle}>
      <InputPhone value={phoneNumber} onChangeText={setPhoneNumber} />
      <InputPhone mask="(##)-##-###-##"  value={phoneNumber} onChangeText={setPhoneNumber} />
    </View>
  )
}

Props

By default component support all props from TextInput (multiline always set to false). Also component have additions props like:

Phone number input field

Phone number input field with mask

Search query input field

Country list