@splunk/react-ui 4.20.0 → 4.21.1

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 (101) hide show
  1. package/Accordion.js +425 -441
  2. package/Anchor.js +147 -193
  3. package/Animation.js +142 -166
  4. package/AnimationToggle.js +197 -253
  5. package/Box.js +145 -194
  6. package/Breadcrumbs.js +288 -298
  7. package/Button.js +488 -613
  8. package/ButtonGroup.js +160 -212
  9. package/ButtonSimple.js +543 -562
  10. package/CHANGELOG.md +26 -0
  11. package/Calendar.js +1107 -1195
  12. package/Card.js +771 -746
  13. package/CardLayout.js +205 -223
  14. package/Chip.js +509 -612
  15. package/Clickable.js +416 -472
  16. package/CloseButton.js +165 -250
  17. package/Code.js +1808 -2172
  18. package/Code.js.LICENSE.txt +8 -0
  19. package/CollapsiblePanel.js +586 -675
  20. package/Color.js +1066 -1297
  21. package/ColumnLayout.js +402 -465
  22. package/ComboBox.js +892 -969
  23. package/Concertina.js +998 -963
  24. package/ControlGroup.js +687 -718
  25. package/Date.js +567 -697
  26. package/DefinitionList.js +308 -310
  27. package/Divider.js +149 -194
  28. package/Dropdown.js +459 -558
  29. package/DualListbox.js +1480 -1735
  30. package/EventListener.js +94 -165
  31. package/File.js +1051 -1173
  32. package/FormRows.js +885 -880
  33. package/Heading.js +216 -263
  34. package/Image.js +446 -558
  35. package/JSONTree.js +690 -699
  36. package/Layer.js +442 -582
  37. package/Link.js +336 -361
  38. package/List.js +213 -237
  39. package/Markdown.js +510 -612
  40. package/Menu.js +1109 -1331
  41. package/Message.js +474 -629
  42. package/MessageBar.js +387 -561
  43. package/Modal.js +810 -798
  44. package/ModalLayer.js +326 -343
  45. package/Monogram.js +308 -368
  46. package/Multiselect.js +3558 -3998
  47. package/Number.js +729 -843
  48. package/Paginator.js +510 -615
  49. package/Paragraph.js +145 -188
  50. package/Popover.js +1470 -1693
  51. package/Progress.js +301 -362
  52. package/RadioBar.js +610 -651
  53. package/RadioList.js +483 -544
  54. package/Resize.js +530 -623
  55. package/ResultsMenu.js +494 -597
  56. package/ScreenReaderContent.js +142 -187
  57. package/Scroll.js +595 -598
  58. package/ScrollContainerContext.js +197 -278
  59. package/Search.js +745 -817
  60. package/Select.js +2441 -2746
  61. package/SidePanel.js +390 -392
  62. package/Slider.js +668 -825
  63. package/SlidingPanels.js +639 -645
  64. package/SplitButton.js +464 -499
  65. package/StaticContent.js +161 -217
  66. package/StepBar.js +386 -466
  67. package/Switch.js +710 -764
  68. package/TabBar.js +724 -815
  69. package/TabLayout.js +406 -438
  70. package/Table.js +4842 -5121
  71. package/Text.js +1169 -1351
  72. package/TextArea.js +1097 -1307
  73. package/Tooltip.js +624 -721
  74. package/TransitionOpen.js +489 -546
  75. package/Typography.js +176 -229
  76. package/WaitSpinner.js +230 -298
  77. package/package.json +14 -15
  78. package/stubs-splunkui.d.ts +4 -1
  79. package/types/src/ComboBox/Option.d.ts +1 -1
  80. package/types/src/Concertina/Concertina.d.ts +4 -0
  81. package/types/src/JSONTree/JSONTreeContext.d.ts +7 -0
  82. package/types/src/JSONTree/TreeNode.d.ts +5 -0
  83. package/types/src/Link/Link.d.ts +7 -3
  84. package/types/src/Link/docs/examples/NewWindow.d.ts +2 -0
  85. package/types/src/Markdown/Markdown.d.ts +1 -1
  86. package/types/src/Markdown/renderers/MarkdownHeading.d.ts +1 -1
  87. package/types/src/Menu/Item.d.ts +1 -1
  88. package/types/src/Menu/Menu.d.ts +1 -0
  89. package/types/src/MessageBar/docs/examples/WithActions.d.ts +2 -0
  90. package/types/src/Multiselect/Option.d.ts +1 -1
  91. package/types/src/Search/Option.d.ts +1 -1
  92. package/types/src/Select/Option.d.ts +1 -1
  93. package/types/src/Select/OptionBase.d.ts +1 -1
  94. package/types/src/fixtures/FetchOptions.d.ts +2 -8
  95. package/useForceUpdate.js +112 -146
  96. package/useKeyPress.js +74 -128
  97. package/usePrevious.js +65 -129
  98. package/useRovingFocus.js +122 -218
  99. package/types/src/Link/docs/examples/NewTab.d.ts +0 -2
  100. /package/types/src/Table/docs/examples/{DockedHeader.d.ts → DockedHeaderScrollbar.d.ts} +0 -0
  101. /package/types/src/Table/docs/examples/prisma/{DockedHeader.d.ts → DockedHeaderScrollbar.d.ts} +0 -0
