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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,116 @@
1
+ import { ReactNode } from 'react';
2
+ import { TypeIconName } from '@sproutsocial/seeds-react-icon';
3
+ import { c as TypeChartNumberFormat, k as TypeChartStyleColor } from './types-B7ILUQ6_.mjs';
4
+
5
+ type TypeValuePercentInput = "decimal" | "whole";
6
+ type TypeValueFormatterOptions = Readonly<{
7
+ /** The raw numeric value. For duration, milliseconds. */
8
+ value: number;
9
+ /** default "decimal" */
10
+ numberFormat?: TypeChartNumberFormat;
11
+ /** Only used when numberFormat === "currency". default "USD" */
12
+ currency?: string;
13
+ /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */
14
+ abbreviate?: boolean | number;
15
+ /** "decimal" scales 0.42 → "42%"; "whole" treats 42 → "42%". default "decimal" */
16
+ percentInput?: TypeValuePercentInput;
17
+ /** locale for decimal/currency/percent (formatNumeral) */
18
+ numberLocale?: Intl.LocalesArgument;
19
+ /** locale for duration (formatDuration) */
20
+ textLocale?: Intl.LocalesArgument;
21
+ }>;
22
+ /**
23
+ * Declarative value-format config for axis ticks and the default tooltip — the
24
+ * full {@link TypeValueFormatterOptions} surface minus `value`, which is
25
+ * supplied per-tick / per-row by the caller (the adapter and tooltip).
26
+ */
27
+ type ValueFormat = Omit<TypeValueFormatterOptions, "value">;
28
+
29
+ interface ChartTooltipDataRow {
30
+ color: TypeChartStyleColor;
31
+ name: string;
32
+ value: number | null;
33
+ }
34
+ /** Tooltip render-prop signature for v2 charts. */
35
+ interface ChartTooltipProps {
36
+ data: ChartTooltipDataRow[];
37
+ /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */
38
+ position: number | string;
39
+ /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */
40
+ timezone?: string;
41
+ /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */
42
+ annotation?: {
43
+ icon?: TypeIconName;
44
+ color?: string;
45
+ title?: string;
46
+ description?: string;
47
+ };
48
+ /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */
49
+ hasOnClick?: boolean;
50
+ /** Footer content shown in the default tooltip when the chart is clickable. */
51
+ tooltipClickLabel?: ReactNode;
52
+ /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */
53
+ invalidNumberLabel?: ReactNode;
54
+ /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */
55
+ valueFormat?: ValueFormat;
56
+ }
57
+
58
+ /**
59
+ * Declarative annotation shape — the DS renders the marker and tooltip header
60
+ * internally; consumers don't supply render functions. See CE-7.
61
+ */
62
+ interface ChartAnnotation {
63
+ /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */
64
+ position: number;
65
+ /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */
66
+ icon?: TypeIconName;
67
+ /** Color applied to the marker's vertical line. */
68
+ color?: string;
69
+ /** Tooltip header line 1. */
70
+ title?: string;
71
+ /** Tooltip header line 2. */
72
+ description?: string;
73
+ }
74
+
75
+ /**
76
+ * Pure, Highcharts-free datetime axis label formatter for v2 chart families.
77
+ *
78
+ * Ports v1's `helpers/xAxisLabelFormatter` into a rendering-agnostic shape: it
79
+ * returns a `{ primary, secondary? }` object instead of an HTML string, leaving
80
+ * SVG rendering to the caller. The timezone- and DST-correct boundary detection
81
+ * (calendar parts read in the target timezone) and the per-granularity
82
+ * `Intl.DateTimeFormat` option sets are a near-verbatim port of v1.
83
+ *
84
+ * The one net-new piece versus v1 is granularity derivation: v1 receives
85
+ * `unitName` from Highcharts, but `charts/` may not depend on Highcharts types
86
+ * (see `charts/README.md` invariants), so granularity is derived from the
87
+ * spacing of `tickPositions`.
88
+ */
89
+ type DatetimeTimeFormat = "12" | "24";
90
+
91
+ /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
92
+ type DatetimePoint = [number, number | null] | {
93
+ x: number;
94
+ y: number | null;
95
+ };
96
+ /** A value on a category axis, or a datetime point when the axis is `"datetime"`. */
97
+ type ChartDataPoint = number | null | DatetimePoint;
98
+ /** Category axis — labels indexed parallel to `series.data`. The default axis type. */
99
+ interface CategoryAxis {
100
+ type?: "category";
101
+ /** Category labels, indexed parallel to `series.data`. */
102
+ categories: Array<string>;
103
+ crosshair?: boolean;
104
+ }
105
+ /** Datetime axis — `series.data` carries timestamped points. */
106
+ interface DatetimeAxis {
107
+ type: "datetime";
108
+ crosshair?: boolean;
109
+ /**
110
+ * 12- or 24-hour clock for hour-granularity tick labels (e.g. `9 AM` vs
111
+ * `09:00`). Default `"12"`. Coarser granularities (day/month/year) ignore it.
112
+ */
113
+ timeFormat?: DatetimeTimeFormat;
114
+ }
115
+
116
+ export type { ChartDataPoint as C, DatetimeAxis as D, ValueFormat as V, CategoryAxis as a, ChartTooltipProps as b, ChartAnnotation as c, DatetimePoint as d };
@@ -0,0 +1,116 @@
1
+ import { ReactNode } from 'react';
2
+ import { TypeIconName } from '@sproutsocial/seeds-react-icon';
3
+ import { c as TypeChartNumberFormat, k as TypeChartStyleColor } from './types-B7ILUQ6_.js';
4
+
5
+ type TypeValuePercentInput = "decimal" | "whole";
6
+ type TypeValueFormatterOptions = Readonly<{
7
+ /** The raw numeric value. For duration, milliseconds. */
8
+ value: number;
9
+ /** default "decimal" */
10
+ numberFormat?: TypeChartNumberFormat;
11
+ /** Only used when numberFormat === "currency". default "USD" */
12
+ currency?: string;
13
+ /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */
14
+ abbreviate?: boolean | number;
15
+ /** "decimal" scales 0.42 → "42%"; "whole" treats 42 → "42%". default "decimal" */
16
+ percentInput?: TypeValuePercentInput;
17
+ /** locale for decimal/currency/percent (formatNumeral) */
18
+ numberLocale?: Intl.LocalesArgument;
19
+ /** locale for duration (formatDuration) */
20
+ textLocale?: Intl.LocalesArgument;
21
+ }>;
22
+ /**
23
+ * Declarative value-format config for axis ticks and the default tooltip — the
24
+ * full {@link TypeValueFormatterOptions} surface minus `value`, which is
25
+ * supplied per-tick / per-row by the caller (the adapter and tooltip).
26
+ */
27
+ type ValueFormat = Omit<TypeValueFormatterOptions, "value">;
28
+
29
+ interface ChartTooltipDataRow {
30
+ color: TypeChartStyleColor;
31
+ name: string;
32
+ value: number | null;
33
+ }
34
+ /** Tooltip render-prop signature for v2 charts. */
35
+ interface ChartTooltipProps {
36
+ data: ChartTooltipDataRow[];
37
+ /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */
38
+ position: number | string;
39
+ /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */
40
+ timezone?: string;
41
+ /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */
42
+ annotation?: {
43
+ icon?: TypeIconName;
44
+ color?: string;
45
+ title?: string;
46
+ description?: string;
47
+ };
48
+ /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */
49
+ hasOnClick?: boolean;
50
+ /** Footer content shown in the default tooltip when the chart is clickable. */
51
+ tooltipClickLabel?: ReactNode;
52
+ /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */
53
+ invalidNumberLabel?: ReactNode;
54
+ /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */
55
+ valueFormat?: ValueFormat;
56
+ }
57
+
58
+ /**
59
+ * Declarative annotation shape — the DS renders the marker and tooltip header
60
+ * internally; consumers don't supply render functions. See CE-7.
61
+ */
62
+ interface ChartAnnotation {
63
+ /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */
64
+ position: number;
65
+ /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */
66
+ icon?: TypeIconName;
67
+ /** Color applied to the marker's vertical line. */
68
+ color?: string;
69
+ /** Tooltip header line 1. */
70
+ title?: string;
71
+ /** Tooltip header line 2. */
72
+ description?: string;
73
+ }
74
+
75
+ /**
76
+ * Pure, Highcharts-free datetime axis label formatter for v2 chart families.
77
+ *
78
+ * Ports v1's `helpers/xAxisLabelFormatter` into a rendering-agnostic shape: it
79
+ * returns a `{ primary, secondary? }` object instead of an HTML string, leaving
80
+ * SVG rendering to the caller. The timezone- and DST-correct boundary detection
81
+ * (calendar parts read in the target timezone) and the per-granularity
82
+ * `Intl.DateTimeFormat` option sets are a near-verbatim port of v1.
83
+ *
84
+ * The one net-new piece versus v1 is granularity derivation: v1 receives
85
+ * `unitName` from Highcharts, but `charts/` may not depend on Highcharts types
86
+ * (see `charts/README.md` invariants), so granularity is derived from the
87
+ * spacing of `tickPositions`.
88
+ */
89
+ type DatetimeTimeFormat = "12" | "24";
90
+
91
+ /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
92
+ type DatetimePoint = [number, number | null] | {
93
+ x: number;
94
+ y: number | null;
95
+ };
96
+ /** A value on a category axis, or a datetime point when the axis is `"datetime"`. */
97
+ type ChartDataPoint = number | null | DatetimePoint;
98
+ /** Category axis — labels indexed parallel to `series.data`. The default axis type. */
99
+ interface CategoryAxis {
100
+ type?: "category";
101
+ /** Category labels, indexed parallel to `series.data`. */
102
+ categories: Array<string>;
103
+ crosshair?: boolean;
104
+ }
105
+ /** Datetime axis — `series.data` carries timestamped points. */
106
+ interface DatetimeAxis {
107
+ type: "datetime";
108
+ crosshair?: boolean;
109
+ /**
110
+ * 12- or 24-hour clock for hour-granularity tick labels (e.g. `9 AM` vs
111
+ * `09:00`). Default `"12"`. Coarser granularities (day/month/year) ignore it.
112
+ */
113
+ timeFormat?: DatetimeTimeFormat;
114
+ }
115
+
116
+ export type { ChartDataPoint as C, DatetimeAxis as D, ValueFormat as V, CategoryAxis as a, ChartTooltipProps as b, ChartAnnotation as c, DatetimePoint as d };
@@ -1,131 +1,16 @@
1
1
  import * as react from 'react';
