@splunk/react-ui 5.0.0-beta.5 → 5.0.0-rc.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 (52) hide show
  1. package/ButtonSimple.js +92 -168
  2. package/{CHANGELOG.v5.mdx → CHANGELOG.v5.md} +43 -0
  3. package/Calendar.js +148 -151
  4. package/Card.js +139 -139
  5. package/Code.js +197 -167
  6. package/CollapsiblePanel.js +172 -164
  7. package/Color.js +584 -506
  8. package/ComboBox.js +51 -51
  9. package/ControlGroup.js +132 -127
  10. package/Date.js +137 -150
  11. package/Dropdown.js +97 -96
  12. package/DualListbox.js +468 -469
  13. package/FetchOptions.d.ts +2 -2
  14. package/FormRows.js +158 -157
  15. package/JSONTree.js +354 -360
  16. package/{MIGRATION.mdx → MIGRATION.md} +13 -43
  17. package/{MIGRATION.v5.mdx → MIGRATION.v5.md} +67 -1
  18. package/Markdown.js +3 -4
  19. package/Menu.js +194 -195
  20. package/Modal.js +18 -18
  21. package/ModalLayer.js +171 -217
  22. package/Multiselect.js +785 -778
  23. package/Number.js +103 -102
  24. package/Popover.js +48 -46
  25. package/RadioBar.js +144 -146
  26. package/Resize.js +149 -151
  27. package/ResultsMenu.js +112 -114
  28. package/Search.js +49 -49
  29. package/Select.js +455 -457
  30. package/Slider.js +328 -331
  31. package/Switch.js +251 -178
  32. package/TabBar.js +277 -280
  33. package/Table.js +1212 -1178
  34. package/Text.js +45 -46
  35. package/Tooltip.js +192 -189
  36. package/Tree.js +177 -188
  37. package/package.json +10 -9
  38. package/types/src/Code/Code.d.ts +1 -1
  39. package/types/src/Color/Color.d.ts +2 -2
  40. package/types/src/ControlGroup/ControlGroup.d.ts +1 -2
  41. package/types/src/Dropdown/Dropdown.d.ts +5 -2
  42. package/types/src/Layer/Layer.d.ts +2 -1
  43. package/types/src/Layer/index.d.ts +1 -0
  44. package/types/src/ModalLayer/ModalLayer.d.ts +16 -21
  45. package/types/src/Number/Number.d.ts +1 -1
  46. package/types/src/Popover/Popover.d.ts +5 -2
  47. package/types/src/Table/HeadCell.d.ts +6 -1
  48. package/types/src/Table/HeadInner.d.ts +3 -1
  49. package/types/src/Tooltip/Tooltip.d.ts +7 -7
  50. package/types/src/fixtures/useFetchOptions.d.ts +33 -0
  51. package/useRovingFocus.js +20 -23
  52. package/types/src/fixtures/FetchOptions.d.ts +0 -76
package/RadioBar.js CHANGED
@@ -61,8 +61,8 @@
61
61
  e.r(r);
62
62
  // EXPORTS
63
63
  e.d(r, {
64
- Option: () => /* reexport */ B,
65
- default: () => /* reexport */ G
64
+ Option: () => /* reexport */ x,
65
+ default: () => /* reexport */ X
66
66
  });
67
67
  // CONCATENATED MODULE: external "react"
68
68
  const t = require("react");
@@ -73,47 +73,45 @@
73
73
  // CONCATENATED MODULE: external "lodash/omit"
74
74
  const i = require("lodash/omit");
75
75
  var l = e.n(i);
76
- // CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
77
- const u = require("@splunk/ui-utils/keyboard");
78
76
  // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
79
77
  const d = require("@splunk/react-ui/useControlled");
80
- var c = e.n(d);
78
+ var u = e.n(d);
81
79
  // CONCATENATED MODULE: external "styled-components"
82
- const s = require("styled-components");
83
- var v = e.n(s);
80
+ const c = require("styled-components");
81
+ var s = e.n(c);
84
82
  // CONCATENATED MODULE: external "@splunk/themes"
85
- const b = require("@splunk/themes");
83
+ const v = require("@splunk/themes");
86
84
  // CONCATENATED MODULE: external "@splunk/react-ui/Button"
87
- const f = require("@splunk/react-ui/Button");
88
- var p = e.n(f);
85
+ const b = require("@splunk/react-ui/Button");
86
+ var f = e.n(b);
89
87
  // CONCATENATED MODULE: ./src/RadioBar/OptionStyles.ts
