react-phone-input - npm Package Compare versions

Comparing version 0.1.8 to 0.1.9

build/index.js

@@ -0,32 +1,33 @@
+// 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
+
 'use strict';
 
-var _interopRequireWildcard = function (obj) { return obj && obj.__esModule ? obj : { 'default': obj }; };
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
 
-var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
-
 var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
 
-var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
-var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-// 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
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
 
-var _import = require('lodash');
+function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-var _import2 = _interopRequireWildcard(_import);
+var _lodash = require('lodash');
 
-var _React = require('react/addons.js');
+var _lodash2 = _interopRequireDefault(_lodash);
 
-var _React2 = _interopRequireWildcard(_React);
+var _reactAddonsJs = require('react/addons.js');
 
-var _countryData = require('./country_data.js');
+var _reactAddonsJs2 = _interopRequireDefault(_reactAddonsJs);
 
-var _countryData2 = _interopRequireWildcard(_countryData);
+var _country_dataJs = require('./country_data.js');
 
-var allCountries = _countryData2['default'].allCountries;
+var _country_dataJs2 = _interopRequireDefault(_country_dataJs);
 
+var allCountries = _country_dataJs2['default'].allCountries;
+
 var isModernBrowser = Boolean(document.createElement('input').setSelectionRange);
@@ -54,4 +55,4 @@
 function isNumberValid(inputNumber) {
-  var countries = _countryData2['default'].allCountries;
-  return _import2['default'].some(countries, function (country) {
+  var countries = _country_dataJs2['default'].allCountries;
+  return _lodash2['default'].some(countries, function (country) {
     return startsWith(inputNumber, country.dialCode) || startsWith(country.dialCode, inputNumber);
@@ -62,2 +63,4 @@ });
 var ReactPhoneInput = (function (_React$Component) {
+  _inherits(ReactPhoneInput, _React$Component);
+
   function ReactPhoneInput(props) {
@@ -75,13 +78,13 @@ _classCallCheck(this, ReactPhoneInput);
       if (!selectedCountryGuess || !selectedCountryGuess.name) {
-        selectedCountryGuess = _import2['default'].findWhere(allCountries, { iso2: this.props.defaultCountry }) || this.props.onlyCountries[0];
+        selectedCountryGuess = _lodash2['default'].findWhere(allCountries, { iso2: this.props.defaultCountry }) || this.props.onlyCountries[0];
       }
     } else {
-      selectedCountryGuess = _import2['default'].findWhere(allCountries, { iso2: this.props.defaultCountry }) || this.props.onlyCountries[0];
+      selectedCountryGuess = _lodash2['default'].findWhere(allCountries, { iso2: this.props.defaultCountry }) || this.props.onlyCountries[0];
     }
 
-    selectedCountryGuessIndex = _import2['default'].findIndex(allCountries, selectedCountryGuess);
+    selectedCountryGuessIndex = _lodash2['default'].findIndex(allCountries, selectedCountryGuess);
     var formattedNumber = this.formatNumber(inputNumber.replace(/\D/g, ''), selectedCountryGuess ? selectedCountryGuess.format : null);
 
-    var preferredCountries = _import2['default'].filter(allCountries, function (country) {
-      return _import2['default'].any(this.props.preferredCountries, function (preferredCountry) {
+    var preferredCountries = _lodash2['default'].filter(allCountries, function (country) {
+      return _lodash2['default'].any(this.props.preferredCountries, function (preferredCountry) {
         return preferredCountry === country.iso2;
@@ -120,10 +123,8 @@ });
       showDropDown: false,
-      queryString: '',
+      queryString: "",
       freezeSelection: false,
-      debouncedQueryStingSearcher: _import2['default'].debounce(this.searchCountry, 300)
+      debouncedQueryStingSearcher: _lodash2['default'].debounce(this.searchCountry, 300)
     };
   }
 
-  _inherits(ReactPhoneInput, _React$Component);
-
   _createClass(ReactPhoneInput, [{
@@ -162,9 +163,9 @@ key: 'trim',
     value: function scrollTo(country, middle) {
-      if (!country) {
-        return;
-      }var container = this.refs.flagDropdownList.getDOMNode();
+      if (!country) return;
 
-      if (!container) {
-        return;
-      }var containerHeight = container.offsetHeight;
+      var container = this.refs.flagDropdownList.getDOMNode();
+
+      if (!container) return;
+
+      var containerHeight = container.offsetHeight;
       var containerOffset = container.getBoundingClientRect();
@@ -211,3 +212,3 @@ var containerTop = containerOffset.top + document.body.scrollTop;
 
-      var formattedObject = _import2['default'].reduce(pattern, function (formattedObject, character, key) {
+      var formattedObject = _lodash2['default'].reduce(pattern, function (formattedObject, character, key) {
         if (formattedObject.remainingText.length === 0) {
@@ -225,12 +226,12 @@ return formattedObject;
         return {
-          formattedText: formattedObject.formattedText + _import2['default'].first(formattedObject.remainingText),
-          remainingText: _import2['default'].rest(formattedObject.remainingText)
+          formattedText: formattedObject.formattedText + _lodash2['default'].first(formattedObject.remainingText),
+          remainingText: _lodash2['default'].rest(formattedObject.remainingText)
         };
-      }, { formattedText: '', remainingText: text.split('') });
-      return formattedObject.formattedText + formattedObject.remainingText.join('');
+      }, { formattedText: "", remainingText: text.split('') });
+      return formattedObject.formattedText + formattedObject.remainingText.join("");
     }
+
+    // put the cursor to the end of the input (usually after a focus event)
   }, {
     key: '_cursorToEnd',
-
-    // put the cursor to the end of the input (usually after a focus event)
     value: function _cursorToEnd() {
@@ -257,4 +258,4 @@ var input = this.refs.numberInput.getDOMNode();
         showDropDown: !this.state.showDropDown,
-        highlightCountry: _import2['default'].findWhere(this.props.onlyCountries, this.state.selectedCountry),
-        highlightCountryIndex: _import2['default'].findIndex(this.props.onlyCountries, this.state.selectedCountry)
+        highlightCountry: _lodash2['default'].findWhere(this.props.onlyCountries, this.state.selectedCountry),
+        highlightCountryIndex: _lodash2['default'].findIndex(this.props.onlyCountries, this.state.selectedCountry)
       }, function () {
@@ -264,6 +265,6 @@ self.scrollTo(self.getElement(self.state.highlightCountryIndex + self.state.preferredCountries.length));
     }
+
+    // TODO: handle
   }, {
     key: 'handleInput',
-
-    // TODO: handle
     value: function handleInput(event) {
@@ -331,3 +332,3 @@
       // var nextSelectedCountry = this.props.onlyCountries[countryIndex];
-      var nextSelectedCountry = _import2['default'].findWhere(this.props.onlyCountries, country);
+      var nextSelectedCountry = _lodash2['default'].findWhere(this.props.onlyCountries, country);
       var newNumber = this.state.formattedNumber.replace(currentSelectedCountry.dialCode, nextSelectedCountry.dialCode);
@@ -381,3 +382,3 @@ var formattedNumber = this.formatNumber(newNumber.replace(/\D/g, ''), nextSelectedCountry.format);
       var probableCandidate = this._searchCountry(this.state.queryString) || this.props.onlyCountries[0];
-      var probableCandidateIndex = _import2['default'].findIndex(this.props.onlyCountries, probableCandidate) + this.state.preferredCountries.length;
+      var probableCandidateIndex = _lodash2['default'].findIndex(this.props.onlyCountries, probableCandidate) + this.state.preferredCountries.length;
       console.log('probable candidate index: ', probableCandidateIndex);
@@ -388,3 +389,3 @@ console.log('preferred country length: ', this.state.preferredCountries.length);
       this.setState({
-        queryString: '',
+        queryString: "",
         highlightCountryIndex: probableCandidateIndex
@@ -446,5 +447,5 @@ });
     value: function isFlagDropDownButtonClicked(target) {
-      if (!this.refs.flagDropDownButton) {
-        return false;
-      }var flagDropDownButton = this.refs.flagDropDownButton.getDOMNode();
+      if (!this.refs.flagDropDownButton) return false;
+
+      var flagDropDownButton = this.refs.flagDropDownButton.getDOMNode();
       return flagDropDownButton == target || target.parentNode == flagDropDownButton;
@@ -455,5 +456,5 @@ }
     value: function isFlagItemClicked(target) {
-      if (!this.refs.flagDropdownList) {
-        return false;
-      }var dropDownList = this.refs.flagDropdownList.getDOMNode();
+      if (!this.refs.flagDropdownList) return false;
+
+      var dropDownList = this.refs.flagDropdownList.getDOMNode();
       return dropDownList == target || target.parentNode == dropDownList;
@@ -473,32 +474,32 @@ }
     value: function render() {
-      var cx = _React2['default'].addons.classSet;
+      var cx = _reactAddonsJs2['default'].addons.classSet;
       var dropDownClasses = cx({
-        'country-list': true,
-        hide: !this.state.showDropDown
+        "country-list": true,
+        "hide": !this.state.showDropDown
       });
       var arrowClasses = cx({
-        arrow: true,
-        up: this.state.showDropDown
+        "arrow": true,
+        "up": this.state.showDropDown
       });
       var inputClasses = cx({
-        'form-control': true,
-        'invalid-number': !this.props.isValid(this.state.formattedNumber.replace(/\D/g, ''))
+        "form-control": true,
+        "invalid-number": !this.props.isValid(this.state.formattedNumber.replace(/\D/g, ''))
       });
 
-      var dashedLi = _React2['default'].createElement('li', { key: 'dashes', className: 'divider' });
+      var dashedLi = _reactAddonsJs2['default'].createElement('li', { key: "dashes", className: 'divider' });
 
-      var countryDropDownList = _import2['default'].map(this.state.preferredCountries.concat(this.props.onlyCountries), function (country, index) {
+      var countryDropDownList = _lodash2['default'].map(this.state.preferredCountries.concat(this.props.onlyCountries), function (country, index) {
         var itemClasses = cx({
-          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
         });
 
-        return _React2['default'].createElement(
+        return _reactAddonsJs2['default'].createElement(
           '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,
@@ -508,4 +509,4 @@ 'data-dial-code': '1',
             onClick: this.handleFlagItemClick.bind(this, country) },
-          _React2['default'].createElement('div', { className: 'flag ' + country.iso2 }),
-          _React2['default'].createElement(
+          _reactAddonsJs2['default'].createElement('div', { className: "flag " + country.iso2 }),
+          _reactAddonsJs2['default'].createElement(
             'span',
@@ -515,3 +516,3 @@ { className: 'country-name' },
           ),
-          _React2['default'].createElement(
+          _reactAddonsJs2['default'].createElement(
             'span',
@@ -528,10 +529,10 @@ { className: 'dial-code' },
       var flagViewClasses = cx({
-        'flag-dropdown': true,
-        'open-dropdown': this.state.showDropDown
+        "flag-dropdown": true,
+        "open-dropdown": this.state.showDropDown
       });
 
-      return _React2['default'].createElement(
+      return _reactAddonsJs2['default'].createElement(
         'div',
         { className: 'react-tel-input' },
-        _React2['default'].createElement('input', {
+        _reactAddonsJs2['default'].createElement('input', {
           onChange: this.handleInput,
@@ -546,15 +547,15 @@ onClick: this.handleInputClick,
           placeholder: '[phone]' }),
-        _React2['default'].createElement(
+        _reactAddonsJs2['default'].createElement(
           'div',
           { ref: 'flagDropDownButton', className: flagViewClasses, onKeyDown: this.handleKeydown },
-          _React2['default'].createElement(
+          _reactAddonsJs2['default'].createElement(
             'div',
-            { ref: 'selectedFlag', onClick: this.handleFlagDropdownClick, className: 'selected-flag', title: this.state.selectedCountry.name + ': +' + this.state.selectedCountry.dialCode },
-            _React2['default'].createElement(
+            { ref: 'selectedFlag', onClick: this.handleFlagDropdownClick, className: 'selected-flag', title: this.state.selectedCountry.name + ": +" + this.state.selectedCountry.dialCode },
+            _reactAddonsJs2['default'].createElement(
               'div',
-              { className: 'flag ' + this.state.selectedCountry.iso2 },
-              _React2['default'].createElement('div', { className: arrowClasses })
+              { className: "flag " + this.state.selectedCountry.iso2 },
+              _reactAddonsJs2['default'].createElement('div', { className: arrowClasses })
             )
           ),
-          _React2['default'].createElement(
+          _reactAddonsJs2['default'].createElement(
             'ul',
@@ -570,5 +571,5 @@ { ref: 'flagDropdownList', className: dropDownClasses },
   return ReactPhoneInput;
-})(_React2['default'].Component);
+})(_reactAddonsJs2['default'].Component);
 
-ReactPhoneInput.prototype._searchCountry = _import2['default'].memoize(function (queryString) {
+ReactPhoneInput.prototype._searchCountry = _lodash2['default'].memoize(function (queryString) {
   if (!queryString || queryString.length === 0) {
@@ -578,3 +579,3 @@ return null;
   // don't include the preferred countries in search
-  var probableCountries = _import2['default'].filter(this.props.onlyCountries, function (country) {
+  var probableCountries = _lodash2['default'].filter(this.props.onlyCountries, function (country) {
     return startsWith(country.name.toLowerCase(), queryString.toLowerCase());
@@ -586,4 +587,4 @@ }, this);
 
-ReactPhoneInput.prototype.guessSelectedCountry = _import2['default'].memoize(function (inputNumber) {
-  return _import2['default'].reduce(this.props.onlyCountries, function (selectedCountry, country) {
+ReactPhoneInput.prototype.guessSelectedCountry = _lodash2['default'].memoize(function (inputNumber) {
+  return _lodash2['default'].reduce(this.props.onlyCountries, function (selectedCountry, country) {
     if (startsWith(inputNumber, country.dialCode)) {
@@ -610,14 +611,12 @@ if (country.dialCode.length > selectedCountry.dialCode.length) {
 ReactPhoneInput.propTypes = {
-  value: _React2['default'].PropTypes.string,
-  autoFormat: _React2['default'].PropTypes.bool,
-  defaultCountry: _React2['default'].PropTypes.string,
-  onlyCountries: _React2['default'].PropTypes.arrayOf(_React2['default'].PropTypes.string),
-  preferredCountries: _React2['default'].PropTypes.arrayOf(_React2['default'].PropTypes.string),
-  onChange: _React2['default'].PropTypes.func
+  value: _reactAddonsJs2['default'].PropTypes.string,
+  autoFormat: _reactAddonsJs2['default'].PropTypes.bool,
+  defaultCountry: _reactAddonsJs2['default'].PropTypes.string,
+  onlyCountries: _reactAddonsJs2['default'].PropTypes.arrayOf(_reactAddonsJs2['default'].PropTypes.string),
+  preferredCountries: _reactAddonsJs2['default'].PropTypes.arrayOf(_reactAddonsJs2['default'].PropTypes.string),
+  onChange: _reactAddonsJs2['default'].PropTypes.func
 };
 
 exports['default'] = ReactPhoneInput;
-
-_React2['default'].render(_React2['default'].createElement(ReactPhoneInput, { defaultCountry: 'us', preferredCountries: ['us', 'de'] }), document.getElementById('content'));
 module.exports = exports['default'];
 

package.json

 {
   "name": "react-phone-input",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "description": "A react component to format phone numbers",
@@ -22,3 +22,3 @@ "main": "build/index.js",
   "author": "Raza Gill <[e-mail]> (http://github.com/razagill)",
-  "license": "ISC",
+  "license": "MIT",
   "bugs": {
@@ -25,0 +25,0 @@ "url": "https://github.com/razagill/react-phone-input/issues"

src/index.js

@@ -526,5 +526,1 @@ // 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
 export default ReactPhoneInput;
-
-React.render(
-  <ReactPhoneInput defaultCountry={'us'} preferredCountries={['us', 'de']}/>,
-  document.getElementById('content'));

New alerts

SPDX disjunction

License

SPDX disjunction for an artifact's license information

Found 1 instance in 1 package

Fixed alerts

SPDX disjunction

License

SPDX disjunction for an artifact's license information

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

167499

increased by0.06%

Number of low license alerts

1

decreased by-50%

Worsened metrics

Number of package files

10

decreased by-9.09%

Lines of code

3572

decreased by-0.2%

No dependency changes