intl-tel-input 25.10.11 → 25.10.12
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 +24 -27
- package/angular/build/IntlTelInputWithUtils.js +24 -27
- package/angular/build/types/intl-tel-input.d.ts +0 -2
- package/build/css/intlTelInput.css +1 -13
- 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/intlTelInput.d.ts +0 -2
- package/build/js/intlTelInput.js +25 -28
- package/build/js/intlTelInput.min.js +3 -3
- package/build/js/intlTelInputWithUtils.js +25 -28
- package/build/js/intlTelInputWithUtils.min.js +3 -3
- package/package.json +1 -1
- package/react/README.md +1 -1
- package/react/build/IntlTelInput.cjs +24 -27
- package/react/build/IntlTelInput.d.ts +0 -2
- package/react/build/IntlTelInput.js +24 -27
- package/react/build/IntlTelInputWithUtils.cjs +24 -27
- package/react/build/IntlTelInputWithUtils.js +24 -27
- package/vue/README.md +1 -1
- package/vue/build/IntlTelInput.mjs +398 -392
- package/vue/build/IntlTelInputWithUtils.mjs +284 -278
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { mergeModels as A, useModel as
|
|
2
|
-
const
|
|
1
|
+
import { mergeModels as A, useModel as T, ref as N, onMounted as M, watch as B, onUnmounted as F, withDirectives as R, createElementBlock as z, openBlock as V, mergeProps as $, vModelText as U } from "vue";
|
|
2
|
+
const j = [
|
|
3
3
|
[
|
|
4
4
|
"af",
|
|
5
5
|
// Afghanistan
|
|
@@ -1676,20 +1676,20 @@ const U = [
|
|
|
1676
1676
|
null,
|
|
1677
1677
|
"0"
|
|
1678
1678
|
]
|
|
1679
|
-
],
|
|
1680
|
-
for (const
|
|
1681
|
-
|
|
1679
|
+
], _ = [];
|
|
1680
|
+
for (const r of j)
|
|
1681
|
+
_.push({
|
|
1682
1682
|
name: "",
|
|
1683
1683
|
// populated in the plugin
|
|
1684
|
-
iso2:
|
|
1685
|
-
dialCode:
|
|
1686
|
-
priority:
|
|
1687
|
-
areaCodes:
|
|
1684
|
+
iso2: r[0],
|
|
1685
|
+
dialCode: r[1],
|
|
1686
|
+
priority: r[2] || 0,
|
|
1687
|
+
areaCodes: r[3] || null,
|
|
1688
1688
|
nodeById: {},
|
|
1689
1689
|
// populated by the plugin
|
|
1690
|
-
nationalPrefix:
|
|
1690
|
+
nationalPrefix: r[4] || null
|
|
1691
1691
|
});
|
|
1692
|
-
const
|
|
1692
|
+
const O = {
|
|
1693
1693
|
ad: "Andorra",
|
|
1694
1694
|
ae: "United Arab Emirates",
|
|
1695
1695
|
af: "Afghanistan",
|
|
@@ -1944,10 +1944,10 @@ const j = {
|
|
|
1944
1944
|
// additional countries (not supported by country-list library)
|
|
1945
1945
|
ac: "Ascension Island",
|
|
1946
1946
|
xk: "Kosovo"
|
|
1947
|
-
}, P = { ...
|
|
1947
|
+
}, P = { ...O, ...H }, D = (r) => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia(r).matches, K = () => {
|
|
1948
1948
|
if (typeof navigator < "u" && typeof window < "u") {
|
|
1949
|
-
const
|
|
1950
|
-
return
|
|
1949
|
+
const r = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), e = D("(max-width: 500px)"), t = D("(max-height: 600px)"), i = D("(pointer: coarse)");
|
|
1950
|
+
return r || e || i && t;
|
|
1951
1951
|
}
|
|
1952
1952
|
return !1;
|
|
1953
1953
|
}, x = {
|
|
@@ -2002,106 +2002,106 @@ const j = {
|
|
|
2002
2002
|
//* The number type to enforce during validation.
|
|
2003
2003
|
validationNumberTypes: ["MOBILE"]
|
|
2004
2004
|
};
|
|
2005
|
-
function W(
|
|
2006
|
-
|
|
2005
|
+
function W(r) {
|
|
2006
|
+
r.useFullscreenPopup && (r.fixDropdownWidth = !1), r.onlyCountries.length === 1 && (r.initialCountry = r.onlyCountries[0]), r.separateDialCode && (r.nationalMode = !1), r.allowDropdown && !r.showFlags && !r.separateDialCode && (r.nationalMode = !1), r.useFullscreenPopup && !r.dropdownContainer && (r.dropdownContainer = document.body), r.i18n = { ...P, ...r.i18n };
|
|
2007
2007
|
}
|
|
2008
|
-
const
|
|
2009
|
-
const i = document.createElement(
|
|
2010
|
-
return
|
|
2008
|
+
const I = (r) => r.replace(/\D/g, ""), E = (r = "") => r.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase(), m = (r, e, t) => {
|
|
2009
|
+
const i = document.createElement(r);
|
|
2010
|
+
return e && Object.entries(e).forEach(([n, s]) => i.setAttribute(n, s)), t && t.appendChild(i), i;
|
|
2011
2011
|
};
|
|
2012
|
-
function G(
|
|
2013
|
-
const { onlyCountries:
|
|
2014
|
-
if (
|
|
2015
|
-
const i = t.map((n) => n.toLowerCase());
|
|
2016
|
-
return b.filter((n) => i.includes(n.iso2));
|
|
2017
|
-
} else if (e.length) {
|
|
2012
|
+
function G(r) {
|
|
2013
|
+
const { onlyCountries: e, excludeCountries: t } = r;
|
|
2014
|
+
if (e.length) {
|
|
2018
2015
|
const i = e.map((n) => n.toLowerCase());
|
|
2019
|
-
return
|
|
2016
|
+
return _.filter((n) => i.includes(n.iso2));
|
|
2017
|
+
} else if (t.length) {
|
|
2018
|
+
const i = t.map((n) => n.toLowerCase());
|
|
2019
|
+
return _.filter((n) => !i.includes(n.iso2));
|
|
2020
2020
|
}
|
|
2021
|
-
return
|
|
2021
|
+
return _;
|
|
2022
2022
|
}
|
|
2023
|
-
function q(
|
|
2024
|
-
for (const
|
|
2025
|
-
const i =
|
|
2026
|
-
|
|
2023
|
+
function q(r, e) {
|
|
2024
|
+
for (const t of r) {
|
|
2025
|
+
const i = t.iso2.toLowerCase();
|
|
2026
|
+
e.i18n[i] && (t.name = e.i18n[i]);
|
|
2027
2027
|
}
|
|
2028
2028
|
}
|
|
2029
|
-
function Y(
|
|
2030
|
-
const
|
|
2029
|
+
function Y(r, e) {
|
|
2030
|
+
const t = /* @__PURE__ */ new Set();
|
|
2031
2031
|
let i = 0;
|
|
2032
|
-
const n = {}, s = (o, a,
|
|
2032
|
+
const n = {}, s = (o, a, d) => {
|
|
2033
2033
|
if (!o || !a)
|
|
2034
2034
|
return;
|
|
2035
2035
|
a.length > i && (i = a.length), n.hasOwnProperty(a) || (n[a] = []);
|
|
2036
|
-
const
|
|
2037
|
-
if (
|
|
2036
|
+
const l = n[a];
|
|
2037
|
+
if (l.includes(o))
|
|
2038
2038
|
return;
|
|
2039
|
-
const h =
|
|
2040
|
-
|
|
2039
|
+
const h = d !== void 0 ? d : l.length;
|
|
2040
|
+
l[h] = o;
|
|
2041
2041
|
};
|
|
2042
|
-
for (const o of
|
|
2043
|
-
|
|
2042
|
+
for (const o of r) {
|
|
2043
|
+
t.has(o.dialCode) || t.add(o.dialCode);
|
|
2044
2044
|
for (let a = 1; a < o.dialCode.length; a++) {
|
|
2045
|
-
const
|
|
2046
|
-
s(o.iso2,
|
|
2045
|
+
const d = o.dialCode.substring(0, a);
|
|
2046
|
+
s(o.iso2, d);
|
|
2047
2047
|
}
|
|
2048
2048
|
s(o.iso2, o.dialCode, o.priority);
|
|
2049
2049
|
}
|
|
2050
|
-
(
|
|
2050
|
+
(e.onlyCountries.length || e.excludeCountries.length) && t.forEach((o) => {
|
|
2051
2051
|
n[o] = n[o].filter(Boolean);
|
|
2052
2052
|
});
|
|
2053
|
-
for (const o of
|
|
2053
|
+
for (const o of r)
|
|
2054
2054
|
if (o.areaCodes) {
|
|
2055
2055
|
const a = n[o.dialCode][0];
|
|
2056
|
-
for (const
|
|
2057
|
-
for (let
|
|
2058
|
-
const h =
|
|
2056
|
+
for (const d of o.areaCodes) {
|
|
2057
|
+
for (let l = 1; l < d.length; l++) {
|
|
2058
|
+
const h = d.substring(0, l), p = o.dialCode + h;
|
|
2059
2059
|
s(a, p), s(o.iso2, p);
|
|
2060
2060
|
}
|
|
2061
|
-
s(o.iso2, o.dialCode +
|
|
2061
|
+
s(o.iso2, o.dialCode + d);
|
|
2062
2062
|
}
|
|
2063
2063
|
}
|
|
2064
|
-
return { dialCodes:
|
|
2064
|
+
return { dialCodes: t, dialCodeMaxLen: i, dialCodeToIso2Map: n };
|
|
2065
2065
|
}
|
|
2066
|
-
function J(
|
|
2067
|
-
|
|
2068
|
-
const { countryOrder: n } =
|
|
2066
|
+
function J(r, e) {
|
|
2067
|
+
e.countryOrder && (e.countryOrder = e.countryOrder.map((t) => t.toLowerCase())), r.sort((t, i) => {
|
|
2068
|
+
const { countryOrder: n } = e;
|
|
2069
2069
|
if (n) {
|
|
2070
|
-
const s = n.indexOf(
|
|
2071
|
-
if (a ||
|
|
2072
|
-
return a &&
|
|
2070
|
+
const s = n.indexOf(t.iso2), o = n.indexOf(i.iso2), a = s > -1, d = o > -1;
|
|
2071
|
+
if (a || d)
|
|
2072
|
+
return a && d ? s - o : a ? -1 : 1;
|
|
2073
2073
|
}
|
|
2074
|
-
return
|
|
2074
|
+
return t.name.localeCompare(i.name);
|
|
2075
2075
|
});
|
|
2076
2076
|
}
|
|
2077
|
-
function Z(
|
|
2078
|
-
for (const
|
|
2079
|
-
|
|
2077
|
+
function Z(r) {
|
|
2078
|
+
for (const e of r)
|
|
2079
|
+
e.normalisedName = E(e.name), e.initials = e.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((t) => t[0]).join("").toLowerCase(), e.dialCodePlus = `+${e.dialCode}`;
|
|
2080
2080
|
}
|
|
2081
|
-
function Q(
|
|
2082
|
-
let n =
|
|
2083
|
-
if (
|
|
2084
|
-
|
|
2085
|
-
const s = n[
|
|
2081
|
+
function Q(r, e, t, i) {
|
|
2082
|
+
let n = r;
|
|
2083
|
+
if (t && e) {
|
|
2084
|
+
e = `+${i.dialCode}`;
|
|
2085
|
+
const s = n[e.length] === " " || n[e.length] === "-" ? e.length + 1 : e.length;
|
|
2086
2086
|
n = n.substring(s);
|
|
2087
2087
|
}
|
|
2088
2088
|
return n;
|
|
2089
2089
|
}
|
|
2090
|
-
function X(
|
|
2091
|
-
const s =
|
|
2092
|
-
return n &&
|
|
2090
|
+
function X(r, e, t, i, n) {
|
|
2091
|
+
const s = t ? t.formatNumberAsYouType(r, i.iso2) : r, { dialCode: o } = i;
|
|
2092
|
+
return n && e.charAt(0) !== "+" && s.includes(`+${o}`) ? (s.split(`+${o}`)[1] || "").trim() : s;
|
|
2093
2093
|
}
|
|
2094
|
-
function tt(
|
|
2095
|
-
if (
|
|
2094
|
+
function tt(r, e, t, i) {
|
|
2095
|
+
if (t === 0 && !i)
|
|
2096
2096
|
return 0;
|
|
2097
2097
|
let n = 0;
|
|
2098
|
-
for (let s = 0; s <
|
|
2099
|
-
if (/[+0-9]/.test(
|
|
2098
|
+
for (let s = 0; s < e.length; s++) {
|
|
2099
|
+
if (/[+0-9]/.test(e[s]) && n++, n === r && !i)
|
|
2100
2100
|
return s + 1;
|
|
2101
|
-
if (i && n ===
|
|
2101
|
+
if (i && n === r + 1)
|
|
2102
2102
|
return s;
|
|
2103
2103
|
}
|
|
2104
|
-
return
|
|
2104
|
+
return e.length;
|
|
2105
2105
|
}
|
|
2106
2106
|
const et = [
|
|
2107
2107
|
"800",
|
|
@@ -2121,44 +2121,42 @@ const et = [
|
|
|
2121
2121
|
"887",
|
|
2122
2122
|
"888",
|
|
2123
2123
|
"889"
|
|
2124
|
-
], k = (
|
|
2125
|
-
const
|
|
2126
|
-
if (
|
|
2127
|
-
const
|
|
2128
|
-
return et.includes(
|
|
2124
|
+
], k = (r) => {
|
|
2125
|
+
const e = I(r);
|
|
2126
|
+
if (e.charAt(0) === "1") {
|
|
2127
|
+
const t = e.substring(1, 4);
|
|
2128
|
+
return et.includes(t);
|
|
2129
2129
|
}
|
|
2130
2130
|
return !1;
|
|
2131
2131
|
};
|
|
2132
|
-
for (const
|
|
2133
|
-
|
|
2132
|
+
for (const r of _)
|
|
2133
|
+
r.name = P[r.iso2];
|
|
2134
2134
|
let it = 0;
|
|
2135
|
-
const nt = new Set(
|
|
2136
|
-
const { instances:
|
|
2137
|
-
Object.values(
|
|
2135
|
+
const nt = new Set(_.map((r) => r.iso2)), S = (r) => nt.has(r), v = (r, ...e) => {
|
|
2136
|
+
const { instances: t } = u;
|
|
2137
|
+
Object.values(t).forEach((i) => i[r](...e));
|
|
2138
2138
|
};
|
|
2139
2139
|
class L {
|
|
2140
2140
|
/**
|
|
2141
2141
|
* Build a space-delimited class string from an object map of className -> truthy/falsey.
|
|
2142
2142
|
* Only keys with truthy values are included.
|
|
2143
2143
|
*/
|
|
2144
|
-
static _buildClassNames(
|
|
2145
|
-
return Object.keys(
|
|
2144
|
+
static _buildClassNames(e) {
|
|
2145
|
+
return Object.keys(e).filter((t) => !!e[t]).join(" ");
|
|
2146
2146
|
}
|
|
2147
|
-
constructor(
|
|
2148
|
-
this.id = it++, this.telInput =
|
|
2147
|
+
constructor(e, t = {}) {
|
|
2148
|
+
this.id = it++, this.telInput = e, this.highlightedItem = null, this.options = Object.assign({}, x, t), this.hadInitialPlaceholder = !!e.getAttribute("placeholder");
|
|
2149
2149
|
}
|
|
2150
2150
|
_detectEnvironmentAndLayout() {
|
|
2151
|
-
this.isAndroid = typeof navigator < "u" ? /Android/i.test(navigator.userAgent) : !1, this.isRTL = !!this.telInput.closest("[dir=rtl]"), this.
|
|
2152
|
-
const t = this.options.allowDropdown || this.options.separateDialCode;
|
|
2153
|
-
this.showSelectedCountryOnLeft = this.isRTL ? !t : t, this.options.separateDialCode && (this.isRTL ? this.originalPaddingRight = this.telInput.style.paddingRight : this.originalPaddingLeft = this.telInput.style.paddingLeft);
|
|
2151
|
+
this.isAndroid = typeof navigator < "u" ? /Android/i.test(navigator.userAgent) : !1, this.isRTL = !!this.telInput.closest("[dir=rtl]"), this.options.separateDialCode && (this.originalPaddingLeft = this.telInput.style.paddingLeft);
|
|
2154
2152
|
}
|
|
2155
2153
|
_createInitPromises() {
|
|
2156
|
-
const
|
|
2154
|
+
const e = new Promise((i, n) => {
|
|
2157
2155
|
this.resolveAutoCountryPromise = i, this.rejectAutoCountryPromise = n;
|
|
2158
|
-
}),
|
|
2156
|
+
}), t = new Promise((i, n) => {
|
|
2159
2157
|
this.resolveUtilsScriptPromise = i, this.rejectUtilsScriptPromise = n;
|
|
2160
2158
|
});
|
|
2161
|
-
this.promise = Promise.all([
|
|
2159
|
+
this.promise = Promise.all([e, t]);
|
|
2162
2160
|
}
|
|
2163
2161
|
//* Can't be private as it's called from intlTelInput convenience wrapper.
|
|
2164
2162
|
_init() {
|
|
@@ -2170,14 +2168,14 @@ class L {
|
|
|
2170
2168
|
//* Prepare all of the country data, including onlyCountries, excludeCountries, countryOrder options.
|
|
2171
2169
|
_processCountryData() {
|
|
2172
2170
|
this.countries = G(this.options);
|
|
2173
|
-
const
|
|
2174
|
-
this.dialCodes =
|
|
2171
|
+
const e = Y(this.countries, this.options);
|
|
2172
|
+
this.dialCodes = e.dialCodes, this.dialCodeMaxLen = e.dialCodeMaxLen, this.dialCodeToIso2Map = e.dialCodeToIso2Map, q(this.countries, this.options), J(this.countries, this.options), this.countryByIso2 = new Map(this.countries.map((t) => [t.iso2, t])), Z(this.countries);
|
|
2175
2173
|
}
|
|
2176
2174
|
//* Generate all of the markup for the plugin: the selected country overlay, and the dropdown.
|
|
2177
2175
|
_generateMarkup() {
|
|
2178
2176
|
this._prepareTelInput();
|
|
2179
|
-
const
|
|
2180
|
-
this._maybeBuildCountryContainer(
|
|
2177
|
+
const e = this._createWrapperAndInsert();
|
|
2178
|
+
this._maybeBuildCountryContainer(e), e.appendChild(this.telInput), this._maybeUpdateInputPaddingAndReveal(), this._maybeBuildHiddenInputs(e);
|
|
2181
2179
|
}
|
|
2182
2180
|
_prepareTelInput() {
|
|
2183
2181
|
this.telInput.classList.add("iti__tel-input"), !this.telInput.hasAttribute("autocomplete") && !(this.telInput.form && this.telInput.form.hasAttribute("autocomplete")) && this.telInput.setAttribute("autocomplete", "off");
|
|
@@ -2185,32 +2183,32 @@ class L {
|
|
|
2185
2183
|
_createWrapperAndInsert() {
|
|
2186
2184
|
var a;
|
|
2187
2185
|
const {
|
|
2188
|
-
allowDropdown:
|
|
2189
|
-
showFlags:
|
|
2186
|
+
allowDropdown: e,
|
|
2187
|
+
showFlags: t,
|
|
2190
2188
|
containerClass: i,
|
|
2191
2189
|
useFullscreenPopup: n
|
|
2192
2190
|
} = this.options, s = L._buildClassNames({
|
|
2193
2191
|
iti: !0,
|
|
2194
|
-
"iti--allow-dropdown":
|
|
2195
|
-
"iti--show-flags":
|
|
2192
|
+
"iti--allow-dropdown": e,
|
|
2193
|
+
"iti--show-flags": t,
|
|
2196
2194
|
"iti--inline-dropdown": !n,
|
|
2197
2195
|
[i]: !!i
|
|
2198
2196
|
}), o = m("div", { class: s });
|
|
2199
|
-
return (a = this.telInput.parentNode) == null || a.insertBefore(o, this.telInput), o;
|
|
2197
|
+
return this.isRTL && o.setAttribute("dir", "ltr"), (a = this.telInput.parentNode) == null || a.insertBefore(o, this.telInput), o;
|
|
2200
2198
|
}
|
|
2201
|
-
_maybeBuildCountryContainer(
|
|
2199
|
+
_maybeBuildCountryContainer(e) {
|
|
2202
2200
|
const {
|
|
2203
|
-
allowDropdown:
|
|
2201
|
+
allowDropdown: t,
|
|
2204
2202
|
separateDialCode: i,
|
|
2205
2203
|
showFlags: n
|
|
2206
2204
|
} = this.options;
|
|
2207
|
-
if (
|
|
2205
|
+
if (t || n || i) {
|
|
2208
2206
|
this.countryContainer = m(
|
|
2209
2207
|
"div",
|
|
2210
2208
|
// visibly hidden until we measure it's width to set the input padding correctly
|
|
2211
2209
|
{ class: "iti__country-container iti__v-hide" },
|
|
2212
|
-
|
|
2213
|
-
),
|
|
2210
|
+
e
|
|
2211
|
+
), t ? (this.selectedCountry = m(
|
|
2214
2212
|
"button",
|
|
2215
2213
|
{
|
|
2216
2214
|
type: "button",
|
|
@@ -2235,32 +2233,32 @@ class L {
|
|
|
2235
2233
|
"div",
|
|
2236
2234
|
{ class: "iti__flag" },
|
|
2237
2235
|
s
|
|
2238
|
-
),
|
|
2236
|
+
), t && (this.dropdownArrow = m(
|
|
2239
2237
|
"div",
|
|
2240
2238
|
{ class: "iti__arrow", "aria-hidden": "true" },
|
|
2241
2239
|
s
|
|
2242
2240
|
)), i && (this.selectedDialCode = m(
|
|
2243
2241
|
"div",
|
|
2244
|
-
{ class: "iti__selected-dial-code"
|
|
2242
|
+
{ class: "iti__selected-dial-code" },
|
|
2245
2243
|
this.selectedCountry
|
|
2246
|
-
)),
|
|
2244
|
+
)), t && this._buildDropdownContent();
|
|
2247
2245
|
}
|
|
2248
2246
|
}
|
|
2249
2247
|
_buildDropdownContent() {
|
|
2250
2248
|
const {
|
|
2251
|
-
fixDropdownWidth:
|
|
2252
|
-
useFullscreenPopup:
|
|
2249
|
+
fixDropdownWidth: e,
|
|
2250
|
+
useFullscreenPopup: t,
|
|
2253
2251
|
countrySearch: i,
|
|
2254
2252
|
i18n: n,
|
|
2255
2253
|
dropdownContainer: s,
|
|
2256
2254
|
containerClass: o
|
|
2257
|
-
} = this.options, a =
|
|
2255
|
+
} = this.options, a = e ? "" : "iti--flexible-dropdown-width";
|
|
2258
2256
|
if (this.dropdownContent = m("div", {
|
|
2259
2257
|
id: `iti-${this.id}__dropdown-content`,
|
|
2260
2258
|
class: `iti__dropdown-content iti__hide ${a}`,
|
|
2261
2259
|
role: "dialog",
|
|
2262
2260
|
"aria-modal": "true"
|
|
2263
|
-
}), i && this._buildSearchUI(), this.countryList = m(
|
|
2261
|
+
}), this.isRTL && this.dropdownContent.setAttribute("dir", "rtl"), i && this._buildSearchUI(), this.countryList = m(
|
|
2264
2262
|
"ul",
|
|
2265
2263
|
{
|
|
2266
2264
|
class: "iti__country-list",
|
|
@@ -2270,19 +2268,19 @@ class L {
|
|
|
2270
2268
|
},
|
|
2271
2269
|
this.dropdownContent
|
|
2272
2270
|
), this._appendListItems(), i && this._updateSearchResultsA11yText(), s) {
|
|
2273
|
-
const
|
|
2271
|
+
const d = L._buildClassNames({
|
|
2274
2272
|
iti: !0,
|
|
2275
2273
|
"iti--container": !0,
|
|
2276
|
-
"iti--fullscreen-popup":
|
|
2277
|
-
"iti--inline-dropdown": !
|
|
2274
|
+
"iti--fullscreen-popup": t,
|
|
2275
|
+
"iti--inline-dropdown": !t,
|
|
2278
2276
|
[o]: !!o
|
|
2279
2277
|
});
|
|
2280
|
-
this.dropdown = m("div", { class:
|
|
2278
|
+
this.dropdown = m("div", { class: d }), this.dropdown.appendChild(this.dropdownContent);
|
|
2281
2279
|
} else
|
|
2282
2280
|
this.countryContainer.appendChild(this.dropdownContent);
|
|
2283
2281
|
}
|
|
2284
2282
|
_buildSearchUI() {
|
|
2285
|
-
const { i18n:
|
|
2283
|
+
const { i18n: e } = this.options, t = m(
|
|
2286
2284
|
"div",
|
|
2287
2285
|
{ class: "iti__search-input-wrapper" },
|
|
2288
2286
|
this.dropdownContent
|
|
@@ -2293,7 +2291,7 @@ class L {
|
|
|
2293
2291
|
class: "iti__search-icon",
|
|
2294
2292
|
"aria-hidden": "true"
|
|
2295
2293
|
},
|
|
2296
|
-
|
|
2294
|
+
t
|
|
2297
2295
|
), this.searchIcon.innerHTML = `
|
|
2298
2296
|
<svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
|
|
2299
2297
|
<circle cx="11" cy="11" r="7" />
|
|
@@ -2305,25 +2303,25 @@ class L {
|
|
|
2305
2303
|
// Chrome says inputs need either a name or an id
|
|
2306
2304
|
type: "search",
|
|
2307
2305
|
class: "iti__search-input",
|
|
2308
|
-
placeholder:
|
|
2306
|
+
placeholder: e.searchPlaceholder,
|
|
2309
2307
|
// 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
|
|
2310
2308
|
role: "combobox",
|
|
2311
2309
|
"aria-expanded": "true",
|
|
2312
|
-
"aria-label":
|
|
2310
|
+
"aria-label": e.searchPlaceholder,
|
|
2313
2311
|
"aria-controls": `iti-${this.id}__country-listbox`,
|
|
2314
2312
|
"aria-autocomplete": "list",
|
|
2315
2313
|
autocomplete: "off"
|
|
2316
2314
|
},
|
|
2317
|
-
|
|
2315
|
+
t
|
|
2318
2316
|
), this.searchClearButton = m(
|
|
2319
2317
|
"button",
|
|
2320
2318
|
{
|
|
2321
2319
|
type: "button",
|
|
2322
2320
|
class: "iti__search-clear iti__hide",
|
|
2323
|
-
"aria-label":
|
|
2321
|
+
"aria-label": e.clearSearchAriaLabel,
|
|
2324
2322
|
tabindex: "-1"
|
|
2325
2323
|
},
|
|
2326
|
-
|
|
2324
|
+
t
|
|
2327
2325
|
);
|
|
2328
2326
|
const i = `iti-${this.id}-clear-mask`;
|
|
2329
2327
|
this.searchClearButton.innerHTML = `
|
|
@@ -2345,62 +2343,62 @@ class L {
|
|
|
2345
2343
|
// all a11y messaging happens in this.searchResultsA11yText
|
|
2346
2344
|
},
|
|
2347
2345
|
this.dropdownContent
|
|
2348
|
-
), this.searchNoResults.textContent =
|
|
2346
|
+
), this.searchNoResults.textContent = e.zeroSearchResults;
|
|
2349
2347
|
}
|
|
2350
2348
|
_maybeUpdateInputPaddingAndReveal() {
|
|
2351
2349
|
this.countryContainer && (this._updateInputPadding(), this.countryContainer.classList.remove("iti__v-hide"));
|
|
2352
2350
|
}
|
|
2353
|
-
_maybeBuildHiddenInputs(
|
|
2351
|
+
_maybeBuildHiddenInputs(e) {
|
|
2354
2352
|
var i, n;
|
|
2355
|
-
const { hiddenInput:
|
|
2356
|
-
if (
|
|
2357
|
-
const s = this.telInput.getAttribute("name") || "", o =
|
|
2353
|
+
const { hiddenInput: t } = this.options;
|
|
2354
|
+
if (t) {
|
|
2355
|
+
const s = this.telInput.getAttribute("name") || "", o = t(s);
|
|
2358
2356
|
if (o.phone) {
|
|
2359
2357
|
const a = (i = this.telInput.form) == null ? void 0 : i.querySelector(`input[name="${o.phone}"]`);
|
|
2360
2358
|
a ? this.hiddenInput = a : (this.hiddenInput = m("input", {
|
|
2361
2359
|
type: "hidden",
|
|
2362
2360
|
name: o.phone
|
|
2363
|
-
}),
|
|
2361
|
+
}), e.appendChild(this.hiddenInput));
|
|
2364
2362
|
}
|
|
2365
2363
|
if (o.country) {
|
|
2366
2364
|
const a = (n = this.telInput.form) == null ? void 0 : n.querySelector(`input[name="${o.country}"]`);
|
|
2367
2365
|
a ? this.hiddenInputCountry = a : (this.hiddenInputCountry = m("input", {
|
|
2368
2366
|
type: "hidden",
|
|
2369
2367
|
name: o.country
|
|
2370
|
-
}),
|
|
2368
|
+
}), e.appendChild(this.hiddenInputCountry));
|
|
2371
2369
|
}
|
|
2372
2370
|
}
|
|
2373
2371
|
}
|
|
2374
2372
|
//* For each country: add a country list item <li> to the countryList <ul> container.
|
|
2375
2373
|
_appendListItems() {
|
|
2376
|
-
for (let
|
|
2377
|
-
const
|
|
2374
|
+
for (let e = 0; e < this.countries.length; e++) {
|
|
2375
|
+
const t = this.countries[e], i = e === 0 ? "iti__highlight" : "", n = m(
|
|
2378
2376
|
"li",
|
|
2379
2377
|
{
|
|
2380
|
-
id: `iti-${this.id}__item-${
|
|
2378
|
+
id: `iti-${this.id}__item-${t.iso2}`,
|
|
2381
2379
|
class: `iti__country ${i}`,
|
|
2382
2380
|
tabindex: "-1",
|
|
2383
2381
|
role: "option",
|
|
2384
|
-
"data-dial-code":
|
|
2385
|
-
"data-country-code":
|
|
2382
|
+
"data-dial-code": t.dialCode,
|
|
2383
|
+
"data-country-code": t.iso2,
|
|
2386
2384
|
"aria-selected": "false"
|
|
2387
2385
|
},
|
|
2388
2386
|
this.countryList
|
|
2389
2387
|
);
|
|
2390
|
-
|
|
2388
|
+
t.nodeById[this.id] = n;
|
|
2391
2389
|
let s = "";
|
|
2392
|
-
this.options.showFlags && (s += `<div class='iti__flag iti__${
|
|
2390
|
+
this.options.showFlags && (s += `<div class='iti__flag iti__${t.iso2}'></div>`), s += `<span class='iti__country-name'>${t.name}</span>`, s += `<span class='iti__dial-code' dir='ltr'>+${t.dialCode}</span>`, n.insertAdjacentHTML("beforeend", s);
|
|
2393
2391
|
}
|
|
2394
2392
|
}
|
|
2395
2393
|
//* Set the initial state of the input value and the selected country by:
|
|
2396
2394
|
//* 1. Extracting a dial code from the given number
|
|
2397
2395
|
//* 2. Using explicit initialCountry
|
|
2398
|
-
_setInitialState(
|
|
2399
|
-
const
|
|
2396
|
+
_setInitialState(e = !1) {
|
|
2397
|
+
const t = this.telInput.getAttribute("value"), i = this.telInput.value, s = t && t.charAt(0) === "+" && (!i || i.charAt(0) !== "+") ? t : i, o = this._getDialCode(s), a = k(s), { initialCountry: d, geoIpLookup: l } = this.options, h = d === "auto" && l;
|
|
2400
2398
|
if (o && !a)
|
|
2401
2399
|
this._updateCountryFromNumber(s);
|
|
2402
|
-
else if (!h ||
|
|
2403
|
-
const p =
|
|
2400
|
+
else if (!h || e) {
|
|
2401
|
+
const p = d ? d.toLowerCase() : "";
|
|
2404
2402
|
S(p) ? this._setCountry(p) : o && a ? this._setCountry("us") : this._setCountry("");
|
|
2405
2403
|
}
|
|
2406
2404
|
s && this._updateValFromNumber(s);
|
|
@@ -2411,24 +2409,24 @@ class L {
|
|
|
2411
2409
|
}
|
|
2412
2410
|
//* Update hidden input on form submit.
|
|
2413
2411
|
_initHiddenInputListener() {
|
|
2414
|
-
var
|
|
2412
|
+
var e;
|
|
2415
2413
|
this._handleHiddenInputSubmit = () => {
|
|
2416
2414
|
this.hiddenInput && (this.hiddenInput.value = this.getNumber()), this.hiddenInputCountry && (this.hiddenInputCountry.value = this.getSelectedCountryData().iso2 || "");
|
|
2417
|
-
}, (
|
|
2415
|
+
}, (e = this.telInput.form) == null || e.addEventListener(
|
|
2418
2416
|
"submit",
|
|
2419
2417
|
this._handleHiddenInputSubmit
|
|
2420
2418
|
);
|
|
2421
2419
|
}
|
|
2422
2420
|
//* initialise the dropdown listeners.
|
|
2423
2421
|
_initDropdownListeners() {
|
|
2424
|
-
this._handleLabelClick = (
|
|
2425
|
-
this.dropdownContent.classList.contains("iti__hide") ? this.telInput.focus() :
|
|
2422
|
+
this._handleLabelClick = (t) => {
|
|
2423
|
+
this.dropdownContent.classList.contains("iti__hide") ? this.telInput.focus() : t.preventDefault();
|
|
2426
2424
|
};
|
|
2427
|
-
const
|
|
2428
|
-
|
|
2425
|
+
const e = this.telInput.closest("label");
|
|
2426
|
+
e && e.addEventListener("click", this._handleLabelClick), this._handleClickSelectedCountry = () => {
|
|
2429
2427
|
this.dropdownContent.classList.contains("iti__hide") && !this.telInput.disabled && !this.telInput.readOnly && this._openDropdown();
|
|
2430
|
-
}, this.selectedCountry.addEventListener("click", this._handleClickSelectedCountry), this._handleCountryContainerKeydown = (
|
|
2431
|
-
this.dropdownContent.classList.contains("iti__hide") && ["ArrowUp", "ArrowDown", " ", "Enter"].includes(
|
|
2428
|
+
}, this.selectedCountry.addEventListener("click", this._handleClickSelectedCountry), this._handleCountryContainerKeydown = (t) => {
|
|
2429
|
+
this.dropdownContent.classList.contains("iti__hide") && ["ArrowUp", "ArrowDown", " ", "Enter"].includes(t.key) && (t.preventDefault(), t.stopPropagation(), this._openDropdown()), t.key === "Tab" && this._closeDropdown();
|
|
2432
2430
|
}, this.countryContainer.addEventListener(
|
|
2433
2431
|
"keydown",
|
|
2434
2432
|
this._handleCountryContainerKeydown
|
|
@@ -2436,24 +2434,24 @@ class L {
|
|
|
2436
2434
|
}
|
|
2437
2435
|
//* Init many requests: utils script / geo ip lookup.
|
|
2438
2436
|
_initRequests() {
|
|
2439
|
-
let { loadUtils:
|
|
2440
|
-
|
|
2437
|
+
let { loadUtils: e, initialCountry: t, geoIpLookup: i } = this.options;
|
|
2438
|
+
e && !u.utils ? (this._doAttachUtils = () => {
|
|
2441
2439
|
var s;
|
|
2442
|
-
(s =
|
|
2440
|
+
(s = u.attachUtils(e)) == null || s.catch(() => {
|
|
2443
2441
|
});
|
|
2444
|
-
},
|
|
2442
|
+
}, u.documentReady() ? this._doAttachUtils() : (this._handlePageLoad = () => {
|
|
2445
2443
|
this._doAttachUtils();
|
|
2446
|
-
}, window.addEventListener("load", this._handlePageLoad))) : this.resolveUtilsScriptPromise(),
|
|
2444
|
+
}, window.addEventListener("load", this._handlePageLoad))) : this.resolveUtilsScriptPromise(), t === "auto" && i && !this.selectedCountryData.iso2 ? this._loadAutoCountry() : this.resolveAutoCountryPromise();
|
|
2447
2445
|
}
|
|
2448
2446
|
//* Perform the geo ip lookup.
|
|
2449
2447
|
_loadAutoCountry() {
|
|
2450
|
-
|
|
2451
|
-
(
|
|
2452
|
-
const
|
|
2453
|
-
S(
|
|
2448
|
+
u.autoCountry ? this.handleAutoCountry() : u.startedLoadingAutoCountry || (u.startedLoadingAutoCountry = !0, typeof this.options.geoIpLookup == "function" && this.options.geoIpLookup(
|
|
2449
|
+
(e = "") => {
|
|
2450
|
+
const t = e.toLowerCase();
|
|
2451
|
+
S(t) ? (u.autoCountry = t, setTimeout(() => v("handleAutoCountry"))) : (this._setInitialState(!0), v("rejectAutoCountryPromise"));
|
|
2454
2452
|
},
|
|
2455
2453
|
() => {
|
|
2456
|
-
this._setInitialState(!0),
|
|
2454
|
+
this._setInitialState(!0), v("rejectAutoCountryPromise");
|
|
2457
2455
|
}
|
|
2458
2456
|
));
|
|
2459
2457
|
}
|
|
@@ -2465,7 +2463,7 @@ class L {
|
|
|
2465
2463
|
this._bindInputListener(), this._maybeBindKeydownListener(), this._maybeBindPasteListener();
|
|
2466
2464
|
}
|
|
2467
2465
|
_bindInputListener() {
|
|
2468
|
-
const { strictMode:
|
|
2466
|
+
const { strictMode: e, formatAsYouType: t, separateDialCode: i, allowDropdown: n, countrySearch: s } = this.options;
|
|
2469
2467
|
let o = !1;
|
|
2470
2468
|
new RegExp("\\p{L}", "u").test(this.telInput.value) && (o = !0), this._handleInputEvent = (a) => {
|
|
2471
2469
|
if (this.isAndroid && (a == null ? void 0 : a.data) === "+" && i && n && s) {
|
|
@@ -2474,74 +2472,74 @@ class L {
|
|
|
2474
2472
|
return;
|
|
2475
2473
|
}
|
|
2476
2474
|
this._updateCountryFromNumber(this.telInput.value) && this._triggerCountryChange();
|
|
2477
|
-
const
|
|
2478
|
-
|
|
2475
|
+
const d = (a == null ? void 0 : a.data) && /[^+0-9]/.test(a.data), l = (a == null ? void 0 : a.inputType) === "insertFromPaste" && this.telInput.value;
|
|
2476
|
+
d || l && !e ? o = !0 : /[^+0-9]/.test(this.telInput.value) || (o = !1);
|
|
2479
2477
|
const h = (a == null ? void 0 : a.detail) && a.detail.isSetNumber;
|
|
2480
|
-
if (
|
|
2481
|
-
const p = this.telInput.selectionStart || 0, c = this.telInput.value.substring(0, p).replace(/[^+0-9]/g, "").length,
|
|
2478
|
+
if (t && !o && !h) {
|
|
2479
|
+
const p = this.telInput.selectionStart || 0, c = this.telInput.value.substring(0, p).replace(/[^+0-9]/g, "").length, f = (a == null ? void 0 : a.inputType) === "deleteContentForward", C = this._getFullNumber(), y = X(
|
|
2482
2480
|
C,
|
|
2483
2481
|
this.telInput.value,
|
|
2484
|
-
|
|
2482
|
+
u.utils,
|
|
2485
2483
|
this.selectedCountryData,
|
|
2486
2484
|
this.options.separateDialCode
|
|
2487
|
-
),
|
|
2488
|
-
this.telInput.value =
|
|
2485
|
+
), b = tt(c, y, p, f);
|
|
2486
|
+
this.telInput.value = y, this.telInput.setSelectionRange(b, b);
|
|
2489
2487
|
}
|
|
2490
2488
|
}, this.telInput.addEventListener("input", this._handleInputEvent);
|
|
2491
2489
|
}
|
|
2492
2490
|
_maybeBindKeydownListener() {
|
|
2493
|
-
const { strictMode:
|
|
2494
|
-
(
|
|
2491
|
+
const { strictMode: e, separateDialCode: t, allowDropdown: i, countrySearch: n } = this.options;
|
|
2492
|
+
(e || t) && (this._handleKeydownEvent = (s) => {
|
|
2495
2493
|
if (s.key && s.key.length === 1 && !s.altKey && !s.ctrlKey && !s.metaKey) {
|
|
2496
|
-
if (
|
|
2494
|
+
if (t && i && n && s.key === "+") {
|
|
2497
2495
|
s.preventDefault(), this._openDropdownWithPlus();
|
|
2498
2496
|
return;
|
|
2499
2497
|
}
|
|
2500
|
-
if (
|
|
2501
|
-
const o = this.telInput.value,
|
|
2502
|
-
(!h ||
|
|
2498
|
+
if (e) {
|
|
2499
|
+
const o = this.telInput.value, d = !(o.charAt(0) === "+") && this.telInput.selectionStart === 0 && s.key === "+", l = /^[0-9]$/.test(s.key), h = t ? l : d || l, p = o.slice(0, this.telInput.selectionStart) + s.key + o.slice(this.telInput.selectionEnd), g = this._getFullNumber(p), c = u.utils.getCoreNumber(g, this.selectedCountryData.iso2), f = this.maxCoreNumberLength && c.length > this.maxCoreNumberLength, y = this._getNewCountryFromNumber(g) !== null;
|
|
2500
|
+
(!h || f && !y && !d) && s.preventDefault();
|
|
2503
2501
|
}
|
|
2504
2502
|
}
|
|
2505
2503
|
}, this.telInput.addEventListener("keydown", this._handleKeydownEvent));
|
|
2506
2504
|
}
|
|
2507
2505
|
_maybeBindPasteListener() {
|
|
2508
|
-
this.options.strictMode && (this._handlePasteEvent = (
|
|
2509
|
-
|
|
2510
|
-
const
|
|
2511
|
-
let C = s +
|
|
2512
|
-
for (;
|
|
2513
|
-
C = C.slice(0, -1),
|
|
2514
|
-
if (!
|
|
2506
|
+
this.options.strictMode && (this._handlePasteEvent = (e) => {
|
|
2507
|
+
e.preventDefault();
|
|
2508
|
+
const t = this.telInput, i = t.selectionStart, n = t.selectionEnd, s = t.value.slice(0, i), o = t.value.slice(n), a = this.selectedCountryData.iso2, d = e.clipboardData.getData("text"), l = i === 0 && n > 0, h = !t.value.startsWith("+") || l, p = d.replace(/[^0-9+]/g, ""), g = p.startsWith("+"), c = p.replace(/\+/g, ""), f = g && h ? `+${c}` : c;
|
|
2509
|
+
let C = s + f + o, y = u.utils.getCoreNumber(C, a);
|
|
2510
|
+
for (; y.length === 0 && C.length > 0; )
|
|
2511
|
+
C = C.slice(0, -1), y = u.utils.getCoreNumber(C, a);
|
|
2512
|
+
if (!y)
|
|
2515
2513
|
return;
|
|
2516
|
-
if (this.maxCoreNumberLength &&
|
|
2517
|
-
if (
|
|
2518
|
-
const w =
|
|
2514
|
+
if (this.maxCoreNumberLength && y.length > this.maxCoreNumberLength)
|
|
2515
|
+
if (t.selectionEnd === t.value.length) {
|
|
2516
|
+
const w = y.length - this.maxCoreNumberLength;
|
|
2519
2517
|
C = C.slice(0, C.length - w);
|
|
2520
2518
|
} else
|
|
2521
2519
|
return;
|
|
2522
|
-
|
|
2523
|
-
const
|
|
2524
|
-
|
|
2520
|
+
t.value = C;
|
|
2521
|
+
const b = i + f.length;
|
|
2522
|
+
t.setSelectionRange(b, b), t.dispatchEvent(new InputEvent("input", { bubbles: !0 }));
|
|
2525
2523
|
}, this.telInput.addEventListener("paste", this._handlePasteEvent));
|
|
2526
2524
|
}
|
|
2527
2525
|
//* Adhere to the input's maxlength attr.
|
|
2528
|
-
_cap(
|
|
2529
|
-
const
|
|
2530
|
-
return
|
|
2526
|
+
_cap(e) {
|
|
2527
|
+
const t = parseInt(this.telInput.getAttribute("maxlength") || "", 10);
|
|
2528
|
+
return t && e.length > t ? e.substring(0, t) : e;
|
|
2531
2529
|
}
|
|
2532
2530
|
//* Trigger a custom event on the input.
|
|
2533
|
-
_trigger(
|
|
2534
|
-
const i = new CustomEvent(
|
|
2531
|
+
_trigger(e, t = {}) {
|
|
2532
|
+
const i = new CustomEvent(e, {
|
|
2535
2533
|
bubbles: !0,
|
|
2536
2534
|
cancelable: !0,
|
|
2537
|
-
detail:
|
|
2535
|
+
detail: t
|
|
2538
2536
|
});
|
|
2539
2537
|
this.telInput.dispatchEvent(i);
|
|
2540
2538
|
}
|
|
2541
2539
|
//* Open the dropdown.
|
|
2542
2540
|
_openDropdown() {
|
|
2543
|
-
const { fixDropdownWidth:
|
|
2544
|
-
if (
|
|
2541
|
+
const { fixDropdownWidth: e, countrySearch: t } = this.options;
|
|
2542
|
+
if (e && (this.dropdownContent.style.width = `${this.telInput.offsetWidth}px`), this.dropdownContent.classList.remove("iti__hide"), this.selectedCountry.setAttribute("aria-expanded", "true"), this._setDropdownPosition(), t) {
|
|
2545
2543
|
const i = this.countryList.firstElementChild;
|
|
2546
2544
|
i && (this._highlightListItem(i, !1), this.countryList.scrollTop = 0), this.searchInput.focus();
|
|
2547
2545
|
}
|
|
@@ -2550,8 +2548,8 @@ class L {
|
|
|
2550
2548
|
//* Set the dropdown position
|
|
2551
2549
|
_setDropdownPosition() {
|
|
2552
2550
|
if (this.options.dropdownContainer && this.options.dropdownContainer.appendChild(this.dropdown), !this.options.useFullscreenPopup) {
|
|
2553
|
-
const
|
|
2554
|
-
this.options.dropdownContainer && (this.dropdown.style.top = `${
|
|
2551
|
+
const e = this.telInput.getBoundingClientRect(), t = this.telInput.offsetHeight;
|
|
2552
|
+
this.options.dropdownContainer && (this.dropdown.style.top = `${e.top + t}px`, this.dropdown.style.left = `${e.left}px`, this._handleWindowScroll = () => this._closeDropdown(), window.addEventListener("scroll", this._handleWindowScroll));
|
|
2555
2553
|
}
|
|
2556
2554
|
}
|
|
2557
2555
|
//* We only bind dropdown listeners when the dropdown is open.
|
|
@@ -2575,10 +2573,10 @@ class L {
|
|
|
2575
2573
|
this._handleClickOffToClose
|
|
2576
2574
|
);
|
|
2577
2575
|
}, 0);
|
|
2578
|
-
let
|
|
2576
|
+
let e = "", t = null;
|
|
2579
2577
|
if (this._handleKeydownOnDropdown = (i) => {
|
|
2580
|
-
["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(),
|
|
2581
|
-
|
|
2578
|
+
["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(), t && clearTimeout(t), e += i.key.toLowerCase(), this._searchForCountry(e), t = setTimeout(() => {
|
|
2579
|
+
e = "";
|
|
2582
2580
|
}, 1e3));
|
|
2583
2581
|
}, document.addEventListener("keydown", this._handleKeydownOnDropdown), this.options.countrySearch) {
|
|
2584
2582
|
const i = () => {
|
|
@@ -2596,50 +2594,50 @@ class L {
|
|
|
2596
2594
|
}
|
|
2597
2595
|
}
|
|
2598
2596
|
//* Hidden search (countrySearch disabled): Find the first list item whose name starts with the query string.
|
|
2599
|
-
_searchForCountry(
|
|
2600
|
-
for (const
|
|
2601
|
-
if (
|
|
2602
|
-
const n =
|
|
2597
|
+
_searchForCountry(e) {
|
|
2598
|
+
for (const t of this.countries)
|
|
2599
|
+
if (t.name.substring(0, e.length).toLowerCase() === e) {
|
|
2600
|
+
const n = t.nodeById[this.id];
|
|
2603
2601
|
this._highlightListItem(n, !1), this._scrollTo(n);
|
|
2604
2602
|
break;
|
|
2605
2603
|
}
|
|
2606
2604
|
}
|
|
2607
2605
|
//* Country search enabled: Filter the countries according to the search query.
|
|
2608
|
-
_filterCountries(
|
|
2606
|
+
_filterCountries(e) {
|
|
2609
2607
|
this.countryList.innerHTML = "";
|
|
2610
|
-
let
|
|
2611
|
-
|
|
2608
|
+
let t;
|
|
2609
|
+
e === "" ? t = this.countries : t = this._getMatchedCountries(e);
|
|
2612
2610
|
let i = !0;
|
|
2613
|
-
for (const n of
|
|
2611
|
+
for (const n of t) {
|
|
2614
2612
|
const s = n.nodeById[this.id];
|
|
2615
2613
|
s && (this.countryList.appendChild(s), i && (this._highlightListItem(s, !1), i = !1));
|
|
2616
2614
|
}
|
|
2617
2615
|
i ? (this._highlightListItem(null, !1), this.searchNoResults && this.searchNoResults.classList.remove("iti__hide")) : this.searchNoResults && this.searchNoResults.classList.add("iti__hide"), this.countryList.scrollTop = 0, this._updateSearchResultsA11yText();
|
|
2618
2616
|
}
|
|
2619
|
-
_getMatchedCountries(
|
|
2620
|
-
const
|
|
2621
|
-
for (const
|
|
2622
|
-
|
|
2617
|
+
_getMatchedCountries(e) {
|
|
2618
|
+
const t = E(e), i = [], n = [], s = [], o = [], a = [], d = [];
|
|
2619
|
+
for (const l of this.countries)
|
|
2620
|
+
l.iso2 === t ? i.push(l) : l.normalisedName.startsWith(t) ? n.push(l) : l.normalisedName.includes(t) ? s.push(l) : t === l.dialCode || t === l.dialCodePlus ? o.push(l) : l.dialCodePlus.includes(t) ? a.push(l) : l.initials.includes(t) && d.push(l);
|
|
2623
2621
|
return [
|
|
2624
|
-
...i.sort((
|
|
2625
|
-
...n.sort((
|
|
2626
|
-
...s.sort((
|
|
2627
|
-
...o.sort((
|
|
2628
|
-
...a.sort((
|
|
2629
|
-
...
|
|
2622
|
+
...i.sort((l, h) => l.priority - h.priority),
|
|
2623
|
+
...n.sort((l, h) => l.priority - h.priority),
|
|
2624
|
+
...s.sort((l, h) => l.priority - h.priority),
|
|
2625
|
+
...o.sort((l, h) => l.priority - h.priority),
|
|
2626
|
+
...a.sort((l, h) => l.priority - h.priority),
|
|
2627
|
+
...d.sort((l, h) => l.priority - h.priority)
|
|
2630
2628
|
];
|
|
2631
2629
|
}
|
|
2632
2630
|
//* Update search results text (for a11y).
|
|
2633
2631
|
_updateSearchResultsA11yText() {
|
|
2634
|
-
const { i18n:
|
|
2632
|
+
const { i18n: e } = this.options, t = this.countryList.childElementCount;
|
|
2635
2633
|
let i;
|
|
2636
|
-
|
|
2634
|
+
t === 0 ? i = e.zeroSearchResults : e.searchResultsText ? i = e.searchResultsText(t) : t === 1 ? i = e.oneSearchResult : i = e.multipleSearchResults.replace("${count}", t.toString()), this.searchResultsA11yText.textContent = i;
|
|
2637
2635
|
}
|
|
2638
2636
|
//* Highlight the next/prev item in the list (and ensure it is visible).
|
|
2639
|
-
_handleUpDownKey(
|
|
2637
|
+
_handleUpDownKey(e) {
|
|
2640
2638
|
var i, n;
|
|
2641
|
-
let
|
|
2642
|
-
!
|
|
2639
|
+
let t = e === "ArrowUp" ? (i = this.highlightedItem) == null ? void 0 : i.previousElementSibling : (n = this.highlightedItem) == null ? void 0 : n.nextElementSibling;
|
|
2640
|
+
!t && this.countryList.childElementCount > 1 && (t = e === "ArrowUp" ? this.countryList.lastElementChild : this.countryList.firstElementChild), t && (this._scrollTo(t), this._highlightListItem(t, !1));
|
|
2643
2641
|
}
|
|
2644
2642
|
//* Select the currently highlighted item.
|
|
2645
2643
|
_handleEnterKey() {
|
|
@@ -2647,59 +2645,59 @@ class L {
|
|
|
2647
2645
|
}
|
|
2648
2646
|
//* Update the input's value to the given val (format first if possible)
|
|
2649
2647
|
//* NOTE: this is called from _setInitialState, handleUtils and setNumber.
|
|
2650
|
-
_updateValFromNumber(
|
|
2651
|
-
let
|
|
2652
|
-
if (this.options.formatOnDisplay &&
|
|
2653
|
-
const i = this.options.nationalMode ||
|
|
2654
|
-
|
|
2655
|
-
|
|
2648
|
+
_updateValFromNumber(e) {
|
|
2649
|
+
let t = e;
|
|
2650
|
+
if (this.options.formatOnDisplay && u.utils && this.selectedCountryData) {
|
|
2651
|
+
const i = this.options.nationalMode || t.charAt(0) !== "+" && !this.options.separateDialCode, { NATIONAL: n, INTERNATIONAL: s } = u.utils.numberFormat, o = i ? n : s;
|
|
2652
|
+
t = u.utils.formatNumber(
|
|
2653
|
+
t,
|
|
2656
2654
|
this.selectedCountryData.iso2,
|
|
2657
2655
|
o
|
|
2658
2656
|
);
|
|
2659
2657
|
}
|
|
2660
|
-
|
|
2658
|
+
t = this._beforeSetNumber(t), this.telInput.value = t;
|
|
2661
2659
|
}
|
|
2662
2660
|
//* Check if need to select a new country based on the given number
|
|
2663
2661
|
//* Note: called from _setInitialState, keyup handler, setNumber.
|
|
2664
|
-
_updateCountryFromNumber(
|
|
2665
|
-
const
|
|
2666
|
-
return
|
|
2662
|
+
_updateCountryFromNumber(e) {
|
|
2663
|
+
const t = this._getNewCountryFromNumber(e);
|
|
2664
|
+
return t !== null ? this._setCountry(t) : !1;
|
|
2667
2665
|
}
|
|
2668
2666
|
// if there is a selected country, and the number doesn't start with a dial code, then add it
|
|
2669
|
-
_ensureHasDialCode(
|
|
2670
|
-
const { dialCode:
|
|
2671
|
-
if (
|
|
2672
|
-
return
|
|
2673
|
-
const o = i &&
|
|
2674
|
-
return `+${
|
|
2667
|
+
_ensureHasDialCode(e) {
|
|
2668
|
+
const { dialCode: t, nationalPrefix: i } = this.selectedCountryData;
|
|
2669
|
+
if (e.charAt(0) === "+" || !t)
|
|
2670
|
+
return e;
|
|
2671
|
+
const o = i && e.charAt(0) === i && !this.options.separateDialCode ? e.substring(1) : e;
|
|
2672
|
+
return `+${t}${o}`;
|
|
2675
2673
|
}
|
|
2676
2674
|
// Get the country ISO2 code from the given number
|
|
2677
2675
|
// BUT ONLY IF ITS CHANGED FROM THE CURRENTLY SELECTED COUNTRY
|
|
2678
2676
|
// NOTE: consider refactoring this to be more clear
|
|
2679
|
-
_getNewCountryFromNumber(
|
|
2680
|
-
const
|
|
2681
|
-
let i =
|
|
2677
|
+
_getNewCountryFromNumber(e) {
|
|
2678
|
+
const t = e.indexOf("+");
|
|
2679
|
+
let i = t ? e.substring(t) : e;
|
|
2682
2680
|
const n = this.selectedCountryData.iso2, s = this.selectedCountryData.dialCode;
|
|
2683
2681
|
i = this._ensureHasDialCode(i);
|
|
2684
|
-
const o = this._getDialCode(i, !0), a =
|
|
2682
|
+
const o = this._getDialCode(i, !0), a = I(i);
|
|
2685
2683
|
if (o) {
|
|
2686
|
-
const
|
|
2687
|
-
if (
|
|
2688
|
-
return
|
|
2689
|
-
if (!n && this.defaultCountry &&
|
|
2684
|
+
const d = I(o), l = this.dialCodeToIso2Map[d];
|
|
2685
|
+
if (l.length === 1)
|
|
2686
|
+
return l[0] === n ? null : l[0];
|
|
2687
|
+
if (!n && this.defaultCountry && l.includes(this.defaultCountry))
|
|
2690
2688
|
return this.defaultCountry;
|
|
2691
2689
|
if (s === "1" && k(a))
|
|
2692
2690
|
return null;
|
|
2693
2691
|
const { areaCodes: p, priority: g } = this.selectedCountryData;
|
|
2694
2692
|
if (p) {
|
|
2695
|
-
const
|
|
2696
|
-
for (const w of
|
|
2693
|
+
const b = p.map((w) => `${s}${w}`);
|
|
2694
|
+
for (const w of b)
|
|
2697
2695
|
if (a.startsWith(w))
|
|
2698
2696
|
return null;
|
|
2699
2697
|
}
|
|
2700
|
-
const
|
|
2701
|
-
if (!C && !
|
|
2702
|
-
return
|
|
2698
|
+
const f = p && !(g === 0) && a.length > d.length, C = n && l.includes(n) && !f, y = n === l[0];
|
|
2699
|
+
if (!C && !y)
|
|
2700
|
+
return l[0];
|
|
2703
2701
|
} else {
|
|
2704
2702
|
if (i.charAt(0) === "+" && a.length)
|
|
2705
2703
|
return "";
|
|
@@ -2709,57 +2707,57 @@ class L {
|
|
|
2709
2707
|
return null;
|
|
2710
2708
|
}
|
|
2711
2709
|
//* Remove highlighting from other list items and highlight the given item.
|
|
2712
|
-
_highlightListItem(
|
|
2710
|
+
_highlightListItem(e, t) {
|
|
2713
2711
|
const i = this.highlightedItem;
|
|
2714
|
-
if (i && (i.classList.remove("iti__highlight"), i.setAttribute("aria-selected", "false")), this.highlightedItem =
|
|
2712
|
+
if (i && (i.classList.remove("iti__highlight"), i.setAttribute("aria-selected", "false")), this.highlightedItem = e, this.highlightedItem && (this.highlightedItem.classList.add("iti__highlight"), this.highlightedItem.setAttribute("aria-selected", "true"), this.options.countrySearch)) {
|
|
2715
2713
|
const n = this.highlightedItem.getAttribute("id") || "";
|
|
2716
2714
|
this.searchInput.setAttribute("aria-activedescendant", n);
|
|
2717
2715
|
}
|
|
2718
|
-
|
|
2716
|
+
t && this.highlightedItem.focus();
|
|
2719
2717
|
}
|
|
2720
2718
|
//* Update the selected country, dial code (if separateDialCode), placeholder, title, and active list item.
|
|
2721
2719
|
//* Note: called from _setInitialState, _updateCountryFromNumber, _selectListItem, setCountry.
|
|
2722
|
-
_setCountry(
|
|
2723
|
-
const { separateDialCode:
|
|
2724
|
-
if (this.selectedCountryData =
|
|
2725
|
-
const o =
|
|
2726
|
-
let a,
|
|
2727
|
-
if (
|
|
2728
|
-
const { name:
|
|
2729
|
-
|
|
2720
|
+
_setCountry(e) {
|
|
2721
|
+
const { separateDialCode: t, showFlags: i, i18n: n } = this.options, s = this.selectedCountryData.iso2 || "";
|
|
2722
|
+
if (this.selectedCountryData = e ? this.countryByIso2.get(e) : {}, this.selectedCountryData.iso2 && (this.defaultCountry = this.selectedCountryData.iso2), this.selectedCountry) {
|
|
2723
|
+
const o = e && i ? `iti__flag iti__${e}` : "iti__flag iti__globe";
|
|
2724
|
+
let a, d;
|
|
2725
|
+
if (e) {
|
|
2726
|
+
const { name: l, dialCode: h } = this.selectedCountryData;
|
|
2727
|
+
d = l, a = n.selectedCountryAriaLabel.replace("${countryName}", l).replace("${dialCode}", `+${h}`);
|
|
2730
2728
|
} else
|
|
2731
|
-
|
|
2732
|
-
this.selectedCountryInner.className = o, this.selectedCountry.setAttribute("title",
|
|
2729
|
+
d = n.noCountrySelected, a = n.noCountrySelected;
|
|
2730
|
+
this.selectedCountryInner.className = o, this.selectedCountry.setAttribute("title", d), this.selectedCountry.setAttribute("aria-label", a);
|
|
2733
2731
|
}
|
|
2734
|
-
if (
|
|
2732
|
+
if (t) {
|
|
2735
2733
|
const o = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
|
|
2736
2734
|
this.selectedDialCode.innerHTML = o, this._updateInputPadding();
|
|
2737
2735
|
}
|
|
2738
|
-
return this._updatePlaceholder(), this._updateMaxLength(), s !==
|
|
2736
|
+
return this._updatePlaceholder(), this._updateMaxLength(), s !== e;
|
|
2739
2737
|
}
|
|
2740
2738
|
//* Update the input padding to make space for the selected country/dial code.
|
|
2741
2739
|
_updateInputPadding() {
|
|
2742
2740
|
if (this.selectedCountry) {
|
|
2743
|
-
const
|
|
2744
|
-
this.
|
|
2741
|
+
const e = this.options.separateDialCode ? 78 : 42, i = (this.selectedCountry.offsetWidth || this._getHiddenSelectedCountryWidth() || e) + 6;
|
|
2742
|
+
this.telInput.style.paddingLeft = `${i}px`;
|
|
2745
2743
|
}
|
|
2746
2744
|
}
|
|
2747
2745
|
//* Update the maximum valid number length for the currently selected country.
|
|
2748
2746
|
_updateMaxLength() {
|
|
2749
|
-
const { strictMode:
|
|
2750
|
-
if (
|
|
2747
|
+
const { strictMode: e, placeholderNumberType: t, validationNumberTypes: i } = this.options, { iso2: n } = this.selectedCountryData;
|
|
2748
|
+
if (e && u.utils)
|
|
2751
2749
|
if (n) {
|
|
2752
|
-
const s =
|
|
2753
|
-
let o =
|
|
2750
|
+
const s = u.utils.numberType[t];
|
|
2751
|
+
let o = u.utils.getExampleNumber(
|
|
2754
2752
|
n,
|
|
2755
2753
|
!1,
|
|
2756
2754
|
s,
|
|
2757
2755
|
!0
|
|
2758
2756
|
), a = o;
|
|
2759
|
-
for (;
|
|
2757
|
+
for (; u.utils.isPossibleNumber(o, n, i); )
|
|
2760
2758
|
a = o, o += "0";
|
|
2761
|
-
const
|
|
2762
|
-
this.maxCoreNumberLength =
|
|
2759
|
+
const d = u.utils.getCoreNumber(a, n);
|
|
2760
|
+
this.maxCoreNumberLength = d.length, n === "by" && (this.maxCoreNumberLength = d.length + 1);
|
|
2763
2761
|
} else
|
|
2764
2762
|
this.maxCoreNumberLength = null;
|
|
2765
2763
|
}
|
|
@@ -2769,34 +2767,34 @@ class L {
|
|
|
2769
2767
|
//* and then to inject a deep clone of the selectedCountry element.
|
|
2770
2768
|
_getHiddenSelectedCountryWidth() {
|
|
2771
2769
|
if (this.telInput.parentNode) {
|
|
2772
|
-
let
|
|
2770
|
+
let e;
|
|
2773
2771
|
try {
|
|
2774
|
-
|
|
2772
|
+
e = window.top.document.body;
|
|
2775
2773
|
} catch {
|
|
2776
|
-
|
|
2774
|
+
e = document.body;
|
|
2777
2775
|
}
|
|
2778
|
-
const
|
|
2779
|
-
|
|
2776
|
+
const t = this.telInput.parentNode.cloneNode(!1);
|
|
2777
|
+
t.style.visibility = "hidden", e.appendChild(t);
|
|
2780
2778
|
const i = this.countryContainer.cloneNode();
|
|
2781
|
-
|
|
2779
|
+
t.appendChild(i);
|
|
2782
2780
|
const n = this.selectedCountry.cloneNode(!0);
|
|
2783
2781
|
i.appendChild(n);
|
|
2784
2782
|
const s = n.offsetWidth;
|
|
2785
|
-
return
|
|
2783
|
+
return e.removeChild(t), s;
|
|
2786
2784
|
}
|
|
2787
2785
|
return 0;
|
|
2788
2786
|
}
|
|
2789
2787
|
//* Update the input placeholder to an example number from the currently selected country.
|
|
2790
2788
|
_updatePlaceholder() {
|
|
2791
2789
|
const {
|
|
2792
|
-
autoPlaceholder:
|
|
2793
|
-
placeholderNumberType:
|
|
2790
|
+
autoPlaceholder: e,
|
|
2791
|
+
placeholderNumberType: t,
|
|
2794
2792
|
nationalMode: i,
|
|
2795
2793
|
customPlaceholder: n
|
|
2796
|
-
} = this.options, s =
|
|
2797
|
-
if (
|
|
2798
|
-
const o =
|
|
2799
|
-
let a = this.selectedCountryData.iso2 ?
|
|
2794
|
+
} = this.options, s = e === "aggressive" || !this.hadInitialPlaceholder && e === "polite";
|
|
2795
|
+
if (u.utils && s) {
|
|
2796
|
+
const o = u.utils.numberType[t];
|
|
2797
|
+
let a = this.selectedCountryData.iso2 ? u.utils.getExampleNumber(
|
|
2800
2798
|
this.selectedCountryData.iso2,
|
|
2801
2799
|
i,
|
|
2802
2800
|
o
|
|
@@ -2805,10 +2803,10 @@ class L {
|
|
|
2805
2803
|
}
|
|
2806
2804
|
}
|
|
2807
2805
|
//* Called when the user selects a list item from the dropdown.
|
|
2808
|
-
_selectListItem(
|
|
2809
|
-
const
|
|
2806
|
+
_selectListItem(e) {
|
|
2807
|
+
const t = e.getAttribute("data-country-code"), i = this._setCountry(t);
|
|
2810
2808
|
this._closeDropdown();
|
|
2811
|
-
const n =
|
|
2809
|
+
const n = e.getAttribute("data-dial-code");
|
|
2812
2810
|
this._updateDialCode(n), this.options.formatOnDisplay && this._updateValFromNumber(this.telInput.value), this.telInput.focus(), i && this._triggerCountryChange();
|
|
2813
2811
|
}
|
|
2814
2812
|
//* Close the dropdown and unbind any listeners.
|
|
@@ -2822,40 +2820,40 @@ class L {
|
|
|
2822
2820
|
), this.countryList.removeEventListener("click", this._handleClickCountryList), this.options.dropdownContainer && (this.options.useFullscreenPopup || window.removeEventListener("scroll", this._handleWindowScroll), this.dropdown.parentNode && this.dropdown.parentNode.removeChild(this.dropdown)), this._trigger("close:countrydropdown");
|
|
2823
2821
|
}
|
|
2824
2822
|
//* Check if an element is visible within it's container, else scroll until it is.
|
|
2825
|
-
_scrollTo(
|
|
2826
|
-
const
|
|
2827
|
-
if (
|
|
2828
|
-
|
|
2829
|
-
else if (
|
|
2823
|
+
_scrollTo(e) {
|
|
2824
|
+
const t = this.countryList, i = document.documentElement.scrollTop, n = t.offsetHeight, s = t.getBoundingClientRect().top + i, o = s + n, a = e.offsetHeight, d = e.getBoundingClientRect().top + i, l = d + a, h = d - s + t.scrollTop;
|
|
2825
|
+
if (d < s)
|
|
2826
|
+
t.scrollTop = h;
|
|
2827
|
+
else if (l > o) {
|
|
2830
2828
|
const p = n - a;
|
|
2831
|
-
|
|
2829
|
+
t.scrollTop = h - p;
|
|
2832
2830
|
}
|
|
2833
2831
|
}
|
|
2834
2832
|
//* Replace any existing dial code with the new one
|
|
2835
2833
|
//* Note: called from _selectListItem and setCountry
|
|
2836
|
-
_updateDialCode(
|
|
2837
|
-
const
|
|
2834
|
+
_updateDialCode(e) {
|
|
2835
|
+
const t = this.telInput.value, i = `+${e}`;
|
|
2838
2836
|
let n;
|
|
2839
|
-
if (
|
|
2840
|
-
const s = this._getDialCode(
|
|
2841
|
-
s ? n =
|
|
2837
|
+
if (t.charAt(0) === "+") {
|
|
2838
|
+
const s = this._getDialCode(t);
|
|
2839
|
+
s ? n = t.replace(s, i) : n = i, this.telInput.value = n;
|
|
2842
2840
|
}
|
|
2843
2841
|
}
|
|
2844
2842
|
//* Try and extract a valid international dial code from a full telephone number.
|
|
2845
2843
|
//* Note: returns the raw string inc plus character and any whitespace/dots etc.
|
|
2846
|
-
_getDialCode(
|
|
2844
|
+
_getDialCode(e, t) {
|
|
2847
2845
|
let i = "";
|
|
2848
|
-
if (
|
|
2846
|
+
if (e.charAt(0) === "+") {
|
|
2849
2847
|
let n = "";
|
|
2850
|
-
for (let s = 0; s <
|
|
2851
|
-
const o =
|
|
2848
|
+
for (let s = 0; s < e.length; s++) {
|
|
2849
|
+
const o = e.charAt(s);
|
|
2852
2850
|
if (/[0-9]/.test(o)) {
|
|
2853
2851
|
if (n += o, !!!this.dialCodeToIso2Map[n])
|
|
2854
2852
|
break;
|
|
2855
|
-
if (
|
|
2856
|
-
i =
|
|
2853
|
+
if (t)
|
|
2854
|
+
i = e.substring(0, s + 1);
|
|
2857
2855
|
else if (this.dialCodes.has(n)) {
|
|
2858
|
-
i =
|
|
2856
|
+
i = e.substring(0, s + 1);
|
|
2859
2857
|
break;
|
|
2860
2858
|
}
|
|
2861
2859
|
if (n.length === this.dialCodeMaxLen)
|
|
@@ -2866,17 +2864,17 @@ class L {
|
|
|
2866
2864
|
return i;
|
|
2867
2865
|
}
|
|
2868
2866
|
//* Get the input val, adding the dial code if separateDialCode is enabled.
|
|
2869
|
-
_getFullNumber(
|
|
2870
|
-
const
|
|
2867
|
+
_getFullNumber(e) {
|
|
2868
|
+
const t = e || this.telInput.value.trim(), { dialCode: i } = this.selectedCountryData;
|
|
2871
2869
|
let n;
|
|
2872
|
-
const s =
|
|
2873
|
-
return this.options.separateDialCode &&
|
|
2870
|
+
const s = I(t);
|
|
2871
|
+
return this.options.separateDialCode && t.charAt(0) !== "+" && i && s ? n = `+${i}` : n = "", n + t;
|
|
2874
2872
|
}
|
|
2875
2873
|
//* Remove the dial code if separateDialCode is enabled also cap the length if the input has a maxlength attribute
|
|
2876
|
-
_beforeSetNumber(
|
|
2877
|
-
const
|
|
2878
|
-
t,
|
|
2874
|
+
_beforeSetNumber(e) {
|
|
2875
|
+
const t = this._getDialCode(e), i = Q(
|
|
2879
2876
|
e,
|
|
2877
|
+
t,
|
|
2880
2878
|
this.options.separateDialCode,
|
|
2881
2879
|
this.selectedCountryData
|
|
2882
2880
|
);
|
|
@@ -2891,11 +2889,11 @@ class L {
|
|
|
2891
2889
|
//**************************
|
|
2892
2890
|
//* This is called when the geoip call returns.
|
|
2893
2891
|
handleAutoCountry() {
|
|
2894
|
-
this.options.initialCountry === "auto" &&
|
|
2892
|
+
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());
|
|
2895
2893
|
}
|
|
2896
2894
|
//* This is called when the utils request completes.
|
|
2897
2895
|
handleUtils() {
|
|
2898
|
-
|
|
2896
|
+
u.utils && (this.telInput.value && this._updateValFromNumber(this.telInput.value), this.selectedCountryData.iso2 && (this._updatePlaceholder(), this._updateMaxLength())), this.resolveUtilsScriptPromise();
|
|
2899
2897
|
}
|
|
2900
2898
|
//********************
|
|
2901
2899
|
//* PUBLIC METHODS
|
|
@@ -2904,8 +2902,8 @@ class L {
|
|
|
2904
2902
|
destroy() {
|
|
2905
2903
|
var s, o;
|
|
2906
2904
|
this.telInput.iti = void 0;
|
|
2907
|
-
const { allowDropdown:
|
|
2908
|
-
if (
|
|
2905
|
+
const { allowDropdown: e, separateDialCode: t } = this.options;
|
|
2906
|
+
if (e) {
|
|
2909
2907
|
this._closeDropdown(), this.selectedCountry.removeEventListener(
|
|
2910
2908
|
"click",
|
|
2911
2909
|
this._handleClickSelectedCountry
|
|
@@ -2917,32 +2915,32 @@ class L {
|
|
|
2917
2915
|
a && a.removeEventListener("click", this._handleLabelClick);
|
|
2918
2916
|
}
|
|
2919
2917
|
const { form: i } = this.telInput;
|
|
2920
|
-
this._handleHiddenInputSubmit && i && i.removeEventListener("submit", this._handleHiddenInputSubmit), this.telInput.removeEventListener("input", this._handleInputEvent), this._handleKeydownEvent && this.telInput.removeEventListener("keydown", this._handleKeydownEvent), this._handlePasteEvent && this.telInput.removeEventListener("paste", this._handlePasteEvent), this._handlePageLoad && window.removeEventListener("load", this._handlePageLoad), this.telInput.removeAttribute("data-intl-tel-input-id"),
|
|
2918
|
+
this._handleHiddenInputSubmit && i && i.removeEventListener("submit", this._handleHiddenInputSubmit), this.telInput.removeEventListener("input", this._handleInputEvent), this._handleKeydownEvent && this.telInput.removeEventListener("keydown", this._handleKeydownEvent), this._handlePasteEvent && this.telInput.removeEventListener("paste", this._handlePasteEvent), this._handlePageLoad && window.removeEventListener("load", this._handlePageLoad), this.telInput.removeAttribute("data-intl-tel-input-id"), t && (this.telInput.style.paddingLeft = this.originalPaddingLeft);
|
|
2921
2919
|
const n = this.telInput.parentNode;
|
|
2922
|
-
(s = n == null ? void 0 : n.parentNode) == null || s.insertBefore(this.telInput, n), (o = n == null ? void 0 : n.parentNode) == null || o.removeChild(n), delete
|
|
2920
|
+
(s = n == null ? void 0 : n.parentNode) == null || s.insertBefore(this.telInput, n), (o = n == null ? void 0 : n.parentNode) == null || o.removeChild(n), delete u.instances[this.id];
|
|
2923
2921
|
}
|
|
2924
2922
|
//* Get the extension from the current number.
|
|
2925
2923
|
getExtension() {
|
|
2926
|
-
return
|
|
2924
|
+
return u.utils ? u.utils.getExtension(
|
|
2927
2925
|
this._getFullNumber(),
|
|
2928
2926
|
this.selectedCountryData.iso2
|
|
2929
2927
|
) : "";
|
|
2930
2928
|
}
|
|
2931
2929
|
//* Format the number to the given format.
|
|
2932
|
-
getNumber(
|
|
2933
|
-
if (
|
|
2934
|
-
const { iso2:
|
|
2935
|
-
return
|
|
2930
|
+
getNumber(e) {
|
|
2931
|
+
if (u.utils) {
|
|
2932
|
+
const { iso2: t } = this.selectedCountryData;
|
|
2933
|
+
return u.utils.formatNumber(
|
|
2936
2934
|
this._getFullNumber(),
|
|
2937
|
-
|
|
2938
|
-
|
|
2935
|
+
t,
|
|
2936
|
+
e
|
|
2939
2937
|
);
|
|
2940
2938
|
}
|
|
2941
2939
|
return "";
|
|
2942
2940
|
}
|
|
2943
2941
|
//* Get the type of the entered number e.g. landline/mobile.
|
|
2944
2942
|
getNumberType() {
|
|
2945
|
-
return
|
|
2943
|
+
return u.utils ? u.utils.getNumberType(
|
|
2946
2944
|
this._getFullNumber(),
|
|
2947
2945
|
this.selectedCountryData.iso2
|
|
2948
2946
|
) : -99;
|
|
@@ -2953,101 +2951,109 @@ class L {
|
|
|
2953
2951
|
}
|
|
2954
2952
|
//* Get the validation error.
|
|
2955
2953
|
getValidationError() {
|
|
2956
|
-
if (
|
|
2957
|
-
const { iso2:
|
|
2958
|
-
return
|
|
2954
|
+
if (u.utils) {
|
|
2955
|
+
const { iso2: e } = this.selectedCountryData;
|
|
2956
|
+
return u.utils.getValidationError(this._getFullNumber(), e);
|
|
2959
2957
|
}
|
|
2960
2958
|
return -99;
|
|
2961
2959
|
}
|
|
2962
|
-
//* Validate the input val
|
|
2960
|
+
//* Validate the input val using number length only
|
|
2963
2961
|
isValidNumber() {
|
|
2962
|
+
const { dialCode: e, iso2: t } = this.selectedCountryData;
|
|
2963
|
+
if (e === "44" && u.utils) {
|
|
2964
|
+
const i = this._getFullNumber(), n = u.utils.getCoreNumber(i, t);
|
|
2965
|
+
if (n[0] === "7" && n.length !== 10)
|
|
2966
|
+
return !1;
|
|
2967
|
+
}
|
|
2964
2968
|
return this._validateNumber(!1);
|
|
2965
2969
|
}
|
|
2966
|
-
//* Validate the input val
|
|
2970
|
+
//* Validate the input val with precise validation
|
|
2967
2971
|
isValidNumberPrecise() {
|
|
2968
2972
|
return this._validateNumber(!0);
|
|
2969
2973
|
}
|
|
2970
|
-
_utilsIsPossibleNumber(
|
|
2971
|
-
return
|
|
2974
|
+
_utilsIsPossibleNumber(e) {
|
|
2975
|
+
return u.utils ? u.utils.isPossibleNumber(e, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
|
|
2972
2976
|
}
|
|
2973
2977
|
//* Shared internal validation logic to handle alpha character extension rules.
|
|
2974
|
-
_validateNumber(
|
|
2978
|
+
_validateNumber(e) {
|
|
2979
|
+
if (!u.utils)
|
|
2980
|
+
return null;
|
|
2975
2981
|
if (!this.selectedCountryData.iso2)
|
|
2976
2982
|
return !1;
|
|
2977
|
-
const
|
|
2983
|
+
const t = (o) => e ? this._utilsIsValidNumber(o) : this._utilsIsPossibleNumber(o), i = this._getFullNumber(), n = i.search(new RegExp("\\p{L}", "u"));
|
|
2978
2984
|
if (n > -1 && !this.options.allowPhonewords) {
|
|
2979
|
-
const o = i.substring(0, n), a =
|
|
2980
|
-
return a &&
|
|
2985
|
+
const o = i.substring(0, n), a = t(o), d = t(i);
|
|
2986
|
+
return a && d;
|
|
2981
2987
|
}
|
|
2982
|
-
return
|
|
2988
|
+
return t(i);
|
|
2983
2989
|
}
|
|
2984
|
-
_utilsIsValidNumber(
|
|
2985
|
-
return
|
|
2990
|
+
_utilsIsValidNumber(e) {
|
|
2991
|
+
return u.utils ? u.utils.isValidNumber(e, this.selectedCountryData.iso2, this.options.validationNumberTypes) : null;
|
|
2986
2992
|
}
|
|
2987
2993
|
//* Update the selected country, and update the input val accordingly.
|
|
2988
|
-
setCountry(
|
|
2989
|
-
const
|
|
2990
|
-
if (!S(
|
|
2991
|
-
throw new Error(`Invalid country code: '${
|
|
2994
|
+
setCountry(e) {
|
|
2995
|
+
const t = e == null ? void 0 : e.toLowerCase();
|
|
2996
|
+
if (!S(t))
|
|
2997
|
+
throw new Error(`Invalid country code: '${t}'`);
|
|
2992
2998
|
const i = this.selectedCountryData.iso2;
|
|
2993
|
-
(
|
|
2999
|
+
(e && t !== i || !e && i) && (this._setCountry(t), this._updateDialCode(this.selectedCountryData.dialCode), this.options.formatOnDisplay && this._updateValFromNumber(this.telInput.value), this._triggerCountryChange());
|
|
2994
3000
|
}
|
|
2995
3001
|
//* Set the input value and update the country.
|
|
2996
|
-
setNumber(
|
|
2997
|
-
const
|
|
2998
|
-
this._updateValFromNumber(
|
|
3002
|
+
setNumber(e) {
|
|
3003
|
+
const t = this._updateCountryFromNumber(e);
|
|
3004
|
+
this._updateValFromNumber(e), t && this._triggerCountryChange(), this._trigger("input", { isSetNumber: !0 });
|
|
2999
3005
|
}
|
|
3000
3006
|
//* Set the placeholder number typ
|
|
3001
|
-
setPlaceholderNumberType(
|
|
3002
|
-
this.options.placeholderNumberType =
|
|
3007
|
+
setPlaceholderNumberType(e) {
|
|
3008
|
+
this.options.placeholderNumberType = e, this._updatePlaceholder();
|
|
3003
3009
|
}
|
|
3004
|
-
setDisabled(
|
|
3005
|
-
this.telInput.disabled =
|
|
3010
|
+
setDisabled(e) {
|
|
3011
|
+
this.telInput.disabled = e, e ? this.selectedCountry.setAttribute("disabled", "true") : this.selectedCountry.removeAttribute("disabled");
|
|
3006
3012
|
}
|
|
3007
3013
|
}
|
|
3008
|
-
const st = (
|
|
3009
|
-
if (!
|
|
3010
|
-
let
|
|
3011
|
-
if (typeof
|
|
3014
|
+
const st = (r) => {
|
|
3015
|
+
if (!u.utils && !u.startedLoadingUtilsScript) {
|
|
3016
|
+
let e;
|
|
3017
|
+
if (typeof r == "function")
|
|
3012
3018
|
try {
|
|
3013
|
-
|
|
3014
|
-
} catch (
|
|
3015
|
-
return Promise.reject(
|
|
3019
|
+
e = Promise.resolve(r());
|
|
3020
|
+
} catch (t) {
|
|
3021
|
+
return Promise.reject(t);
|
|
3016
3022
|
}
|
|
3017
3023
|
else
|
|
3018
|
-
return Promise.reject(new TypeError(`The argument passed to attachUtils must be a function that returns a promise for the utilities module, not ${typeof
|
|
3019
|
-
return
|
|
3020
|
-
const i =
|
|
3024
|
+
return Promise.reject(new TypeError(`The argument passed to attachUtils must be a function that returns a promise for the utilities module, not ${typeof r}`));
|
|
3025
|
+
return u.startedLoadingUtilsScript = !0, e.then((t) => {
|
|
3026
|
+
const i = t == null ? void 0 : t.default;
|
|
3021
3027
|
if (!i || typeof i != "object")
|
|
3022
3028
|
throw new TypeError("The loader function passed to attachUtils did not resolve to a module object with utils as its default export.");
|
|
3023
|
-
return
|
|
3024
|
-
}).catch((
|
|
3025
|
-
throw
|
|
3029
|
+
return u.utils = i, v("handleUtils"), !0;
|
|
3030
|
+
}).catch((t) => {
|
|
3031
|
+
throw v("rejectUtilsScriptPromise", t), t;
|
|
3026
3032
|
});
|
|
3027
3033
|
}
|
|
3028
3034
|
return null;
|
|
3029
|
-
},
|
|
3030
|
-
(
|
|
3031
|
-
const
|
|
3032
|
-
return
|
|
3035
|
+
}, u = Object.assign(
|
|
3036
|
+
(r, e) => {
|
|
3037
|
+
const t = new L(r, e);
|
|
3038
|
+
return t._init(), r.setAttribute("data-intl-tel-input-id", t.id.toString()), u.instances[t.id] = t, r.iti = t, t;
|
|
3033
3039
|
},
|
|
3034
3040
|
{
|
|
3035
3041
|
defaults: x,
|
|
3036
3042
|
//* Using a static var like this allows us to mock it in the tests.
|
|
3037
3043
|
documentReady: () => document.readyState === "complete",
|
|
3038
3044
|
//* Get the country data object.
|
|
3039
|
-
getCountryData: () =>
|
|
3045
|
+
getCountryData: () => _,
|
|
3040
3046
|
//* A getter for the plugin instance.
|
|
3041
|
-
getInstance: (
|
|
3042
|
-
const
|
|
3043
|
-
return
|
|
3047
|
+
getInstance: (r) => {
|
|
3048
|
+
const e = r.getAttribute("data-intl-tel-input-id");
|
|
3049
|
+
return e ? u.instances[e] : null;
|
|
3044
3050
|
},
|
|
3045
3051
|
//* A map from instance ID to instance object.
|
|
3046
3052
|
instances: {},
|
|
3047
3053
|
attachUtils: st,
|
|
3048
3054
|
startedLoadingUtilsScript: !1,
|
|
3049
3055
|
startedLoadingAutoCountry: !1,
|
|
3050
|
-
version: "25.10.
|
|
3056
|
+
version: "25.10.12"
|
|
3051
3057
|
}
|
|
3052
3058
|
), at = {
|
|
3053
3059
|
__name: "IntlTelInput",
|
|
@@ -3081,10 +3087,10 @@ const st = (l) => {
|
|
|
3081
3087
|
"changeValidity",
|
|
3082
3088
|
"changeErrorCode"
|
|
3083
3089
|
], ["update:modelValue"]),
|
|
3084
|
-
setup(
|
|
3085
|
-
const i =
|
|
3086
|
-
let c =
|
|
3087
|
-
|
|
3090
|
+
setup(r, { expose: e, emit: t }) {
|
|
3091
|
+
const i = T(r, "modelValue"), n = r, s = t, o = N(), a = N(), d = N(!1), l = () => a.value ? n.options.strictMode ? a.value.isValidNumberPrecise() : a.value.isValidNumber() : null, h = () => {
|
|
3092
|
+
let c = l();
|
|
3093
|
+
d.value !== c && (d.value = c, s("changeValidity", !!c), s(
|
|
3088
3094
|
"changeErrorCode",
|
|
3089
3095
|
c ? null : a.value.getValidationError()
|
|
3090
3096
|
));
|
|
@@ -3096,26 +3102,26 @@ const st = (l) => {
|
|
|
3096
3102
|
s("changeCountry", ((c = a.value) == null ? void 0 : c.getSelectedCountryData().iso2) ?? ""), p(), h();
|
|
3097
3103
|
};
|
|
3098
3104
|
return M(() => {
|
|
3099
|
-
o.value && (a.value =
|
|
3105
|
+
o.value && (a.value = u(o.value, n.options), n.value && a.value.setNumber(n.value), n.disabled && a.value.setDisabled(n.disabled), d.value = l());
|
|
3100
3106
|
}), B(
|
|
3101
3107
|
() => n.disabled,
|
|
3102
3108
|
(c) => {
|
|
3103
|
-
var
|
|
3104
|
-
return (
|
|
3109
|
+
var f;
|
|
3110
|
+
return (f = a.value) == null ? void 0 : f.setDisabled(c);
|
|
3105
3111
|
}
|
|
3106
|
-
),
|
|
3112
|
+
), F(() => {
|
|
3107
3113
|
var c;
|
|
3108
3114
|
return (c = a.value) == null ? void 0 : c.destroy();
|
|
3109
|
-
}),
|
|
3115
|
+
}), e({ instance: a, input: o }), (c, f) => R((V(), z("input", $({
|
|
3110
3116
|
ref_key: "input",
|
|
3111
3117
|
ref: o,
|
|
3112
|
-
"onUpdate:modelValue":
|
|
3118
|
+
"onUpdate:modelValue": f[0] || (f[0] = (C) => i.value = C),
|
|
3113
3119
|
type: "tel",
|
|
3114
3120
|
onCountrychange: g,
|
|
3115
3121
|
onInput: p
|
|
3116
|
-
},
|
|
3122
|
+
}, r.inputProps), null, 16)), [
|
|
3117
3123
|
[
|
|
3118
|
-
|
|
3124
|
+
U,
|
|
3119
3125
|
i.value,
|
|
3120
3126
|
void 0,
|
|
3121
3127
|
{ lazy: !0 }
|