cortena-ui 1.3.0 → 1.4.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 +74 -3
- package/dist/a2ui/catalogue-doc.d.ts +44 -0
- package/dist/a2ui/catalogue-doc.js +169 -0
- package/dist/a2ui/catalogue-doc.js.map +1 -0
- package/dist/a2ui/catalogue.d.ts +44 -0
- package/dist/a2ui/catalogue.js +942 -0
- package/dist/a2ui/catalogue.js.map +1 -0
- package/dist/a2ui/index.d.ts +7 -0
- package/dist/a2ui/message.d.ts +232 -0
- package/dist/a2ui/message.js +365 -0
- package/dist/a2ui/message.js.map +1 -0
- package/dist/a2ui/renderer.d.ts +46 -0
- package/dist/a2ui/renderer.js +252 -0
- package/dist/a2ui/renderer.js.map +1 -0
- package/dist/a2ui/views.d.ts +80 -0
- package/dist/a2ui/views.js +596 -0
- package/dist/a2ui/views.js.map +1 -0
- package/dist/a2ui.d.ts +8 -0
- package/dist/a2ui.js +7 -0
- package/dist/chart.d.ts +9 -0
- package/dist/chart.js +9 -0
- package/dist/components/accordion.d.ts +22 -0
- package/dist/components/accordion.js +63 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert.d.ts +15 -0
- package/dist/components/alert.js +64 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/avatar.d.ts +18 -0
- package/dist/components/avatar.js +40 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/badge.d.ts +12 -0
- package/dist/components/badge.js +47 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/breadcrumb.d.ts +71 -0
- package/dist/components/breadcrumb.js +123 -0
- package/dist/components/breadcrumb.js.map +1 -0
- package/dist/components/button-link.d.ts +28 -0
- package/dist/components/button-link.js +24 -0
- package/dist/components/button-link.js.map +1 -0
- package/dist/components/button.d.ts +24 -0
- package/dist/components/button.js +65 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/calendar.d.ts +28 -0
- package/dist/components/calendar.js +123 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.d.ts +32 -0
- package/dist/components/card.js +57 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/chart/chart.d.ts +71 -0
- package/dist/components/chart/chart.js +167 -0
- package/dist/components/chart/chart.js.map +1 -0
- package/dist/components/chart/container.d.ts +88 -0
- package/dist/components/chart/container.js +189 -0
- package/dist/components/chart/container.js.map +1 -0
- package/dist/components/chart/data.js +128 -0
- package/dist/components/chart/data.js.map +1 -0
- package/dist/components/chart/index.d.ts +9 -0
- package/dist/components/chart/index.js +10 -0
- package/dist/components/chart/nivo-charts.js +225 -0
- package/dist/components/chart/nivo-charts.js.map +1 -0
- package/dist/components/chart/nivo-lazy.js +50 -0
- package/dist/components/chart/nivo-lazy.js.map +1 -0
- package/dist/components/chart/nivo-theme.d.ts +156 -0
- package/dist/components/chart/nivo-theme.js +161 -0
- package/dist/components/chart/nivo-theme.js.map +1 -0
- package/dist/components/chart/recharts-charts.js +276 -0
- package/dist/components/chart/recharts-charts.js.map +1 -0
- package/dist/components/chart/recharts-lazy.js +58 -0
- package/dist/components/chart/recharts-lazy.js.map +1 -0
- package/dist/components/chart/recharts-parts.d.ts +10 -0
- package/dist/components/chart/recharts-parts.js +25 -0
- package/dist/components/chart/recharts-parts.js.map +1 -0
- package/dist/components/chart/tokens.d.ts +62 -0
- package/dist/components/chart/tokens.js +192 -0
- package/dist/components/chart/tokens.js.map +1 -0
- package/dist/components/chart/types.d.ts +114 -0
- package/dist/components/chart/types.js +27 -0
- package/dist/components/chart/types.js.map +1 -0
- package/dist/components/checkbox.d.ts +20 -0
- package/dist/components/checkbox.js +24 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/chip.d.ts +17 -0
- package/dist/components/chip.js +47 -0
- package/dist/components/chip.js.map +1 -0
- package/dist/components/combobox.d.ts +76 -0
- package/dist/components/combobox.js +201 -0
- package/dist/components/combobox.js.map +1 -0
- package/dist/components/command.d.ts +50 -0
- package/dist/components/command.js +117 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/data-table/data-table.d.ts +65 -0
- package/dist/components/data-table/data-table.js +588 -0
- package/dist/components/data-table/data-table.js.map +1 -0
- package/dist/components/data-table/export.d.ts +23 -0
- package/dist/components/data-table/export.js +95 -0
- package/dist/components/data-table/export.js.map +1 -0
- package/dist/components/data-table/features.d.ts +66 -0
- package/dist/components/data-table/features.js +103 -0
- package/dist/components/data-table/features.js.map +1 -0
- package/dist/components/data-table/index.d.ts +8 -0
- package/dist/components/data-table/parts.d.ts +79 -0
- package/dist/components/data-table/parts.js +400 -0
- package/dist/components/data-table/parts.js.map +1 -0
- package/dist/components/data-table/system-columns.js +84 -0
- package/dist/components/data-table/system-columns.js.map +1 -0
- package/dist/components/data-table/types.d.ts +172 -0
- package/dist/components/data-table/use-data-table.d.ts +19 -0
- package/dist/components/data-table/use-data-table.js +171 -0
- package/dist/components/data-table/use-data-table.js.map +1 -0
- package/dist/components/data-table/use-server-source.js +200 -0
- package/dist/components/data-table/use-server-source.js.map +1 -0
- package/dist/components/date-field.d.ts +54 -0
- package/dist/components/date-field.js +235 -0
- package/dist/components/date-field.js.map +1 -0
- package/dist/components/date-picker.d.ts +42 -0
- package/dist/components/date-picker.js +125 -0
- package/dist/components/date-picker.js.map +1 -0
- package/dist/components/dialog.d.ts +36 -0
- package/dist/components/dialog.js +97 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/dropdown-menu.d.ts +54 -0
- package/dist/components/dropdown-menu.js +191 -0
- package/dist/components/dropdown-menu.js.map +1 -0
- package/dist/components/dropzone.d.ts +48 -0
- package/dist/components/dropzone.js +185 -0
- package/dist/components/dropzone.js.map +1 -0
- package/dist/components/empty-state.d.ts +22 -0
- package/dist/components/empty-state.js +46 -0
- package/dist/components/empty-state.js.map +1 -0
- package/dist/components/error-banner.d.ts +17 -0
- package/dist/components/error-banner.js +52 -0
- package/dist/components/error-banner.js.map +1 -0
- package/dist/components/field.d.ts +64 -0
- package/dist/components/field.js +133 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/form.d.ts +37 -0
- package/dist/components/form.js +103 -0
- package/dist/components/form.js.map +1 -0
- package/dist/components/input.d.ts +17 -0
- package/dist/components/input.js +26 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/kbd.d.ts +11 -0
- package/dist/components/kbd.js +20 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +14 -0
- package/dist/components/label.js +28 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/loading-skeleton.d.ts +22 -0
- package/dist/components/loading-skeleton.js +123 -0
- package/dist/components/loading-skeleton.js.map +1 -0
- package/dist/components/markdown.d.ts +44 -0
- package/dist/components/markdown.js +231 -0
- package/dist/components/markdown.js.map +1 -0
- package/dist/components/page-header.d.ts +26 -0
- package/dist/components/page-header.js +53 -0
- package/dist/components/page-header.js.map +1 -0
- package/dist/components/popover.d.ts +29 -0
- package/dist/components/popover.js +74 -0
- package/dist/components/popover.js.map +1 -0
- package/dist/components/progress.d.ts +22 -0
- package/dist/components/progress.js +49 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/radio-group.d.ts +20 -0
- package/dist/components/radio-group.js +29 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/scroll-area.d.ts +25 -0
- package/dist/components/scroll-area.js +39 -0
- package/dist/components/scroll-area.js.map +1 -0
- package/dist/components/section-card.d.ts +29 -0
- package/dist/components/section-card.js +55 -0
- package/dist/components/section-card.js.map +1 -0
- package/dist/components/segmented.d.ts +27 -0
- package/dist/components/segmented.js +32 -0
- package/dist/components/segmented.js.map +1 -0
- package/dist/components/select.d.ts +62 -0
- package/dist/components/select.js +97 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +19 -0
- package/dist/components/separator.js +23 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/sheet.d.ts +35 -0
- package/dist/components/sheet.js +131 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/skeleton.d.ts +12 -0
- package/dist/components/skeleton.js +22 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/sortable-list.d.ts +67 -0
- package/dist/components/sortable-list.js +206 -0
- package/dist/components/sortable-list.js.map +1 -0
- package/dist/components/spinner.d.ts +29 -0
- package/dist/components/spinner.js +34 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/components/status-dot.d.ts +26 -0
- package/dist/components/status-dot.js +47 -0
- package/dist/components/status-dot.js.map +1 -0
- package/dist/components/switch.d.ts +21 -0
- package/dist/components/switch.js +21 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/tabs.d.ts +24 -0
- package/dist/components/tabs.js +60 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/textarea.d.ts +19 -0
- package/dist/components/textarea.js +47 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/toast.d.ts +47 -0
- package/dist/components/toast.js +106 -0
- package/dist/components/toast.js.map +1 -0
- package/dist/components/toolbar.d.ts +19 -0
- package/dist/components/toolbar.js +45 -0
- package/dist/components/toolbar.js.map +1 -0
- package/dist/components/tooltip.d.ts +28 -0
- package/dist/components/tooltip.js +59 -0
- package/dist/components/tooltip.js.map +1 -0
- package/dist/core.d.ts +44 -0
- package/dist/core.js +44 -0
- package/dist/data-table.d.ts +9 -0
- package/dist/data-table.js +7 -0
- package/dist/form.d.ts +7 -0
- package/dist/form.js +7 -0
- package/dist/hooks/use-cortena-theme.d.ts +98 -0
- package/dist/hooks/use-cortena-theme.js +145 -0
- package/dist/hooks/use-cortena-theme.js.map +1 -0
- package/dist/index.d.ts +75 -2678
- package/dist/index.js +66 -8598
- package/dist/lib/cn.d.ts +10 -0
- package/dist/lib/cn.js +15 -0
- package/dist/lib/cn.js.map +1 -0
- package/dist/lib/render.d.ts +23 -0
- package/dist/lib/render.js +20 -0
- package/dist/lib/render.js.map +1 -0
- package/dist/lib/shakeable.js +39 -0
- package/dist/lib/shakeable.js.map +1 -0
- package/dist/markdown.d.ts +3 -0
- package/dist/markdown.js +3 -0
- package/dist/sortable-list.d.ts +3 -0
- package/dist/sortable-list.js +3 -0
- package/package.json +37 -14
- package/src/a2ui/catalogue.ts +140 -103
- package/src/a2ui/views.tsx +5 -2
- package/src/components/alert.tsx +1 -1
- package/src/components/badge.tsx +1 -1
- package/src/components/button.tsx +1 -1
- package/src/components/chart/chart.tsx +72 -25
- package/src/components/chart/container.tsx +24 -39
- package/src/components/chart/index.tsx +4 -2
- package/src/components/chart/nivo-charts.tsx +41 -13
- package/src/components/chart/nivo-lazy.tsx +52 -0
- package/src/components/chart/recharts-charts.tsx +98 -3
- package/src/components/chart/recharts-lazy.tsx +72 -0
- package/src/components/chart/recharts-parts.tsx +34 -0
- package/src/components/chart/tokens.ts +1 -1
- package/src/components/chart/types.ts +14 -0
- package/src/components/chip.tsx +1 -1
- package/src/components/combobox.tsx +2 -2
- package/src/components/data-table/export.ts +18 -2
- package/src/components/data-table/features.ts +77 -45
- package/src/components/data-table/parts.tsx +15 -0
- package/src/components/data-table/use-data-table.ts +7 -2
- package/src/components/data-table/use-server-source.ts +17 -4
- package/src/components/date-field.tsx +1 -1
- package/src/components/error-banner.tsx +1 -1
- package/src/components/field.tsx +2 -2
- package/src/components/form.tsx +2 -2
- package/src/components/input.tsx +1 -1
- package/src/components/label.tsx +1 -1
- package/src/components/markdown.tsx +5 -4
- package/src/components/sheet.tsx +2 -2
- package/src/components/sortable-list.tsx +2 -2
- package/src/components/textarea.tsx +1 -1
- package/src/components/toast.tsx +1 -1
- package/src/entries/a2ui.ts +11 -0
- package/src/entries/chart.ts +10 -0
- package/src/entries/core.ts +91 -0
- package/src/entries/data-table.ts +9 -0
- package/src/entries/form.ts +24 -0
- package/src/entries/markdown.ts +9 -0
- package/src/entries/sortable-list.ts +13 -0
- package/src/index.ts +32 -98
- package/src/lib/shakeable.ts +33 -0
- package/dist/index.js.map +0 -1
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
//#region src/components/chart/data.ts
|
|
3
|
+
/** True for the `{ id, data: [{ x, y }] }[]` series shape. */
|
|
4
|
+
function isSeriesArray(data) {
|
|
5
|
+
return Array.isArray(data) && data.length > 0 && data.every((d) => d && typeof d === "object" && Array.isArray(d.data));
|
|
6
|
+
}
|
|
7
|
+
/** True for the `{ rows, columns, values }` categorical matrix shape. */
|
|
8
|
+
function isMatrix(data) {
|
|
9
|
+
if (!data || typeof data !== "object" || Array.isArray(data)) return false;
|
|
10
|
+
const m = data;
|
|
11
|
+
return Array.isArray(m.rows) && Array.isArray(m.columns) && Array.isArray(m.values);
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* Pivot a categorical matrix onto the Nivo heatmap shape. Every row gets a
|
|
15
|
+
* point for every column so the grid stays rectangular; a missing or
|
|
16
|
+
* non-finite cell becomes `null`, which Nivo paints with `emptyColor` rather
|
|
17
|
+
* than as a zero.
|
|
18
|
+
*/
|
|
19
|
+
function matrixToSeries(matrix) {
|
|
20
|
+
return matrix.rows.map((row, r) => ({
|
|
21
|
+
id: row,
|
|
22
|
+
data: matrix.columns.map((column, c) => {
|
|
23
|
+
const value = matrix.values[r]?.[c];
|
|
24
|
+
return {
|
|
25
|
+
x: column,
|
|
26
|
+
y: typeof value === "number" && Number.isFinite(value) ? value : null
|
|
27
|
+
};
|
|
28
|
+
})
|
|
29
|
+
}));
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* Infer the category key and the series keys of a row array the way the
|
|
33
|
+
* webchat renderer did: the first string field is the index, every numeric
|
|
34
|
+
* field is a series. Falls back to the first key when nothing is a string.
|
|
35
|
+
*/
|
|
36
|
+
function inferRowKeys(rows) {
|
|
37
|
+
const sample = rows[0];
|
|
38
|
+
if (!sample) return {
|
|
39
|
+
indexBy: void 0,
|
|
40
|
+
keys: []
|
|
41
|
+
};
|
|
42
|
+
let indexBy;
|
|
43
|
+
const keys = [];
|
|
44
|
+
for (const [key, value] of Object.entries(sample)) if (typeof value === "number") keys.push(key);
|
|
45
|
+
else if (!indexBy && typeof value === "string") indexBy = key;
|
|
46
|
+
if (!indexBy) indexBy = Object.keys(sample)[0];
|
|
47
|
+
return {
|
|
48
|
+
indexBy,
|
|
49
|
+
keys
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Normalise bar/line/area/radar data to rows. Series input is pivoted so each
|
|
54
|
+
* distinct x becomes a row and each series id a column; row input is used as
|
|
55
|
+
* given with inferred keys unless `indexBy`/`keys` are passed.
|
|
56
|
+
*/
|
|
57
|
+
function toRows(data, indexBy, keys) {
|
|
58
|
+
if (isSeriesArray(data)) {
|
|
59
|
+
const index = indexBy ?? "x";
|
|
60
|
+
const byX = /* @__PURE__ */ new Map();
|
|
61
|
+
const ids = [];
|
|
62
|
+
for (const series of data) {
|
|
63
|
+
const id = String(series.id);
|
|
64
|
+
ids.push(id);
|
|
65
|
+
for (const point of series.data) {
|
|
66
|
+
let row = byX.get(point.x);
|
|
67
|
+
if (!row) {
|
|
68
|
+
row = { [index]: point.x };
|
|
69
|
+
byX.set(point.x, row);
|
|
70
|
+
}
|
|
71
|
+
row[id] = point.y;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
return {
|
|
75
|
+
rows: [...byX.values()],
|
|
76
|
+
indexBy: index,
|
|
77
|
+
keys: keys ?? ids
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
const rows = data;
|
|
81
|
+
const inferred = inferRowKeys(rows);
|
|
82
|
+
return {
|
|
83
|
+
rows,
|
|
84
|
+
indexBy: indexBy ?? inferred.indexBy ?? "x",
|
|
85
|
+
keys: keys ?? inferred.keys
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
/** Pie/donut/funnel slices as `{ name, value }` rows with the id preserved. */
|
|
89
|
+
function toSlices(data) {
|
|
90
|
+
return data.map((d) => ({
|
|
91
|
+
id: String(d.id),
|
|
92
|
+
name: d.label ?? String(d.id),
|
|
93
|
+
value: d.value
|
|
94
|
+
}));
|
|
95
|
+
}
|
|
96
|
+
/** Build a ChartConfig for the given keys, keeping any entries the caller set. */
|
|
97
|
+
function configFor(keys, config) {
|
|
98
|
+
const out = {};
|
|
99
|
+
for (const key of keys) out[key] = {
|
|
100
|
+
label: key,
|
|
101
|
+
...config?.[key]
|
|
102
|
+
};
|
|
103
|
+
for (const key of Object.keys(config ?? {})) if (!(key in out)) out[key] = config[key];
|
|
104
|
+
return out;
|
|
105
|
+
}
|
|
106
|
+
/** Whether a Nivo tree uses `name` rather than `id` as its identity. */
|
|
107
|
+
function treeIdentity(tree) {
|
|
108
|
+
return tree.id === void 0 && tree.name !== void 0 ? "name" : "id";
|
|
109
|
+
}
|
|
110
|
+
/** True when there is nothing to draw. */
|
|
111
|
+
function isEmptyData(data) {
|
|
112
|
+
if (data == null) return true;
|
|
113
|
+
if (isMatrix(data)) return data.rows.length === 0 || data.columns.length === 0;
|
|
114
|
+
if (Array.isArray(data)) {
|
|
115
|
+
if (data.length === 0) return true;
|
|
116
|
+
if (isSeriesArray(data)) return data.every((s) => s.data.length === 0);
|
|
117
|
+
return false;
|
|
118
|
+
}
|
|
119
|
+
if (typeof data === "object") {
|
|
120
|
+
const tree = data;
|
|
121
|
+
return !tree.children?.length && tree.value === void 0;
|
|
122
|
+
}
|
|
123
|
+
return true;
|
|
124
|
+
}
|
|
125
|
+
//#endregion
|
|
126
|
+
export { configFor, inferRowKeys, isEmptyData, isMatrix, isSeriesArray, matrixToSeries, toRows, toSlices, treeIdentity };
|
|
127
|
+
|
|
128
|
+
//# sourceMappingURL=data.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data.js","names":[],"sources":["../../../src/components/chart/data.ts"],"sourcesContent":["import type { ChartConfig, ChartMatrix, ChartRow, ChartSeries, ChartSlice, ChartTree } from \"./types\";\n\n/** True for the `{ id, data: [{ x, y }] }[]` series shape. */\nexport function isSeriesArray(data: unknown): data is ChartSeries[] {\n return (\n Array.isArray(data) &&\n data.length > 0 &&\n data.every((d) => d && typeof d === \"object\" && Array.isArray((d as ChartSeries).data))\n );\n}\n\n/** True for the `{ rows, columns, values }` categorical matrix shape. */\nexport function isMatrix(data: unknown): data is ChartMatrix {\n if (!data || typeof data !== \"object\" || Array.isArray(data)) return false;\n const m = data as ChartMatrix;\n return Array.isArray(m.rows) && Array.isArray(m.columns) && Array.isArray(m.values);\n}\n\n/**\n * Pivot a categorical matrix onto the Nivo heatmap shape. Every row gets a\n * point for every column so the grid stays rectangular; a missing or\n * non-finite cell becomes `null`, which Nivo paints with `emptyColor` rather\n * than as a zero.\n */\nexport function matrixToSeries(matrix: ChartMatrix): ChartSeries[] {\n return matrix.rows.map((row, r) => ({\n id: row,\n data: matrix.columns.map((column, c) => {\n const value = matrix.values[r]?.[c];\n return { x: column, y: typeof value === \"number\" && Number.isFinite(value) ? value : null };\n }),\n }));\n}\n\n/**\n * Infer the category key and the series keys of a row array the way the\n * webchat renderer did: the first string field is the index, every numeric\n * field is a series. Falls back to the first key when nothing is a string.\n */\nexport function inferRowKeys(rows: ChartRow[]): { indexBy: string | undefined; keys: string[] } {\n const sample = rows[0];\n if (!sample) return { indexBy: undefined, keys: [] };\n let indexBy: string | undefined;\n const keys: string[] = [];\n for (const [key, value] of Object.entries(sample)) {\n if (typeof value === \"number\") keys.push(key);\n else if (!indexBy && typeof value === \"string\") indexBy = key;\n }\n if (!indexBy) indexBy = Object.keys(sample)[0];\n return { indexBy, keys };\n}\n\nexport interface RowData {\n rows: ChartRow[];\n indexBy: string;\n keys: string[];\n}\n\n/**\n * Normalise bar/line/area/radar data to rows. Series input is pivoted so each\n * distinct x becomes a row and each series id a column; row input is used as\n * given with inferred keys unless `indexBy`/`keys` are passed.\n */\nexport function toRows(data: ChartRow[] | ChartSeries[], indexBy?: string, keys?: string[]): RowData {\n if (isSeriesArray(data)) {\n const index = indexBy ?? \"x\";\n const byX = new Map<string | number, ChartRow>();\n const ids: string[] = [];\n for (const series of data) {\n const id = String(series.id);\n ids.push(id);\n for (const point of series.data) {\n let row = byX.get(point.x);\n if (!row) {\n row = { [index]: point.x };\n byX.set(point.x, row);\n }\n row[id] = point.y;\n }\n }\n return { rows: [...byX.values()], indexBy: index, keys: keys ?? ids };\n }\n const rows = data as ChartRow[];\n const inferred = inferRowKeys(rows);\n return {\n rows,\n indexBy: indexBy ?? inferred.indexBy ?? \"x\",\n keys: keys ?? inferred.keys,\n };\n}\n\n/** Pie/donut/funnel slices as `{ name, value }` rows with the id preserved. */\nexport function toSlices(data: ChartSlice[]): Array<{ id: string; name: string; value: number }> {\n return data.map((d) => ({ id: String(d.id), name: d.label ?? String(d.id), value: d.value }));\n}\n\n/** Build a ChartConfig for the given keys, keeping any entries the caller set. */\nexport function configFor(keys: string[], config?: ChartConfig): ChartConfig {\n const out: ChartConfig = {};\n for (const key of keys) out[key] = { label: key, ...config?.[key] };\n // Keys the caller configured but the data lacks still get their colour slot.\n for (const key of Object.keys(config ?? {})) if (!(key in out)) out[key] = config![key]!;\n return out;\n}\n\n/** Whether a Nivo tree uses `name` rather than `id` as its identity. */\nexport function treeIdentity(tree: ChartTree): \"id\" | \"name\" {\n return tree.id === undefined && tree.name !== undefined ? \"name\" : \"id\";\n}\n\n/** True when there is nothing to draw. */\nexport function isEmptyData(data: unknown): boolean {\n if (data == null) return true;\n if (isMatrix(data)) return data.rows.length === 0 || data.columns.length === 0;\n if (Array.isArray(data)) {\n if (data.length === 0) return true;\n if (isSeriesArray(data)) return data.every((s) => s.data.length === 0);\n return false;\n }\n if (typeof data === \"object\") {\n const tree = data as ChartTree;\n return !tree.children?.length && tree.value === undefined;\n }\n return true;\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { ChartConfig, ChartDataFor, ChartDay, ChartEngine, ChartLabels, ChartMatrix, ChartPoint, ChartRenderer, ChartRow, ChartScale, ChartSeries, ChartSlice, ChartTree, ChartType, NIVO_TYPES, RECHARTS_TYPES, chartEngine } from "./types.js";
|
|
3
|
+
import { ChartContainer, ChartContainerProps, ChartEmpty, ChartError, ChartLegendContent, ChartLegendContentProps, ChartLoading, ChartTooltipContent, ChartTooltipContentProps, seriesColor, useChart } from "./container.js";
|
|
4
|
+
import { Chart, ChartProps } from "./chart.js";
|
|
5
|
+
import { ChartLegend, ChartTooltip } from "./recharts-parts.js";
|
|
6
|
+
import { NivoTheme, nivoTheme, useNivoTheme } from "./nivo-theme.js";
|
|
7
|
+
import { ChartScales, VIZ_SERIES_COUNT, chartScales, resolveColor, resolveVizSeries, toHex, vizSeriesVars, vizVar } from "./tokens.js";
|
|
8
|
+
import { Area as Area$1, AreaChart as AreaChart$1, Bar as Bar$1, BarChart as BarChart$1, CartesianGrid as CartesianGrid$1, Cell as Cell$1, ComposedChart, Funnel as Funnel$1, FunnelChart as FunnelChart$1, LabelList, Legend as RechartsLegend, Line as Line$1, LineChart as LineChart$1, Pie as Pie$1, PieChart as PieChart$1, PolarAngleAxis as PolarAngleAxis$1, PolarGrid as PolarGrid$1, PolarRadiusAxis as PolarRadiusAxis$1, Radar as Radar$1, RadarChart as RadarChart$1, ReferenceLine, ResponsiveContainer, Scatter as Scatter$1, ScatterChart as ScatterChart$1, Tooltip as RechartsTooltip, XAxis as XAxis$1, YAxis as YAxis$1 } from "recharts";
|
|
9
|
+
export { Area$1 as Area, AreaChart$1 as AreaChart, Bar$1 as Bar, BarChart$1 as BarChart, CartesianGrid$1 as CartesianGrid, Cell$1 as Cell, Chart, type ChartConfig, ChartContainer, type ChartContainerProps, type ChartDataFor, type ChartDay, ChartEmpty, type ChartEngine, ChartError, type ChartLabels, ChartLegend, ChartLegendContent, type ChartLegendContentProps, ChartLoading, type ChartMatrix, type ChartPoint, type ChartProps, type ChartRenderer, type ChartRow, type ChartScale, type ChartScales, type ChartSeries, type ChartSlice, ChartTooltip, ChartTooltipContent, type ChartTooltipContentProps, type ChartTree, type ChartType, ComposedChart, Funnel$1 as Funnel, FunnelChart$1 as FunnelChart, LabelList, Line$1 as Line, LineChart$1 as LineChart, NIVO_TYPES, type NivoTheme, Pie$1 as Pie, PieChart$1 as PieChart, PolarAngleAxis$1 as PolarAngleAxis, PolarGrid$1 as PolarGrid, PolarRadiusAxis$1 as PolarRadiusAxis, RECHARTS_TYPES, Radar$1 as Radar, RadarChart$1 as RadarChart, RechartsLegend, RechartsTooltip, ReferenceLine, ResponsiveContainer, Scatter$1 as Scatter, ScatterChart$1 as ScatterChart, VIZ_SERIES_COUNT, XAxis$1 as XAxis, YAxis$1 as YAxis, chartEngine, chartScales, nivoTheme, resolveColor, resolveVizSeries, seriesColor, toHex, useChart, useNivoTheme, vizSeriesVars, vizVar };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use client";
|
|
3
|
+
import { VIZ_SERIES_COUNT, chartScales, resolveColor, resolveVizSeries, toHex, vizSeriesVars, vizVar } from "./tokens.js";
|
|
4
|
+
import { ChartContainer, ChartEmpty, ChartError, ChartLegendContent, ChartLoading, ChartTooltipContent, seriesColor, useChart } from "./container.js";
|
|
5
|
+
import { NIVO_TYPES, RECHARTS_TYPES, chartEngine } from "./types.js";
|
|
6
|
+
import { Chart } from "./chart.js";
|
|
7
|
+
import { ChartLegend, ChartTooltip } from "./recharts-parts.js";
|
|
8
|
+
import { nivoTheme, useNivoTheme } from "./nivo-theme.js";
|
|
9
|
+
import { Area as Area$1, AreaChart as AreaChart$1, Bar as Bar$1, BarChart as BarChart$1, CartesianGrid as CartesianGrid$1, Cell as Cell$1, ComposedChart, Funnel as Funnel$1, FunnelChart as FunnelChart$1, LabelList, Legend as RechartsLegend, Line as Line$1, LineChart as LineChart$1, Pie as Pie$1, PieChart as PieChart$1, PolarAngleAxis as PolarAngleAxis$1, PolarGrid as PolarGrid$1, PolarRadiusAxis as PolarRadiusAxis$1, Radar as Radar$1, RadarChart as RadarChart$1, ReferenceLine, ResponsiveContainer, Scatter as Scatter$1, ScatterChart as ScatterChart$1, Tooltip as RechartsTooltip, XAxis as XAxis$1, YAxis as YAxis$1 } from "recharts";
|
|
10
|
+
export { Area$1 as Area, AreaChart$1 as AreaChart, Bar$1 as Bar, BarChart$1 as BarChart, CartesianGrid$1 as CartesianGrid, Cell$1 as Cell, Chart, ChartContainer, ChartEmpty, ChartError, ChartLegend, ChartLegendContent, ChartLoading, ChartTooltip, ChartTooltipContent, ComposedChart, Funnel$1 as Funnel, FunnelChart$1 as FunnelChart, LabelList, Line$1 as Line, LineChart$1 as LineChart, NIVO_TYPES, Pie$1 as Pie, PieChart$1 as PieChart, PolarAngleAxis$1 as PolarAngleAxis, PolarGrid$1 as PolarGrid, PolarRadiusAxis$1 as PolarRadiusAxis, RECHARTS_TYPES, Radar$1 as Radar, RadarChart$1 as RadarChart, RechartsLegend, RechartsTooltip, ReferenceLine, ResponsiveContainer, Scatter$1 as Scatter, ScatterChart$1 as ScatterChart, VIZ_SERIES_COUNT, XAxis$1 as XAxis, YAxis$1 as YAxis, chartEngine, chartScales, nivoTheme, resolveColor, resolveVizSeries, seriesColor, toHex, useChart, useNivoTheme, vizSeriesVars, vizVar };
|
|
@@ -0,0 +1,225 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use client";
|
|
3
|
+
import { chartScales, contrastLabel, resolveVizSeries, useThemeVersion } from "./tokens.js";
|
|
4
|
+
import { useChart } from "./container.js";
|
|
5
|
+
import { isMatrix, matrixToSeries, treeIdentity } from "./data.js";
|
|
6
|
+
import { useNivoTheme } from "./nivo-theme.js";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
import * as React from "react";
|
|
9
|
+
//#region src/components/chart/nivo-charts.tsx
|
|
10
|
+
const loaders = {
|
|
11
|
+
"heatmap-svg": async () => (await import("@nivo/heatmap")).ResponsiveHeatMap,
|
|
12
|
+
"heatmap-canvas": async () => (await import("@nivo/heatmap")).ResponsiveHeatMapCanvas,
|
|
13
|
+
"calendar-svg": async () => (await import("@nivo/calendar")).ResponsiveCalendar,
|
|
14
|
+
"calendar-canvas": async () => (await import("@nivo/calendar")).ResponsiveCalendarCanvas,
|
|
15
|
+
"treemap-svg": async () => (await import("@nivo/treemap")).ResponsiveTreeMap,
|
|
16
|
+
"treemap-canvas": async () => (await import("@nivo/treemap")).ResponsiveTreeMapCanvas,
|
|
17
|
+
"sunburst-svg": async () => (await import("@nivo/sunburst")).ResponsiveSunburst
|
|
18
|
+
};
|
|
19
|
+
let chunks = /* @__PURE__ */ new Map();
|
|
20
|
+
function chunk(name) {
|
|
21
|
+
let component = chunks.get(name);
|
|
22
|
+
if (!component) {
|
|
23
|
+
component = React.lazy(async () => ({ default: await loaders[name]() }));
|
|
24
|
+
chunks.set(name, component);
|
|
25
|
+
}
|
|
26
|
+
return component;
|
|
27
|
+
}
|
|
28
|
+
/** Forget every loaded-or-failed Nivo chunk, so the next render loads it again. */
|
|
29
|
+
function resetNivoChunks() {
|
|
30
|
+
chunks = /* @__PURE__ */ new Map();
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Resolved series colours for Nivo: config colours are `var()` strings, which
|
|
34
|
+
* Nivo cannot use, so a configured colour is resolved through the container's
|
|
35
|
+
* computed style and the rest come from `--ds-viz-1..n` in order.
|
|
36
|
+
*/
|
|
37
|
+
function useNivoColors(config) {
|
|
38
|
+
const version = useThemeVersion();
|
|
39
|
+
const el = useChart()?.element ?? null;
|
|
40
|
+
return React.useMemo(() => {
|
|
41
|
+
const palette = resolveVizSeries(el);
|
|
42
|
+
const keys = Object.keys(config);
|
|
43
|
+
if (keys.length === 0) return palette;
|
|
44
|
+
return keys.map((key, i) => {
|
|
45
|
+
const own = config[key]?.color;
|
|
46
|
+
if (!own || !el) return palette[i % palette.length];
|
|
47
|
+
const probe = document.createElement("span");
|
|
48
|
+
probe.style.color = own;
|
|
49
|
+
el.appendChild(probe);
|
|
50
|
+
const painted = getComputedStyle(probe).color;
|
|
51
|
+
probe.remove();
|
|
52
|
+
return painted || palette[i % palette.length];
|
|
53
|
+
});
|
|
54
|
+
}, [
|
|
55
|
+
config,
|
|
56
|
+
el,
|
|
57
|
+
version
|
|
58
|
+
]);
|
|
59
|
+
}
|
|
60
|
+
function calendarRange(data, from, to) {
|
|
61
|
+
const days = data.map((d) => d.day).sort();
|
|
62
|
+
return {
|
|
63
|
+
from: from ?? days[0] ?? "",
|
|
64
|
+
to: to ?? days[days.length - 1] ?? ""
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
/** The Nivo side of `Chart`; rendered inside a ChartContainer with `responsive={false}`. */
|
|
68
|
+
function NivoChart({ type, data, config, renderer, scale, legend, valueFormatter, from, to }) {
|
|
69
|
+
const theme = useNivoTheme();
|
|
70
|
+
const colors = useNivoColors(config);
|
|
71
|
+
const version = useThemeVersion();
|
|
72
|
+
const el = useChart()?.element ?? null;
|
|
73
|
+
const scales = React.useMemo(() => chartScales(el), [el, version]);
|
|
74
|
+
const onFill = React.useMemo(() => contrastLabel(el), [el, version]);
|
|
75
|
+
const canvas = renderer === "canvas";
|
|
76
|
+
const labelColor = theme.labels.text.fill;
|
|
77
|
+
const border = theme.axis.domain.line.stroke;
|
|
78
|
+
const labelOn = (d) => onFill(d.color);
|
|
79
|
+
switch (type) {
|
|
80
|
+
case "heatmap": {
|
|
81
|
+
const Component = chunk(canvas ? "heatmap-canvas" : "heatmap-svg");
|
|
82
|
+
const rows = isMatrix(data) ? matrixToSeries(data) : data;
|
|
83
|
+
const cells = rows.reduce((n, r) => n + r.data.length, 0);
|
|
84
|
+
const colorConfig = scale === "diverging" ? {
|
|
85
|
+
type: "diverging",
|
|
86
|
+
interpolator: scales.divergingInterpolator
|
|
87
|
+
} : {
|
|
88
|
+
type: "sequential",
|
|
89
|
+
interpolator: scales.sequentialInterpolator
|
|
90
|
+
};
|
|
91
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
92
|
+
data: rows,
|
|
93
|
+
theme,
|
|
94
|
+
colors: colorConfig,
|
|
95
|
+
emptyColor: scales.empty,
|
|
96
|
+
borderColor: border,
|
|
97
|
+
borderWidth: 1,
|
|
98
|
+
enableLabels: cells <= 200,
|
|
99
|
+
labelTextColor: labelOn,
|
|
100
|
+
valueFormat: valueFormatter ? (v) => valueFormatter(v) : void 0,
|
|
101
|
+
margin: {
|
|
102
|
+
top: 8,
|
|
103
|
+
right: legend ? 72 : 8,
|
|
104
|
+
bottom: cells <= 200 ? 40 : 8,
|
|
105
|
+
left: cells <= 200 ? 64 : 8
|
|
106
|
+
},
|
|
107
|
+
axisTop: null,
|
|
108
|
+
axisBottom: cells <= 200 ? {
|
|
109
|
+
tickSize: 0,
|
|
110
|
+
tickPadding: 8
|
|
111
|
+
} : null,
|
|
112
|
+
axisLeft: cells <= 200 ? {
|
|
113
|
+
tickSize: 0,
|
|
114
|
+
tickPadding: 8
|
|
115
|
+
} : null,
|
|
116
|
+
legends: legend ? [{
|
|
117
|
+
anchor: "right",
|
|
118
|
+
translateX: 40,
|
|
119
|
+
length: 160,
|
|
120
|
+
thickness: 8,
|
|
121
|
+
direction: "column",
|
|
122
|
+
tickSize: 0,
|
|
123
|
+
tickSpacing: 4,
|
|
124
|
+
tickFormat: valueFormatter
|
|
125
|
+
}] : [],
|
|
126
|
+
animate: !canvas
|
|
127
|
+
});
|
|
128
|
+
}
|
|
129
|
+
case "calendar": {
|
|
130
|
+
const Component = chunk(canvas ? "calendar-canvas" : "calendar-svg");
|
|
131
|
+
const days = data;
|
|
132
|
+
const range = calendarRange(days, from, to);
|
|
133
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
134
|
+
data: days,
|
|
135
|
+
from: range.from,
|
|
136
|
+
to: range.to,
|
|
137
|
+
theme,
|
|
138
|
+
colors: scales.sequentialSteps(5),
|
|
139
|
+
emptyColor: scales.empty,
|
|
140
|
+
dayBorderColor: scales.surface,
|
|
141
|
+
dayBorderWidth: 2,
|
|
142
|
+
monthBorderColor: border,
|
|
143
|
+
monthBorderWidth: 1,
|
|
144
|
+
margin: {
|
|
145
|
+
top: 24,
|
|
146
|
+
right: 24,
|
|
147
|
+
bottom: 8,
|
|
148
|
+
left: 32
|
|
149
|
+
},
|
|
150
|
+
valueFormat: valueFormatter ? (v) => valueFormatter(v) : void 0,
|
|
151
|
+
legends: legend ? [{
|
|
152
|
+
anchor: "bottom-right",
|
|
153
|
+
direction: "row",
|
|
154
|
+
translateY: 36,
|
|
155
|
+
itemCount: 4,
|
|
156
|
+
itemWidth: 42,
|
|
157
|
+
itemHeight: 36,
|
|
158
|
+
itemsSpacing: 14,
|
|
159
|
+
itemDirection: "right-to-left"
|
|
160
|
+
}] : []
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
case "treemap": {
|
|
164
|
+
const Component = chunk(canvas ? "treemap-canvas" : "treemap-svg");
|
|
165
|
+
const tree = data;
|
|
166
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
167
|
+
data: tree,
|
|
168
|
+
identity: treeIdentity(tree),
|
|
169
|
+
value: "value",
|
|
170
|
+
theme,
|
|
171
|
+
colors,
|
|
172
|
+
nodeOpacity: 1,
|
|
173
|
+
borderColor: scales.surface,
|
|
174
|
+
borderWidth: 2,
|
|
175
|
+
labelTextColor: labelOn,
|
|
176
|
+
parentLabelTextColor: labelColor,
|
|
177
|
+
labelSkipSize: 16,
|
|
178
|
+
leavesOnly: true,
|
|
179
|
+
innerPadding: 2,
|
|
180
|
+
margin: {
|
|
181
|
+
top: 4,
|
|
182
|
+
right: 4,
|
|
183
|
+
bottom: 4,
|
|
184
|
+
left: 4
|
|
185
|
+
},
|
|
186
|
+
valueFormat: valueFormatter ? (v) => valueFormatter(v) : void 0,
|
|
187
|
+
animate: !canvas
|
|
188
|
+
});
|
|
189
|
+
}
|
|
190
|
+
case "sunburst": {
|
|
191
|
+
const Component = chunk("sunburst-svg");
|
|
192
|
+
const tree = data;
|
|
193
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
194
|
+
data: tree,
|
|
195
|
+
id: treeIdentity(tree),
|
|
196
|
+
value: "value",
|
|
197
|
+
theme,
|
|
198
|
+
colors,
|
|
199
|
+
inheritColorFromParent: true,
|
|
200
|
+
childColor: {
|
|
201
|
+
from: "color",
|
|
202
|
+
modifiers: [["opacity", .75]]
|
|
203
|
+
},
|
|
204
|
+
borderColor: scales.surface,
|
|
205
|
+
borderWidth: 2,
|
|
206
|
+
cornerRadius: 2,
|
|
207
|
+
enableArcLabels: true,
|
|
208
|
+
arcLabel: "id",
|
|
209
|
+
arcLabelsSkipAngle: 12,
|
|
210
|
+
arcLabelsTextColor: labelOn,
|
|
211
|
+
margin: {
|
|
212
|
+
top: 8,
|
|
213
|
+
right: 8,
|
|
214
|
+
bottom: 8,
|
|
215
|
+
left: 8
|
|
216
|
+
},
|
|
217
|
+
valueFormat: valueFormatter ? (v) => valueFormatter(v) : void 0
|
|
218
|
+
});
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
//#endregion
|
|
223
|
+
export { NivoChart, resetNivoChunks };
|
|
224
|
+
|
|
225
|
+
//# sourceMappingURL=nivo-charts.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nivo-charts.js","names":[],"sources":["../../../src/components/chart/nivo-charts.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useChart } from \"./container\";\nimport { isMatrix, matrixToSeries, treeIdentity } from \"./data\";\nimport { useNivoTheme } from \"./nivo-theme\";\nimport { chartScales, contrastLabel, resolveVizSeries, useThemeVersion } from \"./tokens\";\nimport type { ChartConfig, ChartDay, ChartMatrix, ChartRenderer, ChartScale, ChartSeries, ChartTree, ChartType } from \"./types\";\n\nexport type NivoType = Extract<ChartType, \"heatmap\" | \"calendar\" | \"treemap\" | \"sunburst\">;\n\n/*\n * Every Nivo package is a dynamic import so a consumer pays only for the chart\n * types a screen renders, and none of `@nivo/*` lands in the package's static\n * graph (test/chart-bundle.test.tsx greps for exactly this). Each lazy wrapper\n * resolves to the SVG or Canvas variant; sunburst has no canvas renderer and\n * falls back to SVG.\n */\ntype AnyComponent = React.ComponentType<Record<string, unknown>>;\n\nconst loaders = {\n \"heatmap-svg\": async () => (await import(\"@nivo/heatmap\")).ResponsiveHeatMap as AnyComponent,\n \"heatmap-canvas\": async () => (await import(\"@nivo/heatmap\")).ResponsiveHeatMapCanvas as AnyComponent,\n \"calendar-svg\": async () => (await import(\"@nivo/calendar\")).ResponsiveCalendar as unknown as AnyComponent,\n \"calendar-canvas\": async () =>\n (await import(\"@nivo/calendar\")).ResponsiveCalendarCanvas as unknown as AnyComponent,\n \"treemap-svg\": async () => (await import(\"@nivo/treemap\")).ResponsiveTreeMap as AnyComponent,\n \"treemap-canvas\": async () => (await import(\"@nivo/treemap\")).ResponsiveTreeMapCanvas as AnyComponent,\n \"sunburst-svg\": async () => (await import(\"@nivo/sunburst\")).ResponsiveSunburst as AnyComponent,\n} satisfies Record<string, () => Promise<AnyComponent>>;\n\ntype ChunkName = keyof typeof loaders;\n\n/*\n * `React.lazy` memoises the outcome of its loader, a rejection included: a\n * chunk that fails once — an offline moment, a deploy that moved the file —\n * throws the same error for the life of the page, and no re-render retries it.\n * The lazy components are therefore cached here rather than frozen at module\n * scope, and `resetNivoChunks` drops the cache so the next render builds fresh\n * ones and asks for the chunk again. `Chart`'s ChunkBoundary calls it.\n */\nlet chunks = new Map<ChunkName, AnyComponent>();\n\nfunction chunk(name: ChunkName): AnyComponent {\n let component = chunks.get(name);\n if (!component) {\n component = React.lazy(async () => ({ default: await loaders[name]() })) as unknown as AnyComponent;\n chunks.set(name, component);\n }\n return component;\n}\n\n/** Forget every loaded-or-failed Nivo chunk, so the next render loads it again. */\nexport function resetNivoChunks(): void {\n chunks = new Map();\n}\n\nexport interface NivoRenderProps {\n type: NivoType;\n data: unknown;\n config: ChartConfig;\n renderer: ChartRenderer;\n scale: ChartScale;\n legend: boolean;\n valueFormatter?: (value: number) => string;\n /** Calendar range; defaults to the data's first and last day. */\n from?: string;\n to?: string;\n}\n\n/**\n * Resolved series colours for Nivo: config colours are `var()` strings, which\n * Nivo cannot use, so a configured colour is resolved through the container's\n * computed style and the rest come from `--ds-viz-1..n` in order.\n */\nfunction useNivoColors(config: ChartConfig): string[] {\n const version = useThemeVersion();\n const chart = useChart();\n const el = chart?.element ?? null;\n // eslint-disable-next-line react-hooks/exhaustive-deps -- version is the cache key for the DOM read\n return React.useMemo(() => {\n const palette = resolveVizSeries(el);\n const keys = Object.keys(config);\n if (keys.length === 0) return palette;\n return keys.map((key, i) => {\n const own = config[key]?.color;\n if (!own || !el) return palette[i % palette.length]!;\n // Resolve a var() through the element by painting it into a probe.\n const probe = document.createElement(\"span\");\n probe.style.color = own;\n el.appendChild(probe);\n const painted = getComputedStyle(probe).color;\n probe.remove();\n return painted || palette[i % palette.length]!;\n });\n }, [config, el, version]);\n}\n\nfunction calendarRange(data: ChartDay[], from?: string, to?: string): { from: string; to: string } {\n const days = data.map((d) => d.day).sort();\n return { from: from ?? days[0] ?? \"\", to: to ?? days[days.length - 1] ?? \"\" };\n}\n\n/** The Nivo side of `Chart`; rendered inside a ChartContainer with `responsive={false}`. */\nexport function NivoChart({ type, data, config, renderer, scale, legend, valueFormatter, from, to }: NivoRenderProps) {\n const theme = useNivoTheme();\n const colors = useNivoColors(config);\n const version = useThemeVersion();\n const chart = useChart();\n const el = chart?.element ?? null;\n // eslint-disable-next-line react-hooks/exhaustive-deps -- version is the cache key for the DOM read\n const scales = React.useMemo(() => chartScales(el), [el, version]);\n // eslint-disable-next-line react-hooks/exhaustive-deps -- version is the cache key for the DOM read\n const onFill = React.useMemo(() => contrastLabel(el), [el, version]);\n const canvas = renderer === \"canvas\";\n const labelColor = theme.labels.text.fill;\n const border = theme.axis.domain.line.stroke;\n const labelOn = (d: { color: string }) => onFill(d.color);\n\n switch (type) {\n case \"heatmap\": {\n const Component = chunk(canvas ? \"heatmap-canvas\" : \"heatmap-svg\");\n // Either shape lands on Nivo's `[{ id, data: [{ x, y }] }]`.\n const rows = isMatrix(data) ? matrixToSeries(data as ChartMatrix) : (data as ChartSeries[]);\n // Labels only when cells are big enough to carry them.\n const cells = rows.reduce((n, r) => n + r.data.length, 0);\n const colorConfig =\n scale === \"diverging\"\n ? { type: \"diverging\" as const, interpolator: scales.divergingInterpolator }\n : { type: \"sequential\" as const, interpolator: scales.sequentialInterpolator };\n return (\n <Component\n data={rows}\n theme={theme}\n colors={colorConfig}\n emptyColor={scales.empty}\n borderColor={border}\n borderWidth={1}\n enableLabels={cells <= 200}\n labelTextColor={labelOn}\n valueFormat={valueFormatter ? (v: number) => valueFormatter(v) : undefined}\n margin={{ top: 8, right: legend ? 72 : 8, bottom: cells <= 200 ? 40 : 8, left: cells <= 200 ? 64 : 8 }}\n axisTop={null}\n axisBottom={cells <= 200 ? { tickSize: 0, tickPadding: 8 } : null}\n axisLeft={cells <= 200 ? { tickSize: 0, tickPadding: 8 } : null}\n legends={\n legend\n ? [\n {\n anchor: \"right\",\n translateX: 40,\n length: 160,\n thickness: 8,\n direction: \"column\",\n tickSize: 0,\n tickSpacing: 4,\n tickFormat: valueFormatter,\n },\n ]\n : []\n }\n animate={!canvas}\n />\n );\n }\n\n case \"calendar\": {\n const Component = chunk(canvas ? \"calendar-canvas\" : \"calendar-svg\");\n const days = data as ChartDay[];\n const range = calendarRange(days, from, to);\n return (\n <Component\n data={days}\n from={range.from}\n to={range.to}\n theme={theme}\n colors={scales.sequentialSteps(5)}\n emptyColor={scales.empty}\n dayBorderColor={scales.surface}\n dayBorderWidth={2}\n monthBorderColor={border}\n monthBorderWidth={1}\n margin={{ top: 24, right: 24, bottom: 8, left: 32 }}\n valueFormat={valueFormatter ? (v: number) => valueFormatter(v) : undefined}\n legends={\n legend\n ? [\n {\n anchor: \"bottom-right\",\n direction: \"row\",\n translateY: 36,\n itemCount: 4,\n itemWidth: 42,\n itemHeight: 36,\n itemsSpacing: 14,\n itemDirection: \"right-to-left\",\n },\n ]\n : []\n }\n />\n );\n }\n\n case \"treemap\": {\n const Component = chunk(canvas ? \"treemap-canvas\" : \"treemap-svg\");\n const tree = data as ChartTree;\n return (\n <Component\n data={tree}\n identity={treeIdentity(tree)}\n value=\"value\"\n theme={theme}\n colors={colors}\n nodeOpacity={1}\n borderColor={scales.surface}\n borderWidth={2}\n labelTextColor={labelOn}\n parentLabelTextColor={labelColor}\n labelSkipSize={16}\n leavesOnly\n innerPadding={2}\n margin={{ top: 4, right: 4, bottom: 4, left: 4 }}\n valueFormat={valueFormatter ? (v: number) => valueFormatter(v) : undefined}\n animate={!canvas}\n />\n );\n }\n\n case \"sunburst\": {\n // Sunburst has no canvas renderer; SVG either way.\n const Component = chunk(\"sunburst-svg\");\n const tree = data as ChartTree;\n return (\n <Component\n data={tree}\n id={treeIdentity(tree)}\n value=\"value\"\n theme={theme}\n colors={colors}\n inheritColorFromParent\n childColor={{ from: \"color\", modifiers: [[\"opacity\", 0.75]] }}\n borderColor={scales.surface}\n borderWidth={2}\n cornerRadius={2}\n enableArcLabels\n arcLabel=\"id\"\n arcLabelsSkipAngle={12}\n arcLabelsTextColor={labelOn}\n margin={{ top: 8, right: 8, bottom: 8, left: 8 }}\n valueFormat={valueFormatter ? (v: number) => valueFormatter(v) : undefined}\n />\n );\n }\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use client";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
//#region src/components/chart/nivo-lazy.tsx
|
|
6
|
+
/**
|
|
7
|
+
* Nivo, loaded on first render of a Nivo chart type.
|
|
8
|
+
*
|
|
9
|
+
* `nivo-charts.tsx` already loads each `@nivo/*` engine dynamically, but it was
|
|
10
|
+
* itself a static import, and it pulls in `nivo-theme.ts` — which reads
|
|
11
|
+
* `@nivo/core`, `@nivo/legends`, `@nivo/theming` and friends for real, about
|
|
12
|
+
* 63 kB of them. So a bundle that could reach `Chart` shipped Nivo's theming
|
|
13
|
+
* layer whether or not it ever drew a Nivo chart. One more dynamic boundary
|
|
14
|
+
* here puts the theme on the same footing as the engines it themes.
|
|
15
|
+
*
|
|
16
|
+
* Two levels of laziness, deliberately: this chunk, then the per-package
|
|
17
|
+
* loaders inside it, so a screen that draws a heatmap fetches the heatmap
|
|
18
|
+
* package and not the calendar, treemap and sunburst ones as well.
|
|
19
|
+
*/
|
|
20
|
+
/**
|
|
21
|
+
* The loaded module, kept so {@link resetNivoChunks} can reach the inner
|
|
22
|
+
* per-package cache. Before the chunk loads there is nothing inside it to
|
|
23
|
+
* reset, and resetting the outer lazy component is enough to make the next
|
|
24
|
+
* render ask for it again.
|
|
25
|
+
*/
|
|
26
|
+
let loaded = null;
|
|
27
|
+
let outer = null;
|
|
28
|
+
function chunk() {
|
|
29
|
+
outer ??= React.lazy(async () => {
|
|
30
|
+
const module = await import("./nivo-charts.js");
|
|
31
|
+
loaded = module;
|
|
32
|
+
return { default: module.NivoChart };
|
|
33
|
+
});
|
|
34
|
+
return outer;
|
|
35
|
+
}
|
|
36
|
+
/** Forget every loaded-or-failed Nivo chunk, outer and per-package, so the next render loads it again. */
|
|
37
|
+
function resetNivoChunks() {
|
|
38
|
+
outer = null;
|
|
39
|
+
loaded?.resetNivoChunks();
|
|
40
|
+
loaded = null;
|
|
41
|
+
}
|
|
42
|
+
/** `NivoChart` behind its chunk. Suspends on first render of a Nivo type. */
|
|
43
|
+
function NivoChartLazy(props) {
|
|
44
|
+
const Component = chunk();
|
|
45
|
+
return /* @__PURE__ */ jsx(Component, { ...props });
|
|
46
|
+
}
|
|
47
|
+
//#endregion
|
|
48
|
+
export { NivoChartLazy, resetNivoChunks };
|
|
49
|
+
|
|
50
|
+
//# sourceMappingURL=nivo-lazy.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nivo-lazy.js","names":[],"sources":["../../../src/components/chart/nivo-lazy.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Nivo, loaded on first render of a Nivo chart type.\n *\n * `nivo-charts.tsx` already loads each `@nivo/*` engine dynamically, but it was\n * itself a static import, and it pulls in `nivo-theme.ts` — which reads\n * `@nivo/core`, `@nivo/legends`, `@nivo/theming` and friends for real, about\n * 63 kB of them. So a bundle that could reach `Chart` shipped Nivo's theming\n * layer whether or not it ever drew a Nivo chart. One more dynamic boundary\n * here puts the theme on the same footing as the engines it themes.\n *\n * Two levels of laziness, deliberately: this chunk, then the per-package\n * loaders inside it, so a screen that draws a heatmap fetches the heatmap\n * package and not the calendar, treemap and sunburst ones as well.\n */\n\nimport * as React from \"react\";\nimport type { NivoRenderProps } from \"./nivo-charts\";\n\ntype AnyComponent = React.ComponentType<Record<string, unknown>>;\n\n/**\n * The loaded module, kept so {@link resetNivoChunks} can reach the inner\n * per-package cache. Before the chunk loads there is nothing inside it to\n * reset, and resetting the outer lazy component is enough to make the next\n * render ask for it again.\n */\nlet loaded: typeof import(\"./nivo-charts\") | null = null;\nlet outer: AnyComponent | null = null;\n\nfunction chunk(): AnyComponent {\n outer ??= React.lazy(async () => {\n const module = await import(\"./nivo-charts\");\n loaded = module;\n return { default: module.NivoChart as unknown as React.ComponentType };\n }) as unknown as AnyComponent;\n return outer;\n}\n\n/** Forget every loaded-or-failed Nivo chunk, outer and per-package, so the next render loads it again. */\nexport function resetNivoChunks(): void {\n outer = null;\n loaded?.resetNivoChunks();\n loaded = null;\n}\n\n/** `NivoChart` behind its chunk. Suspends on first render of a Nivo type. */\nexport function NivoChartLazy(props: NivoRenderProps): React.ReactElement {\n const Component = chunk();\n return <Component {...(props as unknown as Record<string, unknown>)} />;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAI,SAAgD;AACpD,IAAI,QAA6B;AAEjC,SAAS,QAAsB;CAC7B,UAAU,MAAM,KAAK,YAAY;EAC/B,MAAM,SAAS,MAAM,OAAO;EAC5B,SAAS;EACT,OAAO,EAAE,SAAS,OAAO,UAA4C;CACvE,CAAC;CACD,OAAO;AACT;;AAGA,SAAgB,kBAAwB;CACtC,QAAQ;CACR,QAAQ,gBAAgB;CACxB,SAAS;AACX;;AAGA,SAAgB,cAAc,OAA4C;CACxE,MAAM,YAAY,MAAM;CACxB,OAAO,oBAAC,WAAD,EAAW,GAAK,MAA+C,CAAA;AACxE"}
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
//#region src/components/chart/nivo-theme.d.ts
|
|
3
|
+
/**
|
|
4
|
+
* The Nivo theme object, typed structurally so no `@nivo/*` package is a
|
|
5
|
+
* static import of this module (the Nivo packages are lazy-loaded). It is a
|
|
6
|
+
* subset of `PartialTheme` from `@nivo/theming` and assignable to every
|
|
7
|
+
* chart's `theme` prop.
|
|
8
|
+
*/
|
|
9
|
+
export interface NivoTheme {
|
|
10
|
+
background: string;
|
|
11
|
+
text: {
|
|
12
|
+
fontFamily: string;
|
|
13
|
+
fontSize: number;
|
|
14
|
+
fill: string;
|
|
15
|
+
};
|
|
16
|
+
axis: {
|
|
17
|
+
domain: {
|
|
18
|
+
line: {
|
|
19
|
+
stroke: string;
|
|
20
|
+
strokeWidth: number;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
ticks: {
|
|
24
|
+
line: {
|
|
25
|
+
stroke: string;
|
|
26
|
+
strokeWidth: number;
|
|
27
|
+
};
|
|
28
|
+
text: {
|
|
29
|
+
fill: string;
|
|
30
|
+
fontSize: number;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
legend: {
|
|
34
|
+
text: {
|
|
35
|
+
fill: string;
|
|
36
|
+
fontSize: number;
|
|
37
|
+
fontWeight: number;
|
|
38
|
+
};
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
grid: {
|
|
42
|
+
line: {
|
|
43
|
+
stroke: string;
|
|
44
|
+
strokeWidth: number;
|
|
45
|
+
};
|
|
46
|
+
};
|
|
47
|
+
crosshair: {
|
|
48
|
+
line: {
|
|
49
|
+
stroke: string;
|
|
50
|
+
strokeWidth: number;
|
|
51
|
+
strokeOpacity: number;
|
|
52
|
+
strokeDasharray: string;
|
|
53
|
+
};
|
|
54
|
+
};
|
|
55
|
+
legends: {
|
|
56
|
+
text: {
|
|
57
|
+
fill: string;
|
|
58
|
+
fontSize: number;
|
|
59
|
+
};
|
|
60
|
+
title: {
|
|
61
|
+
text: {
|
|
62
|
+
fill: string;
|
|
63
|
+
fontSize: number;
|
|
64
|
+
};
|
|
65
|
+
};
|
|
66
|
+
ticks: {
|
|
67
|
+
line: {
|
|
68
|
+
stroke: string;
|
|
69
|
+
strokeWidth: number;
|
|
70
|
+
};
|
|
71
|
+
text: {
|
|
72
|
+
fill: string;
|
|
73
|
+
fontSize: number;
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
};
|
|
77
|
+
labels: {
|
|
78
|
+
text: {
|
|
79
|
+
fill: string;
|
|
80
|
+
fontSize: number;
|
|
81
|
+
fontWeight: number;
|
|
82
|
+
};
|
|
83
|
+
};
|
|
84
|
+
dots: {
|
|
85
|
+
text: {
|
|
86
|
+
fill: string;
|
|
87
|
+
fontSize: number;
|
|
88
|
+
};
|
|
89
|
+
};
|
|
90
|
+
markers: {
|
|
91
|
+
lineColor: string;
|
|
92
|
+
lineStrokeWidth: number;
|
|
93
|
+
text: {
|
|
94
|
+
fill: string;
|
|
95
|
+
fontSize: number;
|
|
96
|
+
};
|
|
97
|
+
};
|
|
98
|
+
annotations: {
|
|
99
|
+
text: {
|
|
100
|
+
fill: string;
|
|
101
|
+
fontSize: number;
|
|
102
|
+
outlineWidth: number;
|
|
103
|
+
outlineColor: string;
|
|
104
|
+
};
|
|
105
|
+
link: {
|
|
106
|
+
stroke: string;
|
|
107
|
+
strokeWidth: number;
|
|
108
|
+
outlineWidth: number;
|
|
109
|
+
outlineColor: string;
|
|
110
|
+
};
|
|
111
|
+
outline: {
|
|
112
|
+
stroke: string;
|
|
113
|
+
strokeWidth: number;
|
|
114
|
+
outlineWidth: number;
|
|
115
|
+
outlineColor: string;
|
|
116
|
+
};
|
|
117
|
+
symbol: {
|
|
118
|
+
fill: string;
|
|
119
|
+
outlineWidth: number;
|
|
120
|
+
outlineColor: string;
|
|
121
|
+
};
|
|
122
|
+
};
|
|
123
|
+
tooltip: {
|
|
124
|
+
container: {
|
|
125
|
+
background: string;
|
|
126
|
+
color: string;
|
|
127
|
+
fontSize: number;
|
|
128
|
+
fontFamily: string;
|
|
129
|
+
borderRadius: number;
|
|
130
|
+
boxShadow: string;
|
|
131
|
+
border: string;
|
|
132
|
+
padding: string;
|
|
133
|
+
};
|
|
134
|
+
chip: {
|
|
135
|
+
borderRadius: number;
|
|
136
|
+
};
|
|
137
|
+
};
|
|
138
|
+
}
|
|
139
|
+
/**
|
|
140
|
+
* Build the Nivo theme from the tokens, resolved on `el` (default `<html>`).
|
|
141
|
+
* Every colour is read from a `--ds-*` custom property and converted to hex,
|
|
142
|
+
* because Nivo's canvas renderer and its colour derivation cannot read
|
|
143
|
+
* `var()`. Sizes come from the type scale with `--ds-text-caption-sm` (11px)
|
|
144
|
+
* as the floor for ticks and labels.
|
|
145
|
+
*
|
|
146
|
+
* Moved here from cortenaweb's webchat renderer; nothing is hard-coded.
|
|
147
|
+
*/
|
|
148
|
+
export declare function nivoTheme(el?: Element | null): NivoTheme;
|
|
149
|
+
/**
|
|
150
|
+
* The Nivo theme for the current theme, re-resolved when `data-theme` or the
|
|
151
|
+
* OS scheme flips. Inside a ChartContainer the tokens are read on its element,
|
|
152
|
+
* so a nested theme scope is honoured.
|
|
153
|
+
*/
|
|
154
|
+
export declare function useNivoTheme(): NivoTheme;
|
|
155
|
+
//#endregion
|
|
156
|
+
//# sourceMappingURL=nivo-theme.d.ts.map
|