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

package/dist/chunk-VSZSIN34.js

@@ -0,0 +1,796 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } 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; }
+
+
+
+
+
+
+
+
+
+
+
+var _chunkEEVKTTT3js = require('./chunk-EEVKTTT3.js');
+
+// src/charts/shared/chartBase.tsx
+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 _exporting = require('highcharts/modules/exporting'); var _exporting2 = _interopRequireDefault(_exporting);
+var _offlineexporting = require('highcharts/modules/offline-exporting'); var _offlineexporting2 = _interopRequireDefault(_offlineexporting);
+var _exportdata = require('highcharts/modules/export-data'); var _exportdata2 = _interopRequireDefault(_exportdata);
+
+
+
+
+
+
+var _react = require('react');
+var _styledcomponents = require('styled-components');
+var _seedsreactbox = require('@sproutsocial/seeds-react-box');
+
+// src/charts/shared/ChartAnnotationMarkerPortal.tsx
+
+var _reactdom = require('react-dom');
+
+var _seedsreacticon = require('@sproutsocial/seeds-react-icon');
+var _jsxruntime = require('react/jsx-runtime');
+function ChartAnnotationMarker({
+  annotation,
+  lineHeight
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: 200, children: [
+    annotation.icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _seedsreactbox.Box,
+      {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "20px",
+        height: "20px",
+        bg: "icon.base",
+        borderRadius: "50%",
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: annotation.icon, size: "mini", color: "icon.inverse" })
+      }
+    ) : null,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _seedsreactbox.Box,
+      {
+        height: `${lineHeight}px`,
+        width: "0.5px",
+        bg: _nullishCoalesce(annotation.color, () => ( "neutral.200"))
+      }
+    )
+  ] });
+}
+var MARKER_ATTR = "data-v2-chart-annotation-marker";
+var ChartAnnotationMarkerPortal = _react.memo.call(void 0, 
+  function ChartAnnotationMarkerPortal2({
+    annotationLookup,
+    annotationContext,
+    chartContainer,
+    plotHeight
+  }) {
+    const annotationContainers = _react.useRef.call(void 0, {});
+    const [, setRenderCount] = _react.useState.call(void 0, 0);
+    const forceRender = () => setRenderCount((prev) => prev + 1);
+    _react.useEffect.call(void 0, () => {
+      if (!annotationContext.labels) return;
+      const newContainers = {};
+      const existingAnnotationContainers = chartContainer.querySelectorAll(
+        `div[${MARKER_ATTR}='true']`
+      );
+      existingAnnotationContainers.forEach(
+        (annotation) => annotation.setAttribute(MARKER_ATTR, "false")
+      );
+      annotationContext.labels.forEach((label) => {
+        const labelElement = _optionalChain([label, 'access', _ => _.graphic, 'optionalAccess', _2 => _2.div]);
+        if (!labelElement) return;
+        let annotationDiv = labelElement.querySelector(
+          `div[${MARKER_ATTR}]`
+        );
+        if (!annotationDiv) {
+          annotationDiv = document.createElement("div");
+          labelElement.appendChild(annotationDiv);
+        }
+        annotationDiv.setAttribute(MARKER_ATTR, "true");
+        const xValue = _optionalChain([label, 'access', _3 => _3.options, 'optionalAccess', _4 => _4.point, 'optionalAccess', _5 => _5.x]);
+        newContainers[xValue] = annotationDiv;
+      });
+      annotationContainers.current = newContainers;
+      forceRender();
+      requestAnimationFrame(() => {
+        chartContainer.querySelectorAll("div.highcharts-annotation").forEach((annotationDiv) => {
+          const reactAnnotations = annotationDiv.querySelectorAll(
+            `div[${MARKER_ATTR}]`
+          );
+          const hasActiveAnnotations = Array.from(reactAnnotations).some(
+            (div) => div.getAttribute(MARKER_ATTR) === "true"
+          );
+          if (!hasActiveAnnotations) annotationDiv.remove();
+        });
+      });
+    }, [annotationContext.labels, annotationLookup, chartContainer]);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: Object.entries(annotationContainers.current).map(
+      ([xValue, container]) => {
+        const annotation = annotationLookup.get(Number(xValue));
+        return annotation ? _reactdom.createPortal.call(void 0, 
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            ChartAnnotationMarker,
+            {
+              annotation,
+              lineHeight: plotHeight
+            }
+          ),
+          container
+        ) : null;
+      }
+    ) });
+  }
+);
+
+// src/charts/shared/DefaultChartTooltip.tsx
+
+
+var _seedsreacttext = require('@sproutsocial/seeds-react-text');
+
+// src/charts/shared/formatters/valueFormatter.ts
+var _seedsreactduration = require('@sproutsocial/seeds-react-duration');
+var _seedsreactnumeral = require('@sproutsocial/seeds-react-numeral');
+function valueFormatter({
+  value,
+  numberFormat = "decimal",
+  currency = "USD",
+  abbreviate = true,
+  percentInput = "decimal",
+  numberLocale,
+  textLocale
+}) {
+  const numberValue = Number(value);
+  if (numberValue === 0) {
+    return _seedsreactnumeral.formatNumeral.call(void 0, { locale: numberLocale, number: 0 });
+  }
+  if (numberFormat === "duration") {
+    return _seedsreactduration.formatDuration.call(void 0, {
+      display: "narrow",
+      locale: textLocale,
+      milliseconds: numberValue
+    });
+  }
+  if (numberFormat === "percent") {
+    const whole = percentInput === "decimal" ? numberValue * 100 : numberValue;
+    return _seedsreactnumeral.formatNumeral.call(void 0, {
+      format: "percent",
+      locale: numberLocale,
+      number: whole
+    });
+  }
+  return _seedsreactnumeral.formatNumeral.call(void 0, {
+    abbreviate,
+    currency,
+    format: numberFormat,
+    locale: numberLocale,
+    number: numberValue
+  });
+}
+
+// src/charts/shared/DefaultChartTooltip.tsx
+
+function formatTitle(position, timezone) {
+  if (typeof position === "string") return position;
+  return new Date(position).toLocaleDateString(void 0, {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+    weekday: "long",
+    timeZone: timezone
+  });
+}
+function AnnotationHeader({
+  icon,
+  title,
+  description
+}) {
+  const hasIconOrTitle = Boolean(icon || title);
+  if (!hasIconOrTitle && !description) return null;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    hasIconOrTitle ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartTooltipHeader, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _seedsreactbox.Box, { display: "flex", alignItems: "center", gap: 300, children: [
+      icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: icon, size: "mini", color: "icon.base" }) : null,
+      title ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { color: "text.body", fontSize: 200, children: title }) : null
+    ] }) }) : null,
+    description ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartTooltipHeader, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { fontSize: 200, color: "text.subtext", children: description }) }) : null
+  ] });
+}
+function DefaultChartTooltip({
+  data,
+  position,
+  annotation,
+  hasOnClick,
+  tooltipClickLabel,
+  timezone,
+  invalidNumberLabel,
+  valueFormat
+}) {
+  const rows = data.map((d) => ({
+    cells: [
+      {
+        content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartLegendLabel, { color: d.color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { "aria-label": `${d.name}: `, children: d.name }) })
+      },
+      {
+        // Format non-null values through the shared formatter when a
+        // `valueFormat` is supplied. Tooltip values are always full precision
+        // (`abbreviate: false`) — the axis tick scan never applies here (v1
+        // parity: `VerticalBarChartTooltip` passed `abbreviate={false}`).
+        content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacttext.Text, { children: d.value == null ? _nullishCoalesce(invalidNumberLabel, () => ( "\u2014")) : valueFormat ? valueFormatter({
+          ...valueFormat,
+          value: d.value,
+          abbreviate: false
+        }) : d.value }),
+        align: "right"
+      }
+    ]
+  }));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkEEVKTTT3js.ChartTooltip, { children: [
+    annotation ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      AnnotationHeader,
+      {
+        icon: annotation.icon,
+        title: annotation.title,
+        description: annotation.description
+      }
+    ) : null,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartTooltipTitle, { children: formatTitle(position, timezone) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartTooltipTable, { rows }),
+    hasOnClick && tooltipClickLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.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/charts/shared/SeriesLegend.tsx
+
+
+
+var SeriesLegend = _react.memo.call(void 0, function SeriesLegend2({
+  items
+}) {
+  const labels = items.map((item) => ({
+    content: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkEEVKTTT3js.ChartLegendLabelContentWithIcon,
+      {
+        icon: item.icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreacticon.Icon, { name: item.icon, fixedWidth: true, "aria-hidden": true }) : void 0,
+        children: item.name
+      }
+    ),
+    color: item.color
+  }));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.ChartLegend, { legendLabels: labels });
+});
+
+// src/charts/shared/chartExport.ts
+function defaultFilename(type, now) {
+  const iso = now.toISOString();
+  const stamp = `${iso.slice(0, 10)}-${iso.slice(11, 19).replace(/:/g, "-")}`;
+  return slugify(type ? `chart-${type}-${stamp}` : `chart-${stamp}`);
+}
+function slugify(value) {
+  return value.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+}
+
+// src/charts/shared/chartBase.tsx
+
+_accessibility2.default.call(void 0, _highcharts2.default);
+_annotations2.default.call(void 0, _highcharts2.default);
+_exporting2.default.call(void 0, _highcharts2.default);
+_offlineexporting2.default.call(void 0, _highcharts2.default);
+_exportdata2.default.call(void 0, _highcharts2.default);
+function useSeedsChartSetup({
+  series,
+  includePatterns = false,
+  seriesLimit,
+  isSeriesLimitOverridden = false,
+  hideSeriesLimitWarning = false,
+  componentName
+}) {
+  const theme = _styledcomponents.useTheme.call(void 0, );
+  const palette = theme.colors.DATAVIZ_COLORS_LIST;
+  const cappedSeries = _react.useMemo.call(void 0, 
+    () => seriesLimit !== void 0 && seriesLimit >= 1 && series.length > seriesLimit ? series.slice(0, seriesLimit) : series,
+    [series, seriesLimit]
+  );
+  _react.useEffect.call(void 0, () => {
+    if (seriesLimit !== void 0 && seriesLimit >= 1 && series.length > seriesLimit && !isSeriesLimitOverridden && !hideSeriesLimitWarning && componentName != null) {
+      console.warn(
+        `${componentName}: Maximum number of series (${seriesLimit}) exceeded. Only the first ${seriesLimit} series will be displayed.`
+      );
+    }
+  }, [
+    series.length,
+    seriesLimit,
+    isSeriesLimitOverridden,
+    hideSeriesLimitWarning,
+    componentName
+  ]);
+  const colors = _react.useMemo.call(void 0, () => {
+    const out = [];
+    const paletteLen = palette.length;
+    for (let i = 0; i < cappedSeries.length; i++) {
+      const s = cappedSeries[i];
+      out.push(_nullishCoalesce(_nullishCoalesce(s.color, () => ( palette[i % paletteLen])), () => ( "")));
+    }
+    return out;
+  }, [cappedSeries, palette]);
+  const patterns = _react.useMemo.call(void 0, () => {
+    if (!includePatterns) return [];
+    const out = [];
+    for (let i = 0; i < cappedSeries.length; i++) {
+      const s = cappedSeries[i];
+      out.push(_nullishCoalesce(s.pattern, () => ( "solid")));
+    }
+    return out;
+  }, [cappedSeries, includePatterns]);
+  return { theme, colors, patterns, series: cappedSeries };
+}
+function buildExportChartOptions(theme, colors) {
+  const axisOptions = {
+    lineColor: theme.colors.container.border.base,
+    gridLineColor: theme.colors.container.border.base,
+    labels: {
+      style: {
+        color: theme.colors.text.subtext,
+        fontFamily: theme.fontFamily,
+        fontSize: theme.typography[100].fontSize,
+        fontWeight: String(theme.fontWeights.normal)
+      }
+    }
+  };
+  return {
+    chart: {
+      styledMode: false,
+      backgroundColor: theme.colors.container.background.base
+    },
+    // Series without an explicit `color` fall through to this palette by index.
+    colors: [...colors],
+    // The on-screen legend is a React sibling (`SeriesLegend`) outside the chart
+    // SVG, so the export can't capture it. Turn on Highcharts' native legend for
+    // the clone instead, themed to approximate the Seeds `ChartLegend` (centered
+    // row of swatch + `text.subtext` label). It can't reproduce per-series Seeds
+    // icons — those series show colour + name only.
+    legend: {
+      enabled: true,
+      symbolRadius: 4,
+      symbolHeight: 12,
+      symbolWidth: 12,
+      itemStyle: {
+        color: theme.colors.text.subtext,
+        fontFamily: theme.fontFamily,
+        fontSize: theme.typography[200].fontSize,
+        fontWeight: String(theme.fontWeights.normal)
+      }
+    },
+    xAxis: {
+      ...axisOptions,
+      crosshair: {
+        color: theme.colors.container.border.decorative.neutral,
+        width: 1
+      }
+    },
+    // No zero-line: the `y-axis-zero-line` rule in chartStyles is a v1 leftover;
+    // the v2 bar adapter never creates that plotLine.
+    yAxis: axisOptions
+  };
+}
+function createChartExportHandle(chart, getExportChartOptions) {
+  const resolveName = (filename) => _nullishCoalesce(filename, () => ( defaultFilename(_optionalChain([chart, 'access', _6 => _6.options, 'access', _7 => _7.chart, 'optionalAccess', _8 => _8.type]), /* @__PURE__ */ new Date())));
+  const exportImage = async (type, filename) => {
+    chart.exportChartLocal(
+      { type, filename: resolveName(filename) },
+      getExportChartOptions()
+    );
+  };
+  return {
+    exportPNG: ({ filename } = {}) => exportImage("image/png", filename),
+    exportSVG: ({ filename } = {}) => exportImage("image/svg+xml", filename),
+    exportPDF: async ({ filename } = {}) => {
+      const { loadPdfExportLibs } = await Promise.resolve().then(() => _interopRequireWildcard(require("./pdfExportLibs-BZR2D3RA.js")));
+      loadPdfExportLibs();
+      await exportImage("application/pdf", filename);
+    },
+    exportCSV: async ({ filename } = {}) => {
+      const exporting = chart.options.exporting ??= {};
+      const previous = exporting.filename;
+      exporting.filename = resolveName(filename);
+      try {
+        chart.downloadCSV();
+      } finally {
+        exporting.filename = previous;
+      }
+    }
+  };
+}
+function ChartRenderer({
+  options,
+  series,
+  colors,
+  tooltip,
+  annotationLookup,
+  hasOnClick,
+  tooltipClickLabel,
+  timezone,
+  invalidNumberLabel,
+  valueFormat,
+  onReady
+}) {
+  const [chart, setChart] = _react.useState.call(void 0, null);
+  const [plotHeight, setPlotHeight] = _react.useState.call(void 0, 0);
+  const renderTooltip = _nullishCoalesce(tooltip, () => ( DefaultChartTooltip));
+  const theme = _styledcomponents.useTheme.call(void 0, );
+  const exportThemeRef = _react.useRef.call(void 0, { theme, colors });
+  exportThemeRef.current = { theme, colors };
+  const captureChart = _react.useCallback.call(void 0, (chartInstance) => {
+    const forExport = _optionalChain([chartInstance, 'access', _9 => _9.options, 'access', _10 => _10.chart, 'optionalAccess', _11 => _11.forExport]);
+    if (!forExport) {
+      setChart(chartInstance);
+      setPlotHeight(chartInstance.plotHeight);
+    }
+  }, []);
+  const onReadyRef = _react.useRef.call(void 0, onReady);
+  onReadyRef.current = onReady;
+  _react.useEffect.call(void 0, () => {
+    if (!chart) return;
+    _optionalChain([onReadyRef, 'access', _12 => _12.current, 'optionalCall', _13 => _13(
+      createChartExportHandle(
+        chart,
+        () => buildExportChartOptions(
+          exportThemeRef.current.theme,
+          exportThemeRef.current.colors
+        )
+      )
+    )]);
+  }, [chart]);
+  _react.useEffect.call(void 0, () => {
+    if (!chart) return;
+    setPlotHeight(chart.plotHeight);
+    const unbind = _highcharts2.default.addEvent(chart, "redraw", () => {
+      setPlotHeight(chart.plotHeight);
+    });
+    return () => unbind();
+  }, [chart]);
+  const highchartsOptions = _react.useMemo.call(void 0, 
+    () => ({
+      ...options,
+      // useHTML is load-bearing: the tooltip portal's target div only mounts
+      // when the label renders as HTML, not SVG (see `charts/README.md`).
+      tooltip: { ...options.tooltip, useHTML: true },
+      // Client-side/offline export only; native context button hidden (export
+      // is exposed via the `onReady` handle).
+      exporting: {
+        fallbackToExportServer: false,
+        buttons: { contextButton: { enabled: false } }
+      }
+    }),
+    [options]
+  );
+  if (series.length === 0) return null;
+  const chartWithAnnotations = chart;
+  const hasRenderedAnnotations = !!_optionalChain([chartWithAnnotations, 'optionalAccess', _14 => _14.annotations, 'optionalAccess', _15 => _15.length]) && !!_optionalChain([annotationLookup, 'optionalAccess', _16 => _16.size]) && plotHeight > 0;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEEVKTTT3js.GlobalChartStyleOverrides, {}),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _highchartsreactofficial.HighchartsReact,
+      {
+        highcharts: _highcharts2.default,
+        options: highchartsOptions,
+        callback: captureChart
+      }
+    ),
+    hasRenderedAnnotations ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      ChartAnnotationMarkerPortal,
+      {
+        annotationLookup,
+        annotationContext: chartWithAnnotations.annotations[0],
+        chartContainer: chartWithAnnotations.container,
+        plotHeight
+      }
+    ) : null,
+    chart ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkEEVKTTT3js.ChartTooltipPortal,
+      {
+        chart,
+        renderContent: (context) => {
+          const data = _chunkEEVKTTT3js.transformTimeSeriesTooltipData.call(void 0, {
+            context,
+            data: series.map((s, i) => ({
+              name: s.name,
+              points: [],
+              styles: { color: _nullishCoalesce(_nullishCoalesce(s.color, () => ( colors[i])), () => ( "")) }
+            }))
+          }).map((row) => ({
+            color: row.color,
+            name: row.name,
+            value: row.value
+          }));
+          const position = context.x;
+          const resolved = _optionalChain([annotationLookup, 'optionalAccess', _17 => _17.get, 'call', _18 => _18(context.point.x)]);
+          const annotation = resolved ? {
+            icon: resolved.icon,
+            color: resolved.color,
+            title: resolved.title,
+            description: resolved.description
+          } : void 0;
+          return renderTooltip({
+            data,
+            position,
+            annotation,
+            hasOnClick,
+            tooltipClickLabel,
+            timezone,
+            invalidNumberLabel,
+            valueFormat
+          });
+        }
+      }
+    ) : null,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _seedsreactbox.Box, { mt: 350, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      SeriesLegend,
+      {
+        items: series.map((s, i) => ({
+          name: s.name,
+          icon: s.icon,
+          color: _nullishCoalesce(_nullishCoalesce(s.color, () => ( colors[i])), () => ( ""))
+        }))
+      }
+    ) })
+  ] });
+}
+
+// src/charts/shared/annotations.ts
+function buildAnnotationConfig(annotations) {
+  if (!_optionalChain([annotations, 'optionalAccess', _19 => _19.length])) {
+    return { annotations: void 0, lookup: void 0 };
+  }
+  const labels = [];
+  const lookup = /* @__PURE__ */ new Map();
+  for (const annotation of annotations) {
+    const { position } = annotation;
+    labels.push({
+      // Highcharts anchor — always uses `x` regardless of chart orientation.
+      point: { x: position, y: 0, xAxis: 0, yAxis: 0 },
+      // Space (not empty) — Highcharts reverts to its built-in label text on empty string.
+      text: " "
+    });
+    lookup.set(position, annotation);
+  }
+  if (labels.length === 0) {
+    return { annotations: void 0, lookup: void 0 };
+  }
+  return {
+    // `useHTML: true` makes Highcharts attach an HTML `graphic.div` to each
+    // label, which the marker portal needs as its render target. `padding: 0`
+    // removes Highcharts' default left padding so markers stay centered.
+    annotations: [{ labels, labelOptions: { useHTML: true, padding: 0 } }],
+    lookup
+  };
+}
+
+// src/charts/shared/baseChartOptions.ts
+function buildBaseChartOptions({
+  type,
+  description,
+  valueSuffix,
+  reserveTopMargin = false,
+  timezone
+}) {
+  return {
+    chart: {
+      type,
+      styledMode: true,
+      animation: false,
+      ...reserveTopMargin ? { marginTop: 24 } : {}
+    },
+    accessibility: { description },
+    title: { text: "" },
+    credits: { enabled: false },
+    legend: { enabled: false },
+    tooltip: {
+      enabled: true,
+      outside: true,
+      padding: 0,
+      shape: "rect",
+      shared: true,
+      hideDelay: 0,
+      valueSuffix
+    },
+    // Chart-global in Highcharts; only meaningful for datetime axes, so it's
+    // present only when a timezone was resolved (omitted for category axes).
+    ...timezone ? { time: { timezone } } : {}
+  };
+}
+
+// src/charts/shared/formatters/datetimeFormatter.ts
+var DAY_MS = 864e5;
+var WEEK_MS = 6048e5;
+var MIN_MONTH_MS = 24192e5;
+var MIN_YEAR_MS = 31536e6;
+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(_nullishCoalesce(_optionalChain([parts, 'access', _20 => _20.find, 'call', _21 => _21((p) => p.type === "day"), 'optionalAccess', _22 => _22.value]), () => ( "0")), 10),
+    month: parseInt(_nullishCoalesce(_optionalChain([parts, 'access', _23 => _23.find, 'call', _24 => _24((p) => p.type === "month"), 'optionalAccess', _25 => _25.value]), () => ( "0")), 10),
+    year: parseInt(_nullishCoalesce(_optionalChain([parts, 'access', _26 => _26.find, 'call', _27 => _27((p) => p.type === "year"), 'optionalAccess', _28 => _28.value]), () => ( "0")), 10)
+  };
+};
+var deriveGranularity = (tickPositions) => {
+  if (tickPositions.length < 2) {
+    return "day";
+  }
+  const deltas = [];
+  for (let i = 1; i < tickPositions.length; i++) {
+    const curr = tickPositions[i];
+    const prev = tickPositions[i - 1];
+    if (curr === void 0 || prev === void 0) {
+      continue;
+    }
+    deltas.push(Math.abs(curr - prev));
+  }
+  deltas.sort((a, b) => a - b);
+  const mid = Math.floor(deltas.length / 2);
+  const upper = deltas[mid];
+  const lower = deltas[mid - 1];
+  const median = deltas.length % 2 === 0 && lower !== void 0 ? (lower + upper) / 2 : upper;
+  if (median < DAY_MS) {
+    return "hour";
+  }
+  if (median < WEEK_MS) {
+    return "day";
+  }
+  if (median < MIN_MONTH_MS) {
+    return "week";
+  }
+  if (median < MIN_YEAR_MS) {
+    return "month";
+  }
+  return "year";
+};
+function datetimeFormatter({
+  value,
+  tickPositions = [],
+  // optional
+  timezone = "UTC",
+  timeFormat = "12",
+  textLocale = "en-US"
+}) {
+  if (typeof value === "string" || !Number.isFinite(value)) {
+    return { primary: String(value) };
+  }
+  const granularity = deriveGranularity(tickPositions);
+  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 (granularity) {
+    case "hour":
+      firstPartOptions = timeFormat === "24" ? { hour: "numeric", minute: "numeric", hour12: false } : { hour: "numeric" };
+      if (isFirst || valueParts.day !== _optionalChain([previousValueParts, 'optionalAccess', _29 => _29.day])) {
+        secondPartOptions = { day: "numeric", month: "short" };
+      }
+      break;
+    case "day":
+    case "week":
+      firstPartOptions = { day: "numeric" };
+      if (isFirst || valueParts.month !== _optionalChain([previousValueParts, 'optionalAccess', _30 => _30.month])) {
+        secondPartOptions = { month: "short" };
+      }
+      break;
+    case "month":
+      firstPartOptions = { month: "short" };
+      if (isFirst || valueParts.year !== _optionalChain([previousValueParts, 'optionalAccess', _31 => _31.year])) {
+        secondPartOptions = { year: "numeric" };
+      }
+      break;
+    case "year":
+      firstPartOptions = { year: "numeric" };
+      break;
+    default:
+      firstPartOptions = {};
+      break;
+  }
+  const primary = new Intl.DateTimeFormat(textLocale, {
+    ...firstPartOptions,
+    timeZone: timezone
+  }).format(valueDate);
+  if (Object.keys(secondPartOptions).length > 0) {
+    const secondary = new Intl.DateTimeFormat(textLocale, {
+      ...secondPartOptions,
+      timeZone: timezone
+    }).format(valueDate);
+    return { primary, secondary };
+  }
+  return { primary };
+}
+
+// src/charts/shared/axisOptions.ts
+function makeDatetimeAxisLabelFormatter(timezone, timeFormat) {
+  return function() {
+    const { primary, secondary } = datetimeFormatter({
+      value: this.value,
+      tickPositions: _nullishCoalesce(this.axis.tickPositions, () => ( [])),
+      timezone,
+      timeFormat
+    });
+    return secondary ? `${primary}<br/><span class="hc-axis-label-secondary">${secondary}</span>` : primary;
+  };
+}
+function buildDimensionalAxis(axis, timezone) {
+  if (axis.type === "datetime") {
+    return {
+      type: "datetime",
+      crosshair: axis.crosshair,
+      labels: {
+        formatter: makeDatetimeAxisLabelFormatter(timezone, axis.timeFormat)
+      }
+    };
+  }
+  return {
+    type: "category",
+    categories: [...axis.categories],
+    crosshair: axis.crosshair
+  };
+}
+function resolveTooltipTimezone(axis, timezone) {
+  return axis.type === "datetime" ? _nullishCoalesce(timezone, () => ( "UTC")) : void 0;
+}
+
+// src/charts/shared/valueAxisLabelFormatter.ts
+
+var FIXED_LOCALE = "en-US";
+function deriveAbbreviateFromTicks(context) {
+  const tickPositions = context.axis.tickPositions;
+  const maxValue = tickPositions && tickPositions.length > 0 ? tickPositions[tickPositions.length - 1] : void 0;
+  return typeof maxValue === "number" && maxValue > 9999 ? 1e3 : true;
+}
+function defaultValueAxisLabelFormatter() {
+  const numberValue = Number(this.value);
+  if (numberValue === 0) {
+    return _seedsreactnumeral.formatNumeral.call(void 0, { locale: FIXED_LOCALE, number: 0 });
+  }
+  const abbreviate = deriveAbbreviateFromTicks(this);
+  return _seedsreactnumeral.formatNumeral.call(void 0, {
+    abbreviate,
+    format: "decimal",
+    locale: FIXED_LOCALE,
+    number: numberValue
+  });
+}
+function makeValueAxisLabelFormatter(format) {
+  return function() {
+    const numberValue = Number(this.value);
+    const abbreviate = format.abbreviate === false ? false : deriveAbbreviateFromTicks(this);
+    return valueFormatter({ ...format, value: numberValue, abbreviate });
+  };
+}
+
+
+
+
+
+
+
+
+
+
+exports.useSeedsChartSetup = useSeedsChartSetup; exports.ChartRenderer = ChartRenderer; exports.buildAnnotationConfig = buildAnnotationConfig; exports.buildBaseChartOptions = buildBaseChartOptions; exports.buildDimensionalAxis = buildDimensionalAxis; exports.resolveTooltipTimezone = resolveTooltipTimezone; exports.defaultValueAxisLabelFormatter = defaultValueAxisLabelFormatter; exports.makeValueAxisLabelFormatter = makeValueAxisLabelFormatter;
+//# sourceMappingURL=chunk-VSZSIN34.js.map