@splunk/react-ui 5.0.0 → 5.1.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 (94) hide show
  1. package/Accordion.js +59 -59
  2. package/Avatar.js +20 -20
  3. package/Breadcrumbs.js +46 -46
  4. package/Button.js +24 -24
  5. package/CHANGELOG.md +21 -2
  6. package/Calendar.js +69 -69
  7. package/Card.js +68 -68
  8. package/Chip.js +16 -16
  9. package/Clickable.js +29 -29
  10. package/Code.js +654 -519
  11. package/CollapsiblePanel.js +112 -112
  12. package/Color.js +107 -107
  13. package/ColumnLayout.js +35 -35
  14. package/ComboBox.js +190 -206
  15. package/ControlGroup.js +128 -120
  16. package/Date.js +148 -146
  17. package/DefinitionList.js +26 -26
  18. package/DualListbox.js +701 -717
  19. package/File.js +403 -403
  20. package/FormRows.js +66 -63
  21. package/Image.js +15 -15
  22. package/JSONTree.js +458 -357
  23. package/Layer.js +60 -72
  24. package/Markdown.js +66 -66
  25. package/Menu.js +44 -44
  26. package/Modal.js +49 -49
  27. package/ModalLayer.js +6 -6
  28. package/Monogram.js +16 -16
  29. package/Multiselect.js +622 -624
  30. package/Number.js +100 -100
  31. package/Paginator.js +7 -7
  32. package/Popover.js +453 -407
  33. package/Progress.js +12 -12
  34. package/Prose.js +6 -6
  35. package/RadioBar.js +180 -166
  36. package/RadioList.js +80 -79
  37. package/ResultsMenu.js +15 -15
  38. package/Scroll.js +50 -50
  39. package/Search.js +148 -164
  40. package/Select.js +668 -670
  41. package/Slider.js +30 -30
  42. package/SlidingPanels.js +24 -24
  43. package/SplitButton.js +50 -50
  44. package/StepBar.js +100 -100
  45. package/Switch.js +45 -45
  46. package/TabBar.js +196 -196
  47. package/TabLayout.js +16 -16
  48. package/Table.js +1207 -1193
  49. package/Text.js +65 -65
  50. package/TextArea.js +108 -93
  51. package/Tooltip.js +203 -197
  52. package/Tree.js +464 -366
  53. package/package.json +6 -6
  54. package/stubs-dependencies.d.ts +0 -70
  55. package/stubs-splunkui.d.ts +4 -0
  56. package/types/src/Code/Code.d.ts +17 -1
  57. package/types/src/Code/LineHighlights.d.ts +11 -0
  58. package/types/src/Code/LineNumbers.d.ts +6 -0
  59. package/types/src/Code/docs/examples/LineHighlights.d.ts +3 -0
  60. package/types/src/Code/docs/examples/LineNumbers.d.ts +3 -0
  61. package/types/src/Code/docs/examples/LineNumbersCustomStart.d.ts +3 -0
  62. package/types/src/Date/Date.d.ts +6 -1
  63. package/types/src/DefinitionList/DefinitionList.d.ts +6 -6
  64. package/types/src/FormRows/FormRows.d.ts +1 -1
  65. package/types/src/JSONTree/JSONTreeItem.d.ts +5 -2
  66. package/types/src/Markdown/Markdown.d.ts +1 -1
  67. package/types/src/Markdown/renderers/MarkdownBlockquote.d.ts +1 -1
  68. package/types/src/Markdown/renderers/MarkdownCodeBlock.d.ts +1 -1
  69. package/types/src/Markdown/renderers/index.d.ts +1 -1
  70. package/types/src/Popover/Popover.d.ts +1 -1
  71. package/types/src/RadioBar/Option.d.ts +1 -1
  72. package/types/src/RadioBar/RadioBar.d.ts +13 -6
  73. package/types/src/RadioBar/RadioBarContext.d.ts +4 -2
  74. package/types/src/RadioList/RadioList.d.ts +2 -1
  75. package/types/src/ScreenReaderContent/docs/examples/SkipLink.d.ts +3 -0
  76. package/types/src/Scroll/Inner.d.ts +1 -1
  77. package/types/src/Select/Option.d.ts +1 -1
  78. package/types/src/Select/Select.d.ts +1 -1
  79. package/types/src/Slider/docs/examples/Controlled.d.ts +1 -1
  80. package/types/src/TabLayout/Panel.d.ts +0 -1
  81. package/types/src/Table/Head.d.ts +1 -0
  82. package/types/src/Table/HeadCell.d.ts +2 -3
  83. package/types/src/Table/HeadDropdownCell.d.ts +2 -2
  84. package/types/src/Table/HeadInner.d.ts +4 -4
  85. package/types/src/Table/KeyboardSensor.d.ts +1 -1
  86. package/types/src/Table/RowDragCell.d.ts +1 -1
  87. package/types/src/Tooltip/Tooltip.d.ts +10 -5
  88. package/types/src/Tree/Item.d.ts +63 -0
  89. package/types/src/Tree/Tree.d.ts +13 -6
  90. package/types/src/Tree/TreeContext.d.ts +1 -1
  91. package/types/src/Tree/index.d.ts +1 -1
  92. package/types/src/useControlled/useControlled.d.ts +3 -1
  93. package/useControlled.js +29 -13
  94. package/types/src/Tree/TreeItem.d.ts +0 -44
