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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/bar/index.d.mts +9 -0
  2. package/dist/bar/index.d.ts +9 -0
  3. package/dist/bar/index.js +31 -77
  4. package/dist/bar/index.js.map +1 -1
  5. package/dist/bar.css +39 -0
  6. package/dist/chart-styles.css +295 -0
  7. package/dist/{chunk-QKH2ZO2D.js → chunk-4IOYAUAK.js} +3 -3
  8. package/dist/{chunk-QKH2ZO2D.js.map → chunk-4IOYAUAK.js.map} +1 -1
  9. package/dist/chunk-6EIJCJCN.js +22 -0
  10. package/dist/chunk-6EIJCJCN.js.map +1 -0
  11. package/dist/{chunk-HDEKK4W4.js → chunk-DLO4WZLT.js} +35 -17
  12. package/dist/chunk-DLO4WZLT.js.map +1 -0
  13. package/dist/donut/index.d.mts +15 -0
  14. package/dist/donut/index.d.ts +15 -0
  15. package/dist/donut/index.js +29 -44
  16. package/dist/donut/index.js.map +1 -1
  17. package/dist/donut.css +45 -0
  18. package/dist/esm/bar/index.js +27 -73
  19. package/dist/esm/bar/index.js.map +1 -1
  20. package/dist/esm/{chunk-O5VJGGZY.js → chunk-J5QE7VCW.js} +2 -2
  21. package/dist/esm/chunk-P3MVYSHX.js +22 -0
  22. package/dist/esm/chunk-P3MVYSHX.js.map +1 -0
  23. package/dist/esm/{chunk-TKNWM7L3.js → chunk-U6ZOSXK7.js} +29 -11
  24. package/dist/esm/chunk-U6ZOSXK7.js.map +1 -0
  25. package/dist/esm/donut/index.js +28 -43
  26. package/dist/esm/donut/index.js.map +1 -1
  27. package/dist/esm/line-area/index.js +23 -19
  28. package/dist/esm/line-area/index.js.map +1 -1
  29. package/dist/esm/sparkline/index.js +2 -1
  30. package/dist/esm/sparkline/index.js.map +1 -1
  31. package/dist/line-area/index.d.mts +22 -0
  32. package/dist/line-area/index.d.ts +22 -0
  33. package/dist/line-area/index.js +28 -24
  34. package/dist/line-area/index.js.map +1 -1
  35. package/dist/line-area.css +112 -0
  36. package/dist/sparkline/index.d.mts +7 -0
  37. package/dist/sparkline/index.d.ts +7 -0
  38. package/dist/sparkline/index.js +4 -3
  39. package/dist/sparkline/index.js.map +1 -1
  40. package/package.json +11 -7
  41. package/dist/chunk-HDEKK4W4.js.map +0 -1
  42. package/dist/esm/chunk-TKNWM7L3.js.map +0 -1
  43. /package/dist/esm/{chunk-O5VJGGZY.js.map → chunk-J5QE7VCW.js.map} +0 -0
@@ -0,0 +1,112 @@
1
+ /**
2
+ * Seeds LineAreaChart per-family styles.
3
+ *
4
+ * Consumers import this alongside the shared foundation stylesheet:
5
+ *
6
+ * import "@sproutsocial/seeds-react-data-viz/chart-styles.css";
7
+ * import "@sproutsocial/seeds-react-data-viz/line-area.css";
8
+ *
9
+ * chart-styles.css owns the shared .seeds-chart layer (background,
10
+ * annotation-label rules, the per-series .highcharts-color-0..19 palette
11
+ * fallback, the [data-has-on-click] cursor rules, the global tooltip overrides,
12
+ * and the .seeds-chart-legend spacing) AND the shared cross-family
13
+ * .seeds-chart-time-series layer (crosshair, grid/axis lines, ticks, zero line,
14
+ * hover opacity guard, and the v2 SVG axis-label typography) that bar also uses.
15
+ * This file owns ONLY the line/area-specific .seeds-chart-line and
16
+ * .seeds-chart-area blocks — it deliberately does not repeat anything
17
+ * chart-styles.css already ships.
18
+ *
19
+ * Static theme values reference the DS token CSS variables directly
20
+ * (var(--color-*)) — the same tokens every other Seeds component CSS uses,
21
+ * emitted by seeds-react-theme and provided at runtime by the theme provider —
22
+ * so light/dark follows automatically. Ported from the v1 styled-components
23
+ * lineChartStyles / areaChartStyles in src/styles/chartStyles.ts (which stays,
24
+ * still serving v1).
25
+ */
26
+
27
+ /* =========================================================================
28
+ * lineChartStyles -> .seeds-chart-line
29
+ * ========================================================================= */
30
+
31
+ .seeds-chart-line .highcharts-graph {
32
+ stroke-width: 3;
33
+ }
34
+
35
+ /* Dashed series. v1 set stroke-dasharray per index when patterns[i] === "dashed";
36
+ the container now emits data-dashed-series="<space-separated indices>", so a
37
+ [data-dashed-series~="N"] match dashes .highcharts-series-N. Highcharts accounts
38
+ for 10 series; enumerate 0..19 to match the 20-entry DATAVIZ palette. */
39
+ .seeds-chart-line[data-dashed-series~="0"] .highcharts-series-0 {
40
+ stroke-dasharray: 2 8;
41
+ }
42
+ .seeds-chart-line[data-dashed-series~="1"] .highcharts-series-1 {
43
+ stroke-dasharray: 2 8;
44
+ }
45
+ .seeds-chart-line[data-dashed-series~="2"] .highcharts-series-2 {
46
+ stroke-dasharray: 2 8;
47
+ }
48
+ .seeds-chart-line[data-dashed-series~="3"] .highcharts-series-3 {
49
+ stroke-dasharray: 2 8;
50
+ }
51
+ .seeds-chart-line[data-dashed-series~="4"] .highcharts-series-4 {
52
+ stroke-dasharray: 2 8;
53
+ }
54
+ .seeds-chart-line[data-dashed-series~="5"] .highcharts-series-5 {
55
+ stroke-dasharray: 2 8;
56
+ }
57
+ .seeds-chart-line[data-dashed-series~="6"] .highcharts-series-6 {
58
+ stroke-dasharray: 2 8;
59
+ }
60
+ .seeds-chart-line[data-dashed-series~="7"] .highcharts-series-7 {
61
+ stroke-dasharray: 2 8;
62
+ }
63
+ .seeds-chart-line[data-dashed-series~="8"] .highcharts-series-8 {
64
+ stroke-dasharray: 2 8;
65
+ }
66
+ .seeds-chart-line[data-dashed-series~="9"] .highcharts-series-9 {
67
+ stroke-dasharray: 2 8;
68
+ }
69
+ .seeds-chart-line[data-dashed-series~="10"] .highcharts-series-10 {
70
+ stroke-dasharray: 2 8;
71
+ }
72
+ .seeds-chart-line[data-dashed-series~="11"] .highcharts-series-11 {
73
+ stroke-dasharray: 2 8;
74
+ }
75
+ .seeds-chart-line[data-dashed-series~="12"] .highcharts-series-12 {
76
+ stroke-dasharray: 2 8;
77
+ }
78
+ .seeds-chart-line[data-dashed-series~="13"] .highcharts-series-13 {
79
+ stroke-dasharray: 2 8;
80
+ }
81
+ .seeds-chart-line[data-dashed-series~="14"] .highcharts-series-14 {
82
+ stroke-dasharray: 2 8;
83
+ }
84
+ .seeds-chart-line[data-dashed-series~="15"] .highcharts-series-15 {
85
+ stroke-dasharray: 2 8;
86
+ }
87
+ .seeds-chart-line[data-dashed-series~="16"] .highcharts-series-16 {
88
+ stroke-dasharray: 2 8;
89
+ }
90
+ .seeds-chart-line[data-dashed-series~="17"] .highcharts-series-17 {
91
+ stroke-dasharray: 2 8;
92
+ }
93
+ .seeds-chart-line[data-dashed-series~="18"] .highcharts-series-18 {
94
+ stroke-dasharray: 2 8;
95
+ }
96
+ .seeds-chart-line[data-dashed-series~="19"] .highcharts-series-19 {
97
+ stroke-dasharray: 2 8;
98
+ }
99
+
100
+ /* =========================================================================
101
+ * areaChartStyles -> .seeds-chart-area
102
+ * ========================================================================= */
103
+
104
+ /* no stroke for the line part of each area */
105
+ .seeds-chart-area .highcharts-graph {
106
+ stroke-width: 0;
107
+ }
108
+
109
+ /* fill areas to full opacity */
110
+ .seeds-chart-area .highcharts-area {
111
+ fill-opacity: 1;
112
+ }
@@ -53,6 +53,13 @@ interface SparklineChartProps {
53
53
  tooltip?: (args: ChartTooltipProps) => ReactNode;
54
54
  /** Override for the value shown when a data point is null. Defaults to an em-dash. */
55
55
  invalidNumberLabel?: ReactNode;
56
+ /**
57
+ * Chart title included in the exported image (PNG/SVG/PDF) only — it does
58
+ * *not* render on screen. The on-screen title is a React sibling outside the
59
+ * chart SVG and can't be captured on export, so `exportTitle` is baked into
60
+ * the export clone as a themed native Highcharts title. Omit for no title.
61
+ */
62
+ exportTitle?: string;
56
63
  /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV downloads. Re-fires only on remount. */
57
64
  onReady?: (handle: ChartExportHandle) => void;
58
65
  }
@@ -53,6 +53,13 @@ interface SparklineChartProps {
53
53
  tooltip?: (args: ChartTooltipProps) => ReactNode;
54
54
  /** Override for the value shown when a data point is null. Defaults to an em-dash. */
55
55
  invalidNumberLabel?: ReactNode;
56
+ /**
57
+ * Chart title included in the exported image (PNG/SVG/PDF) only — it does
58
+ * *not* render on screen. The on-screen title is a React sibling outside the
59
+ * chart SVG and can't be captured on export, so `exportTitle` is baked into
60
+ * the export clone as a themed native Highcharts title. Omit for no title.
61
+ */
62
+ exportTitle?: string;
56
63
  /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV downloads. Re-fires only on remount. */
57
64
  onReady?: (handle: ChartExportHandle) => void;
58
65
  }
@@ -5,7 +5,7 @@ var _chunk6D7P3IOTjs = require('../chunk-6D7P3IOT.js');
5
5
 
6
6
 
7
7
 
8
- var _chunkHDEKK4W4js = require('../chunk-HDEKK4W4.js');
8
+ var _chunkDLO4WZLTjs = require('../chunk-DLO4WZLT.js');
9
9
  require('../chunk-WEKDYQ4T.js');
10
10
 
11
11
  // src/charts/sparkline/SparklineChart.tsx
@@ -24,7 +24,7 @@ function buildSparklineChartOptions(props) {
24
24
  ..._chunk6D7P3IOTjs.buildDimensionalAxis.call(void 0, props.xAxis, _nullishCoalesce(tooltipTimezone, () => ( "UTC"))),
25
25
  visible: false
26
26
  } : { type: "linear", visible: false };
