intl-tel-input 25.11.0 → 25.11.2

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.
Files changed (31) hide show
  1. package/README.md +5 -5
  2. package/angular/README.md +1 -1
  3. package/angular/build/IntlTelInput.js +349 -200
  4. package/angular/build/IntlTelInputWithUtils.js +349 -200
  5. package/angular/build/types/intl-tel-input/data.d.ts +3 -3
  6. package/angular/build/types/intl-tel-input.d.ts +5 -1
  7. package/angular/build/types/modules/constants.d.ts +84 -0
  8. package/angular/build/types/modules/core/countrySearch.d.ts +17 -0
  9. package/angular/build/types/modules/core/icons.d.ts +7 -0
  10. package/angular/build/types/modules/core/options.d.ts +2 -1
  11. package/angular/build/types/modules/data/country-data.d.ts +5 -5
  12. package/angular/build/types/modules/format/caret.d.ts +1 -1
  13. package/angular/build/types/modules/format/formatting.d.ts +2 -2
  14. package/angular/build/types/modules/types/events.d.ts +5 -4
  15. package/build/js/data.js +8 -2
  16. package/build/js/data.min.js +2 -2
  17. package/build/js/intlTelInput.d.ts +137 -17
  18. package/build/js/intlTelInput.js +397 -226
  19. package/build/js/intlTelInput.min.js +13 -13
  20. package/build/js/intlTelInputWithUtils.js +397 -226
  21. package/build/js/intlTelInputWithUtils.min.js +13 -13
  22. package/package.json +2 -1
  23. package/react/README.md +1 -1
  24. package/react/build/IntlTelInput.cjs +396 -225
  25. package/react/build/IntlTelInput.d.ts +137 -17
  26. package/react/build/IntlTelInput.js +396 -225
  27. package/react/build/IntlTelInputWithUtils.cjs +396 -225
  28. package/react/build/IntlTelInputWithUtils.js +396 -225
  29. package/vue/README.md +1 -1
  30. package/vue/build/IntlTelInput.mjs +514 -390
  31. package/vue/build/IntlTelInputWithUtils.mjs +923 -799
@@ -1688,7 +1688,13 @@ for (const c of rawCountryData) {
1688
1688
  areaCodes: c[3] || null,
1689
1689
  nodeById: {},
1690
1690
  // populated by the plugin
1691
- nationalPrefix: c[4] || null
1691
+ nationalPrefix: c[4] || null,
1692
+ normalisedName: "",
1693
+ // populated in the plugin
1694
+ initials: "",
1695
+ // populated in the plugin
1696
+ dialCodePlus: ""
1697
+ // populated in the plugin
1692
1698
  });
1693
1699
  }
1694
1700
  var data_default = allCountries;
@@ -1960,13 +1966,111 @@ var interface_default = interfaceTranslations;
1960
1966
  var allTranslations = { ...countries_default, ...interface_default };
1961
1967
  var en_default = allTranslations;
1962
1968
 
