@sproutsocial/seeds-react-data-viz 0.16.0 → 0.17.0

package/dist/donut/index.d.mts

@@ -0,0 +1,48 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { TypeIconName } from '@sproutsocial/seeds-react-icon';
+import { V as ValueFormat, C as ChartTooltipProps, a as ChartTooltipDataRow } from '../chartBase-Cn_5CUJi.mjs';
+import { C as ChartExportHandle } from '../chartExport-CKYpuhik.mjs';
+import '../types-DxrhdAdn.mjs';
+import 'highcharts';
+
+interface DonutDataPoint {
+    name: string;
+    value: number | null;
+    color?: string;
+    /** Seeds icon or partner-logo name rendered in the legend chip. */
+    icon?: TypeIconName;
+}
+/** A donut tooltip row — always carries `percent` (Highcharts computes it for pie series). */
+interface DonutChartTooltipRow extends ChartTooltipDataRow {
+    percent: number;
+}
+/** Tooltip render-prop signature for DonutChart. `data` rows always include `percent`. */
+interface DonutChartTooltipProps extends Omit<ChartTooltipProps, "data"> {
+    data: DonutChartTooltipRow[];
+}
+interface DonutChartProps {
+    /** Wired into Highcharts' `accessibility.description`. */
+    description: string;
+    data: Array<DonutDataPoint>;
+    /** Applied to the outermost container element for layout/spacing overrides. */
+    className?: string;
+    /** Replaces v1's `numberFormat`, `currency`, `numberLocale`, `textLocale`. */
+    format?: ValueFormat;
+    /** Override for the default tooltip content. Receives `DonutChartTooltipProps` including `percent` per row. */
+    tooltip?: (args: DonutChartTooltipProps) => ReactNode;
+    /** Footer content shown in the default tooltip when `onClick` is set. */
+    tooltipClickLabel?: ReactNode;
+    /** Override for the value shown when a data point is `null`. Defaults to an em-dash. */
+    invalidNumberLabel?: ReactNode;
+    /** Click handler invoked with the `name` of the clicked slice. */
+    onClick?: ({ position }: {
+        position: string;
+    }) => void;
+    /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV exports. */
+    onReady?: (handle: ChartExportHandle) => void;
+}
+
+declare const DonutChart: react.NamedExoticComponent<DonutChartProps>;
+
+export { ChartExportHandle, DonutChart, type DonutChartProps, type DonutChartTooltipProps, type DonutChartTooltipRow, type DonutDataPoint, ValueFormat };

package/dist/donut/index.d.ts

@@ -0,0 +1,48 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { TypeIconName } from '@sproutsocial/seeds-react-icon';
+import { V as ValueFormat, C as ChartTooltipProps, a as ChartTooltipDataRow } from '../chartBase-C-l7yYGx.js';
+import { C as ChartExportHandle } from '../chartExport-CKYpuhik.js';
+import '../types-DxrhdAdn.js';
+import 'highcharts';
+
+interface DonutDataPoint {
+    name: string;
+    value: number | null;
+    color?: string;
+    /** Seeds icon or partner-logo name rendered in the legend chip. */
+    icon?: TypeIconName;
+}
+/** A donut tooltip row — always carries `percent` (Highcharts computes it for pie series). */
+interface DonutChartTooltipRow extends ChartTooltipDataRow {
+    percent: number;
+}
+/** Tooltip render-prop signature for DonutChart. `data` rows always include `percent`. */
+interface DonutChartTooltipProps extends Omit<ChartTooltipProps, "data"> {
+    data: DonutChartTooltipRow[];
+}
+interface DonutChartProps {
+    /** Wired into Highcharts' `accessibility.description`. */
+    description: string;
+    data: Array<DonutDataPoint>;
+    /** Applied to the outermost container element for layout/spacing overrides. */
+    className?: string;
+    /** Replaces v1's `numberFormat`, `currency`, `numberLocale`, `textLocale`. */
+    format?: ValueFormat;
+    /** Override for the default tooltip content. Receives `DonutChartTooltipProps` including `percent` per row. */
+    tooltip?: (args: DonutChartTooltipProps) => ReactNode;
+    /** Footer content shown in the default tooltip when `onClick` is set. */
+    tooltipClickLabel?: ReactNode;
+    /** Override for the value shown when a data point is `null`. Defaults to an em-dash. */
+    invalidNumberLabel?: ReactNode;
+    /** Click handler invoked with the `name` of the clicked slice. */
+    onClick?: ({ position }: {
+        position: string;
+    }) => void;
+    /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV exports. */
+    onReady?: (handle: ChartExportHandle) => void;
+}
+
+declare const DonutChart: react.NamedExoticComponent<DonutChartProps>;
+
+export { ChartExportHandle, DonutChart, type DonutChartProps, type DonutChartTooltipProps, type DonutChartTooltipRow, type DonutDataPoint, ValueFormat };

package/dist/donut/index.js

