@opendata-ai/openchart-core 8.0.0-rc.9 → 8.1.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.
- package/README.md +1 -1
- package/dist/index.d.ts +403 -45
- package/dist/index.js +50 -18
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/package.json +1 -2
- package/schema/chart.schema.json +375 -69
- package/schema/table.schema.json +35 -1
- package/schema/vizspec.schema.json +992 -171
- package/src/accessibility/__tests__/alt-text.test.ts +0 -110
- package/src/accessibility/__tests__/aria.test.ts +0 -125
- package/src/accessibility/alt-text.ts +0 -155
- package/src/accessibility/aria.ts +0 -75
- package/src/accessibility/index.ts +0 -6
- package/src/colors/__tests__/colorblind.test.ts +0 -75
- package/src/colors/__tests__/contrast.test.ts +0 -119
- package/src/colors/__tests__/palettes.test.ts +0 -74
- package/src/colors/colorblind.ts +0 -131
- package/src/colors/contrast.ts +0 -143
- package/src/colors/index.ts +0 -36
- package/src/colors/palettes.ts +0 -206
- package/src/helpers/__tests__/deep-merge.test.ts +0 -54
- package/src/helpers/__tests__/spec-builders.test.ts +0 -338
- package/src/helpers/deep-merge.ts +0 -29
- package/src/helpers/spec-builders.ts +0 -479
- package/src/index.ts +0 -215
- package/src/labels/__tests__/collision.test.ts +0 -310
- package/src/labels/collision.ts +0 -249
- package/src/labels/index.ts +0 -13
- package/src/layout/__tests__/chrome.test.ts +0 -208
- package/src/layout/__tests__/text-measure.test.ts +0 -57
- package/src/layout/chrome.ts +0 -470
- package/src/layout/index.ts +0 -18
- package/src/layout/text-measure.ts +0 -404
- package/src/layout/text-wrap.ts +0 -93
- package/src/locale/__tests__/format.test.ts +0 -606
- package/src/locale/format.ts +0 -459
- package/src/locale/index.ts +0 -21
- package/src/responsive/__tests__/breakpoints.test.ts +0 -146
- package/src/responsive/__tests__/metrics.test.ts +0 -52
- package/src/responsive/breakpoints.ts +0 -177
- package/src/responsive/index.ts +0 -53
- package/src/responsive/metrics.ts +0 -299
- package/src/schema/__tests__/generated-artifacts.test.ts +0 -42
- package/src/schema/__tests__/schema.test.ts +0 -179
- package/src/styles/__tests__/reduced-motion-selectors.test.ts +0 -28
- package/src/styles/animation.css +0 -213
- package/src/styles/base.css +0 -102
- package/src/styles/chrome.css +0 -174
- package/src/styles/dark.css +0 -44
- package/src/styles/graph.css +0 -135
- package/src/styles/index.css +0 -28
- package/src/styles/keyframes.css +0 -151
- package/src/styles/legend.css +0 -18
- package/src/styles/reduced-motion.css +0 -67
- package/src/styles/series-search.css +0 -153
- package/src/styles/sparkline.css +0 -16
- package/src/styles/table-animation.css +0 -93
- package/src/styles/table.css +0 -398
- package/src/styles/token-definitions.ts +0 -199
- package/src/styles/tokens.css +0 -156
- package/src/styles/tooltip.css +0 -126
- package/src/styles/you-draw-it.css +0 -126
- package/src/theme/__tests__/dark-mode.test.ts +0 -232
- package/src/theme/__tests__/defaults.test.ts +0 -73
- package/src/theme/__tests__/resolve.test.ts +0 -277
- package/src/theme/dark-mode.ts +0 -258
- package/src/theme/defaults.ts +0 -110
- package/src/theme/index.ts +0 -8
- package/src/theme/presets.ts +0 -64
- package/src/theme/resolve.ts +0 -312
- package/src/types/__tests__/encoding.test.ts +0 -368
- package/src/types/__tests__/gradient.test.ts +0 -95
- package/src/types/__tests__/spec.test.ts +0 -499
- package/src/types/encoding.ts +0 -280
- package/src/types/events.ts +0 -236
- package/src/types/index.ts +0 -290
- package/src/types/layout.ts +0 -2024
- package/src/types/schema-roots.ts +0 -32
- package/src/types/spec.ts +0 -2925
- package/src/types/table.ts +0 -108
- package/src/types/theme.ts +0 -209
package/src/types/table.ts
DELETED
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Table column configuration types.
|
|
3
|
-
*
|
|
4
|
-
* These types define how individual columns in a TableSpec are displayed,
|
|
5
|
-
* formatted, and enhanced with visual features like heatmaps, bars,
|
|
6
|
-
* sparklines, images, and category colors.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
// ---------------------------------------------------------------------------
|
|
10
|
-
// Column visual feature configs
|
|
11
|
-
// ---------------------------------------------------------------------------
|
|
12
|
-
|
|
13
|
-
/** Heatmap coloring configuration for a table column. */
|
|
14
|
-
export interface HeatmapColumnConfig {
|
|
15
|
-
/**
|
|
16
|
-
* Color palette name or array of color stops.
|
|
17
|
-
* Uses sequential palette from theme if a string name is provided.
|
|
18
|
-
*/
|
|
19
|
-
palette?: string | string[];
|
|
20
|
-
/** Explicit domain [min, max] for the color scale. Auto-derived from data if omitted. */
|
|
21
|
-
domain?: [number, number];
|
|
22
|
-
/**
|
|
23
|
-
* Use a different field's values for coloring while displaying this column's values.
|
|
24
|
-
* Useful for coloring a label column based on a numeric column.
|
|
25
|
-
*/
|
|
26
|
-
colorByField?: string;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
/** Inline bar configuration for a table column. */
|
|
30
|
-
export interface BarColumnConfig {
|
|
31
|
-
/** Maximum value for the bar scale. Auto-derived from data if omitted. */
|
|
32
|
-
maxValue?: number;
|
|
33
|
-
/** Bar fill color. Uses the first categorical palette color if omitted. */
|
|
34
|
-
color?: string;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
/** Inline sparkline configuration for a table column. */
|
|
38
|
-
export interface SparklineColumnConfig {
|
|
39
|
-
/** Sparkline chart type. Defaults to "line". */
|
|
40
|
-
type?: 'line' | 'bar' | 'column';
|
|
41
|
-
/** Field containing the array of values to plot. */
|
|
42
|
-
valuesField?: string;
|
|
43
|
-
/** Sparkline color. Uses the first categorical palette color if omitted. */
|
|
44
|
-
color?: string;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
/** Image cell configuration for a table column. */
|
|
48
|
-
export interface ImageColumnConfig {
|
|
49
|
-
/** Image width in pixels. Defaults to 24. */
|
|
50
|
-
width?: number;
|
|
51
|
-
/** Image height in pixels. Defaults to 24. */
|
|
52
|
-
height?: number;
|
|
53
|
-
/** Whether to apply border-radius for rounded/circular images. */
|
|
54
|
-
rounded?: boolean;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
/** Category color mapping for a table column. Maps category values to CSS colors. */
|
|
58
|
-
export type CategoryColorsConfig = Record<string, string>;
|
|
59
|
-
|
|
60
|
-
// ---------------------------------------------------------------------------
|
|
61
|
-
// Column config
|
|
62
|
-
// ---------------------------------------------------------------------------
|
|
63
|
-
|
|
64
|
-
/**
|
|
65
|
-
* Configuration for a single table column.
|
|
66
|
-
*
|
|
67
|
-
* At minimum, `key` identifies the data field. All other properties
|
|
68
|
-
* control display, sorting, formatting, and visual features.
|
|
69
|
-
*
|
|
70
|
-
* Only one visual feature (heatmap, bar, sparkline, image, flag, categoryColors)
|
|
71
|
-
* should be active per column. If multiple are provided, the engine picks
|
|
72
|
-
* the first one in this precedence order: sparkline > bar > heatmap > image > flag > categoryColors.
|
|
73
|
-
*/
|
|
74
|
-
export interface ColumnConfig {
|
|
75
|
-
/** Data field key (must match a key in the data rows). */
|
|
76
|
-
key: string;
|
|
77
|
-
/** Display label for the column header. Defaults to the key if omitted. */
|
|
78
|
-
label?: string;
|
|
79
|
-
/** Whether this column is sortable. Defaults to true. */
|
|
80
|
-
sortable?: boolean;
|
|
81
|
-
/** Text alignment in the column. Defaults to "left" for text, "right" for numbers. */
|
|
82
|
-
align?: 'left' | 'center' | 'right';
|
|
83
|
-
/** Explicit column width (CSS value like "200px" or "20%"). Auto-sized if omitted. */
|
|
84
|
-
width?: string;
|
|
85
|
-
/**
|
|
86
|
-
* Number/date format string (d3-format or d3-time-format), or semantic
|
|
87
|
-
* keyword `'percent'` / `'currency'`. e.g. ",.0f", "%Y-%m-%d", "percent".
|
|
88
|
-
* Tables always show full precision (no compact notation).
|
|
89
|
-
*/
|
|
90
|
-
format?: string;
|
|
91
|
-
|
|
92
|
-
// Visual features (pick at most one per column)
|
|
93
|
-
|
|
94
|
-
/** Heatmap: color the cell background based on numeric value. */
|
|
95
|
-
heatmap?: HeatmapColumnConfig;
|
|
96
|
-
/** Inline bar: render a proportional bar in the cell. */
|
|
97
|
-
bar?: BarColumnConfig;
|
|
98
|
-
/** Sparkline: render a mini line/bar chart in the cell. */
|
|
99
|
-
sparkline?: SparklineColumnConfig;
|
|
100
|
-
/** Image: render the cell value as an image URL. */
|
|
101
|
-
image?: ImageColumnConfig;
|
|
102
|
-
/** Flag: render the cell value as a country flag emoji or image. */
|
|
103
|
-
flag?: boolean;
|
|
104
|
-
/** Category colors: color-code the cell based on its categorical value. */
|
|
105
|
-
categoryColors?: CategoryColorsConfig;
|
|
106
|
-
/** When true, auto-assign palette colors to values not in categoryColors. Default: false. */
|
|
107
|
-
autoAssign?: boolean;
|
|
108
|
-
}
|
package/src/types/theme.ts
DELETED
|
@@ -1,209 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Theme types: color palettes, typography, spacing, and chrome defaults.
|
|
3
|
-
*
|
|
4
|
-
* Theme is the user-facing partial config (all optional).
|
|
5
|
-
* ResolvedTheme is the engine-internal fully resolved version (no optionals).
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
// ---------------------------------------------------------------------------
|
|
9
|
-
// Token value (light/dark pair)
|
|
10
|
-
// ---------------------------------------------------------------------------
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* A color token value: either a plain CSS color string, or a light/dark pair.
|
|
14
|
-
* When a pair is given, the resolver picks the appropriate value based on
|
|
15
|
-
* dark mode state. When a plain string is given, dark-mode adaptation
|
|
16
|
-
* derives the dark value algorithmically (existing behavior).
|
|
17
|
-
*/
|
|
18
|
-
export type TokenValue = string | { light: string; dark: string };
|
|
19
|
-
|
|
20
|
-
// ---------------------------------------------------------------------------
|
|
21
|
-
// Series strategy
|
|
22
|
-
// ---------------------------------------------------------------------------
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* Series color assignment strategy.
|
|
26
|
-
*
|
|
27
|
-
* - `'palette'` — always assign from the full categorical palette (current
|
|
28
|
-
* default, zero visual drift).
|
|
29
|
-
* - `'accent-neutral'` — assign by series count: a single series gets the
|
|
30
|
-
* accent (first categorical color) only; 2-4 series get accent for the
|
|
31
|
-
* first and neutral grays for the rest; 5+ fall back to the full palette.
|
|
32
|
-
*/
|
|
33
|
-
export type SeriesStrategy = 'palette' | 'accent-neutral';
|
|
34
|
-
|
|
35
|
-
// ---------------------------------------------------------------------------
|
|
36
|
-
// Color palette types
|
|
37
|
-
// ---------------------------------------------------------------------------
|
|
38
|
-
|
|
39
|
-
/** Color palettes for the visualization. */
|
|
40
|
-
export interface ThemeColors {
|
|
41
|
-
/** Categorical palette for nominal data. Array of CSS color strings. */
|
|
42
|
-
categorical: string[];
|
|
43
|
-
/** Sequential palettes keyed by name. Each is an array of color stops from light to dark. */
|
|
44
|
-
sequential: Record<string, string[]>;
|
|
45
|
-
/** Diverging palettes keyed by name. Each is an array of color stops with a neutral midpoint. */
|
|
46
|
-
diverging: Record<string, string[]>;
|
|
47
|
-
/** Background color for the visualization container. */
|
|
48
|
-
background: string;
|
|
49
|
-
/** Default text color. */
|
|
50
|
-
text: string;
|
|
51
|
-
/** Gridline color. */
|
|
52
|
-
gridline: string;
|
|
53
|
-
/** Axis line and tick color. */
|
|
54
|
-
axis: string;
|
|
55
|
-
/** Annotation fill color. */
|
|
56
|
-
annotationFill: string;
|
|
57
|
-
/** Annotation text color. */
|
|
58
|
-
annotationText: string;
|
|
59
|
-
/** Semantic color for positive/up-trend values (e.g. sparkline trend coloring). */
|
|
60
|
-
positive: string;
|
|
61
|
-
/** Semantic color for negative/down-trend values (e.g. sparkline trend coloring). */
|
|
62
|
-
negative: string;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
// ---------------------------------------------------------------------------
|
|
66
|
-
// Typography types
|
|
67
|
-
// ---------------------------------------------------------------------------
|
|
68
|
-
|
|
69
|
-
/** Font size presets for the typography scale. */
|
|
70
|
-
export interface ThemeFontSizes {
|
|
71
|
-
/** Title font size in pixels. */
|
|
72
|
-
title: number;
|
|
73
|
-
/** Subtitle font size in pixels. */
|
|
74
|
-
subtitle: number;
|
|
75
|
-
/** Body/label font size in pixels. */
|
|
76
|
-
body: number;
|
|
77
|
-
/** Small text (source, footer) font size in pixels. */
|
|
78
|
-
small: number;
|
|
79
|
-
/** Axis tick label font size in pixels. */
|
|
80
|
-
axisTick: number;
|
|
81
|
-
/** KPI metric uppercase label font size in pixels. */
|
|
82
|
-
metricLabel: number;
|
|
83
|
-
/** KPI metric primary value font size in pixels. The delta and secondary
|
|
84
|
-
* values derive from this (each ~0.55x), so scaling this scales the whole cell. */
|
|
85
|
-
metricValue: number;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
/** Font weight presets. */
|
|
89
|
-
export interface ThemeFontWeights {
|
|
90
|
-
/** Normal text weight. */
|
|
91
|
-
normal: number;
|
|
92
|
-
/** Medium text weight (subtitles). */
|
|
93
|
-
medium: number;
|
|
94
|
-
/** Semibold text weight (titles). */
|
|
95
|
-
semibold: number;
|
|
96
|
-
/** Bold text weight. */
|
|
97
|
-
bold: number;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
/** Complete typography configuration. */
|
|
101
|
-
export interface ThemeFonts {
|
|
102
|
-
/** Primary font family. */
|
|
103
|
-
family: string;
|
|
104
|
-
/** Monospace font family (for tabular numbers). */
|
|
105
|
-
mono: string;
|
|
106
|
-
/** Font sizes. */
|
|
107
|
-
sizes: ThemeFontSizes;
|
|
108
|
-
/** Font weights. */
|
|
109
|
-
weights: ThemeFontWeights;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
// ---------------------------------------------------------------------------
|
|
113
|
-
// Spacing types
|
|
114
|
-
// ---------------------------------------------------------------------------
|
|
115
|
-
|
|
116
|
-
/** Spacing configuration in pixels. */
|
|
117
|
-
export interface ThemeSpacing {
|
|
118
|
-
/** Padding inside the visualization container (all sides). */
|
|
119
|
-
padding: number;
|
|
120
|
-
/** Gap between chrome elements (title to subtitle, subtitle to chart, etc.). */
|
|
121
|
-
chromeGap: number;
|
|
122
|
-
/** Gap between the last chrome element and the chart area. */
|
|
123
|
-
chromeToChart: number;
|
|
124
|
-
/** Gap between chart area and source/footer below. */
|
|
125
|
-
chartToFooter: number;
|
|
126
|
-
/** Internal padding within the chart area (axes margins). */
|
|
127
|
-
axisMargin: number;
|
|
128
|
-
/** Height reserved below the chart area for x-axis tick labels (and optional axis title). */
|
|
129
|
-
xAxisHeight: number;
|
|
130
|
-
/** Gap in pixels between the x-axis line and the top of non-rotated tick label text. */
|
|
131
|
-
xAxisLabelPadding: number;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
// ---------------------------------------------------------------------------
|
|
135
|
-
// Chrome default styles
|
|
136
|
-
// ---------------------------------------------------------------------------
|
|
137
|
-
|
|
138
|
-
/** Default style configuration for a chrome text element. */
|
|
139
|
-
export interface ChromeDefaults {
|
|
140
|
-
/** Font size in pixels. */
|
|
141
|
-
fontSize: number;
|
|
142
|
-
/** Font weight. */
|
|
143
|
-
fontWeight: number;
|
|
144
|
-
/** Text color (CSS color string). */
|
|
145
|
-
color: string;
|
|
146
|
-
/** Line height multiplier. */
|
|
147
|
-
lineHeight: number;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
/** Default chrome styles for each element type. */
|
|
151
|
-
export interface ThemeChromeDefaults {
|
|
152
|
-
eyebrow: ChromeDefaults;
|
|
153
|
-
title: ChromeDefaults;
|
|
154
|
-
subtitle: ChromeDefaults;
|
|
155
|
-
source: ChromeDefaults;
|
|
156
|
-
byline: ChromeDefaults;
|
|
157
|
-
footer: ChromeDefaults;
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
// ---------------------------------------------------------------------------
|
|
161
|
-
// Theme (user-facing, all optional)
|
|
162
|
-
// ---------------------------------------------------------------------------
|
|
163
|
-
|
|
164
|
-
/**
|
|
165
|
-
* Complete theme interface. Used internally after merging user overrides
|
|
166
|
-
* onto defaults. All fields are required here (this is what the engine
|
|
167
|
-
* works with).
|
|
168
|
-
*
|
|
169
|
-
* Users provide ThemeConfig (from spec.ts) which is the partial/optional
|
|
170
|
-
* version. The theme resolver deep-merges ThemeConfig onto the default Theme
|
|
171
|
-
* to produce a ResolvedTheme.
|
|
172
|
-
*/
|
|
173
|
-
export interface Theme {
|
|
174
|
-
/** Color palettes. */
|
|
175
|
-
colors: ThemeColors;
|
|
176
|
-
/** Typography settings. */
|
|
177
|
-
fonts: ThemeFonts;
|
|
178
|
-
/** Spacing values in pixels. */
|
|
179
|
-
spacing: ThemeSpacing;
|
|
180
|
-
/** Border radius for containers and tooltips. */
|
|
181
|
-
borderRadius: number;
|
|
182
|
-
/** Default chrome text styles. */
|
|
183
|
-
chrome: ThemeChromeDefaults;
|
|
184
|
-
/** Series color assignment strategy. Default: 'palette' (full categorical). */
|
|
185
|
-
seriesStrategy: SeriesStrategy;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
/**
|
|
189
|
-
* Fully resolved theme with no optional fields.
|
|
190
|
-
*
|
|
191
|
-
* This is the result of resolveTheme(): the default theme with user
|
|
192
|
-
* overrides deep-merged in. Every property is guaranteed to have a value.
|
|
193
|
-
* The engine uses ResolvedTheme internally so it never needs null checks.
|
|
194
|
-
*
|
|
195
|
-
* Structurally identical to Theme (both have all required fields), but
|
|
196
|
-
* exists as a separate type for semantic clarity: Theme is the default
|
|
197
|
-
* definition, ResolvedTheme is the runtime-resolved instance.
|
|
198
|
-
*/
|
|
199
|
-
export interface ResolvedTheme extends Theme {
|
|
200
|
-
/** Whether dark mode adaptations have been applied to this theme. */
|
|
201
|
-
isDark: boolean;
|
|
202
|
-
/**
|
|
203
|
-
* Original light/dark token pairs from the user's ThemeConfig. Used
|
|
204
|
-
* by adaptTheme() to skip algorithmic adaptation for tokens with
|
|
205
|
-
* explicit dark values. Engine-internal, not part of the public API.
|
|
206
|
-
* @internal
|
|
207
|
-
*/
|
|
208
|
-
_tokenPairs?: Record<string, { light: string; dark: string }>;
|
|
209
|
-
}
|