@splunk/react-ui 5.3.0 → 5.4.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 (60) hide show
  1. package/Accordion.js +31 -31
  2. package/Avatar.js +13 -13
  3. package/Breadcrumbs.js +66 -63
  4. package/ButtonSimple.js +52 -52
  5. package/CHANGELOG.md +16 -0
  6. package/CardLayout.js +39 -36
  7. package/Clickable.js +5 -6
  8. package/Code.js +424 -528
  9. package/CollapsiblePanel.js +1 -1
  10. package/Color.js +903 -1025
  11. package/DefinitionList.js +1 -1
  12. package/FormRows.js +13 -11
  13. package/JSONTree.js +682 -1408
  14. package/Link.js +5 -5
  15. package/Markdown.js +9 -5
  16. package/Menu.js +72 -67
  17. package/Multiselect.js +2692 -2780
  18. package/Popover.js +201 -196
  19. package/Resize.js +11 -8
  20. package/ResultsMenu.js +913 -1030
  21. package/ScreenReaderContent.js +86 -130
  22. package/Scroll.js +366 -425
  23. package/Select.js +1741 -1832
  24. package/Slider.js +1 -1
  25. package/SlidingPanels.js +129 -127
  26. package/StepBar.js +123 -97
  27. package/Switch.js +115 -111
  28. package/TabBar.js +10 -10
  29. package/Table.js +1239 -1240
  30. package/TextArea.js +596 -684
  31. package/Tree.js +638 -682
  32. package/package.json +11 -11
  33. package/types/src/Breadcrumbs/Breadcrumbs.d.ts +1 -5
  34. package/types/src/Breadcrumbs/BreadcrumbsContext.d.ts +7 -0
  35. package/types/src/Breadcrumbs/Item.d.ts +1 -1
  36. package/types/src/ButtonSimple/mixin.d.ts +1 -1
  37. package/types/src/JSONTree/JSONTreeItem.d.ts +1 -1
  38. package/types/src/JSONTree/renderTreeItems.d.ts +1 -1
  39. package/types/src/Modal/ModalContext.d.ts +1 -1
  40. package/types/src/Multiselect/Compact.d.ts +2 -2
  41. package/types/src/Multiselect/Normal.d.ts +2 -2
  42. package/types/src/Number/utils.d.ts +1 -1
  43. package/types/src/Popover/getPlacement.d.ts +1 -1
  44. package/types/src/RadioList/Option.d.ts +1 -1
  45. package/types/src/RadioList/RadioListContext.d.ts +1 -1
  46. package/types/src/StepBar/StepBar.d.ts +4 -1
  47. package/types/src/StepBar/StepBarContext.d.ts +1 -0
  48. package/types/src/StepBar/docs/examples/Vertical.d.ts +6 -0
  49. package/types/src/Switch/Switch.d.ts +7 -1
  50. package/types/src/TabBar/Tab.d.ts +3 -1
  51. package/types/src/TabBar/docs/examples/Icons.d.ts +4 -0
  52. package/types/src/TabBar/docs/examples/Tooltips.d.ts +3 -0
  53. package/types/src/TabLayout/Panel.d.ts +2 -0
  54. package/types/src/Table/Head.d.ts +1 -1
  55. package/types/src/Table/Row.d.ts +1 -1
  56. package/types/src/Table/Table.d.ts +1 -0
  57. package/types/src/Tree/TreeContext.d.ts +1 -1
  58. package/useControlled.js +61 -97
  59. package/usePrevious.js +30 -62
  60. package/useResizeObserver.js +95 -127
