@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/Slider.js CHANGED
@@ -1,843 +1,686 @@
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 = 235);
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
- /***/ 11:
105
- /***/ (function(module, exports) {
106
-
107
- module.exports = require("lodash/has");
108
-
109
- /***/ }),
110
-
111
- /***/ 156:
112
- /***/ (function(module, exports) {
113
-
114
- module.exports = require("decimal.js-light");
115
-
116
- /***/ }),
117
-
118
- /***/ 16:
119
- /***/ (function(module, exports) {
120
-
121
- module.exports = require("@splunk/react-ui/EventListener");
122
-
123
- /***/ }),
124
-
125
- /***/ 2:
126
- /***/ (function(module, exports) {
127
-
128
- module.exports = require("react");
129
-
130
- /***/ }),
131
-
132
- /***/ 21:
133
- /***/ (function(module, exports) {
134
-
135
- module.exports = require("@splunk/react-ui/Popover");
136
-
137
- /***/ }),
138
-
139
- /***/ 235:
140
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
141
-
142
- "use strict";
143
- // ESM COMPAT FLAG
144
- __webpack_require__.r(__webpack_exports__);
145
-
146
- // EXPORTS
147
- __webpack_require__.d(__webpack_exports__, "default", function() { return /* reexport */ src_Slider_Slider; });
148
-
149
- // EXTERNAL MODULE: external "react"
150
- var external_react_ = __webpack_require__(2);
151
- var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
152
-
153
- // EXTERNAL MODULE: external "prop-types"
154
- var external_prop_types_ = __webpack_require__(1);
155
- var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
156
-
157
- // EXTERNAL MODULE: external "decimal.js-light"
158
- var external_decimal_js_light_ = __webpack_require__(156);
159
- var external_decimal_js_light_default = /*#__PURE__*/__webpack_require__.n(external_decimal_js_light_);
160
-
161
- // EXTERNAL MODULE: external "lodash/has"
162
- var has_ = __webpack_require__(11);
163
- var has_default = /*#__PURE__*/__webpack_require__.n(has_);
164
-
165
- // EXTERNAL MODULE: external "lodash/keys"
166
- var keys_ = __webpack_require__(9);
167
- var keys_default = /*#__PURE__*/__webpack_require__.n(keys_);
168
-
169
- // EXTERNAL MODULE: external "lodash/omit"
170
- var omit_ = __webpack_require__(5);
171
- var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
172
-
173
- // EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
174
- var keyboard_ = __webpack_require__(7);
175
-
176
- // EXTERNAL MODULE: external "@splunk/themes"
177
- var themes_ = __webpack_require__(0);
178
-
179
- // EXTERNAL MODULE: external "@splunk/react-ui/EventListener"
180
- var EventListener_ = __webpack_require__(16);
181
- var EventListener_default = /*#__PURE__*/__webpack_require__.n(EventListener_);
182
-
183
- // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
184
- var Popover_ = __webpack_require__(21);
185
- var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
186
-
187
- // EXTERNAL MODULE: external "styled-components"
188
- var external_styled_components_ = __webpack_require__(3);
189
- var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
190
-
191
- // EXTERNAL MODULE: external "tinycolor2"
192
- var external_tinycolor2_ = __webpack_require__(69);
193
- var external_tinycolor2_default = /*#__PURE__*/__webpack_require__.n(external_tinycolor2_);
194
-
195
- // EXTERNAL MODULE: external "@splunk/react-ui/Box"
196
- var Box_ = __webpack_require__(6);
197
- var Box_default = /*#__PURE__*/__webpack_require__.n(Box_);
198
-
199
- // CONCATENATED MODULE: ./src/Slider/SliderStyles.ts
200
-
201
-
202
-
203
-
204
- var StyledBox = external_styled_components_default()(Box_default.a).withConfig({
205
- displayName: "SliderStyles__StyledBox",
206
- componentId: "sc-16ooit4-0"
207
- })(["", ";flex:1 1 auto;&[data-inline]{width:300px;}"], themes_["mixins"].reset('block'));
208
- var StyledInput = external_styled_components_default.a.div.withConfig({
209
- displayName: "SliderStyles__StyledInput",
210
- componentId: "sc-16ooit4-1"
211
- })(["flex:1 0 0;vertical-align:middle;position:relative;cursor:default;height:", ";max-width:100%;"], themes_["variables"].inputHeight);
212
- var notchWidth = '1px';
213
-
214
- var SliderStyles_sliderBarLeftSideColor = function sliderBarLeftSideColor(_ref) {
215
- var $error = _ref.$error;
216
- return Object(themes_["pick"])({
217
- enterprise: themes_["variables"].gray45,
218
- prisma: $error ? themes_["variables"].accentColorNegative : themes_["variables"].contentColorActive
219
- });
220
- };
221
-
222
- var sliderBarStepMarksColor = Object(themes_["pick"])({
223
- enterprise: {
224
- dark: themes_["variables"].gray20,
225
- light: themes_["variables"].gray96
226
- },
227
- prisma: themes_["variables"].neutral100
228
- });
229
- var sliderBarRightSideColor = Object(themes_["pick"])({
230
- enterprise: themes_["variables"].gray80,
231
- prisma: themes_["variables"].interactiveColorBorder
232
- });
233
-
234
- var SliderStyles_stepMarksBackground = function stepMarksBackground(_ref2) {
235
- var $error = _ref2.$error,
236
- $position = _ref2.$position,
237
- $stepMarksWidth = _ref2.$stepMarksWidth;
238
-
239
- /* stylelint-disable indentation */
240
- return $stepMarksWidth !== undefined ? Object(external_styled_components_["css"])(["background-image:linear-gradient( to right,", ",", " ", ",transparent ", ",transparent 100% ),repeating-linear-gradient( to right,", ",", " ", ",transparent ", ",transparent ", "% ),linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );"], SliderStyles_sliderBarLeftSideColor({
241
- $error: $error
242
- }), SliderStyles_sliderBarLeftSideColor({
243
- $error: $error
244
- }), notchWidth, notchWidth, sliderBarStepMarksColor, sliderBarStepMarksColor, notchWidth, notchWidth, $stepMarksWidth, SliderStyles_sliderBarLeftSideColor({
245
- $error: $error
246
- }), SliderStyles_sliderBarLeftSideColor({
247
- $error: $error
248
- }), $position, sliderBarRightSideColor, $position, sliderBarRightSideColor) : Object(external_styled_components_["css"])(["background-image:linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );"], SliderStyles_sliderBarLeftSideColor({
249
- $error: $error
250
- }), SliderStyles_sliderBarLeftSideColor({
251
- $error: $error
252
- }), $position, sliderBarRightSideColor, $position, sliderBarRightSideColor);
253
- /* stylelint-enable indentation */
254
- };
255
-
256
- var StyledSliderBar = external_styled_components_default.a.div.withConfig({
257
- displayName: "SliderStyles__StyledSliderBar",
258
- componentId: "sc-16ooit4-2"
259
- })(["position:absolute;top:", ";left:0;height:", ";width:100%;border-radius:2.5px;", ""], Object(themes_["pick"])({
260
- enterprise: '12px',
261
- prisma: '18px'
262
- }), Object(themes_["pick"])({
263
- enterprise: '5px',
264
- prisma: '4px'
265
- }), function (_ref3) {
266
- var $disabled = _ref3.$disabled,
267
- $error = _ref3.$error,
268
- $position = _ref3.$position,
269
- $stepMarksWidth = _ref3.$stepMarksWidth;
270
- return $disabled ? Object(external_styled_components_["css"])(["background-color:", ";"], Object(themes_["pick"])({
271
- enterprise: themes_["variables"].gray92,
272
- prisma: themes_["variables"].contentColorDisabled
273
- })) : SliderStyles_stepMarksBackground({
274
- $error: $error,
275
- $position: $position,
276
- $stepMarksWidth: $stepMarksWidth
277
- });
278
- });
279
- var sliderThumbWidth = Object(themes_["pick"])({
280
- enterprise: 18,
281
- prisma: 20
282
- });
283
- var StyledSliderThumb = external_styled_components_default.a.button.withConfig({
284
- displayName: "SliderStyles__StyledSliderThumb",
285
- componentId: "sc-16ooit4-3"
286
- })(["", ";display:block;position:absolute;cursor:pointer;width:", "px;height:", "px;border-radius:", ";border-width:0;background-color:", ";margin-left:-8px;top:", ";left:", "%;&:hover:not([disabled]){outline:0;z-index:1;", "}&:focus:not([disabled]),&:active{outline:0;box-shadow:", ";z-index:1;", "}&[disabled]{cursor:not-allowed;background-color:", ";}", ""], themes_["mixins"].reset('inline'), sliderThumbWidth, sliderThumbWidth, Object(themes_["pick"])({
287
- enterprise: '9px',
288
- prisma: '10px'
289
- }), Object(themes_["pick"])({
290
- enterprise: themes_["variables"].gray45,
291
- prisma: themes_["variables"].contentColorActive
292
- }), Object(themes_["pick"])({
293
- enterprise: '6px',
294
- prisma: '10px'
295
- }), function (_ref4) {
296
- var $position = _ref4.$position;
297
- return $position;
298
- }, Object(themes_["pick"])({
299
- enterprise: Object(external_styled_components_["css"])(["box-shadow:", ";"], themes_["variables"].focusShadow)
300
- }), themes_["variables"].focusShadow, Object(themes_["pick"])({
301
- prisma: Object(external_styled_components_["css"])(["background-color:", ";"], themes_["mixins"].overlayColors(themes_["variables"].contentColorActive, themes_["variables"].interactiveColorOverlayActive)),
302
- enterprise: Object(external_styled_components_["css"])(["border-color:", ";"], function (props) {
303
- return external_tinycolor2_default()(themes_["variables"].focusColor(props)).setAlpha(0.8).toRgbString();
304
- })
305
- }), Object(themes_["pick"])({
306
- enterprise: themes_["variables"].gray92,
307
- prisma: themes_["variables"].neutral400
308
- }), Object(themes_["pick"])({
309
- prisma: function prisma(_ref5) {
310
- var $error = _ref5.$error;
311
- return $error && Object(external_styled_components_["css"])(["background-color:", ";&:focus:not([disabled]),&:active{background-color:", ";}"], themes_["variables"].accentColorNegative, themes_["mixins"].overlayColors(themes_["variables"].accentColorNegative, themes_["variables"].interactiveColorOverlayActive));
312
- }
313
- }));
314
- var StyledPopoverContent = external_styled_components_default.a.div.withConfig({
315
- displayName: "SliderStyles__StyledPopoverContent",
316
- componentId: "sc-16ooit4-4"
317
- })(["padding:", ";font-size:", ";line-height:", ";"], Object(themes_["pick"])({
318
- enterprise: themes_["variables"].spacingHalf,
319
- prisma: '12px 16px'
320
- }), Object(themes_["pick"])({
321
- enterprise: themes_["variables"].fontSizeSmall,
322
- prisma: '14px'
323
- }), Object(themes_["pick"])({
324
- enterprise: '18px',
325
- prisma: '24px'
326
- }));
327
- var label = Object(external_styled_components_["css"])(["flex:0 0 auto;line-height:", ";", ""], themes_["variables"].inputHeight, function (_ref6) {
328
- var $disabled = _ref6.$disabled;
329
- return $disabled && Object(external_styled_components_["css"])(["color:", ";"], Object(themes_["pick"])({
330
- enterprise: themes_["variables"].textDisabledColor,
331
- prisma: themes_["variables"].contentColorDisabled
332
- }));
333
- });
334
- var StyledMinLabelBox = external_styled_components_default()(Box_default.a).withConfig({
335
- displayName: "SliderStyles__StyledMinLabelBox",
336
- componentId: "sc-16ooit4-5"
337
- })(["", ";margin-right:", ";text-align:right;"], label, Object(themes_["pick"])({
338
- enterprise: '15px',
339
- prisma: '16px'
340
- }));
341
- var StyledMaxLabelBox = external_styled_components_default()(Box_default.a).withConfig({
342
- displayName: "SliderStyles__StyledMaxLabelBox",
343
- componentId: "sc-16ooit4-6"
344
- })(["", ";margin-left:", ";text-align:left;"], label, Object(themes_["pick"])({
345
- enterprise: '15px',
346
- prisma: '16px'
347
- }));
348
-
349
- // CONCATENATED MODULE: ./src/Slider/Slider.tsx
350
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
351
-
352
- 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); }
353
-
354
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
355
-
356
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
357
-
358
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
359
-
360
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
361
-
362
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
363
-
364
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
365
-
366
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
367
-
368
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
369
-
370
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
371
-
372
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
373
-
374
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
375
-
376
-
377
-
378
-
379
-
380
-
381
-
382
-
383
-
384
-
385
-
386
-
387
- var propTypes = {
388
- defaultValue: external_prop_types_default.a.number,
389
- describedBy: external_prop_types_default.a.string,
390
- disabled: external_prop_types_default.a.bool,
391
- displayValue: external_prop_types_default.a.string,
392
- elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
393
- error: external_prop_types_default.a.bool,
394
- inline: external_prop_types_default.a.bool,
395
- labelledBy: external_prop_types_default.a.string,
396
- max: external_prop_types_default.a.number,
397
- maxLabel: external_prop_types_default.a.node,
398
- min: external_prop_types_default.a.number,
399
- minLabel: external_prop_types_default.a.node,
400
- name: external_prop_types_default.a.string,
401
- onChange: external_prop_types_default.a.func,
402
-
403
- /** @private. */
404
- required: external_prop_types_default.a.bool,
405
- step: external_prop_types_default.a.number,
406
- stepMarks: external_prop_types_default.a.oneOf(['focus', 'always', 'never']),
407
-
408
- /** @private */
409
- splunkTheme: external_prop_types_default.a.object,
410
- value: external_prop_types_default.a.number
411
- };
412
- var defaultProps = {
413
- disabled: false,
414
- error: false,
415
- inline: false,
416
- min: 1,
417
- max: 5,
418
- step: 1,
419
- stepMarks: 'focus'
420
- };
421
-
422
- var Slider_Slider = /*#__PURE__*/function (_Component) {
423
- _inherits(Slider, _Component);
424
-
425
- var _super = _createSuper(Slider);
426
-
427
- // @docs-props-type SliderPropsBase
428
- function Slider(props) {
429
- var _this;
430
-
431
- _classCallCheck(this, Slider);
432
-
433
- _this = _super.call(this, props);
434
-
435
- _defineProperty(_assertThisInitialized(_this), "controlledExternally", void 0);
436
-
437
- _defineProperty(_assertThisInitialized(_this), "sliderThumb", null);
438
-
439
- _defineProperty(_assertThisInitialized(_this), "checkPositionBounds", function (pos) {
440
- if (pos > 100) {
441
- return 100;
442
- }
443
-
444
- if (pos < 0) {
445
- return 0;
446
- }
447
-
448
- return pos;
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
+ default: () => /* reexport */ ne
449
65
  });
450
-
451
- _defineProperty(_assertThisInitialized(_this), "checkValueBounds", function (val) {
452
- if (val > _this.props.max) {
453
- return _this.props.max;
454
- }
455
-
456
- if (val < _this.props.min) {
457
- return _this.props.min;
458
- }
459
-
460
- return val;
66
+ // CONCATENATED MODULE: external "react"
67
+ const r = require("react");
68
+ var n = e.n(r);
69
+ // CONCATENATED MODULE: external "prop-types"
70
+ const i = require("prop-types");
71
+ var o = e.n(i);
72
+ // CONCATENATED MODULE: external "decimal.js-light"
73
+ const a = require("decimal.js-light");
74
+ var s = e.n(a);
75
+ // CONCATENATED MODULE: external "lodash/has"
76
+ const l = require("lodash/has");
77
+ var u = e.n(l);
78
+ // CONCATENATED MODULE: external "lodash/keys"
79
+ const c = require("lodash/keys");
80
+ var p = e.n(c);
81
+ // CONCATENATED MODULE: external "lodash/omit"
82
+ const d = require("lodash/omit");
83
+ var f = e.n(d);
84
+ // CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
85
+ const v = require("@splunk/ui-utils/keyboard");
86
+ // CONCATENATED MODULE: external "@splunk/themes"
87
+ const h = require("@splunk/themes");
88
+ // CONCATENATED MODULE: external "@splunk/react-ui/EventListener"
89
+ const m = require("@splunk/react-ui/EventListener");
90
+ var b = e.n(m);
91
+ // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
92
+ const y = require("@splunk/react-ui/Popover");
93
+ var g = e.n(y);
94
+ // CONCATENATED MODULE: external "styled-components"
95
+ const k = require("styled-components");
96
+ var x = e.n(k);
97
+ // CONCATENATED MODULE: external "tinycolor2"
98
+ const w = require("tinycolor2");
99
+ var S = e.n(w);
100
+ // CONCATENATED MODULE: external "@splunk/react-ui/Box"
101
+ const T = require("@splunk/react-ui/Box");
102
+ var C = e.n(T);
103
+ // CONCATENATED MODULE: ./src/Slider/SliderStyles.ts
104
+ var M = x()(C()).withConfig({
105
+ displayName: "SliderStyles__StyledBox",
106
+ componentId: "sc-16ooit4-0"
107
+ })([ "", ";flex:1 1 auto;&[data-inline]{width:300px;}" ], h.mixins.reset("block"));
108
+ var E = x().div.withConfig({
109
+ displayName: "SliderStyles__StyledInput",
110
+ componentId: "sc-16ooit4-1"
111
+ })([ "flex:1 0 0;vertical-align:middle;position:relative;cursor:default;height:", ";max-width:100%;" ], h.variables.inputHeight);
112
+ var B = "1px";
113
+ var $ = function e(t) {
114
+ var r = t.$error;
115
+ return (0, h.pick)({
116
+ enterprise: h.variables.gray45,
117
+ prisma: r ? h.variables.accentColorNegative : h.variables.contentColorActive
118
+ });
119
+ };
120
+ var V = (0, h.pick)({
121
+ enterprise: {
122
+ dark: h.variables.gray20,
123
+ light: h.variables.gray96
124
+ },
125
+ prisma: h.variables.neutral100
461
126
  });
462
-
463
- _defineProperty(_assertThisInitialized(_this), "handleBlur", function () {
464
- _this.setState({
465
- isFocused: false,
466
- showTooltip: false
467
- });
127
+ var _ = (0, h.pick)({
128
+ enterprise: h.variables.gray80,
129
+ prisma: h.variables.interactiveColorBorder
468
130
  });
469
-
470
- _defineProperty(_assertThisInitialized(_this), "handleClick", function (e) {
471
- var pos = _this.percentageFromEvent(e);
472
-
473
- if (pos !== undefined) {
474
- var value = _this.roundValueToStep(_this.positionToValue(pos));
475
-
476
- _this.setValue(e, {
477
- value: value
131
+ var O = function e(t) {
132
+ var r = t.$error, n = t.$position, i = t.$stepMarksWidth;
133
+ /* stylelint-disable indentation */ return i !== undefined ? (0, k.css)([ "background-image:linear-gradient( to right,", ",", " ", ",transparent ", ",transparent 100% ),repeating-linear-gradient( to right,", ",", " ", ",transparent ", ",transparent ", "% ),linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );" ], $({
134
+ $error: r
135
+ }), $({
136
+ $error: r
137
+ }), B, B, V, V, B, B, i, $({
138
+ $error: r
139
+ }), $({
140
+ $error: r
141
+ }), n, _, n, _) : (0, k.css)([ "background-image:linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );" ], $({
142
+ $error: r
143
+ }), $({
144
+ $error: r
145
+ }), n, _, n, _);
146
+ /* stylelint-enable indentation */ };
147
+ var P = x().div.withConfig({
148
+ displayName: "SliderStyles__StyledSliderBar",
149
+ componentId: "sc-16ooit4-2"
150
+ })([ "position:absolute;top:", ";left:0;height:", ";width:100%;border-radius:2.5px;", "" ], (0,
151
+ h.pick)({
152
+ enterprise: "12px",
153
+ prisma: "18px"
154
+ }), (0, h.pick)({
155
+ enterprise: "5px",
156
+ prisma: "4px"
157
+ }), (function(e) {
158
+ var t = e.$disabled, r = e.$error, n = e.$position, i = e.$stepMarksWidth;
159
+ return t ? (0, k.css)([ "background-color:", ";" ], (0, h.pick)({
160
+ enterprise: h.variables.gray92,
161
+ prisma: h.variables.contentColorDisabled
162
+ })) : O({
163
+ $error: r,
164
+ $position: n,
165
+ $stepMarksWidth: i
478
166
  });
479
- }
167
+ }));
168
+ var j = (0, h.pick)({
169
+ enterprise: 18,
170
+ prisma: 20
480
171
  });
481
-
482
- _defineProperty(_assertThisInitialized(_this), "handleFocus", function () {
483
- _this.setState({
484
- isFocused: true,
485
- showTooltip: true
486
- });
487
- });
488
-
489
- _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (e) {
490
- var val = _this.getValue();
491
-
492
- if (val !== undefined) {
493
- var step = _this.props.step;
494
-
495
- if (Object(keyboard_["keycode"])(e.nativeEvent) === 'right') {
496
- val = _this.checkValueBounds(val + step);
497
- } else if (Object(keyboard_["keycode"])(e.nativeEvent) === 'left') {
498
- val = _this.checkValueBounds(val - step);
499
- } else if (Object(keyboard_["keycode"])(e.nativeEvent) === 'up') {
500
- e.preventDefault();
501
- val = _this.checkValueBounds(val + step);
502
- } else if (Object(keyboard_["keycode"])(e.nativeEvent) === 'down') {
503
- e.preventDefault();
504
- val = _this.checkValueBounds(val - step);
172
+ var q = x().button.withConfig({
173
+ displayName: "SliderStyles__StyledSliderThumb",
174
+ componentId: "sc-16ooit4-3"
175
+ })([ "", ";display:block;position:absolute;cursor:pointer;width:", "px;height:", "px;border-radius:", ";border-width:0;background-color:", ";margin-left:-8px;top:", ";left:", "%;&:hover:not([disabled]){outline:0;z-index:1;", "}&:focus:not([disabled]),&:active{outline:0;box-shadow:", ";z-index:1;", "}&[disabled]{cursor:not-allowed;background-color:", ";}", "" ], h.mixins.reset("inline"), j, j, (0,
176
+ h.pick)({
177
+ enterprise: "9px",
178
+ prisma: "10px"
179
+ }), (0, h.pick)({
180
+ enterprise: h.variables.gray45,
181
+ prisma: h.variables.contentColorActive
182
+ }), (0, h.pick)({
183
+ enterprise: "6px",
184
+ prisma: "10px"
185
+ }), (function(e) {
186
+ var t = e.$position;
187
+ return t;
188
+ }), (0, h.pick)({
189
+ enterprise: (0, k.css)([ "box-shadow:", ";" ], h.variables.focusShadow)
190
+ }), h.variables.focusShadow, (0, h.pick)({
191
+ prisma: (0, k.css)([ "background-color:", ";" ], h.mixins.overlayColors(h.variables.contentColorActive, h.variables.interactiveColorOverlayActive)),
192
+ enterprise: (0, k.css)([ "border-color:", ";" ], (function(e) {
193
+ return S()(h.variables.focusColor(e)).setAlpha(.8).toRgbString();
194
+ }))
195
+ }), (0, h.pick)({
196
+ enterprise: h.variables.gray92,
197
+ prisma: h.variables.neutral400
198
+ }), (0, h.pick)({
199
+ prisma: function e(t) {
200
+ var r = t.$error;
201
+ return r && (0, k.css)([ "background-color:", ";&:focus:not([disabled]),&:active{background-color:", ";}" ], h.variables.accentColorNegative, h.mixins.overlayColors(h.variables.accentColorNegative, h.variables.interactiveColorOverlayActive));
202
+ }
203
+ }));
204
+ var D = x().div.withConfig({
205
+ displayName: "SliderStyles__StyledPopoverContent",
206
+ componentId: "sc-16ooit4-4"
207
+ })([ "padding:", ";font-size:", ";line-height:", ";" ], (0, h.pick)({
208
+ enterprise: h.variables.spacingHalf,
209
+ prisma: "12px 16px"
210
+ }), (0, h.pick)({
211
+ enterprise: h.variables.fontSizeSmall,
212
+ prisma: "14px"
213
+ }), (0, h.pick)({
214
+ enterprise: "18px",
215
+ prisma: "24px"
216
+ }));
217
+ var N = (0, k.css)([ "flex:0 0 auto;line-height:", ";", "" ], h.variables.inputHeight, (function(e) {
218
+ var t = e.$disabled;
219
+ return t && (0, k.css)([ "color:", ";" ], (0, h.pick)({
220
+ enterprise: h.variables.textDisabledColor,
221
+ prisma: h.variables.contentColorDisabled
222
+ }));
223
+ }));
224
+ var R = x()(C()).withConfig({
225
+ displayName: "SliderStyles__StyledMinLabelBox",
226
+ componentId: "sc-16ooit4-5"
227
+ })([ "", ";margin-right:", ";text-align:right;" ], N, (0, h.pick)({
228
+ enterprise: "15px",
229
+ prisma: "16px"
230
+ }));
231
+ var F = x()(C()).withConfig({
232
+ displayName: "SliderStyles__StyledMaxLabelBox",
233
+ componentId: "sc-16ooit4-6"
234
+ })([ "", ";margin-left:", ";text-align:left;" ], N, (0, h.pick)({
235
+ enterprise: "15px",
236
+ prisma: "16px"
237
+ }));
238
+ // CONCATENATED MODULE: ./src/Slider/Slider.tsx
239
+ function I(e) {
240
+ "@babel/helpers - typeof";
241
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
242
+ I = function e(t) {
243
+ return typeof t;
244
+ };
505
245
  } else {
506
- return;
246
+ I = function e(t) {
247
+ return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
248
+ };
507
249
  }
508
-
509
- val = _this.roundValueToStep(val);
510
-
511
- _this.setValue(e, {
512
- value: val
513
- });
514
- }
515
- });
516
-
517
- _defineProperty(_assertThisInitialized(_this), "handleMount", function (el) {
518
- _this.setState({
519
- sliderBar: el
520
- });
521
- });
522
-
523
- _defineProperty(_assertThisInitialized(_this), "handleMouseDown", function (e) {
524
- e.preventDefault();
525
-
526
- _this.focus();
527
-
528
- _this.setState({
529
- selected: true,
530
- showTooltip: true
531
- });
532
- });
533
-
534
- _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function () {
535
- _this.setState({
536
- showTooltip: true
537
- });
538
- });
539
-
540
- _defineProperty(_assertThisInitialized(_this), "handleMouseLeave", function () {
541
- if (!_this.state.selected) {
542
- _this.setState({
543
- showTooltip: false
544
- });
545
- }
546
- });
547
-
548
- _defineProperty(_assertThisInitialized(_this), "handleMouseMove", function (e) {
549
- if (_this.state.selected) {
550
- var pos = _this.percentageFromEvent(e);
551
-
552
- if (pos !== undefined) {
553
- var value = _this.roundValueToStep(_this.positionToValue(pos));
554
-
555
- _this.setValue(e, {
556
- value: value
557
- });
250
+ return I(e);
251
+ }
252
+ function L() {
253
+ L = Object.assign || function(e) {
254
+ for (var t = 1; t < arguments.length; t++) {
255
+ var r = arguments[t];
256
+ for (var n in r) {
257
+ if (Object.prototype.hasOwnProperty.call(r, n)) {
258
+ e[n] = r[n];
259
+ }
260
+ }
261
+ }
262
+ return e;
263
+ };
264
+ return L.apply(this, arguments);
265
+ }
266
+ function W(e, t) {
267
+ if (!(e instanceof t)) {
268
+ throw new TypeError("Cannot call a class as a function");
558
269
  }
559
- }
560
- });
561
-
562
- _defineProperty(_assertThisInitialized(_this), "handleMouseUp", function () {
563
- _this.setState({
564
- selected: false,
565
- showTooltip: false
566
- });
567
- });
568
-
569
- _defineProperty(_assertThisInitialized(_this), "percentageFromEvent", function (e) {
570
- if (_this.state.sliderBar === null) {
571
- return undefined;
572
- }
573
-
574
- var boundingRect = _this.state.sliderBar.getBoundingClientRect();
575
-
576
- var offset = e.clientX - boundingRect.left;
577
- return _this.checkPositionBounds(offset / boundingRect.width * 100);
578
- });
579
-
580
- _defineProperty(_assertThisInitialized(_this), "positionToValue", function (pos) {
581
- var valRange = _this.props.max - _this.props.min;
582
- return pos / 100 * valRange + _this.props.min;
583
- });
584
-
585
- _defineProperty(_assertThisInitialized(_this), "roundValueToStep", function (val) {
586
- var step = _this.props.step;
587
- return new external_decimal_js_light_default.a(val).div(step).todp(0).mul(step).toNumber();
588
- });
589
-
590
- _defineProperty(_assertThisInitialized(_this), "valueToPosition", function (val) {
591
- if (val === undefined) {
592
- return undefined;
593
- }
594
-
595
- var valRange = _this.props.max - _this.props.min;
596
- return (val - _this.props.min) / valRange * 100;
597
- });
598
-
599
- _this.controlledExternally = has_default()(props, 'value');
600
- var defValue = has_default()(props, 'defaultValue') ? props.defaultValue : _this.roundValueToStep((props.max - props.min) / 2);
601
- _this.state = {
602
- isFocused: false,
603
- selected: false,
604
- showTooltip: false,
605
- sliderBar: null,
606
- value: _this.isControlled() ? undefined : defValue
607
- };
608
-
609
- if (false) {}
610
-
611
- if (props.min >= props.max && process.env.NODE_ENV !== "production") {
612
- throw new Error('Error in Slider: max must be greater than min');
613
270
  }
614
-
615
- return _this;
616
- }
617
-
618
- _createClass(Slider, [{
619
- key: "componentDidUpdate",
620
- value: function componentDidUpdate(prevProps) {
621
- if (false) {}
622
-
623
- if (false) {}
271
+ function A(e, t) {
272
+ for (var r = 0; r < t.length; r++) {
273
+ var n = t[r];
274
+ n.enumerable = n.enumerable || false;
275
+ n.configurable = true;
276
+ if ("value" in n) n.writable = true;
277
+ Object.defineProperty(e, n.key, n);
278
+ }
624
279
  }
625
- }, {
626
- key: "getValue",
627
- value: function getValue() {
628
- return this.isControlled() ? this.props.value : this.state.value;
280
+ function z(e, t, r) {
281
+ if (t) A(e.prototype, t);
282
+ if (r) A(e, r);
283
+ return e;
629
284
  }
630
- }, {
631
- key: "setValue",
632
- value: function setValue(e, _ref) {
633
- var value = _ref.value;
634
- var currentValue = this.getValue();
635
- var name = this.props.name;
636
-
637
- if (currentValue !== value) {
638
- var _this$props$onChange, _this$props;
639
-
640
- (_this$props$onChange = (_this$props = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, e, {
641
- value: value,
642
- name: name
643
- });
644
-
645
- if (!this.isControlled()) {
646
- this.setState({
647
- value: value
648
- });
285
+ function H(e, t) {
286
+ if (typeof t !== "function" && t !== null) {
287
+ throw new TypeError("Super expression must either be null or a function");
649
288
  }
650
- }
289
+ e.prototype = Object.create(t && t.prototype, {
290
+ constructor: {
291
+ value: e,
292
+ writable: true,
293
+ configurable: true
294
+ }
295
+ });
296
+ if (t) K(e, t);
651
297
  }
652
- }, {
653
- key: "focus",
654
-
655
- /**
656
- * Places focus on the slider.
657
- */
658
- value: function focus() {
659
- var _this$sliderThumb;
660
-
661
- (_this$sliderThumb = this.sliderThumb) === null || _this$sliderThumb === void 0 ? void 0 : _this$sliderThumb.focus();
298
+ function K(e, t) {
299
+ K = Object.setPrototypeOf || function e(t, r) {
300
+ t.__proto__ = r;
301
+ return t;
302
+ };
303
+ return K(e, t);
662
304
  }
663
- }, {
664
- key: "stepWidthInPercentage",
665
- value: function stepWidthInPercentage() {
666
- return this.props.step * 100 / (this.props.max - this.props.min);
305
+ function U(e) {
306
+ var t = J();
307
+ return function r() {
308
+ var n = Q(e), i;
309
+ if (t) {
310
+ var o = Q(this).constructor;
311
+ i = Reflect.construct(n, arguments, o);
312
+ } else {
313
+ i = n.apply(this, arguments);
314
+ }
315
+ return X(this, i);
316
+ };
667
317
  }
668
- }, {
669
- key: "stepMarksWidth",
670
- value: function stepMarksWidth() {
671
- // don't render stepMarks if they are too small i.e. stepWidth is less than SliderThumb divided by 2
672
- // in that case, undefined is returned
673
- var _this$props2 = this.props,
674
- max = _this$props2.max,
675
- min = _this$props2.min,
676
- step = _this$props2.step,
677
- splunkTheme = _this$props2.splunkTheme;
678
- var sliderBar = this.state.sliderBar;
679
-
680
- if (sliderBar === null) {
681
- return undefined;
682
- }
683
-
684
- var totalSteps = Math.round((max - min) / step);
685
- var wholeSlider = sliderBar.getBoundingClientRect();
686
- var thumbWidth = sliderThumbWidth(splunkTheme);
687
- return wholeSlider.width / totalSteps > thumbWidth / 2 ? this.stepWidthInPercentage() : undefined;
318
+ function X(e, t) {
319
+ if (t && (I(t) === "object" || typeof t === "function")) {
320
+ return t;
321
+ }
322
+ return G(e);
688
323
  }
689
- }, {
690
- key: "isControlled",
691
- value: function isControlled() {
692
- return this.controlledExternally;
324
+ function G(e) {
325
+ if (e === void 0) {
326
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
327
+ }
328
+ return e;
693
329
  }
694
- }, {
695
- key: "render",
696
- value: function render() {
697
- var _this2 = this;
698
-
699
- var _this$props3 = this.props,
700
- describedBy = _this$props3.describedBy,
701
- disabled = _this$props3.disabled,
702
- displayValue = _this$props3.displayValue,
703
- elementRef = _this$props3.elementRef,
704
- error = _this$props3.error,
705
- inline = _this$props3.inline,
706
- labelledBy = _this$props3.labelledBy,
707
- max = _this$props3.max,
708
- maxLabel = _this$props3.maxLabel,
709
- min = _this$props3.min,
710
- minLabel = _this$props3.minLabel,
711
- required = _this$props3.required,
712
- stepMarks = _this$props3.stepMarks;
713
- var _this$state = this.state,
714
- isFocused = _this$state.isFocused,
715
- selected = _this$state.selected,
716
- sliderBar = _this$state.sliderBar;
717
- var currentValue = this.getValue();
718
- var position = this.valueToPosition(currentValue);
719
- var showStepMarks = stepMarks === 'focus' && isFocused || stepMarks === 'always';
720
- var stepMarksWidth = showStepMarks && sliderBar ? this.stepMarksWidth() : undefined;
721
- var boxProps = omit_default()(this.props, keys_default()(Slider.propTypes));
722
- /* eslint-disable jsx-a11y/no-static-element-interactions */
723
-
724
- return /*#__PURE__*/external_react_default.a.createElement(StyledBox, _extends({
725
- "data-test": "slider",
726
- "data-test-value": currentValue,
727
- elementRef: elementRef,
728
- flex: true,
729
- inline: inline
730
- }, boxProps), selected && /*#__PURE__*/external_react_default.a.createElement(external_react_default.a.Fragment, null, /*#__PURE__*/external_react_default.a.createElement(EventListener_default.a, {
731
- target: window,
732
- eventType: "mouseup",
733
- listener: this.handleMouseUp
734
- }), /*#__PURE__*/external_react_default.a.createElement(EventListener_default.a, {
735
- target: window,
736
- eventType: "mousemove",
737
- listener: this.handleMouseMove
738
- })), minLabel !== null && /*#__PURE__*/external_react_default.a.createElement(StyledMinLabelBox, {
739
- "data-test": "min-label",
740
- $disabled: disabled
741
- }, minLabel || min), /*#__PURE__*/external_react_default.a.createElement(StyledInput, {
742
- onClick: disabled ? undefined : this.handleClick
743
- }, /*#__PURE__*/external_react_default.a.createElement(StyledSliderBar, {
744
- "aria-required": required,
745
- "data-test": "bar",
746
- $disabled: disabled,
747
- ref: this.handleMount,
748
- $error: error,
749
- $position: position,
750
- $stepMarksWidth: stepMarksWidth
751
- }), /*#__PURE__*/external_react_default.a.createElement(StyledSliderThumb, {
752
- "aria-describedby": describedBy,
753
- "aria-labelledby": labelledBy,
754
- "aria-invalid": error,
755
- "aria-valuemax": max,
756
- "aria-valuemin": min,
757
- "aria-valuenow": currentValue,
758
- "data-test": "handle",
759
- onBlur: this.handleBlur,
760
- onMouseEnter: this.handleMouseEnter,
761
- onMouseLeave: this.handleMouseLeave,
762
- onKeyDown: disabled ? undefined : this.handleKeyDown,
763
- onMouseDown: disabled ? undefined : this.handleMouseDown,
764
- onFocus: this.handleFocus,
765
- ref: function ref(el) {
766
- _this2.sliderThumb = el;
767
- },
768
- role: "slider",
769
- disabled: disabled,
770
- $error: error,
771
- $position: position
772
- }), /*#__PURE__*/external_react_default.a.createElement(Popover_default.a, {
773
- open: this.state.showTooltip,
774
- anchor: this.sliderThumb,
775
- appearance: "inverted",
776
- align: "center"
777
- }, /*#__PURE__*/external_react_default.a.createElement(StyledPopoverContent, null, displayValue || currentValue))), maxLabel !== null && /*#__PURE__*/external_react_default.a.createElement(StyledMaxLabelBox, {
778
- "data-test": "max-label",
779
- $disabled: disabled
780
- }, maxLabel || max));
781
- /* eslint-enable jsx-a11y/no-static-element-interactions */
330
+ function J() {
331
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
332
+ if (Reflect.construct.sham) return false;
333
+ if (typeof Proxy === "function") return true;
334
+ try {
335
+ Date.prototype.toString.call(Reflect.construct(Date, [], (function() {})));
336
+ return true;
337
+ } catch (e) {
338
+ return false;
339
+ }
782
340
  }
783
- }]);
784
-
785
- return Slider;
786
- }(external_react_["Component"]);
787
-
788
- _defineProperty(Slider_Slider, "propTypes", propTypes);
789
-
790
- _defineProperty(Slider_Slider, "defaultProps", defaultProps);
791
-
792
- var SliderWithTheme = Object(themes_["withSplunkTheme"])(Slider_Slider);
793
- SliderWithTheme.propTypes = Slider_Slider.propTypes;
794
- /* harmony default export */ var src_Slider_Slider = (SliderWithTheme);
795
- // CONCATENATED MODULE: ./src/Slider/index.ts
796
-
797
-
798
-
799
- /***/ }),
800
-
801
- /***/ 3:
802
- /***/ (function(module, exports) {
803
-
804
- module.exports = require("styled-components");
805
-
806
- /***/ }),
807
-
808
- /***/ 5:
809
- /***/ (function(module, exports) {
810
-
811
- module.exports = require("lodash/omit");
812
-
813
- /***/ }),
814
-
815
- /***/ 6:
816
- /***/ (function(module, exports) {
817
-
818
- module.exports = require("@splunk/react-ui/Box");
819
-
820
- /***/ }),
821
-
822
- /***/ 69:
823
- /***/ (function(module, exports) {
824
-
825
- module.exports = require("tinycolor2");
826
-
827
- /***/ }),
828
-
829
- /***/ 7:
830
- /***/ (function(module, exports) {
831
-
832
- module.exports = require("@splunk/ui-utils/keyboard");
833
-
834
- /***/ }),
835
-
836
- /***/ 9:
837
- /***/ (function(module, exports) {
838
-
839
- module.exports = require("lodash/keys");
840
-
841
- /***/ })
842
-
843
- /******/ });
341
+ function Q(e) {
342
+ Q = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
343
+ return t.__proto__ || Object.getPrototypeOf(t);
344
+ };
345
+ return Q(e);
346
+ }
347
+ function Y(e, t, r) {
348
+ if (t in e) {
349
+ Object.defineProperty(e, t, {
350
+ value: r,
351
+ enumerable: true,
352
+ configurable: true,
353
+ writable: true
354
+ });
355
+ } else {
356
+ e[t] = r;
357
+ }
358
+ return e;
359
+ }
360
+ var Z = {
361
+ defaultValue: o().number,
362
+ describedBy: o().string,
363
+ disabled: o().bool,
364
+ displayValue: o().string,
365
+ elementRef: o().oneOfType([ o().func, o().object ]),
366
+ error: o().bool,
367
+ inline: o().bool,
368
+ labelledBy: o().string,
369
+ max: o().number,
370
+ maxLabel: o().node,
371
+ min: o().number,
372
+ minLabel: o().node,
373
+ name: o().string,
374
+ onChange: o().func,
375
+ /** @private. */
376
+ required: o().bool,
377
+ step: o().number,
378
+ stepMarks: o().oneOf([ "focus", "always", "never" ]),
379
+ /** @private */
380
+ splunkTheme: o().object,
381
+ value: o().number
382
+ };
383
+ var ee = {
384
+ disabled: false,
385
+ error: false,
386
+ inline: false,
387
+ min: 1,
388
+ max: 5,
389
+ step: 1,
390
+ stepMarks: "focus"
391
+ };
392
+ var te = function(e) {
393
+ H(r, e);
394
+ var t = U(r);
395
+ // @docs-props-type SliderPropsBase
396
+ function r(e) {
397
+ var n;
398
+ W(this, r);
399
+ n = t.call(this, e);
400
+ Y(G(n), "controlledExternally", void 0);
401
+ Y(G(n), "sliderThumb", null);
402
+ Y(G(n), "checkPositionBounds", (function(e) {
403
+ if (e > 100) {
404
+ return 100;
405
+ }
406
+ if (e < 0) {
407
+ return 0;
408
+ }
409
+ return e;
410
+ }));
411
+ Y(G(n), "checkValueBounds", (function(e) {
412
+ if (e > n.props.max) {
413
+ return n.props.max;
414
+ }
415
+ if (e < n.props.min) {
416
+ return n.props.min;
417
+ }
418
+ return e;
419
+ }));
420
+ Y(G(n), "handleBlur", (function() {
421
+ n.setState({
422
+ isFocused: false,
423
+ showTooltip: false
424
+ });
425
+ }));
426
+ Y(G(n), "handleClick", (function(e) {
427
+ var t = n.percentageFromEvent(e);
428
+ if (t !== undefined) {
429
+ var r = n.roundValueToStep(n.positionToValue(t));
430
+ n.setValue(e, {
431
+ value: r
432
+ });
433
+ }
434
+ }));
435
+ Y(G(n), "handleFocus", (function() {
436
+ n.setState({
437
+ isFocused: true,
438
+ showTooltip: true
439
+ });
440
+ }));
441
+ Y(G(n), "handleKeyDown", (function(e) {
442
+ var t = n.getValue();
443
+ if (t !== undefined) {
444
+ var r = n.props.step;
445
+ if ((0, v.keycode)(e.nativeEvent) === "right") {
446
+ t = n.checkValueBounds(t + r);
447
+ } else if ((0, v.keycode)(e.nativeEvent) === "left") {
448
+ t = n.checkValueBounds(t - r);
449
+ } else if ((0, v.keycode)(e.nativeEvent) === "up") {
450
+ e.preventDefault();
451
+ t = n.checkValueBounds(t + r);
452
+ } else if ((0, v.keycode)(e.nativeEvent) === "down") {
453
+ e.preventDefault();
454
+ t = n.checkValueBounds(t - r);
455
+ } else {
456
+ return;
457
+ }
458
+ t = n.roundValueToStep(t);
459
+ n.setValue(e, {
460
+ value: t
461
+ });
462
+ }
463
+ }));
464
+ Y(G(n), "handleMount", (function(e) {
465
+ n.setState({
466
+ sliderBar: e
467
+ });
468
+ }));
469
+ Y(G(n), "handleMouseDown", (function(e) {
470
+ e.preventDefault();
471
+ n.focus();
472
+ n.setState({
473
+ selected: true,
474
+ showTooltip: true
475
+ });
476
+ }));
477
+ Y(G(n), "handleMouseEnter", (function() {
478
+ n.setState({
479
+ showTooltip: true
480
+ });
481
+ }));
482
+ Y(G(n), "handleMouseLeave", (function() {
483
+ if (!n.state.selected) {
484
+ n.setState({
485
+ showTooltip: false
486
+ });
487
+ }
488
+ }));
489
+ Y(G(n), "handleMouseMove", (function(e) {
490
+ if (n.state.selected) {
491
+ var t = n.percentageFromEvent(e);
492
+ if (t !== undefined) {
493
+ var r = n.roundValueToStep(n.positionToValue(t));
494
+ n.setValue(e, {
495
+ value: r
496
+ });
497
+ }
498
+ }
499
+ }));
500
+ Y(G(n), "handleMouseUp", (function() {
501
+ n.setState({
502
+ selected: false,
503
+ showTooltip: false
504
+ });
505
+ }));
506
+ Y(G(n), "percentageFromEvent", (function(e) {
507
+ if (n.state.sliderBar === null) {
508
+ return undefined;
509
+ }
510
+ var t = n.state.sliderBar.getBoundingClientRect();
511
+ var r = e.clientX - t.left;
512
+ return n.checkPositionBounds(r / t.width * 100);
513
+ }));
514
+ Y(G(n), "positionToValue", (function(e) {
515
+ var t = n.props.max - n.props.min;
516
+ return e / 100 * t + n.props.min;
517
+ }));
518
+ Y(G(n), "roundValueToStep", (function(e) {
519
+ var t = n.props.step;
520
+ return new (s())(e).div(t).todp(0).mul(t).toNumber();
521
+ }));
522
+ Y(G(n), "valueToPosition", (function(e) {
523
+ if (e === undefined) {
524
+ return undefined;
525
+ }
526
+ var t = n.props.max - n.props.min;
527
+ return (e - n.props.min) / t * 100;
528
+ }));
529
+ n.controlledExternally = u()(e, "value");
530
+ var i = u()(e, "defaultValue") ? e.defaultValue : n.roundValueToStep((e.max - e.min) / 2);
531
+ n.state = {
532
+ isFocused: false,
533
+ selected: false,
534
+ showTooltip: false,
535
+ sliderBar: null,
536
+ value: n.isControlled() ? undefined : i
537
+ };
538
+ if (false) {}
539
+ if (e.min >= e.max && process.env.NODE_ENV !== "production") {}
540
+ return n;
541
+ }
542
+ z(r, [ {
543
+ key: "componentDidUpdate",
544
+ value: function e(t) {
545
+ if (false) {}
546
+ if (false) {}
547
+ }
548
+ }, {
549
+ key: "getValue",
550
+ value: function e() {
551
+ return this.isControlled() ? this.props.value : this.state.value;
552
+ }
553
+ }, {
554
+ key: "setValue",
555
+ value: function e(t, r) {
556
+ var n = r.value;
557
+ var i = this.getValue();
558
+ var o = this.props.name;
559
+ if (i !== n) {
560
+ var a, s;
561
+ (a = (s = this.props).onChange) === null || a === void 0 ? void 0 : a.call(s, t, {
562
+ value: n,
563
+ name: o
564
+ });
565
+ if (!this.isControlled()) {
566
+ this.setState({
567
+ value: n
568
+ });
569
+ }
570
+ }
571
+ }
572
+ }, {
573
+ key: "focus",
574
+ /**
575
+ * Places focus on the slider.
576
+ */
577
+ value: function e() {
578
+ var t;
579
+ (t = this.sliderThumb) === null || t === void 0 ? void 0 : t.focus();
580
+ }
581
+ }, {
582
+ key: "stepWidthInPercentage",
583
+ value: function e() {
584
+ return this.props.step * 100 / (this.props.max - this.props.min);
585
+ }
586
+ }, {
587
+ key: "stepMarksWidth",
588
+ value: function e() {
589
+ // don't render stepMarks if they are too small i.e. stepWidth is less than SliderThumb divided by 2
590
+ // in that case, undefined is returned
591
+ var t = this.props, r = t.max, n = t.min, i = t.step, o = t.splunkTheme;
592
+ var a = this.state.sliderBar;
593
+ if (a === null) {
594
+ return undefined;
595
+ }
596
+ var s = Math.round((r - n) / i);
597
+ var l = a.getBoundingClientRect();
598
+ var u = j(o);
599
+ return l.width / s > u / 2 ? this.stepWidthInPercentage() : undefined;
600
+ }
601
+ }, {
602
+ key: "isControlled",
603
+ value: function e() {
604
+ return this.controlledExternally;
605
+ }
606
+ }, {
607
+ key: "render",
608
+ value: function e() {
609
+ var t = this;
610
+ var i = this.props, o = i.describedBy, a = i.disabled, s = i.displayValue, l = i.elementRef, u = i.error, c = i.inline, d = i.labelledBy, v = i.max, h = i.maxLabel, m = i.min, y = i.minLabel, k = i.required, x = i.stepMarks;
611
+ var w = this.state, S = w.isFocused, T = w.selected, C = w.sliderBar;
612
+ var B = this.getValue();
613
+ var $ = this.valueToPosition(B);
614
+ var V = x === "focus" && S || x === "always";
615
+ var _ = V && C ? this.stepMarksWidth() : undefined;
616
+ var O = f()(this.props, p()(r.propTypes));
617
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
618
+ return n().createElement(M, L({
619
+ "data-test": "slider",
620
+ "data-test-value": B,
621
+ elementRef: l,
622
+ flex: true,
623
+ inline: c
624
+ }, O), T && n().createElement(n().Fragment, null, n().createElement(b(), {
625
+ target: window,
626
+ eventType: "mouseup",
627
+ listener: this.handleMouseUp
628
+ }), n().createElement(b(), {
629
+ target: window,
630
+ eventType: "mousemove",
631
+ listener: this.handleMouseMove
632
+ })), y !== null && n().createElement(R, {
633
+ "data-test": "min-label",
634
+ $disabled: a
635
+ }, y || m), n().createElement(E, {
636
+ onClick: a ? undefined : this.handleClick
637
+ }, n().createElement(P, {
638
+ "aria-required": k,
639
+ "data-test": "bar",
640
+ $disabled: a,
641
+ ref: this.handleMount,
642
+ $error: u,
643
+ $position: $,
644
+ $stepMarksWidth: _
645
+ }), n().createElement(q, {
646
+ "aria-describedby": o,
647
+ "aria-labelledby": d,
648
+ "aria-invalid": u,
649
+ "aria-valuemax": v,
650
+ "aria-valuemin": m,
651
+ "aria-valuenow": B,
652
+ "data-test": "handle",
653
+ onBlur: this.handleBlur,
654
+ onMouseEnter: this.handleMouseEnter,
655
+ onMouseLeave: this.handleMouseLeave,
656
+ onKeyDown: a ? undefined : this.handleKeyDown,
657
+ onMouseDown: a ? undefined : this.handleMouseDown,
658
+ onFocus: this.handleFocus,
659
+ ref: function e(r) {
660
+ t.sliderThumb = r;
661
+ },
662
+ role: "slider",
663
+ disabled: a,
664
+ $error: u,
665
+ $position: $
666
+ }), n().createElement(g(), {
667
+ open: this.state.showTooltip,
668
+ anchor: this.sliderThumb,
669
+ appearance: "inverted",
670
+ align: "center"
671
+ }, n().createElement(D, null, s || B))), h !== null && n().createElement(F, {
672
+ "data-test": "max-label",
673
+ $disabled: a
674
+ }, h || v));
675
+ /* eslint-enable jsx-a11y/no-static-element-interactions */ }
676
+ } ]);
677
+ return r;
678
+ }(r.Component);
679
+ Y(te, "propTypes", Z);
680
+ Y(te, "defaultProps", ee);
681
+ var re = (0, h.withSplunkTheme)(te);
682
+ re.propTypes = te.propTypes;
683
+ /* harmony default export */ const ne = re;
684
+ // CONCATENATED MODULE: ./src/Slider/index.ts
685
+ module.exports = t;
686
+ /******/})();