@splunk/react-ui 4.21.0 → 4.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/Accordion.js +425 -325
  2. package/Anchor.js +147 -117
  3. package/Animation.js +142 -94
  4. package/AnimationToggle.js +197 -193
  5. package/Box.js +145 -118
  6. package/Breadcrumbs.js +288 -206
  7. package/Button.js +488 -465
  8. package/ButtonGroup.js +160 -128
  9. package/ButtonSimple.js +543 -462
  10. package/CHANGELOG.md +24 -3
  11. package/Calendar.js +1111 -1001
  12. package/Card.js +771 -598
  13. package/CardLayout.js +205 -147
  14. package/Chip.js +509 -488
  15. package/Clickable.js +414 -352
  16. package/CloseButton.js +165 -142
  17. package/Code.js +1807 -2084
  18. package/CollapsiblePanel.js +586 -519
  19. package/Color.js +1068 -1068
  20. package/ColumnLayout.js +402 -363
  21. package/ComboBox.js +903 -794
  22. package/Concertina.js +997 -802
  23. package/ControlGroup.js +687 -594
  24. package/Date.js +567 -547
  25. package/DefinitionList.js +308 -234
  26. package/Divider.js +149 -118
  27. package/Dropdown.js +459 -416
  28. package/DualListbox.js +1479 -1541
  29. package/EventListener.js +94 -97
  30. package/File.js +1051 -969
  31. package/FormRows.js +883 -696
  32. package/Heading.js +216 -193
  33. package/Image.js +446 -402
  34. package/JSONTree.js +690 -551
  35. package/Layer.js +437 -410
  36. package/Link.js +336 -255
  37. package/List.js +213 -161
  38. package/Markdown.js +509 -487
  39. package/Menu.js +1104 -1056
  40. package/Message.js +475 -441
  41. package/MessageBar.js +387 -373
  42. package/Modal.js +810 -634
  43. package/ModalLayer.js +326 -243
  44. package/Monogram.js +308 -276
  45. package/Multiselect.js +3564 -3364
  46. package/Number.js +729 -687
  47. package/Paginator.js +510 -449
  48. package/Paragraph.js +145 -112
  49. package/Popover.js +1459 -1432
  50. package/Progress.js +301 -246
  51. package/RadioBar.js +634 -527
  52. package/RadioList.js +483 -444
  53. package/Resize.js +530 -489
  54. package/ResultsMenu.js +479 -455
  55. package/ScreenReaderContent.js +142 -111
  56. package/Scroll.js +595 -456
  57. package/ScrollContainerContext.js +197 -206
  58. package/Search.js +756 -650
  59. package/Select.js +2446 -2345
  60. package/SidePanel.js +390 -284
  61. package/Slider.js +680 -676
  62. package/SlidingPanels.js +639 -503
  63. package/SplitButton.js +464 -367
  64. package/StaticContent.js +161 -133
  65. package/StepBar.js +386 -358
  66. package/Switch.js +710 -640
  67. package/TabBar.js +741 -680
  68. package/TabLayout.js +406 -322
  69. package/Table.js +4974 -4616
  70. package/Text.js +1170 -1138
  71. package/TextArea.js +1102 -1090
  72. package/Tooltip.js +624 -581
  73. package/TransitionOpen.js +489 -422
  74. package/Typography.js +176 -153
  75. package/WaitSpinner.js +230 -206
  76. package/package.json +7 -7
  77. package/types/src/Color/Color.d.ts +0 -1
  78. package/types/src/JSONTree/JSONTreeContext.d.ts +7 -0
  79. package/types/src/JSONTree/TreeNode.d.ts +5 -0
  80. package/types/src/RadioBar/RadioBar.d.ts +1 -0
  81. package/types/src/ResultsMenu/ResultsMenu.d.ts +0 -2
  82. package/types/src/Select/docs/examples/Icons.d.ts +1 -9
  83. package/types/src/Slider/Slider.d.ts +1 -0
  84. package/types/src/TabBar/Tab.d.ts +10 -1
  85. package/types/src/TabBar/TabBar.d.ts +4 -2
  86. package/types/src/Table/Head.d.ts +7 -3
  87. package/types/src/Table/Table.d.ts +3 -2
  88. package/types/src/Table/TableContext.d.ts +2 -0
  89. package/useForceUpdate.js +112 -82
  90. package/useKeyPress.js +74 -71
  91. package/usePrevious.js +65 -65
  92. package/useRovingFocus.js +122 -138