1963
- // src/js/modules/core/options.ts
1964
- var mq = (q) => {
1965
- return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(q).matches;
1969
+ // src/js/modules/constants.ts
1970
+ var EVENTS = {
1971
+ OPEN_COUNTRY_DROPDOWN: "open:countrydropdown",
1972
+ CLOSE_COUNTRY_DROPDOWN: "close:countrydropdown",
1973
+ COUNTRY_CHANGE: "countrychange",
1974
+ INPUT: "input"
1975
+ // used for synthetic input trigger
1976
+ };
1977
+ var CLASSES = {
1978
+ HIDE: "iti__hide",
1979
+ V_HIDE: "iti__v-hide",
1980
+ ARROW_UP: "iti__arrow--up",
1981
+ GLOBE: "iti__globe",
1982
+ FLAG: "iti__flag",
1983
+ COUNTRY_ITEM: "iti__country",
1984
+ HIGHLIGHT: "iti__highlight"
1985
+ };
1986
+ var KEYS = {
1987
+ ARROW_UP: "ArrowUp",
1988
+ ARROW_DOWN: "ArrowDown",
1989
+ SPACE: " ",
1990
+ ENTER: "Enter",
1991
+ ESC: "Escape",
1992
+ TAB: "Tab"
1993
+ };
1994
+ var INPUT_TYPES = {
1995
+ PASTE: "insertFromPaste",
1996
+ DELETE_FWD: "deleteContentForward"
1997
+ };
1998
+ var REGEX = {
1999
+ ALPHA_UNICODE: /\p{L}/u,
2000
+ // any kind of letter from any language
2001
+ NON_PLUS_NUMERIC: /[^+0-9]/,
2002
+ // chars that are NOT + or digit
2003
+ NON_PLUS_NUMERIC_GLOBAL: /[^+0-9]/g,
2004
+ // chars that are NOT + or digit (global)
2005
+ HIDDEN_SEARCH_CHAR: /^[a-zA-ZÀ-ÿа-яА-Я ]$/
2006
+ // single acceptable hidden-search char
2007
+ };
2008
+ var TIMINGS = {
2009
+ SEARCH_DEBOUNCE_MS: 100,
2010
+ HIDDEN_SEARCH_RESET_MS: 1e3,
2011
+ NEXT_TICK: 0
2012
+ };
2013
+ var SENTINELS = {
2014
+ UNKNOWN_NUMBER_TYPE: -99,
2015
+ UNKNOWN_VALIDATION_ERROR: -99
2016
+ };
2017
+ var LAYOUT = {
2018
+ SANE_SELECTED_WITH_DIAL_WIDTH: 78,
2019
+ // px width fallback when separateDialCode enabled
2020
+ SANE_SELECTED_NO_DIAL_WIDTH: 42,
2021
+ // px width fallback when no separate dial code
2022
+ INPUT_PADDING_EXTRA_LEFT: 6
2023
+ // px gap between selected country container and input text
2024
+ };
2025
+ var DIAL = {
2026
+ PLUS: "+",
2027
+ NANP: "1"
2028
+ // North American Numbering Plan
2029
+ };
2030
+ var UK = {
2031
+ ISO2: "gb",
2032
+ DIAL_CODE: "44",
2033
+ // +44 United Kingdom
2034
+ MOBILE_PREFIX: "7",
2035
+ // UK mobile numbers start with 7 after national trunk (0) or core section
2036
+ MOBILE_CORE_LENGTH: 10
2037
+ // core number length (excluding dial code / national prefix) for mobiles
2038
+ };
2039
+ var US = {
2040
+ ISO2: "us",
2041
+ DIAL_CODE: "1"
2042
+ // +1 United States
2043
+ };
2044
+ var PLACEHOLDER_MODES = {
2045
+ AGGRESSIVE: "aggressive",
2046
+ POLITE: "polite"
1966
2047
  };
2048
+ var INITIAL_COUNTRY = {
2049
+ AUTO: "auto"
2050
+ };
2051
+ var DATA_KEYS = {
2052
+ COUNTRY_CODE: "countryCode",
2053
+ DIAL_CODE: "dialCode"
2054
+ };
2055
+ var ARIA = {
2056
+ EXPANDED: "aria-expanded",
2057
+ LABEL: "aria-label",
2058
+ SELECTED: "aria-selected",
2059
+ ACTIVE_DESCENDANT: "aria-activedescendant",
2060
+ HASPOPUP: "aria-haspopup",
2061
+ CONTROLS: "aria-controls",
2062
+ HIDDEN: "aria-hidden",
2063
+ AUTOCOMPLETE: "aria-autocomplete",
2064
+ MODAL: "aria-modal"
2065
+ };
2066
+
2067
+ // src/js/modules/core/options.ts
2068
+ var mq = (q) => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(q).matches;
1967
2069
  var computeDefaultUseFullscreenPopup = () => {
1968
2070
  if (typeof navigator !== "undefined" && typeof window !== "undefined") {
1969
- const isMobileUserAgent = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
2071
+ const isMobileUserAgent = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
2072
+ navigator.userAgent
2073
+ );
1970
2074
  const isNarrowViewport = mq("(max-width: 500px)");
1971
2075
  const isShortViewport = mq("(max-height: 600px)");
1972
2076
  const isCoarsePointer = mq("(pointer: coarse)");
@@ -1980,7 +2084,7 @@ var defaults = {
1980
2084
  //* Whether or not to allow the dropdown.
1981
2085
  allowDropdown: true,
1982
2086
  //* Add a placeholder in the input with an example number for the selected country.
1983
- autoPlaceholder: "polite",
2087
+ autoPlaceholder: PLACEHOLDER_MODES.POLITE,
1984
2088
  //* Modify the parentClass.
1985
2089
  containerClass: "",
1986
2090
  //* The order of the countries in the dropdown. Defaults to alphabetical.
@@ -2026,7 +2130,7 @@ var defaults = {
2026
2130
  //* The number type to enforce during validation.
2027
2131
  validationNumberTypes: ["MOBILE"]
2028
2132
  };
2029
- function applyOptionSideEffects(o) {
2133
+ var applyOptionSideEffects = (o, defaultEnglishStrings) => {
2030
2134
  if (o.useFullscreenPopup) {
2031
2135
  o.fixDropdownWidth = false;
2032
2136
  }
@@ -2042,19 +2146,66 @@ function applyOptionSideEffects(o) {
2042
2146
  if (o.useFullscreenPopup && !o.dropdownContainer) {
2043
2147
  o.dropdownContainer = document.body;
2044
2148
  }
2045
- o.i18n = { ...en_default, ...o.i18n };
2046
- }
2149
+ o.i18n = { ...defaultEnglishStrings, ...o.i18n };
2150
+ };
2047
2151
 
2048
2152
  // src/js/modules/utils/string.ts
2049
2153
  var getNumeric = (s) => s.replace(/\D/g, "");
2050
2154
  var normaliseString = (s = "") => s.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
2051
2155
 
2156
+ // src/js/modules/core/countrySearch.ts
2157
+ var getMatchedCountries = (countries, query) => {
2158
+ const normalisedQuery = normaliseString(query);
2159
+ const iso2Matches = [];
2160
+ const nameStartWith = [];
2161
+ const nameContains = [];
2162
+ const dialCodeMatches = [];
2163
+ const dialCodeContains = [];
2164
+ const initialsMatches = [];
2165
+ for (const c of countries) {
2166
+ if (c.iso2 === normalisedQuery) {
2167
+ iso2Matches.push(c);
2168
+ } else if (c.normalisedName.startsWith(normalisedQuery)) {
2169
+ nameStartWith.push(c);
2170
+ } else if (c.normalisedName.includes(normalisedQuery)) {
2171
+ nameContains.push(c);
2172
+ } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
2173
+ dialCodeMatches.push(c);
2174
+ } else if (c.dialCodePlus.includes(normalisedQuery)) {
2175
+ dialCodeContains.push(c);
2176
+ } else if (c.initials.includes(normalisedQuery)) {
2177
+ initialsMatches.push(c);
2178
+ }
2179
+ }
2180
+ const sortByPriority = (a, b) => a.priority - b.priority;
2181
+ return [
2182
+ ...iso2Matches.sort(sortByPriority),
2183
+ ...nameStartWith.sort(sortByPriority),
2184
+ ...nameContains.sort(sortByPriority),
2185
+ ...dialCodeMatches.sort(sortByPriority),
2186
+ ...dialCodeContains.sort(sortByPriority),
2187
+ ...initialsMatches.sort(sortByPriority)
2188
+ ];
2189
+ };
2190
+ var findFirstCountryStartingWith = (countries, query) => {
2191
+ const lowerQuery = query.toLowerCase();
2192
+ for (const c of countries) {
2193
+ const lowerName = c.name.toLowerCase();
2194
+ if (lowerName.startsWith(lowerQuery)) {
2195
+ return c;
2196
+ }
2197
+ }
2198
+ return null;
2199
+ };
2200
+
2052
2201
  // src/js/modules/utils/dom.ts
2053
2202
  var buildClassNames = (flags) => Object.keys(flags).filter((k) => Boolean(flags[k])).join(" ");
2054
2203
  var createEl = (tagName, attrs, container) => {
2055
2204
  const el = document.createElement(tagName);
2056
2205
  if (attrs) {
2057
- Object.entries(attrs).forEach(([key, value]) => el.setAttribute(key, value));
2206
+ Object.entries(attrs).forEach(
2207
+ ([key, value]) => el.setAttribute(key, value)
2208
+ );
2058
2209
  }
2059
2210
  if (container) {
2060
2211
  container.appendChild(el);
@@ -2062,6 +2213,24 @@ var createEl = (tagName, attrs, container) => {
2062
2213
  return el;
2063
2214
  };
2064
2215
 
2216
+ // src/js/modules/core/icons.ts
2217
+ var buildSearchIcon = () => `
2218
+ <svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" ${ARIA.HIDDEN}="true">
2219
+ <circle cx="11" cy="11" r="7" />
2220
+ <line x1="21" y1="21" x2="16.65" y2="16.65" />
2221
+ </svg>`;
2222
+ var buildClearIcon = (id2) => {
2223
+ const maskId = `iti-${id2}-clear-mask`;
2224
+ return `
2225
+ <svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" ${ARIA.HIDDEN}="true" focusable="false">
2226
+ <mask id="${maskId}" maskUnits="userSpaceOnUse">
2227
+ <rect width="16" height="16" fill="white" />
2228
+ <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" />
2229
+ </mask>
2230
+ <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
2231
+ </svg>`;
2232
+ };
2233
+
2065
2234
  // src/js/modules/core/ui.ts
2066
2235
  var UI = class {
2067
2236
  constructor(input, options, id2) {
@@ -2093,12 +2262,7 @@ var UI = class {
2093
2262
  }
2094
2263
  }
2095
2264
  _createWrapperAndInsert() {
2096
- const {
2097
- allowDropdown,
2098
- showFlags,
2099
- containerClass,
2100
- useFullscreenPopup
2101
- } = this.options;
2265
+ const { allowDropdown, showFlags, containerClass, useFullscreenPopup } = this.options;
2102
2266
  const parentClasses = buildClassNames({
2103
2267
  iti: true,
2104
2268
  "iti--allow-dropdown": allowDropdown,
@@ -2119,7 +2283,7 @@ var UI = class {
2119
2283
  this.countryContainer = createEl(
2120
2284
  "div",
2121
2285
  // visibly hidden until we measure it's width to set the input padding correctly
2122
- { class: "iti__country-container iti__v-hide" },
2286
+ { class: `iti__country-container ${CLASSES.V_HIDE}` },
2123
2287
  wrapper
2124
2288
  );
2125
2289
  if (allowDropdown) {
@@ -2128,10 +2292,10 @@ var UI = class {
2128
2292
  {
2129
2293
  type: "button",
2130
2294
  class: "iti__selected-country",
2131
- "aria-expanded": "false",
2132
- "aria-label": this.options.i18n.noCountrySelected,
2133
- "aria-haspopup": "dialog",
2134
- "aria-controls": `iti-${this.id}__dropdown-content`
2295
+ [ARIA.EXPANDED]: "false",
2296
+ [ARIA.LABEL]: this.options.i18n.noCountrySelected,
2297
+ [ARIA.HASPOPUP]: "dialog",
2298
+ [ARIA.CONTROLS]: `iti-${this.id}__dropdown-content`
2135
2299
  },
2136
2300
  this.countryContainer
2137
2301
  );
@@ -2152,13 +2316,13 @@ var UI = class {
2152
2316
  );
2153
2317
  this.selectedCountryInner = createEl(
2154
2318
  "div",
2155
- { class: "iti__flag" },
2319
+ { class: CLASSES.FLAG },
2156
2320
  selectedCountryPrimary
2157
2321
  );
2158
2322
  if (allowDropdown) {
2159
2323
  this.dropdownArrow = createEl(
2160
2324
  "div",
2161
- { class: "iti__arrow", "aria-hidden": "true" },
2325
+ { class: "iti__arrow", [ARIA.HIDDEN]: "true" },
2162
2326
  selectedCountryPrimary
2163
2327
  );
2164
2328
  }
@@ -2186,9 +2350,9 @@ var UI = class {
2186
2350
  const extraClasses = fixDropdownWidth ? "" : "iti--flexible-dropdown-width";
2187
2351
  this.dropdownContent = createEl("div", {
2188
2352
  id: `iti-${this.id}__dropdown-content`,
2189
- class: `iti__dropdown-content iti__hide ${extraClasses}`,
2353
+ class: `iti__dropdown-content ${CLASSES.HIDE} ${extraClasses}`,
2190
2354
  role: "dialog",
2191
- "aria-modal": "true"
2355
+ [ARIA.MODAL]: "true"
2192
2356
  });
2193
2357
  if (this.isRTL) {
2194
2358
  this.dropdownContent.setAttribute("dir", "rtl");
@@ -2202,12 +2366,12 @@ var UI = class {
2202
2366
  class: "iti__country-list",
2203
2367
  id: `iti-${this.id}__country-listbox`,
2204
2368
  role: "listbox",
2205
- "aria-label": i18n.countryListAriaLabel
2369
+ [ARIA.LABEL]: i18n.countryListAriaLabel
2206
2370
  },
2207
2371
  this.dropdownContent
2208
2372
  );
2209
2373
  this._appendListItems();
2210
- if (this.options.countrySearch) {
2374
+ if (countrySearch) {
2211
2375
  this.updateSearchResultsA11yText();
2212
2376
  }
2213
2377
  if (dropdownContainer) {
@@ -2235,15 +2399,11 @@ var UI = class {
2235
2399
  "span",
2236
2400
  {
2237
2401
  class: "iti__search-icon",
2238
- "aria-hidden": "true"
2402
+ [ARIA.HIDDEN]: "true"
2239
2403
  },
2240
2404
  searchWrapper
2241
2405
  );
2242
- this.searchIcon.innerHTML = `
2243
- <svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
2244
- <circle cx="11" cy="11" r="7" />
2245
- <line x1="21" y1="21" x2="16.65" y2="16.65" />
2246
- </svg>`;
2406
+ this.searchIcon.innerHTML = buildSearchIcon();
2247
2407
  this.searchInput = createEl(
2248
2408
  "input",
2249
2409
  {
@@ -2254,10 +2414,10 @@ var UI = class {
2254
2414
  placeholder: i18n.searchPlaceholder,
2255
2415
  // 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
2256
2416
  role: "combobox",
2257
- "aria-expanded": "true",
2258
- "aria-label": i18n.searchPlaceholder,
2259
- "aria-controls": `iti-${this.id}__country-listbox`,
2260
- "aria-autocomplete": "list",
2417
+ [ARIA.EXPANDED]: "true",
2418
+ [ARIA.LABEL]: i18n.searchPlaceholder,
2419
+ [ARIA.CONTROLS]: `iti-${this.id}__country-listbox`,
2420
+ [ARIA.AUTOCOMPLETE]: "list",
2261
2421
  autocomplete: "off"
2262
2422
  },
2263
2423
  searchWrapper
@@ -2266,21 +2426,13 @@ var UI = class {
2266
2426
  "button",
2267
2427
  {
2268
2428
  type: "button",
2269
- class: "iti__search-clear iti__hide",
2270
- "aria-label": i18n.clearSearchAriaLabel,
2429
+ class: `iti__search-clear ${CLASSES.HIDE}`,
2430
+ [ARIA.LABEL]: i18n.clearSearchAriaLabel,
2271
2431
  tabindex: "-1"
2272
2432
  },
2273
2433
  searchWrapper
2274
2434
  );
2275
- const maskId = `iti-${this.id}-clear-mask`;
2276
- this.searchClearButton.innerHTML = `
2277
- <svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
2278
- <mask id="${maskId}" maskUnits="userSpaceOnUse">
2279
- <rect width="16" height="16" fill="white" />
2280
- <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" />
2281
- </mask>
2282
- <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
2283
- </svg>`;
2435
+ this.searchClearButton.innerHTML = buildClearIcon(this.id);
2284
2436
  this.searchResultsA11yText = createEl(
2285
2437
  "span",
2286
2438
  { class: "iti__a11y-text" },
@@ -2289,8 +2441,8 @@ var UI = class {
2289
2441
  this.searchNoResults = createEl(
2290
2442
  "div",
2291
2443
  {
2292
- class: "iti__no-results iti__hide",
2293
- "aria-hidden": "true"
2444
+ class: `iti__no-results ${CLASSES.HIDE}`,
2445
+ [ARIA.HIDDEN]: "true"
2294
2446
  // all a11y messaging happens in this.searchResultsA11yText
2295
2447
  },
2296
2448
  this.dropdownContent
@@ -2300,7 +2452,7 @@ var UI = class {
2300
2452
  _maybeUpdateInputPaddingAndReveal() {
2301
2453
  if (this.countryContainer) {
2302
2454
  this.updateInputPadding();
2303
- this.countryContainer.classList.remove("iti__v-hide");
2455
+ this.countryContainer.classList.remove(CLASSES.V_HIDE);
2304
2456
  }
2305
2457
  }
2306
2458
  _maybeBuildHiddenInputs(wrapper) {
@@ -2344,21 +2496,21 @@ var UI = class {
2344
2496
  for (let i = 0; i < this.countries.length; i++) {
2345
2497
  const c = this.countries[i];
2346
2498
  const liClass = buildClassNames({
2347
- iti__country: true,
2348
- iti__highlight: i === 0
2499
+ [CLASSES.COUNTRY_ITEM]: true,
2500
+ [CLASSES.HIGHLIGHT]: i === 0
2349
2501
  });
2350
2502
  const listItem = createEl("li", {
2351
2503
  id: `iti-${this.id}__item-${c.iso2}`,
2352
2504
  class: liClass,
2353
2505
  tabindex: "-1",
2354
2506
  role: "option",
2355
- "aria-selected": "false"
2507
+ [ARIA.SELECTED]: "false"
2356
2508
  });
2357
2509
  listItem.dataset.dialCode = c.dialCode;
2358
2510
  listItem.dataset.countryCode = c.iso2;
2359
2511
  c.nodeById[this.id] = listItem;
2360
2512
  if (this.options.showFlags) {
2361
- createEl("div", { class: `iti__flag iti__${c.iso2}` }, listItem);
2513
+ createEl("div", { class: `${CLASSES.FLAG} iti__${c.iso2}` }, listItem);
2362
2514
  }
2363
2515
  const nameEl = createEl("span", { class: "iti__country-name" }, listItem);
2364
2516
  nameEl.textContent = c.name;
@@ -2374,9 +2526,9 @@ var UI = class {
2374
2526
  //* Update the input padding to make space for the selected country/dial code.
2375
2527
  updateInputPadding() {
2376
2528
  if (this.selectedCountry) {
2377
- const saneDefaultWidth = this.options.separateDialCode ? 78 : 42;
2378
- const selectedCountryWidth = this.selectedCountry.offsetWidth || this._getHiddenSelectedCountryWidth() || saneDefaultWidth;
2379
- const inputPadding = selectedCountryWidth + 6;
2529
+ const fallbackWidth = this.options.separateDialCode ? LAYOUT.SANE_SELECTED_WITH_DIAL_WIDTH : LAYOUT.SANE_SELECTED_NO_DIAL_WIDTH;
2530
+ const selectedCountryWidth = this.selectedCountry.offsetWidth || this._getHiddenSelectedCountryWidth() || fallbackWidth;
2531
+ const inputPadding = selectedCountryWidth + LAYOUT.INPUT_PADDING_EXTRA_LEFT;
2380
2532
  this.telInput.style.paddingLeft = `${inputPadding}px`;
2381
2533
  }
2382
2534
  }
@@ -2452,19 +2604,16 @@ var UI = class {
2452
2604
  highlightListItem(listItem, shouldFocus) {
2453
2605
  const prevItem = this.highlightedItem;
2454
2606
  if (prevItem) {
2455
- prevItem.classList.remove("iti__highlight");
2456
- prevItem.setAttribute("aria-selected", "false");
2607
+ prevItem.classList.remove(CLASSES.HIGHLIGHT);
2608
+ prevItem.setAttribute(ARIA.SELECTED, "false");
2457
2609
  }
2458
2610
  this.highlightedItem = listItem;
2459
2611
  if (this.highlightedItem) {
2460
- this.highlightedItem.classList.add("iti__highlight");
2461
- this.highlightedItem.setAttribute("aria-selected", "true");
2612
+ this.highlightedItem.classList.add(CLASSES.HIGHLIGHT);
2613
+ this.highlightedItem.setAttribute(ARIA.SELECTED, "true");
2462
2614
  if (this.options.countrySearch) {
2463
2615
  const activeDescendant = this.highlightedItem.getAttribute("id") || "";
2464
- this.searchInput.setAttribute(
2465
- "aria-activedescendant",
2466
- activeDescendant
2467
- );
2616
+ this.searchInput.setAttribute(ARIA.ACTIVE_DESCENDANT, activeDescendant);
2468
2617
  }
2469
2618
  }
2470
2619
  if (shouldFocus) {
@@ -2488,10 +2637,10 @@ var UI = class {
2488
2637
  if (noCountriesAddedYet) {
2489
2638
  this.highlightListItem(null, false);
2490
2639
  if (this.searchNoResults) {
2491
- this.searchNoResults.classList.remove("iti__hide");
2640
+ this.searchNoResults.classList.remove(CLASSES.HIDE);
2492
2641
  }
2493
2642
  } else if (this.searchNoResults) {
2494
- this.searchNoResults.classList.add("iti__hide");
2643
+ this.searchNoResults.classList.add(CLASSES.HIDE);
2495
2644
  }
2496
2645
  this.countryList.scrollTop = 0;
2497
2646
  this.updateSearchResultsA11yText();
@@ -2530,26 +2679,34 @@ var UI = class {
2530
2679
  };
2531
2680
 
2532
2681
  // src/js/modules/data/country-data.ts
2533
- function processAllCountries(options) {
2682
+ var processAllCountries = (options) => {
2534
2683
  const { onlyCountries, excludeCountries } = options;
2535
2684
  if (onlyCountries.length) {
2536
- const lowerCaseOnlyCountries = onlyCountries.map((country) => country.toLowerCase());
2537
- return data_default.filter((country) => lowerCaseOnlyCountries.includes(country.iso2));
2685
+ const lowerCaseOnlyCountries = onlyCountries.map(
2686
+ (country) => country.toLowerCase()
2687
+ );
2688
+ return data_default.filter(
2689
+ (country) => lowerCaseOnlyCountries.includes(country.iso2)
2690
+ );
2538
2691
  } else if (excludeCountries.length) {
2539
- const lowerCaseExcludeCountries = excludeCountries.map((country) => country.toLowerCase());
2540
- return data_default.filter((country) => !lowerCaseExcludeCountries.includes(country.iso2));
2692
+ const lowerCaseExcludeCountries = excludeCountries.map(
2693
+ (country) => country.toLowerCase()
2694
+ );
2695
+ return data_default.filter(
2696
+ (country) => !lowerCaseExcludeCountries.includes(country.iso2)
2697
+ );
2541
2698
  }
2542
2699
  return data_default;
2543
- }
2544
- function translateCountryNames(countries, options) {
2700
+ };
2701
+ var translateCountryNames = (countries, options) => {
2545
2702
  for (const c of countries) {
2546
2703
  const iso2 = c.iso2.toLowerCase();
2547
2704
  if (options.i18n[iso2]) {
2548
2705
  c.name = options.i18n[iso2];
2549
2706
  }
2550
2707
  }
2551
- }
2552
- function processDialCodes(countries, options) {
2708
+ };
2709
+ var processDialCodes = (countries, options) => {
2553
2710
  const dialCodes = /* @__PURE__ */ new Set();
2554
2711
  let dialCodeMaxLen = 0;
2555
2712
  const dialCodeToIso2Map = {};
@@ -2600,10 +2757,12 @@ function processDialCodes(countries, options) {
2600
2757
  }
2601
2758
  }
2602
2759
  return { dialCodes, dialCodeMaxLen, dialCodeToIso2Map };
2603
- }
2604
- function sortCountries(countries, options) {
2760
+ };
2761
+ var sortCountries = (countries, options) => {
2605
2762
  if (options.countryOrder) {
2606
- options.countryOrder = options.countryOrder.map((iso2) => iso2.toLowerCase());
2763
+ options.countryOrder = options.countryOrder.map(
2764
+ (iso2) => iso2.toLowerCase()
2765
+ );
2607
2766
  }
2608
2767
  countries.sort((a, b) => {
2609
2768
  const { countryOrder } = options;
@@ -2621,17 +2780,17 @@ function sortCountries(countries, options) {
2621
2780
  }
2622
2781
  return a.name.localeCompare(b.name);
2623
2782
  });
2624
- }
2625
- function cacheSearchTokens(countries) {
2783
+ };
2784
+ var cacheSearchTokens = (countries) => {
2626
2785
  for (const c of countries) {
2627
2786
  c.normalisedName = normaliseString(c.name);
2628
- c.initials = c.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((word) => word[0]).join("").toLowerCase();
2787
+ c.initials = c.normalisedName.split(/[^a-z]/).map((word) => word[0]).join("");
2629
2788
  c.dialCodePlus = `+${c.dialCode}`;
2630
2789
  }
2631
- }
2790
+ };
2632
2791
 
2633
2792
  // src/js/modules/format/formatting.ts
2634
- function beforeSetNumber(fullNumber, dialCode, separateDialCode, selectedCountryData) {
2793
+ var beforeSetNumber = (fullNumber, dialCode, separateDialCode, selectedCountryData) => {
2635
2794
  let number = fullNumber;
2636
2795
  if (separateDialCode) {
2637
2796
  if (dialCode) {
@@ -2641,8 +2800,8 @@ function beforeSetNumber(fullNumber, dialCode, separateDialCode, selectedCountry
2641
2800
  }
2642
2801
  }
2643
2802
  return number;
2644
- }
2645
- function formatNumberAsYouType(fullNumber, telInputValue, utils2, selectedCountryData, separateDialCode) {
2803
+ };
2804
+ var formatNumberAsYouType = (fullNumber, telInputValue, utils2, selectedCountryData, separateDialCode) => {
2646
2805
  const result = utils2 ? utils2.formatNumberAsYouType(fullNumber, selectedCountryData.iso2) : fullNumber;
2647
2806
  const { dialCode } = selectedCountryData;
2648
2807
  if (separateDialCode && telInputValue.charAt(0) !== "+" && result.includes(`+${dialCode}`)) {
@@ -2650,10 +2809,10 @@ function formatNumberAsYouType(fullNumber, telInputValue, utils2, selectedCountr
2650
2809
  return afterDialCode.trim();
2651
2810
  }
2652
2811
  return result;
2653
- }
2812
+ };
2654
2813
 
2655
2814
  // src/js/modules/format/caret.ts
2656
- function translateCursorPosition(relevantChars, formattedValue, prevCaretPos, isDeleteForwards) {
2815
+ var translateCursorPosition = (relevantChars, formattedValue, prevCaretPos, isDeleteForwards) => {
2657
2816
  if (prevCaretPos === 0 && !isDeleteForwards) {
2658
2817
  return 0;
2659
2818
  }
@@ -2670,7 +2829,7 @@ function translateCursorPosition(relevantChars, formattedValue, prevCaretPos, is
2670
2829
  }
2671
2830
  }
2672
2831
  return formattedValue.length;
2673
- }
2832
+ };
2674
2833
 
2675
2834
  // src/js/modules/data/nanp-regionless.ts
2676
2835
  var regionlessNanpNumbers = [
@@ -2694,7 +2853,7 @@ var regionlessNanpNumbers = [
2694
2853
  ];
2695
2854
  var isRegionlessNanp = (number) => {
2696
2855
  const numeric = getNumeric(number);
2697
- if (numeric.charAt(0) === "1") {
2856
+ if (numeric.startsWith(DIAL.NANP) && numeric.length >= 4) {
2698
2857
  const areaCode = numeric.substring(1, 4);
2699
2858
  return regionlessNanpNumbers.includes(areaCode);
2700
2859
  }
@@ -2703,7 +2862,7 @@ var isRegionlessNanp = (number) => {
2703
2862
 
2704
2863
  // src/js/intl-tel-input.ts
2705
2864
  for (const c of data_default) {
2706
- c.name = countries_default[c.iso2];
2865
+ c.name = en_default[c.iso2];
2707
2866
  }
2708
2867
  var id = 0;
2709
2868
  var iso2Set = new Set(data_default.map((c) => c.iso2));
@@ -2712,7 +2871,7 @@ var Iti = class _Iti {
2712
2871
  constructor(input, customOptions = {}) {
2713
2872
  this.id = id++;
2714
2873
  this.options = { ...defaults, ...customOptions };
2715
- applyOptionSideEffects(this.options);
2874
+ applyOptionSideEffects(this.options, en_default);
2716
2875
  this.ui = new UI(input, this.options, this.id);
2717
2876
  this.isAndroid = _Iti._getIsAndroid();
2718
2877
  this.promise = this._createInitPromises();
@@ -2771,7 +2930,7 @@ var Iti = class _Iti {
2771
2930
  const dialCode = this._getDialCode(val);
2772
2931
  const isRegionlessNanpNumber = isRegionlessNanp(val);
2773
2932
  const { initialCountry, geoIpLookup } = this.options;
2774
- const isAutoCountry = initialCountry === "auto" && geoIpLookup;
2933
+ const isAutoCountry = initialCountry === INITIAL_COUNTRY.AUTO && geoIpLookup;
2775
2934
  if (dialCode && !isRegionlessNanpNumber) {
2776
2935
  this._updateCountryFromNumber(val);
2777
2936
  } else if (!isAutoCountry || overrideAutoCountry) {
@@ -2780,7 +2939,7 @@ var Iti = class _Iti {
2780
2939
  this._setCountry(lowerInitialCountry);
2781
2940
  } else {
2782
2941
  if (dialCode && isRegionlessNanpNumber) {
2783
- this._setCountry("us");
2942
+ this._setCountry(US.ISO2);
2784
2943
  } else {
2785
2944
  this._setCountry("");
2786
2945
  }
@@ -2818,7 +2977,7 @@ var Iti = class _Iti {
2818
2977
  _initDropdownListeners() {
2819
2978
  const signal = this.abortController.signal;
2820
2979
  const handleLabelClick = (e) => {
2821
- if (this.ui.dropdownContent.classList.contains("iti__hide")) {
2980
+ if (this.ui.dropdownContent.classList.contains(CLASSES.HIDE)) {
2822
2981
  this.ui.telInput.focus();
2823
2982
  } else {
2824
2983
  e.preventDefault();
@@ -2829,22 +2988,30 @@ var Iti = class _Iti {
2829
2988
  label.addEventListener("click", handleLabelClick, { signal });
2830
2989
  }
2831
2990
  const handleClickSelectedCountry = () => {
2832
- const dropdownClosed = this.ui.dropdownContent.classList.contains("iti__hide");
2991
+ const dropdownClosed = this.ui.dropdownContent.classList.contains(
2992
+ CLASSES.HIDE
2993
+ );
2833
2994
  if (dropdownClosed && !this.ui.telInput.disabled && !this.ui.telInput.readOnly) {
2834
2995
  this._openDropdown();
2835
2996
  }
2836
2997
  };
2837
- this.ui.selectedCountry.addEventListener("click", handleClickSelectedCountry, {
2838
- signal
2839
- });
2998
+ this.ui.selectedCountry.addEventListener(
2999
+ "click",
3000
+ handleClickSelectedCountry,
3001
+ {
3002
+ signal
3003
+ }
3004
+ );
2840
3005
  const handleCountryContainerKeydown = (e) => {
2841
- const isDropdownHidden = this.ui.dropdownContent.classList.contains("iti__hide");
2842
- if (isDropdownHidden && ["ArrowUp", "ArrowDown", " ", "Enter"].includes(e.key)) {
3006
+ const isDropdownHidden = this.ui.dropdownContent.classList.contains(
3007
+ CLASSES.HIDE
3008
+ );
3009
+ if (isDropdownHidden && [KEYS.ARROW_UP, KEYS.ARROW_DOWN, KEYS.SPACE, KEYS.ENTER].includes(e.key)) {
2843
3010
  e.preventDefault();
2844
3011
  e.stopPropagation();
2845
3012
  this._openDropdown();
2846
3013
  }
2847
- if (e.key === "Tab") {
3014
+ if (e.key === KEYS.TAB) {
2848
3015
  this._closeDropdown();
2849
3016
  }
2850
3017
  };
@@ -2875,7 +3042,7 @@ var Iti = class _Iti {
2875
3042
  } else {
2876
3043
  this.resolveUtilsScriptPromise();
2877
3044
  }
2878
- const isAutoCountry = initialCountry === "auto" && geoIpLookup;
3045
+ const isAutoCountry = initialCountry === INITIAL_COUNTRY.AUTO && geoIpLookup;
2879
3046
  if (isAutoCountry && !this.selectedCountryData.iso2) {
2880
3047
  this._loadAutoCountry();
2881
3048
  } else {
@@ -2928,7 +3095,7 @@ var Iti = class _Iti {
2928
3095
  countrySearch
2929
3096
  } = this.options;
2930
3097
  let userOverrideFormatting = false;
2931
- if (/\p{L}/u.test(this.ui.telInput.value)) {
3098
+ if (REGEX.ALPHA_UNICODE.test(this.ui.telInput.value)) {
2932
3099
  userOverrideFormatting = true;
2933
3100
  }
2934
3101
  const handleInputEvent = (e) => {
@@ -2946,11 +3113,11 @@ var Iti = class _Iti {
2946
3113
  if (this._updateCountryFromNumber(this.ui.telInput.value)) {
2947
3114
  this._triggerCountryChange();
2948
3115
  }
2949
- const isFormattingChar = e?.data && /[^+0-9]/.test(e.data);
2950
- const isPaste = e?.inputType === "insertFromPaste" && this.ui.telInput.value;
3116
+ const isFormattingChar = e?.data && REGEX.NON_PLUS_NUMERIC.test(e.data);
3117
+ const isPaste = e?.inputType === INPUT_TYPES.PASTE && this.ui.telInput.value;
2951
3118
  if (isFormattingChar || isPaste && !strictMode) {
2952
3119
  userOverrideFormatting = true;
2953
- } else if (!/[^+0-9]/.test(this.ui.telInput.value)) {
3120
+ } else if (!REGEX.NON_PLUS_NUMERIC.test(this.ui.telInput.value)) {
2954
3121
  userOverrideFormatting = false;
2955
3122
  }
2956
3123
  const isSetNumber = e?.detail && e.detail["isSetNumber"];
@@ -2961,10 +3128,10 @@ var Iti = class _Iti {
2961
3128
  currentCaretPos
2962
3129
  );
2963
3130
  const relevantCharsBeforeCaret = valueBeforeCaret.replace(
2964
- /[^+0-9]/g,
3131
+ REGEX.NON_PLUS_NUMERIC_GLOBAL,
2965
3132
  ""
2966
3133
  ).length;
2967
- const isDeleteForwards = e?.inputType === "deleteContentForward";
3134
+ const isDeleteForwards = e?.inputType === INPUT_TYPES.DELETE_FWD;
2968
3135
  const fullNumber = this._getFullNumber();
2969
3136
  const formattedValue = formatNumberAsYouType(
2970
3137
  fullNumber,
@@ -2983,9 +3150,13 @@ var Iti = class _Iti {
2983
3150
  this.ui.telInput.setSelectionRange(newCaretPos, newCaretPos);
2984
3151
  }
2985
3152
  };
2986
- this.ui.telInput.addEventListener("input", handleInputEvent, {
2987
- signal: this.abortController.signal
2988
- });
3153
+ this.ui.telInput.addEventListener(
3154
+ "input",
3155
+ handleInputEvent,
3156
+ {
3157
+ signal: this.abortController.signal
3158
+ }
3159
+ );
2989
3160
  }
2990
3161
  _maybeBindKeydownListener() {
2991
3162
  const { strictMode, separateDialCode, allowDropdown, countrySearch } = this.options;
@@ -3036,7 +3207,7 @@ var Iti = class _Iti {
3036
3207
  const pasted = e.clipboardData.getData("text");
3037
3208
  const initialCharSelected = selStart === 0 && selEnd > 0;
3038
3209
  const allowLeadingPlus = !input.value.startsWith("+") || initialCharSelected;
3039
- const allowedChars = pasted.replace(/[^0-9+]/g, "");
3210
+ const allowedChars = pasted.replace(REGEX.NON_PLUS_NUMERIC_GLOBAL, "");
3040
3211
  const hasLeadingPlus = allowedChars.startsWith("+");
3041
3212
  const numerics = allowedChars.replace(/\+/g, "");
3042
3213
  const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
@@ -3088,8 +3259,8 @@ var Iti = class _Iti {
3088
3259
  if (fixDropdownWidth) {
3089
3260
  this.ui.dropdownContent.style.width = `${this.ui.telInput.offsetWidth}px`;
3090
3261
  }
3091
- this.ui.dropdownContent.classList.remove("iti__hide");
3092
- this.ui.selectedCountry.setAttribute("aria-expanded", "true");
3262
+ this.ui.dropdownContent.classList.remove(CLASSES.HIDE);
3263
+ this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "true");
3093
3264
  this._setDropdownPosition();
3094
3265
  if (countrySearch) {
3095
3266
  const firstCountryItem = this.ui.countryList.firstElementChild;
@@ -3100,8 +3271,8 @@ var Iti = class _Iti {
3100
3271
  this.ui.searchInput.focus();
3101
3272
  }
3102
3273
  this._bindDropdownListeners();
3103
- this.ui.dropdownArrow.classList.add("iti__arrow--up");
3104
- this._trigger("open:countrydropdown");
3274
+ this.ui.dropdownArrow.classList.add(CLASSES.ARROW_UP);
3275
+ this._trigger(EVENTS.OPEN_COUNTRY_DROPDOWN);
3105
3276
  }
3106
3277
  //* Set the dropdown position
3107
3278
  _setDropdownPosition() {
@@ -3124,20 +3295,38 @@ var Iti = class _Iti {
3124
3295
  //* We only bind dropdown listeners when the dropdown is open.
3125
3296
  _bindDropdownListeners() {
3126
3297
  const signal = this.dropdownAbortController.signal;
3298
+ this._bindDropdownMouseoverListener(signal);
3299
+ this._bindDropdownCountryClickListener(signal);
3300
+ this._bindDropdownClickOffListener(signal);
3301
+ this._bindDropdownKeydownListener(signal);
3302
+ if (this.options.countrySearch) {
3303
+ this._bindDropdownSearchListeners(signal);
3304
+ }
3305
+ }
3306
+ //* When mouse over a list item, just highlight that one
3307
+ //* we add the class "highlight", so if they hit "enter" we know which one to select.
3308
+ _bindDropdownMouseoverListener(signal) {
3127
3309
  const handleMouseoverCountryList = (e) => {
3128
3310
  const listItem = e.target?.closest(
3129
- ".iti__country"
3311
+ `.${CLASSES.COUNTRY_ITEM}`
3130
3312
  );
3131
3313
  if (listItem) {
3132
3314
  this.ui.highlightListItem(listItem, false);
3133
3315
  }
3134
3316
  };
3135
- this.ui.countryList.addEventListener("mouseover", handleMouseoverCountryList, {
3136
- signal
3137
- });
3317
+ this.ui.countryList.addEventListener(
3318
+ "mouseover",
3319
+ handleMouseoverCountryList,
3320
+ {
3321
+ signal
3322
+ }
3323
+ );
3324
+ }
3325
+ //* Listen for country selection.
3326
+ _bindDropdownCountryClickListener(signal) {
3138
3327
  const handleClickCountryList = (e) => {
3139
3328
  const listItem = e.target?.closest(
3140
- ".iti__country"
3329
+ `.${CLASSES.COUNTRY_ITEM}`
3141
3330
  );
3142
3331
  if (listItem) {
3143
3332
  this._selectListItem(listItem);
@@ -3146,6 +3335,10 @@ var Iti = class _Iti {
3146
3335
  this.ui.countryList.addEventListener("click", handleClickCountryList, {
3147
3336
  signal
3148
3337
  });
3338
+ }
3339
+ //* Click off to close (except when this initial opening click is bubbling up).
3340
+ //* We cannot just stopPropagation as it may be needed to close another instance.
3341
+ _bindDropdownClickOffListener(signal) {
3149
3342
  const handleClickOffToClose = (e) => {
3150
3343
  const target = e.target;
3151
3344
  const clickedInsideDropdown = !!target.closest(
@@ -3162,21 +3355,33 @@ var Iti = class _Iti {
3162
3355
  { signal }
3163
3356
  );
3164
3357
  }, 0);
3358
+ }
3359
+ //* Listen for up/down scrolling, enter to select, or escape to close.
3360
+ //* Use keydown as keypress doesn't fire for non-char keys and we want to catch if they
3361
+ //* just hit down and hold it to scroll down (no keyup event).
3362
+ //* Listen on the document because that's where key events are triggered if no input has focus.
3363
+ _bindDropdownKeydownListener(signal) {
3165
3364
  let query = "";
3166
3365
  let queryTimer = null;
3167
3366
  const handleKeydownOnDropdown = (e) => {
3168
- if (["ArrowUp", "ArrowDown", "Enter", "Escape"].includes(e.key)) {
3367
+ const allowedKeys = [
3368
+ KEYS.ARROW_UP,
3369
+ KEYS.ARROW_DOWN,
3370
+ KEYS.ENTER,
3371
+ KEYS.ESC
3372
+ ];
3373
+ if (allowedKeys.includes(e.key)) {
3169
3374
  e.preventDefault();
3170
3375
  e.stopPropagation();
3171
- if (e.key === "ArrowUp" || e.key === "ArrowDown") {
3376
+ if (e.key === KEYS.ARROW_UP || e.key === KEYS.ARROW_DOWN) {
3172
3377
  this._handleUpDownKey(e.key);
3173
- } else if (e.key === "Enter") {
3378
+ } else if (e.key === KEYS.ENTER) {
3174
3379
  this._handleEnterKey();
3175
- } else if (e.key === "Escape") {
3380
+ } else if (e.key === KEYS.ESC) {
3176
3381
  this._closeDropdown();
3177
3382
  }
3178
3383
  }
3179
- if (!this.options.countrySearch && /^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
3384
+ if (!this.options.countrySearch && REGEX.HIDDEN_SEARCH_CHAR.test(e.key)) {
3180
3385
  e.stopPropagation();
3181
3386
  if (queryTimer) {
3182
3387
  clearTimeout(queryTimer);
@@ -3185,53 +3390,51 @@ var Iti = class _Iti {
3185
3390
  this._searchForCountry(query);
3186
3391
  queryTimer = setTimeout(() => {
3187
3392
  query = "";
3188
- }, 1e3);
3393
+ }, TIMINGS.HIDDEN_SEARCH_RESET_MS);
3189
3394
  }
3190
3395
  };
3191
3396
  document.addEventListener("keydown", handleKeydownOnDropdown, { signal });
3192
- if (this.options.countrySearch) {
3193
- const doFilter = () => {
3194
- const inputQuery = this.ui.searchInput.value.trim();
3195
- this._filterCountriesByQuery(inputQuery);
3196
- if (this.ui.searchInput.value) {
3197
- this.ui.searchClearButton.classList.remove("iti__hide");
3198
- } else {
3199
- this.ui.searchClearButton.classList.add("iti__hide");
3200
- }
3201
- };
3202
- let keyupTimer = null;
3203
- const handleSearchChange = () => {
3204
- if (keyupTimer) {
3205
- clearTimeout(keyupTimer);
3206
- }
3207
- keyupTimer = setTimeout(() => {
3208
- doFilter();
3209
- keyupTimer = null;
3210
- }, 100);
3211
- };
3212
- this.ui.searchInput.addEventListener("input", handleSearchChange, {
3213
- signal
3214
- });
3215
- const handleSearchClear = () => {
3216
- this.ui.searchInput.value = "";
3217
- this.ui.searchInput.focus();
3397
+ }
3398
+ //* Search input listeners when countrySearch enabled.
3399
+ _bindDropdownSearchListeners(signal) {
3400
+ const doFilter = () => {
3401
+ const inputQuery = this.ui.searchInput.value.trim();
3402
+ this._filterCountriesByQuery(inputQuery);
3403
+ if (this.ui.searchInput.value) {
3404
+ this.ui.searchClearButton.classList.remove(CLASSES.HIDE);
3405
+ } else {
3406
+ this.ui.searchClearButton.classList.add(CLASSES.HIDE);
3407
+ }
3408
+ };
3409
+ let keyupTimer = null;
3410
+ const handleSearchChange = () => {
3411
+ if (keyupTimer) {
3412
+ clearTimeout(keyupTimer);
3413
+ }
3414
+ keyupTimer = setTimeout(() => {
3218
3415
  doFilter();
3219
- };
3220
- this.ui.searchClearButton.addEventListener("click", handleSearchClear, {
3221
- signal
3222
- });
3223
- }
3416
+ keyupTimer = null;
3417
+ }, 100);
3418
+ };
3419
+ this.ui.searchInput.addEventListener("input", handleSearchChange, {
3420
+ signal
3421
+ });
3422
+ const handleSearchClear = () => {
3423
+ this.ui.searchInput.value = "";
3424
+ this.ui.searchInput.focus();
3425
+ doFilter();
3426
+ };
3427
+ this.ui.searchClearButton.addEventListener("click", handleSearchClear, {
3428
+ signal
3429
+ });
3224
3430
  }
3225
3431
  //* Hidden search (countrySearch disabled): Find the first list item whose name starts with the query string.
3226
3432
  _searchForCountry(query) {
3227
- for (const c of this.countries) {
3228
- const startsWith = c.name.substring(0, query.length).toLowerCase() === query;
3229
- if (startsWith) {
3230
- const listItem = c.nodeById[this.id];
3231
- this.ui.highlightListItem(listItem, false);
3232
- this.ui.scrollTo(listItem);
3233
- break;
3234
- }
3433
+ const match = findFirstCountryStartingWith(this.countries, query);
3434
+ if (match) {
3435
+ const listItem = match.nodeById[this.id];
3436
+ this.ui.highlightListItem(listItem, false);
3437
+ this.ui.scrollTo(listItem);
3235
3438
  }
3236
3439
  }
3237
3440
  //* Country search: Filter the countries according to the search query.
@@ -3240,47 +3443,15 @@ var Iti = class _Iti {
3240
3443
  if (query === "") {
3241
3444
  matchedCountries = this.countries;
3242
3445
  } else {
3243
- matchedCountries = this._getMatchedCountries(query);
3446
+ matchedCountries = getMatchedCountries(this.countries, query);
3244
3447
  }
3245
3448
  this.ui.filterCountries(matchedCountries);
3246
3449
  }
3247
- _getMatchedCountries(query) {
3248
- const normalisedQuery = normaliseString(query);
3249
- const iso2Matches = [];
3250
- const nameStartWith = [];
3251
- const nameContains = [];
3252
- const dialCodeMatches = [];
3253
- const dialCodeContains = [];
3254
- const initialsMatches = [];
3255
- for (const c of this.countries) {
3256
- if (c.iso2 === normalisedQuery) {
3257
- iso2Matches.push(c);
3258
- } else if (c.normalisedName.startsWith(normalisedQuery)) {
3259
- nameStartWith.push(c);
3260
- } else if (c.normalisedName.includes(normalisedQuery)) {
3261
- nameContains.push(c);
3262
- } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
3263
- dialCodeMatches.push(c);
3264
- } else if (c.dialCodePlus.includes(normalisedQuery)) {
3265
- dialCodeContains.push(c);
3266
- } else if (c.initials.includes(normalisedQuery)) {
3267
- initialsMatches.push(c);
3268
- }
3269
- }
3270
- return [
3271
- ...iso2Matches.sort((a, b) => a.priority - b.priority),
3272
- ...nameStartWith.sort((a, b) => a.priority - b.priority),
3273
- ...nameContains.sort((a, b) => a.priority - b.priority),
3274
- ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
3275
- ...dialCodeContains.sort((a, b) => a.priority - b.priority),
3276
- ...initialsMatches.sort((a, b) => a.priority - b.priority)
3277
- ];
3278
- }
3279
3450
  //* Highlight the next/prev item in the list (and ensure it is visible).
3280
3451
  _handleUpDownKey(key) {
3281
- let next = key === "ArrowUp" ? this.ui.highlightedItem?.previousElementSibling : this.ui.highlightedItem?.nextElementSibling;
3452
+ let next = key === KEYS.ARROW_UP ? this.ui.highlightedItem?.previousElementSibling : this.ui.highlightedItem?.nextElementSibling;
3282
3453
  if (!next && this.ui.countryList.childElementCount > 1) {
3283
- next = key === "ArrowUp" ? this.ui.countryList.lastElementChild : this.ui.countryList.firstElementChild;
3454
+ next = key === KEYS.ARROW_UP ? this.ui.countryList.lastElementChild : this.ui.countryList.firstElementChild;
3284
3455
  }
3285
3456
  if (next) {
3286
3457
  this.ui.scrollTo(next);
@@ -3353,7 +3524,7 @@ var Iti = class _Iti {
3353
3524
  if (!selectedIso2 && this.defaultCountry && iso2Codes.includes(this.defaultCountry)) {
3354
3525
  return this.defaultCountry;
3355
3526
  }
3356
- const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
3527
+ const isRegionlessNanpNumber = selectedDialCode === DIAL.NANP && isRegionlessNanp(numeric);
3357
3528
  if (isRegionlessNanpNumber) {
3358
3529
  return null;
3359
3530
  }
@@ -3392,7 +3563,7 @@ var Iti = class _Iti {
3392
3563
  this.defaultCountry = this.selectedCountryData.iso2;
3393
3564
  }
3394
3565
  if (this.ui.selectedCountry) {
3395
- const flagClass = iso2 && showFlags ? `iti__flag iti__${iso2}` : "iti__flag iti__globe";
3566
+ const flagClass = iso2 && showFlags ? `${CLASSES.FLAG} iti__${iso2}` : `${CLASSES.FLAG} ${CLASSES.GLOBE}`;
3396
3567
  let ariaLabel, title;
3397
3568
  if (iso2) {
3398
3569
  const { name, dialCode } = this.selectedCountryData;
@@ -3404,7 +3575,7 @@ var Iti = class _Iti {
3404
3575
  }
3405
3576
  this.ui.selectedCountryInner.className = flagClass;
3406
3577
  this.ui.selectedCountry.setAttribute("title", title);
3407
- this.ui.selectedCountry.setAttribute("aria-label", ariaLabel);
3578
+ this.ui.selectedCountry.setAttribute(ARIA.LABEL, ariaLabel);
3408
3579
  }
3409
3580
  if (separateDialCode) {
3410
3581
  const dialCode = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
@@ -3472,10 +3643,10 @@ var Iti = class _Iti {
3472
3643
  }
3473
3644
  //* Called when the user selects a list item from the dropdown.
3474
3645
  _selectListItem(listItem) {
3475
- const iso2 = listItem.dataset.countryCode;
3646
+ const iso2 = listItem.dataset[DATA_KEYS.COUNTRY_CODE];
3476
3647
  const countryChanged = this._setCountry(iso2);
3477
3648
  this._closeDropdown();
3478
- const dialCode = listItem.dataset.dialCode;
3649
+ const dialCode = listItem.dataset[DATA_KEYS.DIAL_CODE];
3479
3650
  this._updateDialCode(dialCode);
3480
3651
  if (this.options.formatOnDisplay) {
3481
3652
  this._updateValFromNumber(this.ui.telInput.value);
@@ -3487,24 +3658,24 @@ var Iti = class _Iti {
3487
3658
  }
3488
3659
  //* Close the dropdown and unbind any listeners.
3489
3660
  _closeDropdown() {
3490
- if (this.ui.dropdownContent.classList.contains("iti__hide")) {
3661
+ if (this.ui.dropdownContent.classList.contains(CLASSES.HIDE)) {
3491
3662
  return;
3492
3663
  }
3493
- this.ui.dropdownContent.classList.add("iti__hide");
3494
- this.ui.selectedCountry.setAttribute("aria-expanded", "false");
3664
+ this.ui.dropdownContent.classList.add(CLASSES.HIDE);
3665
+ this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "false");
3495
3666
  if (this.ui.highlightedItem) {
3496
- this.ui.highlightedItem.setAttribute("aria-selected", "false");
3667
+ this.ui.highlightedItem.setAttribute(ARIA.SELECTED, "false");
3497
3668
  }
3498
3669
  if (this.options.countrySearch) {
3499
- this.ui.searchInput.removeAttribute("aria-activedescendant");
3670
+ this.ui.searchInput.removeAttribute(ARIA.ACTIVE_DESCENDANT);
3500
3671
  }
3501
- this.ui.dropdownArrow.classList.remove("iti__arrow--up");
3672
+ this.ui.dropdownArrow.classList.remove(CLASSES.ARROW_UP);
3502
3673
  this.dropdownAbortController.abort();
3503
3674
  this.dropdownAbortController = null;
3504
3675
  if (this.options.dropdownContainer) {
3505
3676
  this.ui.dropdown.remove();
3506
3677
  }
3507
- this._trigger("close:countrydropdown");
3678
+ this._trigger(EVENTS.CLOSE_COUNTRY_DROPDOWN);
3508
3679
  }
3509
3680
  //* Replace any existing dial code with the new one
3510
3681
  //* Note: called from _selectListItem and setCountry
@@ -3576,16 +3747,16 @@ var Iti = class _Iti {
3576
3747
  }
3577
3748
  //* Trigger the 'countrychange' event.
3578
3749
  _triggerCountryChange() {
3579
- this._trigger("countrychange");
3750
+ this._trigger(EVENTS.COUNTRY_CHANGE);
3580
3751
  }
3581
3752
  //**************************
3582
3753
  //* SECRET PUBLIC METHODS
3583
3754
  //**************************
3584
3755
  //* This is called when the geoip call returns.
3585
3756
  handleAutoCountry() {
3586
- if (this.options.initialCountry === "auto" && intlTelInput.autoCountry) {
3757
+ if (this.options.initialCountry === INITIAL_COUNTRY.AUTO && intlTelInput.autoCountry) {
3587
3758
  this.defaultCountry = intlTelInput.autoCountry;
3588
- const hasSelectedCountryOrGlobe = this.selectedCountryData.iso2 || this.ui.selectedCountryInner.classList.contains("iti__globe");
3759
+ const hasSelectedCountryOrGlobe = this.selectedCountryData.iso2 || this.ui.selectedCountryInner.classList.contains(CLASSES.GLOBE);
3589
3760
  if (!hasSelectedCountryOrGlobe) {
3590
3761
  this.setCountry(this.defaultCountry);
3591
3762
  }
@@ -3655,7 +3826,7 @@ var Iti = class _Iti {
3655
3826
  this.selectedCountryData.iso2
3656
3827
  );
3657
3828
  }
3658
- return -99;
3829
+ return SENTINELS.UNKNOWN_NUMBER_TYPE;
3659
3830
  }
3660
3831
  //* Get the country data for the currently selected country.
3661
3832
  getSelectedCountryData() {
@@ -3667,15 +3838,15 @@ var Iti = class _Iti {
3667
3838
  const { iso2 } = this.selectedCountryData;
3668
3839
  return intlTelInput.utils.getValidationError(this._getFullNumber(), iso2);
3669
3840
  }
3670
- return -99;
3841
+ return SENTINELS.UNKNOWN_VALIDATION_ERROR;
3671
3842
  }
3672
3843
  //* Validate the input val using number length only
3673
3844
  isValidNumber() {
3674
3845
  const { dialCode, iso2 } = this.selectedCountryData;
3675
- if (dialCode === "44" && intlTelInput.utils) {
3846
+ if (dialCode === UK.DIAL_CODE && intlTelInput.utils) {
3676
3847
  const number = this._getFullNumber();
3677
3848
  const coreNumber = intlTelInput.utils.getCoreNumber(number, iso2);
3678
- if (coreNumber[0] === "7" && coreNumber.length !== 10) {
3849
+ if (coreNumber[0] === UK.MOBILE_PREFIX && coreNumber.length !== UK.MOBILE_CORE_LENGTH) {
3679
3850
  return false;
3680
3851
  }
3681
3852
  }
@@ -3702,7 +3873,7 @@ var Iti = class _Iti {
3702
3873
  }
3703
3874
  const testValidity = (s) => precise ? this._utilsIsValidNumber(s) : this._utilsIsPossibleNumber(s);
3704
3875
  const val = this._getFullNumber();
3705
- const alphaCharPosition = val.search(/\p{L}/u);
3876
+ const alphaCharPosition = val.search(REGEX.ALPHA_UNICODE);
3706
3877
  const hasAlphaChar = alphaCharPosition > -1;
3707
3878
  if (hasAlphaChar && !this.options.allowPhonewords) {
3708
3879
  const beforeAlphaChar = val.substring(0, alphaCharPosition);
@@ -3743,7 +3914,7 @@ var Iti = class _Iti {
3743
3914
  if (countryChanged) {
3744
3915
  this._triggerCountryChange();
3745
3916
  }
3746
- this._trigger("input", { isSetNumber: true });
3917
+ this._trigger(EVENTS.INPUT, { isSetNumber: true });
3747
3918
  }
3748
3919
  //* Set the placeholder number typ
3749
3920
  setPlaceholderNumberType(type) {
@@ -3824,7 +3995,7 @@ var intlTelInput = Object.assign(
3824
3995
  attachUtils,
3825
3996
  startedLoadingUtilsScript: false,
3826
3997
  startedLoadingAutoCountry: false,
3827
- version: "25.11.0"
3998
+ version: "25.11.2"
3828
3999
  }
3829
4000
  );
3830
4001
  var intl_tel_input_default = intlTelInput;