package/Color.js CHANGED
@@ -1,151 +1,34 @@
1
1
  /******/ (() => {
2
2
  // webpackBootstrap
3
3
  /******/ "use strict";
4
- /******/ var e = {
5
- /***/ 6165:
6
- /***/ (e, r, t) => {
7
- // EXPORTS
8
- t.d(r, {
9
- default: () => /* reexport */ y
10
- });
11
- // EXTERNAL MODULE: external "react"
12
- var n = t(9497);
13
- var a = t.n(n);
14
- // EXTERNAL MODULE: external "prop-types"
15
- var o = t(23);
16
- var l = t.n(o);
17
- // EXTERNAL MODULE: external "styled-components"
18
- var i = t(232);
19
- var u = t.n(i);
20
- // EXTERNAL MODULE: external "@splunk/themes"
21
- var s = t(3563);
22
- // CONCATENATED MODULE: ./src/ScreenReaderContent/ScreenReaderContentStyles.ts
23
- var c = u().span.withConfig({
24
- displayName: "ScreenReaderContentStyles__Styled",
25
- componentId: "sc-1lnohwp-0"
26
- })([ "", ";" ], s.mixins.screenReaderContent());
27
- // CONCATENATED MODULE: ./src/ScreenReaderContent/ScreenReaderContent.tsx
28
- function d() {
29
- return d = Object.assign ? Object.assign.bind() : function(e) {
30
- for (var r = 1; r < arguments.length; r++) {
31
- var t = arguments[r];
32
- for (var n in t) {
33
- ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
34
- }
35
- }
36
- return e;
37
- }, d.apply(null, arguments);
38
- }
39
- function f(e, r) {
40
- if (null == e) return {};
41
- var t, n, a = p(e, r);
42
- if (Object.getOwnPropertySymbols) {
43
- var o = Object.getOwnPropertySymbols(e);
44
- for (n = 0; n < o.length; n++) {
45
- t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
46
- }
47
- }
48
- return a;
49
- }
50
- function p(e, r) {
51
- if (null == e) return {};
52
- var t = {};
53
- for (var n in e) {
54
- if ({}.hasOwnProperty.call(e, n)) {
55
- if (-1 !== r.indexOf(n)) continue;
56
- t[n] = e[n];
57
- }
58
- }
59
- return t;
60
- }
61
- var v = {
62
- children: l().node.isRequired,
63
- elementRef: l().oneOfType([ l().func, l().object ])
64
- };
65
- /**
66
- * The screen reader text is used to wrap content that
67
- * is only accessible through screen readers.
68
- */ function b(e) {
69
- var r = e.children, t = e.elementRef, n = f(e, [ "children", "elementRef" ]);
70
- // @docs-props-type ScreenReaderContentPropsBase
71
-
72
- return a().createElement(c, d({
73
- "data-test": "screen-reader-content",
74
- ref: t
75
- }, n), r);
76
- }
77
- b.propTypes = v;
78
- /* harmony default export */ const y = b;
79
- } // CONCATENATED MODULE: ./src/ScreenReaderContent/index.ts
80
- /***/ ,
81
- /***/ 3563:
82
- /***/ e => {
83
- e.exports = require("@splunk/themes");
84
- /***/ },
85
- /***/ 23:
86
- /***/ e => {
87
- e.exports = require("prop-types");
88
- /***/ },
89
- /***/ 9497:
90
- /***/ e => {
91
- e.exports = require("react");
92
- /***/ },
93
- /***/ 232:
94
- /***/ e => {
95
- e.exports = require("styled-components");
96
- /***/
97
- /******/ }
98
- };
99
- /************************************************************************/
100
- /******/ // The module cache
101
- /******/ var r = {};
102
- /******/
103
- /******/ // The require function
104
- /******/ function t(n) {
105
- /******/ // Check if module is in cache
106
- /******/ var a = r[n];
107
- /******/ if (a !== undefined) {
108
- /******/ return a.exports;
109
- /******/ }
110
- /******/ // Create a new module (and put it into the cache)
111
- /******/ var o = r[n] = {
112
- /******/ // no module.id needed
113
- /******/ // no module.loaded needed
114
- /******/ exports: {}
115
- /******/ };
116
- /******/
117
- /******/ // Execute the module function
118
- /******/ e[n](o, o.exports, t);
119
- /******/
120
- /******/ // Return the exports of the module
121
- /******/ return o.exports;
122
- /******/ }
4
+ /******/ // The require scope
5
+ /******/ var e = {};
123
6
  /******/
124
7
  /************************************************************************/
125
8
  /******/ /* webpack/runtime/compat get default export */
126
9
  /******/ (() => {
127
10
  /******/ // getDefaultExport function for compatibility with non-harmony modules
128
- /******/ t.n = e => {
129
- /******/ var r = e && e.__esModule ?
130
- /******/ () => e["default"]
131
- /******/ : () => e
11
+ /******/ e.n = r => {
12
+ /******/ var t = r && r.__esModule ?
13
+ /******/ () => r["default"]
14
+ /******/ : () => r
132
15
  /******/;
133
- t.d(r, {
134
- a: r
16
+ e.d(t, {
17
+ a: t
135
18
  });
136
- /******/ return r;
19
+ /******/ return t;
137
20
  /******/ };
138
21
  /******/ })();
139
22
  /******/
140
23
  /******/ /* webpack/runtime/define property getters */
141
24
  /******/ (() => {
142
25
  /******/ // define getter functions for harmony exports
143
- /******/ t.d = (e, r) => {
144
- /******/ for (var n in r) {
145
- /******/ if (t.o(r, n) && !t.o(e, n)) {
146
- /******/ Object.defineProperty(e, n, {
26
+ /******/ e.d = (r, t) => {
27
+ /******/ for (var n in t) {
28
+ /******/ if (e.o(t, n) && !e.o(r, n)) {
29
+ /******/ Object.defineProperty(r, n, {
147
30
  enumerable: true,
148
- get: r[n]
31
+ get: t[n]
149
32
  });
150
33
  /******/ }
151
34
  /******/ }
@@ -154,14 +37,14 @@
154
37
  /******/
155
38
  /******/ /* webpack/runtime/hasOwnProperty shorthand */
156
39
  /******/ (() => {
157
- /******/ t.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
40
+ /******/ e.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
158
41
  /******/;
159
42
  })();
160
43
  /******/
161
44
  /******/ /* webpack/runtime/make namespace object */
162
45
  /******/ (() => {
163
46
  /******/ // define __esModule on exports
164
- /******/ t.r = e => {
47
+ /******/ e.r = e => {
165
48
  /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
166
49
  /******/ Object.defineProperty(e, Symbol.toStringTag, {
167
50
  value: "Module"
@@ -173,151 +56,149 @@
173
56
  /******/ };
174
57
  /******/ })();
175
58
  /******/
176
- /************************************************************************/ var n = {};
177
- // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
178
- (() => {
179
- // ESM COMPAT FLAG
180
- t.r(n);
181
- // EXPORTS
182
- t.d(n, {
183
- default: () => /* reexport */ cr,
184
- defaultPalette: () => /* reexport */ $e
185
- });
186
- // EXTERNAL MODULE: external "react"
187
- var e = t(9497);
188
- var r = t.n(e);
189
- // CONCATENATED MODULE: external "lodash/omit"
190
- const a = require("lodash/omit");
191
- var o = t.n(a);
192
- // CONCATENATED MODULE: external "lodash/pickBy"
193
- const l = require("lodash/pickBy");
194
- var i = t.n(l);
195
- // EXTERNAL MODULE: external "prop-types"
196
- var u = t(23);
197
- var s = t.n(u);
198
- // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
199
- const c = require("@splunk/react-ui/Dropdown");
200
- var d = t.n(c);
201
- // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
202
- const f = require("@splunk/react-ui/useControlled");
203
- var p = t.n(f);
204
- // CONCATENATED MODULE: external "@splunk/react-ui/usePrevious"
205
- const v = require("@splunk/react-ui/usePrevious");
206
- var b = t.n(v);
207
- // CONCATENATED MODULE: external "@splunk/ui-utils/color"
208
- const y = require("@splunk/ui-utils/color");
209
- // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
210
- const m = require("@splunk/ui-utils/i18n");
211
- // CONCATENATED MODULE: external "@splunk/ui-utils/id"
212
- const h = require("@splunk/ui-utils/id");
213
- // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
214
- const g = require("@splunk/react-ui/ScreenReaderContent");
215
- var w = t.n(g);
216
- // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
217
- const S = require("@splunk/react-ui/Tooltip");
218
- var C = t.n(S);
219
- // EXTERNAL MODULE: external "styled-components"
220
- var O = t(232);
221
- var x = t.n(O);
222
- // CONCATENATED MODULE: external "@splunk/react-icons/Palette"
223
- const k = require("@splunk/react-icons/Palette");
224
- var j = t.n(k);
225
- // CONCATENATED MODULE: external "@splunk/react-ui/Text"
226
- const E = require("@splunk/react-ui/Text");
227
- var I = t.n(E);
228
- // EXTERNAL MODULE: external "@splunk/themes"
229
- var P = t(3563);
230
- // CONCATENATED MODULE: ./src/Color/ColorInputStyles.ts
231
- // The text input displayed initially (not in the dropdown) is set to 104px to accommodate the
232
- // largest accepted value for Color, which is 'transparent,' while maintaining the base 8px grid.
233
- var _ = "104px";
234
- var q = x().div.withConfig({
235
- displayName: "ColorInputStyles__StyledTextWrapper",
236
- componentId: "sc-80hen8-0"
237
- })([ "display:flex;width:", ";flex:1 0 auto;" ], _);
238
- var B = x()(I()).withConfig({
239
- displayName: "ColorInputStyles__StyledText",
240
- componentId: "sc-80hen8-1"
241
- })([ "width:", ";" ], _);
242
- var R = x().div.withConfig({
243
- displayName: "ColorInputStyles__StyledSystemColorPickerWrapper",
244
- componentId: "sc-80hen8-2"
245
- })([ "position:relative;height:", ";width:", ";border:", " solid ", ";box-sizing:border-box;border-radius:", ";", " ", " &:focus-within{box-shadow:", ";}" ], P.variables.inputHeight, P.variables.inputHeight, P.variables.inputBorderWidth, P.variables.interactiveColorBorder, P.variables.borderRadius, (function(e) {
246
- var r = e.$append;
247
- return r && (0, O.css)([ "margin-inline-end:-1px;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
248
- }), (function(e) {
249
- var r = e.$prepend;
250
- return r && (0, O.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
251
- }), P.variables.focusShadow);
252
- var A = x().input.withConfig({
253
- displayName: "ColorInputStyles__StyledSystemColorPicker",
254
- componentId: "sc-80hen8-3"
255
- })([ "opacity:0;width:100%;height:100%;border:", " solid transparent;cursor:pointer;pointer-events:auto;" ], P.variables.inputBorderWidth);
256
- var T = x()(j()).withConfig({
257
- displayName: "ColorInputStyles__StyledColorPickerIcon",
258
- componentId: "sc-80hen8-4"
259
- })([ "box-sizing:border-box;height:100%;margin:auto;position:absolute;right:0;left:0;pointer-events:none;" ]);
260
- // CONCATENATED MODULE: external "@splunk/react-icons/Checkmark"
261
- const $ = require("@splunk/react-icons/Checkmark");
262
- var D = t.n($);
263
- // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
264
- const N = require("@splunk/react-ui/Clickable");
265
- var H = t.n(N);
266
- // CONCATENATED MODULE: ./src/utils/determineTextBrightness.ts
267
- function F(e, r) {
268
- return W(e) || V(e, r) || L(e, r) || M();
269
- }
270
- function M() {
271
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
59
+ /************************************************************************/ var r = {};
60
+ // ESM COMPAT FLAG
61
+ e.r(r);
62
+ // EXPORTS
63
+ e.d(r, {
64
+ default: () => /* reexport */ sr,
65
+ defaultPalette: () => /* reexport */ Re
66
+ });
67
+ // CONCATENATED MODULE: external "react"
68
+ const t = require("react");
69
+ var n = e.n(t);
70
+ // CONCATENATED MODULE: external "lodash/omit"
71
+ const a = require("lodash/omit");
72
+ var o = e.n(a);
73
+ // CONCATENATED MODULE: external "lodash/pickBy"
74
+ const l = require("lodash/pickBy");
75
+ var i = e.n(l);
76
+ // CONCATENATED MODULE: external "prop-types"
77
+ const u = require("prop-types");
78
+ var s = e.n(u);
79
+ // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
80
+ const c = require("@splunk/react-ui/Dropdown");
81
+ var d = e.n(c);
82
+ // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
83
+ const f = require("@splunk/react-ui/ScreenReaderContent");
84
+ var p = e.n(f);
85
+ // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
86
+ const v = require("@splunk/react-ui/useControlled");
87
+ var b = e.n(v);
88
+ // CONCATENATED MODULE: external "@splunk/react-ui/usePrevious"
89
+ const y = require("@splunk/react-ui/usePrevious");
90
+ var m = e.n(y);
91
+ // CONCATENATED MODULE: external "@splunk/ui-utils/color"
92
+ const h = require("@splunk/ui-utils/color");
93
+ // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
94
+ const g = require("@splunk/ui-utils/i18n");
95
+ // CONCATENATED MODULE: external "@splunk/ui-utils/id"
96
+ const w = require("@splunk/ui-utils/id");
97
+ // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
98
+ const S = require("@splunk/react-ui/Tooltip");
99
+ var C = e.n(S);
100
+ // CONCATENATED MODULE: external "styled-components"
101
+ const O = require("styled-components");
102
+ var x = e.n(O);
103
+ // CONCATENATED MODULE: external "@splunk/react-icons/Palette"
104
+ const k = require("@splunk/react-icons/Palette");
105
+ var E = e.n(k);
106
+ // CONCATENATED MODULE: external "@splunk/react-ui/Text"
107
+ const j = require("@splunk/react-ui/Text");
108
+ var I = e.n(j);
109
+ // CONCATENATED MODULE: external "@splunk/themes"
110
+ const P = require("@splunk/themes");
111
+ // CONCATENATED MODULE: ./src/Color/ColorInputStyles.ts
112
+ // The text input displayed initially (not in the dropdown) is set to 104px to accommodate the
113
+ // largest accepted value for Color, which is 'transparent,' while maintaining the base 8px grid.
114
+ var _ = "104px";
115
+ var q = x().div.withConfig({
116
+ displayName: "ColorInputStyles__StyledTextWrapper",
117
+ componentId: "sc-80hen8-0"
118
+ })([ "display:flex;width:", ";flex:1 0 auto;" ], _);
119
+ var B = x()(I()).withConfig({
120
+ displayName: "ColorInputStyles__StyledText",
121
+ componentId: "sc-80hen8-1"
122
+ })([ "width:", ";" ], _);
123
+ var A = x().div.withConfig({
124
+ displayName: "ColorInputStyles__StyledSystemColorPickerWrapper",
125
+ componentId: "sc-80hen8-2"
126
+ })([ "position:relative;height:", ";width:", ";border:", " solid ", ";box-sizing:border-box;border-radius:", ";", " ", " &:focus-within{box-shadow:", ";}" ], P.variables.inputHeight, P.variables.inputHeight, P.variables.inputBorderWidth, P.variables.interactiveColorBorder, P.variables.borderRadius, (function(e) {
127
+ var r = e.$append;
128
+ return r && (0, O.css)([ "margin-inline-end:-1px;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
129
+ }), (function(e) {
130
+ var r = e.$prepend;
131
+ return r && (0, O.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
132
+ }), P.variables.focusShadow);
133
+ var $ = x().input.withConfig({
134
+ displayName: "ColorInputStyles__StyledSystemColorPicker",
135
+ componentId: "sc-80hen8-3"
136
+ })([ "opacity:0;width:100%;height:100%;border:", " solid transparent;cursor:pointer;pointer-events:auto;" ], P.variables.inputBorderWidth);
137
+ var T = x()(E()).withConfig({
138
+ displayName: "ColorInputStyles__StyledColorPickerIcon",
139
+ componentId: "sc-80hen8-4"
140
+ })([ "box-sizing:border-box;height:100%;margin:auto;position:absolute;right:0;left:0;pointer-events:none;" ]);
141
+ // CONCATENATED MODULE: external "@splunk/react-icons/Checkmark"
142
+ const R = require("@splunk/react-icons/Checkmark");
143
+ var D = e.n(R);
144
+ // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
145
+ const N = require("@splunk/react-ui/Clickable");
146
+ var H = e.n(N);
147
+ // CONCATENATED MODULE: ./src/utils/determineTextBrightness.ts
148
+ function F(e, r) {
149
+ return W(e) || V(e, r) || L(e, r) || M();
150
+ }
151
+ function M() {
152
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
153
+ }
154
+ function L(e, r) {
155
+ if (e) {
156
+ if ("string" == typeof e) return z(e, r);
157
+ var t = {}.toString.call(e).slice(8, -1);
158
+ 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;
272
159
  }
273
- function L(e, r) {
274
- if (e) {
275
- if ("string" == typeof e) return z(e, r);
276
- var t = {}.toString.call(e).slice(8, -1);
277
- 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;
278
- }
279
- }
280
- function z(e, r) {
281
- (null == r || r > e.length) && (r = e.length);
282
- for (var t = 0, n = Array(r); t < r; t++) {
283
- n[t] = e[t];
284
- }
285
- return n;
160
+ }
161
+ function z(e, r) {
162
+ (null == r || r > e.length) && (r = e.length);
163
+ for (var t = 0, n = Array(r); t < r; t++) {
164
+ n[t] = e[t];
286
165
  }
287
- function V(e, r) {
288
- var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
289
- if (null != t) {
290
- var n, a, o, l, i = [], u = !0, s = !1;
166
+ return n;
167
+ }
168
+ function V(e, r) {
169
+ var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
170
+ if (null != t) {
171
+ var n, a, o, l, i = [], u = !0, s = !1;
172
+ try {
173
+ if (o = (t = t.call(e)).next, 0 === r) {
174
+ if (Object(t) !== t) return;
175
+ u = !1;
176
+ } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
177
+ }
178
+ } catch (e) {
179
+ s = !0, a = e;
180
+ } finally {
291
181
  try {
292
- if (o = (t = t.call(e)).next, 0 === r) {
293
- if (Object(t) !== t) return;
294
- u = !1;
295
- } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
296
- }
297
- } catch (e) {
298
- s = !0, a = e;
182
+ if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
299
183
  } finally {
300
- try {
301
- if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
302
- } finally {
303
- if (s) throw a;
304
- }
184
+ if (s) throw a;
305
185
  }
306
- return i;
307
186
  }
187
+ return i;
308
188
  }
309
- function W(e) {
310
- if (Array.isArray(e)) return e;
311
- }
312
- var K = "lightText";
313
- var U = "darkText";
314
- function G(e) {
315
- var r = F(e, 3), t = r[0], n = r[1], a = r[2];
316
- var o = (t * 299 + n * 587 + a * 114) / 1e3;
189
+ }
190
+ function W(e) {
191
+ if (Array.isArray(e)) return e;
192
+ }
193
+ var K = "lightText";
194
+ var U = "darkText";
195
+ function G(e) {
196
+ var r = F(e, 3), t = r[0], n = r[1], a = r[2];
197
+ var o = (t * 299 + n * 587 + a * 114) / 1e3;
317
198
  // formula from https://www.w3.org/TR/AERT/#color-contrast
318
- return o > 125 ? U : K;
319
- }
320
- /**
199
+ return o > 125 ? U : K;
200
+ }
201
+ /**
321
202
  * Determines if light or dark text should be used over a specific background color by determining the color brightness of a
322
203
  * supplied background color.
323
204
  * @param isLight - True if colorScheme is light. False if colorScheme is dark.
@@ -330,821 +211,818 @@
330
211
  * For example if a background color has a text brightness of 124 when the cutoff is determined by: brightness > 125 ? DARK_TEXT : LIGHT_TEXT
331
212
  * 2. If you use a color that is not black for dark text or white for light text that would decrease the likelihood that it would pass contrast with the background color
332
213
  * if you use determineTextBrightness to decide whether to use dark or light text.
333
- */ function J(e, r) {
334
- if (typeof r === "string") {
335
- if ((0, y.isValidHexColor)(r)) {
336
- // hex
337
- var t = r;
338
- if (t.length === 3 || t.length === 4) {
339
- // shorthand hex
340
- t = (0, y.expandShortHandHex)(t);
341
- }
342
- var n = (0, y.hexToRgb)(t);
343
- if (n != null) {
344
- return G(n);
345
- }
346
- } else if (r.includes(",")) {
347
- if ((0, y.isValidRgb)(r)) {
348
- // rgb
349
- var a = r.replace(/[^\d,]/g, "").split(",").slice(0, 3);
350
- var o = a.map((function(e) {
351
- return parseInt(e, 10);
352
- })), l = F(o, 3), i = l[0], u = l[1], s = l[2];
353
- return G([ i, u, s ]);
354
- }
355
- } else if (y.extendedColorKeywords.includes(r.toLowerCase())) {
356
- // named color
357
- var c = (0, y.namedColorToHex)(r.toLowerCase());
358
- if (c != null) {
359
- var d = (0, y.hexToRgb)(c);
360
- if (d != null) {
361
- return G(d);
362
- }
214
+ */ function J(e, r) {
215
+ if (typeof r === "string") {
216
+ if ((0, h.isValidHexColor)(r)) {
217
+ // hex
218
+ var t = r;
219
+ if (t.length === 3 || t.length === 4) {
220
+ // shorthand hex
221
+ t = (0, h.expandShortHandHex)(t);
222
+ }
223
+ var n = (0, h.hexToRgb)(t);
224
+ if (n != null) {
225
+ return G(n);
226
+ }
227
+ } else if (r.includes(",")) {
228
+ if ((0, h.isValidRgb)(r)) {
229
+ // rgb
230
+ var a = r.replace(/[^\d,]/g, "").split(",").slice(0, 3);
231
+ var o = a.map((function(e) {
232
+ return parseInt(e, 10);
233
+ })), l = F(o, 3), i = l[0], u = l[1], s = l[2];
234
+ return G([ i, u, s ]);
235
+ }
236
+ } else if (h.extendedColorKeywords.includes(r.toLowerCase())) {
237
+ // named color
238
+ var c = (0, h.namedColorToHex)(r.toLowerCase());
239
+ if (c != null) {
240
+ var d = (0, h.hexToRgb)(c);
241
+ if (d != null) {
242
+ return G(d);
363
243
  }
364
244
  }
365
245
  }
366
- // TODO: Need to add support for auto text color to work with theme variable background color (SUI-5706).
367
- /**
246
+ }
247
+ // TODO: Need to add support for auto text color to work with theme variable background color (SUI-5706).
248
+ /**
368
249
  * We know the backgroundColor defaults to variables.neutral200 so to save on computing we hard code the text brightness.
369
250
  * TODO: Convert theme variable color variables.neutral200 to rgb dynamically and memoize it (SUI-5731).
370
251
  */
371
- // backgroundColor is either not provided or an accepted representation of color
372
- return e ? U : K;
373
- }
374
- // CONCATENATED MODULE: ./src/Color/SwatchStyles.ts
375
- var Q = "rgba(0, 0, 0, 0.2)";
376
- var X = "n/a";
377
- var Y = "transparent";
378
- var Z = function e(r, t) {
379
- return J(r, t || undefined) === U ? P.variables.black : P.variables.white;
380
- };
381
- var ee = x()(D()).withConfig({
382
- displayName: "SwatchStyles__StyledCheck",
383
- componentId: "sc-1wxunhq-0"
384
- })([ "box-sizing:border-box;", "" ], (function(e) {
385
- var r = e.$value;
386
- return r === Y ? (0, O.css)([ "color:", ";" ], P.variables.black) : (0, P.pick)({
387
- light: (0, O.css)([ "color:", ";" ], Z(true, r)),
388
- dark: (0, O.css)([ "color:", ";" ], Z(false, r))
389
- });
390
- }));
391
- var re = x().div.withConfig({
392
- displayName: "SwatchStyles__StyledOuter",
393
- componentId: "sc-1wxunhq-1"
394
- })([ "border:", " solid ", ";border-radius:", ";box-sizing:border-box;height:", ";min-width:", ";&:focus-within{box-shadow:", ";z-index:1;}", " ", " ", "" ], P.variables.inputBorderWidth, P.variables.interactiveColorBorder, P.variables.borderRadius, P.variables.inputHeight, P.variables.inputHeight, P.variables.focusShadow, (function(e) {
395
- var r = e.$disabled;
396
- return !r && (0, O.css)([ "&:hover{border-color:", ";}" ], P.variables.interactiveColorBorderHover);
397
- }), (function(e) {
398
- var r = e.$prepend;
399
- return r && (0, O.css)([ "margin-left:1px;border-start-start-radius:0;border-end-start-radius:0;" ]);
400
- }), (function(e) {
401
- var r = e.$append;
402
- return r && (0, O.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-right:none;" ]);
403
- }));
404
- var te = x()(H()).attrs((function(e) {
405
- var r = e.$value;
406
- // this avoids styled-components generating a separate class for each swatch color
407
- // which avoids the "Over 200 classes were generated for component Component" warning
408
- // when rapidly changing colors (ie. with the system color picker)
409
- return r != null && r !== Y ? {
410
- style: {
411
- "background-color": r
412
- }
413
- } : {};
414
- })).withConfig({
415
- displayName: "SwatchStyles__StyledClickable",
416
- componentId: "sc-1wxunhq-2"
417
- })([ "display:block;position:relative;flex:0 0 auto;width:100%;height:100%;border:", " solid ", ";border-radius:3px;", ";", " ", " ", " &[disabled]{background-image:linear-gradient(rgba(255,255,255,0.8),rgba(255,255,255,0.8));}", " ", "" ], P.variables.inputBorderWidth, P.variables.neutral100, (function(e) {
418
- var r = e.$value;
419
- return r === null && (0, O.css)([ "background-image:linear-gradient( to bottom right,transparent 48%,", ",transparent 52% );" ], P.variables.contentColorNegative);
420
- }), (function(e) {
421
- var r = e.$value;
422
- return r === Y && (0, O.css)([ "background-image:linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " ),linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " );background-size:10px 10px;background-position:0 0,5px 5px;background-color:", ";" ], Q, Q, Q, Q, Q, Q, P.variables.white);
423
- }), (function(e) {
424
- var r = e.$prepend;
425
- return r && (0, O.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
426
- }), (function(e) {
427
- var r = e.$append;
428
- return r && (0, O.css)([ "border-start-end-radius:0;border-end-end-radius:0;" ]);
429
- }), (function(e) {
430
- var r = e.$hasError;
431
- return r && (0, O.css)([ "box-shadow:inset 0 0 0 2px white;border-color:", ";" ], P.variables.interactiveColorAccentError);
432
- }), (function(e) {
433
- var r = e.$showSelected;
434
- return r && (0, O.css)([ "display:flex;align-items:center;justify-content:center;" ]);
435
- }));
436
- // CONCATENATED MODULE: ./src/Color/Swatch.tsx
437
- function ne() {
438
- return ne = Object.assign ? Object.assign.bind() : function(e) {
439
- for (var r = 1; r < arguments.length; r++) {
440
- var t = arguments[r];
441
- for (var n in t) {
442
- ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
443
- }
444
- }
445
- return e;
446
- }, ne.apply(null, arguments);
447
- }
448
- function ae(e, r) {
449
- if (null == e) return {};
450
- var t, n, a = oe(e, r);
451
- if (Object.getOwnPropertySymbols) {
452
- var o = Object.getOwnPropertySymbols(e);
453
- for (n = 0; n < o.length; n++) {
454
- t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
455
- }
252
+ // backgroundColor is either not provided or an accepted representation of color
253
+ return e ? U : K;
254
+ }
255
+ // CONCATENATED MODULE: ./src/Color/SwatchStyles.ts
256
+ var Q = "rgba(0, 0, 0, 0.2)";
257
+ var X = "n/a";
258
+ var Y = "transparent";
259
+ var Z = function e(r, t) {
260
+ return J(r, t || undefined) === U ? P.variables.black : P.variables.white;
261
+ };
262
+ var ee = x()(D()).withConfig({
263
+ displayName: "SwatchStyles__StyledCheck",
264
+ componentId: "sc-1wxunhq-0"
265
+ })([ "box-sizing:border-box;", "" ], (function(e) {
266
+ var r = e.$value;
267
+ return r === Y ? (0, O.css)([ "color:", ";" ], P.variables.black) : (0, P.pick)({
268
+ light: (0, O.css)([ "color:", ";" ], Z(true, r)),
269
+ dark: (0, O.css)([ "color:", ";" ], Z(false, r))
270
+ });
271
+ }));
272
+ var re = x().div.withConfig({
273
+ displayName: "SwatchStyles__StyledOuter",
274
+ componentId: "sc-1wxunhq-1"
275
+ })([ "border:", " solid ", ";border-radius:", ";box-sizing:border-box;height:", ";min-width:", ";&:focus-within{box-shadow:", ";z-index:1;}", " ", " ", "" ], P.variables.inputBorderWidth, P.variables.interactiveColorBorder, P.variables.borderRadius, P.variables.inputHeight, P.variables.inputHeight, P.variables.focusShadow, (function(e) {
276
+ var r = e.$disabled;
277
+ return !r && (0, O.css)([ "&:hover{border-color:", ";}" ], P.variables.interactiveColorBorderHover);
278
+ }), (function(e) {
279
+ var r = e.$prepend;
280
+ return r && (0, O.css)([ "margin-left:1px;border-start-start-radius:0;border-end-start-radius:0;" ]);
281
+ }), (function(e) {
282
+ var r = e.$append;
283
+ return r && (0, O.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-right:none;" ]);
284
+ }));
285
+ var te = x()(H()).attrs((function(e) {
286
+ var r = e.$value;
287
+ // this avoids styled-components generating a separate class for each swatch color
288
+ // which avoids the "Over 200 classes were generated for component Component" warning
289
+ // when rapidly changing colors (ie. with the system color picker)
290
+ return r != null && r !== Y ? {
291
+ style: {
292
+ "background-color": r
456
293
  }
457
- return a;
458
- }
459
- function oe(e, r) {
460
- if (null == e) return {};
461
- var t = {};
462
- for (var n in e) {
463
- if ({}.hasOwnProperty.call(e, n)) {
464
- if (-1 !== r.indexOf(n)) continue;
465
- t[n] = e[n];
294
+ } : {};
295
+ })).withConfig({
296
+ displayName: "SwatchStyles__StyledClickable",
297
+ componentId: "sc-1wxunhq-2"
298
+ })([ "display:block;position:relative;flex:0 0 auto;width:100%;height:100%;border:", " solid ", ";border-radius:3px;", ";", " ", " ", " &[disabled]{background-image:linear-gradient(rgba(255,255,255,0.8),rgba(255,255,255,0.8));}", " ", "" ], P.variables.inputBorderWidth, P.variables.neutral100, (function(e) {
299
+ var r = e.$value;
300
+ return r === null && (0, O.css)([ "background-image:linear-gradient( to bottom right,transparent 48%,", ",transparent 52% );" ], P.variables.contentColorNegative);
301
+ }), (function(e) {
302
+ var r = e.$value;
303
+ return r === Y && (0, O.css)([ "background-image:linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " ),linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " );background-size:10px 10px;background-position:0 0,5px 5px;background-color:", ";" ], Q, Q, Q, Q, Q, Q, P.variables.white);
304
+ }), (function(e) {
305
+ var r = e.$prepend;
306
+ return r && (0, O.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
307
+ }), (function(e) {
308
+ var r = e.$append;
309
+ return r && (0, O.css)([ "border-start-end-radius:0;border-end-end-radius:0;" ]);
310
+ }), (function(e) {
311
+ var r = e.$hasError;
312
+ return r && (0, O.css)([ "box-shadow:inset 0 0 0 2px white;border-color:", ";" ], P.variables.interactiveColorAccentError);
313
+ }), (function(e) {
314
+ var r = e.$showSelected;
315
+ return r && (0, O.css)([ "display:flex;align-items:center;justify-content:center;" ]);
316
+ }));
317
+ // CONCATENATED MODULE: ./src/Color/Swatch.tsx
318
+ function ne() {
319
+ return ne = Object.assign ? Object.assign.bind() : function(e) {
320
+ for (var r = 1; r < arguments.length; r++) {
321
+ var t = arguments[r];
322
+ for (var n in t) {
323
+ ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
466
324
  }
467
325
  }
468
- return t;
469
- }
470
- var le = {
471
- append: s().bool,
472
- elementRef: s().oneOfType([ s().func, s().object ]),
473
- /** @private */
474
- error: s().bool,
475
- /** @private. Call back function when activated. */
476
- onClick: s().func,
477
- prepend: s().bool,
478
- value: s().string,
479
- /** @private */
480
- showSelected: s().bool
481
- };
482
- var ie = r().forwardRef((function(t, n) {
483
- var a = t.append, o = t.disabled, l = t.error, i = l === void 0 ? false : l, u = t.onClick, s = t.prepend, c = t.value, d = t.showSelected, f = ae(t, [ "append", "disabled", "error", "onClick", "prepend", "value", "showSelected" ]);
484
- // @docs-props-type SwatchPropsBase
485
- var p = c === null || c === undefined ? (0, m._)("No color") : c;
486
- // Only valid hexadecimal strings, 'transparent' and `null` are allowed for background colors
487
- // Invalid values are converted to `undefined`
488
- var v = c;
489
- if (!(typeof v === "string" && ((0, y.isValidHexColor)(v) || v === "transparent")) && v !== null && v !== undefined) {
490
- v = undefined;
326
+ return e;
327
+ }, ne.apply(null, arguments);
328
+ }
329
+ function ae(e, r) {
330
+ if (null == e) return {};
331
+ var t, n, a = oe(e, r);
332
+ if (Object.getOwnPropertySymbols) {
333
+ var o = Object.getOwnPropertySymbols(e);
334
+ for (n = 0; n < o.length; n++) {
335
+ t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
491
336
  }
492
- var b = (0, e.useCallback)((function(e) {
493
- return u === null || u === void 0 ? void 0 : u(e, {
494
- value: c
495
- });
496
- }), [ u, c ]);
497
-
498
- return r().createElement(re, {
499
- $disabled: o !== null && o !== void 0 ? o : false,
500
- $append: a,
501
- $prepend: s
502
- }, r().createElement(te, ne({
503
- onClick: b,
504
- disabled: o ? "disabled" : undefined,
505
- ref: n,
506
- $value: v,
507
- $append: a,
508
- $prepend: s,
509
- $hasError: i,
510
- $showSelected: d,
511
- "data-test": "swatch",
512
- "data-test-value": c
513
- }, f), d && r().createElement(ee, {
514
- "aria-label": (0, m._)("Selected"),
515
- role: "presentation",
516
- $value: v
517
- }), r().createElement(w(), null, p)));
518
- }));
519
- ie.propTypes = le;
520
- /* harmony default export */ const ue = ie;
521
- // CONCATENATED MODULE: ./src/Color/ColorInput.tsx
522
- function se() {
523
- return se = Object.assign ? Object.assign.bind() : function(e) {
524
- for (var r = 1; r < arguments.length; r++) {
525
- var t = arguments[r];
526
- for (var n in t) {
527
- ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
528
- }
529
- }
530
- return e;
531
- }, se.apply(null, arguments);
532
337
  }
533
- function ce(e, r) {
534
- return be(e) || ve(e, r) || fe(e, r) || de();
338
+ return a;
339
+ }
340
+ function oe(e, r) {
341
+ if (null == e) return {};
342
+ var t = {};
343
+ for (var n in e) {
344
+ if ({}.hasOwnProperty.call(e, n)) {
345
+ if (-1 !== r.indexOf(n)) continue;
346
+ t[n] = e[n];
347
+ }
535
348
  }
536
- function de() {
537
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
349
+ return t;
350
+ }
351
+ var le = {
352
+ append: s().bool,
353
+ elementRef: s().oneOfType([ s().func, s().object ]),
354
+ /** @private */
355
+ error: s().bool,
356
+ /** @private. Call back function when activated. */
357
+ onClick: s().func,
358
+ prepend: s().bool,
359
+ value: s().string,
360
+ /** @private */
361
+ showSelected: s().bool
362
+ };
363
+ var ie = n().forwardRef((function(e, r) {
364
+ var a = e.append, o = e.disabled, l = e.error, i = l === void 0 ? false : l, u = e.onClick, s = e.prepend, c = e.value, d = e.showSelected, f = ae(e, [ "append", "disabled", "error", "onClick", "prepend", "value", "showSelected" ]);
365
+ // @docs-props-type SwatchPropsBase
366
+ var v = c === null || c === undefined ? (0, g._)("No color") : c;
367
+ // Only valid hexadecimal strings, 'transparent' and `null` are allowed for background colors
368
+ // Invalid values are converted to `undefined`
369
+ var b = c;
370
+ if (!(typeof b === "string" && ((0, h.isValidHexColor)(b) || b === "transparent")) && b !== null && b !== undefined) {
371
+ b = undefined;
538
372
  }
539
- function fe(e, r) {
540
- if (e) {
541
- if ("string" == typeof e) return pe(e, r);
542
- var t = {}.toString.call(e).slice(8, -1);
543
- 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) ? pe(e, r) : void 0;
373
+ var y = (0, t.useCallback)((function(e) {
374
+ return u === null || u === void 0 ? void 0 : u(e, {
375
+ value: c
376
+ });
377
+ }), [ u, c ]);
378
+
379
+ return n().createElement(re, {
380
+ $disabled: o !== null && o !== void 0 ? o : false,
381
+ $append: a,
382
+ $prepend: s
383
+ }, n().createElement(te, ne({
384
+ onClick: y,
385
+ disabled: o ? "disabled" : undefined,
386
+ ref: r,
387
+ $value: b,
388
+ $append: a,
389
+ $prepend: s,
390
+ $hasError: i,
391
+ $showSelected: d,
392
+ "data-test": "swatch",
393
+ "data-test-value": c
394
+ }, f), d && n().createElement(ee, {
395
+ "aria-label": (0, g._)("Selected"),
396
+ role: "presentation",
397
+ $value: b
398
+ }), n().createElement(p(), null, v)));
399
+ }));
400
+ ie.propTypes = le;
401
+ /* harmony default export */ const ue = ie;
402
+ // CONCATENATED MODULE: ./src/Color/ColorInput.tsx
403
+ function se() {
404
+ return se = Object.assign ? Object.assign.bind() : function(e) {
405
+ for (var r = 1; r < arguments.length; r++) {
406
+ var t = arguments[r];
407
+ for (var n in t) {
408
+ ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
409
+ }
544
410
  }
411
+ return e;
412
+ }, se.apply(null, arguments);
413
+ }
414
+ function ce(e, r) {
415
+ return be(e) || ve(e, r) || fe(e, r) || de();
416
+ }
417
+ function de() {
418
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
419
+ }
420
+ function fe(e, r) {
421
+ if (e) {
422
+ if ("string" == typeof e) return pe(e, r);
423
+ var t = {}.toString.call(e).slice(8, -1);
424
+ 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) ? pe(e, r) : void 0;
545
425
  }
546
- function pe(e, r) {
547
- (null == r || r > e.length) && (r = e.length);
548
- for (var t = 0, n = Array(r); t < r; t++) {
549
- n[t] = e[t];
550
- }
551
- return n;
426
+ }
427
+ function pe(e, r) {
428
+ (null == r || r > e.length) && (r = e.length);
429
+ for (var t = 0, n = Array(r); t < r; t++) {
430
+ n[t] = e[t];
552
431
  }
553
- function ve(e, r) {
554
- var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
555
- if (null != t) {
556
- var n, a, o, l, i = [], u = !0, s = !1;
432
+ return n;
433
+ }
434
+ function ve(e, r) {
435
+ var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
436
+ if (null != t) {
437
+ var n, a, o, l, i = [], u = !0, s = !1;
438
+ try {
439
+ if (o = (t = t.call(e)).next, 0 === r) {
440
+ if (Object(t) !== t) return;
441
+ u = !1;
442
+ } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
443
+ }
444
+ } catch (e) {
445
+ s = !0, a = e;
446
+ } finally {
557
447
  try {
558
- if (o = (t = t.call(e)).next, 0 === r) {
559
- if (Object(t) !== t) return;
560
- u = !1;
561
- } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
562
- }
563
- } catch (e) {
564
- s = !0, a = e;
448
+ if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
565
449
  } finally {
566
- try {
567
- if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
568
- } finally {
569
- if (s) throw a;
570
- }
450
+ if (s) throw a;
571
451
  }
572
- return i;
573
452
  }
453
+ return i;
574
454
  }
575
- function be(e) {
576
- if (Array.isArray(e)) return e;
577
- }
578
- function ye(e, r) {
579
- if (null == e) return {};
580
- var t, n, a = me(e, r);
581
- if (Object.getOwnPropertySymbols) {
582
- var o = Object.getOwnPropertySymbols(e);
583
- for (n = 0; n < o.length; n++) {
584
- t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
585
- }
455
+ }
456
+ function be(e) {
457
+ if (Array.isArray(e)) return e;
458
+ }
459
+ function ye(e, r) {
460
+ if (null == e) return {};
461
+ var t, n, a = me(e, r);
462
+ if (Object.getOwnPropertySymbols) {
463
+ var o = Object.getOwnPropertySymbols(e);
464
+ for (n = 0; n < o.length; n++) {
465
+ t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
586
466
  }
587
- return a;
588
467
  }
589
- function me(e, r) {
590
- if (null == e) return {};
591
- var t = {};
592
- for (var n in e) {
593
- if ({}.hasOwnProperty.call(e, n)) {
594
- if (-1 !== r.indexOf(n)) continue;
595
- t[n] = e[n];
596
- }
468
+ return a;
469
+ }
470
+ function me(e, r) {
471
+ if (null == e) return {};
472
+ var t = {};
473
+ for (var n in e) {
474
+ if ({}.hasOwnProperty.call(e, n)) {
475
+ if (-1 !== r.indexOf(n)) continue;
476
+ t[n] = e[n];
597
477
  }
598
- return t;
599
478
  }
600
- /**
479
+ return t;
480
+ }
481
+ /**
601
482
  * Formats the value for display in the input.
602
- */ var he = function e(r) {
603
- if (r === undefined) {
604
- return "";
605
- }
606
- if (r === null) {
607
- return X;
608
- }
609
- var t = r.toLowerCase();
610
- if (t === X) {
611
- return X;
612
- }
613
- if (t === Y) {
614
- return Y;
615
- }
616
- // If the user types in the hexadecimal number without # in front, we add # automatically.
617
- if (!t.startsWith("#")) {
618
- var n = "#".concat(t);
619
- if ((0, y.isValidHexColor)(n)) {
620
- return (0, y.expandShortHandHex)(n);
621
- }
483
+ */ var he = function e(r) {
484
+ if (r === undefined) {
485
+ return "";
486
+ }
487
+ if (r === null) {
488
+ return X;
489
+ }
490
+ var t = r.toLowerCase();
491
+ if (t === X) {
492
+ return X;
493
+ }
494
+ if (t === Y) {
495
+ return Y;
496
+ }
497
+ // If the user types in the hexadecimal number without # in front, we add # automatically.
498
+ if (!t.startsWith("#")) {
499
+ var n = "#".concat(t);
500
+ if ((0, h.isValidHexColor)(n)) {
501
+ return (0, h.expandShortHandHex)(n);
622
502
  }
623
- return (0, y.expandShortHandHex)(t);
624
- };
625
- /**
503
+ }
504
+ return (0, h.expandShortHandHex)(t);
505
+ };
506
+ /**
626
507
  * Returns the value that's valid for Color's onChange
627
- */ var ge = function e(r) {
628
- if (r === X) {
629
- return null;
508
+ */ var ge = function e(r) {
509
+ if (r === X) {
510
+ return null;
511
+ }
512
+ if (r === "") {
513
+ return undefined;
514
+ }
515
+ return r;
516
+ };
517
+ var we = (0, g._)("Open system color picker");
518
+ var Se = function e(r) {
519
+ var a = r.allowTransparent, o = r.append, l = r.disabled, i = r.inputRef, u = r.labelledBy, s = r.onChange, c = r.showPicker, d = r.showSubmitButton, f = r.value, v = r.valueIsCustom, b = ye(r, [ "allowTransparent", "append", "disabled", "inputRef", "labelledBy", "onChange", "showPicker", "showSubmitButton", "value", "valueIsCustom" ]);
520
+ var y = (0, t.useState)((0, w.createDOMID)("hex-input-reader-content")), m = ce(y, 1), S = m[0];
521
+ var O = (0, t.useState)(""), x = ce(O, 2), k = x[0], E = x[1];
522
+ var j = (0, t.useState)(""), I = ce(j, 2), P = I[0], _ = I[1];
523
+ var R = (0, t.useCallback)((function(e) {
524
+ E(ge(e));
525
+ _(e !== null && e !== void 0 ? e : "");
526
+ }), []);
527
+ (0, t.useEffect)((function() {
528
+ E(ge(f));
529
+ _(he(f));
530
+ }), [ f ]);
531
+ var D = (0, t.useCallback)((function(e) {
532
+ var r = ge(he(P));
533
+ var t = r !== undefined && (r == null || r === Y && a || (0, h.isValidHexColor)(r));
534
+ if (t) {
535
+ s === null || s === void 0 ? void 0 : s(e, {
536
+ value: r
537
+ });
538
+ } else {
539
+ // eslint-disable-next-line no-console
540
+ console.warn('"'.concat(r, '" is not a valid hex color.'));
630
541
  }
631
- if (r === "") {
632
- return undefined;
542
+ }), [ a, P, s ]);
543
+ var N = (0, t.useCallback)((function(e, r) {
544
+ var t = r.value;
545
+ R(t);
546
+ }), [ R ]);
547
+ var H = (0, t.useCallback)((function(e) {
548
+ if (e.key === "Enter") {
549
+ e.preventDefault();
550
+ D(e);
633
551
  }
634
- return r;
635
- };
636
- var we = (0, m._)("Open system color picker");
637
- var Se = function t(n) {
638
- var a = n.allowTransparent, o = n.append, l = n.disabled, i = n.inputRef, u = n.labelledBy, s = n.onChange, c = n.showPicker, d = n.showSubmitButton, f = n.value, p = n.valueIsCustom, v = ye(n, [ "allowTransparent", "append", "disabled", "inputRef", "labelledBy", "onChange", "showPicker", "showSubmitButton", "value", "valueIsCustom" ]);
639
- var b = (0, e.useState)((0, h.createDOMID)("hex-input-reader-content")), g = ce(b, 1), S = g[0];
640
- var O = (0, e.useState)(""), x = ce(O, 2), k = x[0], j = x[1];
641
- var E = (0, e.useState)(""), I = ce(E, 2), P = I[0], _ = I[1];
642
- var $ = (0, e.useCallback)((function(e) {
643
- j(ge(e));
644
- _(e !== null && e !== void 0 ? e : "");
645
- }), []);
646
- (0, e.useEffect)((function() {
647
- j(ge(f));
648
- _(he(f));
649
- }), [ f ]);
650
- var D = (0, e.useCallback)((function(e) {
651
- var r = ge(he(P));
652
- var t = r !== undefined && (r == null || r === Y && a || (0, y.isValidHexColor)(r));
653
- if (t) {
654
- s === null || s === void 0 ? void 0 : s(e, {
655
- value: r
656
- });
657
- } else {
658
- // eslint-disable-next-line no-console
659
- console.warn('"'.concat(r, '" is not a valid hex color.'));
660
- }
661
- }), [ a, P, s ]);
662
- var N = (0, e.useCallback)((function(e, r) {
663
- var t = r.value;
664
- $(t);
665
- }), [ $ ]);
666
- var H = (0, e.useCallback)((function(e) {
667
- if (e.key === "Enter") {
668
- e.preventDefault();
669
- D(e);
670
- }
671
- }), [ D ]);
672
- var F = (0, e.useCallback)((function(e) {
673
- var r = e.target.value;
674
- $(r);
675
- }), [ $ ]);
676
- var M = c && r().createElement(C(), {
677
- content: we,
678
- defaultPlacement: "below"
679
- }, r().createElement(R, {
680
- $append: o,
681
- $prepend: true
682
- }, r().createElement(T, null), r().createElement(A, {
683
- "aria-label": we,
684
- disabled: !!l,
685
- onChange: F,
686
- type: "color",
687
- value: f === null ? "" : f
688
- })));
689
-
690
- return r().createElement(r().Fragment, null, r().createElement(q, null, r().createElement(w(), {
691
- id: S
692
- }, (0, m._)("Hexadecimal color value")), r().createElement(B, se({
693
- append: o || c,
694
- autoCapitalize: "off",
695
- autoComplete: "off",
696
- autoCorrect: "off",
697
- disabled: l,
698
- inputRef: i,
699
- labelledBy: u ? "".concat(u, " ").concat(S) : S,
700
- onChange: N,
701
- onKeyDown: H,
702
- spellCheck: false,
703
- value: P
704
- }, v)), M), d && r().createElement(ue, {
705
- "data-test": "textbox-swatch",
706
- disabled: !!l,
707
- onClick: D,
708
- showSelected: p && k === f,
709
- value: k
710
- }));
711
- };
712
- /* harmony default export */ const Ce = Se;
713
- // CONCATENATED MODULE: ./src/Color/ColorStyles.ts
714
- var Oe = x().div.withConfig({
715
- displayName: "ColorStyles__StyledColor",
716
- componentId: "jxrost-0"
717
- })([ "", ";flex-direction:row;" ], P.mixins.reset("flex"));
718
- var xe = x().div.withConfig({
719
- displayName: "ColorStyles__StyledPaletteInputWrapper",
720
- componentId: "jxrost-1"
721
- })([ "display:flex;min-width:0;gap:", ";" ], P.variables.spacingSmall);
722
- var ke = x()(Ce).withConfig({
723
- displayName: "ColorStyles__StyledColorInput",
724
- componentId: "jxrost-2"
725
- })([ "flex-grow:0;&:focus-within{z-index:1;}" ]);
726
- // CONCATENATED MODULE: external "@splunk/react-ui/Divider"
727
- const je = require("@splunk/react-ui/Divider");
728
- var Ee = t.n(je);
729
- // CONCATENATED MODULE: ./src/Color/PaletteStyles.ts
730
- var Ie = 5;
731
- var Pe = x().div.withConfig({
732
- displayName: "PaletteStyles__StyledPalette",
733
- componentId: "qgv9v9-0"
734
- })([ "padding:", " ", ";" ], P.variables.spacingMedium, P.variables.spacingLarge);
735
- var _e = x().ul.withConfig({
736
- displayName: "PaletteStyles__StyledSwatches",
737
- componentId: "qgv9v9-1"
738
- })([ "", ";grid-template-columns:repeat(", ",", ");gap:", ";" ], P.mixins.reset("grid"), Ie, P.variables.inputHeight, P.variables.spacingSmall);
739
- var qe = x().li.withConfig({
740
- displayName: "PaletteStyles__StyledSwatch",
741
- componentId: "qgv9v9-2"
742
- })([ "", ";" ], P.mixins.reset("inline-block"));
743
- var Be = x().div.withConfig({
744
- displayName: "PaletteStyles__StyledToolBar",
745
- componentId: "qgv9v9-3"
746
- })([ "position:relative;display:flex;align-items:center;gap:", ";" ], P.variables.spacingSmall);
747
- var Re = x()(Ee()).withConfig({
748
- displayName: "PaletteStyles__StyledDivider",
749
- componentId: "qgv9v9-4"
750
- })([ "margin-block:", ";" ], P.variables.spacingSmall);
751
- // CONCATENATED MODULE: ./src/Color/Palette.tsx
752
- function Ae(e, r) {
753
- if (null == e) return {};
754
- var t, n, a = Te(e, r);
755
- if (Object.getOwnPropertySymbols) {
756
- var o = Object.getOwnPropertySymbols(e);
757
- for (n = 0; n < o.length; n++) {
758
- t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
759
- }
552
+ }), [ D ]);
553
+ var F = (0, t.useCallback)((function(e) {
554
+ var r = e.target.value;
555
+ R(r);
556
+ }), [ R ]);
557
+ var M = c && n().createElement(C(), {
558
+ content: we,
559
+ defaultPlacement: "below"
560
+ }, n().createElement(A, {
561
+ $append: o,
562
+ $prepend: true
563
+ }, n().createElement(T, null), n().createElement($, {
564
+ "aria-label": we,
565
+ disabled: !!l,
566
+ onChange: F,
567
+ type: "color",
568
+ value: f === null ? "" : f
569
+ })));
570
+
571
+ return n().createElement(n().Fragment, null, n().createElement(q, null, n().createElement(p(), {
572
+ id: S
573
+ }, (0, g._)("Hexadecimal color value")), n().createElement(B, se({
574
+ append: o || c,
575
+ autoCapitalize: "off",
576
+ autoComplete: "off",
577
+ autoCorrect: "off",
578
+ disabled: l,
579
+ inputRef: i,
580
+ labelledBy: u ? "".concat(u, " ").concat(S) : S,
581
+ onChange: N,
582
+ onKeyDown: H,
583
+ spellCheck: false,
584
+ value: P
585
+ }, b)), M), d && n().createElement(ue, {
586
+ "data-test": "textbox-swatch",
587
+ disabled: !!l,
588
+ onClick: D,
589
+ showSelected: v && k === f,
590
+ value: k
591
+ }));
592
+ };
593
+ /* harmony default export */ const Ce = Se;
594
+ // CONCATENATED MODULE: ./src/Color/ColorStyles.ts
595
+ var Oe = x().div.withConfig({
596
+ displayName: "ColorStyles__StyledColor",
597
+ componentId: "jxrost-0"
598
+ })([ "", ";flex-direction:row;" ], P.mixins.reset("flex"));
599
+ var xe = x().div.withConfig({
600
+ displayName: "ColorStyles__StyledPaletteInputWrapper",
601
+ componentId: "jxrost-1"
602
+ })([ "display:flex;min-width:0;gap:", ";" ], P.variables.spacingSmall);
603
+ var ke = x()(Ce).withConfig({
604
+ displayName: "ColorStyles__StyledColorInput",
605
+ componentId: "jxrost-2"
606
+ })([ "flex-grow:0;&:focus-within{z-index:1;}" ]);
607
+ // CONCATENATED MODULE: external "@splunk/react-ui/Divider"
608
+ const Ee = require("@splunk/react-ui/Divider");
609
+ var je = e.n(Ee);
610
+ // CONCATENATED MODULE: ./src/Color/PaletteStyles.ts
611
+ var Ie = 5;
612
+ var Pe = x().div.withConfig({
613
+ displayName: "PaletteStyles__StyledPalette",
614
+ componentId: "qgv9v9-0"
615
+ })([ "padding:", " ", ";" ], P.variables.spacingMedium, P.variables.spacingLarge);
616
+ var _e = x().ul.withConfig({
617
+ displayName: "PaletteStyles__StyledSwatches",
618
+ componentId: "qgv9v9-1"
619
+ })([ "", ";grid-template-columns:repeat(", ",", ");gap:", ";" ], P.mixins.reset("grid"), Ie, P.variables.inputHeight, P.variables.spacingSmall);
620
+ var qe = x().li.withConfig({
621
+ displayName: "PaletteStyles__StyledSwatch",
622
+ componentId: "qgv9v9-2"
623
+ })([ "", ";" ], P.mixins.reset("inline-block"));
624
+ var Be = x().div.withConfig({
625
+ displayName: "PaletteStyles__StyledToolBar",
626
+ componentId: "qgv9v9-3"
627
+ })([ "position:relative;display:flex;align-items:center;gap:", ";" ], P.variables.spacingSmall);
628
+ var Ae = x()(je()).withConfig({
629
+ displayName: "PaletteStyles__StyledDivider",
630
+ componentId: "qgv9v9-4"
631
+ })([ "margin-block:", ";" ], P.variables.spacingSmall);
632
+ // CONCATENATED MODULE: ./src/Color/Palette.tsx
633
+ function $e(e, r) {
634
+ if (null == e) return {};
635
+ var t, n, a = Te(e, r);
636
+ if (Object.getOwnPropertySymbols) {
637
+ var o = Object.getOwnPropertySymbols(e);
638
+ for (n = 0; n < o.length; n++) {
639
+ t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
760
640
  }
761
- return a;
762
641
  }
763
- function Te(e, r) {
764
- if (null == e) return {};
765
- var t = {};
766
- for (var n in e) {
767
- if ({}.hasOwnProperty.call(e, n)) {
768
- if (-1 !== r.indexOf(n)) continue;
769
- t[n] = e[n];
770
- }
642
+ return a;
643
+ }
644
+ function Te(e, r) {
645
+ if (null == e) return {};
646
+ var t = {};
647
+ for (var n in e) {
648
+ if ({}.hasOwnProperty.call(e, n)) {
649
+ if (-1 !== r.indexOf(n)) continue;
650
+ t[n] = e[n];
771
651
  }
772
- return t;
773
652
  }
774
- var $e = [ "#7B56DB", "#009CEB", "#00CDAF", "#DD9900", "#FF677B", "#CB2196", "#813193", "#0051B5", "#008C80", "#99B100", "#FFA476", "#FF6ACE", "#AE8CFF", "#00689D", "#00490A", "#465D00", "#9D6300", "#F6540B", "#FF969E", "#E47BFE" ];
775
- var De = function e(r, t) {
776
- return t != null && (r === null || r === void 0 ? void 0 : r.includes(t));
777
- };
778
- var Ne = [ null, "#ffffff", "#000000" ];
779
- function He(t) {
780
- var n = t.activeInputRef, a = t.disabled, o = t.onChange, l = t.palette, i = l === void 0 ? $e : l, u = t.value, s = Ae(t, [ "activeInputRef", "disabled", "onChange", "palette", "value" ]);
781
- // @docs-props-type PalettePropsBase
782
- var c = (0, e.useMemo)((function() {
783
- return i === null || i === void 0 ? void 0 : i.map((function(e) {
784
- return e === null ? e : e.toLowerCase();
785
- }));
786
- }), [ i ]);
787
- var d = u != null ? u.toLowerCase() : u;
788
- var f = (0, e.useMemo)((function() {
789
- return De(c, d);
790
- }), [ c, d ]);
791
- var p = (0, e.useMemo)((function() {
792
- return De(Ne, d);
793
- }), [ d ]);
794
- var v = !f && !p && d !== "";
795
- var b = (0, e.useMemo)((function() {
796
- return c.some((function(e) {
797
- return e !== null && e.toLowerCase() === Y;
798
- }));
799
- }), [ c ]);
800
- var y = (0, e.useCallback)((function(e, r) {
801
- var t = r.value;
802
- o(e, {
803
- value: t
804
- });
805
- }), [ o ]);
806
- var m = c.map((function(e) {
807
- var t = e === null ? null : e.toLowerCase();
808
- var o = t === d;
809
-
810
- return r().createElement(qe, {
811
- key: t || "null"
812
- }, r().createElement(ue, {
813
- value: t,
814
- ref: o ? n : null,
815
- onClick: y,
816
- showSelected: o,
817
- disabled: a
818
- }));
653
+ return t;
654
+ }
655
+ var Re = [ "#7B56DB", "#009CEB", "#00CDAF", "#DD9900", "#FF677B", "#CB2196", "#813193", "#0051B5", "#008C80", "#99B100", "#FFA476", "#FF6ACE", "#AE8CFF", "#00689D", "#00490A", "#465D00", "#9D6300", "#F6540B", "#FF969E", "#E47BFE" ];
656
+ var De = function e(r, t) {
657
+ return t != null && (r === null || r === void 0 ? void 0 : r.includes(t));
658
+ };
659
+ var Ne = [ null, "#ffffff", "#000000" ];
660
+ function He(e) {
661
+ var r = e.activeInputRef, a = e.disabled, o = e.onChange, l = e.palette, i = l === void 0 ? Re : l, u = e.value, s = $e(e, [ "activeInputRef", "disabled", "onChange", "palette", "value" ]);
662
+ // @docs-props-type PalettePropsBase
663
+ var c = (0, t.useMemo)((function() {
664
+ return i === null || i === void 0 ? void 0 : i.map((function(e) {
665
+ return e === null ? e : e.toLowerCase();
819
666
  }));
820
- var h = r().createElement(Be, {
821
- "data-test": "tool-bar"
822
- }, Ne.map((function(e) {
823
-
824
- return r().createElement(ue, {
825
- key: e,
826
- disabled: a,
827
- onClick: y,
828
- ref: d === e ? n : null,
829
- showSelected: d === e,
830
- value: e
831
- });
832
- })));
667
+ }), [ i ]);
668
+ var d = u != null ? u.toLowerCase() : u;
669
+ var f = (0, t.useMemo)((function() {
670
+ return De(c, d);
671
+ }), [ c, d ]);
672
+ var p = (0, t.useMemo)((function() {
673
+ return De(Ne, d);
674
+ }), [ d ]);
675
+ var v = !f && !p && d !== "";
676
+ var b = (0, t.useMemo)((function() {
677
+ return c.some((function(e) {
678
+ return e !== null && e.toLowerCase() === Y;
679
+ }));
680
+ }), [ c ]);
681
+ var y = (0, t.useCallback)((function(e, r) {
682
+ var t = r.value;
683
+ o(e, {
684
+ value: t
685
+ });
686
+ }), [ o ]);
687
+ var m = c.map((function(e) {
688
+ var t = e === null ? null : e.toLowerCase();
689
+ var o = t === d;
833
690
 
834
- return r().createElement(Pe, s, m.length > 0 && r().createElement(r().Fragment, null, r().createElement(_e, null, m), r().createElement(Re, {
835
- appearance: "weak"
836
- })), h, r().createElement(Re, {
837
- appearance: "weak"
838
- }), r().createElement(xe, null, r().createElement(Ce, {
839
- allowTransparent: b,
691
+ return n().createElement(qe, {
692
+ key: t || "null"
693
+ }, n().createElement(ue, {
694
+ value: t,
695
+ ref: o ? r : null,
696
+ onClick: y,
697
+ showSelected: o,
698
+ disabled: a
699
+ }));
700
+ }));
701
+ var h = n().createElement(Be, {
702
+ "data-test": "tool-bar"
703
+ }, Ne.map((function(e) {
704
+
705
+ return n().createElement(ue, {
706
+ key: e,
840
707
  disabled: a,
841
- inputRef: v ? n : null,
842
- onChange: y,
843
- showPicker: true,
844
- showSubmitButton: true,
845
- value: d,
846
- valueIsCustom: v
847
- })));
848
- }
849
- /* harmony default export */ const Fe = He;
850
- // EXTERNAL MODULE: ./src/ScreenReaderContent/index.ts + 2 modules
851
- var Me = t(6165);
852
- // CONCATENATED MODULE: ./src/Color/Color.tsx
853
- function Le(e) {
854
- "@babel/helpers - typeof";
855
- return Le = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
856
- return typeof e;
857
- } : function(e) {
858
- return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
859
- }, Le(e);
860
- }
861
- function ze(e) {
862
- return Ke(e) || We(e) || rr(e) || Ve();
863
- }
864
- function Ve() {
865
- throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
866
- }
867
- function We(e) {
868
- if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
869
- }
870
- function Ke(e) {
871
- if (Array.isArray(e)) return tr(e);
872
- }
873
- function Ue() {
874
- return Ue = Object.assign ? Object.assign.bind() : function(e) {
875
- for (var r = 1; r < arguments.length; r++) {
876
- var t = arguments[r];
877
- for (var n in t) {
878
- ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
879
- }
880
- }
881
- return e;
882
- }, Ue.apply(null, arguments);
883
- }
884
- function Ge(e, r) {
885
- var t = Object.keys(e);
886
- if (Object.getOwnPropertySymbols) {
887
- var n = Object.getOwnPropertySymbols(e);
888
- r && (n = n.filter((function(r) {
889
- return Object.getOwnPropertyDescriptor(e, r).enumerable;
890
- }))), t.push.apply(t, n);
891
- }
892
- return t;
893
- }
894
- function Je(e) {
708
+ onClick: y,
709
+ ref: d === e ? r : null,
710
+ showSelected: d === e,
711
+ value: e
712
+ });
713
+ })));
714
+
715
+ return n().createElement(Pe, s, m.length > 0 && n().createElement(n().Fragment, null, n().createElement(_e, null, m), n().createElement(Ae, {
716
+ appearance: "weak"
717
+ })), h, n().createElement(Ae, {
718
+ appearance: "weak"
719
+ }), n().createElement(xe, null, n().createElement(Ce, {
720
+ allowTransparent: b,
721
+ disabled: a,
722
+ inputRef: v ? r : null,
723
+ onChange: y,
724
+ showPicker: true,
725
+ showSubmitButton: true,
726
+ value: d,
727
+ valueIsCustom: v
728
+ })));
729
+ }
730
+ /* harmony default export */ const Fe = He;
731
+ // CONCATENATED MODULE: ./src/Color/Color.tsx
732
+ function Me(e) {
733
+ "@babel/helpers - typeof";
734
+ return Me = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
735
+ return typeof e;
736
+ } : function(e) {
737
+ return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
738
+ }, Me(e);
739
+ }
740
+ function Le(e) {
741
+ return We(e) || Ve(e) || er(e) || ze();
742
+ }
743
+ function ze() {
744
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
745
+ }
746
+ function Ve(e) {
747
+ if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
748
+ }
749
+ function We(e) {
750
+ if (Array.isArray(e)) return rr(e);
751
+ }
752
+ function Ke() {
753
+ return Ke = Object.assign ? Object.assign.bind() : function(e) {
895
754
  for (var r = 1; r < arguments.length; r++) {
896
- var t = null != arguments[r] ? arguments[r] : {};
897
- r % 2 ? Ge(Object(t), !0).forEach((function(r) {
898
- Qe(e, r, t[r]);
899
- })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : Ge(Object(t)).forEach((function(r) {
900
- Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
901
- }));
755
+ var t = arguments[r];
756
+ for (var n in t) {
757
+ ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
758
+ }
902
759
  }
903
760
  return e;
761
+ }, Ke.apply(null, arguments);
762
+ }
763
+ function Ue(e, r) {
764
+ var t = Object.keys(e);
765
+ if (Object.getOwnPropertySymbols) {
766
+ var n = Object.getOwnPropertySymbols(e);
767
+ r && (n = n.filter((function(r) {
768
+ return Object.getOwnPropertyDescriptor(e, r).enumerable;
769
+ }))), t.push.apply(t, n);
904
770
  }
905
- function Qe(e, r, t) {
906
- return (r = Xe(r)) in e ? Object.defineProperty(e, r, {
907
- value: t,
908
- enumerable: !0,
909
- configurable: !0,
910
- writable: !0
911
- }) : e[r] = t, e;
912
- }
913
- function Xe(e) {
914
- var r = Ye(e, "string");
915
- return "symbol" == Le(r) ? r : r + "";
916
- }
917
- function Ye(e, r) {
918
- if ("object" != Le(e) || !e) return e;
919
- var t = e[Symbol.toPrimitive];
920
- if (void 0 !== t) {
921
- var n = t.call(e, r || "default");
922
- if ("object" != Le(n)) return n;
923
- throw new TypeError("@@toPrimitive must return a primitive value.");
924
- }
925
- return ("string" === r ? String : Number)(e);
771
+ return t;
772
+ }
773
+ function Ge(e) {
774
+ for (var r = 1; r < arguments.length; r++) {
775
+ var t = null != arguments[r] ? arguments[r] : {};
776
+ r % 2 ? Ue(Object(t), !0).forEach((function(r) {
777
+ Je(e, r, t[r]);
778
+ })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : Ue(Object(t)).forEach((function(r) {
779
+ Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
780
+ }));
926
781
  }
927
- function Ze(e, r) {
928
- return ar(e) || nr(e, r) || rr(e, r) || er();
782
+ return e;
783
+ }
784
+ function Je(e, r, t) {
785
+ return (r = Qe(r)) in e ? Object.defineProperty(e, r, {
786
+ value: t,
787
+ enumerable: !0,
788
+ configurable: !0,
789
+ writable: !0
790
+ }) : e[r] = t, e;
791
+ }
792
+ function Qe(e) {
793
+ var r = Xe(e, "string");
794
+ return "symbol" == Me(r) ? r : r + "";
795
+ }
796
+ function Xe(e, r) {
797
+ if ("object" != Me(e) || !e) return e;
798
+ var t = e[Symbol.toPrimitive];
799
+ if (void 0 !== t) {
800
+ var n = t.call(e, r || "default");
801
+ if ("object" != Me(n)) return n;
802
+ throw new TypeError("@@toPrimitive must return a primitive value.");
929
803
  }
930
- function er() {
931
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
804
+ return ("string" === r ? String : Number)(e);
805
+ }
806
+ function Ye(e, r) {
807
+ return nr(e) || tr(e, r) || er(e, r) || Ze();
808
+ }
809
+ function Ze() {
810
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
811
+ }
812
+ function er(e, r) {
813
+ if (e) {
814
+ if ("string" == typeof e) return rr(e, r);
815
+ var t = {}.toString.call(e).slice(8, -1);
816
+ 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) ? rr(e, r) : void 0;
932
817
  }
933
- function rr(e, r) {
934
- if (e) {
935
- if ("string" == typeof e) return tr(e, r);
936
- var t = {}.toString.call(e).slice(8, -1);
937
- 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) ? tr(e, r) : void 0;
938
- }
939
- }
940
- function tr(e, r) {
941
- (null == r || r > e.length) && (r = e.length);
942
- for (var t = 0, n = Array(r); t < r; t++) {
943
- n[t] = e[t];
944
- }
945
- return n;
818
+ }
819
+ function rr(e, r) {
820
+ (null == r || r > e.length) && (r = e.length);
821
+ for (var t = 0, n = Array(r); t < r; t++) {
822
+ n[t] = e[t];
946
823
  }
947
- function nr(e, r) {
948
- var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
949
- if (null != t) {
950
- var n, a, o, l, i = [], u = !0, s = !1;
824
+ return n;
825
+ }
826
+ function tr(e, r) {
827
+ var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
828
+ if (null != t) {
829
+ var n, a, o, l, i = [], u = !0, s = !1;
830
+ try {
831
+ if (o = (t = t.call(e)).next, 0 === r) {
832
+ if (Object(t) !== t) return;
833
+ u = !1;
834
+ } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
835
+ }
836
+ } catch (e) {
837
+ s = !0, a = e;
838
+ } finally {
951
839
  try {
952
- if (o = (t = t.call(e)).next, 0 === r) {
953
- if (Object(t) !== t) return;
954
- u = !1;
955
- } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
956
- }
957
- } catch (e) {
958
- s = !0, a = e;
840
+ if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
959
841
  } finally {
960
- try {
961
- if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
962
- } finally {
963
- if (s) throw a;
964
- }
842
+ if (s) throw a;
965
843
  }
966
- return i;
967
844
  }
845
+ return i;
968
846
  }
969
- function ar(e) {
970
- if (Array.isArray(e)) return e;
971
- }
972
- function or(e, r) {
973
- if (null == e) return {};
974
- var t, n, a = lr(e, r);
975
- if (Object.getOwnPropertySymbols) {
976
- var o = Object.getOwnPropertySymbols(e);
977
- for (n = 0; n < o.length; n++) {
978
- t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
979
- }
847
+ }
848
+ function nr(e) {
849
+ if (Array.isArray(e)) return e;
850
+ }
851
+ function ar(e, r) {
852
+ if (null == e) return {};
853
+ var t, n, a = or(e, r);
854
+ if (Object.getOwnPropertySymbols) {
855
+ var o = Object.getOwnPropertySymbols(e);
856
+ for (n = 0; n < o.length; n++) {
857
+ t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
980
858
  }
981
- return a;
982
859
  }
983
- function lr(e, r) {
984
- if (null == e) return {};
985
- var t = {};
986
- for (var n in e) {
987
- if ({}.hasOwnProperty.call(e, n)) {
988
- if (-1 !== r.indexOf(n)) continue;
989
- t[n] = e[n];
990
- }
860
+ return a;
861
+ }
862
+ function or(e, r) {
863
+ if (null == e) return {};
864
+ var t = {};
865
+ for (var n in e) {
866
+ if ({}.hasOwnProperty.call(e, n)) {
867
+ if (-1 !== r.indexOf(n)) continue;
868
+ t[n] = e[n];
991
869
  }
992
- return t;
993
870
  }
994
- /** @public */ var ir = {
995
- append: s().bool,
996
- defaultValue: s().string,
997
- describedBy: s().string,
998
- disabled: s().bool,
999
- elementRef: s().oneOfType([ s().func, s().object ]),
1000
- error: s().bool,
1001
- hideInput: s().bool,
1002
- labelledBy: s().string,
1003
- name: s().string,
1004
- onChange: s().func,
1005
- palette: s().array,
1006
- prepend: s().bool,
1007
- /** @private */
1008
- required: s().bool,
1009
- value: s().string
1010
- };
1011
- var ur = [ "clickAway", "escapeKey", "offScreen", "toggleClick" ];
1012
- /*
871
+ return t;
872
+ }
873
+ /** @public */ var lr = {
874
+ append: s().bool,
875
+ defaultValue: s().string,
876
+ describedBy: s().string,
877
+ disabled: s().bool,
878
+ elementRef: s().oneOfType([ s().func, s().object ]),
879
+ error: s().bool,
880
+ hideInput: s().bool,
881
+ labelledBy: s().string,
882
+ name: s().string,
883
+ onChange: s().func,
884
+ palette: s().array,
885
+ prepend: s().bool,
886
+ /** @private */
887
+ required: s().bool,
888
+ value: s().string
889
+ };
890
+ var ir = [ "clickAway", "escapeKey", "offScreen", "toggleClick" ];
891
+ /*
1013
892
  * When the dropdown opens:
1014
893
  * 1. If palette contains the color and the color is selected, the dropdown focus the color.
1015
894
  * 2. If palette doesn't contain the color, the custom color picker swatch is focused.
1016
- */ function sr(t) {
1017
- var n = t.append, a = t.defaultValue, l = t.disabled, u = t.describedBy, s = t.elementRef, c = t.error, f = t.hideInput, v = t.labelledBy, y = t.name, g = t.onChange, w = t.palette, S = w === void 0 ? $e : w, C = t.prepend, O = t.required, x = t.value, k = or(t, [ "append", "defaultValue", "disabled", "describedBy", "elementRef", "error", "hideInput", "labelledBy", "name", "onChange", "palette", "prepend", "required", "value" ]);
1018
- // @docs-props-type ColorPropsBase
1019
- var j = (0, e.useMemo)((function() {
1020
- return S.some((function(e) {
1021
- return e !== null && e.toLowerCase() === Y;
1022
- }));
1023
- }), [ S ]);
1024
- var E = p()({
1025
- componentName: "Color",
1026
- /* eslint-disable-next-line prefer-rest-params */
1027
- componentProps: arguments[0]
1028
- });
1029
- var I = (0, e.useState)(a), P = Ze(I, 2), _ = P[0], q = P[1];
1030
- var B = (0, e.useState)(false), R = Ze(B, 2), A = R[0], T = R[1];
1031
- var $ = b()(A);
1032
- var D = (0, e.useState)((function() {
1033
- return (0, h.createDOMID)("swatch-reader-content");
1034
- })), N = Ze(D, 1), H = N[0];
1035
- var F = (0, e.useRef)(null);
1036
- var M = (0, e.useRef)(null);
1037
- (0, e.useEffect)((function() {
1038
- if (A) {
1039
- var e, r;
1040
- (e = M.current) === null || e === void 0 ? void 0 : (r = e.focus) === null || r === void 0 ? void 0 : r.call(e);
1041
- } else if ($) {
1042
- var t;
1043
- F === null || F === void 0 ? void 0 : (t = F.current) === null || t === void 0 ? void 0 : t.focus();
1044
- }
1045
- }), [ A, $ ]);
1046
- var L = (0, e.useMemo)((function() {
1047
- return E ? x : _;
1048
- }), [ E, x, _ ]);
1049
- (0, e.useEffect)((function() {
1050
- if (false) {
1051
- var e;
1052
- }
1053
- }), [ a ]);
1054
- var z = (0, e.useCallback)((function(e) {
1055
- var r = e !== L;
1056
- if (!E) {
1057
- q(e);
1058
- }
1059
- if (r) {
1060
- g === null || g === void 0 ? void 0 : g({
1061
- value: e,
1062
- name: y
1063
- });
1064
- }
1065
- }), [ E, y, g, L ]);
1066
- var V = (0, e.useCallback)((function() {
1067
- T(false);
1068
- }), []);
1069
- var W = (0, e.useCallback)((function() {
1070
- T(true);
1071
- }), []);
1072
- var K = (0, e.useCallback)((function(e, r) {
1073
- var t = r.value;
1074
- e.preventDefault();
1075
- T(false);
1076
- z(t);
1077
- }), [ z ]);
1078
- var U = (0, e.useCallback)((function(e, r) {
1079
- var t = r.value;
1080
- T(false);
1081
- z(t);
1082
- }), [ z ]);
1083
- var G = function e() {
1084
-
1085
- return r().createElement(Fe, {
1086
- activeInputRef: M,
1087
- "aria-label": (0, m._)("Choose color"),
1088
- disabled: l,
1089
- onChange: K,
1090
- palette: S,
1091
- role: "dialog",
1092
- value: L
1093
- });
1094
- };
1095
- var J = (0, e.useMemo)((function() {
1096
- return Je(Je({}, i()(k, (function(e, r) {
1097
- return r.indexOf("aria-") === 0;
1098
- }))), {}, {
1099
- "aria-describedby": u,
1100
- "aria-labelledby": v ? "".concat(v, " ").concat(H) : H,
1101
- "aria-invalid": c || undefined
895
+ */ function ur(e) {
896
+ var r = e.append, a = e.defaultValue, l = e.disabled, u = e.describedBy, s = e.elementRef, c = e.error, f = e.hideInput, v = e.labelledBy, y = e.name, h = e.onChange, S = e.palette, C = S === void 0 ? Re : S, O = e.prepend, x = e.required, k = e.value, E = ar(e, [ "append", "defaultValue", "disabled", "describedBy", "elementRef", "error", "hideInput", "labelledBy", "name", "onChange", "palette", "prepend", "required", "value" ]);
897
+ // @docs-props-type ColorPropsBase
898
+ var j = (0, t.useMemo)((function() {
899
+ return C.some((function(e) {
900
+ return e !== null && e.toLowerCase() === Y;
901
+ }));
902
+ }), [ C ]);
903
+ var I = b()({
904
+ componentName: "Color",
905
+ /* eslint-disable-next-line prefer-rest-params */
906
+ componentProps: arguments[0]
907
+ });
908
+ var P = (0, t.useState)(a), _ = Ye(P, 2), q = _[0], B = _[1];
909
+ var A = (0, t.useState)(false), $ = Ye(A, 2), T = $[0], R = $[1];
910
+ var D = m()(T);
911
+ var N = (0, t.useState)((function() {
912
+ return (0, w.createDOMID)("swatch-reader-content");
913
+ })), H = Ye(N, 1), F = H[0];
914
+ var M = (0, t.useRef)(null);
915
+ var L = (0, t.useRef)(null);
916
+ (0, t.useEffect)((function() {
917
+ if (T) {
918
+ var e, r;
919
+ (e = L.current) === null || e === void 0 ? void 0 : (r = e.focus) === null || r === void 0 ? void 0 : r.call(e);
920
+ } else if (D) {
921
+ var t;
922
+ M === null || M === void 0 ? void 0 : (t = M.current) === null || t === void 0 ? void 0 : t.focus();
923
+ }
924
+ }), [ T, D ]);
925
+ var z = (0, t.useMemo)((function() {
926
+ return I ? k : q;
927
+ }), [ I, k, q ]);
928
+ (0, t.useEffect)((function() {
929
+ if (false) {
930
+ var e;
931
+ }
932
+ }), [ a ]);
933
+ var V = (0, t.useCallback)((function(e) {
934
+ var r = e !== z;
935
+ if (!I) {
936
+ B(e);
937
+ }
938
+ if (r) {
939
+ h === null || h === void 0 ? void 0 : h({
940
+ value: e,
941
+ name: y
1102
942
  });
1103
- }), [ u, c, v, k, H ]);
1104
- var Q = function e() {
1105
-
1106
- return r().createElement(ue, Ue({
1107
- append: !f ? true : n,
1108
- "data-test": "toggle-swatch",
1109
- "data-test-value": L
1110
- }, J, {
1111
- disabled: l,
1112
- error: c,
1113
- name: y,
1114
- prepend: C,
1115
- ref: F,
1116
- value: L
1117
- }));
1118
- };
943
+ }
944
+ }), [ I, y, h, z ]);
945
+ var W = (0, t.useCallback)((function() {
946
+ R(false);
947
+ }), []);
948
+ var K = (0, t.useCallback)((function() {
949
+ R(true);
950
+ }), []);
951
+ var U = (0, t.useCallback)((function(e, r) {
952
+ var t = r.value;
953
+ e.preventDefault();
954
+ R(false);
955
+ V(t);
956
+ }), [ V ]);
957
+ var G = (0, t.useCallback)((function(e, r) {
958
+ var t = r.value;
959
+ R(false);
960
+ V(t);
961
+ }), [ V ]);
962
+ var J = function e() {
1119
963
 
1120
- return r().createElement(Oe, Ue({
1121
- "data-test": "color",
1122
- ref: s
1123
- }, o()(k, ze(Object.keys(J)))), r().createElement(Me["default"], {
1124
- id: H
1125
- }, (0, m._)("Color picker")), r().createElement(d(), {
1126
- closeReasons: ur,
1127
- onRequestClose: V,
1128
- onRequestOpen: W,
1129
- open: A,
1130
- retainFocus: true,
1131
- takeFocus: false,
1132
- toggle: Q()
1133
- }, G()), !f && r().createElement(ke, {
1134
- allowTransparent: j,
1135
- append: n,
964
+ return n().createElement(Fe, {
965
+ activeInputRef: L,
966
+ "aria-label": (0, g._)("Choose color"),
1136
967
  disabled: l,
1137
- labelledBy: v,
1138
968
  onChange: U,
1139
- prepend: true,
1140
- required: O,
1141
- value: L
969
+ palette: C,
970
+ role: "dialog",
971
+ value: z
972
+ });
973
+ };
974
+ var Q = (0, t.useMemo)((function() {
975
+ return Ge(Ge({}, i()(E, (function(e, r) {
976
+ return r.indexOf("aria-") === 0;
977
+ }))), {}, {
978
+ "aria-describedby": u,
979
+ "aria-labelledby": v ? "".concat(v, " ").concat(F) : F,
980
+ "aria-invalid": c || undefined
981
+ });
982
+ }), [ u, c, v, E, F ]);
983
+ var X = function e() {
984
+
985
+ return n().createElement(ue, Ke({
986
+ append: !f ? true : r,
987
+ "data-test": "toggle-swatch",
988
+ "data-test-value": z
989
+ }, Q, {
990
+ disabled: l,
991
+ error: c,
992
+ name: y,
993
+ prepend: O,
994
+ ref: M,
995
+ value: z
1142
996
  }));
1143
- }
1144
- sr.propTypes = ir;
1145
- sr.componentType = "Color";
1146
- /* harmony default export */ const cr = sr;
1147
- }) // CONCATENATED MODULE: ./src/Color/index.ts
1148
- ();
1149
- module.exports = n;
997
+ };
998
+
999
+ return n().createElement(Oe, Ke({
1000
+ "data-test": "color",
1001
+ ref: s
1002
+ }, o()(E, Le(Object.keys(Q)))), n().createElement(p(), {
1003
+ id: F
1004
+ }, (0, g._)("Color picker")), n().createElement(d(), {
1005
+ closeReasons: ir,
1006
+ onRequestClose: W,
1007
+ onRequestOpen: K,
1008
+ open: T,
1009
+ retainFocus: true,
1010
+ takeFocus: false,
1011
+ toggle: X()
1012
+ }, J()), !f && n().createElement(ke, {
1013
+ allowTransparent: j,
1014
+ append: r,
1015
+ disabled: l,
1016
+ labelledBy: v,
1017
+ onChange: G,
1018
+ prepend: true,
1019
+ required: x,
1020
+ value: z
1021
+ }));
1022
+ }
1023
+ ur.propTypes = lr;
1024
+ ur.componentType = "Color";
1025
+ /* harmony default export */ const sr = ur;
1026
+ // CONCATENATED MODULE: ./src/Color/index.ts
1027
+ module.exports = r;
1150
1028
  /******/})();