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
@@ -1,5 +1,5 @@
1
1
  /*
2
- * International Telephone Input v25.11.0
2
+ * International Telephone Input v25.11.2
3
3
  * https://github.com/jackocnr/intl-tel-input.git
4
4
  * Licensed under the MIT license
5
5
  */
@@ -1728,7 +1728,13 @@ var factoryOutput = (() => {
1728
1728
  areaCodes: c[3] || null,
1729
1729
  nodeById: {},
1730
1730
  // populated by the plugin
1731
- nationalPrefix: c[4] || null
1731
+ nationalPrefix: c[4] || null,
1732
+ normalisedName: "",
1733
+ // populated in the plugin
1734
+ initials: "",
1735
+ // populated in the plugin
1736
+ dialCodePlus: ""
1737
+ // populated in the plugin
1732
1738
  });
1733
1739
  }
1734
1740
  var data_default = allCountries;
@@ -2000,13 +2006,111 @@ var factoryOutput = (() => {
2000
2006
  var allTranslations = { ...countries_default, ...interface_default };
2001
2007
  var en_default = allTranslations;
2002
2008
 
2003
- // src/js/modules/core/options.ts
2004
- var mq = (q) => {
2005
- return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(q).matches;
2009
+ // src/js/modules/constants.ts
2010
+ var EVENTS = {
2011
+ OPEN_COUNTRY_DROPDOWN: "open:countrydropdown",
2012
+ CLOSE_COUNTRY_DROPDOWN: "close:countrydropdown",
2013
+ COUNTRY_CHANGE: "countrychange",
2014
+ INPUT: "input"
2015
+ // used for synthetic input trigger
2016
+ };
2017
+ var CLASSES = {
2018
+ HIDE: "iti__hide",
2019
+ V_HIDE: "iti__v-hide",
2020
+ ARROW_UP: "iti__arrow--up",
2021
+ GLOBE: "iti__globe",
2022
+ FLAG: "iti__flag",
2023
+ COUNTRY_ITEM: "iti__country",
2024
+ HIGHLIGHT: "iti__highlight"
2025
+ };
2026
+ var KEYS = {
2027
+ ARROW_UP: "ArrowUp",
2028
+ ARROW_DOWN: "ArrowDown",
2029
+ SPACE: " ",
2030
+ ENTER: "Enter",
2031
+ ESC: "Escape",
2032
+ TAB: "Tab"
2033
+ };
2034
+ var INPUT_TYPES = {
2035
+ PASTE: "insertFromPaste",
2036
+ DELETE_FWD: "deleteContentForward"
2037
+ };
2038
+ var REGEX = {
2039
+ ALPHA_UNICODE: /\p{L}/u,
2040
+ // any kind of letter from any language
2041
+ NON_PLUS_NUMERIC: /[^+0-9]/,
2042
+ // chars that are NOT + or digit
2043
+ NON_PLUS_NUMERIC_GLOBAL: /[^+0-9]/g,
2044
+ // chars that are NOT + or digit (global)
2045
+ HIDDEN_SEARCH_CHAR: /^[a-zA-ZÀ-ÿа-яА-Я ]$/
2046
+ // single acceptable hidden-search char
2047
+ };
2048
+ var TIMINGS = {
2049
+ SEARCH_DEBOUNCE_MS: 100,
2050
+ HIDDEN_SEARCH_RESET_MS: 1e3,
2051
+ NEXT_TICK: 0
2052
+ };
2053
+ var SENTINELS = {
2054
+ UNKNOWN_NUMBER_TYPE: -99,
2055
+ UNKNOWN_VALIDATION_ERROR: -99
2056
+ };
2057
+ var LAYOUT = {
2058
+ SANE_SELECTED_WITH_DIAL_WIDTH: 78,
2059
+ // px width fallback when separateDialCode enabled
2060
+ SANE_SELECTED_NO_DIAL_WIDTH: 42,
2061
+ // px width fallback when no separate dial code
2062
+ INPUT_PADDING_EXTRA_LEFT: 6
2063
+ // px gap between selected country container and input text
2064
+ };
2065
+ var DIAL = {
2066
+ PLUS: "+",
2067
+ NANP: "1"
2068
+ // North American Numbering Plan
2069
+ };
2070
+ var UK = {
2071
+ ISO2: "gb",
2072
+ DIAL_CODE: "44",
2073
+ // +44 United Kingdom
2074
+ MOBILE_PREFIX: "7",
2075
+ // UK mobile numbers start with 7 after national trunk (0) or core section
2076
+ MOBILE_CORE_LENGTH: 10
2077
+ // core number length (excluding dial code / national prefix) for mobiles
2078
+ };
2079
+ var US = {
2080
+ ISO2: "us",
2081
+ DIAL_CODE: "1"
2082
+ // +1 United States
2083
+ };
2084
+ var PLACEHOLDER_MODES = {
2085
+ AGGRESSIVE: "aggressive",
2086
+ POLITE: "polite"
2006
2087
  };
2088
+ var INITIAL_COUNTRY = {
2089
+ AUTO: "auto"
2090
+ };
2091
+ var DATA_KEYS = {
2092
+ COUNTRY_CODE: "countryCode",
2093
+ DIAL_CODE: "dialCode"
2094
+ };
2095
+ var ARIA = {
2096
+ EXPANDED: "aria-expanded",
2097
+ LABEL: "aria-label",
2098
+ SELECTED: "aria-selected",
2099
+ ACTIVE_DESCENDANT: "aria-activedescendant",
2100
+ HASPOPUP: "aria-haspopup",
2101
+ CONTROLS: "aria-controls",
2102
+ HIDDEN: "aria-hidden",
2103
+ AUTOCOMPLETE: "aria-autocomplete",
2104
+ MODAL: "aria-modal"
2105
+ };
2106
+
2107
+ // src/js/modules/core/options.ts
2108
+ var mq = (q) => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(q).matches;
2007
2109
  var computeDefaultUseFullscreenPopup = () => {
2008
2110
  if (typeof navigator !== "undefined" && typeof window !== "undefined") {
2009
- const isMobileUserAgent = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
2111
+ const isMobileUserAgent = /Android.+Mobile|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
2112
+ navigator.userAgent
2113
+ );
2010
2114
  const isNarrowViewport = mq("(max-width: 500px)");
2011
2115
  const isShortViewport = mq("(max-height: 600px)");
2012
2116
  const isCoarsePointer = mq("(pointer: coarse)");
@@ -2020,7 +2124,7 @@ var factoryOutput = (() => {
2020
2124
  //* Whether or not to allow the dropdown.
2021
2125
  allowDropdown: true,
2022
2126
  //* Add a placeholder in the input with an example number for the selected country.
2023
- autoPlaceholder: "polite",
2127
+ autoPlaceholder: PLACEHOLDER_MODES.POLITE,
2024
2128
  //* Modify the parentClass.
2025
2129
  containerClass: "",
2026
2130
  //* The order of the countries in the dropdown. Defaults to alphabetical.
@@ -2066,7 +2170,7 @@ var factoryOutput = (() => {
2066
2170
  //* The number type to enforce during validation.
2067
2171
  validationNumberTypes: ["MOBILE"]
2068
2172
  };
2069
- function applyOptionSideEffects(o) {
2173
+ var applyOptionSideEffects = (o, defaultEnglishStrings) => {
2070
2174
  if (o.useFullscreenPopup) {
2071
2175
  o.fixDropdownWidth = false;
2072
2176
  }
@@ -2082,19 +2186,66 @@ var factoryOutput = (() => {
2082
2186
  if (o.useFullscreenPopup && !o.dropdownContainer) {
2083
2187
  o.dropdownContainer = document.body;
2084
2188
  }
2085
- o.i18n = { ...en_default, ...o.i18n };
2086
- }
2189
+ o.i18n = { ...defaultEnglishStrings, ...o.i18n };
2190
+ };
2087
2191
 
2088
2192
  // src/js/modules/utils/string.ts
2089
2193
  var getNumeric = (s) => s.replace(/\D/g, "");
2090
2194
  var normaliseString = (s = "") => s.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
2091
2195
 
2196
+ // src/js/modules/core/countrySearch.ts
2197
+ var getMatchedCountries = (countries, query) => {
2198
+ const normalisedQuery = normaliseString(query);
2199
+ const iso2Matches = [];
2200
+ const nameStartWith = [];
2201
+ const nameContains = [];
2202
+ const dialCodeMatches = [];
2203
+ const dialCodeContains = [];
2204
+ const initialsMatches = [];
2205
+ for (const c of countries) {
2206
+ if (c.iso2 === normalisedQuery) {
2207
+ iso2Matches.push(c);
2208
+ } else if (c.normalisedName.startsWith(normalisedQuery)) {
2209
+ nameStartWith.push(c);
2210
+ } else if (c.normalisedName.includes(normalisedQuery)) {
2211
+ nameContains.push(c);
2212
+ } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
2213
+ dialCodeMatches.push(c);
2214
+ } else if (c.dialCodePlus.includes(normalisedQuery)) {
2215
+ dialCodeContains.push(c);
2216
+ } else if (c.initials.includes(normalisedQuery)) {
2217
+ initialsMatches.push(c);
2218
+ }
2219
+ }
2220
+ const sortByPriority = (a, b) => a.priority - b.priority;
2221
+ return [
2222
+ ...iso2Matches.sort(sortByPriority),
2223
+ ...nameStartWith.sort(sortByPriority),
2224
+ ...nameContains.sort(sortByPriority),
2225
+ ...dialCodeMatches.sort(sortByPriority),
2226
+ ...dialCodeContains.sort(sortByPriority),
2227
+ ...initialsMatches.sort(sortByPriority)
2228
+ ];
2229
+ };
2230
+ var findFirstCountryStartingWith = (countries, query) => {
2231
+ const lowerQuery = query.toLowerCase();
2232
+ for (const c of countries) {
2233
+ const lowerName = c.name.toLowerCase();
2234
+ if (lowerName.startsWith(lowerQuery)) {
2235
+ return c;
2236
+ }
2237
+ }
2238
+ return null;
2239
+ };
2240
+
2092
2241
  // src/js/modules/utils/dom.ts
2093
2242
  var buildClassNames = (flags) => Object.keys(flags).filter((k) => Boolean(flags[k])).join(" ");
2094
2243
  var createEl = (tagName, attrs, container) => {
2095
2244
  const el = document.createElement(tagName);
2096
2245
  if (attrs) {
2097
- Object.entries(attrs).forEach(([key, value]) => el.setAttribute(key, value));
2246
+ Object.entries(attrs).forEach(
2247
+ ([key, value]) => el.setAttribute(key, value)
2248
+ );
2098
2249
  }
2099
2250
  if (container) {
2100
2251
  container.appendChild(el);
@@ -2102,6 +2253,24 @@ var factoryOutput = (() => {
2102
2253
  return el;
2103
2254
  };
2104
2255
 
2256
+ // src/js/modules/core/icons.ts
2257
+ var buildSearchIcon = () => `
2258
+ <svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" ${ARIA.HIDDEN}="true">
2259
+ <circle cx="11" cy="11" r="7" />
2260
+ <line x1="21" y1="21" x2="16.65" y2="16.65" />
2261
+ </svg>`;
2262
+ var buildClearIcon = (id2) => {
2263
+ const maskId = `iti-${id2}-clear-mask`;
2264
+ return `
2265
+ <svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" ${ARIA.HIDDEN}="true" focusable="false">
2266
+ <mask id="${maskId}" maskUnits="userSpaceOnUse">
2267
+ <rect width="16" height="16" fill="white" />
2268
+ <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" />
2269
+ </mask>
2270
+ <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
2271
+ </svg>`;
2272
+ };
2273
+
2105
2274
  // src/js/modules/core/ui.ts
2106
2275
  var UI = class {
2107
2276
  constructor(input, options, id2) {
@@ -2133,12 +2302,7 @@ var factoryOutput = (() => {
2133
2302
  }
2134
2303
  }
2135
2304
  _createWrapperAndInsert() {
2136
- const {
2137
- allowDropdown,
2138
- showFlags,
2139
- containerClass,
2140
- useFullscreenPopup
2141
- } = this.options;
2305
+ const { allowDropdown, showFlags, containerClass, useFullscreenPopup } = this.options;
2142
2306
  const parentClasses = buildClassNames({
2143
2307
  iti: true,
2144
2308
  "iti--allow-dropdown": allowDropdown,
@@ -2159,7 +2323,7 @@ var factoryOutput = (() => {
2159
2323
  this.countryContainer = createEl(
2160
2324
  "div",
2161
2325
  // visibly hidden until we measure it's width to set the input padding correctly
2162
- { class: "iti__country-container iti__v-hide" },
2326
+ { class: `iti__country-container ${CLASSES.V_HIDE}` },
2163
2327
  wrapper
2164
2328
  );
2165
2329
  if (allowDropdown) {
@@ -2168,10 +2332,10 @@ var factoryOutput = (() => {
2168
2332
  {
2169
2333
  type: "button",
2170
2334
  class: "iti__selected-country",
2171
- "aria-expanded": "false",
2172
- "aria-label": this.options.i18n.noCountrySelected,
2173
- "aria-haspopup": "dialog",
2174
- "aria-controls": `iti-${this.id}__dropdown-content`
2335
+ [ARIA.EXPANDED]: "false",
2336
+ [ARIA.LABEL]: this.options.i18n.noCountrySelected,
2337
+ [ARIA.HASPOPUP]: "dialog",
2338
+ [ARIA.CONTROLS]: `iti-${this.id}__dropdown-content`
2175
2339
  },
2176
2340
  this.countryContainer
2177
2341
  );
@@ -2192,13 +2356,13 @@ var factoryOutput = (() => {
2192
2356
  );
2193
2357
  this.selectedCountryInner = createEl(
2194
2358
  "div",
2195
- { class: "iti__flag" },
2359
+ { class: CLASSES.FLAG },
2196
2360
  selectedCountryPrimary
2197
2361
  );
2198
2362
  if (allowDropdown) {
2199
2363
  this.dropdownArrow = createEl(
2200
2364
  "div",
2201
- { class: "iti__arrow", "aria-hidden": "true" },
2365
+ { class: "iti__arrow", [ARIA.HIDDEN]: "true" },
2202
2366
  selectedCountryPrimary
2203
2367
  );
2204
2368
  }
@@ -2226,9 +2390,9 @@ var factoryOutput = (() => {
2226
2390
  const extraClasses = fixDropdownWidth ? "" : "iti--flexible-dropdown-width";
2227
2391
  this.dropdownContent = createEl("div", {
2228
2392
  id: `iti-${this.id}__dropdown-content`,
2229
- class: `iti__dropdown-content iti__hide ${extraClasses}`,
2393
+ class: `iti__dropdown-content ${CLASSES.HIDE} ${extraClasses}`,
2230
2394
  role: "dialog",
2231
- "aria-modal": "true"
2395
+ [ARIA.MODAL]: "true"
2232
2396
  });
2233
2397
  if (this.isRTL) {
2234
2398
  this.dropdownContent.setAttribute("dir", "rtl");
@@ -2242,12 +2406,12 @@ var factoryOutput = (() => {
2242
2406
  class: "iti__country-list",
2243
2407
  id: `iti-${this.id}__country-listbox`,
2244
2408
  role: "listbox",
2245
- "aria-label": i18n.countryListAriaLabel
2409
+ [ARIA.LABEL]: i18n.countryListAriaLabel
2246
2410
  },
2247
2411
  this.dropdownContent
2248
2412
  );
2249
2413
  this._appendListItems();
2250
- if (this.options.countrySearch) {
2414
+ if (countrySearch) {
2251
2415
  this.updateSearchResultsA11yText();
2252
2416
  }
2253
2417
  if (dropdownContainer) {
@@ -2275,15 +2439,11 @@ var factoryOutput = (() => {
2275
2439
  "span",
2276
2440
  {
2277
2441
  class: "iti__search-icon",
2278
- "aria-hidden": "true"
2442
+ [ARIA.HIDDEN]: "true"
2279
2443
  },
2280
2444
  searchWrapper
2281
2445
  );
2282
- this.searchIcon.innerHTML = `
2283
- <svg class="iti__search-icon-svg" width="14" height="14" viewBox="0 0 24 24" focusable="false" aria-hidden="true">
2284
- <circle cx="11" cy="11" r="7" />
2285
- <line x1="21" y1="21" x2="16.65" y2="16.65" />
2286
- </svg>`;
2446
+ this.searchIcon.innerHTML = buildSearchIcon();
2287
2447
  this.searchInput = createEl(
2288
2448
  "input",
2289
2449
  {
@@ -2294,10 +2454,10 @@ var factoryOutput = (() => {
2294
2454
  placeholder: i18n.searchPlaceholder,
2295
2455
  // 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
2296
2456
  role: "combobox",
2297
- "aria-expanded": "true",
2298
- "aria-label": i18n.searchPlaceholder,
2299
- "aria-controls": `iti-${this.id}__country-listbox`,
2300
- "aria-autocomplete": "list",
2457
+ [ARIA.EXPANDED]: "true",
2458
+ [ARIA.LABEL]: i18n.searchPlaceholder,
2459
+ [ARIA.CONTROLS]: `iti-${this.id}__country-listbox`,
2460
+ [ARIA.AUTOCOMPLETE]: "list",
2301
2461
  autocomplete: "off"
2302
2462
  },
2303
2463
  searchWrapper
@@ -2306,21 +2466,13 @@ var factoryOutput = (() => {
2306
2466
  "button",
2307
2467
  {
2308
2468
  type: "button",
2309
- class: "iti__search-clear iti__hide",
2310
- "aria-label": i18n.clearSearchAriaLabel,
2469
+ class: `iti__search-clear ${CLASSES.HIDE}`,
2470
+ [ARIA.LABEL]: i18n.clearSearchAriaLabel,
2311
2471
  tabindex: "-1"
2312
2472
  },
2313
2473
  searchWrapper
2314
2474
  );
2315
- const maskId = `iti-${this.id}-clear-mask`;
2316
- this.searchClearButton.innerHTML = `
2317
- <svg class="iti__search-clear-svg" width="12" height="12" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
2318
- <mask id="${maskId}" maskUnits="userSpaceOnUse">
2319
- <rect width="16" height="16" fill="white" />
2320
- <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" />
2321
- </mask>
2322
- <circle cx="8" cy="8" r="8" class="iti__search-clear-bg" mask="url(#${maskId})" />
2323
- </svg>`;
2475
+ this.searchClearButton.innerHTML = buildClearIcon(this.id);
2324
2476
  this.searchResultsA11yText = createEl(
2325
2477
  "span",
2326
2478
  { class: "iti__a11y-text" },
@@ -2329,8 +2481,8 @@ var factoryOutput = (() => {
2329
2481
  this.searchNoResults = createEl(
2330
2482
  "div",
2331
2483
  {
2332
- class: "iti__no-results iti__hide",
2333
- "aria-hidden": "true"
2484
+ class: `iti__no-results ${CLASSES.HIDE}`,
2485
+ [ARIA.HIDDEN]: "true"
2334
2486
  // all a11y messaging happens in this.searchResultsA11yText
2335
2487
  },
2336
2488
  this.dropdownContent
@@ -2340,7 +2492,7 @@ var factoryOutput = (() => {
2340
2492
  _maybeUpdateInputPaddingAndReveal() {
2341
2493
  if (this.countryContainer) {
2342
2494
  this.updateInputPadding();
2343
- this.countryContainer.classList.remove("iti__v-hide");
2495
+ this.countryContainer.classList.remove(CLASSES.V_HIDE);
2344
2496
  }
2345
2497
  }
2346
2498
  _maybeBuildHiddenInputs(wrapper) {
@@ -2384,21 +2536,21 @@ var factoryOutput = (() => {
2384
2536
  for (let i = 0; i < this.countries.length; i++) {
2385
2537
  const c = this.countries[i];
2386
2538
  const liClass = buildClassNames({
2387
- iti__country: true,
2388
- iti__highlight: i === 0
2539
+ [CLASSES.COUNTRY_ITEM]: true,
2540
+ [CLASSES.HIGHLIGHT]: i === 0
2389
2541
  });
2390
2542
  const listItem = createEl("li", {
2391
2543
  id: `iti-${this.id}__item-${c.iso2}`,
2392
2544
  class: liClass,
2393
2545
  tabindex: "-1",
2394
2546
  role: "option",
2395
- "aria-selected": "false"
2547
+ [ARIA.SELECTED]: "false"
2396
2548
  });
2397
2549
  listItem.dataset.dialCode = c.dialCode;
2398
2550
  listItem.dataset.countryCode = c.iso2;
2399
2551
  c.nodeById[this.id] = listItem;
2400
2552
  if (this.options.showFlags) {
2401
- createEl("div", { class: `iti__flag iti__${c.iso2}` }, listItem);
2553
+ createEl("div", { class: `${CLASSES.FLAG} iti__${c.iso2}` }, listItem);
2402
2554
  }
2403
2555
  const nameEl = createEl("span", { class: "iti__country-name" }, listItem);
2404
2556
  nameEl.textContent = c.name;
@@ -2414,9 +2566,9 @@ var factoryOutput = (() => {
2414
2566
  //* Update the input padding to make space for the selected country/dial code.
2415
2567
  updateInputPadding() {
2416
2568
  if (this.selectedCountry) {
2417
- const saneDefaultWidth = this.options.separateDialCode ? 78 : 42;
2418
- const selectedCountryWidth = this.selectedCountry.offsetWidth || this._getHiddenSelectedCountryWidth() || saneDefaultWidth;
2419
- const inputPadding = selectedCountryWidth + 6;
2569
+ const fallbackWidth = this.options.separateDialCode ? LAYOUT.SANE_SELECTED_WITH_DIAL_WIDTH : LAYOUT.SANE_SELECTED_NO_DIAL_WIDTH;
2570
+ const selectedCountryWidth = this.selectedCountry.offsetWidth || this._getHiddenSelectedCountryWidth() || fallbackWidth;
2571
+ const inputPadding = selectedCountryWidth + LAYOUT.INPUT_PADDING_EXTRA_LEFT;
2420
2572
  this.telInput.style.paddingLeft = `${inputPadding}px`;
2421
2573
  }
2422
2574
  }
@@ -2492,19 +2644,16 @@ var factoryOutput = (() => {
2492
2644
  highlightListItem(listItem, shouldFocus) {
2493
2645
  const prevItem = this.highlightedItem;
2494
2646
  if (prevItem) {
2495
- prevItem.classList.remove("iti__highlight");
2496
- prevItem.setAttribute("aria-selected", "false");
2647
+ prevItem.classList.remove(CLASSES.HIGHLIGHT);
2648
+ prevItem.setAttribute(ARIA.SELECTED, "false");
2497
2649
  }
2498
2650
  this.highlightedItem = listItem;
2499
2651
  if (this.highlightedItem) {
2500
- this.highlightedItem.classList.add("iti__highlight");
2501
- this.highlightedItem.setAttribute("aria-selected", "true");
2652
+ this.highlightedItem.classList.add(CLASSES.HIGHLIGHT);
2653
+ this.highlightedItem.setAttribute(ARIA.SELECTED, "true");
2502
2654
  if (this.options.countrySearch) {
2503
2655
  const activeDescendant = this.highlightedItem.getAttribute("id") || "";
2504
- this.searchInput.setAttribute(
2505
- "aria-activedescendant",
2506
- activeDescendant
2507
- );
2656
+ this.searchInput.setAttribute(ARIA.ACTIVE_DESCENDANT, activeDescendant);
2508
2657
  }
2509
2658
  }
2510
2659
  if (shouldFocus) {
@@ -2528,10 +2677,10 @@ var factoryOutput = (() => {
2528
2677
  if (noCountriesAddedYet) {
2529
2678
  this.highlightListItem(null, false);
2530
2679
  if (this.searchNoResults) {
2531
- this.searchNoResults.classList.remove("iti__hide");
2680
+ this.searchNoResults.classList.remove(CLASSES.HIDE);
2532
2681
  }
2533
2682
  } else if (this.searchNoResults) {
2534
- this.searchNoResults.classList.add("iti__hide");
2683
+ this.searchNoResults.classList.add(CLASSES.HIDE);
2535
2684
  }
2536
2685
  this.countryList.scrollTop = 0;
2537
2686
  this.updateSearchResultsA11yText();
@@ -2570,26 +2719,34 @@ var factoryOutput = (() => {
2570
2719
  };
2571
2720
 
2572
2721
  // src/js/modules/data/country-data.ts
2573
- function processAllCountries(options) {
2722
+ var processAllCountries = (options) => {
2574
2723
  const { onlyCountries, excludeCountries } = options;
2575
2724
  if (onlyCountries.length) {
2576
- const lowerCaseOnlyCountries = onlyCountries.map((country) => country.toLowerCase());
2577
- return data_default.filter((country) => lowerCaseOnlyCountries.includes(country.iso2));
2725
+ const lowerCaseOnlyCountries = onlyCountries.map(
2726
+ (country) => country.toLowerCase()
2727
+ );
2728
+ return data_default.filter(
2729
+ (country) => lowerCaseOnlyCountries.includes(country.iso2)
2730
+ );
2578
2731
  } else if (excludeCountries.length) {
2579
- const lowerCaseExcludeCountries = excludeCountries.map((country) => country.toLowerCase());
2580
- return data_default.filter((country) => !lowerCaseExcludeCountries.includes(country.iso2));
2732
+ const lowerCaseExcludeCountries = excludeCountries.map(
2733
+ (country) => country.toLowerCase()
2734
+ );
2735
+ return data_default.filter(
2736
+ (country) => !lowerCaseExcludeCountries.includes(country.iso2)
2737
+ );
2581
2738
  }
2582
2739
  return data_default;
2583
- }
2584
- function translateCountryNames(countries, options) {
2740
+ };
2741
+ var translateCountryNames = (countries, options) => {
2585
2742
  for (const c of countries) {
2586
2743
  const iso2 = c.iso2.toLowerCase();
2587
2744
  if (options.i18n[iso2]) {
2588
2745
  c.name = options.i18n[iso2];
2589
2746
  }
2590
2747
  }
2591
- }
2592
- function processDialCodes(countries, options) {
2748
+ };
2749
+ var processDialCodes = (countries, options) => {
2593
2750
  const dialCodes = /* @__PURE__ */ new Set();
2594
2751
  let dialCodeMaxLen = 0;
2595
2752
  const dialCodeToIso2Map = {};
@@ -2640,10 +2797,12 @@ var factoryOutput = (() => {
2640
2797
  }
2641
2798
  }
2642
2799
  return { dialCodes, dialCodeMaxLen, dialCodeToIso2Map };
2643
- }
2644
- function sortCountries(countries, options) {
2800
+ };
2801
+ var sortCountries = (countries, options) => {
2645
2802
  if (options.countryOrder) {
2646
- options.countryOrder = options.countryOrder.map((iso2) => iso2.toLowerCase());
2803
+ options.countryOrder = options.countryOrder.map(
2804
+ (iso2) => iso2.toLowerCase()
2805
+ );
2647
2806
  }
2648
2807
  countries.sort((a, b) => {
2649
2808
  const { countryOrder } = options;
@@ -2661,17 +2820,17 @@ var factoryOutput = (() => {
2661
2820
  }
2662
2821
  return a.name.localeCompare(b.name);
2663
2822
  });
2664
- }
2665
- function cacheSearchTokens(countries) {
2823
+ };
2824
+ var cacheSearchTokens = (countries) => {
2666
2825
  for (const c of countries) {
2667
2826
  c.normalisedName = normaliseString(c.name);
2668
- c.initials = c.name.split(/[^a-zA-ZÀ-ÿа-яА-Я]/).map((word) => word[0]).join("").toLowerCase();
2827
+ c.initials = c.normalisedName.split(/[^a-z]/).map((word) => word[0]).join("");
2669
2828
  c.dialCodePlus = `+${c.dialCode}`;
2670
2829
  }
2671
- }
2830
+ };
2672
2831
 
2673
2832
  // src/js/modules/format/formatting.ts
2674
- function beforeSetNumber(fullNumber, dialCode, separateDialCode, selectedCountryData) {
2833
+ var beforeSetNumber = (fullNumber, dialCode, separateDialCode, selectedCountryData) => {
2675
2834
  let number = fullNumber;
2676
2835
  if (separateDialCode) {
2677
2836
  if (dialCode) {
@@ -2681,8 +2840,8 @@ var factoryOutput = (() => {
2681
2840
  }
2682
2841
  }
2683
2842
  return number;
2684
- }
2685
- function formatNumberAsYouType(fullNumber, telInputValue, utils2, selectedCountryData, separateDialCode) {
2843
+ };
2844
+ var formatNumberAsYouType = (fullNumber, telInputValue, utils2, selectedCountryData, separateDialCode) => {
2686
2845
  const result = utils2 ? utils2.formatNumberAsYouType(fullNumber, selectedCountryData.iso2) : fullNumber;
2687
2846
  const { dialCode } = selectedCountryData;
2688
2847
  if (separateDialCode && telInputValue.charAt(0) !== "+" && result.includes(`+${dialCode}`)) {
@@ -2690,10 +2849,10 @@ var factoryOutput = (() => {
2690
2849
  return afterDialCode.trim();
2691
2850
  }
2692
2851
  return result;
2693
- }
2852
+ };
2694
2853
 
2695
2854
  // src/js/modules/format/caret.ts
2696
- function translateCursorPosition(relevantChars, formattedValue, prevCaretPos, isDeleteForwards) {
2855
+ var translateCursorPosition = (relevantChars, formattedValue, prevCaretPos, isDeleteForwards) => {
2697
2856
  if (prevCaretPos === 0 && !isDeleteForwards) {
2698
2857
  return 0;
2699
2858
  }
@@ -2710,7 +2869,7 @@ var factoryOutput = (() => {
2710
2869
  }
2711
2870
  }
2712
2871
  return formattedValue.length;
2713
- }
2872
+ };
2714
2873
 
2715
2874
  // src/js/modules/data/nanp-regionless.ts
2716
2875
  var regionlessNanpNumbers = [
@@ -2734,7 +2893,7 @@ var factoryOutput = (() => {
2734
2893
  ];
2735
2894
  var isRegionlessNanp = (number) => {
2736
2895
  const numeric = getNumeric(number);
2737
- if (numeric.charAt(0) === "1") {
2896
+ if (numeric.startsWith(DIAL.NANP) && numeric.length >= 4) {
2738
2897
  const areaCode = numeric.substring(1, 4);
2739
2898
  return regionlessNanpNumbers.includes(areaCode);
2740
2899
  }
@@ -2743,7 +2902,7 @@ var factoryOutput = (() => {
2743
2902
 
2744
2903
  // src/js/intl-tel-input.ts
2745
2904
  for (const c of data_default) {
2746
- c.name = countries_default[c.iso2];
2905
+ c.name = en_default[c.iso2];
2747
2906
  }
2748
2907
  var id = 0;
2749
2908
  var iso2Set = new Set(data_default.map((c) => c.iso2));
@@ -2752,7 +2911,7 @@ var factoryOutput = (() => {
2752
2911
  constructor(input, customOptions = {}) {
2753
2912
  this.id = id++;
2754
2913
  this.options = { ...defaults, ...customOptions };
2755
- applyOptionSideEffects(this.options);
2914
+ applyOptionSideEffects(this.options, en_default);
2756
2915
  this.ui = new UI(input, this.options, this.id);
2757
2916
  this.isAndroid = _Iti._getIsAndroid();
2758
2917
  this.promise = this._createInitPromises();
@@ -2811,7 +2970,7 @@ var factoryOutput = (() => {
2811
2970
  const dialCode = this._getDialCode(val);
2812
2971
  const isRegionlessNanpNumber = isRegionlessNanp(val);
2813
2972
  const { initialCountry, geoIpLookup } = this.options;
2814
- const isAutoCountry = initialCountry === "auto" && geoIpLookup;
2973
+ const isAutoCountry = initialCountry === INITIAL_COUNTRY.AUTO && geoIpLookup;
2815
2974
  if (dialCode && !isRegionlessNanpNumber) {
2816
2975
  this._updateCountryFromNumber(val);
2817
2976
  } else if (!isAutoCountry || overrideAutoCountry) {
@@ -2820,7 +2979,7 @@ var factoryOutput = (() => {
2820
2979
  this._setCountry(lowerInitialCountry);
2821
2980
  } else {
2822
2981
  if (dialCode && isRegionlessNanpNumber) {
2823
- this._setCountry("us");
2982
+ this._setCountry(US.ISO2);
2824
2983
  } else {
2825
2984
  this._setCountry("");
2826
2985
  }
@@ -2858,7 +3017,7 @@ var factoryOutput = (() => {
2858
3017
  _initDropdownListeners() {
2859
3018
  const signal = this.abortController.signal;
2860
3019
  const handleLabelClick = (e) => {
2861
- if (this.ui.dropdownContent.classList.contains("iti__hide")) {
3020
+ if (this.ui.dropdownContent.classList.contains(CLASSES.HIDE)) {
2862
3021
  this.ui.telInput.focus();
2863
3022
  } else {
2864
3023
  e.preventDefault();
@@ -2869,22 +3028,30 @@ var factoryOutput = (() => {
2869
3028
  label.addEventListener("click", handleLabelClick, { signal });
2870
3029
  }
2871
3030
  const handleClickSelectedCountry = () => {
2872
- const dropdownClosed = this.ui.dropdownContent.classList.contains("iti__hide");
3031
+ const dropdownClosed = this.ui.dropdownContent.classList.contains(
3032
+ CLASSES.HIDE
3033
+ );
2873
3034
  if (dropdownClosed && !this.ui.telInput.disabled && !this.ui.telInput.readOnly) {
2874
3035
  this._openDropdown();
2875
3036
  }
2876
3037
  };
2877
- this.ui.selectedCountry.addEventListener("click", handleClickSelectedCountry, {
2878
- signal
2879
- });
3038
+ this.ui.selectedCountry.addEventListener(
3039
+ "click",
3040
+ handleClickSelectedCountry,
3041
+ {
3042
+ signal
3043
+ }
3044
+ );
2880
3045
  const handleCountryContainerKeydown = (e) => {
2881
- const isDropdownHidden = this.ui.dropdownContent.classList.contains("iti__hide");
2882
- if (isDropdownHidden && ["ArrowUp", "ArrowDown", " ", "Enter"].includes(e.key)) {
3046
+ const isDropdownHidden = this.ui.dropdownContent.classList.contains(
3047
+ CLASSES.HIDE
3048
+ );
3049
+ if (isDropdownHidden && [KEYS.ARROW_UP, KEYS.ARROW_DOWN, KEYS.SPACE, KEYS.ENTER].includes(e.key)) {
2883
3050
  e.preventDefault();
2884
3051
  e.stopPropagation();
2885
3052
  this._openDropdown();
2886
3053
  }
2887
- if (e.key === "Tab") {
3054
+ if (e.key === KEYS.TAB) {
2888
3055
  this._closeDropdown();
2889
3056
  }
2890
3057
  };
@@ -2915,7 +3082,7 @@ var factoryOutput = (() => {
2915
3082
  } else {
2916
3083
  this.resolveUtilsScriptPromise();
2917
3084
  }
2918
- const isAutoCountry = initialCountry === "auto" && geoIpLookup;
3085
+ const isAutoCountry = initialCountry === INITIAL_COUNTRY.AUTO && geoIpLookup;
2919
3086
  if (isAutoCountry && !this.selectedCountryData.iso2) {
2920
3087
  this._loadAutoCountry();
2921
3088
  } else {
@@ -2968,7 +3135,7 @@ var factoryOutput = (() => {
2968
3135
  countrySearch
2969
3136
  } = this.options;
2970
3137
  let userOverrideFormatting = false;
2971
- if (/\p{L}/u.test(this.ui.telInput.value)) {
3138
+ if (REGEX.ALPHA_UNICODE.test(this.ui.telInput.value)) {
2972
3139
  userOverrideFormatting = true;
2973
3140
  }
2974
3141
  const handleInputEvent = (e) => {
@@ -2986,11 +3153,11 @@ var factoryOutput = (() => {
2986
3153
  if (this._updateCountryFromNumber(this.ui.telInput.value)) {
2987
3154
  this._triggerCountryChange();
2988
3155
  }
2989
- const isFormattingChar = e?.data && /[^+0-9]/.test(e.data);
2990
- const isPaste = e?.inputType === "insertFromPaste" && this.ui.telInput.value;
3156
+ const isFormattingChar = e?.data && REGEX.NON_PLUS_NUMERIC.test(e.data);
3157
+ const isPaste = e?.inputType === INPUT_TYPES.PASTE && this.ui.telInput.value;
2991
3158
  if (isFormattingChar || isPaste && !strictMode) {
2992
3159
  userOverrideFormatting = true;
2993
- } else if (!/[^+0-9]/.test(this.ui.telInput.value)) {
3160
+ } else if (!REGEX.NON_PLUS_NUMERIC.test(this.ui.telInput.value)) {
2994
3161
  userOverrideFormatting = false;
2995
3162
  }
2996
3163
  const isSetNumber = e?.detail && e.detail["isSetNumber"];
@@ -3001,10 +3168,10 @@ var factoryOutput = (() => {
3001
3168
  currentCaretPos
3002
3169
  );
3003
3170
  const relevantCharsBeforeCaret = valueBeforeCaret.replace(
3004
- /[^+0-9]/g,
3171
+ REGEX.NON_PLUS_NUMERIC_GLOBAL,
3005
3172
  ""
3006
3173
  ).length;
3007
- const isDeleteForwards = e?.inputType === "deleteContentForward";
3174
+ const isDeleteForwards = e?.inputType === INPUT_TYPES.DELETE_FWD;
3008
3175
  const fullNumber = this._getFullNumber();
3009
3176
  const formattedValue = formatNumberAsYouType(
3010
3177
  fullNumber,
@@ -3023,9 +3190,13 @@ var factoryOutput = (() => {
3023
3190
  this.ui.telInput.setSelectionRange(newCaretPos, newCaretPos);
3024
3191
  }
3025
3192
  };
3026
- this.ui.telInput.addEventListener("input", handleInputEvent, {
3027
- signal: this.abortController.signal
3028
- });
3193
+ this.ui.telInput.addEventListener(
3194
+ "input",
3195
+ handleInputEvent,
3196
+ {
3197
+ signal: this.abortController.signal
3198
+ }
3199
+ );
3029
3200
  }
3030
3201
  _maybeBindKeydownListener() {
3031
3202
  const { strictMode, separateDialCode, allowDropdown, countrySearch } = this.options;
@@ -3076,7 +3247,7 @@ var factoryOutput = (() => {
3076
3247
  const pasted = e.clipboardData.getData("text");
3077
3248
  const initialCharSelected = selStart === 0 && selEnd > 0;
3078
3249
  const allowLeadingPlus = !input.value.startsWith("+") || initialCharSelected;
3079
- const allowedChars = pasted.replace(/[^0-9+]/g, "");
3250
+ const allowedChars = pasted.replace(REGEX.NON_PLUS_NUMERIC_GLOBAL, "");
3080
3251
  const hasLeadingPlus = allowedChars.startsWith("+");
3081
3252
  const numerics = allowedChars.replace(/\+/g, "");
3082
3253
  const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
@@ -3128,8 +3299,8 @@ var factoryOutput = (() => {
3128
3299
  if (fixDropdownWidth) {
3129
3300
  this.ui.dropdownContent.style.width = `${this.ui.telInput.offsetWidth}px`;
3130
3301
  }
3131
- this.ui.dropdownContent.classList.remove("iti__hide");
3132
- this.ui.selectedCountry.setAttribute("aria-expanded", "true");
3302
+ this.ui.dropdownContent.classList.remove(CLASSES.HIDE);
3303
+ this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "true");
3133
3304
  this._setDropdownPosition();
3134
3305
  if (countrySearch) {
3135
3306
  const firstCountryItem = this.ui.countryList.firstElementChild;
@@ -3140,8 +3311,8 @@ var factoryOutput = (() => {
3140
3311
  this.ui.searchInput.focus();
3141
3312
  }
3142
3313
  this._bindDropdownListeners();
3143
- this.ui.dropdownArrow.classList.add("iti__arrow--up");
3144
- this._trigger("open:countrydropdown");
3314
+ this.ui.dropdownArrow.classList.add(CLASSES.ARROW_UP);
3315
+ this._trigger(EVENTS.OPEN_COUNTRY_DROPDOWN);
3145
3316
  }
3146
3317
  //* Set the dropdown position
3147
3318
  _setDropdownPosition() {
@@ -3164,20 +3335,38 @@ var factoryOutput = (() => {
3164
3335
  //* We only bind dropdown listeners when the dropdown is open.
3165
3336
  _bindDropdownListeners() {
3166
3337
  const signal = this.dropdownAbortController.signal;
3338
+ this._bindDropdownMouseoverListener(signal);
3339
+ this._bindDropdownCountryClickListener(signal);
3340
+ this._bindDropdownClickOffListener(signal);
3341
+ this._bindDropdownKeydownListener(signal);
3342
+ if (this.options.countrySearch) {
3343
+ this._bindDropdownSearchListeners(signal);
3344
+ }
3345
+ }
3346
+ //* When mouse over a list item, just highlight that one
3347
+ //* we add the class "highlight", so if they hit "enter" we know which one to select.
3348
+ _bindDropdownMouseoverListener(signal) {
3167
3349
  const handleMouseoverCountryList = (e) => {
3168
3350
  const listItem = e.target?.closest(
3169
- ".iti__country"
3351
+ `.${CLASSES.COUNTRY_ITEM}`
3170
3352
  );
3171
3353
  if (listItem) {
3172
3354
  this.ui.highlightListItem(listItem, false);
3173
3355
  }
3174
3356
  };
3175
- this.ui.countryList.addEventListener("mouseover", handleMouseoverCountryList, {
3176
- signal
3177
- });
3357
+ this.ui.countryList.addEventListener(
3358
+ "mouseover",
3359
+ handleMouseoverCountryList,
3360
+ {
3361
+ signal
3362
+ }
3363
+ );
3364
+ }
3365
+ //* Listen for country selection.
3366
+ _bindDropdownCountryClickListener(signal) {
3178
3367
  const handleClickCountryList = (e) => {
3179
3368
  const listItem = e.target?.closest(
3180
- ".iti__country"
3369
+ `.${CLASSES.COUNTRY_ITEM}`
3181
3370
  );
3182
3371
  if (listItem) {
3183
3372
  this._selectListItem(listItem);
@@ -3186,6 +3375,10 @@ var factoryOutput = (() => {
3186
3375
  this.ui.countryList.addEventListener("click", handleClickCountryList, {
3187
3376
  signal
3188
3377
  });
3378
+ }
3379
+ //* Click off to close (except when this initial opening click is bubbling up).
3380
+ //* We cannot just stopPropagation as it may be needed to close another instance.
3381
+ _bindDropdownClickOffListener(signal) {
3189
3382
  const handleClickOffToClose = (e) => {
3190
3383
  const target = e.target;
3191
3384
  const clickedInsideDropdown = !!target.closest(
@@ -3202,21 +3395,33 @@ var factoryOutput = (() => {
3202
3395
  { signal }
3203
3396
  );
3204
3397
  }, 0);
3398
+ }
3399
+ //* Listen for up/down scrolling, enter to select, or escape to close.
3400
+ //* Use keydown as keypress doesn't fire for non-char keys and we want to catch if they
3401
+ //* just hit down and hold it to scroll down (no keyup event).
3402
+ //* Listen on the document because that's where key events are triggered if no input has focus.
3403
+ _bindDropdownKeydownListener(signal) {
3205
3404
  let query = "";
3206
3405
  let queryTimer = null;
3207
3406
  const handleKeydownOnDropdown = (e) => {
3208
- if (["ArrowUp", "ArrowDown", "Enter", "Escape"].includes(e.key)) {
3407
+ const allowedKeys = [
3408
+ KEYS.ARROW_UP,
3409
+ KEYS.ARROW_DOWN,
3410
+ KEYS.ENTER,
3411
+ KEYS.ESC
3412
+ ];
3413
+ if (allowedKeys.includes(e.key)) {
3209
3414
  e.preventDefault();
3210
3415
  e.stopPropagation();
3211
- if (e.key === "ArrowUp" || e.key === "ArrowDown") {
3416
+ if (e.key === KEYS.ARROW_UP || e.key === KEYS.ARROW_DOWN) {
3212
3417
  this._handleUpDownKey(e.key);
3213
- } else if (e.key === "Enter") {
3418
+ } else if (e.key === KEYS.ENTER) {
3214
3419
  this._handleEnterKey();
3215
- } else if (e.key === "Escape") {
3420
+ } else if (e.key === KEYS.ESC) {
3216
3421
  this._closeDropdown();
3217
3422
  }
3218
3423
  }
3219
- if (!this.options.countrySearch && /^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
3424
+ if (!this.options.countrySearch && REGEX.HIDDEN_SEARCH_CHAR.test(e.key)) {
3220
3425
  e.stopPropagation();
3221
3426
  if (queryTimer) {
3222
3427
  clearTimeout(queryTimer);
@@ -3225,53 +3430,51 @@ var factoryOutput = (() => {
3225
3430
  this._searchForCountry(query);
3226
3431
  queryTimer = setTimeout(() => {
3227
3432
  query = "";
3228
- }, 1e3);
3433
+ }, TIMINGS.HIDDEN_SEARCH_RESET_MS);
3229
3434
  }
3230
3435
  };
3231
3436
  document.addEventListener("keydown", handleKeydownOnDropdown, { signal });
3232
- if (this.options.countrySearch) {
3233
- const doFilter = () => {
3234
- const inputQuery = this.ui.searchInput.value.trim();
3235
- this._filterCountriesByQuery(inputQuery);
3236
- if (this.ui.searchInput.value) {
3237
- this.ui.searchClearButton.classList.remove("iti__hide");
3238
- } else {
3239
- this.ui.searchClearButton.classList.add("iti__hide");
3240
- }
3241
- };
3242
- let keyupTimer = null;
3243
- const handleSearchChange = () => {
3244
- if (keyupTimer) {
3245
- clearTimeout(keyupTimer);
3246
- }
3247
- keyupTimer = setTimeout(() => {
3248
- doFilter();
3249
- keyupTimer = null;
3250
- }, 100);
3251
- };
3252
- this.ui.searchInput.addEventListener("input", handleSearchChange, {
3253
- signal
3254
- });
3255
- const handleSearchClear = () => {
3256
- this.ui.searchInput.value = "";
3257
- this.ui.searchInput.focus();
3437
+ }
3438
+ //* Search input listeners when countrySearch enabled.
3439
+ _bindDropdownSearchListeners(signal) {
3440
+ const doFilter = () => {
3441
+ const inputQuery = this.ui.searchInput.value.trim();
3442
+ this._filterCountriesByQuery(inputQuery);
3443
+ if (this.ui.searchInput.value) {
3444
+ this.ui.searchClearButton.classList.remove(CLASSES.HIDE);
3445
+ } else {
3446
+ this.ui.searchClearButton.classList.add(CLASSES.HIDE);
3447
+ }
3448
+ };
3449
+ let keyupTimer = null;
3450
+ const handleSearchChange = () => {
3451
+ if (keyupTimer) {
3452
+ clearTimeout(keyupTimer);
3453
+ }
3454
+ keyupTimer = setTimeout(() => {
3258
3455
  doFilter();
3259
- };
3260
- this.ui.searchClearButton.addEventListener("click", handleSearchClear, {
3261
- signal
3262
- });
3263
- }
3456
+ keyupTimer = null;
3457
+ }, 100);
3458
+ };
3459
+ this.ui.searchInput.addEventListener("input", handleSearchChange, {
3460
+ signal
3461
+ });
3462
+ const handleSearchClear = () => {
3463
+ this.ui.searchInput.value = "";
3464
+ this.ui.searchInput.focus();
3465
+ doFilter();
3466
+ };
3467
+ this.ui.searchClearButton.addEventListener("click", handleSearchClear, {
3468
+ signal
3469
+ });
3264
3470
  }
3265
3471
  //* Hidden search (countrySearch disabled): Find the first list item whose name starts with the query string.
3266
3472
  _searchForCountry(query) {
3267
- for (const c of this.countries) {
3268
- const startsWith = c.name.substring(0, query.length).toLowerCase() === query;
3269
- if (startsWith) {
3270
- const listItem = c.nodeById[this.id];
3271
- this.ui.highlightListItem(listItem, false);
3272
- this.ui.scrollTo(listItem);
3273
- break;
3274
- }
3473
+ const match = findFirstCountryStartingWith(this.countries, query);
3474
+ if (match) {
3475
+ const listItem = match.nodeById[this.id];
3476
+ this.ui.highlightListItem(listItem, false);
3477
+ this.ui.scrollTo(listItem);
3275
3478
  }
3276
3479
  }
3277
3480
  //* Country search: Filter the countries according to the search query.
@@ -3280,47 +3483,15 @@ var factoryOutput = (() => {
3280
3483
  if (query === "") {
3281
3484
  matchedCountries = this.countries;
3282
3485
  } else {
3283
- matchedCountries = this._getMatchedCountries(query);
3486
+ matchedCountries = getMatchedCountries(this.countries, query);
3284
3487
  }
3285
3488
  this.ui.filterCountries(matchedCountries);
3286
3489
  }
3287
- _getMatchedCountries(query) {
3288
- const normalisedQuery = normaliseString(query);
3289
- const iso2Matches = [];
3290
- const nameStartWith = [];
3291
- const nameContains = [];
3292
- const dialCodeMatches = [];
3293
- const dialCodeContains = [];
3294
- const initialsMatches = [];
3295
- for (const c of this.countries) {
3296
- if (c.iso2 === normalisedQuery) {
3297
- iso2Matches.push(c);
3298
- } else if (c.normalisedName.startsWith(normalisedQuery)) {
3299
- nameStartWith.push(c);
3300
- } else if (c.normalisedName.includes(normalisedQuery)) {
3301
- nameContains.push(c);
3302
- } else if (normalisedQuery === c.dialCode || normalisedQuery === c.dialCodePlus) {
3303
- dialCodeMatches.push(c);
3304
- } else if (c.dialCodePlus.includes(normalisedQuery)) {
3305
- dialCodeContains.push(c);
3306
- } else if (c.initials.includes(normalisedQuery)) {
3307
- initialsMatches.push(c);
3308
- }
3309
- }
3310
- return [
3311
- ...iso2Matches.sort((a, b) => a.priority - b.priority),
3312
- ...nameStartWith.sort((a, b) => a.priority - b.priority),
3313
- ...nameContains.sort((a, b) => a.priority - b.priority),
3314
- ...dialCodeMatches.sort((a, b) => a.priority - b.priority),
3315
- ...dialCodeContains.sort((a, b) => a.priority - b.priority),
3316
- ...initialsMatches.sort((a, b) => a.priority - b.priority)
3317
- ];
3318
- }
3319
3490
  //* Highlight the next/prev item in the list (and ensure it is visible).
3320
3491
  _handleUpDownKey(key) {
3321
- let next = key === "ArrowUp" ? this.ui.highlightedItem?.previousElementSibling : this.ui.highlightedItem?.nextElementSibling;
3492
+ let next = key === KEYS.ARROW_UP ? this.ui.highlightedItem?.previousElementSibling : this.ui.highlightedItem?.nextElementSibling;
3322
3493
  if (!next && this.ui.countryList.childElementCount > 1) {
3323
- next = key === "ArrowUp" ? this.ui.countryList.lastElementChild : this.ui.countryList.firstElementChild;
3494
+ next = key === KEYS.ARROW_UP ? this.ui.countryList.lastElementChild : this.ui.countryList.firstElementChild;
3324
3495
  }
3325
3496
  if (next) {
3326
3497
  this.ui.scrollTo(next);
@@ -3393,7 +3564,7 @@ var factoryOutput = (() => {
3393
3564
  if (!selectedIso2 && this.defaultCountry && iso2Codes.includes(this.defaultCountry)) {
3394
3565
  return this.defaultCountry;
3395
3566
  }
3396
- const isRegionlessNanpNumber = selectedDialCode === "1" && isRegionlessNanp(numeric);
3567
+ const isRegionlessNanpNumber = selectedDialCode === DIAL.NANP && isRegionlessNanp(numeric);
3397
3568
  if (isRegionlessNanpNumber) {
3398
3569
  return null;
3399
3570
  }
@@ -3432,7 +3603,7 @@ var factoryOutput = (() => {
3432
3603
  this.defaultCountry = this.selectedCountryData.iso2;
3433
3604
  }
3434
3605
  if (this.ui.selectedCountry) {
3435
- const flagClass = iso2 && showFlags ? `iti__flag iti__${iso2}` : "iti__flag iti__globe";
3606
+ const flagClass = iso2 && showFlags ? `${CLASSES.FLAG} iti__${iso2}` : `${CLASSES.FLAG} ${CLASSES.GLOBE}`;
3436
3607
  let ariaLabel, title;
3437
3608
  if (iso2) {
3438
3609
  const { name, dialCode } = this.selectedCountryData;
@@ -3444,7 +3615,7 @@ var factoryOutput = (() => {
3444
3615
  }
3445
3616
  this.ui.selectedCountryInner.className = flagClass;
3446
3617
  this.ui.selectedCountry.setAttribute("title", title);
3447
- this.ui.selectedCountry.setAttribute("aria-label", ariaLabel);
3618
+ this.ui.selectedCountry.setAttribute(ARIA.LABEL, ariaLabel);
3448
3619
  }
3449
3620
  if (separateDialCode) {
3450
3621
  const dialCode = this.selectedCountryData.dialCode ? `+${this.selectedCountryData.dialCode}` : "";
@@ -3512,10 +3683,10 @@ var factoryOutput = (() => {
3512
3683
  }
3513
3684
  //* Called when the user selects a list item from the dropdown.
3514
3685
  _selectListItem(listItem) {
3515
- const iso2 = listItem.dataset.countryCode;
3686
+ const iso2 = listItem.dataset[DATA_KEYS.COUNTRY_CODE];
3516
3687
  const countryChanged = this._setCountry(iso2);
3517
3688
  this._closeDropdown();
3518
- const dialCode = listItem.dataset.dialCode;
3689
+ const dialCode = listItem.dataset[DATA_KEYS.DIAL_CODE];
3519
3690
  this._updateDialCode(dialCode);
3520
3691
  if (this.options.formatOnDisplay) {
3521
3692
  this._updateValFromNumber(this.ui.telInput.value);
@@ -3527,24 +3698,24 @@ var factoryOutput = (() => {
3527
3698
  }
3528
3699
  //* Close the dropdown and unbind any listeners.
3529
3700
  _closeDropdown() {
3530
- if (this.ui.dropdownContent.classList.contains("iti__hide")) {
3701
+ if (this.ui.dropdownContent.classList.contains(CLASSES.HIDE)) {
3531
3702
  return;
3532
3703
  }
3533
- this.ui.dropdownContent.classList.add("iti__hide");
3534
- this.ui.selectedCountry.setAttribute("aria-expanded", "false");
3704
+ this.ui.dropdownContent.classList.add(CLASSES.HIDE);
3705
+ this.ui.selectedCountry.setAttribute(ARIA.EXPANDED, "false");
3535
3706
  if (this.ui.highlightedItem) {
3536
- this.ui.highlightedItem.setAttribute("aria-selected", "false");
3707
+ this.ui.highlightedItem.setAttribute(ARIA.SELECTED, "false");
3537
3708
  }
3538
3709
  if (this.options.countrySearch) {
3539
- this.ui.searchInput.removeAttribute("aria-activedescendant");
3710
+ this.ui.searchInput.removeAttribute(ARIA.ACTIVE_DESCENDANT);
3540
3711
  }
3541
- this.ui.dropdownArrow.classList.remove("iti__arrow--up");
3712
+ this.ui.dropdownArrow.classList.remove(CLASSES.ARROW_UP);
3542
3713
  this.dropdownAbortController.abort();
3543
3714
  this.dropdownAbortController = null;
3544
3715
  if (this.options.dropdownContainer) {
3545
3716
  this.ui.dropdown.remove();
3546
3717
  }
3547
- this._trigger("close:countrydropdown");
3718
+ this._trigger(EVENTS.CLOSE_COUNTRY_DROPDOWN);
3548
3719
  }
3549
3720
  //* Replace any existing dial code with the new one
3550
3721
  //* Note: called from _selectListItem and setCountry
@@ -3616,16 +3787,16 @@ var factoryOutput = (() => {
3616
3787
  }
3617
3788
  //* Trigger the 'countrychange' event.
3618
3789
  _triggerCountryChange() {
3619
- this._trigger("countrychange");
3790
+ this._trigger(EVENTS.COUNTRY_CHANGE);
3620
3791
  }
3621
3792
  //**************************
3622
3793
  //* SECRET PUBLIC METHODS
3623
3794
  //**************************
3624
3795
  //* This is called when the geoip call returns.
3625
3796
  handleAutoCountry() {
3626
- if (this.options.initialCountry === "auto" && intlTelInput.autoCountry) {
3797
+ if (this.options.initialCountry === INITIAL_COUNTRY.AUTO && intlTelInput.autoCountry) {
3627
3798
  this.defaultCountry = intlTelInput.autoCountry;
3628
- const hasSelectedCountryOrGlobe = this.selectedCountryData.iso2 || this.ui.selectedCountryInner.classList.contains("iti__globe");
3799
+ const hasSelectedCountryOrGlobe = this.selectedCountryData.iso2 || this.ui.selectedCountryInner.classList.contains(CLASSES.GLOBE);
3629
3800
  if (!hasSelectedCountryOrGlobe) {
3630
3801
  this.setCountry(this.defaultCountry);
3631
3802
  }
@@ -3695,7 +3866,7 @@ var factoryOutput = (() => {
3695
3866
  this.selectedCountryData.iso2
3696
3867
  );
3697
3868
  }
3698
- return -99;
3869
+ return SENTINELS.UNKNOWN_NUMBER_TYPE;
3699
3870
  }
3700
3871
  //* Get the country data for the currently selected country.
3701
3872
  getSelectedCountryData() {
@@ -3707,15 +3878,15 @@ var factoryOutput = (() => {
3707
3878
  const { iso2 } = this.selectedCountryData;
3708
3879
  return intlTelInput.utils.getValidationError(this._getFullNumber(), iso2);
3709
3880
  }
3710
- return -99;
3881
+ return SENTINELS.UNKNOWN_VALIDATION_ERROR;
3711
3882
  }
3712
3883
  //* Validate the input val using number length only
3713
3884
  isValidNumber() {
3714
3885
  const { dialCode, iso2 } = this.selectedCountryData;
3715
- if (dialCode === "44" && intlTelInput.utils) {
3886
+ if (dialCode === UK.DIAL_CODE && intlTelInput.utils) {
3716
3887
  const number = this._getFullNumber();
3717
3888
  const coreNumber = intlTelInput.utils.getCoreNumber(number, iso2);
3718
- if (coreNumber[0] === "7" && coreNumber.length !== 10) {
3889
+ if (coreNumber[0] === UK.MOBILE_PREFIX && coreNumber.length !== UK.MOBILE_CORE_LENGTH) {
3719
3890
  return false;
3720
3891
  }
3721
3892
  }
@@ -3742,7 +3913,7 @@ var factoryOutput = (() => {
3742
3913
  }
3743
3914
  const testValidity = (s) => precise ? this._utilsIsValidNumber(s) : this._utilsIsPossibleNumber(s);
3744
3915
  const val = this._getFullNumber();
3745
- const alphaCharPosition = val.search(/\p{L}/u);
3916
+ const alphaCharPosition = val.search(REGEX.ALPHA_UNICODE);
3746
3917
  const hasAlphaChar = alphaCharPosition > -1;
3747
3918
  if (hasAlphaChar && !this.options.allowPhonewords) {
3748
3919
  const beforeAlphaChar = val.substring(0, alphaCharPosition);
@@ -3783,7 +3954,7 @@ var factoryOutput = (() => {
3783
3954
  if (countryChanged) {
3784
3955
  this._triggerCountryChange();
3785
3956
  }
3786
- this._trigger("input", { isSetNumber: true });
3957
+ this._trigger(EVENTS.INPUT, { isSetNumber: true });
3787
3958
  }
3788
3959
  //* Set the placeholder number typ
3789
3960
  setPlaceholderNumberType(type) {
@@ -3864,7 +4035,7 @@ var factoryOutput = (() => {
3864
4035
  attachUtils,
3865
4036
  startedLoadingUtilsScript: false,
3866
4037
  startedLoadingAutoCountry: false,
3867
- version: "25.11.0"
4038
+ version: "25.11.2"
3868
4039
  }
3869
4040
  );
3870
4041
  var intl_tel_input_default = intlTelInput;