react-native-phone-input-component v0.6.0

react-native-phone-input-component

the phone input with flag button

Installation

npm install react-native-phone-input-component

Usage

import { PhoneInput } from "react-native-phone-input-component";

Examples

Documentation

The props are the following:

containerStyle

• Description: this is the styles for the container of the input and button
• Type: StyleProp\

• Default

  ```json 
    { 
      flexDirection: 'row',
      alignItems: 'center',
      height: 50,
    } 
  ```

  inputStyle

• Description: this is the style for the input, you can change the style up to you.

• Type: StyleProp\

  placeholder

• Type: String

  returnKeyType

• Description: When the keyboard pop up, there is button to hide it.

• type: String

  onBlur

• Type: (e: NativeSyntheticEvent) => void

  onFocus

• Type: (e: NativeSyntheticEvent) => void

  onChangeText

• Type: (text: string) => void

  placeholderTextColor

• Type: String

  textAlign

• Description: this is the text align for the input

• Type: 'left' | 'center' | 'right'

  flagSelectorStyle

• Description: the styles for the button, to show the modal to select the country

• Type: StyleProp
• Default:

  ```json 
    {
      height: '100%',
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#efecec',
      width: 50,
    }
  ```

  defaultCountry

• Description: this is the default country that will be displayed, it must be on the two-letters format of the country
• Type: String

• Default: "us"

  errorStyle

• Description: the style for the text that will be displayed when the user input an error

• Type: StyleProp

  modalStyle

• Description: the style for the modal to choose the country

• Type: ViewStyle

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

Thanks

Made with create-react-native-library

Flags provider