intl-tel-input 25.13.0 → 25.13.2

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.
package/README.md CHANGED
@@ -81,16 +81,16 @@ _Note: We have now dropped support for all versions of Internet Explorer because
81
81
  ## Getting Started (Using a CDN)
82
82
  1. Add the CSS
83
83
  ```html
84
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/css/intlTelInput.css">
84
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/css/intlTelInput.css">
85
85
  ```
86
86
 
87
87
  2. Add the plugin script and initialise it on your input element
88
88
  ```html
89
- <script src="https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/js/intlTelInput.min.js"></script>
89
+ <script src="https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/js/intlTelInput.min.js"></script>
90
90
  <script>
91
91
  const input = document.querySelector("#phone");
92
92
  window.intlTelInput(input, {
93
- loadUtils: () => import("https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/js/utils.js"),
93
+ loadUtils: () => import("https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/js/utils.js"),
94
94
  });
95
95
  </script>
96
96
  ```
@@ -328,12 +328,12 @@ Set the initial country selection by specifying its country code, e.g. `"us"` fo
328
328
  Type: `() => Promise<module>` Default: `null`
329
329
  This is one way to lazy load the included utils.js (to enable formatting/validation, etc) - see [Loading The Utilities Script](#loading-the-utilities-script) for more options.
330
330
 
331
- The `loadUtils` option takes a function that returns a Promise resolving to the utils module (see example code below). You can `import` the utils module in different ways: (A) from a CDN, (B) from your own hosted version of [utils.js](https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/js/utils.js), or (C) if you use a bundler like Webpack, Vite or Parcel, you can import it directly from the package.
331
+ The `loadUtils` option takes a function that returns a Promise resolving to the utils module (see example code below). You can `import` the utils module in different ways: (A) from a CDN, (B) from your own hosted version of [utils.js](https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/js/utils.js), or (C) if you use a bundler like Webpack, Vite or Parcel, you can import it directly from the package.
332
332
 
333
333
  ```js
334
334
  // (A) import utils module from a CDN
335
335
  intlTelInput(htmlInputElement, {
336
- loadUtils: () => import("https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/js/utils.js"),
336
+ loadUtils: () => import("https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/js/utils.js"),
337
337
  });
338
338
 
339
339
  // (B) import utils module from your own hosted version of utils.js
package/angular/README.md CHANGED
@@ -54,7 +54,7 @@ import "intl-tel-input/styles";
54
54
 
55
55
  See the [validation demo](https://github.com/jackocnr/intl-tel-input/blob/master/angular/demo/validation/validation.component.ts) for a more fleshed-out example of how to handle validation, or check out the [form demo](https://github.com/jackocnr/intl-tel-input/blob/master/angular/demo/form/form.component.ts) for an alternative approach using `ReactiveFormsModule`.
56
56
 
57
- A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just `import { IntlTelInputComponent } from "intl-tel-input/angularWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/angular"` import, then you should couple this with the `loadUtils` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `loadUtils` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.0/build/js/utils.js"`.
57
+ A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just `import { IntlTelInputComponent } from "intl-tel-input/angularWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/angular"` import, then you should couple this with the `loadUtils` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `loadUtils` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@25.13.2/build/js/utils.js"`.
58
58
 
59
59
  ## Props
60
60
 
@@ -2232,6 +2232,7 @@ var buildClearIcon = (id2) => {
2232
2232
  var UI = class {
2233
2233
  constructor(input, options, id2) {
2234
2234
  this.highlightedItem = null;
2235
+ this.selectedItem = null;
2235
2236
  input.dataset.intlTelInputId = id2.toString();
2236
2237
  this.telInput = input;
2237
2238
  this.options = options;
@@ -2432,8 +2433,7 @@ var UI = class {
2432
2433
  for (let i = 0; i < this.countries.length; i++) {
2433
2434
  const c = this.countries[i];
2434
2435
  const liClass = buildClassNames({
2435
- [CLASSES.COUNTRY_ITEM]: true,
2436
- [CLASSES.HIGHLIGHT]: i === 0
2436
+ [CLASSES.COUNTRY_ITEM]: true
2437
2437
  });
2438
2438
  const listItem = createEl("li", {
2439
2439
  id: `iti-${this.id}__item-${c.iso2}`,
@@ -2529,17 +2529,15 @@ var UI = class {
2529
2529
  container.scrollTop = newScrollTop - heightDifference;
2530
2530
  }
2531
2531
  }
2532
- //* Remove highlighting from other list items and highlight the given item.
2532
+ //* Remove highlighting from the previous list item and highlight the new one.
2533
2533
  highlightListItem(listItem, shouldFocus) {
2534
2534
  const prevItem = this.highlightedItem;
2535
2535
  if (prevItem) {
2536
2536
  prevItem.classList.remove(CLASSES.HIGHLIGHT);
2537
- prevItem.setAttribute(ARIA.SELECTED, "false");
2538
2537
  }
2539
2538
  this.highlightedItem = listItem;
2540
2539
  if (this.highlightedItem) {
2541
2540
  this.highlightedItem.classList.add(CLASSES.HIGHLIGHT);
2542
- this.highlightedItem.setAttribute(ARIA.SELECTED, "true");
2543
2541
  if (this.options.countrySearch) {
2544
2542
  const activeDescendant = this.highlightedItem.getAttribute("id") || "";
2545
2543
  this.searchInput.setAttribute(ARIA.ACTIVE_DESCENDANT, activeDescendant);
@@ -2549,6 +2547,19 @@ var UI = class {
2549
2547
  this.highlightedItem.focus();
2550
2548
  }
2551
2549
  }
2550
+ updateSelectedItem(iso2) {
2551
+ if (this.selectedItem && this.selectedItem.dataset.countryCode !== iso2) {
2552
+ this.selectedItem.setAttribute(ARIA.SELECTED, "false");
2553
+ this.selectedItem = null;
2554
+ }
2555
+ if (iso2 && !this.selectedItem) {
2556
+ const newListItem = this.countryList.querySelector(`[data-country-code="${iso2}"]`);
2557
+ if (newListItem) {
2558
+ newListItem.setAttribute(ARIA.SELECTED, "true");
2559
+ this.selectedItem = newListItem;
2560
+ }
2561
+ }
2562
+ }
2552
2563
  //* Country search: Filter the country list to the given array of countries.
2553
2564
  filterCountries(matchedCountries) {
2554
2565
  this.countryList.innerHTML = "";
@@ -2600,6 +2611,7 @@ var UI = class {
2600
2611
  this.hiddenInput = null;
2601
2612
  this.hiddenInputCountry = null;
2602
2613
  this.highlightedItem = null;
2614
+ this.selectedItem = null;
2603
2615
  for (const c of this.countries) {
2604
2616
  delete c.nodeById[this.id];
2605
2617
  }
@@ -2627,11 +2639,11 @@ var translateCountryNames = (countries, options) => {
2627
2639
  }
2628
2640
  }
2629
2641
  };
2630
- var processDialCodes = (countries, options) => {
2642
+ var processDialCodes = (countries) => {
2631
2643
  const dialCodes = /* @__PURE__ */ new Set();
2632
2644
  let dialCodeMaxLen = 0;
2633
2645
  const dialCodeToIso2Map = {};
2634
- const _addToDialCodeMap = (iso2, dialCode, priority) => {
2646
+ const _addToDialCodeMap = (iso2, dialCode) => {
2635
2647
  if (!iso2 || !dialCode) {
2636
2648
  return;
2637
2649
  }
@@ -2645,10 +2657,10 @@ var processDialCodes = (countries, options) => {
2645
2657
  if (iso2List.includes(iso2)) {
2646
2658
  return;
2647
2659
  }
2648
- const index = priority !== void 0 ? priority : iso2List.length;
2649
- iso2List[index] = iso2;
2660
+ iso2List.push(iso2);
2650
2661
  };
2651
- for (const c of countries) {
2662
+ const countriesSortedByPriority = [...countries].sort((a, b) => a.priority - b.priority);
2663
+ for (const c of countriesSortedByPriority) {
2652
2664
  if (!dialCodes.has(c.dialCode)) {
2653
2665
  dialCodes.add(c.dialCode);
2654
2666
  }
@@ -2656,14 +2668,7 @@ var processDialCodes = (countries, options) => {
2656
2668
  const partialDialCode = c.dialCode.substring(0, k);
2657
2669
  _addToDialCodeMap(c.iso2, partialDialCode);
2658
2670
  }
2659
- _addToDialCodeMap(c.iso2, c.dialCode, c.priority);
2660
- }
2661
- if (options.onlyCountries.length || options.excludeCountries.length) {
2662
- dialCodes.forEach((dialCode) => {
2663
- dialCodeToIso2Map[dialCode] = dialCodeToIso2Map[dialCode].filter(Boolean);
2664
- });
2665
- }
2666
- for (const c of countries) {
2671
+ _addToDialCodeMap(c.iso2, c.dialCode);
2667
2672
  if (c.areaCodes) {
2668
2673
  const rootIso2Code = dialCodeToIso2Map[c.dialCode][0];
2669
2674
  for (const areaCode of c.areaCodes) {
@@ -2795,7 +2800,7 @@ var Iti = class _Iti {
2795
2800
  this.isAndroid = _Iti._getIsAndroid();
2796
2801
  this.promise = this._createInitPromises();
2797
2802
  this.countries = processAllCountries(this.options);
2798
- const { dialCodes, dialCodeMaxLen, dialCodeToIso2Map } = processDialCodes(this.countries, this.options);
2803
+ const { dialCodes, dialCodeMaxLen, dialCodeToIso2Map } = processDialCodes(this.countries);
2799
2804
  this.dialCodes = dialCodes;
2800
2805
  this.dialCodeMaxLen = dialCodeMaxLen;
2801
2806
  this.dialCodeToIso2Map = dialCodeToIso2Map;
@@ -3463,11 +3468,14 @@ var Iti = class _Iti {
3463
3468
  }
3464
3469
  return null;
3465
3470
  }
3466
- //* Update the selected country, dial code (if separateDialCode), placeholder, title, and active list item.
3471
+ //* Update the selected country, dial code (if separateDialCode), placeholder, title, and selected list item.
3467
3472
  //* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
3468
3473
  _setCountry(iso2) {
3469
- const { separateDialCode, showFlags, i18n } = this.options;
3474
+ const { separateDialCode, showFlags, i18n, allowDropdown } = this.options;
3470
3475
  const prevIso2 = this.selectedCountryData.iso2 || "";
3476
+ if (allowDropdown) {
3477
+ this.ui.updateSelectedItem(iso2);
3478
+ }
3471
3479
  this.selectedCountryData = iso2 ? this.countryByIso2.get(iso2) : {};
3472
3480
  if (this.selectedCountryData.iso2) {
3473
3481
  this.defaultCountry = this.selectedCountryData.iso2;
@@ -3556,11 +3564,12 @@ var Iti = class _Iti {
3556
3564
  }
3557
3565
  this.ui.dropdownContent.classList.add(CLASSES.HIDE);
3558
3566
  this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "false");
3559
- if (this.ui.highlightedItem) {
3560
- this.ui.highlightedItem.setAttribute(ARIA.SELECTED, "false");
3561
- }
3562
3567
  if (this.options.countrySearch) {
3563
3568
  this.ui.searchInput.removeAttribute(ARIA.ACTIVE_DESCENDANT);
3569
+ if (this.ui.highlightedItem) {
3570
+ this.ui.highlightedItem.classList.remove(CLASSES.HIGHLIGHT);
3571
+ this.ui.highlightedItem = null;
3572
+ }
3564
3573
  }
3565
3574
  this.ui.dropdownArrow.classList.remove(CLASSES.ARROW_UP);
3566
3575
  this.dropdownAbortController.abort();
@@ -3866,7 +3875,7 @@ var intlTelInput = Object.assign((input, options) => {
3866
3875
  attachUtils,
3867
3876
  startedLoadingUtilsScript: false,
3868
3877
  startedLoadingAutoCountry: false,
3869
- version: "25.13.0"
3878
+ version: "25.13.2"
3870
3879
  });
3871
3880
  var intl_tel_input_default = intlTelInput;
3872
3881
 
@@ -2232,6 +2232,7 @@ var buildClearIcon = (id2) => {
2232
2232
  var UI = class {
2233
2233
  constructor(input, options, id2) {
2234
2234
  this.highlightedItem = null;
2235
+ this.selectedItem = null;
2235
2236
  input.dataset.intlTelInputId = id2.toString();
2236
2237
  this.telInput = input;
2237
2238
  this.options = options;
@@ -2432,8 +2433,7 @@ var UI = class {
2432
2433
  for (let i = 0; i < this.countries.length; i++) {
2433
2434
  const c = this.countries[i];
2434
2435
  const liClass = buildClassNames({
2435
- [CLASSES.COUNTRY_ITEM]: true,
2436
- [CLASSES.HIGHLIGHT]: i === 0
2436
+ [CLASSES.COUNTRY_ITEM]: true
2437
2437
  });
2438
2438
  const listItem = createEl("li", {
2439
2439
  id: `iti-${this.id}__item-${c.iso2}`,
@@ -2529,17 +2529,15 @@ var UI = class {
2529
2529
  container.scrollTop = newScrollTop - heightDifference;
2530
2530
  }
2531
2531
  }
2532
- //* Remove highlighting from other list items and highlight the given item.
2532
+ //* Remove highlighting from the previous list item and highlight the new one.
2533
2533
  highlightListItem(listItem, shouldFocus) {
2534
2534
  const prevItem = this.highlightedItem;
2535
2535
  if (prevItem) {
2536
2536
  prevItem.classList.remove(CLASSES.HIGHLIGHT);
2537
- prevItem.setAttribute(ARIA.SELECTED, "false");
2538
2537
  }
2539
2538
  this.highlightedItem = listItem;
2540
2539
  if (this.highlightedItem) {
2541
2540
  this.highlightedItem.classList.add(CLASSES.HIGHLIGHT);
2542
- this.highlightedItem.setAttribute(ARIA.SELECTED, "true");
2543
2541
  if (this.options.countrySearch) {
2544
2542
  const activeDescendant = this.highlightedItem.getAttribute("id") || "";
2545
2543
  this.searchInput.setAttribute(ARIA.ACTIVE_DESCENDANT, activeDescendant);
@@ -2549,6 +2547,19 @@ var UI = class {
2549
2547
  this.highlightedItem.focus();
2550
2548
  }
2551
2549
  }
2550
+ updateSelectedItem(iso2) {
2551
+ if (this.selectedItem && this.selectedItem.dataset.countryCode !== iso2) {
2552
+ this.selectedItem.setAttribute(ARIA.SELECTED, "false");
2553
+ this.selectedItem = null;
2554
+ }
2555
+ if (iso2 && !this.selectedItem) {
2556
+ const newListItem = this.countryList.querySelector(`[data-country-code="${iso2}"]`);
2557
+ if (newListItem) {
2558
+ newListItem.setAttribute(ARIA.SELECTED, "true");
2559
+ this.selectedItem = newListItem;
2560
+ }
2561
+ }
2562
+ }
2552
2563
  //* Country search: Filter the country list to the given array of countries.
2553
2564
  filterCountries(matchedCountries) {
2554
2565
  this.countryList.innerHTML = "";
@@ -2600,6 +2611,7 @@ var UI = class {
2600
2611
  this.hiddenInput = null;
2601
2612
  this.hiddenInputCountry = null;
2602
2613
  this.highlightedItem = null;
2614
+ this.selectedItem = null;
2603
2615
  for (const c of this.countries) {
2604
2616
  delete c.nodeById[this.id];
2605
2617
  }
@@ -2627,11 +2639,11 @@ var translateCountryNames = (countries, options) => {
2627
2639
  }
2628
2640
  }
2629
2641
  };
2630
- var processDialCodes = (countries, options) => {
2642
+ var processDialCodes = (countries) => {
2631
2643
  const dialCodes = /* @__PURE__ */ new Set();
2632
2644
  let dialCodeMaxLen = 0;
2633
2645
  const dialCodeToIso2Map = {};
2634
- const _addToDialCodeMap = (iso2, dialCode, priority) => {
2646
+ const _addToDialCodeMap = (iso2, dialCode) => {
2635
2647
  if (!iso2 || !dialCode) {
2636
2648
  return;
2637
2649
  }
@@ -2645,10 +2657,10 @@ var processDialCodes = (countries, options) => {
2645
2657
  if (iso2List.includes(iso2)) {
2646
2658
  return;
2647
2659
  }
2648
- const index = priority !== void 0 ? priority : iso2List.length;
2649
- iso2List[index] = iso2;
2660
+ iso2List.push(iso2);
2650
2661
  };
2651
- for (const c of countries) {
2662
+ const countriesSortedByPriority = [...countries].sort((a, b) => a.priority - b.priority);
2663
+ for (const c of countriesSortedByPriority) {
2652
2664
  if (!dialCodes.has(c.dialCode)) {
2653
2665
  dialCodes.add(c.dialCode);
2654
2666
  }
@@ -2656,14 +2668,7 @@ var processDialCodes = (countries, options) => {
2656
2668
  const partialDialCode = c.dialCode.substring(0, k);
2657
2669
  _addToDialCodeMap(c.iso2, partialDialCode);
2658
2670
  }
2659
- _addToDialCodeMap(c.iso2, c.dialCode, c.priority);
2660
- }
2661
- if (options.onlyCountries.length || options.excludeCountries.length) {
2662
- dialCodes.forEach((dialCode) => {
2663
- dialCodeToIso2Map[dialCode] = dialCodeToIso2Map[dialCode].filter(Boolean);
2664
- });
2665
- }
2666
- for (const c of countries) {
2671
+ _addToDialCodeMap(c.iso2, c.dialCode);
2667
2672
  if (c.areaCodes) {
2668
2673
  const rootIso2Code = dialCodeToIso2Map[c.dialCode][0];
2669
2674
  for (const areaCode of c.areaCodes) {
@@ -2795,7 +2800,7 @@ var Iti = class _Iti {
2795
2800
  this.isAndroid = _Iti._getIsAndroid();
2796
2801
  this.promise = this._createInitPromises();
2797
2802
  this.countries = processAllCountries(this.options);
2798
- const { dialCodes, dialCodeMaxLen, dialCodeToIso2Map } = processDialCodes(this.countries, this.options);
2803
+ const { dialCodes, dialCodeMaxLen, dialCodeToIso2Map } = processDialCodes(this.countries);
2799
2804
  this.dialCodes = dialCodes;
2800
2805
  this.dialCodeMaxLen = dialCodeMaxLen;
2801
2806
  this.dialCodeToIso2Map = dialCodeToIso2Map;
@@ -3463,11 +3468,14 @@ var Iti = class _Iti {
3463
3468
  }
3464
3469
  return null;
3465
3470
  }
3466
- //* Update the selected country, dial code (if separateDialCode), placeholder, title, and active list item.
3471
+ //* Update the selected country, dial code (if separateDialCode), placeholder, title, and selected list item.
3467
3472
  //* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
3468
3473
  _setCountry(iso2) {
3469
- const { separateDialCode, showFlags, i18n } = this.options;
3474
+ const { separateDialCode, showFlags, i18n, allowDropdown } = this.options;
3470
3475
  const prevIso2 = this.selectedCountryData.iso2 || "";
3476
+ if (allowDropdown) {
3477
+ this.ui.updateSelectedItem(iso2);
3478
+ }
3471
3479
  this.selectedCountryData = iso2 ? this.countryByIso2.get(iso2) : {};
3472
3480
  if (this.selectedCountryData.iso2) {
3473
3481
  this.defaultCountry = this.selectedCountryData.iso2;
@@ -3556,11 +3564,12 @@ var Iti = class _Iti {
3556
3564
  }
3557
3565
  this.ui.dropdownContent.classList.add(CLASSES.HIDE);
3558
3566
  this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "false");
3559
- if (this.ui.highlightedItem) {
3560
- this.ui.highlightedItem.setAttribute(ARIA.SELECTED, "false");
3561
- }
3562
3567
  if (this.options.countrySearch) {
3563
3568
  this.ui.searchInput.removeAttribute(ARIA.ACTIVE_DESCENDANT);
3569
+ if (this.ui.highlightedItem) {
3570
+ this.ui.highlightedItem.classList.remove(CLASSES.HIGHLIGHT);
3571
+ this.ui.highlightedItem = null;
3572
+ }
3564
3573
  }
3565
3574
  this.ui.dropdownArrow.classList.remove(CLASSES.ARROW_UP);
3566
3575
  this.dropdownAbortController.abort();
@@ -3866,7 +3875,7 @@ var intlTelInput = Object.assign((input, options) => {
3866
3875
  attachUtils,
3867
3876
  startedLoadingUtilsScript: false,
3868
3877
  startedLoadingAutoCountry: false,
3869
- version: "25.13.0"
3878
+ version: "25.13.2"
3870
3879
  });
3871
3880
  var intl_tel_input_default = intlTelInput;
3872
3881
 
@@ -1,4 +1,4 @@
1
- import { Country } from "../../intl-tel-input/data";
1
+ import { Country, Iso2 } from "../../intl-tel-input/data";
2
2
  import { AllOptions } from "../types/public-api";
3
3
  export default class UI {
4
4
  private readonly options;
@@ -23,6 +23,7 @@ export default class UI {
23
23
  hiddenInput: HTMLInputElement;
24
24
  hiddenInputCountry: HTMLInputElement;
25
25
  highlightedItem: HTMLElement | null;
26
+ selectedItem: HTMLElement | null;
26
27
  readonly hadInitialPlaceholder: boolean;
27
28
  constructor(input: HTMLInputElement, options: AllOptions, id: number);
28
29
  generateMarkup(countries: Country[]): void;
@@ -39,6 +40,7 @@ export default class UI {
39
40
  updateSearchResultsA11yText(): void;
40
41
  scrollTo(element: HTMLElement): void;
41
42
  highlightListItem(listItem: HTMLElement | null, shouldFocus: boolean): void;
43
+ updateSelectedItem(iso2: Iso2 | ""): void;
42
44
  filterCountries(matchedCountries: Country[]): void;
43
45
  destroy(): void;
44
46
  }
@@ -7,6 +7,6 @@ export interface DialCodeProcessingResult {
7
7
  }
8
8
  export declare const processAllCountries: (options: AllOptions) => Country[];
9
9
  export declare const translateCountryNames: (countries: Country[], options: AllOptions) => void;
10
- export declare const processDialCodes: (countries: Country[], options: AllOptions) => DialCodeProcessingResult;
10
+ export declare const processDialCodes: (countries: Country[]) => DialCodeProcessingResult;
11
11
  export declare const sortCountries: (countries: Country[], options: AllOptions) => void;
12
12
  export declare const cacheSearchTokens: (countries: Country[]) => void;
package/build/js/data.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*
2
- * International Telephone Input v25.13.0
2
+ * International Telephone Input v25.13.2
3
3
  * https://github.com/jackocnr/intl-tel-input.git
4
4
  * Licensed under the MIT license
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /*
2
- * International Telephone Input v25.13.0
2
+ * International Telephone Input v25.13.2
3
3
  * https://github.com/jackocnr/intl-tel-input.git
4
4
  * Licensed under the MIT license
5
5
  */
@@ -262,7 +262,7 @@ declare module "modules/core/icons" {
262
262
  export const buildClearIcon: (id: number) => string;
263
263
  }
264
264
  declare module "modules/core/ui" {
265
- import { Country } from "intl-tel-input/data";
265
+ import { Country, Iso2 } from "intl-tel-input/data";
266
266
  import { AllOptions } from "modules/types/public-api";
267
267
  export default class UI {
268
268
  private readonly options;
@@ -287,6 +287,7 @@ declare module "modules/core/ui" {
287
287
  hiddenInput: HTMLInputElement;
288
288
  hiddenInputCountry: HTMLInputElement;
289
289
  highlightedItem: HTMLElement | null;
290
+ selectedItem: HTMLElement | null;
290
291
  readonly hadInitialPlaceholder: boolean;
291
292
  constructor(input: HTMLInputElement, options: AllOptions, id: number);
292
293
  generateMarkup(countries: Country[]): void;
@@ -303,6 +304,7 @@ declare module "modules/core/ui" {
303
304
  updateSearchResultsA11yText(): void;
304
305
  scrollTo(element: HTMLElement): void;
305
306
  highlightListItem(listItem: HTMLElement | null, shouldFocus: boolean): void;
307
+ updateSelectedItem(iso2: Iso2 | ""): void;
306
308
  filterCountries(matchedCountries: Country[]): void;
307
309
  destroy(): void;
308
310
  }
@@ -317,7 +319,7 @@ declare module "modules/data/country-data" {
317
319
  }
318
320
  export const processAllCountries: (options: AllOptions) => Country[];
319
321
  export const translateCountryNames: (countries: Country[], options: AllOptions) => void;
320
- export const processDialCodes: (countries: Country[], options: AllOptions) => DialCodeProcessingResult;
322
+ export const processDialCodes: (countries: Country[]) => DialCodeProcessingResult;
321
323
  export const sortCountries: (countries: Country[], options: AllOptions) => void;
322
324
  export const cacheSearchTokens: (countries: Country[]) => void;
323
325
  }
@@ -1,5 +1,5 @@
1
1
  /*
2
- * International Telephone Input v25.13.0
2
+ * International Telephone Input v25.13.2
3
3
  * https://github.com/jackocnr/intl-tel-input.git
4
4
  * Licensed under the MIT license
5
5
  */
@@ -2277,6 +2277,7 @@ var factoryOutput = (() => {
2277
2277
  var UI = class {
2278
2278
  constructor(input, options, id2) {
2279
2279
  this.highlightedItem = null;
2280
+ this.selectedItem = null;
2280
2281
  input.dataset.intlTelInputId = id2.toString();
2281
2282
  this.telInput = input;
2282
2283
  this.options = options;
@@ -2538,8 +2539,7 @@ var factoryOutput = (() => {
2538
2539
  for (let i = 0; i < this.countries.length; i++) {
2539
2540
  const c = this.countries[i];
2540
2541
  const liClass = buildClassNames({
2541
- [CLASSES.COUNTRY_ITEM]: true,
2542
- [CLASSES.HIGHLIGHT]: i === 0
2542
+ [CLASSES.COUNTRY_ITEM]: true
2543
2543
  });
2544
2544
  const listItem = createEl("li", {
2545
2545
  id: `iti-${this.id}__item-${c.iso2}`,
@@ -2642,17 +2642,15 @@ var factoryOutput = (() => {
2642
2642
  container.scrollTop = newScrollTop - heightDifference;
2643
2643
  }
2644
2644
  }
2645
- //* Remove highlighting from other list items and highlight the given item.
2645
+ //* Remove highlighting from the previous list item and highlight the new one.
2646
2646
  highlightListItem(listItem, shouldFocus) {
2647
2647
  const prevItem = this.highlightedItem;
2648
2648
  if (prevItem) {
2649
2649
  prevItem.classList.remove(CLASSES.HIGHLIGHT);
2650
- prevItem.setAttribute(ARIA.SELECTED, "false");
2651
2650
  }
2652
2651
  this.highlightedItem = listItem;
2653
2652
  if (this.highlightedItem) {
2654
2653
  this.highlightedItem.classList.add(CLASSES.HIGHLIGHT);
2655
- this.highlightedItem.setAttribute(ARIA.SELECTED, "true");
2656
2654
  if (this.options.countrySearch) {
2657
2655
  const activeDescendant = this.highlightedItem.getAttribute("id") || "";
2658
2656
  this.searchInput.setAttribute(ARIA.ACTIVE_DESCENDANT, activeDescendant);
@@ -2662,6 +2660,21 @@ var factoryOutput = (() => {
2662
2660
  this.highlightedItem.focus();
2663
2661
  }
2664
2662
  }
2663
+ updateSelectedItem(iso2) {
2664
+ if (this.selectedItem && this.selectedItem.dataset.countryCode !== iso2) {
2665
+ this.selectedItem.setAttribute(ARIA.SELECTED, "false");
2666
+ this.selectedItem = null;
2667
+ }
2668
+ if (iso2 && !this.selectedItem) {
2669
+ const newListItem = this.countryList.querySelector(
2670
+ `[data-country-code="${iso2}"]`
2671
+ );
2672
+ if (newListItem) {
2673
+ newListItem.setAttribute(ARIA.SELECTED, "true");
2674
+ this.selectedItem = newListItem;
2675
+ }
2676
+ }
2677
+ }
2665
2678
  //* Country search: Filter the country list to the given array of countries.
2666
2679
  filterCountries(matchedCountries) {
2667
2680
  this.countryList.innerHTML = "";
@@ -2713,6 +2726,7 @@ var factoryOutput = (() => {
2713
2726
  this.hiddenInput = null;
2714
2727
  this.hiddenInputCountry = null;
2715
2728
  this.highlightedItem = null;
2729
+ this.selectedItem = null;
2716
2730
  for (const c of this.countries) {
2717
2731
  delete c.nodeById[this.id];
2718
2732
  }
@@ -2748,11 +2762,11 @@ var factoryOutput = (() => {
2748
2762
  }
2749
2763
  }
2750
2764
  };
2751
- var processDialCodes = (countries, options) => {
2765
+ var processDialCodes = (countries) => {
2752
2766
  const dialCodes = /* @__PURE__ */ new Set();
2753
2767
  let dialCodeMaxLen = 0;
2754
2768
  const dialCodeToIso2Map = {};
2755
- const _addToDialCodeMap = (iso2, dialCode, priority) => {
2769
+ const _addToDialCodeMap = (iso2, dialCode) => {
2756
2770
  if (!iso2 || !dialCode) {
2757
2771
  return;
2758
2772
  }
@@ -2766,10 +2780,10 @@ var factoryOutput = (() => {
2766
2780
  if (iso2List.includes(iso2)) {
2767
2781
  return;
2768
2782
  }
2769
- const index = priority !== void 0 ? priority : iso2List.length;
2770
- iso2List[index] = iso2;
2783
+ iso2List.push(iso2);
2771
2784
  };
2772
- for (const c of countries) {
2785
+ const countriesSortedByPriority = [...countries].sort((a, b) => a.priority - b.priority);
2786
+ for (const c of countriesSortedByPriority) {
2773
2787
  if (!dialCodes.has(c.dialCode)) {
2774
2788
  dialCodes.add(c.dialCode);
2775
2789
  }
@@ -2777,14 +2791,7 @@ var factoryOutput = (() => {
2777
2791
  const partialDialCode = c.dialCode.substring(0, k);
2778
2792
  _addToDialCodeMap(c.iso2, partialDialCode);
2779
2793
  }
2780
- _addToDialCodeMap(c.iso2, c.dialCode, c.priority);
2781
- }
2782
- if (options.onlyCountries.length || options.excludeCountries.length) {
2783
- dialCodes.forEach((dialCode) => {
2784
- dialCodeToIso2Map[dialCode] = dialCodeToIso2Map[dialCode].filter(Boolean);
2785
- });
2786
- }
2787
- for (const c of countries) {
2794
+ _addToDialCodeMap(c.iso2, c.dialCode);
2788
2795
  if (c.areaCodes) {
2789
2796
  const rootIso2Code = dialCodeToIso2Map[c.dialCode][0];
2790
2797
  for (const areaCode of c.areaCodes) {
@@ -2919,8 +2926,7 @@ var factoryOutput = (() => {
2919
2926
  this.promise = this._createInitPromises();
2920
2927
  this.countries = processAllCountries(this.options);
2921
2928
  const { dialCodes, dialCodeMaxLen, dialCodeToIso2Map } = processDialCodes(
2922
- this.countries,
2923
- this.options
2929
+ this.countries
2924
2930
  );
2925
2931
  this.dialCodes = dialCodes;
2926
2932
  this.dialCodeMaxLen = dialCodeMaxLen;
@@ -3649,11 +3655,14 @@ var factoryOutput = (() => {
3649
3655
  }
3650
3656
  return null;
3651
3657
  }
3652
- //* Update the selected country, dial code (if separateDialCode), placeholder, title, and active list item.
3658
+ //* Update the selected country, dial code (if separateDialCode), placeholder, title, and selected list item.
3653
3659
  //* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
3654
3660
  _setCountry(iso2) {
3655
- const { separateDialCode, showFlags, i18n } = this.options;
3661
+ const { separateDialCode, showFlags, i18n, allowDropdown } = this.options;
3656
3662
  const prevIso2 = this.selectedCountryData.iso2 || "";
3663
+ if (allowDropdown) {
3664
+ this.ui.updateSelectedItem(iso2);
3665
+ }
3657
3666
  this.selectedCountryData = iso2 ? this.countryByIso2.get(iso2) : {};
3658
3667
  if (this.selectedCountryData.iso2) {
3659
3668
  this.defaultCountry = this.selectedCountryData.iso2;
@@ -3760,11 +3769,12 @@ var factoryOutput = (() => {
3760
3769
  }
3761
3770
  this.ui.dropdownContent.classList.add(CLASSES.HIDE);
3762
3771
  this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "false");
3763
- if (this.ui.highlightedItem) {
3764
- this.ui.highlightedItem.setAttribute(ARIA.SELECTED, "false");
3765
- }
3766
3772
  if (this.options.countrySearch) {
3767
3773
  this.ui.searchInput.removeAttribute(ARIA.ACTIVE_DESCENDANT);
3774
+ if (this.ui.highlightedItem) {
3775
+ this.ui.highlightedItem.classList.remove(CLASSES.HIGHLIGHT);
3776
+ this.ui.highlightedItem = null;
3777
+ }
3768
3778
  }
3769
3779
  this.ui.dropdownArrow.classList.remove(CLASSES.ARROW_UP);
3770
3780
  this.dropdownAbortController.abort();
@@ -4101,7 +4111,7 @@ var factoryOutput = (() => {
4101
4111
  attachUtils,
4102
4112
  startedLoadingUtilsScript: false,
4103
4113
  startedLoadingAutoCountry: false,
4104
- version: "25.13.0"
4114
+ version: "25.13.2"
4105
4115
  }
4106
4116
  );
4107
4117
  var intl_tel_input_default = intlTelInput;