intl-tel-input 25.10.7 → 25.10.9
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 +5 -5
- package/angular/README.md +1 -1
- package/angular/build/IntlTelInput.js +386 -320
- package/angular/build/IntlTelInputWithUtils.js +437 -342
- package/angular/build/types/intl-tel-input/angular.d.ts +2 -1
- package/angular/build/types/intl-tel-input/angularWithUtils.d.ts +2 -1
- package/angular/build/types/intl-tel-input/data.d.ts +3 -1
- package/angular/build/types/intl-tel-input/i18n/types.d.ts +2 -245
- package/angular/build/types/intl-tel-input.d.ts +16 -87
- package/angular/build/types/modules/core/options.d.ts +3 -0
- package/angular/build/types/modules/data/country-data.d.ts +12 -0
- package/angular/build/types/modules/data/nanp-regionless.d.ts +2 -0
- package/angular/build/types/modules/format/caret.d.ts +1 -0
- package/angular/build/types/modules/format/formatting.d.ts +3 -0
- package/angular/build/types/modules/types/public-api.d.ts +79 -0
- package/angular/build/types/modules/utils/dom.d.ts +1 -0
- package/angular/build/types/modules/utils/string.d.ts +2 -0
- package/build/js/data.js +3 -2
- package/build/js/data.min.js +2 -2
- package/build/js/intlTelInput.d.ts +99 -292
- package/build/js/intlTelInput.js +432 -361
- package/build/js/intlTelInput.min.js +13 -13
- package/build/js/intlTelInputWithUtils.js +483 -383
- package/build/js/intlTelInputWithUtils.min.js +13 -13
- package/build/js/utils.js +18 -15
- package/package.json +1 -1
- package/react/README.md +1 -1
- package/react/build/IntlTelInput.cjs +431 -360
- package/react/build/IntlTelInput.d.ts +103 -294
- package/react/build/IntlTelInput.js +431 -360
- package/react/build/IntlTelInputWithUtils.cjs +482 -382
- package/react/build/IntlTelInputWithUtils.js +482 -382
- package/vue/README.md +1 -1
- package/vue/build/IntlTelInput.mjs +483 -443
- package/vue/build/IntlTelInputWithUtils.mjs +1128 -1059
|
@@ -1606,11 +1606,7 @@ var interface_default = interfaceTranslations;
|
|
|
1606
1606
|
var allTranslations = Object.assign(Object.assign({}, countries_default), interface_default);
|
|
1607
1607
|
var en_default = allTranslations;
|
|
1608
1608
|
|
|
1609
|
-
// angular/build/temp/
|
|
1610
|
-
for (const c of data_default) {
|
|
1611
|
-
c.name = en_default[c.iso2];
|
|
1612
|
-
}
|
|
1613
|
-
var id = 0;
|
|
1609
|
+
// angular/build/temp/modules/core/options.js
|
|
1614
1610
|
var mq = (q) => {
|
|
1615
1611
|
return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(q).matches;
|
|
1616
1612
|
};
|
|
@@ -1676,6 +1672,181 @@ var defaults = {
|
|
|
1676
1672
|
//* The number type to enforce during validation.
|
|
1677
1673
|
validationNumberTypes: ["MOBILE"]
|
|
1678
1674
|
};
|
|
1675
|
+
function applyOptionSideEffects(o) {
|
|
1676
|
+
if (o.useFullscreenPopup) {
|
|
1677
|
+
o.fixDropdownWidth = false;
|
|
1678
|
+
}
|
|
1679
|
+
if (o.onlyCountries.length === 1) {
|
|
1680
|
+
o.initialCountry = o.onlyCountries[0];
|
|
1681
|
+
}
|
|
1682
|
+
if (o.separateDialCode) {
|
|
1683
|
+
o.nationalMode = false;
|
|
1684
|
+
}
|
|
1685
|
+
if (o.allowDropdown && !o.showFlags && !o.separateDialCode) {
|
|
1686
|
+
o.nationalMode = false;
|
|
1687
|
+
}
|
|
1688
|
+
if (o.useFullscreenPopup && !o.dropdownContainer) {
|
|
1689
|
+
o.dropdownContainer = document.body;
|
|
1690
|
+
}
|
|
1691
|
+
o.i18n = Object.assign(Object.assign({}, en_default), o.i18n);
|
|
1692
|
+
}
|
|
1693
|
+
|
|
1694
|
+
// angular/build/temp/modules/utils/string.js
|
|
1695
|
+
var getNumeric = (s) => s.replace(/\D/g, "");
|
|
1696
|
+
var normaliseString = (s = "") => s.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
|
|
1697
|
+
|
|
1698
|
+
// angular/build/temp/modules/utils/dom.js
|
|
1699
|
+
var createEl = (tagName, attrs, container) => {
|
|
1700
|
+
const el = document.createElement(tagName);
|
|
1701
|
+
if (attrs) {
|
|
1702
|
+
Object.entries(attrs).forEach(([key, value]) => el.setAttribute(key, value));
|
|
1703
|
+
}
|
|
1704
|
+
if (container) {
|
|
1705
|
+
container.appendChild(el);
|
|
1706
|
+
}
|
|
1707
|
+
return el;
|
|
1708
|
+
};
|
|
1709
|
+
|
|
1710
|
+
// angular/build/temp/modules/data/country-data.js
|
|
1711
|
+
function processAllCountries(options) {
|
|
1712
|
+
const { onlyCountries, excludeCountries } = options;
|
|
1713
|
+
if (onlyCountries.length) {
|
|
1714
|
+
const lowerCaseOnlyCountries = onlyCountries.map((country) => country.toLowerCase());
|
|
1715
|
+
return data_default.filter((country) => lowerCaseOnlyCountries.includes(country.iso2));
|
|
1716
|
+
} else if (excludeCountries.length) {
|
|
1717
|
+
const lowerCaseExcludeCountries = excludeCountries.map((country) => country.toLowerCase());
|
|
1718
|
+
return data_default.filter((country) => !lowerCaseExcludeCountries.includes(country.iso2));
|
|
1719
|
+
}
|
|
1720
|
+
return data_default;
|
|
1721
|
+
}
|
|
1722
|
+
function translateCountryNames(countries, options) {
|
|
1723
|
+
for (const c of countries) {
|
|
1724
|
+
const iso2 = c.iso2.toLowerCase();
|
|
1725
|
+
if (options.i18n[iso2]) {
|
|
1726
|
+
c.name = options.i18n[iso2];
|
|
1727
|
+
}
|
|
1728
|
+
}
|
|
1729
|
+
}
|
|
1730
|
+
function processDialCodes(countries, options) {
|
|
1731
|
+
const dialCodes = /* @__PURE__ */ new Set();
|
|
1732
|
+
let dialCodeMaxLen = 0;
|
|
1733
|
+
const dialCodeToIso2Map = {};
|
|
1734
|
+
const _addToDialCodeMap = (iso2, dialCode, priority) => {
|
|
1735
|
+
if (!iso2 || !dialCode) {
|
|
1736
|
+
return;
|
|
1737
|
+
}
|
|
1738
|
+
if (dialCode.length > dialCodeMaxLen) {
|
|
1739
|
+
dialCodeMaxLen = dialCode.length;
|
|
1740
|
+
}
|
|
1741
|
+
if (!dialCodeToIso2Map.hasOwnProperty(dialCode)) {
|
|
1742
|
+
dialCodeToIso2Map[dialCode] = [];
|
|
1743
|
+
}
|
|
1744
|
+
const iso2List = dialCodeToIso2Map[dialCode];
|
|
1745
|
+
if (iso2List.includes(iso2)) {
|
|
1746
|
+
return;
|
|
1747
|
+
}
|
|
1748
|
+
const index = priority !== void 0 ? priority : iso2List.length;
|
|
1749
|
+
iso2List[index] = iso2;
|
|
1750
|
+
};
|
|
1751
|
+
for (const c of countries) {
|
|
1752
|
+
if (!dialCodes.has(c.dialCode)) {
|
|
1753
|
+
dialCodes.add(c.dialCode);
|
|
1754
|
+
}
|
|
1755
|
+
_addToDialCodeMap(c.iso2, c.dialCode, c.priority);
|
|
1756
|
+
}
|
|
1757
|
+
if (options.onlyCountries.length || options.excludeCountries.length) {
|
|
1758
|
+
dialCodes.forEach((dialCode) => {
|
|
1759
|
+
dialCodeToIso2Map[dialCode] = dialCodeToIso2Map[dialCode].filter(Boolean);
|
|
1760
|
+
});
|
|
1761
|
+
}
|
|
1762
|
+
for (const c of countries) {
|
|
1763
|
+
if (c.areaCodes) {
|
|
1764
|
+
const rootIso2Code = dialCodeToIso2Map[c.dialCode][0];
|
|
1765
|
+
for (const areaCode of c.areaCodes) {
|
|
1766
|
+
for (let k = 1; k < areaCode.length; k++) {
|
|
1767
|
+
const partialAreaCode = areaCode.substring(0, k);
|
|
1768
|
+
const partialDialCode = c.dialCode + partialAreaCode;
|
|
1769
|
+
_addToDialCodeMap(rootIso2Code, partialDialCode);
|
|
1770
|
+
_addToDialCodeMap(c.iso2, partialDialCode);
|
|
1771
|
+
}
|
|
1772
|
+
_addToDialCodeMap(c.iso2, c.dialCode + areaCode);
|
|
1773
|
+
}
|
|
1774
|
+
}
|
|
1775
|
+
}
|
|
1776
|
+
return { dialCodes, dialCodeMaxLen, dialCodeToIso2Map };
|
|
1777
|
+
}
|
|
1778
|
+
function sortCountries(countries, options) {
|
|
1779
|
+
if (options.countryOrder) {
|
|
1780
|
+
options.countryOrder = options.countryOrder.map((iso2) => iso2.toLowerCase());
|
|
1781
|
+
}
|
|
1782
|
+
countries.sort((a, b) => {
|
|
1783
|
+
const { countryOrder } = options;
|
|
1784
|
+
if (countryOrder) {
|
|
1785
|
+
const aIndex = countryOrder.indexOf(a.iso2);
|
|
1786
|
+
const bIndex = countryOrder.indexOf(b.iso2);
|
|
1787
|
+
const aIndexExists = aIndex > -1;
|
|
1788
|
+
const bIndexExists = bIndex > -1;
|
|
1789
|
+
if (aIndexExists || bIndexExists) {
|
|
1790
|
+
if (aIndexExists && bIndexExists) {
|
|
1791
|
+
return aIndex - bIndex;
|
|
1792
|
+
}
|
|
1793
|
+
return aIndexExists ? -1 : 1;
|
|
1794
|
+
}
|
|
1795
|
+
}
|
|
1796
|
+
return a.name.localeCompare(b.name);
|
|
1797
|
+
});
|
|
1798
|
+
}
|
|
1799
|
+
function cacheSearchTokens(countries) {
|
|
1800
|
+
for (const c of countries) {
|
|
1801
|
+
c.normalisedName = normaliseString(c.name);
|
|
1802
|
+
c.initials = c.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((word) => word[0]).join("").toLowerCase();
|
|
1803
|
+
c.dialCodePlus = `+${c.dialCode}`;
|
|
1804
|
+
}
|
|
1805
|
+
}
|
|
1806
|
+
|
|
1807
|
+
// angular/build/temp/modules/format/formatting.js
|
|
1808
|
+
function beforeSetNumber(fullNumber, dialCode, separateDialCode, selectedCountryData) {
|
|
1809
|
+
let number = fullNumber;
|
|
1810
|
+
if (separateDialCode) {
|
|
1811
|
+
if (dialCode) {
|
|
1812
|
+
dialCode = `+${selectedCountryData.dialCode}`;
|
|
1813
|
+
const start = number[dialCode.length] === " " || number[dialCode.length] === "-" ? dialCode.length + 1 : dialCode.length;
|
|
1814
|
+
number = number.substring(start);
|
|
1815
|
+
}
|
|
1816
|
+
}
|
|
1817
|
+
return number;
|
|
1818
|
+
}
|
|
1819
|
+
function formatNumberAsYouType(fullNumber, telInputValue, utils, selectedCountryData, separateDialCode) {
|
|
1820
|
+
const result = utils ? utils.formatNumberAsYouType(fullNumber, selectedCountryData.iso2) : fullNumber;
|
|
1821
|
+
const { dialCode } = selectedCountryData;
|
|
1822
|
+
if (separateDialCode && telInputValue.charAt(0) !== "+" && result.includes(`+${dialCode}`)) {
|
|
1823
|
+
const afterDialCode = result.split(`+${dialCode}`)[1] || "";
|
|
1824
|
+
return afterDialCode.trim();
|
|
1825
|
+
}
|
|
1826
|
+
return result;
|
|
1827
|
+
}
|
|
1828
|
+
|
|
1829
|
+
// angular/build/temp/modules/format/caret.js
|
|
1830
|
+
function translateCursorPosition(relevantChars, formattedValue, prevCaretPos, isDeleteForwards) {
|
|
1831
|
+
if (prevCaretPos === 0 && !isDeleteForwards) {
|
|
1832
|
+
return 0;
|
|
1833
|
+
}
|
|
1834
|
+
let relevantCharCount = 0;
|
|
1835
|
+
for (let i = 0; i < formattedValue.length; i++) {
|
|
1836
|
+
if (/[+0-9]/.test(formattedValue[i])) {
|
|
1837
|
+
relevantCharCount++;
|
|
1838
|
+
}
|
|
1839
|
+
if (relevantCharCount === relevantChars && !isDeleteForwards) {
|
|
1840
|
+
return i + 1;
|
|
1841
|
+
}
|
|
1842
|
+
if (isDeleteForwards && relevantCharCount === relevantChars + 1) {
|
|
1843
|
+
return i;
|
|
1844
|
+
}
|
|
1845
|
+
}
|
|
1846
|
+
return formattedValue.length;
|
|
1847
|
+
}
|
|
1848
|
+
|
|
1849
|
+
// angular/build/temp/modules/data/nanp-regionless.js
|
|
1679
1850
|
var regionlessNanpNumbers = [
|
|
1680
1851
|
"800",
|
|
1681
1852
|
"822",
|
|
@@ -1695,8 +1866,6 @@ var regionlessNanpNumbers = [
|
|
|
1695
1866
|
"888",
|
|
1696
1867
|
"889"
|
|
1697
1868
|
];
|
|
1698
|
-
var getNumeric = (s) => s.replace(/\D/g, "");
|
|
1699
|
-
var normaliseString = (s = "") => s.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
|
|
1700
1869
|
var isRegionlessNanp = (number) => {
|
|
1701
1870
|
const numeric = getNumeric(number);
|
|
1702
1871
|
if (numeric.charAt(0) === "1") {
|
|
@@ -1705,34 +1874,14 @@ var isRegionlessNanp = (number) => {
|
|
|
1705
1874
|
}
|
|
1706
1875
|
return false;
|
|
1707
1876
|
};
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
}
|
|
1717
|
-
if (count === relevantChars && !isDeleteForwards) {
|
|
1718
|
-
return i + 1;
|
|
1719
|
-
}
|
|
1720
|
-
if (isDeleteForwards && count === relevantChars + 1) {
|
|
1721
|
-
return i;
|
|
1722
|
-
}
|
|
1723
|
-
}
|
|
1724
|
-
return formattedValue.length;
|
|
1725
|
-
};
|
|
1726
|
-
var createEl = (tagName, attrs, container) => {
|
|
1727
|
-
const el = document.createElement(tagName);
|
|
1728
|
-
if (attrs) {
|
|
1729
|
-
Object.entries(attrs).forEach(([key, value]) => el.setAttribute(key, value));
|
|
1730
|
-
}
|
|
1731
|
-
if (container) {
|
|
1732
|
-
container.appendChild(el);
|
|
1733
|
-
}
|
|
1734
|
-
return el;
|
|
1735
|
-
};
|
|
1877
|
+
|
|
1878
|
+
// angular/build/temp/intl-tel-input.js
|
|
1879
|
+
for (const c of data_default) {
|
|
1880
|
+
c.name = en_default[c.iso2];
|
|
1881
|
+
}
|
|
1882
|
+
var id = 0;
|
|
1883
|
+
var iso2Set = new Set(data_default.map((c) => c.iso2));
|
|
1884
|
+
var isIso2 = (val) => iso2Set.has(val);
|
|
1736
1885
|
var forEachInstance = (method, ...args) => {
|
|
1737
1886
|
const { instances } = intlTelInput;
|
|
1738
1887
|
Object.values(instances).forEach((instance) => instance[method](...args));
|
|
@@ -1752,23 +1901,7 @@ var Iti = class _Iti {
|
|
|
1752
1901
|
this.options = Object.assign({}, defaults, customOptions);
|
|
1753
1902
|
this.hadInitialPlaceholder = Boolean(input.getAttribute("placeholder"));
|
|
1754
1903
|
}
|
|
1755
|
-
|
|
1756
|
-
_init() {
|
|
1757
|
-
if (this.options.useFullscreenPopup) {
|
|
1758
|
-
this.options.fixDropdownWidth = false;
|
|
1759
|
-
}
|
|
1760
|
-
if (this.options.onlyCountries.length === 1) {
|
|
1761
|
-
this.options.initialCountry = this.options.onlyCountries[0];
|
|
1762
|
-
}
|
|
1763
|
-
if (this.options.separateDialCode) {
|
|
1764
|
-
this.options.nationalMode = false;
|
|
1765
|
-
}
|
|
1766
|
-
if (this.options.allowDropdown && !this.options.showFlags && !this.options.separateDialCode) {
|
|
1767
|
-
this.options.nationalMode = false;
|
|
1768
|
-
}
|
|
1769
|
-
if (this.options.useFullscreenPopup && !this.options.dropdownContainer) {
|
|
1770
|
-
this.options.dropdownContainer = document.body;
|
|
1771
|
-
}
|
|
1904
|
+
_detectEnvironmentAndLayout() {
|
|
1772
1905
|
this.isAndroid = typeof navigator !== "undefined" ? /Android/i.test(navigator.userAgent) : false;
|
|
1773
1906
|
this.isRTL = !!this.telInput.closest("[dir=rtl]");
|
|
1774
1907
|
this.telInput.dir = "ltr";
|
|
@@ -1781,7 +1914,8 @@ var Iti = class _Iti {
|
|
|
1781
1914
|
this.originalPaddingLeft = this.telInput.style.paddingLeft;
|
|
1782
1915
|
}
|
|
1783
1916
|
}
|
|
1784
|
-
|
|
1917
|
+
}
|
|
1918
|
+
_createInitPromises() {
|
|
1785
1919
|
const autoCountryPromise = new Promise((resolve, reject) => {
|
|
1786
1920
|
this.resolveAutoCountryPromise = resolve;
|
|
1787
1921
|
this.rejectAutoCountryPromise = reject;
|
|
@@ -1791,6 +1925,12 @@ var Iti = class _Iti {
|
|
|
1791
1925
|
this.rejectUtilsScriptPromise = reject;
|
|
1792
1926
|
});
|
|
1793
1927
|
this.promise = Promise.all([autoCountryPromise, utilsScriptPromise]);
|
|
1928
|
+
}
|
|
1929
|
+
//* Can't be private as it's called from intlTelInput convenience wrapper.
|
|
1930
|
+
_init() {
|
|
1931
|
+
applyOptionSideEffects(this.options);
|
|
1932
|
+
this._detectEnvironmentAndLayout();
|
|
1933
|
+
this._createInitPromises();
|
|
1794
1934
|
this.selectedCountryData = {};
|
|
1795
1935
|
this._processCountryData();
|
|
1796
1936
|
this._generateMarkup();
|
|
@@ -1803,122 +1943,34 @@ var Iti = class _Iti {
|
|
|
1803
1943
|
//********************
|
|
1804
1944
|
//* Prepare all of the country data, including onlyCountries, excludeCountries, countryOrder options.
|
|
1805
1945
|
_processCountryData() {
|
|
1806
|
-
this.
|
|
1807
|
-
this.
|
|
1808
|
-
this.
|
|
1809
|
-
this.
|
|
1946
|
+
this.countries = processAllCountries(this.options);
|
|
1947
|
+
const dialRes = processDialCodes(this.countries, this.options);
|
|
1948
|
+
this.dialCodes = dialRes.dialCodes;
|
|
1949
|
+
this.dialCodeMaxLen = dialRes.dialCodeMaxLen;
|
|
1950
|
+
this.dialCodeToIso2Map = dialRes.dialCodeToIso2Map;
|
|
1951
|
+
translateCountryNames(this.countries, this.options);
|
|
1952
|
+
sortCountries(this.countries, this.options);
|
|
1810
1953
|
this.countryByIso2 = new Map(this.countries.map((c) => [c.iso2, c]));
|
|
1811
|
-
this.
|
|
1812
|
-
}
|
|
1813
|
-
//* Precompute and cache country search tokens to speed up filtering
|
|
1814
|
-
_cacheSearchTokens() {
|
|
1815
|
-
for (const c of this.countries) {
|
|
1816
|
-
c.normalisedName = normaliseString(c.name);
|
|
1817
|
-
c.initials = c.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((word) => word[0]).join("").toLowerCase();
|
|
1818
|
-
c.dialCodePlus = `+${c.dialCode}`;
|
|
1819
|
-
}
|
|
1820
|
-
}
|
|
1821
|
-
//* Sort countries by countryOrder option (if present), then name.
|
|
1822
|
-
_sortCountries() {
|
|
1823
|
-
if (this.options.countryOrder) {
|
|
1824
|
-
this.options.countryOrder = this.options.countryOrder.map((country) => country.toLowerCase());
|
|
1825
|
-
}
|
|
1826
|
-
this.countries.sort((a, b) => {
|
|
1827
|
-
const { countryOrder } = this.options;
|
|
1828
|
-
if (countryOrder) {
|
|
1829
|
-
const aIndex = countryOrder.indexOf(a.iso2);
|
|
1830
|
-
const bIndex = countryOrder.indexOf(b.iso2);
|
|
1831
|
-
const aIndexExists = aIndex > -1;
|
|
1832
|
-
const bIndexExists = bIndex > -1;
|
|
1833
|
-
if (aIndexExists || bIndexExists) {
|
|
1834
|
-
if (aIndexExists && bIndexExists) {
|
|
1835
|
-
return aIndex - bIndex;
|
|
1836
|
-
}
|
|
1837
|
-
return aIndexExists ? -1 : 1;
|
|
1838
|
-
}
|
|
1839
|
-
}
|
|
1840
|
-
return a.name.localeCompare(b.name);
|
|
1841
|
-
});
|
|
1842
|
-
}
|
|
1843
|
-
//* Add a dial code to this.dialCodeToIso2Map.
|
|
1844
|
-
_addToDialCodeMap(iso2, dialCode, priority) {
|
|
1845
|
-
if (!iso2 || !dialCode) {
|
|
1846
|
-
return;
|
|
1847
|
-
}
|
|
1848
|
-
if (dialCode.length > this.dialCodeMaxLen) {
|
|
1849
|
-
this.dialCodeMaxLen = dialCode.length;
|
|
1850
|
-
}
|
|
1851
|
-
if (!this.dialCodeToIso2Map.hasOwnProperty(dialCode)) {
|
|
1852
|
-
this.dialCodeToIso2Map[dialCode] = [];
|
|
1853
|
-
}
|
|
1854
|
-
const iso2List = this.dialCodeToIso2Map[dialCode];
|
|
1855
|
-
if (iso2List.includes(iso2)) {
|
|
1856
|
-
return;
|
|
1857
|
-
}
|
|
1858
|
-
const index = priority !== void 0 ? priority : iso2List.length;
|
|
1859
|
-
iso2List[index] = iso2;
|
|
1860
|
-
}
|
|
1861
|
-
//* Process onlyCountries or excludeCountries array if present.
|
|
1862
|
-
_processAllCountries() {
|
|
1863
|
-
const { onlyCountries, excludeCountries } = this.options;
|
|
1864
|
-
if (onlyCountries.length) {
|
|
1865
|
-
const lowerCaseOnlyCountries = onlyCountries.map((country) => country.toLowerCase());
|
|
1866
|
-
this.countries = data_default.filter((country) => lowerCaseOnlyCountries.includes(country.iso2));
|
|
1867
|
-
} else if (excludeCountries.length) {
|
|
1868
|
-
const lowerCaseExcludeCountries = excludeCountries.map((country) => country.toLowerCase());
|
|
1869
|
-
this.countries = data_default.filter((country) => !lowerCaseExcludeCountries.includes(country.iso2));
|
|
1870
|
-
} else {
|
|
1871
|
-
this.countries = data_default;
|
|
1872
|
-
}
|
|
1873
|
-
}
|
|
1874
|
-
//* Translate Countries by object literal provided on config.
|
|
1875
|
-
_translateCountryNames() {
|
|
1876
|
-
for (const c of this.countries) {
|
|
1877
|
-
const iso2 = c.iso2.toLowerCase();
|
|
1878
|
-
if (this.options.i18n.hasOwnProperty(iso2)) {
|
|
1879
|
-
c.name = this.options.i18n[iso2];
|
|
1880
|
-
}
|
|
1881
|
-
}
|
|
1882
|
-
}
|
|
1883
|
-
//* Generate this.dialCodes and this.dialCodeToIso2Map.
|
|
1884
|
-
_processDialCodes() {
|
|
1885
|
-
this.dialCodes = /* @__PURE__ */ new Set();
|
|
1886
|
-
this.dialCodeMaxLen = 0;
|
|
1887
|
-
this.dialCodeToIso2Map = {};
|
|
1888
|
-
for (const c of this.countries) {
|
|
1889
|
-
if (!this.dialCodes.has(c.dialCode)) {
|
|
1890
|
-
this.dialCodes.add(c.dialCode);
|
|
1891
|
-
}
|
|
1892
|
-
this._addToDialCodeMap(c.iso2, c.dialCode, c.priority);
|
|
1893
|
-
}
|
|
1894
|
-
if (this.options.onlyCountries.length || this.options.excludeCountries.length) {
|
|
1895
|
-
this.dialCodes.forEach((dialCode) => {
|
|
1896
|
-
this.dialCodeToIso2Map[dialCode] = this.dialCodeToIso2Map[dialCode].filter(Boolean);
|
|
1897
|
-
});
|
|
1898
|
-
}
|
|
1899
|
-
for (const c of this.countries) {
|
|
1900
|
-
if (c.areaCodes) {
|
|
1901
|
-
const rootIso2Code = this.dialCodeToIso2Map[c.dialCode][0];
|
|
1902
|
-
for (const areaCode of c.areaCodes) {
|
|
1903
|
-
for (let k = 1; k < areaCode.length; k++) {
|
|
1904
|
-
const partialAreaCode = areaCode.substring(0, k);
|
|
1905
|
-
const partialDialCode = c.dialCode + partialAreaCode;
|
|
1906
|
-
this._addToDialCodeMap(rootIso2Code, partialDialCode);
|
|
1907
|
-
this._addToDialCodeMap(c.iso2, partialDialCode);
|
|
1908
|
-
}
|
|
1909
|
-
this._addToDialCodeMap(c.iso2, c.dialCode + areaCode);
|
|
1910
|
-
}
|
|
1911
|
-
}
|
|
1912
|
-
}
|
|
1954
|
+
cacheSearchTokens(this.countries);
|
|
1913
1955
|
}
|
|
1914
1956
|
//* Generate all of the markup for the plugin: the selected country overlay, and the dropdown.
|
|
1915
1957
|
_generateMarkup() {
|
|
1916
|
-
|
|
1958
|
+
this._prepareTelInput();
|
|
1959
|
+
const wrapper = this._createWrapperAndInsert();
|
|
1960
|
+
this._maybeBuildCountryContainer(wrapper);
|
|
1961
|
+
wrapper.appendChild(this.telInput);
|
|
1962
|
+
this._maybeUpdateInputPaddingAndReveal();
|
|
1963
|
+
this._maybeBuildHiddenInputs(wrapper);
|
|
1964
|
+
}
|
|
1965
|
+
_prepareTelInput() {
|
|
1917
1966
|
this.telInput.classList.add("iti__tel-input");
|
|
1918
1967
|
if (!this.telInput.hasAttribute("autocomplete") && !(this.telInput.form && this.telInput.form.hasAttribute("autocomplete"))) {
|
|
1919
1968
|
this.telInput.setAttribute("autocomplete", "off");
|
|
1920
1969
|
}
|
|
1921
|
-
|
|
1970
|
+
}
|
|
1971
|
+
_createWrapperAndInsert() {
|
|
1972
|
+
var _a;
|
|
1973
|
+
const { allowDropdown, showFlags, containerClass, useFullscreenPopup } = this.options;
|
|
1922
1974
|
const parentClasses = _Iti._buildClassNames({
|
|
1923
1975
|
"iti": true,
|
|
1924
1976
|
"iti--allow-dropdown": allowDropdown,
|
|
@@ -1928,6 +1980,10 @@ var Iti = class _Iti {
|
|
|
1928
1980
|
});
|
|
1929
1981
|
const wrapper = createEl("div", { class: parentClasses });
|
|
1930
1982
|
(_a = this.telInput.parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(wrapper, this.telInput);
|
|
1983
|
+
return wrapper;
|
|
1984
|
+
}
|
|
1985
|
+
_maybeBuildCountryContainer(wrapper) {
|
|
1986
|
+
const { allowDropdown, separateDialCode, showFlags } = this.options;
|
|
1931
1987
|
if (allowDropdown || showFlags || separateDialCode) {
|
|
1932
1988
|
this.countryContainer = createEl(
|
|
1933
1989
|
"div",
|
|
@@ -1964,96 +2020,109 @@ var Iti = class _Iti {
|
|
|
1964
2020
|
this.selectedDialCode = createEl("div", { class: "iti__selected-dial-code", dir: "ltr" }, this.selectedCountry);
|
|
1965
2021
|
}
|
|
1966
2022
|
if (allowDropdown) {
|
|
1967
|
-
|
|
1968
|
-
this.dropdownContent = createEl("div", {
|
|
1969
|
-
id: `iti-${this.id}__dropdown-content`,
|
|
1970
|
-
class: `iti__dropdown-content iti__hide ${extraClasses}`,
|
|
1971
|
-
role: "dialog",
|
|
1972
|
-
"aria-modal": "true"
|
|
1973
|
-
});
|
|
1974
|
-
if (countrySearch) {
|
|
1975
|
-
const searchWrapper = createEl("div", { class: "iti__search-input-wrapper" }, this.dropdownContent);
|
|
1976
|
-
this.searchIcon = createEl("span", {
|
|
1977
|
-
class: "iti__search-icon",
|
|
1978
|
-
"aria-hidden": "true"
|
|
1979
|
-
}, searchWrapper);
|
|
1980
|
-
this.searchIcon.innerHTML = `
|
|
1981
|
-
<svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
|
|
1982
|
-
<circle cx="11" cy="11" r="7" />
|
|
1983
|
-
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
1984
|
-
</svg>`;
|
|
1985
|
-
this.searchInput = createEl("input", {
|
|
1986
|
-
id: `iti-${this.id}__search-input`,
|
|
1987
|
-
// Chrome says inputs need either a name or an id
|
|
1988
|
-
type: "search",
|
|
1989
|
-
class: "iti__search-input",
|
|
1990
|
-
placeholder: i18n.searchPlaceholder,
|
|
1991
|
-
// role=combobox + aria-autocomplete=list + aria-activedescendant allows maintaining focus on the search input while allowing users to navigate search results with up/down keyboard keys
|
|
1992
|
-
role: "combobox",
|
|
1993
|
-
"aria-expanded": "true",
|
|
1994
|
-
"aria-label": i18n.searchPlaceholder,
|
|
1995
|
-
"aria-controls": `iti-${this.id}__country-listbox`,
|
|
1996
|
-
"aria-autocomplete": "list",
|
|
1997
|
-
"autocomplete": "off"
|
|
1998
|
-
}, searchWrapper);
|
|
1999
|
-
this.searchClearButton = createEl("button", {
|
|
2000
|
-
type: "button",
|
|
2001
|
-
class: "iti__search-clear iti__hide",
|
|
2002
|
-
"aria-label": i18n.clearSearchAriaLabel,
|
|
2003
|
-
tabindex: "-1"
|
|
2004
|
-
}, searchWrapper);
|
|
2005
|
-
const maskId = `iti-${this.id}-clear-mask`;
|
|
2006
|
-
this.searchClearButton.innerHTML = `
|
|
2007
|
-
<svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
|
|
2008
|
-
<mask id="${maskId}" maskUnits="userSpaceOnUse">
|
|
2009
|
-
<rect width="16" height="16" fill="white" />
|
|
2010
|
-
<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" />
|
|
2011
|
-
</mask>
|
|
2012
|
-
<circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
|
|
2013
|
-
</svg>`;
|
|
2014
|
-
this.searchResultsA11yText = createEl("span", { class: "iti__a11y-text" }, this.dropdownContent);
|
|
2015
|
-
this.searchNoResults = createEl("div", {
|
|
2016
|
-
class: "iti__no-results iti__hide",
|
|
2017
|
-
"aria-hidden": "true"
|
|
2018
|
-
// all a11y messaging happens in this.searchResultsA11yText
|
|
2019
|
-
}, this.dropdownContent);
|
|
2020
|
-
this.searchNoResults.textContent = i18n.zeroSearchResults;
|
|
2021
|
-
}
|
|
2022
|
-
this.countryList = createEl("ul", {
|
|
2023
|
-
class: "iti__country-list",
|
|
2024
|
-
id: `iti-${this.id}__country-listbox`,
|
|
2025
|
-
role: "listbox",
|
|
2026
|
-
"aria-label": i18n.countryListAriaLabel
|
|
2027
|
-
}, this.dropdownContent);
|
|
2028
|
-
this._appendListItems();
|
|
2029
|
-
if (countrySearch) {
|
|
2030
|
-
this._updateSearchResultsA11yText();
|
|
2031
|
-
}
|
|
2032
|
-
if (dropdownContainer) {
|
|
2033
|
-
const dropdownClasses = _Iti._buildClassNames({
|
|
2034
|
-
"iti": true,
|
|
2035
|
-
"iti--container": true,
|
|
2036
|
-
"iti--fullscreen-popup": useFullscreenPopup,
|
|
2037
|
-
"iti--inline-dropdown": !useFullscreenPopup,
|
|
2038
|
-
[containerClass]: Boolean(containerClass)
|
|
2039
|
-
});
|
|
2040
|
-
this.dropdown = createEl("div", { class: dropdownClasses });
|
|
2041
|
-
this.dropdown.appendChild(this.dropdownContent);
|
|
2042
|
-
} else {
|
|
2043
|
-
this.countryContainer.appendChild(this.dropdownContent);
|
|
2044
|
-
}
|
|
2023
|
+
this._buildDropdownContent();
|
|
2045
2024
|
}
|
|
2046
2025
|
}
|
|
2047
|
-
|
|
2026
|
+
}
|
|
2027
|
+
_buildDropdownContent() {
|
|
2028
|
+
const { fixDropdownWidth, useFullscreenPopup, countrySearch, i18n, dropdownContainer, containerClass } = this.options;
|
|
2029
|
+
const extraClasses = fixDropdownWidth ? "" : "iti--flexible-dropdown-width";
|
|
2030
|
+
this.dropdownContent = createEl("div", {
|
|
2031
|
+
id: `iti-${this.id}__dropdown-content`,
|
|
2032
|
+
class: `iti__dropdown-content iti__hide ${extraClasses}`,
|
|
2033
|
+
role: "dialog",
|
|
2034
|
+
"aria-modal": "true"
|
|
2035
|
+
});
|
|
2036
|
+
if (countrySearch) {
|
|
2037
|
+
this._buildSearchUI();
|
|
2038
|
+
}
|
|
2039
|
+
this.countryList = createEl("ul", {
|
|
2040
|
+
class: "iti__country-list",
|
|
2041
|
+
id: `iti-${this.id}__country-listbox`,
|
|
2042
|
+
role: "listbox",
|
|
2043
|
+
"aria-label": i18n.countryListAriaLabel
|
|
2044
|
+
}, this.dropdownContent);
|
|
2045
|
+
this._appendListItems();
|
|
2046
|
+
if (countrySearch) {
|
|
2047
|
+
this._updateSearchResultsA11yText();
|
|
2048
|
+
}
|
|
2049
|
+
if (dropdownContainer) {
|
|
2050
|
+
const dropdownClasses = _Iti._buildClassNames({
|
|
2051
|
+
"iti": true,
|
|
2052
|
+
"iti--container": true,
|
|
2053
|
+
"iti--fullscreen-popup": useFullscreenPopup,
|
|
2054
|
+
"iti--inline-dropdown": !useFullscreenPopup,
|
|
2055
|
+
[containerClass]: Boolean(containerClass)
|
|
2056
|
+
});
|
|
2057
|
+
this.dropdown = createEl("div", { class: dropdownClasses });
|
|
2058
|
+
this.dropdown.appendChild(this.dropdownContent);
|
|
2059
|
+
} else {
|
|
2060
|
+
this.countryContainer.appendChild(this.dropdownContent);
|
|
2061
|
+
}
|
|
2062
|
+
}
|
|
2063
|
+
_buildSearchUI() {
|
|
2064
|
+
const { i18n } = this.options;
|
|
2065
|
+
const searchWrapper = createEl("div", { class: "iti__search-input-wrapper" }, this.dropdownContent);
|
|
2066
|
+
this.searchIcon = createEl("span", {
|
|
2067
|
+
class: "iti__search-icon",
|
|
2068
|
+
"aria-hidden": "true"
|
|
2069
|
+
}, searchWrapper);
|
|
2070
|
+
this.searchIcon.innerHTML = `
|
|
2071
|
+
<svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
|
|
2072
|
+
<circle cx="11" cy="11" r="7" />
|
|
2073
|
+
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
2074
|
+
</svg>`;
|
|
2075
|
+
this.searchInput = createEl("input", {
|
|
2076
|
+
id: `iti-${this.id}__search-input`,
|
|
2077
|
+
// Chrome says inputs need either a name or an id
|
|
2078
|
+
type: "search",
|
|
2079
|
+
class: "iti__search-input",
|
|
2080
|
+
placeholder: i18n.searchPlaceholder,
|
|
2081
|
+
// role=combobox + aria-autocomplete=list + aria-activedescendant allows maintaining focus on the search input while allowing users to navigate search results with up/down keyboard keys
|
|
2082
|
+
role: "combobox",
|
|
2083
|
+
"aria-expanded": "true",
|
|
2084
|
+
"aria-label": i18n.searchPlaceholder,
|
|
2085
|
+
"aria-controls": `iti-${this.id}__country-listbox`,
|
|
2086
|
+
"aria-autocomplete": "list",
|
|
2087
|
+
"autocomplete": "off"
|
|
2088
|
+
}, searchWrapper);
|
|
2089
|
+
this.searchClearButton = createEl("button", {
|
|
2090
|
+
type: "button",
|
|
2091
|
+
class: "iti__search-clear iti__hide",
|
|
2092
|
+
"aria-label": i18n.clearSearchAriaLabel,
|
|
2093
|
+
tabindex: "-1"
|
|
2094
|
+
}, searchWrapper);
|
|
2095
|
+
const maskId = `iti-${this.id}-clear-mask`;
|
|
2096
|
+
this.searchClearButton.innerHTML = `
|
|
2097
|
+
<svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
|
|
2098
|
+
<mask id="${maskId}" maskUnits="userSpaceOnUse">
|
|
2099
|
+
<rect width="16" height="16" fill="white" />
|
|
2100
|
+
<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" />
|
|
2101
|
+
</mask>
|
|
2102
|
+
<circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
|
|
2103
|
+
</svg>`;
|
|
2104
|
+
this.searchResultsA11yText = createEl("span", { class: "iti__a11y-text" }, this.dropdownContent);
|
|
2105
|
+
this.searchNoResults = createEl("div", {
|
|
2106
|
+
class: "iti__no-results iti__hide",
|
|
2107
|
+
"aria-hidden": "true"
|
|
2108
|
+
// all a11y messaging happens in this.searchResultsA11yText
|
|
2109
|
+
}, this.dropdownContent);
|
|
2110
|
+
this.searchNoResults.textContent = i18n.zeroSearchResults;
|
|
2111
|
+
}
|
|
2112
|
+
_maybeUpdateInputPaddingAndReveal() {
|
|
2048
2113
|
if (this.countryContainer) {
|
|
2049
2114
|
this._updateInputPadding();
|
|
2050
2115
|
this.countryContainer.classList.remove("iti__v-hide");
|
|
2051
2116
|
}
|
|
2117
|
+
}
|
|
2118
|
+
_maybeBuildHiddenInputs(wrapper) {
|
|
2119
|
+
var _a, _b;
|
|
2120
|
+
const { hiddenInput } = this.options;
|
|
2052
2121
|
if (hiddenInput) {
|
|
2053
2122
|
const telInputName = this.telInput.getAttribute("name") || "";
|
|
2054
2123
|
const names = hiddenInput(telInputName);
|
|
2055
2124
|
if (names.phone) {
|
|
2056
|
-
const existingInput = (
|
|
2125
|
+
const existingInput = (_a = this.telInput.form) === null || _a === void 0 ? void 0 : _a.querySelector(`input[name="${names.phone}"]`);
|
|
2057
2126
|
if (existingInput) {
|
|
2058
2127
|
this.hiddenInput = existingInput;
|
|
2059
2128
|
} else {
|
|
@@ -2065,7 +2134,7 @@ var Iti = class _Iti {
|
|
|
2065
2134
|
}
|
|
2066
2135
|
}
|
|
2067
2136
|
if (names.country) {
|
|
2068
|
-
const existingInput = (
|
|
2137
|
+
const existingInput = (_b = this.telInput.form) === null || _b === void 0 ? void 0 : _b.querySelector(`input[name="${names.country}"]`);
|
|
2069
2138
|
if (existingInput) {
|
|
2070
2139
|
this.hiddenInputCountry = existingInput;
|
|
2071
2140
|
} else {
|
|
@@ -2118,14 +2187,13 @@ var Iti = class _Iti {
|
|
|
2118
2187
|
this._updateCountryFromNumber(val);
|
|
2119
2188
|
} else if (!isAutoCountry || overrideAutoCountry) {
|
|
2120
2189
|
const lowerInitialCountry = initialCountry ? initialCountry.toLowerCase() : "";
|
|
2121
|
-
|
|
2122
|
-
if (isValidInitialCountry) {
|
|
2190
|
+
if (isIso2(lowerInitialCountry)) {
|
|
2123
2191
|
this._setCountry(lowerInitialCountry);
|
|
2124
2192
|
} else {
|
|
2125
2193
|
if (dialCode && isRegionlessNanpNumber) {
|
|
2126
2194
|
this._setCountry("us");
|
|
2127
2195
|
} else {
|
|
2128
|
-
this._setCountry();
|
|
2196
|
+
this._setCountry("");
|
|
2129
2197
|
}
|
|
2130
2198
|
}
|
|
2131
2199
|
}
|
|
@@ -2223,8 +2291,7 @@ var Iti = class _Iti {
|
|
|
2223
2291
|
if (typeof this.options.geoIpLookup === "function") {
|
|
2224
2292
|
this.options.geoIpLookup((iso2 = "") => {
|
|
2225
2293
|
const iso2Lower = iso2.toLowerCase();
|
|
2226
|
-
|
|
2227
|
-
if (isValidIso2) {
|
|
2294
|
+
if (isIso2(iso2Lower)) {
|
|
2228
2295
|
intlTelInput.autoCountry = iso2Lower;
|
|
2229
2296
|
setTimeout(() => forEachInstance("handleAutoCountry"));
|
|
2230
2297
|
} else {
|
|
@@ -2245,6 +2312,11 @@ var Iti = class _Iti {
|
|
|
2245
2312
|
}
|
|
2246
2313
|
//* Initialize the tel input listeners.
|
|
2247
2314
|
_initTelInputListeners() {
|
|
2315
|
+
this._bindInputListener();
|
|
2316
|
+
this._maybeBindKeydownListener();
|
|
2317
|
+
this._maybeBindPasteListener();
|
|
2318
|
+
}
|
|
2319
|
+
_bindInputListener() {
|
|
2248
2320
|
const { strictMode, formatAsYouType, separateDialCode, allowDropdown, countrySearch } = this.options;
|
|
2249
2321
|
let userOverrideFormatting = false;
|
|
2250
2322
|
if (/\p{L}/u.test(this.telInput.value)) {
|
|
@@ -2275,13 +2347,17 @@ var Iti = class _Iti {
|
|
|
2275
2347
|
const valueBeforeCaret = this.telInput.value.substring(0, currentCaretPos);
|
|
2276
2348
|
const relevantCharsBeforeCaret = valueBeforeCaret.replace(/[^+0-9]/g, "").length;
|
|
2277
2349
|
const isDeleteForwards = (e === null || e === void 0 ? void 0 : e.inputType) === "deleteContentForward";
|
|
2278
|
-
const
|
|
2350
|
+
const fullNumber = this._getFullNumber();
|
|
2351
|
+
const formattedValue = formatNumberAsYouType(fullNumber, this.telInput.value, intlTelInput.utils, this.selectedCountryData, this.options.separateDialCode);
|
|
2279
2352
|
const newCaretPos = translateCursorPosition(relevantCharsBeforeCaret, formattedValue, currentCaretPos, isDeleteForwards);
|
|
2280
2353
|
this.telInput.value = formattedValue;
|
|
2281
2354
|
this.telInput.setSelectionRange(newCaretPos, newCaretPos);
|
|
2282
2355
|
}
|
|
2283
2356
|
};
|
|
2284
2357
|
this.telInput.addEventListener("input", this._handleInputEvent);
|
|
2358
|
+
}
|
|
2359
|
+
_maybeBindKeydownListener() {
|
|
2360
|
+
const { strictMode, separateDialCode, allowDropdown, countrySearch } = this.options;
|
|
2285
2361
|
if (strictMode || separateDialCode) {
|
|
2286
2362
|
this._handleKeydownEvent = (e) => {
|
|
2287
2363
|
if (e.key && e.key.length === 1 && !e.altKey && !e.ctrlKey && !e.metaKey) {
|
|
@@ -2310,12 +2386,17 @@ var Iti = class _Iti {
|
|
|
2310
2386
|
};
|
|
2311
2387
|
this.telInput.addEventListener("keydown", this._handleKeydownEvent);
|
|
2312
2388
|
}
|
|
2313
|
-
|
|
2389
|
+
}
|
|
2390
|
+
_maybeBindPasteListener() {
|
|
2391
|
+
if (this.options.strictMode) {
|
|
2314
2392
|
this._handlePasteEvent = (e) => {
|
|
2315
2393
|
e.preventDefault();
|
|
2316
2394
|
const input = this.telInput;
|
|
2317
2395
|
const selStart = input.selectionStart;
|
|
2318
2396
|
const selEnd = input.selectionEnd;
|
|
2397
|
+
const before = input.value.slice(0, selStart);
|
|
2398
|
+
const after = input.value.slice(selEnd);
|
|
2399
|
+
const iso2 = this.selectedCountryData.iso2;
|
|
2319
2400
|
const pasted = e.clipboardData.getData("text");
|
|
2320
2401
|
const initialCharSelected = selStart === 0 && selEnd > 0;
|
|
2321
2402
|
const allowLeadingPlus = !input.value.startsWith("+") || initialCharSelected;
|
|
@@ -2323,8 +2404,15 @@ var Iti = class _Iti {
|
|
|
2323
2404
|
const hasLeadingPlus = allowedChars.startsWith("+");
|
|
2324
2405
|
const numerics = allowedChars.replace(/\+/g, "");
|
|
2325
2406
|
const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
|
|
2326
|
-
let newVal =
|
|
2327
|
-
|
|
2407
|
+
let newVal = before + sanitised + after;
|
|
2408
|
+
let coreNumber = intlTelInput.utils.getCoreNumber(newVal, iso2);
|
|
2409
|
+
while (coreNumber.length === 0 && newVal.length > 0) {
|
|
2410
|
+
newVal = newVal.slice(0, -1);
|
|
2411
|
+
coreNumber = intlTelInput.utils.getCoreNumber(newVal, iso2);
|
|
2412
|
+
}
|
|
2413
|
+
if (!coreNumber) {
|
|
2414
|
+
return;
|
|
2415
|
+
}
|
|
2328
2416
|
if (this.maxCoreNumberLength && coreNumber.length > this.maxCoreNumberLength) {
|
|
2329
2417
|
if (input.selectionEnd === input.value.length) {
|
|
2330
2418
|
const trimLength = coreNumber.length - this.maxCoreNumberLength;
|
|
@@ -2490,43 +2578,14 @@ var Iti = class _Iti {
|
|
|
2490
2578
|
}
|
|
2491
2579
|
//* Country search enabled: Filter the countries according to the search query.
|
|
2492
2580
|
_filterCountries(query) {
|
|
2493
|
-
let noCountriesAddedYet = true;
|
|
2494
2581
|
this.countryList.innerHTML = "";
|
|
2495
|
-
const normalisedQuery = normaliseString(query);
|
|
2496
2582
|
let matchedCountries;
|
|
2497
2583
|
if (query === "") {
|
|
2498
2584
|
matchedCountries = this.countries;
|
|
2499
2585
|
} else {
|
|
2500
|
-
|
|
2501
|
-
const nameStartWith = [];
|
|
2502
|
-
const nameContains = [];
|
|
2503
|
-
const dialCodeMatches = [];
|
|
2504
|
-
const dialCodeContains = [];
|
|
2505
|
-
const initialsMatches = [];
|
|
2506
|
-
for (const c of this.countries) {
|
|
2507
|
-
if (c.iso2 === normalisedQuery) {
|
|
2508
|
-
iso2Matches.push(c);
|
|
2509
|
-
} else if (c.normalisedName.startsWith(normalisedQuery)) {
|
|
2510
|
-
nameStartWith.push(c);
|
|
2511
|
-
} else if (c.normalisedName.includes(normalisedQuery)) {
|
|
2512
|
-
nameContains.push(c);
|
|
2513
|
-
} else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
|
|
2514
|
-
dialCodeMatches.push(c);
|
|
2515
|
-
} else if (c.dialCodePlus.includes(normalisedQuery)) {
|
|
2516
|
-
dialCodeContains.push(c);
|
|
2517
|
-
} else if (c.initials.includes(normalisedQuery)) {
|
|
2518
|
-
initialsMatches.push(c);
|
|
2519
|
-
}
|
|
2520
|
-
}
|
|
2521
|
-
matchedCountries = [
|
|
2522
|
-
...iso2Matches.sort((a, b) => a.priority - b.priority),
|
|
2523
|
-
...nameStartWith.sort((a, b) => a.priority - b.priority),
|
|
2524
|
-
...nameContains.sort((a, b) => a.priority - b.priority),
|
|
2525
|
-
...dialCodeMatches.sort((a, b) => a.priority - b.priority),
|
|
2526
|
-
...dialCodeContains.sort((a, b) => a.priority - b.priority),
|
|
2527
|
-
...initialsMatches.sort((a, b) => a.priority - b.priority)
|
|
2528
|
-
];
|
|
2586
|
+
matchedCountries = this._getMatchedCountries(query);
|
|
2529
2587
|
}
|
|
2588
|
+
let noCountriesAddedYet = true;
|
|
2530
2589
|
for (const c of matchedCountries) {
|
|
2531
2590
|
const listItem = c.nodeById[this.id];
|
|
2532
2591
|
if (listItem) {
|
|
@@ -2548,6 +2607,38 @@ var Iti = class _Iti {
|
|
|
2548
2607
|
this.countryList.scrollTop = 0;
|
|
2549
2608
|
this._updateSearchResultsA11yText();
|
|
2550
2609
|
}
|
|
2610
|
+
_getMatchedCountries(query) {
|
|
2611
|
+
const normalisedQuery = normaliseString(query);
|
|
2612
|
+
const iso2Matches = [];
|
|
2613
|
+
const nameStartWith = [];
|
|
2614
|
+
const nameContains = [];
|
|
2615
|
+
const dialCodeMatches = [];
|
|
2616
|
+
const dialCodeContains = [];
|
|
2617
|
+
const initialsMatches = [];
|
|
2618
|
+
for (const c of this.countries) {
|
|
2619
|
+
if (c.iso2 === normalisedQuery) {
|
|
2620
|
+
iso2Matches.push(c);
|
|
2621
|
+
} else if (c.normalisedName.startsWith(normalisedQuery)) {
|
|
2622
|
+
nameStartWith.push(c);
|
|
2623
|
+
} else if (c.normalisedName.includes(normalisedQuery)) {
|
|
2624
|
+
nameContains.push(c);
|
|
2625
|
+
} else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
|
|
2626
|
+
dialCodeMatches.push(c);
|
|
2627
|
+
} else if (c.dialCodePlus.includes(normalisedQuery)) {
|
|
2628
|
+
dialCodeContains.push(c);
|
|
2629
|
+
} else if (c.initials.includes(normalisedQuery)) {
|
|
2630
|
+
initialsMatches.push(c);
|
|
2631
|
+
}
|
|
2632
|
+
}
|
|
2633
|
+
return [
|
|
2634
|
+
...iso2Matches.sort((a, b) => a.priority - b.priority),
|
|
2635
|
+
...nameStartWith.sort((a, b) => a.priority - b.priority),
|
|
2636
|
+
...nameContains.sort((a, b) => a.priority - b.priority),
|
|
2637
|
+
...dialCodeMatches.sort((a, b) => a.priority - b.priority),
|
|
2638
|
+
...dialCodeContains.sort((a, b) => a.priority - b.priority),
|
|
2639
|
+
...initialsMatches.sort((a, b) => a.priority - b.priority)
|
|
2640
|
+
];
|
|
2641
|
+
}
|
|
2551
2642
|
//* Update search results text (for a11y).
|
|
2552
2643
|
_updateSearchResultsA11yText() {
|
|
2553
2644
|
const { i18n } = this.options;
|
|
@@ -2675,24 +2766,12 @@ var Iti = class _Iti {
|
|
|
2675
2766
|
this.highlightedItem.focus();
|
|
2676
2767
|
}
|
|
2677
2768
|
}
|
|
2678
|
-
//* Find the country data for the given iso2 code
|
|
2679
|
-
//* the allowFail option is only used during init() for the initialCountry option, and for the iso2 returned from geoIpLookup - in these 2 cases we don't want to error out
|
|
2680
|
-
_getCountryData(iso2, allowFail) {
|
|
2681
|
-
const country = this.countryByIso2.get(iso2);
|
|
2682
|
-
if (country) {
|
|
2683
|
-
return country;
|
|
2684
|
-
}
|
|
2685
|
-
if (allowFail) {
|
|
2686
|
-
return null;
|
|
2687
|
-
}
|
|
2688
|
-
throw new Error(`No country data for '${iso2}'`);
|
|
2689
|
-
}
|
|
2690
2769
|
//* Update the selected country, dial code (if separateDialCode), placeholder, title, and active list item.
|
|
2691
2770
|
//* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
|
|
2692
2771
|
_setCountry(iso2) {
|
|
2693
2772
|
const { separateDialCode, showFlags, i18n } = this.options;
|
|
2694
2773
|
const prevIso2 = this.selectedCountryData.iso2 || "";
|
|
2695
|
-
this.selectedCountryData = iso2 ? this.
|
|
2774
|
+
this.selectedCountryData = iso2 ? this.countryByIso2.get(iso2) : {};
|
|
2696
2775
|
if (this.selectedCountryData.iso2) {
|
|
2697
2776
|
this.defaultCountry = this.selectedCountryData.iso2;
|
|
2698
2777
|
}
|
|
@@ -2797,9 +2876,11 @@ var Iti = class _Iti {
|
|
|
2797
2876
|
}
|
|
2798
2877
|
//* Called when the user selects a list item from the dropdown.
|
|
2799
2878
|
_selectListItem(listItem) {
|
|
2800
|
-
const
|
|
2879
|
+
const iso2 = listItem.getAttribute("data-country-code");
|
|
2880
|
+
const countryChanged = this._setCountry(iso2);
|
|
2801
2881
|
this._closeDropdown();
|
|
2802
|
-
|
|
2882
|
+
const dialCode = listItem.getAttribute("data-dial-code");
|
|
2883
|
+
this._updateDialCode(dialCode);
|
|
2803
2884
|
if (this.options.formatOnDisplay) {
|
|
2804
2885
|
this._updateValFromNumber(this.telInput.value);
|
|
2805
2886
|
}
|
|
@@ -2881,7 +2962,7 @@ var Iti = class _Iti {
|
|
|
2881
2962
|
let numericChars = "";
|
|
2882
2963
|
for (let i = 0; i < number.length; i++) {
|
|
2883
2964
|
const c = number.charAt(i);
|
|
2884
|
-
if (
|
|
2965
|
+
if (/[0-9]/.test(c)) {
|
|
2885
2966
|
numericChars += c;
|
|
2886
2967
|
if (includeAreaCode) {
|
|
2887
2968
|
if (this.dialCodeToIso2Map[numericChars]) {
|
|
@@ -2916,32 +2997,14 @@ var Iti = class _Iti {
|
|
|
2916
2997
|
}
|
|
2917
2998
|
//* Remove the dial code if separateDialCode is enabled also cap the length if the input has a maxlength attribute
|
|
2918
2999
|
_beforeSetNumber(fullNumber) {
|
|
2919
|
-
|
|
2920
|
-
|
|
2921
|
-
let dialCode = this._getDialCode(number);
|
|
2922
|
-
if (dialCode) {
|
|
2923
|
-
dialCode = `+${this.selectedCountryData.dialCode}`;
|
|
2924
|
-
const start = number[dialCode.length] === " " || number[dialCode.length] === "-" ? dialCode.length + 1 : dialCode.length;
|
|
2925
|
-
number = number.substring(start);
|
|
2926
|
-
}
|
|
2927
|
-
}
|
|
3000
|
+
const dialCode = this._getDialCode(fullNumber);
|
|
3001
|
+
const number = beforeSetNumber(fullNumber, dialCode, this.options.separateDialCode, this.selectedCountryData);
|
|
2928
3002
|
return this._cap(number);
|
|
2929
3003
|
}
|
|
2930
3004
|
//* Trigger the 'countrychange' event.
|
|
2931
3005
|
_triggerCountryChange() {
|
|
2932
3006
|
this._trigger("countrychange");
|
|
2933
3007
|
}
|
|
2934
|
-
//* Format the number as the user types.
|
|
2935
|
-
_formatNumberAsYouType() {
|
|
2936
|
-
const val = this._getFullNumber();
|
|
2937
|
-
const result = intlTelInput.utils ? intlTelInput.utils.formatNumberAsYouType(val, this.selectedCountryData.iso2) : val;
|
|
2938
|
-
const { dialCode } = this.selectedCountryData;
|
|
2939
|
-
if (this.options.separateDialCode && this.telInput.value.charAt(0) !== "+" && result.includes(`+${dialCode}`)) {
|
|
2940
|
-
const afterDialCode = result.split(`+${dialCode}`)[1] || "";
|
|
2941
|
-
return afterDialCode.trim();
|
|
2942
|
-
}
|
|
2943
|
-
return result;
|
|
2944
|
-
}
|
|
2945
3008
|
//**************************
|
|
2946
3009
|
//* SECRET PUBLIC METHODS
|
|
2947
3010
|
//**************************
|
|
@@ -3078,6 +3141,9 @@ var Iti = class _Iti {
|
|
|
3078
3141
|
//* Update the selected country, and update the input val accordingly.
|
|
3079
3142
|
setCountry(iso2) {
|
|
3080
3143
|
const iso2Lower = iso2 === null || iso2 === void 0 ? void 0 : iso2.toLowerCase();
|
|
3144
|
+
if (!isIso2(iso2Lower)) {
|
|
3145
|
+
throw new Error(`Invalid country code: '${iso2Lower}'`);
|
|
3146
|
+
}
|
|
3081
3147
|
const currentCountry = this.selectedCountryData.iso2;
|
|
3082
3148
|
const isCountryChange = iso2 && iso2Lower !== currentCountry || !iso2 && currentCountry;
|
|
3083
3149
|
if (isCountryChange) {
|
|
@@ -3163,7 +3229,7 @@ var intlTelInput = Object.assign((input, options) => {
|
|
|
3163
3229
|
attachUtils,
|
|
3164
3230
|
startedLoadingUtilsScript: false,
|
|
3165
3231
|
startedLoadingAutoCountry: false,
|
|
3166
|
-
version: "25.10.
|
|
3232
|
+
version: "25.10.9"
|
|
3167
3233
|
});
|
|
3168
3234
|
var intl_tel_input_default = intlTelInput;
|
|
3169
3235
|
|
|
@@ -3389,7 +3455,7 @@ IntlTelInputComponent.\u0275cmp = /* @__PURE__ */ i0.\u0275\u0275defineComponent
|
|
|
3389
3455
|
}] });
|
|
3390
3456
|
})();
|
|
3391
3457
|
(() => {
|
|
3392
|
-
(typeof ngDevMode === "undefined" || ngDevMode) && i0.\u0275setClassDebugInfo(IntlTelInputComponent, { className: "IntlTelInputComponent", filePath: "intl-tel-input/angular.ts", lineNumber:
|
|
3458
|
+
(typeof ngDevMode === "undefined" || ngDevMode) && i0.\u0275setClassDebugInfo(IntlTelInputComponent, { className: "IntlTelInputComponent", filePath: "intl-tel-input/angular.ts", lineNumber: 42 });
|
|
3393
3459
|
})();
|
|
3394
3460
|
export {
|
|
3395
3461
|
IntlTelInputComponent,
|