@ctrl-ui/react 0.9.12 → 0.9.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/README.md +20 -7
  2. package/dist/blocks/design-canvas.js +16 -10
  3. package/dist/knob-contracts/field-knobs.d.ts +1 -1
  4. package/dist/knob-contracts/field-knobs.js +1 -0
  5. package/dist/knob-contracts/gradient-editor-knobs.d.ts +1 -1
  6. package/dist/knob-contracts/gradient-editor-knobs.js +1 -4
  7. package/dist/knob-contracts/popup-knobs.d.ts +1 -1
  8. package/dist/knob-contracts/popup-knobs.js +2 -0
  9. package/dist/lib/phone-input-format.js +1 -1
  10. package/dist/styles/recipes/card.css +8 -0
  11. package/dist/styles/recipes/color-picker-values.css +4 -18
  12. package/dist/styles/recipes/color-picker.css +3 -4
  13. package/dist/styles/recipes/field-parts.css +8 -1
  14. package/dist/styles/recipes/gradient-editor.css +3 -47
  15. package/dist/styles/recipes/markdown.css +5 -1
  16. package/dist/styles/recipes/popup-lists.css +17 -0
  17. package/dist/styles/recipes/popup.css +3 -0
  18. package/dist/styles/theme.css +4 -0
  19. package/dist/ui/autocomplete.d.ts +3 -0
  20. package/dist/ui/autocomplete.js +17 -2
  21. package/dist/ui/chart-cartesian.d.ts +60 -57
  22. package/dist/ui/chart-cartesian.js +7 -7
  23. package/dist/ui/chart-colors.d.ts +4 -2
  24. package/dist/ui/chart-colors.js +6 -2
  25. package/dist/ui/chart-marks.d.ts +4 -4
  26. package/dist/ui/chart-marks.js +14 -5
  27. package/dist/ui/chart-series.d.ts +9 -6
  28. package/dist/ui/chart-series.js +3 -2
  29. package/dist/ui/color-picker-swatches.d.ts +4 -3
  30. package/dist/ui/color-picker-swatches.js +7 -8
  31. package/dist/ui/command.d.ts +12 -0
  32. package/dist/ui/command.js +31 -1
  33. package/dist/ui/field.js +1 -1
  34. package/dist/ui/gradient-editor.d.ts +3 -2
  35. package/dist/ui/gradient-editor.js +7 -8
  36. package/dist/ui/markdown-components.d.ts +27 -0
  37. package/dist/ui/markdown-components.js +57 -0
  38. package/dist/ui/markdown-elements.d.ts +6 -25
  39. package/dist/ui/markdown-elements.js +19 -53
  40. package/dist/ui/markdown.d.ts +2 -7
  41. package/dist/ui/markdown.js +3 -20
  42. package/dist/ui/phone-input.js +2 -2
  43. package/lint/biome-preset.json +8 -1
  44. package/lint/class-policy.mjs +50 -1
  45. package/lint/eslint-plugin.mjs +98 -49
  46. package/lint/grit-rules.mjs +131 -42
  47. package/lint/no-component-part-css.grit +16 -0
  48. package/lint/no-component-style-classes.grit +66 -36
  49. package/lint/no-component-style-props.grit +51 -0
  50. package/lint/no-raw-type-classes.grit +1 -1
  51. package/package.json +5 -1
package/dist/ui/chart-cartesian.d.ts CHANGED
@@ -1,19 +1,19 @@
1
1
  import { ChartColor } from "./chart-colors.js";
2
- import { ChartFill, ChartSeries, ChartSeriesRow, ChartValueKey, ChartXKey, ChartXValue } from "./chart-series.js";
2
+ import { ChartDatumColor, ChartFill, ChartSeries, ChartSeriesRow, ChartValueKey, ChartXKey, ChartXValue } from "./chart-series.js";
3
3
  import { ChartCurveName } from "./chart-curves.js";
