@splunk/visualizations 25.5.0 → 25.6.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 (76) hide show
  1. package/.loki/reference/chrome_docker_PureVisualizations_PureEvents_TimeControlsPopover_Dark.png +0 -0
  2. package/.loki/reference/chrome_docker_PureVisualizations_PureEvents_TimeControlsPopover_DarkPrisma.png +0 -0
  3. package/.loki/reference/chrome_docker_PureVisualizations_PureEvents_TimeControlsPopover_Light.png +0 -0
  4. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Background_Color_Light_Blue.png +0 -0
  5. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Basic_Events.png +0 -0
  6. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Event_Actions.png +0 -0
  7. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Field_Actions.png +0 -0
  8. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Field_Summary.png +0 -0
  9. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Field_Summary_Simulated_Instance.png +0 -0
  10. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Footer_Fields.png +0 -0
  11. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Value_Highlighting.png +0 -0
  12. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Width_Height.png +0 -0
  13. package/.loki/reference/chrome_docker_Visualizations_Events_Events_Width_Percentage_50.png +0 -0
  14. package/Area.js +226 -143
  15. package/Area.js.map +1 -1
  16. package/Bar.js +226 -143
  17. package/Bar.js.map +1 -1
  18. package/Bubble.js +218 -135
  19. package/Bubble.js.map +1 -1
  20. package/ChoroplethSvg.js +217 -139
  21. package/ChoroplethSvg.js.map +1 -1
  22. package/Column.js +226 -143
  23. package/Column.js.map +1 -1
  24. package/Ellipse.js +188 -105
  25. package/Ellipse.js.map +1 -1
  26. package/Events.config.js +3 -0
  27. package/Events.config.js.map +1 -1
  28. package/Events.js +967 -267
  29. package/Events.js.map +1 -1
  30. package/FillerGauge.js +214 -126
  31. package/FillerGauge.js.map +1 -1
  32. package/Image.js +210 -125
  33. package/Image.js.map +1 -1
  34. package/Line.js +231 -143
  35. package/Line.js.map +1 -1
  36. package/LinkGraph.js +601 -524
  37. package/LinkGraph.js.map +1 -1
  38. package/Map.js +484 -406
  39. package/Map.js.map +1 -1
  40. package/Markdown.js +295 -210
  41. package/Markdown.js.map +1 -1
  42. package/MarkerGauge.js +388 -310
  43. package/MarkerGauge.js.map +1 -1
  44. package/ParallelCoordinates.js +469 -391
  45. package/ParallelCoordinates.js.map +1 -1
  46. package/Pie.js +428 -343
  47. package/Pie.js.map +1 -1
  48. package/Punchcard.js +480 -402
  49. package/Punchcard.js.map +1 -1
  50. package/Rectangle.js +437 -352
  51. package/Rectangle.js.map +1 -1
  52. package/Sankey.js +497 -419
  53. package/Sankey.js.map +1 -1
  54. package/Scatter.js +361 -276
  55. package/Scatter.js.map +1 -1
  56. package/SingleValue.js +386 -301
  57. package/SingleValue.js.map +1 -1
  58. package/SingleValueBasic.js +23 -23
  59. package/SingleValueBasic.js.map +1 -1
  60. package/SingleValueIcon.js +385 -300
  61. package/SingleValueIcon.js.map +1 -1
  62. package/SingleValueRadial.js +319 -234
  63. package/SingleValueRadial.js.map +1 -1
  64. package/Table.js +309 -231
  65. package/Table.js.map +1 -1
  66. package/common/EventsDoc.js +3 -3
  67. package/common/EventsDoc.js.map +1 -1
  68. package/common/GaugeMajorTicks.js +2 -2
  69. package/common/GaugeValueMarker.js +2 -2
  70. package/common/OptionsDoc.js +14 -14
  71. package/common/OptionsDoc.js.map +1 -1
  72. package/common/ThemesDoc.js +10 -10
  73. package/common/ThemesDoc.js.map +1 -1
  74. package/common/withDashboardViz.js +122 -42
  75. package/common/withDashboardViz.js.map +1 -1
  76. package/package.json +13 -11
@@ -87,7 +87,7 @@ module.exports =
87
87
  /******/
88
88
  /******/
89
89
  /******/ // Load entry module and return exports
90
- /******/ return __webpack_require__(__webpack_require__.s = 451);
90
+ /******/ return __webpack_require__(__webpack_require__.s = 459);
91
91
  /******/ })
92
92
  /************************************************************************/
93
93
  /******/ ({
@@ -120,7 +120,14 @@ module.exports = require("@babel/runtime/helpers/classCallCheck");
120
120
 
121
121
  /***/ }),
122
122
 
123
- /***/ 119:
123
+ /***/ 12:
124
+ /***/ (function(module, exports) {
125
+
126
+ module.exports = require("@splunk/visualizations-shared/colorUtils");
127
+
128
+ /***/ }),
129
+
130
+ /***/ 125:
124
131
  /***/ (function(module, exports, __webpack_require__) {
125
132
 
126
133
  "use strict";
@@ -165,20 +172,6 @@ exports.defaultContext = {
165
172
 
166
173
  /***/ }),
167
174
 
168
- /***/ 12:
169
- /***/ (function(module, exports) {
170
-
171
- module.exports = require("@splunk/visualizations-shared/colorUtils");
172
-
173
- /***/ }),
174
-
175
- /***/ 125:
176
- /***/ (function(module, exports) {
177
-
178
- module.exports = require("@splunk/visualizations/SingleValueBasic");
179
-
180
- /***/ }),
181
-
182
175
  /***/ 13:
183
176
  /***/ (function(module, exports, __webpack_require__) {
184
177
 
@@ -193,7 +186,7 @@ var React = __webpack_require__(1);
193
186
 
194
187
  var styled_components_1 = __webpack_require__(4);
195
188
 
196
- var SizeAwareWrapper_1 = __webpack_require__(20);
189
+ var SizeAwareWrapper_1 = __webpack_require__(21);
197
190
 
198
191
  var style_1 = __webpack_require__(15);
199
192
 
@@ -254,7 +247,7 @@ var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
254
247
 
255
248
  return React.createElement(FixSizeItem, {
256
249
  "data-test": "fix-size-item",
257
- "data-splunk-visualization-version": "25.5.0 - 12c0447a7",
250
+ "data-splunk-visualization-version": "25.6.0 - f5eb3abf9",
258
251
  width: width,
259
252
  height: height,
260
253
  backgroundColor: backgroundColor
@@ -276,6 +269,13 @@ exports.default = withFixedSizeContainer;
276
269
 
277
270
  /***/ }),
278
271
 
272
+ /***/ 131:
273
+ /***/ (function(module, exports) {
274
+
275
+ module.exports = require("@splunk/visualizations/SingleValueBasic");
276
+
277
+ /***/ }),
278
+
279
279
  /***/ 14:
280
280
  /***/ (function(module, exports, __webpack_require__) {
281
281
 
@@ -316,49 +316,56 @@ module.exports = require("@splunk/visualizations-shared/style");
316
316
 
317
317
  /***/ }),
318
318
 
319
- /***/ 154:
319
+ /***/ 16:
320
+ /***/ (function(module, exports) {
321
+
322
+ module.exports = require("@splunk/visualizations-shared/schemaUtils");
323
+
324
+ /***/ }),
325
+
326
+ /***/ 160:
320
327
  /***/ (function(module, exports) {
321
328
 
322
329
  module.exports = require("@splunk/react-icons/Activity");
323
330
 
324
331
  /***/ }),
325
332
 
326
- /***/ 155:
333
+ /***/ 161:
327
334
  /***/ (function(module, exports) {
328
335
 
329
336
  module.exports = require("@splunk/react-icons/Clock");
330
337
 
331
338
  /***/ }),
332
339
 
333
- /***/ 156:
340
+ /***/ 162:
334
341
  /***/ (function(module, exports) {
335
342
 
336
343
  module.exports = require("@splunk/react-icons/Pencil");
337
344
 
338
345
  /***/ }),
339
346
 
340
- /***/ 157:
347
+ /***/ 163:
341
348
  /***/ (function(module, exports) {
342
349
 
343
350
  module.exports = require("@splunk/react-icons/Star");
344
351
 
345
352
  /***/ }),
346
353
 
347
- /***/ 158:
354
+ /***/ 164:
348
355
  /***/ (function(module, exports) {
349
356
 
350
357
  module.exports = require("@splunk/react-icons/Question");
351
358
 
352
359
  /***/ }),
353
360
 
354
- /***/ 16:
361
+ /***/ 17:
355
362
  /***/ (function(module, exports) {
356
363
 
357
- module.exports = require("@splunk/visualizations-shared/schemaUtils");
364
+ module.exports = require("@babel/runtime/helpers/slicedToArray");
358
365
 
359
366
  /***/ }),
360
367
 
361
- /***/ 17:
368
+ /***/ 18:
362
369
  /***/ (function(module, exports, __webpack_require__) {
363
370
 
364
371
  "use strict";
@@ -595,42 +602,42 @@ exports.insertLayout = insertLayout;
595
602
 
596
603
  /***/ }),
597
604
 
598
- /***/ 18:
605
+ /***/ 19:
599
606
  /***/ (function(module, exports) {
600
607
 
601
608
  module.exports = require("@splunk/visualizations-shared/configUtils");
602
609
 
603
610
  /***/ }),
604
611
 
605
- /***/ 19:
612
+ /***/ 2:
606
613
  /***/ (function(module, exports) {
607
614
 
608
- module.exports = require("@babel/runtime/helpers/createClass");
615
+ module.exports = require("@splunk/ui-utils/i18n");
609
616
 
610
617
  /***/ }),
611
618
 
612
- /***/ 2:
619
+ /***/ 20:
613
620
  /***/ (function(module, exports) {
614
621
 
615
- module.exports = require("@splunk/ui-utils/i18n");
622
+ module.exports = require("@babel/runtime/helpers/createClass");
616
623
 
617
624
  /***/ }),
618
625
 
619
- /***/ 20:
626
+ /***/ 21:
620
627
  /***/ (function(module, exports) {
621
628
 
622
629
  module.exports = require("@splunk/visualizations-shared/SizeAwareWrapper");
623
630
 
624
631
  /***/ }),
625
632
 
626
- /***/ 21:
633
+ /***/ 22:
627
634
  /***/ (function(module, exports) {
628
635
 
629
636
  module.exports = require("@splunk/themes/pick");
630
637
 
631
638
  /***/ }),
632
639
 
633
- /***/ 22:
640
+ /***/ 23:
634
641
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
635
642
 
636
643
  "use strict";
@@ -669,13 +676,13 @@ __webpack_require__.r(__webpack_exports__);
669
676
  /* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__);
670
677
  /* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3);
671
678
  /* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_1__);
672
- /* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(30);
679
+ /* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(29);
673
680
  /* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__);
674
- /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(50);
681
+ /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(54);
675
682
  /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__);
676
- /* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(24);
683
+ /* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(25);
677
684
  /* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__);
678
- /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(45);
685
+ /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(49);
679
686
  /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__);
680
687
 
681
688
 
@@ -1639,35 +1646,56 @@ var handleValueClickCallback = function handleValueClickCallback(ev, majorValue,
1639
1646
 
1640
1647
  /***/ }),
1641
1648
 
1642
- /***/ 23:
1649
+ /***/ 24:
1643
1650
  /***/ (function(module, exports) {
1644
1651
 
1645
1652
  module.exports = require("@splunk/visualization-context/TimezoneContext");
1646
1653
 
1647
1654
  /***/ }),
1648
1655
 
1649
- /***/ 24:
1656
+ /***/ 25:
1650
1657
  /***/ (function(module, exports) {
1651
1658
 
1652
1659
  module.exports = require("@splunk/visualizations-shared/propUtils");
1653
1660
 
1654
1661
  /***/ }),
1655
1662
 
1656
- /***/ 25:
1663
+ /***/ 26:
1664
+ /***/ (function(module, exports) {
1665
+
1666
+ module.exports = require("@splunk/visualization-context/FeatureFlagContext");
1667
+
1668
+ /***/ }),
1669
+
1670
+ /***/ 27:
1657
1671
  /***/ (function(module, exports) {
1658
1672
 
1659
1673
  module.exports = require("@splunk/visualizations-shared/hocUtils");
1660
1674
 
1661
1675
  /***/ }),
1662
1676
 
1663
- /***/ 26:
1677
+ /***/ 28:
1664
1678
  /***/ (function(module, exports) {
1665
1679
 
1666
1680
  module.exports = require("@splunk/visualizations-shared/JSONSchemaUtils");
1667
1681
 
1668
1682
  /***/ }),
1669
1683
 
1670
- /***/ 27:
1684
+ /***/ 29:
1685
+ /***/ (function(module, exports) {
1686
+
1687
+ module.exports = require("@splunk/visualizations-shared/numberUtils");
1688
+
1689
+ /***/ }),
1690
+
1691
+ /***/ 3:
1692
+ /***/ (function(module, exports) {
1693
+
1694
+ module.exports = require("lodash");
1695
+
1696
+ /***/ }),
1697
+
1698
+ /***/ 30:
1671
1699
  /***/ (function(module, exports, __webpack_require__) {
1672
1700
 
1673
1701
  "use strict";
@@ -1759,7 +1787,14 @@ exports.default = FixedSizeContainer_1.default(IconPlaceholder);
1759
1787
 
1760
1788
  /***/ }),
1761
1789
 
1762
- /***/ 28:
1790
+ /***/ 31:
1791
+ /***/ (function(module, exports) {
1792
+
1793
+ module.exports = require("@splunk/ui-utils/id");
1794
+
1795
+ /***/ }),
1796
+
1797
+ /***/ 32:
1763
1798
  /***/ (function(module, exports, __webpack_require__) {
1764
1799
 
1765
1800
  "use strict";
@@ -1776,7 +1811,7 @@ var T = __webpack_require__(0);
1776
1811
 
1777
1812
  var lodash_1 = __webpack_require__(3);
1778
1813
 
1779
- var DataSource_1 = __webpack_require__(39);
1814
+ var DataSource_1 = __webpack_require__(43);
1780
1815
 
1781
1816
  exports.SortParamsPropTypes = T.shape({
1782
1817
  currentSortKey: T.string,
@@ -1830,7 +1865,7 @@ exports.getSortingParams = getSortingParams;
1830
1865
 
1831
1866
  /***/ }),
1832
1867
 
1833
- /***/ 29:
1868
+ /***/ 33:
1834
1869
  /***/ (function(module, exports, __webpack_require__) {
1835
1870
 
1836
1871
  "use strict";
@@ -1895,21 +1930,7 @@ exports.getPaginationParams = getPaginationParams;
1895
1930
 
1896
1931
  /***/ }),
1897
1932
 
1898
- /***/ 3:
1899
- /***/ (function(module, exports) {
1900
-
1901
- module.exports = require("lodash");
1902
-
1903
- /***/ }),
1904
-
1905
- /***/ 30:
1906
- /***/ (function(module, exports) {
1907
-
1908
- module.exports = require("@splunk/visualizations-shared/numberUtils");
1909
-
1910
- /***/ }),
1911
-
1912
- /***/ 31:
1933
+ /***/ 34:
1913
1934
  /***/ (function(module, exports, __webpack_require__) {
1914
1935
 
1915
1936
  "use strict";
@@ -1938,12 +1959,14 @@ var VizCategory;
1938
1959
 
1939
1960
  /***/ }),
1940
1961
 
1941
- /***/ 32:
1962
+ /***/ 35:
1942
1963
  /***/ (function(module, exports, __webpack_require__) {
1943
1964
 
1944
1965
  "use strict";
1945
1966
 
1946
1967
 
1968
+ var _slicedToArray = __webpack_require__(17);
1969
+
1947
1970
  Object.defineProperty(exports, "__esModule", {
1948
1971
  value: true
1949
1972
  });
@@ -1952,44 +1975,51 @@ var React = __webpack_require__(1);
1952
1975
 
1953
1976
  var lodash_1 = __webpack_require__(3);
1954
1977
 
1955
- var getSettingsFromThemedProps_1 = __webpack_require__(33);
1978
+ var getSettingsFromThemedProps_1 = __webpack_require__(36);
1979
+
1980
+ var Options_1 = __webpack_require__(37);
1956
1981
 
1957
- var Options_1 = __webpack_require__(34);
1982
+ var SanitizeProps_1 = __webpack_require__(38);
1958
1983
 
1959
- var SanitizeProps_1 = __webpack_require__(35);
1984
+ var TimezoneContext_1 = __webpack_require__(24);
1960
1985
 
1961
- var TimezoneContext_1 = __webpack_require__(23);
1986
+ var moment_1 = __webpack_require__(39);
1962
1987
 
1963
- var moment_1 = __webpack_require__(36);
1988
+ var FeatureFlagContext_1 = __webpack_require__(26);
1964
1989
 
1965
1990
  var styled_components_1 = __webpack_require__(4);
1966
1991
 
1967
- var hocUtils_1 = __webpack_require__(25);
1992
+ var hocUtils_1 = __webpack_require__(27);
1993
+
1994
+ var JSONSchemaUtils_1 = __webpack_require__(28);
1968
1995
 
1969
- var JSONSchemaUtils_1 = __webpack_require__(26);
1996
+ var async_dynamic_options_evaluator_1 = __webpack_require__(40);
1970
1997
 
1971
- var SplunkVisualization_1 = __webpack_require__(37);
1998
+ var id_1 = __webpack_require__(31);
1999
+
2000
+ var SplunkVisualization_1 = __webpack_require__(41);
1972
2001
 
1973
2002
  var VizBehavior_1 = __webpack_require__(6);
1974
2003
 
1975
- var getSorting_1 = __webpack_require__(28);
2004
+ var getSorting_1 = __webpack_require__(32);
2005
+
2006
+ var getPagination_1 = __webpack_require__(33);
1976
2007
 
1977
- var getPagination_1 = __webpack_require__(29);
2008
+ var useDeepMemo_1 = __webpack_require__(44);
1978
2009
 
1979
- var useDeepMemo_1 = __webpack_require__(40);
2010
+ var MissingPropsMessage_1 = __webpack_require__(45);
1980
2011
 
1981
- var MissingPropsMessage_1 = __webpack_require__(41);
2012
+ var withEditModeCover_1 = __webpack_require__(46);
1982
2013
 
1983
- var withEditModeCover_1 = __webpack_require__(42);
2014
+ var withPlaceholder_1 = __webpack_require__(47);
1984
2015
 
1985
- var withPlaceholder_1 = __webpack_require__(43);
2016
+ var UUID = id_1.createGUID();
1986
2017
  /**
1987
2018
  * hoc that wraps a pure react visualization in a Dashboard visualization
1988
2019
  * @param {DashboardVizOpts} opts
1989
2020
  * @returns {HOC}
1990
2021
  */
1991
2022
 
1992
-
1993
2023
  var withDashboardViz = function withDashboardViz(opts) {
1994
2024
  var ReactViz = opts.ReactViz,
1995
2025
  vizConfig = opts.vizConfig,
@@ -2049,28 +2079,76 @@ var withDashboardViz = function withDashboardViz(opts) {
2049
2079
 
2050
2080
  var evaluatedOptions = {}; // evaluatedOptions need to be initialized as an empty object
2051
2081
 
2082
+ var _React$useState = React.useState({}),
2083
+ _React$useState2 = _slicedToArray(_React$useState, 2),
2084
+ evaluatedOptionsAsync = _React$useState2[0],
2085
+ setEvaluatedOptionsAsync = _React$useState2[1]; // evaluatedOptions need to be initialized as an empty object
2086
+
2087
+
2088
+ var featureFlagContext = React.useContext(FeatureFlagContext_1.default);
2089
+
2090
+ var _React$useState3 = React.useState("".concat(vizConfig.name, " - ").concat(UUID)),
2091
+ _React$useState4 = _slicedToArray(_React$useState3, 1),
2092
+ visualizationID = _React$useState4[0];
2093
+
2094
+ var _React$useState5 = React.useState(Boolean(featureFlagContext && featureFlagContext['visualizations.useWebWorkersForDSL'] && typeof Worker !== 'undefined')),
2095
+ _React$useState6 = _slicedToArray(_React$useState5, 2),
2096
+ useAsyncEvaluatedOptions = _React$useState6[0],
2097
+ setUseAsyncEvaluatedOptions = _React$useState6[1];
2098
+
2052
2099
  evaluatedOptions = useDeepMemo_1.useDeepMemo(function () {
2053
2100
  try {
2054
- return Options_1.Options.evaluate({
2055
- context: lodash_1.defaultsDeep({}, context, vizConfig.defaultContext),
2056
- options: hocUtils_1.deepMergeWithArrayPrimitiveOverrides({}, options, defaultOptions)
2057
- }, dataSources, themeFunc);
2101
+ if (useAsyncEvaluatedOptions) {
2102
+ var optionsToEvaluate = {
2103
+ context: lodash_1.defaultsDeep({}, context, vizConfig.defaultContext),
2104
+ options: hocUtils_1.deepMergeWithArrayPrimitiveOverrides({}, options, defaultOptions)
2105
+ };
2106
+ var asyncDynamicOptionsEvaluatorParams = {
2107
+ visualizationID: visualizationID,
2108
+ props: props,
2109
+ options: optionsToEvaluate,
2110
+ dataSources: dataSources,
2111
+ theme: vizConfig.themes
2112
+ };
2113
+ async_dynamic_options_evaluator_1.default.evaluate(asyncDynamicOptionsEvaluatorParams).then(function (results) {
2114
+ setEvaluatedOptionsAsync(results.results);
2115
+ }).catch(function (e) {
2116
+ // eslint-disable-next-line no-console
2117
+ console.error("unexpected error evaluating options - async: ".concat(e.message));
2118
+ setUseAsyncEvaluatedOptions(false);
2119
+ });
2120
+ } else {
2121
+ return Options_1.Options.evaluate({
2122
+ context: lodash_1.defaultsDeep({}, context, vizConfig.defaultContext),
2123
+ options: hocUtils_1.deepMergeWithArrayPrimitiveOverrides({}, options, defaultOptions)
2124
+ }, dataSources, themeFunc);
2125
+ }
2058
2126
  } catch (e) {
2059
2127
  // eslint-disable-next-line no-console
2060
- console.error("unexpected error evaluating options: + ".concat(e.message));
2128
+ console.error("unexpected error evaluating options: ".concat(e.message));
2061
2129
  return {};
2062
2130
  }
2063
- }, [currentThemeFamily, currentThemeColorScheme, currentThemeDensity, options, context, dataSources, serializedTimezone]); // useEffect hook needs to be initialized before any early returns
2131
+
2132
+ return {};
2133
+ }, [currentThemeFamily, currentThemeColorScheme, currentThemeDensity, options, context, dataSources, serializedTimezone, useAsyncEvaluatedOptions]);
2134
+ var evaluatedOptionsToUse = !useAsyncEvaluatedOptions ? evaluatedOptions : evaluatedOptionsAsync; // useEffect hook needs to be initialized before any early returns
2064
2135
  // this is in accordance with the order of hook calls being the same on each render https://reactjs.org/docs/hooks-rules.html#explanation
2065
2136
 
2066
2137
  React.useEffect(function () {
2067
- onComputedProps(evaluatedOptions);
2068
- }); // present warning message if any required props are missing
2138
+ onComputedProps(evaluatedOptionsToUse);
2139
+ });
2140
+ React.useEffect(function () {
2141
+ return function () {
2142
+ if (useAsyncEvaluatedOptions) {
2143
+ async_dynamic_options_evaluator_1.default.reset(visualizationID);
2144
+ }
2145
+ }; // eslint-disable-next-line react-hooks/exhaustive-deps
2146
+ }, []); // present warning message if any required props are missing
2069
2147
 
2070
2148
  var _vizConfig$requiredPr = vizConfig.requiredProps,
2071
2149
  requiredProps = _vizConfig$requiredPr === void 0 ? [] : _vizConfig$requiredPr,
2072
2150
  supports = vizConfig.supports;
2073
- var missing = MissingPropsMessage_1.missingKeys(requiredProps, evaluatedOptions);
2151
+ var missing = MissingPropsMessage_1.missingKeys(requiredProps, evaluatedOptionsToUse);
2074
2152
 
2075
2153
  if (missing.length > 0 && supports.includes(VizBehavior_1.VizBehavior.PLACEHOLDER)) {
2076
2154
  return React.createElement(MissingPropsMessage_1.default, {
@@ -2097,7 +2175,7 @@ var withDashboardViz = function withDashboardViz(opts) {
2097
2175
 
2098
2176
  if (Array.isArray(payloadKeys) && payloadKeys.length) {
2099
2177
  payloadKeys.forEach(function (p) {
2100
- payload[p] = evaluatedOptions[p];
2178
+ payload[p] = evaluatedOptionsToUse[p];
2101
2179
  });
2102
2180
  }
2103
2181
 
@@ -2116,7 +2194,7 @@ var withDashboardViz = function withDashboardViz(opts) {
2116
2194
  } // compute pure viz props which are not from options
2117
2195
 
2118
2196
 
2119
- var computedVizProps = computeVizProps(Object.assign(Object.assign(Object.assign(Object.assign({}, props), evaluatedOptions), eventCallbackProps), {
2197
+ var computedVizProps = computeVizProps(Object.assign(Object.assign(Object.assign(Object.assign({}, props), evaluatedOptionsToUse), eventCallbackProps), {
2120
2198
  themeFunc: themeFunc
2121
2199
  }));
2122
2200
  /**
@@ -2136,7 +2214,7 @@ var withDashboardViz = function withDashboardViz(opts) {
2136
2214
 
2137
2215
  var dataSourceMetadata = {};
2138
2216
  var OptionKey = 'paginateDataSourceKey';
2139
- var paginateDataSourceKey = lodash_1.has(evaluatedOptions, OptionKey) && evaluatedOptions[OptionKey] || 'primary';
2217
+ var paginateDataSourceKey = lodash_1.has(evaluatedOptionsToUse, OptionKey) && evaluatedOptionsToUse[OptionKey] || 'primary';
2140
2218
 
2141
2219
  if (vizConfig.supports.indexOf(VizBehavior_1.VizBehavior.PAGE_AND_SORT) > -1 && lodash_1.has(dataSources, paginateDataSourceKey)) {
2142
2220
  var requestParams = lodash_1.get(dataSources, [paginateDataSourceKey, 'requestParams'], {});
@@ -2166,7 +2244,7 @@ var withDashboardViz = function withDashboardViz(opts) {
2166
2244
  mode: mode,
2167
2245
  width: width,
2168
2246
  height: height
2169
- }, evaluatedOptions, computedVizProps, eventCallbackProps, dataSourceMetadata));
2247
+ }, evaluatedOptionsToUse, computedVizProps, eventCallbackProps, dataSourceMetadata));
2170
2248
  };
2171
2249
 
2172
2250
  DashboardViz.propTypes = Object.assign(Object.assign({}, SplunkVisualization_1.default.propTypes), ReactViz.propTypes);
@@ -2184,35 +2262,49 @@ exports.default = withDashboardViz;
2184
2262
 
2185
2263
  /***/ }),
2186
2264
 
2187
- /***/ 33:
2265
+ /***/ 36:
2188
2266
  /***/ (function(module, exports) {
2189
2267
 
2190
2268
  module.exports = require("@splunk/themes/getSettingsFromThemedProps");
2191
2269
 
2192
2270
  /***/ }),
2193
2271
 
2194
- /***/ 34:
2272
+ /***/ 37:
2195
2273
  /***/ (function(module, exports) {
2196
2274
 
2197
2275
  module.exports = require("@splunk/visualization-encoding/Options");
2198
2276
 
2199
2277
  /***/ }),
2200
2278
 
2201
- /***/ 35:
2279
+ /***/ 38:
2202
2280
  /***/ (function(module, exports) {
2203
2281
 
2204
2282
  module.exports = require("@splunk/visualizations-shared/SanitizeProps");
2205
2283
 
2206
2284
  /***/ }),
2207
2285
 
2208
- /***/ 36:
2286
+ /***/ 39:
2209
2287
  /***/ (function(module, exports) {
2210
2288
 
2211
2289
  module.exports = require("@splunk/moment");
2212
2290
 
2213
2291
  /***/ }),
2214
2292
 
2215
- /***/ 37:
2293
+ /***/ 4:
2294
+ /***/ (function(module, exports) {
2295
+
2296
+ module.exports = require("styled-components");
2297
+
2298
+ /***/ }),
2299
+
2300
+ /***/ 40:
2301
+ /***/ (function(module, exports) {
2302
+
2303
+ module.exports = require("@splunk/async-dynamic-options-evaluator");
2304
+
2305
+ /***/ }),
2306
+
2307
+ /***/ 41:
2216
2308
  /***/ (function(module, exports, __webpack_require__) {
2217
2309
 
2218
2310
  "use strict";
@@ -2230,7 +2322,7 @@ var T = __webpack_require__(0);
2230
2322
 
2231
2323
  var lodash_1 = __webpack_require__(3);
2232
2324
 
2233
- var VizActionHandler_1 = __webpack_require__(38); // this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
2325
+ var VizActionHandler_1 = __webpack_require__(42); // this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
2234
2326
 
2235
2327
 
2236
2328
  exports.INITIAL_WIDTH = 250;
@@ -2364,7 +2456,7 @@ exports.default = SplunkVisualization;
2364
2456
 
2365
2457
  /***/ }),
2366
2458
 
2367
- /***/ 38:
2459
+ /***/ 42:
2368
2460
  /***/ (function(module, exports, __webpack_require__) {
2369
2461
 
2370
2462
  "use strict";
@@ -2372,7 +2464,7 @@ exports.default = SplunkVisualization;
2372
2464
 
2373
2465
  var _classCallCheck = __webpack_require__(11);
2374
2466
 
2375
- var _createClass = __webpack_require__(19);
2467
+ var _createClass = __webpack_require__(20);
2376
2468
 
2377
2469
  Object.defineProperty(exports, "__esModule", {
2378
2470
  value: true
@@ -2402,7 +2494,7 @@ exports.DefaultVizActionHandler = DefaultVizActionHandler;
2402
2494
 
2403
2495
  /***/ }),
2404
2496
 
2405
- /***/ 39:
2497
+ /***/ 43:
2406
2498
  /***/ (function(module, exports, __webpack_require__) {
2407
2499
 
2408
2500
  "use strict";
@@ -2416,14 +2508,7 @@ exports.validSortDirs = ['asc', 'desc', 'none'];
2416
2508
 
2417
2509
  /***/ }),
2418
2510
 
2419
- /***/ 4:
2420
- /***/ (function(module, exports) {
2421
-
2422
- module.exports = require("styled-components");
2423
-
2424
- /***/ }),
2425
-
2426
- /***/ 40:
2511
+ /***/ 44:
2427
2512
  /***/ (function(module, exports, __webpack_require__) {
2428
2513
 
2429
2514
  "use strict";
@@ -2469,7 +2554,7 @@ exports.useDeepMemo = useDeepMemo;
2469
2554
 
2470
2555
  /***/ }),
2471
2556
 
2472
- /***/ 41:
2557
+ /***/ 45:
2473
2558
  /***/ (function(module, exports, __webpack_require__) {
2474
2559
 
2475
2560
  "use strict";
@@ -2550,132 +2635,7 @@ exports.default = FixedSizeContainer_1.default(exports.MissingPropsMessage);
2550
2635
 
2551
2636
  /***/ }),
2552
2637
 
2553
- /***/ 42:
2554
- /***/ (function(module, exports, __webpack_require__) {
2555
-
2556
- "use strict";
2557
-
2558
-
2559
- Object.defineProperty(exports, "__esModule", {
2560
- value: true
2561
- });
2562
-
2563
- var React = __webpack_require__(1);
2564
-
2565
- var styled_components_1 = __webpack_require__(4);
2566
-
2567
- var hocUtils_1 = __webpack_require__(14);
2568
-
2569
- var Cover = styled_components_1.default.div.withConfig({
2570
- displayName: "withEditModeCover__Cover",
2571
- componentId: "sc-1gsbnxb-0"
2572
- })(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
2573
- var Blocker = styled_components_1.default.div.attrs({
2574
- 'data-splunk-visualization-version': "25.5.0 - 12c0447a7"
2575
- }).withConfig({
2576
- displayName: "withEditModeCover__Blocker",
2577
- componentId: "sc-1gsbnxb-1"
2578
- })(["position:relative;width:100%;height:100%;"]);
2579
- /**
2580
- * HOC that renders a cover layer in edit mode
2581
- * @method withEditModeCover
2582
- * @param {ExtendedDashViz} Visualization
2583
- * @returns {ExtendedDashViz} Wrapper
2584
- */
2585
-
2586
- var withEditModeCover = function withEditModeCover(Visualization, disableEditModeCover) {
2587
- var Wrapper = function Wrapper(props) {
2588
- var mode = props.mode;
2589
- var showEditCover = mode === 'edit' && !disableEditModeCover;
2590
- return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), showEditCover && React.createElement(Cover, {
2591
- "data-test": "edit-mode-cover"
2592
- }));
2593
- };
2594
-
2595
- hocUtils_1.extendStaticWrapperProps({
2596
- Wrapper: Wrapper,
2597
- Visualization: Visualization
2598
- });
2599
- return Wrapper;
2600
- };
2601
-
2602
- exports.default = withEditModeCover;
2603
-
2604
- /***/ }),
2605
-
2606
- /***/ 43:
2607
- /***/ (function(module, exports, __webpack_require__) {
2608
-
2609
- "use strict";
2610
-
2611
-
2612
- Object.defineProperty(exports, "__esModule", {
2613
- value: true
2614
- });
2615
-
2616
- var React = __webpack_require__(1);
2617
-
2618
- var colorUtils_1 = __webpack_require__(12);
2619
-
2620
- var variables_1 = __webpack_require__(9);
2621
-
2622
- var IconPlaceholder_1 = __webpack_require__(27);
2623
-
2624
- var VizBehavior_1 = __webpack_require__(6);
2625
-
2626
- var hocUtils_1 = __webpack_require__(14);
2627
-
2628
- var withPlaceholder = function withPlaceholder(Visualization) {
2629
- var useIconPlaceholder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : IconPlaceholder_1.shouldShowIconPlaceholder;
2630
- var config = Visualization.config;
2631
- var themes = config.themes;
2632
-
2633
- var Wrapper = function Wrapper(props) {
2634
- var _a, _b;
2635
-
2636
- var dataSources = props.dataSources,
2637
- loading = props.loading,
2638
- options = props.options,
2639
- height = props.height,
2640
- width = props.width;
2641
- var showPlaceholder = useIconPlaceholder(dataSources, loading, options);
2642
- var bgColorFromTheme = colorUtils_1.isColor(options === null || options === void 0 ? void 0 : options.backgroundColor) ? options === null || options === void 0 ? void 0 : options.backgroundColor : (_a = themes === null || themes === void 0 ? void 0 : themes.defaultBackgroundColor) === null || _a === void 0 ? void 0 : _a.call(themes, props);
2643
- var icon = (_b = config.placeholderIcon) !== null && _b !== void 0 ? _b : config.icon;
2644
- var iconColor = variables_1.default.contentColorActive(props);
2645
-
2646
- if (config.supports.includes(VizBehavior_1.VizBehavior.PLACEHOLDER) && showPlaceholder) {
2647
- return React.createElement(IconPlaceholder_1.default, {
2648
- "data-test": "icon-placeholder",
2649
- icon: icon,
2650
- width: width,
2651
- height: height,
2652
- backgroundColor: bgColorFromTheme,
2653
- iconColor: iconColor
2654
- });
2655
- }
2656
-
2657
- return React.createElement(Visualization, Object.assign({}, props));
2658
- };
2659
-
2660
- hocUtils_1.extendStaticWrapperProps({
2661
- Wrapper: Wrapper,
2662
- Visualization: Visualization
2663
- });
2664
- return Wrapper;
2665
- };
2666
-
2667
- exports.default = withPlaceholder;
2668
-
2669
- /***/ }),
2670
-
2671
- /***/ 45:
2672
- /***/ (function(module, exports) {
2673
-
2674
- module.exports = require("@splunk/visualizations-shared/colorConstants");
2675
-
2676
- /***/ }),
2677
-
2678
- /***/ 451:
2638
+ /***/ 459:
2679
2639
  /***/ (function(module, exports, __webpack_require__) {
2680
2640
 
2681
2641
  "use strict";
@@ -2688,15 +2648,15 @@ exports.themes = exports.computeVizProps = exports.PureSingleValueIcon = exports
2688
2648
 
2689
2649
  var React = __webpack_require__(1);
2690
2650
 
2691
- var RemoteIcon_1 = __webpack_require__(452);
2651
+ var RemoteIcon_1 = __webpack_require__(460);
2692
2652
 
2693
- var iconUtils_1 = __webpack_require__(453);
2653
+ var iconUtils_1 = __webpack_require__(461);
2694
2654
 
2695
- var SingleValueIcon_1 = __webpack_require__(473);
2655
+ var SingleValueIcon_1 = __webpack_require__(480);
2696
2656
 
2697
- var withDashboardViz_1 = __webpack_require__(32);
2657
+ var withDashboardViz_1 = __webpack_require__(35);
2698
2658
 
2699
- var config_1 = __webpack_require__(454);
2659
+ var config_1 = __webpack_require__(462);
2700
2660
 
2701
2661
  exports.config = config_1.default;
2702
2662
  exports.PureSingleValueIcon = SingleValueIcon_1.default;
@@ -2732,21 +2692,74 @@ exports.default = viz;
2732
2692
 
2733
2693
  /***/ }),
2734
2694
 
2735
- /***/ 452:
2695
+ /***/ 46:
2696
+ /***/ (function(module, exports, __webpack_require__) {
2697
+
2698
+ "use strict";
2699
+
2700
+
2701
+ Object.defineProperty(exports, "__esModule", {
2702
+ value: true
2703
+ });
2704
+
2705
+ var React = __webpack_require__(1);
2706
+
2707
+ var styled_components_1 = __webpack_require__(4);
2708
+
2709
+ var hocUtils_1 = __webpack_require__(14);
2710
+
2711
+ var Cover = styled_components_1.default.div.withConfig({
2712
+ displayName: "withEditModeCover__Cover",
2713
+ componentId: "sc-1gsbnxb-0"
2714
+ })(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
2715
+ var Blocker = styled_components_1.default.div.attrs({
2716
+ 'data-splunk-visualization-version': "25.6.0 - f5eb3abf9"
2717
+ }).withConfig({
2718
+ displayName: "withEditModeCover__Blocker",
2719
+ componentId: "sc-1gsbnxb-1"
2720
+ })(["position:relative;width:100%;height:100%;"]);
2721
+ /**
2722
+ * HOC that renders a cover layer in edit mode
2723
+ * @method withEditModeCover
2724
+ * @param {ExtendedDashViz} Visualization
2725
+ * @returns {ExtendedDashViz} Wrapper
2726
+ */
2727
+
2728
+ var withEditModeCover = function withEditModeCover(Visualization, disableEditModeCover) {
2729
+ var Wrapper = function Wrapper(props) {
2730
+ var mode = props.mode;
2731
+ var showEditCover = mode === 'edit' && !disableEditModeCover;
2732
+ return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), showEditCover && React.createElement(Cover, {
2733
+ "data-test": "edit-mode-cover"
2734
+ }));
2735
+ };
2736
+
2737
+ hocUtils_1.extendStaticWrapperProps({
2738
+ Wrapper: Wrapper,
2739
+ Visualization: Visualization
2740
+ });
2741
+ return Wrapper;
2742
+ };
2743
+
2744
+ exports.default = withEditModeCover;
2745
+
2746
+ /***/ }),
2747
+
2748
+ /***/ 460:
2736
2749
  /***/ (function(module, exports) {
2737
2750
 
2738
2751
  module.exports = require("@splunk/visualizations-shared/RemoteIcon");
2739
2752
 
2740
2753
  /***/ }),
2741
2754
 
2742
- /***/ 453:
2755
+ /***/ 461:
2743
2756
  /***/ (function(module, exports) {
2744
2757
 
2745
2758
  module.exports = require("@splunk/visualizations-shared/iconUtils");
2746
2759
 
2747
2760
  /***/ }),
2748
2761
 
2749
- /***/ 454:
2762
+ /***/ 462:
2750
2763
  /***/ (function(module, exports, __webpack_require__) {
2751
2764
 
2752
2765
  "use strict";
@@ -2762,37 +2775,37 @@ var i18n_1 = __webpack_require__(2);
2762
2775
 
2763
2776
  var schemaUtils_1 = __webpack_require__(16);
2764
2777
 
2765
- var PresetPalettes_1 = __webpack_require__(54);
2778
+ var PresetPalettes_1 = __webpack_require__(57);
2766
2779
 
2767
- var pick_1 = __webpack_require__(21);
2780
+ var pick_1 = __webpack_require__(22);
2768
2781
 
2769
2782
  var variables_1 = __webpack_require__(9);
2770
2783
 
2771
- var configUtils_1 = __webpack_require__(18);
2784
+ var configUtils_1 = __webpack_require__(19);
2772
2785
 
2773
- var singleValueContext_1 = __webpack_require__(119);
2786
+ var singleValueContext_1 = __webpack_require__(125);
2774
2787
 
2775
- var StaticMajorAndTrendLayout_1 = __webpack_require__(91);
2788
+ var StaticMajorAndTrendLayout_1 = __webpack_require__(94);
2776
2789
 
2777
- var StaticBackgroundColorEditor_1 = __webpack_require__(78);
2790
+ var StaticBackgroundColorEditor_1 = __webpack_require__(81);
2778
2791
 
2779
- var StaticIconColorEditor_1 = __webpack_require__(455);
2792
+ var StaticIconColorEditor_1 = __webpack_require__(463);
2780
2793
 
2781
- var StaticMajorColorEditor_1 = __webpack_require__(92);
2794
+ var StaticMajorColorEditor_1 = __webpack_require__(95);
2782
2795
 
2783
- var StaticTrendColorEditor_1 = __webpack_require__(93);
2796
+ var StaticTrendColorEditor_1 = __webpack_require__(96);
2784
2797
 
2785
- var DynamicMajorColorEditor_1 = __webpack_require__(88);
2798
+ var DynamicMajorColorEditor_1 = __webpack_require__(91);
2786
2799
 
2787
- var DynamicTrendColorEditor_1 = __webpack_require__(89);
2800
+ var DynamicTrendColorEditor_1 = __webpack_require__(92);
2788
2801
 
2789
- var DynamicBackgroundColorEditor_1 = __webpack_require__(90);
2802
+ var DynamicBackgroundColorEditor_1 = __webpack_require__(93);
2790
2803
 
2791
2804
  var VizBehavior_1 = __webpack_require__(6);
2792
2805
 
2793
- var configUtils_2 = __webpack_require__(17);
2806
+ var configUtils_2 = __webpack_require__(18);
2794
2807
 
2795
- var VizCategory_1 = __webpack_require__(31);
2808
+ var VizCategory_1 = __webpack_require__(34);
2796
2809
 
2797
2810
  var dataContract = {
2798
2811
  requiredDataSources: [{
@@ -3187,7 +3200,7 @@ exports.default = configUtils_2.enhanceConfig(config);
3187
3200
 
3188
3201
  /***/ }),
3189
3202
 
3190
- /***/ 455:
3203
+ /***/ 463:
3191
3204
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
3192
3205
 
3193
3206
  "use strict";
@@ -3196,9 +3209,9 @@ __webpack_require__.r(__webpack_exports__);
3196
3209
  /* harmony import */ var _babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__);
3197
3210
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2);
3198
3211
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1__);
3199
- /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(45);
3212
+ /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(49);
3200
3213
  /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__);
3201
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(18);
3214
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(19);
3202
3215
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__);
3203
3216
 
3204
3217
 
@@ -3222,7 +3235,72 @@ var StaticIconColorEditor = [{
3222
3235
 
3223
3236
  /***/ }),
3224
3237
 
3225
- /***/ 473:
3238
+ /***/ 47:
3239
+ /***/ (function(module, exports, __webpack_require__) {
3240
+
3241
+ "use strict";
3242
+
3243
+
3244
+ Object.defineProperty(exports, "__esModule", {
3245
+ value: true
3246
+ });
3247
+
3248
+ var React = __webpack_require__(1);
3249
+
3250
+ var colorUtils_1 = __webpack_require__(12);
3251
+
3252
+ var variables_1 = __webpack_require__(9);
3253
+
3254
+ var IconPlaceholder_1 = __webpack_require__(30);
3255
+
3256
+ var VizBehavior_1 = __webpack_require__(6);
3257
+
3258
+ var hocUtils_1 = __webpack_require__(14);
3259
+
3260
+ var withPlaceholder = function withPlaceholder(Visualization) {
3261
+ var useIconPlaceholder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : IconPlaceholder_1.shouldShowIconPlaceholder;
3262
+ var config = Visualization.config;
3263
+ var themes = config.themes;
3264
+
3265
+ var Wrapper = function Wrapper(props) {
3266
+ var _a, _b;
3267
+
3268
+ var dataSources = props.dataSources,
3269
+ loading = props.loading,
3270
+ options = props.options,
3271
+ height = props.height,
3272
+ width = props.width;
3273
+ var showPlaceholder = useIconPlaceholder(dataSources, loading, options);
3274
+ var bgColorFromTheme = colorUtils_1.isColor(options === null || options === void 0 ? void 0 : options.backgroundColor) ? options === null || options === void 0 ? void 0 : options.backgroundColor : (_a = themes === null || themes === void 0 ? void 0 : themes.defaultBackgroundColor) === null || _a === void 0 ? void 0 : _a.call(themes, props);
3275
+ var icon = (_b = config.placeholderIcon) !== null && _b !== void 0 ? _b : config.icon;
3276
+ var iconColor = variables_1.default.contentColorActive(props);
3277
+
3278
+ if (config.supports.includes(VizBehavior_1.VizBehavior.PLACEHOLDER) && showPlaceholder) {
3279
+ return React.createElement(IconPlaceholder_1.default, {
3280
+ "data-test": "icon-placeholder",
3281
+ icon: icon,
3282
+ width: width,
3283
+ height: height,
3284
+ backgroundColor: bgColorFromTheme,
3285
+ iconColor: iconColor
3286
+ });
3287
+ }
3288
+
3289
+ return React.createElement(Visualization, Object.assign({}, props));
3290
+ };
3291
+
3292
+ hocUtils_1.extendStaticWrapperProps({
3293
+ Wrapper: Wrapper,
3294
+ Visualization: Visualization
3295
+ });
3296
+ return Wrapper;
3297
+ };
3298
+
3299
+ exports.default = withPlaceholder;
3300
+
3301
+ /***/ }),
3302
+
3303
+ /***/ 480:
3226
3304
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
3227
3305
 
3228
3306
  "use strict";
@@ -3230,7 +3308,7 @@ var StaticIconColorEditor = [{
3230
3308
  __webpack_require__.r(__webpack_exports__);
3231
3309
 
3232
3310
  // EXTERNAL MODULE: external "@babel/runtime/helpers/extends"
3233
- var extends_ = __webpack_require__(48);
3311
+ var extends_ = __webpack_require__(52);
3234
3312
  var extends_default = /*#__PURE__*/__webpack_require__.n(extends_);
3235
3313
 
3236
3314
  // EXTERNAL MODULE: external "react"
@@ -3246,11 +3324,11 @@ var external_styled_components_ = __webpack_require__(4);
3246
3324
  var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
3247
3325
 
3248
3326
  // EXTERNAL MODULE: external "lodash/pick"
3249
- var pick_ = __webpack_require__(71);
3327
+ var pick_ = __webpack_require__(74);
3250
3328
  var pick_default = /*#__PURE__*/__webpack_require__.n(pick_);
3251
3329
 
3252
3330
  // EXTERNAL MODULE: external "lodash/isEmpty"
3253
- var isEmpty_ = __webpack_require__(72);
3331
+ var isEmpty_ = __webpack_require__(75);
3254
3332
  var isEmpty_default = /*#__PURE__*/__webpack_require__.n(isEmpty_);
3255
3333
 
3256
3334
  // EXTERNAL MODULE: external "@splunk/visualizations-shared/style"
@@ -3260,7 +3338,7 @@ var style_ = __webpack_require__(15);
3260
3338
  var i18n_ = __webpack_require__(2);
3261
3339
 
3262
3340
  // EXTERNAL MODULE: external "@splunk/visualizations-shared/SizeAwareWrapper"
3263
- var SizeAwareWrapper_ = __webpack_require__(20);
3341
+ var SizeAwareWrapper_ = __webpack_require__(21);
3264
3342
  var SizeAwareWrapper_default = /*#__PURE__*/__webpack_require__.n(SizeAwareWrapper_);
3265
3343
 
3266
3344
  // EXTERNAL MODULE: external "@splunk/visualizations-shared/Message"
@@ -3268,38 +3346,38 @@ var Message_ = __webpack_require__(10);
3268
3346
  var Message_default = /*#__PURE__*/__webpack_require__.n(Message_);
3269
3347
 
3270
3348
  // EXTERNAL MODULE: ./src/common/components/VizStyleWrapper.jsx
3271
- var VizStyleWrapper = __webpack_require__(63);
3349
+ var VizStyleWrapper = __webpack_require__(66);
3272
3350
 
3273
3351
  // EXTERNAL MODULE: external "@babel/runtime/helpers/defineProperty"
3274
3352
  var defineProperty_ = __webpack_require__(7);
3275
3353
  var defineProperty_default = /*#__PURE__*/__webpack_require__.n(defineProperty_);
3276
3354
 
3277
3355
  // EXTERNAL MODULE: external "@splunk/visualizations/SingleValueBasic"
3278
- var SingleValueBasic_ = __webpack_require__(125);
3356
+ var SingleValueBasic_ = __webpack_require__(131);
3279
3357
  var SingleValueBasic_default = /*#__PURE__*/__webpack_require__.n(SingleValueBasic_);
3280
3358
 
3281
3359
  // EXTERNAL MODULE: external "@splunk/react-icons/Activity"
3282
- var Activity_ = __webpack_require__(154);
3360
+ var Activity_ = __webpack_require__(160);
3283
3361
  var Activity_default = /*#__PURE__*/__webpack_require__.n(Activity_);
3284
3362
 
3285
3363
  // EXTERNAL MODULE: external "@splunk/react-icons/Clock"
3286
- var Clock_ = __webpack_require__(155);
3364
+ var Clock_ = __webpack_require__(161);
3287
3365
  var Clock_default = /*#__PURE__*/__webpack_require__.n(Clock_);
3288
3366
 
3289
3367
  // EXTERNAL MODULE: external "@splunk/react-icons/Pencil"
3290
- var Pencil_ = __webpack_require__(156);
3368
+ var Pencil_ = __webpack_require__(162);
3291
3369
  var Pencil_default = /*#__PURE__*/__webpack_require__.n(Pencil_);
3292
3370
 
3293
3371
  // EXTERNAL MODULE: external "@splunk/react-icons/Star"
3294
- var Star_ = __webpack_require__(157);
3372
+ var Star_ = __webpack_require__(163);
3295
3373
  var Star_default = /*#__PURE__*/__webpack_require__.n(Star_);
3296
3374
 
3297
3375
  // EXTERNAL MODULE: external "@splunk/react-icons/Question"
3298
- var Question_ = __webpack_require__(158);
3376
+ var Question_ = __webpack_require__(164);
3299
3377
  var Question_default = /*#__PURE__*/__webpack_require__.n(Question_);
3300
3378
 
3301
3379
  // EXTERNAL MODULE: ./src/common/utils/singleValueUtils.js
3302
- var singleValueUtils = __webpack_require__(22);
3380
+ var singleValueUtils = __webpack_require__(23);
3303
3381
 
3304
3382
  // CONCATENATED MODULE: ./src/SingleValueIcon/PureSingleValueIcon/utils/iconUtils.js
3305
3383
  // Todo: this will be replaced by IconLibrary.Registry
@@ -3951,21 +4029,28 @@ SingleValueIcon_SingleValueIcon.defaultProps = {
3951
4029
 
3952
4030
  /***/ }),
3953
4031
 
3954
- /***/ 48:
4032
+ /***/ 49:
4033
+ /***/ (function(module, exports) {
4034
+
4035
+ module.exports = require("@splunk/visualizations-shared/colorConstants");
4036
+
4037
+ /***/ }),
4038
+
4039
+ /***/ 52:
3955
4040
  /***/ (function(module, exports) {
3956
4041
 
3957
4042
  module.exports = require("@babel/runtime/helpers/extends");
3958
4043
 
3959
4044
  /***/ }),
3960
4045
 
3961
- /***/ 50:
4046
+ /***/ 54:
3962
4047
  /***/ (function(module, exports) {
3963
4048
 
3964
4049
  module.exports = require("@splunk/visualizations-shared/domUtils");
3965
4050
 
3966
4051
  /***/ }),
3967
4052
 
3968
- /***/ 54:
4053
+ /***/ 57:
3969
4054
  /***/ (function(module, exports) {
3970
4055
 
3971
4056
  module.exports = require("@splunk/visualization-color-palettes/editors/PresetPalettes");
@@ -4010,7 +4095,7 @@ var VizBehavior;
4010
4095
 
4011
4096
  /***/ }),
4012
4097
 
4013
- /***/ 63:
4098
+ /***/ 66:
4014
4099
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4015
4100
 
4016
4101
  "use strict";
@@ -4041,28 +4126,35 @@ module.exports = require("@babel/runtime/helpers/defineProperty");
4041
4126
 
4042
4127
  /***/ }),
4043
4128
 
4044
- /***/ 71:
4129
+ /***/ 74:
4045
4130
  /***/ (function(module, exports) {
4046
4131
 
4047
4132
  module.exports = require("lodash/pick");
4048
4133
 
4049
4134
  /***/ }),
4050
4135
 
4051
- /***/ 72:
4136
+ /***/ 75:
4052
4137
  /***/ (function(module, exports) {
4053
4138
 
4054
4139
  module.exports = require("lodash/isEmpty");
4055
4140
 
4056
4141
  /***/ }),
4057
4142
 
4058
- /***/ 78:
4143
+ /***/ 8:
4144
+ /***/ (function(module, exports) {
4145
+
4146
+ module.exports = require("@babel/runtime/helpers/toConsumableArray");
4147
+
4148
+ /***/ }),
4149
+
4150
+ /***/ 81:
4059
4151
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4060
4152
 
4061
4153
  "use strict";
4062
4154
  __webpack_require__.r(__webpack_exports__);
4063
4155
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4064
4156
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4065
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4157
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4066
4158
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4067
4159
 
4068
4160
 
@@ -4079,14 +4171,14 @@ var StaticBackgroundColorEditor = {
4079
4171
 
4080
4172
  /***/ }),
4081
4173
 
4082
- /***/ 8:
4174
+ /***/ 9:
4083
4175
  /***/ (function(module, exports) {
4084
4176
 
4085
- module.exports = require("@babel/runtime/helpers/toConsumableArray");
4177
+ module.exports = require("@splunk/themes/variables");
4086
4178
 
4087
4179
  /***/ }),
4088
4180
 
4089
- /***/ 88:
4181
+ /***/ 91:
4090
4182
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4091
4183
 
4092
4184
  "use strict";
@@ -4094,7 +4186,7 @@ __webpack_require__.r(__webpack_exports__);
4094
4186
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicMajorColorEditor", function() { return getDynamicMajorColorEditor; });
4095
4187
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4096
4188
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4097
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4189
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4098
4190
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4099
4191
 
4100
4192
 
@@ -4137,7 +4229,7 @@ var getDynamicMajorColorEditor = function getDynamicMajorColorEditor(_ref) {
4137
4229
 
4138
4230
  /***/ }),
4139
4231
 
4140
- /***/ 89:
4232
+ /***/ 92:
4141
4233
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4142
4234
 
4143
4235
  "use strict";
@@ -4145,7 +4237,7 @@ __webpack_require__.r(__webpack_exports__);
4145
4237
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicTrendColorEditor", function() { return getDynamicTrendColorEditor; });
4146
4238
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4147
4239
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4148
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4240
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4149
4241
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4150
4242
 
4151
4243
 
@@ -4182,14 +4274,7 @@ var getDynamicTrendColorEditor = function getDynamicTrendColorEditor(_ref) {
4182
4274
 
4183
4275
  /***/ }),
4184
4276
 
4185
- /***/ 9:
4186
- /***/ (function(module, exports) {
4187
-
4188
- module.exports = require("@splunk/themes/variables");
4189
-
4190
- /***/ }),
4191
-
4192
- /***/ 90:
4277
+ /***/ 93:
4193
4278
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4194
4279
 
4195
4280
  "use strict";
@@ -4197,7 +4282,7 @@ __webpack_require__.r(__webpack_exports__);
4197
4282
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicBackgroundColorEditor", function() { return getDynamicBackgroundColorEditor; });
4198
4283
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4199
4284
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4200
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4285
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4201
4286
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4202
4287
 
4203
4288
 
@@ -4244,7 +4329,7 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
4244
4329
 
4245
4330
  /***/ }),
4246
4331
 
4247
- /***/ 91:
4332
+ /***/ 94:
4248
4333
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4249
4334
 
4250
4335
  "use strict";
@@ -4295,14 +4380,14 @@ var StaticMajorAndTrendLayout = [[{
4295
4380
 
4296
4381
  /***/ }),
4297
4382
 
4298
- /***/ 92:
4383
+ /***/ 95:
4299
4384
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4300
4385
 
4301
4386
  "use strict";
4302
4387
  __webpack_require__.r(__webpack_exports__);
4303
4388
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4304
4389
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4305
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4390
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4306
4391
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4307
4392
 
4308
4393
 
@@ -4319,14 +4404,14 @@ var StaticMajorColorEditor = {
4319
4404
 
4320
4405
  /***/ }),
4321
4406
 
4322
- /***/ 93:
4407
+ /***/ 96:
4323
4408
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
4324
4409
 
4325
4410
  "use strict";
4326
4411
  __webpack_require__.r(__webpack_exports__);
4327
4412
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
4328
4413
  /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
4329
- /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18);
4414
+ /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(19);
4330
4415
  /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
4331
4416
 
4332
4417