2
2
  import { ReactNode } from 'react';
3
3
  import { TypeIconName } from '@sproutsocial/seeds-react-icon';
4
- import { c as TypeChartNumberFormat, k as TypeChartStyleColor } from '../types-B7ILUQ6_.mjs';
4
+ import { C as ChartDataPoint, a as CategoryAxis, D as DatetimeAxis, V as ValueFormat, b as ChartTooltipProps, c as ChartAnnotation, d as DatetimePoint } from '../axis-DXzufRRj.mjs';
5
5
  import { C as ChartExportHandle } from '../chartExport-CKYpuhik.mjs';
6
+ import '../types-B7ILUQ6_.mjs';
6
7
  import 'highcharts';
7
8
 
8
- type TypeValuePercentInput = "decimal" | "whole";
9
- type TypeValueFormatterOptions = Readonly<{
10
- /** The raw numeric value. For duration, milliseconds. */
11
- value: number;
12
- /** default "decimal" */
13
- numberFormat?: TypeChartNumberFormat;
14
- /** Only used when numberFormat === "currency". default "USD" */
15
- currency?: string;
16
- /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */
17
- abbreviate?: boolean | number;
18
- /** "decimal" scales 0.42 → "42%"; "whole" treats 42 → "42%". default "decimal" */
19
- percentInput?: TypeValuePercentInput;
20
- /** locale for decimal/currency/percent (formatNumeral) */
21
- numberLocale?: Intl.LocalesArgument;
22
- /** locale for duration (formatDuration) */
23
- textLocale?: Intl.LocalesArgument;
24
- }>;
25
- /**
26
- * Declarative value-format config for axis ticks and the default tooltip — the
27
- * full {@link TypeValueFormatterOptions} surface minus `value`, which is
28
- * supplied per-tick / per-row by the caller (the adapter and tooltip).
29
- */
30
- type ValueFormat = Omit<TypeValueFormatterOptions, "value">;
31
-
32
- interface ChartTooltipDataRow {
33
- color: TypeChartStyleColor;
34
- name: string;
35
- value: number | null;
36
- }
37
- /** Tooltip render-prop signature for v2 charts. */
38
- interface ChartTooltipProps {
39
- data: ChartTooltipDataRow[];
40
- /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */
41
- position: number | string;
42
- /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */
43
- timezone?: string;
44
- /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */
45
- annotation?: {
46
- icon?: TypeIconName;
47
- color?: string;
48
- title?: string;
49
- description?: string;
50
- };
51
- /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */
52
- hasOnClick?: boolean;
53
- /** Footer content shown in the default tooltip when the chart is clickable. */
54
- tooltipClickLabel?: ReactNode;
55
- /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */
56
- invalidNumberLabel?: ReactNode;
57
- /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */
58
- valueFormat?: ValueFormat;
59
- }
60
-
61
- /**
62
- * Declarative annotation shape — the DS renders the marker and tooltip header
63
- * internally; consumers don't supply render functions. See CE-7.
64
- */
65
- interface ChartAnnotation {
66
- /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */
67
- position: number;
68
- /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */
69
- icon?: TypeIconName;
70
- /** Color applied to the marker's vertical line. */
71
- color?: string;
72
- /** Tooltip header line 1. */
73
- title?: string;
74
- /** Tooltip header line 2. */
75
- description?: string;
76
- }
77
-
78
- /**
79
- * Pure, Highcharts-free datetime axis label formatter for v2 chart families.
80
- *
81
- * Ports v1's `helpers/xAxisLabelFormatter` into a rendering-agnostic shape: it
82
- * returns a `{ primary, secondary? }` object instead of an HTML string, leaving
83
- * SVG rendering to the caller. The timezone- and DST-correct boundary detection
84
- * (calendar parts read in the target timezone) and the per-granularity
85
- * `Intl.DateTimeFormat` option sets are a near-verbatim port of v1.
86
- *
87
- * The one net-new piece versus v1 is granularity derivation: v1 receives
88
- * `unitName` from Highcharts, but `charts/` may not depend on Highcharts types
89
- * (see `charts/README.md` invariants), so granularity is derived from the
90
- * spacing of `tickPositions`.
91
- */
92
- type DatetimeTimeFormat = "12" | "24";
93
-
94
- /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
95
- type DatetimePoint = [number, number | null] | {
96
- x: number;
97
- y: number | null;
98
- };
99
- /** A value on a category axis, or a datetime point when the axis is `"datetime"`. */
100
- type ChartDataPoint = number | null | DatetimePoint;
101
- /** Category axis — labels indexed parallel to `series.data`. The default axis type. */
102
- interface CategoryAxis {
103
- type?: "category";
104
- /** Category labels, indexed parallel to `series.data`. */
105
- categories: Array<string>;
106
- crosshair?: boolean;
107
- }
108
- /** Datetime axis — `series.data` carries timestamped points. */
109
- interface DatetimeAxis {
110
- type: "datetime";
111
- crosshair?: boolean;
112
- /**
113
- * 12- or 24-hour clock for hour-granularity tick labels (e.g. `9 AM` vs
114
- * `09:00`). Default `"12"`. Coarser granularities (day/month/year) ignore it.
115
- */
116
- timeFormat?: DatetimeTimeFormat;
117
- }
118
-
119
- /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
120
9
  type BarDatetimePoint = DatetimePoint;