4
4
  import { ChartReference } from "./chart-marks.js";
5
5
  import { ChartPositionScaleOptions } from "@tanstack/charts";
6
6
  import { scaleLinear } from "@tanstack/charts/scales/linear";
7
7
  //#region src/ui/chart-cartesian.d.ts
8
- export type CartesianChartOptions<TDatum> = {
8
+ export type CartesianChartOptions<TDatum, TColor extends ChartDatumColor<TDatum> = ChartColor> = {
9
9
  data: readonly TDatum[];
10
10
  x: ChartXKey<TDatum>;
11
- series: readonly ChartSeries<TDatum>[];
11
+ series: readonly ChartSeries<TDatum, TColor>[];
12
12
  fill?: ChartFill;
13
13
  xScale?: Partial<ChartPositionScaleOptions>;
14
14
  yScale?: Partial<ChartPositionScaleOptions>;
15
15
  formatX?: (value: ChartXValue) => string;
16
- formatValue?: (value: number) => string;
16
+ formatValue?: (value: number, datum: TDatum) => string;
17
17
  formatTick?: (value: number) => string;
18
18
  locale?: Intl.LocalesArgument;
19
19
  references?: readonly ChartReference[];
@@ -28,16 +28,19 @@ export type LineChartOptions<TDatum> = CartesianChartOptions<TDatum> & {
28
28
  curve?: ChartCurveName;
29
29
  dots?: boolean;
30
30
  };
31
- export type BarChartOptions<TDatum> = CartesianChartOptions<TDatum> & {
31
+ export type BarChartOptions<TDatum> = CartesianChartOptions<TDatum, ChartDatumColor<TDatum>> & {
32
32
  orientation?: "vertical" | "horizontal";
33
33
  layout?: "grouped" | "stacked" | "percent";
34
+ radius?: number | {
35
+ end: number;
36
+ };
34
37
  };
35
- export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
36
- readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
38
+ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
39
+ readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
37
40
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
38
41
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
39
42
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
40
- }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
43
+ }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
41
44
  readonly scales: {
42
45
  readonly x: {
43
46
  readonly scale: import("@tanstack/charts").ChartScale | import("@tanstack/charts").ConfiguredScaleLike<any> | import("@tanstack/charts").ChartScaleFactory<any>;
@@ -47,7 +50,7 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
47
50
  readonly grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
48
51
  readonly channel?: import("@tanstack/charts").ChartPositionChannel;
49
52
  readonly side?: import("@tanstack/charts").ChartAxisSide;
50
- readonly axis: {
53
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
51
54
  readonly line: false;
52
55
  readonly ticks: {
53
56
  readonly line: false;
@@ -86,8 +89,8 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
86
89
  use: import("@tanstack/charts").ChartTooltipExtension;
87
90
  content: (points: readonly {
88
91
  key: string;
89
- datum: ChartSeriesRow;
90
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
92
+ datum: ChartSeriesRow<TDatum>;
93
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
91
94
  title: string | undefined;
92
95
  rows: {
93
96
  label: string;
@@ -97,12 +100,12 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
97
100
  }[];
98
101
  };
99
102
  };
100
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
101
- readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
103
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
104
+ readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
102
105
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
103
106
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
104
107
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
105
- }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
108
+ }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
106
109
  readonly scales: {
107
110
  readonly x: {
108
111
  readonly scale: import("@tanstack/charts").ChartScale | import("@tanstack/charts").ConfiguredScaleLike<any> | import("@tanstack/charts").ChartScaleFactory<any>;
@@ -112,7 +115,7 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
112
115
  readonly grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
113
116
  readonly channel?: import("@tanstack/charts").ChartPositionChannel;
114
117
  readonly side?: import("@tanstack/charts").ChartAxisSide;
115
- readonly axis: {
118
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
116
119
  readonly line: false;
117
120
  readonly ticks: {
118
121
  readonly line: false;
@@ -151,8 +154,8 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
151
154
  use: import("@tanstack/charts").ChartTooltipExtension;
152
155
  content: (points: readonly {
153
156
  key: string;
154
- datum: ChartSeriesRow;
155
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
157
+ datum: ChartSeriesRow<TDatum>;
158
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
156
159
  title: string | undefined;
157
160
  rows: {
158
161
  label: string;
@@ -163,12 +166,12 @@ export declare function areaChart<TDatum>(options: AreaChartOptions<TDatum>): Om
163
166
  };
164
167
  };
165
168
  }, "tooltip">;
166
- export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
167
- readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
169
+ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
170
+ readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
168
171
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
169
172
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
170
173
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
171
- }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
174
+ }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
172
175
  readonly scales: {
173
176
  readonly x: {
174
177
  readonly scale: import("@tanstack/charts").ChartScale | import("@tanstack/charts").ConfiguredScaleLike<any> | import("@tanstack/charts").ChartScaleFactory<any>;
@@ -178,7 +181,7 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
178
181
  readonly grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
179
182
  readonly channel?: import("@tanstack/charts").ChartPositionChannel;
180
183
  readonly side?: import("@tanstack/charts").ChartAxisSide;
181
- readonly axis: {
184
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
182
185
  readonly line: false;
183
186
  readonly ticks: {
184
187
  readonly line: false;
@@ -216,8 +219,8 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
216
219
  use: import("@tanstack/charts").ChartTooltipExtension;
217
220
  content: (points: readonly {
218
221
  key: string;
219
- datum: ChartSeriesRow;
220
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
222
+ datum: ChartSeriesRow<TDatum>;
223
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
221
224
  title: string | undefined;
222
225
  rows: {
223
226
  label: string;
@@ -227,12 +230,12 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
227
230
  }[];
228
231
  };
229
232
  };
230
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
231
- readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
233
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
234
+ readonly marks: readonly [...(import("@tanstack/charts/types/core").DecorativeChartMark<import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>> | (import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
232
235
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
233
236
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
234
237
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
235
- }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
238
+ }))[], import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>];
236
239
  readonly scales: {
237
240
  readonly x: {
238
241
  readonly scale: import("@tanstack/charts").ChartScale | import("@tanstack/charts").ConfiguredScaleLike<any> | import("@tanstack/charts").ChartScaleFactory<any>;
@@ -242,7 +245,7 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
242
245
  readonly grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
243
246
  readonly channel?: import("@tanstack/charts").ChartPositionChannel;
244
247
  readonly side?: import("@tanstack/charts").ChartAxisSide;
245
- readonly axis: {
248
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
246
249
  readonly line: false;
247
250
  readonly ticks: {
248
251
  readonly line: false;
@@ -280,8 +283,8 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
280
283
  use: import("@tanstack/charts").ChartTooltipExtension;
281
284
  content: (points: readonly {
282
285
  key: string;
283
- datum: ChartSeriesRow;
284
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
286
+ datum: ChartSeriesRow<TDatum>;
287
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
285
288
  title: string | undefined;
286
289
  rows: {
287
290
  label: string;
@@ -292,8 +295,8 @@ export declare function lineChart<TDatum>(options: LineChartOptions<TDatum>): Om
292
295
  };
293
296
  };
294
297
  }, "tooltip">;
295
- export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, number, NonNullable<ChartXValue>, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
296
- readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
298
+ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, number, NonNullable<ChartXValue>, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
299
+ readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
297
300
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
298
301
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
299
302
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
@@ -326,7 +329,7 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
326
329
  grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
327
330
  channel?: import("@tanstack/charts").ChartPositionChannel;
328
331
  side?: import("@tanstack/charts").ChartAxisSide;
329
- axis: {
332
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
330
333
  readonly line: false;
331
334
  readonly ticks: {
332
335
  readonly line: false;
@@ -346,8 +349,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
346
349
  use: import("@tanstack/charts").ChartTooltipExtension;
347
350
  content: (points: readonly {
348
351
  key: string;
349
- datum: ChartSeriesRow;
350
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
352
+ datum: ChartSeriesRow<TDatum>;
353
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
351
354
  title: string | undefined;
352
355
  rows: {
353
356
  label: string;
@@ -357,8 +360,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
357
360
  }[];
358
361
  };
359
362
  };
360
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, number, NonNullable<ChartXValue>, string>, "focus" | "maxFocusDistance"> & Pick<{
361
- readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
363
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, number, NonNullable<ChartXValue>, string>, "focus" | "maxFocusDistance"> & Pick<{
364
+ readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
362
365
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
363
366
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
364
367
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
@@ -391,7 +394,7 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
391
394
  grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
392
395
  channel?: import("@tanstack/charts").ChartPositionChannel;
393
396
  side?: import("@tanstack/charts").ChartAxisSide;
394
- axis: {
397
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
395
398
  readonly line: false;
396
399
  readonly ticks: {
397
400
  readonly line: false;
@@ -411,8 +414,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
411
414
  use: import("@tanstack/charts").ChartTooltipExtension;
412
415
  content: (points: readonly {
413
416
  key: string;
414
- datum: ChartSeriesRow;
415
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
417
+ datum: ChartSeriesRow<TDatum>;
418
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
416
419
  title: string | undefined;
417
420
  rows: {
418
421
  label: string;
@@ -422,8 +425,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
422
425
  }[];
423
426
  };
424
427
  };
425
- }, "tooltip">) | (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
426
- readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
428
+ }, "tooltip">) | (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
429
+ readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
427
430
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
428
431
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
429
432
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
@@ -437,7 +440,7 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
437
440
  grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
438
441
  channel?: import("@tanstack/charts").ChartPositionChannel;
439
442
  side?: import("@tanstack/charts").ChartAxisSide;
440
- axis: {
443
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
441
444
  readonly line: false;
442
445
  readonly ticks: {
443
446
  readonly line: false;
@@ -476,8 +479,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
476
479
  use: import("@tanstack/charts").ChartTooltipExtension;
477
480
  content: (points: readonly {
478
481
  key: string;
479
- datum: ChartSeriesRow;
480
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
482
+ datum: ChartSeriesRow<TDatum>;
483
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
481
484
  title: string | undefined;
482
485
  rows: {
483
486
  label: string;
@@ -487,8 +490,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
487
490
  }[];
488
491
  };
489
492
  };
490
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
491
- readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
493
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, "focus" | "maxFocusDistance"> & Pick<{
494
+ readonly marks: readonly [import("@tanstack/charts").ChartMark<never, never, never, never, never, any, any>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>, ...((import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
492
495
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
493
496
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
494
497
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
@@ -502,7 +505,7 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
502
505
  grid?: boolean | import("@tanstack/charts").ChartGuideLineStyle;
503
506
  channel?: import("@tanstack/charts").ChartPositionChannel;
504
507
  side?: import("@tanstack/charts").ChartAxisSide;
505
- axis: {
508
+ axis: false | import("@tanstack/charts").ChartAxisPresentationOptions<any> | {
506
509
  readonly line: false;
507
510
  readonly ticks: {
508
511
  readonly line: false;
@@ -541,8 +544,8 @@ export declare function barChart<TDatum>(options: BarChartOptions<TDatum>): (Omi
541
544
  use: import("@tanstack/charts").ChartTooltipExtension;
542
545
  content: (points: readonly {
543
546
  key: string;
544
- datum: ChartSeriesRow;
545
- }[], context: import("@tanstack/charts").ChartTooltipContentContext) => {
547
+ datum: ChartSeriesRow<TDatum>;
548
+ }[], context: Pick<import("@tanstack/charts").ChartTooltipContentContext, "primaryPoint">) => {
546
549
  title: string | undefined;
547
550
  rows: {
548
551
  label: string;
@@ -715,14 +718,14 @@ export type SparklineChartOptions<TDatum> = {
715
718
  curve?: ChartCurveName;
716
719
  xScale?: Partial<ChartPositionScaleOptions>;
717
720
  };
718
- export declare function sparklineChart<TDatum>(options: SparklineChartOptions<TDatum>): (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
721
+ export declare function sparklineChart<TDatum>(options: SparklineChartOptions<TDatum>): (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
719
722
  readonly guides: false;
720
723
  readonly margin: 2;
721
724
  readonly focus: false;
722
725
  readonly pointer: false;
723
726
  readonly keyboard: false;
724
727
  readonly tooltip: false;
725
- readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>];
728
+ readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>];
726
729
  readonly scales: {
727
730
  readonly x: {
728
731
  readonly nice?: boolean | number;
@@ -740,14 +743,14 @@ export declare function sparklineChart<TDatum>(options: SparklineChartOptions<TD
740
743
  };
741
744
  };
742
745
  readonly gradients: import("@tanstack/charts").ChartLinearGradient[];
743
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, "focus" | "keyboard" | "pointer"> & Pick<{
746
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, "focus" | "keyboard" | "pointer"> & Pick<{
744
747
  readonly guides: false;
745
748
  readonly margin: 2;
746
749
  readonly focus: false;
747
750
  readonly pointer: false;
748
751
  readonly keyboard: false;
749
752
  readonly tooltip: false;
750
- readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>];
753
+ readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<any, any>>];
751
754
  readonly scales: {
752
755
  readonly x: {
753
756
  readonly nice?: boolean | number;
@@ -765,14 +768,14 @@ export declare function sparklineChart<TDatum>(options: SparklineChartOptions<TD
765
768
  };
766
769
  };
767
770
  readonly gradients: import("@tanstack/charts").ChartLinearGradient[];
768
- }, "tooltip">) | (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
771
+ }, "tooltip">) | (Omit<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string> | keyof import("@tanstack/charts/types/core").StoredChartSpec> & Omit<{
769
772
  readonly guides: false;
770
773
  readonly margin: 2;
771
774
  readonly focus: false;
772
775
  readonly pointer: false;
773
776
  readonly keyboard: false;
774
777
  readonly tooltip: false;
775
- readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>] | readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>];
778
+ readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>] | readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>];
776
779
  readonly scales: {
777
780
  x: ChartPositionScaleOptions<any>;
778
781
  y: {
@@ -781,14 +784,14 @@ export declare function sparklineChart<TDatum>(options: SparklineChartOptions<TD
781
784
  };
782
785
  };
783
786
  readonly gradients: import("@tanstack/charts").ChartLinearGradient[];
784
- }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow, NonNullable<ChartXValue>, number, string>, "focus" | "keyboard" | "pointer"> & Pick<{
787
+ }, keyof import("@tanstack/charts").ChartDefinitionOptions<unknown, import("@tanstack/charts").ChartValue, import("@tanstack/charts").ChartValue, string>> & Pick<import("@tanstack/charts").StaticChartDefinition<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, string>, "focus" | "keyboard" | "pointer"> & Pick<{
785
788
  readonly guides: false;
786
789
  readonly margin: 2;
787
790
  readonly focus: false;
788
791
  readonly pointer: false;
789
792
  readonly keyboard: false;
790
793
  readonly tooltip: false;
791
- readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>] | readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>];
794
+ readonly marks: readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>] | readonly [import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>, import("@tanstack/charts").CartesianChartMark<ChartSeriesRow<TDatum>, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>];
792
795
  readonly scales: {
793
796
  x: ChartPositionScaleOptions<any>;
794
797
  y: {
package/dist/ui/chart-cartesian.js CHANGED
@@ -110,8 +110,8 @@ function areaChart(options) {
110
110
  ],
111
111
  scales: {
112
112
  x: {
113
- ...chartXScale(rows, "point", options.xScale),
114
- axis: quietAxis(formatX)
113
+ axis: quietAxis(formatX),
114
+ ...chartXScale(rows, "point", options.xScale)
115
115
  },
116
116
  y: valueScale
117
117
  },
@@ -164,8 +164,8 @@ function lineChart(options) {
164
164
  ],
165
165
  scales: {
166
166
  x: {
167
- ...chartXScale(rows, "point", options.xScale),
168
- axis: quietAxis(formatX)
167
+ axis: quietAxis(formatX),
168
+ ...chartXScale(rows, "point", options.xScale)
169
169
  },
170
170
  y: valueScale
171
171
  },
@@ -184,8 +184,8 @@ function barChart(options) {
184
184
  percent: stack({ offset: "normalize" })
185
185
  }[layoutName];
186
186
  const categoryScale = {
187
- ...chartXScale(rows, "band", options.xScale),
188
- axis: quietAxis(formatX)
187
+ axis: quietAxis(formatX),
188
+ ...chartXScale(rows, "band", options.xScale)
189
189
  };
190
190
  const band = {
191
191
  inset: -4,
@@ -198,7 +198,7 @@ function barChart(options) {
198
198
  z: "series",
199
199
  stroke: (row) => chartOutline(row.color, row.fill),
200
200
  strokeWidth: 1,
201
- radius: { end: 6 },
201
+ radius: options.radius ?? { end: 6 },
202
202
  states: dimUnfocused,
203
203
  layout
204
204
  };
package/dist/ui/chart-colors.d.ts CHANGED
@@ -1,7 +1,9 @@
1
1
  //#region src/ui/chart-colors.d.ts
2
2
  export declare const CHART_COLORS: readonly ["blue", "purple", "pink", "orange", "green", "yellow", "red", "neutral"];
3
- export type ChartColor = (typeof CHART_COLORS)[number];
3
+ export type ChartPaletteColor = (typeof CHART_COLORS)[number];
4
+ export type ChartColor = ChartPaletteColor | `${string}(${string})` | `#${string}`;
4
5
  export declare const CHART_SERIES_COLORS: readonly ["blue", "purple", "pink", "orange", "green", "yellow"];
6
+ export declare function isChartPaletteColor(color: ChartColor): color is ChartPaletteColor;
5
7
  export declare function chartColor(color: ChartColor): string;
6
- export declare function chartSeriesColor(index: number): ChartColor;
8
+ export declare function chartSeriesColor(index: number): ChartPaletteColor;
7
9
  //#endregion
package/dist/ui/chart-colors.js CHANGED
@@ -17,11 +17,15 @@ const CHART_SERIES_COLORS = [
17
17
  "green",
18
18
  "yellow"
19
19
  ];
20
+ const PALETTE = new Set(CHART_COLORS);
21
+ function isChartPaletteColor(color) {
22
+ return PALETTE.has(color);
23
+ }
20
24
  function chartColor(color) {
21
- return `var(--chart-${color})`;
25
+ return isChartPaletteColor(color) ? `var(--chart-${color})` : color;
22
26
  }
23
27
  function chartSeriesColor(index) {
24
28
  return CHART_SERIES_COLORS[index % CHART_SERIES_COLORS.length] ?? "blue";
25
29
  }
26
30
  //#endregion
27
- export { CHART_COLORS, CHART_SERIES_COLORS, chartColor, chartSeriesColor };
31
+ export { CHART_COLORS, CHART_SERIES_COLORS, chartColor, chartSeriesColor, isChartPaletteColor };
package/dist/ui/chart-marks.d.ts CHANGED
@@ -49,13 +49,13 @@ export declare function chartReferenceMarks(references: readonly ChartReference[
49
49
  }) | (import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> & {
50
50
  readonly __decorativeMark: import("@tanstack/charts").CartesianChartMark<ChartReference, number, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>> | import("@tanstack/charts").CartesianChartMark<ChartReference, NonNullable<ChartXValue>, number, NonNullable<ChartXValue>, number, import("@tanstack/charts/types/core").MarkScaleBindings<undefined, undefined>>;
51
51
  }))[];
52
- type SeriesPoint = {
52
+ type SeriesPoint<TDatum> = {
53
53
  key: string;
54
- datum: ChartSeriesRow;
54
+ datum: ChartSeriesRow<TDatum>;
55
55
  };
56
- export declare function seriesTooltip(seriesLabels: readonly string[], formatX: (value: ChartXValue) => string, formatValue: (value: number) => string): {
56
+ export declare function seriesTooltip<TDatum>(seriesLabels: readonly string[], formatX: (value: ChartXValue) => string, formatValue: (value: number, datum: TDatum) => string): {
57
57
  use: import("@tanstack/charts").ChartTooltipExtension;
58
- content: (points: readonly SeriesPoint[], context: ChartTooltipContentContext) => {
58
+ content: (points: readonly SeriesPoint<TDatum>[], context: Pick<ChartTooltipContentContext, "primaryPoint">) => {
59
59
  title: string | undefined;
60
60
  rows: {
61
61
  label: string;
package/dist/ui/chart-marks.js CHANGED
@@ -1,4 +1,4 @@
1
- import { chartColor } from "./chart-colors.js";
1
+ import { chartColor, isChartPaletteColor } from "./chart-colors.js";
2
2
  import { ruleX, ruleY, text } from "@tanstack/charts";
3
3
  import { decorative } from "@tanstack/charts/mark/decorative";
4
4
  import { tooltip } from "@tanstack/charts/tooltip";
@@ -115,11 +115,20 @@ const GRADIENT_GEOMETRY = {
115
115
  ]]
116
116
  }
117
117
  };
118
+ function chartColorId(color) {
119
+ if (isChartPaletteColor(color)) return color;
120
+ let hash = 0;
121
+ for (const character of color) hash = Math.imul(hash, 31) + (character.codePointAt(0) ?? 0) | 0;
122
+ return `css-${(hash >>> 0).toString(36)}`;
123
+ }
124
+ function chartGradientId(color, kind) {
125
+ return `cui-${kind}-${chartColorId(color)}`;
126
+ }
118
127
  function chartGradient(color, kind) {
119
128
  const { stops, ...geometry } = GRADIENT_GEOMETRY[kind];
120
129
  return {
121
130
  ...geometry,
122
- id: `cui-${kind}-${color}`,
131
+ id: chartGradientId(color, kind),
123
132
  stops: stops.map(([offset, opacity, lightnessLift]) => ({
124
133
  offset,
125
134
  opacity,
@@ -131,10 +140,10 @@ function chartGradients(colors, kind) {
131
140
  return [...new Set(colors)].map((color) => chartGradient(color, kind));
132
141
  }
133
142
  function chartHatch(color) {
134
- return `var(--_cui-chart-hatch-${color}, ${chartColor(color)})`;
143
+ return isChartPaletteColor(color) ? `var(--_cui-chart-hatch-${color}, ${chartColor(color)})` : chartColor(color);
135
144
  }
136
145
  function chartFillPaint(color, fill, kind) {
137
- if (fill === "gradient") return `url(#cui-${kind}-${color})`;
146
+ if (fill === "gradient") return `url(#${chartGradientId(color, kind)})`;
138
147
  if (fill === "hatched") return chartHatch(color);
139
148
  return kind === "area" ? `oklch(from ${chartColor(color)} l c h / 0.2)` : chartColor(color);
140
149
  }
@@ -216,7 +225,7 @@ function seriesTooltip(seriesLabels, formatX, formatValue) {
216
225
  title: points[0] ? formatX(points[0].datum.x) : void 0,
217
226
  rows: [...points].sort((left, right) => seriesRank(left) - seriesRank(right)).flatMap((point) => point.datum.value === null ? [] : {
218
227
  label: point.datum.series,
219
- value: formatValue(point.datum.value),
228
+ value: formatValue(point.datum.value, point.datum.datum),
220
229
  color: chartColor(point.datum.color),
221
230
  active: point.key === context.primaryPoint?.key
222
231
  })
package/dist/ui/chart-series.d.ts CHANGED
@@ -5,24 +5,27 @@ export type ChartFill = "gradient" | "hatched" | "solid";
5
5
  export type ChartXValue = string | number | Date;
6
6
  export type ChartXKey<TDatum> = { [K in keyof TDatum]-?: TDatum[K] extends ChartXValue ? K : never; }[keyof TDatum] & keyof TDatum & string;
7
7
  export type ChartValueKey<TDatum> = { [K in keyof TDatum]-?: TDatum[K] extends number | null | undefined ? K : never; }[keyof TDatum] & keyof TDatum & string;
8
- export type ChartSeries<TDatum> = {
8
+ export type ChartDatumColor<TDatum> = ChartColor | ((datum: TDatum) => ChartColor);
9
+ export type ChartSeries<TDatum, TColor extends ChartDatumColor<TDatum> = ChartColor> = {
9
10
  key: ChartValueKey<TDatum>;
10
11
  label?: string;
11
- color?: ChartColor;
12
+ color?: TColor;
12
13
  fill?: ChartFill;
13
14
  dashed?: boolean;
14
15
  };
15
- export type ResolvedChartSeries<TDatum> = Required<ChartSeries<TDatum>>;
16
- export type ChartSeriesRow = {
16
+ export type ChartBarSeries<TDatum> = ChartSeries<TDatum, ChartDatumColor<TDatum>>;
17
+ export type ResolvedChartSeries<TDatum, TColor extends ChartDatumColor<TDatum> = ChartColor> = Required<ChartSeries<TDatum, TColor>>;
18
+ export type ChartSeriesRow<TDatum = unknown> = {
17
19
  id: string;
18
20
  x: ChartXValue;
19
21
  value: number | null;
20
22
  series: string;
21
23
  color: ChartColor;
22
24
  fill: ChartFill;
25
+ datum: TDatum;
23
26
  };
24
- export declare function resolveChartSeries<TDatum>(series: readonly ChartSeries<TDatum>[], fill?: ChartFill): ResolvedChartSeries<TDatum>[];
25
- export declare function chartSeriesRows<TDatum>(data: readonly TDatum[], x: ChartXKey<TDatum>, series: readonly ResolvedChartSeries<TDatum>[]): ChartSeriesRow[];
27
+ export declare function resolveChartSeries<TDatum, TColor extends ChartDatumColor<TDatum> = ChartColor>(series: readonly ChartSeries<TDatum, TColor>[], fill?: ChartFill): ResolvedChartSeries<TDatum, TColor | ChartColor>[];
28
+ export declare function chartSeriesRows<TDatum>(data: readonly TDatum[], x: ChartXKey<TDatum>, series: readonly ResolvedChartSeries<TDatum, ChartDatumColor<TDatum>>[]): ChartSeriesRow<TDatum>[];
26
29
  export type ChartFormatters = {
27
30
  x: (value: ChartXValue) => string;
28
31
  value: (value: number) => string;
package/dist/ui/chart-series.js CHANGED
@@ -25,8 +25,9 @@ function chartSeriesRows(data, x, series) {
25
25
  x: xValue,
26
26
  value: typeof value === "number" && Number.isFinite(value) ? value : null,
27
27
  series: entry.label,
28
- color: entry.color,
29
- fill: entry.fill
28
+ color: typeof entry.color === "function" ? entry.color(datum) : entry.color,
29
+ fill: entry.fill,
30
+ datum
30
31
  };
31
32
  }));
32
33
  }