@splunk/react-ui 5.4.0 → 5.6.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 (89) hide show
  1. package/AnchorMenu.d.ts +2 -0
  2. package/AnchorMenu.js +286 -0
  3. package/Badge.d.ts +2 -0
  4. package/Badge.js +154 -0
  5. package/CHANGELOG.md +42 -0
  6. package/Code.js +1097 -500
  7. package/Color.js +142 -141
  8. package/ComboBox.js +6 -5
  9. package/Link.js +74 -44
  10. package/MIGRATION.md +32 -1
  11. package/Menu.js +41 -43
  12. package/Multiselect.js +615 -2156
  13. package/Number.js +3 -3
  14. package/PhoneNumber.d.ts +2 -0
  15. package/PhoneNumber.js +769 -0
  16. package/Popover.js +73 -75
  17. package/RadioList.js +166 -151
  18. package/ResultsMenu.js +27 -29
  19. package/Select.js +179 -1768
  20. package/SelectBase.d.ts +2 -0
  21. package/SelectBase.js +1714 -0
  22. package/Slider.js +358 -302
  23. package/SlidingPanels.js +55 -62
  24. package/Switch.js +42 -27
  25. package/TabBar.js +295 -294
  26. package/TabLayout.js +14 -14
  27. package/Table.js +1087 -1040
  28. package/TransitionOpen.js +65 -58
  29. package/cypress/support/commands.ts +40 -0
  30. package/cypress/support/component.ts +1 -1
  31. package/cypress/support/index.d.ts +22 -0
  32. package/docker-compose.yml +99 -52
  33. package/package.json +9 -5
  34. package/stubs-splunkui.d.ts +0 -86
  35. package/test-runner-jest.config.js +1 -0
  36. package/types/src/AnchorMenu/AnchorMenu.d.ts +36 -0
  37. package/types/src/AnchorMenu/AnchorMenuContext.d.ts +6 -0
  38. package/types/src/AnchorMenu/Item.d.ts +35 -0
  39. package/types/src/AnchorMenu/docs/examples/Basic.d.ts +6 -0
  40. package/types/src/AnchorMenu/index.d.ts +3 -0
  41. package/types/src/Badge/Badge.d.ts +29 -0
  42. package/types/src/Badge/docs/examples/Basic.d.ts +5 -0
  43. package/types/src/Badge/docs/examples/Count.d.ts +6 -0
  44. package/types/src/Badge/docs/examples/CustomColors.d.ts +8 -0
  45. package/types/src/Badge/docs/examples/Icon.d.ts +6 -0
  46. package/types/src/Badge/index.d.ts +2 -0
  47. package/types/src/Code/Code.d.ts +4 -3
  48. package/types/src/Code/index.d.ts +1 -0
  49. package/types/src/Link/Link.d.ts +4 -0
  50. package/types/src/Link/LinkContext.d.ts +14 -0
  51. package/types/src/Link/docs/examples/Visited.d.ts +7 -0
  52. package/types/src/Link/index.d.ts +1 -0
  53. package/types/src/Menu/Item.d.ts +1 -1
  54. package/types/src/Multiselect/Compact.d.ts +8 -1
  55. package/types/src/Multiselect/Multiselect.d.ts +8 -1
  56. package/types/src/PhoneNumber/PhoneNumber.d.ts +139 -0
  57. package/types/src/PhoneNumber/docs/examples/Controlled.d.ts +7 -0
  58. package/types/src/PhoneNumber/docs/examples/DefaultCountry.d.ts +7 -0
  59. package/types/src/PhoneNumber/docs/examples/Disabled.d.ts +6 -0
  60. package/types/src/PhoneNumber/docs/examples/Error.d.ts +6 -0
  61. package/types/src/PhoneNumber/docs/examples/Inline.d.ts +7 -0
  62. package/types/src/PhoneNumber/docs/examples/Uncontrolled.d.ts +7 -0
  63. package/types/src/PhoneNumber/index.d.ts +2 -0
  64. package/types/src/PhoneNumber/utils.d.ts +47 -0
  65. package/types/src/RadioList/Option.d.ts +6 -1
  66. package/types/src/RadioList/docs/examples/Description.d.ts +6 -0
  67. package/types/src/Select/Option.d.ts +8 -3
  68. package/types/src/Select/Select.d.ts +1 -1
  69. package/types/src/{Select → SelectBase}/OptionBase.d.ts +8 -2
  70. package/types/src/{Select → SelectBase}/SelectBase.d.ts +11 -2
  71. package/types/src/SelectBase/index.d.ts +2 -0
  72. package/types/src/Slider/Slider.d.ts +7 -1
  73. package/types/src/Switch/Switch.d.ts +4 -1
  74. package/types/src/Table/Body.d.ts +6 -1
  75. package/types/src/Table/Cell.d.ts +5 -1
  76. package/types/src/Table/Head.d.ts +6 -2
  77. package/types/src/Table/HeadCell.d.ts +5 -1
  78. package/types/src/Table/Row.d.ts +5 -1
  79. package/types/src/Table/Table.d.ts +20 -1
  80. package/types/src/Table/TableContext.d.ts +1 -0
  81. package/types/src/Table/docs/examples/HorizontalOverflowScroll.d.ts +8 -0
  82. package/types/src/Table/docs/examples/PinActionColumn.d.ts +7 -0
  83. package/types/src/TransitionOpen/TransitionOpen.d.ts +3 -1
  84. package/types/src/useResizeObserver/useResizeObserver.d.ts +2 -0
  85. package/types/src/useRovingFocus/useRovingFocus.d.ts +8 -1
  86. package/usePrevious.d.ts +2 -0
  87. package/useResizeObserver.js +59 -92
  88. package/useRovingFocus.js +96 -41
  89. /package/types/src/{Select → SelectBase}/SelectAllOption.d.ts +0 -0