package/StepBar.js CHANGED
@@ -1,468 +1,388 @@
1
- module.exports =
2
- /******/ (function(modules) { // webpackBootstrap
3
- /******/ // The module cache
4
- /******/ var installedModules = {};
5
- /******/
6
- /******/ // The require function
7
- /******/ function __webpack_require__(moduleId) {
8
- /******/
9
- /******/ // Check if module is in cache
10
- /******/ if(installedModules[moduleId]) {
11
- /******/ return installedModules[moduleId].exports;
12
- /******/ }
13
- /******/ // Create a new module (and put it into the cache)
14
- /******/ var module = installedModules[moduleId] = {
15
- /******/ i: moduleId,
16
- /******/ l: false,
17
- /******/ exports: {}
18
- /******/ };
19
- /******/
20
- /******/ // Execute the module function
21
- /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
22
- /******/
23
- /******/ // Flag the module as loaded
24
- /******/ module.l = true;
25
- /******/
26
- /******/ // Return the exports of the module
27
- /******/ return module.exports;
28
- /******/ }
29
- /******/
30
- /******/
31
- /******/ // expose the modules object (__webpack_modules__)
32
- /******/ __webpack_require__.m = modules;
33
- /******/
34
- /******/ // expose the module cache
35
- /******/ __webpack_require__.c = installedModules;
36
- /******/
37
- /******/ // define getter function for harmony exports
38
- /******/ __webpack_require__.d = function(exports, name, getter) {
39
- /******/ if(!__webpack_require__.o(exports, name)) {
40
- /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
41
- /******/ }
42
- /******/ };
43
- /******/
44
- /******/ // define __esModule on exports
45
- /******/ __webpack_require__.r = function(exports) {
46
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
47
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
48
- /******/ }
49
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
50
- /******/ };
51
- /******/
52
- /******/ // create a fake namespace object
53
- /******/ // mode & 1: value is a module id, require it
54
- /******/ // mode & 2: merge all properties of value into the ns
55
- /******/ // mode & 4: return value when already ns object
56
- /******/ // mode & 8|1: behave like require
57
- /******/ __webpack_require__.t = function(value, mode) {
58
- /******/ if(mode & 1) value = __webpack_require__(value);
59
- /******/ if(mode & 8) return value;
60
- /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
61
- /******/ var ns = Object.create(null);
62
- /******/ __webpack_require__.r(ns);
63
- /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
64
- /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
65
- /******/ return ns;
66
- /******/ };
67
- /******/
68
- /******/ // getDefaultExport function for compatibility with non-harmony modules
69
- /******/ __webpack_require__.n = function(module) {
70
- /******/ var getter = module && module.__esModule ?
71
- /******/ function getDefault() { return module['default']; } :
72
- /******/ function getModuleExports() { return module; };
73
- /******/ __webpack_require__.d(getter, 'a', getter);
74
- /******/ return getter;
75
- /******/ };
76
- /******/
77
- /******/ // Object.prototype.hasOwnProperty.call
78
- /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
79
- /******/
80
- /******/ // __webpack_public_path__
81
- /******/ __webpack_require__.p = "";
82
- /******/
83
- /******/
84
- /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 190);
86
- /******/ })
87
- /************************************************************************/
88
- /******/ ({
89
-
90
- /***/ 0:
91
- /***/ (function(module, exports) {
92
-
93
- module.exports = require("@splunk/themes");
94
-
95
- /***/ }),
96
-
97
- /***/ 1:
98
- /***/ (function(module, exports) {
99
-
100
- module.exports = require("prop-types");
101
-
102
- /***/ }),
103
-
104
- /***/ 190:
105
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
106
-
107
- "use strict";
108
- // ESM COMPAT FLAG
109
- __webpack_require__.r(__webpack_exports__);
110
-
111
- // EXPORTS
112
- __webpack_require__.d(__webpack_exports__, "default", function() { return /* reexport */ StepBar_StepBar; });
113
- __webpack_require__.d(__webpack_exports__, "Step", function() { return /* reexport */ StepBar_Step; });
114
-
115
- // EXTERNAL MODULE: external "react"
116
- var external_react_ = __webpack_require__(2);
117
- var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
118
-
119
- // EXTERNAL MODULE: external "prop-types"
120
- var external_prop_types_ = __webpack_require__(1);
121
- var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
122
-
123
- // EXTERNAL MODULE: external "@splunk/ui-utils/id"
124
- var id_ = __webpack_require__(8);
125
-
126
- // EXTERNAL MODULE: external "@splunk/themes/useSplunkTheme"
127
- var useSplunkTheme_ = __webpack_require__(70);
128
- var useSplunkTheme_default = /*#__PURE__*/__webpack_require__.n(useSplunkTheme_);
129
-
130
- // EXTERNAL MODULE: external "styled-components"
131
- var external_styled_components_ = __webpack_require__(3);
132
- var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
133
-
134
- // EXTERNAL MODULE: external "@splunk/react-icons/CheckCircle"
135
- var CheckCircle_ = __webpack_require__(72);
136
- var CheckCircle_default = /*#__PURE__*/__webpack_require__.n(CheckCircle_);
137
-
138
- // EXTERNAL MODULE: external "@splunk/react-icons/ExclamationCircle"
139
- var ExclamationCircle_ = __webpack_require__(73);
140
- var ExclamationCircle_default = /*#__PURE__*/__webpack_require__.n(ExclamationCircle_);
141
-
142
- // EXTERNAL MODULE: external "@splunk/themes"
143
- var themes_ = __webpack_require__(0);
144
-
145
- // CONCATENATED MODULE: ./src/StepBar/StepStyles.ts
146
-
147
-
148
-
149
-
150
- var primaryBackgroundColor = '#1A8929'; // SUI-2439 to meet WCAG AA compliance
151
-
152
- var Styled = external_styled_components_default.a.li.withConfig({
153
- displayName: "StepStyles__Styled",
154
- componentId: "sc-756fxp-0"
155
- })(["", " ", ";text-align:center;padding:", ";", ";", ""], themes_["mixins"].reset('block'), Object(themes_["pick"])({
156
- enterprise: Object(external_styled_components_["css"])(["position:relative;flex:1 1 0;"]),
157
- prisma: Object(external_styled_components_["css"])(["display:flex;align-items:center;flex:0 1 auto;margin:0 12px 0 12px;"])
158
- }), Object(themes_["pick"])({
159
- enterprise: Object(external_styled_components_["css"])(["25px 15px 0"]),
160
- prisma: {
161
- comfortable: '8px 8px 8px 0',
162
- compact: '4px 8px 4px 0'
163
- }
164
- }), Object(themes_["pick"])({
165
- prisma: Object(external_styled_components_["css"])(["&::before{align-items:center;box-sizing:border-box;border-radius:50%;counter-increment:", ";content:counter(", ");display:inline-flex;flex-shrink:0;font-size:12px;height:20px;width:20px;justify-content:center;line-height:20px;margin:2px 16px 2px 18px;}"], function (_ref) {
166
- var $idCounter = _ref.$idCounter;
167
- return $idCounter;
168
- }, function (_ref2) {
169
- var $idCounter = _ref2.$idCounter;
170
- return $idCounter;
171
- })
172
- }), Object(themes_["pickVariant"])('$status', {
173
- error: {
174
- prisma: Object(external_styled_components_["css"])(["color:", ";&::before{visibility:hidden;position:absolute;}"], themes_["variables"].contentColorActive)
175
- },
176
- active: {
177
- prisma: Object(external_styled_components_["css"])(["color:", ";&::before{color:", ";background:", ";border:1px solid ", ";}"], themes_["variables"].contentColorActive, themes_["variables"].contentColorInverted, themes_["variables"].contentColorActive, themes_["variables"].contentColorActive)
178
- },
179
- next: {
180
- enterprise: Object(external_styled_components_["css"])(["color:", ";"], themes_["variables"].textDisabledColor),
181
- prisma: Object(external_styled_components_["css"])(["color:", ";&::before{color:", ";border:1px solid ", ";}"], themes_["variables"].contentColorMuted, themes_["variables"].contentColorMuted, themes_["variables"].contentColorMuted)
182
- },
183
- prev: {
184
- prisma: Object(external_styled_components_["css"])(["color:", ";&::before{visibility:hidden;position:absolute;}"], themes_["variables"].contentColorDefault)
185
- }
186
- }));
187
- var iconStyles = Object(external_styled_components_["css"])(["height:24px;width:24px;margin:0 14px 0 16px;"]);
188
- var StyledCheckCircleIcon = external_styled_components_default()(CheckCircle_default.a).withConfig({
189
- displayName: "StepStyles__StyledCheckCircleIcon",
190
- componentId: "sc-756fxp-1"
191
- })(["", ";color:", ";"], iconStyles, themes_["variables"].accentColorPositive);
192
- var StyledExclamationCircleIcon = external_styled_components_default()(ExclamationCircle_default.a).withConfig({
193
- displayName: "StepStyles__StyledExclamationCircleIcon",
194
- componentId: "sc-756fxp-2"
195
- })(["", ";color:", ";"], iconStyles, themes_["variables"].accentColorNegative);
196
- var StyledSvg = external_styled_components_default.a.svg.withConfig({
197
- displayName: "StepStyles__StyledSvg",
198
- componentId: "sc-756fxp-3"
199
- })(["position:absolute;left:0;right:0;top:0;"]);
200
- var StyledPrevOrActiveRect = external_styled_components_default.a.rect.withConfig({
201
- displayName: "StepStyles__StyledPrevOrActiveRect",
202
- componentId: "sc-756fxp-4"
203
- })(["fill:", ";"], primaryBackgroundColor);
204
- var StyledPrevOrActiveCircle = StyledPrevOrActiveRect.withComponent('circle');
205
- var StyledGray = external_styled_components_default.a.rect.withConfig({
206
- displayName: "StepStyles__StyledGray",
207
- componentId: "sc-756fxp-5"
208
- })(["fill:", ";"], themes_["variables"].gray60);
209
- var StyledNext = external_styled_components_default.a.circle.withConfig({
210
- displayName: "StepStyles__StyledNext",
211
- componentId: "sc-756fxp-6"
212
- })(["stroke:", ";stroke-width:3px;fill:", ";"], themes_["variables"].gray60, themes_["variables"].backgroundColor);
213
-
214
- // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
215
-
216
- var StepBarContext = /*#__PURE__*/Object(external_react_["createContext"])({
217
- activeStepId: 0
218
- });
219
- StepBarContext.displayName = 'StepBar';
220
- /* harmony default export */ var StepBar_StepBarContext = (StepBarContext);
221
- // CONCATENATED MODULE: ./src/StepBar/Step.tsx
222
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
223
-
224
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
225
-
226
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
227
-
228
-
229
-
230
-
231
-
232
-
233
- var propTypes = {
234
- children: external_prop_types_default.a.node,
235
- elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
236
- error: external_prop_types_default.a.bool,
237
- stepId: external_prop_types_default.a.any
238
- };
239
-
240
- function Step(_ref) {
241
- var children = _ref.children,
242
- elementRef = _ref.elementRef,
243
- _ref$error = _ref.error,
244
- error = _ref$error === void 0 ? false : _ref$error,
245
- stepId = _ref.stepId,
246
- otherProps = _objectWithoutProperties(_ref, ["children", "elementRef", "error", "stepId"]);
247
-
248
- // @docs-props-type StepPropsBase
249
- var _useContext = Object(external_react_["useContext"])(StepBarContext),
250
- activeStepIdContext = _useContext.activeStepId,
251
- idCounterContext = _useContext.idCounter,
252
- lastChildIndexContext = _useContext.lastChildIndex;
253
-
254
- var _useSplunkTheme = useSplunkTheme_default()(),
255
- isEnterprise = _useSplunkTheme.isEnterprise;
256
-
257
- var status = 'next';
258
- var active = activeStepIdContext === stepId;
259
- var isFirst = stepId === 0;
260
- var isLast = stepId === lastChildIndexContext;
261
-
262
- if (stepId < activeStepIdContext) {
263
- status = 'prev';
264
- }
265
-
266
- if (active && !error) {
267
- status = 'active';
268
- }
269
-
270
- if (active && error) {
271
- status = 'error';
272
- }
273
-
274
- if (isEnterprise) {
275
- return /*#__PURE__*/external_react_default.a.createElement(Styled, _extends({
276
- $status: status,
277
- "data-test-status": status,
278
- "data-test": "step",
279
- "data-test-step-id": stepId,
280
- ref: elementRef
281
- }, otherProps), /*#__PURE__*/external_react_default.a.createElement(StyledSvg, {
282
- focusable: "false",
283
- width: "100%",
284
- height: "15px",
285
- viewBox: "0 0 100 15",
286
- preserveAspectRatio: "none",
287
- xmlns: "http://www.w3.org/2000/svg"
288
- }, /*#__PURE__*/external_react_default.a.createElement(StyledGray, {
289
- x: isFirst ? '50' : '0',
290
- y: "6",
291
- width: isLast || isFirst ? '50%' : '100%',
292
- height: "3"
293
- }), (status === 'active' || status === 'error') && !isFirst && /*#__PURE__*/external_react_default.a.createElement(StyledPrevOrActiveRect, {
294
- x: "0",
295
- y: "6",
296
- width: "50%",
297
- height: "3"
298
- }), status === 'prev' && /*#__PURE__*/external_react_default.a.createElement(StyledPrevOrActiveRect, {
299
- x: isFirst ? '50%' : '0',
300
- y: "6",
301
- width: "100%",
302
- height: "3"
303
- })), /*#__PURE__*/external_react_default.a.createElement(StyledSvg, {
304
- focusable: "false",
305
- width: "100%",
306
- height: "15px",
307
- viewBox: "0 0 15 15",
308
- xmlns: "http://www.w3.org/2000/svg"
309
- }, status !== 'next' && /*#__PURE__*/external_react_default.a.createElement(StyledPrevOrActiveCircle, {
310
- cx: "50%",
311
- cy: "50%",
312
- r: "7.5"
313
- }), status === 'next' && /*#__PURE__*/external_react_default.a.createElement(StyledNext, {
314
- cx: "50%",
315
- cy: "50%",
316
- r: "6"
317
- })), children);
318
- }
319
-
320
- return /*#__PURE__*/external_react_default.a.createElement(Styled, _extends({
321
- $status: status,
322
- "data-test-status": status,
323
- "data-test": "step",
324
- "data-test-step-id": stepId,
325
- $idCounter: idCounterContext,
326
- ref: elementRef
327
- }, otherProps), status === 'prev' && /*#__PURE__*/external_react_default.a.createElement(StyledCheckCircleIcon, null), status === 'error' && /*#__PURE__*/external_react_default.a.createElement(StyledExclamationCircleIcon, null), children);
328
- }
329
-
330
- Step.propTypes = propTypes;
331
- /* harmony default export */ var StepBar_Step = (Step);
332
- // CONCATENATED MODULE: ./src/StepBar/StepBarStyles.ts
333
-
334
-
335
- var StepBarStyles_Styled = external_styled_components_default.a.ul.withConfig({
336
- displayName: "StepBarStyles__Styled",
337
- componentId: "sc-13bf2x4-0"
338
- })(["", ";", ";", ";"], themes_["mixins"].reset('flex'), Object(themes_["pick"])({
339
- prisma: Object(external_styled_components_["css"])(["position:relative;display:flex;counter-reset:", ";"], function (_ref) {
340
- var $idCounter = _ref.$idCounter;
341
- return $idCounter;
342
- })
343
- }), function (_ref2) {
344
- var $inline = _ref2.$inline;
345
- return $inline && Object(external_styled_components_["css"])(["display:inline-flex;"]);
346
- });
347
-
348
- // CONCATENATED MODULE: ./src/StepBar/StepBar.tsx
349
- function StepBar_extends() { StepBar_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return StepBar_extends.apply(this, arguments); }
350
-
351
- function StepBar_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = StepBar_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
352
-
353
- function StepBar_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
354
-
355
-
356
-
357
-
358
-
359
-
360
-
361
- var StepBar_propTypes = {
362
- activeStepId: external_prop_types_default.a.any.isRequired,
363
- children: external_prop_types_default.a.node,
364
- elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
365
- inline: external_prop_types_default.a.bool
366
- };
367
-
368
- function StepBar(_ref) {
369
- var activeStepId = _ref.activeStepId,
370
- children = _ref.children,
371
- elementRef = _ref.elementRef,
372
- _ref$inline = _ref.inline,
373
- inline = _ref$inline === void 0 ? false : _ref$inline,
374
- otherProps = StepBar_objectWithoutProperties(_ref, ["activeStepId", "children", "elementRef", "inline"]);
375
-
376
- // @docs-props-type StepBarPropsBase
377
- var _useRef = Object(external_react_["useRef"])(Object(id_["createDOMID"])('stepbar')),
378
- idCounter = _useRef.current;
379
-
380
- var activeIndex = 0;
381
- var validChildren = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]);
382
- var lastChildIndex = validChildren.length - 1;
383
- var clonedChildren = validChildren.map(function (child, idx) {
384
- var stepId = child.props.stepId || idx;
385
- var error = child.props.error;
386
-
387
- if (stepId === activeStepId) {
388
- activeIndex = idx;
389
- }
390
-
391
- return /*#__PURE__*/Object(external_react_["cloneElement"])(child, {
392
- stepId: stepId,
393
- error: error
1
+ /******/ (() => {
2
+ // webpackBootstrap
3
+ /******/ "use strict";
4
+ /******/ // The require scope
5
+ /******/ var e = {};
6
+ /******/
7
+ /************************************************************************/
8
+ /******/ /* webpack/runtime/compat get default export */
9
+ /******/ (() => {
10
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
11
+ /******/ e.n = t => {
12
+ /******/ var r = t && t.__esModule ?
13
+ /******/ () => t["default"]
14
+ /******/ : () => t
15
+ /******/;
16
+ e.d(r, {
17
+ a: r
18
+ });
19
+ /******/ return r;
20
+ /******/ };
21
+ /******/ })();
22
+ /******/
23
+ /******/ /* webpack/runtime/define property getters */
24
+ /******/ (() => {
25
+ /******/ // define getter functions for harmony exports
26
+ /******/ e.d = (t, r) => {
27
+ /******/ for (var n in r) {
28
+ /******/ if (e.o(r, n) && !e.o(t, n)) {
29
+ /******/ Object.defineProperty(t, n, {
30
+ enumerable: true,
31
+ get: r[n]
32
+ });
33
+ /******/ }
34
+ /******/ }
35
+ /******/ };
36
+ /******/ })();
37
+ /******/
38
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
39
+ /******/ (() => {
40
+ /******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
41
+ /******/;
42
+ })();
43
+ /******/
44
+ /******/ /* webpack/runtime/make namespace object */
45
+ /******/ (() => {
46
+ /******/ // define __esModule on exports
47
+ /******/ e.r = e => {
48
+ /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
49
+ /******/ Object.defineProperty(e, Symbol.toStringTag, {
50
+ value: "Module"
51
+ });
52
+ /******/ }
53
+ /******/ Object.defineProperty(e, "__esModule", {
54
+ value: true
55
+ });
56
+ /******/ };
57
+ /******/ })();
58
+ /******/
59
+ /************************************************************************/ var t = {};
60
+ // ESM COMPAT FLAG
61
+ e.r(t);
62
+ // EXPORTS
63
+ e.d(t, {
64
+ Step: () => /* reexport */ $,
65
+ default: () => /* reexport */ z
66
+ });
67
+ // CONCATENATED MODULE: external "react"
68
+ const r = require("react");
69
+ var n = e.n(r);
70
+ // CONCATENATED MODULE: external "prop-types"
71
+ const i = require("prop-types");
72
+ var o = e.n(i);
73
+ // CONCATENATED MODULE: external "@splunk/ui-utils/id"
74
+ const a = require("@splunk/ui-utils/id");
75
+ // CONCATENATED MODULE: external "@splunk/themes/useSplunkTheme"
76
+ const l = require("@splunk/themes/useSplunkTheme");
77
+ var s = e.n(l);
78
+ // CONCATENATED MODULE: external "styled-components"
79
+ const c = require("styled-components");
80
+ var p = e.n(c);
81
+ // CONCATENATED MODULE: external "@splunk/react-icons/CheckCircle"
82
+ const d = require("@splunk/react-icons/CheckCircle");
83
+ var u = e.n(d);
84
+ // CONCATENATED MODULE: external "@splunk/react-icons/ExclamationCircle"
85
+ const v = require("@splunk/react-icons/ExclamationCircle");
86
+ var f = e.n(v);
87
+ // CONCATENATED MODULE: external "@splunk/themes"
88
+ const m = require("@splunk/themes");
89
+ // CONCATENATED MODULE: ./src/StepBar/StepStyles.ts
90
+ var y = "#1A8929";
91
+ // SUI-2439 to meet WCAG AA compliance
92
+ var x = p().li.withConfig({
93
+ displayName: "StepStyles__Styled",
94
+ componentId: "sc-756fxp-0"
95
+ })([ "", " ", ";text-align:center;padding:", ";", ";", "" ], m.mixins.reset("block"), (0,
96
+ m.pick)({
97
+ enterprise: (0, c.css)([ "position:relative;flex:1 1 0;" ]),
98
+ prisma: (0, c.css)([ "display:flex;align-items:center;flex:0 1 auto;margin:0 12px 0 12px;" ])
99
+ }), (0, m.pick)({
100
+ enterprise: (0, c.css)([ "25px 15px 0" ]),
101
+ prisma: {
102
+ comfortable: "8px 8px 8px 0",
103
+ compact: "4px 8px 4px 0"
104
+ }
105
+ }), (0, m.pick)({
106
+ prisma: (0, c.css)([ "&::before{align-items:center;box-sizing:border-box;border-radius:50%;counter-increment:", ";content:counter(", ");display:inline-flex;flex-shrink:0;font-size:12px;height:20px;width:20px;justify-content:center;line-height:20px;margin:2px 16px 2px 18px;}" ], (function(e) {
107
+ var t = e.$idCounter;
108
+ return t;
109
+ }), (function(e) {
110
+ var t = e.$idCounter;
111
+ return t;
112
+ }))
113
+ }), (0, m.pickVariant)("$status", {
114
+ error: {
115
+ prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], m.variables.contentColorActive)
116
+ },
117
+ active: {
118
+ prisma: (0, c.css)([ "color:", ";&::before{color:", ";background:", ";border:1px solid ", ";}" ], m.variables.contentColorActive, m.variables.contentColorInverted, m.variables.contentColorActive, m.variables.contentColorActive)
119
+ },
120
+ next: {
121
+ enterprise: (0, c.css)([ "color:", ";" ], m.variables.textDisabledColor),
122
+ prisma: (0, c.css)([ "color:", ";&::before{color:", ";border:1px solid ", ";}" ], m.variables.contentColorMuted, m.variables.contentColorMuted, m.variables.contentColorMuted)
123
+ },
124
+ prev: {
125
+ prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], m.variables.contentColorDefault)
126
+ }
127
+ }));
128
+ var b = (0, c.css)([ "height:24px;width:24px;margin:0 14px 0 16px;" ]);
129
+ var h = p()(u()).withConfig({
130
+ displayName: "StepStyles__StyledCheckCircleIcon",
131
+ componentId: "sc-756fxp-1"
132
+ })([ "", ";color:", ";" ], b, m.variables.accentColorPositive);
133
+ var g = p()(f()).withConfig({
134
+ displayName: "StepStyles__StyledExclamationCircleIcon",
135
+ componentId: "sc-756fxp-2"
136
+ })([ "", ";color:", ";" ], b, m.variables.accentColorNegative);
137
+ var S = p().svg.withConfig({
138
+ displayName: "StepStyles__StyledSvg",
139
+ componentId: "sc-756fxp-3"
140
+ })([ "position:absolute;left:0;right:0;top:0;" ]);
141
+ var C = p().rect.withConfig({
142
+ displayName: "StepStyles__StyledPrevOrActiveRect",
143
+ componentId: "sc-756fxp-4"
144
+ })([ "fill:", ";" ], y);
145
+ var w = C.withComponent("circle");
146
+ var O = p().rect.withConfig({
147
+ displayName: "StepStyles__StyledGray",
148
+ componentId: "sc-756fxp-5"
149
+ })([ "fill:", ";" ], m.variables.gray60);
150
+ var I = p().circle.withConfig({
151
+ displayName: "StepStyles__StyledNext",
152
+ componentId: "sc-756fxp-6"
153
+ })([ "stroke:", ";stroke-width:3px;fill:", ";" ], m.variables.gray60, m.variables.backgroundColor);
154
+ // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
155
+ var k = (0, r.createContext)({
156
+ activeStepId: 0
394
157
  });
395
- });
396
- return /*#__PURE__*/external_react_default.a.createElement(StepBarStyles_Styled, StepBar_extends({
397
- $inline: inline,
398
- "data-test": "step-bar",
399
- "data-test-active-step-id": activeStepId // eslint-disable-next-line jsx-a11y/no-noninteractive-element-to-interactive-role
400
- ,
401
- role: "progressbar",
402
- "aria-valuemin": 1,
403
- "aria-valuemax": lastChildIndex + 1,
404
- "aria-valuenow": activeIndex + 1,
405
- $idCounter: idCounter,
406
- ref: elementRef
407
- }, otherProps), /*#__PURE__*/external_react_default.a.createElement(StepBar_StepBarContext.Provider, {
408
- value: {
409
- idCounter: idCounter,
410
- lastChildIndex: lastChildIndex,
411
- activeStepId: activeStepId
158
+ k.displayName = "StepBar";
159
+ /* harmony default export */ const E = k;
160
+ // CONCATENATED MODULE: ./src/StepBar/Step.tsx
161
+ function _() {
162
+ _ = Object.assign || function(e) {
163
+ for (var t = 1; t < arguments.length; t++) {
164
+ var r = arguments[t];
165
+ for (var n in r) {
166
+ if (Object.prototype.hasOwnProperty.call(r, n)) {
167
+ e[n] = r[n];
168
+ }
169
+ }
170
+ }
171
+ return e;
172
+ };
173
+ return _.apply(this, arguments);
174
+ }
175
+ function j(e, t) {
176
+ if (e == null) return {};
177
+ var r = P(e, t);
178
+ var n, i;
179
+ if (Object.getOwnPropertySymbols) {
180
+ var o = Object.getOwnPropertySymbols(e);
181
+ for (i = 0; i < o.length; i++) {
182
+ n = o[i];
183
+ if (t.indexOf(n) >= 0) continue;
184
+ if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
185
+ r[n] = e[n];
186
+ }
187
+ }
188
+ return r;
189
+ }
190
+ function P(e, t) {
191
+ if (e == null) return {};
192
+ var r = {};
193
+ var n = Object.keys(e);
194
+ var i, o;
195
+ for (o = 0; o < n.length; o++) {
196
+ i = n[o];
197
+ if (t.indexOf(i) >= 0) continue;
198
+ r[i] = e[i];
199
+ }
200
+ return r;
201
+ }
202
+ var N = {
203
+ children: o().node,
204
+ elementRef: o().oneOfType([ o().func, o().object ]),
205
+ error: o().bool,
206
+ stepId: o().any
207
+ };
208
+ function R(e) {
209
+ var t = e.children, i = e.elementRef, o = e.error, a = o === void 0 ? false : o, l = e.stepId, c = j(e, [ "children", "elementRef", "error", "stepId" ]);
210
+ // @docs-props-type StepPropsBase
211
+ var p = (0, r.useContext)(k), d = p.activeStepId, u = p.idCounter, v = p.lastChildIndex;
212
+ var f = s()(), m = f.isEnterprise;
213
+ var y = "next";
214
+ var b = d === l;
215
+ var E = l === 0;
216
+ var P = l === v;
217
+ if (l < d) {
218
+ y = "prev";
219
+ }
220
+ if (b && !a) {
221
+ y = "active";
222
+ }
223
+ if (b && a) {
224
+ y = "error";
225
+ }
226
+ if (m) {
227
+
228
+ return n().createElement(x, _({
229
+ $status: y,
230
+ "data-test-status": y,
231
+ "data-test": "step",
232
+ "data-test-step-id": l,
233
+ ref: i
234
+ }, c), n().createElement(S, {
235
+ focusable: "false",
236
+ width: "100%",
237
+ height: "15px",
238
+ viewBox: "0 0 100 15",
239
+ preserveAspectRatio: "none",
240
+ xmlns: "http://www.w3.org/2000/svg"
241
+ }, n().createElement(O, {
242
+ x: E ? "50" : "0",
243
+ y: "6",
244
+ width: P || E ? "50%" : "100%",
245
+ height: "3"
246
+ }), (y === "active" || y === "error") && !E && n().createElement(C, {
247
+ x: "0",
248
+ y: "6",
249
+ width: "50%",
250
+ height: "3"
251
+ }), y === "prev" && n().createElement(C, {
252
+ x: E ? "50%" : "0",
253
+ y: "6",
254
+ width: "100%",
255
+ height: "3"
256
+ })), n().createElement(S, {
257
+ focusable: "false",
258
+ width: "100%",
259
+ height: "15px",
260
+ viewBox: "0 0 15 15",
261
+ xmlns: "http://www.w3.org/2000/svg"
262
+ }, y !== "next" && n().createElement(w, {
263
+ cx: "50%",
264
+ cy: "50%",
265
+ r: "7.5"
266
+ }), y === "next" && n().createElement(I, {
267
+ cx: "50%",
268
+ cy: "50%",
269
+ r: "6"
270
+ })), t);
271
+ }
272
+
273
+ return n().createElement(x, _({
274
+ $status: y,
275
+ "data-test-status": y,
276
+ "data-test": "step",
277
+ "data-test-step-id": l,
278
+ $idCounter: u,
279
+ ref: i
280
+ }, c), y === "prev" && n().createElement(h, null), y === "error" && n().createElement(g, null), t);
281
+ }
282
+ R.propTypes = N;
283
+ /* harmony default export */ const $ = R;
284
+ // CONCATENATED MODULE: ./src/StepBar/StepBarStyles.ts
285
+ var q = p().ul.withConfig({
286
+ displayName: "StepBarStyles__Styled",
287
+ componentId: "sc-13bf2x4-0"
288
+ })([ "", ";", ";", ";" ], m.mixins.reset("flex"), (0, m.pick)({
289
+ prisma: (0, c.css)([ "position:relative;display:flex;counter-reset:", ";" ], (function(e) {
290
+ var t = e.$idCounter;
291
+ return t;
292
+ }))
293
+ }), (function(e) {
294
+ var t = e.$inline;
295
+ return t && (0, c.css)([ "display:inline-flex;" ]);
296
+ }));
297
+ // CONCATENATED MODULE: ./src/StepBar/StepBar.tsx
298
+ function A() {
299
+ A = Object.assign || function(e) {
300
+ for (var t = 1; t < arguments.length; t++) {
301
+ var r = arguments[t];
302
+ for (var n in r) {
303
+ if (Object.prototype.hasOwnProperty.call(r, n)) {
304
+ e[n] = r[n];
305
+ }
306
+ }
307
+ }
308
+ return e;
309
+ };
310
+ return A.apply(this, arguments);
311
+ }
312
+ function M(e, t) {
313
+ if (e == null) return {};
314
+ var r = T(e, t);
315
+ var n, i;
316
+ if (Object.getOwnPropertySymbols) {
317
+ var o = Object.getOwnPropertySymbols(e);
318
+ for (i = 0; i < o.length; i++) {
319
+ n = o[i];
320
+ if (t.indexOf(n) >= 0) continue;
321
+ if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
322
+ r[n] = e[n];
323
+ }
324
+ }
325
+ return r;
326
+ }
327
+ function T(e, t) {
328
+ if (e == null) return {};
329
+ var r = {};
330
+ var n = Object.keys(e);
331
+ var i, o;
332
+ for (o = 0; o < n.length; o++) {
333
+ i = n[o];
334
+ if (t.indexOf(i) >= 0) continue;
335
+ r[i] = e[i];
336
+ }
337
+ return r;
338
+ }
339
+ var B = {
340
+ activeStepId: o().any.isRequired,
341
+ children: o().node,
342
+ elementRef: o().oneOfType([ o().func, o().object ]),
343
+ inline: o().bool
344
+ };
345
+ function D(e) {
346
+ var t = e.activeStepId, i = e.children, o = e.elementRef, l = e.inline, s = l === void 0 ? false : l, c = M(e, [ "activeStepId", "children", "elementRef", "inline" ]);
347
+ // @docs-props-type StepBarPropsBase
348
+ var p = (0, r.useRef)((0, a.createDOMID)("stepbar")), d = p.current;
349
+ var u = 0;
350
+ var v = r.Children.toArray(i).filter(r.isValidElement);
351
+ var f = v.length - 1;
352
+ var m = v.map((function(e, n) {
353
+ var i = e.props.stepId || n;
354
+ var o = e.props.error;
355
+ if (i === t) {
356
+ u = n;
357
+ }
358
+
359
+ return (0, r.cloneElement)(e, {
360
+ stepId: i,
361
+ error: o
362
+ });
363
+ }));
364
+
365
+ return n().createElement(q, A({
366
+ $inline: s,
367
+ "data-test": "step-bar",
368
+ "data-test-active-step-id": t,
369
+ role: "progressbar",
370
+ "aria-valuemin": 1,
371
+ "aria-valuemax": f + 1,
372
+ "aria-valuenow": u + 1,
373
+ $idCounter: d,
374
+ ref: o
375
+ }, c), n().createElement(E.Provider, {
376
+ value: {
377
+ idCounter: d,
378
+ lastChildIndex: f,
379
+ activeStepId: t
380
+ }
381
+ }, m));
412
382
  }
413
- }, clonedChildren));
414
- }
415
-
416
- StepBar.propTypes = StepBar_propTypes;
417
- StepBar.Step = StepBar_Step;
418
- /* harmony default export */ var StepBar_StepBar = (StepBar);
419
-
420
- // CONCATENATED MODULE: ./src/StepBar/index.ts
421
-
422
-
423
-
424
- /***/ }),
425
-
426
- /***/ 2:
427
- /***/ (function(module, exports) {
428
-
429
- module.exports = require("react");
430
-
431
- /***/ }),
432
-
433
- /***/ 3:
434
- /***/ (function(module, exports) {
435
-
436
- module.exports = require("styled-components");
437
-
438
- /***/ }),
439
-
440
- /***/ 70:
441
- /***/ (function(module, exports) {
442
-
443
- module.exports = require("@splunk/themes/useSplunkTheme");
444
-
445
- /***/ }),
446
-
447
- /***/ 72:
448
- /***/ (function(module, exports) {
449
-
450
- module.exports = require("@splunk/react-icons/CheckCircle");
451
-
452
- /***/ }),
453
-
454
- /***/ 73:
455
- /***/ (function(module, exports) {
456
-
457
- module.exports = require("@splunk/react-icons/ExclamationCircle");
458
-
459
- /***/ }),
460
-
461
- /***/ 8:
462
- /***/ (function(module, exports) {
463
-
464
- module.exports = require("@splunk/ui-utils/id");
465
-
466
- /***/ })
467
-
468
- /******/ });
383
+ D.propTypes = B;
384
+ D.Step = $;
385
+ /* harmony default export */ const z = D;
386
+ // CONCATENATED MODULE: ./src/StepBar/index.ts
387
+ module.exports = t;
388
+ /******/})();