intl-tel-input 18.5.3 → 19.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/README.md +42 -28
  2. package/build/css/demo.css +1 -1
  3. package/build/css/intlTelInput.css +28 -20
  4. package/build/js/data.js +1 -1
  5. package/build/js/data.min.js +1 -1
  6. package/build/js/intlTelInput-jquery.js +158 -151
  7. package/build/js/intlTelInput-jquery.min.js +3 -3
  8. package/build/js/intlTelInput.js +158 -151
  9. package/build/js/intlTelInput.min.js +3 -3
  10. package/composer.json +1 -1
  11. package/demo.html +5 -5
  12. package/grunt/replace.js +1 -7
  13. package/package.json +1 -1
  14. package/spec.html +6 -4
  15. package/src/css/demo.scss +1 -1
  16. package/src/css/intlTelInput.scss +41 -30
  17. package/src/js/intlTelInput.js +76 -125
  18. package/src/spec/helpers/helpers.js +23 -10
  19. package/src/spec/tests/core/countrychangeEvent.js +1 -1
  20. package/src/spec/tests/core/dropdownShortcuts.js +3 -2
  21. package/src/spec/tests/core/initialValues.js +2 -3
  22. package/src/spec/tests/methods/getSelectedCountryData.js +1 -1
  23. package/src/spec/tests/methods/isValidNumber.js +15 -32
  24. package/src/spec/tests/methods/isValidNumberPrecise.js +73 -0
  25. package/src/spec/tests/methods/setCountry.js +4 -4
  26. package/src/spec/tests/options/allowDropdown.js +3 -3
  27. package/src/spec/tests/options/autoInsertDialCode.js +1 -3
  28. package/src/spec/tests/options/autoPlaceholder.js +5 -5
  29. package/src/spec/tests/options/{customContainer.js → containerClass.js} +3 -3
  30. package/src/spec/tests/options/countrySearch.js +63 -0
  31. package/src/spec/tests/options/customPlaceholder.js +1 -1
  32. package/src/spec/tests/options/preferredCountries.js +3 -1
  33. package/src/spec/tests/options/{separateDialCode.js → showSelectedDialCode.js} +7 -7
  34. package/src/spec/tests/methods/isPossibleNumber.js +0 -56
@@ -1,5 +1,5 @@
1
1
  /*
2
- * International Telephone Input v18.5.3
2
+ * International Telephone Input v19.0.0
3
3
  * https://github.com/jackocnr/intl-tel-input.git
4
4
  * Licensed under the MIT license
5
5
  */
@@ -66,6 +66,52 @@
66
66
  }
67
67
  return obj;
68
68
  }