package/Chip.js CHANGED
@@ -75,20 +75,20 @@
75
75
  // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
76
76
  const s = require("@splunk/react-ui/ScreenReaderContent");
77
77
  var c = e.n(s);
78
- // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
79
- const u = require("@splunk/ui-utils/i18n");
80
78
  // CONCATENATED MODULE: external "@splunk/ui-utils/color"
81
- const d = require("@splunk/ui-utils/color");
79
+ const u = require("@splunk/ui-utils/color");
82
80
  // CONCATENATED MODULE: external "@splunk/ui-utils/format"
83
- const v = require("@splunk/ui-utils/format");
81
+ const d = require("@splunk/ui-utils/format");
82
+ // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
83
+ const v = require("@splunk/ui-utils/i18n");
84
84
  // CONCATENATED MODULE: external "styled-components"
85
85
  const p = require("styled-components");
86
86
  var f = e.n(p);
87
- // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
88
- const b = require("@splunk/react-ui/Clickable");
89
- var m = e.n(b);
90
87
  // CONCATENATED MODULE: external "@splunk/react-icons/Cross"
91
- const y = require("@splunk/react-icons/Cross");
88
+ const b = require("@splunk/react-icons/Cross");
89
+ var m = e.n(b);
90
+ // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
91
+ const y = require("@splunk/react-ui/Clickable");
92
92
  var g = e.n(y);
93
93
  // CONCATENATED MODULE: external "@splunk/themes"
94
94
  const C = require("@splunk/themes");
@@ -127,7 +127,7 @@
127
127
  displayName: "ChipStyles__StyledIcon",
128
128
  componentId: "sc-1sd3tsh-1"
129
129
  })([ "display:grid;grid-column:icon;" ]);
130
- var k = f()(g()).withConfig({
130
+ var k = f()(m()).withConfig({
131
131
  displayName: "ChipStyles__StyledRemoveIcon",
132
132
  componentId: "sc-1sd3tsh-2"
133
133
  })([ "grid-column:remove;" ]);
@@ -135,7 +135,7 @@
135
135
  displayName: "ChipStyles__StyledLabel",
136
136
  componentId: "sc-1sd3tsh-3"
137
137
  })([ "", " grid-column:label;" ], C.mixins.ellipsis());
