intl-tel-input 25.8.3 → 25.8.4

package/vue/build/IntlTelInput.mjs

@@ -1,4 +1,4 @@
-import { mergeModels as k, useModel as M, ref as N, onMounted as E, watch as B, onUnmounted as R, withDirectives as F, createElementBlock as z, openBlock as V, mergeProps as O, vModelText as j } from "vue";
+import { mergeModels as k, useModel as M, ref as D, onMounted as E, watch as B, onUnmounted as R, withDirectives as F, createElementBlock as V, openBlock as z, mergeProps as O, vModelText as j } from "vue";
 const $ = [
   [
     "af",
@@ -1323,17 +1323,17 @@ const $ = [
     "263"
   ]
 ], w = [];
-for (const d of $)
+for (const u of $)
   w.push({
     name: "",
     // populated in the plugin
-    iso2: d[0],
-    dialCode: d[1],
-    priority: d[2] || 0,
-    areaCodes: d[3] || null,
+    iso2: u[0],
+    dialCode: u[1],
+    priority: u[2] || 0,
+    areaCodes: u[3] || null,
     nodeById: {},
     // populated by the plugin
-    nationalPrefix: d[4] || null
+    nationalPrefix: u[4] || null
   });
 const U = {
   ad: "Andorra",
@@ -1591,13 +1591,13 @@ const U = {
   ac: "Ascension Island",
   xk: "Kosovo"
 }, T = { ...U, ...H };
-for (const d of w)
-  d.name = T[d.iso2];
+for (const u of w)
+  u.name = T[u.iso2];
 let K = 0;
-const S = (d) => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia(d).matches, W = () => {
+const N = (u) => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia(u).matches, W = () => {
   if (typeof navigator < "u" && typeof window < "u") {
-    const d = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), t = S("(max-width: 500px)"), e = S("(max-height: 600px)"), i = S("(pointer: coarse)");
-    return d || t || i && e;
+    const u = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), t = N("(max-width: 500px)"), e = N("(max-height: 600px)"), i = N("(pointer: coarse)");
+    return u || t || i && e;
   }
   return !1;
 }, x = {
@@ -1667,32 +1667,32 @@ const S = (d) => typeof window < "u" && typeof window.matchMedia == "function" &
   "887",
   "888",
   "889"
-], L = (d) => d.replace(/\D/g, ""), A = (d = "") => d.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase(), P = (d) => {
-  const t = L(d);
+], v = (u) => u.replace(/\D/g, ""), A = (u = "") => u.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase(), P = (u) => {
+  const t = v(u);
   if (t.charAt(0) === "1") {
     const e = t.substring(1, 4);
     return q.includes(e);
   }
   return !1;
-}, G = (d, t, e, i) => {
+}, G = (u, t, e, i) => {
   if (e === 0 && !i)
     return 0;
   let s = 0;
   for (let n = 0; n < t.length; n++) {
-    if (/[+0-9]/.test(t[n]) && s++, s === d && !i)
+    if (/[+0-9]/.test(t[n]) && s++, s === u && !i)
       return n + 1;
-    if (i && s === d + 1)
+    if (i && s === u + 1)
       return n;
   }
   return t.length;
-}, m = (d, t, e) => {
-  const i = document.createElement(d);
+}, C = (u, t, e) => {
+  const i = document.createElement(u);
   return t && Object.entries(t).forEach(([s, n]) => i.setAttribute(s, n)), e && e.appendChild(i), i;
-}, I = (d, ...t) => {
-  const { instances: e } = u;
-  Object.values(e).forEach((i) => i[d](...t));
+}, I = (u, ...t) => {
+  const { instances: e } = l;
+  Object.values(e).forEach((i) => i[u](...t));
 };
-class D {
+class L {
   /**
    * Build a space-delimited class string from an object map of className -> truthy/falsey.
    * Only keys with truthy values are included.
@@ -1732,9 +1732,9 @@ class D {
     this.options.countryOrder && (this.options.countryOrder = this.options.countryOrder.map((t) => t.toLowerCase())), this.countries.sort((t, e) => {
       const { countryOrder: i } = this.options;
       if (i) {
-        const s = i.indexOf(t.iso2), n = i.indexOf(e.iso2), l = s > -1, r = n > -1;
-        if (l || r)
-          return l && r ? s - n : l ? -1 : 1;
+        const s = i.indexOf(t.iso2), n = i.indexOf(e.iso2), r = s > -1, o = n > -1;
+        if (r || o)
+          return r && o ? s - n : r ? -1 : 1;
       }
       return t.name.localeCompare(e.name);
     });
@@ -1785,8 +1785,8 @@ class D {
         const e = this.dialCodeToIso2Map[t.dialCode][0];
         for (const i of t.areaCodes) {
           for (let s = 1; s < i.length; s++) {
-            const n = i.substring(0, s), l = t.dialCode + n;
-            this._addToDialCodeMap(e, l), this._addToDialCodeMap(t.iso2, l);
+            const n = i.substring(0, s), r = t.dialCode + n;
+            this._addToDialCodeMap(e, r), this._addToDialCodeMap(t.iso2, r);
           }
           this._addToDialCodeMap(t.iso2, t.dialCode + i);
         }
@@ -1794,7 +1794,7 @@ class D {
   }
   //* Generate all of the markup for the plugin: the selected country overlay, and the dropdown.
   _generateMarkup() {
-    var a, h, _;
+    var a, h, g;
     this.telInput.classList.add("iti__tel-input"), !this.telInput.hasAttribute("autocomplete") && !(this.telInput.form && this.telInput.form.hasAttribute("autocomplete")) && this.telInput.setAttribute("autocomplete", "off");
     const {
       allowDropdown: t,
@@ -1802,24 +1802,24 @@ class D {
       showFlags: i,
       containerClass: s,
       hiddenInput: n,
-      dropdownContainer: l,
-      fixDropdownWidth: r,
-      useFullscreenPopup: o,
-      countrySearch: c,
+      dropdownContainer: r,
+      fixDropdownWidth: o,
+      useFullscreenPopup: d,
+      countrySearch: y,
       i18n: p
-    } = this.options, C = D._buildClassNames({
+    } = this.options, c = L._buildClassNames({
       iti: !0,
       "iti--allow-dropdown": t,
       "iti--show-flags": i,
-      "iti--inline-dropdown": !o,
+      "iti--inline-dropdown": !d,
       [s]: !!s
-    }), y = m("div", { class: C });
-    if ((a = this.telInput.parentNode) == null || a.insertBefore(y, this.telInput), t || i || e) {
-      this.countryContainer = m(
+    }), m = C("div", { class: c });
+    if ((a = this.telInput.parentNode) == null || a.insertBefore(m, this.telInput), t || i || e) {
+      this.countryContainer = C(
         "div",
         { class: "iti__country-container" },
-        y
-      ), this.showSelectedCountryOnLeft ? this.countryContainer.style.left = "0px" : this.countryContainer.style.right = "0px", t ? (this.selectedCountry = m(
+        m
+      ), this.showSelectedCountryOnLeft ? this.countryContainer.style.left = "0px" : this.countryContainer.style.right = "0px", t ? (this.selectedCountry = C(
         "button",
         {
           type: "button",
@@ -1830,53 +1830,53 @@ class D {
           "aria-controls": `iti-${this.id}__dropdown-content`
         },
         this.countryContainer
-      ), this.telInput.disabled && this.selectedCountry.setAttribute("disabled", "true")) : this.selectedCountry = m(
+      ), this.telInput.disabled && this.selectedCountry.setAttribute("disabled", "true")) : this.selectedCountry = C(
         "div",
         { class: "iti__selected-country" },
         this.countryContainer
       );
-      const b = m(
+      const _ = C(
         "div",
         { class: "iti__selected-country-primary" },
         this.selectedCountry
       );
-      if (this.selectedCountryInner = m(
+      if (this.selectedCountryInner = C(
         "div",
         { class: "iti__flag" },
-        b
-      ), t && (this.dropdownArrow = m(
+        _
+      ), t && (this.dropdownArrow = C(
         "div",
         { class: "iti__arrow", "aria-hidden": "true" },
-        b
-      )), e && (this.selectedDialCode = m(
+        _
+      )), e && (this.selectedDialCode = C(
         "div",
         { class: "iti__selected-dial-code", dir: "ltr" },
         this.selectedCountry
       )), t) {
-        const f = r ? "" : "iti--flexible-dropdown-width";
-        if (this.dropdownContent = m("div", {
+        const b = o ? "" : "iti--flexible-dropdown-width";
+        if (this.dropdownContent = C("div", {
           id: `iti-${this.id}__dropdown-content`,
-          class: `iti__dropdown-content iti__hide ${f}`,
+          class: `iti__dropdown-content iti__hide ${b}`,
           role: "dialog",
           "aria-modal": "true"
-        }), c) {
-          const g = m(
+        }), y) {
+          const f = C(
             "div",
             { class: "iti__search-input-wrapper" },
             this.dropdownContent
           );
-          this.searchIcon = m(
+          this.searchIcon = C(
             "span",
             {
               class: "iti__search-icon",
               "aria-hidden": "true"
             },
-            g
+            f
           ), this.searchIcon.innerHTML = `
             <svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
               <circle cx="11" cy="11" r="7" />
               <line x1="21" y1="21" x2="16.65" y2="16.65" />
-            </svg>`, this.searchInput = m(
+            </svg>`, this.searchInput = C(
             "input",
             {
               id: `iti-${this.id}__search-input`,
@@ -1892,8 +1892,8 @@ class D {
               "aria-autocomplete": "list",
               autocomplete: "off"
             },
-            g
-          ), this.searchClearButton = m(
+            f
+          ), this.searchClearButton = C(
             "button",
             {
               type: "button",
@@ -1901,21 +1901,21 @@ class D {
               "aria-label": p.clearSearchAriaLabel,
               tabindex: "-1"
             },
-            g
+            f
           );
-          const v = `iti-${this.id}-clear-mask`;
+          const S = `iti-${this.id}-clear-mask`;
           this.searchClearButton.innerHTML = `
             <svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
-              <mask id="${v}" maskUnits="userSpaceOnUse">
+              <mask id="${S}" maskUnits="userSpaceOnUse">
                 <rect width="16" height="16" fill="white" />
                 <path d="M5.2 5.2 L10.8 10.8 M10.8 5.2 L5.2 10.8" stroke="black" stroke-linecap="round" class="iti__search-clear-x" />
               </mask>
-              <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${v})" />
-            </svg>`, this.searchResultsA11yText = m(
+              <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${S})" />
+            </svg>`, this.searchResultsA11yText = C(
             "span",
             { class: "iti__a11y-text" },
             this.dropdownContent
-          ), this.searchNoResults = m(
+          ), this.searchNoResults = C(
             "div",
             {
               class: "iti__no-results iti__hide",
@@ -1925,7 +1925,7 @@ class D {
             this.dropdownContent
           ), this.searchNoResults.textContent = p.zeroSearchResults;
         }
-        if (this.countryList = m(
+        if (this.countryList = C(
           "ul",
           {
             class: "iti__country-list",
@@ -1934,41 +1934,41 @@ class D {
             "aria-label": p.countryListAriaLabel
           },
           this.dropdownContent
-        ), this._appendListItems(), c && this._updateSearchResultsA11yText(), l) {
-          const g = D._buildClassNames({
+        ), this._appendListItems(), y && this._updateSearchResultsA11yText(), r) {
+          const f = L._buildClassNames({
             iti: !0,
             "iti--container": !0,
-            "iti--fullscreen-popup": o,
-            "iti--inline-dropdown": !o,
+            "iti--fullscreen-popup": d,
+            "iti--inline-dropdown": !d,
             [s]: !!s
           });
-          this.dropdown = m("div", { class: g }), this.dropdown.appendChild(this.dropdownContent);
+          this.dropdown = C("div", { class: f }), this.dropdown.appendChild(this.dropdownContent);
         } else
           this.countryContainer.appendChild(this.dropdownContent);
       }
     }
-    if (y.appendChild(this.telInput), this._updateInputPadding(), n) {
-      const b = this.telInput.getAttribute("name") || "", f = n(b);
-      if (f.phone) {
-        const g = (h = this.telInput.form) == null ? void 0 : h.querySelector(`input[name="${f.phone}"]`);
-        g ? this.hiddenInput = g : (this.hiddenInput = m("input", {
+    if (m.appendChild(this.telInput), this._updateInputPadding(), n) {
+      const _ = this.telInput.getAttribute("name") || "", b = n(_);
+      if (b.phone) {
+        const f = (h = this.telInput.form) == null ? void 0 : h.querySelector(`input[name="${b.phone}"]`);
+        f ? this.hiddenInput = f : (this.hiddenInput = C("input", {
           type: "hidden",
-          name: f.phone
-        }), y.appendChild(this.hiddenInput));
+          name: b.phone
+        }), m.appendChild(this.hiddenInput));
       }
-      if (f.country) {
-        const g = (_ = this.telInput.form) == null ? void 0 : _.querySelector(`input[name="${f.country}"]`);
-        g ? this.hiddenInputCountry = g : (this.hiddenInputCountry = m("input", {
+      if (b.country) {
+        const f = (g = this.telInput.form) == null ? void 0 : g.querySelector(`input[name="${b.country}"]`);
+        f ? this.hiddenInputCountry = f : (this.hiddenInputCountry = C("input", {
           type: "hidden",
-          name: f.country
-        }), y.appendChild(this.hiddenInputCountry));
+          name: b.country
+        }), m.appendChild(this.hiddenInputCountry));
       }
     }
   }
   //* For each country: add a country list item <li> to the countryList <ul> container.
   _appendListItems() {
     for (let t = 0; t < this.countries.length; t++) {
-      const e = this.countries[t], i = t === 0 ? "iti__highlight" : "", s = m(
+      const e = this.countries[t], i = t === 0 ? "iti__highlight" : "", s = C(
         "li",
         {
           id: `iti-${this.id}__item-${e.iso2}`,
@@ -1990,12 +1990,12 @@ class D {
   //* 1. Extracting a dial code from the given number
   //* 2. Using explicit initialCountry
   _setInitialState(t = !1) {
-    const e = this.telInput.getAttribute("value"), i = this.telInput.value, n = e && e.charAt(0) === "+" && (!i || i.charAt(0) !== "+") ? e : i, l = this._getDialCode(n), r = P(n), { initialCountry: o, geoIpLookup: c } = this.options, p = o === "auto" && c;
-    if (l && !r)
+    const e = this.telInput.getAttribute("value"), i = this.telInput.value, n = e && e.charAt(0) === "+" && (!i || i.charAt(0) !== "+") ? e : i, r = this._getDialCode(n), o = P(n), { initialCountry: d, geoIpLookup: y } = this.options, p = d === "auto" && y;
+    if (r && !o)
       this._updateCountryFromNumber(n);
     else if (!p || t) {
-      const C = o ? o.toLowerCase() : "";
-      C && this._getCountryData(C, !0) ? this._setCountry(C) : l && r ? this._setCountry("us") : this._setCountry();
+      const c = d ? d.toLowerCase() : "";
+      c && this._getCountryData(c, !0) ? this._setCountry(c) : r && o ? this._setCountry("us") : this._setCountry();
     }
     n && this._updateValFromNumber(n);
   }
@@ -2031,18 +2031,18 @@ class D {
   //* Init many requests: utils script / geo ip lookup.
   _initRequests() {
     let { loadUtils: t, initialCountry: e, geoIpLookup: i } = this.options;
-    t && !u.utils ? (this._handlePageLoad = () => {
+    t && !l.utils ? (this._handlePageLoad = () => {
       var n;
-      window.removeEventListener("load", this._handlePageLoad), (n = u.attachUtils(t)) == null || n.catch(() => {
+      window.removeEventListener("load", this._handlePageLoad), (n = l.attachUtils(t)) == null || n.catch(() => {
       });
-    }, u.documentReady() ? this._handlePageLoad() : window.addEventListener("load", this._handlePageLoad)) : this.resolveUtilsScriptPromise(), e === "auto" && i && !this.selectedCountryData.iso2 ? this._loadAutoCountry() : this.resolveAutoCountryPromise();
+    }, l.documentReady() ? this._handlePageLoad() : window.addEventListener("load", this._handlePageLoad)) : this.resolveUtilsScriptPromise(), e === "auto" && i && !this.selectedCountryData.iso2 ? this._loadAutoCountry() : this.resolveAutoCountryPromise();
   }
   //* Perform the geo ip lookup.
   _loadAutoCountry() {
-    u.autoCountry ? this.handleAutoCountry() : u.startedLoadingAutoCountry || (u.startedLoadingAutoCountry = !0, typeof this.options.geoIpLookup == "function" && this.options.geoIpLookup(
+    l.autoCountry ? this.handleAutoCountry() : l.startedLoadingAutoCountry || (l.startedLoadingAutoCountry = !0, typeof this.options.geoIpLookup == "function" && this.options.geoIpLookup(
       (t = "") => {
         const e = t.toLowerCase();
-        e && this._getCountryData(e, !0) ? (u.autoCountry = e, setTimeout(() => I("handleAutoCountry"))) : (this._setInitialState(!0), I("rejectAutoCountryPromise"));
+        e && this._getCountryData(e, !0) ? (l.autoCountry = e, setTimeout(() => I("handleAutoCountry"))) : (this._setInitialState(!0), I("rejectAutoCountryPromise"));
       },
       () => {
         this._setInitialState(!0), I("rejectAutoCountryPromise");
@@ -2054,31 +2054,31 @@ class D {
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
-    const { strictMode: t, formatAsYouType: e, separateDialCode: i, formatOnDisplay: s, allowDropdown: n, countrySearch: l } = this.options;
+    const { strictMode: t, formatAsYouType: e, separateDialCode: i, allowDropdown: s, countrySearch: n } = this.options;
     let r = !1;
     new RegExp("\\p{L}", "u").test(this.telInput.value) && (r = !0), this._handleInputEvent = (o) => {
-      if (this.isAndroid && (o == null ? void 0 : o.data) === "+" && i && n && l) {
-        const y = this.telInput.selectionStart || 0, a = this.telInput.value.substring(0, y - 1), h = this.telInput.value.substring(y);
-        this.telInput.value = a + h, this._openDropdownWithPlus();
+      if (this.isAndroid && (o == null ? void 0 : o.data) === "+" && i && s && n) {
+        const c = this.telInput.selectionStart || 0, m = this.telInput.value.substring(0, c - 1), a = this.telInput.value.substring(c);
+        this.telInput.value = m + a, this._openDropdownWithPlus();
         return;
       }
       this._updateCountryFromNumber(this.telInput.value) && this._triggerCountryChange();
-      const c = (o == null ? void 0 : o.data) && /[^+0-9]/.test(o.data), p = (o == null ? void 0 : o.inputType) === "insertFromPaste" && this.telInput.value;
-      c || p && !t ? r = !0 : /[^+0-9]/.test(this.telInput.value) || (r = !1);
-      const C = (o == null ? void 0 : o.detail) && o.detail.isSetNumber && !s;
-      if (e && !r && !C) {
-        const y = this.telInput.selectionStart || 0, h = this.telInput.value.substring(0, y).replace(/[^+0-9]/g, "").length, _ = (o == null ? void 0 : o.inputType) === "deleteContentForward", b = this._formatNumberAsYouType(), f = G(h, b, y, _);
-        this.telInput.value = b, this.telInput.setSelectionRange(f, f);
+      const d = (o == null ? void 0 : o.data) && /[^+0-9]/.test(o.data), y = (o == null ? void 0 : o.inputType) === "insertFromPaste" && this.telInput.value;
+      d || y && !t ? r = !0 : /[^+0-9]/.test(this.telInput.value) || (r = !1);
+      const p = (o == null ? void 0 : o.detail) && o.detail.isSetNumber;
+      if (e && !r && !p) {
+        const c = this.telInput.selectionStart || 0, a = this.telInput.value.substring(0, c).replace(/[^+0-9]/g, "").length, h = (o == null ? void 0 : o.inputType) === "deleteContentForward", g = this._formatNumberAsYouType(), _ = G(a, g, c, h);
+        this.telInput.value = g, this.telInput.setSelectionRange(_, _);
       }
     }, this.telInput.addEventListener("input", this._handleInputEvent), (t || i) && (this._handleKeydownEvent = (o) => {
       if (o.key && o.key.length === 1 && !o.altKey && !o.ctrlKey && !o.metaKey) {
-        if (i && n && l && o.key === "+") {
+        if (i && s && n && o.key === "+") {
           o.preventDefault(), this._openDropdownWithPlus();
           return;
         }
         if (t) {
-          const c = this.telInput.value, C = !(c.charAt(0) === "+") && this.telInput.selectionStart === 0 && o.key === "+", y = /^[0-9]$/.test(o.key), a = i ? y : C || y, h = c.slice(0, this.telInput.selectionStart) + o.key + c.slice(this.telInput.selectionEnd), _ = this._getFullNumber(h), b = u.utils.getCoreNumber(_, this.selectedCountryData.iso2), f = this.maxCoreNumberLength && b.length > this.maxCoreNumberLength, v = this._getNewCountryFromNumber(_) !== null;
-          (!a || f && !v && !C) && o.preventDefault();
+          const d = this.telInput.value, p = !(d.charAt(0) === "+") && this.telInput.selectionStart === 0 && o.key === "+", c = /^[0-9]$/.test(o.key), m = i ? c : p || c, a = d.slice(0, this.telInput.selectionStart) + o.key + d.slice(this.telInput.selectionEnd), h = this._getFullNumber(a), g = l.utils.getCoreNumber(h, this.selectedCountryData.iso2), _ = this.maxCoreNumberLength && g.length > this.maxCoreNumberLength, f = this._getNewCountryFromNumber(h) !== null;
+          (!m || _ && !f && !p) && o.preventDefault();
         }
       }
     }, this.telInput.addEventListener("keydown", this._handleKeydownEvent));
@@ -2167,18 +2167,18 @@ class D {
   _filterCountries(t, e = !1) {
     let i = !0;
     this.countryList.innerHTML = "";
-    const s = A(t), n = s.length, l = [], r = [], o = [], c = [], p = [], C = [];
+    const s = A(t), n = s.length, r = [], o = [], d = [], y = [], p = [], c = [];
     for (const a of this.countries)
-      e || n === 0 ? o.push(a) : a.iso2 === s ? l.push(a) : a.normalisedName.startsWith(s) ? r.push(a) : a.normalisedName.includes(s) ? o.push(a) : s === a.dialCode || s === a.dialCodePlus ? c.push(a) : a.dialCodePlus.includes(s) ? p.push(a) : a.initials.includes(s) && C.push(a);
-    const y = [
-      ...l.sort((a, h) => a.priority - h.priority),
+      e || n === 0 ? d.push(a) : a.iso2 === s ? r.push(a) : a.normalisedName.startsWith(s) ? o.push(a) : a.normalisedName.includes(s) ? d.push(a) : s === a.dialCode || s === a.dialCodePlus ? y.push(a) : a.dialCodePlus.includes(s) ? p.push(a) : a.initials.includes(s) && c.push(a);
+    const m = [
       ...r.sort((a, h) => a.priority - h.priority),
       ...o.sort((a, h) => a.priority - h.priority),
-      ...c.sort((a, h) => a.priority - h.priority),
+      ...d.sort((a, h) => a.priority - h.priority),
+      ...y.sort((a, h) => a.priority - h.priority),
       ...p.sort((a, h) => a.priority - h.priority),
-      ...C.sort((a, h) => a.priority - h.priority)
+      ...c.sort((a, h) => a.priority - h.priority)
     ];
-    for (const a of y) {
+    for (const a of m) {
       const h = a.nodeById[this.id];
       h && (this.countryList.appendChild(h), i && (this._highlightListItem(h, !1), i = !1));
     }
@@ -2204,12 +2204,12 @@ class D {
   //* NOTE: this is called from _setInitialState, handleUtils and setNumber.
   _updateValFromNumber(t) {
     let e = t;
-    if (this.options.formatOnDisplay && u.utils && this.selectedCountryData) {
-      const i = this.options.nationalMode || e.charAt(0) !== "+" && !this.options.separateDialCode, { NATIONAL: s, INTERNATIONAL: n } = u.utils.numberFormat, l = i ? s : n;
-      e = u.utils.formatNumber(
+    if (this.options.formatOnDisplay && l.utils && this.selectedCountryData) {
+      const i = this.options.nationalMode || e.charAt(0) !== "+" && !this.options.separateDialCode, { NATIONAL: s, INTERNATIONAL: n } = l.utils.numberFormat, r = i ? s : n;
+      e = l.utils.formatNumber(
         e,
         this.selectedCountryData.iso2,
-        l
+        r
       );
     }
     e = this._beforeSetNumber(e), this.telInput.value = e;
@@ -2224,8 +2224,8 @@ class D {
     const { dialCode: e, nationalPrefix: i } = this.selectedCountryData;
     if (t.charAt(0) === "+" || !e)
       return t;
-    const l = i && t.charAt(0) === i && !this.options.separateDialCode ? t.substring(1) : t;
-    return `+${e}${l}`;
+    const r = i && t.charAt(0) === i && !this.options.separateDialCode ? t.substring(1) : t;
+    return `+${e}${r}`;
   }
   // Get the country ISO2 code from the given number
   // BUT ONLY IF ITS CHANGED FROM THE CURRENTLY SELECTED COUNTRY
@@ -2235,19 +2235,19 @@ class D {
     let i = e ? t.substring(e) : t;
     const s = this.selectedCountryData.iso2, n = this.selectedCountryData.dialCode;
     i = this._ensureHasDialCode(i);
-    const l = this._getDialCode(i, !0), r = L(i);
-    if (l) {
-      const o = L(l), c = this.dialCodeToIso2Map[o];
-      if (!s && this.defaultCountry && c.includes(this.defaultCountry))
+    const r = this._getDialCode(i, !0), o = v(i);
+    if (r) {
+      const d = v(r), y = this.dialCodeToIso2Map[d];
+      if (!s && this.defaultCountry && y.includes(this.defaultCountry))
         return this.defaultCountry;
-      const p = this.selectedCountryData.areaCodes && r.length > o.length, C = s && c.includes(s) && !p;
-      if (!(n === "1" && P(r)) && !C) {
-        for (const a of c)
+      const p = this.selectedCountryData.areaCodes && o.length > d.length, c = s && y.includes(s) && !p;
+      if (!(n === "1" && P(o)) && !c) {
+        for (const a of y)
           if (a)
             return a;
       }
     } else {
-      if (i.charAt(0) === "+" && r.length)
+      if (i.charAt(0) === "+" && o.length)
         return "";
       if ((!i || i === "+") && !this.selectedCountryData.iso2)
         return this.defaultCountry;
@@ -2278,13 +2278,13 @@ class D {
   _setCountry(t) {
     const { separateDialCode: e, showFlags: i, i18n: s } = this.options, n = this.selectedCountryData.iso2 ? this.selectedCountryData : {};
     if (this.selectedCountryData = t ? this._getCountryData(t, !1) || {} : {}, this.selectedCountryData.iso2 && (this.defaultCountry = this.selectedCountryData.iso2), this.selectedCountry) {
-      const l = t && i ? `iti__flag iti__${t}` : "iti__flag iti__globe";
-      let r, o;
-      t ? (o = this.selectedCountryData.name, r = s.selectedCountryAriaLabel.replace("${country}", this.selectedCountryData.name)) : (o = s.noCountrySelected, r = s.noCountrySelected), this.selectedCountryInner.className = l, this.selectedCountry.setAttribute("title", o), this.selectedCountry.setAttribute("aria-label", r);
+      const r = t && i ? `iti__flag iti__${t}` : "iti__flag iti__globe";
+      let o, d;
+      t ? (d = this.selectedCountryData.name, o = s.selectedCountryAriaLabel.replace("${country}", this.selectedCountryData.name)) : (d = s.noCountrySelected, o = s.noCountrySelected), this.selectedCountryInner.className = r, this.selectedCountry.setAttribute("title", d), this.selectedCountry.setAttribute("aria-label", o);
     }
     if (e) {
-      const l = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
-      this.selectedDialCode.innerHTML = l, this._updateInputPadding();
+      const r = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
+      this.selectedDialCode.innerHTML = r, this._updateInputPadding();
     }
     return this._updatePlaceholder(), this._updateMaxLength(), n.iso2 !== t;
   }
@@ -2298,19 +2298,19 @@ class D {
   //* Update the maximum valid number length for the currently selected country.
   _updateMaxLength() {
     const { strictMode: t, placeholderNumberType: e, validationNumberTypes: i } = this.options, { iso2: s } = this.selectedCountryData;
-    if (t && u.utils)
+    if (t && l.utils)
       if (s) {
-        const n = u.utils.numberType[e];
-        let l = u.utils.getExampleNumber(
+        const n = l.utils.numberType[e];
+        let r = l.utils.getExampleNumber(
           s,
           !1,
           n,
           !0
-        ), r = l;
-        for (; u.utils.isPossibleNumber(l, s, i); )
-          r = l, l += "0";
-        const o = u.utils.getCoreNumber(r, s);
-        this.maxCoreNumberLength = o.length, s === "by" && (this.maxCoreNumberLength = o.length + 1);
+        ), o = r;
+        for (; l.utils.isPossibleNumber(r, s, i); )
+          o = r, r += "0";
+        const d = l.utils.getCoreNumber(o, s);
+        this.maxCoreNumberLength = d.length, s === "by" && (this.maxCoreNumberLength = d.length + 1);
       } else
         this.maxCoreNumberLength = null;
   }
@@ -2339,14 +2339,14 @@ class D {
       nationalMode: i,
       customPlaceholder: s
     } = this.options, n = t === "aggressive" || !this.hadInitialPlaceholder && t === "polite";
-    if (u.utils && n) {
-      const l = u.utils.numberType[e];
-      let r = this.selectedCountryData.iso2 ? u.utils.getExampleNumber(
+    if (l.utils && n) {
+      const r = l.utils.numberType[e];
+      let o = this.selectedCountryData.iso2 ? l.utils.getExampleNumber(
         this.selectedCountryData.iso2,
         i,
-        l
+        r
       ) : "";
-      r = this._beforeSetNumber(r), typeof s == "function" && (r = s(r, this.selectedCountryData)), this.telInput.setAttribute("placeholder", r);
+      o = this._beforeSetNumber(o), typeof s == "function" && (o = s(o, this.selectedCountryData)), this.telInput.setAttribute("placeholder", o);
     }
   }
   //* Called when the user selects a list item from the dropdown.
@@ -2354,7 +2354,7 @@ class D {
     const e = this._setCountry(
       t.getAttribute("data-country-code")
     );
-    this._closeDropdown(), this._updateDialCode(t.getAttribute("data-dial-code")), this.telInput.focus(), e && this._triggerCountryChange();
+    this._closeDropdown(), this._updateDialCode(t.getAttribute("data-dial-code")), this.options.formatOnDisplay && this._updateValFromNumber(this.telInput.value), this.telInput.focus(), e && this._triggerCountryChange();
   }
   //* Close the dropdown and unbind any listeners.
   _closeDropdown() {
@@ -2368,12 +2368,12 @@ class D {
   }
   //* Check if an element is visible within it's container, else scroll until it is.
   _scrollTo(t) {
-    const e = this.countryList, i = document.documentElement.scrollTop, s = e.offsetHeight, n = e.getBoundingClientRect().top + i, l = n + s, r = t.offsetHeight, o = t.getBoundingClientRect().top + i, c = o + r, p = o - n + e.scrollTop;
-    if (o < n)
+    const e = this.countryList, i = document.documentElement.scrollTop, s = e.offsetHeight, n = e.getBoundingClientRect().top + i, r = n + s, o = t.offsetHeight, d = t.getBoundingClientRect().top + i, y = d + o, p = d - n + e.scrollTop;
+    if (d < n)
       e.scrollTop = p;
-    else if (c > l) {
-      const C = s - r;
-      e.scrollTop = p - C;
+    else if (y > r) {
+      const c = s - o;
+      e.scrollTop = p - c;
     }
   }
   //* Replace any existing dial code with the new one
@@ -2393,9 +2393,9 @@ class D {
     if (t.charAt(0) === "+") {
       let s = "";
       for (let n = 0; n < t.length; n++) {
-        const l = t.charAt(n);
-        if (!isNaN(parseInt(l, 10))) {
-          if (s += l, e)
+        const r = t.charAt(n);
+        if (!isNaN(parseInt(r, 10))) {
+          if (s += r, e)
             this.dialCodeToIso2Map[s] && (i = t.substring(0, n + 1));
           else if (this.dialCodes.has(s)) {
             i = t.substring(0, n + 1);
@@ -2412,7 +2412,7 @@ class D {
   _getFullNumber(t) {
     const e = t || this.telInput.value.trim(), { dialCode: i } = this.selectedCountryData;
     let s;
-    const n = L(e);
+    const n = v(e);
     return this.options.separateDialCode && e.charAt(0) !== "+" && i && n ? s = `+${i}` : s = "", s + e;
   }
   //* Remove the dial code if separateDialCode is enabled also cap the length if the input has a maxlength attribute
@@ -2434,7 +2434,7 @@ class D {
   }
   //* Format the number as the user types.
   _formatNumberAsYouType() {
-    const t = this._getFullNumber(), e = u.utils ? u.utils.formatNumberAsYouType(t, this.selectedCountryData.iso2) : t, { dialCode: i } = this.selectedCountryData;
+    const t = this._getFullNumber(), e = l.utils ? l.utils.formatNumberAsYouType(t, this.selectedCountryData.iso2) : t, { dialCode: i } = this.selectedCountryData;
     return this.options.separateDialCode && this.telInput.value.charAt(0) !== "+" && e.includes(`+${i}`) ? (e.split(`+${i}`)[1] || "").trim() : e;
   }
   //**************************
@@ -2442,18 +2442,18 @@ class D {
   //**************************
   //* This is called when the geoip call returns.
   handleAutoCountry() {
-    this.options.initialCountry === "auto" && u.autoCountry && (this.defaultCountry = u.autoCountry, this.selectedCountryData.iso2 || this.selectedCountryInner.classList.contains("iti__globe") || this.setCountry(this.defaultCountry), this.resolveAutoCountryPromise());
+    this.options.initialCountry === "auto" && l.autoCountry && (this.defaultCountry = l.autoCountry, this.selectedCountryData.iso2 || this.selectedCountryInner.classList.contains("iti__globe") || this.setCountry(this.defaultCountry), this.resolveAutoCountryPromise());
   }
   //* This is called when the utils request completes.
   handleUtils() {
-    u.utils && (this.telInput.value && this._updateValFromNumber(this.telInput.value), this.selectedCountryData.iso2 && (this._updatePlaceholder(), this._updateMaxLength())), this.resolveUtilsScriptPromise();
+    l.utils && (this.telInput.value && this._updateValFromNumber(this.telInput.value), this.selectedCountryData.iso2 && (this._updatePlaceholder(), this._updateMaxLength())), this.resolveUtilsScriptPromise();
   }
   //********************
   //*  PUBLIC METHODS
   //********************
   //* Remove plugin.
   destroy() {
-    var n, l;
+    var n, r;
     this.telInput.iti = void 0;
     const { allowDropdown: t, separateDialCode: e } = this.options;
     if (t) {
@@ -2464,26 +2464,26 @@ class D {
         "keydown",
         this._handleCountryContainerKeydown
       );
-      const r = this.telInput.closest("label");
-      r && r.removeEventListener("click", this._handleLabelClick);
+      const o = this.telInput.closest("label");
+      o && o.removeEventListener("click", this._handleLabelClick);
     }
     const { form: i } = this.telInput;
     this._handleHiddenInputSubmit && i && i.removeEventListener("submit", this._handleHiddenInputSubmit), this.telInput.removeEventListener("input", this._handleInputEvent), this._handleKeydownEvent && this.telInput.removeEventListener("keydown", this._handleKeydownEvent), this.telInput.removeAttribute("data-intl-tel-input-id"), e && (this.isRTL ? this.telInput.style.paddingRight = this.originalPaddingRight : this.telInput.style.paddingLeft = this.originalPaddingLeft);
     const s = this.telInput.parentNode;
-    (n = s == null ? void 0 : s.parentNode) == null || n.insertBefore(this.telInput, s), (l = s == null ? void 0 : s.parentNode) == null || l.removeChild(s), delete u.instances[this.id];
+    (n = s == null ? void 0 : s.parentNode) == null || n.insertBefore(this.telInput, s), (r = s == null ? void 0 : s.parentNode) == null || r.removeChild(s), delete l.instances[this.id];
   }
   //* Get the extension from the current number.
   getExtension() {
-    return u.utils ? u.utils.getExtension(
+    return l.utils ? l.utils.getExtension(
       this._getFullNumber(),
       this.selectedCountryData.iso2
     ) : "";
   }
   //* Format the number to the given format.
   getNumber(t) {
-    if (u.utils) {
+    if (l.utils) {
       const { iso2: e } = this.selectedCountryData;
-      return u.utils.formatNumber(
+      return l.utils.formatNumber(
         this._getFullNumber(),
         e,
         t
@@ -2493,7 +2493,7 @@ class D {
   }
   //* Get the type of the entered number e.g. landline/mobile.
   getNumberType() {
-    return u.utils ? u.utils.getNumberType(
+    return l.utils ? l.utils.getNumberType(
       this._getFullNumber(),
       this.selectedCountryData.iso2
     ) : -99;
@@ -2504,9 +2504,9 @@ class D {
   }
   //* Get the validation error.
   getValidationError() {
-    if (u.utils) {
+    if (l.utils) {
       const { iso2: t } = this.selectedCountryData;
-      return u.utils.getValidationError(this._getFullNumber(), t);
+      return l.utils.getValidationError(this._getFullNumber(), t);
     }
     return -99;
   }
@@ -2519,7 +2519,7 @@ class D {
     return this._validateNumber(!0);
   }
   _utilsIsPossibleNumber(t) {
-    return u.utils ? u.utils.isPossibleNumber(t, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
+    return l.utils ? l.utils.isPossibleNumber(t, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
   }
   //* Shared internal validation logic to handle alpha character extension rules.
   _validateNumber(t) {
@@ -2527,18 +2527,18 @@ class D {
       return !1;
     const e = this._getFullNumber(), i = e.search(new RegExp("\\p{L}", "u")), s = (n) => t ? this._utilsIsValidNumber(n) : this._utilsIsPossibleNumber(n);
     if (i > -1) {
-      const n = e.substring(0, i), l = s(n), r = s(e);
-      return l && r;
+      const n = e.substring(0, i), r = s(n), o = s(e);
+      return r && o;
     }
     return s(e);
   }
   _utilsIsValidNumber(t) {
-    return u.utils ? u.utils.isValidNumber(t, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
+    return l.utils ? l.utils.isValidNumber(t, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
   }
   //* Update the selected country, and update the input val accordingly.
   setCountry(t) {
     const e = t == null ? void 0 : t.toLowerCase(), i = this.selectedCountryData.iso2;
-    (t && e !== i || !t && i) && (this._setCountry(e), this._updateDialCode(this.selectedCountryData.dialCode), this._triggerCountryChange());
+    (t && e !== i || !t && i) && (this._setCountry(e), this._updateDialCode(this.selectedCountryData.dialCode), this.options.formatOnDisplay && this._updateValFromNumber(this.telInput.value), this._triggerCountryChange());
   }
   //* Set the input value and update the country.
   setNumber(t) {
@@ -2553,31 +2553,31 @@ class D {
     this.telInput.disabled = t, t ? this.selectedCountry.setAttribute("disabled", "true") : this.selectedCountry.removeAttribute("disabled");
   }
 }
-const Y = (d) => {
-  if (!u.utils && !u.startedLoadingUtilsScript) {
+const Y = (u) => {
+  if (!l.utils && !l.startedLoadingUtilsScript) {
     let t;
-    if (typeof d == "function")
+    if (typeof u == "function")
       try {
-        t = Promise.resolve(d());
+        t = Promise.resolve(u());
       } catch (e) {
         return Promise.reject(e);
       }
     else
-      return Promise.reject(new TypeError(`The argument passed to attachUtils must be a function that returns a promise for the utilities module, not ${typeof d}`));
-    return u.startedLoadingUtilsScript = !0, t.then((e) => {
+      return Promise.reject(new TypeError(`The argument passed to attachUtils must be a function that returns a promise for the utilities module, not ${typeof u}`));
+    return l.startedLoadingUtilsScript = !0, t.then((e) => {
       const i = e == null ? void 0 : e.default;
       if (!i || typeof i != "object")
         throw new TypeError("The loader function passed to attachUtils did not resolve to a module object with utils as its default export.");
-      return u.utils = i, I("handleUtils"), !0;
+      return l.utils = i, I("handleUtils"), !0;
     }).catch((e) => {
       throw I("rejectUtilsScriptPromise", e), e;
     });
   }
   return null;
-}, u = Object.assign(
-  (d, t) => {
-    const e = new D(d, t);
-    return e._init(), d.setAttribute("data-intl-tel-input-id", e.id.toString()), u.instances[e.id] = e, d.iti = e, e;
+}, l = Object.assign(
+  (u, t) => {
+    const e = new L(u, t);
+    return e._init(), u.setAttribute("data-intl-tel-input-id", e.id.toString()), l.instances[e.id] = e, u.iti = e, e;
   },
   {
     defaults: x,
@@ -2586,16 +2586,16 @@ const Y = (d) => {
     //* Get the country data object.
     getCountryData: () => w,
     //* A getter for the plugin instance.
-    getInstance: (d) => {
-      const t = d.getAttribute("data-intl-tel-input-id");
-      return t ? u.instances[t] : null;
+    getInstance: (u) => {
+      const t = u.getAttribute("data-intl-tel-input-id");
+      return t ? l.instances[t] : null;
     },
     //* A map from instance ID to instance object.
     instances: {},
     attachUtils: Y,
     startedLoadingUtilsScript: !1,
     startedLoadingAutoCountry: !1,
-    version: "25.8.3"
+    version: "25.8.4"
   }
 ), Z = {
   __name: "IntlTelInput",
@@ -2629,39 +2629,39 @@ const Y = (d) => {
     "changeValidity",
     "changeErrorCode"
   ], ["update:modelValue"]),
-  setup(d, { expose: t, emit: e }) {
-    const i = M(d, "modelValue"), s = d, n = e, l = N(), r = N(), o = N(!1), c = () => r.value ? s.options.strictMode ? r.value.isValidNumberPrecise() : r.value.isValidNumber() : null, p = () => {
-      let a = c();
-      o.value !== a && (o.value = a, n("changeValidity", !!a), n(
+  setup(u, { expose: t, emit: e }) {
+    const i = M(u, "modelValue"), s = u, n = e, r = D(), o = D(), d = D(!1), y = () => o.value ? s.options.strictMode ? o.value.isValidNumberPrecise() : o.value.isValidNumber() : null, p = () => {
+      let a = y();
+      d.value !== a && (d.value = a, n("changeValidity", !!a), n(
         "changeErrorCode",
-        a ? null : r.value.getValidationError()
+        a ? null : o.value.getValidationError()
       ));
-    }, C = () => {
+    }, c = () => {
       var a;
-      n("changeNumber", ((a = r.value) == null ? void 0 : a.getNumber()) ?? ""), p();
-    }, y = () => {
+      n("changeNumber", ((a = o.value) == null ? void 0 : a.getNumber()) ?? ""), p();
+    }, m = () => {
       var a;
-      n("changeCountry", ((a = r.value) == null ? void 0 : a.getSelectedCountryData().iso2) ?? ""), C(), p();
+      n("changeCountry", ((a = o.value) == null ? void 0 : a.getSelectedCountryData().iso2) ?? ""), c(), p();
     };
     return E(() => {
-      l.value && (r.value = u(l.value, s.options), s.value && r.value.setNumber(s.value), s.disabled && r.value.setDisabled(s.disabled), o.value = c());
+      r.value && (o.value = l(r.value, s.options), s.value && o.value.setNumber(s.value), s.disabled && o.value.setDisabled(s.disabled), d.value = y());
     }), B(
       () => s.disabled,
       (a) => {
         var h;
-        return (h = r.value) == null ? void 0 : h.setDisabled(a);
+        return (h = o.value) == null ? void 0 : h.setDisabled(a);
       }
     ), R(() => {
       var a;
-      return (a = r.value) == null ? void 0 : a.destroy();
-    }), t({ instance: r, input: l }), (a, h) => F((V(), z("input", O({
+      return (a = o.value) == null ? void 0 : a.destroy();
+    }), t({ instance: o, input: r }), (a, h) => F((z(), V("input", O({
       ref_key: "input",
-      ref: l,
-      "onUpdate:modelValue": h[0] || (h[0] = (_) => i.value = _),
+      ref: r,
+      "onUpdate:modelValue": h[0] || (h[0] = (g) => i.value = g),
       type: "tel",
-      onCountrychange: y,
-      onInput: C
-    }, d.inputProps), null, 16)), [
+      onCountrychange: m,
+      onInput: c
+    }, u.inputProps), null, 16)), [
       [
         j,
         i.value,