@sproutsocial/seeds-react-data-viz 0.16.1 → 0.17.1

package/dist/esm/chunk-XMYGML25.js

@@ -0,0 +1,169 @@
+// src/constants/chartOptions.ts
+import _ from "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 = _.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 = _.merge({}, timeSeriesChartOptions, {
+  // plotOptions.spline.events.click is set at the component level because of the optional onClick prop
+});
+var areaChartOptions = _.merge({}, timeSeriesChartOptions, {
+  plotOptions: {
+    areaspline: {
+      // events.click is set at the component level because of the optional onClick prop
+      stacking: "normal"
+    }
+  }
+});
+var columnChartOptions = _.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 = _.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%"
+    }
+  }
+});
+
+export {
+  baseChartOptions,
+  TIME_SERIES_CHART_HEIGHT,
+  timeSeriesChartOptions,
+  lineChartOptions,
+  areaChartOptions,
+  columnChartOptions,
+  VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT,
+  DONUT_CHART_HALO_SIZE,
+  DONUT_CHART_HEIGHT,
+  DONUT_CHART_WIDTH,
+  donutChartOptions
+};
+//# sourceMappingURL=chunk-XMYGML25.js.map

package/dist/esm/chunk-XMYGML25.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/constants/chartOptions.ts"],"sourcesContent":["import type { Options } from \"highcharts\";\nimport _ from \"lodash\";\n\n// options that should apply to all charts\n// this is being exported because it's needed for the listening bubble chart component.\n// when that components gets moved into the data-viz package, we can remove the export here\nexport const baseChartOptions: Options = {\n  chart: {\n    animation: false,\n    styledMode: true,\n  },\n  credits: {\n    enabled: false,\n  },\n  exporting: {\n    enabled: false,\n    fallbackToExportServer: false,\n  },\n  legend: {\n    enabled: false,\n  },\n  title: {\n    text: undefined,\n  },\n  tooltip: {\n    hideDelay: 0,\n    outside: true,\n    padding: 0,\n    shape: \"rect\",\n    shared: true,\n    useHTML: true,\n  },\n};\n\n// options that should apply to time series charts\nexport const TIME_SERIES_CHART_HEIGHT = 275;\nexport const timeSeriesChartOptions: Options = _.merge({}, baseChartOptions, {\n  annotations: [\n    {\n      draggable: \"\",\n      labelOptions: {\n        useHTML: true,\n        padding: 0, // removes \"left\" property padding created by highcharts so that label is centered\n      },\n    },\n  ],\n  chart: {\n    // events.click is set at the component level because of the optional onClick prop\n    height: TIME_SERIES_CHART_HEIGHT,\n    spacing: [5, 1, 0, 2],\n  },\n  plotOptions: {\n    series: {\n      animation: false,\n      clip: false,\n      marker: {\n        enabled: false,\n        states: {\n          hover: {\n            enabled: false,\n          },\n        },\n      },\n    },\n  },\n  xAxis: {\n    crosshair: {\n      zIndex: 3,\n    },\n    minPadding: 0, // must be handled dynamically instead of css\n    maxPadding: 0, // must be handled dynamically instead of css\n    type: \"datetime\",\n    labels: {\n      useHTML: true,\n      // formatter is set at the component level because of the required text locale prop\n    },\n  },\n  yAxis: {\n    labels: {\n      useHTML: true,\n      // formatter is set at the component level because of the optional yAxisLabelFormatter prop\n    },\n    softMax: 0,\n    softMin: 0,\n    title: {\n      text: undefined,\n    },\n    plotLines: [\n      /* Adds a custom plotLine at y=0 to represent the chart baseline.\n        This approach allows full control over the line's appearance (e.g., color, z-index),\n        unlike relying on the default xAxis line, which always renders at the bottom of the chart\n        even when y=0 appears elsewhere (e.g., with negative values).\n      */\n      {\n        className: \"y-axis-zero-line\",\n        value: 0,\n        zIndex: 3, // ensures the line appears over the default y=0 line, which we can't seleect as specifically\n      },\n    ],\n  },\n});\n\n// options that should apply to LineChart\nexport const lineChartOptions: Options = _.merge({}, timeSeriesChartOptions, {\n  // plotOptions.spline.events.click is set at the component level because of the optional onClick prop\n});\n\n// options that should apply to AreaChart\nexport const areaChartOptions: Options = _.merge({}, timeSeriesChartOptions, {\n  plotOptions: {\n    areaspline: {\n      // events.click is set at the component level because of the optional onClick prop\n      stacking: \"normal\",\n    },\n  },\n});\n\nexport const columnChartOptions: Options = _.merge({}, timeSeriesChartOptions, {\n  plotOptions: {\n    column: {\n      stacking: \"normal\",\n      pointPadding: 0.25,\n      groupPadding: 0.25,\n      borderRadius: 4,\n    },\n  },\n  xAxis: {\n    crosshair: false,\n  },\n  yAxis: {\n    plotLines: [\n      {\n        // For stacked column charts with visible borders (e.g., white for contrast),\n        // we raise the zIndex of the y=0 plotLine to ensure it remains visible\n        // and isn't visually covered by overlapping column borders.\n        zIndex: 5,\n      },\n    ],\n  },\n});\n\n/**\n * The default series limit for VerticalBarChart.\n * This limit is recommended to maintain chart readability and accessibility.\n * @see {VerticalBarChart}\n */\nexport const VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n\n// options that should apply to DonutChart\nexport const DONUT_CHART_HALO_SIZE = 10; // 10 is the default from highcharts\nexport const DONUT_CHART_HEIGHT = 250 + DONUT_CHART_HALO_SIZE * 2;\nexport const DONUT_CHART_WIDTH = DONUT_CHART_HEIGHT;\nexport const donutChartOptions: Options = _.merge({}, baseChartOptions, {\n  chart: {\n    height: DONUT_CHART_HEIGHT,\n    spacing: [0, 0, 0, 0],\n  },\n  plotOptions: {\n    pie: {\n      animation: false,\n      borderRadius: 0, // must be handled here instead of css because of path rendering\n      dataLabels: {\n        enabled: false,\n      },\n      innerSize: \"50%\",\n    },\n  },\n});\n"],"mappings":"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","names":[]}

package/dist/esm/donut/index.js

@@ -0,0 +1,125 @@
+import {
+  DONUT_CHART_HEIGHT
+} from "../chunk-XMYGML25.js";
+import {
+  ChartRenderer,
+  buildBaseChartOptions,
+  useSeedsChartSetup
+} from "../chunk-TKNWM7L3.js";
+import {
+  donutChartStyles
+} from "../chunk-Z4LOM4OZ.js";
+
+// src/charts/donut/DonutChart.tsx
+import { memo, useMemo } from "react";
+
+// src/charts/donut/adapter.ts
+function buildDonutOptions(props, colors) {
+  const base = buildBaseChartOptions({
+    type: "pie",
+    description: props.description
+  });
+  return {
+    ...base,
+    chart: {
+      type: "pie",
+      styledMode: true,
+      animation: false,
+      // Height only — width is left fluid (v1 parity) so the chart fills its
+      // container and the pie auto-centers. The container bounds the width (see
+      // styles.ts) so the legend below wraps to the donut and centers with it.
+      height: DONUT_CHART_HEIGHT,
+      // Drop Highcharts' default spacing so the donut uses the full height.
+      spacing: [0, 0, 0, 0]
+    },
+    plotOptions: {
+      pie: {
+        animation: false,
+        // borderRadius must be set in JS, not CSS, because Highcharts computes
+        // the arc path before applying it — CSS border-radius has no effect.
+        borderRadius: 0,
+        dataLabels: { enabled: false },
+        innerSize: "50%",
+        ...props.onClick ? {
+          point: {
+            events: {
+              click() {
+                props.onClick?.({ position: this.name });
+              }
+            }
+          }
+        } : {}
+      }
+    },
+    series: [
+      {
+        type: "pie",
+        name: "Data",
+        data: props.data.map((d, i) => ({
+          name: d.name,
+          y: d.value,
+          color: d.color ?? colors[i] ?? ""
+        }))
+      }
+    ]
+  };
+}
+
+// src/charts/donut/styles.ts
+import styled from "styled-components";
+var DonutChartContainer = styled.div`
+  background-color: ${({ theme }) => theme.colors.container.background.base};
+  ${donutChartStyles}
+
+  /* Dim non-hovered slices. Highcharts adds .highcharts-point-inactive to
+     all pie points except the hovered one. In styledMode, opacity is CSS-only
+     (JS plotOptions.states.inactive.opacity is ignored). */
+  .highcharts-pie-series .highcharts-point-inactive {
+    opacity: 0.3;
+    transition: opacity 0s;
+  }
+`;
+
+// src/charts/donut/DonutChart.tsx
+import { jsx } from "react/jsx-runtime";
+var DonutChart = memo(function DonutChart2(props) {
+  const { colors } = useSeedsChartSetup({
+    series: props.data.map((d) => ({ color: d.color }))
+  });
+  const options = useMemo(
+    () => buildDonutOptions(props, colors),
+    [props, colors]
+  );
+  const hasOnClick = Boolean(props.onClick);
+  const tooltip = props.tooltip ? (args) => props.tooltip(args) : void 0;
+  return /* @__PURE__ */ jsx(
+    DonutChartContainer,
+    {
+      $colors: colors,
+      $hasOnClick: hasOnClick,
+      className: props.className,
+      children: /* @__PURE__ */ jsx(
+        ChartRenderer,
+        {
+          options,
+          series: props.data.map((d, i) => ({
+            name: d.name,
+            color: colors[i],
+            icon: d.icon
+          })),
+          colors,
+          tooltip,
+          hasOnClick,
+          tooltipClickLabel: props.tooltipClickLabel,
+          invalidNumberLabel: props.invalidNumberLabel,
+          valueFormat: props.format,
+          onReady: props.onReady
+        }
+      )
+    }
+  );
+});
+export {
+  DonutChart
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/donut/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/charts/donut/DonutChart.tsx","../../../src/charts/donut/adapter.ts","../../../src/charts/donut/styles.ts"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport {\n  useSeedsChartSetup,\n  ChartRenderer,\n  type ChartTooltipProps,\n} from \"../shared/chartBase\";\nimport { buildDonutOptions } from \"./adapter\";\nimport { DonutChartContainer } from \"./styles\";\nimport type { DonutChartProps, DonutChartTooltipProps } from \"./types\";\n\nexport const DonutChart = memo(function DonutChart(props: DonutChartProps) {\n  // Map each data item to { color? } so useSeedsChartSetup resolves the palette.\n  const { colors } = useSeedsChartSetup({\n    series: props.data.map((d) => ({ color: d.color })),\n  });\n\n  // Memoize to avoid spurious Highcharts redraws on parent re-renders.\n  const options = useMemo(\n    () => buildDonutOptions(props, colors),\n    [props, colors]\n  );\n  const hasOnClick = Boolean(props.onClick);\n\n  // `ChartRenderer` expects `(ChartTooltipProps) => ReactNode`. The consumer's\n  // function expects the narrower `DonutChartTooltipProps` (required `percent`).\n  // Wrap rather than cast the function type so the intent is explicit.\n  const tooltip = props.tooltip\n    ? (args: ChartTooltipProps) =>\n        props.tooltip!(args as unknown as DonutChartTooltipProps)\n    : undefined;\n\n  return (\n    <DonutChartContainer\n      $colors={colors}\n      $hasOnClick={hasOnClick}\n      className={props.className}\n    >\n      <ChartRenderer\n        options={options}\n        series={props.data.map((d, i) => ({\n          name: d.name,\n          color: colors[i],\n          icon: d.icon,\n        }))}\n        colors={colors}\n        tooltip={tooltip}\n        hasOnClick={hasOnClick}\n        tooltipClickLabel={props.tooltipClickLabel}\n        invalidNumberLabel={props.invalidNumberLabel}\n        valueFormat={props.format}\n        onReady={props.onReady}\n      />\n    </DonutChartContainer>\n  );\n});\n","import type { SeedsChartOptions } from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport { DONUT_CHART_HEIGHT } from \"../../constants/chartOptions\";\nimport type { DonutChartProps } from \"./types\";\n\nexport function buildDonutOptions(\n  props: DonutChartProps,\n  colors: ReadonlyArray<string>\n): SeedsChartOptions {\n  const base = buildBaseChartOptions({\n    type: \"pie\",\n    description: props.description,\n  });\n  return {\n    ...base,\n    chart: {\n      type: \"pie\" as const,\n      styledMode: true,\n      animation: false,\n      // Height only — width is left fluid (v1 parity) so the chart fills its\n      // container and the pie auto-centers. The container bounds the width (see\n      // styles.ts) so the legend below wraps to the donut and centers with it.\n      height: DONUT_CHART_HEIGHT,\n      // Drop Highcharts' default spacing so the donut uses the full height.\n      spacing: [0, 0, 0, 0],\n    },\n    plotOptions: {\n      pie: {\n        animation: false,\n        // borderRadius must be set in JS, not CSS, because Highcharts computes\n        // the arc path before applying it — CSS border-radius has no effect.\n        borderRadius: 0,\n        dataLabels: { enabled: false },\n        innerSize: \"50%\",\n        ...(props.onClick\n          ? {\n              point: {\n                events: {\n                  click(this: { name: string }) {\n                    props.onClick?.({ position: this.name });\n                  },\n                },\n              },\n            }\n          : {}),\n      },\n    },\n    series: [\n      {\n        type: \"pie\",\n        name: \"Data\",\n        data: props.data.map((d, i) => ({\n          name: d.name,\n          y: d.value,\n          color: d.color ?? colors[i] ?? \"\",\n        })),\n      },\n    ],\n  };\n}\n","import styled from \"styled-components\";\nimport { donutChartStyles } from \"../../styles/chartStyles\";\nimport type {\n  TypeChartStyleColor,\n  TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n  $colors: ReadonlyArray<TypeChartStyleColor>;\n  $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Plain styled `div` — not `Box`. Per the DS Tailwind direction (established in\n// CE-28/line-area), new components render semantic elements internally.\n//\n// No width constraint (v1 parity): the chart fills the container and the pie\n// auto-centers, while the legend centers in the same width — so the legend\n// stays on one row and centers with the donut instead of wrapping to match it.\nexport const DonutChartContainer = styled.div<StyleProps>`\n  background-color: ${({ theme }) => theme.colors.container.background.base};\n  ${donutChartStyles}\n\n  /* Dim non-hovered slices. Highcharts adds .highcharts-point-inactive to\n     all pie points except the hovered one. In styledMode, opacity is CSS-only\n     (JS plotOptions.states.inactive.opacity is ignored). */\n  .highcharts-pie-series .highcharts-point-inactive {\n    opacity: 0.3;\n    transition: opacity 0s;\n  }\n`;\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,MAAM,eAAe;;;ACKvB,SAAS,kBACd,OACA,QACmB;AACnB,QAAM,OAAO,sBAAsB;AAAA,IACjC,MAAM;AAAA,IACN,aAAa,MAAM;AAAA,EACrB,CAAC;AACD,SAAO;AAAA,IACL,GAAG;AAAA,IACH,OAAO;AAAA,MACL,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,WAAW;AAAA;AAAA;AAAA;AAAA,MAIX,QAAQ;AAAA;AAAA,MAER,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,IACtB;AAAA,IACA,aAAa;AAAA,MACX,KAAK;AAAA,QACH,WAAW;AAAA;AAAA;AAAA,QAGX,cAAc;AAAA,QACd,YAAY,EAAE,SAAS,MAAM;AAAA,QAC7B,WAAW;AAAA,QACX,GAAI,MAAM,UACN;AAAA,UACE,OAAO;AAAA,YACL,QAAQ;AAAA,cACN,QAA8B;AAC5B,sBAAM,UAAU,EAAE,UAAU,KAAK,KAAK,CAAC;AAAA,cACzC;AAAA,YACF;AAAA,UACF;AAAA,QACF,IACA,CAAC;AAAA,MACP;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,MAAM,MAAM,KAAK,IAAI,CAAC,GAAG,OAAO;AAAA,UAC9B,MAAM,EAAE;AAAA,UACR,GAAG,EAAE;AAAA,UACL,OAAO,EAAE,SAAS,OAAO,CAAC,KAAK;AAAA,QACjC,EAAE;AAAA,MACJ;AAAA,IACF;AAAA,EACF;AACF;;;AC3DA,OAAO,YAAY;AAkBZ,IAAM,sBAAsB,OAAO;AAAA,sBACpB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,UAAU,WAAW,IAAI;AAAA,IACvE,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AFiBd;AA3BC,IAAM,aAAa,KAAK,SAASA,YAAW,OAAwB;AAEzE,QAAM,EAAE,OAAO,IAAI,mBAAmB;AAAA,IACpC,QAAQ,MAAM,KAAK,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE;AAAA,EACpD,CAAC;AAGD,QAAM,UAAU;AAAA,IACd,MAAM,kBAAkB,OAAO,MAAM;AAAA,IACrC,CAAC,OAAO,MAAM;AAAA,EAChB;AACA,QAAM,aAAa,QAAQ,MAAM,OAAO;AAKxC,QAAM,UAAU,MAAM,UAClB,CAAC,SACC,MAAM,QAAS,IAAyC,IAC1D;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW,MAAM;AAAA,MAEjB;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,QAAQ,MAAM,KAAK,IAAI,CAAC,GAAG,OAAO;AAAA,YAChC,MAAM,EAAE;AAAA,YACR,OAAO,OAAO,CAAC;AAAA,YACf,MAAM,EAAE;AAAA,UACV,EAAE;AAAA,UACF;AAAA,UACA;AAAA,UACA;AAAA,UACA,mBAAmB,MAAM;AAAA,UACzB,oBAAoB,MAAM;AAAA,UAC1B,aAAa,MAAM;AAAA,UACnB,SAAS,MAAM;AAAA;AAAA,MACjB;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["DonutChart"]}

package/dist/esm/index.js

@@ -1,3 +1,16 @@
+import {
+  DONUT_CHART_HALO_SIZE,
+  DONUT_CHART_HEIGHT,
+  DONUT_CHART_WIDTH,
+  TIME_SERIES_CHART_HEIGHT,
+  VERTICAL_BAR_CHART_DEFAULT_SERIES_LIMIT,
+  areaChartOptions,
+  baseChartOptions,
+  columnChartOptions,
+  donutChartOptions,
+  lineChartOptions,
+  timeSeriesChartOptions
+} from "./chunk-XMYGML25.js";
 import {
   ChartLegend,
   ChartLegendLabel,
@@ -215,163 +228,6 @@ var ChartXAnnotationMarkerPortal = memo3(
 
 // src/hooks/useTimeSeriesChartOptions.ts
 import { useState as useState2, useCallback, useMemo } from "react";
-
-// src/constants/chartOptions.ts
-import _ from "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 = _.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 = _.merge({}, timeSeriesChartOptions, {
-  // plotOptions.spline.events.click is set at the component level because of the optional onClick prop
-});
-var areaChartOptions = _.merge({}, timeSeriesChartOptions, {
-  plotOptions: {
-    areaspline: {
-      // events.click is set at the component level because of the optional onClick prop
-      stacking: "normal"
-    }
-  }
-});
-var columnChartOptions = _.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 = _.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
 import { merge } from "lodash";
 var useTimeSeriesChartOptions = ({
   xAnnotations,