@splunk/react-ui 4.4.0 → 4.5.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 (132) hide show
  1. package/Accordion.js +37 -21
  2. package/Anchor.js +2 -2
  3. package/AnimationToggle.js +2 -2
  4. package/Box.js +2 -2
  5. package/Button.js +36 -12
  6. package/ButtonGroup.js +27 -6
  7. package/ButtonSimple.js +6 -6
  8. package/CHANGELOG.md +54 -1
  9. package/Calendar.js +14 -14
  10. package/Card.js +49 -23
  11. package/CardLayout.js +31 -10
  12. package/Chip.js +77 -53
  13. package/Clickable.js +2 -2
  14. package/CloseButton.js +6 -6
  15. package/Code.js +4 -4
  16. package/CollapsiblePanel.js +6 -6
  17. package/Color.js +103 -56
  18. package/ColumnLayout.js +4 -4
  19. package/ComboBox.js +22 -17
  20. package/Concertina.js +73 -68
  21. package/ControlGroup.js +72 -24
  22. package/Date.js +9 -9
  23. package/DefinitionList.js +6 -6
  24. package/Dropdown.js +12 -12
  25. package/EventListener.js +168 -0
  26. package/FetchOptions.js +8 -8
  27. package/File.js +93 -82
  28. package/FormRows.js +66 -58
  29. package/Image.js +14 -14
  30. package/JSONTree.js +5 -5
  31. package/Layer.js +32 -20
  32. package/Link.js +6 -6
  33. package/List.js +2 -2
  34. package/Markdown.js +250 -88
  35. package/Menu.js +70 -64
  36. package/Message.js +18 -18
  37. package/Modal.js +68 -14
  38. package/ModalLayer.js +4 -4
  39. package/Monogram.js +12 -11
  40. package/Multiselect.js +122 -78
  41. package/Number.js +19 -16
  42. package/Paginator.js +10 -10
  43. package/Paragraph.js +2 -2
  44. package/Popover.js +52 -38
  45. package/Progress.js +6 -6
  46. package/RadioBar.js +56 -69
  47. package/RadioList.js +2 -2
  48. package/Resize.js +19 -15
  49. package/ResultsMenu.js +8 -8
  50. package/ScreenReaderContent.js +2 -2
  51. package/Scroll.js +16 -14
  52. package/ScrollContainerContext.js +5 -5
  53. package/Search.d.ts +2 -0
  54. package/Search.js +797 -0
  55. package/Select.js +83 -43
  56. package/SidePanel.js +6 -6
  57. package/Slider.js +29 -25
  58. package/SlidingPanels.js +4 -4
  59. package/StaticContent.js +2 -2
  60. package/StepBar.js +56 -52
  61. package/Switch.js +8 -8
  62. package/TabBar.js +126 -85
  63. package/TabLayout.js +4 -5
  64. package/Table.js +188 -138
  65. package/Text.js +69 -63
  66. package/Tooltip.js +11 -11
  67. package/TransitionOpen.js +9 -9
  68. package/WaitSpinner.js +3 -4
  69. package/package.json +4 -5
  70. package/types/src/Accordion/AccordionContext.d.ts +10 -0
  71. package/types/src/Accordion/Panel.d.ts +0 -9
  72. package/types/src/Button/Button.d.ts +4 -2
  73. package/types/src/ButtonGroup/ButtonGroupContext.d.ts +7 -0
  74. package/types/src/ButtonSimple/ButtonSimple.d.ts +5 -5
  75. package/types/src/Card/Card.d.ts +2 -0
  76. package/types/src/CardLayout/CardLayoutContext.d.ts +8 -0
  77. package/types/src/Color/Color.d.ts +2 -2
  78. package/types/src/ComboBox/ComboBox.d.ts +4 -3
  79. package/types/src/Concertina/ConcertinaContext.d.ts +8 -0
  80. package/types/src/Concertina/Panel.d.ts +2 -4
  81. package/types/src/ControlGroup/ControlGroup.d.ts +6 -1
  82. package/types/src/Date/Date.d.ts +3 -3
  83. package/types/src/EventListener/EventListener.d.ts +18 -0
  84. package/types/src/EventListener/index.d.ts +2 -0
  85. package/types/src/File/File.d.ts +6 -4
  86. package/types/src/File/FileContext.d.ts +3 -0
  87. package/types/src/File/Item.d.ts +5 -8
  88. package/types/src/FormRows/FormRows.d.ts +2 -2
  89. package/types/src/FormRows/FormRowsContext.d.ts +10 -0
  90. package/types/src/FormRows/Row.d.ts +5 -16
  91. package/types/src/Markdown/Markdown.d.ts +2 -0
  92. package/types/src/Markdown/renderers/MarkdownBlockquote.d.ts +14 -0
  93. package/types/src/Markdown/renderers/MarkdownCode.d.ts +15 -0
  94. package/types/src/Markdown/renderers/MarkdownCodeBlock.d.ts +16 -0
  95. package/types/src/Markdown/renderers/MarkdownHeading.d.ts +15 -0
  96. package/types/src/Markdown/renderers/MarkdownImage.d.ts +18 -0
  97. package/types/src/Markdown/renderers/MarkdownItem.d.ts +14 -0
  98. package/types/src/Markdown/renderers/MarkdownLink.d.ts +18 -0
  99. package/types/src/Markdown/renderers/MarkdownList.d.ts +26 -0
  100. package/types/src/Markdown/renderers/MarkdownParagraph.d.ts +14 -0
  101. package/types/src/Markdown/renderers/index.d.ts +10 -0
  102. package/types/src/Modal/Modal.d.ts +15 -3
  103. package/types/src/Monogram/Monogram.d.ts +5 -1
  104. package/types/src/Multiselect/Compact.d.ts +12 -4
  105. package/types/src/Multiselect/Multiselect.d.ts +14 -4
  106. package/types/src/Multiselect/Normal.d.ts +7 -2
  107. package/types/src/Number/Number.d.ts +11 -7
  108. package/types/src/Popover/Popover.d.ts +2 -2
  109. package/types/src/RadioBar/Option.d.ts +4 -14
  110. package/types/src/RadioBar/RadioBar.d.ts +2 -2
  111. package/types/src/RadioBar/RadioBarContext.d.ts +9 -0
  112. package/types/src/Scroll/Inner.d.ts +1 -1
  113. package/types/src/ScrollContainerContext/ScrollContainerContext.d.ts +4 -4
  114. package/types/src/Search/Option.d.ts +60 -0
  115. package/types/src/Search/Search.d.ts +97 -0
  116. package/types/src/Search/index.d.ts +2 -0
  117. package/types/src/Select/Select.d.ts +6 -2
  118. package/types/src/Select/SelectBase.d.ts +12 -5
  119. package/types/src/Slider/Slider.d.ts +2 -2
  120. package/types/src/StepBar/Step.d.ts +1 -13
  121. package/types/src/StepBar/StepBarContext.d.ts +8 -0
  122. package/types/src/TabBar/Tab.d.ts +5 -13
  123. package/types/src/TabBar/TabBarContext.d.ts +14 -0
  124. package/types/src/Table/Body.d.ts +1 -1
  125. package/types/src/Table/Head.d.ts +1 -1
  126. package/types/src/Table/Row.d.ts +10 -3
  127. package/types/src/Table/Table.d.ts +3 -2
  128. package/types/src/Text/Text.d.ts +11 -7
  129. package/types/src/icons/Sort.d.ts +3 -0
  130. package/types/src/usePrevious/index.d.ts +2 -0
  131. package/types/src/usePrevious/usePrevious.d.ts +12 -0
  132. package/usePrevious.js +137 -0