27
- const base = _chunkHDEKK4W4js.buildBaseChartOptions.call(void 0, {
27
+ const base = _chunkDLO4WZLTjs.buildBaseChartOptions.call(void 0, {
28
28
  type,
29
29
  description: props.description,
30
30
  valueSuffix: props.valueSuffix,
@@ -102,7 +102,7 @@ var SparklineChart = _react.memo.call(void 0, function SparklineChart2(props) {
102
102
  className,
103
103
  style: { "--seeds-sparkline-color": trendColor },
104
104
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
105
- _chunkHDEKK4W4js.ChartRenderer,
105
+ _chunkDLO4WZLTjs.ChartRenderer,
106
106
  {
107
107
  options,
108
108
  series: [{ name: SPARKLINE_SERIES_NAME, color: trendColor }],
@@ -111,6 +111,7 @@ var SparklineChart = _react.memo.call(void 0, function SparklineChart2(props) {
111
111
  timezone: tooltipTimezone,
112
112
  invalidNumberLabel: props.invalidNumberLabel,
113
113
  hideLegend: true,
114
+ exportTitle: props.exportTitle,
114
115
  onReady: props.onReady
115
116
  }
116
117
  )
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/sparkline/index.js","../../src/charts/sparkline/SparklineChart.tsx","../../src/charts/sparkline/adapter.ts","../../src/charts/shared/trend.ts"],"names":["SparklineChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/sparkline/index.js","sourcesContent":[null,"import { memo, type CSSProperties } from \"react\";\nimport { useTheme } from \"styled-components\";\nimport type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport { ChartRenderer } from \"../shared/chartBase\";\nimport { buildSparklineChartOptions, SPARKLINE_SERIES_NAME } from \"./adapter\";\nimport { computeTrend, resolveTrendColor } from \"./trend\";\nimport type { SparklineChartProps } from \"./types\";\n\n/**\n * SparklineChart — a compact, axis-less inline micro-chart in a `\"line\"` or\n * `\"bar\"` variant. The whole sparkline is colored by trend (auto-computed from\n * the data): green when rising, red when falling, neutral-gray when flat.\n *\n * Unlike the other v2 chart families this one carries no `styled-components`:\n * the wrapper is a plain `<div>` that accepts `className` (Tailwind sizing), and\n * the Highcharts styling lives in `sparkline.css`. Consumers must import\n * `@sproutsocial/seeds-react-data-viz/sparkline.css` once. The single trend\n * color is resolved from the JS theme and passed down as the\n * `--seeds-sparkline-color` CSS variable, so light/dark works without depending\n * on the theme's CSS-variable stylesheet.\n */\nexport const SparklineChart = memo(function SparklineChart(\n props: SparklineChartProps\n) {\n // The active theme resolves the single trend color. We read it directly rather\n // than via useSeedsChartSetup — the sparkline has no categorical palette or\n // series-limit concerns, so the hook's series machinery (and its dummy series\n // input) would be dead weight. ChartRenderer below is itself a styled-\n // component, so this adds no new dependency; the \"no styled-components\" trait\n // of this family is about the wrapper being a plain <div> + static CSS.\n const theme = useTheme() as TypeTheme;\n\n const trend = computeTrend(props.data);\n const trendColor = resolveTrendColor(theme, trend);\n\n const { options, tooltipTimezone } = buildSparklineChartOptions(props);\n\n const className = [\n \"seeds-sparkline\",\n `seeds-sparkline-${props.variant}`,\n props.className,\n ]\n .filter(Boolean)\n .join(\" \");\n\n return (\n <div\n className={className}\n style={{ \"--seeds-sparkline-color\": trendColor } as CSSProperties}\n >\n <ChartRenderer\n options={options}\n series={[{ name: SPARKLINE_SERIES_NAME, color: trendColor }]}\n colors={[trendColor]}\n tooltip={props.tooltip}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n hideLegend\n onReady={props.onReady}\n />\n </div>\n );\n});\n","import type { SeedsChartOptions, SeedsChartType } from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport type { SparklineChartProps, SparklineVariant } from \"./types\";\n\n// A sparkline line is a `line`; a sparkline bar is a `column` (vertical bars).\nfunction highchartsType(variant: SparklineVariant): SeedsChartType {\n return variant === \"bar\" ? \"column\" : \"line\";\n}\n\nconst SPARKLINE_SERIES_NAME = \"sparkline\";\n\nexport function buildSparklineChartOptions(props: SparklineChartProps): {\n options: SeedsChartOptions;\n /** Resolved timezone for the tooltip date formatter; undefined without a datetime axis. */\n tooltipTimezone: string | undefined;\n} {\n const type = highchartsType(props.variant);\n const tooltipTimezone = props.xAxis\n ? resolveTooltipTimezone(props.xAxis, props.timezone)\n : undefined;\n\n // A configured axis is placed but hidden (labels/line/ticks off). Without one\n // we fall back to a hidden linear index axis.\n const xAxis = props.xAxis\n ? {\n ...buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n visible: false,\n }\n : { type: \"linear\" as const, visible: false };\n\n const base = buildBaseChartOptions({\n type,\n description: props.description,\n valueSuffix: props.valueSuffix,\n timezone: tooltipTimezone,\n });\n\n const options: SeedsChartOptions = {\n ...base,\n // Zero the outer spacing so the plot fills the (consumer-sized) wrapper.\n chart: { type, styledMode: true, animation: false, spacing: [0, 0, 0, 0] },\n xAxis,\n yAxis: { visible: false },\n plotOptions: {\n series: {\n animation: false,\n // Decorative micro-chart: no per-point markers on the line.\n marker: { enabled: false },\n },\n // Tight padding so bars read as a compact cluster.\n column: {\n pointPadding: 0.05,\n groupPadding: 0.05,\n borderWidth: 0,\n borderRadius: 3,\n },\n },\n series: [\n {\n type,\n name: SPARKLINE_SERIES_NAME,\n data: [...props.data],\n },\n ],\n };\n\n return { options, tooltipTimezone };\n}\n\nexport { SPARKLINE_SERIES_NAME };\n","import type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport type { ChartDataPoint } from \"./axis\";\n\n// Family-agnostic trend helpers, shared across chart families. First used by the\n// sparkline (colored entirely by its trend direction); reusable by any chart\n// that wants a sentiment/directional color from a single series (e.g. a\n// sentiment chart).\n\n/**\n * Trend direction derived from a series (first vs. last finite value): rising →\n * `\"positive\"`, falling → `\"negative\"`, flat → `\"neutral\"`.\n */\nexport type Trend = \"positive\" | \"negative\" | \"neutral\";\n\n/** Extract the numeric y-value from a bare number, tuple, or `{ x, y }` point. */\nfunction yValue(point: ChartDataPoint): number | null {\n if (point == null) return null;\n if (typeof point === \"number\") return point;\n if (Array.isArray(point)) return point[1];\n return point.y;\n}\n\n/**\n * Derive the trend from the series by comparing the first finite value to the\n * last finite value: rising → `\"positive\"`, falling → `\"negative\"`, equal (or\n * fewer than two finite values) → `\"neutral\"`.\n */\nexport function computeTrend(data: ReadonlyArray<ChartDataPoint>): Trend {\n const finite = data\n .map(yValue)\n .filter((v): v is number => v != null && Number.isFinite(v));\n\n if (finite.length < 2) return \"neutral\";\n\n const first = finite[0]!;\n const last = finite[finite.length - 1]!;\n\n if (last > first) return \"positive\";\n if (last < first) return \"negative\";\n return \"neutral\";\n}\n\n/**\n * Resolve the trend to a Seeds decorative highlight/accent color: positive →\n * vibrant green (green-500), negative → vibrant red (red-600), neutral → middle\n * gray (neutral-600). These highlight tones are theme-stable — the same value in\n * light and dark — and are designed to read as accents on either surface.\n */\nexport function resolveTrendColor(theme: TypeTheme, trend: Trend): string {\n const decorative = theme.colors.container.border.decorative;\n if (trend === \"positive\") return decorative.green;\n if (trend === \"negative\") return decorative.red;\n return decorative.neutral;\n}\n"]}
1
+ {"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/sparkline/index.js","../../src/charts/sparkline/SparklineChart.tsx","../../src/charts/sparkline/adapter.ts","../../src/charts/shared/trend.ts"],"names":["SparklineChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/sparkline/index.js","sourcesContent":[null,"import { memo, type CSSProperties } from \"react\";\nimport { useTheme } from \"styled-components\";\nimport type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport { ChartRenderer } from \"../shared/chartBase\";\nimport { buildSparklineChartOptions, SPARKLINE_SERIES_NAME } from \"./adapter\";\nimport { computeTrend, resolveTrendColor } from \"./trend\";\nimport type { SparklineChartProps } from \"./types\";\n\n/**\n * SparklineChart — a compact, axis-less inline micro-chart in a `\"line\"` or\n * `\"bar\"` variant. The whole sparkline is colored by trend (auto-computed from\n * the data): green when rising, red when falling, neutral-gray when flat.\n *\n * Unlike the other v2 chart families this one carries no `styled-components`:\n * the wrapper is a plain `<div>` that accepts `className` (Tailwind sizing), and\n * the Highcharts styling lives in `sparkline.css`. Consumers must import\n * `@sproutsocial/seeds-react-data-viz/sparkline.css` once. The single trend\n * color is resolved from the JS theme and passed down as the\n * `--seeds-sparkline-color` CSS variable, so light/dark works without depending\n * on the theme's CSS-variable stylesheet.\n */\nexport const SparklineChart = memo(function SparklineChart(\n props: SparklineChartProps\n) {\n // The active theme resolves the single trend color. We read it directly rather\n // than via useSeedsChartSetup — the sparkline has no categorical palette or\n // series-limit concerns, so the hook's series machinery (and its dummy series\n // input) would be dead weight. ChartRenderer below is itself a styled-\n // component, so this adds no new dependency; the \"no styled-components\" trait\n // of this family is about the wrapper being a plain <div> + static CSS.\n const theme = useTheme() as TypeTheme;\n\n const trend = computeTrend(props.data);\n const trendColor = resolveTrendColor(theme, trend);\n\n const { options, tooltipTimezone } = buildSparklineChartOptions(props);\n\n const className = [\n \"seeds-sparkline\",\n `seeds-sparkline-${props.variant}`,\n props.className,\n ]\n .filter(Boolean)\n .join(\" \");\n\n return (\n <div\n className={className}\n style={{ \"--seeds-sparkline-color\": trendColor } as CSSProperties}\n >\n <ChartRenderer\n options={options}\n series={[{ name: SPARKLINE_SERIES_NAME, color: trendColor }]}\n colors={[trendColor]}\n tooltip={props.tooltip}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n hideLegend\n exportTitle={props.exportTitle}\n onReady={props.onReady}\n />\n </div>\n );\n});\n","import type { SeedsChartOptions, SeedsChartType } from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport type { SparklineChartProps, SparklineVariant } from \"./types\";\n\n// A sparkline line is a `line`; a sparkline bar is a `column` (vertical bars).\nfunction highchartsType(variant: SparklineVariant): SeedsChartType {\n return variant === \"bar\" ? \"column\" : \"line\";\n}\n\nconst SPARKLINE_SERIES_NAME = \"sparkline\";\n\nexport function buildSparklineChartOptions(props: SparklineChartProps): {\n options: SeedsChartOptions;\n /** Resolved timezone for the tooltip date formatter; undefined without a datetime axis. */\n tooltipTimezone: string | undefined;\n} {\n const type = highchartsType(props.variant);\n const tooltipTimezone = props.xAxis\n ? resolveTooltipTimezone(props.xAxis, props.timezone)\n : undefined;\n\n // A configured axis is placed but hidden (labels/line/ticks off). Without one\n // we fall back to a hidden linear index axis.\n const xAxis = props.xAxis\n ? {\n ...buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n visible: false,\n }\n : { type: \"linear\" as const, visible: false };\n\n const base = buildBaseChartOptions({\n type,\n description: props.description,\n valueSuffix: props.valueSuffix,\n timezone: tooltipTimezone,\n });\n\n const options: SeedsChartOptions = {\n ...base,\n // Zero the outer spacing so the plot fills the (consumer-sized) wrapper.\n chart: { type, styledMode: true, animation: false, spacing: [0, 0, 0, 0] },\n xAxis,\n yAxis: { visible: false },\n plotOptions: {\n series: {\n animation: false,\n // Decorative micro-chart: no per-point markers on the line.\n marker: { enabled: false },\n },\n // Tight padding so bars read as a compact cluster.\n column: {\n pointPadding: 0.05,\n groupPadding: 0.05,\n borderWidth: 0,\n borderRadius: 3,\n },\n },\n series: [\n {\n type,\n name: SPARKLINE_SERIES_NAME,\n data: [...props.data],\n },\n ],\n };\n\n return { options, tooltipTimezone };\n}\n\nexport { SPARKLINE_SERIES_NAME };\n","import type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport type { ChartDataPoint } from \"./axis\";\n\n// Family-agnostic trend helpers, shared across chart families. First used by the\n// sparkline (colored entirely by its trend direction); reusable by any chart\n// that wants a sentiment/directional color from a single series (e.g. a\n// sentiment chart).\n\n/**\n * Trend direction derived from a series (first vs. last finite value): rising →\n * `\"positive\"`, falling → `\"negative\"`, flat → `\"neutral\"`.\n */\nexport type Trend = \"positive\" | \"negative\" | \"neutral\";\n\n/** Extract the numeric y-value from a bare number, tuple, or `{ x, y }` point. */\nfunction yValue(point: ChartDataPoint): number | null {\n if (point == null) return null;\n if (typeof point === \"number\") return point;\n if (Array.isArray(point)) return point[1];\n return point.y;\n}\n\n/**\n * Derive the trend from the series by comparing the first finite value to the\n * last finite value: rising → `\"positive\"`, falling → `\"negative\"`, equal (or\n * fewer than two finite values) → `\"neutral\"`.\n */\nexport function computeTrend(data: ReadonlyArray<ChartDataPoint>): Trend {\n const finite = data\n .map(yValue)\n .filter((v): v is number => v != null && Number.isFinite(v));\n\n if (finite.length < 2) return \"neutral\";\n\n const first = finite[0]!;\n const last = finite[finite.length - 1]!;\n\n if (last > first) return \"positive\";\n if (last < first) return \"negative\";\n return \"neutral\";\n}\n\n/**\n * Resolve the trend to a Seeds decorative highlight/accent color: positive →\n * vibrant green (green-500), negative → vibrant red (red-600), neutral → middle\n * gray (neutral-600). These highlight tones are theme-stable — the same value in\n * light and dark — and are designed to read as accents on either surface.\n */\nexport function resolveTrendColor(theme: TypeTheme, trend: Trend): string {\n const decorative = theme.colors.container.border.decorative;\n if (trend === \"positive\") return decorative.green;\n if (trend === \"negative\") return decorative.red;\n return decorative.neutral;\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sproutsocial/seeds-react-data-viz",
3
- "version": "0.17.1",
3
+ "version": "0.19.0",
4
4
  "description": "Seeds React Data Viz Components",
5
5
  "author": "Sprout Social, Inc.",
6
6
  "license": "MIT",
@@ -34,6 +34,10 @@
34
34
  "require": "./dist/sparkline/index.js"
35
35
  },
36
36
  "./sparkline.css": "./dist/sparkline.css",
37
+ "./chart-styles.css": "./dist/chart-styles.css",
38
+ "./bar.css": "./dist/bar.css",
39
+ "./donut.css": "./dist/donut.css",
40
+ "./line-area.css": "./dist/line-area.css",
37
41
  "./export": {
38
42
  "types": "./dist/export/index.d.ts",
39
43
  "import": "./dist/esm/export/index.js",
@@ -44,7 +48,7 @@
44
48
  "dist"
45
49
  ],
46
50
  "scripts": {
47
- "build": "tsup --dts && cp src/charts/sparkline/sparkline.css dist/sparkline.css",
51
+ "build": "tsup --dts && cp src/charts/*/*.css src/styles/*.css dist/",
48
52
  "build:debug": "tsup --dts --metafile",
49
53
  "dev": "tsup --watch --dts",
50
54
  "clean": "rm -rf .turbo dist",
@@ -59,14 +63,14 @@
59
63
  "@sproutsocial/seeds-networkcolor": "^2.22.0",
60
64
  "@sproutsocial/seeds-react-box": "^1.1.22",
61
65
  "@sproutsocial/seeds-react-button": "^2.2.2",
62
- "@sproutsocial/seeds-react-duration": "^1.0.24",
66
+ "@sproutsocial/seeds-react-duration": "^1.0.25",
63
67
  "@sproutsocial/seeds-react-icon": "^2.4.1",
64
- "@sproutsocial/seeds-react-menu": "^1.16.1",
65
- "@sproutsocial/seeds-react-numeral": "^1.0.48",
68
+ "@sproutsocial/seeds-react-menu": "^1.16.2",
69
+ "@sproutsocial/seeds-react-numeral": "^1.0.49",
66
70
  "@sproutsocial/seeds-react-partner-logo": "^1.7.14",
67
71
  "@sproutsocial/seeds-react-system-props": "^3.1.1",
68
- "@sproutsocial/seeds-react-table": "^1.0.42",
69
- "@sproutsocial/seeds-react-text": "^1.4.3",
72
+ "@sproutsocial/seeds-react-table": "^1.0.43",
73
+ "@sproutsocial/seeds-react-text": "^1.5.0",
70
74
  "@sproutsocial/seeds-react-theme": "^4.1.1",
71
75
  "highcharts": "^11.4.3",
72
76
  "highcharts-react-official": "^3.2.1",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/chunk-HDEKK4W4.js","../src/charts/shared/chartBase.tsx","../src/charts/shared/ChartAnnotationMarkerPortal.tsx","../src/charts/shared/DefaultChartTooltip.tsx","../src/charts/shared/formatters/valueFormatter.ts","../src/charts/shared/SeriesLegend.tsx","../src/charts/shared/chartExport.ts","../src/charts/shared/baseChartOptions.ts"],"names":["ChartAnnotationMarkerPortal","Box","Icon","memo","jsx"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/chunk-HDEKK4W4.js","sourcesContent":[null,"// Engine boundary for the v2 chart architecture. The only file under `charts/`\n// that imports from \"highcharts\". See `charts/README.md` for invariants.\n\nimport Highcharts from \"highcharts\";\nimport { HighchartsReact } from \"highcharts-react-official\";\nimport highchartsAccessibility from \"highcharts/modules/accessibility\";\nimport highchartsAnnotations from \"highcharts/modules/annotations\";\nimport highchartsExporting from \"highcharts/modules/exporting\";\nimport highchartsOfflineExporting from \"highcharts/modules/offline-exporting\";\nimport highchartsExportData from \"highcharts/modules/export-data\";\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { ChartTooltipPortal } from \"../../components/ChartTooltip/components/ChartTooltipPortal\";\nimport { transformTimeSeriesTooltipData } from \"../../helpers\";\nimport { GlobalChartStyleOverrides } from \"../../styles/chartStyles\";\nimport { ChartAnnotationMarkerPortal } from \"./ChartAnnotationMarkerPortal\";\nimport { DefaultChartTooltip } from \"./DefaultChartTooltip\";\nimport { SeriesLegend } from \"./SeriesLegend\";\nimport type { TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport { defaultFilename } from \"./chartExport\";\nimport type { ChartAnnotationLookup } from \"./annotations\";\nimport type { ValueFormat } from \"./formatters/valueFormatter\";\nimport type { ChartExportHandle } from \"./chartExport\";\nimport type { TypeChartStyleColor, TypeChartStylePattern } from \"../../types\";\n\nhighchartsAccessibility(Highcharts);\nhighchartsAnnotations(Highcharts);\n// `exporting` must register before `offline-exporting` and `export-data`, which\n// extend it. `exporting` adds a native context (hamburger) button by default;\n// `ChartRenderer` disables it on the chart options so v2 charts expose export\n// only through the `onReady` handle. Export is client-side/offline only —\n// we never call the Highcharts export server.\nhighchartsExporting(Highcharts);\nhighchartsOfflineExporting(Highcharts);\nhighchartsExportData(Highcharts);\n\n/** Highcharts series type. `column` is vertical bars; `bar` is horizontal bars; the line/area family adds the rest; `pie` is donut/pie. */\nexport type SeedsChartType =\n | \"column\"\n | \"bar\"\n | \"line\"\n | \"spline\"\n | \"area\"\n | \"areaspline\"\n | \"pie\";\n\nexport interface SeedsChartMarkerOptions {\n enabled?: boolean;\n symbol?: \"circle\";\n}\n\n/** Object form of a series point — carries an optional per-point `marker` override. */\nexport interface SeedsChartDataPoint {\n x?: number;\n y: number | null;\n marker?: SeedsChartMarkerOptions;\n}\n\nexport interface SeedsChartSeriesOptions {\n type: SeedsChartType;\n name: string;\n data: Array<number | null | [number, number | null] | SeedsChartDataPoint>;\n color?: string;\n}\n\n/**\n * Seeds-local shape of the `this` context Highcharts binds when invoking an\n * axis-label `formatter`. Models only the fields our default formatter reads\n * (`value` and `axis.tickPositions`).\n */\nexport interface SeedsAxisLabelFormatterContext {\n value: number | string;\n axis: { tickPositions?: ReadonlyArray<number> };\n}\n\nexport interface SeedsChartAxisLabelOptions {\n useHTML?: boolean;\n /** Show the axis tick labels. Maps to Highcharts' `labels.enabled`; defaults to shown. */\n enabled?: boolean;\n /** `this`-bound tick-label formatter returning the rendered string. */\n formatter?: (this: SeedsAxisLabelFormatterContext) => string;\n}\n\n/**\n * Highcharts datetime tick-label formats, keyed by the auto-selected tick unit.\n * Only the units the chart families set are modeled; Highcharts merges the rest\n * with its own defaults.\n */\nexport interface SeedsChartDateTimeLabelFormats {\n hour?: string;\n day?: string;\n week?: string;\n month?: string;\n year?: string;\n}\n\nexport interface SeedsChartAxisTitleOptions {\n text: string;\n}\n\nexport interface SeedsChartXAxisOptions {\n type?: \"category\" | \"datetime\" | \"linear\";\n categories?: Array<string>;\n crosshair?: boolean;\n min?: number;\n max?: number;\n /** Hide the axis line, ticks, and labels entirely (e.g. sparklines). Maps to Highcharts' `visible`. */\n visible?: boolean;\n labels?: SeedsChartAxisLabelOptions;\n dateTimeLabelFormats?: SeedsChartDateTimeLabelFormats;\n}\n\nexport interface SeedsChartYAxisOptions {\n min?: number;\n max?: number;\n /** Soft minimum — the axis won't start above this value, but may extend below it for negative data. */\n softMin?: number;\n /** Soft maximum — the axis won't end below this value, but may extend above it. */\n softMax?: number;\n gridLineWidth?: number;\n /** Hide the axis line, ticks, and labels entirely (e.g. sparklines). Maps to Highcharts' `visible`. */\n visible?: boolean;\n title?: SeedsChartAxisTitleOptions;\n labels?: SeedsChartAxisLabelOptions;\n /** Reference lines drawn across the plot area (e.g. the 0 baseline). `color` is only needed for the styledMode:false export clone, which can't reach scoped CSS. */\n plotLines?: Array<{\n value: number;\n className?: string;\n color?: string;\n zIndex?: number;\n }>;\n}\n\nexport interface SeedsChartTooltipOptions {\n enabled?: boolean;\n // `useHTML` is intentionally not here — it's hardcoded `true` at the engine\n // boundary (ChartRenderer) because the tooltip portal can't work without it.\n outside?: boolean;\n padding?: number;\n shape?: \"rect\" | \"callout\";\n shared?: boolean;\n hideDelay?: number;\n valueSuffix?: string;\n}\n\nexport interface SeedsChartSeriesPlotOptions {\n animation?: boolean;\n /** Stacking applied across all series. Used by the line/area family for `stacked-area`. */\n stacking?: \"normal\" | \"percent\";\n /** Point-level event wiring (e.g. click). The events shape is family-agnostic. */\n point?: { events?: SeedsChartPointEvents };\n /** Default point-marker visibility. The line/area family disables markers and re-enables them per isolated point. */\n marker?: SeedsChartMarkerOptions;\n}\n\nexport interface SeedsChartPointEventContext {\n x: number | string;\n series: {\n chart: {\n series: ReadonlyArray<{\n type: string;\n data: ReadonlyArray<{\n x: number | string;\n graphic?: { element?: Element };\n }>;\n }>;\n };\n };\n}\n\nexport interface SeedsChartPointEvents {\n mouseOver?: (this: SeedsChartPointEventContext) => void;\n mouseOut?: (this: SeedsChartPointEventContext) => void;\n click?: (event: { point: { x: number | string } }) => void;\n}\n\nexport interface SeedsChartColumnPointOptions {\n events?: SeedsChartPointEvents;\n}\n\nexport interface SeedsChartColumnPlotOptions {\n stacking?: \"normal\" | \"percent\";\n pointPadding?: number;\n groupPadding?: number;\n pointWidth?: number;\n borderRadius?: number;\n borderWidth?: number;\n point?: SeedsChartColumnPointOptions;\n}\n\n/** Type-scoped stacking for filled line-area variants (parity with `column`). */\nexport interface SeedsChartAreaPlotOptions {\n stacking?: \"normal\" | \"percent\";\n}\n\nexport interface SeedsChartPiePlotOptions {\n /** `\"60%\"` for donut (hollow center), `0` for a solid pie. */\n innerSize?: string | number;\n animation?: boolean;\n /** Must be set in JS (not CSS) — Highcharts computes the arc path before CSS is applied. */\n borderRadius?: number;\n dataLabels?: { enabled?: boolean };\n states?: { inactive?: { opacity?: number } };\n /** Pie point click: `this` is the Highcharts Point object (carries `name`, etc.). */\n point?: { events?: { click?: (this: { name: string }) => void } };\n}\n\n/** A single data point in a pie/donut series. Seeds-vocab — no Highcharts imports. */\nexport interface PiePoint {\n name: string;\n y: number | null;\n color?: string;\n}\n\n/** Series options for pie/donut charts. `data` is per-point objects, not x/y tuples. */\nexport interface SeedsChartPieSeriesOptions {\n type: \"pie\";\n name: string;\n data: Array<PiePoint>;\n color?: string;\n}\n\nexport interface SeedsChartPlotOptions {\n series?: SeedsChartSeriesPlotOptions;\n // `column` (vertical bars) and `bar` (horizontal bars) take the same option\n // shape; the bar adapter assigns one config under whichever key is active.\n column?: SeedsChartColumnPlotOptions;\n bar?: SeedsChartColumnPlotOptions;\n area?: SeedsChartAreaPlotOptions;\n areaspline?: SeedsChartAreaPlotOptions;\n pie?: SeedsChartPiePlotOptions;\n}\n\nexport interface SeedsChartChartOptions {\n type: SeedsChartType;\n styledMode?: boolean;\n animation?: boolean;\n marginTop?: number;\n height?: number;\n /** `[top, right, bottom, left]` chart spacing. Donut zeroes it so the ring fills the height; sparklines zero it so the plot fills the container. */\n spacing?: [number, number, number, number];\n}\n\nexport interface SeedsChartAnnotationLabelOptions {\n point: { x: number; y: number; xAxis: 0; yAxis: 0 };\n /** Highcharts shows a default label if this is empty; pass `\" \"` to suppress. */\n text?: string;\n}\n\n/**\n * Shared options applied to every label in a Highcharts annotation block.\n * `useHTML: true` is load-bearing — it makes Highcharts attach an HTML\n * `graphic.div` to each label, which `ChartAnnotationMarkerPortal` portals\n * React content into. Without it, labels render as SVG `<text>` and the\n * portal finds no containers.\n */\nexport interface SeedsChartAnnotationLabelOptionsShared {\n useHTML?: boolean;\n padding?: number;\n}\n\nexport interface SeedsChartAnnotationsOptions {\n labels?: SeedsChartAnnotationLabelOptions[];\n labelOptions?: SeedsChartAnnotationLabelOptionsShared;\n}\n\nexport interface SeedsChartAccessibilityOptions {\n description?: string;\n}\n\nexport interface SeedsChartTitleOptions {\n text?: string;\n}\n\nexport interface SeedsChartCreditsOptions {\n enabled?: boolean;\n}\n\nexport interface SeedsChartLegendOptions {\n enabled?: boolean;\n}\n\n/** Maps to Highcharts `time` — chart-global; `timezone` only affects datetime axes. */\nexport interface SeedsChartTimeOptions {\n timezone?: string;\n}\n\nexport interface SeedsChartOptions {\n chart?: SeedsChartChartOptions;\n accessibility?: SeedsChartAccessibilityOptions;\n title?: SeedsChartTitleOptions;\n credits?: SeedsChartCreditsOptions;\n legend?: SeedsChartLegendOptions;\n tooltip?: SeedsChartTooltipOptions;\n time?: SeedsChartTimeOptions;\n xAxis?: SeedsChartXAxisOptions;\n yAxis?: SeedsChartYAxisOptions;\n plotOptions?: SeedsChartPlotOptions;\n series?: Array<SeedsChartSeriesOptions | SeedsChartPieSeriesOptions>;\n annotations?: SeedsChartAnnotationsOptions[];\n}\n\n/**\n * A summed Total is only meaningful when the chart stacks its series (a stack\n * is, by definition, an additive composition). Returns true if any plotOptions\n * slot (series/column/bar/area/areaspline) carries a truthy `stacking`. Kept\n * key-agnostic so new stacked families are covered without changes here.\n */\nexport function isChartStacked(options: SeedsChartOptions): boolean {\n const plotOptions = options.plotOptions;\n if (!plotOptions) return false;\n return Object.values(plotOptions).some(\n (slot) =>\n slot != null &&\n typeof slot === \"object\" &&\n Boolean((slot as { stacking?: unknown }).stacking)\n );\n}\n\nexport interface SeedsChartSetupSeriesInput {\n color?: string;\n pattern?: TypeChartStylePattern;\n}\n\nexport interface UseSeedsChartSetupParams<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n> {\n series: Array<T>;\n /** Opt-in for the pattern array. Families that apply patterns (line, area) pass `true`. */\n includePatterns?: boolean;\n /**\n * Resolved effective cap (the family default, or the consumer's explicit\n * value). Series beyond it are dropped. Omit to disable capping entirely.\n */\n seriesLimit?: number;\n /**\n * Whether the consumer set `seriesLimit` explicitly. Suppresses the over-limit\n * warning (an explicit cap is intentional, not an accidental overflow).\n * Default `false`.\n */\n isSeriesLimitOverridden?: boolean;\n /** Opt out of the over-limit warning. Default `false`. */\n hideSeriesLimitWarning?: boolean;\n /** Component name used in the over-limit warning message (kept generic for future families). */\n componentName?: string;\n}\n\nexport interface UseSeedsChartSetupResult<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n> {\n theme: TypeTheme;\n colors: Array<TypeChartStyleColor>;\n patterns: Array<TypeChartStylePattern>;\n /** Series after applying the (optional) cap. Referentially equal to the input when no cap applies. */\n series: Array<T>;\n}\n\nexport function useSeedsChartSetup<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n>({\n series,\n includePatterns = false,\n seriesLimit,\n isSeriesLimitOverridden = false,\n hideSeriesLimitWarning = false,\n componentName,\n}: UseSeedsChartSetupParams<T>): UseSeedsChartSetupResult<T> {\n const theme = useTheme() as TypeTheme;\n const palette = theme.colors.DATAVIZ_COLORS_LIST;\n\n // Cap the series at the resolved limit. Memoized so the input reference is\n // preserved when no cap applies, keeping the colors/patterns memos\n // referentially stable.\n const cappedSeries = useMemo<Array<T>>(\n () =>\n seriesLimit !== undefined &&\n seriesLimit >= 1 &&\n series.length > seriesLimit\n ? series.slice(0, seriesLimit)\n : series,\n [series, seriesLimit]\n );\n\n // Warn when the limit was exceeded, was not explicitly overridden by the\n // consumer, and the warning isn't suppressed. Keyed off the gating conditions\n // so it fires when those change rather than on every render.\n useEffect(() => {\n if (\n seriesLimit !== undefined &&\n seriesLimit >= 1 &&\n series.length > seriesLimit &&\n !isSeriesLimitOverridden &&\n !hideSeriesLimitWarning &&\n componentName != null\n ) {\n console.warn(\n `${componentName}: Maximum number of series (${seriesLimit}) exceeded. Only the first ${seriesLimit} series will be displayed.`\n );\n }\n }, [\n series.length,\n seriesLimit,\n isSeriesLimitOverridden,\n hideSeriesLimitWarning,\n componentName,\n ]);\n\n const colors = useMemo<Array<TypeChartStyleColor>>(() => {\n const out: TypeChartStyleColor[] = [];\n const paletteLen = palette.length;\n for (let i = 0; i < cappedSeries.length; i++) {\n const s = cappedSeries[i]!;\n out.push(s.color ?? palette[i % paletteLen] ?? \"\");\n }\n return out;\n }, [cappedSeries, palette]);\n\n const patterns = useMemo<Array<TypeChartStylePattern>>(() => {\n if (!includePatterns) return [];\n const out: TypeChartStylePattern[] = [];\n for (let i = 0; i < cappedSeries.length; i++) {\n const s = cappedSeries[i]!;\n out.push(s.pattern ?? \"solid\");\n }\n return out;\n }, [cappedSeries, includePatterns]);\n\n return { theme, colors, patterns, series: cappedSeries };\n}\n\nexport interface ChartRendererSeries {\n name: string;\n color?: string;\n /** Seeds icon or partner-logo name rendered before the series name in the legend label. */\n icon?: TypeIconName;\n}\n\nexport interface ChartTooltipDataRow {\n color: TypeChartStyleColor;\n name: string;\n value: number | null;\n /** Slice percentage — populated by pie/donut tooltips; `undefined` for bar/line-area rows. */\n percent?: number;\n}\n\n/** Tooltip render-prop signature for v2 charts. */\nexport interface ChartTooltipProps {\n data: ChartTooltipDataRow[];\n /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */\n position: number | string;\n /** Suppress the default tooltip's title row. Set for pie/donut, which have no x-axis position — the title would just duplicate the single slice's name. */\n hideTitle?: boolean;\n /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */\n timezone?: string;\n /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */\n annotation?: {\n icon?: TypeIconName;\n color?: string;\n title?: string;\n description?: string;\n };\n /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */\n hasOnClick?: boolean;\n /** Footer content shown in the default tooltip when the chart is clickable. */\n tooltipClickLabel?: ReactNode;\n /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */\n invalidNumberLabel?: ReactNode;\n /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */\n valueFormat?: ValueFormat;\n}\n\nexport interface ChartRendererProps {\n options: SeedsChartOptions;\n series: Array<ChartRendererSeries>;\n /** Theme-aware palette resolved by `useSeedsChartSetup`. Used as the swatch color for any series that doesn't carry an explicit `color`. */\n colors: ReadonlyArray<TypeChartStyleColor>;\n /** Override for the default tooltip content. Portal is always rendered — `GlobalChartStyleOverrides` makes Highcharts' native tooltip box transparent. */\n tooltip?: (args: ChartTooltipProps) => ReactNode;\n /**\n * Resolved annotations keyed by numeric x. Drives both the in-chart marker\n * portal and the tooltip-header `annotation` injection. The family component\n * builds this map (resolving category-string positions to indices); the\n * renderer is axis-type agnostic.\n */\n annotationLookup?: ChartAnnotationLookup;\n /** Forwarded into the default tooltip so it can render the click-label footer. */\n hasOnClick?: boolean;\n /** Forwarded into the default tooltip for click-label footer rendering. */\n tooltipClickLabel?: ReactNode;\n /** Resolved chart timezone, forwarded to the tooltip so its date title matches the axis ticks. Undefined on category axes. */\n timezone?: string;\n /** Forwarded into the default tooltip as the null-value override. */\n invalidNumberLabel?: ReactNode;\n /** Forwarded into the default tooltip to format the value cell declaratively. */\n valueFormat?: ValueFormat;\n /**\n * Suppress the Seeds series legend beneath the chart. Default `false` (the\n * legend renders). Decorative charts (e.g. sparklines) pass `true` to hide it.\n */\n hideLegend?: boolean;\n /**\n * Fired once per chart instance with an opaque {@link ChartExportHandle} for\n * triggering PNG/SVG/PDF/CSV downloads. Re-fires only on a genuine remount,\n * never on data or prop updates.\n */\n onReady?: (handle: ChartExportHandle) => void;\n}\n\n/**\n * Runtime shape of one Highcharts annotation label — only the fields the\n * marker portal reads. Re-exported so the portal stays inside the engine\n * boundary (no direct \"highcharts\" import).\n */\nexport interface ChartAnnotationRuntimeLabel {\n graphic?: { div?: HTMLDivElement };\n options?: { point?: { x?: number } };\n}\n\n/** Runtime shape of one Highcharts annotation block (a group of labels). */\nexport interface ChartAnnotationRuntime {\n labels?: ChartAnnotationRuntimeLabel[];\n}\n\n/** Highcharts doesn't include the `annotations` array on its `Chart` type. */\ninterface ChartWithAnnotations extends Highcharts.Chart {\n annotations?: ChartAnnotationRuntime[];\n}\n\n/**\n * Theme→options map for the `styledMode: false` export clone, which can't see\n * the scoped CSS v2 charts normally style with. Mirrors `styles/chartStyles`.\n */\nfunction buildExportChartOptions(\n theme: TypeTheme,\n colors: ReadonlyArray<TypeChartStyleColor>\n): Highcharts.Options {\n // Line, gridline, and label styling are identical for both axes.\n const axisOptions = {\n lineColor: theme.colors.container.border.base,\n gridLineColor: theme.colors.container.border.base,\n labels: {\n style: {\n color: theme.colors.text.subtext,\n fontFamily: theme.fontFamily,\n fontSize: theme.typography[100].fontSize,\n fontWeight: String(theme.fontWeights.normal),\n },\n },\n };\n return {\n chart: {\n styledMode: false,\n backgroundColor: theme.colors.container.background.base,\n },\n // Series without an explicit `color` fall through to this palette by index.\n colors: [...colors],\n // The on-screen legend is a React sibling (`SeriesLegend`) outside the chart\n // SVG, so the export can't capture it. Turn on Highcharts' native legend for\n // the clone instead, themed to approximate the Seeds `ChartLegend` (centered\n // row of swatch + `text.subtext` label). It can't reproduce per-series Seeds\n // icons — those series show colour + name only.\n legend: {\n enabled: true,\n symbolRadius: 4,\n symbolHeight: 12,\n symbolWidth: 12,\n itemStyle: {\n color: theme.colors.text.subtext,\n fontFamily: theme.fontFamily,\n fontSize: theme.typography[200].fontSize,\n fontWeight: String(theme.fontWeights.normal),\n },\n },\n xAxis: {\n ...axisOptions,\n crosshair: {\n color: theme.colors.container.border.decorative.neutral,\n width: 1,\n },\n },\n yAxis: {\n ...axisOptions,\n // The live chart's plotLines (set by the adapter) merge with this by\n // array index, so `className`/`value`/`zIndex` survive — this only adds\n // the color the `y-axis-zero-line` CSS class can't reach in styledMode:false.\n plotLines: [\n { value: 0, color: theme.colors.container.border.decorative.neutral },\n ],\n },\n } as Highcharts.Options;\n}\n\n/**\n * Build the opaque export handle for a chart instance. Lives here — not in\n * `chartExport.ts` — because it closes over the live `Highcharts.Chart`, which\n * never leaves the engine boundary. The returned {@link ChartExportHandle} is\n * Highcharts-free.\n *\n * PDF lazy-loads jspdf + svg2pdf.js (a deferred chunk) on first use.\n */\nfunction createChartExportHandle(\n chart: Highcharts.Chart,\n getExportChartOptions: () => Highcharts.Options\n): ChartExportHandle {\n const resolveName = (filename?: string) =>\n filename ?? defaultFilename(chart.options.chart?.type, new Date());\n\n const exportImage = async (\n type: Highcharts.ExportingMimeTypeValue,\n filename?: string\n ): Promise<void> => {\n // Read options at call time, not when the handle was built: a light/dark\n // toggle updates the chart in place without re-firing `onReady`, so the\n // export must reflect the current theme. 2nd arg is deep-merged, so\n // `labels.style` here merges with the live axis `formatter`, not clobbers it.\n chart.exportChartLocal(\n { type, filename: resolveName(filename) },\n getExportChartOptions()\n );\n };\n\n return {\n exportPNG: ({ filename } = {}) => exportImage(\"image/png\", filename),\n exportSVG: ({ filename } = {}) => exportImage(\"image/svg+xml\", filename),\n exportPDF: async ({ filename } = {}): Promise<void> => {\n // Lazy-load jspdf + svg2pdf.js (deferred chunk) and expose `window.jspdf`\n // before exporting, so Highcharts' offline-exporting renders the PDF\n // locally rather than fetching the libs from its CDN.\n const { loadPdfExportLibs } = await import(\"./pdfExportLibs\");\n loadPdfExportLibs();\n await exportImage(\"application/pdf\", filename);\n },\n exportCSV: async ({ filename } = {}): Promise<void> => {\n // `downloadCSV()` reads the filename from `chart.options.exporting.filename`\n // via `getFilename()`. Set it transiently (direct mutation — no `update()`,\n // so no redraw) so the per-call override and generated default both apply,\n // then restore the previous value.\n const exporting = (chart.options.exporting ??= {});\n const previous = exporting.filename;\n exporting.filename = resolveName(filename);\n try {\n chart.downloadCSV();\n } finally {\n exporting.filename = previous;\n }\n },\n };\n}\n\nexport function ChartRenderer({\n options,\n series,\n colors,\n tooltip,\n annotationLookup,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat,\n hideLegend = false,\n onReady,\n}: ChartRendererProps) {\n const [chart, setChart] = useState<Highcharts.Chart | null>(null);\n const [plotHeight, setPlotHeight] = useState(0);\n // Wrap the default tooltip so unstacked families (line/spline, unstacked\n // area, grouped bar) suppress the summed Total, which is meaningless there.\n // When a consumer supplies `tooltip`, DefaultChartTooltip is bypassed and\n // never sees `hideTotal` — the escape hatch and public props stay untouched.\n const chartIsStacked = isChartStacked(options);\n const renderTooltip =\n tooltip ??\n ((args) => DefaultChartTooltip({ ...args, hideTotal: !chartIsStacked }));\n const theme = useTheme() as TypeTheme;\n\n // Hold the live theme + palette in a ref so the export handle reads the\n // *current* theme at call time (see `createChartExportHandle`). A dark-mode\n // toggle updates this each render without re-firing `onReady`.\n const exportThemeRef = useRef({ theme, colors });\n exportThemeRef.current = { theme, colors };\n\n // Capture only the live chart. Highcharts reuses a chart's `callback` when it\n // builds the throwaway clone for export (`new chart.constructor(options,\n // chart.callback)` in exporting/offline-exporting, with `chart.forExport:\n // true`). That clone is destroyed the instant its SVG is captured, so binding\n // React state to it would leave a destroyed chart whose next `update()` reads\n // `options.responsive` on `undefined` and throws.\n const captureChart = useCallback((chartInstance: Highcharts.Chart) => {\n const forExport = (\n chartInstance.options.chart as { forExport?: boolean } | undefined\n )?.forExport;\n if (!forExport) {\n setChart(chartInstance);\n // Seed plotHeight in the same commit as the chart so markers render with\n // it, not a frame later (the pop-in). The redraw handler keeps it current.\n setPlotHeight(chartInstance.plotHeight);\n }\n }, []);\n\n // Hold `onReady` in a ref so an inline callback (new identity each render)\n // doesn't re-fire the effect below — it should fire on instance change only.\n const onReadyRef = useRef(onReady);\n onReadyRef.current = onReady;\n\n // Fire `onReady` once per chart instance. The chart callback runs only on\n // instance creation — data/prop changes call `chart.update()` on the same\n // instance and don't re-run it — so keying on `[chart]` gives once-per-instance\n // semantics: re-fires on a genuine remount, never on a data update.\n useEffect(() => {\n if (!chart) return;\n onReadyRef.current?.(\n createChartExportHandle(chart, () =>\n buildExportChartOptions(\n exportThemeRef.current.theme,\n exportThemeRef.current.colors\n )\n )\n );\n }, [chart]);\n\n // Track the chart's actual plot-area height so the annotation marker line\n // spans it. Re-reads on Highcharts' `redraw` event (covers window resizes,\n // data updates, anything that re-lays-out the plot area).\n useEffect(() => {\n if (!chart) return;\n setPlotHeight(chart.plotHeight);\n const unbind = Highcharts.addEvent(chart, \"redraw\", () => {\n setPlotHeight(chart.plotHeight);\n });\n return () => unbind();\n }, [chart]);\n\n // Stable ref across internal re-renders (setChart/setPlotHeight): HighchartsReact\n // keys its update effect on the options ref and redraws on change, so a fresh\n // object each render would redraw — and re-flicker the annotations — every time.\n const highchartsOptions = useMemo(\n () =>\n ({\n ...options,\n // useHTML is load-bearing: the tooltip portal's target div only mounts\n // when the label renders as HTML, not SVG (see `charts/README.md`).\n tooltip: { ...options.tooltip, useHTML: true },\n // Client-side/offline export only; native context button hidden (export\n // is exposed via the `onReady` handle).\n exporting: {\n fallbackToExportServer: false,\n buttons: { contextButton: { enabled: false } },\n },\n } as Highcharts.Options),\n [options]\n );\n\n // Safety net: no series → render nothing. Families are expected to early-return\n // before calling hooks to avoid wasted work, but this guards future families\n // that forget. See `charts/README.md` (\"Empty-data handling\").\n if (series.length === 0) return null;\n\n const chartWithAnnotations = chart as ChartWithAnnotations | null;\n const hasRenderedAnnotations =\n !!chartWithAnnotations?.annotations?.length &&\n !!annotationLookup?.size &&\n plotHeight > 0;\n\n return (\n <>\n <GlobalChartStyleOverrides />\n <HighchartsReact\n highcharts={Highcharts}\n // Structural cast at the engine seam — the only place we touch Highcharts' option types.\n options={highchartsOptions}\n callback={captureChart}\n />\n {hasRenderedAnnotations ? (\n <ChartAnnotationMarkerPortal\n annotationLookup={annotationLookup}\n annotationContext={chartWithAnnotations!.annotations![0]!}\n chartContainer={chartWithAnnotations!.container}\n plotHeight={plotHeight}\n />\n ) : null}\n {chart ? (\n <ChartTooltipPortal\n chart={chart}\n renderContent={(context) => {\n // Pie context has a single `point`; time-series has a `points` array.\n // Discriminate on the absence of `points` — pie never has it.\n const ctx = context as {\n point: {\n name: string;\n y: number | null;\n color: string;\n percentage: number;\n };\n points?: unknown[];\n key?: string;\n };\n const isPie = !ctx.points;\n const data: ChartTooltipDataRow[] = isPie\n ? [\n {\n color: ctx.point.color,\n name: ctx.point.name,\n value: ctx.point.y,\n percent: ctx.point.percentage,\n },\n ]\n : // Drop v1's `readonly` array wrapper and `icon` field at the seam —\n // the v2 surface is mutable and doesn't expose row-level icons.\n transformTimeSeriesTooltipData({\n context,\n data: series.map((s, i) => ({\n name: s.name,\n points: [],\n styles: { color: s.color ?? colors[i] ?? \"\" },\n })),\n }).map((row) => ({\n color: row.color,\n name: row.name,\n value: row.value,\n }));\n // For pie, `context.x` is the numeric slice index — use `context.key`\n // (the slice name) as the tooltip title instead.\n // For time-series, `context.x` is the timestamp/category value.\n // The annotation lookup always uses `context.point.x` (numeric).\n const position = isPie\n ? ctx.key ?? ctx.point.name\n : (context.x as number | string);\n const resolved = annotationLookup?.get(context.point.x as number);\n const annotation = resolved\n ? {\n icon: resolved.icon,\n color: resolved.color,\n title: resolved.title,\n description: resolved.description,\n }\n : undefined;\n return renderTooltip({\n data,\n position,\n // Pie has no x-axis position; its title would just repeat the slice name.\n hideTitle: isPie,\n annotation,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat,\n });\n }}\n />\n ) : null}\n {hideLegend ? null : (\n <Box mt={350}>\n <SeriesLegend\n items={series.map((s, i) => ({\n name: s.name,\n icon: s.icon,\n color: s.color ?? colors[i] ?? \"\",\n }))}\n />\n </Box>\n )}\n </>\n );\n}\n","// Portals DS-owned marker content into Highcharts annotation containers. The\n// marker shape (icon + vertical line in the configured color) is rendered\n// internally — consumers don't supply React nodes. See CE-7.\n\nimport { memo, useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { ChartAnnotationLookup, ChartAnnotation } from \"./annotations\";\nimport type {\n ChartAnnotationRuntime,\n ChartAnnotationRuntimeLabel,\n} from \"./chartBase\";\n\nfunction ChartAnnotationMarker({\n annotation,\n lineHeight,\n}: {\n annotation: ChartAnnotation;\n /** Vertical pixel length of the marker line. Driven by `chart.plotHeight`\n * so the line spans the chart's full plot area regardless of chart size. */\n lineHeight: number;\n}) {\n return (\n <Box display=\"flex\" flexDirection=\"column\" alignItems=\"center\" gap={200}>\n {annotation.icon ? (\n <Box\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width=\"20px\"\n height=\"20px\"\n bg=\"icon.base\"\n borderRadius=\"50%\"\n >\n <Icon name={annotation.icon} size=\"mini\" color=\"icon.inverse\" />\n </Box>\n ) : null}\n <Box\n height={`${lineHeight}px`}\n width=\"0.5px\"\n bg={annotation.color ?? \"neutral.200\"}\n />\n </Box>\n );\n}\n\n// v2-specific marker attribute. Distinct from v1's `data-annotation-marker`\n// so v1 and v2 portals don't sweep each other's containers when both render\n// side-by-side (e.g. in the v1↔v2 comparison story).\nconst MARKER_ATTR = \"data-v2-chart-annotation-marker\";\n\nexport const ChartAnnotationMarkerPortal = memo(\n function ChartAnnotationMarkerPortal({\n annotationLookup,\n annotationContext,\n chartContainer,\n plotHeight,\n }: {\n annotationLookup: ChartAnnotationLookup;\n annotationContext: ChartAnnotationRuntime;\n /** The chart's own DOM root — every query is scoped here to keep\n * multi-chart renders from interfering. */\n chartContainer: HTMLElement;\n /** Highcharts' current plot-area height in pixels. Drives the marker\n * line length so it spans the chart's plot area at any chart size. */\n plotHeight: number;\n }) {\n const annotationContainers = useRef<Record<number, HTMLDivElement>>({});\n const [, setRenderCount] = useState(0);\n const forceRender = () => setRenderCount((prev) => prev + 1);\n\n useEffect(() => {\n if (!annotationContext.labels) return;\n\n const newContainers: Record<number, HTMLDivElement> = {};\n const existingAnnotationContainers = chartContainer.querySelectorAll(\n `div[${MARKER_ATTR}='true']`\n );\n\n // 1. Mark this chart's existing markers as stale before updating.\n // Highcharts doesn't clean these up, so we sweep them below.\n existingAnnotationContainers.forEach((annotation) =>\n annotation.setAttribute(MARKER_ATTR, \"false\")\n );\n\n annotationContext.labels.forEach((label: ChartAnnotationRuntimeLabel) => {\n const labelElement = label.graphic?.div;\n if (!labelElement) return;\n\n // 2. Reuse this label's existing marker div when present — Highcharts\n // repositions (rather than recreates) annotation graphics across\n // redraws, so reusing keeps the React portal mounted and avoids the\n // teardown→recreate flash. Only create one when absent.\n let annotationDiv = labelElement.querySelector<HTMLDivElement>(\n `div[${MARKER_ATTR}]`\n );\n if (!annotationDiv) {\n annotationDiv = document.createElement(\"div\");\n labelElement.appendChild(annotationDiv);\n }\n annotationDiv.setAttribute(MARKER_ATTR, \"true\");\n\n const xValue = label.options?.point?.x as number;\n newContainers[xValue] = annotationDiv;\n });\n\n annotationContainers.current = newContainers;\n forceRender();\n\n // 4. Within this chart's container, remove `.highcharts-annotation`\n // parents that no longer have any live v2 marker child.\n requestAnimationFrame(() => {\n chartContainer\n .querySelectorAll(\"div.highcharts-annotation\")\n .forEach((annotationDiv) => {\n const reactAnnotations = annotationDiv.querySelectorAll(\n `div[${MARKER_ATTR}]`\n );\n const hasActiveAnnotations = Array.from(reactAnnotations).some(\n (div) => div.getAttribute(MARKER_ATTR) === \"true\"\n );\n if (!hasActiveAnnotations) annotationDiv.remove();\n });\n });\n }, [annotationContext.labels, annotationLookup, chartContainer]);\n\n return (\n <>\n {Object.entries(annotationContainers.current).map(\n ([xValue, container]) => {\n const annotation = annotationLookup.get(Number(xValue));\n return annotation\n ? createPortal(\n <ChartAnnotationMarker\n annotation={annotation}\n lineHeight={plotHeight}\n />,\n container\n )\n : null;\n }\n )}\n </>\n );\n }\n);\n","// Minimal: no locale / currency / duration formatting. Consumers needing those pass their own `tooltip` render prop.\n\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { Icon, type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\n\nimport { ChartLegendLabel } from \"../../components/ChartLegend/components/ChartLegendLabel\";\nimport {\n ChartTooltip,\n ChartTooltipFooter,\n ChartTooltipHeader,\n ChartTooltipTable,\n ChartTooltipTitle,\n type TypeChartTooltipTableProps,\n} from \"../../components/ChartTooltip\";\nimport type { ChartTooltipProps } from \"./chartBase\";\nimport { valueFormatter } from \"./formatters/valueFormatter\";\n\nfunction formatTitle(position: number | string, timezone?: string): string {\n if (typeof position === \"string\") return position;\n // `timeZone` aligns the title with the chart's configured timezone (which\n // governs the axis ticks). Omitting it would format in the browser's local\n // zone and disagree with the ticks by up to a day.\n return new Date(position).toLocaleDateString(undefined, {\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n weekday: \"long\",\n timeZone: timezone,\n });\n}\n\n// Inlined (not v1's `ChartXAnnotationDetails`) because that component requires\n// both iconName and text together — v2's `ChartAnnotation` documents icon,\n// title, and description as independently optional, so the renderer has to\n// match that contract instead of dropping fields silently.\nfunction AnnotationHeader({\n icon,\n title,\n description,\n}: {\n icon?: TypeIconName;\n title?: string;\n description?: string;\n}) {\n const hasIconOrTitle = Boolean(icon || title);\n if (!hasIconOrTitle && !description) return null;\n return (\n <>\n {hasIconOrTitle ? (\n <ChartTooltipHeader>\n <Box display=\"flex\" alignItems=\"center\" gap={300}>\n {icon ? <Icon name={icon} size=\"mini\" color=\"icon.base\" /> : null}\n {title ? (\n <Text color=\"text.body\" fontSize={200}>\n {title}\n </Text>\n ) : null}\n </Box>\n </ChartTooltipHeader>\n ) : null}\n {description ? (\n <ChartTooltipHeader>\n <Text fontSize={200} color=\"text.subtext\">\n {description}\n </Text>\n </ChartTooltipHeader>\n ) : null}\n </>\n );\n}\n\n// Local to the default tooltip: `hideTotal` opts out of the multi-series Total\n// row. Kept off the shared `ChartTooltipProps` render-prop contract (and off\n// `BarChart`'s public props) intentionally — the chart sets it internally; any\n// consumer-facing tooltip config is deferred to CE-35.\ntype DefaultChartTooltipProps = ChartTooltipProps & { hideTotal?: boolean };\n\nexport function DefaultChartTooltip({\n data,\n position,\n annotation,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat = {},\n hideTitle,\n hideTotal = false,\n}: DefaultChartTooltipProps) {\n const rows = data.map((d) => {\n const formattedValue =\n d.value == null\n ? invalidNumberLabel ?? \"—\"\n : valueFormatter({ ...valueFormat, value: d.value, abbreviate: false });\n\n const nameCell = {\n content: (\n <ChartLegendLabel color={d.color}>\n <Text aria-label={`${d.name}: `}>{d.name}</Text>\n </ChartLegendLabel>\n ),\n };\n\n // When a row carries `percent` (pie/donut), show percent + value grouped\n // and flush right, matching v1's DonutChartTooltip: `inline-flex` shrinks\n // the pair to its content so the cell's `align: right` right-aligns the\n // whole group (a block `flex` stretched to fill the cell, leaving a gap\n // between percent and value — svbarker review, PR #2267). Guard NaN:\n // Highcharts emits NaN% when every slice value is null (total = 0).\n return {\n cells: [\n nameCell,\n {\n content:\n d.percent != null && !isNaN(d.percent) ? (\n <Box display=\"inline-flex\" alignItems=\"center\" gap={350}>\n <Text>{Math.round(d.percent)}%</Text>\n <Text fontWeight=\"semibold\">{formattedValue}</Text>\n </Box>\n ) : (\n <Text>{formattedValue}</Text>\n ),\n align: \"right\" as const,\n },\n ],\n };\n });\n\n // Multi-series parity with v1/Trellis: append a Total row summing the\n // contributing (non-null) values. Track contribution count separately from\n // the sum — `[5, -5]` legitimately totals 0 and must render \"0\", whereas an\n // all-null set must render the null placeholder, not a misleading 0.\n const contributing = data.filter((d) => d.value != null);\n const total =\n contributing.length > 0\n ? contributing.reduce((sum, d) => sum + (d.value as number), 0)\n : null;\n\n const totalRow =\n data.length > 1 && !hideTotal\n ? [\n {\n isAppendedRow: true,\n cells: [\n {\n content: (\n <Text fontWeight=\"semibold\" aria-label=\"Total: \">\n Total\n </Text>\n ),\n },\n {\n // Mirror the per-series value cell's formatting path exactly.\n content: (\n <Text fontWeight=\"bold\">\n {total == null\n ? invalidNumberLabel ?? \"—\"\n : valueFormatter({\n ...valueFormat,\n value: total,\n abbreviate: false,\n })}\n </Text>\n ),\n align: \"right\" as const,\n },\n ],\n },\n ]\n : [];\n\n return (\n <ChartTooltip>\n {annotation ? (\n <AnnotationHeader\n icon={annotation.icon}\n title={annotation.title}\n description={annotation.description}\n />\n ) : null}\n {hideTitle ? null : (\n <ChartTooltipTitle>{formatTitle(position, timezone)}</ChartTooltipTitle>\n )}\n <ChartTooltipTable\n rows={[...rows, ...totalRow] as TypeChartTooltipTableProps[\"rows\"]}\n />\n {hasOnClick && tooltipClickLabel ? (\n <ChartTooltipFooter>\n {typeof tooltipClickLabel === \"string\" ? (\n <Box display=\"flex\" alignItems=\"center\" gap={300}>\n <Icon name=\"hand-pointer-clicking-outline\" color=\"icon.base\" />\n <Text color=\"text.subtext\" fontSize={200}>\n {tooltipClickLabel}\n </Text>\n </Box>\n ) : (\n tooltipClickLabel\n )}\n </ChartTooltipFooter>\n ) : null}\n </ChartTooltip>\n );\n}\n","import { formatDuration } from \"@sproutsocial/seeds-react-duration\";\nimport { formatNumeral } from \"@sproutsocial/seeds-react-numeral\";\n\nimport type { TypeChartNumberFormat } from \"../../../types\";\n\nexport type TypeValuePercentInput = \"decimal\" | \"whole\";\n\nexport type TypeValueFormatterOptions = Readonly<{\n /** The raw numeric value. For duration, milliseconds. */\n value: number;\n /** default \"decimal\" */\n numberFormat?: TypeChartNumberFormat;\n /** Only used when numberFormat === \"currency\". default \"USD\" */\n currency?: string;\n /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */\n abbreviate?: boolean | number;\n /** \"decimal\" scales 0.42 → \"42%\"; \"whole\" treats 42 → \"42%\". default \"decimal\" */\n percentInput?: TypeValuePercentInput;\n /** locale for decimal/currency/percent (formatNumeral) */\n numberLocale?: Intl.LocalesArgument;\n /** locale for duration (formatDuration) */\n textLocale?: Intl.LocalesArgument;\n}>;\n\n/**\n * Pure value formatter for v2 charts. Turns a numeric value plus declarative\n * config into a display string. Composes `formatNumeral` (decimal/currency/\n * percent) and `formatDuration` (duration). Contains no chart-engine types or\n * imports — it upholds the \"engine boundary is one file\" invariant documented\n * in `src/charts/README.md`.\n *\n * The axis-wide \"smart 1k/10k\" abbreviation scan that v1's `yAxisLabelFormatter`\n * derives from `tickPositions` is not available to a pure per-value function;\n * callers pass the lowered threshold via `abbreviate` (a number) instead.\n */\nexport function valueFormatter({\n value,\n numberFormat = \"decimal\",\n currency = \"USD\",\n abbreviate = true,\n percentInput = \"decimal\",\n numberLocale,\n textLocale,\n}: TypeValueFormatterOptions): string {\n const numberValue = Number(value);\n\n // v1 parity: render 0 as a bare \"0\" for every format (clean axis origin) —\n // not \"$0.00\" / \"0%\" / a duration-zero. Matches v1's yAxisLabelFormatter,\n // which checks zero first, before any format branch. Revisit if design\n // wants per-format zero rendering later.\n if (numberValue === 0) {\n return formatNumeral({ locale: numberLocale as string, number: 0 });\n }\n\n if (numberFormat === \"duration\") {\n return formatDuration({\n display: \"narrow\",\n locale: textLocale,\n milliseconds: numberValue,\n });\n }\n\n if (numberFormat === \"percent\") {\n const whole = percentInput === \"decimal\" ? numberValue * 100 : numberValue;\n return formatNumeral({\n format: \"percent\",\n locale: numberLocale as string,\n number: whole,\n });\n }\n\n // decimal | currency\n return formatNumeral({\n abbreviate,\n currency,\n format: numberFormat,\n locale: numberLocale as string,\n number: numberValue,\n });\n}\n\n/**\n * Declarative value-format config for axis ticks and the default tooltip — the\n * full {@link TypeValueFormatterOptions} surface minus `value`, which is\n * supplied per-tick / per-row by the caller (the adapter and tooltip).\n */\nexport type ValueFormat = Omit<TypeValueFormatterOptions, \"value\">;\n","import { memo } from \"react\";\nimport { Icon, type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport { ChartLegend } from \"../../components/ChartLegend\";\nimport { ChartLegendLabelContentWithIcon } from \"../../components/ChartLegend/components/ChartLegendLabelContentWithIcon\";\n\nexport interface SeriesLegendItem {\n name: string;\n /** Resolved swatch color — caller is responsible for resolving against the active theme. */\n color: string;\n /** Seeds icon or partner-logo name rendered before the series name. */\n icon?: TypeIconName;\n}\n\nexport interface SeriesLegendProps {\n items: ReadonlyArray<SeriesLegendItem>;\n}\n\n// Internal to `ChartRenderer` — not intended for standalone use. Swatch\n// colors must be resolved by the caller (the chart base does this via\n// `useSeedsChartSetup`) so we keep a single source of truth for the\n// theme-aware palette. If this ever becomes a publicly-exposed primitive,\n// add a `useTheme()` fallback here and relax `item.color` to optional.\nexport const SeriesLegend = memo<SeriesLegendProps>(function SeriesLegend({\n items,\n}) {\n const labels = items.map((item) => ({\n content: (\n <ChartLegendLabelContentWithIcon\n icon={\n item.icon ? (\n <Icon name={item.icon} fixedWidth aria-hidden />\n ) : undefined\n }\n >\n {item.name}\n </ChartLegendLabelContentWithIcon>\n ),\n color: item.color,\n }));\n return <ChartLegend legendLabels={labels} />;\n});\n","// Public, Highcharts-free surface for the v2 chart export API. This module\n// imports nothing — it is a leaf so it can never form an import cycle with\n// `chartBase`. The `createChartExportHandle` factory that closes over the live\n// `Highcharts.Chart` lives in `chartBase.tsx` (the one file allowed to import\n// \"highcharts\"); the instance never crosses this boundary.\n//\n/**\n * Opaque export API handed to consumers via `ChartRenderer`'s `onReady`. Each\n * callable closes over the chart instance and triggers a client-side download;\n * an optional `filename` overrides the generated default. No Highcharts type,\n * ref, or method shape crosses this boundary.\n */\nexport interface ChartExportHandle {\n exportPNG: (opts?: { filename?: string }) => Promise<void>;\n exportSVG: (opts?: { filename?: string }) => Promise<void>;\n exportPDF: (opts?: { filename?: string }) => Promise<void>;\n exportCSV: (opts?: { filename?: string }) => Promise<void>;\n}\n\n/**\n * Canonical client-side export formats offered by `ChartExportMenu`. Co-located\n * with `ChartExportHandle` so the format vocabulary lives next to the handle it\n * maps onto; this leaf imports nothing, so re-exporting it carries no cycle risk.\n */\nexport type ChartExportFormat = \"png\" | \"svg\" | \"pdf\" | \"csv\";\n\n/**\n * Default download filename when a consumer doesn't pass a `filename` override:\n * `chart-<type>-<YYYY-MM-DD-HH-mm-ss>`, lowercased with non-alphanumerics\n * collapsed to hyphens. The full datetime (not just the date) avoids collisions\n * between charts exported on the same day. `type` comes from the chart's\n * `chart.type`; it falls back to `chart` when absent.\n */\nexport function defaultFilename(type: string | undefined, now: Date): string {\n const iso = now.toISOString();\n const stamp = `${iso.slice(0, 10)}-${iso.slice(11, 19).replace(/:/g, \"-\")}`;\n return slugify(type ? `chart-${type}-${stamp}` : `chart-${stamp}`);\n}\n\nfunction slugify(value: string): string {\n return value\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n}\n","import type { SeedsChartOptions, SeedsChartType } from \"./chartBase\";\n\ninterface BaseChartOptionsInput {\n /** Highcharts chart/series type for the family (`column`, `line`, `area`, `pie`, …). */\n type: SeedsChartType;\n /** Accessibility description (Highcharts `accessibility.description`). */\n description: string;\n /** Appended to each tooltip value (e.g. `\" MT\"`, `\"%\"`). */\n valueSuffix?: string;\n /** Reserve top margin for content drawn above the plot area (e.g. annotation markers). */\n reserveTopMargin?: boolean;\n /**\n * Resolved IANA timezone for the chart (`time.timezone`) — governs datetime\n * ticks and the tooltip date. Pass the value from `resolveTooltipTimezone`;\n * `undefined` (a category axis) omits `time` entirely.\n */\n timezone?: string;\n}\n\n/**\n * The chart options shared by *every* v2 chart family, independent of axis type:\n * styled-mode + animation-off, the accessibility description, Highcharts' native\n * title/credits/legend disabled (Seeds renders its own legend), and the tooltip-\n * portal config. Families spread the result and add their own axes, `plotOptions`,\n * `series`, and `annotations`.\n *\n * This is the family-agnostic base layer — donut (no axes) consumes it just as\n * the X/Y families do. Axis/series/X-Y-specific sharing lives elsewhere\n * (`axisOptions` + the X/Y pattern-sharing spike), layered on top of this.\n */\nexport function buildBaseChartOptions({\n type,\n description,\n valueSuffix,\n reserveTopMargin = false,\n timezone,\n}: BaseChartOptionsInput): Pick<\n SeedsChartOptions,\n | \"chart\"\n | \"accessibility\"\n | \"title\"\n | \"credits\"\n | \"legend\"\n | \"tooltip\"\n | \"time\"\n> {\n return {\n chart: {\n type,\n styledMode: true,\n animation: false,\n ...(reserveTopMargin ? { marginTop: 24 } : {}),\n },\n accessibility: { description },\n title: { text: \"\" },\n credits: { enabled: false },\n legend: { enabled: false },\n tooltip: {\n enabled: true,\n outside: true,\n padding: 0,\n shape: \"rect\",\n shared: true,\n hideDelay: 0,\n valueSuffix,\n },\n // Chart-global in Highcharts; only meaningful for datetime axes, so it's\n // present only when a timezone was resolved (omitted for category axes).\n ...(timezone ? { time: { timezone } } : {}),\n };\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/charts/shared/chartBase.tsx","../../src/charts/shared/ChartAnnotationMarkerPortal.tsx","../../src/charts/shared/DefaultChartTooltip.tsx","../../src/charts/shared/formatters/valueFormatter.ts","../../src/charts/shared/SeriesLegend.tsx","../../src/charts/shared/chartExport.ts","../../src/charts/shared/baseChartOptions.ts"],"sourcesContent":["// Engine boundary for the v2 chart architecture. The only file under `charts/`\n// that imports from \"highcharts\". See `charts/README.md` for invariants.\n\nimport Highcharts from \"highcharts\";\nimport { HighchartsReact } from \"highcharts-react-official\";\nimport highchartsAccessibility from \"highcharts/modules/accessibility\";\nimport highchartsAnnotations from \"highcharts/modules/annotations\";\nimport highchartsExporting from \"highcharts/modules/exporting\";\nimport highchartsOfflineExporting from \"highcharts/modules/offline-exporting\";\nimport highchartsExportData from \"highcharts/modules/export-data\";\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { ChartTooltipPortal } from \"../../components/ChartTooltip/components/ChartTooltipPortal\";\nimport { transformTimeSeriesTooltipData } from \"../../helpers\";\nimport { GlobalChartStyleOverrides } from \"../../styles/chartStyles\";\nimport { ChartAnnotationMarkerPortal } from \"./ChartAnnotationMarkerPortal\";\nimport { DefaultChartTooltip } from \"./DefaultChartTooltip\";\nimport { SeriesLegend } from \"./SeriesLegend\";\nimport type { TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTheme } from \"@sproutsocial/seeds-react-theme\";\nimport { defaultFilename } from \"./chartExport\";\nimport type { ChartAnnotationLookup } from \"./annotations\";\nimport type { ValueFormat } from \"./formatters/valueFormatter\";\nimport type { ChartExportHandle } from \"./chartExport\";\nimport type { TypeChartStyleColor, TypeChartStylePattern } from \"../../types\";\n\nhighchartsAccessibility(Highcharts);\nhighchartsAnnotations(Highcharts);\n// `exporting` must register before `offline-exporting` and `export-data`, which\n// extend it. `exporting` adds a native context (hamburger) button by default;\n// `ChartRenderer` disables it on the chart options so v2 charts expose export\n// only through the `onReady` handle. Export is client-side/offline only —\n// we never call the Highcharts export server.\nhighchartsExporting(Highcharts);\nhighchartsOfflineExporting(Highcharts);\nhighchartsExportData(Highcharts);\n\n/** Highcharts series type. `column` is vertical bars; `bar` is horizontal bars; the line/area family adds the rest; `pie` is donut/pie. */\nexport type SeedsChartType =\n | \"column\"\n | \"bar\"\n | \"line\"\n | \"spline\"\n | \"area\"\n | \"areaspline\"\n | \"pie\";\n\nexport interface SeedsChartMarkerOptions {\n enabled?: boolean;\n symbol?: \"circle\";\n}\n\n/** Object form of a series point — carries an optional per-point `marker` override. */\nexport interface SeedsChartDataPoint {\n x?: number;\n y: number | null;\n marker?: SeedsChartMarkerOptions;\n}\n\nexport interface SeedsChartSeriesOptions {\n type: SeedsChartType;\n name: string;\n data: Array<number | null | [number, number | null] | SeedsChartDataPoint>;\n color?: string;\n}\n\n/**\n * Seeds-local shape of the `this` context Highcharts binds when invoking an\n * axis-label `formatter`. Models only the fields our default formatter reads\n * (`value` and `axis.tickPositions`).\n */\nexport interface SeedsAxisLabelFormatterContext {\n value: number | string;\n axis: { tickPositions?: ReadonlyArray<number> };\n}\n\nexport interface SeedsChartAxisLabelOptions {\n useHTML?: boolean;\n /** Show the axis tick labels. Maps to Highcharts' `labels.enabled`; defaults to shown. */\n enabled?: boolean;\n /** `this`-bound tick-label formatter returning the rendered string. */\n formatter?: (this: SeedsAxisLabelFormatterContext) => string;\n}\n\n/**\n * Highcharts datetime tick-label formats, keyed by the auto-selected tick unit.\n * Only the units the chart families set are modeled; Highcharts merges the rest\n * with its own defaults.\n */\nexport interface SeedsChartDateTimeLabelFormats {\n hour?: string;\n day?: string;\n week?: string;\n month?: string;\n year?: string;\n}\n\nexport interface SeedsChartAxisTitleOptions {\n text: string;\n}\n\nexport interface SeedsChartXAxisOptions {\n type?: \"category\" | \"datetime\" | \"linear\";\n categories?: Array<string>;\n crosshair?: boolean;\n min?: number;\n max?: number;\n /** Hide the axis line, ticks, and labels entirely (e.g. sparklines). Maps to Highcharts' `visible`. */\n visible?: boolean;\n labels?: SeedsChartAxisLabelOptions;\n dateTimeLabelFormats?: SeedsChartDateTimeLabelFormats;\n}\n\nexport interface SeedsChartYAxisOptions {\n min?: number;\n max?: number;\n /** Soft minimum — the axis won't start above this value, but may extend below it for negative data. */\n softMin?: number;\n /** Soft maximum — the axis won't end below this value, but may extend above it. */\n softMax?: number;\n gridLineWidth?: number;\n /** Hide the axis line, ticks, and labels entirely (e.g. sparklines). Maps to Highcharts' `visible`. */\n visible?: boolean;\n title?: SeedsChartAxisTitleOptions;\n labels?: SeedsChartAxisLabelOptions;\n /** Reference lines drawn across the plot area (e.g. the 0 baseline). `color` is only needed for the styledMode:false export clone, which can't reach scoped CSS. */\n plotLines?: Array<{\n value: number;\n className?: string;\n color?: string;\n zIndex?: number;\n }>;\n}\n\nexport interface SeedsChartTooltipOptions {\n enabled?: boolean;\n // `useHTML` is intentionally not here — it's hardcoded `true` at the engine\n // boundary (ChartRenderer) because the tooltip portal can't work without it.\n outside?: boolean;\n padding?: number;\n shape?: \"rect\" | \"callout\";\n shared?: boolean;\n hideDelay?: number;\n valueSuffix?: string;\n}\n\nexport interface SeedsChartSeriesPlotOptions {\n animation?: boolean;\n /** Stacking applied across all series. Used by the line/area family for `stacked-area`. */\n stacking?: \"normal\" | \"percent\";\n /** Point-level event wiring (e.g. click). The events shape is family-agnostic. */\n point?: { events?: SeedsChartPointEvents };\n /** Default point-marker visibility. The line/area family disables markers and re-enables them per isolated point. */\n marker?: SeedsChartMarkerOptions;\n}\n\nexport interface SeedsChartPointEventContext {\n x: number | string;\n series: {\n chart: {\n series: ReadonlyArray<{\n type: string;\n data: ReadonlyArray<{\n x: number | string;\n graphic?: { element?: Element };\n }>;\n }>;\n };\n };\n}\n\nexport interface SeedsChartPointEvents {\n mouseOver?: (this: SeedsChartPointEventContext) => void;\n mouseOut?: (this: SeedsChartPointEventContext) => void;\n click?: (event: { point: { x: number | string } }) => void;\n}\n\nexport interface SeedsChartColumnPointOptions {\n events?: SeedsChartPointEvents;\n}\n\nexport interface SeedsChartColumnPlotOptions {\n stacking?: \"normal\" | \"percent\";\n pointPadding?: number;\n groupPadding?: number;\n pointWidth?: number;\n borderRadius?: number;\n borderWidth?: number;\n point?: SeedsChartColumnPointOptions;\n}\n\n/** Type-scoped stacking for filled line-area variants (parity with `column`). */\nexport interface SeedsChartAreaPlotOptions {\n stacking?: \"normal\" | \"percent\";\n}\n\nexport interface SeedsChartPiePlotOptions {\n /** `\"60%\"` for donut (hollow center), `0` for a solid pie. */\n innerSize?: string | number;\n animation?: boolean;\n /** Must be set in JS (not CSS) — Highcharts computes the arc path before CSS is applied. */\n borderRadius?: number;\n dataLabels?: { enabled?: boolean };\n states?: { inactive?: { opacity?: number } };\n /** Pie point click: `this` is the Highcharts Point object (carries `name`, etc.). */\n point?: { events?: { click?: (this: { name: string }) => void } };\n}\n\n/** A single data point in a pie/donut series. Seeds-vocab — no Highcharts imports. */\nexport interface PiePoint {\n name: string;\n y: number | null;\n color?: string;\n}\n\n/** Series options for pie/donut charts. `data` is per-point objects, not x/y tuples. */\nexport interface SeedsChartPieSeriesOptions {\n type: \"pie\";\n name: string;\n data: Array<PiePoint>;\n color?: string;\n}\n\nexport interface SeedsChartPlotOptions {\n series?: SeedsChartSeriesPlotOptions;\n // `column` (vertical bars) and `bar` (horizontal bars) take the same option\n // shape; the bar adapter assigns one config under whichever key is active.\n column?: SeedsChartColumnPlotOptions;\n bar?: SeedsChartColumnPlotOptions;\n area?: SeedsChartAreaPlotOptions;\n areaspline?: SeedsChartAreaPlotOptions;\n pie?: SeedsChartPiePlotOptions;\n}\n\nexport interface SeedsChartChartOptions {\n type: SeedsChartType;\n styledMode?: boolean;\n animation?: boolean;\n marginTop?: number;\n height?: number;\n /** `[top, right, bottom, left]` chart spacing. Donut zeroes it so the ring fills the height; sparklines zero it so the plot fills the container. */\n spacing?: [number, number, number, number];\n}\n\nexport interface SeedsChartAnnotationLabelOptions {\n point: { x: number; y: number; xAxis: 0; yAxis: 0 };\n /** Highcharts shows a default label if this is empty; pass `\" \"` to suppress. */\n text?: string;\n}\n\n/**\n * Shared options applied to every label in a Highcharts annotation block.\n * `useHTML: true` is load-bearing — it makes Highcharts attach an HTML\n * `graphic.div` to each label, which `ChartAnnotationMarkerPortal` portals\n * React content into. Without it, labels render as SVG `<text>` and the\n * portal finds no containers.\n */\nexport interface SeedsChartAnnotationLabelOptionsShared {\n useHTML?: boolean;\n padding?: number;\n}\n\nexport interface SeedsChartAnnotationsOptions {\n labels?: SeedsChartAnnotationLabelOptions[];\n labelOptions?: SeedsChartAnnotationLabelOptionsShared;\n}\n\nexport interface SeedsChartAccessibilityOptions {\n description?: string;\n}\n\nexport interface SeedsChartTitleOptions {\n text?: string;\n}\n\nexport interface SeedsChartCreditsOptions {\n enabled?: boolean;\n}\n\nexport interface SeedsChartLegendOptions {\n enabled?: boolean;\n}\n\n/** Maps to Highcharts `time` — chart-global; `timezone` only affects datetime axes. */\nexport interface SeedsChartTimeOptions {\n timezone?: string;\n}\n\nexport interface SeedsChartOptions {\n chart?: SeedsChartChartOptions;\n accessibility?: SeedsChartAccessibilityOptions;\n title?: SeedsChartTitleOptions;\n credits?: SeedsChartCreditsOptions;\n legend?: SeedsChartLegendOptions;\n tooltip?: SeedsChartTooltipOptions;\n time?: SeedsChartTimeOptions;\n xAxis?: SeedsChartXAxisOptions;\n yAxis?: SeedsChartYAxisOptions;\n plotOptions?: SeedsChartPlotOptions;\n series?: Array<SeedsChartSeriesOptions | SeedsChartPieSeriesOptions>;\n annotations?: SeedsChartAnnotationsOptions[];\n}\n\n/**\n * A summed Total is only meaningful when the chart stacks its series (a stack\n * is, by definition, an additive composition). Returns true if any plotOptions\n * slot (series/column/bar/area/areaspline) carries a truthy `stacking`. Kept\n * key-agnostic so new stacked families are covered without changes here.\n */\nexport function isChartStacked(options: SeedsChartOptions): boolean {\n const plotOptions = options.plotOptions;\n if (!plotOptions) return false;\n return Object.values(plotOptions).some(\n (slot) =>\n slot != null &&\n typeof slot === \"object\" &&\n Boolean((slot as { stacking?: unknown }).stacking)\n );\n}\n\nexport interface SeedsChartSetupSeriesInput {\n color?: string;\n pattern?: TypeChartStylePattern;\n}\n\nexport interface UseSeedsChartSetupParams<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n> {\n series: Array<T>;\n /** Opt-in for the pattern array. Families that apply patterns (line, area) pass `true`. */\n includePatterns?: boolean;\n /**\n * Resolved effective cap (the family default, or the consumer's explicit\n * value). Series beyond it are dropped. Omit to disable capping entirely.\n */\n seriesLimit?: number;\n /**\n * Whether the consumer set `seriesLimit` explicitly. Suppresses the over-limit\n * warning (an explicit cap is intentional, not an accidental overflow).\n * Default `false`.\n */\n isSeriesLimitOverridden?: boolean;\n /** Opt out of the over-limit warning. Default `false`. */\n hideSeriesLimitWarning?: boolean;\n /** Component name used in the over-limit warning message (kept generic for future families). */\n componentName?: string;\n}\n\nexport interface UseSeedsChartSetupResult<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n> {\n theme: TypeTheme;\n colors: Array<TypeChartStyleColor>;\n patterns: Array<TypeChartStylePattern>;\n /** Series after applying the (optional) cap. Referentially equal to the input when no cap applies. */\n series: Array<T>;\n}\n\nexport function useSeedsChartSetup<\n T extends SeedsChartSetupSeriesInput = SeedsChartSetupSeriesInput\n>({\n series,\n includePatterns = false,\n seriesLimit,\n isSeriesLimitOverridden = false,\n hideSeriesLimitWarning = false,\n componentName,\n}: UseSeedsChartSetupParams<T>): UseSeedsChartSetupResult<T> {\n const theme = useTheme() as TypeTheme;\n const palette = theme.colors.DATAVIZ_COLORS_LIST;\n\n // Cap the series at the resolved limit. Memoized so the input reference is\n // preserved when no cap applies, keeping the colors/patterns memos\n // referentially stable.\n const cappedSeries = useMemo<Array<T>>(\n () =>\n seriesLimit !== undefined &&\n seriesLimit >= 1 &&\n series.length > seriesLimit\n ? series.slice(0, seriesLimit)\n : series,\n [series, seriesLimit]\n );\n\n // Warn when the limit was exceeded, was not explicitly overridden by the\n // consumer, and the warning isn't suppressed. Keyed off the gating conditions\n // so it fires when those change rather than on every render.\n useEffect(() => {\n if (\n seriesLimit !== undefined &&\n seriesLimit >= 1 &&\n series.length > seriesLimit &&\n !isSeriesLimitOverridden &&\n !hideSeriesLimitWarning &&\n componentName != null\n ) {\n console.warn(\n `${componentName}: Maximum number of series (${seriesLimit}) exceeded. Only the first ${seriesLimit} series will be displayed.`\n );\n }\n }, [\n series.length,\n seriesLimit,\n isSeriesLimitOverridden,\n hideSeriesLimitWarning,\n componentName,\n ]);\n\n const colors = useMemo<Array<TypeChartStyleColor>>(() => {\n const out: TypeChartStyleColor[] = [];\n const paletteLen = palette.length;\n for (let i = 0; i < cappedSeries.length; i++) {\n const s = cappedSeries[i]!;\n out.push(s.color ?? palette[i % paletteLen] ?? \"\");\n }\n return out;\n }, [cappedSeries, palette]);\n\n const patterns = useMemo<Array<TypeChartStylePattern>>(() => {\n if (!includePatterns) return [];\n const out: TypeChartStylePattern[] = [];\n for (let i = 0; i < cappedSeries.length; i++) {\n const s = cappedSeries[i]!;\n out.push(s.pattern ?? \"solid\");\n }\n return out;\n }, [cappedSeries, includePatterns]);\n\n return { theme, colors, patterns, series: cappedSeries };\n}\n\nexport interface ChartRendererSeries {\n name: string;\n color?: string;\n /** Seeds icon or partner-logo name rendered before the series name in the legend label. */\n icon?: TypeIconName;\n}\n\nexport interface ChartTooltipDataRow {\n color: TypeChartStyleColor;\n name: string;\n value: number | null;\n /** Slice percentage — populated by pie/donut tooltips; `undefined` for bar/line-area rows. */\n percent?: number;\n}\n\n/** Tooltip render-prop signature for v2 charts. */\nexport interface ChartTooltipProps {\n data: ChartTooltipDataRow[];\n /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */\n position: number | string;\n /** Suppress the default tooltip's title row. Set for pie/donut, which have no x-axis position — the title would just duplicate the single slice's name. */\n hideTitle?: boolean;\n /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */\n timezone?: string;\n /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */\n annotation?: {\n icon?: TypeIconName;\n color?: string;\n title?: string;\n description?: string;\n };\n /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */\n hasOnClick?: boolean;\n /** Footer content shown in the default tooltip when the chart is clickable. */\n tooltipClickLabel?: ReactNode;\n /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */\n invalidNumberLabel?: ReactNode;\n /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */\n valueFormat?: ValueFormat;\n}\n\nexport interface ChartRendererProps {\n options: SeedsChartOptions;\n series: Array<ChartRendererSeries>;\n /** Theme-aware palette resolved by `useSeedsChartSetup`. Used as the swatch color for any series that doesn't carry an explicit `color`. */\n colors: ReadonlyArray<TypeChartStyleColor>;\n /** Override for the default tooltip content. Portal is always rendered — `GlobalChartStyleOverrides` makes Highcharts' native tooltip box transparent. */\n tooltip?: (args: ChartTooltipProps) => ReactNode;\n /**\n * Resolved annotations keyed by numeric x. Drives both the in-chart marker\n * portal and the tooltip-header `annotation` injection. The family component\n * builds this map (resolving category-string positions to indices); the\n * renderer is axis-type agnostic.\n */\n annotationLookup?: ChartAnnotationLookup;\n /** Forwarded into the default tooltip so it can render the click-label footer. */\n hasOnClick?: boolean;\n /** Forwarded into the default tooltip for click-label footer rendering. */\n tooltipClickLabel?: ReactNode;\n /** Resolved chart timezone, forwarded to the tooltip so its date title matches the axis ticks. Undefined on category axes. */\n timezone?: string;\n /** Forwarded into the default tooltip as the null-value override. */\n invalidNumberLabel?: ReactNode;\n /** Forwarded into the default tooltip to format the value cell declaratively. */\n valueFormat?: ValueFormat;\n /**\n * Suppress the Seeds series legend beneath the chart. Default `false` (the\n * legend renders). Decorative charts (e.g. sparklines) pass `true` to hide it.\n */\n hideLegend?: boolean;\n /**\n * Fired once per chart instance with an opaque {@link ChartExportHandle} for\n * triggering PNG/SVG/PDF/CSV downloads. Re-fires only on a genuine remount,\n * never on data or prop updates.\n */\n onReady?: (handle: ChartExportHandle) => void;\n}\n\n/**\n * Runtime shape of one Highcharts annotation label — only the fields the\n * marker portal reads. Re-exported so the portal stays inside the engine\n * boundary (no direct \"highcharts\" import).\n */\nexport interface ChartAnnotationRuntimeLabel {\n graphic?: { div?: HTMLDivElement };\n options?: { point?: { x?: number } };\n}\n\n/** Runtime shape of one Highcharts annotation block (a group of labels). */\nexport interface ChartAnnotationRuntime {\n labels?: ChartAnnotationRuntimeLabel[];\n}\n\n/** Highcharts doesn't include the `annotations` array on its `Chart` type. */\ninterface ChartWithAnnotations extends Highcharts.Chart {\n annotations?: ChartAnnotationRuntime[];\n}\n\n/**\n * Theme→options map for the `styledMode: false` export clone, which can't see\n * the scoped CSS v2 charts normally style with. Mirrors `styles/chartStyles`.\n */\nfunction buildExportChartOptions(\n theme: TypeTheme,\n colors: ReadonlyArray<TypeChartStyleColor>\n): Highcharts.Options {\n // Line, gridline, and label styling are identical for both axes.\n const axisOptions = {\n lineColor: theme.colors.container.border.base,\n gridLineColor: theme.colors.container.border.base,\n labels: {\n style: {\n color: theme.colors.text.subtext,\n fontFamily: theme.fontFamily,\n fontSize: theme.typography[100].fontSize,\n fontWeight: String(theme.fontWeights.normal),\n },\n },\n };\n return {\n chart: {\n styledMode: false,\n backgroundColor: theme.colors.container.background.base,\n },\n // Series without an explicit `color` fall through to this palette by index.\n colors: [...colors],\n // The on-screen legend is a React sibling (`SeriesLegend`) outside the chart\n // SVG, so the export can't capture it. Turn on Highcharts' native legend for\n // the clone instead, themed to approximate the Seeds `ChartLegend` (centered\n // row of swatch + `text.subtext` label). It can't reproduce per-series Seeds\n // icons — those series show colour + name only.\n legend: {\n enabled: true,\n symbolRadius: 4,\n symbolHeight: 12,\n symbolWidth: 12,\n itemStyle: {\n color: theme.colors.text.subtext,\n fontFamily: theme.fontFamily,\n fontSize: theme.typography[200].fontSize,\n fontWeight: String(theme.fontWeights.normal),\n },\n },\n xAxis: {\n ...axisOptions,\n crosshair: {\n color: theme.colors.container.border.decorative.neutral,\n width: 1,\n },\n },\n yAxis: {\n ...axisOptions,\n // The live chart's plotLines (set by the adapter) merge with this by\n // array index, so `className`/`value`/`zIndex` survive — this only adds\n // the color the `y-axis-zero-line` CSS class can't reach in styledMode:false.\n plotLines: [\n { value: 0, color: theme.colors.container.border.decorative.neutral },\n ],\n },\n } as Highcharts.Options;\n}\n\n/**\n * Build the opaque export handle for a chart instance. Lives here — not in\n * `chartExport.ts` — because it closes over the live `Highcharts.Chart`, which\n * never leaves the engine boundary. The returned {@link ChartExportHandle} is\n * Highcharts-free.\n *\n * PDF lazy-loads jspdf + svg2pdf.js (a deferred chunk) on first use.\n */\nfunction createChartExportHandle(\n chart: Highcharts.Chart,\n getExportChartOptions: () => Highcharts.Options\n): ChartExportHandle {\n const resolveName = (filename?: string) =>\n filename ?? defaultFilename(chart.options.chart?.type, new Date());\n\n const exportImage = async (\n type: Highcharts.ExportingMimeTypeValue,\n filename?: string\n ): Promise<void> => {\n // Read options at call time, not when the handle was built: a light/dark\n // toggle updates the chart in place without re-firing `onReady`, so the\n // export must reflect the current theme. 2nd arg is deep-merged, so\n // `labels.style` here merges with the live axis `formatter`, not clobbers it.\n chart.exportChartLocal(\n { type, filename: resolveName(filename) },\n getExportChartOptions()\n );\n };\n\n return {\n exportPNG: ({ filename } = {}) => exportImage(\"image/png\", filename),\n exportSVG: ({ filename } = {}) => exportImage(\"image/svg+xml\", filename),\n exportPDF: async ({ filename } = {}): Promise<void> => {\n // Lazy-load jspdf + svg2pdf.js (deferred chunk) and expose `window.jspdf`\n // before exporting, so Highcharts' offline-exporting renders the PDF\n // locally rather than fetching the libs from its CDN.\n const { loadPdfExportLibs } = await import(\"./pdfExportLibs\");\n loadPdfExportLibs();\n await exportImage(\"application/pdf\", filename);\n },\n exportCSV: async ({ filename } = {}): Promise<void> => {\n // `downloadCSV()` reads the filename from `chart.options.exporting.filename`\n // via `getFilename()`. Set it transiently (direct mutation — no `update()`,\n // so no redraw) so the per-call override and generated default both apply,\n // then restore the previous value.\n const exporting = (chart.options.exporting ??= {});\n const previous = exporting.filename;\n exporting.filename = resolveName(filename);\n try {\n chart.downloadCSV();\n } finally {\n exporting.filename = previous;\n }\n },\n };\n}\n\nexport function ChartRenderer({\n options,\n series,\n colors,\n tooltip,\n annotationLookup,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat,\n hideLegend = false,\n onReady,\n}: ChartRendererProps) {\n const [chart, setChart] = useState<Highcharts.Chart | null>(null);\n const [plotHeight, setPlotHeight] = useState(0);\n // Wrap the default tooltip so unstacked families (line/spline, unstacked\n // area, grouped bar) suppress the summed Total, which is meaningless there.\n // When a consumer supplies `tooltip`, DefaultChartTooltip is bypassed and\n // never sees `hideTotal` — the escape hatch and public props stay untouched.\n const chartIsStacked = isChartStacked(options);\n const renderTooltip =\n tooltip ??\n ((args) => DefaultChartTooltip({ ...args, hideTotal: !chartIsStacked }));\n const theme = useTheme() as TypeTheme;\n\n // Hold the live theme + palette in a ref so the export handle reads the\n // *current* theme at call time (see `createChartExportHandle`). A dark-mode\n // toggle updates this each render without re-firing `onReady`.\n const exportThemeRef = useRef({ theme, colors });\n exportThemeRef.current = { theme, colors };\n\n // Capture only the live chart. Highcharts reuses a chart's `callback` when it\n // builds the throwaway clone for export (`new chart.constructor(options,\n // chart.callback)` in exporting/offline-exporting, with `chart.forExport:\n // true`). That clone is destroyed the instant its SVG is captured, so binding\n // React state to it would leave a destroyed chart whose next `update()` reads\n // `options.responsive` on `undefined` and throws.\n const captureChart = useCallback((chartInstance: Highcharts.Chart) => {\n const forExport = (\n chartInstance.options.chart as { forExport?: boolean } | undefined\n )?.forExport;\n if (!forExport) {\n setChart(chartInstance);\n // Seed plotHeight in the same commit as the chart so markers render with\n // it, not a frame later (the pop-in). The redraw handler keeps it current.\n setPlotHeight(chartInstance.plotHeight);\n }\n }, []);\n\n // Hold `onReady` in a ref so an inline callback (new identity each render)\n // doesn't re-fire the effect below — it should fire on instance change only.\n const onReadyRef = useRef(onReady);\n onReadyRef.current = onReady;\n\n // Fire `onReady` once per chart instance. The chart callback runs only on\n // instance creation — data/prop changes call `chart.update()` on the same\n // instance and don't re-run it — so keying on `[chart]` gives once-per-instance\n // semantics: re-fires on a genuine remount, never on a data update.\n useEffect(() => {\n if (!chart) return;\n onReadyRef.current?.(\n createChartExportHandle(chart, () =>\n buildExportChartOptions(\n exportThemeRef.current.theme,\n exportThemeRef.current.colors\n )\n )\n );\n }, [chart]);\n\n // Track the chart's actual plot-area height so the annotation marker line\n // spans it. Re-reads on Highcharts' `redraw` event (covers window resizes,\n // data updates, anything that re-lays-out the plot area).\n useEffect(() => {\n if (!chart) return;\n setPlotHeight(chart.plotHeight);\n const unbind = Highcharts.addEvent(chart, \"redraw\", () => {\n setPlotHeight(chart.plotHeight);\n });\n return () => unbind();\n }, [chart]);\n\n // Stable ref across internal re-renders (setChart/setPlotHeight): HighchartsReact\n // keys its update effect on the options ref and redraws on change, so a fresh\n // object each render would redraw — and re-flicker the annotations — every time.\n const highchartsOptions = useMemo(\n () =>\n ({\n ...options,\n // useHTML is load-bearing: the tooltip portal's target div only mounts\n // when the label renders as HTML, not SVG (see `charts/README.md`).\n tooltip: { ...options.tooltip, useHTML: true },\n // Client-side/offline export only; native context button hidden (export\n // is exposed via the `onReady` handle).\n exporting: {\n fallbackToExportServer: false,\n buttons: { contextButton: { enabled: false } },\n },\n } as Highcharts.Options),\n [options]\n );\n\n // Safety net: no series → render nothing. Families are expected to early-return\n // before calling hooks to avoid wasted work, but this guards future families\n // that forget. See `charts/README.md` (\"Empty-data handling\").\n if (series.length === 0) return null;\n\n const chartWithAnnotations = chart as ChartWithAnnotations | null;\n const hasRenderedAnnotations =\n !!chartWithAnnotations?.annotations?.length &&\n !!annotationLookup?.size &&\n plotHeight > 0;\n\n return (\n <>\n <GlobalChartStyleOverrides />\n <HighchartsReact\n highcharts={Highcharts}\n // Structural cast at the engine seam — the only place we touch Highcharts' option types.\n options={highchartsOptions}\n callback={captureChart}\n />\n {hasRenderedAnnotations ? (\n <ChartAnnotationMarkerPortal\n annotationLookup={annotationLookup}\n annotationContext={chartWithAnnotations!.annotations![0]!}\n chartContainer={chartWithAnnotations!.container}\n plotHeight={plotHeight}\n />\n ) : null}\n {chart ? (\n <ChartTooltipPortal\n chart={chart}\n renderContent={(context) => {\n // Pie context has a single `point`; time-series has a `points` array.\n // Discriminate on the absence of `points` — pie never has it.\n const ctx = context as {\n point: {\n name: string;\n y: number | null;\n color: string;\n percentage: number;\n };\n points?: unknown[];\n key?: string;\n };\n const isPie = !ctx.points;\n const data: ChartTooltipDataRow[] = isPie\n ? [\n {\n color: ctx.point.color,\n name: ctx.point.name,\n value: ctx.point.y,\n percent: ctx.point.percentage,\n },\n ]\n : // Drop v1's `readonly` array wrapper and `icon` field at the seam —\n // the v2 surface is mutable and doesn't expose row-level icons.\n transformTimeSeriesTooltipData({\n context,\n data: series.map((s, i) => ({\n name: s.name,\n points: [],\n styles: { color: s.color ?? colors[i] ?? \"\" },\n })),\n }).map((row) => ({\n color: row.color,\n name: row.name,\n value: row.value,\n }));\n // For pie, `context.x` is the numeric slice index — use `context.key`\n // (the slice name) as the tooltip title instead.\n // For time-series, `context.x` is the timestamp/category value.\n // The annotation lookup always uses `context.point.x` (numeric).\n const position = isPie\n ? ctx.key ?? ctx.point.name\n : (context.x as number | string);\n const resolved = annotationLookup?.get(context.point.x as number);\n const annotation = resolved\n ? {\n icon: resolved.icon,\n color: resolved.color,\n title: resolved.title,\n description: resolved.description,\n }\n : undefined;\n return renderTooltip({\n data,\n position,\n // Pie has no x-axis position; its title would just repeat the slice name.\n hideTitle: isPie,\n annotation,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat,\n });\n }}\n />\n ) : null}\n {hideLegend ? null : (\n <Box mt={350}>\n <SeriesLegend\n items={series.map((s, i) => ({\n name: s.name,\n icon: s.icon,\n color: s.color ?? colors[i] ?? \"\",\n }))}\n />\n </Box>\n )}\n </>\n );\n}\n","// Portals DS-owned marker content into Highcharts annotation containers. The\n// marker shape (icon + vertical line in the configured color) is rendered\n// internally — consumers don't supply React nodes. See CE-7.\n\nimport { memo, useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { Icon } from \"@sproutsocial/seeds-react-icon\";\nimport type { ChartAnnotationLookup, ChartAnnotation } from \"./annotations\";\nimport type {\n ChartAnnotationRuntime,\n ChartAnnotationRuntimeLabel,\n} from \"./chartBase\";\n\nfunction ChartAnnotationMarker({\n annotation,\n lineHeight,\n}: {\n annotation: ChartAnnotation;\n /** Vertical pixel length of the marker line. Driven by `chart.plotHeight`\n * so the line spans the chart's full plot area regardless of chart size. */\n lineHeight: number;\n}) {\n return (\n <Box display=\"flex\" flexDirection=\"column\" alignItems=\"center\" gap={200}>\n {annotation.icon ? (\n <Box\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width=\"20px\"\n height=\"20px\"\n bg=\"icon.base\"\n borderRadius=\"50%\"\n >\n <Icon name={annotation.icon} size=\"mini\" color=\"icon.inverse\" />\n </Box>\n ) : null}\n <Box\n height={`${lineHeight}px`}\n width=\"0.5px\"\n bg={annotation.color ?? \"neutral.200\"}\n />\n </Box>\n );\n}\n\n// v2-specific marker attribute. Distinct from v1's `data-annotation-marker`\n// so v1 and v2 portals don't sweep each other's containers when both render\n// side-by-side (e.g. in the v1↔v2 comparison story).\nconst MARKER_ATTR = \"data-v2-chart-annotation-marker\";\n\nexport const ChartAnnotationMarkerPortal = memo(\n function ChartAnnotationMarkerPortal({\n annotationLookup,\n annotationContext,\n chartContainer,\n plotHeight,\n }: {\n annotationLookup: ChartAnnotationLookup;\n annotationContext: ChartAnnotationRuntime;\n /** The chart's own DOM root — every query is scoped here to keep\n * multi-chart renders from interfering. */\n chartContainer: HTMLElement;\n /** Highcharts' current plot-area height in pixels. Drives the marker\n * line length so it spans the chart's plot area at any chart size. */\n plotHeight: number;\n }) {\n const annotationContainers = useRef<Record<number, HTMLDivElement>>({});\n const [, setRenderCount] = useState(0);\n const forceRender = () => setRenderCount((prev) => prev + 1);\n\n useEffect(() => {\n if (!annotationContext.labels) return;\n\n const newContainers: Record<number, HTMLDivElement> = {};\n const existingAnnotationContainers = chartContainer.querySelectorAll(\n `div[${MARKER_ATTR}='true']`\n );\n\n // 1. Mark this chart's existing markers as stale before updating.\n // Highcharts doesn't clean these up, so we sweep them below.\n existingAnnotationContainers.forEach((annotation) =>\n annotation.setAttribute(MARKER_ATTR, \"false\")\n );\n\n annotationContext.labels.forEach((label: ChartAnnotationRuntimeLabel) => {\n const labelElement = label.graphic?.div;\n if (!labelElement) return;\n\n // 2. Reuse this label's existing marker div when present — Highcharts\n // repositions (rather than recreates) annotation graphics across\n // redraws, so reusing keeps the React portal mounted and avoids the\n // teardown→recreate flash. Only create one when absent.\n let annotationDiv = labelElement.querySelector<HTMLDivElement>(\n `div[${MARKER_ATTR}]`\n );\n if (!annotationDiv) {\n annotationDiv = document.createElement(\"div\");\n labelElement.appendChild(annotationDiv);\n }\n annotationDiv.setAttribute(MARKER_ATTR, \"true\");\n\n const xValue = label.options?.point?.x as number;\n newContainers[xValue] = annotationDiv;\n });\n\n annotationContainers.current = newContainers;\n forceRender();\n\n // 4. Within this chart's container, remove `.highcharts-annotation`\n // parents that no longer have any live v2 marker child.\n requestAnimationFrame(() => {\n chartContainer\n .querySelectorAll(\"div.highcharts-annotation\")\n .forEach((annotationDiv) => {\n const reactAnnotations = annotationDiv.querySelectorAll(\n `div[${MARKER_ATTR}]`\n );\n const hasActiveAnnotations = Array.from(reactAnnotations).some(\n (div) => div.getAttribute(MARKER_ATTR) === \"true\"\n );\n if (!hasActiveAnnotations) annotationDiv.remove();\n });\n });\n }, [annotationContext.labels, annotationLookup, chartContainer]);\n\n return (\n <>\n {Object.entries(annotationContainers.current).map(\n ([xValue, container]) => {\n const annotation = annotationLookup.get(Number(xValue));\n return annotation\n ? createPortal(\n <ChartAnnotationMarker\n annotation={annotation}\n lineHeight={plotHeight}\n />,\n container\n )\n : null;\n }\n )}\n </>\n );\n }\n);\n","// Minimal: no locale / currency / duration formatting. Consumers needing those pass their own `tooltip` render prop.\n\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { Icon, type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport { Text } from \"@sproutsocial/seeds-react-text\";\n\nimport { ChartLegendLabel } from \"../../components/ChartLegend/components/ChartLegendLabel\";\nimport {\n ChartTooltip,\n ChartTooltipFooter,\n ChartTooltipHeader,\n ChartTooltipTable,\n ChartTooltipTitle,\n type TypeChartTooltipTableProps,\n} from \"../../components/ChartTooltip\";\nimport type { ChartTooltipProps } from \"./chartBase\";\nimport { valueFormatter } from \"./formatters/valueFormatter\";\n\nfunction formatTitle(position: number | string, timezone?: string): string {\n if (typeof position === \"string\") return position;\n // `timeZone` aligns the title with the chart's configured timezone (which\n // governs the axis ticks). Omitting it would format in the browser's local\n // zone and disagree with the ticks by up to a day.\n return new Date(position).toLocaleDateString(undefined, {\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n weekday: \"long\",\n timeZone: timezone,\n });\n}\n\n// Inlined (not v1's `ChartXAnnotationDetails`) because that component requires\n// both iconName and text together — v2's `ChartAnnotation` documents icon,\n// title, and description as independently optional, so the renderer has to\n// match that contract instead of dropping fields silently.\nfunction AnnotationHeader({\n icon,\n title,\n description,\n}: {\n icon?: TypeIconName;\n title?: string;\n description?: string;\n}) {\n const hasIconOrTitle = Boolean(icon || title);\n if (!hasIconOrTitle && !description) return null;\n return (\n <>\n {hasIconOrTitle ? (\n <ChartTooltipHeader>\n <Box display=\"flex\" alignItems=\"center\" gap={300}>\n {icon ? <Icon name={icon} size=\"mini\" color=\"icon.base\" /> : null}\n {title ? (\n <Text color=\"text.body\" fontSize={200}>\n {title}\n </Text>\n ) : null}\n </Box>\n </ChartTooltipHeader>\n ) : null}\n {description ? (\n <ChartTooltipHeader>\n <Text fontSize={200} color=\"text.subtext\">\n {description}\n </Text>\n </ChartTooltipHeader>\n ) : null}\n </>\n );\n}\n\n// Local to the default tooltip: `hideTotal` opts out of the multi-series Total\n// row. Kept off the shared `ChartTooltipProps` render-prop contract (and off\n// `BarChart`'s public props) intentionally — the chart sets it internally; any\n// consumer-facing tooltip config is deferred to CE-35.\ntype DefaultChartTooltipProps = ChartTooltipProps & { hideTotal?: boolean };\n\nexport function DefaultChartTooltip({\n data,\n position,\n annotation,\n hasOnClick,\n tooltipClickLabel,\n timezone,\n invalidNumberLabel,\n valueFormat = {},\n hideTitle,\n hideTotal = false,\n}: DefaultChartTooltipProps) {\n const rows = data.map((d) => {\n const formattedValue =\n d.value == null\n ? invalidNumberLabel ?? \"—\"\n : valueFormatter({ ...valueFormat, value: d.value, abbreviate: false });\n\n const nameCell = {\n content: (\n <ChartLegendLabel color={d.color}>\n <Text aria-label={`${d.name}: `}>{d.name}</Text>\n </ChartLegendLabel>\n ),\n };\n\n // When a row carries `percent` (pie/donut), show percent + value grouped\n // and flush right, matching v1's DonutChartTooltip: `inline-flex` shrinks\n // the pair to its content so the cell's `align: right` right-aligns the\n // whole group (a block `flex` stretched to fill the cell, leaving a gap\n // between percent and value — svbarker review, PR #2267). Guard NaN:\n // Highcharts emits NaN% when every slice value is null (total = 0).\n return {\n cells: [\n nameCell,\n {\n content:\n d.percent != null && !isNaN(d.percent) ? (\n <Box display=\"inline-flex\" alignItems=\"center\" gap={350}>\n <Text>{Math.round(d.percent)}%</Text>\n <Text fontWeight=\"semibold\">{formattedValue}</Text>\n </Box>\n ) : (\n <Text>{formattedValue}</Text>\n ),\n align: \"right\" as const,\n },\n ],\n };\n });\n\n // Multi-series parity with v1/Trellis: append a Total row summing the\n // contributing (non-null) values. Track contribution count separately from\n // the sum — `[5, -5]` legitimately totals 0 and must render \"0\", whereas an\n // all-null set must render the null placeholder, not a misleading 0.\n const contributing = data.filter((d) => d.value != null);\n const total =\n contributing.length > 0\n ? contributing.reduce((sum, d) => sum + (d.value as number), 0)\n : null;\n\n const totalRow =\n data.length > 1 && !hideTotal\n ? [\n {\n isAppendedRow: true,\n cells: [\n {\n content: (\n <Text fontWeight=\"semibold\" aria-label=\"Total: \">\n Total\n </Text>\n ),\n },\n {\n // Mirror the per-series value cell's formatting path exactly.\n content: (\n <Text fontWeight=\"bold\">\n {total == null\n ? invalidNumberLabel ?? \"—\"\n : valueFormatter({\n ...valueFormat,\n value: total,\n abbreviate: false,\n })}\n </Text>\n ),\n align: \"right\" as const,\n },\n ],\n },\n ]\n : [];\n\n return (\n <ChartTooltip>\n {annotation ? (\n <AnnotationHeader\n icon={annotation.icon}\n title={annotation.title}\n description={annotation.description}\n />\n ) : null}\n {hideTitle ? null : (\n <ChartTooltipTitle>{formatTitle(position, timezone)}</ChartTooltipTitle>\n )}\n <ChartTooltipTable\n rows={[...rows, ...totalRow] as TypeChartTooltipTableProps[\"rows\"]}\n />\n {hasOnClick && tooltipClickLabel ? (\n <ChartTooltipFooter>\n {typeof tooltipClickLabel === \"string\" ? (\n <Box display=\"flex\" alignItems=\"center\" gap={300}>\n <Icon name=\"hand-pointer-clicking-outline\" color=\"icon.base\" />\n <Text color=\"text.subtext\" fontSize={200}>\n {tooltipClickLabel}\n </Text>\n </Box>\n ) : (\n tooltipClickLabel\n )}\n </ChartTooltipFooter>\n ) : null}\n </ChartTooltip>\n );\n}\n","import { formatDuration } from \"@sproutsocial/seeds-react-duration\";\nimport { formatNumeral } from \"@sproutsocial/seeds-react-numeral\";\n\nimport type { TypeChartNumberFormat } from \"../../../types\";\n\nexport type TypeValuePercentInput = \"decimal\" | \"whole\";\n\nexport type TypeValueFormatterOptions = Readonly<{\n /** The raw numeric value. For duration, milliseconds. */\n value: number;\n /** default \"decimal\" */\n numberFormat?: TypeChartNumberFormat;\n /** Only used when numberFormat === \"currency\". default \"USD\" */\n currency?: string;\n /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */\n abbreviate?: boolean | number;\n /** \"decimal\" scales 0.42 → \"42%\"; \"whole\" treats 42 → \"42%\". default \"decimal\" */\n percentInput?: TypeValuePercentInput;\n /** locale for decimal/currency/percent (formatNumeral) */\n numberLocale?: Intl.LocalesArgument;\n /** locale for duration (formatDuration) */\n textLocale?: Intl.LocalesArgument;\n}>;\n\n/**\n * Pure value formatter for v2 charts. Turns a numeric value plus declarative\n * config into a display string. Composes `formatNumeral` (decimal/currency/\n * percent) and `formatDuration` (duration). Contains no chart-engine types or\n * imports — it upholds the \"engine boundary is one file\" invariant documented\n * in `src/charts/README.md`.\n *\n * The axis-wide \"smart 1k/10k\" abbreviation scan that v1's `yAxisLabelFormatter`\n * derives from `tickPositions` is not available to a pure per-value function;\n * callers pass the lowered threshold via `abbreviate` (a number) instead.\n */\nexport function valueFormatter({\n value,\n numberFormat = \"decimal\",\n currency = \"USD\",\n abbreviate = true,\n percentInput = \"decimal\",\n numberLocale,\n textLocale,\n}: TypeValueFormatterOptions): string {\n const numberValue = Number(value);\n\n // v1 parity: render 0 as a bare \"0\" for every format (clean axis origin) —\n // not \"$0.00\" / \"0%\" / a duration-zero. Matches v1's yAxisLabelFormatter,\n // which checks zero first, before any format branch. Revisit if design\n // wants per-format zero rendering later.\n if (numberValue === 0) {\n return formatNumeral({ locale: numberLocale as string, number: 0 });\n }\n\n if (numberFormat === \"duration\") {\n return formatDuration({\n display: \"narrow\",\n locale: textLocale,\n milliseconds: numberValue,\n });\n }\n\n if (numberFormat === \"percent\") {\n const whole = percentInput === \"decimal\" ? numberValue * 100 : numberValue;\n return formatNumeral({\n format: \"percent\",\n locale: numberLocale as string,\n number: whole,\n });\n }\n\n // decimal | currency\n return formatNumeral({\n abbreviate,\n currency,\n format: numberFormat,\n locale: numberLocale as string,\n number: numberValue,\n });\n}\n\n/**\n * Declarative value-format config for axis ticks and the default tooltip — the\n * full {@link TypeValueFormatterOptions} surface minus `value`, which is\n * supplied per-tick / per-row by the caller (the adapter and tooltip).\n */\nexport type ValueFormat = Omit<TypeValueFormatterOptions, \"value\">;\n","import { memo } from \"react\";\nimport { Icon, type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport { ChartLegend } from \"../../components/ChartLegend\";\nimport { ChartLegendLabelContentWithIcon } from \"../../components/ChartLegend/components/ChartLegendLabelContentWithIcon\";\n\nexport interface SeriesLegendItem {\n name: string;\n /** Resolved swatch color — caller is responsible for resolving against the active theme. */\n color: string;\n /** Seeds icon or partner-logo name rendered before the series name. */\n icon?: TypeIconName;\n}\n\nexport interface SeriesLegendProps {\n items: ReadonlyArray<SeriesLegendItem>;\n}\n\n// Internal to `ChartRenderer` — not intended for standalone use. Swatch\n// colors must be resolved by the caller (the chart base does this via\n// `useSeedsChartSetup`) so we keep a single source of truth for the\n// theme-aware palette. If this ever becomes a publicly-exposed primitive,\n// add a `useTheme()` fallback here and relax `item.color` to optional.\nexport const SeriesLegend = memo<SeriesLegendProps>(function SeriesLegend({\n items,\n}) {\n const labels = items.map((item) => ({\n content: (\n <ChartLegendLabelContentWithIcon\n icon={\n item.icon ? (\n <Icon name={item.icon} fixedWidth aria-hidden />\n ) : undefined\n }\n >\n {item.name}\n </ChartLegendLabelContentWithIcon>\n ),\n color: item.color,\n }));\n return <ChartLegend legendLabels={labels} />;\n});\n","// Public, Highcharts-free surface for the v2 chart export API. This module\n// imports nothing — it is a leaf so it can never form an import cycle with\n// `chartBase`. The `createChartExportHandle` factory that closes over the live\n// `Highcharts.Chart` lives in `chartBase.tsx` (the one file allowed to import\n// \"highcharts\"); the instance never crosses this boundary.\n//\n/**\n * Opaque export API handed to consumers via `ChartRenderer`'s `onReady`. Each\n * callable closes over the chart instance and triggers a client-side download;\n * an optional `filename` overrides the generated default. No Highcharts type,\n * ref, or method shape crosses this boundary.\n */\nexport interface ChartExportHandle {\n exportPNG: (opts?: { filename?: string }) => Promise<void>;\n exportSVG: (opts?: { filename?: string }) => Promise<void>;\n exportPDF: (opts?: { filename?: string }) => Promise<void>;\n exportCSV: (opts?: { filename?: string }) => Promise<void>;\n}\n\n/**\n * Canonical client-side export formats offered by `ChartExportMenu`. Co-located\n * with `ChartExportHandle` so the format vocabulary lives next to the handle it\n * maps onto; this leaf imports nothing, so re-exporting it carries no cycle risk.\n */\nexport type ChartExportFormat = \"png\" | \"svg\" | \"pdf\" | \"csv\";\n\n/**\n * Default download filename when a consumer doesn't pass a `filename` override:\n * `chart-<type>-<YYYY-MM-DD-HH-mm-ss>`, lowercased with non-alphanumerics\n * collapsed to hyphens. The full datetime (not just the date) avoids collisions\n * between charts exported on the same day. `type` comes from the chart's\n * `chart.type`; it falls back to `chart` when absent.\n */\nexport function defaultFilename(type: string | undefined, now: Date): string {\n const iso = now.toISOString();\n const stamp = `${iso.slice(0, 10)}-${iso.slice(11, 19).replace(/:/g, \"-\")}`;\n return slugify(type ? `chart-${type}-${stamp}` : `chart-${stamp}`);\n}\n\nfunction slugify(value: string): string {\n return value\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n}\n","import type { SeedsChartOptions, SeedsChartType } from \"./chartBase\";\n\ninterface BaseChartOptionsInput {\n /** Highcharts chart/series type for the family (`column`, `line`, `area`, `pie`, …). */\n type: SeedsChartType;\n /** Accessibility description (Highcharts `accessibility.description`). */\n description: string;\n /** Appended to each tooltip value (e.g. `\" MT\"`, `\"%\"`). */\n valueSuffix?: string;\n /** Reserve top margin for content drawn above the plot area (e.g. annotation markers). */\n reserveTopMargin?: boolean;\n /**\n * Resolved IANA timezone for the chart (`time.timezone`) — governs datetime\n * ticks and the tooltip date. Pass the value from `resolveTooltipTimezone`;\n * `undefined` (a category axis) omits `time` entirely.\n */\n timezone?: string;\n}\n\n/**\n * The chart options shared by *every* v2 chart family, independent of axis type:\n * styled-mode + animation-off, the accessibility description, Highcharts' native\n * title/credits/legend disabled (Seeds renders its own legend), and the tooltip-\n * portal config. Families spread the result and add their own axes, `plotOptions`,\n * `series`, and `annotations`.\n *\n * This is the family-agnostic base layer — donut (no axes) consumes it just as\n * the X/Y families do. Axis/series/X-Y-specific sharing lives elsewhere\n * (`axisOptions` + the X/Y pattern-sharing spike), layered on top of this.\n */\nexport function buildBaseChartOptions({\n type,\n description,\n valueSuffix,\n reserveTopMargin = false,\n timezone,\n}: BaseChartOptionsInput): Pick<\n SeedsChartOptions,\n | \"chart\"\n | \"accessibility\"\n | \"title\"\n | \"credits\"\n | \"legend\"\n | \"tooltip\"\n | \"time\"\n> {\n return {\n chart: {\n type,\n styledMode: true,\n animation: false,\n ...(reserveTopMargin ? { marginTop: 24 } : {}),\n },\n accessibility: { description },\n title: { text: \"\" },\n credits: { enabled: false },\n legend: { enabled: false },\n tooltip: {\n enabled: true,\n outside: true,\n padding: 0,\n shape: \"rect\",\n shared: true,\n hideDelay: 0,\n valueSuffix,\n },\n // Chart-global in Highcharts; only meaningful for datetime axes, so it's\n // present only when a timezone was resolved (omitted for category axes).\n ...(timezone ? { time: { timezone } } : {}),\n };\n}\n"],"mappings":"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","names":["useEffect","useRef","useState","Box","ChartAnnotationMarkerPortal","Box","Icon","Fragment","jsx","jsxs","Box","Icon","memo","Icon","jsx","memo","SeriesLegend","Icon","Fragment","jsx","jsxs","useEffect","useState","useRef","Box"]}