69
+ function _slicedToArray(arr, i) {
70
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
71
+ }
72
+ function _nonIterableRest() {
73
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
74
+ }
75
+ function _unsupportedIterableToArray(o, minLen) {
76
+ if (!o) return;
77
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
78
+ var n = Object.prototype.toString.call(o).slice(8, -1);
79
+ if (n === "Object" && o.constructor) n = o.constructor.name;
80
+ if (n === "Map" || n === "Set") return Array.from(o);
81
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
82
+ }
83
+ function _arrayLikeToArray(arr, len) {
84
+ if (len == null || len > arr.length) len = arr.length;
85
+ for (var i = 0, arr2 = new Array(len); i < len; i++) {
86
+ arr2[i] = arr[i];
87
+ }
88
+ return arr2;
89
+ }
90
+ function _iterableToArrayLimit(arr, i) {
91
+ var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
92
+ if (null != _i) {
93
+ var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1;
94
+ try {
95
+ if (_x = (_i = _i.call(arr)).next, 0 === i) {
96
+ if (Object(_i) !== _i) return;
97
+ _n = !1;
98
+ } else for (;!(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
99
+ }
100
+ } catch (err) {
101
+ _d = !0, _e = err;
102
+ } finally {
103
+ try {
104
+ if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return;
105
+ } finally {
106
+ if (_d) throw _e;
107
+ }
108
+ }
109
+ return _arr;
110
+ }
111
+ }
112
+ function _arrayWithHoles(arr) {
113
+ if (Array.isArray(arr)) return arr;
114
+ }
69
115
  function _classCallCheck(instance, Constructor) {
70
116
  if (!(instance instanceof Constructor)) {
71
117
  throw new TypeError("Cannot call a class as a function");
@@ -127,9 +173,9 @@
127
173
  // add a placeholder in the input with an example number for the selected country
128
174
  autoPlaceholder: "polite",
129
175
  // add a country search input at the top of the dropdown
130
- countrySearch: false,
176
+ countrySearch: true,
131
177
  // modify the parentClass
132
- customContainer: "",
178
+ containerClass: "",
133
179
  // modify the auto placeholder
134
180
  customPlaceholder: null,
135
181
  // append menu to specified element
@@ -137,29 +183,29 @@
137
183
  // don't display these countries
138
184
  excludeCountries: [],
139
185
  // fix the dropdown width to the input width (rather than being as wide as the longest country name)
140
- fixDropdownWidth: false,
186
+ fixDropdownWidth: true,
141
187
  // format the input value during initialisation and on setNumber
142
188
  formatOnDisplay: true,
143
189
  // geoIp lookup function
144
190
  geoIpLookup: null,
145
191
  // inject a hidden input with this name, and on submit, populate it with the result of getNumber
146
- hiddenInput: "",
192
+ hiddenInput: null,
193
+ // internationalise the plugin text e.g. search input placeholder, country names
194
+ i18n: {},
147
195
  // initial country
148
196
  initialCountry: "",
149
- // localized country names e.g. { 'de': 'Deutschland' }
150
- localizedCountries: null,
151
197
  // national vs international formatting for numbers e.g. placeholders and displaying existing numbers
152
198
  nationalMode: true,
153
199
  // display only these countries
154
200
  onlyCountries: [],
155
201
  // number type to use for placeholders
156
202
  placeholderNumberType: "MOBILE",
157
- // the countries at the top of the list. defaults to united states and united kingdom
158
- preferredCountries: [ "us", "gb" ],
159
- // display the country dial code next to the selected flag
160
- separateDialCode: false,
161
- // option to hide the flags - must be used with separateDialCode, or allowDropdown=false
203
+ // the countries at the top of the list
204
+ preferredCountries: [],
205
+ // option to hide the flags - must be used with showSelectedDialCode, or allowDropdown=false
162
206
  showFlags: true,
207
+ // display the international dial code next to the selected flag
208
+ showSelectedDialCode: false,
163
209
  // use full screen popup instead of dropdown for country list
164
210
  useFullscreenPopup: typeof navigator !== "undefined" && typeof window !== "undefined" ? // we cannot just test screen size as some smartphones/website meta tags will report desktop
165
211
  // resolutions
@@ -170,43 +216,31 @@
170
216
  };
171
217
  // https://en.wikipedia.org/wiki/List_of_North_American_Numbering_Plan_area_codes#Non-geographic_area_codes
172
218
  var regionlessNanpNumbers = [ "800", "822", "833", "844", "855", "866", "877", "880", "881", "882", "883", "884", "885", "886", "887", "888", "889" ];
173
- // utility function to iterate over an object. can't use Object.entries or native forEach because
174
- // of IE11
175
- var forEachProp = function forEachProp(obj, callback) {
176
- var keys = Object.keys(obj);
177
- for (var i = 0; i < keys.length; i++) {
178
- callback(keys[i], obj[keys[i]]);
179
- }
180
- };
181
219
  // run a method on each instance of the plugin
182
220
  var forEachInstance = function forEachInstance(method) {
183
- forEachProp(window.intlTelInputGlobals.instances, function(key) {
184
- window.intlTelInputGlobals.instances[key][method]();
221
+ var instances = window.intlTelInputGlobals.instances;
222
+ Object.values(instances).forEach(function(instance) {
223
+ return instance[method]();
185
224
  });
186
225
  };
187
226
  // this is our plugin class that we will create an instance of
188
227
  // eslint-disable-next-line no-unused-vars
189
228
  var Iti = /*#__PURE__*/ function() {
190
- function Iti(input, options) {
191
- var _this = this;
229
+ function Iti(input) {
230
+ var customOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
192
231
  _classCallCheck(this, Iti);
193
232
  this.id = id++;
194
233
  this.telInput = input;
195
234
  this.activeItem = null;
196
235
  this.highlightedItem = null;
197
236
  // process specified options / defaults
198
- // alternative to Object.assign, which isn't supported by IE11
199
- var customOptions = options || {};
200
- this.options = {};
201
- forEachProp(defaults, function(key, value) {
202
- _this.options[key] = customOptions.hasOwnProperty(key) ? customOptions[key] : value;
203
- });
237
+ this.options = Object.assign({}, defaults, customOptions);
204
238
  this.hadInitialPlaceholder = Boolean(input.getAttribute("placeholder"));
205
239
  }
206
240
  _createClass(Iti, [ {
207
241
  key: "_init",
208
242
  value: function _init() {
209
- var _this2 = this;
243
+ var _this = this;
210
244
  // if showing fullscreen popup, do not fix the width
211
245
  if (this.options.useFullscreenPopup) {
212
246
  this.options.fixDropdownWidth = false;
@@ -219,13 +253,13 @@
219
253
  if (this.options.nationalMode) {
220
254
  this.options.autoInsertDialCode = false;
221
255
  }
222
- // if separateDialCode enabled, do not insert dial codes
223
- if (this.options.separateDialCode) {
256
+ // if showSelectedDialCode enabled, do not insert dial codes
257
+ if (this.options.showSelectedDialCode) {
224
258
  this.options.autoInsertDialCode = false;
225
259
  }
226
260
  // force showFlags=true if there's a dropdown and we're not displaying the dial code,
227
261
  // as otherwise you just have a down arrow on it's own which doesn't make sense
228
- var forceShowFlags = this.options.allowDropdown && !this.options.separateDialCode;
262
+ var forceShowFlags = this.options.allowDropdown && !this.options.showSelectedDialCode;
229
263
  if (!this.options.showFlags && forceShowFlags) {
230
264
  this.options.showFlags = true;
231
265
  }
@@ -240,12 +274,12 @@
240
274
  // complete
241
275
  if (typeof Promise !== "undefined") {
242
276
  var autoCountryPromise = new Promise(function(resolve, reject) {
243
- _this2.resolveAutoCountryPromise = resolve;
244
- _this2.rejectAutoCountryPromise = reject;
277
+ _this.resolveAutoCountryPromise = resolve;
278
+ _this.rejectAutoCountryPromise = reject;
245
279
  });
246
280
  var utilsScriptPromise = new Promise(function(resolve, reject) {
247
- _this2.resolveUtilsScriptPromise = resolve;
248
- _this2.rejectUtilsScriptPromise = reject;
281
+ _this.resolveUtilsScriptPromise = resolve;
282
+ _this.rejectUtilsScriptPromise = reject;
249
283
  });
250
284
  this.promise = Promise.all([ autoCountryPromise, utilsScriptPromise ]);
251
285
  } else {
@@ -276,12 +310,10 @@
276
310
  this._processCountryCodes();
277
311
  // process the preferredCountries
278
312
  this._processPreferredCountries();
279
- // translate countries according to localizedCountries option
280
- if (this.options.localizedCountries) {
281
- this._translateCountriesByLocale();
282
- }
313
+ // translate country names according to i18n option
314
+ this._translateCountryNames();
283
315
  // sort countries by name
284
- if (this.options.onlyCountries.length || this.options.localizedCountries) {
316
+ if (this.options.onlyCountries.length || this.options.i18n) {
285
317
  this.countries.sort(this._countryNameSort);
286
318
  }
287
319
  }
@@ -326,12 +358,12 @@
326
358
  }
327
359
  }
328
360
  }, {
329
- key: "_translateCountriesByLocale",
330
- value: function _translateCountriesByLocale() {
361
+ key: "_translateCountryNames",
362
+ value: function _translateCountryNames() {
331
363
  for (var i = 0; i < this.countries.length; i++) {
332
364
  var iso = this.countries[i].iso2.toLowerCase();
333
- if (this.options.localizedCountries.hasOwnProperty(iso)) {
334
- this.countries[i].name = this.options.localizedCountries[iso];
365
+ if (this.options.i18n.hasOwnProperty(iso)) {
366
+ this.countries[i].name = this.options.i18n[iso];
335
367
  }
336
368
  }
337
369
  }
@@ -404,7 +436,8 @@
404
436
  value: function _createEl(name, attrs, container) {
405
437
  var el = document.createElement(name);
406
438
  if (attrs) {
407
- forEachProp(attrs, function(key, value) {
439
+ Object.entries(attrs).forEach(function(_ref) {
440
+ var _ref2 = _slicedToArray(_ref, 2), key = _ref2[0], value = _ref2[1];
408
441
  return el.setAttribute(key, value);
409
442
  });
410
443
  }
@@ -424,27 +457,30 @@
424
457
  if (!this.telInput.hasAttribute("autocomplete") && !(this.telInput.form && this.telInput.form.hasAttribute("autocomplete"))) {
425
458
  this.telInput.setAttribute("autocomplete", "off");
426
459
  }
427
- var _this$options = this.options, allowDropdown = _this$options.allowDropdown, separateDialCode = _this$options.separateDialCode, showFlags = _this$options.showFlags, customContainer = _this$options.customContainer, hiddenInput = _this$options.hiddenInput, dropdownContainer = _this$options.dropdownContainer, fixDropdownWidth = _this$options.fixDropdownWidth, useFullscreenPopup = _this$options.useFullscreenPopup, countrySearch = _this$options.countrySearch;
460
+ var _this$options = this.options, allowDropdown = _this$options.allowDropdown, showSelectedDialCode = _this$options.showSelectedDialCode, showFlags = _this$options.showFlags, containerClass = _this$options.containerClass, hiddenInput = _this$options.hiddenInput, dropdownContainer = _this$options.dropdownContainer, fixDropdownWidth = _this$options.fixDropdownWidth, useFullscreenPopup = _this$options.useFullscreenPopup, countrySearch = _this$options.countrySearch;
428
461
  // containers (mostly for positioning)
429
462
  var parentClass = "iti";
430
463
  if (allowDropdown) {
431
464
  parentClass += " iti--allow-dropdown";
432
465
  }
433
- if (separateDialCode) {
434
- parentClass += " iti--separate-dial-code";
466
+ if (showSelectedDialCode) {
467
+ parentClass += " iti--show-selected-dial-code";
435
468
  }
436
469
  if (showFlags) {
437
470
  parentClass += " iti--show-flags";
438
471
  }
439
- if (customContainer) {
440
- parentClass += " ".concat(customContainer);
472
+ if (containerClass) {
473
+ parentClass += " ".concat(containerClass);
474
+ }
475
+ if (!useFullscreenPopup) {
476
+ parentClass += " iti--inline-dropdown";
441
477
  }
442
478
  var wrapper = this._createEl("div", {
443
479
  "class": parentClass
444
480
  });
445
481
  this.telInput.parentNode.insertBefore(wrapper, this.telInput);
446
- // only hide the flagsContainer if allowDropdown, showFlags and separateDialCode are all false
447
- var showFlagsContainer = allowDropdown || showFlags || separateDialCode;
482
+ // only hide the flagsContainer if allowDropdown, showFlags and showSelectedDialCode are all false
483
+ var showFlagsContainer = allowDropdown || showFlags || showSelectedDialCode;
448
484
  if (showFlagsContainer) {
449
485
  this.flagsContainer = this._createEl("div", {
450
486
  "class": "iti__flag-container"
@@ -462,7 +498,7 @@
462
498
  "aria-haspopup": "listbox",
463
499
  "aria-controls": "iti-".concat(this.id, "__country-listbox"),
464
500
  "aria-expanded": "false",
465
- "aria-label": "Telephone country code"
501
+ "aria-label": this.options.i18n.selectedCountryAriaLabel || "Selected country"
466
502
  }), this.flagsContainer);
467
503
  }
468
504
  if (showFlags) {
@@ -473,7 +509,7 @@
473
509
  if (this.selectedFlag && this.telInput.disabled) {
474
510
  this.selectedFlag.setAttribute("aria-disabled", "true");
475
511
  }
476
- if (separateDialCode) {
512
+ if (showSelectedDialCode) {
477
513
  this.selectedDialCode = this._createEl("div", {
478
514
  "class": "iti__selected-dial-code"
479
515
  }, this.selectedFlag);
@@ -494,7 +530,7 @@
494
530
  this.searchInput = this._createEl("input", {
495
531
  type: "text",
496
532
  "class": "iti__search-input",
497
- placeholder: "Search"
533
+ placeholder: this.options.i18n.searchPlaceholder || "Search"
498
534
  }, this.dropdownContent);
499
535
  }
500
536
  // country list: preferred countries, then divider, then all countries
@@ -502,7 +538,7 @@
502
538
  "class": "iti__country-list",
503
539
  id: "iti-".concat(this.id, "__country-listbox"),
504
540
  role: "listbox",
505
- "aria-label": "List of countries"
541
+ "aria-label": this.options.i18n.countryListAriaLabel || "List of countries"
506
542
  }, this.dropdownContent);
507
543
  if (this.preferredCountries.length && !countrySearch) {
508
544
  this._appendListItems(this.preferredCountries, "iti__preferred", true);
@@ -517,6 +553,8 @@
517
553
  var dropdownClasses = "iti iti--container";
518
554
  if (useFullscreenPopup) {
519
555
  dropdownClasses += " iti--fullscreen-popup";
556
+ } else {
557
+ dropdownClasses += " iti--inline-dropdown";
520
558
  }
521
559
  if (countrySearch) {
522
560
  dropdownClasses += " iti--country-search";
@@ -530,16 +568,8 @@
530
568
  }
531
569
  }
532
570
  if (hiddenInput) {
533
- var hiddenInputName = hiddenInput;
534
- var name = this.telInput.getAttribute("name");
535
- if (name) {
536
- var i = name.lastIndexOf("[");
537
- // if input name contains square brackets, then give the hidden input the same name,
538
- // replacing the contents of the last set of brackets with the given hiddenInput name
539
- if (i !== -1) {
540
- hiddenInputName = "".concat(name.substr(0, i), "[").concat(hiddenInputName, "]");
541
- }
542
- }
571
+ var telInputName = this.telInput.getAttribute("name");
572
+ var hiddenInputName = hiddenInput(telInputName);
543
573
  this.hiddenInput = this._createEl("input", {
544
574
  type: "hidden",
545
575
  name: hiddenInputName
@@ -637,39 +667,30 @@
637
667
  }, {
638
668
  key: "_initHiddenInputListener",
639
669
  value: function _initHiddenInputListener() {
640
- var _this3 = this;
670
+ var _this2 = this;
641
671
  this._handleHiddenInputSubmit = function() {
642
- _this3.hiddenInput.value = _this3.getNumber();
672
+ _this2.hiddenInput.value = _this2.getNumber();
643
673
  };
644
674
  if (this.telInput.form) {
645
675
  this.telInput.form.addEventListener("submit", this._handleHiddenInputSubmit);
646
676
  }
647
677
  }
648
- }, {
649
- key: "_getClosestLabel",
650
- value: function _getClosestLabel() {
651
- var el = this.telInput;
652
- while (el && el.tagName !== "LABEL") {
653
- el = el.parentNode;
654
- }
655
- return el;
656
- }
657
678
  }, {
658
679
  key: "_initDropdownListeners",
659
680
  value: function _initDropdownListeners() {
660
- var _this4 = this;
681
+ var _this3 = this;
661
682
  // hack for input nested inside label (which is valid markup): clicking the selected-flag to
662
683
  // open the dropdown would then automatically trigger a 2nd click on the input which would
663
684
  // close it again
664
685
  this._handleLabelClick = function(e) {
665
686
  // if the dropdown is closed, then focus the input, else ignore the click
666
- if (_this4.dropdownContent.classList.contains("iti__hide")) {
667
- _this4.telInput.focus();
687
+ if (_this3.dropdownContent.classList.contains("iti__hide")) {
688
+ _this3.telInput.focus();
668
689
  } else {
669
690
  e.preventDefault();
670
691
  }
671
692
  };
672
- var label = this._getClosestLabel();
693
+ var label = this.telInput.closest("label");
673
694
  if (label) {
674
695
  label.addEventListener("click", this._handleLabelClick);
675
696
  }
@@ -678,24 +699,24 @@
678
699
  // only intercept this event if we're opening the dropdown
679
700
  // else let it bubble up to the top ("click-off-to-close" listener)
680
701
  // we cannot just stopPropagation as it may be needed to close another instance
681
- if (_this4.dropdownContent.classList.contains("iti__hide") && !_this4.telInput.disabled && !_this4.telInput.readOnly) {
682
- _this4._showDropdown();
702
+ if (_this3.dropdownContent.classList.contains("iti__hide") && !_this3.telInput.disabled && !_this3.telInput.readOnly) {
703
+ _this3._showDropdown();
683
704
  }
684
705
  };
685
706
  this.selectedFlag.addEventListener("click", this._handleClickSelectedFlag);
686
707
  // open dropdown if selected flag is focused and they press up/down/space/enter
687
708
  this._handleFlagsContainerKeydown = function(e) {
688
- var isDropdownHidden = _this4.dropdownContent.classList.contains("iti__hide");
709
+ var isDropdownHidden = _this3.dropdownContent.classList.contains("iti__hide");
689
710
  if (isDropdownHidden && [ "ArrowUp", "ArrowDown", " ", "Enter" ].includes(e.key)) {
690
711
  // prevent form from being submitted if "ENTER" was pressed
691
712
  e.preventDefault();
692
713
  // prevent event from being handled again by document
693
714
  e.stopPropagation();
694
- _this4._showDropdown();
715
+ _this3._showDropdown();
695
716
  }
696
717
  // allow navigation from dropdown to input on TAB
697
718
  if (e.key === "Tab") {
698
- _this4._closeDropdown();
719
+ _this3._closeDropdown();
699
720
  }
700
721
  };
701
722
  this.flagsContainer.addEventListener("keydown", this._handleFlagsContainerKeydown);
@@ -703,7 +724,7 @@
703
724
  }, {
704
725
  key: "_initRequests",
705
726
  value: function _initRequests() {
706
- var _this5 = this;
727
+ var _this4 = this;
707
728
  // if the user has specified the path to the utils script, fetch it on window.load, else resolve
708
729
  if (this.options.utilsScript && !window.intlTelInputUtils) {
709
730
  // if the plugin is being initialised after the window.load event has already been fired
@@ -712,7 +733,7 @@
712
733
  } else {
713
734
  // wait until the load event so we don't block any other requests e.g. the flags image
714
735
  window.addEventListener("load", function() {
715
- window.intlTelInputGlobals.loadUtils(_this5.options.utilsScript);
736
+ window.intlTelInputGlobals.loadUtils(_this4.options.utilsScript);
716
737
  });
717
738
  }
718
739
  } else {
@@ -757,18 +778,18 @@
757
778
  }, {
758
779
  key: "_initKeyListeners",
759
780
  value: function _initKeyListeners() {
760
- var _this6 = this;
781
+ var _this5 = this;
761
782
  // update flag on keyup
762
783
  this._handleKeyupEvent = function() {
763
- if (_this6._updateFlagFromNumber(_this6.telInput.value)) {
764
- _this6._triggerCountryChange();
784
+ if (_this5._updateFlagFromNumber(_this5.telInput.value)) {
785
+ _this5._triggerCountryChange();
765
786
  }
766
787
  };
767
788
  this.telInput.addEventListener("keyup", this._handleKeyupEvent);
768
789
  // update flag on cut/paste events (now supported in all major browsers)
769
790
  this._handleClipboardEvent = function() {
770
791
  // hack because "paste" event is fired before input is updated
771
- setTimeout(_this6._handleKeyupEvent);
792
+ setTimeout(_this5._handleKeyupEvent);
772
793
  };
773
794
  this.telInput.addEventListener("cut", this._handleClipboardEvent);
774
795
  this.telInput.addEventListener("paste", this._handleClipboardEvent);
@@ -782,10 +803,10 @@
782
803
  }, {
783
804
  key: "_initBlurListeners",
784
805
  value: function _initBlurListeners() {
785
- var _this7 = this;
806
+ var _this6 = this;
786
807
  // on blur or form submit: if just a dial code then remove it
787
808
  this._handleSubmitOrBlurEvent = function() {
788
- _this7._removeEmptyDialCode();
809
+ _this6._removeEmptyDialCode();
789
810
  };
790
811
  if (this.telInput.form) {
791
812
  this.telInput.form.addEventListener("submit", this._handleSubmitOrBlurEvent);
@@ -811,10 +832,10 @@
811
832
  }, {
812
833
  key: "_trigger",
813
834
  value: function _trigger(name) {
814
- // have to use old school document.createEvent as IE11 doesn't support `new Event()` syntax
815
- var e = document.createEvent("Event");
816
- e.initEvent(name, true, true);
817
- // can bubble, and is cancellable
835
+ var e = new Event(name, {
836
+ bubbles: true,
837
+ cancelable: true
838
+ });
818
839
  this.telInput.dispatchEvent(e);
819
840
  }
820
841
  }, {
@@ -853,14 +874,14 @@
853
874
  }, {
854
875
  key: "_setDropdownPosition",
855
876
  value: function _setDropdownPosition() {
856
- var _this8 = this;
877
+ var _this7 = this;
857
878
  if (this.options.dropdownContainer) {
858
879
  this.options.dropdownContainer.appendChild(this.dropdown);
859
880
  }
860
881
  if (!this.options.useFullscreenPopup) {
861
882
  var pos = this.telInput.getBoundingClientRect();
862
883
  // windowTop from https://stackoverflow.com/a/14384091/217866
863
- var windowTop = window.pageYOffset || document.documentElement.scrollTop;
884
+ var windowTop = document.documentElement.scrollTop;
864
885
  var inputTop = pos.top + windowTop;
865
886
  var dropdownHeight = this.dropdownContent.offsetHeight;
866
887
  // dropdownFitsBelow = (dropdownBottom < windowBottom)
@@ -881,41 +902,31 @@
881
902
  this.dropdown.style.left = "".concat(pos.left + document.body.scrollLeft, "px");
882
903
  // close menu on window scroll
883
904
  this._handleWindowScroll = function() {
884
- return _this8._closeDropdown();
905
+ return _this7._closeDropdown();
885
906
  };
886
907
  window.addEventListener("scroll", this._handleWindowScroll);
887
908
  }
888
909
  }
889
910
  }
890
- }, {
891
- key: "_getClosestListItem",
892
- value: function _getClosestListItem(target) {
893
- var el = target;
894
- while (el && el !== this.countryList && !el.classList.contains("iti__country")) {
895
- el = el.parentNode;
896
- }
897
- // if we reached the countryList element, then return null
898
- return el === this.countryList ? null : el;
899
- }
900
911
  }, {
901
912
  key: "_bindDropdownListeners",
902
913
  value: function _bindDropdownListeners() {
903
- var _this9 = this;
914
+ var _this8 = this;
904
915
  // when mouse over a list item, just highlight that one
905
916
  // we add the class "highlight", so if they hit "enter" we know which one to select
906
917
  this._handleMouseoverCountryList = function(e) {
907
918
  // handle event delegation, as we're listening for this event on the countryList
908
- var listItem = _this9._getClosestListItem(e.target);
919
+ var listItem = e.target.closest(".iti__country");
909
920
  if (listItem) {
910
- _this9._highlightListItem(listItem, false);
921
+ _this8._highlightListItem(listItem, false);
911
922
  }
912
923
  };
913
924
  this.countryList.addEventListener("mouseover", this._handleMouseoverCountryList);
914
925
  // listen for country selection
915
926
  this._handleClickCountryList = function(e) {
916
- var listItem = _this9._getClosestListItem(e.target);
927
+ var listItem = e.target.closest(".iti__country");
917
928
  if (listItem) {
918
- _this9._selectListItem(listItem);
929
+ _this8._selectListItem(listItem);
919
930
  }
920
931
  };
921
932
  this.countryList.addEventListener("click", this._handleClickCountryList);
@@ -925,7 +936,7 @@
925
936
  var isOpening = true;
926
937
  this._handleClickOffToClose = function() {
927
938
  if (!isOpening) {
928
- _this9._closeDropdown();
939
+ _this8._closeDropdown();
929
940
  }
930
941
  isOpening = false;
931
942
  };
@@ -944,23 +955,23 @@
944
955
  e.stopPropagation();
945
956
  // up and down to navigate
946
957
  if (e.key === "ArrowUp" || e.key === "ArrowDown") {
947
- _this9._handleUpDownKey(e.key);
958
+ _this8._handleUpDownKey(e.key);
948
959
  } else if (e.key === "Enter") {
949
- _this9._handleEnterKey();
960
+ _this8._handleEnterKey();
950
961
  } else if (e.key === "Escape") {
951
- _this9._closeDropdown();
962
+ _this8._closeDropdown();
952
963
  }
953
964
  }
954
965
  // alpha chars to perform search
955
966
  // regex allows one latin alpha char or space, based on https://stackoverflow.com/a/26900132/217866)
956
- if (!_this9.options.countrySearch && /^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
967
+ if (!_this8.options.countrySearch && /^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
957
968
  e.stopPropagation();
958
969
  // jump to countries that start with the query string
959
970
  if (queryTimer) {
960
971
  clearTimeout(queryTimer);
961
972
  }
962
973
  query += e.key.toLowerCase();
963
- _this9._searchForCountry(query);
974
+ _this8._searchForCountry(query);
964
975
  // if the timer hits 1 second, reset the query
965
976
  queryTimer = setTimeout(function() {
966
977
  query = "";
@@ -970,11 +981,11 @@
970
981
  document.addEventListener("keydown", this._handleKeydownOnDropdown);
971
982
  if (this.options.countrySearch) {
972
983
  var doFilter = function doFilter() {
973
- var inputQuery = _this9.searchInput.value.trim();
984
+ var inputQuery = _this8.searchInput.value.trim();
974
985
  if (inputQuery) {
975
- _this9._filterCountries(inputQuery.toLowerCase());
986
+ _this8._filterCountries(inputQuery.toLowerCase());
976
987
  } else {
977
- _this9._filterCountries(null, true);
988
+ _this8._filterCountries(null, true);
978
989
  }
979
990
  };
980
991
  var keyupTimer = null;
@@ -1005,7 +1016,7 @@
1005
1016
  var c = this.countries[i];
1006
1017
  var nameLower = c.name.toLowerCase();
1007
1018
  var fullDialCode = "+".concat(c.dialCode);
1008
- if (isReset || nameLower.includes(query) || fullDialCode.includes(query)) {
1019
+ if (isReset || nameLower.includes(query) || fullDialCode.includes(query) || c.iso2.includes(query)) {
1009
1020
  this.countryList.appendChild(c.node);
1010
1021
  // highlight the first item
1011
1022
  if (isFirst) {
@@ -1067,7 +1078,7 @@
1067
1078
  value: function _updateValFromNumber(fullNumber) {
1068
1079
  var number = fullNumber;
1069
1080
  if (this.options.formatOnDisplay && window.intlTelInputUtils && this.selectedCountryData) {
1070
- var useNational = this.options.nationalMode || number.charAt(0) !== "+" && !this.options.separateDialCode;
1081
+ var useNational = this.options.nationalMode || number.charAt(0) !== "+" && !this.options.showSelectedDialCode;
1071
1082
  var _intlTelInputUtils$nu = intlTelInputUtils.numberFormat, NATIONAL = _intlTelInputUtils$nu.NATIONAL, INTERNATIONAL = _intlTelInputUtils$nu.INTERNATIONAL;
1072
1083
  var format = useNational ? NATIONAL : INTERNATIONAL;
1073
1084
  number = intlTelInputUtils.formatNumber(number, this.selectedCountryData.iso2, format);
@@ -1096,8 +1107,8 @@
1096
1107
  }
1097
1108
  number = "+".concat(number);
1098
1109
  }
1099
- // if separateDialCode enabled, then consider the selected dial code to be part of the number
1100
- if (this.options.separateDialCode && selectedDialCode && number.charAt(0) !== "+") {
1110
+ // if showSelectedDialCode enabled, then consider the selected dial code to be part of the number
1111
+ if (this.options.showSelectedDialCode && selectedDialCode && number.charAt(0) !== "+") {
1101
1112
  number = "+".concat(selectedDialCode).concat(number);
1102
1113
  }
1103
1114
  // try and extract valid dial code from input
@@ -1181,7 +1192,7 @@
1181
1192
  }, {
1182
1193
  key: "_setFlag",
1183
1194
  value: function _setFlag(countryCode) {
1184
- var _this$options3 = this.options, allowDropdown = _this$options3.allowDropdown, separateDialCode = _this$options3.separateDialCode, showFlags = _this$options3.showFlags;
1195
+ var _this$options3 = this.options, allowDropdown = _this$options3.allowDropdown, showSelectedDialCode = _this$options3.showSelectedDialCode, showFlags = _this$options3.showFlags;
1185
1196
  var prevCountry = this.selectedCountryData.iso2 ? this.selectedCountryData : {};
1186
1197
  // do this first as it will throw an error and stop if countryCode is invalid
1187
1198
  this.selectedCountryData = countryCode ? this._getCountryData(countryCode, false, false) : {};
@@ -1192,8 +1203,8 @@
1192
1203
  if (showFlags) {
1193
1204
  this.selectedFlagInner.setAttribute("class", "iti__flag iti__".concat(countryCode));
1194
1205
  }
1195
- this._setSelectedCountryFlagTitleAttribute(countryCode, separateDialCode);
1196
- if (separateDialCode) {
1206
+ this._setSelectedCountryFlagTitleAttribute(countryCode, showSelectedDialCode);
1207
+ if (showSelectedDialCode) {
1197
1208
  var dialCode = this.selectedCountryData.dialCode ? "+".concat(this.selectedCountryData.dialCode) : "";
1198
1209
  this.selectedDialCode.innerHTML = dialCode;
1199
1210
  // offsetWidth is zero if input is in a hidden container during initialisation
@@ -1227,12 +1238,12 @@
1227
1238
  }
1228
1239
  }, {
1229
1240
  key: "_setSelectedCountryFlagTitleAttribute",
1230
- value: function _setSelectedCountryFlagTitleAttribute(countryCode, separateDialCode) {
1241
+ value: function _setSelectedCountryFlagTitleAttribute(countryCode, showSelectedDialCode) {
1231
1242
  if (!this.selectedFlag) {
1232
1243
  return;
1233
1244
  }
1234
1245
  var title;
1235
- if (countryCode && !separateDialCode) {
1246
+ if (countryCode && !showSelectedDialCode) {
1236
1247
  title = "".concat(this.selectedCountryData.name, ": +").concat(this.selectedCountryData.dialCode);
1237
1248
  } else if (countryCode) {
1238
1249
  // For screen reader output, we don't want to include the dial code in the reader output twice
@@ -1282,10 +1293,6 @@
1282
1293
  this._updateDialCode(listItem.getAttribute("data-dial-code"));
1283
1294
  // focus the input
1284
1295
  this.telInput.focus();
1285
- // put cursor at end - this fix is required for FF and IE11 (with auto inserting dial code),
1286
- // who try to put the cursor at the beginning the first time
1287
- var len = this.telInput.value.length;
1288
- this.telInput.setSelectionRange(len, len);
1289
1296
  if (flagChanged) {
1290
1297
  this._triggerCountryChange();
1291
1298
  }
@@ -1322,7 +1329,7 @@
1322
1329
  value: function _scrollTo(element, middle) {
1323
1330
  var container = this.dropdownContent;
1324
1331
  // windowTop from https://stackoverflow.com/a/14384091/217866
1325
- var windowTop = window.pageYOffset || document.documentElement.scrollTop;
1332
+ var windowTop = document.documentElement.scrollTop;
1326
1333
  var containerHeight = container.offsetHeight;
1327
1334
  var containerTop = container.getBoundingClientRect().top + windowTop;
1328
1335
  var containerBottom = containerTop + containerHeight;
@@ -1417,8 +1424,8 @@
1417
1424
  var dialCode = this.selectedCountryData.dialCode;
1418
1425
  var prefix;
1419
1426
  var numericVal = this._getNumeric(val);
1420
- if (this.options.separateDialCode && val.charAt(0) !== "+" && dialCode && numericVal) {
1421
- // when using separateDialCode, it is visible so is effectively part of the typed number
1427
+ if (this.options.showSelectedDialCode && val.charAt(0) !== "+" && dialCode && numericVal) {
1428
+ // when using showSelectedDialCode, it is visible so is effectively part of the typed number
1422
1429
  prefix = "+".concat(dialCode);
1423
1430
  } else {
1424
1431
  prefix = "";
@@ -1429,7 +1436,7 @@
1429
1436
  key: "_beforeSetNumber",
1430
1437
  value: function _beforeSetNumber(fullNumber) {
1431
1438
  var number = fullNumber;
1432
- if (this.options.separateDialCode) {
1439
+ if (this.options.showSelectedDialCode) {
1433
1440
  var dialCode = this._getDialCode(number);
1434
1441
  // if there is a valid dial code
1435
1442
  if (dialCode) {
@@ -1487,7 +1494,7 @@
1487
1494
  this.selectedFlag.removeEventListener("click", this._handleClickSelectedFlag);
1488
1495
  this.flagsContainer.removeEventListener("keydown", this._handleFlagsContainerKeydown);
1489
1496
  // label click hack
1490
- var label = this._getClosestLabel();
1497
+ var label = this.telInput.closest("label");
1491
1498
  if (label) {
1492
1499
  label.removeEventListener("click", this._handleLabelClick);
1493
1500
  }
@@ -1558,13 +1565,13 @@
1558
1565
  key: "isValidNumber",
1559
1566
  value: function isValidNumber() {
1560
1567
  var val = this._getFullNumber().trim();
1561
- return window.intlTelInputUtils ? intlTelInputUtils.isValidNumber(val, this.selectedCountryData.iso2) : null;
1568
+ return window.intlTelInputUtils ? intlTelInputUtils.isPossibleNumber(val, this.selectedCountryData.iso2) : null;
1562
1569
  }
1563
1570
  }, {
1564
- key: "isPossibleNumber",
1565
- value: function isPossibleNumber() {
1571
+ key: "isValidNumberPrecise",
1572
+ value: function isValidNumberPrecise() {
1566
1573
  var val = this._getFullNumber().trim();
1567
- return window.intlTelInputUtils ? intlTelInputUtils.isPossibleNumber(val, this.selectedCountryData.iso2) : null;
1574
+ return window.intlTelInputUtils ? intlTelInputUtils.isValidNumber(val, this.selectedCountryData.iso2) : null;
1568
1575
  }
1569
1576
  }, {
1570
1577
  key: "setCountry",
@@ -1647,7 +1654,7 @@
1647
1654
  // default options
1648
1655
  intlTelInputGlobals.defaults = defaults;
1649
1656
  // version
1650
- intlTelInputGlobals.version = "18.5.3";
1657
+ intlTelInputGlobals.version = "19.0.0";
1651
1658
  // convenience wrapper
1652
1659
  return function(input, options) {
1653
1660
  var iti = new Iti(input, options);