@splunk/visualizations 25.13.1 → 26.1.0

package/Sankey.js

@@ -87,7 +87,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 454);
+/******/ 	return __webpack_require__(__webpack_require__.s = 457);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -120,35 +120,54 @@ module.exports = require("@splunk/themes/variables");
 
 /***/ }),
 
-/***/ 110:
+/***/ 111:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
 var _toConsumableArray = __webpack_require__(8);
+
 var _slicedToArray = __webpack_require__(17);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DEFAULT_LINK_VALUE_INDEX = exports.DEFAULT_TARGET_INDEX = exports.DEFAULT_SOURCE_INDEX = exports.DEFAULT_CHART_HEIGHT = exports.DEFAULT_CHART_WIDTH = exports.CHART_MIN_HEIGHT = exports.CHART_MIN_WIDTH = exports.INACTIVE_OPACITY = exports.DEFAULT_NODE_OPACITY = exports.DEFAULT_LINK_OPACITY = exports.DEFAULT_SERIES_COLOR = exports.DEFAULT_LINK_COLOR = exports.DEFAULT_NODE_COLOR = exports.DEFAULT_FONT_FAMILY = exports.NODE_TEXT_FONT_SIZE = exports.DEFAULT_COLORS = void 0;
+
 var React = __webpack_require__(1);
+
 var react_1 = __webpack_require__(1);
+
 var T = __webpack_require__(0);
+
 var lodash_1 = __webpack_require__(3);
+
 var styled_components_1 = __webpack_require__(4);
+
 var Message_1 = __webpack_require__(10);
+
 var i18n_1 = __webpack_require__(2);
+
 var SizeAwareWrapper_1 = __webpack_require__(19);
+
 var style_1 = __webpack_require__(14);