package/Concertina.js CHANGED
@@ -82,7 +82,7 @@ module.exports =
82
82
  /******/
83
83
  /******/
84
84
  /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 116);
85
+ /******/ return __webpack_require__(__webpack_require__.s = 118);
86
86
  /******/ })
87
87
  /************************************************************************/
88
88
  /******/ ({
@@ -102,13 +102,33 @@ module.exports = require("prop-types");
102
102
  /***/ }),
103
103
 
104
104
  /***/ 11:
105
- /***/ (function(module, exports) {
105
+ /***/ (function(module, __webpack_exports__, __webpack_require__) {
106
+
107
+ "use strict";
108
+ /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return updateReactRef; });
109
+ /**
110
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
111
+ *
112
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
113
+ * @param current - The new value of the ref.
114
+ */
115
+ function updateReactRef(ref, current) {
116
+ if (ref) {
117
+ if (typeof ref === 'function') {
118
+ ref(current);
119
+ } else {
120
+ // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
121
+ // the intention here is to signal "we will take care of setting 'current', not you".
122
+ ref.current = current; // eslint-disable-line no-param-reassign
123
+ }
124
+ }
125
+ }
126
+
106
127
 
107
- module.exports = require("@splunk/react-ui/Clickable");
108
128
 
109
129
  /***/ }),
110
130
 
111
- /***/ 116:
131
+ /***/ 118:
112
132
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
113
133
 
114
134
  "use strict";
@@ -130,16 +150,16 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
130
150
  // EXTERNAL MODULE: external "lodash"
131
151
  var external_lodash_ = __webpack_require__(4);
132
152
 
133
- // EXTERNAL MODULE: external "react-event-listener"
134
- var external_react_event_listener_ = __webpack_require__(15);
135
- var external_react_event_listener_default = /*#__PURE__*/__webpack_require__.n(external_react_event_listener_);
153
+ // EXTERNAL MODULE: external "@splunk/react-ui/EventListener"
154
+ var EventListener_ = __webpack_require__(14);
155
+ var EventListener_default = /*#__PURE__*/__webpack_require__.n(EventListener_);
136
156
 
