intl-tel-input 25.10.5 → 25.10.7

package/react/build/IntlTelInputWithUtils.cjs

@@ -1262,6 +1262,13 @@ var rawCountryData = [
     // Tuvalu
     "688"
   ],
+  [
+    "vi",
+    // U.S. Virgin Islands
+    "1",
+    24,
+    ["340"]
+  ],
   [
     "ug",
     // Uganda
@@ -1296,13 +1303,6 @@ var rawCountryData = [
     // Uruguay
     "598"
   ],
-  [
-    "vi",
-    // U.S. Virgin Islands
-    "1",
-    24,
-    ["340"]
-  ],
   [
     "uz",
     // Uzbekistan
@@ -1878,6 +1878,9 @@ var Iti = class _Iti {
   }
   //* Add a dial code to this.dialCodeToIso2Map.
   _addToDialCodeMap(iso2, dialCode, priority) {
+    if (!iso2 || !dialCode) {
+      return;
+    }
     if (dialCode.length > this.dialCodeMaxLen) {
       this.dialCodeMaxLen = dialCode.length;
     }
@@ -1932,6 +1935,11 @@ var Iti = class _Iti {
       }
       this._addToDialCodeMap(c.iso2, c.dialCode, c.priority);
     }
+    if (this.options.onlyCountries.length || this.options.excludeCountries.length) {
+      this.dialCodes.forEach((dialCode) => {
+        this.dialCodeToIso2Map[dialCode] = this.dialCodeToIso2Map[dialCode].filter(Boolean);
+      });
+    }
     for (const c of this.countries) {
       if (c.areaCodes) {
         const rootIso2Code = this.dialCodeToIso2Map[c.dialCode][0];
@@ -2350,7 +2358,7 @@ var Iti = class _Iti {
   _openDropdownWithPlus() {
     this._openDropdown();
     this.searchInput.value = "+";
-    this._filterCountries("", true);
+    this._filterCountries("");
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
@@ -2419,6 +2427,36 @@ var Iti = class _Iti {
       };
       this.telInput.addEventListener("keydown", this._handleKeydownEvent);
     }
+    if (strictMode) {
+      this._handlePasteEvent = (e) => {
+        e.preventDefault();
+        const input = this.telInput;
+        const selStart = input.selectionStart;
+        const selEnd = input.selectionEnd;
+        const pasted = e.clipboardData.getData("text");
+        const initialCharSelected = selStart === 0 && selEnd > 0;
+        const allowLeadingPlus = !input.value.startsWith("+") || initialCharSelected;
+        const allowedChars = pasted.replace(/[^0-9+]/g, "");
+        const hasLeadingPlus = allowedChars.startsWith("+");
+        const numerics = allowedChars.replace(/\+/g, "");
+        const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
+        let newVal = input.value.slice(0, selStart) + sanitised + input.value.slice(selEnd);
+        const coreNumber = intlTelInput.utils.getCoreNumber(newVal, this.selectedCountryData.iso2);
+        if (this.maxCoreNumberLength && coreNumber.length > this.maxCoreNumberLength) {
+          if (input.selectionEnd === input.value.length) {
+            const trimLength = coreNumber.length - this.maxCoreNumberLength;
+            newVal = newVal.slice(0, newVal.length - trimLength);
+          } else {
+            return;
+          }
+        }
+        input.value = newVal;
+        const caretPos = selStart + sanitised.length;
+        input.setSelectionRange(caretPos, caretPos);
+        input.dispatchEvent(new InputEvent("input", { bubbles: true }));
+      };
+      this.telInput.addEventListener("paste", this._handlePasteEvent);
+    }
   }
   //* Adhere to the input's maxlength attr.
   _cap(number) {
@@ -2533,11 +2571,7 @@ var Iti = class _Iti {
     if (this.options.countrySearch) {
       const doFilter = () => {
         const inputQuery = this.searchInput.value.trim();
-        if (inputQuery) {
-          this._filterCountries(inputQuery);
-        } else {
-          this._filterCountries("", true);
-        }
+        this._filterCountries(inputQuery);
         if (this.searchInput.value) {
           this.searchClearButton.classList.remove("iti__hide");
         } else {
@@ -2576,42 +2610,44 @@ var Iti = class _Iti {
     }
   }
   //* Country search enabled: Filter the countries according to the search query.
-  _filterCountries(query, isReset = false) {
+  _filterCountries(query) {
     let noCountriesAddedYet = true;
     this.countryList.innerHTML = "";
     const normalisedQuery = normaliseString(query);
-    const queryLength = normalisedQuery.length;
-    const iso2Matches = [];
-    const nameStartWith = [];
-    const nameContains = [];
-    const dialCodeMatches = [];
-    const dialCodeContains = [];
-    const initialsMatches = [];
-    for (const c of this.countries) {
-      if (isReset || queryLength === 0) {
-        nameContains.push(c);
-      } else if (c.iso2 === normalisedQuery) {
-        iso2Matches.push(c);
-      } else if (c.normalisedName.startsWith(normalisedQuery)) {
-        nameStartWith.push(c);
-      } else if (c.normalisedName.includes(normalisedQuery)) {
-        nameContains.push(c);
-      } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
-        dialCodeMatches.push(c);
-      } else if (c.dialCodePlus.includes(normalisedQuery)) {
-        dialCodeContains.push(c);
-      } else if (c.initials.includes(normalisedQuery)) {
-        initialsMatches.push(c);
+    let matchedCountries;
+    if (query === "") {
+      matchedCountries = this.countries;
+    } else {
+      const iso2Matches = [];
+      const nameStartWith = [];
+      const nameContains = [];
+      const dialCodeMatches = [];
+      const dialCodeContains = [];
+      const initialsMatches = [];
+      for (const c of this.countries) {
+        if (c.iso2 === normalisedQuery) {
+          iso2Matches.push(c);
+        } else if (c.normalisedName.startsWith(normalisedQuery)) {
+          nameStartWith.push(c);
+        } else if (c.normalisedName.includes(normalisedQuery)) {
+          nameContains.push(c);
+        } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
+          dialCodeMatches.push(c);
+        } else if (c.dialCodePlus.includes(normalisedQuery)) {
+          dialCodeContains.push(c);
+        } else if (c.initials.includes(normalisedQuery)) {
+          initialsMatches.push(c);
+        }
       }
+      matchedCountries = [
+        ...iso2Matches.sort((a, b) => a.priority - b.priority),
+        ...nameStartWith.sort((a, b) => a.priority - b.priority),
+        ...nameContains.sort((a, b) => a.priority - b.priority),
+        ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
+        ...dialCodeContains.sort((a, b) => a.priority - b.priority),
+        ...initialsMatches.sort((a, b) => a.priority - b.priority)
+      ];
     }
-    const matchedCountries = [
-      ...iso2Matches.sort((a, b) => a.priority - b.priority),
-      ...nameStartWith.sort((a, b) => a.priority - b.priority),
-      ...nameContains.sort((a, b) => a.priority - b.priority),
-      ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
-      ...dialCodeContains.sort((a, b) => a.priority - b.priority),
-      ...initialsMatches.sort((a, b) => a.priority - b.priority)
-    ];
     for (const c of matchedCountries) {
       const listItem = c.nodeById[this.id];
       if (listItem) {
@@ -2718,22 +2754,27 @@ var Iti = class _Iti {
     if (dialCodeMatch) {
       const dialCodeMatchNumeric = getNumeric(dialCodeMatch);
       const iso2Codes = this.dialCodeToIso2Map[dialCodeMatchNumeric];
+      if (iso2Codes.length === 1) {
+        if (iso2Codes[0] === selectedIso2) {
+          return null;
+        }
+        return iso2Codes[0];
+      }
       if (!selectedIso2 && this.defaultCountry && iso2Codes.includes(this.defaultCountry)) {
         return this.defaultCountry;
       }
+      const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
+      if (isRegionlessNanpNumber) {
+        return null;
+      }
       const hasAreaCodesButNoneMatched = this.selectedCountryData.areaCodes && numeric.length > dialCodeMatchNumeric.length;
       const alreadySelected = selectedIso2 && iso2Codes.includes(selectedIso2) && !hasAreaCodesButNoneMatched;
-      const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
-      if (!isRegionlessNanpNumber && !alreadySelected) {
-        for (const iso2 of iso2Codes) {
-          if (iso2) {
-            return iso2;
-          }
-        }
+      if (!alreadySelected) {
+        return iso2Codes[0];
       }
     } else if (number.charAt(0) === "+" && numeric.length) {
       return "";
-    } else if ((!number || number === "+") && !this.selectedCountryData.iso2) {
+    } else if ((!number || number === "+") && !selectedIso2) {
       return this.defaultCountry;
     }
     return null;
@@ -3104,6 +3145,9 @@ var Iti = class _Iti {
     if (this._handleKeydownEvent) {
       this.telInput.removeEventListener("keydown", this._handleKeydownEvent);
     }
+    if (this._handlePasteEvent) {
+      this.telInput.removeEventListener("paste", this._handlePasteEvent);
+    }
     this.telInput.removeAttribute("data-intl-tel-input-id");
     if (separateDialCode) {
       if (this.isRTL) {
@@ -3282,7 +3326,7 @@ var intlTelInput = Object.assign(
     attachUtils,
     startedLoadingUtilsScript: false,
     startedLoadingAutoCountry: false,
-    version: "25.10.5"
+    version: "25.10.7"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInputWithUtils.js

@@ -1226,6 +1226,13 @@ var rawCountryData = [
     // Tuvalu
     "688"
   ],
+  [
+    "vi",
+    // U.S. Virgin Islands
+    "1",
+    24,
+    ["340"]
+  ],
   [
     "ug",
     // Uganda
@@ -1260,13 +1267,6 @@ var rawCountryData = [
     // Uruguay
     "598"
   ],
-  [
-    "vi",
-    // U.S. Virgin Islands
-    "1",
-    24,
-    ["340"]
-  ],
   [
     "uz",
     // Uzbekistan
@@ -1842,6 +1842,9 @@ var Iti = class _Iti {
   }
   //* Add a dial code to this.dialCodeToIso2Map.
   _addToDialCodeMap(iso2, dialCode, priority) {
+    if (!iso2 || !dialCode) {
+      return;
+    }
     if (dialCode.length > this.dialCodeMaxLen) {
       this.dialCodeMaxLen = dialCode.length;
     }
@@ -1896,6 +1899,11 @@ var Iti = class _Iti {
       }
       this._addToDialCodeMap(c.iso2, c.dialCode, c.priority);
     }
+    if (this.options.onlyCountries.length || this.options.excludeCountries.length) {
+      this.dialCodes.forEach((dialCode) => {
+        this.dialCodeToIso2Map[dialCode] = this.dialCodeToIso2Map[dialCode].filter(Boolean);
+      });
+    }
     for (const c of this.countries) {
       if (c.areaCodes) {
         const rootIso2Code = this.dialCodeToIso2Map[c.dialCode][0];
@@ -2314,7 +2322,7 @@ var Iti = class _Iti {
   _openDropdownWithPlus() {
     this._openDropdown();
     this.searchInput.value = "+";
-    this._filterCountries("", true);
+    this._filterCountries("");
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
@@ -2383,6 +2391,36 @@ var Iti = class _Iti {
       };
       this.telInput.addEventListener("keydown", this._handleKeydownEvent);
     }
+    if (strictMode) {
+      this._handlePasteEvent = (e) => {
+        e.preventDefault();
+        const input = this.telInput;
+        const selStart = input.selectionStart;
+        const selEnd = input.selectionEnd;
+        const pasted = e.clipboardData.getData("text");
+        const initialCharSelected = selStart === 0 && selEnd > 0;
+        const allowLeadingPlus = !input.value.startsWith("+") || initialCharSelected;
+        const allowedChars = pasted.replace(/[^0-9+]/g, "");
+        const hasLeadingPlus = allowedChars.startsWith("+");
+        const numerics = allowedChars.replace(/\+/g, "");
+        const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
+        let newVal = input.value.slice(0, selStart) + sanitised + input.value.slice(selEnd);
+        const coreNumber = intlTelInput.utils.getCoreNumber(newVal, this.selectedCountryData.iso2);
+        if (this.maxCoreNumberLength && coreNumber.length > this.maxCoreNumberLength) {
+          if (input.selectionEnd === input.value.length) {
+            const trimLength = coreNumber.length - this.maxCoreNumberLength;
+            newVal = newVal.slice(0, newVal.length - trimLength);
+          } else {
+            return;
+          }
+        }
+        input.value = newVal;
+        const caretPos = selStart + sanitised.length;
+        input.setSelectionRange(caretPos, caretPos);
+        input.dispatchEvent(new InputEvent("input", { bubbles: true }));
+      };
+      this.telInput.addEventListener("paste", this._handlePasteEvent);
+    }
   }
   //* Adhere to the input's maxlength attr.
   _cap(number) {
@@ -2497,11 +2535,7 @@ var Iti = class _Iti {
     if (this.options.countrySearch) {
       const doFilter = () => {
         const inputQuery = this.searchInput.value.trim();
-        if (inputQuery) {
-          this._filterCountries(inputQuery);
-        } else {
-          this._filterCountries("", true);
-        }
+        this._filterCountries(inputQuery);
         if (this.searchInput.value) {
           this.searchClearButton.classList.remove("iti__hide");
         } else {
@@ -2540,42 +2574,44 @@ var Iti = class _Iti {
     }
   }
   //* Country search enabled: Filter the countries according to the search query.
-  _filterCountries(query, isReset = false) {
+  _filterCountries(query) {
     let noCountriesAddedYet = true;
     this.countryList.innerHTML = "";
     const normalisedQuery = normaliseString(query);
-    const queryLength = normalisedQuery.length;
-    const iso2Matches = [];
-    const nameStartWith = [];
-    const nameContains = [];
-    const dialCodeMatches = [];
-    const dialCodeContains = [];
-    const initialsMatches = [];
-    for (const c of this.countries) {
-      if (isReset || queryLength === 0) {
-        nameContains.push(c);
-      } else if (c.iso2 === normalisedQuery) {
-        iso2Matches.push(c);
-      } else if (c.normalisedName.startsWith(normalisedQuery)) {
-        nameStartWith.push(c);
-      } else if (c.normalisedName.includes(normalisedQuery)) {
-        nameContains.push(c);
-      } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
-        dialCodeMatches.push(c);
-      } else if (c.dialCodePlus.includes(normalisedQuery)) {
-        dialCodeContains.push(c);
-      } else if (c.initials.includes(normalisedQuery)) {
-        initialsMatches.push(c);
+    let matchedCountries;
+    if (query === "") {
+      matchedCountries = this.countries;
+    } else {
+      const iso2Matches = [];
+      const nameStartWith = [];
+      const nameContains = [];
+      const dialCodeMatches = [];
+      const dialCodeContains = [];
+      const initialsMatches = [];
+      for (const c of this.countries) {
+        if (c.iso2 === normalisedQuery) {
+          iso2Matches.push(c);
+        } else if (c.normalisedName.startsWith(normalisedQuery)) {
+          nameStartWith.push(c);
+        } else if (c.normalisedName.includes(normalisedQuery)) {
+          nameContains.push(c);
+        } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
+          dialCodeMatches.push(c);
+        } else if (c.dialCodePlus.includes(normalisedQuery)) {
+          dialCodeContains.push(c);
+        } else if (c.initials.includes(normalisedQuery)) {
+          initialsMatches.push(c);
+        }
       }
+      matchedCountries = [
+        ...iso2Matches.sort((a, b) => a.priority - b.priority),
+        ...nameStartWith.sort((a, b) => a.priority - b.priority),
+        ...nameContains.sort((a, b) => a.priority - b.priority),
+        ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
+        ...dialCodeContains.sort((a, b) => a.priority - b.priority),
+        ...initialsMatches.sort((a, b) => a.priority - b.priority)
+      ];
     }
-    const matchedCountries = [
-      ...iso2Matches.sort((a, b) => a.priority - b.priority),
-      ...nameStartWith.sort((a, b) => a.priority - b.priority),
-      ...nameContains.sort((a, b) => a.priority - b.priority),
-      ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
-      ...dialCodeContains.sort((a, b) => a.priority - b.priority),
-      ...initialsMatches.sort((a, b) => a.priority - b.priority)
-    ];
     for (const c of matchedCountries) {
       const listItem = c.nodeById[this.id];
       if (listItem) {
@@ -2682,22 +2718,27 @@ var Iti = class _Iti {
     if (dialCodeMatch) {
       const dialCodeMatchNumeric = getNumeric(dialCodeMatch);
       const iso2Codes = this.dialCodeToIso2Map[dialCodeMatchNumeric];
+      if (iso2Codes.length === 1) {
+        if (iso2Codes[0] === selectedIso2) {
+          return null;
+        }
+        return iso2Codes[0];
+      }
       if (!selectedIso2 && this.defaultCountry && iso2Codes.includes(this.defaultCountry)) {
         return this.defaultCountry;
       }
+      const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
+      if (isRegionlessNanpNumber) {
+        return null;
+      }
       const hasAreaCodesButNoneMatched = this.selectedCountryData.areaCodes && numeric.length > dialCodeMatchNumeric.length;
       const alreadySelected = selectedIso2 && iso2Codes.includes(selectedIso2) && !hasAreaCodesButNoneMatched;
-      const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
-      if (!isRegionlessNanpNumber && !alreadySelected) {
-        for (const iso2 of iso2Codes) {
-          if (iso2) {
-            return iso2;
-          }
-        }
+      if (!alreadySelected) {
+        return iso2Codes[0];
       }
     } else if (number.charAt(0) === "+" && numeric.length) {
       return "";
-    } else if ((!number || number === "+") && !this.selectedCountryData.iso2) {
+    } else if ((!number || number === "+") && !selectedIso2) {
       return this.defaultCountry;
     }
     return null;
@@ -3068,6 +3109,9 @@ var Iti = class _Iti {
     if (this._handleKeydownEvent) {
       this.telInput.removeEventListener("keydown", this._handleKeydownEvent);
     }
+    if (this._handlePasteEvent) {
+      this.telInput.removeEventListener("paste", this._handlePasteEvent);
+    }
     this.telInput.removeAttribute("data-intl-tel-input-id");
     if (separateDialCode) {
       if (this.isRTL) {
@@ -3246,7 +3290,7 @@ var intlTelInput = Object.assign(
     attachUtils,
     startedLoadingUtilsScript: false,
     startedLoadingAutoCountry: false,
-    version: "25.10.5"
+    version: "25.10.7"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/vue/README.md

@@ -34,7 +34,7 @@ See the [Validation demo](https://github.com/jackocnr/intl-tel-input/blob/master
 "vue:demo": "vite --config vue/demo/[demo variant]/vite.config.js"
 ```
 
-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 IntlTelInput from `"intl-tel-input/vueWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/vue"` 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.10.5/build/js/utils.js"`.
+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 IntlTelInput from `"intl-tel-input/vueWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/vue"` 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.10.7/build/js/utils.js"`.
 
 ## Props
 Here's a list of all of the current props you can pass to the IntlTelInput Vue component.