package/ResultsMenu.js CHANGED
@@ -150,7 +150,7 @@
150
150
  }, k.apply(null, arguments);
151
151
  }
152
152
  function j(e, r) {
153
- return A(e) || x(e, r) || R(e, r) || I();
153
+ return x(e) || T(e, r) || R(e, r) || I();
154
154
  }
155
155
  function I() {
156
156
  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
@@ -169,7 +169,7 @@
169
169
  }
170
170
  return t;
171
171
  }
172
- function x(e, r) {
172
+ function T(e, r) {
173
173
  var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
174
174
  if (null != n) {
175
175
  var t, o, a, i, u = [], l = !0, c = !1;
@@ -191,10 +191,10 @@
191
191
  return u;
192
192
  }
193
193
  }
194
- function A(e) {
194
+ function x(e) {
195
195
  if (Array.isArray(e)) return e;
196
196
  }
197
- function T(e, r) {
197
+ function A(e, r) {
198
198
  if (null == e) return {};
199
199
  var n, t, o = L(e, r);
200
200
  if (Object.getOwnPropertySymbols) {
@@ -237,7 +237,7 @@
237
237
  var N = 400;
238
238
  var H = 28;
239
239
  function F(e) {
240
- var r = e.animateLoading, o = e["aria-multiselectable"], a = e.children, i = e.childrenStart, c = e.elementRef, s = e.focusMode, d = e.footerMessage, v = e.isLoading, m = e.labelledBy, b = e.loadingMessage, p = b === void 0 ? q : b, y = e.menuId, I = e.noOptionsMessage, R = I === void 0 ? D : I, P = e.onScroll, x = e.onScrollBottom, A = e.placement, L = e.style, _ = e.tabIndex, F = T(e, [ "animateLoading", "aria-multiselectable", "children", "childrenStart", "elementRef", "focusMode", "footerMessage", "isLoading", "labelledBy", "loadingMessage", "menuId", "noOptionsMessage", "onScroll", "onScrollBottom", "placement", "style", "tabIndex" ]);
240
+ var r = e.animateLoading, o = e["aria-multiselectable"], a = e.children, i = e.childrenStart, c = e.elementRef, s = e.focusMode, d = e.footerMessage, v = e.isLoading, m = e.labelledBy, b = e.loadingMessage, p = b === void 0 ? q : b, y = e.menuId, I = e.noOptionsMessage, R = I === void 0 ? D : I, P = e.onScroll, T = e.onScrollBottom, x = e.placement, L = e.style, _ = e.tabIndex, F = A(e, [ "animateLoading", "aria-multiselectable", "children", "childrenStart", "elementRef", "focusMode", "footerMessage", "isLoading", "labelledBy", "loadingMessage", "menuId", "noOptionsMessage", "onScroll", "onScrollBottom", "placement", "style", "tabIndex" ]);
241
241
  // @docs-props-type ResultsMenuPropsBase
242
242
  var B = (0, n.useState)(undefined), U = j(B, 2), z = U[0], V = U[1];
243
243
  var K = (0, n.useState)(null), W = j(K, 2), $ = W[0], G = W[1];
@@ -269,11 +269,11 @@
269
269
  var ye = (0, n.useCallback)((function(e) {
270
270
  if (!ce) {
271
271
  se(true);
272
- x === null || x === void 0 ? void 0 : x(e);
272
+ T === null || T === void 0 ? void 0 : T(e);
273
273
  }
274
- }), [ ce, x ]);
274
+ }), [ ce, T ]);
275
275
  var ge = (0, n.useCallback)((function(e) {
276
- if (x && e.target && Q) {
276
+ if (T && e.target && Q) {
277
277
  var r = Q.scrollHeight - Q.offsetHeight - N;
278
278
  // Adding 1 due to border of menu item.
279
279
  if (Q.scrollTop + 1 >= r) {
@@ -281,7 +281,7 @@
281
281
  }
282
282
  }
283
283
  P === null || P === void 0 ? void 0 : P(e);
284
- }), [ ye, Q, P, x ]);
284
+ }), [ ye, Q, P, T ]);
285
285
  var he = (0, n.useCallback)((function() {
286
286
  var e = n.Children.count(a);
287
287
  // If menu is full length, load more items.
@@ -304,10 +304,10 @@
304
304
  return;
305
305
  }
306
306
  // If onScrollBottom is defined, determine if it should be triggered.
307
- if (x && a) {
307
+ if (T && a) {
308
308
  he();
309
309
  }
310
- }), [ $, Q, a, x, he ]);
310
+ }), [ $, Q, a, T, he ]);
311
311
  // Assumption: that you cannot be filtered if you are a result