137
157
  // EXTERNAL MODULE: external "styled-components"
138
158
  var external_styled_components_ = __webpack_require__(3);
139
159
  var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
140
160
 
141
161
  // EXTERNAL MODULE: external "@splunk/react-ui/Clickable"
142
- var Clickable_ = __webpack_require__(11);
162
+ var Clickable_ = __webpack_require__(12);
143
163
  var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
144
164
 
145
165
  // EXTERNAL MODULE: external "@splunk/themes"
@@ -311,7 +331,7 @@ var Box_ = __webpack_require__(8);
311
331
  var Box_default = /*#__PURE__*/__webpack_require__.n(Box_);
312
332
 
313
333
  // EXTERNAL MODULE: external "@splunk/react-ui/Scroll"
314
- var Scroll_ = __webpack_require__(58);
334
+ var Scroll_ = __webpack_require__(61);
315
335
  var Scroll_default = /*#__PURE__*/__webpack_require__.n(Scroll_);
316
336
 
317
337
  // CONCATENATED MODULE: ./src/Concertina/ConcertinaStyles.ts
@@ -351,8 +371,13 @@ var StyledPanelBody = external_styled_components_default.a.div.withConfig({
351
371
  }));
352
372
 
353
373
  // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
354
- var updateReactRef = __webpack_require__(12);
374
+ var updateReactRef = __webpack_require__(11);
375
+
376
+ // CONCATENATED MODULE: ./src/Concertina/ConcertinaContext.tsx
355
377
 
378
+ var ConcertinaContext = /*#__PURE__*/Object(external_react_["createContext"])({});
379
+ ConcertinaContext.displayName = 'Concertina';
380
+ /* harmony default export */ var Concertina_ConcertinaContext = (ConcertinaContext);
356
381
  // CONCATENATED MODULE: ./src/Concertina/Panel.tsx
357
382
  function Panel_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Panel_typeof = function _typeof(obj) { return typeof obj; }; } else { Panel_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Panel_typeof(obj); }
358
383
 
