@sproutsocial/seeds-react-data-viz 0.16.1 → 0.17.1
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.
- package/dist/annotations-CjFoRPXf.d.mts +20 -0
- package/dist/annotations-CjFoRPXf.d.ts +20 -0
- package/dist/axis-WOeYkTO1.d.mts +44 -0
- package/dist/axis-WOeYkTO1.d.ts +44 -0
- package/dist/bar/index.d.mts +3 -1
- package/dist/bar/index.d.ts +3 -1
- package/dist/bar/index.js +15 -8
- package/dist/bar/index.js.map +1 -1
- package/dist/{axis-BVPkC6iF.d.ts → chartBase-C-l7yYGx.d.ts} +5 -59
- package/dist/{axis-BjucJt39.d.mts → chartBase-Cn_5CUJi.d.mts} +5 -59
- package/dist/chunk-6D7P3IOT.js +150 -0
- package/dist/chunk-6D7P3IOT.js.map +1 -0
- package/dist/chunk-CYQXUAJC.js +169 -0
- package/dist/chunk-CYQXUAJC.js.map +1 -0
- package/dist/{chunk-EJYDQYLE.js → chunk-HDEKK4W4.js} +101 -248
- package/dist/chunk-HDEKK4W4.js.map +1 -0
- package/dist/chunk-QKH2ZO2D.js +68 -0
- package/dist/chunk-QKH2ZO2D.js.map +1 -0
- package/dist/donut/index.d.mts +48 -0
- package/dist/donut/index.d.ts +48 -0
- package/dist/donut/index.js +125 -0
- package/dist/donut/index.js.map +1 -0
- package/dist/esm/bar/index.js +13 -6
- package/dist/esm/bar/index.js.map +1 -1
- package/dist/esm/chunk-NAKJY5PA.js +150 -0
- package/dist/esm/chunk-NAKJY5PA.js.map +1 -0
- package/dist/esm/chunk-O5VJGGZY.js +68 -0
- package/dist/esm/chunk-O5VJGGZY.js.map +1 -0
- package/dist/esm/{chunk-DKTW56NJ.js → chunk-TKNWM7L3.js} +102 -249
- package/dist/esm/chunk-TKNWM7L3.js.map +1 -0
- package/dist/esm/chunk-XMYGML25.js +169 -0
- package/dist/esm/chunk-XMYGML25.js.map +1 -0
- package/dist/esm/donut/index.js +125 -0
- package/dist/esm/donut/index.js.map +1 -0
- package/dist/esm/index.js +13 -157
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/line-area/index.js +14 -6
- package/dist/esm/line-area/index.js.map +1 -1
- package/dist/esm/sparkline/index.js +123 -0
- package/dist/esm/sparkline/index.js.map +1 -0
- package/dist/index.d.mts +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +55 -199
- package/dist/index.js.map +1 -1
- package/dist/line-area/index.d.mts +6 -3
- package/dist/line-area/index.d.ts +6 -3
- package/dist/line-area/index.js +16 -8
- package/dist/line-area/index.js.map +1 -1
- package/dist/sparkline/index.d.mts +75 -0
- package/dist/sparkline/index.d.ts +75 -0
- package/dist/sparkline/index.js +123 -0
- package/dist/sparkline/index.js.map +1 -0
- package/dist/sparkline.css +76 -0
- package/package.json +22 -11
- package/dist/chunk-EJYDQYLE.js.map +0 -1
- package/dist/esm/chunk-DKTW56NJ.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
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"]}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
|
+
|
|
3
|
+
var _chunkHDEKK4W4js = require('./chunk-HDEKK4W4.js');
|
|
4
|
+
|
|
5
|
+
// src/charts/shared/annotations.ts
|
|
6
|
+
function buildAnnotationConfig(annotations) {
|
|
7
|
+
if (!_optionalChain([annotations, 'optionalAccess', _ => _.length])) {
|
|
8
|
+
return { annotations: void 0, lookup: void 0 };
|
|
9
|
+
}
|
|
10
|
+
const labels = [];
|
|
11
|
+
const lookup = /* @__PURE__ */ new Map();
|
|
12
|
+
for (const annotation of annotations) {
|
|
13
|
+
const { position } = annotation;
|
|
14
|
+
labels.push({
|
|
15
|
+
// Highcharts anchor — always uses `x` regardless of chart orientation.
|
|
16
|
+
point: { x: position, y: 0, xAxis: 0, yAxis: 0 },
|
|
17
|
+
// Space (not empty) — Highcharts reverts to its built-in label text on empty string.
|
|
18
|
+
text: " "
|
|
19
|
+
});
|
|
20
|
+
lookup.set(position, annotation);
|
|
21
|
+
}
|
|
22
|
+
if (labels.length === 0) {
|
|
23
|
+
return { annotations: void 0, lookup: void 0 };
|
|
24
|
+
}
|
|
25
|
+
return {
|
|
26
|
+
// `useHTML: true` makes Highcharts attach an HTML `graphic.div` to each
|
|
27
|
+
// label, which the marker portal needs as its render target. `padding: 0`
|
|
28
|
+
// removes Highcharts' default left padding so markers stay centered.
|
|
29
|
+
annotations: [{ labels, labelOptions: { useHTML: true, padding: 0 } }],
|
|
30
|
+
lookup
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
// src/charts/shared/valueAxisLabelFormatter.ts
|
|
35
|
+
var _seedsreactnumeral = require('@sproutsocial/seeds-react-numeral');
|
|
36
|
+
var FIXED_LOCALE = "en-US";
|
|
37
|
+
function deriveAbbreviateFromTicks(context) {
|
|
38
|
+
const tickPositions = context.axis.tickPositions;
|
|
39
|
+
const maxValue = tickPositions && tickPositions.length > 0 ? tickPositions[tickPositions.length - 1] : void 0;
|
|
40
|
+
return typeof maxValue === "number" && maxValue > 9999 ? 1e3 : true;
|
|
41
|
+
}
|
|
42
|
+
function defaultValueAxisLabelFormatter() {
|
|
43
|
+
const numberValue = Number(this.value);
|
|
44
|
+
if (numberValue === 0) {
|
|
45
|
+
return _seedsreactnumeral.formatNumeral.call(void 0, { locale: FIXED_LOCALE, number: 0 });
|
|
46
|
+
}
|
|
47
|
+
const abbreviate = deriveAbbreviateFromTicks(this);
|
|
48
|
+
return _seedsreactnumeral.formatNumeral.call(void 0, {
|
|
49
|
+
abbreviate,
|
|
50
|
+
format: "decimal",
|
|
51
|
+
locale: FIXED_LOCALE,
|
|
52
|
+
number: numberValue
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
function makeValueAxisLabelFormatter(format) {
|
|
56
|
+
return function() {
|
|
57
|
+
const numberValue = Number(this.value);
|
|
58
|
+
const abbreviate = format.abbreviate === false ? false : deriveAbbreviateFromTicks(this);
|
|
59
|
+
return _chunkHDEKK4W4js.valueFormatter.call(void 0, { ...format, value: numberValue, abbreviate });
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
exports.buildAnnotationConfig = buildAnnotationConfig; exports.defaultValueAxisLabelFormatter = defaultValueAxisLabelFormatter; exports.makeValueAxisLabelFormatter = makeValueAxisLabelFormatter;
|
|
68
|
+
//# sourceMappingURL=chunk-QKH2ZO2D.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/chunk-QKH2ZO2D.js","../src/charts/shared/annotations.ts","../src/charts/shared/valueAxisLabelFormatter.ts"],"names":[],"mappings":"AAAA;AACE;AACF,sDAA4B;AAC5B;AACA;ACkCO,SAAS,qBAAA,CACd,WAAA,EAIA;AACA,EAAA,GAAA,CAAI,iBAAC,WAAA,2BAAa,QAAA,EAAQ;AACxB,IAAA,OAAO,EAAE,WAAA,EAAa,KAAA,CAAA,EAAW,MAAA,EAAQ,KAAA,EAAU,CAAA;AAAA,EACrD;AACA,EAAA,MAAM,OAAA,EAGA,CAAC,CAAA;AACP,EAAA,MAAM,OAAA,kBAAgC,IAAI,GAAA,CAAI,CAAA;AAC9C,EAAA,IAAA,CAAA,MAAW,WAAA,GAAc,WAAA,EAAa;AACpC,IAAA,MAAM,EAAE,SAAS,EAAA,EAAI,UAAA;AACrB,IAAA,MAAA,CAAO,IAAA,CAAK;AAAA;AAAA,MAEV,KAAA,EAAO,EAAE,CAAA,EAAG,QAAA,EAAU,CAAA,EAAG,CAAA,EAAG,KAAA,EAAO,CAAA,EAAG,KAAA,EAAO,EAAE,CAAA;AAAA;AAAA,MAE/C,IAAA,EAAM;AAAA,IACR,CAAC,CAAA;AAID,IAAA,MAAA,CAAO,GAAA,CAAI,QAAA,EAAU,UAAU,CAAA;AAAA,EACjC;AACA,EAAA,GAAA,CAAI,MAAA,CAAO,OAAA,IAAW,CAAA,EAAG;AACvB,IAAA,OAAO,EAAE,WAAA,EAAa,KAAA,CAAA,EAAW,MAAA,EAAQ,KAAA,EAAU,CAAA;AAAA,EACrD;AACA,EAAA,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,WAAA,EAAa,CAAC,EAAE,MAAA,EAAQ,YAAA,EAAc,EAAE,OAAA,EAAS,IAAA,EAAM,OAAA,EAAS,EAAE,EAAE,CAAC,CAAA;AAAA,IACrE;AAAA,EACF,CAAA;AACF;AD3CA;AACA;AEjCA,sEAA8B;AAW9B,IAAM,aAAA,EAAe,OAAA;AAWrB,SAAS,yBAAA,CACP,OAAA,EACkB;AAClB,EAAA,MAAM,cAAA,EAAgB,OAAA,CAAQ,IAAA,CAAK,aAAA;AACnC,EAAA,MAAM,SAAA,EACJ,cAAA,GAAiB,aAAA,CAAc,OAAA,EAAS,EAAA,EACpC,aAAA,CAAc,aAAA,CAAc,OAAA,EAAS,CAAC,EAAA,EACtC,KAAA,CAAA;AACN,EAAA,OAAO,OAAO,SAAA,IAAa,SAAA,GAAY,SAAA,EAAW,KAAA,EAAO,IAAA,EAAO,IAAA;AAClE;AAWO,SAAS,8BAAA,CAAA,EAEN;AACR,EAAA,MAAM,YAAA,EAAc,MAAA,CAAO,IAAA,CAAK,KAAK,CAAA;AAErC,EAAA,GAAA,CAAI,YAAA,IAAgB,CAAA,EAAG;AACrB,IAAA,OAAO,8CAAA,EAAgB,MAAA,EAAQ,YAAA,EAAc,MAAA,EAAQ,EAAE,CAAC,CAAA;AAAA,EAC1D;AAEA,EAAA,MAAM,WAAA,EAAa,yBAAA,CAA0B,IAAI,CAAA;AAEjD,EAAA,OAAO,8CAAA;AAAc,IACnB,UAAA;AAAA,IACA,MAAA,EAAQ,SAAA;AAAA,IACR,MAAA,EAAQ,YAAA;AAAA,IACR,MAAA,EAAQ;AAAA,EACV,CAAC,CAAA;AACH;AAYO,SAAS,2BAAA,CAA4B,MAAA,EAAqB;AAC/D,EAAA,OAAO,QAAA,CAAA,EAAwD;AAC7D,IAAA,MAAM,YAAA,EAAc,MAAA,CAAO,IAAA,CAAK,KAAK,CAAA;AAMrC,IAAA,MAAM,WAAA,EACJ,MAAA,CAAO,WAAA,IAAe,MAAA,EAAQ,MAAA,EAAQ,yBAAA,CAA0B,IAAI,CAAA;AAEtE,IAAA,OAAO,6CAAA,EAAiB,GAAG,MAAA,EAAQ,KAAA,EAAO,WAAA,EAAa,WAAW,CAAC,CAAA;AAAA,EACrE,CAAA;AACF;AFvBA;AACA;AACE;AACA;AACA;AACF,kMAAC","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/chunk-QKH2ZO2D.js","sourcesContent":[null,"// Shared annotation plumbing across v2 chart families. Currently consumed by\n// BarChart; v2 Line/Area will share the same `annotations` shape and reuse\n// `buildAnnotationConfig` directly. Annotation data is purely numeric —\n// the module has no knowledge of `categories`; resolving a numeric position to\n// a display name is the tooltip's job (see chartBase `renderContent`).\n\nimport type { TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport type { SeedsChartAnnotationsOptions } from \"./chartBase\";\n\n/**\n * Annotations keyed by the numeric Highcharts index. Both consumers resolve\n * numerically: the marker portal reads `label.point.x` and the tooltip reads\n * `context.point.x` (numeric on both category and datetime axes).\n */\nexport type ChartAnnotationLookup = Map<number, ChartAnnotation>;\n\n/**\n * Declarative annotation shape — the DS renders the marker and tooltip header\n * internally; consumers don't supply render functions. See CE-7.\n */\nexport interface ChartAnnotation {\n /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */\n position: number;\n /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */\n icon?: TypeIconName;\n /** Color applied to the marker's vertical line. */\n color?: string;\n /** Tooltip header line 1. */\n title?: string;\n /** Tooltip header line 2. */\n description?: string;\n}\n\n/**\n * Build the Highcharts `annotations` config and a parallel lookup keyed by the\n * numeric `position`. Both consumers (chart adapter for Highcharts, ChartRenderer\n * for the portal + tooltip) read from the same numeric lookup to stay aligned.\n */\nexport function buildAnnotationConfig(\n annotations: ChartAnnotation[] | undefined\n): {\n annotations: SeedsChartAnnotationsOptions[] | undefined;\n lookup: ChartAnnotationLookup | undefined;\n} {\n if (!annotations?.length) {\n return { annotations: undefined, lookup: undefined };\n }\n const labels: {\n point: { x: number; y: number; xAxis: 0; yAxis: 0 };\n text: string;\n }[] = [];\n const lookup: ChartAnnotationLookup = new Map();\n for (const annotation of annotations) {\n const { position } = annotation;\n labels.push({\n // Highcharts anchor — always uses `x` regardless of chart orientation.\n point: { x: position, y: 0, xAxis: 0, yAxis: 0 },\n // Space (not empty) — Highcharts reverts to its built-in label text on empty string.\n text: \" \",\n });\n // Keyed by the numeric position only. The marker portal reads\n // `label.point.x` and the tooltip reads `context.point.x` — both numeric on\n // every axis type, so no category-name keying is needed.\n lookup.set(position, annotation);\n }\n if (labels.length === 0) {\n return { annotations: undefined, lookup: undefined };\n }\n return {\n // `useHTML: true` makes Highcharts attach an HTML `graphic.div` to each\n // label, which the marker portal needs as its render target. `padding: 0`\n // removes Highcharts' default left padding so markers stay centered.\n annotations: [{ labels, labelOptions: { useHTML: true, padding: 0 } }],\n lookup,\n };\n}\n","import { formatNumeral } from \"@sproutsocial/seeds-react-numeral\";\n\nimport type { SeedsAxisLabelFormatterContext } from \"./chartBase\";\nimport { valueFormatter, type ValueFormat } from \"./formatters/valueFormatter\";\n\n/**\n * Fixed internal locale for the default value-axis formatter. Pins the en-US\n * compact symbols (2K / 1.2M / 1.2B) so output is deterministic regardless of\n * the environment's locale resolution.\n * TODO: consumer-facing locale and an override surface may be added later.\n */\nconst FIXED_LOCALE = \"en-US\";\n\n/**\n * Derive formatNumeral's `abbreviate` threshold from the axis tick scan.\n *\n * formatNumeral abbreviates above 10,000 by default; passing a numeric\n * `abbreviate` lowers that threshold to that value. When the top tick exceeds\n * 9,999 we lower it to 1,000 so the whole axis reads \"2K 4K 6K 8K 10K\" rather\n * than a mixed \"2,000 4,000 6,000 8,000 10K\". Otherwise `true` keeps the default\n * 10,000 threshold. Centralizes the 9,999 rule for both formatters below.\n */\nfunction deriveAbbreviateFromTicks(\n context: SeedsAxisLabelFormatterContext\n): boolean | number {\n const tickPositions = context.axis.tickPositions;\n const maxValue =\n tickPositions && tickPositions.length > 0\n ? tickPositions[tickPositions.length - 1]\n : undefined;\n return typeof maxValue === \"number\" && maxValue > 9999 ? 1000 : true;\n}\n\n/**\n * Internal, zero-config default value-axis label formatter for v2 chart\n * families. Abbreviates value-axis ticks (1.20K / 1.20M / 1.20B); decimal mode\n * only. Zero renders \"0\". Decimal compact precision is fixed at two fraction\n * digits, so abbreviated ticks always carry two decimals.\n *\n * Wired as a Highcharts `yAxis.labels.formatter`, invoked `this`-bound with the\n * Seeds-local context.\n */\nexport function defaultValueAxisLabelFormatter(\n this: SeedsAxisLabelFormatterContext\n): string {\n const numberValue = Number(this.value);\n\n if (numberValue === 0) {\n return formatNumeral({ locale: FIXED_LOCALE, number: 0 });\n }\n\n const abbreviate = deriveAbbreviateFromTicks(this);\n\n return formatNumeral({\n abbreviate,\n format: \"decimal\",\n locale: FIXED_LOCALE,\n number: numberValue,\n });\n}\n\n/**\n * Build a `format`-driven value-axis label formatter that runs a declarative\n * {@link ValueFormat} through the shared {@link valueFormatter}. Reuses the same\n * `tickPositions` scan as {@link defaultValueAxisLabelFormatter} so the\n * axis-wide \"smart 1k/10k\" abbreviation is preserved for decimal/currency ticks.\n *\n * Wired as a Highcharts `yAxis.labels.formatter`; invoked `this`-bound with the\n * Seeds-local context. The returned formatter never carries chart-engine types,\n * keeping the engine boundary intact.\n */\nexport function makeValueAxisLabelFormatter(format: ValueFormat) {\n return function (this: SeedsAxisLabelFormatterContext): string {\n const numberValue = Number(this.value);\n\n // Honor an explicit `abbreviate: false` opt-out; otherwise derive the\n // threshold from the same tick scan as the default formatter (abbreviation\n // only affects decimal/currency — percent and duration ignore it inside\n // valueFormatter).\n const abbreviate =\n format.abbreviate === false ? false : deriveAbbreviateFromTicks(this);\n\n return valueFormatter({ ...format, value: numberValue, abbreviate });\n };\n}\n"]}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import { TypeIconName } from '@sproutsocial/seeds-react-icon';
|
|
4
|
+
import { V as ValueFormat, C as ChartTooltipProps, a as ChartTooltipDataRow } from '../chartBase-Cn_5CUJi.mjs';
|
|
5
|
+
import { C as ChartExportHandle } from '../chartExport-CKYpuhik.mjs';
|
|
6
|
+
import '../types-DxrhdAdn.mjs';
|
|
7
|
+
import 'highcharts';
|
|
8
|
+
|
|
9
|
+
interface DonutDataPoint {
|
|
10
|
+
name: string;
|
|
11
|
+
value: number | null;
|
|
12
|
+
color?: string;
|
|
13
|
+
/** Seeds icon or partner-logo name rendered in the legend chip. */
|
|
14
|
+
icon?: TypeIconName;
|
|
15
|
+
}
|
|
16
|
+
/** A donut tooltip row — always carries `percent` (Highcharts computes it for pie series). */
|
|
17
|
+
interface DonutChartTooltipRow extends ChartTooltipDataRow {
|
|
18
|
+
percent: number;
|
|
19
|
+
}
|
|
20
|
+
/** Tooltip render-prop signature for DonutChart. `data` rows always include `percent`. */
|
|
21
|
+
interface DonutChartTooltipProps extends Omit<ChartTooltipProps, "data"> {
|
|
22
|
+
data: DonutChartTooltipRow[];
|
|
23
|
+
}
|
|
24
|
+
interface DonutChartProps {
|
|
25
|
+
/** Wired into Highcharts' `accessibility.description`. */
|
|
26
|
+
description: string;
|
|
27
|
+
data: Array<DonutDataPoint>;
|
|
28
|
+
/** Applied to the outermost container element for layout/spacing overrides. */
|
|
29
|
+
className?: string;
|
|
30
|
+
/** Replaces v1's `numberFormat`, `currency`, `numberLocale`, `textLocale`. */
|
|
31
|
+
format?: ValueFormat;
|
|
32
|
+
/** Override for the default tooltip content. Receives `DonutChartTooltipProps` including `percent` per row. */
|
|
33
|
+
tooltip?: (args: DonutChartTooltipProps) => ReactNode;
|
|
34
|
+
/** Footer content shown in the default tooltip when `onClick` is set. */
|
|
35
|
+
tooltipClickLabel?: ReactNode;
|
|
36
|
+
/** Override for the value shown when a data point is `null`. Defaults to an em-dash. */
|
|
37
|
+
invalidNumberLabel?: ReactNode;
|
|
38
|
+
/** Click handler invoked with the `name` of the clicked slice. */
|
|
39
|
+
onClick?: ({ position }: {
|
|
40
|
+
position: string;
|
|
41
|
+
}) => void;
|
|
42
|
+
/** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV exports. */
|
|
43
|
+
onReady?: (handle: ChartExportHandle) => void;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
declare const DonutChart: react.NamedExoticComponent<DonutChartProps>;
|
|
47
|
+
|
|
48
|
+
export { ChartExportHandle, DonutChart, type DonutChartProps, type DonutChartTooltipProps, type DonutChartTooltipRow, type DonutDataPoint, ValueFormat };
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import { TypeIconName } from '@sproutsocial/seeds-react-icon';
|
|
4
|
+
import { V as ValueFormat, C as ChartTooltipProps, a as ChartTooltipDataRow } from '../chartBase-C-l7yYGx.js';
|
|
5
|
+
import { C as ChartExportHandle } from '../chartExport-CKYpuhik.js';
|
|
6
|
+
import '../types-DxrhdAdn.js';
|
|
7
|
+
import 'highcharts';
|
|
8
|
+
|
|
9
|
+
interface DonutDataPoint {
|
|
10
|
+
name: string;
|
|
11
|
+
value: number | null;
|
|
12
|
+
color?: string;
|
|
13
|
+
/** Seeds icon or partner-logo name rendered in the legend chip. */
|
|
14
|
+
icon?: TypeIconName;
|
|
15
|
+
}
|
|
16
|
+
/** A donut tooltip row — always carries `percent` (Highcharts computes it for pie series). */
|
|
17
|
+
interface DonutChartTooltipRow extends ChartTooltipDataRow {
|
|
18
|
+
percent: number;
|
|
19
|
+
}
|
|
20
|
+
/** Tooltip render-prop signature for DonutChart. `data` rows always include `percent`. */
|
|
21
|
+
interface DonutChartTooltipProps extends Omit<ChartTooltipProps, "data"> {
|
|
22
|
+
data: DonutChartTooltipRow[];
|
|
23
|
+
}
|
|
24
|
+
interface DonutChartProps {
|
|
25
|
+
/** Wired into Highcharts' `accessibility.description`. */
|
|
26
|
+
description: string;
|
|
27
|
+
data: Array<DonutDataPoint>;
|
|
28
|
+
/** Applied to the outermost container element for layout/spacing overrides. */
|
|
29
|
+
className?: string;
|
|
30
|
+
/** Replaces v1's `numberFormat`, `currency`, `numberLocale`, `textLocale`. */
|
|
31
|
+
format?: ValueFormat;
|
|
32
|
+
/** Override for the default tooltip content. Receives `DonutChartTooltipProps` including `percent` per row. */
|
|
33
|
+
tooltip?: (args: DonutChartTooltipProps) => ReactNode;
|
|
34
|
+
/** Footer content shown in the default tooltip when `onClick` is set. */
|
|
35
|
+
tooltipClickLabel?: ReactNode;
|
|
36
|
+
/** Override for the value shown when a data point is `null`. Defaults to an em-dash. */
|
|
37
|
+
invalidNumberLabel?: ReactNode;
|
|
38
|
+
/** Click handler invoked with the `name` of the clicked slice. */
|
|
39
|
+
onClick?: ({ position }: {
|
|
40
|
+
position: string;
|
|
41
|
+
}) => void;
|
|
42
|
+
/** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV exports. */
|
|
43
|
+
onReady?: (handle: ChartExportHandle) => void;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
declare const DonutChart: react.NamedExoticComponent<DonutChartProps>;
|
|
47
|
+
|
|
48
|
+
export { ChartExportHandle, DonutChart, type DonutChartProps, type DonutChartTooltipProps, type DonutChartTooltipRow, type DonutDataPoint, ValueFormat };
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
|
+
|
|
3
|
+
var _chunkCYQXUAJCjs = require('../chunk-CYQXUAJC.js');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
var _chunkHDEKK4W4js = require('../chunk-HDEKK4W4.js');
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
var _chunkWEKDYQ4Tjs = require('../chunk-WEKDYQ4T.js');
|
|
12
|
+
|
|
13
|
+
// src/charts/donut/DonutChart.tsx
|
|
14
|
+
var _react = require('react');
|
|
15
|
+
|
|
16
|
+
// src/charts/donut/adapter.ts
|
|
17
|
+
function buildDonutOptions(props, colors) {
|
|
18
|
+
const base = _chunkHDEKK4W4js.buildBaseChartOptions.call(void 0, {
|
|
19
|
+
type: "pie",
|
|
20
|
+
description: props.description
|
|
21
|
+
});
|
|
22
|
+
return {
|
|
23
|
+
...base,
|
|
24
|
+
chart: {
|
|
25
|
+
type: "pie",
|
|
26
|
+
styledMode: true,
|
|
27
|
+
animation: false,
|
|
28
|
+
// Height only — width is left fluid (v1 parity) so the chart fills its
|
|
29
|
+
// container and the pie auto-centers. The container bounds the width (see
|
|
30
|
+
// styles.ts) so the legend below wraps to the donut and centers with it.
|
|
31
|
+
height: _chunkCYQXUAJCjs.DONUT_CHART_HEIGHT,
|
|
32
|
+
// Drop Highcharts' default spacing so the donut uses the full height.
|
|
33
|
+
spacing: [0, 0, 0, 0]
|
|
34
|
+
},
|
|
35
|
+
plotOptions: {
|
|
36
|
+
pie: {
|
|
37
|
+
animation: false,
|
|
38
|
+
// borderRadius must be set in JS, not CSS, because Highcharts computes
|
|
39
|
+
// the arc path before applying it — CSS border-radius has no effect.
|
|
40
|
+
borderRadius: 0,
|
|
41
|
+
dataLabels: { enabled: false },
|
|
42
|
+
innerSize: "50%",
|
|
43
|
+
...props.onClick ? {
|
|
44
|
+
point: {
|
|
45
|
+
events: {
|
|
46
|
+
click() {
|
|
47
|
+
_optionalChain([props, 'access', _ => _.onClick, 'optionalCall', _2 => _2({ position: this.name })]);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
} : {}
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
series: [
|
|
55
|
+
{
|
|
56
|
+
type: "pie",
|
|
57
|
+
name: "Data",
|
|
58
|
+
data: props.data.map((d, i) => ({
|
|
59
|
+
name: d.name,
|
|
60
|
+
y: d.value,
|
|
61
|
+
color: _nullishCoalesce(_nullishCoalesce(d.color, () => ( colors[i])), () => ( ""))
|
|
62
|
+
}))
|
|
63
|
+
}
|
|
64
|
+
]
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
// src/charts/donut/styles.ts
|
|
69
|
+
var _styledcomponents = require('styled-components'); var _styledcomponents2 = _interopRequireDefault(_styledcomponents);
|
|
70
|
+
var DonutChartContainer = _styledcomponents2.default.div`
|
|
71
|
+
background-color: ${({ theme }) => theme.colors.container.background.base};
|
|
72
|
+
${_chunkWEKDYQ4Tjs.donutChartStyles}
|
|
73
|
+
|
|
74
|
+
/* Dim non-hovered slices. Highcharts adds .highcharts-point-inactive to
|
|
75
|
+
all pie points except the hovered one. In styledMode, opacity is CSS-only
|
|
76
|
+
(JS plotOptions.states.inactive.opacity is ignored). */
|
|
77
|
+
.highcharts-pie-series .highcharts-point-inactive {
|
|
78
|
+
opacity: 0.3;
|
|
79
|
+
transition: opacity 0s;
|
|
80
|
+
}
|
|
81
|
+
`;
|
|
82
|
+
|
|
83
|
+
// src/charts/donut/DonutChart.tsx
|
|
84
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
85
|
+
var DonutChart = _react.memo.call(void 0, function DonutChart2(props) {
|
|
86
|
+
const { colors } = _chunkHDEKK4W4js.useSeedsChartSetup.call(void 0, {
|
|
87
|
+
series: props.data.map((d) => ({ color: d.color }))
|
|
88
|
+
});
|
|
89
|
+
const options = _react.useMemo.call(void 0,
|
|
90
|
+
() => buildDonutOptions(props, colors),
|
|
91
|
+
[props, colors]
|
|
92
|
+
);
|
|
93
|
+
const hasOnClick = Boolean(props.onClick);
|
|
94
|
+
const tooltip = props.tooltip ? (args) => props.tooltip(args) : void 0;
|
|
95
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
96
|
+
DonutChartContainer,
|
|
97
|
+
{
|
|
98
|
+
$colors: colors,
|
|
99
|
+
$hasOnClick: hasOnClick,
|
|
100
|
+
className: props.className,
|
|
101
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
102
|
+
_chunkHDEKK4W4js.ChartRenderer,
|
|
103
|
+
{
|
|
104
|
+
options,
|
|
105
|
+
series: props.data.map((d, i) => ({
|
|
106
|
+
name: d.name,
|
|
107
|
+
color: colors[i],
|
|
108
|
+
icon: d.icon
|
|
109
|
+
})),
|
|
110
|
+
colors,
|
|
111
|
+
tooltip,
|
|
112
|
+
hasOnClick,
|
|
113
|
+
tooltipClickLabel: props.tooltipClickLabel,
|
|
114
|
+
invalidNumberLabel: props.invalidNumberLabel,
|
|
115
|
+
valueFormat: props.format,
|
|
116
|
+
onReady: props.onReady
|
|
117
|
+
}
|
|
118
|
+
)
|
|
119
|
+
}
|
|
120
|
+
);
|
|
121
|
+
});
|
|
122
|
+
|
|
123
|
+
|
|
124
|
+
exports.DonutChart = DonutChart;
|
|
125
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/donut/index.js","../../src/charts/donut/DonutChart.tsx","../../src/charts/donut/adapter.ts","../../src/charts/donut/styles.ts"],"names":["DonutChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/donut/index.js","sourcesContent":[null,"import { memo, useMemo } from \"react\";\nimport {\n useSeedsChartSetup,\n ChartRenderer,\n type ChartTooltipProps,\n} from \"../shared/chartBase\";\nimport { buildDonutOptions } from \"./adapter\";\nimport { DonutChartContainer } from \"./styles\";\nimport type { DonutChartProps, DonutChartTooltipProps } from \"./types\";\n\nexport const DonutChart = memo(function DonutChart(props: DonutChartProps) {\n // Map each data item to { color? } so useSeedsChartSetup resolves the palette.\n const { colors } = useSeedsChartSetup({\n series: props.data.map((d) => ({ color: d.color })),\n });\n\n // Memoize to avoid spurious Highcharts redraws on parent re-renders.\n const options = useMemo(\n () => buildDonutOptions(props, colors),\n [props, colors]\n );\n const hasOnClick = Boolean(props.onClick);\n\n // `ChartRenderer` expects `(ChartTooltipProps) => ReactNode`. The consumer's\n // function expects the narrower `DonutChartTooltipProps` (required `percent`).\n // Wrap rather than cast the function type so the intent is explicit.\n const tooltip = props.tooltip\n ? (args: ChartTooltipProps) =>\n props.tooltip!(args as unknown as DonutChartTooltipProps)\n : undefined;\n\n return (\n <DonutChartContainer\n $colors={colors}\n $hasOnClick={hasOnClick}\n className={props.className}\n >\n <ChartRenderer\n options={options}\n series={props.data.map((d, i) => ({\n name: d.name,\n color: colors[i],\n icon: d.icon,\n }))}\n colors={colors}\n tooltip={tooltip}\n hasOnClick={hasOnClick}\n tooltipClickLabel={props.tooltipClickLabel}\n invalidNumberLabel={props.invalidNumberLabel}\n valueFormat={props.format}\n onReady={props.onReady}\n />\n </DonutChartContainer>\n );\n});\n","import type { SeedsChartOptions } from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport { DONUT_CHART_HEIGHT } from \"../../constants/chartOptions\";\nimport type { DonutChartProps } from \"./types\";\n\nexport function buildDonutOptions(\n props: DonutChartProps,\n colors: ReadonlyArray<string>\n): SeedsChartOptions {\n const base = buildBaseChartOptions({\n type: \"pie\",\n description: props.description,\n });\n return {\n ...base,\n chart: {\n type: \"pie\" as const,\n styledMode: true,\n animation: false,\n // Height only — width is left fluid (v1 parity) so the chart fills its\n // container and the pie auto-centers. The container bounds the width (see\n // styles.ts) so the legend below wraps to the donut and centers with it.\n height: DONUT_CHART_HEIGHT,\n // Drop Highcharts' default spacing so the donut uses the full height.\n spacing: [0, 0, 0, 0],\n },\n plotOptions: {\n pie: {\n animation: false,\n // borderRadius must be set in JS, not CSS, because Highcharts computes\n // the arc path before applying it — CSS border-radius has no effect.\n borderRadius: 0,\n dataLabels: { enabled: false },\n innerSize: \"50%\",\n ...(props.onClick\n ? {\n point: {\n events: {\n click(this: { name: string }) {\n props.onClick?.({ position: this.name });\n },\n },\n },\n }\n : {}),\n },\n },\n series: [\n {\n type: \"pie\",\n name: \"Data\",\n data: props.data.map((d, i) => ({\n name: d.name,\n y: d.value,\n color: d.color ?? colors[i] ?? \"\",\n })),\n },\n ],\n };\n}\n","import styled from \"styled-components\";\nimport { donutChartStyles } from \"../../styles/chartStyles\";\nimport type {\n TypeChartStyleColor,\n TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n $colors: ReadonlyArray<TypeChartStyleColor>;\n $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Plain styled `div` — not `Box`. Per the DS Tailwind direction (established in\n// CE-28/line-area), new components render semantic elements internally.\n//\n// No width constraint (v1 parity): the chart fills the container and the pie\n// auto-centers, while the legend centers in the same width — so the legend\n// stays on one row and centers with the donut instead of wrapping to match it.\nexport const DonutChartContainer = styled.div<StyleProps>`\n background-color: ${({ theme }) => theme.colors.container.background.base};\n ${donutChartStyles}\n\n /* Dim non-hovered slices. Highcharts adds .highcharts-point-inactive to\n all pie points except the hovered one. In styledMode, opacity is CSS-only\n (JS plotOptions.states.inactive.opacity is ignored). */\n .highcharts-pie-series .highcharts-point-inactive {\n opacity: 0.3;\n transition: opacity 0s;\n }\n`;\n"]}
|
package/dist/esm/bar/index.js
CHANGED
|
@@ -1,13 +1,17 @@
|
|
|
1
1
|
import {
|
|
2
|
-
ChartRenderer,
|
|
3
2
|
buildAnnotationConfig,
|
|
4
|
-
buildBaseChartOptions,
|
|
5
|
-
buildDimensionalAxis,
|
|
6
3
|
defaultValueAxisLabelFormatter,
|
|
7
|
-
makeValueAxisLabelFormatter
|
|
8
|
-
|
|
4
|
+
makeValueAxisLabelFormatter
|
|
5
|
+
} from "../chunk-O5VJGGZY.js";
|
|
6
|
+
import {
|
|
7
|
+
buildDimensionalAxis,
|
|
8
|
+
resolveTooltipTimezone
|
|
9
|
+
} from "../chunk-NAKJY5PA.js";
|
|
10
|
+
import {
|
|
11
|
+
ChartRenderer,
|
|
12
|
+
buildBaseChartOptions,
|
|
9
13
|
useSeedsChartSetup
|
|
10
|
-
} from "../chunk-
|
|
14
|
+
} from "../chunk-TKNWM7L3.js";
|
|
11
15
|
import {
|
|
12
16
|
timeSeriesChartStyles
|
|
13
17
|
} from "../chunk-Z4LOM4OZ.js";
|
|
@@ -82,6 +86,9 @@ function buildBarChartOptions(props, direction, series = props.series) {
|
|
|
82
86
|
min: props.yAxis?.min,
|
|
83
87
|
max: props.yAxis?.max,
|
|
84
88
|
gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,
|
|
89
|
+
// A dedicated plotLine at 0, styled distinctly from regular gridlines
|
|
90
|
+
// (see chartStyles.ts).
|
|
91
|
+
plotLines: [{ value: 0, className: "y-axis-zero-line", zIndex: 3 }],
|
|
85
92
|
title: { text: props.yAxis?.title ?? "" },
|
|
86
93
|
labels: {
|
|
87
94
|
// `showLabels` toggles tick-label visibility; defaults to shown.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/charts/bar/BarChart.tsx","../../../src/charts/bar/adapter.ts","../../../src/charts/bar/styles.ts","../../../src/charts/shared/styles.ts","../../../src/charts/constants.ts"],"sourcesContent":["import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport { BarStyledBox } from \"./styles\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n // The shared hook caps the series to the limit (and warns once per render\n // when the default is exceeded without an explicit override) so the adapter\n // and renderer below all consume the capped data.\n const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n const { colors, series } = useSeedsChartSetup({\n series: props.series,\n seriesLimit,\n isSeriesLimitOverridden: props.seriesLimit !== undefined,\n hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n componentName: \"BarChart\",\n });\n\n const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n props,\n props.direction ?? \"vertical\",\n series\n );\n const hasOnClick = Boolean(props.onClick);\n\n return (\n <BarStyledBox\n $colors={colors}\n $hasOnClick={hasOnClick}\n bg=\"container.background.base\"\n >\n <ChartRenderer\n options={options}\n series={series}\n colors={colors}\n tooltip={props.tooltip}\n annotationLookup={annotationLookup}\n hasOnClick={hasOnClick}\n tooltipClickLabel={props.tooltipClickLabel}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n valueFormat={props.yAxis?.format}\n onReady={props.onReady}\n />\n </BarStyledBox>\n );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n SeedsChartColumnPlotOptions,\n SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n defaultValueAxisLabelFormatter,\n makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n props: BarChartProps,\n direction: BarChartDirection,\n // The (already-capped) series to render. Defaults to `props.series` so the\n // ~40 existing call sites keep working; the component passes the capped\n // series from `useSeedsChartSetup` explicitly.\n series: BarChartProps[\"series\"] = props.series\n): {\n options: SeedsChartOptions;\n annotationLookup: ChartAnnotationLookup | undefined;\n /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n tooltipTimezone: string | undefined;\n} {\n const chartType = highchartsType(direction);\n const isDatetime = props.xAxis.type === \"datetime\";\n const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n props.annotations\n );\n // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n // single config is assigned under the active direction's key. Typed\n // explicitly so the `point.events` handlers below keep their `this`/`event`\n // contextual types (a computed `[chartType]` key would otherwise erase them).\n const barTypeConfig: SeedsChartColumnPlotOptions = {\n // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n // columns side-by-side when no stacking is set.\n ...(props.stacking === \"grouped\"\n ? {}\n : { stacking: props.stacking ?? \"normal\" }),\n // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n // so the same padding fractions that work for columns produce hairline bars.\n pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n // Fixed bar width on datetime axes. Sparse time-series otherwise size\n // columns from the (large) gap between points and balloon; this mirrors\n // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n ...(isDatetime ? { pointWidth: 20 } : {}),\n borderRadius: 4,\n borderWidth: 0,\n // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n // is over the chart, all bars dim; these handlers restore opacity for\n // every bar at the hovered x (so stacked/grouped bars highlight together\n // rather than just the single hovered bar).\n point: {\n events: {\n click: props.onClick\n ? (event) => props.onClick!({ position: event.point.x })\n : undefined,\n mouseOver: function () {\n const x = this.x;\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n if (point.x !== x) return;\n point.graphic?.element?.classList.add(\"bar-point-hover\");\n });\n });\n },\n mouseOut: function () {\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n point.graphic?.element?.classList.remove(\"bar-point-hover\");\n });\n });\n },\n },\n },\n };\n const options: SeedsChartOptions = {\n ...buildBaseChartOptions({\n type: chartType,\n description: props.description,\n valueSuffix: props.valueSuffix,\n reserveTopMargin: Boolean(annotations),\n timezone: tooltipTimezone,\n }),\n xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n yAxis: {\n min: props.yAxis?.min,\n max: props.yAxis?.max,\n gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n title: { text: props.yAxis?.title ?? \"\" },\n labels: {\n // `showLabels` toggles tick-label visibility; defaults to shown.\n enabled: props.yAxis?.showLabels !== false,\n // A declarative `format` drives ticks through the shared valueFormatter;\n // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n formatter: props.yAxis?.format\n ? makeValueAxisLabelFormatter(props.yAxis.format)\n : defaultValueAxisLabelFormatter,\n },\n },\n plotOptions: {\n series: { animation: false },\n [chartType]: barTypeConfig,\n },\n series: series.map((s) => ({\n type: chartType,\n name: s.name,\n data: [...s.data],\n color: s.color,\n })),\n ...(annotations ? { annotations } : {}),\n };\n\n return { options, annotationLookup, tooltipTimezone };\n}\n","import styled, { css } from \"styled-components\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { timeSeriesChartStyles } from \"../../styles/chartStyles\";\nimport { axisLabelV2Styles } from \"../shared/styles\";\nimport type {\n TypeChartStyleColor,\n TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n $colors: ReadonlyArray<TypeChartStyleColor>;\n $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Direction-neutral styling shared by the v2 bar family (vertical + horizontal).\n// Consumes only the v1 `timeSeriesChartStyles` base and owns the hover-dimming\n// block itself, keyed on the neutral `.bar-point-hover` class the adapter emits\n// — so v2 no longer imports v1 *component* styles (see `shared/styles.ts`).\nexport const barFamilyStyles = css<StyleProps>`\n ${timeSeriesChartStyles}\n\n /*\n When the chart container is hovered, dim all bars. Then restore opacity for\n the hovered bar(s) — flagged with the bar-point-hover class by the adapter —\n so the non-hovered bars fade out.\n */\n .highcharts-container:hover .highcharts-point {\n fill-opacity: 0.3;\n }\n\n .highcharts-point.bar-point-hover {\n fill-opacity: 1 !important;\n }\n`;\n\nexport const BarStyledBox = styled(Box)<StyleProps>`\n ${barFamilyStyles}\n ${axisLabelV2Styles}\n`;\n","import { css } from \"styled-components\";\n\n/**\n * v2 chart axis-label styles. v2 charts render in `styledMode` with\n * `useHTML: false`, so axis labels are SVG `<text>` / `<tspan>` rather than the\n * HTML `<span>`s v1 uses; these mirror the v1 HTML label rules in\n * `styles/chartStyles.ts` for the SVG element type.\n *\n * Kept here, separate from v1's `timeSeriesChartStyles`: v2 may *consume* the v1\n * styles, but v2-specific rules must not accrete into the v1 files — that keeps\n * the eventual v1 → v2 port clean and avoids coupling. Compose this into each v2\n * chart family's styled wrapper.\n */\nexport const axisLabelV2Styles = css`\n .highcharts-xaxis-labels,\n .highcharts-yaxis-labels {\n // SVG labels (styledMode): fill is the SVG text colour; color has no effect.\n text {\n font-family: ${({ theme }) => theme.fontFamily};\n ${({ theme }) => theme.typography[100]};\n font-weight: ${({ theme }) => theme.fontWeights.normal};\n fill: ${({ theme }) => theme.colors.text.subtext};\n }\n }\n // Two-line stacked datetime label: the boundary token is an\n // hc-axis-label-secondary tspan on a second line, rendered semibold.\n .highcharts-xaxis-labels text tspan.hc-axis-label-secondary {\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n }\n`;\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"],"mappings":";;;;;;;;;;;;;;;AAAA,SAAS,YAAY;;;ACqBrB,SAAS,eAAe,WAAgD;AACtE,SAAO,cAAc,eAAe,QAAQ;AAC9C;AAEO,SAAS,qBACd,OACA,WAIA,SAAkC,MAAM,QAMxC;AACA,QAAM,YAAY,eAAe,SAAS;AAC1C,QAAM,aAAa,MAAM,MAAM,SAAS;AACxC,QAAM,kBAAkB,uBAAuB,MAAM,OAAO,MAAM,QAAQ;AAC1E,QAAM,EAAE,aAAa,QAAQ,iBAAiB,IAAI;AAAA,IAChD,MAAM;AAAA,EACR;AAKA,QAAM,gBAA6C;AAAA;AAAA;AAAA,IAGjD,GAAI,MAAM,aAAa,YACnB,CAAC,IACD,EAAE,UAAU,MAAM,YAAY,SAAS;AAAA;AAAA;AAAA,IAG3C,cAAc,cAAc,eAAe,OAAO;AAAA,IAClD,cAAc,cAAc,eAAe,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjD,GAAI,aAAa,EAAE,YAAY,GAAG,IAAI,CAAC;AAAA,IACvC,cAAc;AAAA,IACd,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,IAKb,OAAO;AAAA,MACL,QAAQ;AAAA,QACN,OAAO,MAAM,UACT,CAAC,UAAU,MAAM,QAAS,EAAE,UAAU,MAAM,MAAM,EAAE,CAAC,IACrD;AAAA,QACJ,WAAW,WAAY;AACrB,gBAAM,IAAI,KAAK;AACf,eAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,MAAM;AACtC,gBAAI,EAAE,SAAS,UAAW;AAC1B,cAAE,KAAK,QAAQ,CAAC,UAAU;AACxB,kBAAI,MAAM,MAAM,EAAG;AACnB,oBAAM,SAAS,SAAS,UAAU,IAAI,iBAAiB;AAAA,YACzD,CAAC;AAAA,UACH,CAAC;AAAA,QACH;AAAA,QACA,UAAU,WAAY;AACpB,eAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,MAAM;AACtC,gBAAI,EAAE,SAAS,UAAW;AAC1B,cAAE,KAAK,QAAQ,CAAC,UAAU;AACxB,oBAAM,SAAS,SAAS,UAAU,OAAO,iBAAiB;AAAA,YAC5D,CAAC;AAAA,UACH,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,QAAM,UAA6B;AAAA,IACjC,GAAG,sBAAsB;AAAA,MACvB,MAAM;AAAA,MACN,aAAa,MAAM;AAAA,MACnB,aAAa,MAAM;AAAA,MACnB,kBAAkB,QAAQ,WAAW;AAAA,MACrC,UAAU;AAAA,IACZ,CAAC;AAAA,IACD,OAAO,qBAAqB,MAAM,OAAO,mBAAmB,KAAK;AAAA,IACjE,OAAO;AAAA,MACL,KAAK,MAAM,OAAO;AAAA,MAClB,KAAK,MAAM,OAAO;AAAA,MAClB,eAAe,MAAM,OAAO,kBAAkB,QAAQ,IAAI;AAAA,MAC1D,OAAO,EAAE,MAAM,MAAM,OAAO,SAAS,GAAG;AAAA,MACxC,QAAQ;AAAA;AAAA,QAEN,SAAS,MAAM,OAAO,eAAe;AAAA;AAAA;AAAA,QAGrC,WAAW,MAAM,OAAO,SACpB,4BAA4B,MAAM,MAAM,MAAM,IAC9C;AAAA,MACN;AAAA,IACF;AAAA,IACA,aAAa;AAAA,MACX,QAAQ,EAAE,WAAW,MAAM;AAAA,MAC3B,CAAC,SAAS,GAAG;AAAA,IACf;AAAA,IACA,QAAQ,OAAO,IAAI,CAAC,OAAO;AAAA,MACzB,MAAM;AAAA,MACN,MAAM,EAAE;AAAA,MACR,MAAM,CAAC,GAAG,EAAE,IAAI;AAAA,MAChB,OAAO,EAAE;AAAA,IACX,EAAE;AAAA,IACF,GAAI,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,EACvC;AAEA,SAAO,EAAE,SAAS,kBAAkB,gBAAgB;AACtD;;;ACrIA,OAAO,UAAU,OAAAA,YAAW;AAC5B,SAAS,WAAW;;;ACDpB,SAAS,WAAW;AAab,IAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA,qBAKZ,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU;AAAA,QAC5C,CAAC,EAAE,MAAM,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,qBACvB,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,MAAM;AAAA,cAC9C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,KAAK,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAMnC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;;;ADTrD,IAAM,kBAAkBC;AAAA,IAC3B,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBlB,IAAM,eAAe,OAAO,GAAG;AAAA,IAClC,eAAe;AAAA,IACf,iBAAiB;AAAA;;;AErCd,IAAM,iCAAiC;;;AJiCxC;AA1BC,IAAM,WAAW,KAAK,SAASC,UAAS,OAAsB;AAInE,QAAM,cAAc,MAAM,eAAe;AACzC,QAAM,EAAE,QAAQ,OAAO,IAAI,mBAAmB;AAAA,IAC5C,QAAQ,MAAM;AAAA,IACd;AAAA,IACA,yBAAyB,MAAM,gBAAgB;AAAA,IAC/C,wBAAwB,MAAM;AAAA,IAC9B,eAAe;AAAA,EACjB,CAAC;AAED,QAAM,EAAE,SAAS,kBAAkB,gBAAgB,IAAI;AAAA,IACrD;AAAA,IACA,MAAM,aAAa;AAAA,IACnB;AAAA,EACF;AACA,QAAM,aAAa,QAAQ,MAAM,OAAO;AAExC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,aAAa;AAAA,MACb,IAAG;AAAA,MAEH;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS,MAAM;AAAA,UACf;AAAA,UACA;AAAA,UACA,mBAAmB,MAAM;AAAA,UACzB,UAAU;AAAA,UACV,oBAAoB,MAAM;AAAA,UAC1B,aAAa,MAAM,OAAO;AAAA,UAC1B,SAAS,MAAM;AAAA;AAAA,MACjB;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["css","css","BarChart"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/charts/bar/BarChart.tsx","../../../src/charts/bar/adapter.ts","../../../src/charts/bar/styles.ts","../../../src/charts/shared/styles.ts","../../../src/charts/constants.ts"],"sourcesContent":["import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport { BarStyledBox } from \"./styles\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n // The shared hook caps the series to the limit (and warns once per render\n // when the default is exceeded without an explicit override) so the adapter\n // and renderer below all consume the capped data.\n const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n const { colors, series } = useSeedsChartSetup({\n series: props.series,\n seriesLimit,\n isSeriesLimitOverridden: props.seriesLimit !== undefined,\n hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n componentName: \"BarChart\",\n });\n\n const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n props,\n props.direction ?? \"vertical\",\n series\n );\n const hasOnClick = Boolean(props.onClick);\n\n return (\n <BarStyledBox\n $colors={colors}\n $hasOnClick={hasOnClick}\n bg=\"container.background.base\"\n >\n <ChartRenderer\n options={options}\n series={series}\n colors={colors}\n tooltip={props.tooltip}\n annotationLookup={annotationLookup}\n hasOnClick={hasOnClick}\n tooltipClickLabel={props.tooltipClickLabel}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n valueFormat={props.yAxis?.format}\n onReady={props.onReady}\n />\n </BarStyledBox>\n );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n SeedsChartColumnPlotOptions,\n SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n defaultValueAxisLabelFormatter,\n makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n props: BarChartProps,\n direction: BarChartDirection,\n // The (already-capped) series to render. Defaults to `props.series` so the\n // ~40 existing call sites keep working; the component passes the capped\n // series from `useSeedsChartSetup` explicitly.\n series: BarChartProps[\"series\"] = props.series\n): {\n options: SeedsChartOptions;\n annotationLookup: ChartAnnotationLookup | undefined;\n /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n tooltipTimezone: string | undefined;\n} {\n const chartType = highchartsType(direction);\n const isDatetime = props.xAxis.type === \"datetime\";\n const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n props.annotations\n );\n // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n // single config is assigned under the active direction's key. Typed\n // explicitly so the `point.events` handlers below keep their `this`/`event`\n // contextual types (a computed `[chartType]` key would otherwise erase them).\n const barTypeConfig: SeedsChartColumnPlotOptions = {\n // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n // columns side-by-side when no stacking is set.\n ...(props.stacking === \"grouped\"\n ? {}\n : { stacking: props.stacking ?? \"normal\" }),\n // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n // so the same padding fractions that work for columns produce hairline bars.\n pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n // Fixed bar width on datetime axes. Sparse time-series otherwise size\n // columns from the (large) gap between points and balloon; this mirrors\n // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n ...(isDatetime ? { pointWidth: 20 } : {}),\n borderRadius: 4,\n borderWidth: 0,\n // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n // is over the chart, all bars dim; these handlers restore opacity for\n // every bar at the hovered x (so stacked/grouped bars highlight together\n // rather than just the single hovered bar).\n point: {\n events: {\n click: props.onClick\n ? (event) => props.onClick!({ position: event.point.x })\n : undefined,\n mouseOver: function () {\n const x = this.x;\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n if (point.x !== x) return;\n point.graphic?.element?.classList.add(\"bar-point-hover\");\n });\n });\n },\n mouseOut: function () {\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n point.graphic?.element?.classList.remove(\"bar-point-hover\");\n });\n });\n },\n },\n },\n };\n const options: SeedsChartOptions = {\n ...buildBaseChartOptions({\n type: chartType,\n description: props.description,\n valueSuffix: props.valueSuffix,\n reserveTopMargin: Boolean(annotations),\n timezone: tooltipTimezone,\n }),\n xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n yAxis: {\n min: props.yAxis?.min,\n max: props.yAxis?.max,\n gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n // A dedicated plotLine at 0, styled distinctly from regular gridlines\n // (see chartStyles.ts).\n plotLines: [{ value: 0, className: \"y-axis-zero-line\", zIndex: 3 }],\n title: { text: props.yAxis?.title ?? \"\" },\n labels: {\n // `showLabels` toggles tick-label visibility; defaults to shown.\n enabled: props.yAxis?.showLabels !== false,\n // A declarative `format` drives ticks through the shared valueFormatter;\n // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n formatter: props.yAxis?.format\n ? makeValueAxisLabelFormatter(props.yAxis.format)\n : defaultValueAxisLabelFormatter,\n },\n },\n plotOptions: {\n series: { animation: false },\n [chartType]: barTypeConfig,\n },\n series: series.map((s) => ({\n type: chartType,\n name: s.name,\n data: [...s.data],\n color: s.color,\n })),\n ...(annotations ? { annotations } : {}),\n };\n\n return { options, annotationLookup, tooltipTimezone };\n}\n","import styled, { css } from \"styled-components\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { timeSeriesChartStyles } from \"../../styles/chartStyles\";\nimport { axisLabelV2Styles } from \"../shared/styles\";\nimport type {\n TypeChartStyleColor,\n TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n $colors: ReadonlyArray<TypeChartStyleColor>;\n $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Direction-neutral styling shared by the v2 bar family (vertical + horizontal).\n// Consumes only the v1 `timeSeriesChartStyles` base and owns the hover-dimming\n// block itself, keyed on the neutral `.bar-point-hover` class the adapter emits\n// — so v2 no longer imports v1 *component* styles (see `shared/styles.ts`).\nexport const barFamilyStyles = css<StyleProps>`\n ${timeSeriesChartStyles}\n\n /*\n When the chart container is hovered, dim all bars. Then restore opacity for\n the hovered bar(s) — flagged with the bar-point-hover class by the adapter —\n so the non-hovered bars fade out.\n */\n .highcharts-container:hover .highcharts-point {\n fill-opacity: 0.3;\n }\n\n .highcharts-point.bar-point-hover {\n fill-opacity: 1 !important;\n }\n`;\n\nexport const BarStyledBox = styled(Box)<StyleProps>`\n ${barFamilyStyles}\n ${axisLabelV2Styles}\n`;\n","import { css } from \"styled-components\";\n\n/**\n * v2 chart axis-label styles. v2 charts render in `styledMode` with\n * `useHTML: false`, so axis labels are SVG `<text>` / `<tspan>` rather than the\n * HTML `<span>`s v1 uses; these mirror the v1 HTML label rules in\n * `styles/chartStyles.ts` for the SVG element type.\n *\n * Kept here, separate from v1's `timeSeriesChartStyles`: v2 may *consume* the v1\n * styles, but v2-specific rules must not accrete into the v1 files — that keeps\n * the eventual v1 → v2 port clean and avoids coupling. Compose this into each v2\n * chart family's styled wrapper.\n */\nexport const axisLabelV2Styles = css`\n .highcharts-xaxis-labels,\n .highcharts-yaxis-labels {\n // SVG labels (styledMode): fill is the SVG text colour; color has no effect.\n text {\n font-family: ${({ theme }) => theme.fontFamily};\n ${({ theme }) => theme.typography[100]};\n font-weight: ${({ theme }) => theme.fontWeights.normal};\n fill: ${({ theme }) => theme.colors.text.subtext};\n }\n }\n // Two-line stacked datetime label: the boundary token is an\n // hc-axis-label-secondary tspan on a second line, rendered semibold.\n .highcharts-xaxis-labels text tspan.hc-axis-label-secondary {\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n }\n`;\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"],"mappings":"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","names":["css","css","BarChart"]}
|