312
312
  var Se = n.Children.toArray(a).filter(n.isValidElement).some((function(e) {
313
313
  var r = e.type;
@@ -328,22 +328,22 @@
328
328
  }), [ s ]);
329
329
  var Ce = (0, n.useCallback)((function() {
330
330
  var e = !!n.Children.toArray(a).length;
331
- return d && e && t().createElement(t().Fragment, null, A !== "above" && t().createElement(u(), null), t().createElement(S, {
331
+ return d && e && t().createElement(t().Fragment, null, x !== "above" && t().createElement(u(), null), t().createElement(S, {
332
332
  "data-test": "footer-message",
333
333
  key: "footer"
334
- }, d), A === "above" && t().createElement(u(), null));
335
- }), [ d, a, A ]);
334
+ }, d), x === "above" && t().createElement(u(), null));
335
+ }), [ d, a, x ]);
336
336
 
337
337
  return t().createElement(h, k({
338
338
  "data-test": "results-menu",
339
339
  key: "wrapper",
340
340
  ref: de,
341
- onWheel: x ? be : undefined,
342
- onMouseEnter: x ? ve : undefined,
343
- onMouseLeave: x ? me : undefined
341
+ onWheel: T ? be : undefined,
342
+ onMouseEnter: T ? ve : undefined,
343
+ onMouseLeave: T ? me : undefined
344
344
  }, F, {
345
345
  style: L
346
- }), A !== "above" && i, A === "above" && Ce(), t().createElement(l.MenuContext.Provider, {
346
+ }), x !== "above" && i, x === "above" && Ce(), t().createElement(l.MenuContext.Provider, {
347
347
  value: we()
348
348
  }, t().createElement(g, {
349
349
  "aria-multiselectable": o,
@@ -358,7 +358,7 @@
358
358
  }, Me && t().createElement(O, {
359
359
  "data-test": "no-results-message",
360
360
  disabled: true
361
- }, R), a, x && !Ee &&
361
+ }, R), a, T && !Ee &&
362
362
 
363
363
  // Bottom spacer fills in the space of new items being loaded by using the minimum possible height x menuItems.
364
364
  t().createElement("div", {
@@ -366,7 +366,7 @@
366
366
  style: Oe
367
367
  }), v && t().createElement(E, null, r && t().createElement(M, null), t().createElement(w, null, p)))), t().createElement(f(), {
368
368
  "aria-live": "polite"
369
- }, Me && R), A !== "above" && Ce(), A === "above" && i);
369
+ }, Me && R), x !== "above" && Ce(), x === "above" && i);
370
370
  }