@@ -399,6 +424,7 @@ function Panel_defineProperty(obj, key, value) { if (key in obj) { Object.define
399
424
 
400
425
 
401
426
 
427
+
402
428
  var Panel_propTypes = {
403
429
  children: external_prop_types_default.a.node,
404
430
  description: external_prop_types_default.a.node,
@@ -406,12 +432,6 @@ var Panel_propTypes = {
406
432
 
407
433
  /** @private */
408
434
  index: external_prop_types_default.a.number,
409
-
410
- /** @private */
411
- onHeadingClick: external_prop_types_default.a.func,
412
-
413
- /** @private */
414
- onChange: external_prop_types_default.a.func,
415
435
  panelId: external_prop_types_default.a.string,
416
436
  status: external_prop_types_default.a.oneOf(['normal', 'warning', 'error', 'disabled']),
417
437
  title: external_prop_types_default.a.node.isRequired
@@ -436,7 +456,7 @@ var Panel_Panel = /*#__PURE__*/function (_Component) {
436
456
  Panel_defineProperty(Panel_assertThisInitialized(_this), "lastHeight", void 0);
437
457
 
438
458
  Panel_defineProperty(Panel_assertThisInitialized(_this), "measureHeight", function (e) {
439
- var _this$props$index, _this$props$onChange, _this$props;
459
+ var _this$props$index, _this$context$onChang, _this$context;
440
460
 
441
461
  if (!_this.state.containerEl || !_this.state.bodyEl) {
442
462
  return;
@@ -455,7 +475,7 @@ var Panel_Panel = /*#__PURE__*/function (_Component) {
455
475
  panelId: _this.props.panelId
456
476
  };
457
477
  _this.lastHeight = newHeight;
458
- (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, e, data);
478
+ (_this$context$onChang = (_this$context = _this.context).onChange) === null || _this$context$onChang === void 0 ? void 0 : _this$context$onChang.call(_this$context, e, data);
459
479
  });
460
480
 
461
481
  Panel_defineProperty(Panel_assertThisInitialized(_this), "handleResize", Object(external_lodash_["throttle"])(_this.measureHeight, 300));
@@ -510,30 +530,31 @@ var Panel_Panel = /*#__PURE__*/function (_Component) {
510
530
  }, {
511
531
  key: "render",
512
532
  value: function render() {
513
- var _this$props2 = this.props,
514
- children = _this$props2.children,
515
- description = _this$props2.description,
516
- index = _this$props2.index,
517
- onHeadingClick = _this$props2.onHeadingClick,
518
- panelId = _this$props2.panelId,
519
- status = _this$props2.status,
520
- style = _this$props2.style,
521
- title = _this$props2.title;
533
+ var _this$props = this.props,
534
+ children = _this$props.children,
535
+ description = _this$props.description,
536
+ index = _this$props.index,
537
+ panelId = _this$props.panelId,
538
+ status = _this$props.status,
539
+ style = _this$props.style,
540
+ title = _this$props.title;
541
+ var onHeadingClickContext = this.context.onHeadingClick;
522
542
  return /*#__PURE__*/external_react_default.a.createElement("div", Panel_extends({
523
543
  ref: this.handleMount,
524
544
  "data-test": "panel",
525
- "data-test-panel-id": panelId
545
+ "data-test-panel-id": panelId || "".concat(index)
526
546
  }, Object(external_lodash_["omit"])(this.props, [].concat(_toConsumableArray(Object(external_lodash_["keys"])(Panel.propTypes)), ['style']))), /*#__PURE__*/external_react_default.a.createElement(Concertina_Heading, {
527
- onClick: onHeadingClick,
547
+ onClick: onHeadingClickContext,
528
548
  ref: this.handleHeadingMount,
529
549
  description: description,
530
550
  index: index !== null && index !== void 0 ? index : 0,
531
- panelId: panelId,
551
+ panelId: panelId || "".concat(index),
532
552
  position: "inner",
533
553
  status: status
534
- }, title), /*#__PURE__*/external_react_default.a.createElement(external_react_event_listener_default.a, {
554
+ }, title), /*#__PURE__*/external_react_default.a.createElement(EventListener_default.a, {
535
555
  target: window,
536
- onResize: this.handleResize
556
+ eventType: "resize",
557
+ listener: this.handleResize
537
558
  }), /*#__PURE__*/external_react_default.a.createElement(StyledPanelBody, {
538
559
  $status: status,
539
560
  "data-test": "body",
@@ -550,6 +571,8 @@ Panel_defineProperty(Panel_Panel, "propTypes", Panel_propTypes);
550
571
 
551
572
  Panel_defineProperty(Panel_Panel, "defaultProps", Panel_defaultProps);
552
573
 
574
+ Panel_defineProperty(Panel_Panel, "contextType", Concertina_ConcertinaContext);
575
+
553
576
  /* harmony default export */ var Concertina_Panel = (Panel_Panel);
554
577
  // CONCATENATED MODULE: ./src/Concertina/Concertina.tsx
555
578
  function Concertina_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Concertina_typeof = function _typeof(obj) { return typeof obj; }; } else { Concertina_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Concertina_typeof(obj); }
@@ -589,6 +612,7 @@ function Concertina_defineProperty(obj, key, value) { if (key in obj) { Object.d
589
612
 
590
613
 
591
614
 
615
+
592
616
  var Concertina_propTypes = {
593
617
  children: external_prop_types_default.a.node,
594
618
  elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object])
@@ -777,27 +801,23 @@ var Concertina_Concertina = /*#__PURE__*/function (_Component) {
777
801
  }, {
778
802
  key: "render",
779
803
  value: function render() {
780
- var _this3 = this;
781
-
782
804
  var _this$props = this.props,
783
805
  children = _this$props.children,
784
806
  otherProps = _objectWithoutProperties(_this$props, ["children"]);
785
807
 
786
- var childrenCleaned = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).map(function (item, i) {
808
+ var childrenCleaned = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).map(function (item, index) {
787
809
  return /*#__PURE__*/Object(external_react_["cloneElement"])(item, {
788
- panelId: item.props.panelId || "".concat(i),
789
- index: i,
790
- onHeadingClick: _this3.handleClick,
791
- onChange: _this3.handleUpdate
810
+ index: index
792
811
  });
793
812
  });
794
813
  var topPanels = Object(external_lodash_["take"])(childrenCleaned, this.state.panelsTopCount);
795
814
  var bottomPanels = Object(external_lodash_["takeRight"])(childrenCleaned, this.state.panelsBottomCount);
796
815
  return /*#__PURE__*/external_react_default.a.createElement(StyledBox, Concertina_extends({
797
816
  "data-test": "concertina"
798
- }, otherProps), /*#__PURE__*/external_react_default.a.createElement(external_react_event_listener_default.a, {
799
- target: "window",
800
- onResize: this.handleResize
817
+ }, otherProps), /*#__PURE__*/external_react_default.a.createElement(EventListener_default.a, {
818
+ target: window,
819
+ eventType: "resize",
820
+ listener: this.handleResize
801
821
  }), this.state.panelsTopCount > 0 && /*#__PURE__*/external_react_default.a.createElement(StyledTop, {
802
822
  style: {
803
823
  width: this.state.innerWidth
@@ -811,7 +831,12 @@ var Concertina_Concertina = /*#__PURE__*/function (_Component) {
811
831
  "data-test": "scroll",
812
832
  top: this.state.targetTop,
813
833
  onScrollComplete: this.handleScrollComplete
814
- }, childrenCleaned), this.state.panelsBottomCount > 0 && /*#__PURE__*/external_react_default.a.createElement(StyledBottom, {
834
+ }, /*#__PURE__*/external_react_default.a.createElement(Concertina_ConcertinaContext.Provider, {
835
+ value: {
836
+ onHeadingClick: this.handleClick,
837
+ onChange: this.handleUpdate
838
+ }
839
+ }, childrenCleaned)), this.state.panelsBottomCount > 0 && /*#__PURE__*/external_react_default.a.createElement(StyledBottom, {
815
840
  style: {
816
841
  width: this.state.innerWidth
817
842
  },
@@ -838,36 +863,16 @@ Concertina_defineProperty(Concertina_Concertina, "Panel", Concertina_Panel);
838
863
  /***/ }),
839
864
 
840
865
  /***/ 12:
841
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
842
-
843
- "use strict";
844
- /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return updateReactRef; });
845
- /**
846
- * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
847
- *
848
- * @param ref - The React callback or object ref. Can be `null` or `undefined`.
849
- * @param current - The new value of the ref.
850
- */
851
- function updateReactRef(ref, current) {
852
- if (ref) {
853
- if (typeof ref === 'function') {
854
- ref(current);
855
- } else {
856
- // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
857
- // the intention here is to signal "we will take care of setting 'current', not you".
858
- ref.current = current; // eslint-disable-line no-param-reassign
859
- }
860
- }
861
- }
862
-
866
+ /***/ (function(module, exports) {
863
867
 
868
+ module.exports = require("@splunk/react-ui/Clickable");
864
869
 
865
870
  /***/ }),
866
871
 
867
- /***/ 15:
872
+ /***/ 14:
868
873
  /***/ (function(module, exports) {
869
874
 
870
- module.exports = require("react-event-listener");
875
+ module.exports = require("@splunk/react-ui/EventListener");
871
876
 
872
877
  /***/ }),
873
878
 
@@ -892,7 +897,7 @@ module.exports = require("lodash");
892
897
 
893
898
  /***/ }),
894
899
 
895
- /***/ 58:
900
+ /***/ 61:
896
901
  /***/ (function(module, exports) {
897
902
 
898
903
  module.exports = require("@splunk/react-ui/Scroll");
package/ControlGroup.js CHANGED
@@ -82,7 +82,7 @@ module.exports =
82
82
  /******/
83
83
  /******/
84
84
  /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 136);
85
+ /******/ return __webpack_require__(__webpack_require__.s = 134);
86
86
  /******/ })
87
87
  /************************************************************************/
88
88
  /******/ ({
@@ -108,7 +108,7 @@ module.exports = require("@splunk/ui-utils/id");
108
108
 
109
109
  /***/ }),
110
110
 
111
- /***/ 136:
111
+ /***/ 134:
112
112
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
113
113
 
114
114
  "use strict";
@@ -141,11 +141,11 @@ var Box_ = __webpack_require__(8);
141
141
  var Box_default = /*#__PURE__*/__webpack_require__.n(Box_);
142
142
 
143
143
  // EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
144
- var ScreenReaderContent_ = __webpack_require__(14);
144
+ var ScreenReaderContent_ = __webpack_require__(15);
145
145
  var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
146
146
 
147
147
  // EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
148
- var Tooltip_ = __webpack_require__(45);
148
+ var Tooltip_ = __webpack_require__(46);
149
149
  var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
150
150
 
151
151
  // EXTERNAL MODULE: external "styled-components"
@@ -231,6 +231,10 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
231
231
 
232
232
  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); }
233
233
 
234
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
235
+
236
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
237
+
234
238
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
235
239
 
236
240
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -305,7 +309,14 @@ var defaultProps = {
305
309
  labelWidth: 120,
306
310
  size: 'medium'
307
311
  };
308
-
312
+ // Style cloned onto child elements when fill behavior set.
313
+ var FLEX_GROW_STYLE = {
314
+ flexGrow: 1
315
+ }; // Margin bootom values cloned onto child elements when the stacking behavior is needed.
316
+
317
+ var CHILD_MARGIN_BOTTOM_DEFAULT = '0';
318
+ var CHILD_MARGIN_BOTTOM_PRISMA = '16px';
319
+ var CHILD_MARGIN_BOTTOM_PRISMA_COMPACT = '12px';
309
320
  /**
310
321
  * `ControlGroup` places a label and optional help text around one or more controls. The `ControlGroup`
311
322
  * will automatically add aria attributes to associate the controls with the labels and help text to
@@ -324,6 +335,7 @@ var defaultProps = {
324
335
  * attribute. If `inputId` is supported but not set a generated id is used instead. If `inputId` isn't
325
336
  * supported `id` is used. The `labelFor` prop may be used to override the `for` attribute.
326
337
  */
338
+
327
339
  var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
328
340
  _inherits(ControlGroup, _Component);
329
341
 
@@ -343,6 +355,36 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
343
355
 
344
356
  _defineProperty(_assertThisInitialized(_this), "contextValue", void 0);
345
357
 
358
+ _defineProperty(_assertThisInitialized(_this), "childIds", void 0);
359
+
360
+ _defineProperty(_assertThisInitialized(_this), "stackLayoutChildStyle", void 0);
361
+
362
+ _defineProperty(_assertThisInitialized(_this), "getChildID", function (key, index) {
363
+ var childKey = "".concat(key, "-").concat(index);
364
+ var value = _this.childIds[childKey];
365
+
366
+ if (!value || !value.length) {
367
+ value = Object(id_["createDOMID"])(key);
368
+ _this.childIds[childKey] = value;
369
+ }
370
+
371
+ return value;
372
+ });
373
+
374
+ _defineProperty(_assertThisInitialized(_this), "getStackLayoutChildStyle", function (isPrisma, isCompact) {
375
+ if (isPrisma) {
376
+ if (isCompact) {
377
+ _this.stackLayoutChildStyle.marginBottom = CHILD_MARGIN_BOTTOM_PRISMA_COMPACT;
378
+ }
379
+
380
+ _this.stackLayoutChildStyle.marginBottom = CHILD_MARGIN_BOTTOM_PRISMA;
381
+ } else {
382
+ _this.stackLayoutChildStyle.marginBottom = CHILD_MARGIN_BOTTOM_DEFAULT;
383
+ }
384
+
385
+ return _this.stackLayoutChildStyle;
386
+ });
387
+
346
388
  _defineProperty(_assertThisInitialized(_this), "hasInputId", function (item) {
347
389
  return item.type && item.type.propTypes && Object.prototype.hasOwnProperty.call(item.type.propTypes, 'inputId');
348
390
  });
@@ -380,10 +422,21 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
380
422
  _this.labelId = Object(id_["createDOMID"])('label');
381
423
  _this.helpId = Object(id_["createDOMID"])('help');
382
424
  _this.contextValue = _this.createContextValue();
425
+ _this.childIds = {};
426
+ _this.stackLayoutChildStyle = {};
383
427
  return _this;
384
428
  }
385
429
 
386
430
  _createClass(ControlGroup, [{
431
+ key: "shouldComponentUpdate",
432
+ value: function shouldComponentUpdate(nextProps) {
433
+ if (external_react_default.a.Children.count(nextProps.children) !== external_react_default.a.Children.count(this.props.children)) {
434
+ this.childIds = {};
435
+ }
436
+
437
+ return true;
438
+ }
439
+ }, {
387
440
  key: "createContextValue",
388
441
  value: function createContextValue() {
389
442
  return {
@@ -424,19 +477,11 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
424
477
  tooltip = _this$props.tooltip,
425
478
  otherProps = _objectWithoutProperties(_this$props, ["children", "controlsLayout", "error", "help", "hideLabel", "label", "labelFor", "labelPosition", "labelWidth", "size", "splunkTheme", "tooltip"]);
426
479
 
427
- var isPrisma = splunkTheme.family === 'prisma';
428
- var isCompact = splunkTheme.density === 'compact';
480
+ var isPrisma = splunkTheme.isPrisma,
481
+ isCompact = splunkTheme.isCompact;
429
482
  var validChildren = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]);
430
483
  var count = validChildren.length;
431
- var writableOtherProps = otherProps;
432
- var stackMarginBottom = '0px';
433
-
434
- if (isPrisma && isCompact) {
435
- stackMarginBottom = '12px';
436
- } else if (isPrisma) {
437
- stackMarginBottom = '16px';
438
- } // Clean the Children
439
-
484
+ var writableOtherProps = otherProps; // Clean the Children
440
485
 
441
486
  var cloneWithProps = function cloneWithProps(item, i) {
442
487
  var cloneProps = {
@@ -479,8 +524,10 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
479
524
  cloneProps.inline = false;
480
525
 
481
526
  if (i < count - 1) {
482
- cloneProps.style = item.props.style ? Object(external_lodash_["clone"])(item.props.style) : {};
483
- cloneProps.style.marginBottom = stackMarginBottom;
527
+ // The spread operator is used as css styles are not nested, so there is no need for a deep copy.
528
+ var stackStyle = _this2.getStackLayoutChildStyle(isPrisma, isCompact);
529
+
530
+ cloneProps.style = item.props.style ? _objectSpread(_objectSpread({}, item.props.style), stackStyle) : stackStyle;
484
531
  }
485
532
  }
486
533
 
@@ -498,15 +545,16 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
498
545
  }
499
546
 
500
547
  if (count === 1 && (controlsLayout === 'fillJoin' || controlsLayout === 'fill')) {
501
- cloneProps.style = item.props.style ? Object(external_lodash_["clone"])(item.props.style) : {};
502
- cloneProps.style.flexGrow = 1; // some controls like Select do not grow by default
548
+ // Some controls like Select do not grow by default, so flexGrow is applied
549
+ // The spread operator is used as css styles are not nested, so there is no need for a deep copy.
550
+ cloneProps.style = item.props.style ? _objectSpread(_objectSpread({}, item.props.style), FLEX_GROW_STYLE) : FLEX_GROW_STYLE;
503
551
  }
504
552
 
505
553
  if (!labelFor && item) {
506
554
  if (_this2.hasInputId(item)) {
507
- cloneProps.inputId = item.props.inputId || Object(id_["createDOMID"])('id');
555
+ cloneProps.inputId = item.props.inputId || _this2.getChildID('input-id', i);
508
556
  } else {
509
- cloneProps.id = item.props.id || Object(id_["createDOMID"])('id');
557
+ cloneProps.id = item.props.id || _this2.getChildID('id', i);
510
558
  }
511
559
  }
512
560
 
@@ -576,7 +624,7 @@ ControlGroupWithTheme.propTypes = ControlGroup_ControlGroup.propTypes;
576
624
 
577
625
  /***/ }),
578
626
 
579
- /***/ 14:
627
+ /***/ 15:
580
628
  /***/ (function(module, exports) {
581
629
 
582
630
  module.exports = require("@splunk/react-ui/ScreenReaderContent");
@@ -604,7 +652,7 @@ module.exports = require("lodash");
604
652
 
605
653
  /***/ }),
606
654
 
607
- /***/ 45:
655
+ /***/ 46:
608
656
  /***/ (function(module, exports) {
609
657
 
610
658
  module.exports = require("@splunk/react-ui/Tooltip");
package/Date.js CHANGED
@@ -108,7 +108,7 @@ module.exports = require("@splunk/ui-utils/id");
108
108
 
109
109
  /***/ }),
110
110
 
111
- /***/ 12:
111
+ /***/ 11:
112
112
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
113
113
 
114
114
  "use strict";
@@ -168,11 +168,11 @@ var id_ = __webpack_require__(10);
168
168
  var keyboard_ = __webpack_require__(9);
169
169
 
170
170
  // EXTERNAL MODULE: external "@splunk/react-ui/Calendar"
171
- var Calendar_ = __webpack_require__(75);
171
+ var Calendar_ = __webpack_require__(77);
172
172
  var Calendar_default = /*#__PURE__*/__webpack_require__.n(Calendar_);
173
173
 
174
174
  // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
175
- var Popover_ = __webpack_require__(17);
175
+ var Popover_ = __webpack_require__(16);
176
176
  var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
177
177
 
178
178
  // EXTERNAL MODULE: external "@splunk/themes"
@@ -183,7 +183,7 @@ var external_styled_components_ = __webpack_require__(3);
183
183
  var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
184
184
 
185
185
  // EXTERNAL MODULE: external "@splunk/react-ui/Text"
186
- var Text_ = __webpack_require__(26);
186
+ var Text_ = __webpack_require__(21);
187
187
  var Text_default = /*#__PURE__*/__webpack_require__.n(Text_);
188
188
 
189
189
  // CONCATENATED MODULE: ./src/Date/DateStyles.ts
@@ -235,7 +235,7 @@ function CalendarIcon(props) {
235
235
  }));
236
236
  }
237
237
  // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
238
- var updateReactRef = __webpack_require__(12);
238
+ var updateReactRef = __webpack_require__(11);
239
239
 
240
240
  // CONCATENATED MODULE: ./src/Date/Date.tsx
241
241
  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); }
@@ -520,7 +520,7 @@ var _Date = /*#__PURE__*/function (_Component) {
520
520
  var _this$props5 = this.props,
521
521
  highlightToday = _this$props5.highlightToday,
522
522
  splunkTheme = _this$props5.splunkTheme;
523
- var isPrisma = splunkTheme.family === 'prisma';
523
+ var isPrisma = splunkTheme.isPrisma;
524
524
  var currentValue = this.getValue();
525
525
  var startAdornment = isPrisma && /*#__PURE__*/external_react_default.a.createElement(IconContainer, {
526
526
  $disabled: this.props.disabled
@@ -576,7 +576,7 @@ DateWithTheme.momentFormat = _Date.momentFormat;
576
576
 
577
577
  /***/ }),
578
578
 
579
- /***/ 17:
579
+ /***/ 16:
580
580
  /***/ (function(module, exports) {
581
581
 
582
582
  module.exports = require("@splunk/react-ui/Popover");
@@ -597,7 +597,7 @@ module.exports = require("moment");
597
597
 
598
598
  /***/ }),
599
599
 
600
- /***/ 26:
600
+ /***/ 21:
601
601
  /***/ (function(module, exports) {
602
602
 
603
603
  module.exports = require("@splunk/react-ui/Text");
@@ -618,7 +618,7 @@ module.exports = require("lodash");
618
618
 
619
619
  /***/ }),
620
620
 
621
- /***/ 75:
621
+ /***/ 77:
622
622
  /***/ (function(module, exports) {
623
623
 
624
624
  module.exports = require("@splunk/react-ui/Calendar");
package/DefinitionList.js CHANGED
@@ -82,7 +82,7 @@ module.exports =
82
82
  /******/
83
83
  /******/
84
84
  /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 115);
85
+ /******/ return __webpack_require__(__webpack_require__.s = 119);
86
86
  /******/ })
87
87
  /************************************************************************/
88
88
  /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("prop-types");
101
101
 
102
102
  /***/ }),
103
103
 
104
- /***/ 115:
104
+ /***/ 119:
105
105
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
106
106
 
107
107
  "use strict";
@@ -176,9 +176,7 @@ Description.propTypes = propTypes;
176
176
  var DefinitionListStyles_Styled = external_styled_components_default.a.dl.withConfig({
177
177
  displayName: "DefinitionListStyles__Styled",
178
178
  componentId: "sc-1pqfrgm-0"
179
- })(["", ";", ""], themes_["mixins"].reset('block'), Object(themes_["pick"])({
180
- prisma: Object(external_styled_components_["css"])(["color:", ";"], themes_["variables"].contentColorMuted)
181
- }));
179
+ })(["", ";"], themes_["mixins"].reset('block'));
182
180
 
183
181
  // CONCATENATED MODULE: ./src/DefinitionList/TermStyles.ts
184
182
 
@@ -186,7 +184,9 @@ var DefinitionListStyles_Styled = external_styled_components_default.a.dl.withCo
186
184
  var TermStyles_Styled = external_styled_components_default.a.dt.withConfig({
187
185
  displayName: "TermStyles__Styled",
188
186
  componentId: "sc-1ao97j9-0"
189
- })(["", ";float:left;width:120px;overflow:hidden;overflow-x:hidden;white-space:nowrap;font-weight:400;word-wrap:normal;", ""], themes_["mixins"].reset('block'), Object(themes_["pick"])({
187
+ })(["", ";float:left;width:120px;overflow:hidden;overflow-x:hidden;white-space:nowrap;font-weight:400;word-wrap:normal;", " ", ""], themes_["mixins"].reset('block'), Object(themes_["pick"])({
188
+ prisma: Object(external_styled_components_["css"])(["color:", ";"], themes_["variables"].contentColorMuted)
189
+ }), Object(themes_["pick"])({
190
190
  enterprise: Object(external_styled_components_["css"])(["&::after{content:'", "';}"], " ".concat('.'.repeat(100)))
191
191
  }));
192
192
 
package/Dropdown.js CHANGED
@@ -82,7 +82,7 @@ module.exports =
82
82
  /******/
83
83
  /******/
84
84
  /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 165);
85
+ /******/ return __webpack_require__(__webpack_require__.s = 170);
86
86
  /******/ })
87
87
  /************************************************************************/
88
88
  /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("@splunk/ui-utils/id");
101
101
 
102
102
  /***/ }),
103
103
 
104
- /***/ 12:
104
+ /***/ 11:
105
105
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
106
106
 
107
107
  "use strict";
@@ -128,7 +128,14 @@ function updateReactRef(ref, current) {
128
128
 
129
129
  /***/ }),
130
130
 
131
- /***/ 165:
131
+ /***/ 16:
132
+ /***/ (function(module, exports) {
133
+
134
+ module.exports = require("@splunk/react-ui/Popover");
135
+
136
+ /***/ }),
137
+
138
+ /***/ 170:
132
139
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
133
140
 
134
141
  "use strict";
@@ -154,11 +161,11 @@ var external_lodash_ = __webpack_require__(4);
154
161
  var id_ = __webpack_require__(10);
155
162
 
156
163
  // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
157
- var Popover_ = __webpack_require__(17);
164
+ var Popover_ = __webpack_require__(16);
158
165
  var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
159
166
 
160
167
  // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
161
- var updateReactRef = __webpack_require__(12);
168
+ var updateReactRef = __webpack_require__(11);
162
169
 
163
170
  // CONCATENATED MODULE: ./src/Dropdown/Dropdown.tsx
164
171
  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); }
@@ -444,13 +451,6 @@ _defineProperty(Dropdown_Dropdown, "defaultProps", defaultProps);
444
451
 
445
452
 
446
453
 
447
- /***/ }),
448
-
449
- /***/ 17:
450
- /***/ (function(module, exports) {
451
-
452
- module.exports = require("@splunk/react-ui/Popover");
453
-
454
454
  /***/ }),
455
455
 
456
456
  /***/ 2: