react-native-country-code-list

ReactNativeCountryCodeList

Country code list with alphabet navigation

Country code list with alphabet navigation for Android/IOS to use with react-native, based on react-native-alphabetlistview, also using react-native-search-box

Installation

1. npm install react-native-country-code-list --save or yarn add react-native-country-code-list

Demo

Usage

import CountryCodeList from 'react-native-country-code-list'

class CountryCodeListApp extends React.Component {
    render() {
      return (
        <CountryCodeList
	  onClickCell={(cellObject) => console.log(cellObject)}
	  />
      );
    }

Props

All props are optional

Note if you will pass custom data as a list you also must provide renderCell, renderSectionHeader, renderSectionItem functions and search action.

Prop	Default	Type	Description
data	country code list object	object	Custom list data
alphabetListProps	undefined	object	react-native-alphabetlistview props
searchProps	undefined	object	react-native-search-box props
onClickCell	() => {}	func	Callback onClick list item
headerBackground	rgb(245, 245, 245)	any	background for headers and search wrapper
cellHeight	44.5	number	Cell height
sectionHeaderHeight	30	number	Section header height
renderCell	func	func	Custom Cell component
renderSectionItem	func	func	Custom Section Item (Alphabet) component
renderSectionHeader	func	func	Custom Section header component
sectionHeaderStyle	style	any	style section header
sectionHeaderTextStyle	style	any	style section header text
sectionItemTextStyle	style	any	style section item text
cellStyle	style	any	style list item
cellTitleStyle	style	any	style list item title
cellLabelStyle	style	any	style list item right label

Questions or suggestions?

Feel free to open an issue