-var visualization_color_palettes_1 = __webpack_require__(51);
-// eslint-disable-next-line camelcase
-var sankey_1 = __webpack_require__(455);
-var VizStyleWrapper_1 = __webpack_require__(72);
-var SankeyUtils_1 = __webpack_require__(133);
-var SankeyNode_1 = __webpack_require__(456);
-var SankeyLink_1 = __webpack_require__(457);
-var SankeyTooltip_1 = __webpack_require__(458);
+
+var visualization_color_palettes_1 = __webpack_require__(51); // eslint-disable-next-line camelcase
+
+
+var sankey_1 = __webpack_require__(458);
+
+var VizStyleWrapper_1 = __webpack_require__(73);
+
+var SankeyUtils_1 = __webpack_require__(134);
+
+var SankeyNode_1 = __webpack_require__(459);
+
+var SankeyLink_1 = __webpack_require__(460);
+
+var SankeyTooltip_1 = __webpack_require__(461);
+
 exports.DEFAULT_COLORS = {
   backgroundColor: '#ffffff',
   nodeTextColor: '#2c2c2c',
@@ -177,94 +196,139 @@ var SankeyContainer = styled_components_1.default.div.withConfig({
   displayName: "PureSankey__SankeyContainer",
   componentId: "sc-1r333qx-0"
 })(["overflow:hidden;", ";"], function (props) {
-  return style_1.toDimension(lodash_1.pick(props, ['width', 'height']));
+  return (0, style_1.toDimension)((0, lodash_1.pick)(props, ['width', 'height']));
 });
+
 var PureSankey = function PureSankey(props) {
   var width = props.width,
-    height = props.height,
-    columns = props.columns,
-    colorMode = props.colorMode,
-    nodeWidth = props.nodeWidth,
-    nodePadding = props.nodePadding,
-    resultLimit = props.resultLimit,
-    seriesColors = props.seriesColors,
-    linkColors = props.linkColors,
-    linkOpacity = props.linkOpacity,
-    linkValueField = props.linkValueField,
-    backgroundColor = props.backgroundColor,
-    nodeTextColor = props.nodeTextColor,
-    tooltipRowColor = props.tooltipRowColor,
-    tooltipLinkHeaderColor = props.tooltipLinkHeaderColor,
-    tooltipHeaderColor = props.tooltipHeaderColor;
+      height = props.height,
+      columns = props.columns,
+      columnsFromDataSource = props.columnsFromDataSource,
+      fields = props.fields,
+      colorMode = props.colorMode,
+      nodeWidth = props.nodeWidth,
+      nodePadding = props.nodePadding,
+      resultLimit = props.resultLimit,
+      seriesColors = props.seriesColors,
+      linkColors = props.linkColors,
+      linkOpacity = props.linkOpacity,
+      linkValueField = props.linkValueField,
+      backgroundColor = props.backgroundColor,
+      nodeTextColor = props.nodeTextColor,
+      tooltipRowColor = props.tooltipRowColor,
+      tooltipLinkHeaderColor = props.tooltipLinkHeaderColor,
+      tooltipHeaderColor = props.tooltipHeaderColor,
+      onNodeClick = props.onNodeClick,
+      onLinkClick = props.onLinkClick;
   var margin = {
     top: 17,
     right: 25,
     bottom: 17,
     left: 30
-  };
-  // This is to translate the svg's root g based on margin
+  }; // This is to translate the svg's root g based on margin
   // The y position is same as margin top & bottom
   // The x position is an avg of margin right & left
+
   var translatePos = {
     x: 28,
     y: 17
   };
-  var _react_1$useState = react_1.useState([]),
-    _react_1$useState2 = _slicedToArray(_react_1$useState, 2),
-    activeLinks = _react_1$useState2[0],
-    setActiveLinks = _react_1$useState2[1];
-  var _react_1$useState3 = react_1.useState([]),
-    _react_1$useState4 = _slicedToArray(_react_1$useState3, 2),
-    activeNodes = _react_1$useState4[0],
-    setActiveNodes = _react_1$useState4[1];
-  var _react_1$useState5 = react_1.useState(null),
-    _react_1$useState6 = _slicedToArray(_react_1$useState5, 2),
-    nodeHovered = _react_1$useState6[0],
-    setNodeHovered = _react_1$useState6[1];
-  var _react_1$useState7 = react_1.useState(null),
-    _react_1$useState8 = _slicedToArray(_react_1$useState7, 2),
-    hoveredNodeElement = _react_1$useState8[0],
-    setHoveredNodeElement = _react_1$useState8[1];
-  var _react_1$useState9 = react_1.useState(false),
-    _react_1$useState10 = _slicedToArray(_react_1$useState9, 2),
-    openNodeToolTip = _react_1$useState10[0],
-    setOpenNodeToolTip = _react_1$useState10[1];
-  var _react_1$useState11 = react_1.useState(null),
-    _react_1$useState12 = _slicedToArray(_react_1$useState11, 2),
-    hoveredLinkElement = _react_1$useState12[0],
-    setHoveredLinkElement = _react_1$useState12[1];
-  var _react_1$useState13 = react_1.useState(false),
-    _react_1$useState14 = _slicedToArray(_react_1$useState13, 2),
-    openLinkToolTip = _react_1$useState14[0],
-    setOpenLinkToolTip = _react_1$useState14[1];
-  var sankeyContainerElement = react_1.useRef(null);
-  var _react_1$useState15 = react_1.useState(exports.DEFAULT_CHART_WIDTH - margin.left - margin.right),
-    _react_1$useState16 = _slicedToArray(_react_1$useState15, 2),
-    sankeyWidth = _react_1$useState16[0],
-    setSankeyWidth = _react_1$useState16[1];
-  var _react_1$useState17 = react_1.useState(exports.DEFAULT_CHART_HEIGHT - margin.top - margin.bottom),
-    _react_1$useState18 = _slicedToArray(_react_1$useState17, 2),
-    sankeyHeight = _react_1$useState18[0],
-    setSankeyHeight = _react_1$useState18[1];
-  react_1.useEffect(function () {
+
+  var _ref = (0, react_1.useState)([]),
+      _ref2 = _slicedToArray(_ref, 2),
+      activeLinks = _ref2[0],
+      setActiveLinks = _ref2[1];
+
+  var _ref3 = (0, react_1.useState)([]),
+      _ref4 = _slicedToArray(_ref3, 2),
+      activeNodes = _ref4[0],
+      setActiveNodes = _ref4[1];
+
+  var _ref5 = (0, react_1.useState)(null),
+      _ref6 = _slicedToArray(_ref5, 2),
+      nodeHovered = _ref6[0],
+      setNodeHovered = _ref6[1];
+
+  var _ref7 = (0, react_1.useState)(null),
+      _ref8 = _slicedToArray(_ref7, 2),
+      hoveredNodeElement = _ref8[0],
+      setHoveredNodeElement = _ref8[1];
+
+  var _ref9 = (0, react_1.useState)(false),
+      _ref10 = _slicedToArray(_ref9, 2),
+      openNodeToolTip = _ref10[0],
+      setOpenNodeToolTip = _ref10[1];
+
+  var _ref11 = (0, react_1.useState)(null),
+      _ref12 = _slicedToArray(_ref11, 2),
+      hoveredLinkElement = _ref12[0],
+      setHoveredLinkElement = _ref12[1];
+
+  var _ref13 = (0, react_1.useState)(false),
+      _ref14 = _slicedToArray(_ref13, 2),
+      openLinkToolTip = _ref14[0],
+      setOpenLinkToolTip = _ref14[1];
+
+  var sankeyContainerElement = (0, react_1.useRef)(null);
+
+  var _ref15 = (0, react_1.useState)(exports.DEFAULT_CHART_WIDTH - margin.left - margin.right),
+      _ref16 = _slicedToArray(_ref15, 2),
+      sankeyWidth = _ref16[0],
+      setSankeyWidth = _ref16[1];
+
+  var _ref17 = (0, react_1.useState)(exports.DEFAULT_CHART_HEIGHT - margin.top - margin.bottom),
+      _ref18 = _slicedToArray(_ref17, 2),
+      sankeyHeight = _ref18[0],
+      setSankeyHeight = _ref18[1];
+
+  var handleNodeClick = (0, react_1.useCallback)(function (node) {
+    if (node) {
+      onNodeClick({
+        type: 'node.click',
+        payload: {
+          nodeValue: node.value,
+          nodeName: node.name
+        }
+      });
+    }
+  }, []);
+  var handleLinkClick = (0, react_1.useCallback)(function (link) {
+    if (link) {
+      var payload = {
+        name: linkValueField,
+        value: link.value
+      };
+      fields.forEach(function (field, idx) {
+        var rowToken = "row.".concat(field, ".value");
+        payload[rowToken] = columns[idx][link.index];
+      });
+      onLinkClick({
+        type: 'link.click',
+        payload: payload
+      });
+    }
+  }, [fields, columns, linkValueField]);
+  (0, react_1.useEffect)(function () {
     if (sankeyContainerElement && sankeyContainerElement.current) {
       var w = sankeyContainerElement.current.getBoundingClientRect().width;
       var h = sankeyContainerElement.current.getBoundingClientRect().height;
-      var sWidth = SankeyUtils_1.checkDigitsOnly(width) ? parseInt(width, 10) : w;
-      var sHeight = SankeyUtils_1.checkDigitsOnly(height) ? parseInt(height, 10) : h;
+      var sWidth = (0, SankeyUtils_1.checkDigitsOnly)(width) ? parseInt(width, 10) : w;
+      var sHeight = (0, SankeyUtils_1.checkDigitsOnly)(height) ? parseInt(height, 10) : h;
       setSankeyWidth(sWidth - margin.left - margin.right);
       setSankeyHeight(sHeight - margin.top - margin.bottom);
     }
   }, [width, height]);
-  var sankeyData = SankeyUtils_1.convertInputToSankeyDataFormat(columns, exports.DEFAULT_SOURCE_INDEX, exports.DEFAULT_TARGET_INDEX, exports.DEFAULT_LINK_VALUE_INDEX, resultLimit);
-  if (!sankeyData || !columns || !Array.isArray(columns) || columns.length < 3) {
+  var sankeyData = (0, SankeyUtils_1.convertInputToSankeyDataFormat)(columnsFromDataSource, exports.DEFAULT_SOURCE_INDEX, exports.DEFAULT_TARGET_INDEX, exports.DEFAULT_LINK_VALUE_INDEX, resultLimit);
+
+  if (!sankeyData || !columnsFromDataSource || !Array.isArray(columnsFromDataSource) || columnsFromDataSource.length < 3) {
     return React.createElement(Message_1.default, {
       width: width,
       height: height,
-      message: i18n_1._('Invalid data to render'),
+      message: (0, i18n_1._)('Invalid data to render'),
       level: "info"
     });
   }
+
   var sortAndAssignLinkIds = function sortAndAssignLinkIds(links) {
     links.sort(function (a, b) {
       return a.dy - b.dy;
@@ -274,18 +338,20 @@ var PureSankey = function PureSankey(props) {
       link.id = "link-".concat(link.source.index, "-").concat(link.target.index);
     });
   };
-  var d3sankey = sankey_1.d3_sankey().nodeWidth(nodeWidth).nodePadding(nodePadding).size([sankeyWidth, sankeyHeight]);
+
+  var d3sankey = (0, sankey_1.d3_sankey)().nodeWidth(nodeWidth).nodePadding(nodePadding).size([sankeyWidth, sankeyHeight]);
   var path = d3sankey.reversibleLink();
   d3sankey.nodes(sankeyData.nodes).links(sankeyData.links).layout(500);
   sortAndAssignLinkIds(sankeyData.links);
-  var nodeConnectionsMap = SankeyUtils_1.computeAllConnectedLinksToNodes(sankeyData.nodes, sankeyData.links);
-  var uniqCategory = SankeyUtils_1.getAllNodeNames(sankeyData);
-  var colorCategoryMapping = SankeyUtils_1.getColorCategoryMapping({
+  var nodeConnectionsMap = (0, SankeyUtils_1.computeAllConnectedLinksToNodes)(sankeyData.nodes, sankeyData.links);
+  var uniqCategory = (0, SankeyUtils_1.getAllNodeNames)(sankeyData);
+  var colorCategoryMapping = (0, SankeyUtils_1.getColorCategoryMapping)({
     category: uniqCategory,
     colorMode: colorMode,
     seriesColors: seriesColors,
     linkColors: linkColors
   });
+
   var resetStates = function resetStates() {
     setActiveLinks([]);
     setActiveNodes([]);
@@ -295,17 +361,20 @@ var PureSankey = function PureSankey(props) {
     setOpenLinkToolTip(false);
     setOpenNodeToolTip(false);
   };
-  var renderVisualization = function renderVisualization(_ref) {
-    var containerWidth = _ref.width,
-      containerHeight = _ref.height;
+
+  var renderVisualization = function renderVisualization(_ref19) {
+    var containerWidth = _ref19.width,
+        containerHeight = _ref19.height;
+
     if (containerWidth < exports.CHART_MIN_WIDTH || containerHeight < exports.CHART_MIN_HEIGHT) {
       return React.createElement(Message_1.default, {
         width: containerWidth,
         height: containerHeight,
-        message: i18n_1._('Too small to render content'),
+        message: (0, i18n_1._)('Too small to render content'),
         level: "info"
       });
     }
+
     var renderLinks = function renderLinks(links) {
       return links.map(function (link) {
         return React.createElement(SankeyLink_1.default, {
@@ -313,8 +382,8 @@ var PureSankey = function PureSankey(props) {
           activeLinks: activeLinks,
           linkOpacity: linkOpacity,
           path: path,
-          key: SankeyUtils_1.getLinkId(link),
-          "data-test": SankeyUtils_1.getLinkId(link),
+          key: (0, SankeyUtils_1.getLinkId)(link),
+          "data-test": (0, SankeyUtils_1.getLinkId)(link),
           colorCategoryMapping: colorCategoryMapping,
           colorMode: colorMode,
           handleMouseOver: function handleMouseOver(ev) {
@@ -326,17 +395,19 @@ var PureSankey = function PureSankey(props) {
           },
           handleMouseLeave: function handleMouseLeave() {
             resetStates();
-          }
+          },
+          handleLinkClick: handleLinkClick
         });
       });
     };
+
     var renderNodes = function renderNodes(nodes) {
       var chartWidth = typeof width === 'number' ? width : Number.parseInt(width, 10);
       return nodes.map(function (node) {
         return React.createElement(SankeyNode_1.default, {
           node: node,
-          key: SankeyUtils_1.getNodeId(node),
-          "data-test": SankeyUtils_1.getNodeId(node),
+          key: (0, SankeyUtils_1.getNodeId)(node),
+          "data-test": (0, SankeyUtils_1.getNodeId)(node),
           activeNodes: activeNodes,
           nodeWidth: nodeWidth,
           chartWidth: chartWidth,
@@ -353,10 +424,12 @@ var PureSankey = function PureSankey(props) {
           },
           handleMouseLeave: function handleMouseLeave() {
             return resetStates();
-          }
+          },
+          handleNodeClick: handleNodeClick
         });
       });
     };
+
     return React.createElement(VizStyleWrapper_1.default, {
       backgroundColor: backgroundColor,
       dataTestKey: "SankeyWrapper",
@@ -409,6 +482,7 @@ var PureSankey = function PureSankey(props) {
       tooltipHeaderColor: tooltipHeaderColor
     })))));
   };
+
   return React.createElement(SankeyContainer, {
     height: height,
     width: width,
@@ -417,8 +491,11 @@ var PureSankey = function PureSankey(props) {
     return renderVisualization(containerDimension);
   }));
 };
+
 PureSankey.propTypes = {
   columns: T.array,
+  columnsFromDataSource: T.array,
+  fields: T.array,
   width: T.oneOfType([T.string, T.number]),
   height: T.oneOfType([T.string, T.number]),
   // need this to satisfy props interface
@@ -439,7 +516,9 @@ PureSankey.propTypes = {
   tooltipHeaderColor: T.string
 };
 PureSankey.defaultProps = {
+  columnsFromDataSource: [],
   columns: [],
+  fields: [],
   width: exports.DEFAULT_CHART_WIDTH,
   height: exports.DEFAULT_CHART_HEIGHT,
   mode: 'view',
@@ -455,7 +534,9 @@ PureSankey.defaultProps = {
   nodeTextColor: 'rgba(255, 255, 255, 0.98)',
   tooltipRowColor: 'rgba(255, 255, 255, 0.98)',
   tooltipLinkHeaderColor: 'rgba(255, 255, 255, 0.98)',
-  tooltipHeaderColor: 'rgba(255, 255, 255, 0.5)'
+  tooltipHeaderColor: 'rgba(255, 255, 255, 0.5)',
+  onNodeClick: lodash_1.noop,
+  onLinkClick: lodash_1.noop
 };
 exports.default = PureSankey;
 
@@ -477,40 +558,46 @@ module.exports = require("@splunk/visualizations-shared/colorUtils");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
 var styled_components_1 = __webpack_require__(4);
+
 var SizeAwareWrapper_1 = __webpack_require__(19);
+
 var style_1 = __webpack_require__(14);
+
 var colorUtils_1 = __webpack_require__(12);
+
 var Item = styled_components_1.default.div.attrs(function (_ref) {
   var width = _ref.width;
   return {
     style: {
-      width: style_1.toPx(width)
+      width: (0, style_1.toPx)(width)
     }
   };
 }).withConfig({
   displayName: "FixedSizeContainer__Item",
   componentId: "sc-1yhgpod-0"
 })(["position:relative;background-color:", "};"], function (props) {
-  return colorUtils_1.isColor(props.backgroundColor) && props.backgroundColor || props.theme.defaultBackgroundColor;
-});
-// Use `.attrs()` for highly dynamic styles. Ref: https://github.com/styled-components/styled-components/issues/134#issuecomment-312415291
+  return (0, colorUtils_1.isColor)(props.backgroundColor) && props.backgroundColor || props.theme.defaultBackgroundColor;
+}); // Use `.attrs()` for highly dynamic styles. Ref: https://github.com/styled-components/styled-components/issues/134#issuecomment-312415291
+
 var FixSizeItem = styled_components_1.default.div.attrs(function (_ref2) {
   var width = _ref2.width,
-    height = _ref2.height;
+      height = _ref2.height;
   return {
     style: Object.assign(Object.assign({}, width && {
-      width: style_1.toPx(width)
+      width: (0, style_1.toPx)(width)
     }), height && {
-      height: style_1.toPx(height)
+      height: (0, style_1.toPx)(height)
     })
   };
 }).withConfig({
   displayName: "FixedSizeContainer__FixSizeItem",
   componentId: "sc-1yhgpod-1"
 })(["position:relative;flex-direction:column;flex:1;display:flex;background-color:", "};"], function (props) {
-  return colorUtils_1.isColor(props.backgroundColor) && props.backgroundColor || props.theme.defaultBackgroundColor;
+  return (0, colorUtils_1.isColor)(props.backgroundColor) && props.backgroundColor || props.theme.defaultBackgroundColor;
 });
 var ItemContent = styled_components_1.default.div.withConfig({
   displayName: "FixedSizeContainer__ItemContent",
@@ -520,11 +607,13 @@ var FixSizeItemContent = styled_components_1.default.div.withConfig({
   displayName: "FixedSizeContainer__FixSizeItemContent",
   componentId: "sc-1yhgpod-3"
 })(["min-height:0px;flex:1;position:relative;box-sizing:border-box;"]);
+
 var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
   var FixedSizeContainer = function FixedSizeContainer(props) {
     var width = props.width,
-      height = props.height,
-      backgroundColor = props.backgroundColor;
+        height = props.height,
+        backgroundColor = props.backgroundColor;
+
     if (!height) {
       return React.createElement(Item, {
         "data-test": "item",
@@ -532,29 +621,32 @@ var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
         backgroundColor: backgroundColor
       }, React.createElement(ItemContent, null, React.createElement(Viz, Object.assign({}, props))));
     }
+
     return React.createElement(FixSizeItem, {
       "data-test": "fix-size-item",
-      "data-splunk-visualization-version": "25.13.1 - ea48ec41e",
+      "data-splunk-visualization-version": "26.1.0 - fc8bf8d77",
       width: width,
       height: height,
       backgroundColor: backgroundColor
     }, React.createElement(FixSizeItemContent, null, React.createElement(SizeAwareWrapper_1.default, null, function (_ref3) {
       var newWidth = _ref3.width,
-        newHeight = _ref3.height;
+          newHeight = _ref3.height;
       return React.createElement(Viz, Object.assign({}, props, {
         width: newWidth,
         height: newHeight
       }));
     })));
   };
+
   FixedSizeContainer.displayName = 'withFixedSizeContainer';
   return FixedSizeContainer;
 };
+
 exports.default = withFixedSizeContainer;
 
 /***/ }),
 
-/***/ 133:
+/***/ 134:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -565,16 +657,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.truncateSVGTextWithEllipsis = exports.checkDigitsOnly = exports.computeAllConnectedLinksToNodes = exports.getAllConnectedLinks = exports.extractLinkMidPoint = exports.getAllNodeNames = exports.getLinkId = exports.getNodeId = exports.convertInputToSankeyDataFormat = exports.getColorCategoryMapping = exports.getNodesIndex = void 0;
 /* eslint-disable no-param-reassign */
-var d3_scale_1 = __webpack_require__(91);
-var types_1 = __webpack_require__(94);
+
+var d3_scale_1 = __webpack_require__(93);
+
+var types_1 = __webpack_require__(83);
+
 var insertNodeIfNotExist = function insertNodeIfNotExist(sankeyData, nodeName) {
   var nodes = sankeyData.nodes;
   nodes = nodes || [];
+
   if (typeof nodeName !== 'string') {
     console.error('Node not created, invalid nodename:', nodeName);
     return;
   }
+
   nodeName = nodeName.trim();
+
   if (!nodes.find(function (node) {
     return node.name.toLocaleLowerCase() === nodeName.toLocaleLowerCase();
   })) {
@@ -583,6 +681,7 @@ var insertNodeIfNotExist = function insertNodeIfNotExist(sankeyData, nodeName) {
     });
   }
 };
+
 var insertLink = function insertLink(sankeyData, sourceFieldIdx, targetFieldIdx, linkValue, index) {
   var links = sankeyData.links;
   links = links || [];
@@ -593,49 +692,60 @@ var insertLink = function insertLink(sankeyData, sourceFieldIdx, targetFieldIdx,
     index: index
   });
 };
+
 var getNodesIndex = function getNodesIndex(sankeyData, nodeName) {
   if (!sankeyData || !sankeyData.nodes || !sankeyData.nodes.length) {
     return -1;
   }
+
   return sankeyData.nodes.findIndex(function (node) {
     return node.name.toLocaleLowerCase() === nodeName.toLocaleLowerCase();
   });
 };
+
 exports.getNodesIndex = getNodesIndex;
+
 var getColorCategoryMapping = function getColorCategoryMapping(_ref) {
   var category = _ref.category,
-    colorMode = _ref.colorMode,
-    seriesColors = _ref.seriesColors,
-    linkColors = _ref.linkColors;
+      colorMode = _ref.colorMode,
+      seriesColors = _ref.seriesColors,
+      linkColors = _ref.linkColors;
+
   if (colorMode !== 'categorical') {
     return linkColors;
   }
-  return seriesColors ? d3_scale_1.scaleOrdinal().domain(category).range(seriesColors).unknown(seriesColors[0]) : null;
+
+  return seriesColors ? (0, d3_scale_1.scaleOrdinal)().domain(category).range(seriesColors).unknown(seriesColors[0]) : null;
 };
+
 exports.getColorCategoryMapping = getColorCategoryMapping;
+
 var convertInputToSankeyDataFormat = function convertInputToSankeyDataFormat(columns, sourceFieldIdx, targetFieldIdx, linkValueFieldIdx, resultLimit) {
   if (!columns || !Array.isArray(columns) || !columns.length || !columns[sourceFieldIdx] || !columns[targetFieldIdx] || !columns[linkValueFieldIdx] || columns.length < 3 || !Array.isArray(columns[sourceFieldIdx]) || !Array.isArray(columns[targetFieldIdx]) || !Array.isArray(columns[linkValueFieldIdx]) || !columns[sourceFieldIdx] || typeof columns[sourceFieldIdx][0] !== 'string' || !columns[targetFieldIdx] || typeof columns[targetFieldIdx][0] !== 'string') {
     return null;
   }
+
   var sankeyData = {
     nodes: [],
     links: []
   };
   var maxlen = Math.min(columns[sourceFieldIdx].length, columns[targetFieldIdx].length, columns[linkValueFieldIdx].length, resultLimit);
+
   for (var i = 0; i < maxlen; i += 1) {
-    if (typeof columns[sourceFieldIdx][i] === 'string' && typeof columns[targetFieldIdx][i] === 'string' && types_1.isNumber(columns[linkValueFieldIdx][i])) {
+    if (typeof columns[sourceFieldIdx][i] === 'string' && typeof columns[targetFieldIdx][i] === 'string' && (0, types_1.isNumber)(columns[linkValueFieldIdx][i])) {
       (function () {
         var sourceNodeName = columns[sourceFieldIdx][i].trim();
         var targetNodeName = columns[targetFieldIdx][i].trim();
         insertNodeIfNotExist(sankeyData, sourceNodeName);
-        insertNodeIfNotExist(sankeyData, targetNodeName);
-        // If same link exists then sum up the value and donot insert new link
-        var sourceNodeIdx = exports.getNodesIndex(sankeyData, sourceNodeName);
-        var targetNodeIdx = exports.getNodesIndex(sankeyData, targetNodeName);
+        insertNodeIfNotExist(sankeyData, targetNodeName); // If same link exists then sum up the value and donot insert new link
+
+        var sourceNodeIdx = (0, exports.getNodesIndex)(sankeyData, sourceNodeName);
+        var targetNodeIdx = (0, exports.getNodesIndex)(sankeyData, targetNodeName);
         var linkExist = sankeyData.links.find(function (link) {
           return link.source === sourceNodeIdx && link.target === targetNodeIdx;
         });
         var linkValue = +columns[linkValueFieldIdx][i];
+
         if (linkExist) {
           linkExist.value += linkValue;
         } else {
@@ -646,53 +756,70 @@ var convertInputToSankeyDataFormat = function convertInputToSankeyDataFormat(col
       console.error('Link excluded. Invalid type in column input, row :- ', i, "[".concat(columns[sourceFieldIdx][i], ", ").concat(columns[targetFieldIdx][i], ", ").concat(columns[linkValueFieldIdx][i], "]"));
     }
   }
+
   return sankeyData;
 };
+
 exports.convertInputToSankeyDataFormat = convertInputToSankeyDataFormat;
+
 var getNodeId = function getNodeId(node) {
   if (!node) {
     return '';
   }
+
   return "node-".concat(node.index);
 };
+
 exports.getNodeId = getNodeId;
+
 var getLinkId = function getLinkId(link) {
   if (!link) {
     return '';
   }
+
   return "link-".concat(link.id);
 };
+
 exports.getLinkId = getLinkId;
+
 var getAllNodeNames = function getAllNodeNames(sankeyData) {
   if (!sankeyData || !sankeyData.nodes || !sankeyData.nodes.length) {
     return [];
   }
+
   return sankeyData.nodes.map(function (node) {
     return node.name;
   });
 };
+
 exports.getAllNodeNames = getAllNodeNames;
+
 var extractLinkMidPoint = function extractLinkMidPoint(pathStr) {
   if (!pathStr) {
     return null;
   }
+
   var mIndex = pathStr.indexOf('M');
   var cIndexFirst = pathStr.indexOf('C');
   var lIndex = pathStr.indexOf('L');
   var cIndexLast = pathStr.lastIndexOf('C');
   var zIndex = pathStr.lastIndexOf('Z');
+
   if (mIndex < 0 || cIndexLast < 0 || cIndexLast < 0 || zIndex < 0) {
     console.error('Extract link midpoint error. Invalid path -', pathStr);
     return null;
   }
+
   var section1 = pathStr.slice(mIndex + 1, cIndexFirst).trim();
   var section2 = pathStr.slice(cIndexFirst + 1, lIndex).trim();
   var section3 = pathStr.slice(lIndex + 1, cIndexLast).trim();
   var section4 = pathStr.slice(cIndexLast + 1, zIndex).trim();
+
   if (!section1.length || !section2.length || !section3.length || !section4.length) {
     console.error('Extract link midpoint error. Invalid path -', pathStr);
     return null;
   }
+
   var points = [];
   points.push(section1.split(',').map(function (i) {
     return Number.parseFloat(i);
@@ -717,33 +844,42 @@ var extractLinkMidPoint = function extractLinkMidPoint(pathStr) {
     y: y
   };
 };
+
 exports.extractLinkMidPoint = extractLinkMidPoint;
+
 var getAllConnectedLinks = function getAllConnectedLinks(links, nodeIdx) {
   var result = {
     links: [],
     sourceNodes: [],
     targetNodes: []
   };
+
   if (!links || !links.length) {
     return result;
   }
+
   links.forEach(function (link) {
     if (link.source.index === nodeIdx || link.target.index === nodeIdx) {
       var linkAdded = result.links.find(function (l) {
         return l.id === link.id;
       });
+
       if (!linkAdded) {
         result.links.push(link);
       }
+
       var sourceNodeAdded = result.sourceNodes.find(function (n) {
         return n.index === link.source.index;
       });
+
       if (!sourceNodeAdded) {
         result.sourceNodes.push(link.source);
       }
+
       var targetNodeAdded = result.targetNodes.find(function (n) {
         return n.index === link.target.index;
       });
+
       if (!targetNodeAdded) {
         result.targetNodes.push(link.target);
       }
@@ -751,28 +887,35 @@ var getAllConnectedLinks = function getAllConnectedLinks(links, nodeIdx) {
   });
   return result;
 };
+
 exports.getAllConnectedLinks = getAllConnectedLinks;
+
 var computeAllConnectedLinksToNodes = function computeAllConnectedLinksToNodes(nodes, links) {
   var connectionsMap = {};
+
   if (!nodes || !links) {
     return connectionsMap;
   }
+
   nodes.forEach(function (node) {
-    var connections = exports.getAllConnectedLinks(links, node.index);
+    var connections = (0, exports.getAllConnectedLinks)(links, node.index);
     connectionsMap[node.index] = connections;
   });
   return connectionsMap;
 };
+
 exports.computeAllConnectedLinksToNodes = computeAllConnectedLinksToNodes;
+
 var checkDigitsOnly = function checkDigitsOnly(input) {
   return /^\d+$/.test(input);
 };
-exports.checkDigitsOnly = checkDigitsOnly;
-// Truncate the node text and show ellipsis at the end if text string width exceeds the max limit
+
+exports.checkDigitsOnly = checkDigitsOnly; // Truncate the node text and show ellipsis at the end if text string width exceeds the max limit
+
 var truncateSVGTextWithEllipsis = function truncateSVGTextWithEllipsis(textElement, textString, width) {
   if (textElement && textElement.getSubStringLength !== undefined) {
-    textElement.textContent = textString;
-    // ellipsis is needed
+    textElement.textContent = textString; // ellipsis is needed
+
     if (textElement.getSubStringLength(0, textString.length) >= width) {
       for (var x = textString.length - 3; x > 0; x -= 3) {
         if (textElement.getSubStringLength(0, x) <= width) {
@@ -780,6 +923,7 @@ var truncateSVGTextWithEllipsis = function truncateSVGTextWithEllipsis(textEleme
           return;
         }
       }
+
       textElement.textContent = '...'; // can't place at all
     }
   }
@@ -789,24 +933,24 @@ exports.truncateSVGTextWithEllipsis = truncateSVGTextWithEllipsis;
 
 /***/ }),
 
-/***/ 138:
+/***/ 14:
 /***/ (function(module, exports) {
 
-module.exports = require("d3-interpolate");
+module.exports = require("@splunk/visualizations-shared/style");
 
 /***/ }),
 
-/***/ 139:
+/***/ 140:
 /***/ (function(module, exports) {
 
-module.exports = require("d3-collection");
+module.exports = require("d3-interpolate");
 
 /***/ }),
 
-/***/ 14:
+/***/ 141:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/style");
+module.exports = require("d3-collection");
 
 /***/ }),
 
@@ -826,9 +970,10 @@ exports.extendStaticWrapperProps = void 0;
  * @param {DashboardVizType} props.Wrapper
  * @param {DashboardVizType} props.Visualization
  */
+
 var extendStaticWrapperProps = function extendStaticWrapperProps(_ref) {
   var Wrapper = _ref.Wrapper,
-    Visualization = _ref.Visualization;
+      Visualization = _ref.Visualization;
   var extendProperties = ['propTypes', 'defaultProps', 'config'];
   extendProperties.forEach(function (prop) {
     if (Visualization[prop]) {
@@ -837,6 +982,7 @@ var extendStaticWrapperProps = function extendStaticWrapperProps(_ref) {
     }
   });
 };
+
 exports.extendStaticWrapperProps = extendStaticWrapperProps;
 
 /***/ }),
@@ -848,93 +994,129 @@ module.exports = require("@splunk/visualizations-shared/schemaUtils");
 
 /***/ }),
 
-/***/ 163:
+/***/ 166:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _typeof = __webpack_require__(93);
+var _typeof = __webpack_require__(82);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PureSankey = exports.config = exports.themes = exports.computeVizProps = exports.showPlaceHolderIcon = void 0;
+
 var lodash_1 = __webpack_require__(3);
-var dataSourceUtils_1 = __webpack_require__(96);
+
+var dataSourceUtils_1 = __webpack_require__(97);
+
 var colorUtils_1 = __webpack_require__(12);
-var withDashboardViz_1 = __webpack_require__(36);
-var PureSankey_1 = __webpack_require__(110);
+
+var withDashboardViz_1 = __webpack_require__(37);
+
+var PureSankey_1 = __webpack_require__(111);
+
 exports.PureSankey = PureSankey_1.default;
-var config_1 = __webpack_require__(459);
+
+var config_1 = __webpack_require__(462);
+
 exports.config = config_1.default;
 /**
  * @method showPlaceHolderIcon
  * @param {Object} dataSources
  * @returns {Boolean} return true if loading, error, non existent state or without columns in dataSources
  */
+
 var showPlaceHolderIcon = function showPlaceHolderIcon(dataSources) {
-  var columns = lodash_1.get(dataSources, 'primary.data.columns', undefined);
+  var columns = (0, lodash_1.get)(dataSources, 'primary.data.columns', undefined);
   var noColumns = columns === undefined;
-  var dataSourceState = dataSourceUtils_1.getDataSourceStateInfo(dataSources);
+  var dataSourceState = (0, dataSourceUtils_1.getDataSourceStateInfo)(dataSources);
   return dataSourceState === dataSourceUtils_1.DataSourceState.ERROR || dataSourceState === dataSourceUtils_1.DataSourceState.LOADING || dataSourceState === dataSourceUtils_1.DataSourceState.NONEXISTENT || noColumns;
 };
+
 exports.showPlaceHolderIcon = showPlaceHolderIcon;
+
 var computeVizProps = function computeVizProps(_ref) {
   var themeFunc = _ref.themeFunc,
-    dataSources = _ref.dataSources,
-    linkValues = _ref.linkValues,
-    seriesColors = _ref.seriesColors,
-    linkColors = _ref.linkColors;
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-  // Compute all themeColor variables needed for PureSankey
+      dataSources = _ref.dataSources,
+      linkValues = _ref.linkValues,
+      seriesColors = _ref.seriesColors,
+      linkColors = _ref.linkColors,
+      onNodeClick = _ref.onNodeClick,
+      onLinkClick = _ref.onLinkClick;
+
+  var _a, _b, _c, _d, _e; // Compute all themeColor variables needed for PureSankey
+
+
   var themeColorVariables = ['defaultBackgroundColor', 'nodeTextColor', 'tooltipRowColor', 'tooltipLinkHeaderColor', 'tooltipHeaderColor'];
   var themeColors = {};
   themeColorVariables.forEach(function (variable) {
     themeColors[variable] = themeFunc(variable);
-  });
-  // Sanitize linkColors prop
+  }); // Sanitize linkColors prop
   // eslint-disable-next-line no-param-reassign
-  linkColors = colorUtils_1.sanitizeArrayOfColors(linkColors);
-  // Sanitize seriesColors prop
+
+  linkColors = (0, colorUtils_1.sanitizeArrayOfColors)(linkColors); // Sanitize seriesColors prop
   // (Note:- This is handled outside SanitizeProps because it would impact seriesColors option used in splunk-charting viz as the types are different.
   // The type used in splunk-charting viz expects a string of comma separated colors, but here the type is an array of string)
   // eslint-disable-next-line no-param-reassign
-  seriesColors = colorUtils_1.isArrayOfColors(seriesColors) ? seriesColors : undefined;
-  // Compute the columns props and linkValueField props for pure Sankey
+
+  seriesColors = (0, colorUtils_1.isArrayOfColors)(seriesColors) ? seriesColors : undefined; // Compute the columns props and linkValueField props for pure Sankey
   // The columns props is computed as [primary.data.columns[0], primary.data.columns[1], linkValues].
   // The source and target columns are the default as columns[0] and columns[1] respectively
   // The linkValueField props is the fieldName which is set as the source of linkValues
+
+  var _dataSources$primary$ = dataSources.primary.data,
+      columns = _dataSources$primary$.columns,
+      fields = _dataSources$primary$.fields;
   var columnsFromDataSource = [];
   var linkValueField = '';
+  var fieldNames = [];
+
   if (((_b = (_a = dataSources === null || dataSources === void 0 ? void 0 : dataSources.primary) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.columns) && ((_e = (_d = (_c = dataSources === null || dataSources === void 0 ? void 0 : dataSources.primary) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.columns) === null || _e === void 0 ? void 0 : _e.length) >= 2 && Array.isArray(linkValues)) {
-    var columns = dataSources.primary.data.columns;
     columnsFromDataSource = columns ? [columns[0], columns[1], linkValues] : null;
     var linkIndex = columns.findIndex(function (col) {
-      return lodash_1.isEqual(col, linkValues);
+      return (0, lodash_1.isEqual)(col, linkValues);
     });
-    if ((_g = (_f = dataSources === null || dataSources === void 0 ? void 0 : dataSources.primary) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.fields) {
-      var linkField = (_j = (_h = dataSources === null || dataSources === void 0 ? void 0 : dataSources.primary) === null || _h === void 0 ? void 0 : _h.data) === null || _j === void 0 ? void 0 : _j.fields[linkIndex];
-      if (_typeof(linkField) === 'object' && linkField !== null) {
-        linkValueField = linkField.name;
-      } else {
-        linkValueField = linkField !== null && linkField !== void 0 ? linkField : '';
-      }
+
+    if (fields) {
+      fields.forEach(function (field, idx) {
+        var fieldName = '';
+
+        if (_typeof(field) === 'object' && field !== null) {
+          fieldName = field.name;
+        } else {
+          fieldName = field !== null && field !== void 0 ? field : '';
+        }
+
+        if (idx === linkIndex) {
+          linkValueField = fieldName;
+        }
+
+        fieldNames.push(fieldName);
+      });
     }
   }
+
   return Object.assign(Object.assign({}, themeColors), {
-    columns: columnsFromDataSource,
+    columns: columns,
+    fields: fieldNames,
+    columnsFromDataSource: columnsFromDataSource,
     linkValueField: linkValueField,
     seriesColors: seriesColors,
-    linkColors: linkColors
+    linkColors: linkColors,
+    onNodeClick: onNodeClick,
+    onLinkClick: onLinkClick
   });
 };
+
 exports.computeVizProps = computeVizProps;
-var Sankey = withDashboardViz_1.default({
+var Sankey = (0, withDashboardViz_1.default)({
   ReactViz: PureSankey_1.default,
   vizConfig: config_1.default,
   computeVizProps: exports.computeVizProps,
   useIconPlaceholder: function useIconPlaceholder(dataSources) {
-    return exports.showPlaceHolderIcon(dataSources);
+    return (0, exports.showPlaceHolderIcon)(dataSources);
   }
 });
 var themes = config_1.default.themes;
@@ -978,24 +1160,33 @@ module.exports = require("@splunk/ui-utils/i18n");
 
 
 var _toConsumableArray = __webpack_require__(8);
+
 var _defineProperty = __webpack_require__(7);
+
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
+
   for (var p in s) {
     if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   }
+
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.insertLayout = exports.isDynamicOption = exports.uncollapseEditorConfig = exports.generatePrecisionValues = exports.getInitialPreset = exports.enhanceOptionsSchemaWithDynamicOptions = exports.enhanceConfig = void 0;
+
 var lodash_1 = __webpack_require__(3);
+
 var schemaUtils_1 = __webpack_require__(16);
+
 var VizBehavior_1 = __webpack_require__(6);
+
 var dynamicOptionsDSLType = {
   type: 'string',
   pattern: schemaUtils_1.DYNAMIC_OPTIONS_DSL_PATTERN
@@ -1005,20 +1196,22 @@ var dynamicOptionsDSLType = {
  * @param optionsSchema a visualization's options schema
  * @returns an updated options schema that additionally allows strings starting with > for each option
  */
+
 function enhanceOptionsSchemaWithDynamicOptions(optionsSchema) {
   var enhancedOptionsSchema = {};
   Object.keys(optionsSchema).forEach(function (key) {
     var _a = optionsSchema[key],
-      title = _a.title,
-      description = _a.description,
-      readOnly = _a.readOnly,
-      writeOnly = _a.writeOnly,
-      examples = _a.examples,
-      defaultValue = _a.default,
-      type = _a.type,
-      properties = _a.properties,
-      patternProperties = _a.patternProperties,
-      remainingSchemaEntry = __rest(_a, ["title", "description", "readOnly", "writeOnly", "examples", "default", "type", "properties", "patternProperties"]);
+        title = _a.title,
+        description = _a.description,
+        readOnly = _a.readOnly,
+        writeOnly = _a.writeOnly,
+        examples = _a.examples,
+        defaultValue = _a.default,
+        type = _a.type,
+        properties = _a.properties,
+        patternProperties = _a.patternProperties,
+        remainingSchemaEntry = __rest(_a, ["title", "description", "readOnly", "writeOnly", "examples", "default", "type", "properties", "patternProperties"]);
+
     var annotations = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, title !== undefined && {
       title: title
     }), description !== undefined && {
@@ -1032,12 +1225,14 @@ function enhanceOptionsSchemaWithDynamicOptions(optionsSchema) {
     }), defaultValue !== undefined && {
       default: defaultValue
     });
+
     if (type === 'object') {
       enhancedOptionsSchema[key] = Object.assign(Object.assign(Object.assign(Object.assign({}, remainingSchemaEntry), annotations), {
         type: type
       }), properties && {
         properties: enhanceOptionsSchemaWithDynamicOptions(properties)
       });
+
       if (patternProperties) {
         var enhancedPatternProperties = {};
         Object.keys(patternProperties).forEach(function (opt) {
@@ -1055,6 +1250,7 @@ function enhanceOptionsSchemaWithDynamicOptions(optionsSchema) {
   });
   return enhancedOptionsSchema;
 }
+
 exports.enhanceOptionsSchemaWithDynamicOptions = enhanceOptionsSchemaWithDynamicOptions;
 /**
  * Helper function to enhance a Visualization Config as needed based on behaviors specified in supports block
@@ -1063,11 +1259,14 @@ exports.enhanceOptionsSchemaWithDynamicOptions = enhanceOptionsSchemaWithDynamic
  * @returns an enhanced Visualization Config containing updated config entries based on behaviors it supports
  * and containing `open: false` for all editor panels in editorConfig
  */
+
 function enhanceConfig(vizConfig) {
   var enhancedConfig = Object.assign({}, vizConfig);
+
   if (vizConfig.supports.indexOf(VizBehavior_1.VizBehavior.DYNAMIC_OPTIONS) !== -1) {
     enhancedConfig.optionsSchema = enhanceOptionsSchemaWithDynamicOptions(vizConfig.optionsSchema);
   }
+
   enhancedConfig.editorConfig = vizConfig.editorConfig.map(function (config) {
     return Object.assign(Object.assign({}, config), {
       open: config.open || false
@@ -1075,6 +1274,7 @@ function enhanceConfig(vizConfig) {
   });
   return enhancedConfig;
 }
+
 exports.enhanceConfig = enhanceConfig;
 /**
  * Helper function to uncollapse all editor panels by adding `open: true` to the editorConfig
@@ -1082,6 +1282,7 @@ exports.enhanceConfig = enhanceConfig;
  * @param vizConfig a Visualization Config
  * @returns a Visualization Config containing `open: true` for all editor panels in editorConfig
  */
+
 function uncollapseEditorConfig(vizConfig) {
   var editorPanelUncollapsedConfig = Object.assign({}, vizConfig);
   editorPanelUncollapsedConfig.editorConfig = vizConfig.editorConfig.map(function (config) {
@@ -1091,13 +1292,16 @@ function uncollapseEditorConfig(vizConfig) {
   });
   return editorPanelUncollapsedConfig;
 }
+
 exports.uncollapseEditorConfig = uncollapseEditorConfig;
+
 function isDynamicOption(option) {
   return option && typeof option === 'string' && option.trim().startsWith('>') || false;
 }
-exports.isDynamicOption = isDynamicOption;
-// private helpers to improve readability of getInitialPreset
+
+exports.isDynamicOption = isDynamicOption; // private helpers to improve readability of getInitialPreset
 // this shouldn't be tested since this util isn't something that we expect to use outside of getInitialPreset
+
 /**
  * this checks to make sure that all values within vizContext are compatible with the given preset's context to determine the initialPreset
  * if a preset has explicitly specified a key as being undefined, the vizContext must also has that key as undefined, or else this CANNOT be the initialPreset
@@ -1106,6 +1310,7 @@ exports.isDynamicOption = isDynamicOption;
  *
  * Since the presetConfigs have explicit undefined keys to override the existing config, we need to explicitly check the undefined values
  */
+
 function hasCompatibleContexts(vizContext, presetContext) {
   var presetContextKeys = Object.keys(presetContext);
   return presetContextKeys.every(function (contextKey) {
@@ -1115,6 +1320,8 @@ function hasCompatibleContexts(vizContext, presetContext) {
 /**
  * Checks to make sure that dynamic (non-dynamic) options in a given preset are also dynamic (non-dynamic) in the vizOptions
  */
+
+
 function hasCompatibleOptions(vizOptions, presetOptions) {
   var presetOptionKeys = Object.keys(presetOptions);
   return presetOptionKeys.every(function (optionKey) {
@@ -1129,18 +1336,21 @@ function hasCompatibleOptions(vizOptions, presetOptions) {
  * @param {Object} vizOptions - the current vizOptions definition
  * @param {PresetEntry[]} presets - the list of presets, one of which can be considered an initialPreset
  */
+
+
 function getInitialPreset(vizContext, vizOptions, presets) {
   return presets.find(function (preset) {
-    var presetContext = lodash_1.get(preset, ['value', 'context'], {});
-    var presetOptions = lodash_1.get(preset, ['value', 'options'], {});
+    var presetContext = (0, lodash_1.get)(preset, ['value', 'context'], {});
+    var presetOptions = (0, lodash_1.get)(preset, ['value', 'options'], {});
     var presetContextKeys = Object.keys(presetContext);
-    var presetOptionKeys = Object.keys(presetOptions);
-    // all presets have to explicitly specify which options to reset (i.e. need explicitly undefined keys)
+    var presetOptionKeys = Object.keys(presetOptions); // all presets have to explicitly specify which options to reset (i.e. need explicitly undefined keys)
     // if not, then the preset is invalid in config.ts
+
     if (presetContextKeys.length === 0 || presetOptionKeys.length === 0) return false;
     return hasCompatibleContexts(vizContext, presetContext) && hasCompatibleOptions(vizOptions, presetOptions);
   });
 }
+
 exports.getInitialPreset = getInitialPreset;
 /**
  * generates number precision values for a Select editor
@@ -1148,14 +1358,16 @@ exports.getInitialPreset = getInitialPreset;
  * @param {Number} numPrecisionValues - number of integer precision values to generate
  * @returns {{ label: string; value; string  }[]} array of { label, value } tuples
  */
+
 function generatePrecisionValues(numPrecisionValues) {
-  return lodash_1.range(0, numPrecisionValues + 1).map(function (i) {
+  return (0, lodash_1.range)(0, numPrecisionValues + 1).map(function (i) {
     return {
       label: "".concat(i, " (0").concat(i > 0 ? '.' : '').concat('0'.repeat(i), ")"),
       value: i
     };
   });
 }
+
 exports.generatePrecisionValues = generatePrecisionValues;
 /**
  * insert layout in layout array, return a new layout array instead of updating the original
@@ -1165,12 +1377,15 @@ exports.generatePrecisionValues = generatePrecisionValues;
  * @param {EditorLayoutConfig[][]} layoutItems - the item(s) to insert
  * @returns {EditorLayoutConfig[][]} new editor layout with insertion
  */
+
 var insertLayout = function insertLayout(layout, index) {
   for (var _len = arguments.length, layoutItems = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
     layoutItems[_key - 2] = arguments[_key];
   }
+
   return [].concat(_toConsumableArray(layout.slice(0, index)), layoutItems, _toConsumableArray(layout.slice(index)));
 };
+
 exports.insertLayout = insertLayout;
 
 /***/ }),
@@ -1192,28 +1407,28 @@ module.exports = require("@splunk/visualizations-shared/configUtils");
 /***/ 25:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualization-context/TimezoneContext");
+module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
 
 /***/ 26:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/hocUtils");
+module.exports = require("@splunk/visualization-context/TimezoneContext");
 
 /***/ }),
 
 /***/ 27:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/JSONSchemaUtils");
+module.exports = require("@splunk/visualizations-shared/hocUtils");
 
 /***/ }),
 
-/***/ 29:
+/***/ 28:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualization-encoding/Options");
+module.exports = require("@splunk/visualizations-shared/JSONSchemaUtils");
 
 /***/ }),
 
@@ -1227,11 +1442,18 @@ module.exports = require("lodash");
 /***/ 30:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/numberUtils");
+module.exports = require("@splunk/visualization-encoding/Options");
 
 /***/ }),
 
 /***/ 31:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/visualizations-shared/numberUtils");
+
+/***/ }),
+
+/***/ 32:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1241,11 +1463,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.shouldShowIconPlaceholder = void 0;
+
 var React = __webpack_require__(1);
+
 var T = __webpack_require__(0);
+
 var lodash_1 = __webpack_require__(3);
+
 var i18n_1 = __webpack_require__(2);
+
 var Message_1 = __webpack_require__(10);
+
 var FixedSizeContainer_1 = __webpack_require__(13);
 /**
  * @method shouldShowIconPlaceholder
@@ -1253,14 +1481,17 @@ var FixedSizeContainer_1 = __webpack_require__(13);
  * @param {boolean} loading
  * @returns {boolean}
  */
+
+
 var shouldShowIconPlaceholder = function shouldShowIconPlaceholder(dataSources) {
   var loading = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-  var data = lodash_1.get(dataSources, 'primary.data.columns[0]', undefined);
+  var data = (0, lodash_1.get)(dataSources, 'primary.data.columns[0]', undefined);
   var noData = data === undefined;
-  var fields = lodash_1.get(dataSources, 'primary.data.fields[0]', undefined);
+  var fields = (0, lodash_1.get)(dataSources, 'primary.data.fields[0]', undefined);
   var noFields = fields === undefined;
   return loading || noData || noFields;
 };
+
 exports.shouldShowIconPlaceholder = shouldShowIconPlaceholder;
 var propTypes = {
   icon: T.func,
@@ -1275,11 +1506,13 @@ var propTypes = {
  * @param {IconPlaceholderProps} props
  * @returns {React.ReactElement}
  */
+
 var IconPlaceholder = function IconPlaceholder(props) {
   var width = props.width,
-    height = props.height,
-    icon = props.icon,
-    iconColor = props.iconColor;
+      height = props.height,
+      icon = props.icon,
+      iconColor = props.iconColor;
+
   if (icon) {
     return React.createElement(icon, {
       style: {
@@ -1294,26 +1527,21 @@ var IconPlaceholder = function IconPlaceholder(props) {
       height: '50%'
     });
   }
+
   return React.createElement(Message_1.default, {
     width: width,
     height: height,
     level: "warning",
-    message: i18n_1._('No DataSource Connected')
+    message: (0, i18n_1._)('No DataSource Connected')
   });
 };
+
 IconPlaceholder.propTypes = propTypes;
 IconPlaceholder.defaultProps = {
   width: '100%',
   height: 250
 };
-exports.default = FixedSizeContainer_1.default(IconPlaceholder);
-
-/***/ }),
-
-/***/ 32:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/id");
+exports.default = (0, FixedSizeContainer_1.default)(IconPlaceholder);
 
 /***/ }),
 
@@ -1324,21 +1552,27 @@ module.exports = require("@splunk/ui-utils/id");
 
 
 var _defineProperty = __webpack_require__(7);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getSortingParams = exports.SortParamsPropTypes = void 0;
+
 var T = __webpack_require__(0);
+
 var lodash_1 = __webpack_require__(3);
-var DataSource_1 = __webpack_require__(43);
+
+var DataSource_1 = __webpack_require__(34);
+
 exports.SortParamsPropTypes = T.shape({
   currentSortKey: T.string,
   currentSortDir: T.oneOf(DataSource_1.validSortDirs),
   onSort: T.func
 });
+
 var getSortingParams = function getSortingParams(_ref) {
   var requestParams = _ref.requestParams,
-    onRequestParamsChange = _ref.onRequestParamsChange;
+      onRequestParamsChange = _ref.onRequestParamsChange;
   var currentSortKey;
   var currentSortDir;
   var nextSortDirMap = {
@@ -1347,17 +1581,20 @@ var getSortingParams = function getSortingParams(_ref) {
     none: 'asc'
   };
   var onSort;
+
   if (typeof onRequestParamsChange === 'function') {
-    if (requestParams && lodash_1.has(requestParams, 'sort')) {
+    if (requestParams && (0, lodash_1.has)(requestParams, 'sort')) {
       currentSortKey = Object.keys(requestParams.sort).shift();
       currentSortDir = requestParams.sort[currentSortKey];
-    }
-    // undid memoization since there is a dependency on requestParams, which is a deeply nested object
+    } // undid memoization since there is a dependency on requestParams, which is a deeply nested object
+
+
     onSort = function onSort(e, _ref2) {
       var sortKey = _ref2.sortKey,
-        sortDir = _ref2.sortDir;
+          sortDir = _ref2.sortDir;
+
       if (typeof sortKey === 'string') {
-        var nextSortDir = lodash_1.has(nextSortDirMap, sortDir) ? nextSortDirMap[sortDir] : 'none';
+        var nextSortDir = (0, lodash_1.has)(nextSortDirMap, sortDir) ? nextSortDirMap[sortDir] : 'none';
         onRequestParamsChange(Object.assign(Object.assign({}, requestParams), {
           offset: 0,
           sort: _defineProperty({}, sortKey, nextSortDir)
@@ -1367,12 +1604,14 @@ var getSortingParams = function getSortingParams(_ref) {
       }
     };
   }
+
   return {
     currentSortKey: currentSortKey,
     currentSortDir: currentSortDir,
     onSort: onSort
   };
 };
+
 exports.getSortingParams = getSortingParams;
 
 /***/ }),
@@ -1386,40 +1625,66 @@ exports.getSortingParams = getSortingParams;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getPaginationParams = exports.PaginatorParamsPropTypes = void 0;
-var T = __webpack_require__(0);
-var lodash_1 = __webpack_require__(3);
-exports.PaginatorParamsPropTypes = T.shape({
-  isPaging: T.bool,
-  current: T.number,
-  totalPages: T.number,
-  onChange: T.func
-});
-var getPaginationParams = function getPaginationParams(_ref) {
+exports.validOutputModes = exports.validSegmentationModes = exports.validSortDirs = void 0;
+exports.validSortDirs = ['asc', 'desc', 'none'];
+exports.validSegmentationModes = ['none', 'inner'];
+exports.validOutputModes = ['json_cols', 'json'];
+
+/***/ }),
+
+/***/ 35:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPaginationParams = exports.PaginatorParamsPropTypes = void 0;
+
+var T = __webpack_require__(0);
+
+var lodash_1 = __webpack_require__(3);
+
+exports.PaginatorParamsPropTypes = T.shape({
+  isPaging: T.bool,
+  current: T.number,
+  totalPages: T.number,
+  onChange: T.func
+});
+
+var getPaginationParams = function getPaginationParams(_ref) {
   var requestParams = _ref.requestParams,
-    meta = _ref.meta,
-    onRequestParamsChange = _ref.onRequestParamsChange;
+      meta = _ref.meta,
+      onRequestParamsChange = _ref.onRequestParamsChange;
   var totalCount = meta && meta.totalCount || 0;
   var offset = requestParams && requestParams.offset || 0;
   var count = requestParams && requestParams.count;
   var totalPages = typeof count === 'number' && count > 0 ? Math.ceil(totalCount / count) : 0;
   var current = typeof count === 'number' && count > 0 ? Math.floor(offset / count) + 1 : 0;
   var isPaging = totalPages > 1 && typeof onRequestParamsChange === 'function';
+
   var onChangeHandler = function onChangeHandler(e, _ref2) {
     var page = _ref2.page,
-      countArg = _ref2.count;
-    var newParams = lodash_1.cloneDeep(requestParams);
+        countArg = _ref2.count;
+    var newParams = (0, lodash_1.cloneDeep)(requestParams);
+
     if (typeof countArg === 'number') {
       newParams.count = countArg;
       newParams.offset = 0;
     }
+
     var pageCount = typeof newParams.count === 'number' ? newParams.count : 10;
+
     if (typeof page === 'number' && page > 0) {
       newParams.count = pageCount;
       newParams.offset = (page - 1) * pageCount;
     }
+
     onRequestParamsChange(newParams);
   };
+
   return {
     isPaging: isPaging,
     current: current,
@@ -1427,11 +1692,12 @@ var getPaginationParams = function getPaginationParams(_ref) {
     onChange: typeof onRequestParamsChange === 'function' ? onChangeHandler : lodash_1.noop
   };
 };
+
 exports.getPaginationParams = getPaginationParams;
 
 /***/ }),
 
-/***/ 35:
+/***/ 36:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1442,6 +1708,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.VizCategory = void 0;
 var VizCategory;
+
 (function (VizCategory) {
   VizCategory["SINGLE_VALUE"] = "Single Value";
   VizCategory["TRENDS"] = "Trends";
@@ -1459,67 +1726,96 @@ var VizCategory;
 
 /***/ }),
 
-/***/ 36:
+/***/ 37:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
 var _slicedToArray = __webpack_require__(17);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
 var lodash_1 = __webpack_require__(3);
-var getSettingsFromThemedProps_1 = __webpack_require__(37);
-var Options_1 = __webpack_require__(29);
-var SanitizeProps_1 = __webpack_require__(38);
-var TimezoneContext_1 = __webpack_require__(25);
-var moment_1 = __webpack_require__(39);
+
+var getSettingsFromThemedProps_1 = __webpack_require__(38);
+
+var Options_1 = __webpack_require__(30);
+
+var SanitizeProps_1 = __webpack_require__(39);
+
+var TimezoneContext_1 = __webpack_require__(26);
+
+var moment_1 = __webpack_require__(40);
+
 var FeatureFlagContext_1 = __webpack_require__(21);
+
 var styled_components_1 = __webpack_require__(4);
-var hocUtils_1 = __webpack_require__(26);
-var JSONSchemaUtils_1 = __webpack_require__(27);
-var async_dynamic_options_evaluator_1 = __webpack_require__(40);
-var id_1 = __webpack_require__(32);
-var SplunkVisualization_1 = __webpack_require__(41);
+
+var hocUtils_1 = __webpack_require__(27);
+
+var JSONSchemaUtils_1 = __webpack_require__(28);
+
+var async_dynamic_options_evaluator_1 = __webpack_require__(41);
+
+var id_1 = __webpack_require__(25);
+
+var SplunkVisualization_1 = __webpack_require__(42);
+
 var VizBehavior_1 = __webpack_require__(6);
+
 var getSorting_1 = __webpack_require__(33);
-var getPagination_1 = __webpack_require__(34);
+
+var getPagination_1 = __webpack_require__(35);
+
 var useDeepMemo_1 = __webpack_require__(44);
+
 var MissingPropsMessage_1 = __webpack_require__(45);
+
 var withEditModeCover_1 = __webpack_require__(46);
+
 var withPlaceholder_1 = __webpack_require__(47);
 /**
  * hoc that wraps a pure react visualization in a Dashboard visualization
  * @param {DashboardVizOpts} opts
  * @returns {HOC}
  */
+
+
 var withDashboardViz = function withDashboardViz(opts) {
   var ReactViz = opts.ReactViz,
-    vizConfig = opts.vizConfig,
-    _opts$computeVizProps = opts.computeVizProps,
-    computeVizProps = _opts$computeVizProps === void 0 ? function () {} : _opts$computeVizProps,
-    disableEditModeCover = opts.disableEditModeCover,
-    useIconPlaceholder = opts.useIconPlaceholder; // sanitizing props before sending them to reactviz.
-  var SanitizedReactViz = SanitizeProps_1.withSanitizedProps(ReactViz);
-  var defaultOptions = JSONSchemaUtils_1.pickFieldFromJSONSchema(vizConfig.optionsSchema, 'default');
+      vizConfig = opts.vizConfig,
+      _opts$computeVizProps = opts.computeVizProps,
+      computeVizProps = _opts$computeVizProps === void 0 ? function () {} : _opts$computeVizProps,
+      disableEditModeCover = opts.disableEditModeCover,
+      useIconPlaceholder = opts.useIconPlaceholder; // sanitizing props before sending them to reactviz.
+
+  var SanitizedReactViz = (0, SanitizeProps_1.withSanitizedProps)(ReactViz);
+  var defaultOptions = (0, JSONSchemaUtils_1.pickFieldFromJSONSchema)(vizConfig.optionsSchema, 'default');
+
   var DashboardViz = function DashboardViz(props) {
     var _a;
+
     var mode = props.mode,
-      hasEventHandlers = props.hasEventHandlers,
-      dataSources = props.dataSources,
-      options = props.options,
-      _props$context = props.context,
-      context = _props$context === void 0 ? {} : _props$context,
-      width = props.width,
-      height = props.height,
-      onComputedProps = props.onComputedProps,
-      onEventTrigger = props.onEventTrigger,
-      theme = props.theme,
-      onRequestParamsChange = props.onRequestParamsChange;
+        hasEventHandlers = props.hasEventHandlers,
+        dataSources = props.dataSources,
+        options = props.options,
+        _props$context = props.context,
+        context = _props$context === void 0 ? {} : _props$context,
+        width = props.width,
+        height = props.height,
+        onComputedProps = props.onComputedProps,
+        onEventTrigger = props.onEventTrigger,
+        theme = props.theme,
+        onRequestParamsChange = props.onRequestParamsChange;
+
     var _React$useContext = React.useContext(TimezoneContext_1.default),
-      serializedTimezone = _React$useContext.serializedTimezone;
+        serializedTimezone = _React$useContext.serializedTimezone;
+
     if (serializedTimezone) {
       /*
           @splunk/moment currently does not allow us to customize the timezone on a per visualization basis.
@@ -1533,44 +1829,58 @@ var withDashboardViz = function withDashboardViz(opts) {
         moment_1.default.setDefaultSplunkTimezone(serializedTimezone);
       }
     }
+
     var themeFunc = function themeFunc(themeVar) {
       var _a, _b;
+
       return (_b = (_a = vizConfig.themes)[themeVar]) === null || _b === void 0 ? void 0 : _b.call(_a, props);
     };
+
     var bgColorFromTheme = themeFunc('defaultBackgroundColor');
-    var _getSettingsFromTheme = getSettingsFromThemedProps_1.default({
-        theme: theme
-      }),
-      currentThemeFamily = _getSettingsFromTheme.family,
-      currentThemeColorScheme = _getSettingsFromTheme.colorScheme,
-      currentThemeDensity = _getSettingsFromTheme.density;
+
+    var _ref = (0, getSettingsFromThemedProps_1.default)({
+      theme: theme
+    }),
+        currentThemeFamily = _ref.family,
+        currentThemeColorScheme = _ref.colorScheme,
+        currentThemeDensity = _ref.density;
+
     var evaluatedOptions = {}; // evaluatedOptions need to be initialized as an empty object
+
     var _React$useState = React.useState({}),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      evaluatedOptionsAsync = _React$useState2[0],
-      setEvaluatedOptionsAsync = _React$useState2[1]; // evaluatedOptions need to be initialized as an empty object
+        _React$useState2 = _slicedToArray(_React$useState, 2),
+        evaluatedOptionsAsync = _React$useState2[0],
+        setEvaluatedOptionsAsync = _React$useState2[1]; // evaluatedOptions need to be initialized as an empty object
+
+
     var featureFlagContext = React.useContext(FeatureFlagContext_1.default);
-    var _React$useState3 = React.useState("".concat(vizConfig.name, " - ").concat(id_1.createGUID())),
-      _React$useState4 = _slicedToArray(_React$useState3, 1),
-      visualizationID = _React$useState4[0];
+
+    var _React$useState3 = React.useState("".concat(vizConfig.name, " - ").concat((0, id_1.createGUID)())),
+        _React$useState4 = _slicedToArray(_React$useState3, 1),
+        visualizationID = _React$useState4[0];
+
     var _React$useState5 = React.useState({}),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      dataSourcesInState = _React$useState6[0],
-      setDataSourcesInState = _React$useState6[1];
+        _React$useState6 = _slicedToArray(_React$useState5, 2),
+        dataSourcesInState = _React$useState6[0],
+        setDataSourcesInState = _React$useState6[1];
+
     var _React$useState7 = React.useState(),
-      _React$useState8 = _slicedToArray(_React$useState7, 2),
-      dataFramesInState = _React$useState8[0],
-      setDataFramesInState = _React$useState8[1];
-    var _React$useState9 = React.useState(Boolean(featureFlagContext && featureFlagContext.visualizations_useWebWorkersForDSL && typeof Worker !== 'undefined')),
-      _React$useState10 = _slicedToArray(_React$useState9, 2),
-      useAsyncEvaluatedOptions = _React$useState10[0],
-      setUseAsyncEvaluatedOptions = _React$useState10[1];
-    evaluatedOptions = useDeepMemo_1.useDeepMemo(function () {
+        _React$useState8 = _slicedToArray(_React$useState7, 2),
+        dataFramesInState = _React$useState8[0],
+        setDataFramesInState = _React$useState8[1];
+
+    var _React$useState9 = React.useState(Boolean(featureFlagContext === null || featureFlagContext === void 0 ? void 0 : featureFlagContext.visualizations_useWebWorkersForDSL)),
+        _React$useState10 = _slicedToArray(_React$useState9, 2),
+        useAsyncEvaluatedOptions = _React$useState10[0],
+        setUseAsyncEvaluatedOptions = _React$useState10[1];
+
+    var isMounted = React.useRef(true);
+    evaluatedOptions = (0, useDeepMemo_1.useDeepMemo)(function () {
       try {
         if (useAsyncEvaluatedOptions) {
           var optionsToEvaluate = {
-            context: lodash_1.defaultsDeep({}, context, vizConfig.defaultContext),
-            options: hocUtils_1.deepMergeWithArrayPrimitiveOverrides({}, options, defaultOptions)
+            context: (0, lodash_1.defaultsDeep)({}, context, vizConfig.defaultContext),
+            options: (0, hocUtils_1.deepMergeWithArrayPrimitiveOverrides)({}, options, defaultOptions)
           };
           var asyncDynamicOptionsEvaluatorParams = {
             visualizationID: visualizationID,
@@ -1581,21 +1891,23 @@ var withDashboardViz = function withDashboardViz(opts) {
           };
           async_dynamic_options_evaluator_1.default.evaluate(asyncDynamicOptionsEvaluatorParams).then(function (results) {
             setEvaluatedOptionsAsync(results.results);
-          }).catch(function (e) {
-            // eslint-disable-next-line no-console
-            console.error("unexpected error evaluating options - async: ".concat(e.message));
-            setUseAsyncEvaluatedOptions(false);
+          }).catch(function () {
+            if (isMounted.current) {
+              setUseAsyncEvaluatedOptions(false);
+            }
           });
         } else {
           var dataFrames = dataFramesInState;
+
           if (dataSources !== dataSourcesInState) {
             setDataSourcesInState(dataSources);
             dataFrames = Options_1.Options.dataFrameFromDataSource(dataSources);
             setDataFramesInState(dataFrames);
           }
+
           return Options_1.Options.evaluate({
-            context: lodash_1.defaultsDeep({}, context, vizConfig.defaultContext),
-            options: hocUtils_1.deepMergeWithArrayPrimitiveOverrides({}, options, defaultOptions)
+            context: (0, lodash_1.defaultsDeep)({}, context, vizConfig.defaultContext),
+            options: (0, hocUtils_1.deepMergeWithArrayPrimitiveOverrides)({}, options, defaultOptions)
           }, dataSources, themeFunc, dataFrames);
         }
       } catch (e) {
@@ -1603,67 +1915,76 @@ var withDashboardViz = function withDashboardViz(opts) {
         console.error("unexpected error evaluating options: ".concat(e.message));
         return {};
       }
+
       return {};
     }, [currentThemeFamily, currentThemeColorScheme, currentThemeDensity, options, context, dataSources, serializedTimezone, useAsyncEvaluatedOptions]);
-    var evaluatedOptionsToUse = !useAsyncEvaluatedOptions ? evaluatedOptions : evaluatedOptionsAsync;
-    // trellis specific backgroundColor update for onComputedProps
+    var evaluatedOptionsToUse = !useAsyncEvaluatedOptions ? evaluatedOptions : evaluatedOptionsAsync; // trellis specific backgroundColor update for onComputedProps
     // if trellis is enabled following these three criteria - 1) trellis feature flag is enabled 2) vizConfig supports array has 'trellis' 3)  option 'splitByLayout' is set to 'trellis
     // onComputedProps api should return back trellisBackgroundColor value for backgroundColor option to support coloring of sibling panels (for eg:- title/ description on UDF side)
+
     var isTrellisFeatureFlagOn = Boolean(featureFlagContext && featureFlagContext.visualizations_enableTrellis);
     var clonedEvaluatedOptions = evaluatedOptionsToUse;
+
     if (isTrellisFeatureFlagOn && ((_a = vizConfig === null || vizConfig === void 0 ? void 0 : vizConfig.supports) === null || _a === void 0 ? void 0 : _a.includes(VizBehavior_1.VizBehavior.TRELLIS)) && (clonedEvaluatedOptions === null || clonedEvaluatedOptions === void 0 ? void 0 : clonedEvaluatedOptions.splitByLayout) === VizBehavior_1.VizBehavior.TRELLIS) {
       clonedEvaluatedOptions = Object.assign(Object.assign({}, evaluatedOptionsToUse), {
         backgroundColor: clonedEvaluatedOptions === null || clonedEvaluatedOptions === void 0 ? void 0 : clonedEvaluatedOptions.trellisBackgroundColor
       });
-    }
-    // useEffect hook needs to be initialized before any early returns
+    } // useEffect hook needs to be initialized before any early returns
     // this is in accordance with the order of hook calls being the same on each render https://reactjs.org/docs/hooks-rules.html#explanation
+
+
     React.useEffect(function () {
       onComputedProps(clonedEvaluatedOptions);
     });
     React.useEffect(function () {
       return function () {
         if (useAsyncEvaluatedOptions) {
+          isMounted.current = false;
           async_dynamic_options_evaluator_1.default.reset(visualizationID);
         }
-      };
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    // present warning message if any required props are missing
+      }; // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []); // present warning message if any required props are missing
+
     var _vizConfig$requiredPr = vizConfig.requiredProps,
-      requiredProps = _vizConfig$requiredPr === void 0 ? [] : _vizConfig$requiredPr,
-      supports = vizConfig.supports;
-    var missing = MissingPropsMessage_1.missingKeys(requiredProps, evaluatedOptionsToUse);
+        requiredProps = _vizConfig$requiredPr === void 0 ? [] : _vizConfig$requiredPr,
+        supports = vizConfig.supports;
+    var missing = (0, MissingPropsMessage_1.missingKeys)(requiredProps, evaluatedOptionsToUse);
+
     if (missing.length > 0 && supports.includes(VizBehavior_1.VizBehavior.PLACEHOLDER) && vizConfig.key !== 'splunk.singlevalue' // For SV missing props msg is not displayed if required props majorValue is missing, instead this will be handled from the component, instead handled within component
     ) {
-      return React.createElement(MissingPropsMessage_1.default, {
-        "data-test": "missing-props-message",
-        width: width,
-        height: height,
-        missingProps: missing,
-        backgroundColor: bgColorFromTheme
-      });
-    }
-    // events
+        return React.createElement(MissingPropsMessage_1.default, {
+          "data-test": "missing-props-message",
+          width: width,
+          height: height,
+          missingProps: missing,
+          backgroundColor: bgColorFromTheme
+        });
+      } // events
+
+
     var eventCallbackProps = {};
+
     if (hasEventHandlers && mode === 'view' && vizConfig.supports.indexOf(VizBehavior_1.VizBehavior.EVENTS) > -1) {
       var supportedEvents = vizConfig.events;
       Object.keys(supportedEvents).forEach(function (eventName) {
-        var eventCallbackPropName = lodash_1.camelCase("on.".concat(eventName));
-        eventCallbackProps[eventCallbackPropName] = null;
-        // todo: refactor single value and single value icon to send payload from viz
+        var eventCallbackPropName = (0, lodash_1.camelCase)("on.".concat(eventName));
+        eventCallbackProps[eventCallbackPropName] = null; // todo: refactor single value and single value icon to send payload from viz
         // then remove these lines
+
         var payloadKeys = supportedEvents[eventName].payloadKeys;
         var payload = {};
+
         if (Array.isArray(payloadKeys) && payloadKeys.length) {
           payloadKeys.forEach(function (p) {
             payload[p] = evaluatedOptionsToUse[p];
           });
         }
+
         eventCallbackProps[eventCallbackPropName] = function (ev) {
           if (ev && ev.payload) {
             payload = ev.payload;
           }
+
           return onEventTrigger({
             originalEvent: ev,
             payload: payload,
@@ -1671,8 +1992,9 @@ var withDashboardViz = function withDashboardViz(opts) {
           });
         };
       });
-    }
-    // compute pure viz props which are not from options
+    } // compute pure viz props which are not from options
+
+
     var computedVizProps = computeVizProps(Object.assign(Object.assign(Object.assign(Object.assign({}, props), evaluatedOptionsToUse), eventCallbackProps), {
       themeFunc: themeFunc
     }));
@@ -1690,21 +2012,25 @@ var withDashboardViz = function withDashboardViz(opts) {
      * In future, we could automatically detect which all datasources are being used
      * and bind those magically to pagination/sorting behavior.
      */
+
     var dataSourceMetadata = {};
     var OptionKey = 'paginateDataSourceKey';
-    var paginateDataSourceKey = lodash_1.has(evaluatedOptionsToUse, OptionKey) && evaluatedOptionsToUse[OptionKey] || 'primary';
-    if (vizConfig.supports.indexOf(VizBehavior_1.VizBehavior.PAGE_AND_SORT) > -1 && lodash_1.has(dataSources, paginateDataSourceKey)) {
-      var requestParams = lodash_1.get(dataSources, [paginateDataSourceKey, 'requestParams'], {});
-      var meta = lodash_1.get(dataSources, [paginateDataSourceKey, 'meta'], {});
+    var paginateDataSourceKey = (0, lodash_1.has)(evaluatedOptionsToUse, OptionKey) && evaluatedOptionsToUse[OptionKey] || 'primary';
+
+    if (vizConfig.supports.indexOf(VizBehavior_1.VizBehavior.PAGE_AND_SORT) > -1 && (0, lodash_1.has)(dataSources, paginateDataSourceKey)) {
+      var requestParams = (0, lodash_1.get)(dataSources, [paginateDataSourceKey, 'requestParams'], {});
+      var meta = (0, lodash_1.get)(dataSources, [paginateDataSourceKey, 'meta'], {});
+
       var handleRequestParamsChange = function handleRequestParamsChange(payload) {
         return onRequestParamsChange(paginateDataSourceKey, payload);
       };
-      var sortParams = getSorting_1.getSortingParams({
+
+      var sortParams = (0, getSorting_1.getSortingParams)({
         requestParams: requestParams,
         meta: meta,
         onRequestParamsChange: handleRequestParamsChange
       });
-      var paginatorParams = getPagination_1.getPaginationParams({
+      var paginatorParams = (0, getPagination_1.getPaginationParams)({
         requestParams: requestParams,
         meta: meta,
         onRequestParamsChange: handleRequestParamsChange
@@ -1713,115 +2039,132 @@ var withDashboardViz = function withDashboardViz(opts) {
         sortParams: sortParams,
         paginatorParams: paginatorParams
       };
-    }
-    // if were using webworkers and this is the first render we dont want to show a viz with missing data so we return null
+    } // if were using webworkers and this is the first render we dont want to show a viz with missing data so we return null
+
+
     if (useAsyncEvaluatedOptions && Object.keys(evaluatedOptionsToUse).length === 0) {
       return null;
     }
+
     return React.createElement(SanitizedReactViz, Object.assign({
       mode: mode,
       width: width,
       height: height
     }, evaluatedOptionsToUse, computedVizProps, eventCallbackProps, dataSourceMetadata));
   };
+
   DashboardViz.propTypes = Object.assign(Object.assign({}, SplunkVisualization_1.default.propTypes), ReactViz.propTypes);
   DashboardViz.defaultProps = Object.assign(Object.assign(Object.assign({}, SplunkVisualization_1.default.defaultProps), ReactViz.defaultProps), {
     // using withTheme requires component to receive theme prop. In case the consumer did not provide ThemeProvider, a default empty object will prevent warnings.
     theme: {}
-  });
-  // attach viz config
-  DashboardViz.config = vizConfig;
-  // @ts-ignore: TODO fix sc upgrade TS issues
-  return styled_components_1.withTheme(withPlaceholder_1.default(withEditModeCover_1.default(DashboardViz, disableEditModeCover), useIconPlaceholder));
+  }); // attach viz config
+
+  DashboardViz.config = vizConfig; // @ts-ignore: TODO fix sc upgrade TS issues
+
+  return (0, styled_components_1.withTheme)((0, withPlaceholder_1.default)((0, withEditModeCover_1.default)(DashboardViz, disableEditModeCover), useIconPlaceholder));
 };
+
 exports.default = withDashboardViz;
 
 /***/ }),
 
-/***/ 37:
+/***/ 38:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes/getSettingsFromThemedProps");
 
 /***/ }),
 
-/***/ 38:
+/***/ 39:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/SanitizeProps");
 
 /***/ }),
 
-/***/ 39:
+/***/ 4:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/moment");
+module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 4:
+/***/ 40:
 /***/ (function(module, exports) {
 
-module.exports = require("styled-components");
+module.exports = require("@splunk/moment");
 
 /***/ }),
 
-/***/ 40:
+/***/ 41:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/async-dynamic-options-evaluator");
 
 /***/ }),
 
-/***/ 41:
+/***/ 42:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
 var _classCallCheck = __webpack_require__(9);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.INITIAL_HEIGHT = exports.INITIAL_WIDTH = void 0;
 /* eslint-disable react/no-unused-prop-types,react/prefer-stateless-function */
+
 var T = __webpack_require__(0);
+
 var lodash_1 = __webpack_require__(3);
-var VizActionHandler_1 = __webpack_require__(42);
-// this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
+
+var VizActionHandler_1 = __webpack_require__(43); // this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
+
+
 exports.INITIAL_WIDTH = 250;
 exports.INITIAL_HEIGHT = 250;
 /**
  * A Splunk visualization
  */
+
 var SplunkVisualization = function SplunkVisualization() {
   _classCallCheck(this, SplunkVisualization);
 };
+
 SplunkVisualization.propTypes = {
   /**
    * display mode
    */
   mode: T.oneOf(['view', 'edit', 'export']).isRequired,
+
   /**
    * width in pixel or string, defaults to 100%
    */
   width: T.oneOfType([T.string, T.number]).isRequired,
+
   /**
    * height in pixel or string
    */
   height: T.oneOfType([T.string, T.number]).isRequired,
+
   /**
    * visualization context used for dynamic option evaluation
    */
   context: T.object,
+
   /**
    * visualization formatting options
    */
   options: T.object,
+
   /**
    * A callback to update formatting options
    */
   onOptionsChange: T.func,
+
   /**
    * datasource state which include data and request params, object key indicate the datasource type.
    */
@@ -1830,6 +2173,7 @@ SplunkVisualization.propTypes = {
      * current request params
      */
     requestParams: T.object,
+
     /**
      * current dataset
      */
@@ -1837,6 +2181,7 @@ SplunkVisualization.propTypes = {
       fields: T.array,
       columns: T.array
     }),
+
     /**
      * error
      */
@@ -1844,29 +2189,35 @@ SplunkVisualization.propTypes = {
       level: T.string,
       message: T.string
     }),
+
     /**
      * meta data that came with the dataset
      */
     meta: T.object
   })),
+
   /**
    * A callback to trigger event
    */
   onEventTrigger: T.func,
+
   /**
    * Inform viz if there are handlers listening to events
    */
   hasEventHandlers: T.bool,
+
   /**
    * A callback to communicate computed props to a consumer
    */
   onComputedProps: T.func,
+
   /**
    * A callback to obtain visualization api
    */
   vizActionHandlerRef: T.func,
   loading: T.bool,
   theme: T.object,
+
   /**
    * A callback to request new data with updated request params
    */
@@ -1875,6 +2226,7 @@ SplunkVisualization.propTypes = {
 /**
  *
  */
+
 SplunkVisualization.defaultProps = {
   // BaseVisualization in dashboard-visualizations uses 100% for width but 250 for height
   width: '100%',
@@ -1903,26 +2255,29 @@ exports.default = SplunkVisualization;
 
 /***/ }),
 
-/***/ 42:
+/***/ 43:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
 var _classCallCheck = __webpack_require__(9);
+
 var _createClass = __webpack_require__(18);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DefaultVizActionHandler = void 0;
+
 var DefaultVizActionHandler = /*#__PURE__*/function () {
   function DefaultVizActionHandler() {
     _classCallCheck(this, DefaultVizActionHandler);
   }
+
   _createClass(DefaultVizActionHandler, [{
     key: "focus",
-    value: function focus() {
-      // noop
+    value: function focus() {// noop
     }
   }, {
     key: "snapshot",
@@ -1930,23 +2285,11 @@ var DefaultVizActionHandler = /*#__PURE__*/function () {
       return null; // noop
     }
   }]);
+
   return DefaultVizActionHandler;
 }();
-exports.DefaultVizActionHandler = DefaultVizActionHandler;
-
-/***/ }),
 
-/***/ 43:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.validSortDirs = void 0;
-exports.validSortDirs = ['asc', 'desc', 'none'];
+exports.DefaultVizActionHandler = DefaultVizActionHandler;
 
 /***/ }),
 
@@ -1960,7 +2303,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useDeepMemo = void 0;
+
 var react_1 = __webpack_require__(1);
+
 var lodash_1 = __webpack_require__(3);
 /**
  * This hook evaluates and stores the result of a passed function and only
@@ -1975,16 +2320,21 @@ var lodash_1 = __webpack_require__(3);
  * @param fn the function to be executed and
  * @param dependencies an array of dependencies
  */
+
+
 var useDeepMemo = function useDeepMemo(fn, dependencies) {
-  var ref = react_1.useRef();
-  if (!ref.current || !lodash_1.isEqual(dependencies, ref.current.dependencies)) {
+  var ref = (0, react_1.useRef)();
+
+  if (!ref.current || !(0, lodash_1.isEqual)(dependencies, ref.current.dependencies)) {
     ref.current = {
       dependencies: dependencies,
       value: fn()
     };
   }
+
   return ref.current.value;
 };
+
 exports.useDeepMemo = useDeepMemo;
 
 /***/ }),
@@ -1999,19 +2349,27 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MissingPropsMessage = exports.missingKeys = exports.isMissing = void 0;
+
 var React = __webpack_require__(1);
+
 var T = __webpack_require__(0);
+
 var i18n_1 = __webpack_require__(2);
+
 var Message_1 = __webpack_require__(10);
+
 var FixedSizeContainer_1 = __webpack_require__(13);
 /**
  * @method isMissing
  * @param {any} v
  * @returns {boolean} true if the input value === null or undefined
  */
+
+
 var isMissing = function isMissing(v) {
   return v === null || v === undefined;
 };
+
 exports.isMissing = isMissing;
 /**
  * @method misskingKeys
@@ -2019,11 +2377,13 @@ exports.isMissing = isMissing;
  * @param {object} target
  * @returns {string[]} the keys of missing required props
  */
+
 var missingKeys = function missingKeys(keys, target) {
   return keys.filter(function (k) {
-    return exports.isMissing(target[k]);
+    return (0, exports.isMissing)(target[k]);
   });
 };
+
 exports.missingKeys = missingKeys;
 var propTypes = {
   width: T.oneOfType([T.string, T.number]),
@@ -2037,28 +2397,30 @@ var propTypes = {
  * @param {MissingPropsProps} props
  * @returns {React.ReactElement}
  */
+
 var MissingPropsMessage = function MissingPropsMessage(props) {
   var width = props.width,
-    height = props.height,
-    missingProps = props.missingProps;
+      height = props.height,
+      missingProps = props.missingProps;
   return React.createElement(Message_1.default, {
     "data-test": "message",
     width: width,
     height: height,
-    message: i18n_1._("Missing property: ".concat(missingProps.join(', ')))
+    message: (0, i18n_1._)("Missing property: ".concat(missingProps.join(', ')))
   });
 };
+
 exports.MissingPropsMessage = MissingPropsMessage;
 exports.MissingPropsMessage.propTypes = propTypes;
 exports.MissingPropsMessage.defaultProps = {
   width: '100%',
   height: 250
 };
-exports.default = FixedSizeContainer_1.default(exports.MissingPropsMessage);
+exports.default = (0, FixedSizeContainer_1.default)(exports.MissingPropsMessage);
 
 /***/ }),
 
-/***/ 454:
+/***/ 457:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -2066,27 +2428,38 @@ exports.default = FixedSizeContainer_1.default(exports.MissingPropsMessage);
 
 var __createBinding = this && this.__createBinding || (Object.create ? function (o, m, k, k2) {
   if (k2 === undefined) k2 = k;
-  Object.defineProperty(o, k2, {
-    enumerable: true,
-    get: function get() {
-      return m[k];
-    }
-  });
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function get() {
+        return m[k];
+      }
+    };
+  }
+
+  Object.defineProperty(o, k2, desc);
 } : function (o, m, k, k2) {
   if (k2 === undefined) k2 = k;
   o[k2] = m[k];
 });
+
 var __exportStar = this && this.__exportStar || function (m, exports) {
   for (var p in m) {
     if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
   }
 };
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-__exportStar(__webpack_require__(163), exports);
-var Sankey_1 = __webpack_require__(163);
+
+__exportStar(__webpack_require__(166), exports);
+
+var Sankey_1 = __webpack_require__(166);
+
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
@@ -2096,56 +2469,63 @@ Object.defineProperty(exports, "default", {
 
 /***/ }),
 
-/***/ 455:
+/***/ 458:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d3_sankey", function() { return d3_sankey; });
-/* harmony import */ var d3_interpolate__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(138);
+/* harmony import */ var d3_interpolate__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(140);
 /* harmony import */ var d3_interpolate__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(d3_interpolate__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var d3_array__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(63);
+/* harmony import */ var d3_array__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(64);
 /* harmony import */ var d3_array__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(d3_array__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var d3_collection__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(139);
+/* harmony import */ var d3_collection__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(141);
 /* harmony import */ var d3_collection__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(d3_collection__WEBPACK_IMPORTED_MODULE_2__);
 // reference link :- https://github.com/csaladenes/sankey
+
 /* eslint-disable */
 
 
 
 var d3_sankey = function d3_sankey() {
   var sankey = {},
-    nodeWidth = 24,
-    nodePadding = 8,
-    size = [1, 1],
-    nodes = [],
-    links = [],
-    components = [];
+      nodeWidth = 24,
+      nodePadding = 8,
+      size = [1, 1],
+      nodes = [],
+      links = [],
+      components = [];
+
   sankey.nodeWidth = function (_) {
     if (!arguments.length) return nodeWidth;
     nodeWidth = +_;
     return sankey;
   };
+
   sankey.nodePadding = function (_) {
     if (!arguments.length) return nodePadding;
     nodePadding = +_;
     return sankey;
   };
+
   sankey.nodes = function (_) {
     if (!arguments.length) return nodes;
     nodes = _;
     return sankey;
   };
+
   sankey.links = function (_) {
     if (!arguments.length) return links;
     links = _;
     return sankey;
   };
+
   sankey.size = function (_) {
     if (!arguments.length) return size;
     size = _;
     return sankey;
   };
+
   sankey.layout = function (iterations) {
     computeNodeLinks();
     computeNodeValues();
@@ -2155,12 +2535,11 @@ var d3_sankey = function d3_sankey() {
     computeLinkDepths();
     return sankey;
   };
+
   sankey.relayout = function () {
     computeLinkDepths();
     return sankey;
-  };
-
-  // A more involved path generator that requires 3 elements to render --
+  }; // A more involved path generator that requires 3 elements to render --
   // It draws a starting element, intermediate and end element that are useful
   // while drawing reverse links to get an appropriate fill.
   //
@@ -2183,32 +2562,34 @@ var d3_sankey = function d3_sankey() {
   //      .attr("d", path(i))
   //      .attr("fill", ...)
   //  }
-  sankey.reversibleLink = function () {
-    var curvature = 0.5;
 
-    // Used when source is behind target, the first and last paths are simple
+
+  sankey.reversibleLink = function () {
+    var curvature = 0.5; // Used when source is behind target, the first and last paths are simple
     // lines at the start and end node while the second path is the spline
+
     function forwardLink(part, d) {
       var x0 = d.source.x + d.source.dx,
-        x1 = d.target.x,
-        xi = Object(d3_interpolate__WEBPACK_IMPORTED_MODULE_0__["interpolateNumber"])(x0, x1),
-        x2 = xi(curvature),
-        x3 = xi(1 - curvature),
-        y0 = d.source.y + d.sy,
-        y1 = d.target.y + d.ty,
-        y2 = d.source.y + d.sy + d.dy,
-        y3 = d.target.y + d.ty + d.dy;
+          x1 = d.target.x,
+          xi = Object(d3_interpolate__WEBPACK_IMPORTED_MODULE_0__["interpolateNumber"])(x0, x1),
+          x2 = xi(curvature),
+          x3 = xi(1 - curvature),
+          y0 = d.source.y + d.sy,
+          y1 = d.target.y + d.ty,
+          y2 = d.source.y + d.sy + d.dy,
+          y3 = d.target.y + d.ty + d.dy;
+
       switch (part) {
         case 0:
           return 'M' + x0 + ',' + y0 + 'L' + x0 + ',' + (y0 + d.dy);
+
         case 1:
           return 'M' + x0 + ',' + y0 + 'C' + x2 + ',' + y0 + ' ' + x3 + ',' + y1 + ' ' + x1 + ',' + y1 + 'L' + x1 + ',' + y3 + 'C' + x3 + ',' + y3 + ' ' + x2 + ',' + y2 + ' ' + x0 + ',' + y2 + 'Z';
+
         case 2:
           return 'M' + x1 + ',' + y1 + 'L' + x1 + ',' + (y1 + d.dy);
       }
-    }
-
-    // Used for self loops and when the source is actually in front of the
+    } // Used for self loops and when the source is actually in front of the
     // target; the first element is a turning path from the source to the
     // destination, the second element connects the two twists and the last
     // twists into the target element.
@@ -2218,29 +2599,38 @@ var d3_sankey = function d3_sankey() {
     //  \----------------------\
     //                 Source--/
     //
+
+
     function backwardLink(part, d) {
       var curveExtension = 30;
       var curveDepth = 15;
+
       function getDir(d) {
         return d.source.y + d.sy > d.target.y + d.ty ? -1 : 1;
       }
+
       function p(x, y) {
         return x + ',' + y + ' ';
       }
+
       var dt = getDir(d) * curveDepth,
-        x0 = d.source.x + d.source.dx,
-        y0 = d.source.y + d.sy,
-        x1 = d.target.x,
-        y1 = d.target.y + d.ty;
+          x0 = d.source.x + d.source.dx,
+          y0 = d.source.y + d.sy,
+          x1 = d.target.x,
+          y1 = d.target.y + d.ty;
+
       switch (part) {
         case 0:
           return 'M' + p(x0, y0) + 'C' + p(x0, y0) + p(x0 + curveExtension, y0) + p(x0 + curveExtension, y0 + dt) + 'L' + p(x0 + curveExtension, y0 + dt + d.dy) + 'C' + p(x0 + curveExtension, y0 + d.dy) + p(x0, y0 + d.dy) + p(x0, y0 + d.dy) + 'Z';
+
         case 1:
           return 'M' + p(x0 + curveExtension, y0 + dt) + 'C' + p(x0 + curveExtension, y0 + 3 * dt) + p(x1 - curveExtension, y1 - 3 * dt) + p(x1 - curveExtension, y1 - dt) + 'L' + p(x1 - curveExtension, y1 - dt + d.dy) + 'C' + p(x1 - curveExtension, y1 - 3 * dt + d.dy) + p(x0 + curveExtension, y0 + 3 * dt + d.dy) + p(x0 + curveExtension, y0 + dt + d.dy) + 'Z';
+
         case 2:
           return 'M' + p(x1 - curveExtension, y1 - dt) + 'C' + p(x1 - curveExtension, y1) + p(x1, y1) + p(x1, y1) + 'L' + p(x1, y1 + d.dy) + 'C' + p(x1, y1 + d.dy) + p(x1 - curveExtension, y1 + d.dy) + p(x1 - curveExtension, y1 + d.dy - dt) + 'Z';
       }
     }
+
     return function (part) {
       return function (d) {
         if (d.source.x < d.target.x) {
@@ -2250,32 +2640,35 @@ var d3_sankey = function d3_sankey() {
         }
       };
     };
-  };
-
-  // The standard link path using a constant width spline that needs a
+  }; // The standard link path using a constant width spline that needs a
   // single path element.
+
+
   sankey.link = function () {
     var curvature = 0.5;
+
     function link(d) {
       var x0 = d.source.x + d.source.dx,
-        x1 = d.target.x,
-        xi = Object(d3_interpolate__WEBPACK_IMPORTED_MODULE_0__["interpolateNumber"])(x0, x1),
-        x2 = xi(curvature),
-        x3 = xi(1 - curvature),
-        y0 = d.source.y + d.sy + d.dy / 2,
-        y1 = d.target.y + d.ty + d.dy / 2;
+          x1 = d.target.x,
+          xi = Object(d3_interpolate__WEBPACK_IMPORTED_MODULE_0__["interpolateNumber"])(x0, x1),
+          x2 = xi(curvature),
+          x3 = xi(1 - curvature),
+          y0 = d.source.y + d.sy + d.dy / 2,
+          y1 = d.target.y + d.ty + d.dy / 2;
       return 'M' + x0 + ',' + y0 + 'C' + x2 + ',' + y0 + ' ' + x3 + ',' + y1 + ' ' + x1 + ',' + y1;
     }
+
     link.curvature = function (_) {
       if (!arguments.length) return curvature;
       curvature = +_;
       return link;
     };
-    return link;
-  };
 
-  // Populate the sourceLinks and targetLinks for each node.
+    return link;
+  }; // Populate the sourceLinks and targetLinks for each node.
   // Also, if the source and target are not objects, assume they are indices.
+
+
   function computeNodeLinks() {
     nodes.forEach(function (node) {
       node.sourceLinks = [];
@@ -2283,44 +2676,46 @@ var d3_sankey = function d3_sankey() {
     });
     links.forEach(function (link) {
       var source = link.source,
-        target = link.target;
+          target = link.target;
       if (typeof source === 'number') source = link.source = nodes[link.source];
       if (typeof target === 'number') target = link.target = nodes[link.target];
       source.sourceLinks.push(link);
       target.targetLinks.push(link);
     });
-  }
+  } // Compute the value (size) of each node by summing the associated links.
+
 
-  // Compute the value (size) of each node by summing the associated links.
   function computeNodeValues() {
     nodes.forEach(function (node) {
-      if (!node.value)
-        //if not already given
+      if (!node.value) //if not already given
         node.value = Math.max(Object(d3_array__WEBPACK_IMPORTED_MODULE_1__["sum"])(node.sourceLinks, value), Object(d3_array__WEBPACK_IMPORTED_MODULE_1__["sum"])(node.targetLinks, value));
     });
-  }
-
-  // Take the list of nodes and create a DAG of supervertices, each consisting
+  } // Take the list of nodes and create a DAG of supervertices, each consisting
   // of a strongly connected component of the graph
   //
   // Based off:
   // http://en.wikipedia.org/wiki/Tarjan's_strongly_connected_components_algorithm
+
+
   function computeNodeStructure() {
     var nodeStack = [],
-      index = 0;
+        index = 0;
     nodes.forEach(function (node) {
       if (!node.index) {
         connect(node);
       }
     });
+
     function connect(node) {
       node.index = index++;
       node.lowIndex = node.index;
       node.onStack = true;
       nodeStack.push(node);
+
       if (node.sourceLinks) {
         node.sourceLinks.forEach(function (sourceLink) {
           var target = sourceLink.target;
+
           if (!target.hasOwnProperty('index')) {
             connect(target);
             node.lowIndex = Math.min(node.lowIndex, target.lowIndex);
@@ -2328,14 +2723,17 @@ var d3_sankey = function d3_sankey() {
             node.lowIndex = Math.min(node.lowIndex, target.index);
           }
         });
+
         if (node.lowIndex === node.index) {
           var component = [],
-            currentNode;
+              currentNode;
+
           do {
             currentNode = nodeStack.pop();
             currentNode.onStack = false;
             component.push(currentNode);
           } while (currentNode != node);
+
           components.push({
             root: node,
             scc: component
@@ -2343,16 +2741,17 @@ var d3_sankey = function d3_sankey() {
         }
       }
     }
+
     components.forEach(function (component, i) {
       component.index = i;
       component.scc.forEach(function (node) {
         node.component = i;
       });
     });
-  }
-
-  // Assign the breadth (x-position) for each strongly connected component,
+  } // Assign the breadth (x-position) for each strongly connected component,
   // followed by assigning breadth within the component.
+
+
   function computeNodeBreadths() {
     layerComponents();
     components.forEach(function (component, i) {
@@ -2372,7 +2771,7 @@ var d3_sankey = function d3_sankey() {
       return d.values;
     });
     var max = -1,
-      nextMax = -1;
+        nextMax = -1;
     componentsByBreadth.forEach(function (c) {
       c.forEach(function (component) {
         component.x = max + 1;
@@ -2392,14 +2791,17 @@ var d3_sankey = function d3_sankey() {
       node.x = node.layer ? node.x : max;
     });
     scaleNodeBreadths((size[0] - nodeWidth) / Math.max(max, 1));
+
     function flatten(a) {
       return [].concat.apply([], a);
     }
+
     function layerComponents() {
       var remainingComponents = components,
-        nextComponents,
-        visitedIndex,
-        x = 0;
+          nextComponents,
+          visitedIndex,
+          x = 0;
+
       while (remainingComponents.length) {
         nextComponents = [];
         visitedIndex = {};
@@ -2418,14 +2820,17 @@ var d3_sankey = function d3_sankey() {
         ++x;
       }
     }
+
     function bfs(node, extractTargets) {
       var queue = [node],
-        currentCount = 1,
-        nextCount = 0;
+          currentCount = 1,
+          nextCount = 0;
       var x = 0;
+
       while (currentCount > 0) {
         var currentNode = queue.shift();
         currentCount--;
+
         if (!currentNode.hasOwnProperty('x')) {
           currentNode.x = x;
           currentNode.dx = nodeWidth;
@@ -2433,6 +2838,7 @@ var d3_sankey = function d3_sankey() {
           queue = queue.concat(targets);
           nextCount += targets.length;
         }
+
         if (currentCount == 0) {
           // level change
           x++;
@@ -2440,9 +2846,8 @@ var d3_sankey = function d3_sankey() {
           nextCount = 0;
         }
       }
-    }
+    } //extra code for fixed layout - x part
 
-    //extra code for fixed layout - x part
     /*
     if (fixedlayout && fixedlayout.length > 0) {
     sankey.nodes().forEach(function (d, i) {
@@ -2450,6 +2855,7 @@ var d3_sankey = function d3_sankey() {
     });
     }
     */
+
   }
 
   function moveSourcesRight() {
@@ -2461,6 +2867,7 @@ var d3_sankey = function d3_sankey() {
       }
     });
   }
+
   function moveSinksRight(x) {
     nodes.forEach(function (node) {
       if (!node.sourceLinks.length) {
@@ -2468,11 +2875,13 @@ var d3_sankey = function d3_sankey() {
       }
     });
   }
+
   function scaleNodeBreadths(kx) {
     nodes.forEach(function (node) {
       node.x *= kx;
     });
   }
+
   function computeNodeDepths(iterations) {
     var nodesByBreadth = Object(d3_collection__WEBPACK_IMPORTED_MODULE_2__["nest"])().key(function (d) {
       return d.x;
@@ -2481,12 +2890,14 @@ var d3_sankey = function d3_sankey() {
     });
     initializeNodeDepth();
     resolveCollisions();
+
     for (var alpha = 1; iterations > 0; --iterations) {
       relaxRightToLeft(alpha *= 0.99);
       resolveCollisions();
       relaxLeftToRight(alpha);
       resolveCollisions();
     }
+
     function initializeNodeDepth() {
       var ky = Object(d3_array__WEBPACK_IMPORTED_MODULE_1__["min"])(nodesByBreadth, function (nodes) {
         return (size[1] - (nodes.length - 1) * nodePadding) / Object(d3_array__WEBPACK_IMPORTED_MODULE_1__["sum"])(nodes, value);
@@ -2501,6 +2912,7 @@ var d3_sankey = function d3_sankey() {
         link.dy = link.value * ky;
       });
     }
+
     function relaxLeftToRight(alpha) {
       nodesByBreadth.forEach(function (nodes, breadth) {
         nodes.forEach(function (node) {
@@ -2510,10 +2922,12 @@ var d3_sankey = function d3_sankey() {
           }
         });
       });
+
       function weightedSource(link) {
         return center(link.source) * link.value;
       }
     }
+
     function relaxRightToLeft(alpha) {
       nodesByBreadth.slice().reverse().forEach(function (nodes) {
         nodes.forEach(function (node) {
@@ -2523,35 +2937,38 @@ var d3_sankey = function d3_sankey() {
           }
         });
       });
+
       function weightedTarget(link) {
         return center(link.target) * link.value;
       }
     }
+
     function resolveCollisions() {
       nodesByBreadth.forEach(function (nodes) {
         var node,
-          dy,
-          y0 = 0,
-          n = nodes.length,
-          i;
+            dy,
+            y0 = 0,
+            n = nodes.length,
+            i; // Push any overlapping nodes down.
 
-        // Push any overlapping nodes down.
         nodes.sort(ascendingDepth);
+
         for (i = 0; i < n; ++i) {
           node = nodes[i];
+
           if (node) {
             dy = y0 - node.y;
             if (dy > 0) node.y += dy;
             y0 = node.y + node.dy + nodePadding;
           }
-        }
+        } // If the bottommost node goes outside the bounds, push it back up.
+
 
-        // If the bottommost node goes outside the bounds, push it back up.
         dy = y0 - nodePadding - size[1];
+
         if (node && dy > 0) {
-          y0 = node.y -= dy;
+          y0 = node.y -= dy; // Push any overlapping nodes back up.
 
-          // Push any overlapping nodes back up.
           for (i = n - 2; i >= 0; --i) {
             node = nodes[i];
             dy = node.y + node.dy + nodePadding - y0;
@@ -2561,11 +2978,11 @@ var d3_sankey = function d3_sankey() {
         }
       });
     }
+
     function ascendingDepth(a, b) {
       return a.y - b.y;
-    }
+    } //extra code for fixed layout - y part
 
-    //extra code for fixed layout - y part
     /*
     if (fixedlayout.length > 0) {
     sankey.nodes().forEach(function (d, i) {
@@ -2573,17 +2990,20 @@ var d3_sankey = function d3_sankey() {
     });
     }
     */
+
   }
 
   function computeLinkDepths() {
     nodes.forEach(function (node) {
       var parallelrendering = false;
+
       if (parallelrendering) {} else node.sourceLinks.sort(ascendingTargetDepth);
+
       node.targetLinks.sort(ascendingSourceDepth);
     });
     nodes.forEach(function (node) {
       var sy = 0,
-        ty = 0;
+          ty = 0;
       node.sourceLinks.forEach(function (link) {
         link.sy = sy;
         sy += link.dy;
@@ -2593,25 +3013,30 @@ var d3_sankey = function d3_sankey() {
         ty += link.dy;
       });
     });
+
     function ascendingSourceDepth(a, b) {
       return a.source.y - b.source.y;
     }
+
     function ascendingTargetDepth(a, b) {
       return a.target.y - b.target.y;
     }
   }
+
   function center(node) {
     return node.y + node.dy / 2;
   }
+
   function value(link) {
     return link.value;
   }
+
   return sankey;
 };
 
 /***/ }),
 
-/***/ 456:
+/***/ 459:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -2620,29 +3045,40 @@ var d3_sankey = function d3_sankey() {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
 var T = __webpack_require__(0);
+
 var styled_components_1 = __webpack_require__(4);
+
 var react_1 = __webpack_require__(1);
-var PureSankey_1 = __webpack_require__(110);
-var SankeyUtils_1 = __webpack_require__(133);
+
+var PureSankey_1 = __webpack_require__(111);
+
+var SankeyUtils_1 = __webpack_require__(134);
+
 var MAX_NODE_TEXT_WIDTH = 150;
+
 var getNodeOpacity = function getNodeOpacity(nodeIndex, activeNodes) {
   if (!activeNodes || !activeNodes.length) {
     return PureSankey_1.DEFAULT_NODE_OPACITY;
   }
+
   var isActiveNode = activeNodes.find(function (node) {
     return node.index === nodeIndex;
   });
   return isActiveNode ? PureSankey_1.DEFAULT_NODE_OPACITY : PureSankey_1.INACTIVE_OPACITY;
 };
+
 var getNodeHeight = function getNodeHeight(node) {
   return node.dy < 0 ? 1 : node.dy;
 };
+
 var NodeGroup = styled_components_1.default.g.withConfig({
   displayName: "SankeyNode__NodeGroup",
   componentId: "sc-1a3nkch-0"
-})(["opacity:", ";"], function (props) {
+})(["opacity:", ";&:hover{cursor:pointer;}"], function (props) {
   return getNodeOpacity(props.node.index, props.activeNodes);
 });
 NodeGroup.displayName = 'NodeGroup';
@@ -2660,26 +3096,32 @@ var NodeText = styled_components_1.default.text.withConfig({
 }, PureSankey_1.DEFAULT_FONT_FAMILY, function (props) {
   return props.nodeTextColor;
 });
+
 var SankeyNode = function SankeyNode(props) {
   var node = props.node,
-    activeNodes = props.activeNodes,
-    nodeWidth = props.nodeWidth,
-    chartWidth = props.chartWidth,
-    handleMouseOver = props.handleMouseOver,
-    handleMouseLeave = props.handleMouseLeave,
-    colorCategoryMapping = props.colorCategoryMapping,
-    nodeTextColor = props.nodeTextColor;
-  var nodeTextRef = react_1.useRef();
-  react_1.useEffect(function () {
-    SankeyUtils_1.truncateSVGTextWithEllipsis(nodeTextRef.current, node.name, MAX_NODE_TEXT_WIDTH);
+      activeNodes = props.activeNodes,
+      nodeWidth = props.nodeWidth,
+      chartWidth = props.chartWidth,
+      handleMouseOver = props.handleMouseOver,
+      handleMouseLeave = props.handleMouseLeave,
+      handleNodeClick = props.handleNodeClick,
+      colorCategoryMapping = props.colorCategoryMapping,
+      nodeTextColor = props.nodeTextColor;
+  var nodeTextRef = (0, react_1.useRef)();
+  (0, react_1.useEffect)(function () {
+    (0, SankeyUtils_1.truncateSVGTextWithEllipsis)(nodeTextRef.current, node.name, MAX_NODE_TEXT_WIDTH);
   });
+  var nodeClickHandler = (0, react_1.useCallback)(function () {
+    return handleNodeClick(node);
+  }, [node]);
   return React.createElement(NodeGroup, {
     node: node,
     activeNodes: activeNodes,
     className: "node",
     key: "node-".concat(node.index),
     "data-test": "node-".concat(node.index),
-    transform: "translate(".concat(node.x, ",").concat(node.y, ")")
+    transform: "translate(".concat(node.x, ",").concat(node.y, ")"),
+    onClick: nodeClickHandler
   }, React.createElement(React.Fragment, null, React.createElement(NodeRect, {
     node: node,
     height: getNodeHeight(node),
@@ -2701,6 +3143,7 @@ var SankeyNode = function SankeyNode(props) {
     nodeTextColor: nodeTextColor
   }, node.name)));
 };
+
 SankeyNode.propTypes = {
   node: T.object,
   activeNodes: T.arrayOf(T.object),
@@ -2719,7 +3162,60 @@ exports.default = SankeyNode;
 
 /***/ }),
 
-/***/ 457:
+/***/ 46:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var React = __webpack_require__(1);
+
+var styled_components_1 = __webpack_require__(4);
+
+var hocUtils_1 = __webpack_require__(15);
+
+var Cover = styled_components_1.default.div.withConfig({
+  displayName: "withEditModeCover__Cover",
+  componentId: "sc-1gsbnxb-0"
+})(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
+var Blocker = styled_components_1.default.div.attrs({
+  'data-splunk-visualization-version': "26.1.0 - fc8bf8d77"
+}).withConfig({
+  displayName: "withEditModeCover__Blocker",
+  componentId: "sc-1gsbnxb-1"
+})(["position:relative;width:100%;height:100%;"]);
+/**
+ * HOC that renders a cover layer in edit mode
+ * @method withEditModeCover
+ * @param {ExtendedDashViz} Visualization
+ * @returns {ExtendedDashViz} Wrapper
+ */
+
+var withEditModeCover = function withEditModeCover(Visualization, disableEditModeCover) {
+  var Wrapper = function Wrapper(props) {
+    var mode = props.mode;
+    var showEditCover = mode === 'edit' && !disableEditModeCover;
+    return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), showEditCover && React.createElement(Cover, {
+      "data-test": "edit-mode-cover"
+    }));
+  };
+
+  (0, hocUtils_1.extendStaticWrapperProps)({
+    Wrapper: Wrapper,
+    Visualization: Visualization
+  });
+  return Wrapper;
+};
+
+exports.default = withEditModeCover;
+
+/***/ }),
+
+/***/ 460:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -2728,52 +3224,76 @@ exports.default = SankeyNode;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
+var react_1 = __webpack_require__(1);
+
 var T = __webpack_require__(0);
-var PureSankey_1 = __webpack_require__(110);
-var SankeyUtils_1 = __webpack_require__(133);
+
+var styled_components_1 = __webpack_require__(4);
+
+var PureSankey_1 = __webpack_require__(111);
+
+var SankeyUtils_1 = __webpack_require__(134);
+
 var getLinkFill = function getLinkFill(link, colorCategoryMapping, colorMode) {
   if (colorMode === 'categorical') {
     return colorCategoryMapping ? colorCategoryMapping(link.source.name) : PureSankey_1.DEFAULT_LINK_COLOR;
   }
+
   return colorCategoryMapping && colorCategoryMapping[link.index] ? colorCategoryMapping[link.index] : PureSankey_1.DEFAULT_LINK_COLOR;
 };
+
 var getLinkOpacity = function getLinkOpacity(link, activeLinks, linkOpacity) {
   if (!activeLinks || !activeLinks.length) {
     return linkOpacity;
   }
+
   var isActiveLink = activeLinks.find(function (l) {
     return l.id === link.id;
   });
   return isActiveLink ? linkOpacity : PureSankey_1.INACTIVE_OPACITY;
 };
+
+var StyledSankeyLink = styled_components_1.default.g.withConfig({
+  displayName: "SankeyLink__StyledSankeyLink",
+  componentId: "sc-1w9ez3l-0"
+})(["&:hover{cursor:pointer;}"]);
+
 var SankeyLink = function SankeyLink(props) {
   var link = props.link,
-    colorCategoryMapping = props.colorCategoryMapping,
-    activeLinks = props.activeLinks,
-    linkOpacity = props.linkOpacity,
-    colorMode = props.colorMode,
-    path = props.path,
-    handleMouseOver = props.handleMouseOver,
-    handleMouseLeave = props.handleMouseLeave; // This is to draw an invisible circle added to the link's path midpoint,
+      colorCategoryMapping = props.colorCategoryMapping,
+      activeLinks = props.activeLinks,
+      linkOpacity = props.linkOpacity,
+      colorMode = props.colorMode,
+      path = props.path,
+      handleMouseOver = props.handleMouseOver,
+      handleMouseLeave = props.handleMouseLeave,
+      handleLinkClick = props.handleLinkClick; // This is to draw an invisible circle added to the link's path midpoint,
   // which acts as an anchor for the link tooltip
-  var circlePoints = SankeyUtils_1.extractLinkMidPoint(path(1)(link));
-  return React.createElement("g", {
+
+  var circlePoints = (0, SankeyUtils_1.extractLinkMidPoint)(path(1)(link));
+  var linkClickHandler = (0, react_1.useCallback)(function () {
+    return handleLinkClick(link);
+  }, [link]);
+  return React.createElement(StyledSankeyLink, {
     className: "link",
     key: link.id,
     id: link.id,
     "data-test": link.id,
     fill: getLinkFill(link, colorCategoryMapping, colorMode),
     opacity: getLinkOpacity(link, activeLinks, linkOpacity),
+    onClick: linkClickHandler,
     onMouseOver: function onMouseOver(ev) {
       handleMouseOver(ev);
     },
     onMouseLeave: function onMouseLeave(ev) {
       var relatedTarget = ev.relatedTarget;
-      var isRelatedTargetPopover = false;
-      // This is to verify if the mouseLeave is being triggered because of mouseover on a the popover itself.
+      var isRelatedTargetPopover = false; // This is to verify if the mouseLeave is being triggered because of mouseover on a the popover itself.
       // In that case the relatedTarget will have the popover elements and this logic will check on the class name used.
       // If detects the relatedTarget is a popover, then mouseLeave event handler wont be triggered.
+
       if (relatedTarget && relatedTarget.classList) {
         var classList = relatedTarget.classList;
         classList.forEach(function (name) {
@@ -2782,6 +3302,7 @@ var SankeyLink = function SankeyLink(props) {
           }
         });
       }
+
       if (!isRelatedTargetPopover) {
         handleMouseLeave(ev);
       }
@@ -2799,6 +3320,7 @@ var SankeyLink = function SankeyLink(props) {
     fill: "transparent"
   }));
 };
+
 SankeyLink.propTypes = {
   link: T.object,
   activeLinks: T.arrayOf(T.object),
@@ -2816,7 +3338,7 @@ exports.default = SankeyLink;
 
 /***/ }),
 
-/***/ 458:
+/***/ 461:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -2825,12 +3347,19 @@ exports.default = SankeyLink;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
 var T = __webpack_require__(0);
-var Popover_1 = __webpack_require__(61);
+
+var Popover_1 = __webpack_require__(62);
+
 var styled_components_1 = __webpack_require__(4);
-var numberUtils_1 = __webpack_require__(30);
-var PureSankey_1 = __webpack_require__(110);
+
+var numberUtils_1 = __webpack_require__(31);
+
+var PureSankey_1 = __webpack_require__(111);
+
 var DEFAULT_PLACEMENT = 'below';
 var StyledTooltipContainer = styled_components_1.default.div.withConfig({
   displayName: "SankeyTooltip__StyledTooltipContainer",
@@ -2876,50 +3405,59 @@ var NodeValue = styled_components_1.default.div.withConfig({
   displayName: "SankeyTooltip__NodeValue",
   componentId: "x563qp-8"
 })(["margin-left:8px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;"]);
+
 var SankeyTooltip = function SankeyTooltip(props) {
   var mode = props.mode,
-    node = props.node,
-    link = props.link,
-    open = props.open,
-    connectionsMap = props.connectionsMap,
-    anchor = props.anchor,
-    linkValue = props.linkValue,
-    colorCategoryMapping = props.colorCategoryMapping,
-    width = props.width,
-    tooltipRowColor = props.tooltipRowColor,
-    tooltipLinkHeaderColor = props.tooltipLinkHeaderColor,
-    tooltipHeaderColor = props.tooltipHeaderColor,
-    handleTooltipRequestClose = props.handleTooltipRequestClose;
+      node = props.node,
+      link = props.link,
+      open = props.open,
+      connectionsMap = props.connectionsMap,
+      anchor = props.anchor,
+      linkValue = props.linkValue,
+      colorCategoryMapping = props.colorCategoryMapping,
+      width = props.width,
+      tooltipRowColor = props.tooltipRowColor,
+      tooltipLinkHeaderColor = props.tooltipLinkHeaderColor,
+      tooltipHeaderColor = props.tooltipHeaderColor,
+      handleTooltipRequestClose = props.handleTooltipRequestClose;
+
   var showSection = function showSection(connection, nodeData, section) {
     if (!connection) {
       return false;
     }
+
     var connectionNodes = section === 'source' ? connection.sourceNodes : connection.targetNodes;
     var filteredNodes = connectionNodes.filter(function (cNode) {
       return cNode.index !== nodeData.index;
     });
     return filteredNodes.length > 0;
   };
+
   var getPopoverPlacement = function getPopoverPlacement(anchorElement) {
     if (!anchorElement) {
       return DEFAULT_PLACEMENT;
     }
-    var bBox = anchorElement.getBoundingClientRect();
-    // TODO: Depending on the testing result in dashboard reg tooltip position, might need further optimization
+
+    var bBox = anchorElement.getBoundingClientRect(); // TODO: Depending on the testing result in dashboard reg tooltip position, might need further optimization
     // If anchorElement is too close to the left border of the chart, place it to the right side of anchorElement
+
     if (bBox.x <= 15) {
       return 'right';
     }
+
     if (bBox.x >= width - 15) {
       // If anchorElement is too close to the right border of the chart, place it to the right side of anchorElement
       return 'left';
     }
+
     return DEFAULT_PLACEMENT;
   };
+
   var renderNodeToolTip = function renderNodeToolTip() {
     if (!node) {
       return null;
     }
+
     var connections = connectionsMap[node.index];
     return React.createElement(Popover_1.default, {
       open: open,
@@ -2940,12 +3478,13 @@ var SankeyTooltip = function SankeyTooltip(props) {
       colorCategoryMapping: colorCategoryMapping
     }), React.createElement(NodeValue, null, node === null || node === void 0 ? void 0 : node.name)), React.createElement(StyledTooltipRightCell, {
       "data-test": "main-row-value"
-    }, numberUtils_1.formatNumber(node === null || node === void 0 ? void 0 : node.value, 0, {
+    }, (0, numberUtils_1.formatNumber)(node === null || node === void 0 ? void 0 : node.value, 0, {
       useTrendUnits: true
     }))), showSection(connections, node, 'source') && React.createElement(StyledTooltipHeader, {
       headerColor: tooltipHeaderColor
     }, React.createElement(StyledTooltipLeftCell, null, "Source"), React.createElement(StyledTooltipRightCell, null, linkValue)), React.createElement(StyledTooltipSection, null, connections && connections.sourceNodes.map(function (sNode, idx) {
       var _a, _b;
+
       if ((sNode === null || sNode === void 0 ? void 0 : sNode.index) !== (node === null || node === void 0 ? void 0 : node.index) || ((_a = connections.sourceNodes[idx]) === null || _a === void 0 ? void 0 : _a.index) === ((_b = connections.targetNodes[idx]) === null || _b === void 0 ? void 0 : _b.index)) {
         return React.createElement(StyledTooltipRow, {
           key: sNode.index,
@@ -2958,15 +3497,17 @@ var SankeyTooltip = function SankeyTooltip(props) {
           "data-test": "source-row-name"
         }, sNode === null || sNode === void 0 ? void 0 : sNode.name)), React.createElement(StyledTooltipRightCell, {
           "data-test": "source-row-value"
-        }, numberUtils_1.formatNumber(sNode === null || sNode === void 0 ? void 0 : sNode.value, 0, {
+        }, (0, numberUtils_1.formatNumber)(sNode === null || sNode === void 0 ? void 0 : sNode.value, 0, {
           useTrendUnits: true
         })));
       }
+
       return null;
     })), showSection(connections, node, 'target') && React.createElement(StyledTooltipHeader, {
       headerColor: tooltipHeaderColor
     }, React.createElement(StyledTooltipLeftCell, null, "Target"), React.createElement(StyledTooltipRightCell, null, linkValue)), React.createElement(StyledTooltipSection, null, connections && connections.targetNodes.map(function (tNode, idx) {
       var _a, _b;
+
       if ((tNode === null || tNode === void 0 ? void 0 : tNode.index) !== (node === null || node === void 0 ? void 0 : node.index) || ((_a = connections.sourceNodes[idx]) === null || _a === void 0 ? void 0 : _a.index) === ((_b = connections.targetNodes[idx]) === null || _b === void 0 ? void 0 : _b.index)) {
         return React.createElement(StyledTooltipRow, {
           key: tNode.index,
@@ -2979,18 +3520,22 @@ var SankeyTooltip = function SankeyTooltip(props) {
           "data-test": "target-row-name"
         }, tNode === null || tNode === void 0 ? void 0 : tNode.name)), React.createElement(StyledTooltipRightCell, {
           "data-test": "target-row-value"
-        }, numberUtils_1.formatNumber(tNode === null || tNode === void 0 ? void 0 : tNode.value, 0, {
+        }, (0, numberUtils_1.formatNumber)(tNode === null || tNode === void 0 ? void 0 : tNode.value, 0, {
           useTrendUnits: true
         })));
       }
+
       return null;
     }))));
   };
+
   var renderLinkToolTip = function renderLinkToolTip() {
     var _a, _b, _c, _d;
+
     if (!link) {
       return null;
     }
+
     return React.createElement(Popover_1.default, {
       open: open,
       anchor: anchor,
@@ -3006,7 +3551,7 @@ var SankeyTooltip = function SankeyTooltip(props) {
       "data-test": "main-row-name"
     }, "Link Size"), React.createElement(StyledTooltipRightCell, {
       "data-test": "main-row-value"
-    }, numberUtils_1.formatNumber(link === null || link === void 0 ? void 0 : link.value, 0, {
+    }, (0, numberUtils_1.formatNumber)(link === null || link === void 0 ? void 0 : link.value, 0, {
       useTrendUnits: true
     }))), React.createElement(StyledTooltipHeader, {
       headerColor: tooltipHeaderColor
@@ -3020,7 +3565,7 @@ var SankeyTooltip = function SankeyTooltip(props) {
       "data-test": "source-row-name"
     }, (_a = link === null || link === void 0 ? void 0 : link.source) === null || _a === void 0 ? void 0 : _a.name)), React.createElement(StyledTooltipRightCell, {
       "data-test": "source-row-value"
-    }, numberUtils_1.formatNumber((_b = link === null || link === void 0 ? void 0 : link.source) === null || _b === void 0 ? void 0 : _b.value, 0, {
+    }, (0, numberUtils_1.formatNumber)((_b = link === null || link === void 0 ? void 0 : link.source) === null || _b === void 0 ? void 0 : _b.value, 0, {
       useTrendUnits: true
     }), ' '))), React.createElement(StyledTooltipHeader, {
       headerColor: tooltipHeaderColor
@@ -3034,12 +3579,14 @@ var SankeyTooltip = function SankeyTooltip(props) {
       "data-test": "target-row-name"
     }, (_c = link === null || link === void 0 ? void 0 : link.target) === null || _c === void 0 ? void 0 : _c.name)), React.createElement(StyledTooltipRightCell, {
       "data-test": "target-row-value"
-    }, numberUtils_1.formatNumber((_d = link === null || link === void 0 ? void 0 : link.target) === null || _d === void 0 ? void 0 : _d.value, 0, {
+    }, (0, numberUtils_1.formatNumber)((_d = link === null || link === void 0 ? void 0 : link.target) === null || _d === void 0 ? void 0 : _d.value, 0, {
       useTrendUnits: true
     }))))));
   };
+
   return mode === 'node' ? renderNodeToolTip() : renderLinkToolTip();
 };
+
 SankeyTooltip.propTypes = {
   mode: T.string,
   node: T.object,
@@ -3062,7 +3609,7 @@ exports.default = SankeyTooltip;
 
 /***/ }),
 
-/***/ 459:
+/***/ 462:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3071,18 +3618,31 @@ exports.default = SankeyTooltip;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var visualization_icons_1 = __webpack_require__(52);
-var placeholders_1 = __webpack_require__(49);
+
+var placeholders_1 = __webpack_require__(50);
+
 var visualization_color_palettes_1 = __webpack_require__(51);
+
 var schemaUtils_1 = __webpack_require__(16);
-var PresetPalettes_1 = __webpack_require__(60);
-var themes_1 = __webpack_require__(59);
+
+var PresetPalettes_1 = __webpack_require__(61);
+
+var themes_1 = __webpack_require__(60);
+
 var i18n_1 = __webpack_require__(2);
+
 var VizBehavior_1 = __webpack_require__(6);
-var VizCategory_1 = __webpack_require__(35);
+
+var VizCategory_1 = __webpack_require__(36);
+
 var configUtils_1 = __webpack_require__(20);
-var DynamicLinkColorsEditor_1 = __webpack_require__(460);
+
+var DynamicLinkColorsEditor_1 = __webpack_require__(463);
+
 var BackgroundColor_1 = __webpack_require__(53);
+
 var defaultContext = {
   linkColorRangeConfig: [{
     to: 20,
@@ -3135,7 +3695,7 @@ var optionsSchema = {
   colorMode: {
     default: 'categorical',
     description: 'Specify the coloring method used for the links. When set to "categorical" the nodes and links will be colored based on the "seriesColors". When set to "dynamic" the links will be colored based on the dynamic string assigned to "linkColors".',
-    pattern: schemaUtils_1.getPattern(['categorical', 'dynamic']),
+    pattern: (0, schemaUtils_1.getPattern)(['categorical', 'dynamic']),
     type: 'string'
   },
   linkColors: {
@@ -3173,7 +3733,7 @@ var optionsSchema = {
 };
 var themes = {
   defaultBackgroundColor: function defaultBackgroundColor(props) {
-    return themes_1.pick({
+    return (0, themes_1.pick)({
       enterprise: {
         dark: themes_1.variables.black(props),
         light: themes_1.variables.backgroundColor(props)
@@ -3182,7 +3742,7 @@ var themes = {
     })(props);
   },
   nodeTextColor: function nodeTextColor(props) {
-    return themes_1.pick({
+    return (0, themes_1.pick)({
       enterprise: {
         dark: themes_1.variables.textColor(props),
         light: themes_1.variables.textColor(props)
@@ -3191,7 +3751,7 @@ var themes = {
     })(props);
   },
   tooltipRowColor: function tooltipRowColor(props) {
-    return themes_1.pick({
+    return (0, themes_1.pick)({
       enterprise: {
         dark: themes_1.variables.textColor(props),
         light: themes_1.variables.textColor(props)
@@ -3200,7 +3760,7 @@ var themes = {
     })(props);
   },
   tooltipLinkHeaderColor: function tooltipLinkHeaderColor(props) {
-    return themes_1.pick({
+    return (0, themes_1.pick)({
       enterprise: {
         dark: themes_1.variables.textColor(props),
         light: themes_1.variables.textColor(props)
@@ -3209,7 +3769,7 @@ var themes = {
     })(props);
   },
   tooltipHeaderColor: function tooltipHeaderColor(props) {
-    return themes_1.pick({
+    return (0, themes_1.pick)({
       enterprise: {
         dark: themes_1.variables.textGray(props),
         light: themes_1.variables.textGray(props)
@@ -3219,7 +3779,7 @@ var themes = {
   }
 };
 var editorConfig = [{
-  label: i18n_1._('Data configurations'),
+  label: (0, i18n_1._)('Data configurations'),
   layout: [[{
     label: 'Link value',
     editor: 'editor.columnSelector',
@@ -3231,21 +3791,21 @@ var editorConfig = [{
     }
   }]]
 }, {
-  label: i18n_1._('Color and style'),
+  label: (0, i18n_1._)('Color and style'),
   layout: [[{
-    label: i18n_1._('Color mode'),
+    label: (0, i18n_1._)('Color mode'),
     option: 'colorMode',
     editor: 'editor.radioBar',
     editorProps: {
       values: [{
-        label: i18n_1._('Categorical'),
+        label: (0, i18n_1._)('Categorical'),
         value: 'categorical'
       }, {
-        label: i18n_1._('Dynamic'),
+        label: (0, i18n_1._)('Dynamic'),
         value: 'dynamic'
       }]
     }
-  }], [Object.assign(Object.assign({}, DynamicLinkColorsEditor_1.getDynamicLinkColorsEditor({
+  }], [Object.assign(Object.assign({}, (0, DynamicLinkColorsEditor_1.getDynamicLinkColorsEditor)({
     defaultContext: defaultContext,
     defaultPalettesConfig: PresetPalettes_1.defaultPalettesConfig
   })), {
@@ -3253,24 +3813,27 @@ var editorConfig = [{
       var options = _ref.options;
       return options.colorMode === 'dynamic';
     }
-  })], BackgroundColor_1.default({
+  })], (0, BackgroundColor_1.default)({
     themes: themes
   })]
 }];
 /**
  * visualization configuration
  */
+
 var config = {
   /**
    * unique viz key
    */
   key: 'splunk.sankey',
+
   /**
    * viz name
    */
-  name: i18n_1._('Sankey'),
+  name: (0, i18n_1._)('Sankey'),
   category: VizCategory_1.VizCategory.FLOW,
   status: 'preview',
+
   /**
    * viz icon
    */
@@ -3281,62 +3844,23 @@ var config = {
   defaultContext: defaultContext,
   optionsSchema: optionsSchema,
   editorConfig: editorConfig,
-  events: {},
+  events: {
+    'node.click': {
+      description: 'Triggered when user clicks on a node'
+    },
+    'link.click': {
+      description: 'Triggered when user clicks on a link'
+    }
+  },
   supports: [VizBehavior_1.VizBehavior.DYNAMIC_OPTIONS, VizBehavior_1.VizBehavior.EVENTS, VizBehavior_1.VizBehavior.PLACEHOLDER],
   themes: themes,
   requiredProps: []
 };
-exports.default = configUtils_1.enhanceConfig(config);
-
-/***/ }),
-
-/***/ 46:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var React = __webpack_require__(1);
-var styled_components_1 = __webpack_require__(4);
-var hocUtils_1 = __webpack_require__(15);
-var Cover = styled_components_1.default.div.withConfig({
-  displayName: "withEditModeCover__Cover",
-  componentId: "sc-1gsbnxb-0"
-})(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
-var Blocker = styled_components_1.default.div.attrs({
-  'data-splunk-visualization-version': "25.13.1 - ea48ec41e"
-}).withConfig({
-  displayName: "withEditModeCover__Blocker",
-  componentId: "sc-1gsbnxb-1"
-})(["position:relative;width:100%;height:100%;"]);
-/**
- * HOC that renders a cover layer in edit mode
- * @method withEditModeCover
- * @param {ExtendedDashViz} Visualization
- * @returns {ExtendedDashViz} Wrapper
- */
-var withEditModeCover = function withEditModeCover(Visualization, disableEditModeCover) {
-  var Wrapper = function Wrapper(props) {
-    var mode = props.mode;
-    var showEditCover = mode === 'edit' && !disableEditModeCover;
-    return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), showEditCover && React.createElement(Cover, {
-      "data-test": "edit-mode-cover"
-    }));
-  };
-  hocUtils_1.extendStaticWrapperProps({
-    Wrapper: Wrapper,
-    Visualization: Visualization
-  });
-  return Wrapper;
-};
-exports.default = withEditModeCover;
+exports.default = (0, configUtils_1.enhanceConfig)(config);
 
 /***/ }),
 
-/***/ 460:
+/***/ 463:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -3350,7 +3874,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var getDynamicLinkColorsEditor = function getDynamicLinkColorsEditor(_ref) {
   var defaultContext = _ref.defaultContext,
-    defaultPalettesConfig = _ref.defaultPalettesConfig;
+      defaultPalettesConfig = _ref.defaultPalettesConfig;
   return {
     label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Link'),
     option: 'linkColors',
@@ -3396,27 +3920,37 @@ var getDynamicLinkColorsEditor = function getDynamicLinkColorsEditor(_ref) {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var React = __webpack_require__(1);
+
 var colorUtils_1 = __webpack_require__(12);
+
 var variables_1 = __webpack_require__(11);
-var IconPlaceholder_1 = __webpack_require__(31);
+
+var IconPlaceholder_1 = __webpack_require__(32);
+
 var VizBehavior_1 = __webpack_require__(6);
+
 var hocUtils_1 = __webpack_require__(15);
+
 var withPlaceholder = function withPlaceholder(Visualization) {
   var useIconPlaceholder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : IconPlaceholder_1.shouldShowIconPlaceholder;
   var config = Visualization.config;
   var themes = config.themes;
+
   var Wrapper = function Wrapper(props) {
     var _a, _b;
+
     var dataSources = props.dataSources,
-      loading = props.loading,
-      options = props.options,
-      height = props.height,
-      width = props.width;
+        loading = props.loading,
+        options = props.options,
+        height = props.height,
+        width = props.width;
     var showPlaceholder = useIconPlaceholder(dataSources, loading, options);
-    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);
+    var bgColorFromTheme = (0, 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);
     var icon = (_b = config.placeholderIcon) !== null && _b !== void 0 ? _b : config.icon;
     var iconColor = variables_1.default.contentColorActive(props);
+
     if (config.supports.includes(VizBehavior_1.VizBehavior.PLACEHOLDER) && showPlaceholder) {
       return React.createElement(IconPlaceholder_1.default, {
         "data-test": "icon-placeholder",
@@ -3427,19 +3961,22 @@ var withPlaceholder = function withPlaceholder(Visualization) {
         iconColor: iconColor
       });
     }
+
     return React.createElement(Visualization, Object.assign({}, props));
   };
-  hocUtils_1.extendStaticWrapperProps({
+
+  (0, hocUtils_1.extendStaticWrapperProps)({
     Wrapper: Wrapper,
     Visualization: Visualization
   });
   return Wrapper;
 };
+
 exports.default = withPlaceholder;
 
 /***/ }),
 
-/***/ 49:
+/***/ 50:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-icons/placeholders");
@@ -3469,13 +4006,15 @@ module.exports = require("@splunk/visualization-icons");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var i18n_1 = __webpack_require__(2);
+
 var background = function background(_ref) {
   var label = _ref.label,
-    themes = _ref.themes,
-    labelPosition = _ref.labelPosition;
+      themes = _ref.themes,
+      labelPosition = _ref.labelPosition;
   return [{
-    label: i18n_1._(label || 'Background'),
+    label: (0, i18n_1._)(label || 'Background'),
     option: 'backgroundColor',
     editor: 'editor.color',
     editorProps: {
@@ -3484,14 +4023,8 @@ var background = function background(_ref) {
     }
   }];
 };
-exports.default = background;
-
-/***/ }),
-
-/***/ 59:
-/***/ (function(module, exports) {
 
-module.exports = require("@splunk/themes");
+exports.default = background;
 
 /***/ }),
 
@@ -3506,6 +4039,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.VizBehavior = void 0;
 var VizBehavior;
+
 (function (VizBehavior) {
   /**
    * Dynamic Options Behavior.
@@ -3525,6 +4059,7 @@ var VizBehavior;
    * missing.
    * @type {string}
    */
+
   VizBehavior["PLACEHOLDER"] = "placeholder";
   VizBehavior["PAGE_AND_SORT"] = "page-and-sort";
   VizBehavior["TRELLIS"] = "trellis";
@@ -3535,18 +4070,25 @@ var VizBehavior;
 /***/ 60:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualization-color-palettes/editors/PresetPalettes");
+module.exports = require("@splunk/themes");
 
 /***/ }),
 
 /***/ 61:
 /***/ (function(module, exports) {
 
+module.exports = require("@splunk/visualization-color-palettes/editors/PresetPalettes");
+
+/***/ }),
+
+/***/ 62:
+/***/ (function(module, exports) {
+
 module.exports = require("@splunk/react-ui/Popover");
 
 /***/ }),
 
-/***/ 63:
+/***/ 64:
 /***/ (function(module, exports) {
 
 module.exports = require("d3-array");
@@ -3560,7 +4102,7 @@ module.exports = require("@babel/runtime/helpers/defineProperty");
 
 /***/ }),
 
-/***/ 72:
+/***/ 73:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -3592,35 +4134,35 @@ module.exports = require("@babel/runtime/helpers/toConsumableArray");
 
 /***/ }),
 
-/***/ 9:
+/***/ 82:
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/classCallCheck");
+module.exports = require("@babel/runtime/helpers/typeof");
 
 /***/ }),
 
-/***/ 91:
+/***/ 83:
 /***/ (function(module, exports) {
 
-module.exports = require("d3-scale");
+module.exports = require("@splunk/visualization-encoding/utils/types");
 
 /***/ }),
 
-/***/ 93:
+/***/ 9:
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/typeof");
+module.exports = require("@babel/runtime/helpers/classCallCheck");
 
 /***/ }),
 
-/***/ 94:
+/***/ 93:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualization-encoding/utils/types");
+module.exports = require("d3-scale");
 
 /***/ }),
 
-/***/ 96:
+/***/ 97:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/dataSourceUtils");