@splunk/visualizations 28.7.0 → 28.9.0

package/Table.js

@@ -437,7 +437,7 @@ var themes = {
     prisma: variables_default.contentColorInverted(props)
   })(props)
 };
-var backgroundColorPaletteSet = /* @__PURE__ */ new Set([...colorConstants_exports.COLOR_EDITOR_PALETTE]);
+var backgroundColorPaletteSet = new Set(colorConstants_exports.COLOR_EDITOR_PALETTE);
 var EDITOR_LABEL_WIDTH = 100;
 var editorConfig = [
   {
@@ -454,6 +454,13 @@ var editorConfig = [
           }
         }
       ],
+      [
+        {
+          label: (0, i18n_exports._)("Dynamic table height"),
+          option: "dynamicHeight",
+          editor: "editor.toggle"
+        }
+      ],
       [
         {
           label: (0, i18n_exports._)("Row numbers"),
@@ -1061,7 +1068,10 @@ var useSortingParams = ({ requestParams, onRequestParamsChange }) => {
     onSort = (e, { sortKey, sortDir }) => {
       if (typeof sortKey === "string") {
         const nextSortDir = (0, lodash_exports.has)(nextSortDirMap, sortDir) ? nextSortDirMap[sortDir] : "none";
-        onRequestParamsChange(__spreadValues(__spreadValues({}, requestParams), { offset: 0, sort: { [sortKey]: nextSortDir } }));
+        onRequestParamsChange(__spreadProps(__spreadValues({}, requestParams), {
+          offset: 0,
+          sort: { [sortKey]: nextSortDir }
+        }));
       } else {
         onRequestParamsChange(requestParams);
       }
@@ -1196,7 +1206,7 @@ var Cover = styled_components_default.div`
     bottom: 0;
 `;
 var Blocker = styled_components_default.div.attrs({
-  "data-splunk-visualization-version": "28.7.0 - d7b18cab6"
+  "data-splunk-visualization-version": "28.9.0 - 96b03188d"
 })`
     position: relative;
     width: 100%;
@@ -1213,14 +1223,23 @@ var withEditModeCover = (Visualization, disableEditModeCover) => {
 };
 var withEditModeCover_default = withEditModeCover;
 
+// esm-externals:@splunk/themes
+var themes_exports = {};
+__export(themes_exports, {
+  default: () => themes_default
+});
+var defaultImport30 = __toESM(require("@splunk/themes"));
+__reExport(themes_exports, require("@splunk/themes"));
+var themes_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
+
 // esm-externals:@splunk/visualizations-shared/style
 var style_exports = {};
 __export(style_exports, {
   default: () => style_default
 });
-var defaultImport30 = __toESM(require("@splunk/visualizations-shared/style"));
+var defaultImport31 = __toESM(require("@splunk/visualizations-shared/style"));
 __reExport(style_exports, require("@splunk/visualizations-shared/style"));
-var style_default = "default" in defaultImport30 ? defaultImport30.default : defaultImport30;
+var style_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
 
 // src/common/hocs/FixedSizeContainer.tsx
 var Item = styled_components_default.div.attrs(({ width }) => ({
@@ -1277,7 +1296,7 @@ var withFixedSizeContainer = (Viz) => {
       FixSizeItem,
       {
         "data-test": "fix-size-item",
-        "data-splunk-visualization-version": "28.7.0 - d7b18cab6",
+        "data-splunk-visualization-version": "28.9.0 - 96b03188d",
         width,
         height,
         backgroundColor
@@ -1298,6 +1317,14 @@ var shouldShowIconPlaceholder = (dataSources, loading = false) => {
   const noFields = fields === void 0;
   return loading || noData || noFields;
 };
+var PlaceholderContainer = styled_components_default.div`
+    /* The inline token color wins when supported. Older browsers discard an
+       unsupported oklch value and retain this inherited fallback instead. */
+    color: ${(0, themes_exports.pick)({
+  dark: "#fafafa",
+  light: "#2c2c2c"
+})};
+`;
 var IconPlaceholder = (props) => {
   const {
     width = SplunkVisualization_default.defaults.width,
@@ -1312,7 +1339,6 @@ var IconPlaceholder = (props) => {
       style: {
         left: "50%",
         top: "50%",
-        color: iconColor,
         opacity: 0.15,
         position: "absolute",
         transform: "translate(-50%, -50%)"
@@ -1322,7 +1348,14 @@ var IconPlaceholder = (props) => {
       "data-test": "icon-placeholder"
     });
   }
-  return /* @__PURE__ */ react_exports.createElement("div", { style: { width, height, background: backgroundColor } }, content);
+  return /* @__PURE__ */ react_exports.createElement(
+    PlaceholderContainer,
+    {
+      "data-test": "icon-placeholder-container",
+      style: { width, height, background: backgroundColor, color: iconColor }
+    },
+    content
+  );
 };
 var IconPlaceholder_default = FixedSizeContainer_default(IconPlaceholder);
 
@@ -1368,9 +1401,9 @@ var numberUtils_exports = {};
 __export(numberUtils_exports, {
   default: () => numberUtils_default
 });
-var defaultImport31 = __toESM(require("@splunk/visualizations-shared/numberUtils"));
+var defaultImport32 = __toESM(require("@splunk/visualizations-shared/numberUtils"));
 __reExport(numberUtils_exports, require("@splunk/visualizations-shared/numberUtils"));
-var numberUtils_default = "default" in defaultImport31 ? defaultImport31.default : defaultImport31;
+var numberUtils_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
 
 // src/common/utils/dataUtils.ts
 var getFieldName = (field) => typeof field === "string" ? field : field.name;
@@ -1396,7 +1429,7 @@ var largestTriangleThreeBuckets = (data, threshold, preferredDownsampleIndices)
     let avgY = 0;
     let avgRangeStart = Math.floor((i + 1) * every) + 1;
     let avgRangeEnd = Math.floor((i + 2) * every) + 1;
-    avgRangeEnd = avgRangeEnd < dataLength ? avgRangeEnd : dataLength;
+    avgRangeEnd = Math.min(avgRangeEnd, dataLength);
     const avgRangeLength = avgRangeEnd - avgRangeStart;
     for (; avgRangeStart < avgRangeEnd; avgRangeStart++) {
       avgX += Number(data[avgRangeStart][0]);
@@ -1431,9 +1464,9 @@ var largestTriangleThreeBuckets = (data, threshold, preferredDownsampleIndices)
 };
 var strictlyCoerceYColumn = (column, options) => {
   const isNullCoercionEnabled = options.nullValueDisplay === "zero";
-  const canLooselyCoerceSomeValues = column.findIndex(
+  const canLooselyCoerceSomeValues = column.some(
     (value) => (0, numberUtils_exports.startsWithNumber)(`${value}`) || isNullCoercionEnabled && value === null
-  ) >= 0;
+  );
   const coercedColumn = [];
   const canDownsampleColumn = !column.some((value) => {
     const coercedValue = Number(value);
@@ -1452,7 +1485,7 @@ var strictlyCoerceYColumn = (column, options) => {
 };
 var strictlyCoerceXColumn = (column, fieldType) => {
   if (fieldType === "number") {
-    const coercedXColumn = column.map((xValue) => Number(xValue));
+    const coercedXColumn = column.map(Number);
     if (isColumnStrictlyIncreasing(coercedXColumn, fieldType)) {
       return coercedXColumn;
     }
@@ -1751,16 +1784,16 @@ var FeatureFlags_exports = {};
 __export(FeatureFlags_exports, {
   default: () => FeatureFlags_default
 });
-var defaultImport32 = __toESM(require("@splunk/visualization-context/FeatureFlags"));
+var defaultImport33 = __toESM(require("@splunk/visualization-context/FeatureFlags"));
 __reExport(FeatureFlags_exports, require("@splunk/visualization-context/FeatureFlags"));
-var FeatureFlags_default = "default" in defaultImport32 ? defaultImport32.default : defaultImport32;
+var FeatureFlags_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
 
 // src/common/utils/featureFlagUtils.ts
 var getFeatureFlag = (context, flagName) => {
-  if (context && Object.keys(context).find((key) => key === flagName)) {
+  if (context && Object.keys(context).includes(flagName)) {
     return context[flagName];
   }
-  if (Object.keys(FeatureFlags_default).find((key) => key === flagName)) {
+  if (Object.keys(FeatureFlags_default).includes(flagName)) {
     return FeatureFlags_default[flagName];
   }
   return false;
@@ -1771,9 +1804,9 @@ var trellisUtils_exports = {};
 __export(trellisUtils_exports, {
   default: () => trellisUtils_default
 });
-var defaultImport33 = __toESM(require("@splunk/visualizations-shared/trellisUtils"));
+var defaultImport34 = __toESM(require("@splunk/visualizations-shared/trellisUtils"));
 __reExport(trellisUtils_exports, require("@splunk/visualizations-shared/trellisUtils"));
-var trellisUtils_default = "default" in defaultImport33 ? defaultImport33.default : defaultImport33;
+var trellisUtils_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
 
 // src/common/utils/trellisUtils.ts
 var turnOffLegendDisplayWhenTrellisIsOn = (isTrellisOn, options) => {
@@ -1790,9 +1823,9 @@ var visualization_canvas_exports = {};
 __export(visualization_canvas_exports, {
   default: () => visualization_canvas_default
 });
-var defaultImport34 = __toESM(require("@splunk/visualization-canvas"));
+var defaultImport35 = __toESM(require("@splunk/visualization-canvas"));
 __reExport(visualization_canvas_exports, require("@splunk/visualization-canvas"));
-var visualization_canvas_default = "default" in defaultImport34 ? defaultImport34.default : defaultImport34;
+var visualization_canvas_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
 
 // src/common/components/VizStyleWrapper.jsx
 var VizStyleWrapper = styled_components_default.div.attrs(({ dataTestKey }) => ({
@@ -1814,27 +1847,27 @@ var Triangle_exports = {};
 __export(Triangle_exports, {
   default: () => Triangle_default
 });
-var defaultImport35 = __toESM(require("@splunk/react-icons/Triangle"));
+var defaultImport36 = __toESM(require("@splunk/react-icons/Triangle"));
 __reExport(Triangle_exports, require("@splunk/react-icons/Triangle"));
-var Triangle_default = "default" in defaultImport35 ? defaultImport35.default : defaultImport35;
+var Triangle_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
 
 // esm-externals:@splunk/visualizations-shared/propUtils
 var propUtils_exports = {};
 __export(propUtils_exports, {
   default: () => propUtils_default
 });
-var defaultImport36 = __toESM(require("@splunk/visualizations-shared/propUtils"));
+var defaultImport37 = __toESM(require("@splunk/visualizations-shared/propUtils"));
 __reExport(propUtils_exports, require("@splunk/visualizations-shared/propUtils"));
-var propUtils_default = "default" in defaultImport36 ? defaultImport36.default : defaultImport36;
+var propUtils_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
 
 // esm-externals:@splunk/visualizations-shared/simpleXMLOptions
 var simpleXMLOptions_exports = {};
 __export(simpleXMLOptions_exports, {
   default: () => simpleXMLOptions_default
 });
-var defaultImport37 = __toESM(require("@splunk/visualizations-shared/simpleXMLOptions"));
+var defaultImport38 = __toESM(require("@splunk/visualizations-shared/simpleXMLOptions"));
 __reExport(simpleXMLOptions_exports, require("@splunk/visualizations-shared/simpleXMLOptions"));
-var simpleXMLOptions_default = "default" in defaultImport37 ? defaultImport37.default : defaultImport37;
+var simpleXMLOptions_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
 
 // src/common/chartingUtils.ts
 var DEFAULT_LINE_WIDTH = 2;
@@ -1873,9 +1906,9 @@ var shouldEnableSearchZoom = (eventHandlers = [], xField = "") => {
   const xAxisIsTime = xField === "_time";
   return !!rangeSelectEventHandler && xAxisIsTime;
 };
-var canvasSupportedTimeSeriesCharts = ["splunk.line", "splunk.area"];
+var canvasSupportedTimeSeriesCharts = /* @__PURE__ */ new Set(["splunk.line", "splunk.area"]);
 var isTimeSeriesCanvasRenderSupported = (vizConfigKey) => {
-  return canvasSupportedTimeSeriesCharts.includes(vizConfigKey);
+  return canvasSupportedTimeSeriesCharts.has(vizConfigKey);
 };
 var filterChartDataFromInternalFields = (chartData) => {
   const { fields, columns } = chartData;
@@ -1891,7 +1924,7 @@ var filterChartDataFromInternalFields = (chartData) => {
   return { fields: filteredFields, columns: filteredColumns };
 };
 var convert2DArrayToNumbers = (arr) => {
-  return arr.map((subArray) => subArray.map((element) => parseFloat(element)));
+  return arr.map((subArray) => subArray.map((element) => Number.parseFloat(element)));
 };
 var parseAxisValue = (val) => {
   if (val === void 0 || val === null || val === "auto" || val === "") {
@@ -1929,6 +1962,7 @@ var getLegend = (props) => {
       return (0, visualization_canvas_exports.TopLegendFactory)(__spreadValues({
         wrap: true
       }, commonLegendProps));
+    // Note: By default, use right legend
     default:
       return (0, visualization_canvas_exports.SideLegendFactory)(__spreadValues({}, commonLegendProps));
   }
@@ -2061,10 +2095,10 @@ var getSeriesOverrides = (opts) => {
   let spanGaps;
   if (nullValueMode === "gaps") {
     spanGaps = false;
-  } else if (nullValueMode != null) {
-    spanGaps = true;
-  } else {
+  } else if (nullValueMode == null) {
     spanGaps = void 0;
+  } else {
+    spanGaps = true;
   }
   const replaceNullsWithZero = nullValueMode === "zero" ? true : void 0;
   const isAreaChart = type === "area";
@@ -2495,11 +2529,11 @@ var TimeSeriesChartWrapper = (props) => {
     y2AxisMajorUnitFromSimpleXML,
     y2AxisMajorTickInterval
   );
-  const xAxisMajorTickSizeNum = xAxisMajorTickSize != null ? Number(xAxisMajorTickSize) : void 0;
-  const yAxisMajorTickSizeNum = yAxisMajorTickSize != null ? Number(yAxisMajorTickSize) : void 0;
-  const y2AxisMajorTickSizeNum = y2AxisMajorTickSize != null ? Number(y2AxisMajorTickSize) : void 0;
-  const yAxisMinorTickSizeNum = yAxisMinorTickSize != null ? Number(yAxisMinorTickSize) : void 0;
-  const y2AxisMinorTickSizeNum = y2AxisMinorTickSize != null ? Number(y2AxisMinorTickSize) : void 0;
+  const xAxisMajorTickSizeNum = xAxisMajorTickSize == null ? void 0 : Number(xAxisMajorTickSize);
+  const yAxisMajorTickSizeNum = yAxisMajorTickSize == null ? void 0 : Number(yAxisMajorTickSize);
+  const y2AxisMajorTickSizeNum = y2AxisMajorTickSize == null ? void 0 : Number(y2AxisMajorTickSize);
+  const yAxisMinorTickSizeNum = yAxisMinorTickSize == null ? void 0 : Number(yAxisMinorTickSize);
+  const y2AxisMinorTickSizeNum = y2AxisMinorTickSize == null ? void 0 : Number(y2AxisMinorTickSize);
   const areaOpacityForCanvas = getAreaOpacityForCanvas(areaOpacity);
   const seriesColors = seriesColorsStr ? JSON.parse(seriesColorsStr) : void 0;
   const seriesColorsByField = fieldColors ? JSON.parse(fieldColors) : void 0;
@@ -2911,6 +2945,76 @@ var buildEventCallbackProps = (supportedEvents, evaluatedOptionsToUse, onEventTr
   });
   return result;
 };
+var buildAllEventCallbackProps = (events, evaluatedOptionsToUse, onEventTrigger, { supportsEvents, hasEventHandlers, mode }) => {
+  if (!supportsEvents) return {};
+  const defaultEvents = {};
+  const userEvents = {};
+  Object.entries(events || {}).forEach(([eventKey, eventConfig]) => {
+    (eventConfig.source === "default" ? defaultEvents : userEvents)[eventKey] = eventConfig;
+  });
+  const userProps = hasEventHandlers && mode === "view" ? buildEventCallbackProps(userEvents, evaluatedOptionsToUse, onEventTrigger) : {};
+  return __spreadValues(__spreadValues({}, userProps), buildEventCallbackProps(defaultEvents, evaluatedOptionsToUse, onEventTrigger));
+};
+var applyContextTimezone = (localeContext) => {
+  if (localeContext.serializedTimezone && !moment_default.getDefaultSplunkTimezone()) {
+    moment_default.setDefaultSplunkTimezone(localeContext.serializedTimezone);
+  }
+};
+var getAsyncOptionsEvaluationParams = ({
+  visualizationID,
+  props,
+  optionsToEvaluate,
+  downsampledDataSources,
+  vizConfig,
+  bypassCloneDeepOptionScope,
+  lazyLoadingDataFrame
+}) => {
+  return {
+    visualizationID,
+    props,
+    options: __spreadValues({}, optionsToEvaluate),
+    dataSources: downsampledDataSources,
+    theme: vizConfig.themes,
+    bypassCloneDeepOptionScope,
+    lazyLoadingDataFrame
+  };
+};
+var evaluateOptionsSync = ({
+  optionsToEvaluate,
+  downsampledDataSources,
+  dataSourcesInState,
+  dataFramesInState,
+  setDataSourcesInState,
+  setDataFramesInState,
+  computeDataFrames,
+  featureFlagContext,
+  themeFunc
+}) => {
+  let dataFrames = dataFramesInState;
+  if (downsampledDataSources !== dataSourcesInState) {
+    setDataSourcesInState(downsampledDataSources);
+    dataFrames = Options_exports.Options.dataFrameFromDataSource(
+      downsampledDataSources,
+      getFeatureFlag(featureFlagContext, "visualizations_lazyLoadingDataFrame")
+    );
+    setDataFramesInState(dataFrames);
+  }
+  let mergedFrames = dataFrames;
+  if (computeDataFrames && dataFrames) {
+    const derivedFrames = computeDataFrames({
+      dataSources: downsampledDataSources,
+      options: optionsToEvaluate.options
+    });
+    mergedFrames = __spreadValues(__spreadValues({}, dataFrames), derivedFrames);
+  }
+  return Options_exports.Options.evaluate(
+    optionsToEvaluate,
+    downsampledDataSources,
+    themeFunc,
+    mergedFrames,
+    getFeatureFlag(featureFlagContext, "visualizations_bypassCloneDeepOptionScope")
+  );
+};
 var withDashboardViz = (opts) => {
   const {
     ReactViz,
@@ -2942,11 +3046,7 @@ var withDashboardViz = (opts) => {
       onRequestParamsChange = lodash_exports.noop
     } = props;
     const localeContext = react_exports.useContext(TimezoneContext_default);
-    if (localeContext.serializedTimezone) {
-      if (!moment_default.getDefaultSplunkTimezone()) {
-        moment_default.setDefaultSplunkTimezone(localeContext.serializedTimezone);
-      }
-    }
+    applyContextTimezone(localeContext);
     const themeFunc = (themeVar) => {
       var _a2, _b;
       return (_b = (_a2 = vizConfig.themes)[themeVar]) == null ? void 0 : _b.call(_a2, props);
@@ -2974,7 +3074,12 @@ var withDashboardViz = (opts) => {
       featureFlagContext == null ? void 0 : featureFlagContext.visualizations_enableAcceleratedRender
     );
     const isAcceleratedRenderOn = isAcceleratedRenderFeatureFlagOn && isTimeSeriesCanvasRenderSupported(vizConfig.key) && (options == null ? void 0 : options.acceleratedRender) === true;
-    const isMounted = react_exports.useRef(true);
+    const bypassCloneDeepOptionScope = Boolean(
+      getFeatureFlag(featureFlagContext, "visualizations_bypassCloneDeepOptionScope")
+    );
+    const lazyLoadingDataFrame = Boolean(
+      getFeatureFlag(featureFlagContext, "visualizations_lazyLoadingDataFrame")
+    );
     const optionsToEvaluate = react_exports.useMemo(() => {
       var _a2;
       const legendDisplay = turnOffLegendDisplayWhenTrellisIsOn(isTrellisOn, options);
@@ -3013,63 +3118,74 @@ var withDashboardViz = (opts) => {
       threshold,
       isDownsamplingEnabled
     });
-    evaluatedOptions = useDeepMemo(() => {
+    const asyncOptionsEvaluationParams = useDeepMemo(
+      () => getAsyncOptionsEvaluationParams({
+        visualizationID,
+        props,
+        optionsToEvaluate,
+        downsampledDataSources,
+        vizConfig,
+        bypassCloneDeepOptionScope,
+        lazyLoadingDataFrame
+      }),
+      [
+        visualizationID,
+        optionsToEvaluate,
+        downsampledDataSources,
+        vizConfig,
+        bypassCloneDeepOptionScope,
+        lazyLoadingDataFrame,
+        currentThemeFamily,
+        currentThemeColorScheme,
+        currentThemeDensity,
+        localeContext.serializedTimezone
+      ]
+    );
+    react_exports.useEffect(() => {
+      if (!useAsyncEvaluatedOptions) {
+        return void 0;
+      }
+      let ownsEvaluation = true;
       try {
-        if (useAsyncEvaluatedOptions) {
-          const asyncDynamicOptionsEvaluatorParams = {
-            visualizationID,
-            props,
-            options: optionsToEvaluate,
-            dataSources: downsampledDataSources,
-            theme: vizConfig.themes,
-            bypassCloneDeepOptionScope: Boolean(
-              getFeatureFlag(featureFlagContext, "visualizations_bypassCloneDeepOptionScope")
-            ),
-            lazyLoadingDataFrame: Boolean(
-              getFeatureFlag(featureFlagContext, "visualizations_lazyLoadingDataFrame")
-            )
-          };
-          async_dynamic_options_evaluator_default.evaluate(asyncDynamicOptionsEvaluatorParams).then((results) => {
+        async_dynamic_options_evaluator_default.evaluate(asyncOptionsEvaluationParams).then((results) => {
+          if (ownsEvaluation) {
             setEvaluatedOptionsAsync(results.results);
-          }).catch(() => {
-            if (isMounted.current) {
-              setUseAsyncEvaluatedOptions(false);
-            }
-          });
-        } else {
-          let dataFrames = dataFramesInState;
-          if (downsampledDataSources !== dataSourcesInState) {
-            setDataSourcesInState(downsampledDataSources);
-            dataFrames = Options_exports.Options.dataFrameFromDataSource(
-              downsampledDataSources,
-              getFeatureFlag(featureFlagContext, "visualizations_lazyLoadingDataFrame")
-            );
-            setDataFramesInState(dataFrames);
           }
-          let mergedFrames = dataFrames;
-          if (computeDataFrames && dataFrames) {
-            const derivedFrames = computeDataFrames({
-              dataSources: downsampledDataSources,
-              options: optionsToEvaluate.options
-            });
-            mergedFrames = __spreadValues(__spreadValues({}, dataFrames), derivedFrames);
+        }).catch(() => {
+          if (ownsEvaluation) {
+            setUseAsyncEvaluatedOptions(false);
           }
-          const result = Options_exports.Options.evaluate(
-            optionsToEvaluate,
-            downsampledDataSources,
-            themeFunc,
-            mergedFrames,
-            getFeatureFlag(featureFlagContext, "visualizations_bypassCloneDeepOptionScope")
-          );
-          return result;
+        });
+      } catch (e) {
+        setUseAsyncEvaluatedOptions(false);
+      }
+      return () => {
+        ownsEvaluation = false;
+        async_dynamic_options_evaluator_default.reset(visualizationID);
+      };
+    }, [asyncOptionsEvaluationParams, useAsyncEvaluatedOptions, visualizationID]);
+    evaluatedOptions = useDeepMemo(() => {
+      try {
+        if (useAsyncEvaluatedOptions) {
+          return {};
         }
+        return evaluateOptionsSync({
+          optionsToEvaluate,
+          downsampledDataSources,
+          dataSourcesInState,
+          dataFramesInState,
+          setDataSourcesInState,
+          setDataFramesInState,
+          computeDataFrames,
+          featureFlagContext,
+          themeFunc
+        });
       } catch (e) {
         if (e instanceof Error) {
           console.error(`unexpected error evaluating options: ${e.message}`);
         }
         return {};
       }
-      return {};
     }, [
       currentThemeFamily,
       currentThemeColorScheme,
@@ -3079,7 +3195,7 @@ var withDashboardViz = (opts) => {
       localeContext.serializedTimezone,
       useAsyncEvaluatedOptions
     ]);
-    const evaluatedOptionsToUse = !useAsyncEvaluatedOptions ? evaluatedOptions : evaluatedOptionsAsync;
+    const evaluatedOptionsToUse = useAsyncEvaluatedOptions ? evaluatedOptionsAsync : evaluatedOptions;
     let dataSourceMetadata = {};
     const OptionKey = "paginateDataSourceKey";
     const optsKey = (0, lodash_exports.has)(evaluatedOptionsToUse, OptionKey) && evaluatedOptionsToUse[OptionKey];
@@ -3101,7 +3217,7 @@ var withDashboardViz = (opts) => {
       sortParams,
       paginatorParams
     };
-    if (vizConfig.supports.indexOf("page-and-sort" /* PAGE_AND_SORT */) === -1 && !(0, lodash_exports.has)(dataSources, paginateDataSourceKey)) {
+    if (!vizConfig.supports.includes("page-and-sort" /* PAGE_AND_SORT */) && !(0, lodash_exports.has)(dataSources, paginateDataSourceKey)) {
       dataSourceMetadata = {};
     }
     const clonedEvaluatedOptions = __spreadValues({}, evaluatedOptionsToUse);
@@ -3111,14 +3227,6 @@ var withDashboardViz = (opts) => {
     react_exports.useEffect(() => {
       onComputedProps(clonedEvaluatedOptions);
     });
-    react_exports.useEffect(() => {
-      return () => {
-        if (useAsyncEvaluatedOptions) {
-          isMounted.current = false;
-          async_dynamic_options_evaluator_default.reset(visualizationID);
-        }
-      };
-    }, []);
     const { requiredProps = [], supports } = vizConfig;
     const missing = missingKeys(requiredProps, evaluatedOptionsToUse);
     if (missing.length > 0 && supports.includes("placeholder" /* PLACEHOLDER */) && vizConfig.key !== "splunk.singlevalue") {
@@ -3133,7 +3241,16 @@ var withDashboardViz = (opts) => {
         }
       );
     }
-    const eventCallbackProps = hasEventHandlers && mode === "view" && vizConfig.supports.includes("events" /* EVENTS */) ? buildEventCallbackProps(vizConfig.events, evaluatedOptionsToUse, onEventTrigger) : {};
+    const eventCallbackProps = buildAllEventCallbackProps(
+      vizConfig.events,
+      evaluatedOptionsToUse,
+      onEventTrigger,
+      {
+        supportsEvents: vizConfig.supports.includes("events" /* EVENTS */),
+        hasEventHandlers,
+        mode
+      }
+    );
     const computedVizProps = computeVizProps2(__spreadProps(__spreadValues(__spreadProps(__spreadValues(__spreadValues({}, props), evaluatedOptionsToUse), {
       // Align option transformation with the actual renderer selected below.
       // This prevents canvas-only option preservation from leaking into Highcharts mode.
@@ -3161,8 +3278,9 @@ var withDashboardViz = (opts) => {
     onEventTrigger: SplunkVisualization_default.defaults.onEventTrigger
   });
   DashboardViz.config = vizConfig;
-  return (0, styled_components_exports.withTheme)(
-    withPlaceholder_default(withEditModeCover_default(DashboardViz, disableEditModeCover), useIconPlaceholder)
+  return Object.assign(
+    (0, styled_components_exports.withTheme)(withPlaceholder_default(withEditModeCover_default(DashboardViz, disableEditModeCover), useIconPlaceholder)),
+    { config: vizConfig }
   );
 };
 var withDashboardViz_default = withDashboardViz;
@@ -3172,45 +3290,45 @@ var debounce_exports = {};
 __export(debounce_exports, {
   default: () => debounce_default
 });
-var defaultImport38 = __toESM(require("lodash/debounce"));
+var defaultImport39 = __toESM(require("lodash/debounce"));
 __reExport(debounce_exports, require("lodash/debounce"));
-var debounce_default = "default" in defaultImport38 ? defaultImport38.default : defaultImport38;
+var debounce_default = "default" in defaultImport39 ? defaultImport39.default : defaultImport39;
 
 // esm-externals:@splunk/react-ui/Table
 var Table_exports = {};
 __export(Table_exports, {
   default: () => Table_default
 });
-var defaultImport39 = __toESM(require("@splunk/react-ui/Table"));
+var defaultImport40 = __toESM(require("@splunk/react-ui/Table"));
 __reExport(Table_exports, require("@splunk/react-ui/Table"));
-var Table_default = "default" in defaultImport39 ? defaultImport39.default : defaultImport39;
+var Table_default = "default" in defaultImport40 ? defaultImport40.default : defaultImport40;
 
 // esm-externals:@splunk/react-ui/Paginator
 var Paginator_exports = {};
 __export(Paginator_exports, {
   default: () => Paginator_default
 });
-var defaultImport40 = __toESM(require("@splunk/react-ui/Paginator"));
+var defaultImport41 = __toESM(require("@splunk/react-ui/Paginator"));
 __reExport(Paginator_exports, require("@splunk/react-ui/Paginator"));
-var Paginator_default = "default" in defaultImport40 ? defaultImport40.default : defaultImport40;
+var Paginator_default = "default" in defaultImport41 ? defaultImport41.default : defaultImport41;
 
 // esm-externals:@splunk/react-ui/Message
 var Message_exports2 = {};
 __export(Message_exports2, {
   default: () => Message_default2
 });
-var defaultImport41 = __toESM(require("@splunk/react-ui/Message"));
+var defaultImport42 = __toESM(require("@splunk/react-ui/Message"));
 __reExport(Message_exports2, require("@splunk/react-ui/Message"));
-var Message_default2 = "default" in defaultImport41 ? defaultImport41.default : defaultImport41;
+var Message_default2 = "default" in defaultImport42 ? defaultImport42.default : defaultImport42;
 
 // esm-externals:@splunk/react-ui/JSONTree
 var JSONTree_exports = {};
 __export(JSONTree_exports, {
   default: () => JSONTree_default
 });
-var defaultImport42 = __toESM(require("@splunk/react-ui/JSONTree"));
+var defaultImport43 = __toESM(require("@splunk/react-ui/JSONTree"));
 __reExport(JSONTree_exports, require("@splunk/react-ui/JSONTree"));
-var JSONTree_default = "default" in defaultImport42 ? defaultImport42.default : defaultImport42;
+var JSONTree_default = "default" in defaultImport43 ? defaultImport43.default : defaultImport43;
 
 // src/Table/hooks.tsx
 var isArray2 = (v) => Array.isArray(v);
@@ -3256,7 +3374,7 @@ var generateHeader = (value, columnId, i, columnFormat, tableFormat, showInterna
     sortKey: value,
     showCell: true
   };
-  if (!showInternalFields && value.charAt(0) === "_" && value !== "_time") {
+  if (!showInternalFields && value.startsWith("_") && value !== "_time") {
     ret.showCell = false;
   }
   const headerAlign = getColumnFormatHeaderAlign(columnFormat, columnId, value) || getTableFormatHeaderAlign(tableFormat) || "left";
@@ -3280,7 +3398,7 @@ var getColumnFormatAlign = (columnFormat, currentColumn, currentRow) => {
     align = void 0;
   } else if (typeof alignOption === "string" && (0, lodash_exports.includes)(visualization_schemas_exports.validAlignments, alignOption)) {
     align = alignOption;
-  } else if (typeof alignOption !== "undefined") {
+  } else if (alignOption !== void 0) {
     console.warn(
       `columnFormat.${currentColumn.columnId}.align should be a string or an array containing (${visualization_schemas_exports.validAlignments.join(
         " | "
@@ -3299,7 +3417,7 @@ var getColumnFormatCellType = (columnFormat, currentColumn, currentRow) => {
   );
   if (isArray2(cellTypes) && (0, lodash_exports.includes)(visualization_schemas_exports.validCellRenderers, cellTypes[currentRow])) {
     cellType = cellTypes[currentRow];
-  } else if (typeof cellTypes !== "undefined") {
+  } else if (cellTypes !== void 0) {
     console.warn(
       `columnFormat.${currentColumn.value}.cellType should be an array containing (${visualization_schemas_exports.validCellRenderers.join(" | ")}). ${JSON.stringify(
         cellTypes
@@ -3318,7 +3436,7 @@ var getColumnFormatSparklineType = (columnFormat, currentColumn, currentRow) =>
   );
   if (isArray2(types) && (0, lodash_exports.includes)(visualization_schemas_exports.validSparklineTypes, types[currentRow])) {
     sparklineType = types[currentRow];
-  } else if (typeof types !== "undefined") {
+  } else if (types !== void 0) {
     console.warn(
       `columnFormat.${currentColumn.value}.sparklineTypes should be one of (${visualization_schemas_exports.validSparklineTypes.join(
         " | "
@@ -3337,7 +3455,7 @@ var getColumnFormatData = (columnFormat, currentColumn, currentRow) => {
   );
   if (isArray2(data)) {
     datum = data[currentRow];
-  } else if (typeof data !== "undefined") {
+  } else if (data !== void 0) {
     console.warn(
       `columnFormat.${currentColumn.value}.data should be an array containing formatted data. ${typeof data} provided`
     );
@@ -3390,7 +3508,7 @@ var getColumnFormatHeaderAlign = (columnFormat, columnId, columnValue) => {
   }
   if (typeof alignOption === "string" && (0, lodash_exports.includes)(visualization_schemas_exports.validAlignments, alignOption)) {
     headerAlign = alignOption;
-  } else if (typeof alignOption !== "undefined") {
+  } else if (alignOption !== void 0) {
     console.warn(
       `columnFormat.${columnId}.headerAlign should be a string containing (${visualization_schemas_exports.validAlignments.join(
         " | "
@@ -3406,7 +3524,7 @@ var getTableFormatAlign = (tableFormat, currentColumn, currentRow) => {
     align = alignOption[currentColumn][currentRow];
   } else if (typeof alignOption === "string" && (0, lodash_exports.includes)(visualization_schemas_exports.validAlignments, alignOption)) {
     align = alignOption;
-  } else if (typeof alignOption !== "undefined") {
+  } else if (alignOption !== void 0) {
     console.warn(
       `tableFormat.align should be a string or a 2 dimensional array containing (${visualization_schemas_exports.validAlignments.join(
         " | "
@@ -3420,7 +3538,7 @@ var getTableFormatCellType = (tableFormat, currentColumn, currentRow) => {
   let cellType;
   if (isArray2(cellTypes) && isArray2(cellTypes[currentColumn]) && (0, lodash_exports.includes)(visualization_schemas_exports.validCellRenderers, cellTypes[currentColumn][currentRow])) {
     cellType = cellTypes[currentColumn][currentRow];
-  } else if (typeof cellTypes !== "undefined") {
+  } else if (cellTypes !== void 0) {
     console.warn(
       `tableFormat.cellType should be a 2 dimensional array containing (${visualization_schemas_exports.validCellRenderers.join(
         " | "
@@ -3434,7 +3552,7 @@ var getTableFormatSparklineType = (tableFormat, currentColumn, currentRow) => {
   let sparklineType;
   if (isArray2(types) && isArray2(types[currentColumn]) && (0, lodash_exports.includes)(visualization_schemas_exports.validSparklineTypes, types[currentColumn][currentRow])) {
     sparklineType = types[currentColumn][currentRow];
-  } else if (typeof types !== "undefined") {
+  } else if (types !== void 0) {
     console.warn(
       `tableFormat.sparklineTypes should be a 2 dimensional array containing one of (${visualization_schemas_exports.validSparklineTypes.join(
         " | "
@@ -3450,7 +3568,7 @@ var getTableFormatColor = (tableFormat, currentColumn, currentRow, field) => {
     color = colors[currentColumn][currentRow];
   } else if (isArray2(colors) && (0, colorUtils_exports.isColor)(colors[currentRow])) {
     color = colors[currentRow];
-  } else if (typeof colors !== "undefined" && isArray2(colors) && isArray2(colors[currentColumn]) && colors[currentColumn][currentRow] !== void 0) {
+  } else if (colors !== void 0 && isArray2(colors) && isArray2(colors[currentColumn]) && colors[currentColumn][currentRow] !== void 0) {
     console.warn(
       `tableFormat.${field} needs to be an array of colors, provided ${JSON.stringify(
         colors
@@ -3492,7 +3610,7 @@ var getTableFormatData = (tableFormat, currentCol, currentRow) => {
   let datum;
   if (isArray2(data) && isArray2(data[currentCol])) {
     datum = data[currentCol][currentRow];
-  } else if (typeof data !== "undefined") {
+  } else if (data !== void 0) {
     console.warn(
       `tableFormat.data should be a 2 dimensional array containing formatted data to be displayed. ${typeof data} provided`
     );
@@ -3504,7 +3622,7 @@ var getTableFormatHeaderAlign = (tableFormat) => {
   let headerAlign;
   if (typeof alignOption === "string" && visualization_schemas_exports.validAlignments.includes(alignOption)) {
     headerAlign = alignOption;
-  } else if (typeof alignOption !== "undefined") {
+  } else if (alignOption !== void 0) {
     console.warn(
       `tableFormat.headerAlign should be a string containing (${visualization_schemas_exports.validAlignments.join(
         " | "
@@ -3515,14 +3633,14 @@ var getTableFormatHeaderAlign = (tableFormat) => {
 };
 var getAttributeFromColumnFormat = (attribute, columnFormat, columnId, columnValue) => (0, lodash_exports.get)(columnFormat, [columnId, attribute]) || (0, lodash_exports.get)(columnFormat, [columnValue, attribute]);
 var validValueSelector = (v1, v2, v3, defaultValue) => {
-  const validTypes = ["string", "number"];
-  if (validTypes.includes(typeof v1) || isArray2(v1)) {
+  const validTypes = /* @__PURE__ */ new Set(["string", "number"]);
+  if (validTypes.has(typeof v1) || isArray2(v1)) {
     return v1;
   }
-  if (validTypes.includes(typeof v2) || isArray2(v2)) {
+  if (validTypes.has(typeof v2) || isArray2(v2)) {
     return v2;
   }
-  if (validTypes.includes(typeof v3) || isArray2(v3)) {
+  if (validTypes.has(typeof v3) || isArray2(v3)) {
     return v3;
   }
   return defaultValue;
@@ -3676,7 +3794,7 @@ var useTable = (tableArgs = {}) => {
     ));
   }
   const tableHeader = {
-    visibility: visualization_schemas_exports.validHeaderVisibilities.indexOf(headerVisibility) >= 0 ? headerVisibility : "inline",
+    visibility: visualization_schemas_exports.validHeaderVisibilities.includes(headerVisibility) ? headerVisibility : "inline",
     cells: table.map((f, i) => {
       if (i < headers.length) {
         return generateHeader(
@@ -3732,12 +3850,10 @@ var useTable = (tableArgs = {}) => {
       let displayValue = "";
       if (Array.isArray(columnFooterRaw)) {
         displayValue = key === "footer-percentages" ? (_d = columnFooterRaw[1]) != null ? _d : "" : (_e = columnFooterRaw[0]) != null ? _e : "";
-      } else if (typeof columnFooterRaw !== "undefined") {
+      } else if (columnFooterRaw !== void 0) {
         displayValue = key === "footer-percentages" ? "" : columnFooterRaw;
-      } else {
-        displayValue = "";
       }
-      const derivedAlign = computeDerivedAlign(colMeta, colIdx, void 0);
+      const derivedAlign = computeDerivedAlign(colMeta, colIdx);
       row.cells.push({
         key: `${key}-${colIdx}`,
         value: displayValue,
@@ -3771,18 +3887,9 @@ var Link_exports = {};
 __export(Link_exports, {
   default: () => Link_default
 });
-var defaultImport43 = __toESM(require("@splunk/react-ui/Link"));
+var defaultImport44 = __toESM(require("@splunk/react-ui/Link"));
 __reExport(Link_exports, require("@splunk/react-ui/Link"));
-var Link_default = "default" in defaultImport43 ? defaultImport43.default : defaultImport43;
-
-// esm-externals:@splunk/themes
-var themes_exports = {};
-__export(themes_exports, {
-  default: () => themes_default
-});
-var defaultImport44 = __toESM(require("@splunk/themes"));
-__reExport(themes_exports, require("@splunk/themes"));
-var themes_default = "default" in defaultImport44 ? defaultImport44.default : defaultImport44;
+var Link_default = "default" in defaultImport44 ? defaultImport44.default : defaultImport44;
 
 // src/common/StyledSkipLink.tsx
 var StyledSkipLink = styled_components_default(Link_default)`
@@ -4470,6 +4577,72 @@ var SparklineCell = ({
 };
 SparklineCell.displayName = "SparklineCell";
 
+// src/common/hooks/useDynamicHeight.ts
+var PAGINATOR_CONTAINER_HEIGHT = 38;
+var PAGINATOR_SPACING = 5;
+var useDynamicHeight = ({
+  dynamicHeight,
+  onRequestHeight,
+  isPaging,
+  rows,
+  expandedRowJson
+}) => {
+  const containerRef = (0, react_exports.useRef)(null);
+  const containerRefInner = (0, react_exports.useRef)(null);
+  const suiTableRef = (0, react_exports.useRef)(null);
+  const lastReportedHeight = (0, react_exports.useRef)(null);
+  const lastContentHeightRef = (0, react_exports.useRef)(void 0);
+  const prevRowsRef = (0, react_exports.useRef)(rows);
+  const prevExpandedRef = (0, react_exports.useRef)(expandedRowJson);
+  (0, react_exports.useEffect)(() => {
+    var _a, _b;
+    if (!dynamicHeight || !onRequestHeight) {
+      return void 0;
+    }
+    const contentChanged = prevRowsRef.current !== rows || prevExpandedRef.current !== expandedRowJson;
+    prevRowsRef.current = rows;
+    prevExpandedRef.current = expandedRowJson;
+    if (contentChanged) {
+      lastReportedHeight.current = null;
+    }
+    const containerEl = containerRef.current;
+    const viewport = containerRefInner.current;
+    const contentNode = (_b = (_a = suiTableRef.current) == null ? void 0 : _a.querySelector("table")) != null ? _b : null;
+    const reportNaturalHeight = () => {
+      var _a2, _b2;
+      const rawPadding = containerEl ? Number.parseInt(getComputedStyle(containerEl).paddingTop, 10) : 0;
+      const paddingOffset = (Number.isNaN(rawPadding) ? 0 : rawPadding) * 2;
+      const paginatorChrome = isPaging ? PAGINATOR_CONTAINER_HEIGHT + PAGINATOR_SPACING : 0;
+      const measuredHeight = (_b2 = (_a2 = contentNode == null ? void 0 : contentNode.scrollHeight) != null ? _a2 : viewport == null ? void 0 : viewport.scrollHeight) != null ? _b2 : 0;
+      const naturalHeight = Math.ceil(measuredHeight + paddingOffset + paginatorChrome);
+      lastContentHeightRef.current = naturalHeight;
+      if (naturalHeight !== lastReportedHeight.current) {
+        lastReportedHeight.current = naturalHeight;
+        onRequestHeight(naturalHeight);
+      }
+    };
+    if (!contentNode) {
+      reportNaturalHeight();
+      return void 0;
+    }
+    reportNaturalHeight();
+    const observer = new ResizeObserver(reportNaturalHeight);
+    observer.observe(contentNode);
+    return () => observer.disconnect();
+  }, [dynamicHeight, isPaging, rows, expandedRowJson, onRequestHeight]);
+  (0, react_exports.useEffect)(() => {
+    if (lastContentHeightRef.current === void 0) {
+      return;
+    }
+    if (dynamicHeight) {
+      onRequestHeight == null ? void 0 : onRequestHeight(lastContentHeightRef.current);
+    } else {
+      onRequestHeight == null ? void 0 : onRequestHeight(void 0);
+    }
+  }, [dynamicHeight, onRequestHeight]);
+  return { containerRef, containerRefInner, suiTableRef };
+};
+
 // src/common/utils/textUtils.ts
 var VIZ_FONT_FAMILY = "'Splunk Platform Sans', 'Splunk Data Sans', Roboto, Droid, 'Helvetica Neue', Helvetica, Arial, sans-serif";
 
@@ -4494,7 +4667,7 @@ var getFocusableElements = () => {
   return Array.from(document.querySelectorAll(DEFAULT_FOCUSABLE_SELECTORS));
 };
 var isElementHidden = (element) => {
-  const computedStyle = window.getComputedStyle(element);
+  const computedStyle = globalThis.getComputedStyle(element);
   return element.hasAttribute("hidden") || element.getAttribute("aria-hidden") === "true" || computedStyle.display === "none" || computedStyle.visibility === "hidden";
 };
 var isVisibleFocusableElement = (element) => {
@@ -4673,8 +4846,6 @@ var VizTableContainer = styled_components_default.div`
     }
 `;
 VizTableContainer.displayName = "VizTableContainer";
-var PAGINATOR_CONTAINER_HEIGHT = 38;
-var PAGINATOR_SPACING = 5;
 var SUITableContainer = styled_components_default.div`
     & * {
         font-family: ${(props) => props.font};
@@ -4687,7 +4858,7 @@ var SUITableContainer = styled_components_default.div`
 
     ${({ width, height, isPaging, theme }) => {
   const padding = variables_default.spacingSmall({ theme });
-  const paddingOffset = parseInt(padding, 10) * 2;
+  const paddingOffset = Number.parseInt(padding, 10) * 2;
   const calculatedHeight = isPaging ? height - PAGINATOR_CONTAINER_HEIGHT - PAGINATOR_SPACING - paddingOffset : height - paddingOffset;
   const finalHeight = Math.max(calculatedHeight, 1);
   return (0, style_exports.toDimension)({
@@ -4864,33 +5035,38 @@ var getUseMouseOverEffect = (props, header) => {
     return handlerFields.includes(header);
   });
 };
-var PureTable = (props) => {
-  const _a = props, {
+var PureTable = (_a) => {
+  var _b = _a, {
     count,
-    width,
-    height,
+    width = 300,
+    height = 300,
     backgroundColor,
     tableHeader,
     tableBody,
     tableFooter,
-    showRowNumbers,
-    showFooterTotals,
-    showFooterPercentages,
-    sortParams: { currentSortKey, currentSortDir, onSort },
-    paginatorParams: _b
-  } = _a, _c = _b, { isPaging, onChange: paginatorOnChange } = _c, paginatorProps = __objRest(_c, ["isPaging", "onChange"]), {
-    onCellClick,
-    onColumnFormatChange,
-    columnFormat,
-    mode,
-    headerVisibility,
+    showRowNumbers = false,
+    showFooterTotals = false,
+    showFooterPercentages = false,
+    sortParams: { currentSortKey, currentSortDir, onSort } = { onSort: lodash_exports.noop },
+    paginatorParams: _c = {
+      isPaging: false,
+      onChange: lodash_exports.noop
+    }
+  } = _b, _d = _c, { isPaging, onChange: paginatorOnChange } = _d, paginatorProps = __objRest(_d, ["isPaging", "onChange"]), {
+    onCellClick = null,
+    onColumnFormatChange = lodash_exports.noop,
+    columnFormat = {},
+    mode = "view",
+    headerVisibility = "inline",
     font,
     fontSize,
-    showColumnAsExpandedJson
-  } = _a;
+    showColumnAsExpandedJson = [],
+    dynamicHeight = false,
+    onRequestHeight,
+    hasEventHandlers,
+    eventHandlers
+  } = _b;
   const [columns, setColumns] = react_exports.useState(columnFormat);
-  const containerRef = react_exports.useRef(null);
-  const containerRefInner = react_exports.useRef(null);
   const [isResizing, setResizing] = react_exports.useState(false);
   const firstRenderCount = react_exports.useRef(count);
   react_exports.useEffect(() => {
@@ -4917,10 +5093,17 @@ var PureTable = (props) => {
     () => expandedRowJson.some((rowJson) => rowJson.isExpandable),
     [expandedRowJson]
   );
+  const { containerRef, containerRefInner, suiTableRef } = useDynamicHeight({
+    dynamicHeight,
+    onRequestHeight,
+    isPaging,
+    rows: tableBody.rows,
+    expandedRowJson
+  });
   const TableHead = useTableHead(headerVisibility);
   const debouncedDrilldown = react_exports.useMemo(
     () => debounce_default((e, payload) => {
-      if (window.getSelection().toString() === "" || (e == null ? void 0 : e.ctrlKey) || (e == null ? void 0 : e.metaKey)) {
+      if (globalThis.getSelection().toString() === "" || (e == null ? void 0 : e.ctrlKey) || (e == null ? void 0 : e.metaKey)) {
         if (typeof onCellClick === "function") {
           onCellClick({ e, payload });
         }
@@ -4935,9 +5118,9 @@ var PureTable = (props) => {
       if (!element) {
         return;
       }
-      const row = element.getAttribute("data-row-index");
-      const col = element.getAttribute("data-col-index");
-      const arrayIndex = element.getAttribute("data-array-index") || -1;
+      const row = element.dataset.rowIndex;
+      const col = element.dataset.colIndex;
+      const arrayIndex = element.dataset.arrayIndex || -1;
       if (row && col) {
         const cellRefIndex = +col;
         let cellIndex = cellRefIndex;
@@ -5037,7 +5220,7 @@ var PureTable = (props) => {
   };
   const footerVisibleHeaderCells = tableHeader.cells.filter((c) => c.showCell !== false);
   const renderFooterRow = (key, dataAttr) => {
-    const rows = ((tableFooter == null ? void 0 : tableFooter.rows) || []).filter((r) => r && r.key === key);
+    const rows = ((tableFooter == null ? void 0 : tableFooter.rows) || []).filter((r) => (r == null ? void 0 : r.key) === key);
     if (rows.length === 0) return null;
     return rows.map((row) => /* @__PURE__ */ react_exports.createElement(
       Table_default.Row,
@@ -5047,7 +5230,7 @@ var PureTable = (props) => {
         "data-row-index": key === "footer-totals" ? "0" : "1"
       },
       (row.cells || []).filter((c) => c.showCell !== false).map((c, idx) => {
-        var _a2, _b2, _c2, _d;
+        var _a2, _b2, _c2, _d2;
         const headerCell = footerVisibleHeaderCells[idx];
         const explicitWidth = headerCell && ((_a2 = columns[headerCell.value]) == null ? void 0 : _a2.width);
         const colWidth = explicitWidth && explicitWidth !== "auto" ? explicitWidth : void 0;
@@ -5061,7 +5244,7 @@ var PureTable = (props) => {
             }), colWidth !== void 0 && { width: colWidth }),
             align: c.align || "right"
           },
-          (_d = c.value) != null ? _d : ""
+          (_d2 = c.value) != null ? _d2 : ""
         );
       })
     ));
@@ -5090,6 +5273,7 @@ var PureTable = (props) => {
     /* @__PURE__ */ react_exports.createElement(
       Table_default,
       {
+        elementRef: suiTableRef,
         resizableFillLayout: true,
         headType: isHeaderHidden ? void 0 : "inline",
         rowExpansion: hasExpandableRows ? "multi" : "none",
@@ -5101,15 +5285,15 @@ var PureTable = (props) => {
         onRequestResizeColumn: handleResizeColumn
       },
       /* @__PURE__ */ react_exports.createElement(TableHead, null, visibleHeaderCells.map(
-        (_d) => {
-          var _e = _d, {
+        (_a2) => {
+          var _b2 = _a2, {
             key,
             value,
             sortKey,
             style,
             align,
             textOverflowType
-          } = _e, rest = __objRest(_e, [
+          } = _b2, rest = __objRest(_b2, [
             "key",
             "value",
             "sortKey",
@@ -5117,7 +5301,7 @@ var PureTable = (props) => {
             "align",
             "textOverflowType"
           ]);
-          var _a2, _b2;
+          var _a3, _b3;
           return /* @__PURE__ */ react_exports.createElement(
             HeadCell,
             __spreadProps(__spreadValues({}, __spreadValues({ sortKey }, rest)), {
@@ -5127,7 +5311,7 @@ var PureTable = (props) => {
               key,
               columnId: value,
               sortDir: sortKey === currentSortKey ? currentSortDir : "none",
-              width: (_b2 = (_a2 = columns[value]) == null ? void 0 : _a2.width) != null ? _b2 : INITIAL_UNSET_COLUMN_WIDTH,
+              width: (_b3 = (_a3 = columns[value]) == null ? void 0 : _a3.width) != null ? _b3 : INITIAL_UNSET_COLUMN_WIDTH,
               onMouseDown: handleEventHeadCellMouseDown,
               value,
               onSort: showRowNumbers && value === "#" || isHeaderHidden ? null : onSortToUse,
@@ -5172,7 +5356,7 @@ var PureTable = (props) => {
               {
                 cell,
                 useMouseOverEffect: getUseMouseOverEffect(
-                  props,
+                  { hasEventHandlers, mode, eventHandlers },
                   cell.header
                 )
               }
@@ -5181,7 +5365,7 @@ var PureTable = (props) => {
               {
                 cell,
                 useMouseOverEffect: getUseMouseOverEffect(
-                  props,
+                  { hasEventHandlers, mode, eventHandlers },
                   cell.header
                 ),
                 width: (_b2 = (_a3 = columns[cell.header]) == null ? void 0 : _a3.width) != null ? _b2 : "auto"
@@ -5191,7 +5375,7 @@ var PureTable = (props) => {
               {
                 cell,
                 useMouseOverEffect: getUseMouseOverEffect(
-                  props,
+                  { hasEventHandlers, mode, eventHandlers },
                   cell.header
                 )
               }
@@ -5221,79 +5405,6 @@ var PureTable = (props) => {
     }, paginatorProps)
   )) : null);
 };
-var cellDataType = prop_types_exports.oneOfType([prop_types_exports.string, prop_types_exports.number, prop_types_exports.arrayOf(prop_types_exports.oneOfType([prop_types_exports.string, prop_types_exports.number]))]);
-PureTable.propTypes = {
-  backgroundColor: prop_types_exports.string,
-  count: prop_types_exports.number,
-  columnFormat: prop_types_exports.objectOf(
-    prop_types_exports.shape({
-      align: prop_types_exports.oneOfType([prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validColumnAlignments)), prop_types_exports.oneOf(visualization_schemas_exports.validColumnAlignments)]),
-      cellTypes: prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validCellRenderers)),
-      data: prop_types_exports.arrayOf(cellDataType),
-      headerAlign: prop_types_exports.oneOf(visualization_schemas_exports.validColumnAlignments),
-      rowBackgroundColors: prop_types_exports.arrayOf(prop_types_exports.string),
-      rowColors: prop_types_exports.arrayOf(prop_types_exports.string),
-      sparklineAreaColors: prop_types_exports.arrayOf(prop_types_exports.string),
-      sparklineColors: prop_types_exports.arrayOf(prop_types_exports.string),
-      sparklineTypes: prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validSparklineTypes))
-    })
-  ),
-  headers: prop_types_exports.arrayOf(prop_types_exports.string),
-  headerVisibility: prop_types_exports.oneOf(visualization_schemas_exports.validHeaderVisibilities),
-  height: prop_types_exports.oneOfType([prop_types_exports.number]),
-  mode: prop_types_exports.string,
-  onCellClick: prop_types_exports.func,
-  paginatorParams: PaginatorParamsPropTypes,
-  showColumnAsExpandedJson: prop_types_exports.arrayOf(prop_types_exports.string),
-  showRowNumbers: prop_types_exports.bool,
-  showFooterTotals: prop_types_exports.bool,
-  sortParams: SortParamsPropTypes,
-  table: prop_types_exports.arrayOf(prop_types_exports.arrayOf(cellDataType)),
-  tableFormat: prop_types_exports.shape({
-    align: prop_types_exports.oneOfType([prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validAlignments))), prop_types_exports.oneOf(visualization_schemas_exports.validAlignments)]),
-    cellTypes: prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validCellRenderers))),
-    data: prop_types_exports.arrayOf(prop_types_exports.arrayOf(cellDataType)),
-    headerAlign: prop_types_exports.oneOf(visualization_schemas_exports.validAlignments),
-    headerBackgroundColor: prop_types_exports.string,
-    headerColor: prop_types_exports.string,
-    rowBackgroundColors: prop_types_exports.oneOfType([prop_types_exports.arrayOf(prop_types_exports.string), prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.string))]),
-    rowColors: prop_types_exports.oneOfType([prop_types_exports.arrayOf(prop_types_exports.string), prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.string))]),
-    sparklineAreaColors: prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.string)),
-    sparklineColors: prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.string)),
-    sparklineTypes: prop_types_exports.arrayOf(prop_types_exports.arrayOf(prop_types_exports.oneOf(visualization_schemas_exports.validSparklineTypes)))
-  }),
-  theme: prop_types_exports.any,
-  width: prop_types_exports.oneOfType([prop_types_exports.number]),
-  onColumnFormatChange: prop_types_exports.func,
-  font: prop_types_exports.string,
-  fontSize: prop_types_exports.string
-};
-PureTable.defaultProps = {
-  columnFormat: {},
-  headers: [],
-  headerVisibility: "inline",
-  height: 300,
-  mode: "view",
-  onCellClick: null,
-  paginatorParams: {
-    isPaging: false,
-    onChange: lodash_exports.noop
-  },
-  showColumnAsExpandedJson: [],
-  showRowNumbers: false,
-  showFooterTotals: false,
-  showFooterPercentages: false,
-  sortParams: {
-    onSort: lodash_exports.noop
-  },
-  table: [],
-  tableFormat: {},
-  theme: {},
-  width: 300,
-  onColumnFormatChange: lodash_exports.noop,
-  font: fontMap.proportional,
-  fontSize: fontSizeMap.default
-};
 PureTable.displayName = "VizTable";
 var PureTable_default = withEmptyTableMessage(FixedSizeContainer_default(PureTable));
 
@@ -5329,7 +5440,7 @@ var computeVizProps = (_a) => {
   if (vizProps.onOptionsChange) {
     const handleColumnFormatChange = (updatedColumnFormat) => {
       var _a3;
-      const cloneOfExistingColumnFormat = __spreadValues({}, ((_a3 = vizProps == null ? void 0 : vizProps.options) == null ? void 0 : _a3.columnFormat) || {});
+      const cloneOfExistingColumnFormat = __spreadValues({}, (_a3 = vizProps == null ? void 0 : vizProps.options) == null ? void 0 : _a3.columnFormat);
       const keys = Object.keys(updatedColumnFormat);
       const values = Object.values(updatedColumnFormat);
       keys.forEach((key, index) => {
@@ -5351,13 +5462,7 @@ var computeVizProps = (_a) => {
 };
 var withTableFooter = (Viz) => {
   const VizWithTableFooter = (_a) => {
-    var _b = _a, {
-      dataSources,
-      options = {}
-    } = _b, otherProps = __objRest(_b, [
-      "dataSources",
-      "options"
-    ]);
+    var _b = _a, { dataSources, options = {} } = _b, otherProps = __objRest(_b, ["dataSources", "options"]);
     var _a2, _b2, _c;
     const footerKeyRef = react_exports.useRef(null);
     if (footerKeyRef.current === null) {
@@ -5390,13 +5495,13 @@ var withTableFooter = (Viz) => {
       if (!showFooterTotals && !showFooterPercentages) {
         return options;
       }
-      const columnFormat = __spreadValues({}, (options == null ? void 0 : options.columnFormat) || {});
+      const columnFormat = __spreadValues({}, options == null ? void 0 : options.columnFormat);
       const fieldNames = (fieldsMeta || []).map((f) => f && (f.name || f)).filter(Boolean);
       fieldNames.forEach((fieldName) => {
         var _a3, _b3;
         if (!fieldName || fieldName === "#") return;
         const existingFooter = (_a3 = columnFormat == null ? void 0 : columnFormat[fieldName]) == null ? void 0 : _a3.footer;
-        if (typeof existingFooter === "undefined") {
+        if (existingFooter === void 0) {
           const dataDsl = (_b3 = columnFormat == null ? void 0 : columnFormat[fieldName]) == null ? void 0 : _b3.data;
           let configToken = null;
           if (typeof dataDsl === "string") {
@@ -5405,13 +5510,13 @@ var withTableFooter = (Viz) => {
           }
           let footerDsl = `> ${footerKey} | seriesByName("${fieldName}")`;
           if (configToken) footerDsl += ` | formatByType(${configToken})`;
-          columnFormat[fieldName] = __spreadProps(__spreadValues({}, columnFormat[fieldName] || {}), {
+          columnFormat[fieldName] = __spreadProps(__spreadValues({}, columnFormat[fieldName]), {
             footer: footerDsl
           });
         } else if (typeof existingFooter === "string") {
           const updatedFooterDsl = existingFooter.replaceAll(/>\s*footer\w*/g, `> ${footerKey}`);
           if (updatedFooterDsl !== existingFooter) {
-            columnFormat[fieldName] = __spreadProps(__spreadValues({}, columnFormat[fieldName] || {}), {
+            columnFormat[fieldName] = __spreadProps(__spreadValues({}, columnFormat[fieldName]), {
               footer: updatedFooterDsl
             });
           }
@@ -5424,7 +5529,6 @@ var withTableFooter = (Viz) => {
     }
     return /* @__PURE__ */ react_exports.createElement(Viz, __spreadValues({ dataSources: newDataSources, options: newOptions }, otherProps));
   };
-  VizWithTableFooter.defaultProps = Viz.defaultProps;
   VizWithTableFooter.config = Viz.config;
   return VizWithTableFooter;
 };