Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-telephone-input

Package Overview
Dependencies
Maintainers
1
Versions
85
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-telephone-input - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

.eslintrc
.publish/bundle.js
.publish/common.js
.publish/example.css
.publish/example.js
.publish/flags.png
.publish/index.html

8

example/dist/example.js

@@ -11,7 +11,3 @@ require=(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){

render: function render() {
return React.createElement(
'div',
null,
React.createElement(ReactTelephoneInput, null)
);
return React.createElement('div', null, React.createElement(ReactTelephoneInput, { defaultCountry: 'in' }));
}

@@ -23,2 +19,2 @@ });

},{"react":undefined,"react-telephone-input":undefined}]},{},[1])
//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vZGVfbW9kdWxlcy9yZWFjdC1jb21wb25lbnQtZ3VscC10YXNrcy9ub2RlX21vZHVsZXMvYnJvd3NlcmlmeS9ub2RlX21vZHVsZXMvYnJvd3Nlci1wYWNrL19wcmVsdWRlLmpzIiwiL1VzZXJzL211a2VzaC9Eb2N1bWVudHMvcHJvamVjdHMvcmVhY3QtdGVsZXBob25lLWlucHV0L2V4YW1wbGUvc3JjL2V4YW1wbGUuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7OztBQ0FBLElBQUksS0FBSyxHQUFHLE9BQU8sQ0FBQyxPQUFPLENBQUMsQ0FBQztBQUM3QixJQUFJLG1CQUFtQixHQUFHLE9BQU8sQ0FBQyx1QkFBdUIsQ0FBQyxDQUFDOztBQUUzRCxJQUFJLEdBQUcsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUFDOzs7QUFDeEIsVUFBTSxFQUFDLGtCQUFHO0FBQ04sZUFDSTs7O1lBQ0ksb0JBQUMsbUJBQW1CLE9BQUc7U0FDckIsQ0FDUjtLQUNMO0NBQ0osQ0FBQyxDQUFDOztBQUVILEtBQUssQ0FBQyxNQUFNLENBQUMsb0JBQUMsR0FBRyxPQUFHLEVBQUUsUUFBUSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDIiwiZmlsZSI6ImdlbmVyYXRlZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzQ29udGVudCI6WyIoZnVuY3Rpb24gZSh0LG4scil7ZnVuY3Rpb24gcyhvLHUpe2lmKCFuW29dKXtpZighdFtvXSl7dmFyIGE9dHlwZW9mIHJlcXVpcmU9PVwiZnVuY3Rpb25cIiYmcmVxdWlyZTtpZighdSYmYSlyZXR1cm4gYShvLCEwKTtpZihpKXJldHVybiBpKG8sITApO3ZhciBmPW5ldyBFcnJvcihcIkNhbm5vdCBmaW5kIG1vZHVsZSAnXCIrbytcIidcIik7dGhyb3cgZi5jb2RlPVwiTU9EVUxFX05PVF9GT1VORFwiLGZ9dmFyIGw9bltvXT17ZXhwb3J0czp7fX07dFtvXVswXS5jYWxsKGwuZXhwb3J0cyxmdW5jdGlvbihlKXt2YXIgbj10W29dWzFdW2VdO3JldHVybiBzKG4/bjplKX0sbCxsLmV4cG9ydHMsZSx0LG4scil9cmV0dXJuIG5bb10uZXhwb3J0c312YXIgaT10eXBlb2YgcmVxdWlyZT09XCJmdW5jdGlvblwiJiZyZXF1aXJlO2Zvcih2YXIgbz0wO288ci5sZW5ndGg7bysrKXMocltvXSk7cmV0dXJuIHN9KSIsInZhciBSZWFjdCA9IHJlcXVpcmUoJ3JlYWN0Jyk7XG52YXIgUmVhY3RUZWxlcGhvbmVJbnB1dCA9IHJlcXVpcmUoJ3JlYWN0LXRlbGVwaG9uZS1pbnB1dCcpO1xuXG52YXIgQXBwID0gUmVhY3QuY3JlYXRlQ2xhc3Moe1xuICAgIHJlbmRlciAoKSB7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgICAgIDxSZWFjdFRlbGVwaG9uZUlucHV0IC8+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgKTtcbiAgICB9XG59KTtcblxuUmVhY3QucmVuZGVyKDxBcHAgLz4sIGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdhcHAnKSk7XG4iXX0=
//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vZGVfbW9kdWxlcy9yZWFjdC1jb21wb25lbnQtZ3VscC10YXNrcy9ub2RlX21vZHVsZXMvYnJvd3NlcmlmeS9ub2RlX21vZHVsZXMvYnJvd3Nlci1wYWNrL19wcmVsdWRlLmpzIiwiL1VzZXJzL211a2VzaC9Eb2N1bWVudHMvcHJvamVjdHMvcmVhY3QtdGVsZXBob25lLWlucHV0L2V4YW1wbGUvc3JjL2V4YW1wbGUuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7QUNBQSxZQUFZLENBQUM7O0FBQWIsSUFBSSxLQUFLLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDO0FBQzdCLElBQUksbUJBQW1CLEdBQUcsT0FBTyxDQUFDLHVCQUF1QixDQUFDLENBQUM7O0FBRTNELElBQUksR0FBRyxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQUM7QUFHeEIsZUFBVyxFQUFFLEtBQUs7O0FBRmxCLFVBQU0sRUFBQyxTQUFBLE1BQUEsR0FBRztBQUNOLGVBQ0ksS0FBQSxDQUFBLGFBQUEsQ0FJQSxLQUFLLEVBQ0wsSUFBSSxFQUpBLEtBQUEsQ0FBQSxhQUFBLENBQUMsbUJBQW1CLEVBQUEsRUFBQyxjQUFjLEVBQUMsSUFBSSxFQUFBLENBQUcsQ0FDekMsQ0FDUjtLQUNMO0NBQ0osQ0FBQyxDQUFDOztBQUVILEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBQSxDQUFBLGFBQUEsQ0FBQyxHQUFHLEVBQUEsSUFBQSxDQUFHLEVBQUUsUUFBUSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDIiwiZmlsZSI6ImdlbmVyYXRlZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzQ29udGVudCI6WyIoZnVuY3Rpb24gZSh0LG4scil7ZnVuY3Rpb24gcyhvLHUpe2lmKCFuW29dKXtpZighdFtvXSl7dmFyIGE9dHlwZW9mIHJlcXVpcmU9PVwiZnVuY3Rpb25cIiYmcmVxdWlyZTtpZighdSYmYSlyZXR1cm4gYShvLCEwKTtpZihpKXJldHVybiBpKG8sITApO3ZhciBmPW5ldyBFcnJvcihcIkNhbm5vdCBmaW5kIG1vZHVsZSAnXCIrbytcIidcIik7dGhyb3cgZi5jb2RlPVwiTU9EVUxFX05PVF9GT1VORFwiLGZ9dmFyIGw9bltvXT17ZXhwb3J0czp7fX07dFtvXVswXS5jYWxsKGwuZXhwb3J0cyxmdW5jdGlvbihlKXt2YXIgbj10W29dWzFdW2VdO3JldHVybiBzKG4/bjplKX0sbCxsLmV4cG9ydHMsZSx0LG4scil9cmV0dXJuIG5bb10uZXhwb3J0c312YXIgaT10eXBlb2YgcmVxdWlyZT09XCJmdW5jdGlvblwiJiZyZXF1aXJlO2Zvcih2YXIgbz0wO288ci5sZW5ndGg7bysrKXMocltvXSk7cmV0dXJuIHN9KSIsInZhciBSZWFjdCA9IHJlcXVpcmUoJ3JlYWN0Jyk7XG52YXIgUmVhY3RUZWxlcGhvbmVJbnB1dCA9IHJlcXVpcmUoJ3JlYWN0LXRlbGVwaG9uZS1pbnB1dCcpO1xuXG52YXIgQXBwID0gUmVhY3QuY3JlYXRlQ2xhc3Moe1xuICAgIHJlbmRlciAoKSB7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgICAgIDxSZWFjdFRlbGVwaG9uZUlucHV0IGRlZmF1bHRDb3VudHJ5PSdpbicgLz5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICApO1xuICAgIH1cbn0pO1xuXG5SZWFjdC5yZW5kZXIoPEFwcCAvPiwgZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2FwcCcpKTtcbiJdfQ==