@@ -0,0 +1,125 @@
+"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; }
+
+var _chunkCYQXUAJCjs = require('../chunk-CYQXUAJC.js');
+
+
+
+
+var _chunk2K7PFHIMjs = require('../chunk-2K7PFHIM.js');
+
+
+var _chunkWEKDYQ4Tjs = require('../chunk-WEKDYQ4T.js');
+
+// src/charts/donut/DonutChart.tsx
+var _react = require('react');
+
+// src/charts/donut/adapter.ts
+function buildDonutOptions(props, colors) {
+  const base = _chunk2K7PFHIMjs.buildBaseChartOptions.call(void 0, {
+    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: _chunkCYQXUAJCjs.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() {
+                _optionalChain([props, 'access', _ => _.onClick, 'optionalCall', _2 => _2({ position: this.name })]);
+              }
+            }
+          }
+        } : {}
+      }
+    },
+    series: [
+      {
+        type: "pie",
+        name: "Data",
+        data: props.data.map((d, i) => ({
+          name: d.name,
+          y: d.value,
+          color: _nullishCoalesce(_nullishCoalesce(d.color, () => ( colors[i])), () => ( ""))
+        }))
+      }
+    ]
+  };
+}
+
+// src/charts/donut/styles.ts
+var _styledcomponents = require('styled-components'); var _styledcomponents2 = _interopRequireDefault(_styledcomponents);
+var DonutChartContainer = _styledcomponents2.default.div`
+  background-color: ${({ theme }) => theme.colors.container.background.base};
+  ${_chunkWEKDYQ4Tjs.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
+var _jsxruntime = require('react/jsx-runtime');
+var DonutChart = _react.memo.call(void 0, function DonutChart2(props) {
+  const { colors } = _chunk2K7PFHIMjs.useSeedsChartSetup.call(void 0, {
+    series: props.data.map((d) => ({ color: d.color }))
+  });
+  const options = _react.useMemo.call(void 0, 
+    () => buildDonutOptions(props, colors),
+    [props, colors]
+  );
+  const hasOnClick = Boolean(props.onClick);
+  const tooltip = props.tooltip ? (args) => props.tooltip(args) : void 0;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    DonutChartContainer,
+    {
+      $colors: colors,
+      $hasOnClick: hasOnClick,
+      className: props.className,
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunk2K7PFHIMjs.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
+        }
+      )
+    }
+  );
+});
+
+
+exports.DonutChart = DonutChart;
+//# sourceMappingURL=index.js.map

package/dist/donut/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/donut/index.js","../../src/charts/donut/DonutChart.tsx","../../src/charts/donut/adapter.ts","../../src/charts/donut/styles.ts"],"names":["DonutChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/donut/index.js","sourcesContent":[null,"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"]}

package/dist/esm/bar/index.js

@@ -1,16 +1,20 @@
 import {
-  ChartRenderer,
   buildAnnotationConfig,
-  buildBaseChartOptions,
-  buildDimensionalAxis,
   defaultValueAxisLabelFormatter,
-  makeValueAxisLabelFormatter,
-  resolveTooltipTimezone,
+  makeValueAxisLabelFormatter
+} from "../chunk-AUJ3EWRH.js";
+import {
+  buildDimensionalAxis,
+  resolveTooltipTimezone
+} from "../chunk-NAKJY5PA.js";
+import {
+  ChartRenderer,
+  buildBaseChartOptions,
   useSeedsChartSetup
-} from "../chunk-ZXXFRUVF.js";
+} from "../chunk-LPQXJJNT.js";
 import {
   timeSeriesChartStyles
-} from "../chunk-LC3HGWDD.js";
+} from "../chunk-Z4LOM4OZ.js";
 
 // src/charts/bar/BarChart.tsx
 import { memo } from "react";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/charts/bar/BarChart.tsx","../../../src/charts/bar/adapter.ts","../../../src/charts/bar/styles.ts","../../../src/charts/shared/styles.ts","../../../src/charts/constants.ts"],"sourcesContent":["import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport { BarStyledBox } from \"./styles\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n  // The shared hook caps the series to the limit (and warns once per render\n  // when the default is exceeded without an explicit override) so the adapter\n  // and renderer below all consume the capped data.\n  const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n  const { colors, series } = useSeedsChartSetup({\n    series: props.series,\n    seriesLimit,\n    isSeriesLimitOverridden: props.seriesLimit !== undefined,\n    hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n    componentName: \"BarChart\",\n  });\n\n  const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n    props,\n    props.direction ?? \"vertical\",\n    series\n  );\n  const hasOnClick = Boolean(props.onClick);\n\n  return (\n    <BarStyledBox\n      $colors={colors}\n      $hasOnClick={hasOnClick}\n      bg=\"container.background.base\"\n    >\n      <ChartRenderer\n        options={options}\n        series={series}\n        colors={colors}\n        tooltip={props.tooltip}\n        annotationLookup={annotationLookup}\n        hasOnClick={hasOnClick}\n        tooltipClickLabel={props.tooltipClickLabel}\n        timezone={tooltipTimezone}\n        invalidNumberLabel={props.invalidNumberLabel}\n        valueFormat={props.yAxis?.format}\n        onReady={props.onReady}\n      />\n    </BarStyledBox>\n  );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n  SeedsChartColumnPlotOptions,\n  SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n  buildDimensionalAxis,\n  resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n  defaultValueAxisLabelFormatter,\n  makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n  return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n  props: BarChartProps,\n  direction: BarChartDirection,\n  // The (already-capped) series to render. Defaults to `props.series` so the\n  // ~40 existing call sites keep working; the component passes the capped\n  // series from `useSeedsChartSetup` explicitly.\n  series: BarChartProps[\"series\"] = props.series\n): {\n  options: SeedsChartOptions;\n  annotationLookup: ChartAnnotationLookup | undefined;\n  /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n  tooltipTimezone: string | undefined;\n} {\n  const chartType = highchartsType(direction);\n  const isDatetime = props.xAxis.type === \"datetime\";\n  const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n  const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n    props.annotations\n  );\n  // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n  // single config is assigned under the active direction's key. Typed\n  // explicitly so the `point.events` handlers below keep their `this`/`event`\n  // contextual types (a computed `[chartType]` key would otherwise erase them).\n  const barTypeConfig: SeedsChartColumnPlotOptions = {\n    // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n    // columns side-by-side when no stacking is set.\n    ...(props.stacking === \"grouped\"\n      ? {}\n      : { stacking: props.stacking ?? \"normal\" }),\n    // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n    // so the same padding fractions that work for columns produce hairline bars.\n    pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n    groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n    // Fixed bar width on datetime axes. Sparse time-series otherwise size\n    // columns from the (large) gap between points and balloon; this mirrors\n    // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n    // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n    ...(isDatetime ? { pointWidth: 20 } : {}),\n    borderRadius: 4,\n    borderWidth: 0,\n    // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n    // is over the chart, all bars dim; these handlers restore opacity for\n    // every bar at the hovered x (so stacked/grouped bars highlight together\n    // rather than just the single hovered bar).\n    point: {\n      events: {\n        click: props.onClick\n          ? (event) => props.onClick!({ position: event.point.x })\n          : undefined,\n        mouseOver: function () {\n          const x = this.x;\n          this.series.chart.series.forEach((s) => {\n            if (s.type !== chartType) return;\n            s.data.forEach((point) => {\n              if (point.x !== x) return;\n              point.graphic?.element?.classList.add(\"bar-point-hover\");\n            });\n          });\n        },\n        mouseOut: function () {\n          this.series.chart.series.forEach((s) => {\n            if (s.type !== chartType) return;\n            s.data.forEach((point) => {\n              point.graphic?.element?.classList.remove(\"bar-point-hover\");\n            });\n          });\n        },\n      },\n    },\n  };\n  const options: SeedsChartOptions = {\n    ...buildBaseChartOptions({\n      type: chartType,\n      description: props.description,\n      valueSuffix: props.valueSuffix,\n      reserveTopMargin: Boolean(annotations),\n      timezone: tooltipTimezone,\n    }),\n    xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n    yAxis: {\n      min: props.yAxis?.min,\n      max: props.yAxis?.max,\n      gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n      title: { text: props.yAxis?.title ?? \"\" },\n      labels: {\n        // `showLabels` toggles tick-label visibility; defaults to shown.\n        enabled: props.yAxis?.showLabels !== false,\n        // A declarative `format` drives ticks through the shared valueFormatter;\n        // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n        formatter: props.yAxis?.format\n          ? makeValueAxisLabelFormatter(props.yAxis.format)\n          : defaultValueAxisLabelFormatter,\n      },\n    },\n    plotOptions: {\n      series: { animation: false },\n      [chartType]: barTypeConfig,\n    },\n    series: series.map((s) => ({\n      type: chartType,\n      name: s.name,\n      data: [...s.data],\n      color: s.color,\n    })),\n    ...(annotations ? { annotations } : {}),\n  };\n\n  return { options, annotationLookup, tooltipTimezone };\n}\n","import styled, { css } from \"styled-components\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { timeSeriesChartStyles } from \"../../styles/chartStyles\";\nimport { axisLabelV2Styles } from \"../shared/styles\";\nimport type {\n  TypeChartStyleColor,\n  TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n  $colors: ReadonlyArray<TypeChartStyleColor>;\n  $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Direction-neutral styling shared by the v2 bar family (vertical + horizontal).\n// Consumes only the v1 `timeSeriesChartStyles` base and owns the hover-dimming\n// block itself, keyed on the neutral `.bar-point-hover` class the adapter emits\n// — so v2 no longer imports v1 *component* styles (see `shared/styles.ts`).\nexport const barFamilyStyles = css<StyleProps>`\n  ${timeSeriesChartStyles}\n\n  /*\n    When the chart container is hovered, dim all bars. Then restore opacity for\n    the hovered bar(s) — flagged with the bar-point-hover class by the adapter —\n    so the non-hovered bars fade out.\n  */\n  .highcharts-container:hover .highcharts-point {\n    fill-opacity: 0.3;\n  }\n\n  .highcharts-point.bar-point-hover {\n    fill-opacity: 1 !important;\n  }\n`;\n\nexport const BarStyledBox = styled(Box)<StyleProps>`\n  ${barFamilyStyles}\n  ${axisLabelV2Styles}\n`;\n","import { css } from \"styled-components\";\n\n/**\n * v2 chart axis-label styles. v2 charts render in `styledMode` with\n * `useHTML: false`, so axis labels are SVG `<text>` / `<tspan>` rather than the\n * HTML `<span>`s v1 uses; these mirror the v1 HTML label rules in\n * `styles/chartStyles.ts` for the SVG element type.\n *\n * Kept here, separate from v1's `timeSeriesChartStyles`: v2 may *consume* the v1\n * styles, but v2-specific rules must not accrete into the v1 files — that keeps\n * the eventual v1 → v2 port clean and avoids coupling. Compose this into each v2\n * chart family's styled wrapper.\n */\nexport const axisLabelV2Styles = css`\n  .highcharts-xaxis-labels,\n  .highcharts-yaxis-labels {\n    // SVG labels (styledMode): fill is the SVG text colour; color has no effect.\n    text {\n      font-family: ${({ theme }) => theme.fontFamily};\n      ${({ theme }) => theme.typography[100]};\n      font-weight: ${({ theme }) => theme.fontWeights.normal};\n      fill: ${({ theme }) => theme.colors.text.subtext};\n    }\n  }\n  // Two-line stacked datetime label: the boundary token is an\n  // hc-axis-label-secondary tspan on a second line, rendered semibold.\n  .highcharts-xaxis-labels text tspan.hc-axis-label-secondary {\n    font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  }\n`;\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"],"mappings":"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","names":["css","css","BarChart"]}
+{"version":3,"sources":["../../../src/charts/bar/BarChart.tsx","../../../src/charts/bar/adapter.ts","../../../src/charts/bar/styles.ts","../../../src/charts/shared/styles.ts","../../../src/charts/constants.ts"],"sourcesContent":["import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport { BarStyledBox } from \"./styles\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n  // The shared hook caps the series to the limit (and warns once per render\n  // when the default is exceeded without an explicit override) so the adapter\n  // and renderer below all consume the capped data.\n  const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n  const { colors, series } = useSeedsChartSetup({\n    series: props.series,\n    seriesLimit,\n    isSeriesLimitOverridden: props.seriesLimit !== undefined,\n    hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n    componentName: \"BarChart\",\n  });\n\n  const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n    props,\n    props.direction ?? \"vertical\",\n    series\n  );\n  const hasOnClick = Boolean(props.onClick);\n\n  return (\n    <BarStyledBox\n      $colors={colors}\n      $hasOnClick={hasOnClick}\n      bg=\"container.background.base\"\n    >\n      <ChartRenderer\n        options={options}\n        series={series}\n        colors={colors}\n        tooltip={props.tooltip}\n        annotationLookup={annotationLookup}\n        hasOnClick={hasOnClick}\n        tooltipClickLabel={props.tooltipClickLabel}\n        timezone={tooltipTimezone}\n        invalidNumberLabel={props.invalidNumberLabel}\n        valueFormat={props.yAxis?.format}\n        onReady={props.onReady}\n      />\n    </BarStyledBox>\n  );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n  SeedsChartColumnPlotOptions,\n  SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n  buildDimensionalAxis,\n  resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n  defaultValueAxisLabelFormatter,\n  makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n  return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n  props: BarChartProps,\n  direction: BarChartDirection,\n  // The (already-capped) series to render. Defaults to `props.series` so the\n  // ~40 existing call sites keep working; the component passes the capped\n  // series from `useSeedsChartSetup` explicitly.\n  series: BarChartProps[\"series\"] = props.series\n): {\n  options: SeedsChartOptions;\n  annotationLookup: ChartAnnotationLookup | undefined;\n  /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n  tooltipTimezone: string | undefined;\n} {\n  const chartType = highchartsType(direction);\n  const isDatetime = props.xAxis.type === \"datetime\";\n  const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n  const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n    props.annotations\n  );\n  // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n  // single config is assigned under the active direction's key. Typed\n  // explicitly so the `point.events` handlers below keep their `this`/`event`\n  // contextual types (a computed `[chartType]` key would otherwise erase them).\n  const barTypeConfig: SeedsChartColumnPlotOptions = {\n    // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n    // columns side-by-side when no stacking is set.\n    ...(props.stacking === \"grouped\"\n      ? {}\n      : { stacking: props.stacking ?? \"normal\" }),\n    // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n    // so the same padding fractions that work for columns produce hairline bars.\n    pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n    groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n    // Fixed bar width on datetime axes. Sparse time-series otherwise size\n    // columns from the (large) gap between points and balloon; this mirrors\n    // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n    // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n    ...(isDatetime ? { pointWidth: 20 } : {}),\n    borderRadius: 4,\n    borderWidth: 0,\n    // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n    // is over the chart, all bars dim; these handlers restore opacity for\n    // every bar at the hovered x (so stacked/grouped bars highlight together\n    // rather than just the single hovered bar).\n    point: {\n      events: {\n        click: props.onClick\n          ? (event) => props.onClick!({ position: event.point.x })\n          : undefined,\n        mouseOver: function () {\n          const x = this.x;\n          this.series.chart.series.forEach((s) => {\n            if (s.type !== chartType) return;\n            s.data.forEach((point) => {\n              if (point.x !== x) return;\n              point.graphic?.element?.classList.add(\"bar-point-hover\");\n            });\n          });\n        },\n        mouseOut: function () {\n          this.series.chart.series.forEach((s) => {\n            if (s.type !== chartType) return;\n            s.data.forEach((point) => {\n              point.graphic?.element?.classList.remove(\"bar-point-hover\");\n            });\n          });\n        },\n      },\n    },\n  };\n  const options: SeedsChartOptions = {\n    ...buildBaseChartOptions({\n      type: chartType,\n      description: props.description,\n      valueSuffix: props.valueSuffix,\n      reserveTopMargin: Boolean(annotations),\n      timezone: tooltipTimezone,\n    }),\n    xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n    yAxis: {\n      min: props.yAxis?.min,\n      max: props.yAxis?.max,\n      gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n      title: { text: props.yAxis?.title ?? \"\" },\n      labels: {\n        // `showLabels` toggles tick-label visibility; defaults to shown.\n        enabled: props.yAxis?.showLabels !== false,\n        // A declarative `format` drives ticks through the shared valueFormatter;\n        // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n        formatter: props.yAxis?.format\n          ? makeValueAxisLabelFormatter(props.yAxis.format)\n          : defaultValueAxisLabelFormatter,\n      },\n    },\n    plotOptions: {\n      series: { animation: false },\n      [chartType]: barTypeConfig,\n    },\n    series: series.map((s) => ({\n      type: chartType,\n      name: s.name,\n      data: [...s.data],\n      color: s.color,\n    })),\n    ...(annotations ? { annotations } : {}),\n  };\n\n  return { options, annotationLookup, tooltipTimezone };\n}\n","import styled, { css } from \"styled-components\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { timeSeriesChartStyles } from \"../../styles/chartStyles\";\nimport { axisLabelV2Styles } from \"../shared/styles\";\nimport type {\n  TypeChartStyleColor,\n  TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n  $colors: ReadonlyArray<TypeChartStyleColor>;\n  $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Direction-neutral styling shared by the v2 bar family (vertical + horizontal).\n// Consumes only the v1 `timeSeriesChartStyles` base and owns the hover-dimming\n// block itself, keyed on the neutral `.bar-point-hover` class the adapter emits\n// — so v2 no longer imports v1 *component* styles (see `shared/styles.ts`).\nexport const barFamilyStyles = css<StyleProps>`\n  ${timeSeriesChartStyles}\n\n  /*\n    When the chart container is hovered, dim all bars. Then restore opacity for\n    the hovered bar(s) — flagged with the bar-point-hover class by the adapter —\n    so the non-hovered bars fade out.\n  */\n  .highcharts-container:hover .highcharts-point {\n    fill-opacity: 0.3;\n  }\n\n  .highcharts-point.bar-point-hover {\n    fill-opacity: 1 !important;\n  }\n`;\n\nexport const BarStyledBox = styled(Box)<StyleProps>`\n  ${barFamilyStyles}\n  ${axisLabelV2Styles}\n`;\n","import { css } from \"styled-components\";\n\n/**\n * v2 chart axis-label styles. v2 charts render in `styledMode` with\n * `useHTML: false`, so axis labels are SVG `<text>` / `<tspan>` rather than the\n * HTML `<span>`s v1 uses; these mirror the v1 HTML label rules in\n * `styles/chartStyles.ts` for the SVG element type.\n *\n * Kept here, separate from v1's `timeSeriesChartStyles`: v2 may *consume* the v1\n * styles, but v2-specific rules must not accrete into the v1 files — that keeps\n * the eventual v1 → v2 port clean and avoids coupling. Compose this into each v2\n * chart family's styled wrapper.\n */\nexport const axisLabelV2Styles = css`\n  .highcharts-xaxis-labels,\n  .highcharts-yaxis-labels {\n    // SVG labels (styledMode): fill is the SVG text colour; color has no effect.\n    text {\n      font-family: ${({ theme }) => theme.fontFamily};\n      ${({ theme }) => theme.typography[100]};\n      font-weight: ${({ theme }) => theme.fontWeights.normal};\n      fill: ${({ theme }) => theme.colors.text.subtext};\n    }\n  }\n  // Two-line stacked datetime label: the boundary token is an\n  // hc-axis-label-secondary tspan on a second line, rendered semibold.\n  .highcharts-xaxis-labels text tspan.hc-axis-label-secondary {\n    font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  }\n`;\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,SAAS,YAAY;;;ACqBrB,SAAS,eAAe,WAAgD;AACtE,SAAO,cAAc,eAAe,QAAQ;AAC9C;AAEO,SAAS,qBACd,OACA,WAIA,SAAkC,MAAM,QAMxC;AACA,QAAM,YAAY,eAAe,SAAS;AAC1C,QAAM,aAAa,MAAM,MAAM,SAAS;AACxC,QAAM,kBAAkB,uBAAuB,MAAM,OAAO,MAAM,QAAQ;AAC1E,QAAM,EAAE,aAAa,QAAQ,iBAAiB,IAAI;AAAA,IAChD,MAAM;AAAA,EACR;AAKA,QAAM,gBAA6C;AAAA;AAAA;AAAA,IAGjD,GAAI,MAAM,aAAa,YACnB,CAAC,IACD,EAAE,UAAU,MAAM,YAAY,SAAS;AAAA;AAAA;AAAA,IAG3C,cAAc,cAAc,eAAe,OAAO;AAAA,IAClD,cAAc,cAAc,eAAe,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjD,GAAI,aAAa,EAAE,YAAY,GAAG,IAAI,CAAC;AAAA,IACvC,cAAc;AAAA,IACd,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,IAKb,OAAO;AAAA,MACL,QAAQ;AAAA,QACN,OAAO,MAAM,UACT,CAAC,UAAU,MAAM,QAAS,EAAE,UAAU,MAAM,MAAM,EAAE,CAAC,IACrD;AAAA,QACJ,WAAW,WAAY;AACrB,gBAAM,IAAI,KAAK;AACf,eAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,MAAM;AACtC,gBAAI,EAAE,SAAS,UAAW;AAC1B,cAAE,KAAK,QAAQ,CAAC,UAAU;AACxB,kBAAI,MAAM,MAAM,EAAG;AACnB,oBAAM,SAAS,SAAS,UAAU,IAAI,iBAAiB;AAAA,YACzD,CAAC;AAAA,UACH,CAAC;AAAA,QACH;AAAA,QACA,UAAU,WAAY;AACpB,eAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,MAAM;AACtC,gBAAI,EAAE,SAAS,UAAW;AAC1B,cAAE,KAAK,QAAQ,CAAC,UAAU;AACxB,oBAAM,SAAS,SAAS,UAAU,OAAO,iBAAiB;AAAA,YAC5D,CAAC;AAAA,UACH,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,QAAM,UAA6B;AAAA,IACjC,GAAG,sBAAsB;AAAA,MACvB,MAAM;AAAA,MACN,aAAa,MAAM;AAAA,MACnB,aAAa,MAAM;AAAA,MACnB,kBAAkB,QAAQ,WAAW;AAAA,MACrC,UAAU;AAAA,IACZ,CAAC;AAAA,IACD,OAAO,qBAAqB,MAAM,OAAO,mBAAmB,KAAK;AAAA,IACjE,OAAO;AAAA,MACL,KAAK,MAAM,OAAO;AAAA,MAClB,KAAK,MAAM,OAAO;AAAA,MAClB,eAAe,MAAM,OAAO,kBAAkB,QAAQ,IAAI;AAAA,MAC1D,OAAO,EAAE,MAAM,MAAM,OAAO,SAAS,GAAG;AAAA,MACxC,QAAQ;AAAA;AAAA,QAEN,SAAS,MAAM,OAAO,eAAe;AAAA;AAAA;AAAA,QAGrC,WAAW,MAAM,OAAO,SACpB,4BAA4B,MAAM,MAAM,MAAM,IAC9C;AAAA,MACN;AAAA,IACF;AAAA,IACA,aAAa;AAAA,MACX,QAAQ,EAAE,WAAW,MAAM;AAAA,MAC3B,CAAC,SAAS,GAAG;AAAA,IACf;AAAA,IACA,QAAQ,OAAO,IAAI,CAAC,OAAO;AAAA,MACzB,MAAM;AAAA,MACN,MAAM,EAAE;AAAA,MACR,MAAM,CAAC,GAAG,EAAE,IAAI;AAAA,MAChB,OAAO,EAAE;AAAA,IACX,EAAE;AAAA,IACF,GAAI,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,EACvC;AAEA,SAAO,EAAE,SAAS,kBAAkB,gBAAgB;AACtD;;;ACrIA,OAAO,UAAU,OAAAA,YAAW;AAC5B,SAAS,WAAW;;;ACDpB,SAAS,WAAW;AAab,IAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA,qBAKZ,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU;AAAA,QAC5C,CAAC,EAAE,MAAM,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,qBACvB,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,MAAM;AAAA,cAC9C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,KAAK,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAMnC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;;;ADTrD,IAAM,kBAAkBC;AAAA,IAC3B,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBlB,IAAM,eAAe,OAAO,GAAG;AAAA,IAClC,eAAe;AAAA,IACf,iBAAiB;AAAA;;;AErCd,IAAM,iCAAiC;;;AJiCxC;AA1BC,IAAM,WAAW,KAAK,SAASC,UAAS,OAAsB;AAInE,QAAM,cAAc,MAAM,eAAe;AACzC,QAAM,EAAE,QAAQ,OAAO,IAAI,mBAAmB;AAAA,IAC5C,QAAQ,MAAM;AAAA,IACd;AAAA,IACA,yBAAyB,MAAM,gBAAgB;AAAA,IAC/C,wBAAwB,MAAM;AAAA,IAC9B,eAAe;AAAA,EACjB,CAAC;AAED,QAAM,EAAE,SAAS,kBAAkB,gBAAgB,IAAI;AAAA,IACrD;AAAA,IACA,MAAM,aAAa;AAAA,IACnB;AAAA,EACF;AACA,QAAM,aAAa,QAAQ,MAAM,OAAO;AAExC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,aAAa;AAAA,MACb,IAAG;AAAA,MAEH;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS,MAAM;AAAA,UACf;AAAA,UACA;AAAA,UACA,mBAAmB,MAAM;AAAA,UACzB,UAAU;AAAA,UACV,oBAAoB,MAAM;AAAA,UAC1B,aAAa,MAAM,OAAO;AAAA,UAC1B,SAAS,MAAM;AAAA;AAAA,MACjB;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["css","css","BarChart"]}

package/dist/esm/chunk-AUJ3EWRH.js

@@ -0,0 +1,68 @@
+import {
+  valueFormatter
+} from "./chunk-LPQXJJNT.js";
+
+// src/charts/shared/annotations.ts
+function buildAnnotationConfig(annotations) {
+  if (!annotations?.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/valueAxisLabelFormatter.ts
+import { formatNumeral } from "@sproutsocial/seeds-react-numeral";
+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 formatNumeral({ locale: FIXED_LOCALE, number: 0 });
+  }
+  const abbreviate = deriveAbbreviateFromTicks(this);
+  return formatNumeral({
+    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 });
+  };
+}
+
+export {
+  buildAnnotationConfig,
+  defaultValueAxisLabelFormatter,
+  makeValueAxisLabelFormatter
+};
+//# sourceMappingURL=chunk-AUJ3EWRH.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/charts/shared/annotations.ts","../../src/charts/shared/valueAxisLabelFormatter.ts"],"sourcesContent":["// Shared annotation plumbing across v2 chart families. Currently consumed by\n// BarChart; v2 Line/Area will share the same `annotations` shape and reuse\n// `buildAnnotationConfig` directly. Annotation data is purely numeric —\n// the module has no knowledge of `categories`; resolving a numeric position to\n// a display name is the tooltip's job (see chartBase `renderContent`).\n\nimport type { TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport type { SeedsChartAnnotationsOptions } from \"./chartBase\";\n\n/**\n * Annotations keyed by the numeric Highcharts index. Both consumers resolve\n * numerically: the marker portal reads `label.point.x` and the tooltip reads\n * `context.point.x` (numeric on both category and datetime axes).\n */\nexport type ChartAnnotationLookup = Map<number, ChartAnnotation>;\n\n/**\n * Declarative annotation shape — the DS renders the marker and tooltip header\n * internally; consumers don't supply render functions. See CE-7.\n */\nexport interface ChartAnnotation {\n  /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */\n  position: number;\n  /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */\n  icon?: TypeIconName;\n  /** Color applied to the marker's vertical line. */\n  color?: string;\n  /** Tooltip header line 1. */\n  title?: string;\n  /** Tooltip header line 2. */\n  description?: string;\n}\n\n/**\n * Build the Highcharts `annotations` config and a parallel lookup keyed by the\n * numeric `position`. Both consumers (chart adapter for Highcharts, ChartRenderer\n * for the portal + tooltip) read from the same numeric lookup to stay aligned.\n */\nexport function buildAnnotationConfig(\n  annotations: ChartAnnotation[] | undefined\n): {\n  annotations: SeedsChartAnnotationsOptions[] | undefined;\n  lookup: ChartAnnotationLookup | undefined;\n} {\n  if (!annotations?.length) {\n    return { annotations: undefined, lookup: undefined };\n  }\n  const labels: {\n    point: { x: number; y: number; xAxis: 0; yAxis: 0 };\n    text: string;\n  }[] = [];\n  const lookup: ChartAnnotationLookup = new Map();\n  for (const annotation of annotations) {\n    const { position } = annotation;\n    labels.push({\n      // Highcharts anchor — always uses `x` regardless of chart orientation.\n      point: { x: position, y: 0, xAxis: 0, yAxis: 0 },\n      // Space (not empty) — Highcharts reverts to its built-in label text on empty string.\n      text: \" \",\n    });\n    // Keyed by the numeric position only. The marker portal reads\n    // `label.point.x` and the tooltip reads `context.point.x` — both numeric on\n    // every axis type, so no category-name keying is needed.\n    lookup.set(position, annotation);\n  }\n  if (labels.length === 0) {\n    return { annotations: undefined, lookup: undefined };\n  }\n  return {\n    // `useHTML: true` makes Highcharts attach an HTML `graphic.div` to each\n    // label, which the marker portal needs as its render target. `padding: 0`\n    // removes Highcharts' default left padding so markers stay centered.\n    annotations: [{ labels, labelOptions: { useHTML: true, padding: 0 } }],\n    lookup,\n  };\n}\n","import { formatNumeral } from \"@sproutsocial/seeds-react-numeral\";\n\nimport type { SeedsAxisLabelFormatterContext } from \"./chartBase\";\nimport { valueFormatter, type ValueFormat } from \"./formatters/valueFormatter\";\n\n/**\n * Fixed internal locale for the default value-axis formatter. Pins the en-US\n * compact symbols (2K / 1.2M / 1.2B) so output is deterministic regardless of\n * the environment's locale resolution.\n * TODO: consumer-facing locale and an override surface may be added later.\n */\nconst FIXED_LOCALE = \"en-US\";\n\n/**\n * Derive formatNumeral's `abbreviate` threshold from the axis tick scan.\n *\n * formatNumeral abbreviates above 10,000 by default; passing a numeric\n * `abbreviate` lowers that threshold to that value. When the top tick exceeds\n * 9,999 we lower it to 1,000 so the whole axis reads \"2K 4K 6K 8K 10K\" rather\n * than a mixed \"2,000 4,000 6,000 8,000 10K\". Otherwise `true` keeps the default\n * 10,000 threshold. Centralizes the 9,999 rule for both formatters below.\n */\nfunction deriveAbbreviateFromTicks(\n  context: SeedsAxisLabelFormatterContext\n): boolean | number {\n  const tickPositions = context.axis.tickPositions;\n  const maxValue =\n    tickPositions && tickPositions.length > 0\n      ? tickPositions[tickPositions.length - 1]\n      : undefined;\n  return typeof maxValue === \"number\" && maxValue > 9999 ? 1000 : true;\n}\n\n/**\n * Internal, zero-config default value-axis label formatter for v2 chart\n * families. Abbreviates value-axis ticks (1.20K / 1.20M / 1.20B); decimal mode\n * only. Zero renders \"0\". Decimal compact precision is fixed at two fraction\n * digits, so abbreviated ticks always carry two decimals.\n *\n * Wired as a Highcharts `yAxis.labels.formatter`, invoked `this`-bound with the\n * Seeds-local context.\n */\nexport function defaultValueAxisLabelFormatter(\n  this: SeedsAxisLabelFormatterContext\n): string {\n  const numberValue = Number(this.value);\n\n  if (numberValue === 0) {\n    return formatNumeral({ locale: FIXED_LOCALE, number: 0 });\n  }\n\n  const abbreviate = deriveAbbreviateFromTicks(this);\n\n  return formatNumeral({\n    abbreviate,\n    format: \"decimal\",\n    locale: FIXED_LOCALE,\n    number: numberValue,\n  });\n}\n\n/**\n * Build a `format`-driven value-axis label formatter that runs a declarative\n * {@link ValueFormat} through the shared {@link valueFormatter}. Reuses the same\n * `tickPositions` scan as {@link defaultValueAxisLabelFormatter} so the\n * axis-wide \"smart 1k/10k\" abbreviation is preserved for decimal/currency ticks.\n *\n * Wired as a Highcharts `yAxis.labels.formatter`; invoked `this`-bound with the\n * Seeds-local context. The returned formatter never carries chart-engine types,\n * keeping the engine boundary intact.\n */\nexport function makeValueAxisLabelFormatter(format: ValueFormat) {\n  return function (this: SeedsAxisLabelFormatterContext): string {\n    const numberValue = Number(this.value);\n\n    // Honor an explicit `abbreviate: false` opt-out; otherwise derive the\n    // threshold from the same tick scan as the default formatter (abbreviation\n    // only affects decimal/currency — percent and duration ignore it inside\n    // valueFormatter).\n    const abbreviate =\n      format.abbreviate === false ? false : deriveAbbreviateFromTicks(this);\n\n    return valueFormatter({ ...format, value: numberValue, abbreviate });\n  };\n}\n"],"mappings":";;;;;AAsCO,SAAS,sBACd,aAIA;AACA,MAAI,CAAC,aAAa,QAAQ;AACxB,WAAO,EAAE,aAAa,QAAW,QAAQ,OAAU;AAAA,EACrD;AACA,QAAM,SAGA,CAAC;AACP,QAAM,SAAgC,oBAAI,IAAI;AAC9C,aAAW,cAAc,aAAa;AACpC,UAAM,EAAE,SAAS,IAAI;AACrB,WAAO,KAAK;AAAA;AAAA,MAEV,OAAO,EAAE,GAAG,UAAU,GAAG,GAAG,OAAO,GAAG,OAAO,EAAE;AAAA;AAAA,MAE/C,MAAM;AAAA,IACR,CAAC;AAID,WAAO,IAAI,UAAU,UAAU;AAAA,EACjC;AACA,MAAI,OAAO,WAAW,GAAG;AACvB,WAAO,EAAE,aAAa,QAAW,QAAQ,OAAU;AAAA,EACrD;AACA,SAAO;AAAA;AAAA;AAAA;AAAA,IAIL,aAAa,CAAC,EAAE,QAAQ,cAAc,EAAE,SAAS,MAAM,SAAS,EAAE,EAAE,CAAC;AAAA,IACrE;AAAA,EACF;AACF;;;AC3EA,SAAS,qBAAqB;AAW9B,IAAM,eAAe;AAWrB,SAAS,0BACP,SACkB;AAClB,QAAM,gBAAgB,QAAQ,KAAK;AACnC,QAAM,WACJ,iBAAiB,cAAc,SAAS,IACpC,cAAc,cAAc,SAAS,CAAC,IACtC;AACN,SAAO,OAAO,aAAa,YAAY,WAAW,OAAO,MAAO;AAClE;AAWO,SAAS,iCAEN;AACR,QAAM,cAAc,OAAO,KAAK,KAAK;AAErC,MAAI,gBAAgB,GAAG;AACrB,WAAO,cAAc,EAAE,QAAQ,cAAc,QAAQ,EAAE,CAAC;AAAA,EAC1D;AAEA,QAAM,aAAa,0BAA0B,IAAI;AAEjD,SAAO,cAAc;AAAA,IACnB;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV,CAAC;AACH;AAYO,SAAS,4BAA4B,QAAqB;AAC/D,SAAO,WAAwD;AAC7D,UAAM,cAAc,OAAO,KAAK,KAAK;AAMrC,UAAM,aACJ,OAAO,eAAe,QAAQ,QAAQ,0BAA0B,IAAI;AAEtE,WAAO,eAAe,EAAE,GAAG,QAAQ,OAAO,aAAa,WAAW,CAAC;AAAA,EACrE;AACF;","names":[]}