138
- var R = f()(m()).withConfig({
138
+ var R = f()(g()).withConfig({
139
139
  displayName: "ChipStyles__StyledClickable",
140
140
  componentId: "sc-1sd3tsh-4"
141
141
  })([ "", " cursor:pointer;", ";", "" ], h, (0, C.pickVariant)("$icon", {
@@ -254,8 +254,8 @@
254
254
  function T(e) {
255
255
  var r = e.appearance, n = e.backgroundColor, o = e.disabled, a = e.foregroundColor, t = e.icon, l = N(e, [ "appearance", "backgroundColor", "disabled", "foregroundColor", "icon" ]);
256
256
  // Validate that the color being rendered into the CSS is restricted to only values that are of CSS type <color>.
257
- var i = a && (0, d.isCSSColor)(a) ? a : undefined;
258
- var s = n && (0, d.isCSSColor)(n) ? n : undefined;
257
+ var i = a && (0, u.isCSSColor)(a) ? a : undefined;
258
+ var s = n && (0, u.isCSSColor)(n) ? n : undefined;
259
259
  var c = {
260
260
  "data-test": "chip",
261
261
  $appearance: r || (s ? "custom" : "default"),
@@ -268,12 +268,12 @@
268
268
  }
269
269
  function M(e) {
270
270
  var r = T(e), a = q(r, 2), l = a[0], i = a[1];
271
- var s = l.$appearance, d = l.$foregroundColor, p = l.disabled, f = p === void 0 ? false : p, b = l.icon, m = N(l, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
271
+ var s = l.$appearance, u = l.$foregroundColor, p = l.disabled, f = p === void 0 ? false : p, b = l.icon, m = N(l, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
272
272
  var y = i.children, g = i.elementRef, C = i.onRequestRemove, h = i.value, S = N(i, [ "children", "elementRef", "onRequestRemove", "value" ]);
273
273
  var _ = typeof y === "string";
274
- var j = _ ? (0, v.sprintf)((0, u._)("Remove %(children)s"), {
274
+ var j = _ ? (0, d.sprintf)((0, v._)("Remove %(children)s"), {
275
275
  children: y
276
- }) : (0, u._)("Remove");
276
+ }) : (0, v._)("Remove");
277
277
  var I = (0, n.useCallback)((function(e) {
278
278
  C(e, {
279
279
  value: h
@@ -284,7 +284,7 @@
284
284
  $appearance: s,
285
285
  $icon: !!b,
286
286
  $disabled: f,
287
- $foregroundColor: d,
287
+ $foregroundColor: u,
288
288
  "data-test-value": h,
289
289
  disabled: f ? "disabled" : undefined,
290
290
  elementRef: g,
package/Clickable.js CHANGED
@@ -70,16 +70,16 @@
70
70
  // CONCATENATED MODULE: external "react"
71
71
  const r = require("react");
72
72
  var t = e.n(r);
73
- // CONCATENATED MODULE: external "prop-types"
74
- const i = require("prop-types");
75
- var a = e.n(i);
76
73
  // CONCATENATED MODULE: external "lodash/has"
77
- const o = require("lodash/has");
74
+ const i = require("lodash/has");
78
75
  // CONCATENATED MODULE: external "lodash/isString"
79
- const l = require("lodash/isString");
80
- var u = e.n(l);
76
+ const a = require("lodash/isString");
77
+ var o = e.n(a);
81
78
  // CONCATENATED MODULE: external "lodash/omit"
82
- const d = require("lodash/omit");
79
+ const l = require("lodash/omit");
80
+ var u = e.n(l);
81
+ // CONCATENATED MODULE: external "prop-types"
82
+ const d = require("prop-types");
83
83
  var c = e.n(d);
84
84
  // CONCATENATED MODULE: external "styled-components"
85
85
  const s = require("styled-components");
@@ -94,10 +94,10 @@
94
94
  // CONCATENATED MODULE: ./src/Clickable/NavigationProvider.tsx
95
95
  /** @public */
96
96
  var p = {
97
- children: a().node,
98
- onClick: a().func,
99
- onLinkClick: a().func,
100
- transformUrl: a().func
97
+ children: c().node,
98
+ onClick: c().func,
99
+ onLinkClick: c().func,
100
+ transformUrl: c().func
101
101
  };
102
102
  var m = t().createContext({});
103
103
  /**
@@ -182,13 +182,13 @@
182
182
  return n != null && !h.test(n) && !w.test(n);
183
183
  };
184
184
  var x = {
185
- children: a().node,
186
- disabled: a().oneOfType([ a().bool, a().oneOf([ "dimmed", "disabled" ]) ]),
187
- elementRef: a().oneOfType([ a().func, a().object ]),
188
- onClick: a().func,
189
- openInNewContext: a().bool,
190
- navigationLabel: a().string,
191
- to: a().oneOfType([ a().string, a().oneOf([ undefined ]) ])
185
+ children: c().node,
186
+ disabled: c().oneOfType([ c().bool, c().oneOf([ "dimmed", "disabled" ]) ]),
187
+ elementRef: c().oneOfType([ c().func, c().object ]),
188
+ onClick: c().func,
189
+ openInNewContext: c().bool,
190
+ navigationLabel: c().string,
191
+ to: c().oneOfType([ c().string, c().oneOf([ undefined ]) ])
192
192
  };
193
193
  function L(e) {
194
194
  return e !== undefined;
@@ -199,7 +199,7 @@
199
199
  */ var I = t().forwardRef((function(e,
200
200
  // SUI-7623 - needs to be specified for react-docgen versions less than 7.1.0
201
201
  n) {
202
- var i = e.children, a = e.disabled, o = e.elementRef, l = e.navigationLabel, d = e.onClick, s = e.openInNewContext, f = e.tag, v = e.to, p = g(e, [ "children", "disabled", "elementRef", "navigationLabel", "onClick", "openInNewContext", "tag", "to" ]);
202
+ var i = e.children, a = e.disabled, l = e.elementRef, d = e.navigationLabel, c = e.onClick, s = e.openInNewContext, f = e.tag, v = e.to, p = g(e, [ "children", "disabled", "elementRef", "navigationLabel", "onClick", "openInNewContext", "tag", "to" ]);
203
203
  // @docs-props-type ClickablePropsBase
204
204
  var y = (0, r.useContext)(m), O = y.onClick, h = y.onLinkClick, w = y.transformUrl;
205
205
  (0, r.useEffect)((function() {
@@ -208,9 +208,9 @@
208
208
  // eslint-disable-next-line react-hooks/exhaustive-deps
209
209
  }), []);
210
210
  var P = (0, r.useCallback)((function(e) {
211
- k(o, e);
211
+ k(l, e);
212
212
  k(n, e);
213
- }), [ o, n ]);
213
+ }), [ l, n ]);
214
214
  // memoizing this result causes TS to lose track of the type guard established by isLinkCheck
215
215
  var x = L(v);
216
216
  // ideally we wouldn't need to pass "to" as "toValue" here
@@ -234,11 +234,11 @@
234
234
  return;
235
235
  }
236
236
  }
237
- d === null || d === void 0 ? void 0 : d(e);
238
- var n = d == null && O != null;
237
+ c === null || c === void 0 ? void 0 : c(e);
238
+ var n = c == null && O != null;
239
239
  if (x && (n || h != null)) {
240
- var r = l;
241
- if (!r && u()(i)) {
240
+ var r = d;
241
+ if (!r && o()(i)) {
242
242
  r = i;
243
243
  }
244
244
  var t = {
@@ -252,7 +252,7 @@
252
252
  }
253
253
  h === null || h === void 0 ? void 0 : h(e, t);
254
254
  }
255
- }), [ i, I, x, l, d, O, h, s, v ]);
255
+ }), [ i, I, x, d, c, O, h, s, v ]);
256
256
  // Only set the href attribute when enabled and therefore using an <a> tag
257
257
  if (x && f !== "button") {
258
258
  if (a) {
@@ -275,7 +275,7 @@
275
275
  target: T,
276
276
  rel: q,
277
277
  onClick: R
278
- }, c()(p)), i);
278
+ }, u()(p)), i);
279
279
  }
280
280
  // button variant
281
281
  var N = a === true || a === "dimmed" || undefined;
@@ -294,8 +294,8 @@
294
294
  ref: P,
295
295
  type: "button",
296
296
  disabled: a === "disabled",
297
- onClick: d && !a ? R : undefined
298
- }, c()(p, "disabled")), i);
297
+ onClick: c && !a ? R : undefined
298
+ }, u()(p, "disabled")), i);
299
299
  }));
300
300
  I.propTypes = x;
301
301
  /* harmony default export */ const R = I;