package/Slider.js CHANGED
@@ -1,693 +1,697 @@
1
- /******/ (() => { // webpackBootstrap
2
- /******/ "use strict";
3
- /******/ // The require scope
4
- /******/ var __webpack_require__ = {};
5
- /******/
6
- /************************************************************************/
7
- /******/ /* webpack/runtime/compat get default export */
8
- /******/ (() => {
9
- /******/ // getDefaultExport function for compatibility with non-harmony modules
10
- /******/ __webpack_require__.n = (module) => {
11
- /******/ var getter = module && module.__esModule ?
12
- /******/ () => (module['default']) :
13
- /******/ () => (module);
14
- /******/ __webpack_require__.d(getter, { a: getter });
15
- /******/ return getter;
16
- /******/ };
17
- /******/ })();
18
- /******/
19
- /******/ /* webpack/runtime/define property getters */
20
- /******/ (() => {
21
- /******/ // define getter functions for harmony exports
22
- /******/ __webpack_require__.d = (exports, definition) => {
23
- /******/ for(var key in definition) {
24
- /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
- /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
- /******/ }
27
- /******/ }
28
- /******/ };
29
- /******/ })();
30
- /******/
31
- /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
- /******/ (() => {
33
- /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
- /******/ })();
35
- /******/
36
- /******/ /* webpack/runtime/make namespace object */
37
- /******/ (() => {
38
- /******/ // define __esModule on exports
39
- /******/ __webpack_require__.r = (exports) => {
40
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
- /******/ }
43
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
- /******/ };
45
- /******/ })();
46
- /******/
47
- /************************************************************************/
48
- var __webpack_exports__ = {};
49
- // ESM COMPAT FLAG
50
- __webpack_require__.r(__webpack_exports__);
51
-
52
- // EXPORTS
53
- __webpack_require__.d(__webpack_exports__, {
54
- "default": () => (/* reexport */ Slider_Slider)
55
- });
56
-
57
- ;// CONCATENATED MODULE: external "react"
58
- const external_react_namespaceObject = require("react");
59
- var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
- ;// CONCATENATED MODULE: external "prop-types"
61
- const external_prop_types_namespaceObject = require("prop-types");
62
- var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_namespaceObject);
63
- ;// CONCATENATED MODULE: external "decimal.js-light"
64
- const external_decimal_js_light_namespaceObject = require("decimal.js-light");
65
- var external_decimal_js_light_default = /*#__PURE__*/__webpack_require__.n(external_decimal_js_light_namespaceObject);
66
- ;// CONCATENATED MODULE: external "lodash/has"
67
- const has_namespaceObject = require("lodash/has");
68
- var has_default = /*#__PURE__*/__webpack_require__.n(has_namespaceObject);
69
- ;// CONCATENATED MODULE: external "lodash/keys"
70
- const keys_namespaceObject = require("lodash/keys");
71
- var keys_default = /*#__PURE__*/__webpack_require__.n(keys_namespaceObject);
72
- ;// CONCATENATED MODULE: external "lodash/omit"
73
- const omit_namespaceObject = require("lodash/omit");
74
- var omit_default = /*#__PURE__*/__webpack_require__.n(omit_namespaceObject);
75
- ;// CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
76
- const keyboard_namespaceObject = require("@splunk/ui-utils/keyboard");
77
- ;// CONCATENATED MODULE: external "@splunk/themes"
78
- const themes_namespaceObject = require("@splunk/themes");
79
- ;// CONCATENATED MODULE: external "@splunk/react-ui/EventListener"
80
- const EventListener_namespaceObject = require("@splunk/react-ui/EventListener");
81
- var EventListener_default = /*#__PURE__*/__webpack_require__.n(EventListener_namespaceObject);
82
- ;// CONCATENATED MODULE: external "@splunk/react-ui/Popover"
83
- const Popover_namespaceObject = require("@splunk/react-ui/Popover");
84
- var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_namespaceObject);
85
- ;// CONCATENATED MODULE: external "styled-components"
86
- const external_styled_components_namespaceObject = require("styled-components");
87
- var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_namespaceObject);
88
- ;// CONCATENATED MODULE: external "tinycolor2"
89
- const external_tinycolor2_namespaceObject = require("tinycolor2");
90
- var external_tinycolor2_default = /*#__PURE__*/__webpack_require__.n(external_tinycolor2_namespaceObject);
91
- ;// CONCATENATED MODULE: external "@splunk/react-ui/Box"
92
- const Box_namespaceObject = require("@splunk/react-ui/Box");
93
- var Box_default = /*#__PURE__*/__webpack_require__.n(Box_namespaceObject);
94
- ;// CONCATENATED MODULE: ./src/Slider/SliderStyles.ts
95
-
96
-
97
-
98
-
99
- var StyledBox = external_styled_components_default()((Box_default())).withConfig({
100
- displayName: "SliderStyles__StyledBox",
101
- componentId: "sc-16ooit4-0"
102
- })(["", ";flex:1 1 auto;&[data-inline]{width:300px;}"], themes_namespaceObject.mixins.reset('block'));
103
- var StyledInput = external_styled_components_default().div.withConfig({
104
- displayName: "SliderStyles__StyledInput",
105
- componentId: "sc-16ooit4-1"
106
- })(["flex:1 0 0;vertical-align:middle;position:relative;cursor:default;height:", ";max-width:100%;"], themes_namespaceObject.variables.inputHeight);
107
- var notchWidth = '1px';
108
-
109
- var sliderBarLeftSideColor = function sliderBarLeftSideColor(_ref) {
110
- var $error = _ref.$error;
111
- return (0,themes_namespaceObject.pick)({
112
- enterprise: themes_namespaceObject.variables.gray45,
113
- prisma: $error ? themes_namespaceObject.variables.accentColorNegative : themes_namespaceObject.variables.contentColorActive
114
- });
115
- };
116
-
117
- var sliderBarStepMarksColor = (0,themes_namespaceObject.pick)({
118
- enterprise: {
119
- dark: themes_namespaceObject.variables.gray20,
120
- light: themes_namespaceObject.variables.gray96
121
- },
122
- prisma: themes_namespaceObject.variables.neutral100
123
- });
124
- var sliderBarRightSideColor = (0,themes_namespaceObject.pick)({
125
- enterprise: themes_namespaceObject.variables.gray80,
126
- prisma: themes_namespaceObject.variables.interactiveColorBorder
127
- });
128
-
129
- var stepMarksBackground = function stepMarksBackground(_ref2) {
130
- var $error = _ref2.$error,
131
- $position = _ref2.$position,
132
- $stepMarksWidth = _ref2.$stepMarksWidth;
133
-
134
- /* stylelint-disable indentation */
135
- return $stepMarksWidth !== undefined ? (0,external_styled_components_namespaceObject.css)(["background-image:linear-gradient( to right,", ",", " ", ",transparent ", ",transparent 100% ),repeating-linear-gradient( to right,", ",", " ", ",transparent ", ",transparent ", "% ),linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );"], sliderBarLeftSideColor({
136
- $error: $error
137
- }), sliderBarLeftSideColor({
138
- $error: $error
139
- }), notchWidth, notchWidth, sliderBarStepMarksColor, sliderBarStepMarksColor, notchWidth, notchWidth, $stepMarksWidth, sliderBarLeftSideColor({
140
- $error: $error
141
- }), sliderBarLeftSideColor({
142
- $error: $error
143
- }), $position, sliderBarRightSideColor, $position, sliderBarRightSideColor) : (0,external_styled_components_namespaceObject.css)(["background-image:linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );"], sliderBarLeftSideColor({
144
- $error: $error
145
- }), sliderBarLeftSideColor({
146
- $error: $error
147
- }), $position, sliderBarRightSideColor, $position, sliderBarRightSideColor);
148
- /* stylelint-enable indentation */
149
- };
150
-
151
- var StyledSliderBar = external_styled_components_default().div.withConfig({
152
- displayName: "SliderStyles__StyledSliderBar",
153
- componentId: "sc-16ooit4-2"
154
- })(["position:absolute;top:", ";left:0;height:", ";width:100%;border-radius:2.5px;", ""], (0,themes_namespaceObject.pick)({
155
- enterprise: '12px',
156
- prisma: '18px'
157
- }), (0,themes_namespaceObject.pick)({
158
- enterprise: '5px',
159
- prisma: '4px'
160
- }), function (_ref3) {
161
- var $disabled = _ref3.$disabled,
162
- $error = _ref3.$error,
163
- $position = _ref3.$position,
164
- $stepMarksWidth = _ref3.$stepMarksWidth;
165
- return $disabled ? (0,external_styled_components_namespaceObject.css)(["background-color:", ";"], (0,themes_namespaceObject.pick)({
166
- enterprise: themes_namespaceObject.variables.gray92,
167
- prisma: themes_namespaceObject.variables.contentColorDisabled
168
- })) : stepMarksBackground({
169
- $error: $error,
170
- $position: $position,
171
- $stepMarksWidth: $stepMarksWidth
172
- });
173
- });
174
- var sliderThumbWidth = (0,themes_namespaceObject.pick)({
175
- enterprise: 18,
176
- prisma: 20
177
- });
178
- var StyledSliderThumb = external_styled_components_default().button.withConfig({
179
- displayName: "SliderStyles__StyledSliderThumb",
180
- componentId: "sc-16ooit4-3"
181
- })(["", ";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_namespaceObject.mixins.reset('inline'), sliderThumbWidth, sliderThumbWidth, (0,themes_namespaceObject.pick)({
182
- enterprise: '9px',
183
- prisma: '10px'
184
- }), (0,themes_namespaceObject.pick)({
185
- enterprise: themes_namespaceObject.variables.gray45,
186
- prisma: themes_namespaceObject.variables.contentColorActive
187
- }), (0,themes_namespaceObject.pick)({
188
- enterprise: '6px',
189
- prisma: '10px'
190
- }), function (_ref4) {
191
- var $position = _ref4.$position;
192
- return $position;
193
- }, (0,themes_namespaceObject.pick)({
194
- enterprise: (0,external_styled_components_namespaceObject.css)(["box-shadow:", ";"], themes_namespaceObject.variables.focusShadow)
195
- }), themes_namespaceObject.variables.focusShadow, (0,themes_namespaceObject.pick)({
196
- prisma: (0,external_styled_components_namespaceObject.css)(["background-color:", ";"], themes_namespaceObject.mixins.overlayColors(themes_namespaceObject.variables.contentColorActive, themes_namespaceObject.variables.interactiveColorOverlayActive)),
197
- enterprise: (0,external_styled_components_namespaceObject.css)(["border-color:", ";"], function (props) {
198
- return external_tinycolor2_default()(themes_namespaceObject.variables.focusColor(props)).setAlpha(0.8).toRgbString();
199
- })
200
- }), (0,themes_namespaceObject.pick)({
201
- enterprise: themes_namespaceObject.variables.gray92,
202
- prisma: themes_namespaceObject.variables.neutral400
203
- }), (0,themes_namespaceObject.pick)({
204
- prisma: function prisma(_ref5) {
205
- var $error = _ref5.$error;
206
- return $error && (0,external_styled_components_namespaceObject.css)(["background-color:", ";&:focus:not([disabled]),&:active{background-color:", ";}"], themes_namespaceObject.variables.accentColorNegative, themes_namespaceObject.mixins.overlayColors(themes_namespaceObject.variables.accentColorNegative, themes_namespaceObject.variables.interactiveColorOverlayActive));
207
- }
208
- }));
209
- var StyledPopoverContent = external_styled_components_default().div.withConfig({
210
- displayName: "SliderStyles__StyledPopoverContent",
211
- componentId: "sc-16ooit4-4"
212
- })(["padding:", ";font-size:", ";line-height:", ";"], (0,themes_namespaceObject.pick)({
213
- enterprise: themes_namespaceObject.variables.spacingHalf,
214
- prisma: '12px 16px'
215
- }), (0,themes_namespaceObject.pick)({
216
- enterprise: themes_namespaceObject.variables.fontSizeSmall,
217
- prisma: '14px'
218
- }), (0,themes_namespaceObject.pick)({
219
- enterprise: '18px',
220
- prisma: '24px'
221
- }));
222
- var label = (0,external_styled_components_namespaceObject.css)(["flex:0 0 auto;line-height:", ";", ""], themes_namespaceObject.variables.inputHeight, function (_ref6) {
223
- var $disabled = _ref6.$disabled;
224
- return $disabled && (0,external_styled_components_namespaceObject.css)(["color:", ";"], (0,themes_namespaceObject.pick)({
225
- enterprise: themes_namespaceObject.variables.textDisabledColor,
226
- prisma: themes_namespaceObject.variables.contentColorDisabled
227
- }));
228
- });
229
- var StyledMinLabelBox = external_styled_components_default()((Box_default())).withConfig({
230
- displayName: "SliderStyles__StyledMinLabelBox",
231
- componentId: "sc-16ooit4-5"
232
- })(["", ";margin-right:", ";text-align:right;"], label, (0,themes_namespaceObject.pick)({
233
- enterprise: '15px',
234
- prisma: '16px'
235
- }));
236
- var StyledMaxLabelBox = external_styled_components_default()((Box_default())).withConfig({
237
- displayName: "SliderStyles__StyledMaxLabelBox",
238
- componentId: "sc-16ooit4-6"
239
- })(["", ";margin-left:", ";text-align:left;"], label, (0,themes_namespaceObject.pick)({
240
- enterprise: '15px',
241
- prisma: '16px'
242
- }));
243
-
244
- ;// CONCATENATED MODULE: ./src/Slider/Slider.tsx
245
- 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); }
246
-
247
- 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); }
248
-
249
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
250
-
251
- 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); } }
252
-
253
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
254
-
255
- 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); }
256
-
257
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
258
-
259
- 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); }; }
260
-
261
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
262
-
263
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
264
-
265
- 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; } }
266
-
267
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
268
-
269
- 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; }
270
-
271
-
272
-
273
-
274
-
275
-
276
-
277
-
278
-
279
-
280
-
281
-
282
- var propTypes = {
283
- defaultValue: (external_prop_types_default()).number,
284
- describedBy: (external_prop_types_default()).string,
285
- disabled: (external_prop_types_default()).bool,
286
- displayValue: (external_prop_types_default()).string,
287
- elementRef: external_prop_types_default().oneOfType([(external_prop_types_default()).func, (external_prop_types_default()).object]),
288
- error: (external_prop_types_default()).bool,
289
- inline: (external_prop_types_default()).bool,
290
- labelledBy: (external_prop_types_default()).string,
291
- max: (external_prop_types_default()).number,
292
- maxLabel: (external_prop_types_default()).node,
293
- min: (external_prop_types_default()).number,
294
- minLabel: (external_prop_types_default()).node,
295
- name: (external_prop_types_default()).string,
296
- onChange: (external_prop_types_default()).func,
297
-
298
- /** @private. */
299
- required: (external_prop_types_default()).bool,
300
- step: (external_prop_types_default()).number,
301
- stepMarks: external_prop_types_default().oneOf(['focus', 'always', 'never']),
302
-
303
- /** @private */
304
- splunkTheme: (external_prop_types_default()).object,
305
- value: (external_prop_types_default()).number
306
- };
307
- var defaultProps = {
308
- disabled: false,
309
- error: false,
310
- inline: false,
311
- min: 1,
312
- max: 5,
313
- step: 1,
314
- stepMarks: 'focus'
315
- };
316
-
317
- var Slider = /*#__PURE__*/function (_Component) {
318
- _inherits(Slider, _Component);
319
-
320
- var _super = _createSuper(Slider);
321
-
322
- // @docs-props-type SliderPropsBase
323
- function Slider(props) {
324
- var _this;
325
-
326
- _classCallCheck(this, Slider);
327
-
328
- _this = _super.call(this, props);
329
-
330
- _defineProperty(_assertThisInitialized(_this), "controlledExternally", void 0);
331
-
332
- _defineProperty(_assertThisInitialized(_this), "sliderThumb", null);
333
-
334
- _defineProperty(_assertThisInitialized(_this), "checkPositionBounds", function (pos) {
335
- if (pos > 100) {
336
- return 100;
337
- }
338
-
339
- if (pos < 0) {
340
- return 0;
341
- }
342
-
343
- 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
344
65
  });
345
-
346
- _defineProperty(_assertThisInitialized(_this), "checkValueBounds", function (val) {
347
- if (val > _this.props.max) {
348
- return _this.props.max;
349
- }
350
-
351
- if (val < _this.props.min) {
352
- return _this.props.min;
353
- }
354
-
355
- 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 a = e.n(i);
72
+ // CONCATENATED MODULE: external "decimal.js-light"
73
+ const o = require("decimal.js-light");
74
+ var s = e.n(o);
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 V = 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 E = "1px";
113
+ var O = 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 B = (0, h.pick)({
121
+ enterprise: {
122
+ dark: h.variables.gray20,
123
+ light: h.variables.gray96
124
+ },
125
+ prisma: h.variables.neutral100
356
126
  });
357
-
358
- _defineProperty(_assertThisInitialized(_this), "handleBlur", function () {
359
- _this.setState({
360
- isFocused: false,
361
- showTooltip: false
362
- });
127
+ var $ = (0, h.pick)({
128
+ enterprise: h.variables.gray80,
129
+ prisma: h.variables.interactiveColorBorder
363
130
  });
364
-
365
- _defineProperty(_assertThisInitialized(_this), "handleClick", function (e) {
366
- var pos = _this.percentageFromEvent(e);
367
-
368
- if (pos !== undefined) {
369
- var value = _this.roundValueToStep(_this.positionToValue(pos));
370
-
371
- _this.setValue(e, {
372
- value: value
131
+ var _ = 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,", ",", " ", "%,", " ", "%,", " );" ], O({
134
+ $error: r
135
+ }), O({
136
+ $error: r
137
+ }), E, E, B, B, E, E, i, O({
138
+ $error: r
139
+ }), O({
140
+ $error: r
141
+ }), n, $, n, $) : (0, k.css)([ "background-image:linear-gradient( to right,", ",", " ", "%,", " ", "%,", " );" ], O({
142
+ $error: r
143
+ }), O({
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
+ })) : _({
163
+ $error: r,
164
+ $position: n,
165
+ $stepMarksWidth: i
373
166
  });
374
- }
167
+ }));
168
+ var j = (0, h.pick)({
169
+ enterprise: 18,
170
+ prisma: 20
375
171
  });
376
-
377
- _defineProperty(_assertThisInitialized(_this), "handleFocus", function () {
378
- _this.setState({
379
- isFocused: true,
380
- showTooltip: true
381
- });
382
- });
383
-
384
- _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (e) {
385
- var val = _this.getValue();
386
-
387
- if (val !== undefined) {
388
- var step = _this.props.step;
389
-
390
- if ((0,keyboard_namespaceObject.keycode)(e.nativeEvent) === 'right') {
391
- val = _this.checkValueBounds(val + step);
392
- } else if ((0,keyboard_namespaceObject.keycode)(e.nativeEvent) === 'left') {
393
- val = _this.checkValueBounds(val - step);
394
- } else if ((0,keyboard_namespaceObject.keycode)(e.nativeEvent) === 'up') {
395
- e.preventDefault();
396
- val = _this.checkValueBounds(val + step);
397
- } else if ((0,keyboard_namespaceObject.keycode)(e.nativeEvent) === 'down') {
398
- e.preventDefault();
399
- 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
+ };
400
245
  } else {
401
- return;
246
+ I = function e(t) {
247
+ return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
248
+ };
402
249
  }
403
-
404
- val = _this.roundValueToStep(val);
405
-
406
- _this.setValue(e, {
407
- value: val
408
- });
409
- }
410
- });
411
-
412
- _defineProperty(_assertThisInitialized(_this), "handleMount", function (el) {
413
- _this.setState({
414
- sliderBar: el
415
- });
416
- });
417
-
418
- _defineProperty(_assertThisInitialized(_this), "handleMouseDown", function (e) {
419
- e.preventDefault();
420
-
421
- _this.focus();
422
-
423
- _this.setState({
424
- selected: true,
425
- showTooltip: true
426
- });
427
- });
428
-
429
- _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function () {
430
- _this.setState({
431
- showTooltip: true
432
- });
433
- });
434
-
435
- _defineProperty(_assertThisInitialized(_this), "handleMouseLeave", function () {
436
- if (!_this.state.selected) {
437
- _this.setState({
438
- showTooltip: false
439
- });
440
- }
441
- });
442
-
443
- _defineProperty(_assertThisInitialized(_this), "handleMouseMove", function (e) {
444
- if (_this.state.selected) {
445
- var pos = _this.percentageFromEvent(e);
446
-
447
- if (pos !== undefined) {
448
- var value = _this.roundValueToStep(_this.positionToValue(pos));
449
-
450
- _this.setValue(e, {
451
- value: value
452
- });
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");
453
269
  }
454
- }
455
- });
456
-
457
- _defineProperty(_assertThisInitialized(_this), "handleMouseUp", function () {
458
- _this.setState({
459
- selected: false,
460
- showTooltip: false
461
- });
462
- });
463
-
464
- _defineProperty(_assertThisInitialized(_this), "percentageFromEvent", function (e) {
465
- if (_this.state.sliderBar === null) {
466
- return undefined;
467
- }
468
-
469
- var boundingRect = _this.state.sliderBar.getBoundingClientRect();
470
-
471
- var offset = e.clientX - boundingRect.left;
472
- return _this.checkPositionBounds(offset / boundingRect.width * 100);
473
- });
474
-
475
- _defineProperty(_assertThisInitialized(_this), "positionToValue", function (pos) {
476
- var valRange = _this.props.max - _this.props.min;
477
- return pos / 100 * valRange + _this.props.min;
478
- });
479
-
480
- _defineProperty(_assertThisInitialized(_this), "roundValueToStep", function (val) {
481
- var step = _this.props.step;
482
- return new (external_decimal_js_light_default())(val).div(step).todp(0).mul(step).toNumber();
483
- });
484
-
485
- _defineProperty(_assertThisInitialized(_this), "valueToPosition", function (val) {
486
- if (val === undefined) {
487
- return undefined;
488
- }
489
-
490
- var valRange = _this.props.max - _this.props.min;
491
- return (val - _this.props.min) / valRange * 100;
492
- });
493
-
494
- _this.controlledExternally = has_default()(props, 'value');
495
- var defValue = has_default()(props, 'defaultValue') ? props.defaultValue : _this.roundValueToStep((props.max - props.min) / 2);
496
- _this.state = {
497
- isFocused: false,
498
- selected: false,
499
- showTooltip: false,
500
- sliderBar: null,
501
- value: _this.isControlled() ? undefined : defValue
502
- };
503
-
504
- if (false) {}
505
-
506
- if (props.min >= props.max && process.env.NODE_ENV !== "production") {}
507
-
508
- return _this;
509
- }
510
-
511
- _createClass(Slider, [{
512
- key: "componentDidUpdate",
513
- value: function componentDidUpdate(prevProps) {
514
- if (false) {}
515
-
516
- if (false) {}
517
270
  }
518
- }, {
519
- key: "getValue",
520
- value: function getValue() {
521
- return this.isControlled() ? this.props.value : this.state.value;
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
+ }
522
279
  }
523
- }, {
524
- key: "setValue",
525
- value: function setValue(e, _ref) {
526
- var value = _ref.value;
527
- var currentValue = this.getValue();
528
- var name = this.props.name;
529
-
530
- if (currentValue !== value) {
531
- var _this$props$onChange, _this$props;
532
-
533
- (_this$props$onChange = (_this$props = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, e, {
534
- value: value,
535
- name: name
536
- });
537
-
538
- if (!this.isControlled()) {
539
- this.setState({
540
- value: value
541
- });
280
+ function z(e, t, r) {
281
+ if (t) A(e.prototype, t);
282
+ if (r) A(e, r);
283
+ return e;
284
+ }
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");
542
288
  }
543
- }
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);
544
297
  }
545
- }, {
546
- key: "focus",
547
-
548
- /**
549
- * Places focus on the slider.
550
- */
551
- value: function focus() {
552
- var _this$sliderThumb;
553
-
554
- (_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);
555
304
  }
556
- }, {
557
- key: "stepWidthInPercentage",
558
- value: function stepWidthInPercentage() {
559
- 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 a = Q(this).constructor;
311
+ i = Reflect.construct(n, arguments, a);
312
+ } else {
313
+ i = n.apply(this, arguments);
314
+ }
315
+ return X(this, i);
316
+ };
560
317
  }