2

example/src/example.js

@@ -8,3 +8,3 @@ var React = require('react');

<div>
<ReactTelephoneInput />
<ReactTelephoneInput defaultCountry='in' />
</div>

@@ -11,0 +11,0 @@ );

32

package.json
{
"name": "react-telephone-input",
"version": "1.2.0",
"version": "1.2.1",
"description": "React component for entering and validating international telephone numbers. Inspired from the awesome jquery plugin for the same - https://github.com/Bluefieldscom/intl-tel-input.",
"main": "lib/index.js",
"scripts": {
"lint": "eslint src",
"build": "gulp clean && NODE_ENV=production gulp build",

@@ -12,5 +13,4 @@ "examples": "gulp dev:server",

"start": "gulp dev",
"test": "echo \"no tests yet\" && exit 0",
"watch": "gulp watch:lib",
"test": "mocha --compilers js:babel/register"
"test": "mochify --watch",
"watch": "gulp watch:lib"
},

@@ -29,4 +29,4 @@ "repository": {

"transform": [
"reactify",
"node-lessify"
"babelify",
"lessify"
]

@@ -41,16 +41,10 @@ },

"devDependencies": {
"babel": "^5.5.8",
"browserify": "^6.1.0",
"babel-eslint": "^3.1.17",
"babelify": "^6.1.2",
"chai": "^3.0.0",
"eslint": "^0.23.0",
"gulp": "^3.9.0",
"lodash": "^3.9.3",
"node-lessify": "0.0.6",
"react": "^0.13.3",
"react-component-gulp-tasks": "^0.7.0",
"reactify": "^0.16.0",
"st": "^0.5.2",
"watchify": "^3.2.2",
"jsdom": "^3.1.2",
"mocha": "^2.2.5",
"mocha-jsdom": "^0.4.0",
"chai": "^3.0.0"
"lessify": "^1.0.1",
"mochify": "^2.9.0",
"react-component-gulp-tasks": "^0.7.0"
},

@@ -57,0 +51,0 @@ "dependencies": {

5

README.md

@@ -6,5 +6,6 @@ Reactjs Component for International Telephone Input

This one is written as a [reactjs](http://facebook.github.io/react/) component.
Live Demo here - [http://unstack.in/react-telephone-input/](http://unstack.in/react-telephone-input/)
![How it looks](/images/react-telephone-number-screenshot.png?raw=true "How it looks")

@@ -21,3 +22,3 @@

var ReactTelInput = require('react-telephone-input');
React.renderComponent(<FlagBearer defaultCountry="in"/>, document.getElementById('my-container'));
React.render(<ReactTelInput defaultCountry="in"/>, document.getElementById('my-container'));
```

@@ -24,0 +25,0 @@

1490

src/country_data.js

@@ -0,1 +1,3 @@

'use strict';
// So each country array has the following information:

@@ -12,1223 +14,1223 @@ // [

[
"Afghanistan (‫افغانستان‬‎)",
"af",
"93"
'Afghanistan (‫افغانستان‬‎)',
'af',
'93'
],
[
"Albania (Shqipëri)",
"al",
"355"
'Albania (Shqipëri)',
'al',
'355'
],
[
"Algeria (‫الجزائر‬‎)",
"dz",
"213"
'Algeria (‫الجزائر‬‎)',
'dz',
'213'
],
[
"American Samoa",
"as",
"1684"
'American Samoa',
'as',
'1684'
],
[
"Andorra",
"ad",
"376"
'Andorra',
'ad',
'376'
],
[
"Angola",
"ao",
"244"
'Angola',
'ao',
'244'
],
[
"Anguilla",
"ai",
"1264"
'Anguilla',
'ai',
'1264'
],
[
"Antigua and Barbuda",
"ag",
"1268"
'Antigua and Barbuda',
'ag',
'1268'
],
[
"Argentina",
"ar",
"54"
'Argentina',
'ar',
'54'
],
[
"Armenia (Հայաստան)",
"am",
"374"
'Armenia (Հայաստան)',
'am',
'374'
],
[
"Aruba",
"aw",
"297"
'Aruba',
'aw',
'297'
],
[
"Australia",
"au",
"61",
"+.. ... ... ..."
'Australia',
'au',
'61',
'+.. ... ... ...'
],
[
"Austria (Österreich)",
"at",
"43"
'Austria (Österreich)',
'at',
'43'
],
[
"Azerbaijan (Azərbaycan)",
"az",
"994"
'Azerbaijan (Azərbaycan)',
'az',
'994'
],
[
"Bahamas",
"bs",
"1242"
'Bahamas',
'bs',
'1242'
],
[
"Bahrain (‫البحرين‬‎)",
"bh",
"973"
'Bahrain (‫البحرين‬‎)',
'bh',
'973'
],
[
"Bangladesh (বাংলাদেশ)",
"bd",
"880"
'Bangladesh (বাংলাদেশ)',
'bd',
'880'
],
[
"Barbados",
"bb",
"1246"
'Barbados',
'bb',
'1246'
],
[
"Belarus (Беларусь)",
"by",
"375"
'Belarus (Беларусь)',
'by',
'375'
],
[
"Belgium (België)",
"be",
"32",
"+.. ... .. .. .."
'Belgium (België)',
'be',
'32',
'+.. ... .. .. ..'
],
[
"Belize",
"bz",
"501"
'Belize',
'bz',
'501'
],
[
"Benin (Bénin)",
"bj",
"229"
'Benin (Bénin)',
'bj',
'229'
],
[
"Bermuda",
"bm",
"1441"
'Bermuda',
'bm',
'1441'
],
[
"Bhutan (འབྲུག)",
"bt",
"975"
'Bhutan (འབྲུག)',
'bt',
'975'
],
[
"Bolivia",
"bo",
"591"
'Bolivia',
'bo',
'591'
],
[
"Bosnia and Herzegovina (Босна и Херцеговина)",
"ba",
"387"
'Bosnia and Herzegovina (Босна и Херцеговина)',
'ba',
'387'
],
[
"Botswana",
"bw",
"267"
'Botswana',
'bw',
'267'
],
[
"Brazil (Brasil)",
"br",
"55"
'Brazil (Brasil)',
'br',
'55'
],
[
"British Indian Ocean Territory",
"io",
"246"
'British Indian Ocean Territory',
'io',
'246'
],
[
"British Virgin Islands",
"vg",
"1284"
'British Virgin Islands',
'vg',
'1284'
],
[
"Brunei",
"bn",
"673"
'Brunei',
'bn',
'673'
],
[
"Bulgaria (България)",
"bg",
"359"
'Bulgaria (България)',
'bg',
'359'
],
[
"Burkina Faso",
"bf",
"226"
'Burkina Faso',
'bf',
'226'
],
[
"Burundi (Uburundi)",
"bi",
"257"
'Burundi (Uburundi)',
'bi',
'257'
],
[
"Cambodia (កម្ពុជា)",
"kh",
"855"
'Cambodia (កម្ពុជា)',
'kh',
'855'
],
[
"Cameroon (Cameroun)",
"cm",
"237"
'Cameroon (Cameroun)',
'cm',
'237'
],
[
"Canada",
"ca",
"1",
"+. (...) ...-....",
'Canada',
'ca',
'1',
'+. (...) ...-....',
1,
["204", "236", "249", "250", "289", "306", "343", "365", "387", "403", "416", "418", "431", "437", "438", "450", "506", "514", "519", "548", "579", "581", "587", "604", "613", "639", "647", "672", "705", "709", "742", "778", "780", "782", "807", "819", "825", "867", "873", "902", "905"]
['204', '236', '249', '250', '289', '306', '343', '365', '387', '403', '416', '418', '431', '437', '438', '450', '506', '514', '519', '548', '579', '581', '587', '604', '613', '639', '647', '672', '705', '709', '742', '778', '780', '782', '807', '819', '825', '867', '873', '902', '905']
],
[
"Cape Verde (Kabu Verdi)",
"cv",
"238"
'Cape Verde (Kabu Verdi)',
'cv',
'238'
],
[
"Caribbean Netherlands",
"bq",
"599",
"",
'Caribbean Netherlands',
'bq',
'599',
'',
1
],
[
"Cayman Islands",
"ky",
"1345"
'Cayman Islands',
'ky',
'1345'
],
[
"Central African Republic (République centrafricaine)",
"cf",
"236"
'Central African Republic (République centrafricaine)',
'cf',
'236'
],
[
"Chad (Tchad)",
"td",
"235"
'Chad (Tchad)',
'td',
'235'
],
[
"Chile",
"cl",
"56"
'Chile',
'cl',
'56'
],
[
"China (中国)",
"cn",
"86",
"+.. ..-........"
'China (中国)',
'cn',
'86',
'+.. ..-........'
],
[
"Colombia",
"co",
"57"
'Colombia',
'co',
'57'
],
[
"Comoros (‫جزر القمر‬‎)",
"km",
"269"
'Comoros (‫جزر القمر‬‎)',
'km',
'269'
],
[
"Congo (DRC) (Jamhuri ya Kidemokrasia ya Kongo)",
"cd",
"243"
'Congo (DRC) (Jamhuri ya Kidemokrasia ya Kongo)',
'cd',
'243'
],
[
"Congo (Republic) (Congo-Brazzaville)",
"cg",
"242"
'Congo (Republic) (Congo-Brazzaville)',
'cg',
'242'
],
[
"Cook Islands",
"ck",
"682"
'Cook Islands',
'ck',
'682'
],
[
"Costa Rica",
"cr",
"506",
"+... ....-...."
'Costa Rica',
'cr',
'506',
'+... ....-....'
],
[
"Côte d’Ivoire",
"ci",
"225"
'Côte d’Ivoire',
'ci',
'225'
],
[
"Croatia (Hrvatska)",
"hr",
"385"
'Croatia (Hrvatska)',
'hr',
'385'
],
[
"Cuba",
"cu",
"53"
'Cuba',
'cu',
'53'
],
[
"Curaçao",
"cw",
"599",
"",
'Curaçao',
'cw',
'599',
'',
0
],
[
"Cyprus (Κύπρος)",
"cy",
"357"
'Cyprus (Κύπρος)',
'cy',
'357'
],
[
"Czech Republic (Česká republika)",
"cz",
"420"
'Czech Republic (Česká republika)',
'cz',
'420'
],
[
"Denmark (Danmark)",
"dk",
"45",
"+.. .. .. .. .."
'Denmark (Danmark)',
'dk',
'45',
'+.. .. .. .. ..'
],
[
"Djibouti",
"dj",
"253"
'Djibouti',
'dj',
'253'
],
[
"Dominica",
"dm",
"1767"
'Dominica',
'dm',
'1767'
],
[
"Dominican Republic (República Dominicana)",
"do",
"1",
"",
'Dominican Republic (República Dominicana)',
'do',
'1',
'',
2,
["809", "829", "849"]
['809', '829', '849']
],
[
"Ecuador",
"ec",
"593"
'Ecuador',
'ec',
'593'
],
[
"Egypt (‫مصر‬‎)",
"eg",
"20"
'Egypt (‫مصر‬‎)',
'eg',
'20'
],
[
"El Salvador",
"sv",
"503",
"+... ....-...."
'El Salvador',
'sv',
'503',
'+... ....-....'
],
[
"Equatorial Guinea (Guinea Ecuatorial)",
"gq",
"240"
'Equatorial Guinea (Guinea Ecuatorial)',
'gq',
'240'
],
[
"Eritrea",
"er",
"291"
'Eritrea',
'er',
'291'
],
[
"Estonia (Eesti)",
"ee",
"372"
'Estonia (Eesti)',
'ee',
'372'
],
[
"Ethiopia",
"et",
"251"
'Ethiopia',
'et',
'251'
],
[
"Falkland Islands (Islas Malvinas)",
"fk",
"500"
'Falkland Islands (Islas Malvinas)',
'fk',
'500'
],
[
"Faroe Islands (Føroyar)",
"fo",
"298"
'Faroe Islands (Føroyar)',
'fo',
'298'
],
[
"Fiji",
"fj",
"679"
'Fiji',
'fj',
'679'
],
[
"Finland (Suomi)",
"fi",
"358",
"+... .. ... .. .."
'Finland (Suomi)',
'fi',
'358',
'+... .. ... .. ..'
],
[
"France",
"fr",
"33",
"+.. . .. .. .. .."
'France',
'fr',
'33',
'+.. . .. .. .. ..'
],
[
"French Guiana (Guyane française)",
"gf",
"594"
'French Guiana (Guyane française)',
'gf',
'594'
],
[
"French Polynesia (Polynésie française)",
"pf",
"689"
'French Polynesia (Polynésie française)',
'pf',
'689'
],
[
"Gabon",
"ga",
"241"
'Gabon',
'ga',
'241'
],
[
"Gambia",
"gm",
"220"
'Gambia',
'gm',
'220'
],
[
"Georgia (საქართველო)",
"ge",
"995"
'Georgia (საქართველო)',
'ge',
'995'
],
[
"Germany (Deutschland)",
"de",
"49",
"+.. ... ......."
'Germany (Deutschland)',
'de',
'49',
'+.. ... .......'
],
[
"Ghana (Gaana)",
"gh",
"233"
'Ghana (Gaana)',
'gh',
'233'
],
[
"Gibraltar",
"gi",
"350"
'Gibraltar',
'gi',
'350'
],
[
"Greece (Ελλάδα)",
"gr",
"30"
'Greece (Ελλάδα)',
'gr',
'30'
],
[
"Greenland (Kalaallit Nunaat)",
"gl",
"299"
'Greenland (Kalaallit Nunaat)',
'gl',
'299'
],
[
"Grenada",
"gd",
"1473"
'Grenada',
'gd',
'1473'
],
[
"Guadeloupe",
"gp",
"590",
"",
'Guadeloupe',
'gp',
'590',
'',
0
],
[
"Guam",
"gu",
"1671"
'Guam',
'gu',
'1671'
],
[
"Guatemala",
"gt",
"502",
"+... ....-...."
'Guatemala',
'gt',
'502',
'+... ....-....'
],
[
"Guinea (Guinée)",
"gn",
"224"
'Guinea (Guinée)',
'gn',
'224'
],
[
"Guinea-Bissau (Guiné Bissau)",
"gw",
"245"
'Guinea-Bissau (Guiné Bissau)',
'gw',
'245'
],
[
"Guyana",
"gy",
"592"
'Guyana',
'gy',
'592'
],
[
"Haiti",
"ht",
"509",
"+... ....-...."
'Haiti',
'ht',
'509',
'+... ....-....'
],
[
"Honduras",
"hn",
"504"
'Honduras',
'hn',
'504'
],
[
"Hong Kong (香港)",
"hk",
"852",
"+... .... ...."
'Hong Kong (香港)',
'hk',
'852',
'+... .... ....'
],
[
"Hungary (Magyarország)",
"hu",
"36"
'Hungary (Magyarország)',
'hu',
'36'
],
[
"Iceland (Ísland)",
"is",
"354",
"+... ... ...."
'Iceland (Ísland)',
'is',
'354',
'+... ... ....'
],
[
"India (भारत)",
"in",
"91",
"+.. .....-....."
'India (भारत)',
'in',
'91',
'+.. .....-.....'
],
[
"Indonesia",
"id",
"62"
'Indonesia',
'id',
'62'
],
[
"Iran (‫ایران‬‎)",
"ir",
"98"
'Iran (‫ایران‬‎)',
'ir',
'98'
],
[
"Iraq (‫العراق‬‎)",
"iq",
"964"
'Iraq (‫العراق‬‎)',
'iq',
'964'
],
[
"Ireland",
"ie",
"353",
"+... .. ......."
'Ireland',
'ie',
'353',
'+... .. .......'
],
[
"Israel (‫ישראל‬‎)",
"il",
"972"
'Israel (‫ישראל‬‎)',
'il',
'972'
],
[
"Italy (Italia)",
"it",
"39",
"+.. ... ......",
'Italy (Italia)',
'it',
'39',
'+.. ... ......',
0
],
[
"Jamaica",
"jm",
"1876"
'Jamaica',
'jm',
'1876'
],
[
"Japan (日本)",
"jp",
"81",
"+.. ... .. ...."
'Japan (日本)',
'jp',
'81',
'+.. ... .. ....'
],
[
"Jordan (‫الأردن‬‎)",
"jo",
"962"
'Jordan (‫الأردن‬‎)',
'jo',
'962'
],
[
"Kazakhstan (Казахстан)",
"kz",
"7",
"+. ... ...-..-..",
'Kazakhstan (Казахстан)',
'kz',
'7',
'+. ... ...-..-..',
1
],
[
"Kenya",
"ke",
"254"
'Kenya',
'ke',
'254'
],
[
"Kiribati",
"ki",
"686"
'Kiribati',
'ki',
'686'
],
[
"Kuwait (‫الكويت‬‎)",
"kw",
"965"
'Kuwait (‫الكويت‬‎)',
'kw',
'965'
],
[
"Kyrgyzstan (Кыргызстан)",
"kg",
"996"
'Kyrgyzstan (Кыргызстан)',
'kg',
'996'
],
[
"Laos (ລາວ)",
"la",
"856"
'Laos (ລາວ)',
'la',
'856'
],
[
"Latvia (Latvija)",
"lv",
"371"
'Latvia (Latvija)',
'lv',
'371'
],
[
"Lebanon (‫لبنان‬‎)",
"lb",
"961"
'Lebanon (‫لبنان‬‎)',
'lb',
'961'
],
[
"Lesotho",
"ls",
"266"
'Lesotho',
'ls',
'266'
],
[
"Liberia",
"lr",
"231"
'Liberia',
'lr',
'231'
],
[
"Libya (‫ليبيا‬‎)",
"ly",
"218"
'Libya (‫ليبيا‬‎)',
'ly',
'218'
],
[
"Liechtenstein",
"li",
"423"
'Liechtenstein',
'li',
'423'
],
[
"Lithuania (Lietuva)",
"lt",
"370"
'Lithuania (Lietuva)',
'lt',
'370'
],
[
"Luxembourg",
"lu",
"352"
'Luxembourg',
'lu',
'352'
],
[
"Macau (澳門)",
"mo",
"853"
'Macau (澳門)',
'mo',
'853'
],
[
"Macedonia (FYROM) (Македонија)",
"mk",
"389"
'Macedonia (FYROM) (Македонија)',
'mk',
'389'
],
[
"Madagascar (Madagasikara)",
"mg",
"261"
'Madagascar (Madagasikara)',
'mg',
'261'
],
[
"Malawi",
"mw",
"265"
'Malawi',
'mw',
'265'
],
[
"Malaysia",
"my",
"60",
"+.. ..-....-...."
'Malaysia',
'my',
'60',
'+.. ..-....-....'
],
[
"Maldives",
"mv",
"960"
'Maldives',
'mv',
'960'
],
[
"Mali",
"ml",
"223"
'Mali',
'ml',
'223'
],
[
"Malta",
"mt",
"356"
'Malta',
'mt',
'356'
],
[
"Marshall Islands",
"mh",
"692"
'Marshall Islands',
'mh',
'692'
],
[
"Martinique",
"mq",
"596"
'Martinique',
'mq',
'596'
],
[
"Mauritania (‫موريتانيا‬‎)",
"mr",
"222"
'Mauritania (‫موريتانيا‬‎)',
'mr',
'222'
],
[
"Mauritius (Moris)",
"mu",
"230"
'Mauritius (Moris)',
'mu',
'230'
],
[
"Mexico (México)",
"mx",
"52"
'Mexico (México)',
'mx',
'52'
],
[
"Micronesia",
"fm",
"691"
'Micronesia',
'fm',
'691'
],
[
"Moldova (Republica Moldova)",
"md",
"373"
'Moldova (Republica Moldova)',
'md',
'373'
],
[
"Monaco",
"mc",
"377"
'Monaco',
'mc',
'377'
],
[
"Mongolia (Монгол)",
"mn",
"976"
'Mongolia (Монгол)',
'mn',
'976'
],
[
"Montenegro (Crna Gora)",
"me",
"382"
'Montenegro (Crna Gora)',
'me',
'382'
],
[
"Montserrat",
"ms",
"1664"
'Montserrat',
'ms',
'1664'
],
[
"Morocco (‫المغرب‬‎)",
"ma",
"212"
'Morocco (‫المغرب‬‎)',
'ma',
'212'
],
[
"Mozambique (Moçambique)",
"mz",
"258"
'Mozambique (Moçambique)',
'mz',
'258'
],
[
"Myanmar (Burma) (မြန်မာ)",
"mm",
"95"
'Myanmar (Burma) (မြန်မာ)',
'mm',
'95'
],
[
"Namibia (Namibië)",
"na",
"264"
'Namibia (Namibië)',
'na',
'264'
],
[
"Nauru",
"nr",
"674"
'Nauru',
'nr',
'674'
],
[
"Nepal (नेपाल)",
"np",
"977"
'Nepal (नेपाल)',
'np',
'977'
],
[
"Netherlands (Nederland)",
"nl",
"31",
"+.. .. ........"
'Netherlands (Nederland)',
'nl',
'31',
'+.. .. ........'
],
[
"New Caledonia (Nouvelle-Calédonie)",
"nc",
"687"
'New Caledonia (Nouvelle-Calédonie)',
'nc',
'687'
],
[
"New Zealand",
"nz",
"64",
"+.. ...-...-...."
'New Zealand',
'nz',
'64',
'+.. ...-...-....'
],
[
"Nicaragua",
"ni",
"505"
'Nicaragua',
'ni',
'505'
],
[
"Niger (Nijar)",
"ne",
"227"
'Niger (Nijar)',
'ne',
'227'
],
[
"Nigeria",
"ng",
"234"
'Nigeria',
'ng',
'234'
],
[
"Niue",
"nu",
"683"
'Niue',
'nu',
'683'
],
[
"Norfolk Island",
"nf",
"672"
'Norfolk Island',
'nf',
'672'
],
[
"North Korea (조선 민주주의 인민 공화국)",
"kp",
"850"
'North Korea (조선 민주주의 인민 공화국)',
'kp',
'850'
],
[
"Northern Mariana Islands",
"mp",
"1670"
'Northern Mariana Islands',
'mp',
'1670'
],
[
"Norway (Norge)",
"no",
"47",
"+.. ... .. ..."
'Norway (Norge)',
'no',
'47',
'+.. ... .. ...'
],
[
"Oman (‫عُمان‬‎)",
"om",
"968"
'Oman (‫عُمان‬‎)',
'om',
'968'
],
[
"Pakistan (‫پاکستان‬‎)",
"pk",
"92",
"+.. ...-......."
'Pakistan (‫پاکستان‬‎)',
'pk',
'92',
'+.. ...-.......'
],
[
"Palau",
"pw",
"680"
'Palau',
'pw',
'680'
],
[
"Palestine (‫فلسطين‬‎)",
"ps",
"970"
'Palestine (‫فلسطين‬‎)',
'ps',
'970'
],
[
"Panama (Panamá)",
"pa",
"507"
'Panama (Panamá)',
'pa',
'507'
],
[
"Papua New Guinea",
"pg",
"675"
'Papua New Guinea',
'pg',
'675'
],
[
"Paraguay",
"py",
"595"
'Paraguay',
'py',
'595'
],
[
"Peru (Perú)",
"pe",
"51"
'Peru (Perú)',
'pe',
'51'
],
[
"Philippines",
"ph",
"63",
"+.. ... ...."
'Philippines',
'ph',
'63',
'+.. ... ....'
],
[
"Poland (Polska)",
"pl",
"48",
"+.. ...-...-..."
'Poland (Polska)',
'pl',
'48',
'+.. ...-...-...'
],
[
"Portugal",
"pt",
"351"
'Portugal',
'pt',
'351'
],
[
"Puerto Rico",
"pr",
"1",
"",
'Puerto Rico',
'pr',
'1',
'',
3,
["787", "939"]
['787', '939']
],
[
"Qatar (‫قطر‬‎)",
"qa",
"974"
'Qatar (‫قطر‬‎)',
'qa',
'974'
],
[
"Réunion (La Réunion)",
"re",
"262"
'Réunion (La Réunion)',
're',
'262'
],
[
"Romania (România)",
"ro",
"40"
'Romania (România)',
'ro',
'40'
],
[
"Russia (Россия)",
"ru",
"7",
"+. ... ...-..-..",
'Russia (Россия)',
'ru',
'7',
'+. ... ...-..-..',
0
],
[
"Rwanda",
"rw",
"250"
'Rwanda',
'rw',
'250'
],
[
"Saint Barthélemy (Saint-Barthélemy)",
"bl",
"590",
"",
'Saint Barthélemy (Saint-Barthélemy)',
'bl',
'590',
'',
1
],
[
"Saint Helena",
"sh",
"290"
'Saint Helena',
'sh',
'290'
],
[
"Saint Kitts and Nevis",
"kn",
"1869"
'Saint Kitts and Nevis',
'kn',
'1869'
],
[
"Saint Lucia",
"lc",
"1758"
'Saint Lucia',
'lc',
'1758'
],
[
"Saint Martin (Saint-Martin (partie française))",
"mf",
"590",
"",
'Saint Martin (Saint-Martin (partie française))',
'mf',
'590',
'',
2
],
[
"Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)",
"pm",
"508"
'Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)',
'pm',
'508'
],
[
"Saint Vincent and the Grenadines",
"vc",
"1784"
'Saint Vincent and the Grenadines',
'vc',
'1784'
],
[
"Samoa",
"ws",
"685"
'Samoa',
'ws',
'685'
],
[
"San Marino",
"sm",
"378"
'San Marino',
'sm',
'378'
],
[
"São Tomé and Príncipe (São Tomé e Príncipe)",
"st",
"239"
'São Tomé and Príncipe (São Tomé e Príncipe)',
'st',
'239'
],
[
"Saudi Arabia (‫المملكة العربية السعودية‬‎)",
"sa",
"966"
'Saudi Arabia (‫المملكة العربية السعودية‬‎)',
'sa',
'966'
],
[
"Senegal (Sénégal)",
"sn",
"221"
'Senegal (Sénégal)',
'sn',
'221'
],
[
"Serbia (Србија)",
"rs",
"381"
'Serbia (Србија)',
'rs',
'381'
],
[
"Seychelles",
"sc",
"248"
'Seychelles',
'sc',
'248'
],
[
"Sierra Leone",
"sl",
"232"
'Sierra Leone',
'sl',
'232'
],
[
"Singapore",
"sg",
"65",
"+.. ....-...."
'Singapore',
'sg',
'65',
'+.. ....-....'
],
[
"Sint Maarten",
"sx",
"1721"
'Sint Maarten',
'sx',
'1721'
],
[
"Slovakia (Slovensko)",
"sk",
"421"
'Slovakia (Slovensko)',
'sk',
'421'
],
[
"Slovenia (Slovenija)",
"si",
"386"
'Slovenia (Slovenija)',
'si',
'386'
],
[
"Solomon Islands",
"sb",
"677"
'Solomon Islands',
'sb',
'677'
],
[
"Somalia (Soomaaliya)",
"so",
"252"
'Somalia (Soomaaliya)',
'so',
'252'
],
[
"South Africa",
"za",
"27"
'South Africa',
'za',
'27'
],
[
"South Korea (대한민국)",
"kr",
"82"
'South Korea (대한민국)',
'kr',
'82'
],
[
"South Sudan (‫جنوب السودان‬‎)",
"ss",
"211"
'South Sudan (‫جنوب السودان‬‎)',
'ss',
'211'
],
[
"Spain (España)",
"es",
"34",
"+.. ... ... ..."
'Spain (España)',
'es',
'34',
'+.. ... ... ...'
],
[
"Sri Lanka (ශ්‍රී ලංකාව)",
"lk",
"94"
'Sri Lanka (ශ්‍රී ලංකාව)',
'lk',
'94'
],
[
"Sudan (‫السودان‬‎)",
"sd",
"249"
'Sudan (‫السودان‬‎)',
'sd',
'249'
],
[
"Suriname",
"sr",
"597"
'Suriname',
'sr',
'597'
],
[
"Swaziland",
"sz",
"268"
'Swaziland',
'sz',
'268'
],
[
"Sweden (Sverige)",
"se",
"46",
"+.. .. ... .. .."
'Sweden (Sverige)',
'se',
'46',
'+.. .. ... .. ..'
],
[
"Switzerland (Schweiz)",
"ch",
"41",
"+.. .. ... .. .."
'Switzerland (Schweiz)',
'ch',
'41',
'+.. .. ... .. ..'
],
[
"Syria (‫سوريا‬‎)",
"sy",
"963"
'Syria (‫سوريا‬‎)',
'sy',
'963'
],
[
"Taiwan (台灣)",
"tw",
"886"
'Taiwan (台灣)',
'tw',
'886'
],
[
"Tajikistan",
"tj",
"992"
'Tajikistan',
'tj',
'992'
],
[
"Tanzania",
"tz",
"255"
'Tanzania',
'tz',
'255'
],
[
"Thailand (ไทย)",
"th",
"66"
'Thailand (ไทย)',
'th',
'66'
],
[
"Timor-Leste",
"tl",
"670"
'Timor-Leste',
'tl',
'670'
],
[
"Togo",
"tg",
"228"
'Togo',
'tg',
'228'
],
[
"Tokelau",
"tk",
"690"
'Tokelau',
'tk',
'690'
],
[
"Tonga",
"to",
"676"
'Tonga',
'to',
'676'
],
[
"Trinidad and Tobago",
"tt",
"1868"
'Trinidad and Tobago',
'tt',
'1868'
],
[
"Tunisia (‫تونس‬‎)",
"tn",
"216"
'Tunisia (‫تونس‬‎)',
'tn',
'216'
],
[
"Turkey (Türkiye)",
"tr",
"90",
"+.. ... ... .. .."
'Turkey (Türkiye)',
'tr',
'90',
'+.. ... ... .. ..'
],
[
"Turkmenistan",
"tm",
"993"
'Turkmenistan',
'tm',
'993'
],
[
"Turks and Caicos Islands",
"tc",
"1649"
'Turks and Caicos Islands',
'tc',
'1649'
],
[
"Tuvalu",
"tv",
"688"
'Tuvalu',
'tv',
'688'
],
[
"U.S. Virgin Islands",
"vi",
"1340"
'U.S. Virgin Islands',
'vi',
'1340'
],
[
"Uganda",
"ug",
"256"
'Uganda',
'ug',
'256'
],
[
"Ukraine (Україна)",
"ua",
"380"
'Ukraine (Україна)',
'ua',
'380'
],
[
"United Arab Emirates (‫الإمارات العربية المتحدة‬‎)",
"ae",
"971"
'United Arab Emirates (‫الإمارات العربية المتحدة‬‎)',
'ae',
'971'
],
[
"United Kingdom",
"gb",
"44",
"+.. .... ......"
'United Kingdom',
'gb',
'44',
'+.. .... ......'
],
[
"United States",
"us",
"1",
"+. (...) ...-....",
'United States',
'us',
'1',
'+. (...) ...-....',
0
],
[
"Uruguay",
"uy",
"598"
'Uruguay',
'uy',
'598'
],
[
"Uzbekistan (Oʻzbekiston)",
"uz",
"998"
'Uzbekistan (Oʻzbekiston)',
'uz',
'998'
],
[
"Vanuatu",
"vu",
"678"
'Vanuatu',
'vu',
'678'
],
[
"Vatican City (Città del Vaticano)",
"va",
"39",
"+.. .. .... ....",
'Vatican City (Città del Vaticano)',
'va',
'39',
'+.. .. .... ....',
1
],
[
"Venezuela",
"ve",
"58"
'Venezuela',
've',
'58'
],
[
"Vietnam (Việt Nam)",
"vn",
"84"
'Vietnam (Việt Nam)',
'vn',
'84'
],
[
"Wallis and Futuna",
"wf",
"681"
'Wallis and Futuna',
'wf',
'681'
],
[
"Yemen (‫اليمن‬‎)",
"ye",
"967"
'Yemen (‫اليمن‬‎)',
'ye',
'967'
],
[
"Zambia",
"zm",
"260"
'Zambia',
'zm',
'260'
],
[
"Zimbabwe",
"zw",
"263"
'Zimbabwe',
'zw',
'263'
]

@@ -1235,0 +1237,0 @@ ];

268

src/index.js

@@ -1,4 +0,2 @@

/**
* @jsx React.DOM
*/
'use strict';

@@ -9,4 +7,4 @@ // TODO - fix the onlyContries props. Currently expects that as an array of country object, but users should be able to send in array of country isos

var findWhere = require('lodash/collection/findWhere');
var reduce = require('lodash/collection/reduce');
var map = require('lodash/collection/map');
var reduce = require('lodash/collection/reduce');
var map = require('lodash/collection/map');
var filter = require('lodash/collection/filter');

@@ -31,3 +29,3 @@ var any = require('lodash/collection/any');

if (typeof document !== "undefined") {
if (typeof document !== 'undefined') {
var isModernBrowser = Boolean(document.createElement('input').setSelectionRange);

@@ -60,15 +58,6 @@ } else {

mixins: [onClickOutside],
getInitialState: function() {
var selectedCountryGuess, selectedCountryGuessIndex, inputNumber = this.props.value || '';
if(trim(inputNumber) !== '') {
selectedCountryGuess = this.guessSelectedCountry(inputNumber.replace(/\D/g, ''));
if(!selectedCountryGuess || !selectedCountryGuess.name) {
selectedCountryGuess = findWhere(allCountries, {iso2: this.props.defaultCountry}) || this.props.onlyCountries[0];
}
} else {
selectedCountryGuess = findWhere(allCountries, {iso2: this.props.defaultCountry}) || this.props.onlyCountries[0];
}
selectedCountryGuessIndex = findIndex(allCountries, selectedCountryGuess);
getInitialState() {
var inputNumber = this.props.value || '';
var selectedCountryGuess = this.guessSelectedCountry(inputNumber.replace(/\D/g, ''));
var selectedCountryGuessIndex = findIndex(allCountries, selectedCountryGuess);
var formattedNumber = this.formatNumber(inputNumber.replace(/\D/g, ''), selectedCountryGuess ? selectedCountryGuess.format : null);

@@ -86,9 +75,8 @@ var preferredCountries = [];

selectedCountry: selectedCountryGuess,
// highlightCountry: selectedCountryGuess,
highlightCountryIndex: selectedCountryGuessIndex,
formattedNumber: formattedNumber,
showDropDown: false,
queryString: "",
queryString: '',
freezeSelection: false,
debouncedQueryStingSearcher: debounce(this.searchCountry, 300)
debouncedQueryStingSearcher: debounce(this.searchCountry, 100)
};

@@ -105,3 +93,3 @@ },

},
getDefaultProps: function() {
getDefaultProps() {
return {

@@ -116,9 +104,9 @@ value: '',

},
getNumber: function() {
getNumber() {
return this.state.formattedNumber !== '+' ? this.state.formattedNumber : '';
},
getValue: function() {
getValue() {
return this.getNumber();
},
componentDidMount: function() {
componentDidMount() {
document.addEventListener('keydown', this.handleKeydown);

@@ -128,13 +116,19 @@

this.props.onChange && this.props.onChange(this.state.formattedNumber);
if(typeof this.props.onChange === 'function') {
this.props.onChange(this.state.formattedNumber);
}
},
componentWillUnmount: function() {
componentWillUnmount() {
document.removeEventListener('keydown', this.handleKeydown);
},
scrollTo: function(country, middle) {
if(!country) return;
scrollTo(country, middle) {
if(!country) {
return;
}
var container = this.refs.flagDropdownList.getDOMNode();
if(!container) return;
if(!container) {
return;
}

@@ -170,3 +164,3 @@ var containerHeight = container.offsetHeight;

},
formatNumber: function(text, pattern) {
formatNumber(text, pattern) {
if(!text || text.length === 0) {

@@ -179,8 +173,8 @@ return '+';

if((text && text.length < 2) || !pattern || !this.props.autoFormat) {
return '+' + text;
return `+${text}`;
}
var formattedObject = reduce(pattern, function(formattedObject, character, key) {
if(formattedObject.remainingText.length === 0) {
return formattedObject;
var formattedObject = reduce(pattern, function(acc, character) {
if(acc.remainingText.length === 0) {
return acc;
}

@@ -190,17 +184,17 @@

return {
formattedText: formattedObject.formattedText + character,
remainingText: formattedObject.remainingText
}
formattedText: acc.formattedText + character,
remainingText: acc.remainingText
};
}
return {
formattedText: formattedObject.formattedText + first(formattedObject.remainingText),
remainingText: rest(formattedObject.remainingText)
}
}, {formattedText: "", remainingText: text.split('')});
return formattedObject.formattedText + formattedObject.remainingText.join("");
formattedText: acc.formattedText + first(acc.remainingText),
remainingText: rest(acc.remainingText)
};
}, {formattedText: '', remainingText: text.split('')});
return formattedObject.formattedText + formattedObject.remainingText.join('');
},
// put the cursor to the end of the input (usually after a focus event)
_cursorToEnd: function() {
_cursorToEnd() {
var input = this.refs.numberInput.getDOMNode();

@@ -215,21 +209,31 @@ input.focus();

guessSelectedCountry: memoize(function(inputNumber) {
return reduce(this.props.onlyCountries, function(selectedCountry, country) {
if(startsWith(inputNumber, country.dialCode)) {
if(country.dialCode.length > selectedCountry.dialCode.length) {
return country;
}
if(country.dialCode.length === selectedCountry.dialCode.length && country.priority < selectedCountry.priority) {
return country;
}
}
var secondBestGuess = findWhere(allCountries, {iso2: this.props.defaultCountry}) || this.props.onlyCountries[0];
if(trim(inputNumber) !== '') {
var bestGuess = reduce(this.props.onlyCountries, function(selectedCountry, country) {
if(startsWith(inputNumber, country.dialCode)) {
if(country.dialCode.length > selectedCountry.dialCode.length) {
return country;
}
if(country.dialCode.length === selectedCountry.dialCode.length && country.priority < selectedCountry.priority) {
return country;
}
}
return selectedCountry;
}, {dialCode: '', priority: 10001}, this);
return selectedCountry;
}, {dialCode: '', priority: 10001}, this);
} else {
return secondBestGuess;
}
if(!bestGuess.name) {
return secondBestGuess;
}
return bestGuess;
}),
getElement: function(index) {
return this.refs['flag_no_'+index].getDOMNode();
getElement(index) {
return this.refs[`flag_no_${index}`].getDOMNode();
},
handleFlagDropdownClick: function() {
handleFlagDropdownClick() {
// need to put the highlight on the current selected country if the dropdown is going to open up
var self = this;
this.setState({

@@ -239,8 +243,7 @@ showDropDown: !this.state.showDropDown,

highlightCountryIndex: findIndex(this.props.onlyCountries, this.state.selectedCountry)
}, function() {
self.scrollTo(self.getElement(self.state.highlightCountryIndex + self.state.preferredCountries.length));
}, () => {
this.scrollTo(this.getElement(this.state.highlightCountryIndex + this.state.preferredCountries.length));
});
},
// TODO: handle
handleInput: function(event) {
handleInput(event) {

@@ -255,3 +258,7 @@ var formattedNumber = '+', newSelectedCountry = this.state.selectedCountry, freezeSelection = this.state.freezeSelection;

// ie hack
event.preventDefault ? event.preventDefault() : event.returnValue = false;
if(event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}

@@ -297,6 +304,6 @@ if(event.target.value.length > 0) {

},
handleInputClick: function() {
handleInputClick() {
this.setState({showDropDown: false});
},
handleFlagItemClick: function(country, event) {
handleFlagItemClick(country) {
var currentSelectedCountry = this.state.selectedCountry;

@@ -315,6 +322,8 @@ // var nextSelectedCountry = this.props.onlyCountries[countryIndex];

this._cursorToEnd();
this.props.onChange && this.props.onChange(formattedNumber);
if(this.props.onChange) {
this.props.onChange(formattedNumber);
}
});
},
handleInputFocus: function() {
handleInputFocus() {
// if the input is blank, insert dial code of the selected country

@@ -325,6 +334,9 @@ if(this.refs.numberInput.getDOMNode().value === '+') {

},
_findIndexOfCountry: function(allCountries, countryToFind, startIndex) {
if(!startIndex) startIndex = 0;
for(var i = startIndex; i < allCountries.length; i++) {
if(allCountries[i].iso2 === countryToFind.iso2) {
_findIndexOfCountry(allTheCountries, countryToFind, startIndex) {
if(!startIndex) {
startIndex = 0;
}
for(var i = startIndex; i < allTheCountries.length; i++) {
if(allTheCountries[i].iso2 === countryToFind.iso2) {
return i;

@@ -335,3 +347,3 @@ }

},
_getHighlightCountryIndex: function(direction) {
_getHighlightCountryIndex(direction) {
// had to write own function because underscore does not have findIndex. lodash has it

@@ -341,3 +353,3 @@ var highlightCountryIndex = this.state.highlightCountryIndex + direction;

if(highlightCountryIndex < 0
|| highlightCountryIndex >= (this.props.onlyCountries.length + this.state.preferredCountries.length)) {
|| highlightCountryIndex >= (this.props.onlyCountries.length + this.state.preferredCountries.length)) {
return highlightCountryIndex - direction;

@@ -359,3 +371,3 @@ }

}),
searchCountry: function() {
searchCountry() {
var probableCandidate = this._searchCountry(this.state.queryString) || this.props.onlyCountries[0];

@@ -367,7 +379,7 @@ var probableCandidateIndex = findIndex(this.props.onlyCountries, probableCandidate) + this.state.preferredCountries.length;

this.setState({
queryString: "",
queryString: '',
highlightCountryIndex: probableCandidateIndex
});
},
handleKeydown: function(event) {
handleKeydown(event) {
if(!this.state.showDropDown) {

@@ -378,9 +390,13 @@ return;

// ie hack
event.preventDefault ? event.preventDefault() : event.returnValue = false;
var self = this;
if(event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
function _moveHighlight(direction) {
self.setState({
highlightCountryIndex: self._getHighlightCountryIndex(direction)
}, function() {
self.scrollTo(self.getElement(self.state.highlightCountryIndex), true);
this.setState({
highlightCountryIndex: this._getHighlightCountryIndex(direction)
}, () => {
this.scrollTo(this.getElement(this.state.highlightCountryIndex), true);
});

@@ -404,3 +420,3 @@ }

if((event.which >= keys.A && event.which <= keys.Z) || event.which === keys.SPACE) {
this.setState({queryString: this.state.queryString+String.fromCharCode(event.which)},
this.setState({queryString: this.state.queryString + String.fromCharCode(event.which)},
this.state.debouncedQueryStingSearcher);

@@ -410,3 +426,3 @@ }

},
handleInputKeyDown: function(event) {
handleInputKeyDown(event) {
if(event.which === keys.ENTER) {

@@ -416,3 +432,3 @@ this.props.onEnterKeyPress(event);

},
handleBlur: function() {
handleBlur() {
this.setState({

@@ -422,5 +438,3 @@ showDropDown: false

},
handleClickOutside: function(event) {
var target = event.target;
handleClickOutside() {
if(this.state.showDropDown) {

@@ -430,24 +444,14 @@ this.handleBlur();

},
render: function() {
getCountryDropDownList() {
var dropDownClasses = classNames({
"country-list": true,
"hide": !this.state.showDropDown
'country-list': true,
'hide': !this.state.showDropDown
});
var arrowClasses = classNames({
"arrow": true,
"up": this.state.showDropDown
});
var inputClasses = classNames({
"form-control": true,
"invalid-number": !this.props.isValid(this.state.formattedNumber.replace(/\D/g, ''))
});
var dashedLi = (<li key={"dashes"} className="divider" />);
var countryDropDownList = map(this.state.preferredCountries.concat(this.props.onlyCountries), function(country, index) {
var itemClasses = classNames({
"country": true,
"preferred": country.iso2 === 'us' || country.iso2 === 'gb',
"active": country.iso2 === 'us',
"highlight": this.state.highlightCountryIndex === index
country: true,
preferred: country.iso2 === 'us' || country.iso2 === 'gb',
active: country.iso2 === 'us',
highlight: this.state.highlightCountryIndex === index
});

@@ -457,5 +461,5 @@

<li
ref={"flag_no_" + index}
key={"flag_no_" + index}
data-flag-key={"flag_no_" + index}
ref={`flag_no_${index}`}
key={`flag_no_${index}`}
data-flag-key={`flag_no_${index}`}
className={itemClasses}

@@ -465,5 +469,5 @@ data-dial-code="1"

onClick={this.handleFlagItemClick.bind(this, country)}>
<div className={"flag " + country.iso2} />
<span className="country-name">{country.name}</span>
<span className="dial-code">{'+'+country.dialCode}</span>
<div className={`flag ${country.iso2}`} />
<span className='country-name'>{country.name}</span>
<span className='dial-code'>{'+' + country.dialCode}</span>
</li>

@@ -473,12 +477,29 @@ );

var dashedLi = (<li key={"dashes"} className="divider" />);
// let's insert a dashed line in between preffered countries and the rest
countryDropDownList.splice(this.state.preferredCountries.length, 0, dashedLi);
return (
<ul ref="flagDropdownList" className={dropDownClasses}>
{countryDropDownList}
</ul>
);
},
render() {
var arrowClasses = classNames({
'arrow': true,
'up': this.state.showDropDown
});
var inputClasses = classNames({
'form-control': true,
'invalid-number': !this.props.isValid(this.state.formattedNumber.replace(/\D/g, ''))
});
var flagViewClasses = classNames({
"flag-dropdown": true,
"open-dropdown": this.state.showDropDown
'flag-dropdown': true,
'open-dropdown': this.state.showDropDown
});
return (
<div className="react-tel-input">
<div className='react-tel-input'>
<input

@@ -493,13 +514,10 @@ onChange={this.handleInput}

className={inputClasses}
placeholder="+1 (702) 123-4567"/>
<div ref="flagDropDownButton" className={flagViewClasses} onKeyDown={this.handleKeydown} >
<div ref="selectedFlag" onClick={this.handleFlagDropdownClick} className="selected-flag" title={this.state.selectedCountry.name+": +" + this.state.selectedCountry.dialCode}>
<div className={"flag "+this.state.selectedCountry.iso2}>
placeholder='+1 (702) 123-4567'/>
<div ref='flagDropDownButton' className={flagViewClasses} onKeyDown={this.handleKeydown} >
<div ref='selectedFlag' onClick={this.handleFlagDropdownClick} className='selected-flag' title={`${this.state.selectedCountry.name}: + ${this.state.selectedCountry.dialCode}`}>
<div className={`flag ${this.state.selectedCountry.iso2}`}>
<div className={arrowClasses}></div>
</div>
</div>
<ul ref="flagDropdownList" className={dropDownClasses}>
{countryDropDownList}
</ul>
{this.state.showDropDown ? this.getCountryDropDownList() : ''}
</div>

@@ -506,0 +524,0 @@ </div>

11

test/ReactTelephoneInput-test.js
'use strict';
/* global describe, it, beforeEach */
var jsdom = require('mocha-jsdom');
var expect = require('chai').expect;
var React = require('react/addons');
var TestUtils = React.addons.TestUtils;
var ReactTelephoneInput = require('../src/index.js');
describe('react telephone input', function() {
jsdom();
it('should run example test', function() {
it('mandatory existential crisis test', function() {
var rti = TestUtils.renderIntoDocument(React.createElement(ReactTelephoneInput, {}));
expect(rti).to.be.defined;
expect(rti.refs.numberInput).to.be.defined;
expect(true).to.be.true;
});
});
});
example/dist/bundle.js

Sorry, the diff of this file is too big to display

example/dist/common.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc