@splunk/visualizations 26.0.0 → 26.1.1

package/common/Charting.js

@@ -1,5 +1,5 @@
 /*!
- * Copyright © 2018 Splunk Inc.
+ * Copyright © 2024 Splunk Inc.
  * SPLUNK CONFIDENTIAL – Use or disclosure of this material in whole or
  * in part without a valid written license from Splunk Inc. is PROHIBITED.
  */
@@ -87,7 +87,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 42);
+/******/ 	return __webpack_require__(__webpack_require__.s = 53);
 /******/ })
 /************************************************************************/
 /******/ ([
@@ -118,20 +118,20 @@ module.exports = require("lodash");
 /* 4 */
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/classCallCheck");
+module.exports = require("@splunk/ui-utils/i18n");
 
 /***/ }),
-/* 5 */,
-/* 6 */
+/* 5 */
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/createClass");
+module.exports = require("@babel/runtime/helpers/classCallCheck");
 
 /***/ }),
+/* 6 */,
 /* 7 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/i18n");
+module.exports = require("@babel/runtime/helpers/createClass");
 
 /***/ }),
 /* 8 */,
@@ -144,41 +144,47 @@ module.exports = require("@splunk/ui-utils/i18n");
 /* 15 */,
 /* 16 */,
 /* 17 */,
-/* 18 */
+/* 18 */,
+/* 19 */,
+/* 20 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/Message");
 
 /***/ }),
-/* 19 */,
-/* 20 */
+/* 21 */,
+/* 22 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-context/TimezoneContext");
 
 /***/ }),
-/* 21 */
+/* 23 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/style");
 
 /***/ }),
-/* 22 */
+/* 24 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _classCallCheck = __webpack_require__(4);
-var _createClass = __webpack_require__(6);
+var _classCallCheck = __webpack_require__(5);
+
+var _createClass = __webpack_require__(7);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ChartingApiFunctional = void 0;
+
 var ChartingApiFunctional = /*#__PURE__*/function () {
   // eslint-disable-next-line no-useless-constructor
   function ChartingApiFunctional(chartRef) {
     _classCallCheck(this, ChartingApiFunctional);
+
     this.chartRef = chartRef;
   }
   /**
@@ -186,15 +192,18 @@ var ChartingApiFunctional = /*#__PURE__*/function () {
    *
    * @memberof ChartingApiFunctional
    */
+
+
   _createClass(ChartingApiFunctional, [{
     key: "highlight",
     value: function highlight() {
       var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
-          xValue: '',
-          seriesName: ''
-        },
-        xValue = _ref.xValue,
-        seriesName = _ref.seriesName;
+        xValue: '',
+        seriesName: ''
+      },
+          xValue = _ref.xValue,
+          seriesName = _ref.seriesName;
+
       this.getChart().highlight(xValue, seriesName);
     }
     /**
@@ -202,26 +211,28 @@ var ChartingApiFunctional = /*#__PURE__*/function () {
      *
      * @memberof ChartingApiFunctional
      */
+
   }, {
     key: "unHighlight",
     value: function unHighlight() {
       this.getChart().unHighlight();
-    }
-    // returns chart object
+    } // returns chart object
+
   }, {
     key: "getChart",
     value: function getChart() {
       var _a;
+
       return (_a = this.chartRef) === null || _a === void 0 ? void 0 : _a.current;
     }
   }]);
+
   return ChartingApiFunctional;
 }();
+
 exports.ChartingApiFunctional = ChartingApiFunctional;
 
 /***/ }),
-/* 23 */,
-/* 24 */,
 /* 25 */,
 /* 26 */,
 /* 27 */,
@@ -239,7 +250,18 @@ exports.ChartingApiFunctional = ChartingApiFunctional;
 /* 39 */,
 /* 40 */,
 /* 41 */,
-/* 42 */
+/* 42 */,
+/* 43 */,
+/* 44 */,
+/* 45 */,
+/* 46 */,
+/* 47 */,
+/* 48 */,
+/* 49 */,
+/* 50 */,
+/* 51 */,
+/* 52 */,
+/* 53 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -250,23 +272,42 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.updateRowPayload = exports.canUpdateInPlace = exports.changedOptions = exports.NO_INPLACE_PROPS = void 0;
 /* eslint-disable react/no-unused-prop-types */
+
 var lodash_1 = __webpack_require__(3);
-var i18n_1 = __webpack_require__(7);
-var visualization_color_palettes_1 = __webpack_require__(43);
+
+var i18n_1 = __webpack_require__(4);
+
+var visualization_color_palettes_1 = __webpack_require__(54);
+
 var react_1 = __webpack_require__(0);
+
 var React = __webpack_require__(0);
+
 var T = __webpack_require__(1);
-var react_event_listener_1 = __webpack_require__(44);
-__webpack_require__(45); // fixme, @splunk/charting should be refactor to use locale & timezone instead of i18n functions
-var charting_bundle_1 = __webpack_require__(46);
-var TimezoneContext_1 = __webpack_require__(20);
-var style_1 = __webpack_require__(21);
+
+var react_event_listener_1 = __webpack_require__(55);
+
+__webpack_require__(56); // fixme, @splunk/charting should be refactor to use locale & timezone instead of i18n functions
+
+
+var charting_bundle_1 = __webpack_require__(57);
+
+var TimezoneContext_1 = __webpack_require__(22);
+
+var style_1 = __webpack_require__(23);
+
 var styled_components_1 = __webpack_require__(2);
-var Message_1 = __webpack_require__(18);
-var useSplunkTheme_1 = __webpack_require__(47);
-var themeUtils_1 = __webpack_require__(48);
-var ChartingApi_1 = __webpack_require__(22);
+
+var Message_1 = __webpack_require__(20);
+
+var useSplunkTheme_1 = __webpack_require__(58);
+
+var themeUtils_1 = __webpack_require__(59);
+
+var ChartingApi_1 = __webpack_require__(24);
+
 exports.NO_INPLACE_PROPS = ['chart', 'chart.orientation', 'layout.splitSeries', 'chart.style', 'legend.placement'];
+
 var changedOptions = function changedOptions(curOptions, nextOptions) {
   return Object.keys(curOptions).filter(function (key) {
     return !(key in nextOptions);
@@ -274,7 +315,9 @@ var changedOptions = function changedOptions(curOptions, nextOptions) {
     return !(key in curOptions) || curOptions[key] !== nextOptions[key];
   }));
 };
+
 exports.changedOptions = changedOptions;
+
 function usePrevious(value) {
   var ref = (0, react_1.useRef)();
   (0, react_1.useEffect)(function () {
@@ -282,21 +325,24 @@ function usePrevious(value) {
   });
   return ref.current;
 }
+
 var canUpdateInPlace = function canUpdateInPlace(curOptions, nextOptions) {
   // if either of the options are undefined
   // it cannot update in place.
   if (!curOptions || !nextOptions) {
     return false;
   }
+
   return !exports.NO_INPLACE_PROPS.some(function (p) {
     return curOptions[p] !== nextOptions[p];
   }) && !(0, exports.changedOptions)(curOptions, nextOptions).some(function (p) {
     return p.toLowerCase().endsWith('color');
   });
 };
-exports.canUpdateInPlace = canUpdateInPlace;
-// create 'row' payloads from 'rowContext' in the flattened format:
+
+exports.canUpdateInPlace = canUpdateInPlace; // create 'row' payloads from 'rowContext' in the flattened format:
 // row.<fieldname>.value
+
 var updateRowPayload = function updateRowPayload(chartEventRowContext, payload) {
   Object.keys(chartEventRowContext || {}).forEach(function (key) {
     // eslint-disable-next-line no-param-reassign
@@ -304,18 +350,21 @@ var updateRowPayload = function updateRowPayload(chartEventRowContext, payload)
   });
   return payload;
 };
+
 exports.updateRowPayload = updateRowPayload;
 var VizChartEventType;
+
 (function (VizChartEventType) {
   VizChartEventType["POINT_CLICK"] = "point.click";
   VizChartEventType["POINT_MOUSE_OUT"] = "point.mouseout";
   VizChartEventType["POINT_MOUSE_OVER"] = "point.mouseover";
   VizChartEventType["LEGEND_CLICK"] = "legend.click";
-})(VizChartEventType || (VizChartEventType = {}));
-// @TODO(pwied): remove after HC upgrade to 8+
+})(VizChartEventType || (VizChartEventType = {})); // @TODO(pwied): remove after HC upgrade to 8+
 // .highcharts-a11y-proxy-container rule addresses a HighCharts < 8 bug
 // caused by the accessibility plugin
 // https://github.com/highcharts/highcharts/issues/12883
+
+
 var ChartingContainer = styled_components_1.default.div.attrs(function (props) {
   return {
     'data-test': 'charting-container',
@@ -343,6 +392,7 @@ var propTypes = {
   visualizationApiRef: T.func,
   themeKey: T.string
 };
+
 var Charting = function Charting(props) {
   var container = (0, react_1.useRef)(null);
   var needsInit = (0, react_1.useRef)(true);
@@ -350,6 +400,7 @@ var Charting = function Charting(props) {
   var needsRedraw = (0, react_1.useRef)(true);
   var api = (0, react_1.useRef)(new ChartingApi_1.ChartingApiFunctional(chart));
   var timezone = (0, react_1.useContext)(TimezoneContext_1.default);
+
   var computeChartingSize = function computeChartingSize() {
     if (container.current) {
       var rect = container.current.getBoundingClientRect();
@@ -358,48 +409,56 @@ var Charting = function Charting(props) {
         width: rect.width
       };
     }
+
     return {};
   };
+
   var splunkTheme = (0, useSplunkTheme_1.default)();
   var themeKey = props.themeKey ? props.themeKey : (0, themeUtils_1.getChartingThemeKey)({
     splunkThemeV1: splunkTheme
   });
   var width = props.width,
-    height = props.height,
-    style = props.style,
-    chartData = props.chartData,
-    options = props.options,
-    colorPalette = props.colorPalette,
-    onClick = props.onClick,
-    onSelect = props.onSelect,
-    onPointMouseOut = props.onPointMouseOut,
-    onPointMouseOver = props.onPointMouseOver,
-    onEventTrigger = props.onEventTrigger;
+      height = props.height,
+      style = props.style,
+      chartData = props.chartData,
+      options = props.options,
+      colorPalette = props.colorPalette,
+      onClick = props.onClick,
+      onSelect = props.onSelect,
+      onPointMouseOut = props.onPointMouseOut,
+      onPointMouseOver = props.onPointMouseOver,
+      onEventTrigger = props.onEventTrigger;
   var prevOptions = usePrevious(options);
   var prevTimezone = usePrevious(timezone);
+
   var handleClick = function handleClick(chartEvent, type) {
     var payload = (0, lodash_1.pick)(chartEvent, 'name2', 'value2', '_span', 'modifierKey');
     payload.name = payload.name2;
     delete payload.name2;
+
     if (type === VizChartEventType.POINT_CLICK) {
       payload.value = payload.value2;
       delete payload.value2;
       payload = (0, exports.updateRowPayload)(chartEvent.rowContext, payload);
     }
+
     onClick({
       type: type,
       originalEvent: chartEvent,
       payload: payload
     });
   };
+
   var destroyChart = function destroyChart() {
     if (chart.current) {
       chart.current.destroy();
       chart.current = null;
     }
+
     needsRedraw.current = true;
     needsInit.current = true;
   };
+
   var handleSelect = function handleSelect(chartEvent) {
     // todo: need change this after breaking all visualizations
     if (onSelect && typeof onSelect === 'function') {
@@ -409,14 +468,16 @@ var Charting = function Charting(props) {
         payload: (0, lodash_1.pick)(chartEvent, 'startXIndex', 'endXIndex', 'startXValue', 'endXValue')
       });
       return;
-    }
-    // the chartEvent here is a jQuery event
+    } // the chartEvent here is a jQuery event
+
+
     onEventTrigger({
       type: 'range.select',
       originalEvent: chartEvent,
       payload: (0, lodash_1.pick)(chartEvent, 'startXIndex', 'endXIndex', 'startXValue', 'endXValue')
     });
   };
+
   var handlePointMouseOut = function handlePointMouseOut(chartEvent, type) {
     var payload = (0, lodash_1.pick)(chartEvent, 'name2', 'value2', '_span', 'modifierKey', 'tooltipContext');
     payload.name = payload.name2;
@@ -430,6 +491,7 @@ var Charting = function Charting(props) {
       payload: payload
     });
   };
+
   var handlePointMouseOver = function handlePointMouseOver(chartEvent, type) {
     var payload = (0, lodash_1.pick)(chartEvent, 'name2', 'value2', '_span', 'modifierKey', 'tooltipContext');
     payload.name = payload.name2;
@@ -443,6 +505,7 @@ var Charting = function Charting(props) {
       payload: payload
     });
   };
+
   var drawChart = function drawChart() {
     var updatedOptions = Object.assign(Object.assign({}, options), {
       shouldColorizeTooltipData: false
@@ -453,15 +516,18 @@ var Charting = function Charting(props) {
     var serializedTimezone = timezone === null || timezone === void 0 ? void 0 : timezone.serializedTimezone;
     var ianaTimezone = timezone === null || timezone === void 0 ? void 0 : timezone.ianaTimezone;
     var utcOffset = timezone === null || timezone === void 0 ? void 0 : timezone.utcOffset;
+
     if (!computedWidth || !computedHeight) {
       return;
     }
+
     if (!chartData || !Object.keys(chartData).length) {
       return;
-    }
-    // splunk-charting layers configuration option updates.
+    } // splunk-charting layers configuration option updates.
     // when an option is removed it needs to be set to an empty string
     // to override the previous configuration
+
+
     if (prevOptions) {
       Object.keys(prevOptions).forEach(function (key) {
         if (updatedOptions[key] === undefined) {
@@ -469,13 +535,16 @@ var Charting = function Charting(props) {
         }
       });
     }
+
     try {
       if (needsInit.current) {
         destroyChart();
         charting_bundle_1.default.setTheme(themeKey);
+
         if (colorPalette.length > 0) {
           charting_bundle_1.default.setColorPalette(colorPalette);
         }
+
         chart.current = charting_bundle_1.default.createChart(container.current, Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, updatedOptions), {
           drilldown: 'all'
         }), typeof serializedTimezone === 'string' && {
@@ -484,8 +553,8 @@ var Charting = function Charting(props) {
           'time.ianaTimezone': ianaTimezone
         }), typeof utcOffset === 'number' && {
           'time.timezoneOffset': utcOffset
-        }));
-        // bind event handlers
+        })); // bind event handlers
+
         chart.current.on('pointClick', function (e) {
           handleClick(e, VizChartEventType.POINT_CLICK);
         });
@@ -500,29 +569,37 @@ var Charting = function Charting(props) {
         });
         chart.current.on('chartRangeSelect', handleSelect);
       }
+
       if (needsRedraw.current) {
         charting_bundle_1.default.setTheme(themeKey);
+
         if (colorPalette.length > 0) {
           charting_bundle_1.default.setColorPalette(colorPalette);
         }
+
         chart.current.prepareAndDraw(chartData, updatedOptions, function () {});
       }
+
       if (chart.current) {
         if (Math.round(chart.current.height) !== Math.round(computedHeight) || Math.round(chart.current.width) !== Math.round(computedWidth)) {
           chart.current.resize(computedWidth, computedHeight);
         }
       }
+
       needsInit.current = false;
       needsRedraw.current = false;
     } catch (e) {
       window.console.error('Caught error rendering chart:', e);
     }
   };
+
   var debouncedDrawChart = (0, lodash_1.debounce)(drawChart, 5);
+
   var onContainerMount = function onContainerMount(chartingContainer) {
     container.current = chartingContainer;
     debouncedDrawChart();
   };
+
   var prevTheme = usePrevious(themeKey);
   var prevOnClick = usePrevious(onClick);
   (0, react_1.useEffect)(function () {
@@ -536,14 +613,14 @@ var Charting = function Charting(props) {
   (0, react_1.useEffect)(function () {
     // TODO: figure out why re-init is needed for functional components (i.e. PlatformViz) when changing theme
     // seems like redraw doesn't suffice to update the background colors
-    if (!chart.current || !(0, exports.canUpdateInPlace)(prevOptions, options) ||
-    // timezone is a simple object so this comparison should be fast
+    if (!chart.current || !(0, exports.canUpdateInPlace)(prevOptions, options) || // timezone is a simple object so this comparison should be fast
     JSON.stringify(prevTimezone) !== JSON.stringify(timezone) || !props.themeKey && prevTheme !== themeKey || prevOnClick !== onClick) {
       needsInit.current = true;
     }
-    needsRedraw.current = true;
-    // need to immediately call drawChart upon an option or chartData change
+
+    needsRedraw.current = true; // need to immediately call drawChart upon an option or chartData change
     // otherwise a noop would occur if the onContainerMount drawChart is re-invoked when dimensions change
+
     drawChart();
   }, [JSON.stringify(options), JSON.stringify(chartData.toJSON()), JSON.stringify(chartData.annotations), timezone === null || timezone === void 0 ? void 0 : timezone.ianaTimezone, timezone === null || timezone === void 0 ? void 0 : timezone.utcOffset, timezone === null || timezone === void 0 ? void 0 : timezone.serializedTimezone, themeKey, onClick]);
   return React.createElement(ChartingContainer, {
@@ -556,6 +633,7 @@ var Charting = function Charting(props) {
     onResize: debouncedDrawChart
   }));
 };
+
 var defaultProps = {
   width: '100%',
   height: 250,
@@ -573,65 +651,70 @@ var defaultProps = {
   themeKey: null
 };
 Charting.propTypes = propTypes;
-Charting.defaultProps = defaultProps;
-// allow for early return in case of empty chartData while still following hook rules
+Charting.defaultProps = defaultProps; // allow for early return in case of empty chartData while still following hook rules
+
 var withEmptyChartMessage = function withEmptyChartMessage(Chart) {
   var Wrapper = function Wrapper(props) {
     var chartData = props.chartData;
+
     if (!chartData) {
       return React.createElement(Message_1.default, {
         message: (0, i18n_1._)('No DataSource'),
         level: "warning"
       });
     }
+
     if (chartData && !Object.keys(chartData).length) {
       return React.createElement(Message_1.default, {
         message: (0, i18n_1._)('No Result'),
         level: "info"
       });
     }
+
     return React.createElement(Chart, Object.assign({}, props));
   };
+
   Wrapper.displayName = 'ChartingWrapper';
   Wrapper.propTypes = propTypes;
   Wrapper.defaultProps = defaultProps;
   return Wrapper;
-};
-// export default Charting;
+}; // export default Charting;
+
+
 exports.default = withEmptyChartMessage(Charting);
 
 /***/ }),
-/* 43 */
+/* 54 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-color-palettes");
 
 /***/ }),
-/* 44 */
+/* 55 */
 /***/ (function(module, exports) {
 
 module.exports = require("react-event-listener");
 
 /***/ }),
-/* 45 */
+/* 56 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/i18n");
 
 /***/ }),
-/* 46 */
+/* 57 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/charting-bundle");
 
 /***/ }),
-/* 47 */
+/* 58 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes/useSplunkTheme");
 
 /***/ }),
-/* 48 */
+/* 59 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/themeUtils");