@sproutsocial/seeds-react-data-viz 0.7.31 → 0.14.0

package/dist/index.js

@@ -1,481 +1,85 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  AreaChart: () => AreaChart,
-  ChartLegend: () => ChartLegend,
-  ChartLegendLabel: () => ChartLegendLabel,
-  ChartTable: () => ChartTable,
-  ChartTooltip: () => ChartTooltip,
-  ChartTooltipFooter: () => ChartTooltipFooter,
-  ChartTooltipHeader: () => ChartTooltipHeader,
-  ChartTooltipPortal: () => ChartTooltipPortal,
-  ChartTooltipTable: () => ChartTooltipTable,
-  ChartTooltipTitle: () => ChartTooltipTitle,
-  ChartXAnnotationDetails: () => ChartXAnnotationDetails,
-  ChartXAnnotationMarker: () => ChartXAnnotationMarker,
-  ColorBox: () => ColorBox,
-  DONUT_CHART_HALO_SIZE: () => DONUT_CHART_HALO_SIZE,
-  DONUT_CHART_HEIGHT: () => DONUT_CHART_HEIGHT,
-  DONUT_CHART_WIDTH: () => DONUT_CHART_WIDTH,
-  DatavizColorBox: () => DatavizColorBox,
-  DonutChart: () => DonutChart,
-  DonutChartLegendTable: () => DonutChartLegendTable,
-  GlobalChartStyleOverrides: () => GlobalChartStyleOverrides,
-  LineChart: () => LineChart,
-  NetworkColorBox: () => NetworkColorBox,
-  TIME_SERIES_CHART_HEIGHT: () => TIME_SERIES_CHART_HEIGHT,
-  VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT: () => VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT,
-  VerticalBarChart: () => VerticalBarChart,
-  areaChartOptions: () => areaChartOptions,
-  areaChartStyles: () => areaChartStyles,
-  baseChartOptions: () => baseChartOptions,
-  baseChartStyles: () => baseChartStyles,
-  columnChartOptions: () => columnChartOptions,
-  donutChartOptions: () => donutChartOptions,
-  donutChartStyles: () => donutChartStyles,
-  generateChartTooltipPortalId: () => generateChartTooltipPortalId,
-  getDatavizColor: () => getDatavizColor,
-  getDatavizColorWithAlpha: () => getDatavizColorWithAlpha,
-  getDatavizOpacity: () => getDatavizOpacity,
-  getStorybookCategoricalData: () => getStorybookCategoricalData,
-  getStorybookSparseTimelineData: () => getStorybookSparseTimelineData,
-  isCategoricalHourData: () => isCategoricalHourData,
-  isHourlyTimeData: () => isHourlyTimeData,
-  lineChartOptions: () => lineChartOptions,
-  lineChartStyles: () => lineChartStyles,
-  timeSeriesChartOptions: () => timeSeriesChartOptions,
-  timeSeriesChartStyles: () => timeSeriesChartStyles,
-  transformDataToSeries: () => transformDataToSeries,
-  transformTimeSeriesTooltipData: () => transformTimeSeriesTooltipData,
-  xAxisLabelFormatter: () => xAxisLabelFormatter,
-  yAxisLabelFormatter: () => yAxisLabelFormatter
-});
-module.exports = __toCommonJS(index_exports);
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
-// src/components/AreaChart/AreaChart.tsx
-var import_react16 = require("react");
-var import_highcharts3 = __toESM(require("highcharts"));
-var import_highcharts_react_official = require("highcharts-react-official");
-var import_accessibility = __toESM(require("highcharts/modules/accessibility"));
-var import_annotations = __toESM(require("highcharts/modules/annotations"));
-var import_styled_components8 = __toESM(require("styled-components"));
-var import_seeds_react_box9 = require("@sproutsocial/seeds-react-box");
 
-// src/components/AreaChart/components/AreaChartLegend.tsx
-var import_react5 = require("react");
-var import_seeds_react_theme5 = require("@sproutsocial/seeds-react-theme");
-
-// src/components/ChartLegend/ChartLegend.tsx
-var import_react3 = require("react");
-var import_seeds_react_box3 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_theme4 = require("@sproutsocial/seeds-react-theme");
-
-// src/components/ChartLegend/components/ChartLegendLabel.tsx
-var import_styled_components4 = __toESM(require("styled-components"));
-var import_react2 = require("react");
-var import_seeds_react_box2 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_text = require("@sproutsocial/seeds-react-text");
-
-// src/components/ColorBox/ColorBox.tsx
-var import_styled_components2 = require("styled-components");
-var import_seeds_react_box = require("@sproutsocial/seeds-react-box");
-
-// ../seeds-react-theme-provider/dist/index.mjs
-var import_react = require("react");
-var import_styled_components = require("styled-components");
-var import_seeds_react_theme = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime = require("react/jsx-runtime");
-
-// src/components/ColorBox/ColorBox.tsx
-var import_seeds_react_theme2 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var ColorBox = ({
-  display = "inline-block",
-  height = "16px",
-  width = "16px",
-  minWidth = width,
-  borderRadius = "400",
-  ...props
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_seeds_react_box.Box,
-    {
-      ...props,
-      display,
-      height,
-      width,
-      minWidth,
-      borderRadius,
-      css: import_styled_components2.css`
-          cursor: ${(props2) => props2?.onClick ? "pointer" : "default"};
-        `
-    }
-  );
-};
 
-// src/components/ColorBox/DatavizColorBox.tsx
-var import_styled_components3 = __toESM(require("styled-components"));
-var import_seeds_react_theme3 = require("@sproutsocial/seeds-react-theme");
-var DatavizColorBox = (0, import_styled_components3.default)(ColorBox).attrs(
-  ({ colorIndex }) => ({
-    style: {
-      background: getDatavizColor(colorIndex),
-      opacity: getDatavizOpacity(colorIndex)
-    }
-  })
-)``;
-var getDatavizColor = (colorIndex) => import_seeds_react_theme3.theme.colors.DATAVIZ_COLORS_LIST[colorIndex % import_seeds_react_theme3.theme.colors.DATAVIZ_COLORS_LIST.length] || "";
-var getDatavizOpacity = (colorIndex) => {
-  const opacitySteps = [1, 0.6, 0.4, 0.2];
-  const opacityStep = Math.floor(colorIndex / import_seeds_react_theme3.theme.colors.DATAVIZ_COLORS_LIST.length) % opacitySteps.length;
-  return opacitySteps[opacityStep];
-};
-var getDatavizColorWithAlpha = (colorIndex) => {
-  const color = getDatavizColor(colorIndex);
-  const opacity = getDatavizOpacity(colorIndex);
-  if (opacity < 0 || opacity > 1) {
-    return color;
-  }
-  return `${color}${Math.floor(opacity * 255).toString(16).padStart(2, "0")}`;
-};
 
-// src/components/ColorBox/NetworkColorBox.tsx
-var import_seeds_networkcolor = __toESM(require("@sproutsocial/seeds-networkcolor"));
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var NetworkColorBox = ({
-  networkColor,
-  ...props
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ColorBox, { ...props, bg: import_seeds_networkcolor.default[networkColor] });
-};
 
-// src/components/ChartLegend/components/ChartLegendLabel.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var StyledBox = (0, import_styled_components4.default)(import_seeds_react_box2.Box)`
-  list-style: none;
-  display: flex;
-  align-items: center;
-  gap: ${({ theme: theme16 }) => theme16.space[300]};
-`;
-var ChartLegendLabel = (0, import_react2.memo)(
-  function ChartLegendLabel2({
-    children,
-    color = "#CCC",
-    containerBoxProps = {}
-  }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(StyledBox, { ...containerBoxProps, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ColorBox, { bg: color }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_text.Text, { as: "div", fontSize: 200, color: "text.subtext", children })
-    ] });
-  }
-);
 
-// src/components/ChartLegend/ChartLegend.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var ChartLegend = (0, import_react3.memo)(function ChartLegend2({
-  legendLabels,
-  containerBoxProps = {},
-  stacked = false
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    import_seeds_react_box3.Box,
-    {
-      as: "ul",
-      "aria-hidden": "true",
-      display: "flex",
-      justifyContent: "center",
-      flexDirection: stacked ? "column" : "row",
-      flexWrap: "wrap",
-      columnGap: 450,
-      rowGap: 200,
-      m: 0,
-      p: 0,
-      ...containerBoxProps,
-      children: legendLabels.map(({ color, content }, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-        ChartLegendLabel,
-        {
-          color: color || import_seeds_react_theme4.theme.colors.DATAVIZ_COLORS_LIST[index],
-          containerBoxProps: { as: "li" },
-          children: content
-        },
-        `chart-legend-label-${index}`
-      ))
-    }
-  );
-});
 
-// src/components/ChartLegend/components/ChartLegendLabelContentWithIcon.tsx
-var import_react4 = require("react");
-var import_seeds_react_box4 = require("@sproutsocial/seeds-react-box");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var ChartLegendLabelContentWithIcon = (0, import_react4.memo)(
-  function ChartLegendLabelContentWithIcon2({
-    children,
-    icon
-  }) {
-    return icon ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_seeds_react_box4.Box, { display: "flex", alignItems: "center", gap: 200, children: [
-      icon,
-      children
-    ] }) : children;
-  }
-);
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _chunkVFBZ7FNKjs = require('./chunk-VFBZ7FNK.js');
+
+// src/components/AreaChart/AreaChart.tsx
+var _react = require('react');
+var _highcharts = require('highcharts'); var _highcharts2 = _interopRequireDefault(_highcharts);
+var _highchartsreactofficial = require('highcharts-react-official');
+var _accessibility = require('highcharts/modules/accessibility'); var _accessibility2 = _interopRequireDefault(_accessibility);
+var _annotations = require('highcharts/modules/annotations'); var _annotations2 = _interopRequireDefault(_annotations);
+var _styledcomponents = require('styled-components'); var _styledcomponents2 = _interopRequireDefault(_styledcomponents);
+var _seedsreactbox = require('@sproutsocial/seeds-react-box');
 
 // src/components/AreaChart/components/AreaChartLegend.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+
+var _seedsreacttheme = require('@sproutsocial/seeds-react-theme');
+var _jsxruntime = require('react/jsx-runtime');
 var getAreaChartLegendLabels = ({
   data
 }) => {
   return data.map((series, index) => ({
-    content: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
-    color: series.styles?.color || import_seeds_react_theme5.theme.colors.DATAVIZ_COLORS_LIST[index]
+    content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
+    color: _optionalChain([series, 'access', _ => _.styles, 'optionalAccess', _2 => _2.color]) || _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index]
   }));
 };
-var AreaChartLegend = (0, import_react5.memo)(
+var AreaChartLegend = _react.memo.call(void 0, 
   function AreaChartLegend2({ data }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ChartLegend, { legendLabels: getAreaChartLegendLabels({ data }) });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegend, { legendLabels: getAreaChartLegendLabels({ data }) });
   }
 );
 
 // src/components/AreaChart/components/AreaChartTooltip.tsx
-var import_react13 = require("react");
-var import_seeds_react_box8 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_duration = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_icon = require("@sproutsocial/seeds-react-icon");
-var import_seeds_react_numeral = require("@sproutsocial/seeds-react-numeral");
-var import_seeds_react_text4 = require("@sproutsocial/seeds-react-text");
-
-// src/components/ChartTooltip/ChartTooltip.tsx
-var import_react6 = require("react");
-var import_styled_components5 = __toESM(require("styled-components"));
-var import_seeds_react_box5 = require("@sproutsocial/seeds-react-box");
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var StyledBox2 = (0, import_styled_components5.default)(import_seeds_react_box5.Box)`
-  .Icon,
-  .logo {
-    stroke: none;
-  }
-`;
-var ChartTooltip = (0, import_react6.memo)(function ChartTooltip2({
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    StyledBox2,
-    {
-      bg: "container.background.base",
-      boxShadow: "medium",
-      border: 500,
-      borderColor: "container.border.base",
-      borderRadius: 500,
-      p: 400,
-      minWidth: 285,
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_seeds_react_box5.Box, { display: "flex", flexDirection: "column", gap: 350, children })
-    }
-  );
-});
 
-// src/components/ChartTooltip/components/ChartTooltipFooter.tsx
-var import_react7 = require("react");
-var import_seeds_react_box6 = require("@sproutsocial/seeds-react-box");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var ChartTooltipFooter = (0, import_react7.memo)(
-  function ChartTooltipFooter2({ children }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      import_seeds_react_box6.Box,
-      {
-        borderTop: 500,
-        borderColor: "container.border.base",
-        mx: -400,
-        mb: -200,
-        px: 400,
-        pt: 350,
-        children
-      }
-    );
-  }
-);
 
-// src/components/ChartTooltip/components/ChartTooltipHeader.tsx
-var import_react8 = require("react");
-var import_seeds_react_box7 = require("@sproutsocial/seeds-react-box");
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var ChartTooltipHeader = (0, import_react8.memo)(
-  function ChartTooltipHeader2({ children }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-      import_seeds_react_box7.Box,
-      {
-        borderBottom: 500,
-        borderColor: "container.border.base",
-        mx: -400,
-        mt: -200,
-        px: 400,
-        pb: 350,
-        children
-      }
-    );
-  }
-);
+var _seedsreactduration = require('@sproutsocial/seeds-react-duration');
+var _seedsreacticon = require('@sproutsocial/seeds-react-icon');
+var _seedsreactnumeral = require('@sproutsocial/seeds-react-numeral');
+var _seedsreacttext = require('@sproutsocial/seeds-react-text');
 
-// src/components/ChartTooltip/components/ChartTooltipPortal.tsx
-var import_react9 = require("react");
-var import_react_dom = require("react-dom");
-var generateChartTooltipPortalId = (chartId) => `highcharts-custom-tooltip-${chartId}`;
-var ChartTooltipPortal = (0, import_react9.memo)(
-  function ChartTooltipPortal2({
-    chart,
-    renderContent
-  }) {
-    const isInitialized = (0, import_react9.useRef)(false);
-    const [node, setNode] = (0, import_react9.useState)(null);
-    const [context, setContext] = (0, import_react9.useState)(null);
-    (0, import_react9.useEffect)(() => {
-      const formatter = function() {
-        if (!isInitialized.current) {
-          isInitialized.current = true;
-          chart.tooltip.refresh.apply(chart.tooltip, [this.point]);
-          chart.tooltip.hide(0);
-        }
-        setContext(this);
-        return `<div id="${generateChartTooltipPortalId(
-          chart.index
-        )}" role='tooltip'></div>`;
-      };
-      chart.update({ tooltip: { formatter } });
-    }, [chart]);
-    (0, import_react9.useEffect)(() => {
-      if (context?.series?.chart?.tooltip) {
-        const tooltip = context.series.chart.tooltip;
-        const textElement = tooltip.label.text.element;
-        tooltip.label.box.attr({
-          height: textElement.offsetHeight,
-          width: textElement.offsetWidth
-        });
-        setNode(
-          document.getElementById(generateChartTooltipPortalId(chart.index))
-        );
-      }
-    }, [context, chart.index]);
-    return node && context ? (0, import_react_dom.createPortal)(renderContent(context), node) : null;
-  }
-);
-
-// src/components/ChartTooltip/components/ChartTooltipTable.tsx
-var import_react11 = require("react");
-
-// src/components/ChartTable/ChartTable.tsx
-var import_react10 = require("react");
-var import_styled_components6 = __toESM(require("styled-components"));
-var import_seeds_react_text2 = require("@sproutsocial/seeds-react-text");
-var import_seeds_react_table = require("@sproutsocial/seeds-react-table");
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var StyledSeedsTable = (0, import_styled_components6.default)(import_seeds_react_table.Table)`
-  tbody tr:last-child {
-    border-bottom: none;
-  }
-  tr:last-child td,
-  tr:last-child th {
-    padding-bottom: 0;
-  }
-  tr:first-child td,
-  tr:first-child th {
-    padding-top: 0;
-  }
-  tr th {
-    padding-left: 0;
-  }
-  tr td:last-child {
-    padding-right: 0;
-  }
-`;
-var StyledSeedsTableRow = (0, import_styled_components6.default)(import_seeds_react_table.Table.TableRow)`
-  ${({ $isAppendedRow, theme: theme16 }) => $isAppendedRow ? `border-top: 2px solid ${theme16.colors.container.border.base}` : ""}
-`;
-var ChartTable = (0, import_react10.memo)(function ChartTable2({
-  rows
-}) {
-  if (!rows || rows.length === 0) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StyledSeedsTable, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_seeds_react_table.Table.TableBody, { children: rows.map(({ cells, isAppendedRow }, rowIndex) => {
-    if (!cells || cells.length === 0) {
-      return null;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-      StyledSeedsTableRow,
-      {
-        $isAppendedRow: isAppendedRow,
-        children: cells.map(
-          ({ content, align = "left", colSpan = 1 }, cellIndex) => {
-            const uniqueIdentifier = `chart-tooltip-table-cell-${cellIndex}`;
-            return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-              import_seeds_react_table.Table.Cell,
-              {
-                id: uniqueIdentifier,
-                scope: cellIndex === 0 ? "row" : void 0,
-                align,
-                colSpan,
-                py: 200,
-                children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_seeds_react_text2.Text.SmallBodyCopy, { as: "div", children: content })
-              },
-              uniqueIdentifier
-            );
-          }
-        )
-      },
-      `chart-tooltip-table-row-${rowIndex}`
-    );
-  }) }) });
-});
-
-// src/components/ChartTooltip/components/ChartTooltipTable.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var ChartTooltipTable = (0, import_react11.memo)(
-  function ChartTooltipTable2({ rows }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ChartTable, { rows });
-  }
-);
-
-// src/components/ChartTooltip/components/ChartTooltipTitle.tsx
-var import_react12 = require("react");
-var import_seeds_react_text3 = require("@sproutsocial/seeds-react-text");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var ChartTooltipTitle = (0, import_react12.memo)(
-  function ChartTooltipTitle2({ children }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_seeds_react_text3.Text.SmallSubHeadline, { as: "p", children });
-  }
-);
-
-// src/components/AreaChart/components/AreaChartTooltip.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var AreaChartTooltip = (0, import_react13.memo)(
+var AreaChartTooltip = _react.memo.call(void 0, 
   function AreaChartTooltip2({
     data,
     invalidNumberLabel,
@@ -496,11 +100,11 @@ var AreaChartTooltip = (0, import_react13.memo)(
       return {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartLegendLabel, { color, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_text4.Text, { "aria-label": `${name}: `, children: name }) }) })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabel, { color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { "aria-label": `${name}: `, children: name }) }) })
           },
           {
-            content: value === null && invalidNumberLabel ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_text4.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_duration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_seeds_react_numeral.Numeral,
+            content: value === null && invalidNumberLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreactnumeral.Numeral,
               {
                 abbreviate: false,
                 currency,
@@ -518,8 +122,8 @@ var AreaChartTooltip = (0, import_react13.memo)(
       {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_seeds_react_text4.Text,
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreacttext.Text,
               {
                 fontWeight: "semibold",
                 "aria-label": `${tooltipTotalLabel}: `,
@@ -528,8 +132,8 @@ var AreaChartTooltip = (0, import_react13.memo)(
             )
           },
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_text4.Text, { fontWeight: "bold", children: total === null && invalidNumberLabel ? invalidNumberLabel : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_duration.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_seeds_react_numeral.Numeral,
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { fontWeight: "bold", children: total === null && invalidNumberLabel ? invalidNumberLabel : numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreactnumeral.Numeral,
               {
                 abbreviate: false,
                 currency,
@@ -544,60 +148,61 @@ var AreaChartTooltip = (0, import_react13.memo)(
         isAppendedRow: true
       }
     ] : [];
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(ChartTooltip, { children: [
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVFBZ7FNKjs.ChartTooltip, { children: [
       xAnnotationDetails ? xAnnotationDetails() : void 0,
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-        ChartTooltipTable,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkVFBZ7FNKjs.ChartTooltipTable,
         {
           rows: [...rows, ...appendedRows]
         }
       ),
-      onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_seeds_react_box8.Box, { display: "flex", alignItems: "center", gap: 300, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_icon.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_seeds_react_text4.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
+      onClick && tooltipClickLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
       ] }) : tooltipClickLabel }) : null
     ] });
   }
 );
 
 // src/components/ChartXAnnotationMarker/components/ChartXAnnotationMarkerPortal.tsx
-var import_react14 = require("react");
-var import_react_dom2 = require("react-dom");
-var import_highcharts = require("highcharts");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var ChartXAnnotationMarkerPortal = (0, import_react14.memo)(
+
+var _reactdom = require('react-dom');
+
+
+var ChartXAnnotationMarkerPortal = _react.memo.call(void 0, 
   function ChartXAnnotationMarkerPortal2({
     xAnnotations,
-    annotationContext
+    annotationContext,
+    chartContainer
   }) {
-    const annotationContainers = (0, import_react14.useRef)({});
-    const [renderCount, setRenderCount] = (0, import_react14.useState)(0);
+    const annotationContainers = _react.useRef.call(void 0, {});
+    const [renderCount, setRenderCount] = _react.useState.call(void 0, 0);
     const forceRender = () => setRenderCount((prev) => prev + 1);
-    (0, import_react14.useEffect)(() => {
+    _react.useEffect.call(void 0, () => {
       if (annotationContext.labels) {
         const newContainers = {};
-        const existingAnnotationContainers = document.querySelectorAll(
+        const existingAnnotationContainers = chartContainer.querySelectorAll(
           "div[data-annotation-marker='true']"
         );
         existingAnnotationContainers.forEach(
           (annotation) => annotation.setAttribute("data-annotation-marker", "false")
         );
         annotationContext.labels.forEach((label) => {
-          const labelElement = label.graphic?.div;
+          const labelElement = _optionalChain([label, 'access', _3 => _3.graphic, 'optionalAccess', _4 => _4.div]);
           if (labelElement) {
             labelElement.querySelectorAll("div[data-annotation-marker]").forEach((component) => component.remove());
             const annotationDiv = document.createElement("div");
             annotationDiv.setAttribute("data-annotation-marker", "true");
             labelElement.appendChild(annotationDiv);
-            const xValue = label.options?.point?.x;
+            const xValue = _optionalChain([label, 'access', _5 => _5.options, 'optionalAccess', _6 => _6.point, 'optionalAccess', _7 => _7.x]);
             newContainers[xValue] = annotationDiv;
           }
         });
         annotationContainers.current = newContainers;
         forceRender();
         requestAnimationFrame(() => {
-          document.querySelectorAll("div.highcharts-annotation").forEach((annotationDiv) => {
+          chartContainer.querySelectorAll("div.highcharts-annotation").forEach((annotationDiv) => {
             const reactAnnotations = annotationDiv.querySelectorAll(
               "div[data-annotation-marker]"
             );
@@ -610,570 +215,19 @@ var ChartXAnnotationMarkerPortal = (0, import_react14.memo)(
           });
         });
       }
-    }, [annotationContext.labels, xAnnotations]);
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children: Object.entries(annotationContainers.current).map(
+    }, [annotationContext.labels, xAnnotations, chartContainer]);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: Object.entries(annotationContainers.current).map(
       ([xValue, container]) => {
-        const annotationComponent = xAnnotations?.[Number(xValue)]?.marker;
-        return annotationComponent ? (0, import_react_dom2.createPortal)(annotationComponent(), container) : null;
+        const annotationComponent = _optionalChain([xAnnotations, 'optionalAccess', _8 => _8[Number(xValue)], 'optionalAccess', _9 => _9.marker]);
+        return annotationComponent ? _reactdom.createPortal.call(void 0, annotationComponent(), container) : null;
       }
     ) });
   }
 );
 
-// src/helpers/transformDataToSeries.ts
-var transformDataToSeries = ({
-  data
-}, type) => {
-  const hasCategoricalData = data.some(
-    (series) => series.points.some((point) => typeof point.x === "string")
-  );
-  return data.map((dataItem, dataIndex) => {
-    const points = dataItem.points || [];
-    const dataPoints = points.map((point, pointsIndex) => {
-      let enableMarker = false;
-      const isFirstPoint = pointsIndex === 0;
-      const isLastPoint = pointsIndex === points.length - 1;
-      const previousY = isFirstPoint ? null : points[pointsIndex - 1].y;
-      const nextY = isLastPoint ? null : points[pointsIndex + 1].y;
-      if (isFirstPoint && nextY === null) {
-        enableMarker = true;
-      } else if (isLastPoint && previousY === null) {
-        enableMarker = true;
-      } else if (previousY === null && nextY === null) {
-        enableMarker = true;
-      }
-      return {
-        x: hasCategoricalData ? pointsIndex : point.x,
-        y: point.y,
-        marker: {
-          enabled: enableMarker ? enableMarker : void 0,
-          symbol: enableMarker ? "circle" : void 0
-        },
-        // For categorical data, store the original category name
-        ...hasCategoricalData && { name: point.x }
-      };
-    });
-    return {
-      colorIndex: dataIndex,
-      data: dataPoints,
-      name: dataItem.name,
-      type
-    };
-  });
-};
-
-// src/helpers/transformTimeSeriesTooltipData.ts
-var import_seeds_react_theme6 = require("@sproutsocial/seeds-react-theme");
-var transformTimeSeriesTooltipData = ({
-  context,
-  data
-}) => {
-  return (context.series.chart.series || []).map((series, index) => {
-    const pointIndex = context.point.index;
-    const y = series?.points?.[pointIndex]?.y;
-    return {
-      color: data[index]?.styles?.color || import_seeds_react_theme6.theme.colors.DATAVIZ_COLORS_LIST[index],
-      ...data[index]?.icon ? { icon: data[index]?.icon } : {},
-      name: series.name,
-      value: typeof y === "number" ? y : null
-    };
-  });
-};
-
-// src/helpers/yAxisLabelFormatter.ts
-var import_seeds_react_duration2 = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_numeral2 = require("@sproutsocial/seeds-react-numeral");
-var yAxisLabelFormatter = ({
-  numberLocale,
-  textLocale,
-  tickPositions,
-  value,
-  currency = "USD",
-  numberFormat = "decimal"
-}) => {
-  const numberValue = Number(value);
-  if (numberValue === 0) {
-    return (0, import_seeds_react_numeral2.formatNumeral)({
-      locale: numberLocale,
-      number: numberValue
-    });
-  }
-  if (numberFormat === "duration") {
-    return (0, import_seeds_react_duration2.formatDuration)({
-      display: "narrow",
-      locale: textLocale,
-      milliseconds: numberValue
-    });
-  }
-  const maxValue = tickPositions && tickPositions.length > 0 ? tickPositions[tickPositions.length - 1] : void 0;
-  const abbreviate = typeof maxValue === "number" && maxValue > 9999 ? 1e3 : true;
-  return (0, import_seeds_react_numeral2.formatNumeral)({
-    abbreviate,
-    currency,
-    format: numberFormat,
-    locale: numberLocale,
-    number: numberValue
-  });
-};
-
-// src/helpers/xAxisLabelFormatter.ts
-var getDatePartsInTimezone = (date, timezone) => {
-  const formatter = new Intl.DateTimeFormat("en-US", {
-    year: "numeric",
-    month: "numeric",
-    day: "numeric",
-    timeZone: timezone
-  });
-  const parts = formatter.formatToParts(date);
-  return {
-    day: parseInt(parts.find((p) => p.type === "day")?.value ?? "0", 10),
-    month: parseInt(parts.find((p) => p.type === "month")?.value ?? "0", 10),
-    year: parseInt(parts.find((p) => p.type === "year")?.value ?? "0", 10)
-  };
-};
-var xAxisLabelFormatter = ({
-  textLocale,
-  tickPositions = [],
-  unitName,
-  value,
-  // optional
-  timeFormat = "12",
-  timezone = "UTC"
-}) => {
-  if (typeof value === "string") {
-    return `<span>${value}</span>`;
-  }
-  const tickIndex = tickPositions.indexOf(value);
-  const isFirst = tickIndex === 0;
-  const previousValue = tickPositions[tickIndex - 1];
-  const valueDate = new Date(value);
-  const valueParts = getDatePartsInTimezone(valueDate, timezone);
-  const previousValueDate = previousValue ? new Date(previousValue) : void 0;
-  const previousValueParts = previousValueDate ? getDatePartsInTimezone(previousValueDate, timezone) : void 0;
-  let firstPartOptions = {};
-  let secondPartOptions = {};
-  switch (unitName) {
-    case "hour":
-      firstPartOptions = timeFormat === "24" ? { hour: "numeric", minute: "numeric", hour12: false } : { hour: "numeric" };
-      if (isFirst || valueParts.day !== previousValueParts?.day) {
-        secondPartOptions = { day: "numeric", month: "short" };
-      }
-      break;
-    case "day":
-    case "week":
-      firstPartOptions = { day: "numeric" };
-      if (isFirst || valueParts.month !== previousValueParts?.month) {
-        secondPartOptions = { month: "short" };
-      }
-      break;
-    case "month":
-      firstPartOptions = { month: "short" };
-      if (isFirst || valueParts.year !== previousValueParts?.year) {
-        secondPartOptions = { year: "numeric" };
-      }
-      break;
-    case "year":
-      firstPartOptions = { year: "numeric" };
-      break;
-    default:
-      firstPartOptions = {};
-      break;
-  }
-  const firstPart = new Intl.DateTimeFormat(textLocale, {
-    ...firstPartOptions,
-    timeZone: timezone
-  }).format(valueDate);
-  const secondPart = Object.keys(secondPartOptions).length > 0 ? new Intl.DateTimeFormat(textLocale, {
-    ...secondPartOptions,
-    timeZone: timezone
-  }).format(valueDate) : void 0;
-  return `<span>${firstPart}</span>${secondPart ? `<span>${secondPart}</span>` : ""}`;
-};
-
-// src/helpers/isHourlyTimeData.ts
-function isHourlyTimeData(data) {
-  if (!data.length) return false;
-  const xVals = data.flatMap((series) => series.points.map((p) => p.x));
-  if (!xVals.length) return false;
-  if (xVals.some((x) => typeof x === "string")) return false;
-  const dates = xVals.map((x) => {
-    const d = new Date(x);
-    return `${d.getUTCFullYear()}-${d.getUTCMonth()}-${d.getUTCDate()}`;
-  });
-  const uniqueDates = new Set(dates);
-  if (uniqueDates.size !== 1) return false;
-  return xVals.every((x) => {
-    const d = new Date(x);
-    const hour = d.getUTCHours();
-    const minutes = d.getUTCMinutes();
-    const seconds = d.getUTCSeconds();
-    return hour >= 0 && hour <= 23 && minutes === 0 && seconds === 0;
-  });
-}
-
-// src/helpers/isCategoricalHourData.ts
-function isCategoricalHourData(data) {
-  if (!data.length) return false;
-  const xVals = data.flatMap((series) => series.points.map((p) => p.x));
-  if (!xVals.length) return false;
-  if (xVals.some((x) => typeof x !== "string")) return false;
-  const hour12Pattern = /^\d{1,2} (AM|PM)$/;
-  const hour24Pattern = /^([01]?\d|2[0-3]):([0-5]\d)$/;
-  const stringValues = xVals;
-  const allMatch12Hour = stringValues.every((x) => hour12Pattern.test(x));
-  const allMatch24Hour = stringValues.every((x) => hour24Pattern.test(x));
-  return allMatch12Hour || allMatch24Hour;
-}
-
-// src/helpers/getStorybookRandomColor.ts
-var getStorybookRandomColor = () => {
-  const letters = "0123456789ABCDEF";
-  let color = "#";
-  for (let i = 0; i < 6; i++) {
-    color += letters[Math.floor(Math.random() * 16)];
-  }
-  return color;
-};
-
-// src/helpers/getStorybookCategoricalData.ts
-var getStorybookCategoricalData = ({
-  showNulls,
-  showNegativeValues,
-  numberOfSeries,
-  yAxisMax,
-  showCustomColors,
-  showDashedLines,
-  categoryType
-}) => {
-  const categoryOptions = {
-    hours: [
-      "12 AM",
-      "1 AM",
-      "2 AM",
-      "3 AM",
-      "4 AM",
-      "5 AM",
-      "6 AM",
-      "7 AM",
-      "8 AM",
-      "9 AM",
-      "10 AM",
-      "11 AM",
-      "12 PM",
-      "1 PM",
-      "2 PM",
-      "3 PM",
-      "4 PM",
-      "5 PM",
-      "6 PM",
-      "7 PM",
-      "8 PM",
-      "9 PM",
-      "10 PM",
-      "11 PM"
-    ],
-    hours24: [
-      "00:00",
-      "01:00",
-      "02:00",
-      "03:00",
-      "04:00",
-      "05:00",
-      "06:00",
-      "07:00",
-      "08:00",
-      "09:00",
-      "10:00",
-      "11:00",
-      "12:00",
-      "13:00",
-      "14:00",
-      "15:00",
-      "16:00",
-      "17:00",
-      "18:00",
-      "19:00",
-      "20:00",
-      "21:00",
-      "22:00",
-      "23:00"
-    ],
-    days: [
-      "Monday",
-      "Tuesday",
-      "Wednesday",
-      "Thursday",
-      "Friday",
-      "Saturday",
-      "Sunday"
-    ],
-    months: [
-      "January",
-      "February",
-      "March",
-      "April",
-      "May",
-      "June",
-      "July",
-      "August",
-      "September",
-      "October",
-      "November",
-      "December"
-    ],
-    custom: [
-      "Category A",
-      "Category B",
-      "Category C",
-      "Category D",
-      "Category E"
-    ]
-  };
-  const categories = categoryOptions[categoryType];
-  const numberOfPoints = categories.length;
-  return [...Array(numberOfSeries).keys()].map((seriesIndex) => {
-    let nullsArray = [];
-    if (showNulls) {
-      const nullsArrayLength = Math.floor(numberOfPoints / 5);
-      nullsArray = [...Array(nullsArrayLength)].map(
-        () => Math.floor(Math.random() * numberOfPoints)
-      );
-    }
-    return {
-      points: categories.map((category, pointIndex) => {
-        const showNull = nullsArray && nullsArray.length > 0 ? nullsArray.includes(pointIndex) : false;
-        const randomValue = Math.random();
-        const positiveOrNegativeYAxisMax = showNegativeValues ? randomValue < 0.5 ? -yAxisMax : yAxisMax : yAxisMax;
-        return {
-          x: category,
-          y: showNull ? null : Math.floor(randomValue * positiveOrNegativeYAxisMax)
-        };
-      }),
-      name: `Series ${seriesIndex + 1}`,
-      styles: {
-        color: showCustomColors ? getStorybookRandomColor() : void 0,
-        pattern: showDashedLines ? "dashed" : "solid"
-      }
-    };
-  });
-};
-
-// src/helpers/getStorybookSparseTimelineData.ts
-var getStorybookSparseTimelineData = ({
-  showNulls,
-  showNegativeValues,
-  numberOfSeries,
-  yAxisMax,
-  showCustomColors,
-  showDashedLines,
-  numberOfPoints = 5,
-  timeSpanHours = 24
-}) => {
-  const seriesNames = [
-    "Posts Published",
-    "Comments",
-    "Likes",
-    "Shares",
-    "Clicks",
-    "Views",
-    "Saves",
-    "Reposts",
-    "Mentions",
-    "Reactions"
-  ];
-  const baseDate = /* @__PURE__ */ new Date("2024-01-01T00:00:00Z");
-  const timeSpanMs = timeSpanHours * 60 * 60 * 1e3;
-  return [...Array(numberOfSeries).keys()].map((seriesIndex) => {
-    let nullsArray = [];
-    if (showNulls) {
-      const nullsArrayLength = Math.floor(numberOfPoints / 5);
-      nullsArray = [...Array(nullsArrayLength)].map(
-        () => Math.floor(Math.random() * numberOfPoints)
-      );
-    }
-    const timestamps = [...Array(numberOfPoints)].map(() => {
-      const randomOffset = Math.random() * timeSpanMs;
-      return baseDate.getTime() + randomOffset;
-    }).sort((a, b) => a - b);
-    return {
-      points: timestamps.map((timestamp, pointIndex) => {
-        const showNull = nullsArray && nullsArray.length > 0 ? nullsArray.includes(pointIndex) : false;
-        const randomValue = Math.random();
-        const positiveOrNegativeYAxisMax = showNegativeValues ? randomValue < 0.5 ? -yAxisMax : yAxisMax : yAxisMax;
-        return {
-          x: timestamp,
-          y: showNull ? null : Math.floor(randomValue * positiveOrNegativeYAxisMax)
-        };
-      }),
-      name: seriesNames[seriesIndex] || `Series ${seriesIndex + 1}`,
-      styles: {
-        color: showCustomColors ? getStorybookRandomColor() : void 0,
-        pattern: showDashedLines ? "dashed" : "solid"
-      }
-    };
-  });
-};
-
 // src/hooks/useTimeSeriesChartOptions.ts
-var import_react15 = require("react");
-
-// src/constants/chartOptions.ts
-var import_lodash = __toESM(require("lodash"));
-var baseChartOptions = {
-  chart: {
-    animation: false,
-    styledMode: true
-  },
-  credits: {
-    enabled: false
-  },
-  exporting: {
-    enabled: false,
-    fallbackToExportServer: false
-  },
-  legend: {
-    enabled: false
-  },
-  title: {
-    text: void 0
-  },
-  tooltip: {
-    hideDelay: 0,
-    outside: true,
-    padding: 0,
-    shape: "rect",
-    shared: true,
-    useHTML: true
-  }
-};
-var TIME_SERIES_CHART_HEIGHT = 275;
-var timeSeriesChartOptions = import_lodash.default.merge({}, baseChartOptions, {
-  annotations: [
-    {
-      draggable: "",
-      labelOptions: {
-        useHTML: true,
-        padding: 0
-        // removes "left" property padding created by highcharts so that label is centered
-      }
-    }
-  ],
-  chart: {
-    // events.click is set at the component level because of the optional onClick prop
-    height: TIME_SERIES_CHART_HEIGHT,
-    spacing: [5, 1, 0, 2]
-  },
-  plotOptions: {
-    series: {
-      animation: false,
-      clip: false,
-      marker: {
-        enabled: false,
-        states: {
-          hover: {
-            enabled: false
-          }
-        }
-      }
-    }
-  },
-  xAxis: {
-    crosshair: {
-      zIndex: 3
-    },
-    minPadding: 0,
-    // must be handled dynamically instead of css
-    maxPadding: 0,
-    // must be handled dynamically instead of css
-    type: "datetime",
-    labels: {
-      useHTML: true
-      // formatter is set at the component level because of the required text locale prop
-    }
-  },
-  yAxis: {
-    labels: {
-      useHTML: true
-      // formatter is set at the component level because of the optional yAxisLabelFormatter prop
-    },
-    softMax: 0,
-    softMin: 0,
-    title: {
-      text: void 0
-    },
-    plotLines: [
-      /* Adds a custom plotLine at y=0 to represent the chart baseline.
-        This approach allows full control over the line's appearance (e.g., color, z-index),
-        unlike relying on the default xAxis line, which always renders at the bottom of the chart
-        even when y=0 appears elsewhere (e.g., with negative values).
-      */
-      {
-        className: "y-axis-zero-line",
-        value: 0,
-        zIndex: 3
-        // ensures the line appears over the default y=0 line, which we can't seleect as specifically
-      }
-    ]
-  }
-});
-var lineChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
-  // plotOptions.spline.events.click is set at the component level because of the optional onClick prop
-});
-var areaChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
-  plotOptions: {
-    areaspline: {
-      // events.click is set at the component level because of the optional onClick prop
-      stacking: "normal"
-    }
-  }
-});
-var columnChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
-  plotOptions: {
-    column: {
-      stacking: "normal",
-      pointPadding: 0.25,
-      groupPadding: 0.25,
-      borderRadius: 4
-    }
-  },
-  xAxis: {
-    crosshair: false
-  },
-  yAxis: {
-    plotLines: [
-      {
-        // For stacked column charts with visible borders (e.g., white for contrast),
-        // we raise the zIndex of the y=0 plotLine to ensure it remains visible
-        // and isn't visually covered by overlapping column borders.
-        zIndex: 5
-      }
-    ]
-  }
-});
-var VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT = 10;
-var DONUT_CHART_HALO_SIZE = 10;
-var DONUT_CHART_HEIGHT = 250 + DONUT_CHART_HALO_SIZE * 2;
-var DONUT_CHART_WIDTH = DONUT_CHART_HEIGHT;
-var donutChartOptions = import_lodash.default.merge({}, baseChartOptions, {
-  chart: {
-    height: DONUT_CHART_HEIGHT,
-    spacing: [0, 0, 0, 0]
-  },
-  plotOptions: {
-    pie: {
-      animation: false,
-      borderRadius: 0,
-      // must be handled here instead of css because of path rendering
-      dataLabels: {
-        enabled: false
-      },
-      innerSize: "50%"
-    }
-  }
-});
 
-// src/hooks/useTimeSeriesChartOptions.ts
-var import_lodash2 = require("lodash");
+var _lodash = require('lodash');
 var useTimeSeriesChartOptions = ({
   xAnnotations,
   data,
@@ -1189,15 +243,15 @@ var useTimeSeriesChartOptions = ({
   timezone = "UTC",
   xAxisLabelFormatter: xAxisLabelFormatter2
 }) => {
-  const [chart, setChart] = (0, import_react15.useState)(null);
-  const callback = (0, import_react15.useCallback)((chartInstance) => {
+  const [chart, setChart] = _react.useState.call(void 0, null);
+  const callback = _react.useCallback.call(void 0, (chartInstance) => {
     setChart(chartInstance);
   }, []);
   function attachTooltipEventListeners(series, tooltipId) {
     const handleFocus = (point) => point.series.chart.tooltip.refresh(point);
     const handleBlur = (point) => point.series.chart.tooltip.hide(0);
     series.flatMap((item) => item.data).forEach((point) => {
-      const pointElement = point?.graphic?.element;
+      const pointElement = _optionalChain([point, 'optionalAccess', _10 => _10.graphic, 'optionalAccess', _11 => _11.element]);
       if (pointElement) {
         pointElement.setAttribute("aria-describedby", tooltipId);
         pointElement.addEventListener("focus", () => handleFocus(point));
@@ -1224,23 +278,23 @@ var useTimeSeriesChartOptions = ({
   const getBaseChartOptions = (type) => {
     switch (type) {
       case "areaspline":
-        return areaChartOptions;
+        return _chunkVFBZ7FNKjs.areaChartOptions;
       case "spline":
-        return lineChartOptions;
+        return _chunkVFBZ7FNKjs.lineChartOptions;
       case "column":
-        return columnChartOptions;
+        return _chunkVFBZ7FNKjs.columnChartOptions;
       default:
-        return lineChartOptions;
+        return _chunkVFBZ7FNKjs.lineChartOptions;
     }
   };
   const baseChartOptions2 = getBaseChartOptions(seriesType);
   const hasCategoricalData = data.some(
     (series) => series.points.some((point) => typeof point.x === "string")
   );
-  const categories = hasCategoricalData ? data[0]?.points.map((point) => point.x) || [] : [];
+  const categories = hasCategoricalData ? _optionalChain([data, 'access', _12 => _12[0], 'optionalAccess', _13 => _13.points, 'access', _14 => _14.map, 'call', _15 => _15((point) => point.x)]) || [] : [];
   const hasSparseTimelineData = !hasCategoricalData && seriesType === "column";
-  const options = (0, import_react15.useMemo)(() => {
-    return (0, import_lodash2.merge)({}, baseChartOptions2, {
+  const options = _react.useMemo.call(void 0, () => {
+    return _lodash.merge.call(void 0, {}, baseChartOptions2, {
       accessibility: {
         point: {
           descriptionFormatter: function() {
@@ -1257,10 +311,10 @@ var useTimeSeriesChartOptions = ({
         marginTop: chartMarginTop,
         events: {
           click: onClick ? function() {
-            return onClick({ x: this?.hoverPoint?.x });
+            return onClick({ x: _optionalChain([this, 'optionalAccess', _16 => _16.hoverPoint, 'optionalAccess', _17 => _17.x]) });
           } : void 0,
           load: function() {
-            const tooltipId = generateChartTooltipPortalId(this.index);
+            const tooltipId = _chunkVFBZ7FNKjs.generateChartTooltipPortalId.call(void 0, this.index);
             attachTooltipEventListeners(this.series, tooltipId);
           }
         }
@@ -1339,7 +393,7 @@ var useTimeSeriesChartOptions = ({
           }
         }
       },
-      series: transformDataToSeries({ data }, seriesType),
+      series: _chunkVFBZ7FNKjs.transformDataToSeries.call(void 0, { data }, seriesType),
       time: { timezone },
       tooltip: {
         enabled: !disableTooltips
@@ -1351,7 +405,7 @@ var useTimeSeriesChartOptions = ({
               Number
             );
             const value = this.value;
-            const unitName = this.tickPositionInfo?.unitName;
+            const unitName = _optionalChain([this, 'access', _18 => _18.tickPositionInfo, 'optionalAccess', _19 => _19.unitName]);
             if (typeof xAxisLabelFormatter2 === "function") {
               return xAxisLabelFormatter2({
                 textLocale,
@@ -1387,7 +441,7 @@ var useTimeSeriesChartOptions = ({
             return yAxisLabelFormatter2 ? yAxisLabelFormatter2({
               y: this.value,
               yValues: this.axis.tickPositions
-            }) : yAxisLabelFormatter({
+            }) : _chunkVFBZ7FNKjs.yAxisLabelFormatter.call(void 0, {
               currency,
               numberFormat,
               numberLocale,
@@ -1418,195 +472,21 @@ var useTimeSeriesChartOptions = ({
   ]);
   return { options, chart, callback };
 };
-var xAxisLabelFormatterDefault = xAxisLabelFormatter;
-
-// src/styles/chartStyles.ts
-var import_styled_components7 = require("styled-components");
-var import_seeds_react_theme7 = require("@sproutsocial/seeds-react-theme");
-var import_highcharts2 = require("highcharts/css/highcharts.css");
-var GlobalChartStyleOverrides = import_styled_components7.createGlobalStyle`
-  // USAGE NOTE:
-  // Put general styles in baseChartStyles instead when possible to avoid excessive global styling.
-  // This global component is only for styles that can't override highcharts defaults when scoped.
-
-  .highcharts-tooltip-container {
-    z-index: 7 !important;
-  }
-  .highcharts-tooltip-box {
-    fill: transparent !important;
-  }
-`;
-var baseChartStyles = import_styled_components7.css`
-  --highcharts-background-color: ${({ theme: theme16 }) => theme16.colors.container.background.base};
-
-  // set color variables and map to each series
-  ${({ $colors }) => $colors.map((color, index) => {
-  const chartColor = color || import_seeds_react_theme7.theme.colors.DATAVIZ_COLORS_LIST[index];
-  return `
-				// map colors to custom assigned colors or fallback to default data viz color rotation
-				--highcharts-color-${index}: ${chartColor};
-
-				// highcharts already accounts for 10 series, but if we have more, we need to add them
-				.highcharts-color-${index} {
-					color: var(--highcharts-color-${index});
-					stroke: var(--highcharts-color-${index});
-					fill: var(--highcharts-color-${index});
-				}`;
-}).join("\n")}
-
-  // set overall chart background color
-  .highcharts-background {
-    fill: ${({ theme: theme16 }) => theme16.colors.container.background.base};
-  }
-
-  g.highcharts-annotation-label {
-    display: none;
-  }
-
-  div.highcharts-annotation-label {
-    top: 0 !important;
-    transform: translateX(-50%); // centers the label on the targeted axis point
-    pointer-events: none; // prevents tooltip hover from being interrupted by this element since it renders after on the dom
-  }
-`;
-var timeSeriesChartStyles = import_styled_components7.css`
-  ${baseChartStyles}
-
-  // vertical crosshair styles
-	.highcharts-crosshair {
-    stroke: ${({ theme: theme16 }) => theme16.colors.container.border.decorative.neutral};
-    stroke-width: 1;
-  }
-
-  // axis and gridline styles
-  .highcharts-grid-line {
-    stroke: ${({ theme: theme16 }) => theme16.colors.container.border.base};
-  }
+var xAxisLabelFormatterDefault = _chunkVFBZ7FNKjs.xAxisLabelFormatter;
 
-  .highcharts-axis-line {
-    stroke: ${({ theme: theme16 }) => theme16.colors.container.border.base};
-  }
-
-  .highcharts-tick {
-    stroke: none;
-  }
-  .highcharts-xaxis-labels,
-  .highcharts-yaxis-labels {
-    > span {
-      font-family: ${({ theme: theme16 }) => theme16.fontFamily};
-      ${({ theme: theme16 }) => theme16.typography[100]};
-      font-weight: ${({ theme: theme16 }) => theme16.fontWeights.normal};
-      color: ${({ theme: theme16 }) => theme16.colors.text.subtext};
-    }
-  }
-  .highcharts-xaxis-labels {
-    > span {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      > span:nth-of-type(2) {
-        font-weight: ${({ theme: theme16 }) => theme16.fontWeights.semibold};
-      }
-    }
-  }
-
-  // we don't want to drop the opacity when another item is hovered
-  .highcharts-series-inactive {
-    opacity: 1;
-  }
-
-  // apply cursor pointer when click functionality is turned on
-  ${({ $hasOnClick }) => $hasOnClick && `
- 			.highcharts-series,
- 			.highcharts-point {
- 				cursor: pointer;
- 			}
- 			.highcharts-plot-background,
- 			.highcharts-crosshair,
- 			.highcharts-grid-line {
- 				fill: transparent;
- 				cursor: pointer;
- 		}`}
-
-  path.highcharts-plot-line.y-axis-zero-line {
-    stroke: ${({ theme: theme16 }) => theme16.colors.container.border.decorative.neutral};
-  }
-`;
-var lineChartStyles = import_styled_components7.css`
-  ${timeSeriesChartStyles}
-
-  // set the line stroke
-	.highcharts-graph {
-    stroke-width: 3;
-  }
-
-  // dashed line styles
-  ${({ $patterns }) => $patterns.map((pattern, index) => {
-  return pattern === "dashed" ? `
- 					// highcharts already accounts for 10 series, but if we have more, we need to add them
- 					.highcharts-series-${index} {
- 						stroke-dasharray: 2, 8;
- 					}` : "";
-})}
-`;
-var areaChartStyles = import_styled_components7.css`
-  ${timeSeriesChartStyles}
-
-  // don't need to show a stroke for the line part of each area
-	.highcharts-graph {
-    stroke-width: 0;
-  }
-
-  // fill areas to full opacity
-  .highcharts-area {
-    fill-opacity: 1;
-  }
-`;
-var donutChartStyles = import_styled_components7.css`
-  ${baseChartStyles}
-
-  // remove 250ms fade in/out when hovering over different donut chart slices
-	.highcharts-point {
-    transition: opacity 0s;
-  }
-
-  // remove stroke on donut slices
-  .highcharts-pie-series .highcharts-point {
-    stroke: none;
-  }
-
-  // don't reduce opacity when hovering
-  .highcharts-point-hover {
-    fill-opacity: none;
-  }
+// src/components/AreaChart/AreaChart.tsx
 
-  // apply cursor pointer when click functionality is turned on
-  ${({ $hasOnClick }) => $hasOnClick && `
- 			.highcharts-series,
- 			.highcharts-point {
- 				cursor: pointer;
- 			}
- 			.highcharts-plot-background,
- 			.highcharts-crosshair,
- 			.highcharts-grid-line {
- 				fill: transparent;
- 				cursor: pointer;
- 		}`}
-`;
 
-// src/components/AreaChart/AreaChart.tsx
-var import_seeds_react_theme8 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-(0, import_accessibility.default)(import_highcharts3.default);
-(0, import_annotations.default)(import_highcharts3.default);
-var StyledBox3 = (0, import_styled_components8.default)(import_seeds_react_box9.Box)`
-  ${areaChartStyles}
+_accessibility2.default.call(void 0, _highcharts2.default);
+_annotations2.default.call(void 0, _highcharts2.default);
+var StyledBox = _styledcomponents2.default.call(void 0, _seedsreactbox.Box)`
+  ${_chunkVFBZ7FNKjs.areaChartStyles}
 `;
-var AreaChart = (0, import_react16.memo)(function AreaChart2(props) {
+var AreaChart = _react.memo.call(void 0, function AreaChart2(props) {
   const { data } = props;
-  return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AreaChartWithData, { ...props });
+  return data.length === 0 ? null : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AreaChartWithData, { ...props });
 });
-var AreaChartWithData = (0, import_react16.memo)(function AreaChartWithData2({
+var AreaChartWithData = _react.memo.call(void 0, function AreaChartWithData2({
   data,
   invalidNumberLabel,
   numberLocale = "en-us",
@@ -1640,45 +520,46 @@ var AreaChartWithData = (0, import_react16.memo)(function AreaChartWithData2({
     xAnnotations
   });
   const colors = data.map(
-    (series, index) => series.styles?.color ?? import_seeds_react_theme8.theme.colors.DATAVIZ_COLORS_LIST[index]
+    (series, index) => _nullishCoalesce(_optionalChain([series, 'access', _20 => _20.styles, 'optionalAccess', _21 => _21.color]), () => ( _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index]))
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(GlobalChartStyleOverrides, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
-      StyledBox3,
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.GlobalChartStyleOverrides, {}),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      StyledBox,
       {
         $colors: colors,
         $hasOnClick: Boolean(onClick),
         bg: "container.background.base",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-            import_highcharts_react_official.HighchartsReact,
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _highchartsreactofficial.HighchartsReact,
             {
-              highcharts: import_highcharts3.default,
+              highcharts: _highcharts2.default,
               options,
               callback
             }
           ),
-          chart && chart.annotations?.length ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          chart && _optionalChain([chart, 'access', _22 => _22.annotations, 'optionalAccess', _23 => _23.length]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             ChartXAnnotationMarkerPortal,
             {
               xAnnotations,
-              annotationContext: chart.annotations?.[0]
+              annotationContext: _optionalChain([chart, 'access', _24 => _24.annotations, 'optionalAccess', _25 => _25[0]]),
+              chartContainer: chart.container
             }
           ) : null,
-          chart && !disableTooltips ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-            ChartTooltipPortal,
+          chart && !disableTooltips ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkVFBZ7FNKjs.ChartTooltipPortal,
             {
               chart,
               renderContent: (context) => {
-                const tooltipData = transformTimeSeriesTooltipData({
+                const tooltipData = _chunkVFBZ7FNKjs.transformTimeSeriesTooltipData.call(void 0, {
                   context,
                   data
                 });
                 const x = context.x;
                 const total = context.total;
-                const xAnnotationDetails = xAnnotations?.[x]?.details;
-                return tooltip ? tooltip({ data: tooltipData, total, x }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                const xAnnotationDetails = _optionalChain([xAnnotations, 'optionalAccess', _26 => _26[x], 'optionalAccess', _27 => _27.details]);
+                return tooltip ? tooltip({ data: tooltipData, total, x }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                   AreaChartTooltip,
                   {
                     currency,
@@ -1699,7 +580,7 @@ var AreaChartWithData = (0, import_react16.memo)(function AreaChartWithData2({
               }
             }
           ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_seeds_react_box9.Box, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AreaChartLegend, { data }) })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { mt: 350, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AreaChartLegend, { data }) })
         ]
       }
     )
@@ -1707,30 +588,30 @@ var AreaChartWithData = (0, import_react16.memo)(function AreaChartWithData2({
 });
 
 // src/components/ChartXAnnotationDetails/ChartXAnnotationDetails.tsx
-var import_react17 = require("react");
-var import_seeds_react_box10 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_icon2 = require("@sproutsocial/seeds-react-icon");
-var import_seeds_react_text5 = require("@sproutsocial/seeds-react-text");
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var ChartXAnnotationDetails = (0, import_react17.memo)(
+
+
+
+
+
+var ChartXAnnotationDetails = _react.memo.call(void 0, 
   ({ iconName, text }) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChartTooltipHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_seeds_react_box10.Box, { display: "flex", alignItems: "center", gap: 300, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_seeds_react_icon2.Icon, { name: iconName, size: "mini", color: "icon.base" }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_seeds_react_text5.Text, { color: "text.body", fontSize: 200, children: text })
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipHeader, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: iconName, size: "mini", color: "icon.base" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.body", fontSize: 200, children: text })
     ] }) });
   }
 );
 
 // src/components/ChartXAnnotationMarker/ChartXAnnotationMarker.tsx
-var import_react18 = require("react");
-var import_seeds_react_box11 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_icon3 = require("@sproutsocial/seeds-react-icon");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var ChartXAnnotationMarker = (0, import_react18.memo)(
+
+
+
+
+var ChartXAnnotationMarker = _react.memo.call(void 0, 
   ({ iconName }) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_seeds_react_box11.Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: 200, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-        import_seeds_react_box11.Box,
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: 200, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _seedsreactbox.Box,
         {
           display: "flex",
           alignItems: "center",
@@ -1739,49 +620,49 @@ var ChartXAnnotationMarker = (0, import_react18.memo)(
           height: "20px",
           bg: "icon.base",
           borderRadius: "50%",
-          children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_seeds_react_icon3.Icon, { name: iconName, size: "mini", color: "icon.inverse" })
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: iconName, size: "mini", color: "icon.inverse" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_seeds_react_box11.Box, { height: `199px`, width: "0.5px", bg: "neutral.200" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { height: `199px`, width: "0.5px", bg: "neutral.200" })
     ] });
   }
 );
 
 // src/components/DonutChart/DonutChart.tsx
-var import_react21 = require("react");
-var import_highcharts4 = __toESM(require("highcharts"));
-var import_highcharts_react_official2 = require("highcharts-react-official");
-var import_accessibility2 = __toESM(require("highcharts/modules/accessibility"));
-var import_styled_components9 = __toESM(require("styled-components"));
-var import_seeds_react_box13 = require("@sproutsocial/seeds-react-box");
+
+
+
+
+
+
 
 // src/components/DonutChart/components/DonutChartLegend.tsx
-var import_react19 = require("react");
-var import_seeds_react_theme9 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+
+
+
 var getDonutChartLegendLabels = ({
   data
 }) => {
   return data.map((slice, index) => ({
-    content: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChartLegendLabelContentWithIcon, { icon: slice.icon, children: slice.name }),
-    color: slice.styles?.color || import_seeds_react_theme9.theme.colors.DATAVIZ_COLORS_LIST[index]
+    content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon: slice.icon, children: slice.name }),
+    color: _optionalChain([slice, 'access', _28 => _28.styles, 'optionalAccess', _29 => _29.color]) || _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index]
   }));
 };
-var DonutChartLegend = (0, import_react19.memo)(
+var DonutChartLegend = _react.memo.call(void 0, 
   function DonutChartLegend2({ data }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChartLegend, { legendLabels: getDonutChartLegendLabels({ data }) });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegend, { legendLabels: getDonutChartLegendLabels({ data }) });
   }
 );
 
 // src/components/DonutChart/components/DonutChartTooltip.tsx
-var import_react20 = require("react");
-var import_seeds_react_box12 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_duration3 = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_icon4 = require("@sproutsocial/seeds-react-icon");
-var import_seeds_react_numeral3 = require("@sproutsocial/seeds-react-numeral");
-var import_seeds_react_text6 = require("@sproutsocial/seeds-react-text");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var DonutChartTooltip = (0, import_react20.memo)(
+
+
+
+
+
+
+
+var DonutChartTooltip = _react.memo.call(void 0, 
   function DonutChartTooltip2({
     color,
     name,
@@ -1799,12 +680,12 @@ var DonutChartTooltip = (0, import_react20.memo)(
       {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartLegendLabel, { color, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_seeds_react_text6.Text, { "aria-label": `${name}: `, children: name }) }) })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabel, { color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { "aria-label": `${name}: `, children: name }) }) })
           },
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_seeds_react_box12.Box, { display: "inline-flex", alignItems: "center", gap: 350, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                import_seeds_react_numeral3.Numeral,
+            content: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "inline-flex", alignItems: "center", gap: 350, children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _seedsreactnumeral.Numeral,
                 {
                   number: percent,
                   format: "percent",
@@ -1812,8 +693,8 @@ var DonutChartTooltip = (0, import_react20.memo)(
                   locale: numberLocale
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_seeds_react_text6.Text, { fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_seeds_react_duration3.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                import_seeds_react_numeral3.Numeral,
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _seedsreactnumeral.Numeral,
                 {
                   abbreviate: false,
                   currency,
@@ -1828,26 +709,26 @@ var DonutChartTooltip = (0, import_react20.memo)(
         ]
       }
     ];
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(ChartTooltip, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartTooltipTable, { rows }),
-      onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_seeds_react_box12.Box, { display: "flex", alignItems: "center", gap: 300, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_seeds_react_icon4.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_seeds_react_text6.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVFBZ7FNKjs.ChartTooltip, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTable, { rows }),
+      onClick && tooltipClickLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
       ] }) : tooltipClickLabel }) : null
     ] });
   }
 );
 
 // src/components/DonutChart/helpers/transformDonutChartTooltipData.ts
-var import_seeds_react_theme10 = require("@sproutsocial/seeds-react-theme");
+
 var transformDonutChartTooltipData = ({
   context,
   data
 }) => {
   const colorIndex = context.colorIndex;
   return {
-    color: data[colorIndex]?.styles?.color ?? import_seeds_react_theme10.theme.colors.DATAVIZ_COLORS_LIST[colorIndex] ?? "",
-    ...data[colorIndex]?.icon ? { icon: data[colorIndex]?.icon } : {},
+    color: _nullishCoalesce(_nullishCoalesce(_optionalChain([data, 'access', _30 => _30[colorIndex], 'optionalAccess', _31 => _31.styles, 'optionalAccess', _32 => _32.color]), () => ( _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[colorIndex])), () => ( "")),
+    ..._optionalChain([data, 'access', _33 => _33[colorIndex], 'optionalAccess', _34 => _34.icon]) ? { icon: _optionalChain([data, 'access', _35 => _35[colorIndex], 'optionalAccess', _36 => _36.icon]) } : {},
     name: context.key,
     percent: context.percentage,
     value: context.y
@@ -1855,17 +736,17 @@ var transformDonutChartTooltipData = ({
 };
 
 // src/components/DonutChart/DonutChart.tsx
-var import_seeds_react_theme11 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-(0, import_accessibility2.default)(import_highcharts4.default);
-var StyledBox4 = (0, import_styled_components9.default)(import_seeds_react_box13.Box)`
-  ${donutChartStyles}
+
+
+_accessibility2.default.call(void 0, _highcharts2.default);
+var StyledBox2 = _styledcomponents2.default.call(void 0, _seedsreactbox.Box)`
+  ${_chunkVFBZ7FNKjs.donutChartStyles}
 `;
-var DonutChart = (0, import_react21.memo)(function DonutChart2(props) {
+var DonutChart = _react.memo.call(void 0, function DonutChart2(props) {
   const { data } = props;
-  return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DonutChartWithData, { ...props });
+  return data.length === 0 ? null : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DonutChartWithData, { ...props });
 });
-var DonutChartWithData = (0, import_react21.memo)(
+var DonutChartWithData = _react.memo.call(void 0, 
   function DonutChartWithData2({
     data,
     numberLocale = "en-us",
@@ -1879,12 +760,12 @@ var DonutChartWithData = (0, import_react21.memo)(
     onClick,
     tooltipClickLabel
   }) {
-    const [options, setOptions] = (0, import_react21.useState)(donutChartOptions);
-    const [chart, setChart] = (0, import_react21.useState)(null);
-    const callback = (0, import_react21.useCallback)((chartInstance) => {
+    const [options, setOptions] = _react.useState.call(void 0, _chunkVFBZ7FNKjs.donutChartOptions);
+    const [chart, setChart] = _react.useState.call(void 0, null);
+    const callback = _react.useCallback.call(void 0, (chartInstance) => {
       setChart(chartInstance);
     }, []);
-    (0, import_react21.useEffect)(() => {
+    _react.useEffect.call(void 0, () => {
       setOptions({
         accessibility: {
           point: {
@@ -1896,17 +777,17 @@ var DonutChartWithData = (0, import_react21.memo)(
         chart: {
           events: {
             render: function() {
-              const allSlices = this.series[0]?.data ?? [];
-              const tooltipId = generateChartTooltipPortalId(this.index);
+              const allSlices = _nullishCoalesce(_optionalChain([this, 'access', _37 => _37.series, 'access', _38 => _38[0], 'optionalAccess', _39 => _39.data]), () => ( []));
+              const tooltipId = _chunkVFBZ7FNKjs.generateChartTooltipPortalId.call(void 0, this.index);
               allSlices.forEach((slice) => {
-                const sliceElement = slice?.graphic?.element;
-                sliceElement?.setAttribute("aria-describedby", tooltipId);
-                sliceElement?.addEventListener("focus", () => {
+                const sliceElement = _optionalChain([slice, 'optionalAccess', _40 => _40.graphic, 'optionalAccess', _41 => _41.element]);
+                _optionalChain([sliceElement, 'optionalAccess', _42 => _42.setAttribute, 'call', _43 => _43("aria-describedby", tooltipId)]);
+                _optionalChain([sliceElement, 'optionalAccess', _44 => _44.addEventListener, 'call', _45 => _45("focus", () => {
                   slice.series.chart.tooltip.refresh(slice);
-                });
-                sliceElement?.addEventListener("blur", () => {
+                })]);
+                _optionalChain([sliceElement, 'optionalAccess', _46 => _46.addEventListener, 'call', _47 => _47("blur", () => {
                   slice.series.chart.tooltip.hide(0);
-                });
+                })]);
               });
             }
           }
@@ -1934,32 +815,32 @@ var DonutChartWithData = (0, import_react21.memo)(
       });
     }, [data]);
     const colors = data.map(
-      (series, index) => series.styles?.color ?? import_seeds_react_theme11.theme.colors.DATAVIZ_COLORS_LIST[index] ?? ""
+      (series, index) => _nullishCoalesce(_nullishCoalesce(_optionalChain([series, 'access', _48 => _48.styles, 'optionalAccess', _49 => _49.color]), () => ( _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index])), () => ( ""))
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(GlobalChartStyleOverrides, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
-        StyledBox4,
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.GlobalChartStyleOverrides, {}),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        StyledBox2,
         {
           $colors: colors,
           $hasOnClick: Boolean(onClick),
           bg: "container.background.base",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              import_highcharts_react_official2.HighchartsReact,
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _highchartsreactofficial.HighchartsReact,
               {
-                highcharts: import_highcharts4.default,
+                highcharts: _highcharts2.default,
                 options,
                 callback
               }
             ),
-            chart && !disableTooltips ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              ChartTooltipPortal,
+            chart && !disableTooltips ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _chunkVFBZ7FNKjs.ChartTooltipPortal,
               {
                 chart,
                 renderContent: (context) => {
                   const { color, icon, name, percent, value } = transformDonutChartTooltipData({ context, data });
-                  return tooltip ? tooltip({ color, icon, name, percent, value }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  return tooltip ? tooltip({ color, icon, name, percent, value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                     DonutChartTooltip,
                     {
                       color,
@@ -1978,7 +859,7 @@ var DonutChartWithData = (0, import_react21.memo)(
                 }
               }
             ) : null,
-            hideLegend ? null : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_seeds_react_box13.Box, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DonutChartLegend, { data }) })
+            hideLegend ? null : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { mt: 350, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DonutChartLegend, { data }) })
           ]
         }
       )
@@ -1987,14 +868,14 @@ var DonutChartWithData = (0, import_react21.memo)(
 );
 
 // src/components/DonutChart/components/DonutChartLegendTable.tsx
-var import_react22 = require("react");
-var import_seeds_react_box14 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_duration4 = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_numeral4 = require("@sproutsocial/seeds-react-numeral");
-var import_seeds_react_text7 = require("@sproutsocial/seeds-react-text");
-var import_seeds_react_theme12 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var DonutChartLegendTable = (0, import_react22.memo)(
+
+
+
+
+
+
+
+var DonutChartLegendTable = _react.memo.call(void 0, 
   function DonutChartLegendTable2({
     data,
     numberLocale = "en-us",
@@ -2010,16 +891,16 @@ var DonutChartLegendTable = (0, import_react22.memo)(
     );
     const rows = data.map((dataPoint, index) => {
       const { name, icon, styles, value } = dataPoint;
-      const color = styles?.color || import_seeds_react_theme12.theme.colors.DATAVIZ_COLORS_LIST[index];
+      const color = _optionalChain([styles, 'optionalAccess', _50 => _50.color]) || _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index];
       return {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChartLegendLabel, { color, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChartLegendLabelContentWithIcon, { icon, children: name }) })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabel, { color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon, children: name }) })
           },
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_seeds_react_box14.Box, { display: "inline-flex", alignItems: "center", gap: 350, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_text7.Text, { color: "text.body", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                import_seeds_react_numeral4.Numeral,
+            content: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "inline-flex", alignItems: "center", gap: 350, children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.body", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _seedsreactnumeral.Numeral,
                 {
                   abbreviate: false,
                   format: "percent",
@@ -2027,8 +908,8 @@ var DonutChartLegendTable = (0, import_react22.memo)(
                   number: value / total * 100
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_text7.Text, { color: "text.body", fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_duration4.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                import_seeds_react_numeral4.Numeral,
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.body", fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _seedsreactnumeral.Numeral,
                 {
                   abbreviate: false,
                   currency,
@@ -2047,11 +928,11 @@ var DonutChartLegendTable = (0, import_react22.memo)(
       {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_text7.Text, { fontWeight: "semibold", color: "text.headline", children: totalLabel })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { fontWeight: "semibold", color: "text.headline", children: totalLabel })
           },
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_text7.Text, { color: "text.body", fontWeight: "bold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_seeds_react_duration4.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-              import_seeds_react_numeral4.Numeral,
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.body", fontWeight: "bold", children: numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreactnumeral.Numeral,
               {
                 abbreviate: false,
                 currency,
@@ -2066,8 +947,8 @@ var DonutChartLegendTable = (0, import_react22.memo)(
         isAppendedRow: true
       }
     ];
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      ChartTable,
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkVFBZ7FNKjs.ChartTable,
       {
         rows: [...rows, ...totalRow]
       }
@@ -2076,41 +957,41 @@ var DonutChartLegendTable = (0, import_react22.memo)(
 );
 
 // src/components/LineChart/LineChart.tsx
-var import_react25 = require("react");
-var import_highcharts5 = __toESM(require("highcharts"));
-var import_highcharts_react_official3 = require("highcharts-react-official");
-var import_accessibility3 = __toESM(require("highcharts/modules/accessibility"));
-var import_annotations2 = __toESM(require("highcharts/modules/annotations"));
-var import_styled_components10 = __toESM(require("styled-components"));
-var import_seeds_react_box16 = require("@sproutsocial/seeds-react-box");
+
+
+
+
+
+
+
 
 // src/components/LineChart/components/LineChartLegend.tsx
-var import_react23 = require("react");
-var import_seeds_react_theme13 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+
+
+
 var getLineChartLegendLabels = ({
   data
 }) => {
   return data.map((series, index) => ({
-    content: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
-    color: series.styles?.color || import_seeds_react_theme13.theme.colors.DATAVIZ_COLORS_LIST[index]
+    content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
+    color: _optionalChain([series, 'access', _51 => _51.styles, 'optionalAccess', _52 => _52.color]) || _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index]
   }));
 };
-var LineChartLegend = (0, import_react23.memo)(
+var LineChartLegend = _react.memo.call(void 0, 
   function LineChartLegend2({ data }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChartLegend, { legendLabels: getLineChartLegendLabels({ data }) });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegend, { legendLabels: getLineChartLegendLabels({ data }) });
   }
 );
 
 // src/components/LineChart/components/LineChartTooltip.tsx
-var import_react24 = require("react");
-var import_seeds_react_box15 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_duration5 = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_icon5 = require("@sproutsocial/seeds-react-icon");
-var import_seeds_react_numeral5 = require("@sproutsocial/seeds-react-numeral");
-var import_seeds_react_text8 = require("@sproutsocial/seeds-react-text");
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var LineChartTooltip = (0, import_react24.memo)(
+
+
+
+
+
+
+
+var LineChartTooltip = _react.memo.call(void 0, 
   function LineChartTooltip2({
     data,
     invalidNumberLabel,
@@ -2129,11 +1010,11 @@ var LineChartTooltip = (0, import_react24.memo)(
       return {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartLegendLabel, { color, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_seeds_react_text8.Text, { "aria-label": `${name}: `, children: name }) }) })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabel, { color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { "aria-label": `${name}: `, children: name }) }) })
           },
           {
-            content: value === null && invalidNumberLabel ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_seeds_react_text8.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_seeds_react_duration5.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-              import_seeds_react_numeral5.Numeral,
+            content: value === null && invalidNumberLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreactnumeral.Numeral,
               {
                 abbreviate: false,
                 currency,
@@ -2147,31 +1028,31 @@ var LineChartTooltip = (0, import_react24.memo)(
         ]
       };
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(ChartTooltip, { children: [
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVFBZ7FNKjs.ChartTooltip, { children: [
       xAnnotationDetails ? xAnnotationDetails() : void 0,
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartTooltipTable, { rows }),
-      onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_seeds_react_box15.Box, { display: "flex", alignItems: "center", gap: 300, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_seeds_react_icon5.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_seeds_react_text8.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTable, { rows }),
+      onClick && tooltipClickLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
       ] }) : tooltipClickLabel }) : null
     ] });
   }
 );
 
 // src/components/LineChart/LineChart.tsx
-var import_seeds_react_theme14 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime25 = require("react/jsx-runtime");
-(0, import_accessibility3.default)(import_highcharts5.default);
-(0, import_annotations2.default)(import_highcharts5.default);
-var StyledBox5 = (0, import_styled_components10.default)(import_seeds_react_box16.Box)`
-  ${lineChartStyles}
+
+
+_accessibility2.default.call(void 0, _highcharts2.default);
+_annotations2.default.call(void 0, _highcharts2.default);
+var StyledBox3 = _styledcomponents2.default.call(void 0, _seedsreactbox.Box)`
+  ${_chunkVFBZ7FNKjs.lineChartStyles}
 `;
-var LineChart = (0, import_react25.memo)(function LineChart2(props) {
+var LineChart = _react.memo.call(void 0, function LineChart2(props) {
   const { data } = props;
-  return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LineChartWithData, { ...props });
+  return data.length === 0 ? null : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LineChartWithData, { ...props });
 });
-var LineChartWithData = (0, import_react25.memo)(function LineChartWithData2({
+var LineChartWithData = _react.memo.call(void 0, function LineChartWithData2({
   data,
   invalidNumberLabel,
   numberLocale = "en-us",
@@ -2208,9 +1089,9 @@ var LineChartWithData = (0, import_react25.memo)(function LineChartWithData2({
   const { colors, patterns } = data.reduce(
     (acc, item, index) => {
       acc.colors.push(
-        item.styles?.color ?? import_seeds_react_theme14.theme.colors.DATAVIZ_COLORS_LIST[index] ?? ""
+        _nullishCoalesce(_nullishCoalesce(_optionalChain([item, 'access', _53 => _53.styles, 'optionalAccess', _54 => _54.color]), () => ( _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index])), () => ( ""))
       );
-      acc.patterns.push(item.styles?.pattern ?? "solid");
+      acc.patterns.push(_nullishCoalesce(_optionalChain([item, 'access', _55 => _55.styles, 'optionalAccess', _56 => _56.pattern]), () => ( "solid")));
       return acc;
     },
     {
@@ -2218,43 +1099,44 @@ var LineChartWithData = (0, import_react25.memo)(function LineChartWithData2({
       patterns: []
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(GlobalChartStyleOverrides, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
-      StyledBox5,
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.GlobalChartStyleOverrides, {}),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      StyledBox3,
       {
         $colors: colors,
         $patterns: patterns,
         $hasOnClick: Boolean(onClick),
         bg: "container.background.base",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-            import_highcharts_react_official3.HighchartsReact,
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _highchartsreactofficial.HighchartsReact,
             {
-              highcharts: import_highcharts5.default,
+              highcharts: _highcharts2.default,
               options,
               callback
             }
           ),
-          chart && chart.annotations?.length ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          chart && _optionalChain([chart, 'access', _57 => _57.annotations, 'optionalAccess', _58 => _58.length]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             ChartXAnnotationMarkerPortal,
             {
               xAnnotations,
-              annotationContext: chart.annotations?.[0]
+              annotationContext: _optionalChain([chart, 'access', _59 => _59.annotations, 'optionalAccess', _60 => _60[0]]),
+              chartContainer: chart.container
             }
           ) : null,
-          chart && !disableTooltips ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-            ChartTooltipPortal,
+          chart && !disableTooltips ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkVFBZ7FNKjs.ChartTooltipPortal,
             {
               chart,
               renderContent: (context) => {
-                const tooltipData = transformTimeSeriesTooltipData({
+                const tooltipData = _chunkVFBZ7FNKjs.transformTimeSeriesTooltipData.call(void 0, {
                   context,
                   data
                 });
                 const x = context.x;
-                const xAnnotationDetails = xAnnotations?.[x]?.details;
-                return tooltip ? tooltip({ data: tooltipData, x }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                const xAnnotationDetails = _optionalChain([xAnnotations, 'optionalAccess', _61 => _61[x], 'optionalAccess', _62 => _62.details]);
+                return tooltip ? tooltip({ data: tooltipData, x }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                   LineChartTooltip,
                   {
                     currency,
@@ -2273,7 +1155,7 @@ var LineChartWithData = (0, import_react25.memo)(function LineChartWithData2({
               }
             }
           ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_seeds_react_box16.Box, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LineChartLegend, { data }) })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { mt: 350, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LineChartLegend, { data }) })
         ]
       }
     )
@@ -2281,41 +1163,41 @@ var LineChartWithData = (0, import_react25.memo)(function LineChartWithData2({
 });
 
 // src/components/VerticalBarChart/VerticalBarChart.tsx
-var import_react28 = require("react");
-var import_highcharts6 = __toESM(require("highcharts"));
-var import_highcharts_react_official4 = require("highcharts-react-official");
-var import_accessibility4 = __toESM(require("highcharts/modules/accessibility"));
-var import_annotations3 = __toESM(require("highcharts/modules/annotations"));
-var import_styled_components12 = __toESM(require("styled-components"));
-var import_seeds_react_box18 = require("@sproutsocial/seeds-react-box");
+
+
+
+
+
+
+
 
 // src/components/VerticalBarChart/components/VerticalBarChartLegend.tsx
-var import_react26 = require("react");
-var import_seeds_react_theme15 = require("@sproutsocial/seeds-react-theme");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+
+
+
 var getVerticalBarChartLegendLabels = ({
   data
 }) => {
   return data.map((series, index) => ({
-    content: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
-    color: series.styles?.color || import_seeds_react_theme15.theme.colors.DATAVIZ_COLORS_LIST[index]
+    content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
+    color: _optionalChain([series, 'access', _63 => _63.styles, 'optionalAccess', _64 => _64.color]) || _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index]
   }));
 };
-var VerticalBarChartLegend = (0, import_react26.memo)(
+var VerticalBarChartLegend = _react.memo.call(void 0, 
   function VerticalbarChartLegend({ data }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChartLegend, { legendLabels: getVerticalBarChartLegendLabels({ data }) });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegend, { legendLabels: getVerticalBarChartLegendLabels({ data }) });
   }
 );
 
 // src/components/VerticalBarChart/components/VerticalBarChartTooltip.tsx
-var import_react27 = require("react");
-var import_seeds_react_box17 = require("@sproutsocial/seeds-react-box");
-var import_seeds_react_duration6 = require("@sproutsocial/seeds-react-duration");
-var import_seeds_react_icon6 = require("@sproutsocial/seeds-react-icon");
-var import_seeds_react_numeral6 = require("@sproutsocial/seeds-react-numeral");
-var import_seeds_react_text9 = require("@sproutsocial/seeds-react-text");
-var import_jsx_runtime27 = require("react/jsx-runtime");
-var VerticalBarChartTooltip = (0, import_react27.memo)(
+
+
+
+
+
+
+
+var VerticalBarChartTooltip = _react.memo.call(void 0, 
   function VerticalBarChartTooltip2({
     data,
     invalidNumberLabel,
@@ -2334,11 +1216,11 @@ var VerticalBarChartTooltip = (0, import_react27.memo)(
       return {
         cells: [
           {
-            content: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChartLegendLabel, { color, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_seeds_react_text9.Text, { "aria-label": `${name}: `, children: name }) }) })
+            content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabel, { color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { "aria-label": `${name}: `, children: name }) }) })
           },
           {
-            content: value === null && invalidNumberLabel ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_seeds_react_text9.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_seeds_react_duration6.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-              import_seeds_react_numeral6.Numeral,
+            content: value === null && invalidNumberLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactduration.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _seedsreactnumeral.Numeral,
               {
                 abbreviate: false,
                 currency,
@@ -2352,51 +1234,30 @@ var VerticalBarChartTooltip = (0, import_react27.memo)(
         ]
       };
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(ChartTooltip, { children: [
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVFBZ7FNKjs.ChartTooltip, { children: [
       xAnnotationDetails ? xAnnotationDetails() : void 0,
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChartTooltipTable, { rows }),
-      onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_seeds_react_box17.Box, { display: "flex", alignItems: "center", gap: 300, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_seeds_react_icon6.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_seeds_react_text9.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipTable, { rows }),
+      onClick && tooltipClickLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
       ] }) : tooltipClickLabel }) : null
     ] });
   }
 );
 
 // src/components/VerticalBarChart/VerticalBarChart.tsx
-var import_seeds_react_theme16 = require("@sproutsocial/seeds-react-theme");
-
-// src/components/VerticalBarChart/styles.ts
-var import_styled_components11 = require("styled-components");
-var verticalBarChartStyles = import_styled_components11.css`
-  ${timeSeriesChartStyles}
-
-  /*
-    When the chart container is hovered, reduce the opacity of all columns.
-    Then, for the column that is being hovered, restore its opacity.
-    This gives the effect of fading out the non-hovered columns.
-  */
-  .highcharts-container:hover .highcharts-point {
-    fill-opacity: 0.3;
-  }
 
-  .highcharts-point.column-hover {
-    fill-opacity: 1 !important;
-  }
-`;
 
-// src/components/VerticalBarChart/VerticalBarChart.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
-(0, import_accessibility4.default)(import_highcharts6.default);
-(0, import_annotations3.default)(import_highcharts6.default);
-var StyledBox6 = (0, import_styled_components12.default)(import_seeds_react_box18.Box)`
-  ${verticalBarChartStyles}
+_accessibility2.default.call(void 0, _highcharts2.default);
+_annotations2.default.call(void 0, _highcharts2.default);
+var StyledBox4 = _styledcomponents2.default.call(void 0, _seedsreactbox.Box)`
+  ${_chunkVFBZ7FNKjs.verticalBarChartStyles}
 `;
-var VerticalBarChart = (0, import_react28.memo)(
+var VerticalBarChart = _react.memo.call(void 0, 
   function VerticalBarChart2(props) {
     const { data, showSeriesLimitWarning = true } = props;
-    const seriesLimit = props.seriesLimit ?? VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT;
+    const seriesLimit = _nullishCoalesce(props.seriesLimit, () => ( _chunkVFBZ7FNKjs.VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT));
     const isSeriesLimitOverridden = props.seriesLimit !== void 0;
     if (data.length === 0) {
       return null;
@@ -2410,10 +1271,10 @@ var VerticalBarChart = (0, import_react28.memo)(
       }
       chartData = data.slice(0, seriesLimit);
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(VerticalBarChartWithData, { ...props, data: chartData });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, VerticalBarChartWithData, { ...props, data: chartData });
   }
 );
-var VerticalBarChartWithData = (0, import_react28.memo)(
+var VerticalBarChartWithData = _react.memo.call(void 0, 
   function VerticalBarChartWithData2({
     data,
     invalidNumberLabel,
@@ -2431,7 +1292,7 @@ var VerticalBarChartWithData = (0, import_react28.memo)(
     xAnnotations,
     xAxisLabelFormatter: xAxisLabelFormatter2
   }) {
-    const shouldUseTimeFormatter = isHourlyTimeData(data) || isCategoricalHourData(data);
+    const shouldUseTimeFormatter = _chunkVFBZ7FNKjs.isHourlyTimeData.call(void 0, data) || _chunkVFBZ7FNKjs.isCategoricalHourData.call(void 0, data);
     const autoTimeXAxisLabelFormatter = ({
       value,
       timeFormat: timeFormat2
@@ -2487,9 +1348,9 @@ var VerticalBarChartWithData = (0, import_react28.memo)(
     const { colors, patterns } = data.reduce(
       (acc, item, index) => {
         acc.colors.push(
-          item.styles?.color ?? import_seeds_react_theme16.theme.colors.DATAVIZ_COLORS_LIST[index] ?? ""
+          _nullishCoalesce(_nullishCoalesce(_optionalChain([item, 'access', _65 => _65.styles, 'optionalAccess', _66 => _66.color]), () => ( _seedsreacttheme.theme.colors.DATAVIZ_COLORS_LIST[index])), () => ( ""))
         );
-        acc.patterns.push(item.styles?.pattern ?? "solid");
+        acc.patterns.push(_nullishCoalesce(_optionalChain([item, 'access', _67 => _67.styles, 'optionalAccess', _68 => _68.pattern]), () => ( "solid")));
         return acc;
       },
       {
@@ -2497,42 +1358,43 @@ var VerticalBarChartWithData = (0, import_react28.memo)(
         patterns: []
       }
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(GlobalChartStyleOverrides, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
-        StyledBox6,
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVFBZ7FNKjs.GlobalChartStyleOverrides, {}),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        StyledBox4,
         {
           $colors: colors,
           $hasOnClick: Boolean(onClick),
           bg: "container.background.base",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-              import_highcharts_react_official4.HighchartsReact,
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _highchartsreactofficial.HighchartsReact,
               {
-                highcharts: import_highcharts6.default,
+                highcharts: _highcharts2.default,
                 options,
                 callback
               }
             ),
-            chart && chart.annotations?.length ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            chart && _optionalChain([chart, 'access', _69 => _69.annotations, 'optionalAccess', _70 => _70.length]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               ChartXAnnotationMarkerPortal,
               {
                 xAnnotations,
-                annotationContext: chart.annotations?.[0]
+                annotationContext: _optionalChain([chart, 'access', _71 => _71.annotations, 'optionalAccess', _72 => _72[0]]),
+                chartContainer: chart.container
               }
             ) : null,
-            chart ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-              ChartTooltipPortal,
+            chart ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _chunkVFBZ7FNKjs.ChartTooltipPortal,
               {
                 chart,
                 renderContent: (context) => {
-                  const tooltipData = transformTimeSeriesTooltipData({
+                  const tooltipData = _chunkVFBZ7FNKjs.transformTimeSeriesTooltipData.call(void 0, {
                     context,
                     data
                   });
                   const x = context.x;
-                  const xAnnotationDetails = typeof x === "number" ? xAnnotations?.[x]?.details : void 0;
-                  return tooltip ? tooltip({ data: tooltipData, x }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  const xAnnotationDetails = typeof x === "number" ? _optionalChain([xAnnotations, 'optionalAccess', _73 => _73[x], 'optionalAccess', _74 => _74.details]) : void 0;
+                  return tooltip ? tooltip({ data: tooltipData, x }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                     VerticalBarChartTooltip,
                     {
                       currency,
@@ -2551,62 +1413,61 @@ var VerticalBarChartWithData = (0, import_react28.memo)(
                 }
               }
             ) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_seeds_react_box18.Box, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(VerticalBarChartLegend, { data }) })
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { mt: 350, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, VerticalBarChartLegend, { data }) })
           ]
         }
       )
     ] });
   }
 );
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  AreaChart,
-  ChartLegend,
-  ChartLegendLabel,
-  ChartTable,
-  ChartTooltip,
-  ChartTooltipFooter,
-  ChartTooltipHeader,
-  ChartTooltipPortal,
-  ChartTooltipTable,
-  ChartTooltipTitle,
-  ChartXAnnotationDetails,
-  ChartXAnnotationMarker,
-  ColorBox,
-  DONUT_CHART_HALO_SIZE,
-  DONUT_CHART_HEIGHT,
-  DONUT_CHART_WIDTH,
-  DatavizColorBox,
-  DonutChart,
-  DonutChartLegendTable,
-  GlobalChartStyleOverrides,
-  LineChart,
-  NetworkColorBox,
-  TIME_SERIES_CHART_HEIGHT,
-  VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT,
-  VerticalBarChart,
-  areaChartOptions,
-  areaChartStyles,
-  baseChartOptions,
-  baseChartStyles,
-  columnChartOptions,
-  donutChartOptions,
-  donutChartStyles,
-  generateChartTooltipPortalId,
-  getDatavizColor,
-  getDatavizColorWithAlpha,
-  getDatavizOpacity,
-  getStorybookCategoricalData,
-  getStorybookSparseTimelineData,
-  isCategoricalHourData,
-  isHourlyTimeData,
-  lineChartOptions,
-  lineChartStyles,
-  timeSeriesChartOptions,
-  timeSeriesChartStyles,
-  transformDataToSeries,
-  transformTimeSeriesTooltipData,
-  xAxisLabelFormatter,
-  yAxisLabelFormatter
-});
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.AreaChart = AreaChart; exports.ChartLegend = _chunkVFBZ7FNKjs.ChartLegend; exports.ChartLegendLabel = _chunkVFBZ7FNKjs.ChartLegendLabel; exports.ChartTable = _chunkVFBZ7FNKjs.ChartTable; exports.ChartTooltip = _chunkVFBZ7FNKjs.ChartTooltip; exports.ChartTooltipFooter = _chunkVFBZ7FNKjs.ChartTooltipFooter; exports.ChartTooltipHeader = _chunkVFBZ7FNKjs.ChartTooltipHeader; exports.ChartTooltipPortal = _chunkVFBZ7FNKjs.ChartTooltipPortal; exports.ChartTooltipTable = _chunkVFBZ7FNKjs.ChartTooltipTable; exports.ChartTooltipTitle = _chunkVFBZ7FNKjs.ChartTooltipTitle; exports.ChartXAnnotationDetails = ChartXAnnotationDetails; exports.ChartXAnnotationMarker = ChartXAnnotationMarker; exports.ColorBox = _chunkVFBZ7FNKjs.ColorBox; exports.DONUT_CHART_HALO_SIZE = _chunkVFBZ7FNKjs.DONUT_CHART_HALO_SIZE; exports.DONUT_CHART_HEIGHT = _chunkVFBZ7FNKjs.DONUT_CHART_HEIGHT; exports.DONUT_CHART_WIDTH = _chunkVFBZ7FNKjs.DONUT_CHART_WIDTH; exports.DatavizColorBox = _chunkVFBZ7FNKjs.DatavizColorBox; exports.DonutChart = DonutChart; exports.DonutChartLegendTable = DonutChartLegendTable; exports.GlobalChartStyleOverrides = _chunkVFBZ7FNKjs.GlobalChartStyleOverrides; exports.LineChart = LineChart; exports.NetworkColorBox = _chunkVFBZ7FNKjs.NetworkColorBox; exports.TIME_SERIES_CHART_HEIGHT = _chunkVFBZ7FNKjs.TIME_SERIES_CHART_HEIGHT; exports.VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT = _chunkVFBZ7FNKjs.VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT; exports.VerticalBarChart = VerticalBarChart; exports.areaChartOptions = _chunkVFBZ7FNKjs.areaChartOptions; exports.areaChartStyles = _chunkVFBZ7FNKjs.areaChartStyles; exports.baseChartOptions = _chunkVFBZ7FNKjs.baseChartOptions; exports.baseChartStyles = _chunkVFBZ7FNKjs.baseChartStyles; exports.columnChartOptions = _chunkVFBZ7FNKjs.columnChartOptions; exports.donutChartOptions = _chunkVFBZ7FNKjs.donutChartOptions; exports.donutChartStyles = _chunkVFBZ7FNKjs.donutChartStyles; exports.generateChartTooltipPortalId = _chunkVFBZ7FNKjs.generateChartTooltipPortalId; exports.getDatavizColor = _chunkVFBZ7FNKjs.getDatavizColor; exports.getDatavizColorWithAlpha = _chunkVFBZ7FNKjs.getDatavizColorWithAlpha; exports.getDatavizOpacity = _chunkVFBZ7FNKjs.getDatavizOpacity; exports.getStorybookCategoricalData = _chunkVFBZ7FNKjs.getStorybookCategoricalData; exports.getStorybookSparseTimelineData = _chunkVFBZ7FNKjs.getStorybookSparseTimelineData; exports.isCategoricalHourData = _chunkVFBZ7FNKjs.isCategoricalHourData; exports.isHourlyTimeData = _chunkVFBZ7FNKjs.isHourlyTimeData; exports.lineChartOptions = _chunkVFBZ7FNKjs.lineChartOptions; exports.lineChartStyles = _chunkVFBZ7FNKjs.lineChartStyles; exports.timeSeriesChartOptions = _chunkVFBZ7FNKjs.timeSeriesChartOptions; exports.timeSeriesChartStyles = _chunkVFBZ7FNKjs.timeSeriesChartStyles; exports.transformDataToSeries = _chunkVFBZ7FNKjs.transformDataToSeries; exports.transformTimeSeriesTooltipData = _chunkVFBZ7FNKjs.transformTimeSeriesTooltipData; exports.xAxisLabelFormatter = _chunkVFBZ7FNKjs.xAxisLabelFormatter; exports.yAxisLabelFormatter = _chunkVFBZ7FNKjs.yAxisLabelFormatter;
 //# sourceMappingURL=index.js.map