intl-tel-input 25.8.1 → 25.8.3
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 +7 -7
- package/angular/README.md +1 -1
- package/angular/build/IntlTelInput.js +25 -39
- package/angular/build/IntlTelInputWithUtils.js +25 -39
- package/angular/build/types/intl-tel-input.d.ts +0 -2
- package/build/css/intlTelInput.css +2 -1
- package/build/css/intlTelInput.min.css +1 -1
- package/build/js/data.js +1 -1
- package/build/js/data.min.js +1 -1
- package/build/js/i18n/en/interface.js +2 -2
- package/build/js/intlTelInput.d.ts +0 -2
- package/build/js/intlTelInput.js +38 -48
- package/build/js/intlTelInput.min.js +4 -4
- package/build/js/intlTelInputWithUtils.js +38 -48
- package/build/js/intlTelInputWithUtils.min.js +4 -4
- package/package.json +1 -1
- package/react/README.md +1 -1
- package/react/build/IntlTelInput.cjs +37 -47
- package/react/build/IntlTelInput.d.ts +0 -2
- package/react/build/IntlTelInput.js +37 -47
- package/react/build/IntlTelInputWithUtils.cjs +37 -47
- package/react/build/IntlTelInputWithUtils.js +37 -47
- package/vue/README.md +1 -1
- package/vue/build/IntlTelInput.mjs +171 -172
- package/vue/build/IntlTelInputWithUtils.mjs +474 -475
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { mergeModels as
|
|
2
|
-
const
|
|
1
|
+
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";
|
|
2
|
+
const $ = [
|
|
3
3
|
[
|
|
4
4
|
"af",
|
|
5
5
|
// Afghanistan
|
|
@@ -1323,7 +1323,7 @@ const j = [
|
|
|
1323
1323
|
"263"
|
|
1324
1324
|
]
|
|
1325
1325
|
], w = [];
|
|
1326
|
-
for (const d of
|
|
1326
|
+
for (const d of $)
|
|
1327
1327
|
w.push({
|
|
1328
1328
|
name: "",
|
|
1329
1329
|
// populated in the plugin
|
|
@@ -1579,8 +1579,8 @@ const U = {
|
|
|
1579
1579
|
zm: "Zambia",
|
|
1580
1580
|
zw: "Zimbabwe"
|
|
1581
1581
|
}, H = {
|
|
1582
|
-
selectedCountryAriaLabel: "
|
|
1583
|
-
noCountrySelected: "
|
|
1582
|
+
selectedCountryAriaLabel: "Change country, selected ${country}",
|
|
1583
|
+
noCountrySelected: "Select country",
|
|
1584
1584
|
countryListAriaLabel: "List of countries",
|
|
1585
1585
|
searchPlaceholder: "Search",
|
|
1586
1586
|
clearSearchAriaLabel: "Clear search",
|
|
@@ -1667,7 +1667,7 @@ const S = (d) => typeof window < "u" && typeof window.matchMedia == "function" &
|
|
|
1667
1667
|
"887",
|
|
1668
1668
|
"888",
|
|
1669
1669
|
"889"
|
|
1670
|
-
], L = (d) => d.replace(/\D/g, ""),
|
|
1670
|
+
], L = (d) => d.replace(/\D/g, ""), A = (d = "") => d.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase(), P = (d) => {
|
|
1671
1671
|
const t = L(d);
|
|
1672
1672
|
if (t.charAt(0) === "1") {
|
|
1673
1673
|
const e = t.substring(1, 4);
|
|
@@ -1685,7 +1685,7 @@ const S = (d) => typeof window < "u" && typeof window.matchMedia == "function" &
|
|
|
1685
1685
|
return n;
|
|
1686
1686
|
}
|
|
1687
1687
|
return t.length;
|
|
1688
|
-
},
|
|
1688
|
+
}, m = (d, t, e) => {
|
|
1689
1689
|
const i = document.createElement(d);
|
|
1690
1690
|
return t && Object.entries(t).forEach(([s, n]) => i.setAttribute(s, n)), e && e.appendChild(i), i;
|
|
1691
1691
|
}, I = (d, ...t) => {
|
|
@@ -1725,16 +1725,16 @@ class D {
|
|
|
1725
1725
|
//* Precompute and cache country search tokens to speed up filtering
|
|
1726
1726
|
_cacheSearchTokens() {
|
|
1727
1727
|
for (const t of this.countries)
|
|
1728
|
-
t.normalisedName =
|
|
1728
|
+
t.normalisedName = A(t.name), t.initials = t.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((e) => e[0]).join("").toLowerCase(), t.dialCodePlus = `+${t.dialCode}`;
|
|
1729
1729
|
}
|
|
1730
1730
|
//* Sort countries by countryOrder option (if present), then name.
|
|
1731
1731
|
_sortCountries() {
|
|
1732
1732
|
this.options.countryOrder && (this.options.countryOrder = this.options.countryOrder.map((t) => t.toLowerCase())), this.countries.sort((t, e) => {
|
|
1733
1733
|
const { countryOrder: i } = this.options;
|
|
1734
1734
|
if (i) {
|
|
1735
|
-
const s = i.indexOf(t.iso2), n = i.indexOf(e.iso2),
|
|
1736
|
-
if (
|
|
1737
|
-
return
|
|
1735
|
+
const s = i.indexOf(t.iso2), n = i.indexOf(e.iso2), l = s > -1, r = n > -1;
|
|
1736
|
+
if (l || r)
|
|
1737
|
+
return l && r ? s - n : l ? -1 : 1;
|
|
1738
1738
|
}
|
|
1739
1739
|
return t.name.localeCompare(e.name);
|
|
1740
1740
|
});
|
|
@@ -1785,8 +1785,8 @@ class D {
|
|
|
1785
1785
|
const e = this.dialCodeToIso2Map[t.dialCode][0];
|
|
1786
1786
|
for (const i of t.areaCodes) {
|
|
1787
1787
|
for (let s = 1; s < i.length; s++) {
|
|
1788
|
-
const n = i.substring(0, s),
|
|
1789
|
-
this._addToDialCodeMap(e,
|
|
1788
|
+
const n = i.substring(0, s), l = t.dialCode + n;
|
|
1789
|
+
this._addToDialCodeMap(e, l), this._addToDialCodeMap(t.iso2, l);
|
|
1790
1790
|
}
|
|
1791
1791
|
this._addToDialCodeMap(t.iso2, t.dialCode + i);
|
|
1792
1792
|
}
|
|
@@ -1802,66 +1802,70 @@ class D {
|
|
|
1802
1802
|
showFlags: i,
|
|
1803
1803
|
containerClass: s,
|
|
1804
1804
|
hiddenInput: n,
|
|
1805
|
-
dropdownContainer:
|
|
1806
|
-
fixDropdownWidth:
|
|
1807
|
-
useFullscreenPopup:
|
|
1805
|
+
dropdownContainer: l,
|
|
1806
|
+
fixDropdownWidth: r,
|
|
1807
|
+
useFullscreenPopup: o,
|
|
1808
1808
|
countrySearch: c,
|
|
1809
1809
|
i18n: p
|
|
1810
|
-
} = this.options,
|
|
1810
|
+
} = this.options, C = D._buildClassNames({
|
|
1811
1811
|
iti: !0,
|
|
1812
1812
|
"iti--allow-dropdown": t,
|
|
1813
1813
|
"iti--show-flags": i,
|
|
1814
|
-
"iti--inline-dropdown": !
|
|
1814
|
+
"iti--inline-dropdown": !o,
|
|
1815
1815
|
[s]: !!s
|
|
1816
|
-
}),
|
|
1817
|
-
if ((a = this.telInput.parentNode) == null || a.insertBefore(
|
|
1818
|
-
this.countryContainer =
|
|
1816
|
+
}), y = m("div", { class: C });
|
|
1817
|
+
if ((a = this.telInput.parentNode) == null || a.insertBefore(y, this.telInput), t || i || e) {
|
|
1818
|
+
this.countryContainer = m(
|
|
1819
1819
|
"div",
|
|
1820
1820
|
{ class: "iti__country-container" },
|
|
1821
|
-
|
|
1822
|
-
), this.showSelectedCountryOnLeft ? this.countryContainer.style.left = "0px" : this.countryContainer.style.right = "0px", t ? (this.selectedCountry =
|
|
1821
|
+
y
|
|
1822
|
+
), this.showSelectedCountryOnLeft ? this.countryContainer.style.left = "0px" : this.countryContainer.style.right = "0px", t ? (this.selectedCountry = m(
|
|
1823
1823
|
"button",
|
|
1824
1824
|
{
|
|
1825
1825
|
type: "button",
|
|
1826
1826
|
class: "iti__selected-country",
|
|
1827
1827
|
"aria-expanded": "false",
|
|
1828
|
-
"aria-label": this.options.i18n.
|
|
1828
|
+
"aria-label": this.options.i18n.noCountrySelected,
|
|
1829
1829
|
"aria-haspopup": "dialog",
|
|
1830
1830
|
"aria-controls": `iti-${this.id}__dropdown-content`
|
|
1831
1831
|
},
|
|
1832
1832
|
this.countryContainer
|
|
1833
|
-
), this.telInput.disabled && this.selectedCountry.setAttribute("disabled", "true")) : this.selectedCountry =
|
|
1833
|
+
), this.telInput.disabled && this.selectedCountry.setAttribute("disabled", "true")) : this.selectedCountry = m(
|
|
1834
1834
|
"div",
|
|
1835
1835
|
{ class: "iti__selected-country" },
|
|
1836
1836
|
this.countryContainer
|
|
1837
1837
|
);
|
|
1838
|
-
const b =
|
|
1839
|
-
|
|
1840
|
-
"
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1838
|
+
const b = m(
|
|
1839
|
+
"div",
|
|
1840
|
+
{ class: "iti__selected-country-primary" },
|
|
1841
|
+
this.selectedCountry
|
|
1842
|
+
);
|
|
1843
|
+
if (this.selectedCountryInner = m(
|
|
1844
|
+
"div",
|
|
1845
|
+
{ class: "iti__flag" },
|
|
1846
|
+
b
|
|
1847
|
+
), t && (this.dropdownArrow = m(
|
|
1844
1848
|
"div",
|
|
1845
1849
|
{ class: "iti__arrow", "aria-hidden": "true" },
|
|
1846
1850
|
b
|
|
1847
|
-
)), e && (this.selectedDialCode =
|
|
1851
|
+
)), e && (this.selectedDialCode = m(
|
|
1848
1852
|
"div",
|
|
1849
|
-
{ class: "iti__selected-dial-code",
|
|
1853
|
+
{ class: "iti__selected-dial-code", dir: "ltr" },
|
|
1850
1854
|
this.selectedCountry
|
|
1851
1855
|
)), t) {
|
|
1852
|
-
const f =
|
|
1853
|
-
if (this.dropdownContent =
|
|
1856
|
+
const f = r ? "" : "iti--flexible-dropdown-width";
|
|
1857
|
+
if (this.dropdownContent = m("div", {
|
|
1854
1858
|
id: `iti-${this.id}__dropdown-content`,
|
|
1855
1859
|
class: `iti__dropdown-content iti__hide ${f}`,
|
|
1856
1860
|
role: "dialog",
|
|
1857
1861
|
"aria-modal": "true"
|
|
1858
1862
|
}), c) {
|
|
1859
|
-
const g =
|
|
1863
|
+
const g = m(
|
|
1860
1864
|
"div",
|
|
1861
1865
|
{ class: "iti__search-input-wrapper" },
|
|
1862
1866
|
this.dropdownContent
|
|
1863
1867
|
);
|
|
1864
|
-
this.searchIcon =
|
|
1868
|
+
this.searchIcon = m(
|
|
1865
1869
|
"span",
|
|
1866
1870
|
{
|
|
1867
1871
|
class: "iti__search-icon",
|
|
@@ -1872,7 +1876,7 @@ class D {
|
|
|
1872
1876
|
<svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
|
|
1873
1877
|
<circle cx="11" cy="11" r="7" />
|
|
1874
1878
|
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
1875
|
-
</svg>`, this.searchInput =
|
|
1879
|
+
</svg>`, this.searchInput = m(
|
|
1876
1880
|
"input",
|
|
1877
1881
|
{
|
|
1878
1882
|
id: `iti-${this.id}__search-input`,
|
|
@@ -1889,7 +1893,7 @@ class D {
|
|
|
1889
1893
|
autocomplete: "off"
|
|
1890
1894
|
},
|
|
1891
1895
|
g
|
|
1892
|
-
), this.searchClearButton =
|
|
1896
|
+
), this.searchClearButton = m(
|
|
1893
1897
|
"button",
|
|
1894
1898
|
{
|
|
1895
1899
|
type: "button",
|
|
@@ -1907,11 +1911,11 @@ class D {
|
|
|
1907
1911
|
<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" />
|
|
1908
1912
|
</mask>
|
|
1909
1913
|
<circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${v})" />
|
|
1910
|
-
</svg>`, this.searchResultsA11yText =
|
|
1914
|
+
</svg>`, this.searchResultsA11yText = m(
|
|
1911
1915
|
"span",
|
|
1912
1916
|
{ class: "iti__a11y-text" },
|
|
1913
1917
|
this.dropdownContent
|
|
1914
|
-
), this.searchNoResults =
|
|
1918
|
+
), this.searchNoResults = m(
|
|
1915
1919
|
"div",
|
|
1916
1920
|
{
|
|
1917
1921
|
class: "iti__no-results iti__hide",
|
|
@@ -1921,7 +1925,7 @@ class D {
|
|
|
1921
1925
|
this.dropdownContent
|
|
1922
1926
|
), this.searchNoResults.textContent = p.zeroSearchResults;
|
|
1923
1927
|
}
|
|
1924
|
-
if (this.countryList =
|
|
1928
|
+
if (this.countryList = m(
|
|
1925
1929
|
"ul",
|
|
1926
1930
|
{
|
|
1927
1931
|
class: "iti__country-list",
|
|
@@ -1930,41 +1934,41 @@ class D {
|
|
|
1930
1934
|
"aria-label": p.countryListAriaLabel
|
|
1931
1935
|
},
|
|
1932
1936
|
this.dropdownContent
|
|
1933
|
-
), this._appendListItems(), c && this._updateSearchResultsA11yText(),
|
|
1937
|
+
), this._appendListItems(), c && this._updateSearchResultsA11yText(), l) {
|
|
1934
1938
|
const g = D._buildClassNames({
|
|
1935
1939
|
iti: !0,
|
|
1936
1940
|
"iti--container": !0,
|
|
1937
|
-
"iti--fullscreen-popup":
|
|
1938
|
-
"iti--inline-dropdown": !
|
|
1941
|
+
"iti--fullscreen-popup": o,
|
|
1942
|
+
"iti--inline-dropdown": !o,
|
|
1939
1943
|
[s]: !!s
|
|
1940
1944
|
});
|
|
1941
|
-
this.dropdown =
|
|
1945
|
+
this.dropdown = m("div", { class: g }), this.dropdown.appendChild(this.dropdownContent);
|
|
1942
1946
|
} else
|
|
1943
1947
|
this.countryContainer.appendChild(this.dropdownContent);
|
|
1944
1948
|
}
|
|
1945
1949
|
}
|
|
1946
|
-
if (
|
|
1950
|
+
if (y.appendChild(this.telInput), this._updateInputPadding(), n) {
|
|
1947
1951
|
const b = this.telInput.getAttribute("name") || "", f = n(b);
|
|
1948
1952
|
if (f.phone) {
|
|
1949
1953
|
const g = (h = this.telInput.form) == null ? void 0 : h.querySelector(`input[name="${f.phone}"]`);
|
|
1950
|
-
g ? this.hiddenInput = g : (this.hiddenInput =
|
|
1954
|
+
g ? this.hiddenInput = g : (this.hiddenInput = m("input", {
|
|
1951
1955
|
type: "hidden",
|
|
1952
1956
|
name: f.phone
|
|
1953
|
-
}),
|
|
1957
|
+
}), y.appendChild(this.hiddenInput));
|
|
1954
1958
|
}
|
|
1955
1959
|
if (f.country) {
|
|
1956
1960
|
const g = (_ = this.telInput.form) == null ? void 0 : _.querySelector(`input[name="${f.country}"]`);
|
|
1957
|
-
g ? this.hiddenInputCountry = g : (this.hiddenInputCountry =
|
|
1961
|
+
g ? this.hiddenInputCountry = g : (this.hiddenInputCountry = m("input", {
|
|
1958
1962
|
type: "hidden",
|
|
1959
1963
|
name: f.country
|
|
1960
|
-
}),
|
|
1964
|
+
}), y.appendChild(this.hiddenInputCountry));
|
|
1961
1965
|
}
|
|
1962
1966
|
}
|
|
1963
1967
|
}
|
|
1964
1968
|
//* For each country: add a country list item <li> to the countryList <ul> container.
|
|
1965
1969
|
_appendListItems() {
|
|
1966
1970
|
for (let t = 0; t < this.countries.length; t++) {
|
|
1967
|
-
const e = this.countries[t], i = t === 0 ? "iti__highlight" : "", s =
|
|
1971
|
+
const e = this.countries[t], i = t === 0 ? "iti__highlight" : "", s = m(
|
|
1968
1972
|
"li",
|
|
1969
1973
|
{
|
|
1970
1974
|
id: `iti-${this.id}__item-${e.iso2}`,
|
|
@@ -1986,12 +1990,12 @@ class D {
|
|
|
1986
1990
|
//* 1. Extracting a dial code from the given number
|
|
1987
1991
|
//* 2. Using explicit initialCountry
|
|
1988
1992
|
_setInitialState(t = !1) {
|
|
1989
|
-
const e = this.telInput.getAttribute("value"), i = this.telInput.value, n = e && e.charAt(0) === "+" && (!i || i.charAt(0) !== "+") ? e : i,
|
|
1990
|
-
if (
|
|
1993
|
+
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;
|
|
1994
|
+
if (l && !r)
|
|
1991
1995
|
this._updateCountryFromNumber(n);
|
|
1992
1996
|
else if (!p || t) {
|
|
1993
|
-
const
|
|
1994
|
-
|
|
1997
|
+
const C = o ? o.toLowerCase() : "";
|
|
1998
|
+
C && this._getCountryData(C, !0) ? this._setCountry(C) : l && r ? this._setCountry("us") : this._setCountry();
|
|
1995
1999
|
}
|
|
1996
2000
|
n && this._updateValFromNumber(n);
|
|
1997
2001
|
}
|
|
@@ -2050,31 +2054,31 @@ class D {
|
|
|
2050
2054
|
}
|
|
2051
2055
|
//* Initialize the tel input listeners.
|
|
2052
2056
|
_initTelInputListeners() {
|
|
2053
|
-
const { strictMode: t, formatAsYouType: e, separateDialCode: i, formatOnDisplay: s, allowDropdown: n, countrySearch:
|
|
2054
|
-
let
|
|
2055
|
-
new RegExp("\\p{L}", "u").test(this.telInput.value) && (
|
|
2056
|
-
if (this.isAndroid && (
|
|
2057
|
-
const
|
|
2057
|
+
const { strictMode: t, formatAsYouType: e, separateDialCode: i, formatOnDisplay: s, allowDropdown: n, countrySearch: l } = this.options;
|
|
2058
|
+
let r = !1;
|
|
2059
|
+
new RegExp("\\p{L}", "u").test(this.telInput.value) && (r = !0), this._handleInputEvent = (o) => {
|
|
2060
|
+
if (this.isAndroid && (o == null ? void 0 : o.data) === "+" && i && n && l) {
|
|
2061
|
+
const y = this.telInput.selectionStart || 0, a = this.telInput.value.substring(0, y - 1), h = this.telInput.value.substring(y);
|
|
2058
2062
|
this.telInput.value = a + h, this._openDropdownWithPlus();
|
|
2059
2063
|
return;
|
|
2060
2064
|
}
|
|
2061
2065
|
this._updateCountryFromNumber(this.telInput.value) && this._triggerCountryChange();
|
|
2062
|
-
const c = (
|
|
2063
|
-
c || p && !t ?
|
|
2064
|
-
const
|
|
2065
|
-
if (e && !
|
|
2066
|
-
const
|
|
2066
|
+
const c = (o == null ? void 0 : o.data) && /[^+0-9]/.test(o.data), p = (o == null ? void 0 : o.inputType) === "insertFromPaste" && this.telInput.value;
|
|
2067
|
+
c || p && !t ? r = !0 : /[^+0-9]/.test(this.telInput.value) || (r = !1);
|
|
2068
|
+
const C = (o == null ? void 0 : o.detail) && o.detail.isSetNumber && !s;
|
|
2069
|
+
if (e && !r && !C) {
|
|
2070
|
+
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, _);
|
|
2067
2071
|
this.telInput.value = b, this.telInput.setSelectionRange(f, f);
|
|
2068
2072
|
}
|
|
2069
|
-
}, this.telInput.addEventListener("input", this._handleInputEvent), (t || i) && (this._handleKeydownEvent = (
|
|
2070
|
-
if (
|
|
2071
|
-
if (i && n &&
|
|
2072
|
-
|
|
2073
|
+
}, this.telInput.addEventListener("input", this._handleInputEvent), (t || i) && (this._handleKeydownEvent = (o) => {
|
|
2074
|
+
if (o.key && o.key.length === 1 && !o.altKey && !o.ctrlKey && !o.metaKey) {
|
|
2075
|
+
if (i && n && l && o.key === "+") {
|
|
2076
|
+
o.preventDefault(), this._openDropdownWithPlus();
|
|
2073
2077
|
return;
|
|
2074
2078
|
}
|
|
2075
2079
|
if (t) {
|
|
2076
|
-
const c = this.telInput.value,
|
|
2077
|
-
(!a || f && !v && !
|
|
2080
|
+
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;
|
|
2081
|
+
(!a || f && !v && !C) && o.preventDefault();
|
|
2078
2082
|
}
|
|
2079
2083
|
}
|
|
2080
2084
|
}, this.telInput.addEventListener("keydown", this._handleKeydownEvent));
|
|
@@ -2111,43 +2115,43 @@ class D {
|
|
|
2111
2115
|
}
|
|
2112
2116
|
//* We only bind dropdown listeners when the dropdown is open.
|
|
2113
2117
|
_bindDropdownListeners() {
|
|
2114
|
-
this._handleMouseoverCountryList = (
|
|
2115
|
-
var
|
|
2116
|
-
const
|
|
2117
|
-
|
|
2118
|
+
this._handleMouseoverCountryList = (i) => {
|
|
2119
|
+
var n;
|
|
2120
|
+
const s = (n = i.target) == null ? void 0 : n.closest(".iti__country");
|
|
2121
|
+
s && this._highlightListItem(s, !1);
|
|
2118
2122
|
}, this.countryList.addEventListener(
|
|
2119
2123
|
"mouseover",
|
|
2120
2124
|
this._handleMouseoverCountryList
|
|
2121
|
-
), this._handleClickCountryList = (
|
|
2122
|
-
var
|
|
2123
|
-
const
|
|
2124
|
-
|
|
2125
|
-
}, this.countryList.addEventListener("click", this._handleClickCountryList)
|
|
2126
|
-
|
|
2127
|
-
|
|
2128
|
-
|
|
2129
|
-
|
|
2130
|
-
|
|
2131
|
-
|
|
2132
|
-
);
|
|
2133
|
-
let
|
|
2134
|
-
if (this._handleKeydownOnDropdown = (
|
|
2135
|
-
["ArrowUp", "ArrowDown", "Enter", "Escape"].includes(
|
|
2136
|
-
|
|
2125
|
+
), this._handleClickCountryList = (i) => {
|
|
2126
|
+
var n;
|
|
2127
|
+
const s = (n = i.target) == null ? void 0 : n.closest(".iti__country");
|
|
2128
|
+
s && this._selectListItem(s);
|
|
2129
|
+
}, this.countryList.addEventListener("click", this._handleClickCountryList), this._handleClickOffToClose = (i) => {
|
|
2130
|
+
!!i.target.closest(`#iti-${this.id}__dropdown-content`) || this._closeDropdown();
|
|
2131
|
+
}, setTimeout(() => {
|
|
2132
|
+
document.documentElement.addEventListener(
|
|
2133
|
+
"click",
|
|
2134
|
+
this._handleClickOffToClose
|
|
2135
|
+
);
|
|
2136
|
+
}, 0);
|
|
2137
|
+
let t = "", e = null;
|
|
2138
|
+
if (this._handleKeydownOnDropdown = (i) => {
|
|
2139
|
+
["ArrowUp", "ArrowDown", "Enter", "Escape"].includes(i.key) && (i.preventDefault(), i.stopPropagation(), i.key === "ArrowUp" || i.key === "ArrowDown" ? this._handleUpDownKey(i.key) : i.key === "Enter" ? this._handleEnterKey() : i.key === "Escape" && this._closeDropdown()), !this.options.countrySearch && /^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(i.key) && (i.stopPropagation(), e && clearTimeout(e), t += i.key.toLowerCase(), this._searchForCountry(t), e = setTimeout(() => {
|
|
2140
|
+
t = "";
|
|
2137
2141
|
}, 1e3));
|
|
2138
2142
|
}, document.addEventListener("keydown", this._handleKeydownOnDropdown), this.options.countrySearch) {
|
|
2139
|
-
const
|
|
2140
|
-
const
|
|
2141
|
-
|
|
2143
|
+
const i = () => {
|
|
2144
|
+
const n = this.searchInput.value.trim();
|
|
2145
|
+
n ? this._filterCountries(n) : this._filterCountries("", !0), this.searchInput.value ? this.searchClearButton.classList.remove("iti__hide") : this.searchClearButton.classList.add("iti__hide");
|
|
2142
2146
|
};
|
|
2143
|
-
let
|
|
2147
|
+
let s = null;
|
|
2144
2148
|
this._handleSearchChange = () => {
|
|
2145
|
-
|
|
2146
|
-
|
|
2149
|
+
s && clearTimeout(s), s = setTimeout(() => {
|
|
2150
|
+
i(), s = null;
|
|
2147
2151
|
}, 100);
|
|
2148
|
-
}, this.searchInput.addEventListener("input", this._handleSearchChange), this._handleSearchClear = (
|
|
2149
|
-
|
|
2150
|
-
}, this.searchClearButton.addEventListener("click", this._handleSearchClear)
|
|
2152
|
+
}, this.searchInput.addEventListener("input", this._handleSearchChange), this._handleSearchClear = () => {
|
|
2153
|
+
this.searchInput.value = "", this.searchInput.focus(), i();
|
|
2154
|
+
}, this.searchClearButton.addEventListener("click", this._handleSearchClear);
|
|
2151
2155
|
}
|
|
2152
2156
|
}
|
|
2153
2157
|
//* Hidden search (countrySearch disabled): Find the first list item whose name starts with the query string.
|
|
@@ -2163,18 +2167,18 @@ class D {
|
|
|
2163
2167
|
_filterCountries(t, e = !1) {
|
|
2164
2168
|
let i = !0;
|
|
2165
2169
|
this.countryList.innerHTML = "";
|
|
2166
|
-
const s =
|
|
2170
|
+
const s = A(t), n = s.length, l = [], r = [], o = [], c = [], p = [], C = [];
|
|
2167
2171
|
for (const a of this.countries)
|
|
2168
|
-
e || n === 0 ?
|
|
2169
|
-
const
|
|
2170
|
-
...o.sort((a, h) => a.priority - h.priority),
|
|
2172
|
+
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);
|
|
2173
|
+
const y = [
|
|
2171
2174
|
...l.sort((a, h) => a.priority - h.priority),
|
|
2172
2175
|
...r.sort((a, h) => a.priority - h.priority),
|
|
2176
|
+
...o.sort((a, h) => a.priority - h.priority),
|
|
2173
2177
|
...c.sort((a, h) => a.priority - h.priority),
|
|
2174
2178
|
...p.sort((a, h) => a.priority - h.priority),
|
|
2175
|
-
...
|
|
2179
|
+
...C.sort((a, h) => a.priority - h.priority)
|
|
2176
2180
|
];
|
|
2177
|
-
for (const a of
|
|
2181
|
+
for (const a of y) {
|
|
2178
2182
|
const h = a.nodeById[this.id];
|
|
2179
2183
|
h && (this.countryList.appendChild(h), i && (this._highlightListItem(h, !1), i = !1));
|
|
2180
2184
|
}
|
|
@@ -2201,11 +2205,11 @@ class D {
|
|
|
2201
2205
|
_updateValFromNumber(t) {
|
|
2202
2206
|
let e = t;
|
|
2203
2207
|
if (this.options.formatOnDisplay && u.utils && this.selectedCountryData) {
|
|
2204
|
-
const i = this.options.nationalMode || e.charAt(0) !== "+" && !this.options.separateDialCode, { NATIONAL: s, INTERNATIONAL: n } = u.utils.numberFormat,
|
|
2208
|
+
const i = this.options.nationalMode || e.charAt(0) !== "+" && !this.options.separateDialCode, { NATIONAL: s, INTERNATIONAL: n } = u.utils.numberFormat, l = i ? s : n;
|
|
2205
2209
|
e = u.utils.formatNumber(
|
|
2206
2210
|
e,
|
|
2207
2211
|
this.selectedCountryData.iso2,
|
|
2208
|
-
|
|
2212
|
+
l
|
|
2209
2213
|
);
|
|
2210
2214
|
}
|
|
2211
2215
|
e = this._beforeSetNumber(e), this.telInput.value = e;
|
|
@@ -2220,8 +2224,8 @@ class D {
|
|
|
2220
2224
|
const { dialCode: e, nationalPrefix: i } = this.selectedCountryData;
|
|
2221
2225
|
if (t.charAt(0) === "+" || !e)
|
|
2222
2226
|
return t;
|
|
2223
|
-
const
|
|
2224
|
-
return `+${e}${
|
|
2227
|
+
const l = i && t.charAt(0) === i && !this.options.separateDialCode ? t.substring(1) : t;
|
|
2228
|
+
return `+${e}${l}`;
|
|
2225
2229
|
}
|
|
2226
2230
|
// Get the country ISO2 code from the given number
|
|
2227
2231
|
// BUT ONLY IF ITS CHANGED FROM THE CURRENTLY SELECTED COUNTRY
|
|
@@ -2231,19 +2235,19 @@ class D {
|
|
|
2231
2235
|
let i = e ? t.substring(e) : t;
|
|
2232
2236
|
const s = this.selectedCountryData.iso2, n = this.selectedCountryData.dialCode;
|
|
2233
2237
|
i = this._ensureHasDialCode(i);
|
|
2234
|
-
const
|
|
2235
|
-
if (
|
|
2236
|
-
const
|
|
2238
|
+
const l = this._getDialCode(i, !0), r = L(i);
|
|
2239
|
+
if (l) {
|
|
2240
|
+
const o = L(l), c = this.dialCodeToIso2Map[o];
|
|
2237
2241
|
if (!s && this.defaultCountry && c.includes(this.defaultCountry))
|
|
2238
2242
|
return this.defaultCountry;
|
|
2239
|
-
const p = this.selectedCountryData.areaCodes &&
|
|
2240
|
-
if (!(n === "1" && P(
|
|
2243
|
+
const p = this.selectedCountryData.areaCodes && r.length > o.length, C = s && c.includes(s) && !p;
|
|
2244
|
+
if (!(n === "1" && P(r)) && !C) {
|
|
2241
2245
|
for (const a of c)
|
|
2242
2246
|
if (a)
|
|
2243
2247
|
return a;
|
|
2244
2248
|
}
|
|
2245
2249
|
} else {
|
|
2246
|
-
if (i.charAt(0) === "+" &&
|
|
2250
|
+
if (i.charAt(0) === "+" && r.length)
|
|
2247
2251
|
return "";
|
|
2248
2252
|
if ((!i || i === "+") && !this.selectedCountryData.iso2)
|
|
2249
2253
|
return this.defaultCountry;
|
|
@@ -2273,13 +2277,14 @@ class D {
|
|
|
2273
2277
|
//* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
|
|
2274
2278
|
_setCountry(t) {
|
|
2275
2279
|
const { separateDialCode: e, showFlags: i, i18n: s } = this.options, n = this.selectedCountryData.iso2 ? this.selectedCountryData : {};
|
|
2276
|
-
if (this.selectedCountryData = t ? this._getCountryData(t, !1) || {} : {}, this.selectedCountryData.iso2 && (this.defaultCountry = this.selectedCountryData.iso2), this.
|
|
2277
|
-
|
|
2278
|
-
|
|
2280
|
+
if (this.selectedCountryData = t ? this._getCountryData(t, !1) || {} : {}, this.selectedCountryData.iso2 && (this.defaultCountry = this.selectedCountryData.iso2), this.selectedCountry) {
|
|
2281
|
+
const l = t && i ? `iti__flag iti__${t}` : "iti__flag iti__globe";
|
|
2282
|
+
let r, o;
|
|
2283
|
+
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);
|
|
2279
2284
|
}
|
|
2280
|
-
if (
|
|
2281
|
-
const
|
|
2282
|
-
this.selectedDialCode.innerHTML =
|
|
2285
|
+
if (e) {
|
|
2286
|
+
const l = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
|
|
2287
|
+
this.selectedDialCode.innerHTML = l, this._updateInputPadding();
|
|
2283
2288
|
}
|
|
2284
2289
|
return this._updatePlaceholder(), this._updateMaxLength(), n.iso2 !== t;
|
|
2285
2290
|
}
|
|
@@ -2296,25 +2301,19 @@ class D {
|
|
|
2296
2301
|
if (t && u.utils)
|
|
2297
2302
|
if (s) {
|
|
2298
2303
|
const n = u.utils.numberType[e];
|
|
2299
|
-
let
|
|
2304
|
+
let l = u.utils.getExampleNumber(
|
|
2300
2305
|
s,
|
|
2301
2306
|
!1,
|
|
2302
2307
|
n,
|
|
2303
2308
|
!0
|
|
2304
|
-
),
|
|
2305
|
-
for (; u.utils.isPossibleNumber(
|
|
2306
|
-
|
|
2307
|
-
const
|
|
2308
|
-
this.maxCoreNumberLength =
|
|
2309
|
+
), r = l;
|
|
2310
|
+
for (; u.utils.isPossibleNumber(l, s, i); )
|
|
2311
|
+
r = l, l += "0";
|
|
2312
|
+
const o = u.utils.getCoreNumber(r, s);
|
|
2313
|
+
this.maxCoreNumberLength = o.length, s === "by" && (this.maxCoreNumberLength = o.length + 1);
|
|
2309
2314
|
} else
|
|
2310
2315
|
this.maxCoreNumberLength = null;
|
|
2311
2316
|
}
|
|
2312
|
-
_setSelectedCountryTitleAttribute(t = null, e) {
|
|
2313
|
-
if (!this.selectedCountry)
|
|
2314
|
-
return;
|
|
2315
|
-
let i;
|
|
2316
|
-
t && !e ? i = `${this.selectedCountryData.name}: +${this.selectedCountryData.dialCode}` : t ? i = this.selectedCountryData.name : i = "Unknown", this.selectedCountry.setAttribute("title", i);
|
|
2317
|
-
}
|
|
2318
2317
|
//* When the input is in a hidden container during initialisation, we must inject some markup
|
|
2319
2318
|
//* into the end of the DOM to calculate the correct offsetWidth.
|
|
2320
2319
|
//* NOTE: this is only used when separateDialCode is enabled, so countryContainer and selectedCountry
|
|
@@ -2341,13 +2340,13 @@ class D {
|
|
|
2341
2340
|
customPlaceholder: s
|
|
2342
2341
|
} = this.options, n = t === "aggressive" || !this.hadInitialPlaceholder && t === "polite";
|
|
2343
2342
|
if (u.utils && n) {
|
|
2344
|
-
const
|
|
2345
|
-
let
|
|
2343
|
+
const l = u.utils.numberType[e];
|
|
2344
|
+
let r = this.selectedCountryData.iso2 ? u.utils.getExampleNumber(
|
|
2346
2345
|
this.selectedCountryData.iso2,
|
|
2347
2346
|
i,
|
|
2348
|
-
|
|
2347
|
+
l
|
|
2349
2348
|
) : "";
|
|
2350
|
-
|
|
2349
|
+
r = this._beforeSetNumber(r), typeof s == "function" && (r = s(r, this.selectedCountryData)), this.telInput.setAttribute("placeholder", r);
|
|
2351
2350
|
}
|
|
2352
2351
|
}
|
|
2353
2352
|
//* Called when the user selects a list item from the dropdown.
|
|
@@ -2369,12 +2368,12 @@ class D {
|
|
|
2369
2368
|
}
|
|
2370
2369
|
//* Check if an element is visible within it's container, else scroll until it is.
|
|
2371
2370
|
_scrollTo(t) {
|
|
2372
|
-
const e = this.countryList, i = document.documentElement.scrollTop, s = e.offsetHeight, n = e.getBoundingClientRect().top + i,
|
|
2373
|
-
if (
|
|
2371
|
+
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;
|
|
2372
|
+
if (o < n)
|
|
2374
2373
|
e.scrollTop = p;
|
|
2375
|
-
else if (c >
|
|
2376
|
-
const
|
|
2377
|
-
e.scrollTop = p -
|
|
2374
|
+
else if (c > l) {
|
|
2375
|
+
const C = s - r;
|
|
2376
|
+
e.scrollTop = p - C;
|
|
2378
2377
|
}
|
|
2379
2378
|
}
|
|
2380
2379
|
//* Replace any existing dial code with the new one
|
|
@@ -2394,9 +2393,9 @@ class D {
|
|
|
2394
2393
|
if (t.charAt(0) === "+") {
|
|
2395
2394
|
let s = "";
|
|
2396
2395
|
for (let n = 0; n < t.length; n++) {
|
|
2397
|
-
const
|
|
2398
|
-
if (!isNaN(parseInt(
|
|
2399
|
-
if (s +=
|
|
2396
|
+
const l = t.charAt(n);
|
|
2397
|
+
if (!isNaN(parseInt(l, 10))) {
|
|
2398
|
+
if (s += l, e)
|
|
2400
2399
|
this.dialCodeToIso2Map[s] && (i = t.substring(0, n + 1));
|
|
2401
2400
|
else if (this.dialCodes.has(s)) {
|
|
2402
2401
|
i = t.substring(0, n + 1);
|
|
@@ -2454,7 +2453,7 @@ class D {
|
|
|
2454
2453
|
//********************
|
|
2455
2454
|
//* Remove plugin.
|
|
2456
2455
|
destroy() {
|
|
2457
|
-
var n,
|
|
2456
|
+
var n, l;
|
|
2458
2457
|
this.telInput.iti = void 0;
|
|
2459
2458
|
const { allowDropdown: t, separateDialCode: e } = this.options;
|
|
2460
2459
|
if (t) {
|
|
@@ -2465,13 +2464,13 @@ class D {
|
|
|
2465
2464
|
"keydown",
|
|
2466
2465
|
this._handleCountryContainerKeydown
|
|
2467
2466
|
);
|
|
2468
|
-
const
|
|
2469
|
-
|
|
2467
|
+
const r = this.telInput.closest("label");
|
|
2468
|
+
r && r.removeEventListener("click", this._handleLabelClick);
|
|
2470
2469
|
}
|
|
2471
2470
|
const { form: i } = this.telInput;
|
|
2472
2471
|
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);
|
|
2473
2472
|
const s = this.telInput.parentNode;
|
|
2474
|
-
(n = s == null ? void 0 : s.parentNode) == null || n.insertBefore(this.telInput, s), (
|
|
2473
|
+
(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];
|
|
2475
2474
|
}
|
|
2476
2475
|
//* Get the extension from the current number.
|
|
2477
2476
|
getExtension() {
|
|
@@ -2528,8 +2527,8 @@ class D {
|
|
|
2528
2527
|
return !1;
|
|
2529
2528
|
const e = this._getFullNumber(), i = e.search(new RegExp("\\p{L}", "u")), s = (n) => t ? this._utilsIsValidNumber(n) : this._utilsIsPossibleNumber(n);
|
|
2530
2529
|
if (i > -1) {
|
|
2531
|
-
const n = e.substring(0, i),
|
|
2532
|
-
return
|
|
2530
|
+
const n = e.substring(0, i), l = s(n), r = s(e);
|
|
2531
|
+
return l && r;
|
|
2533
2532
|
}
|
|
2534
2533
|
return s(e);
|
|
2535
2534
|
}
|
|
@@ -2596,11 +2595,11 @@ const Y = (d) => {
|
|
|
2596
2595
|
attachUtils: Y,
|
|
2597
2596
|
startedLoadingUtilsScript: !1,
|
|
2598
2597
|
startedLoadingAutoCountry: !1,
|
|
2599
|
-
version: "25.8.
|
|
2598
|
+
version: "25.8.3"
|
|
2600
2599
|
}
|
|
2601
2600
|
), Z = {
|
|
2602
2601
|
__name: "IntlTelInput",
|
|
2603
|
-
props: /* @__PURE__ */
|
|
2602
|
+
props: /* @__PURE__ */ k({
|
|
2604
2603
|
disabled: {
|
|
2605
2604
|
type: Boolean,
|
|
2606
2605
|
default: !1
|
|
@@ -2624,47 +2623,47 @@ const Y = (d) => {
|
|
|
2624
2623
|
},
|
|
2625
2624
|
modelModifiers: {}
|
|
2626
2625
|
}),
|
|
2627
|
-
emits: /* @__PURE__ */
|
|
2626
|
+
emits: /* @__PURE__ */ k([
|
|
2628
2627
|
"changeNumber",
|
|
2629
2628
|
"changeCountry",
|
|
2630
2629
|
"changeValidity",
|
|
2631
2630
|
"changeErrorCode"
|
|
2632
2631
|
], ["update:modelValue"]),
|
|
2633
2632
|
setup(d, { expose: t, emit: e }) {
|
|
2634
|
-
const i =
|
|
2633
|
+
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 = () => {
|
|
2635
2634
|
let a = c();
|
|
2636
|
-
|
|
2635
|
+
o.value !== a && (o.value = a, n("changeValidity", !!a), n(
|
|
2637
2636
|
"changeErrorCode",
|
|
2638
|
-
a ? null :
|
|
2637
|
+
a ? null : r.value.getValidationError()
|
|
2639
2638
|
));
|
|
2640
|
-
},
|
|
2639
|
+
}, C = () => {
|
|
2641
2640
|
var a;
|
|
2642
|
-
n("changeNumber", ((a =
|
|
2643
|
-
},
|
|
2641
|
+
n("changeNumber", ((a = r.value) == null ? void 0 : a.getNumber()) ?? ""), p();
|
|
2642
|
+
}, y = () => {
|
|
2644
2643
|
var a;
|
|
2645
|
-
n("changeCountry", ((a =
|
|
2644
|
+
n("changeCountry", ((a = r.value) == null ? void 0 : a.getSelectedCountryData().iso2) ?? ""), C(), p();
|
|
2646
2645
|
};
|
|
2647
|
-
return
|
|
2648
|
-
|
|
2646
|
+
return E(() => {
|
|
2647
|
+
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());
|
|
2649
2648
|
}), B(
|
|
2650
2649
|
() => s.disabled,
|
|
2651
2650
|
(a) => {
|
|
2652
2651
|
var h;
|
|
2653
|
-
return (h =
|
|
2652
|
+
return (h = r.value) == null ? void 0 : h.setDisabled(a);
|
|
2654
2653
|
}
|
|
2655
2654
|
), R(() => {
|
|
2656
2655
|
var a;
|
|
2657
|
-
return (a =
|
|
2658
|
-
}), t({ instance:
|
|
2656
|
+
return (a = r.value) == null ? void 0 : a.destroy();
|
|
2657
|
+
}), t({ instance: r, input: l }), (a, h) => F((V(), z("input", O({
|
|
2659
2658
|
ref_key: "input",
|
|
2660
|
-
ref:
|
|
2659
|
+
ref: l,
|
|
2661
2660
|
"onUpdate:modelValue": h[0] || (h[0] = (_) => i.value = _),
|
|
2662
2661
|
type: "tel",
|
|
2663
|
-
onCountrychange:
|
|
2664
|
-
onInput:
|
|
2662
|
+
onCountrychange: y,
|
|
2663
|
+
onInput: C
|
|
2665
2664
|
}, d.inputProps), null, 16)), [
|
|
2666
2665
|
[
|
|
2667
|
-
|
|
2666
|
+
j,
|
|
2668
2667
|
i.value,
|
|
2669
2668
|
void 0,
|
|
2670
2669
|
{ lazy: !0 }
|