371
371
  F.propTypes = _;
372
372
  /* harmony default export */ const B = F;
@@ -775,7 +775,7 @@
775
775
  trackLastElement: true
776
776
  })));
777
777
  }), []);
778
- var P = (0, n.useState)(R), x = oe(P, 2), A = x[0], T = x[1];
778
+ var P = (0, n.useState)(R), T = oe(P, 2), x = T[0], A = T[1];
779
779
  var L = (0, n.useCallback)((function(e) {
780
780
  var r = M.current;
781
781
  M.current = Math.max(0, Math.min(e, O.current.length - 1));
@@ -783,7 +783,7 @@
783
783
  // no change in current pane
784
784
  return;
785
785
  }
786
- T(R);
786
+ A(R);
787
787
  }), [ R ]);
788
788
  // Link an IntersectionObserver instance with the menu children to be observed
789
789
  var _ = (0, n.useCallback)((function(e) {
@@ -882,11 +882,9 @@
882
882
  var d = (0, V.getSortedTabbableElements)(r, {
883
883
  ignoreTabIndex: true
884
884
  });
885
- var v = (e === null || e === void 0 ? void 0 : e.target) instanceof Element ? e.target : null;
886
- var m = r === null || r === void 0 ? void 0 : r.querySelector(":focus");
887
- var y = v || m;
888
- var g = y ? d.indexOf(y) : -1;
889
- (0, V.handleFocus)(n, d, g, {
885
+ var v = e.target instanceof HTMLElement ? e.target : r === null || r === void 0 ? void 0 : r.querySelector(":focus");
886
+ var m = v instanceof HTMLElement ? d.indexOf(v) : -1;
887
+ (0, V.handleFocus)(n, d, m, {
890
888
  enableLoop: false,
891
889
  // VirtualizedResultsMenu does not support looping focus
892
890
  orientation: "vertical",
@@ -902,7 +900,7 @@
902
900
  }), [ o ]);
903
901
  (0, n.useEffect)((function() {
904
902
  O.current = W(g, v);
905
- T(R);
903
+ A(R);
906
904
  }), [ g, v, R ]);
907
905
  (0, n.useEffect)((function() {
908
906
  return function() {
@@ -926,7 +924,7 @@
926
924
  return t().createElement(B, Z({
927
925
  elementRef: _,
928
926
  focusMode: l
929
- }, c), A);
927
+ }, c), x);
930
928
  }
931
929
  he.propTypes = ye;
932
930
  // CONCATENATED MODULE: ./src/utils/ssrDocument.ts