121
- /** A category y-value, or a datetime point when the dimensional axis is `"datetime"`. */
122
10
  type BarDataPoint = ChartDataPoint;
123
11
  interface BarSeries {
124
12
  name: string;
125
- /**
126
- * Y-values indexed parallel to `xAxis.categories` on a category axis, or
127
- * `[timestamp, value]` / `{ x, y }` points on a datetime axis.
128
- */
13
+ /** Y-values for each category, or `[timestamp, value]` / `{ x, y }` points on a datetime axis. */
129
14
  data: Array<BarDataPoint>;
130
15
  color?: string;
131
16
  /** Seeds icon or partner-logo name rendered before the series name in the legend. */
@@ -138,48 +23,27 @@ interface BarYAxis {
138
23
  /** Default: true. */
139
24
  showGridLines?: boolean;
140
25
  title?: string;
141
- /**
142
- * Declarative value formatting applied to y-axis tick labels and the default
143
- * tooltip value. Omit for the zero-config decimal default (smart 1k/10k
144
- * abbreviation on the axis, raw values in the tooltip).
145
- */
26
+ /** Declarative value formatting for axis tick labels and tooltip values. */
146
27
  format?: ValueFormat;
147
- /**
148
- * Show y-axis tick labels. Default `true`. `false` hides them (maps to
149
- * Highcharts' `labels.enabled`, replacing v1's `() => ""` formatter trick).
150
- */
28
+ /** Show y-axis tick labels. Default `true`. */
151
29
  showLabels?: boolean;
152
30
  }
153
- /**
154
- * Direction in which bars are drawn. Single-member union for now; expands to
155
- * `"vertical" | "horizontal"` when `HorizontalBarChart` ships.
156
- */
157
- type BarChartDirection = "vertical";
31
+ type BarChartDirection = "vertical" | "horizontal";
158
32
  interface BarChartProps {
159
33
  /** Wired into Highcharts' `accessibility.description`. */
160
34
  description: string;
161
35
  series: Array<BarSeries>;
162
- /**
163
- * Maximum number of series to display. Series beyond the limit are dropped to
164
- * keep the chart readable and accessible. Default `10`.
165
- */
36
+ /** Orientation of the bars. `"vertical"` (default) renders columns; `"horizontal"` renders bars. */
37
+ direction?: BarChartDirection;
38
+ /** Maximum number of series to display. Series beyond the limit are dropped. Default `10`. */
166
39
  seriesLimit?: number;
167
- /**
168
- * Suppress the `console.warn` emitted when the series count exceeds the limit.
169
- * The cap still applies. Default `false`.
170
- */
40
+ /** Suppress the `console.warn` when series count exceeds the limit. The cap still applies. Default `false`. */
171
41
  hideSeriesLimitWarning?: boolean;
172
42
  xAxis: BarXAxis;
173
43
  yAxis?: BarYAxis;
174
44
  /** IANA timezone for datetime-axis ticks and tooltips. Default `"UTC"`. Ignored for category axes. */
175
45
  timezone?: string;
176
- /**
177
- * Stacking mode for multi-series charts. Defaults to `"normal"` — the
178
- * canonical design-system spec renders multi-series bar charts as a single
179
- * stacked column per category. `"percent"` normalizes each column to 100%.
180
- * `"grouped"` renders series as adjacent bars per category; not part of the
181
- * canonical spec, but available for non-standard use cases.
182
- */
46
+ /** Stacking mode. `"normal"` stacks series (default); `"percent"` normalizes to 100%; `"grouped"` renders adjacent bars. */
183
47
  stacking?: "normal" | "percent" | "grouped";
184
48
  /** Appended to each tooltip value (e.g., `" MT"`, `"%"`). */
185
49
  valueSuffix?: string;
@@ -187,22 +51,18 @@ interface BarChartProps {
187
51
  tooltip?: (args: ChartTooltipProps) => ReactNode;
188
52
  /** Declarative annotations rendered at positions on the chart. */
189
53
  annotations?: ChartAnnotation[];
190
- /** Click handler invoked with the dimensional-axis value of the clicked column — the category name on a category axis, the numeric timestamp on a datetime axis. `position` is direction-agnostic: the x-axis value on `VerticalBarChart`, the y-axis value on `HorizontalBarChart`. */
54
+ /** Click handler invoked with the category name or timestamp of the clicked bar. */
191
55
  onClick?: ({ position }: {
192
56
  position: number | string;
193
57
  }) => void;
194
58
  /** Footer content shown in the default tooltip when `onClick` is set. */
195
59
  tooltipClickLabel?: ReactNode;
196
- /** Override for the value shown when a data point is invalid/missing (null). Defaults to an em-dash. */
60
+ /** Override for the value shown when a data point is null. Defaults to an em-dash. */
197
61
  invalidNumberLabel?: ReactNode;
198
- /**
199
- * Fired once per chart instance with an opaque {@link ChartExportHandle} for
200
- * triggering PNG/SVG/PDF/CSV downloads. Re-fires only on a genuine remount,
201
- * never on data or prop updates.
202
- */
62
+ /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV downloads. Re-fires only on remount. */
203
63
  onReady?: (handle: ChartExportHandle) => void;
204
64
  }
205
65
 
206
- declare const VerticalBarChart: react.NamedExoticComponent<BarChartProps>;
66
+ declare const BarChart: react.NamedExoticComponent<BarChartProps>;
207
67
 
208
- export { type BarChartDirection, type BarChartProps, type BarDataPoint, type BarDatetimePoint, type BarSeries, type BarXAxis, type BarYAxis, type CategoryAxis, ChartExportHandle, type DatetimeAxis, type ValueFormat, VerticalBarChart };
68
+ export { BarChart, type BarChartDirection, type BarChartProps, type BarDataPoint, type BarDatetimePoint, type BarSeries, type BarXAxis, type BarYAxis, CategoryAxis, ChartExportHandle, DatetimeAxis, ValueFormat };
@@ -1,131 +1,16 @@
1
1
  import * as react from 'react';
2
2
  import { ReactNode } from 'react';
3
3
  import { TypeIconName } from '@sproutsocial/seeds-react-icon';
4
- import { c as TypeChartNumberFormat, k as TypeChartStyleColor } from '../types-B7ILUQ6_.js';
4
+ import { C as ChartDataPoint, a as CategoryAxis, D as DatetimeAxis, V as ValueFormat, b as ChartTooltipProps, c as ChartAnnotation, d as DatetimePoint } from '../axis-PJwu5Xmo.js';
5
5
  import { C as ChartExportHandle } from '../chartExport-CKYpuhik.js';
6
+ import '../types-B7ILUQ6_.js';
6
7
  import 'highcharts';
7
8
 
8
- type TypeValuePercentInput = "decimal" | "whole";
9
- type TypeValueFormatterOptions = Readonly<{
10
- /** The raw numeric value. For duration, milliseconds. */
11
- value: number;
12
- /** default "decimal" */
13
- numberFormat?: TypeChartNumberFormat;
14
- /** Only used when numberFormat === "currency". default "USD" */
15
- currency?: string;
16
- /** true → 10k threshold; number → max(1000, abs(n)); false → never. default true */
17
- abbreviate?: boolean | number;
18
- /** "decimal" scales 0.42 → "42%"; "whole" treats 42 → "42%". default "decimal" */
19
- percentInput?: TypeValuePercentInput;
20
- /** locale for decimal/currency/percent (formatNumeral) */
21
- numberLocale?: Intl.LocalesArgument;
22
- /** locale for duration (formatDuration) */
23
- textLocale?: Intl.LocalesArgument;
24
- }>;
25
- /**
26
- * Declarative value-format config for axis ticks and the default tooltip — the
27
- * full {@link TypeValueFormatterOptions} surface minus `value`, which is
28
- * supplied per-tick / per-row by the caller (the adapter and tooltip).
29
- */
30
- type ValueFormat = Omit<TypeValueFormatterOptions, "value">;
31
-
32
- interface ChartTooltipDataRow {
33
- color: TypeChartStyleColor;
34
- name: string;
35
- value: number | null;
36
- }
37
- /** Tooltip render-prop signature for v2 charts. */
38
- interface ChartTooltipProps {
39
- data: ChartTooltipDataRow[];
40
- /** Resolved x-axis position. Category name for category axes, numeric for time/linear. */
41
- position: number | string;
42
- /** Resolved chart timezone — pass to date formatters when `position` is a numeric timestamp. Undefined on category axes. */
43
- timezone?: string;
44
- /** Declarative annotation anchored at this position, if any. Rendered in the tooltip header. */
45
- annotation?: {
46
- icon?: TypeIconName;
47
- color?: string;
48
- title?: string;
49
- description?: string;
50
- };
51
- /** True when the chart has an `onClick` handler — used by the default tooltip to render the click-label footer. */
52
- hasOnClick?: boolean;
53
- /** Footer content shown in the default tooltip when the chart is clickable. */
54
- tooltipClickLabel?: ReactNode;
55
- /** Content shown in place of a row's value when the value is null. Defaults to an em-dash. */
56
- invalidNumberLabel?: ReactNode;
57
- /** Declarative value format for the tooltip value cell. Omit for raw rendering. Applied at full precision (abbreviation off). */
58
- valueFormat?: ValueFormat;
59
- }
60
-
61
- /**
62
- * Declarative annotation shape — the DS renders the marker and tooltip header
63
- * internally; consumers don't supply render functions. See CE-7.
64
- */
65
- interface ChartAnnotation {
66
- /** Numeric x-axis coordinate — a category index (category axes) or the raw coordinate (datetime/linear axes). */
67
- position: number;
68
- /** Icon shown above the chart at `position` and inline with `title` in the tooltip header. */
69
- icon?: TypeIconName;
70
- /** Color applied to the marker's vertical line. */
71
- color?: string;
72
- /** Tooltip header line 1. */
73
- title?: string;
74
- /** Tooltip header line 2. */
75
- description?: string;
76
- }
77
-
78
- /**
79
- * Pure, Highcharts-free datetime axis label formatter for v2 chart families.
80
- *
81
- * Ports v1's `helpers/xAxisLabelFormatter` into a rendering-agnostic shape: it
82
- * returns a `{ primary, secondary? }` object instead of an HTML string, leaving
83
- * SVG rendering to the caller. The timezone- and DST-correct boundary detection
84
- * (calendar parts read in the target timezone) and the per-granularity
85
- * `Intl.DateTimeFormat` option sets are a near-verbatim port of v1.
86
- *
87
- * The one net-new piece versus v1 is granularity derivation: v1 receives
88
- * `unitName` from Highcharts, but `charts/` may not depend on Highcharts types
89
- * (see `charts/README.md` invariants), so granularity is derived from the
90
- * spacing of `tickPositions`.
91
- */
92
- type DatetimeTimeFormat = "12" | "24";
93
-
94
- /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
95
- type DatetimePoint = [number, number | null] | {
96
- x: number;
97
- y: number | null;
98
- };
99
- /** A value on a category axis, or a datetime point when the axis is `"datetime"`. */
100
- type ChartDataPoint = number | null | DatetimePoint;
101
- /** Category axis — labels indexed parallel to `series.data`. The default axis type. */
102
- interface CategoryAxis {
103
- type?: "category";
104
- /** Category labels, indexed parallel to `series.data`. */
105
- categories: Array<string>;
106
- crosshair?: boolean;
107
- }
108
- /** Datetime axis — `series.data` carries timestamped points. */
109
- interface DatetimeAxis {
110
- type: "datetime";
111
- crosshair?: boolean;
112
- /**
113
- * 12- or 24-hour clock for hour-granularity tick labels (e.g. `9 AM` vs
114
- * `09:00`). Default `"12"`. Coarser granularities (day/month/year) ignore it.
115
- */
116
- timeFormat?: DatetimeTimeFormat;
117
- }
118
-
119
- /** A datetime data point: `[msSinceEpoch, value]` tuple or `{ x, y }` object. */
120
9
  type BarDatetimePoint = DatetimePoint;
121
- /** A category y-value, or a datetime point when the dimensional axis is `"datetime"`. */
122
10
  type BarDataPoint = ChartDataPoint;
123
11
  interface BarSeries {
124
12
  name: string;
125
- /**
126
- * Y-values indexed parallel to `xAxis.categories` on a category axis, or
127
- * `[timestamp, value]` / `{ x, y }` points on a datetime axis.
128
- */
13
+ /** Y-values for each category, or `[timestamp, value]` / `{ x, y }` points on a datetime axis. */
129
14
  data: Array<BarDataPoint>;
130
15
  color?: string;
131
16
  /** Seeds icon or partner-logo name rendered before the series name in the legend. */
@@ -138,48 +23,27 @@ interface BarYAxis {
138
23
  /** Default: true. */
139
24
  showGridLines?: boolean;
140
25
  title?: string;
141
- /**
142
- * Declarative value formatting applied to y-axis tick labels and the default
143
- * tooltip value. Omit for the zero-config decimal default (smart 1k/10k
144
- * abbreviation on the axis, raw values in the tooltip).
145
- */
26
+ /** Declarative value formatting for axis tick labels and tooltip values. */
146
27
  format?: ValueFormat;
147
- /**
148
- * Show y-axis tick labels. Default `true`. `false` hides them (maps to
149
- * Highcharts' `labels.enabled`, replacing v1's `() => ""` formatter trick).
150
- */
28
+ /** Show y-axis tick labels. Default `true`. */
151
29
  showLabels?: boolean;
152
30
  }
153
- /**
154
- * Direction in which bars are drawn. Single-member union for now; expands to
155
- * `"vertical" | "horizontal"` when `HorizontalBarChart` ships.
156
- */
157
- type BarChartDirection = "vertical";
31
+ type BarChartDirection = "vertical" | "horizontal";
158
32
  interface BarChartProps {
159
33
  /** Wired into Highcharts' `accessibility.description`. */
160
34
  description: string;
161
35
  series: Array<BarSeries>;
162
- /**
163
- * Maximum number of series to display. Series beyond the limit are dropped to
164
- * keep the chart readable and accessible. Default `10`.
165
- */
36
+ /** Orientation of the bars. `"vertical"` (default) renders columns; `"horizontal"` renders bars. */
37
+ direction?: BarChartDirection;
38
+ /** Maximum number of series to display. Series beyond the limit are dropped. Default `10`. */
166
39
  seriesLimit?: number;
167
- /**
168
- * Suppress the `console.warn` emitted when the series count exceeds the limit.
169
- * The cap still applies. Default `false`.
170
- */
40
+ /** Suppress the `console.warn` when series count exceeds the limit. The cap still applies. Default `false`. */
171
41
  hideSeriesLimitWarning?: boolean;
172
42
  xAxis: BarXAxis;
173
43
  yAxis?: BarYAxis;
174
44
  /** IANA timezone for datetime-axis ticks and tooltips. Default `"UTC"`. Ignored for category axes. */
175
45
  timezone?: string;
176
- /**
177
- * Stacking mode for multi-series charts. Defaults to `"normal"` — the
178
- * canonical design-system spec renders multi-series bar charts as a single
179
- * stacked column per category. `"percent"` normalizes each column to 100%.
180
- * `"grouped"` renders series as adjacent bars per category; not part of the
181
- * canonical spec, but available for non-standard use cases.
182
- */
46
+ /** Stacking mode. `"normal"` stacks series (default); `"percent"` normalizes to 100%; `"grouped"` renders adjacent bars. */
183
47
  stacking?: "normal" | "percent" | "grouped";
184
48
  /** Appended to each tooltip value (e.g., `" MT"`, `"%"`). */
185
49
  valueSuffix?: string;
@@ -187,22 +51,18 @@ interface BarChartProps {
187
51
  tooltip?: (args: ChartTooltipProps) => ReactNode;
188
52
  /** Declarative annotations rendered at positions on the chart. */
189
53
  annotations?: ChartAnnotation[];
190
- /** Click handler invoked with the dimensional-axis value of the clicked column — the category name on a category axis, the numeric timestamp on a datetime axis. `position` is direction-agnostic: the x-axis value on `VerticalBarChart`, the y-axis value on `HorizontalBarChart`. */
54
+ /** Click handler invoked with the category name or timestamp of the clicked bar. */
191
55
  onClick?: ({ position }: {
192
56
  position: number | string;
193
57
  }) => void;
194
58
  /** Footer content shown in the default tooltip when `onClick` is set. */
195
59
  tooltipClickLabel?: ReactNode;
196
- /** Override for the value shown when a data point is invalid/missing (null). Defaults to an em-dash. */
60
+ /** Override for the value shown when a data point is null. Defaults to an em-dash. */
197
61
  invalidNumberLabel?: ReactNode;
198
- /**
199
- * Fired once per chart instance with an opaque {@link ChartExportHandle} for
200
- * triggering PNG/SVG/PDF/CSV downloads. Re-fires only on a genuine remount,
201
- * never on data or prop updates.
202
- */
62
+ /** Fired once per chart instance with a handle for PNG/SVG/PDF/CSV downloads. Re-fires only on remount. */
203
63
  onReady?: (handle: ChartExportHandle) => void;
204
64
  }
205
65
 
206
- declare const VerticalBarChart: react.NamedExoticComponent<BarChartProps>;
66
+ declare const BarChart: react.NamedExoticComponent<BarChartProps>;
207
67
 
208
- export { type BarChartDirection, type BarChartProps, type BarDataPoint, type BarDatetimePoint, type BarSeries, type BarXAxis, type BarYAxis, type CategoryAxis, ChartExportHandle, type DatetimeAxis, type ValueFormat, VerticalBarChart };
68
+ export { BarChart, type BarChartDirection, type BarChartProps, type BarDataPoint, type BarDatetimePoint, type BarSeries, type BarXAxis, type BarYAxis, CategoryAxis, ChartExportHandle, DatetimeAxis, ValueFormat };