React Country List

country_list is a React Component for entering mobile numbers with code of choosing country.

Live demo

All examples on the demo page

Installing

1npm install --save @koterion/country_list

Examples

Flags image

1.cntr-flag {
2  background-image: url('@koterion/country_list/dist/img/flags.png')
3}

Basic usage

1import CountryList from '@koterion/country_list';
2import '@koterion/country_list/dist/styles.css';
3
4const phone = (<CountryList />);

options

option	type	default	desc
countryAll	array	[]	Array of countries iso
remove	boolean	false	If true remove countries using countryAll
list	boolean	false	If true create list of country using countryAll
flagInInput	boolean	false	If true add flags to current selector
flagInSelect	boolean	false	If true add flags to dropdown
geo	object		Use for checked country by ip
closestForm	string	form	Closest form or selector
hasPhone	boolean	false	Using your custom phone input from inputPhoneName
inputCountryName	string	country	Name for input with country name (auto create type=hidden)
inputPhoneName	string	phone	Name for input with phone number
search	boolean	false	If true create input with name from inputCountryName, live search in country list
select	boolean	false	If true create list like select
required	boolean	false	If true add required for input
countries	json		Countries in json format

countryAll

Use with delete or list

Example:

1<CountryList delete countryAll={['ua', 'us']} />
2<CountryList list countryAll={['ua', 'us']} />

geo

For define country by ip we use service Sypexgeo

You can rewrite method, it option geo by default it's object with this parameters:

1{
2  url: 'https://api.sypexgeo.net/',
3  getIso: response => response.country.iso
4}

url - api for service, getIso - return country iso

Also you can use current with current country in ISO format. Example:

1<CountryList current='ua' />

countries

Format for custom countries

1{
2  "name": "Afghanistan",
3  "iso": "af",
4  "code": "93"
5},
6{
7  "name": "Albania",
8  "iso": "al",
9  "code": "355"
10},