@splunk/react-ui 5.4.0 → 5.5.0

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 (76) hide show
  1. package/Badge.js +154 -0
  2. package/CHANGELOG.md +27 -0
  3. package/Code.js +1097 -500
  4. package/Color.js +142 -141
  5. package/ComboBox.js +6 -5
  6. package/Link.js +74 -44
  7. package/MIGRATION.md +32 -1
  8. package/Menu.js +41 -43
  9. package/Multiselect.js +596 -2143
  10. package/Number.js +3 -3
  11. package/PhoneNumber.d.ts +2 -0
  12. package/PhoneNumber.js +769 -0
  13. package/Popover.js +73 -75
  14. package/RadioList.js +166 -151
  15. package/ResultsMenu.js +27 -29
  16. package/Select.js +179 -1768
  17. package/SelectBase.d.ts +2 -0
  18. package/SelectBase.js +1681 -0
  19. package/Slider.js +202 -199
  20. package/SlidingPanels.js +55 -62
  21. package/Switch.js +42 -27
  22. package/TabBar.js +295 -294
  23. package/TabLayout.js +14 -14
  24. package/Table.js +1087 -1040
  25. package/TransitionOpen.js +82 -74
  26. package/docker-compose.yml +99 -52
  27. package/package.json +9 -5
  28. package/stubs-splunkui.d.ts +0 -86
  29. package/test-runner-jest.config.js +1 -0
  30. package/types/src/Badge/Badge.d.ts +29 -0
  31. package/types/src/Badge/docs/examples/Basic.d.ts +5 -0
  32. package/types/src/Badge/docs/examples/Count.d.ts +6 -0
  33. package/types/src/Badge/docs/examples/CustomColors.d.ts +8 -0
  34. package/types/src/Badge/docs/examples/Icon.d.ts +6 -0
  35. package/types/src/Badge/index.d.ts +2 -0
  36. package/types/src/Code/Code.d.ts +4 -3
  37. package/types/src/Code/index.d.ts +1 -0
  38. package/types/src/Link/Link.d.ts +4 -0
  39. package/types/src/Link/LinkContext.d.ts +14 -0
  40. package/types/src/Link/docs/examples/Visited.d.ts +7 -0
  41. package/types/src/Link/index.d.ts +1 -0
  42. package/types/src/Multiselect/Compact.d.ts +1 -1
  43. package/types/src/Multiselect/Multiselect.d.ts +1 -1
  44. package/types/src/PhoneNumber/PhoneNumber.d.ts +139 -0
  45. package/types/src/PhoneNumber/docs/examples/Controlled.d.ts +7 -0
  46. package/types/src/PhoneNumber/docs/examples/DefaultCountry.d.ts +7 -0
  47. package/types/src/PhoneNumber/docs/examples/Disabled.d.ts +6 -0
  48. package/types/src/PhoneNumber/docs/examples/Error.d.ts +6 -0
  49. package/types/src/PhoneNumber/docs/examples/Inline.d.ts +7 -0
  50. package/types/src/PhoneNumber/docs/examples/Uncontrolled.d.ts +7 -0
  51. package/types/src/PhoneNumber/index.d.ts +2 -0
  52. package/types/src/PhoneNumber/utils.d.ts +47 -0
  53. package/types/src/RadioList/Option.d.ts +6 -1
  54. package/types/src/RadioList/docs/examples/Description.d.ts +6 -0
  55. package/types/src/Select/Option.d.ts +8 -3
  56. package/types/src/Select/Select.d.ts +1 -1
  57. package/types/src/{Select → SelectBase}/OptionBase.d.ts +8 -2
  58. package/types/src/{Select → SelectBase}/SelectBase.d.ts +3 -1
  59. package/types/src/SelectBase/index.d.ts +2 -0
  60. package/types/src/Switch/Switch.d.ts +3 -0
  61. package/types/src/Table/Body.d.ts +6 -1
  62. package/types/src/Table/Cell.d.ts +5 -1
  63. package/types/src/Table/Head.d.ts +6 -2
  64. package/types/src/Table/HeadCell.d.ts +5 -1
  65. package/types/src/Table/Row.d.ts +5 -1
  66. package/types/src/Table/Table.d.ts +20 -1
  67. package/types/src/Table/TableContext.d.ts +1 -0
  68. package/types/src/Table/docs/examples/HorizontalOverflowScroll.d.ts +8 -0
  69. package/types/src/Table/docs/examples/PinActionColumn.d.ts +7 -0
  70. package/types/src/TransitionOpen/TransitionOpen.d.ts +3 -1
  71. package/types/src/useResizeObserver/useResizeObserver.d.ts +2 -0
  72. package/types/src/useRovingFocus/useRovingFocus.d.ts +8 -1
  73. package/usePrevious.d.ts +2 -0
  74. package/useResizeObserver.js +59 -92
  75. package/useRovingFocus.js +96 -41
  76. /package/types/src/{Select → SelectBase}/SelectAllOption.d.ts +0 -0