90
- var y = 10;
91
- var m = v()(p()).withConfig({
88
+ var p = 10;
89
+ var y = s()(f()).withConfig({
92
90
  displayName: "OptionStyles__StyledButton",
93
91
  componentId: "fyq77p-0"
94
- })([ "border:", " solid ", ";border-radius:0;height:", ";min-height:", ";min-width:0;padding:", " ", ";z-index:", ";&&{color:", ";}&:first-child{border-top-left-radius:", ";border-bottom-left-radius:", ";}&:last-child{border-top-right-radius:", ";border-bottom-right-radius:", ";}&:not(:last-child){margin-right:-", ";}&&:focus{background-color:", ";box-shadow:", ";color:", ";z-index:", ";border:0;span{padding:0 ", ";}}&:not([disabled],[aria-disabled='true']){", "}&[disabled],&[aria-disabled='true']{background-color:", ";color:", ";z-index:0;}" ], b.variables.inputBorderWidth, b.variables.borderColor, b.variables.inputHeight, b.variables.inputHeight, b.variables.spacingXSmall, b.variables.spacingSmall, y, b.variables.contentColorDefault, b.variables.borderRadius, b.variables.borderRadius, b.variables.borderRadius, b.variables.borderRadius, b.variables.inputBorderWidth, b.variables.actionColorBackgroundSecondaryActive, b.variables.focusShadowInset, b.variables.contentColorActive, y * 5, b.variables.inputBorderWidth, (0,
95
- b.pickVariant)("$optionSelected", {
96
- true: (0, s.css)([ "", ";background-color:", ";border-color:", ";border-width:", ";z-index:", ";" ], b.mixins.typography({
92
+ })([ "border:", " solid ", ";border-radius:0;height:", ";min-height:", ";min-width:0;padding:", " ", ";z-index:", ";&&{color:", ";}&:first-child{border-top-left-radius:", ";border-bottom-left-radius:", ";}&:last-child{border-top-right-radius:", ";border-bottom-right-radius:", ";}&:not(:last-child){margin-right:-", ";}&&:focus{background-color:", ";box-shadow:", ";color:", ";z-index:", ";border:0;span{padding:0 ", ";}}&:not([disabled],[aria-disabled='true']){", "}&[disabled],&[aria-disabled='true']{background-color:", ";color:", ";z-index:0;}" ], v.variables.inputBorderWidth, v.variables.borderColor, v.variables.inputHeight, v.variables.inputHeight, v.variables.spacingXSmall, v.variables.spacingSmall, p, v.variables.contentColorDefault, v.variables.borderRadius, v.variables.borderRadius, v.variables.borderRadius, v.variables.borderRadius, v.variables.inputBorderWidth, v.variables.actionColorBackgroundSecondaryActive, v.variables.focusShadowInset, v.variables.contentColorActive, p * 5, v.variables.inputBorderWidth, (0,
93
+ v.pickVariant)("$optionSelected", {
94
+ true: (0, c.css)([ "", ";background-color:", ";border-color:", ";border-width:", ";z-index:", ";" ], v.mixins.typography({
97
95
  weight: "bold",
98
96
  color: "active"
99
- }), b.variables.actionColorBackgroundSecondaryActive, b.variables.actionColorBorderSecondaryActive, b.variables.inputBorderWidth, y * 4),
100
- false: (0, s.css)([ "&:hover{background-color:", ";border-color:", ";color:", ";z-index:", ";}" ], b.variables.actionColorBackgroundSecondaryHover, b.variables.borderColor, b.variables.contentColorActive, y * 3)
101
- }), b.variables.actionColorBackgroundSecondaryDisabled, b.variables.contentColorDisabled);
102
- var g = v().div.withConfig({
97
+ }), v.variables.actionColorBackgroundSecondaryActive, v.variables.actionColorBorderSecondaryActive, v.variables.inputBorderWidth, p * 4),
98
+ false: (0, c.css)([ "&:hover{background-color:", ";border-color:", ";color:", ";z-index:", ";}" ], v.variables.actionColorBackgroundSecondaryHover, v.variables.borderColor, v.variables.contentColorActive, p * 3)
99
+ }), v.variables.actionColorBackgroundSecondaryDisabled, v.variables.contentColorDisabled);
100
+ var m = s().div.withConfig({
103
101
  displayName: "OptionStyles__StyledLabel",
104
102
  componentId: "fyq77p-1"
105
- })([ "", " flex:0 1 auto;" ], b.mixins.ellipsis);
106
- var h = v().div.withConfig({
103
+ })([ "", " flex:0 1 auto;" ], v.mixins.ellipsis);
104
+ var g = s().div.withConfig({
107
105
  displayName: "OptionStyles__StyledAdornment",
108
106
  componentId: "fyq77p-2"
109
107
  })([ "display:flex;" ]);
110
108
  // CONCATENATED MODULE: ./src/RadioBar/RadioBarContext.tsx
111
- var O = (0, t.createContext)({});
112
- O.displayName = "RadioBar";
113
- /* harmony default export */ const S = O;
109
+ var h = (0, t.createContext)({});
110
+ h.displayName = "RadioBar";
111
+ /* harmony default export */ const O = h;
114
112
  // CONCATENATED MODULE: ./src/RadioBar/Option.tsx
115
- function w() {
116
- return w = Object.assign ? Object.assign.bind() : function(e) {
113
+ function S() {
114
+ return S = Object.assign ? Object.assign.bind() : function(e) {
117
115
  for (var r = 1; r < arguments.length; r++) {
118
116
  var t = arguments[r];
119
117
  for (var n in t) {
@@ -121,11 +119,11 @@
121
119
  }
122
120
  }
123
121
  return e;
124
- }, w.apply(null, arguments);
122
+ }, S.apply(null, arguments);
125
123
  }
126
- function C(e, r) {
124
+ function w(e, r) {
127
125
  if (null == e) return {};
128
- var t, n, o = j(e, r);
126
+ var t, n, o = C(e, r);
129
127
  if (Object.getOwnPropertySymbols) {
130
128
  var a = Object.getOwnPropertySymbols(e);
131
129
  for (n = 0; n < a.length; n++) {
@@ -134,7 +132,7 @@
134
132
  }
135
133
  return o;
136
134
  }
137
- function j(e, r) {
135
+ function C(e, r) {
138
136
  if (null == e) return {};
139
137
  var t = {};
140
138
  for (var n in e) {
@@ -145,7 +143,7 @@
145
143
  }
146
144
  return t;
147
145
  }
148
- var k = {
146
+ var j = {
149
147
  disabled: a().bool,
150
148
  startAdornment: a().node,
151
149
  endAdornment: a().node,
@@ -157,62 +155,62 @@
157
155
  /** The value of the `Option`. */
158
156
  value: a().any.isRequired
159
157
  };
160
- function x(e) {
161
- var r = e.disabled, o = e.label, a = e.selected, i = e.startAdornment, l = e.endAdornment, u = e.value, d = e.role, c = d === void 0 ? "radio" : d, s = C(e, [ "disabled", "label", "selected", "startAdornment", "endAdornment", "value", "role" ]);
158
+ function k(e) {
159
+ var r = e.disabled, o = e.label, a = e.selected, i = e.startAdornment, l = e.endAdornment, d = e.value, u = e.role, c = u === void 0 ? "radio" : u, s = w(e, [ "disabled", "label", "selected", "startAdornment", "endAdornment", "value", "role" ]);
162
160
  // @docs-props-type OptionPropsBase
163
- var v = (0, t.useContext)(S), b = v.onClick, f = v.error, p = v.onKeyDown, y = v.firstValue, O = v.selectedValue;
161
+ var v = (0, t.useContext)(O), b = v.onClick, f = v.error, p = v.onKeyDown, h = v.firstValue, C = v.selectedValue;
164
162
  var j = -1;
165
- if (O) {
166
- if (u === O) {
163
+ if (C) {
164
+ if (d === C) {
167
165
  j = 0;
168
166
  }
169
- } else if (u === y) {
167
+ } else if (d === h) {
170
168
  j = 0;
171
169
  }
172
170
  var k = j;
173
171
  var x = (0, t.useCallback)((function(e) {
174
172
  if (!a) {
175
173
  b === null || b === void 0 ? void 0 : b(e, {
176
- value: u,
174
+ value: d,
177
175
  label: o
178
176
  });
179
177
  }
180
- }), [ o, b, a, u ]);
178
+ }), [ o, b, a, d ]);
181
179
  var B = (0, t.useCallback)((function(e) {
182
180
  return p === null || p === void 0 ? void 0 : p(e, {
183
- value: u,
181
+ value: d,
184
182
  label: o
185
183
  });
186
- }), [ o, p, u ]);
184
+ }), [ o, p, d ]);
187
185
 
188
- return n().createElement(m, w({
186
+ return n().createElement(y, S({
189
187
  "aria-invalid": f,
190
188
  "data-test": "option",
191
- "data-test-value": u,
189
+ "data-test-value": d,
192
190
  appearance: "default",
193
191
  disabled: r ? "disabled" : undefined,
194
192
  $optionSelected: a,
195
- value: u
193
+ value: d
196
194
  }, s, {
197
195
  onClick: x,
198
196
  role: c,
199
197
  "aria-checked": a,
200
198
  tabIndex: k,
201
199
  onKeyDown: B
202
- }), i && n().createElement(h, null, i), o && n().createElement(g, null, o), l && n().createElement(h, null, l));
200
+ }), i && n().createElement(g, null, i), o && n().createElement(m, null, o), l && n().createElement(g, null, l));
203
201
  }
204
- x.propTypes = k;
205
- /* harmony default export */ const B = x;
202
+ k.propTypes = j;
203
+ /* harmony default export */ const x = k;
206
204
  // CONCATENATED MODULE: external "@splunk/react-ui/Box"
207
- const P = require("@splunk/react-ui/Box");
208
- var A = e.n(P);
205
+ const B = require("@splunk/react-ui/Box");
206
+ var A = e.n(B);
209
207
  // CONCATENATED MODULE: ./src/RadioBar/RadioBarStyles.ts
210
- var E = v()(A()).withConfig({
208
+ var P = s()(A()).withConfig({
211
209
  displayName: "RadioBarStyles__StyledRadioBar",
212
210
  componentId: "gg1b79-0"
213
- })([ "height:", ";", "" ], b.variables.inputHeight, (function(e) {
211
+ })([ "height:", ";", "" ], v.variables.inputHeight, (function(e) {
214
212
  var r = e.$error;
215
- return r && (0, s.css)([ "& > ", "{border-color:", ";:not([disabled],[aria-disabled='true']){&:hover{border-color:", ";}&[aria-checked='true']{background-color:", ";border-color:", ";}}}" ], m, b.variables.actionColorBorderDestructiveSecondary, b.variables.actionColorBorderDestructiveSecondary, b.variables.actionColorBackgroundDestructiveSecondaryActive, b.variables.actionColorBorderDestructiveSecondaryActive);
213
+ return r && (0, c.css)([ "& > ", "{border-color:", ";:not([disabled],[aria-disabled='true']){&:hover{border-color:", ";}&[aria-checked='true']{background-color:", ";border-color:", ";}}}" ], y, v.variables.actionColorBorderDestructiveSecondary, v.variables.actionColorBorderDestructiveSecondary, v.variables.actionColorBackgroundDestructiveSecondaryActive, v.variables.actionColorBorderDestructiveSecondaryActive);
216
214
  }));
217
215
  // CONCATENATED MODULE: ./src/RadioBar/RadioBar.tsx
218
216
  function R(e) {
@@ -223,8 +221,8 @@
223
221
  return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
224
222
  }, R(e);
225
223
  }
226
- function q() {
227
- return q = Object.assign ? Object.assign.bind() : function(e) {
224
+ function E() {
225
+ return E = Object.assign ? Object.assign.bind() : function(e) {
228
226
  for (var r = 1; r < arguments.length; r++) {
229
227
  var t = arguments[r];
230
228
  for (var n in t) {
@@ -232,7 +230,7 @@
232
230
  }
233
231
  }
234
232
  return e;
235
- }, q.apply(null, arguments);
233
+ }, E.apply(null, arguments);
236
234
  }
237
235
  function D(e, r) {
238
236
  var t = Object.keys(e);
@@ -244,30 +242,30 @@
244
242
  }
245
243
  return t;
246
244
  }
247
- function I(e) {
245
+ function q(e) {
248
246
  for (var r = 1; r < arguments.length; r++) {
249
247
  var t = null != arguments[r] ? arguments[r] : {};
250
248
  r % 2 ? D(Object(t), !0).forEach((function(r) {
251
- _(e, r, t[r]);
249
+ I(e, r, t[r]);
252
250
  })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : D(Object(t)).forEach((function(r) {
253
251
  Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
254
252
  }));
255
253
  }
256
254
  return e;
257
255
  }
258
- function _(e, r, t) {
259
- return (r = T(r)) in e ? Object.defineProperty(e, r, {
256
+ function I(e, r, t) {
257
+ return (r = _(r)) in e ? Object.defineProperty(e, r, {
260
258
  value: t,
261
259
  enumerable: !0,
262
260
  configurable: !0,
263
261
  writable: !0
264
262
  }) : e[r] = t, e;
265
263
  }
266
- function T(e) {
267
- var r = V(e, "string");
264
+ function _(e) {
265
+ var r = T(e, "string");
268
266
  return "symbol" == R(r) ? r : r + "";
269
267
  }
270
- function V(e, r) {
268
+ function T(e, r) {
271
269
  if ("object" != R(e) || !e) return e;
272
270
  var t = e[Symbol.toPrimitive];
273
271
  if (void 0 !== t) {
@@ -277,54 +275,54 @@
277
275
  }
278
276
  return ("string" === r ? String : Number)(e);
279
277
  }
280
- function M(e, r) {
281
- return W(e) || H(e, r) || $(e, r) || N();
278
+ function V(e, r) {
279
+ return H(e) || z(e, r) || N(e, r) || M();
282
280
  }
283
- function N() {
281
+ function M() {
284
282
  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
285
283
  }
286
- function $(e, r) {
284
+ function N(e, r) {
287
285
  if (e) {
288
- if ("string" == typeof e) return z(e, r);
286
+ if ("string" == typeof e) return $(e, r);
289
287
  var t = {}.toString.call(e).slice(8, -1);
290
- 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) ? z(e, r) : void 0;
288
+ 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;
291
289
  }
292
290
  }
293
- function z(e, r) {
291
+ function $(e, r) {
294
292
  (null == r || r > e.length) && (r = e.length);
295
293
  for (var t = 0, n = Array(r); t < r; t++) {
296
294
  n[t] = e[t];
297
295
  }
298
296
  return n;
299
297
  }
300
- function H(e, r) {
298
+ function z(e, r) {
301
299
  var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
302
300
  if (null != t) {
303
- var n, o, a, i, l = [], u = !0, d = !1;
301
+ var n, o, a, i, l = [], d = !0, u = !1;
304
302
  try {
305
303
  if (a = (t = t.call(e)).next, 0 === r) {
306
304
  if (Object(t) !== t) return;
307
- u = !1;
308
- } else for (;!(u = (n = a.call(t)).done) && (l.push(n.value), l.length !== r); u = !0) {
305
+ d = !1;
306
+ } else for (;!(d = (n = a.call(t)).done) && (l.push(n.value), l.length !== r); d = !0) {
309
307
  }
310
308
  } catch (e) {
311
- d = !0, o = e;
309
+ u = !0, o = e;
312
310
  } finally {
313
311
  try {
314
- if (!u && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
312
+ if (!d && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
315
313
  } finally {
316
- if (d) throw o;
314
+ if (u) throw o;
317
315
  }
318
316
  }
319
317
  return l;
320
318
  }
321
319
  }
322
- function W(e) {
320
+ function H(e) {
323
321
  if (Array.isArray(e)) return e;
324
322
  }
325
- function K(e, r) {
323
+ function W(e, r) {
326
324
  if (null == e) return {};
327
- var t, n, o = F(e, r);
325
+ var t, n, o = K(e, r);
328
326
  if (Object.getOwnPropertySymbols) {
329
327
  var a = Object.getOwnPropertySymbols(e);
330
328
  for (n = 0; n < a.length; n++) {
@@ -333,7 +331,7 @@
333
331
  }
334
332
  return o;
335
333
  }
336
- function F(e, r) {
334
+ function K(e, r) {
337
335
  if (null == e) return {};
338
336
  var t = {};
339
337
  for (var n in e) {
@@ -344,7 +342,7 @@
344
342
  }
345
343
  return t;
346
344
  }
347
- /** @public */ var L = {
345
+ /** @public */ var F = {
348
346
  children: a().node,
349
347
  defaultValue: a().any,
350
348
  describedBy: a().string,
@@ -360,26 +358,26 @@
360
358
  value: a().any
361
359
  };
362
360
  // TODO(SUI-7012): Once converted to a functional component, this function can be removed and RadioBar should use useRovingFocus hook
363
- var U = function e(r, t, n, o) {
361
+ var L = function e(r, t, n, o) {
364
362
  var a = r === "forward" ? 1 : -1;
365
363
  var i = r === "forward" ? "nextSibling" : "previousSibling";
366
364
  var l = r === "forward" ? "firstElementChild" : "lastElementChild";
367
- var u = r === "forward" ? 0 : t - 1;
368
- var d = n[i];
365
+ var d = r === "forward" ? 0 : t - 1;
366
+ var u = n[i];
369
367
  var c = null;
370
368
  var s = o + a;
371
- while (d !== n && c === null) {
372
- if (d === null) {
369
+ while (u !== n && c === null) {
370
+ if (u === null) {
373
371
  var v;
374
- d = (v = n.parentElement) === null || v === void 0 ? void 0 : v[l];
375
- s = u;
372
+ u = (v = n.parentElement) === null || v === void 0 ? void 0 : v[l];
373
+ s = d;
376
374
  }
377
- if (d.disabled) {
378
- var b = d[i];
379
- d = b;
375
+ if (u.disabled) {
376
+ var b = u[i];
377
+ u = b;
380
378
  s += a;
381
379
  } else {
382
- c = d;
380
+ c = u;
383
381
  }
384
382
  }
385
383
  return {
@@ -389,17 +387,17 @@
389
387
  };
390
388
  /**
391
389
  * RadioBar is a form control that provides the ability to select one option out of a group.
392
- */ function X(e) {
393
- var r = e.children, o = e.defaultValue, a = e.describedBy, i = e.elementRef, d = e.error, s = e.labelledBy, v = e.name, b = e.onChange, f = e.required, p = e.role, y = p === void 0 ? "radiogroup" : p, m = e.value, g = K(e, [ "children", "defaultValue", "describedBy", "elementRef", "error", "labelledBy", "name", "onChange", "required", "role", "value" ]);
390
+ */ function U(e) {
391
+ var r = e.children, o = e.defaultValue, a = e.describedBy, i = e.elementRef, d = e.error, c = e.labelledBy, s = e.name, v = e.onChange, b = e.required, f = e.role, p = f === void 0 ? "radiogroup" : f, y = e.value, m = W(e, [ "children", "defaultValue", "describedBy", "elementRef", "error", "labelledBy", "name", "onChange", "required", "role", "value" ]);
394
392
  // @docs-props-type RadioBarPropsBase
395
- var h = c()({
393
+ var g = u()({
396
394
  componentName: "RadioBar",
397
395
  /* eslint-disable-next-line prefer-rest-params */
398
396
  componentProps: arguments[0]
399
397
  });
400
- var O = (0, t.useState)(o), w = M(O, 2), C = w[0], j = w[1];
401
- var k = h ? m : C;
402
- var x = (0, t.useMemo)((function() {
398
+ var h = (0, t.useState)(o), S = V(h, 2), w = S[0], C = S[1];
399
+ var j = g ? y : w;
400
+ var k = (0, t.useMemo)((function() {
403
401
  // Everything in here is grouped because together they are based on children changing
404
402
  var e = t.Children.toArray(r).filter(t.isValidElement);
405
403
  var n = e.map((function(e) {
@@ -412,9 +410,9 @@
412
410
  var a = e.map((function(e, r) {
413
411
 
414
412
  return (0, t.cloneElement)(e, {
415
- selected: e.props.value === k,
413
+ selected: e.props.value === j,
416
414
  key: e.key || r,
417
- role: y === "radiogroup" ? "radio" : "menuitemradio"
415
+ role: p === "radiogroup" ? "radio" : "menuitemradio"
418
416
  });
419
417
  }));
420
418
  return {
@@ -422,82 +420,82 @@
422
420
  disabled: o,
423
421
  filteredValues: n
424
422
  };
425
- }), [ r, y, k ]), B = x.childrenFormatted, P = x.disabled, A = x.filteredValues;
423
+ }), [ r, p, j ]), x = k.childrenFormatted, B = k.disabled, A = k.filteredValues;
426
424
  var R = A[0];
427
425
  var D = (0, t.useMemo)((function() {
428
- return m == null || A.includes(k);
429
- }), [ A, k, m ]);
426
+ return y == null || A.includes(j);
427
+ }), [ A, j, y ]);
430
428
  (0, t.useEffect)((function() {
431
429
  if (false) {}
432
- }), [ A, k, D ]);
433
- var _ = (0, t.useCallback)((function(e, r) {
434
- if (m !== r.value) {
435
- b === null || b === void 0 ? void 0 : b(e, I({
436
- name: v
430
+ }), [ A, j, D ]);
431
+ var I = (0, t.useCallback)((function(e, r) {
432
+ if (y !== r.value) {
433
+ v === null || v === void 0 ? void 0 : v(e, q({
434
+ name: s
437
435
  }, r));
438
- if (!h) {
439
- j(r.value);
436
+ if (!g) {
437
+ C(r.value);
440
438
  }
441
439
  }
442
- }), [ h, v, b, m ]);
443
- var T = (0, t.useCallback)((function(e, r) {
440
+ }), [ g, s, v, y ]);
441
+ var _ = (0, t.useCallback)((function(e, r) {
444
442
  var t = r.value, n = r.label;
445
- var o = (0, u.keycode)(e.nativeEvent);
443
+ var o = e.key;
446
444
  var a = e.currentTarget;
447
445
  var i = null;
448
446
  var l = 0;
449
447
  var d = A.indexOf(t);
450
- if (o === "down" || o === "right") {
448
+ if (o === "ArrowDown" || o === "ArrowRight") {
451
449
  e.preventDefault();
452
- var c = U("forward", A.length, a, d), s = c.nextTargetRes, v = c.nextIndexRes;
453
- i = s;
454
- l = v;
455
- } else if (o === "up" || o === "left") {
450
+ var u = L("forward", A.length, a, d), c = u.nextTargetRes, s = u.nextIndexRes;
451
+ i = c;
452
+ l = s;
453
+ } else if (o === "ArrowUp" || o === "ArrowLeft") {
456
454
  e.preventDefault();
457
- var b = U("backward", A.length, a, d), f = b.nextTargetRes, p = b.nextIndexRes;
458
- i = f;
459
- l = p;
455
+ var v = L("backward", A.length, a, d), b = v.nextTargetRes, f = v.nextIndexRes;
456
+ i = b;
457
+ l = f;
460
458
  }
461
459
  if (i) {
462
- var y;
463
- (y = i) === null || y === void 0 ? void 0 : y.focus();
464
- var m = A[l];
465
- _(e, {
466
- value: m,
460
+ var p;
461
+ (p = i) === null || p === void 0 ? void 0 : p.focus();
462
+ var y = A[l];
463
+ I(e, {
464
+ value: y,
467
465
  label: n
468
466
  });
469
467
  }
470
- }), [ A, _ ]);
471
- var V = (0, t.useMemo)((function() {
468
+ }), [ A, I ]);
469
+ var T = (0, t.useMemo)((function() {
472
470
  return {
473
471
  error: d,
474
472
  firstValue: R,
475
- onClick: _,
476
- onKeyDown: T,
477
- selectedValue: D ? k : undefined
473
+ onClick: I,
474
+ onKeyDown: _,
475
+ selectedValue: D ? j : undefined
478
476
  };
479
- }), [ d, R, _, T, D, k ]);
477
+ }), [ d, R, I, _, D, j ]);
480
478
 
481
- return n().createElement(E, q({
479
+ return n().createElement(P, E({
482
480
  flex: true,
483
- $disabled: P,
481
+ $disabled: B,
484
482
  $error: d,
485
483
  elementRef: i,
486
484
  "data-test": "radio-bar",
487
- "data-test-value": k,
488
- role: y,
489
- "aria-labelledby": s,
485
+ "data-test-value": j,
486
+ role: p,
487
+ "aria-labelledby": c,
490
488
  "aria-describedby": a,
491
- "aria-disabled": P || undefined,
492
- "aria-required": f,
493
- "aria-invalid": y === "radiogroup" ? d : undefined
494
- }, l()(g, "onChange")), n().createElement(S.Provider, {
495
- value: V
496
- }, B));
489
+ "aria-disabled": B || undefined,
490
+ "aria-required": b,
491
+ "aria-invalid": p === "radiogroup" ? d : undefined
492
+ }, l()(m, "onChange")), n().createElement(O.Provider, {
493
+ value: T
494
+ }, x));
497
495
  }
498
- X.Option = B;
499
- X.propTypes = L;
500
- /* harmony default export */ const G = X;
496
+ U.Option = x;
497
+ U.propTypes = F;
498
+ /* harmony default export */ const X = U;
501
499
  // only for styled components using RadioBar
502
500
  // CONCATENATED MODULE: ./src/RadioBar/index.ts
503
501
  module.exports = r;