561
- }, {
562
- key: "stepMarksWidth",
563
- value: function stepMarksWidth() {
564
- // don't render stepMarks if they are too small i.e. stepWidth is less than SliderThumb divided by 2
565
- // in that case, undefined is returned
566
- var _this$props2 = this.props,
567
- max = _this$props2.max,
568
- min = _this$props2.min,
569
- step = _this$props2.step,
570
- splunkTheme = _this$props2.splunkTheme;
571
- var sliderBar = this.state.sliderBar;
572
-
573
- if (sliderBar === null) {
574
- return undefined;
575
- }
576
-
577
- var totalSteps = Math.round((max - min) / step);
578
- var wholeSlider = sliderBar.getBoundingClientRect();
579
- var thumbWidth = sliderThumbWidth(splunkTheme);
580
- 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);
581
323
  }
582
- }, {
583
- key: "isControlled",
584
- value: function isControlled() {
585
- 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;
586
329
  }
587
- }, {
588
- key: "render",
589
- value: function render() {
590
- var _this2 = this;
591
-
592
- var _this$props3 = this.props,
593
- describedBy = _this$props3.describedBy,
594
- disabled = _this$props3.disabled,
595
- displayValue = _this$props3.displayValue,
596
- elementRef = _this$props3.elementRef,
597
- error = _this$props3.error,
598
- inline = _this$props3.inline,
599
- labelledBy = _this$props3.labelledBy,
600
- max = _this$props3.max,
601
- maxLabel = _this$props3.maxLabel,
602
- min = _this$props3.min,
603
- minLabel = _this$props3.minLabel,
604
- required = _this$props3.required,
605
- stepMarks = _this$props3.stepMarks;
606
- var _this$state = this.state,
607
- isFocused = _this$state.isFocused,
608
- selected = _this$state.selected,
609
- sliderBar = _this$state.sliderBar;
610
- var currentValue = this.getValue();
611
- var position = this.valueToPosition(currentValue);
612
- var showStepMarks = stepMarks === 'focus' && isFocused || stepMarks === 'always';
613
- var stepMarksWidth = showStepMarks && sliderBar ? this.stepMarksWidth() : undefined;
614
- var boxProps = omit_default()(this.props, keys_default()(Slider.propTypes));
615
- /* eslint-disable jsx-a11y/no-static-element-interactions */
616
-
617
- return /*#__PURE__*/external_react_default().createElement(StyledBox, _extends({
618
- "data-test": "slider",
619
- "data-test-value": currentValue,
620
- elementRef: elementRef,
621
- flex: true,
622
- inline: inline
623
- }, boxProps), selected && /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement((EventListener_default()), {
624
- target: window,
625
- eventType: "mouseup",
626
- listener: this.handleMouseUp
627
- }), /*#__PURE__*/external_react_default().createElement((EventListener_default()), {
628
- target: window,
629
- eventType: "mousemove",
630
- listener: this.handleMouseMove
631
- })), minLabel !== null && /*#__PURE__*/external_react_default().createElement(StyledMinLabelBox, {
632
- "data-test": "min-label",
633
- $disabled: disabled
634
- }, minLabel || min), /*#__PURE__*/external_react_default().createElement(StyledInput, {
635
- onClick: disabled ? undefined : this.handleClick
636
- }, /*#__PURE__*/external_react_default().createElement(StyledSliderBar, {
637
- "aria-required": required,
638
- "data-test": "bar",
639
- $disabled: disabled,
640
- ref: this.handleMount,
641
- $error: error,
642
- $position: position,
643
- $stepMarksWidth: stepMarksWidth
644
- }), /*#__PURE__*/external_react_default().createElement(StyledSliderThumb, {
645
- "aria-describedby": describedBy,
646
- "aria-labelledby": labelledBy,
647
- "aria-invalid": error,
648
- "aria-valuemax": max,
649
- "aria-valuemin": min,
650
- "aria-valuenow": currentValue,
651
- "data-test": "handle",
652
- onBlur: this.handleBlur,
653
- onMouseEnter: this.handleMouseEnter,
654
- onMouseLeave: this.handleMouseLeave,
655
- onKeyDown: disabled ? undefined : this.handleKeyDown,
656
- onMouseDown: disabled ? undefined : this.handleMouseDown,
657
- onFocus: this.handleFocus,
658
- ref: function ref(el) {
659
- _this2.sliderThumb = el;
660
- },
661
- role: "slider",
662
- disabled: disabled,
663
- $error: error,
664
- $position: position
665
- }), /*#__PURE__*/external_react_default().createElement((Popover_default()), {
666
- open: this.state.showTooltip,
667
- anchor: this.sliderThumb,
668
- appearance: "inverted",
669
- align: "center"
670
- }, /*#__PURE__*/external_react_default().createElement(StyledPopoverContent, null, displayValue || currentValue))), maxLabel !== null && /*#__PURE__*/external_react_default().createElement(StyledMaxLabelBox, {
671
- "data-test": "max-label",
672
- $disabled: disabled
673
- }, maxLabel || max));
674
- /* 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
+ }
340
+ }
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;
675
359
  }
676
- }]);
677
-
678
- return Slider;
679
- }(external_react_namespaceObject.Component);
680
-
681
- _defineProperty(Slider, "propTypes", propTypes);
682
-
683
- _defineProperty(Slider, "defaultProps", defaultProps);
684
-
685
- var SliderWithTheme = (0,themes_namespaceObject.withSplunkTheme)(Slider);
686
- SliderWithTheme.propTypes = Slider.propTypes;
687
- /* harmony default export */ const Slider_Slider = (SliderWithTheme);
688
- ;// CONCATENATED MODULE: ./src/Slider/index.ts
689
-
690
-
691
- module.exports = __webpack_exports__;
692
- /******/ })()
693
- ;
360
+ var Z = {
361
+ defaultValue: a().number,
362
+ describedBy: a().string,
363
+ disabled: a().bool,
364
+ displayValue: a().string,
365
+ elementRef: a().oneOfType([ a().func, a().object ]),
366
+ error: a().bool,
367
+ inline: a().bool,
368
+ labelledBy: a().string,
369
+ max: a().number,
370
+ maxLabel: a().node,
371
+ min: a().number,
372
+ minLabel: a().node,
373
+ name: a().string,
374
+ onChange: a().func,
375
+ /** @private. */
376
+ required: a().bool,
377
+ step: a().number,
378
+ stepMarks: a().oneOf([ "focus", "always", "never" ]),
379
+ /** @private */
380
+ splunkTheme: a().object,
381
+ value: a().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), "getValueOffset", (function(e, t) {
442
+ var r = n.props, i = r.min, a = r.step;
443
+ var o = new (s())(e).minus(i).modulo(a).toNumber();
444
+ if (o > 0) {
445
+ return t === "forward" ? a - o : o;
446
+ }
447
+ return a;
448
+ }));
449
+ Y(G(n), "handleKeyDown", (function(e) {
450
+ var t = n.getValue();
451
+ if (t !== undefined) {
452
+ if ((0, v.keycode)(e.nativeEvent) === "right") {
453
+ t = n.checkValueBounds(t + n.getValueOffset(t, "forward"));
454
+ } else if ((0, v.keycode)(e.nativeEvent) === "left") {
455
+ t = n.checkValueBounds(t - n.getValueOffset(t, "backward"));
456
+ } else if ((0, v.keycode)(e.nativeEvent) === "up") {
457
+ e.preventDefault();
458
+ t = n.checkValueBounds(t + n.getValueOffset(t, "forward"));
459
+ } else if ((0, v.keycode)(e.nativeEvent) === "down") {
460
+ e.preventDefault();
461
+ t = n.checkValueBounds(t - n.getValueOffset(t, "backward"));
462
+ } else {
463
+ return;
464
+ }
465
+ t = n.roundValueToStep(t);
466
+ n.setValue(e, {
467
+ value: t
468
+ });
469
+ }
470
+ }));
471
+ Y(G(n), "handleMount", (function(e) {
472
+ n.setState({
473
+ sliderBar: e
474
+ });
475
+ }));
476
+ Y(G(n), "handleMouseDown", (function(e) {
477
+ e.preventDefault();
478
+ n.focus();
479
+ n.setState({
480
+ selected: true,
481
+ showTooltip: true
482
+ });
483
+ }));
484
+ Y(G(n), "handleMouseEnter", (function() {
485
+ n.setState({
486
+ showTooltip: true
487
+ });
488
+ }));
489
+ Y(G(n), "handleMouseLeave", (function() {
490
+ if (!n.state.selected) {
491
+ n.setState({
492
+ showTooltip: false
493
+ });
494
+ }
495
+ }));
496
+ Y(G(n), "handleMouseMove", (function(e) {
497
+ if (n.state.selected) {
498
+ var t = n.percentageFromEvent(e);
499
+ if (t !== undefined) {
500
+ var r = n.roundValueToStep(n.positionToValue(t));
501
+ n.setValue(e, {
502
+ value: r
503
+ });
504
+ }
505
+ }
506
+ }));
507
+ Y(G(n), "handleMouseUp", (function() {
508
+ n.setState({
509
+ selected: false,
510
+ showTooltip: false
511
+ });
512
+ }));
513
+ Y(G(n), "percentageFromEvent", (function(e) {
514
+ if (n.state.sliderBar === null) {
515
+ return undefined;
516
+ }
517
+ var t = n.state.sliderBar.getBoundingClientRect();
518
+ var r = e.clientX - t.left;
519
+ return n.checkPositionBounds(r / t.width * 100);
520
+ }));
521
+ Y(G(n), "positionToValue", (function(e) {
522
+ var t = n.props.max - n.props.min;
523
+ return e / 100 * t + n.props.min;
524
+ }));
525
+ Y(G(n), "roundValueToStep", (function(e) {
526
+ var t = n.props, r = t.step, i = t.min, a = t.max;
527
+ // Handles if the max is in between steps but val is larger than the halfway point between last step mark and max
528
+ if (e > a - (a - i) % r / 2) {
529
+ return a;
530
+ }
531
+ return new (s())(e).minus(i).div(r).todp(0).mul(r).add(i).toNumber();
532
+ }));
533
+ Y(G(n), "valueToPosition", (function(e) {
534
+ if (e === undefined) {
535
+ return undefined;
536
+ }
537
+ var t = n.props.max - n.props.min;
538
+ return (e - n.props.min) / t * 100;
539
+ }));
540
+ n.controlledExternally = u()(e, "value");
541
+ var i = u()(e, "defaultValue") ? e.defaultValue : n.roundValueToStep((e.max - e.min) / 2);
542
+ n.state = {
543
+ isFocused: false,
544
+ selected: false,
545
+ showTooltip: false,
546
+ sliderBar: null,
547
+ value: n.isControlled() ? undefined : i
548
+ };
549
+ if (false) {}
550
+ if (e.min >= e.max && process.env.NODE_ENV !== "production") {}
551
+ return n;
552
+ }
553
+ z(r, [ {
554
+ key: "componentDidUpdate",
555
+ value: function e(t) {
556
+ if (false) {}
557
+ if (false) {}
558
+ }
559
+ }, {
560
+ key: "getValue",
561
+ value: function e() {
562
+ return this.isControlled() ? this.props.value : this.state.value;
563
+ }
564
+ }, {
565
+ key: "setValue",
566
+ value: function e(t, r) {
567
+ var n = r.value;
568
+ var i = this.getValue();
569
+ var a = this.props.name;
570
+ if (i !== n) {
571
+ var o, s;
572
+ (o = (s = this.props).onChange) === null || o === void 0 ? void 0 : o.call(s, t, {
573
+ value: n,
574
+ name: a
575
+ });
576
+ if (!this.isControlled()) {
577
+ this.setState({
578
+ value: n
579
+ });
580
+ }
581
+ }
582
+ }
583
+ }, {
584
+ key: "focus",
585
+ /**
586
+ * Places focus on the slider.
587
+ */
588
+ value: function e() {
589
+ var t;
590
+ (t = this.sliderThumb) === null || t === void 0 ? void 0 : t.focus();
591
+ }
592
+ }, {
593
+ key: "stepWidthInPercentage",
594
+ value: function e() {
595
+ return this.props.step * 100 / (this.props.max - this.props.min);
596
+ }
597
+ }, {
598
+ key: "stepMarksWidth",
599
+ value: function e() {
600
+ // don't render stepMarks if they are too small i.e. stepWidth is less than SliderThumb divided by 2
601
+ // in that case, undefined is returned
602
+ var t = this.props, r = t.max, n = t.min, i = t.step, a = t.splunkTheme;
603
+ var o = this.state.sliderBar;
604
+ if (o === null) {
605
+ return undefined;
606
+ }
607
+ var s = Math.round((r - n) / i);
608
+ var l = o.getBoundingClientRect();
609
+ var u = j(a);
610
+ return l.width / s > u / 2 ? this.stepWidthInPercentage() : undefined;
611
+ }
612
+ }, {
613
+ key: "isControlled",
614
+ value: function e() {
615
+ return this.controlledExternally;
616
+ }
617
+ }, {
618
+ key: "render",
619
+ value: function e() {
620
+ var t = this;
621
+ var i = this.props, a = i.describedBy, o = 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;
622
+ var w = this.state, S = w.isFocused, T = w.selected, C = w.sliderBar;
623
+ var E = this.getValue();
624
+ var O = this.valueToPosition(E);
625
+ var B = x === "focus" && S || x === "always";
626
+ var $ = B && C ? this.stepMarksWidth() : undefined;
627
+ var _ = f()(this.props, p()(r.propTypes));
628
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
629
+ return n().createElement(M, L({
630
+ "data-test": "slider",
631
+ "data-test-value": E,
632
+ elementRef: l,
633
+ flex: true,
634
+ inline: c
635
+ }, _), T && n().createElement(n().Fragment, null, n().createElement(b(), {
636
+ target: window,
637
+ eventType: "mouseup",
638
+ listener: this.handleMouseUp
639
+ }), n().createElement(b(), {
640
+ target: window,
641
+ eventType: "mousemove",
642
+ listener: this.handleMouseMove
643
+ })), y !== null && n().createElement(R, {
644
+ "data-test": "min-label",
645
+ $disabled: o
646
+ }, y || m), n().createElement(V, {
647
+ onClick: o ? undefined : this.handleClick
648
+ }, n().createElement(P, {
649
+ "aria-required": k,
650
+ "data-test": "bar",
651
+ $disabled: o,
652
+ ref: this.handleMount,
653
+ $error: u,
654
+ $position: O,
655
+ $stepMarksWidth: $
656
+ }), n().createElement(q, {
657
+ "aria-describedby": a,
658
+ "aria-labelledby": d,
659
+ "aria-invalid": u,
660
+ "aria-valuemax": v,
661
+ "aria-valuemin": m,
662
+ "aria-valuenow": E,
663
+ "data-test": "handle",
664
+ onBlur: this.handleBlur,
665
+ onMouseEnter: this.handleMouseEnter,
666
+ onMouseLeave: this.handleMouseLeave,
667
+ onKeyDown: o ? undefined : this.handleKeyDown,
668
+ onMouseDown: o ? undefined : this.handleMouseDown,
669
+ onFocus: this.handleFocus,
670
+ ref: function e(r) {
671
+ t.sliderThumb = r;
672
+ },
673
+ role: "slider",
674
+ disabled: o,
675
+ $error: u,
676
+ $position: O
677
+ }), n().createElement(g(), {
678
+ open: this.state.showTooltip,
679
+ anchor: this.sliderThumb,
680
+ appearance: "inverted",
681
+ align: "center"
682
+ }, n().createElement(D, null, s || E))), h !== null && n().createElement(F, {
683
+ "data-test": "max-label",
684
+ $disabled: o
685
+ }, h || v));
686
+ /* eslint-enable jsx-a11y/no-static-element-interactions */ }
687
+ } ]);
688
+ return r;
689
+ }(r.Component);
690
+ Y(te, "propTypes", Z);
691
+ Y(te, "defaultProps", ee);
692
+ var re = (0, h.withSplunkTheme)(te);
693
+ re.propTypes = te.propTypes;
694
+ /* harmony default export */ const ne = re;
695
+ // CONCATENATED MODULE: ./src/Slider/index.ts
696
+ module.exports = t;
697
+ /******/})();