package/PhoneNumber.js ADDED
@@ -0,0 +1,769 @@
1
+ /******/ (() => {
2
+ // webpackBootstrap
3
+ /******/ "use strict";
4
+ /******/ var e = {
5
+ /***/ 5183:
6
+ /***/ e => {
7
+ e.exports = require("intl-tel-input/intlTelInputWithUtils");
8
+ /***/
9
+ /******/ }
10
+ };
11
+ /************************************************************************/
12
+ /******/ // The module cache
13
+ /******/ var r = {};
14
+ /******/
15
+ /******/ // The require function
16
+ /******/ function t(n) {
17
+ /******/ // Check if module is in cache
18
+ /******/ var a = r[n];
19
+ /******/ if (a !== undefined) {
20
+ /******/ return a.exports;
21
+ /******/ }
22
+ /******/ // Create a new module (and put it into the cache)
23
+ /******/ var o = r[n] = {
24
+ /******/ // no module.id needed
25
+ /******/ // no module.loaded needed
26
+ /******/ exports: {}
27
+ /******/ };
28
+ /******/
29
+ /******/ // Execute the module function
30
+ /******/ e[n](o, o.exports, t);
31
+ /******/
32
+ /******/ // Return the exports of the module
33
+ /******/ return o.exports;
34
+ /******/ }
35
+ /******/
36
+ /************************************************************************/
37
+ /******/ /* webpack/runtime/compat get default export */
38
+ /******/ (() => {
39
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
40
+ /******/ t.n = e => {
41
+ /******/ var r = e && e.__esModule ?
42
+ /******/ () => e["default"]
43
+ /******/ : () => e
44
+ /******/;
45
+ t.d(r, {
46
+ a: r
47
+ });
48
+ /******/ return r;
49
+ /******/ };
50
+ /******/ })();
51
+ /******/
52
+ /******/ /* webpack/runtime/create fake namespace object */
53
+ /******/ (() => {
54
+ /******/ var e = Object.getPrototypeOf ? e => Object.getPrototypeOf(e) : e => e.__proto__
55
+ /******/;
56
+ var r;
57
+ /******/ // create a fake namespace object
58
+ /******/ // mode & 1: value is a module id, require it
59
+ /******/ // mode & 2: merge all properties of value into the ns
60
+ /******/ // mode & 4: return value when already ns object
61
+ /******/ // mode & 16: return value when it's Promise-like
62
+ /******/ // mode & 8|1: behave like require
63
+ /******/ t.t = function(n, a) {
64
+ /******/ if (a & 1) n = this(n);
65
+ /******/ if (a & 8) return n;
66
+ /******/ if (typeof n === "object" && n) {
67
+ /******/ if (a & 4 && n.__esModule) return n;
68
+ /******/ if (a & 16 && typeof n.then === "function") return n;
69
+ /******/ }
70
+ /******/ var o = Object.create(null);
71
+ /******/ t.r(o);
72
+ /******/ var l = {};
73
+ /******/ r = r || [ null, e({}), e([]), e(e) ];
74
+ /******/ for (var i = a & 2 && n; typeof i == "object" && !~r.indexOf(i); i = e(i)) {
75
+ /******/ Object.getOwnPropertyNames(i).forEach((e => l[e] = () => n[e]));
76
+ /******/ }
77
+ /******/ l["default"] = () => n
78
+ /******/;
79
+ t.d(o, l);
80
+ /******/ return o;
81
+ /******/ };
82
+ /******/ })();
83
+ /******/
84
+ /******/ /* webpack/runtime/define property getters */
85
+ /******/ (() => {
86
+ /******/ // define getter functions for harmony exports
87
+ /******/ t.d = (e, r) => {
88
+ /******/ for (var n in r) {
89
+ /******/ if (t.o(r, n) && !t.o(e, n)) {
90
+ /******/ Object.defineProperty(e, n, {
91
+ enumerable: true,
92
+ get: r[n]
93
+ });
94
+ /******/ }
95
+ /******/ }
96
+ /******/ };
97
+ /******/ })();
98
+ /******/
99
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
100
+ /******/ (() => {
101
+ /******/ t.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
102
+ /******/;
103
+ })();
104
+ /******/
105
+ /******/ /* webpack/runtime/make namespace object */
106
+ /******/ (() => {
107
+ /******/ // define __esModule on exports
108
+ /******/ t.r = e => {
109
+ /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
110
+ /******/ Object.defineProperty(e, Symbol.toStringTag, {
111
+ value: "Module"
112
+ });
113
+ /******/ }
114
+ /******/ Object.defineProperty(e, "__esModule", {
115
+ value: true
116
+ });
117
+ /******/ };
118
+ /******/ })();
119
+ /******/
120
+ /************************************************************************/ var n = {};
121
+ // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
122
+ (() => {
123
+ // ESM COMPAT FLAG
124
+ t.r(n);
125
+ // EXPORTS
126
+ t.d(n, {
127
+ default: () => /* reexport */ X
128
+ });
129
+ // CONCATENATED MODULE: external "react"
130
+ const e = require("react");
131
+ var r = t.n(e);
132
+ // CONCATENATED MODULE: external "prop-types"
133
+ const a = require("prop-types");
134
+ var o = t.n(a);
135
+ // CONCATENATED MODULE: external "@splunk/react-ui/Button"
136
+ const l = require("@splunk/react-ui/Button");
137
+ var i = t.n(l);
138
+ // CONCATENATED MODULE: external "@splunk/react-ui/Select"
139
+ const u = require("@splunk/react-ui/Select");
140
+ var c = t.n(u);
141
+ // CONCATENATED MODULE: external "@splunk/react-ui/Text"
142
+ const f = require("@splunk/react-ui/Text");
143
+ var s = t.n(f);
144
+ // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
145
+ const v = require("@splunk/react-ui/useControlled");
146
+ var d = t.n(v);
147
+ // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
148
+ const p = require("@splunk/ui-utils/i18n");
149
+ // CONCATENATED MODULE: external "styled-components"
150
+ const y = require("styled-components");
151
+ var b = t.n(y);
152
+ // CONCATENATED MODULE: ./src/PhoneNumber/PhoneNumberStyles.ts
153
+ var m = "230px";
154
+ var g = b().div.withConfig({
155
+ displayName: "PhoneNumberStyles__StyledWrapper",
156
+ componentId: "sc-197mlvr-0"
157
+ })([ "display:flex;&[data-inline]{display:inline-flex;width:", ";flex-basis:", ";}" ], m, m);
158
+ var h = b().span.attrs({
159
+ "aria-hidden": "true"
160
+ }).withConfig({
161
+ displayName: "PhoneNumberStyles__StyledFlagIcon",
162
+ componentId: "sc-197mlvr-1"
163
+ })([ "" ]);
164
+ var C = b()(c()).withConfig({
165
+ displayName: "PhoneNumberStyles__StyledSelect",
166
+ componentId: "sc-197mlvr-2"
167
+ })([ "flex:0 1 auto;" ]);
168
+ var O = b().span.withConfig({
169
+ displayName: "PhoneNumberStyles__StyledCountryCode",
170
+ componentId: "sc-197mlvr-3"
171
+ })([ "min-width:4ch;" ]);
172
+ // CONCATENATED MODULE: external "intl-tel-input"
173
+ const S = require("intl-tel-input");
174
+ var P = t.n(S);
175
+ // CONCATENATED MODULE: ./src/PhoneNumber/utils.ts
176
+ // TODO(SUI-8145): Remove eslint-disable, needed for now for utils import
177
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
178
+ // this is the fallback validation length if utils fail to load
179
+ // the shortest valid phone number is 4 digits, for Niue (iso2 code "nu")
180
+ var j = 4;
181
+ var w = /[^+0-9]/g;
182
+ var k = "🌐";
183
+ var E = null;
184
+ var N = function e() {
185
+ if (!E) {
186
+ E = Promise.resolve().then(t.t.bind(t, 5183, 23)).then((function(e) {
187
+ var r, t;
188
+ return (r = (t = e["default"] || e) === null || t === void 0 ? void 0 : t.utils) !== null && r !== void 0 ? r : null;
189
+ }))["catch"]((function(e) {
190
+ // eslint-disable-next-line no-console
191
+ console.error("Error loading intl-tel-input utils:", e);
192
+ return null;
193
+ }));
194
+ }
195
+ return E;
196
+ };
197
+ var x = function e(r) {
198
+ if (!r || r.length !== 2) {
199
+ return k;
200
+ }
201
+ // this converts ISO2 country code to corresponding emoji flag
202
+ // by converting each character to its regional indicator symbol
203
+ // and then returning the combined value, which maps to the flag emoji
204
+ // 127397 (127462 - 65) is the offset between ASCII uppercase letters and regional indicator symbols
205
+ // because the character A starts at 65 in ASCII and regional indicator A starts at 127462 in Unicode
206
+ return r.toUpperCase().replace(/./g, (function(e) {
207
+ return String.fromCodePoint(e.charCodeAt(0) + 127397);
208
+ }));
209
+ };
210
+ var _ = function e() {
211
+ return P().getCountryData().map((function(e) {
212
+ return {
213
+ areaCodes: e.areaCodes,
214
+ countryName: e.name,
215
+ dialCode: e.dialCode,
216
+ flag: x(e.iso2),
217
+ iso2: e.iso2,
218
+ iso2Upper: e.iso2.toUpperCase(),
219
+ nationalPrefix: e.nationalPrefix,
220
+ priority: e.priority
221
+ };
222
+ }));
223
+ };
224
+ var R = function e(r, t, n) {
225
+ var a;
226
+ // intlFormat always has a leading plus sign
227
+ // but it may be incorrect (ie. inserting a double country code)
228
+ // for incomplete numbers, so we also check the input value
229
+ // and only format if the input value starts with a plus sign
230
+ if (!r.startsWith("+") || !t.startsWith("+")) {
231
+ return null;
232
+ }
233
+ var o = t.slice(1);
234
+ var l = null;
235
+ var i = null;
236
+ for (var u = 0; u < n.length; u += 1) {
237
+ // if we have a primary match already, we can stop checking
238
+ // but if we only have a secondary match, we need to keep looking
239
+ if (l) {
240
+ break;
241
+ }
242
+ var c = n[u];
243
+ if (o.startsWith(c.dialCode)) {
244
+ if (c.areaCodes && c.areaCodes.length > 0) {
245
+ var f = o.slice(c.dialCode.length);
246
+ for (var s = 0; s < c.areaCodes.length; s += 1) {
247
+ var v = c.areaCodes[s];
248
+ if (f.startsWith(v)) {
249
+ l = c;
250
+ break;
251
+ }
252
+ }
253
+ } else {
254
+ i = c;
255
+ }
256
+ }
257
+ }
258
+ // Prioritize countries with matching area codes over those without
259
+ // for example, +17788888888 should match Canada (area code 778 is a Canadian area code)
260
+ // but it also matches US (because the US matches any +1 number regardless of area code)
261
+ // so prefer the more specific match
262
+ return (a = l) !== null && a !== void 0 ? a : i;
263
+ };
264
+ /**
265
+ * Main function to process phone input using intl-tel-input utilities
266
+ */ var V = function e(r, t) {
267
+ var n = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "US";
268
+ var a = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
269
+ var o = n.toLowerCase();
270
+ var l = t.replace(w, "");
271
+ var i = l;
272
+ var u = l;
273
+ var c = false;
274
+ var f = false;
275
+ var s = n;
276
+ if (r) {
277
+ // Formats as the user types, so incomplete input may still be formatted
278
+ i = r.formatNumberAsYouType(l, o).trim() || l;
279
+ // Create E164 format
280
+ u = r.formatNumber(l, o, r.numberFormat.E164) || l;
281
+ c = r.isPossibleNumber(l, o);
282
+ f = r.isValidNumber(l, o);
283
+ var v = R(i, u, a);
284
+ if (v != null) {
285
+ s = v.iso2Upper;
286
+ }
287
+ } else {
288
+ // if utils fail to load, we accept any input of length MIN_NUMBER_LENGTH or more as valid
289
+ // given that front-end validation should only be used as a hint to the user
290
+ // and proper validation should be done on the back-end;
291
+ // it is better to allow potentially invalid input than to risk blocking user flows
292
+ c = l.length >= j;
293
+ f = l.length >= j;
294
+ }
295
+ return {
296
+ displayValue: i,
297
+ value: l,
298
+ internationalFormat: u,
299
+ country: s,
300
+ isPossibleNumber: c,
301
+ isValidNumber: f
302
+ };
303
+ };
304
+ var I = function e(r, t, n, a) {
305
+ var o = a.find((function(e) {
306
+ return e.iso2Upper === t;
307
+ }));
308
+ var l = a.find((function(e) {
309
+ return e.iso2Upper === n;
310
+ }));
311
+ if (r.startsWith("+") && t !== n && o != null && l != null) {
312
+ var i = o.dialCode;
313
+ var u = l.dialCode;
314
+ if (i && u) {
315
+ return r.replace(new RegExp("^\\+".concat(i)), "+".concat(u));
316
+ }
317
+ }
318
+ return r;
319
+ };
320
+ // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
321
+ /**
322
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
323
+ *
324
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
325
+ * @param current - The new value of the ref.
326
+ */
327
+ function T(e, r) {
328
+ if (e) {
329
+ if (typeof e === "function") {
330
+ e(r);
331
+ } else {
332
+ // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
333
+ // the intention here is to signal "we will take care of setting 'current', not you".
334
+ e.current = r;
335
+ // eslint-disable-line no-param-reassign
336
+ }
337
+ }
338
+ }
339
+ // CONCATENATED MODULE: ./src/PhoneNumber/PhoneNumber.tsx
340
+ function U(e) {
341
+ "@babel/helpers - typeof";
342
+ return U = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
343
+ return typeof e;
344
+ } : function(e) {
345
+ return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
346
+ }, U(e);
347
+ }
348
+ function B() {
349
+ return B = Object.assign ? Object.assign.bind() : function(e) {
350
+ for (var r = 1; r < arguments.length; r++) {
351
+ var t = arguments[r];
352
+ for (var n in t) {
353
+ ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
354
+ }
355
+ }
356
+ return e;
357
+ }, B.apply(null, arguments);
358
+ }
359
+ function M(e, r) {
360
+ var t = Object.keys(e);
361
+ if (Object.getOwnPropertySymbols) {
362
+ var n = Object.getOwnPropertySymbols(e);
363
+ r && (n = n.filter((function(r) {
364
+ return Object.getOwnPropertyDescriptor(e, r).enumerable;
365
+ }))), t.push.apply(t, n);
366
+ }
367
+ return t;
368
+ }
369
+ function q(e) {
370
+ for (var r = 1; r < arguments.length; r++) {
371
+ var t = null != arguments[r] ? arguments[r] : {};
372
+ r % 2 ? M(Object(t), !0).forEach((function(r) {
373
+ D(e, r, t[r]);
374
+ })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : M(Object(t)).forEach((function(r) {
375
+ Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
376
+ }));
377
+ }
378
+ return e;
379
+ }
380
+ function D(e, r, t) {
381
+ return (r = F(r)) in e ? Object.defineProperty(e, r, {
382
+ value: t,
383
+ enumerable: !0,
384
+ configurable: !0,
385
+ writable: !0
386
+ }) : e[r] = t, e;
387
+ }
388
+ function F(e) {
389
+ var r = A(e, "string");
390
+ return "symbol" == U(r) ? r : r + "";
391
+ }
392
+ function A(e, r) {
393
+ if ("object" != U(e) || !e) return e;
394
+ var t = e[Symbol.toPrimitive];
395
+ if (void 0 !== t) {
396
+ var n = t.call(e, r || "default");
397
+ if ("object" != U(n)) return n;
398
+ throw new TypeError("@@toPrimitive must return a primitive value.");
399
+ }
400
+ return ("string" === r ? String : Number)(e);
401
+ }
402
+ function W(e, r) {
403
+ return Y(e) || z(e, r) || L(e, r) || K();
404
+ }
405
+ function K() {
406
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
407
+ }
408
+ function L(e, r) {
409
+ if (e) {
410
+ if ("string" == typeof e) return $(e, r);
411
+ var t = {}.toString.call(e).slice(8, -1);
412
+ return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? $(e, r) : void 0;
413
+ }
414
+ }
415
+ function $(e, r) {
416
+ (null == r || r > e.length) && (r = e.length);
417
+ for (var t = 0, n = Array(r); t < r; t++) {
418
+ n[t] = e[t];
419
+ }
420
+ return n;
421
+ }
422
+ function z(e, r) {
423
+ var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
424
+ if (null != t) {
425
+ var n, a, o, l, i = [], u = !0, c = !1;
426
+ try {
427
+ if (o = (t = t.call(e)).next, 0 === r) {
428
+ if (Object(t) !== t) return;
429
+ u = !1;
430
+ } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
431
+ }
432
+ } catch (e) {
433
+ c = !0, a = e;
434
+ } finally {
435
+ try {
436
+ if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
437
+ } finally {
438
+ if (c) throw a;
439
+ }
440
+ }
441
+ return i;
442
+ }
443
+ }
444
+ function Y(e) {
445
+ if (Array.isArray(e)) return e;
446
+ }
447
+ function G(e, r) {
448
+ if (null == e) return {};
449
+ var t, n, a = H(e, r);
450
+ if (Object.getOwnPropertySymbols) {
451
+ var o = Object.getOwnPropertySymbols(e);
452
+ for (n = 0; n < o.length; n++) {
453
+ t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
454
+ }
455
+ }
456
+ return a;
457
+ }
458
+ function H(e, r) {
459
+ if (null == e) return {};
460
+ var t = {};
461
+ for (var n in e) {
462
+ if ({}.hasOwnProperty.call(e, n)) {
463
+ if (-1 !== r.indexOf(n)) continue;
464
+ t[n] = e[n];
465
+ }
466
+ }
467
+ return t;
468
+ }
469
+ /** @public */
470
+ /** @public */
471
+ /** @public */ var J = {
472
+ append: o().bool,
473
+ canClear: o().bool,
474
+ defaultCountry: o().string,
475
+ defaultValue: o().string,
476
+ describedBy: o().string,
477
+ disabled: o().bool,
478
+ elementRef: o().oneOfType([ o().func, o().object ]),
479
+ error: o().bool,
480
+ inline: o().bool,
481
+ inputId: o().string,
482
+ inputRef: o().oneOfType([ o().func, o().object ]),
483
+ labelledBy: o().string,
484
+ name: o().string,
485
+ onBlur: o().func,
486
+ onChange: o().func,
487
+ onClick: o().func,
488
+ onFocus: o().func,
489
+ onSelect: o().func,
490
+ prepend: o().bool,
491
+ /** @private */
492
+ skipFormatting: o().bool,
493
+ value: o().string
494
+ };
495
+ function Q(t) {
496
+ var n = t.append, a = t.canClear, o = a === void 0 ? true : a, l = t.defaultCountry, c = t.defaultValue, f = t.describedBy, v = t.disabled, y = t.elementRef, b = t.error, m = t.inline, S = t.inputRef, P = t.name, j = t.onBlur, w = t.onChange, E = t.onFocus, x = t.prepend, R = t.skipFormatting, U = t.toggleRef, M = t.value, D = G(t, [ "append", "canClear", "defaultCountry", "defaultValue", "describedBy", "disabled", "elementRef", "error", "inline", "inputRef", "name", "onBlur", "onChange", "onFocus", "prepend", "skipFormatting", "toggleRef", "value" ]);
497
+ // @docs-props-type PhoneNumberPropsBase
498
+ var F = d()({
499
+ componentName: "PhoneNumber",
500
+ /* eslint-disable-next-line prefer-rest-params */
501
+ componentProps: arguments[0]
502
+ });
503
+ var A = (0, e.useState)(_), K = W(A, 1), L = K[0];
504
+ var $ = (0, e.useState)(null), z = W($, 2), Y = z[0], H = z[1];
505
+ (0, e.useEffect)((function() {
506
+ if (!R) {
507
+ N().then((function(e) {
508
+ H(e);
509
+ }));
510
+ }
511
+ }), [ R ]);
512
+ // processPhoneInputImpl needs utils, so we memoize that here to avoid including them on each call
513
+ var J = (0, e.useCallback)((function(e, r) {
514
+ return V(Y, e, r, L);
515
+ }), [ L, Y ]);
516
+ // If country prop is not passed, use Intl.Locale to get the region from the user's language, falls back to US
517
+ var Q = new Intl.Locale(navigator.language);
518
+ var X = (0, e.useState)(l || Q.region || "US"), Z = W(X, 2), ee = Z[0], re = Z[1];
519
+ var te = (0, e.useRef)(null);
520
+ var ne = (0, e.useRef)(0);
521
+ var ae = (0, e.useCallback)((function(e) {
522
+ T(te, e);
523
+ T(S, e);
524
+ }), [ S ]);
525
+ var oe = (0, e.useState)(""), le = W(oe, 2), ie = le[0], ue = le[1];
526
+ var ce = (0, e.useState)(""), fe = W(ce, 2), se = fe[0], ve = fe[1];
527
+ // this effect formats the phone number on mount
528
+ (0, e.useEffect)((function() {
529
+ var e = F ? M : c;
530
+ if (e) {
531
+ var r = J(e, ee);
532
+ ue(r.value);
533
+ re(r.country);
534
+ if (!F) {
535
+ ve(r.displayValue);
536
+ }
537
+ }
538
+ // this effect should only run on mount
539
+ // eslint-disable-next-line react-hooks/exhaustive-deps
540
+ }), []);
541
+ (0, e.useLayoutEffect)((function() {
542
+ if (!R && te.current) {
543
+ te.current.selectionStart = ne.current;
544
+ te.current.selectionEnd = ne.current;
545
+ }
546
+ }));
547
+ // Update display value when controlled value or country changes
548
+ (0, e.useEffect)((function() {
549
+ var e = "";
550
+ var r = ee;
551
+ var t = null;
552
+ if (F && M) {
553
+ t = M;
554
+ } else if (!F && ie) {
555
+ t = ie;
556
+ }
557
+ if (t) {
558
+ var n = J(t, ee);
559
+ r = n.country;
560
+ e = n.displayValue;
561
+ }
562
+ ve(e);
563
+ re(r);
564
+ }), [ M, ie, ee, F, J ]);
565
+ var de = (0, e.useCallback)((function(e, r) {
566
+ var t;
567
+ var n = r.value;
568
+ var a = J(n, ee);
569
+ if (!F) {
570
+ ue(a.value);
571
+ }
572
+ var o = ((t = te.current) === null || t === void 0 ? void 0 : t.selectionStart) || 0;
573
+ var l = n.slice(0, o);
574
+ var i = (l.match(/\d/g) || []).length;
575
+ var u = l.match(/\D*$/);
576
+ var c = u ? u[0].length : 0;
577
+ var f = function e(r, t) {
578
+ if (t <= 0) {
579
+ return -1;
580
+ }
581
+ var n = 0;
582
+ for (var a = 0; a < r.length; a += 1) {
583
+ if (/\d/.test(r[a])) {
584
+ n += 1;
585
+ if (n === t) {
586
+ return a;
587
+ }
588
+ }
589
+ }
590
+ return -1;
591
+ };
592
+ var s = a.displayValue.length;
593
+ if (i === 0) {
594
+ var v = f(a.displayValue, 1);
595
+ var d = v === -1 ? a.displayValue.length : v;
596
+ s = Math.min(c, d);
597
+ } else {
598
+ var p = f(a.displayValue, i);
599
+ if (p === -1) {
600
+ s = a.displayValue.length;
601
+ } else {
602
+ var y = f(a.displayValue, i + 1);
603
+ var b = Math.max(0, (y === -1 ? a.displayValue.length : y) - (p + 1));
604
+ var m = Math.min(c, b);
605
+ s = p + 1 + m;
606
+ }
607
+ }
608
+ ne.current = s;
609
+ w === null || w === void 0 ? void 0 : w(e, q({
610
+ name: P
611
+ }, a));
612
+ }), [ ee, F, P, w, J ]);
613
+ var pe = (0, e.useCallback)((function(e) {
614
+ var r = e.target.value;
615
+ j === null || j === void 0 ? void 0 : j(e, q({
616
+ name: P
617
+ }, J(r, ee)));
618
+ }), [ ee, P, j, J ]);
619
+ var ye = (0, e.useCallback)((function(e) {
620
+ var r = e.target.value;
621
+ E === null || E === void 0 ? void 0 : E(e, q({
622
+ name: P
623
+ }, J(r, ee)));
624
+ }), [ ee, P, E, J ]);
625
+ var be = (0, e.useCallback)((function(e) {
626
+ if (R) {
627
+ return;
628
+ }
629
+ var r = e.key;
630
+ var t = e.currentTarget;
631
+ var n = t.selectionStart || 0;
632
+ var a = t.selectionEnd || 0;
633
+ var o = n;
634
+ var l = r === "Backspace";
635
+ var i = r === "Delete";
636
+ var u = r.length === 1 && !/\d/.test(r) && !e.ctrlKey && !e.metaKey && !e.altKey;
637
+ var c = r === "+" && n === 0;
638
+ if (u && !l && !i && !c) {
639
+ // prevent non-numeric keys from being entered
640
+ e.preventDefault();
641
+ return;
642
+ }
643
+ if ((l || i || c) && n === a) {
644
+ if (l) {
645
+ // if the affected character is a non-digit, adjust the caret position to before the next digit
646
+ while (o > 0) {
647
+ var f = t.value[o - 1];
648
+ if (/[\d+]/.test(f)) {
649
+ break;
650
+ }
651
+ o -= 1;
652
+ }
653
+ } else if (i) {
654
+ // if the affected character is a non-digit, adjust the caret position to after the next digit
655
+ while (o < t.value.length) {
656
+ var s = t.value[o];
657
+ if (/[\d+]/.test(s)) {
658
+ break;
659
+ }
660
+ o += 1;
661
+ }
662
+ } else if (c && t.value.startsWith("+")) {
663
+ // if the first character is already a plus, skip over it
664
+ o += 1;
665
+ }
666
+ if (o !== n) {
667
+ var v;
668
+ // if the caret position has changed, prevent the keystroke from taking effect and set the new position
669
+ // if the key wasn't backspace or delete, or if the caret position wasn't changed because the prev/next
670
+ // character was a digit, let the key event proceed normally and be handled in onChange
671
+ e.preventDefault();
672
+ ne.current = o;
673
+ (v = te.current) === null || v === void 0 ? void 0 : v.setSelectionRange(o, o);
674
+ }
675
+ }
676
+ }), [ R ]);
677
+ var me = (0, e.useCallback)((function(e, r) {
678
+ var t = r.value;
679
+ if (te.current && typeof t === "string") {
680
+ var n = te.current.value;
681
+ var a = I(n, ee, t, L);
682
+ re(t);
683
+ var o = J(a, t);
684
+ if (!F) {
685
+ ue(o.value);
686
+ }
687
+ w === null || w === void 0 ? void 0 : w(e, q({
688
+ name: P
689
+ }, o));
690
+ }
691
+ }), [ ee, L, F, P, w, J, re ]);
692
+ var ge = (0, e.useMemo)((function() {
693
+ var e = L.find((function(e) {
694
+ return e.iso2Upper === ee;
695
+ }));
696
+ if (!e) {
697
+ if (false) {}
698
+ }
699
+ var t = e || {
700
+ flag: k
701
+ }, n = t.flag;
702
+
703
+ return r().createElement(i(), {
704
+ append: true,
705
+ icon: n,
706
+ isMenu: true
707
+ });
708
+ }), [ L, ee ]);
709
+ var he = (0, e.useMemo)((function() {
710
+ return L.map((function(e) {
711
+ var t = e.countryName, n = e.dialCode, a = e.flag, o = e.iso2Upper;
712
+
713
+ return r().createElement(u.Option, {
714
+ icon: r().createElement(h, null, a),
715
+ key: o,
716
+ label: "".concat(t, " +").concat(n),
717
+ value: o,
718
+ endAdornment: r().createElement(O, null, "+", n)
719
+ }, t);
720
+ }));
721
+ }), [ L ]);
722
+
723
+ return r().createElement(g, {
724
+ "data-inline": m || undefined,
725
+ "data-test": "phone-number",
726
+ "data-test-disabled": v ? "disabled" : undefined
727
+ }, r().createElement(C, {
728
+ "aria-label": (0, p._)("Country code"),
729
+ append: true,
730
+ disabled: v,
731
+ elementRef: U,
732
+ error: b,
733
+ filter: true,
734
+ toggle: ge,
735
+ onChange: me,
736
+ prepend: x,
737
+ value: ee
738
+ }, he), r().createElement(s(), B({
739
+ append: n,
740
+ "aria-describedby": f,
741
+ "aria-invalid": b,
742
+ autoCapitalize: "off",
743
+ autoComplete: "tel",
744
+ autoCorrect: "off",
745
+ canClear: o,
746
+ disabled: v,
747
+ describedBy: f,
748
+ elementRef: y,
749
+ error: b,
750
+ inputRef: ae,
751
+ name: P,
752
+ onBlur: pe,
753
+ onChange: de,
754
+ onFocus: ye,
755
+ prepend: true,
756
+ type: "tel",
757
+ value: se,
758
+ onKeyDown: be
759
+ }, D, {
760
+ spellCheck: false
761
+ })));
762
+ }
763
+ Q.componentType = "PhoneNumber";
764
+ Q.propTypes = J;
765
+ /* harmony default export */ const X = Q;
766
+ }) // CONCATENATED MODULE: ./src/PhoneNumber/index.ts
767
+ ();
768
+ module.exports = n;
769
+ /******/})();