@object-ui/plugin-charts 4.7.0 → 4.8.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/CHANGELOG.md +10 -0
- package/dist/index.js +201 -192
- package/dist/index.umd.cjs +1 -1
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
import { ComponentRegistry as e, computeDrillFilter as t, extractRecords as n, isDrillEnabled as r, resolveDateMacros as i, resolveDrillTitle as a } from "@object-ui/core";
|
|
2
2
|
import * as o from "react";
|
|
3
3
|
import s, { Suspense as c, useCallback as l, useContext as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
|
|
4
|
-
import { Dialog as h, DialogContent as g, DialogHeader as _, DialogTitle as ee,
|
|
4
|
+
import { Dialog as h, DialogContent as g, DialogHeader as _, DialogTitle as ee, RefreshIndicator as v, Sheet as y, SheetContent as te, SheetHeader as b, SheetTitle as ne, Skeleton as x } from "@object-ui/components";
|
|
5
5
|
import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
|
|
6
|
-
import { Area as T, AreaChart as
|
|
7
|
-
import { SchemaRenderer as
|
|
8
|
-
import { AlertCircle as
|
|
9
|
-
import { useSafeFieldLabel as
|
|
6
|
+
import { Area as T, AreaChart as re, Bar as E, BarChart as D, CartesianGrid as O, Cell as k, Funnel as ie, FunnelChart as A, LabelList as j, Legend as M, Line as N, LineChart as P, Pie as F, PieChart as I, PolarAngleAxis as L, PolarGrid as R, PolarRadiusAxis as z, Radar as ae, RadarChart as oe, ResponsiveContainer as se, Scatter as ce, ScatterChart as le, Tooltip as ue, XAxis as B, YAxis as V, ZAxis as de } from "recharts";
|
|
7
|
+
import { SchemaRenderer as fe, SchemaRendererContext as pe, useDataScope as me } from "@object-ui/react";
|
|
8
|
+
import { AlertCircle as he } from "lucide-react";
|
|
9
|
+
import { useSafeFieldLabel as ge } from "@object-ui/i18n";
|
|
10
10
|
//#region \0rolldown/runtime.js
|
|
11
|
-
var
|
|
11
|
+
var _e = Object.defineProperty, H = (e, t) => () => (e && (t = e(e = 0)), t), ve = (e, t) => {
|
|
12
12
|
let n = {};
|
|
13
|
-
for (var r in e)
|
|
13
|
+
for (var r in e) _e(n, r, {
|
|
14
14
|
get: e[r],
|
|
15
15
|
enumerable: !0
|
|
16
16
|
});
|
|
17
|
-
return t ||
|
|
18
|
-
},
|
|
19
|
-
function
|
|
17
|
+
return t || _e(n, Symbol.toStringTag, { value: "Module" }), n;
|
|
18
|
+
}, ye = /* @__PURE__ */ ve({ default: () => be });
|
|
19
|
+
function be({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height: r = 400, className: i = "", color: a = "hsl(var(--primary))" }) {
|
|
20
20
|
return /* @__PURE__ */ C("div", {
|
|
21
21
|
className: `p-2 sm:p-3 md:p-4 rounded-xl border border-border bg-card/40 backdrop-blur-sm shadow-lg shadow-background/5 ${i}`,
|
|
22
|
-
children: /* @__PURE__ */ C(
|
|
22
|
+
children: /* @__PURE__ */ C(se, {
|
|
23
23
|
width: "100%",
|
|
24
24
|
height: r,
|
|
25
25
|
children: /* @__PURE__ */ w(D, {
|
|
@@ -88,7 +88,7 @@ function ve({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height:
|
|
|
88
88
|
stroke: "hsl(var(--border))",
|
|
89
89
|
vertical: !1
|
|
90
90
|
}),
|
|
91
|
-
/* @__PURE__ */ C(
|
|
91
|
+
/* @__PURE__ */ C(B, {
|
|
92
92
|
dataKey: n,
|
|
93
93
|
tick: {
|
|
94
94
|
fill: "hsl(var(--muted-foreground))",
|
|
@@ -99,7 +99,7 @@ function ve({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height:
|
|
|
99
99
|
axisLine: { stroke: "hsl(var(--border))" },
|
|
100
100
|
dy: 10
|
|
101
101
|
}),
|
|
102
|
-
/* @__PURE__ */ C(
|
|
102
|
+
/* @__PURE__ */ C(V, {
|
|
103
103
|
tick: {
|
|
104
104
|
fill: "hsl(var(--muted-foreground))",
|
|
105
105
|
fontSize: 12,
|
|
@@ -108,7 +108,7 @@ function ve({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height:
|
|
|
108
108
|
tickLine: !1,
|
|
109
109
|
axisLine: !1
|
|
110
110
|
}),
|
|
111
|
-
/* @__PURE__ */ C(
|
|
111
|
+
/* @__PURE__ */ C(ue, {
|
|
112
112
|
cursor: {
|
|
113
113
|
fill: "hsl(var(--muted))",
|
|
114
114
|
opacity: .2
|
|
@@ -123,7 +123,7 @@ function ve({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height:
|
|
|
123
123
|
},
|
|
124
124
|
itemStyle: { color: "hsl(var(--primary))" }
|
|
125
125
|
}),
|
|
126
|
-
/* @__PURE__ */ C(
|
|
126
|
+
/* @__PURE__ */ C(M, { wrapperStyle: {
|
|
127
127
|
paddingTop: "20px",
|
|
128
128
|
fontFamily: "monospace"
|
|
129
129
|
} }),
|
|
@@ -144,32 +144,32 @@ function ve({ data: e = [], dataKey: t = "value", xAxisKey: n = "name", height:
|
|
|
144
144
|
})
|
|
145
145
|
});
|
|
146
146
|
}
|
|
147
|
-
var
|
|
147
|
+
var xe = H((() => {}));
|
|
148
148
|
//#endregion
|
|
149
149
|
//#region src/ChartContainerImpl.tsx
|
|
150
|
-
function
|
|
151
|
-
let e = o.useContext(
|
|
150
|
+
function Se() {
|
|
151
|
+
let e = o.useContext(Te);
|
|
152
152
|
if (!e) throw Error("useChart must be used within a <ChartContainer />");
|
|
153
153
|
return e;
|
|
154
154
|
}
|
|
155
|
-
function
|
|
155
|
+
function U({ id: e, className: t, children: n, config: r, ...i }) {
|
|
156
156
|
let a = o.useId(), s = `chart-${e || a.replace(/:/g, "")}`;
|
|
157
|
-
return /* @__PURE__ */ C(
|
|
157
|
+
return /* @__PURE__ */ C(Te.Provider, {
|
|
158
158
|
value: { config: r },
|
|
159
159
|
children: /* @__PURE__ */ w("div", {
|
|
160
160
|
"data-slot": "chart",
|
|
161
161
|
"data-chart": s,
|
|
162
|
-
className:
|
|
162
|
+
className: K("flex w-full h-[350px] justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground", t),
|
|
163
163
|
style: {
|
|
164
164
|
minHeight: 280,
|
|
165
165
|
minWidth: 0,
|
|
166
166
|
...i.style
|
|
167
167
|
},
|
|
168
168
|
...i,
|
|
169
|
-
children: [/* @__PURE__ */ C(
|
|
169
|
+
children: [/* @__PURE__ */ C(Ee, {
|
|
170
170
|
id: s,
|
|
171
171
|
config: r
|
|
172
|
-
}), /* @__PURE__ */ C(
|
|
172
|
+
}), /* @__PURE__ */ C(se, {
|
|
173
173
|
width: "100%",
|
|
174
174
|
height: "100%",
|
|
175
175
|
children: n
|
|
@@ -177,15 +177,15 @@ function W({ id: e, className: t, children: n, config: r, ...i }) {
|
|
|
177
177
|
})
|
|
178
178
|
});
|
|
179
179
|
}
|
|
180
|
-
function
|
|
181
|
-
let { config: m } =
|
|
180
|
+
function W({ active: e, payload: t, className: n, indicator: r = "dot", hideLabel: i = !1, hideIndicator: a = !1, label: s, labelFormatter: c, labelClassName: l, formatter: u, color: d, nameKey: f, labelKey: p }) {
|
|
181
|
+
let { config: m } = Se(), h = o.useMemo(() => {
|
|
182
182
|
if (i || !t?.length) return null;
|
|
183
|
-
let [e] = t, n =
|
|
183
|
+
let [e] = t, n = Ce(m, e, `${p || e?.dataKey || e?.name || "value"}`), r = !p && typeof s == "string" ? m[s]?.label || s : n?.label;
|
|
184
184
|
return c ? /* @__PURE__ */ C("div", {
|
|
185
|
-
className:
|
|
185
|
+
className: K("font-medium", l),
|
|
186
186
|
children: c(r, t)
|
|
187
187
|
}) : r ? /* @__PURE__ */ C("div", {
|
|
188
|
-
className:
|
|
188
|
+
className: K("font-medium", l),
|
|
189
189
|
children: r
|
|
190
190
|
}) : null;
|
|
191
191
|
}, [
|
|
@@ -200,21 +200,21 @@ function G({ active: e, payload: t, className: n, indicator: r = "dot", hideLabe
|
|
|
200
200
|
if (!e || !t?.length) return null;
|
|
201
201
|
let g = t.length === 1 && r !== "dot";
|
|
202
202
|
return /* @__PURE__ */ w("div", {
|
|
203
|
-
className:
|
|
203
|
+
className: K("border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl", n),
|
|
204
204
|
children: [g ? null : h, /* @__PURE__ */ C("div", {
|
|
205
205
|
className: "grid gap-1.5",
|
|
206
206
|
children: t.filter((e) => e.type !== "none").map((e, t) => {
|
|
207
|
-
let n =
|
|
207
|
+
let n = Ce(m, e, `${f || e.name || e.dataKey || "value"}`), i = d || e.payload.fill || e.color;
|
|
208
208
|
return /* @__PURE__ */ C("div", {
|
|
209
|
-
className:
|
|
209
|
+
className: K("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", r === "dot" ? "items-center" : ""),
|
|
210
210
|
children: u && e?.value !== void 0 && e.name ? u(e.value, e.name, e, t, e.payload) : /* @__PURE__ */ w(S, { children: [n?.icon ? /* @__PURE__ */ C(n.icon, {}) : !a && /* @__PURE__ */ C("div", {
|
|
211
|
-
className:
|
|
211
|
+
className: K("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", r === "dot" ? "h-2.5 w-2.5" : "", r === "line" ? "w-1" : "", r === "dashed" ? "w-0 border-[1.5px] border-dashed bg-transparent" : "", g && r === "dashed" ? "my-0.5" : ""),
|
|
212
212
|
style: {
|
|
213
213
|
"--color-bg": i,
|
|
214
214
|
"--color-border": i
|
|
215
215
|
}
|
|
216
216
|
}), /* @__PURE__ */ w("div", {
|
|
217
|
-
className:
|
|
217
|
+
className: K("flex flex-1 justify-between leading-none", g ? "items-end" : "items-center"),
|
|
218
218
|
children: [/* @__PURE__ */ w("div", {
|
|
219
219
|
className: "grid gap-1.5",
|
|
220
220
|
children: [g ? h : null, /* @__PURE__ */ C("span", {
|
|
@@ -231,14 +231,14 @@ function G({ active: e, payload: t, className: n, indicator: r = "dot", hideLabe
|
|
|
231
231
|
})]
|
|
232
232
|
});
|
|
233
233
|
}
|
|
234
|
-
function
|
|
235
|
-
let { config: a } =
|
|
234
|
+
function G({ className: e, hideIcon: t = !1, payload: n, verticalAlign: r = "bottom", nameKey: i }) {
|
|
235
|
+
let { config: a } = Se();
|
|
236
236
|
return n?.length ? /* @__PURE__ */ C("div", {
|
|
237
|
-
className:
|
|
237
|
+
className: K("flex items-center justify-center gap-4", r === "top" ? "pb-3" : "pt-3", e),
|
|
238
238
|
children: n.filter((e) => e.type !== "none").map((e) => {
|
|
239
|
-
let n =
|
|
239
|
+
let n = Ce(a, e, `${i || e.dataKey || "value"}`);
|
|
240
240
|
return /* @__PURE__ */ w("div", {
|
|
241
|
-
className:
|
|
241
|
+
className: K("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"),
|
|
242
242
|
children: [n?.icon && !t ? /* @__PURE__ */ C(n.icon, {}) : /* @__PURE__ */ C("div", {
|
|
243
243
|
className: "h-2 w-2 shrink-0 rounded-[2px]",
|
|
244
244
|
style: { backgroundColor: e.color }
|
|
@@ -247,18 +247,18 @@ function K({ className: e, hideIcon: t = !1, payload: n, verticalAlign: r = "bot
|
|
|
247
247
|
})
|
|
248
248
|
}) : null;
|
|
249
249
|
}
|
|
250
|
-
function
|
|
250
|
+
function Ce(e, t, n) {
|
|
251
251
|
if (typeof t != "object" || !t) return;
|
|
252
252
|
let r = "payload" in t && typeof t.payload == "object" && t.payload !== null ? t.payload : void 0, i = n;
|
|
253
253
|
return n in t && typeof t[n] == "string" ? i = t[n] : r && n in r && typeof r[n] == "string" && (i = r[n]), i in e ? e[i] : e[n];
|
|
254
254
|
}
|
|
255
|
-
var
|
|
256
|
-
|
|
255
|
+
var K, we, Te, Ee, q, J, De = H((() => {
|
|
256
|
+
K = (...e) => e.filter(Boolean).join(" "), we = {
|
|
257
257
|
light: "",
|
|
258
258
|
dark: ".dark"
|
|
259
|
-
},
|
|
259
|
+
}, Te = o.createContext(null), Ee = ({ id: e, config: t }) => {
|
|
260
260
|
let n = Object.entries(t).filter(([, e]) => e.theme || e.color);
|
|
261
|
-
return n.length ? /* @__PURE__ */ C("style", { dangerouslySetInnerHTML: { __html: Object.entries(
|
|
261
|
+
return n.length ? /* @__PURE__ */ C("style", { dangerouslySetInnerHTML: { __html: Object.entries(we).map(([t, r]) => `
|
|
262
262
|
${r} [data-chart=${e}] {
|
|
263
263
|
${n.map(([e, n]) => {
|
|
264
264
|
let r = n.theme?.[t] || n.color;
|
|
@@ -266,9 +266,9 @@ ${n.map(([e, n]) => {
|
|
|
266
266
|
}).join("\n")}
|
|
267
267
|
}
|
|
268
268
|
`).join("\n") } }) : null;
|
|
269
|
-
},
|
|
270
|
-
})),
|
|
271
|
-
function
|
|
269
|
+
}, q = ue, J = M;
|
|
270
|
+
})), Oe = /* @__PURE__ */ ve({ default: () => ke });
|
|
271
|
+
function ke({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r = "name", series: i = [], className: a = "", onChartClick: s }) {
|
|
272
272
|
let c = e === "column" ? "bar" : e, l = Array.isArray(t) ? t : [], [u, d] = o.useState(!1), f = o.useCallback((e) => {
|
|
273
273
|
if (!s || !e) return;
|
|
274
274
|
let t = Array.isArray(e.activePayload) ? e.activePayload[0] : void 0;
|
|
@@ -303,13 +303,13 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
303
303
|
let g = {
|
|
304
304
|
bar: D,
|
|
305
305
|
"horizontal-bar": D,
|
|
306
|
-
line:
|
|
307
|
-
area:
|
|
306
|
+
line: P,
|
|
307
|
+
area: re,
|
|
308
308
|
pie: I,
|
|
309
309
|
donut: I,
|
|
310
|
-
radar:
|
|
311
|
-
scatter:
|
|
312
|
-
funnel:
|
|
310
|
+
radar: oe,
|
|
311
|
+
scatter: le,
|
|
312
|
+
funnel: A,
|
|
313
313
|
combo: D
|
|
314
314
|
}[c] || D, _ = o.useCallback((e) => {
|
|
315
315
|
if (e == null || e === "") return "";
|
|
@@ -381,13 +381,13 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
381
381
|
label: a,
|
|
382
382
|
color: t[n % t.length]
|
|
383
383
|
});
|
|
384
|
-
}), /* @__PURE__ */ C(
|
|
384
|
+
}), /* @__PURE__ */ C(U, {
|
|
385
385
|
config: o,
|
|
386
386
|
className: a,
|
|
387
387
|
children: /* @__PURE__ */ w(I, { children: [
|
|
388
|
-
/* @__PURE__ */ C(
|
|
388
|
+
/* @__PURE__ */ C(q, {
|
|
389
389
|
cursor: !1,
|
|
390
|
-
content: /* @__PURE__ */ C(
|
|
390
|
+
content: /* @__PURE__ */ C(W, { hideLabel: !0 })
|
|
391
391
|
}),
|
|
392
392
|
/* @__PURE__ */ C(F, {
|
|
393
393
|
data: l,
|
|
@@ -400,16 +400,16 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
400
400
|
...h,
|
|
401
401
|
children: l.map((e, n) => {
|
|
402
402
|
let i = o[String(e[r])]?.color;
|
|
403
|
-
return i ||= t[n % t.length], /* @__PURE__ */ C(k, { fill:
|
|
403
|
+
return i ||= t[n % t.length], /* @__PURE__ */ C(k, { fill: X(i) }, `cell-${n}`);
|
|
404
404
|
})
|
|
405
405
|
}),
|
|
406
|
-
/* @__PURE__ */ C(
|
|
406
|
+
/* @__PURE__ */ C(J, {
|
|
407
407
|
verticalAlign: "bottom",
|
|
408
408
|
wrapperStyle: {
|
|
409
409
|
fontSize: u ? "11px" : "12px",
|
|
410
410
|
paddingTop: "8px"
|
|
411
411
|
},
|
|
412
|
-
content: /* @__PURE__ */ C(
|
|
412
|
+
content: /* @__PURE__ */ C(G, {
|
|
413
413
|
nameKey: r,
|
|
414
414
|
className: "flex-wrap"
|
|
415
415
|
})
|
|
@@ -424,10 +424,10 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
424
424
|
value: t?.payload?.[e] ?? t?.[e]
|
|
425
425
|
});
|
|
426
426
|
} : void 0;
|
|
427
|
-
return /* @__PURE__ */ C(
|
|
427
|
+
return /* @__PURE__ */ C(U, {
|
|
428
428
|
config: n,
|
|
429
429
|
className: a,
|
|
430
|
-
children: /* @__PURE__ */ w(
|
|
430
|
+
children: /* @__PURE__ */ w(A, { children: [/* @__PURE__ */ C(q, { content: /* @__PURE__ */ C(W, {}) }), /* @__PURE__ */ w(ie, {
|
|
431
431
|
dataKey: e,
|
|
432
432
|
data: l,
|
|
433
433
|
nameKey: r,
|
|
@@ -436,27 +436,27 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
436
436
|
onClick: o,
|
|
437
437
|
style: { cursor: "pointer" }
|
|
438
438
|
} : {},
|
|
439
|
-
children: [/* @__PURE__ */ C(
|
|
439
|
+
children: [/* @__PURE__ */ C(j, {
|
|
440
440
|
position: "right",
|
|
441
441
|
fill: "hsl(var(--foreground))",
|
|
442
442
|
stroke: "none",
|
|
443
443
|
dataKey: r
|
|
444
|
-
}), l.map((e, n) => /* @__PURE__ */ C(k, { fill:
|
|
444
|
+
}), l.map((e, n) => /* @__PURE__ */ C(k, { fill: X(t[n % t.length]) }, `funnel-cell-${n}`))]
|
|
445
445
|
})] })
|
|
446
446
|
});
|
|
447
447
|
}
|
|
448
|
-
if (c === "radar") return /* @__PURE__ */ C(
|
|
448
|
+
if (c === "radar") return /* @__PURE__ */ C(U, {
|
|
449
449
|
config: n,
|
|
450
450
|
className: a,
|
|
451
|
-
children: /* @__PURE__ */ w(
|
|
451
|
+
children: /* @__PURE__ */ w(oe, {
|
|
452
452
|
data: l,
|
|
453
453
|
children: [
|
|
454
454
|
/* @__PURE__ */ C(R, {}),
|
|
455
455
|
/* @__PURE__ */ C(L, { dataKey: r }),
|
|
456
456
|
/* @__PURE__ */ C(z, {}),
|
|
457
|
-
/* @__PURE__ */ C(
|
|
458
|
-
/* @__PURE__ */ C(
|
|
459
|
-
content: /* @__PURE__ */ C(
|
|
457
|
+
/* @__PURE__ */ C(q, { content: /* @__PURE__ */ C(W, {}) }),
|
|
458
|
+
/* @__PURE__ */ C(J, {
|
|
459
|
+
content: /* @__PURE__ */ C(G, {}),
|
|
460
460
|
...u && {
|
|
461
461
|
verticalAlign: "bottom",
|
|
462
462
|
wrapperStyle: {
|
|
@@ -466,8 +466,8 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
466
466
|
}
|
|
467
467
|
}),
|
|
468
468
|
i.map((e) => {
|
|
469
|
-
let t =
|
|
470
|
-
return /* @__PURE__ */ C(
|
|
469
|
+
let t = X(n[e.dataKey]?.color || Y);
|
|
470
|
+
return /* @__PURE__ */ C(ae, {
|
|
471
471
|
dataKey: e.dataKey,
|
|
472
472
|
stroke: t,
|
|
473
473
|
fill: t,
|
|
@@ -477,12 +477,12 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
477
477
|
]
|
|
478
478
|
})
|
|
479
479
|
});
|
|
480
|
-
if (c === "scatter") return /* @__PURE__ */ C(
|
|
480
|
+
if (c === "scatter") return /* @__PURE__ */ C(U, {
|
|
481
481
|
config: n,
|
|
482
482
|
className: a,
|
|
483
|
-
children: /* @__PURE__ */ w(
|
|
483
|
+
children: /* @__PURE__ */ w(le, { children: [
|
|
484
484
|
/* @__PURE__ */ C(O, { vertical: !1 }),
|
|
485
|
-
/* @__PURE__ */ C(
|
|
485
|
+
/* @__PURE__ */ C(B, {
|
|
486
486
|
type: "number",
|
|
487
487
|
dataKey: r,
|
|
488
488
|
name: String(n[r]?.label || r),
|
|
@@ -490,7 +490,7 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
490
490
|
axisLine: !1,
|
|
491
491
|
minTickGap: u ? 32 : 48
|
|
492
492
|
}),
|
|
493
|
-
/* @__PURE__ */ C(
|
|
493
|
+
/* @__PURE__ */ C(V, {
|
|
494
494
|
type: "number",
|
|
495
495
|
dataKey: i[0]?.dataKey || "value",
|
|
496
496
|
name: String(n[i[0]?.dataKey]?.label || i[0]?.dataKey),
|
|
@@ -499,13 +499,13 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
499
499
|
tickFormatter: y,
|
|
500
500
|
width: 48
|
|
501
501
|
}),
|
|
502
|
-
/* @__PURE__ */ C(
|
|
502
|
+
/* @__PURE__ */ C(de, {
|
|
503
503
|
type: "number",
|
|
504
504
|
range: [60, 400]
|
|
505
505
|
}),
|
|
506
|
-
/* @__PURE__ */ C(
|
|
507
|
-
/* @__PURE__ */ C(
|
|
508
|
-
content: /* @__PURE__ */ C(
|
|
506
|
+
/* @__PURE__ */ C(q, { content: /* @__PURE__ */ C(W, {}) }),
|
|
507
|
+
/* @__PURE__ */ C(J, {
|
|
508
|
+
content: /* @__PURE__ */ C(G, {}),
|
|
509
509
|
...u && {
|
|
510
510
|
verticalAlign: "bottom",
|
|
511
511
|
wrapperStyle: {
|
|
@@ -515,8 +515,8 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
515
515
|
}
|
|
516
516
|
}),
|
|
517
517
|
i.map((e, t) => {
|
|
518
|
-
let r = v(), i =
|
|
519
|
-
return /* @__PURE__ */ C(
|
|
518
|
+
let r = v(), i = X(n[e.dataKey]?.color || r[t % r.length]);
|
|
519
|
+
return /* @__PURE__ */ C(ce, {
|
|
520
520
|
name: n[e.dataKey]?.label || e.dataKey,
|
|
521
521
|
data: l,
|
|
522
522
|
fill: i
|
|
@@ -524,25 +524,25 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
524
524
|
})
|
|
525
525
|
] })
|
|
526
526
|
});
|
|
527
|
-
if (c === "combo") return /* @__PURE__ */ C(
|
|
527
|
+
if (c === "combo") return /* @__PURE__ */ C(U, {
|
|
528
528
|
config: n,
|
|
529
529
|
className: a,
|
|
530
530
|
children: /* @__PURE__ */ w(D, {
|
|
531
531
|
data: l,
|
|
532
532
|
children: [
|
|
533
533
|
/* @__PURE__ */ C(O, { vertical: !1 }),
|
|
534
|
-
/* @__PURE__ */ C(
|
|
534
|
+
/* @__PURE__ */ C(B, {
|
|
535
535
|
dataKey: r,
|
|
536
536
|
...te
|
|
537
537
|
}),
|
|
538
|
-
/* @__PURE__ */ C(
|
|
538
|
+
/* @__PURE__ */ C(V, {
|
|
539
539
|
yAxisId: "left",
|
|
540
540
|
tickLine: !1,
|
|
541
541
|
axisLine: !1,
|
|
542
542
|
tickFormatter: y,
|
|
543
543
|
width: 48
|
|
544
544
|
}),
|
|
545
|
-
/* @__PURE__ */ C(
|
|
545
|
+
/* @__PURE__ */ C(V, {
|
|
546
546
|
yAxisId: "right",
|
|
547
547
|
orientation: "right",
|
|
548
548
|
tickLine: !1,
|
|
@@ -550,9 +550,9 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
550
550
|
tickFormatter: y,
|
|
551
551
|
width: 48
|
|
552
552
|
}),
|
|
553
|
-
/* @__PURE__ */ C(
|
|
554
|
-
/* @__PURE__ */ C(
|
|
555
|
-
content: /* @__PURE__ */ C(
|
|
553
|
+
/* @__PURE__ */ C(q, { content: /* @__PURE__ */ C(W, {}) }),
|
|
554
|
+
/* @__PURE__ */ C(J, {
|
|
555
|
+
content: /* @__PURE__ */ C(G, {}),
|
|
556
556
|
...u && {
|
|
557
557
|
verticalAlign: "bottom",
|
|
558
558
|
wrapperStyle: {
|
|
@@ -562,8 +562,8 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
562
562
|
}
|
|
563
563
|
}),
|
|
564
564
|
i.map((e, t) => {
|
|
565
|
-
let r =
|
|
566
|
-
return i === "line" ? /* @__PURE__ */ C(
|
|
565
|
+
let r = X(n[e.dataKey]?.color || Y), i = e.chartType || (t === 0 ? "bar" : "line"), a = i === "bar" ? "left" : "right";
|
|
566
|
+
return i === "line" ? /* @__PURE__ */ C(N, {
|
|
567
567
|
yAxisId: a,
|
|
568
568
|
type: "monotone",
|
|
569
569
|
dataKey: e.dataKey,
|
|
@@ -588,7 +588,7 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
588
588
|
})
|
|
589
589
|
});
|
|
590
590
|
let b = c === "horizontal-bar";
|
|
591
|
-
return /* @__PURE__ */ C(
|
|
591
|
+
return /* @__PURE__ */ C(U, {
|
|
592
592
|
config: n,
|
|
593
593
|
className: a,
|
|
594
594
|
children: /* @__PURE__ */ w(g, {
|
|
@@ -597,30 +597,30 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
597
597
|
...m,
|
|
598
598
|
children: [
|
|
599
599
|
/* @__PURE__ */ C(O, { vertical: !1 }),
|
|
600
|
-
b ? /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(
|
|
600
|
+
b ? /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(B, {
|
|
601
601
|
type: "number",
|
|
602
602
|
tickLine: !1,
|
|
603
603
|
axisLine: !1,
|
|
604
604
|
tickFormatter: y
|
|
605
|
-
}), /* @__PURE__ */ C(
|
|
605
|
+
}), /* @__PURE__ */ C(V, {
|
|
606
606
|
type: "category",
|
|
607
607
|
dataKey: r,
|
|
608
608
|
tickLine: !1,
|
|
609
609
|
axisLine: !1,
|
|
610
610
|
width: Math.min(140, Math.max(60, Math.max(...l.map((e) => String(e[r] ?? "").length)) * 7)),
|
|
611
611
|
tickFormatter: _
|
|
612
|
-
})] }) : /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(
|
|
612
|
+
})] }) : /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(B, {
|
|
613
613
|
dataKey: r,
|
|
614
614
|
...te
|
|
615
|
-
}), /* @__PURE__ */ C(
|
|
615
|
+
}), /* @__PURE__ */ C(V, {
|
|
616
616
|
tickLine: !1,
|
|
617
617
|
axisLine: !1,
|
|
618
618
|
tickFormatter: y,
|
|
619
619
|
width: 48
|
|
620
620
|
})] }),
|
|
621
|
-
/* @__PURE__ */ C(
|
|
622
|
-
/* @__PURE__ */ C(
|
|
623
|
-
content: /* @__PURE__ */ C(
|
|
621
|
+
/* @__PURE__ */ C(q, { content: /* @__PURE__ */ C(W, {}) }),
|
|
622
|
+
/* @__PURE__ */ C(J, {
|
|
623
|
+
content: /* @__PURE__ */ C(G, {}),
|
|
624
624
|
...u && {
|
|
625
625
|
verticalAlign: "bottom",
|
|
626
626
|
wrapperStyle: {
|
|
@@ -630,17 +630,17 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
630
630
|
}
|
|
631
631
|
}),
|
|
632
632
|
i.map((e, t) => {
|
|
633
|
-
let r = v(), a =
|
|
633
|
+
let r = v(), a = X(n[e.dataKey]?.color || r[t % r.length] || Y);
|
|
634
634
|
if (c === "bar" || c === "horizontal-bar") {
|
|
635
635
|
let t = i.length === 1 && l.length > 1;
|
|
636
636
|
return /* @__PURE__ */ C(E, {
|
|
637
637
|
dataKey: e.dataKey,
|
|
638
638
|
fill: a,
|
|
639
639
|
radius: 4,
|
|
640
|
-
children: t && l.map((e, t) => /* @__PURE__ */ C(k, { fill:
|
|
640
|
+
children: t && l.map((e, t) => /* @__PURE__ */ C(k, { fill: X(r[t % r.length]) }, `cell-${t}`))
|
|
641
641
|
}, e.dataKey);
|
|
642
642
|
}
|
|
643
|
-
return c === "line" ? /* @__PURE__ */ C(
|
|
643
|
+
return c === "line" ? /* @__PURE__ */ C(N, {
|
|
644
644
|
type: "monotone",
|
|
645
645
|
dataKey: e.dataKey,
|
|
646
646
|
stroke: a,
|
|
@@ -658,8 +658,8 @@ function De({ chartType: e = "bar", data: t = [], config: n = {}, xAxisKey: r =
|
|
|
658
658
|
})
|
|
659
659
|
});
|
|
660
660
|
}
|
|
661
|
-
var
|
|
662
|
-
|
|
661
|
+
var Y, Ae, X, je = H((() => {
|
|
662
|
+
De(), Y = "hsl(var(--primary))", Ae = {
|
|
663
663
|
slate: "#64748b",
|
|
664
664
|
gray: "#6b7280",
|
|
665
665
|
zinc: "#71717a",
|
|
@@ -682,10 +682,10 @@ var X, Oe, Z, ke = U((() => {
|
|
|
682
682
|
fuchsia: "#d946ef",
|
|
683
683
|
pink: "#ec4899",
|
|
684
684
|
rose: "#f43f5e"
|
|
685
|
-
},
|
|
686
|
-
})),
|
|
685
|
+
}, X = (e) => Ae[e] || e;
|
|
686
|
+
})), Me = s.lazy(() => Promise.resolve().then(() => (xe(), ye))), Ne = s.lazy(() => Promise.resolve().then(() => (je(), Oe))), Pe = ({ schema: e }) => /* @__PURE__ */ C(c, {
|
|
687
687
|
fallback: /* @__PURE__ */ C(x, { className: "w-full h-48 sm:h-64 md:h-80 lg:h-[400px]" }),
|
|
688
|
-
children: /* @__PURE__ */ C(
|
|
688
|
+
children: /* @__PURE__ */ C(Me, {
|
|
689
689
|
data: e.data,
|
|
690
690
|
dataKey: e.dataKey,
|
|
691
691
|
xAxisKey: e.xAxisKey,
|
|
@@ -693,7 +693,7 @@ var X, Oe, Z, ke = U((() => {
|
|
|
693
693
|
className: e.className,
|
|
694
694
|
color: e.color
|
|
695
695
|
})
|
|
696
|
-
}),
|
|
696
|
+
}), Z = ({ schema: e, onChartClick: t }) => {
|
|
697
697
|
let n = s.useMemo(() => {
|
|
698
698
|
let t = e.series, n = e.xAxisKey, r = e.config;
|
|
699
699
|
if (n || (e.index ? n = e.index : e.category && (n = e.category)), t || (e.categories ? t = e.categories.map((e) => ({ dataKey: e })) : e.value && (t = [{ dataKey: e.value }])), !r && t) {
|
|
@@ -720,7 +720,7 @@ var X, Oe, Z, ke = U((() => {
|
|
|
720
720
|
}, [e]);
|
|
721
721
|
return /* @__PURE__ */ C(c, {
|
|
722
722
|
fallback: /* @__PURE__ */ C(x, { className: "w-full h-48 sm:h-64 md:h-80 lg:h-[400px]" }),
|
|
723
|
-
children: /* @__PURE__ */ C(
|
|
723
|
+
children: /* @__PURE__ */ C(Ne, {
|
|
724
724
|
chartType: n.chartType,
|
|
725
725
|
data: n.data,
|
|
726
726
|
config: n.config,
|
|
@@ -733,10 +733,10 @@ var X, Oe, Z, ke = U((() => {
|
|
|
733
733
|
};
|
|
734
734
|
//#endregion
|
|
735
735
|
//#region src/ObjectChart.tsx
|
|
736
|
-
function
|
|
736
|
+
function Q(e) {
|
|
737
737
|
return e.replace(/[_-]/g, " ").replace(/\b\w/g, (e) => e.toUpperCase());
|
|
738
738
|
}
|
|
739
|
-
function
|
|
739
|
+
function Fe(e, t) {
|
|
740
740
|
let { field: n, function: r, groupBy: i } = t, a = {};
|
|
741
741
|
for (let t of e) {
|
|
742
742
|
let e = String(t[i] ?? "Unknown");
|
|
@@ -767,13 +767,13 @@ function Ne(e, t) {
|
|
|
767
767
|
};
|
|
768
768
|
});
|
|
769
769
|
}
|
|
770
|
-
async function
|
|
770
|
+
async function Ie(e, t, r, i, a) {
|
|
771
771
|
if (!e.length || !t) return e;
|
|
772
772
|
let o = a || ((e, t) => t), s = `__raw_${t}`, c = r?.fields?.[t];
|
|
773
773
|
if (!c) {
|
|
774
774
|
let n = /^\d{4}-\d{2}-\d{2}/;
|
|
775
775
|
return e.map((e) => {
|
|
776
|
-
let r = e[t], i = String(r ?? ""), a = n.test(i) ? i :
|
|
776
|
+
let r = e[t], i = String(r ?? ""), a = n.test(i) ? i : Q(i);
|
|
777
777
|
return {
|
|
778
778
|
...e,
|
|
779
779
|
[t]: o(i, a),
|
|
@@ -785,7 +785,7 @@ async function Pe(e, t, r, i, a) {
|
|
|
785
785
|
if (l === "select" || l === "picklist" || l === "dropdown") {
|
|
786
786
|
let n = c.options || [];
|
|
787
787
|
if (n.length === 0) return e.map((e) => {
|
|
788
|
-
let n = e[t], r = String(n ?? ""), i =
|
|
788
|
+
let n = e[t], r = String(n ?? ""), i = Q(r);
|
|
789
789
|
return {
|
|
790
790
|
...e,
|
|
791
791
|
[t]: o(r, i),
|
|
@@ -795,7 +795,7 @@ async function Pe(e, t, r, i, a) {
|
|
|
795
795
|
let r = {};
|
|
796
796
|
for (let e of n) typeof e == "string" ? r[e] = e : e && typeof e == "object" && (r[String(e.value)] = e.label || String(e.value));
|
|
797
797
|
return e.map((e) => {
|
|
798
|
-
let n = e[t], i = String(n ?? ""), a = r[i] ||
|
|
798
|
+
let n = e[t], i = String(n ?? ""), a = r[i] || Q(i);
|
|
799
799
|
return {
|
|
800
800
|
...e,
|
|
801
801
|
[t]: o(i, a),
|
|
@@ -848,52 +848,54 @@ async function Pe(e, t, r, i, a) {
|
|
|
848
848
|
let n = e[t], r = String(n ?? "");
|
|
849
849
|
return {
|
|
850
850
|
...e,
|
|
851
|
-
[t]: u.test(r) ? r :
|
|
851
|
+
[t]: u.test(r) ? r : Q(r),
|
|
852
852
|
[s]: n
|
|
853
853
|
};
|
|
854
854
|
});
|
|
855
855
|
}
|
|
856
|
-
var
|
|
857
|
-
let { schema: o } = e, s = u(
|
|
856
|
+
var $ = (e) => {
|
|
857
|
+
let { schema: o } = e, s = u(pe), c = e.dataSource || s?.dataSource, x = me(o.bind), { fieldOptionLabel: S } = ge(), T = p(S);
|
|
858
858
|
d(() => {
|
|
859
|
-
|
|
860
|
-
}, [
|
|
861
|
-
let [
|
|
862
|
-
if (!
|
|
863
|
-
t.current && (
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
t
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
859
|
+
T.current = S;
|
|
860
|
+
}, [S]);
|
|
861
|
+
let [re, E] = m([]), [D, O] = m(() => !(Array.isArray(o.data) && o.data.length > 0) && !!o.objectName), [k, ie] = m(null), [A, j] = m(null), M = f(() => o.aggregate ? JSON.stringify(o.aggregate) : "", [o.aggregate]), N = f(() => o.filter ? JSON.stringify(o.filter) : "", [o.filter]), P = l(async (e, t) => {
|
|
862
|
+
if (!e || !o.objectName) {
|
|
863
|
+
t.current && O(!1);
|
|
864
|
+
return;
|
|
865
|
+
}
|
|
866
|
+
t.current && (O(!0), ie(null));
|
|
867
|
+
try {
|
|
868
|
+
let r, a = i(o.filter);
|
|
869
|
+
if (o.aggregate && typeof e.aggregate == "function") {
|
|
870
|
+
let t = await e.aggregate(o.objectName, {
|
|
871
|
+
field: o.aggregate.field,
|
|
872
|
+
function: o.aggregate.function,
|
|
873
|
+
groupBy: o.aggregate.groupBy,
|
|
874
|
+
filter: a
|
|
875
|
+
});
|
|
876
|
+
r = Array.isArray(t) ? t : [];
|
|
877
|
+
} else if (typeof e.find == "function") r = n(await e.find(o.objectName, { $filter: a })), o.aggregate && r.length > 0 && (r = Fe(r, o.aggregate));
|
|
878
|
+
else return;
|
|
879
|
+
let s = o.aggregate?.groupBy || o.xAxisKey;
|
|
880
|
+
if (s && typeof e.getObjectSchema == "function") try {
|
|
881
|
+
let t = await e.getObjectSchema(o.objectName);
|
|
882
|
+
r = await Ie(r, s, t, e, (e, t) => T.current(o.objectName, s, e, t));
|
|
883
|
+
} catch {}
|
|
884
|
+
t.current && E(r);
|
|
885
|
+
} catch (e) {
|
|
886
|
+
console.error("[ObjectChart] Fetch error:", e), t.current && ie(e instanceof Error ? e.message : "Failed to load chart data");
|
|
887
|
+
} finally {
|
|
888
|
+
t.current && O(!1);
|
|
887
889
|
}
|
|
888
890
|
}, [
|
|
889
891
|
o.objectName,
|
|
890
|
-
|
|
891
|
-
|
|
892
|
+
M,
|
|
893
|
+
N,
|
|
892
894
|
o.xAxisKey
|
|
893
895
|
]);
|
|
894
896
|
d(() => {
|
|
895
897
|
let e = { current: !0 };
|
|
896
|
-
return o.objectName && !x && !o.data
|
|
898
|
+
return o.objectName && !x && !o.data ? P(c, e) : e.current && O(!1), () => {
|
|
897
899
|
e.current = !1;
|
|
898
900
|
};
|
|
899
901
|
}, [
|
|
@@ -901,46 +903,46 @@ var Fe = (e) => {
|
|
|
901
903
|
c,
|
|
902
904
|
x,
|
|
903
905
|
o.data,
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
906
|
+
N,
|
|
907
|
+
M,
|
|
908
|
+
P
|
|
907
909
|
]);
|
|
908
|
-
let
|
|
909
|
-
if (!
|
|
910
|
-
let e = /* @__PURE__ */ new Map(), t = `__raw_${
|
|
911
|
-
for (let n of
|
|
912
|
-
let r = n?.[
|
|
910
|
+
let F = x || o.data || re, I = Array.isArray(F) ? F : [], L = o.drillDown, R = o.aggregate?.groupBy || o.xAxisKey, z = f(() => {
|
|
911
|
+
if (!R) return /* @__PURE__ */ new Map();
|
|
912
|
+
let e = /* @__PURE__ */ new Map(), t = `__raw_${R}`;
|
|
913
|
+
for (let n of I) {
|
|
914
|
+
let r = n?.[R];
|
|
913
915
|
if (r == null) continue;
|
|
914
916
|
let i = t in (n || {}) ? n[t] : r;
|
|
915
917
|
e.set(String(r), i);
|
|
916
918
|
}
|
|
917
919
|
return e;
|
|
918
|
-
}, [
|
|
920
|
+
}, [I, R]), ae = {
|
|
919
921
|
...o,
|
|
920
|
-
data:
|
|
922
|
+
data: I
|
|
921
923
|
};
|
|
922
|
-
if (
|
|
924
|
+
if (D && I.length === 0) return /* @__PURE__ */ C("div", {
|
|
923
925
|
className: "flex items-center justify-center text-muted-foreground text-sm p-4 " + (o.className || ""),
|
|
924
926
|
"data-testid": "chart-loading",
|
|
925
927
|
children: "Loading chart data…"
|
|
926
928
|
});
|
|
927
|
-
if (
|
|
929
|
+
if (k) return /* @__PURE__ */ w("div", {
|
|
928
930
|
className: "flex flex-col items-center justify-center gap-2 p-4 " + (o.className || ""),
|
|
929
931
|
"data-testid": "chart-error",
|
|
930
932
|
role: "alert",
|
|
931
933
|
children: [
|
|
932
|
-
/* @__PURE__ */ C(
|
|
934
|
+
/* @__PURE__ */ C(he, { className: "h-6 w-6 text-destructive opacity-60" }),
|
|
933
935
|
/* @__PURE__ */ C("p", {
|
|
934
936
|
className: "text-xs text-destructive font-medium",
|
|
935
937
|
children: "Failed to load chart data"
|
|
936
938
|
}),
|
|
937
939
|
/* @__PURE__ */ C("p", {
|
|
938
940
|
className: "text-xs text-muted-foreground max-w-xs text-center",
|
|
939
|
-
children:
|
|
941
|
+
children: k
|
|
940
942
|
})
|
|
941
943
|
]
|
|
942
944
|
});
|
|
943
|
-
if (!c && o.objectName &&
|
|
945
|
+
if (!c && o.objectName && I.length === 0) return /* @__PURE__ */ w("div", {
|
|
944
946
|
className: "flex items-center justify-center text-muted-foreground text-sm p-4 " + (o.className || ""),
|
|
945
947
|
"data-testid": "chart-no-datasource",
|
|
946
948
|
children: [
|
|
@@ -949,29 +951,29 @@ var Fe = (e) => {
|
|
|
949
951
|
"”"
|
|
950
952
|
]
|
|
951
953
|
});
|
|
952
|
-
let
|
|
953
|
-
let t = e.category, n = t != null &&
|
|
954
|
-
|
|
954
|
+
let oe = r(L) ? (e) => {
|
|
955
|
+
let t = e.category, n = t != null && z.has(String(t)) ? z.get(String(t)) : t;
|
|
956
|
+
j({
|
|
955
957
|
...e,
|
|
956
958
|
category: n,
|
|
957
959
|
categoryLabel: t,
|
|
958
960
|
scope: "cell"
|
|
959
961
|
});
|
|
960
|
-
} : void 0,
|
|
961
|
-
let e = t(
|
|
962
|
+
} : void 0, se = A && o.objectName ? (() => {
|
|
963
|
+
let e = t(L, A, { groupByField: R }), n = {
|
|
962
964
|
...o.filter || {},
|
|
963
965
|
...e
|
|
964
|
-
}, r = a(
|
|
966
|
+
}, r = a(L, A, o.title || "Details"), i = L?.target ?? "drawer", s = /* @__PURE__ */ C("div", {
|
|
965
967
|
className: "overflow-auto",
|
|
966
968
|
"data-testid": "chart-drill-body",
|
|
967
|
-
children: /* @__PURE__ */ C(
|
|
969
|
+
children: /* @__PURE__ */ C(fe, {
|
|
968
970
|
schema: {
|
|
969
971
|
type: "object-data-table",
|
|
970
972
|
objectName: o.objectName,
|
|
971
973
|
filter: n,
|
|
972
974
|
pagination: !0,
|
|
973
|
-
pageSize:
|
|
974
|
-
columns:
|
|
975
|
+
pageSize: L?.maxRows,
|
|
976
|
+
columns: L?.columns?.map((e) => ({
|
|
975
977
|
accessorKey: e,
|
|
976
978
|
header: e
|
|
977
979
|
}))
|
|
@@ -981,31 +983,38 @@ var Fe = (e) => {
|
|
|
981
983
|
});
|
|
982
984
|
return i === "dialog" ? /* @__PURE__ */ C(h, {
|
|
983
985
|
open: !0,
|
|
984
|
-
onOpenChange: (e) => !e &&
|
|
986
|
+
onOpenChange: (e) => !e && j(null),
|
|
985
987
|
children: /* @__PURE__ */ w(g, {
|
|
986
988
|
className: "max-w-4xl",
|
|
987
989
|
children: [/* @__PURE__ */ C(_, { children: /* @__PURE__ */ C(ee, { children: r }) }), s]
|
|
988
990
|
})
|
|
989
|
-
}) : /* @__PURE__ */ C(
|
|
991
|
+
}) : /* @__PURE__ */ C(y, {
|
|
990
992
|
open: !0,
|
|
991
|
-
onOpenChange: (e) => !e &&
|
|
992
|
-
children: /* @__PURE__ */ w(
|
|
993
|
+
onOpenChange: (e) => !e && j(null),
|
|
994
|
+
children: /* @__PURE__ */ w(te, {
|
|
993
995
|
side: "right",
|
|
994
996
|
className: "w-full sm:max-w-2xl md:max-w-3xl lg:max-w-4xl flex flex-col",
|
|
995
|
-
children: [/* @__PURE__ */ C(
|
|
997
|
+
children: [/* @__PURE__ */ C(b, { children: /* @__PURE__ */ C(ne, { children: r }) }), /* @__PURE__ */ C("div", {
|
|
996
998
|
className: "flex-1 overflow-hidden mt-2",
|
|
997
999
|
children: s
|
|
998
1000
|
})]
|
|
999
1001
|
})
|
|
1000
1002
|
});
|
|
1001
1003
|
})() : null;
|
|
1002
|
-
return /* @__PURE__ */ w(
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1004
|
+
return /* @__PURE__ */ w("div", {
|
|
1005
|
+
className: "relative",
|
|
1006
|
+
children: [
|
|
1007
|
+
/* @__PURE__ */ C(v, { active: D && I.length > 0 }),
|
|
1008
|
+
/* @__PURE__ */ C(Z, {
|
|
1009
|
+
...e,
|
|
1010
|
+
schema: ae,
|
|
1011
|
+
onChartClick: oe
|
|
1012
|
+
}),
|
|
1013
|
+
se
|
|
1014
|
+
]
|
|
1015
|
+
});
|
|
1007
1016
|
};
|
|
1008
|
-
e.register("object-chart",
|
|
1017
|
+
e.register("object-chart", $, {
|
|
1009
1018
|
namespace: "plugin-charts",
|
|
1010
1019
|
label: "Object Chart",
|
|
1011
1020
|
category: "view",
|
|
@@ -1037,11 +1046,11 @@ e.register("object-chart", Fe, {
|
|
|
1037
1046
|
});
|
|
1038
1047
|
//#endregion
|
|
1039
1048
|
//#region src/index.tsx
|
|
1040
|
-
var
|
|
1041
|
-
"bar-chart":
|
|
1042
|
-
chart:
|
|
1049
|
+
var Le = {
|
|
1050
|
+
"bar-chart": Pe,
|
|
1051
|
+
chart: Z
|
|
1043
1052
|
};
|
|
1044
|
-
e.register("bar-chart",
|
|
1053
|
+
e.register("bar-chart", Pe, {
|
|
1045
1054
|
namespace: "plugin-charts",
|
|
1046
1055
|
label: "Bar Chart",
|
|
1047
1056
|
category: "plugin",
|
|
@@ -1105,7 +1114,7 @@ e.register("bar-chart", Me, {
|
|
|
1105
1114
|
height: 400,
|
|
1106
1115
|
color: "#8884d8"
|
|
1107
1116
|
}
|
|
1108
|
-
}), e.register("chart",
|
|
1117
|
+
}), e.register("chart", $, {
|
|
1109
1118
|
namespace: "view",
|
|
1110
1119
|
category: "view",
|
|
1111
1120
|
label: "Chart",
|
|
@@ -1132,7 +1141,7 @@ e.register("bar-chart", Me, {
|
|
|
1132
1141
|
label: "Value Field"
|
|
1133
1142
|
}
|
|
1134
1143
|
]
|
|
1135
|
-
}), e.register("chart",
|
|
1144
|
+
}), e.register("chart", Z, {
|
|
1136
1145
|
namespace: "plugin-charts",
|
|
1137
1146
|
label: "Chart",
|
|
1138
1147
|
category: "plugin",
|
|
@@ -1244,31 +1253,31 @@ e.register("bar-chart", Me, {
|
|
|
1244
1253
|
xAxisKey: "name",
|
|
1245
1254
|
series: [{ dataKey: "sales" }, { dataKey: "revenue" }]
|
|
1246
1255
|
}
|
|
1247
|
-
}), e.register("chart:bar",
|
|
1256
|
+
}), e.register("chart:bar", Z, {
|
|
1248
1257
|
namespace: "plugin-charts",
|
|
1249
1258
|
label: "Bar Chart (Alias)",
|
|
1250
1259
|
category: "plugin",
|
|
1251
1260
|
defaultProps: { chartType: "bar" }
|
|
1252
|
-
}), e.register("pie-chart",
|
|
1261
|
+
}), e.register("pie-chart", Z, {
|
|
1253
1262
|
namespace: "plugin-charts",
|
|
1254
1263
|
label: "Pie Chart",
|
|
1255
1264
|
category: "plugin",
|
|
1256
1265
|
defaultProps: { chartType: "pie" }
|
|
1257
|
-
}), e.register("donut-chart",
|
|
1266
|
+
}), e.register("donut-chart", Z, {
|
|
1258
1267
|
namespace: "plugin-charts",
|
|
1259
1268
|
label: "Donut Chart",
|
|
1260
1269
|
category: "plugin",
|
|
1261
1270
|
defaultProps: { chartType: "donut" }
|
|
1262
|
-
}), e.register("radar-chart",
|
|
1271
|
+
}), e.register("radar-chart", Z, {
|
|
1263
1272
|
namespace: "plugin-charts",
|
|
1264
1273
|
label: "Radar Chart",
|
|
1265
1274
|
category: "plugin",
|
|
1266
1275
|
defaultProps: { chartType: "radar" }
|
|
1267
|
-
}), e.register("scatter-chart",
|
|
1276
|
+
}), e.register("scatter-chart", Z, {
|
|
1268
1277
|
namespace: "plugin-charts",
|
|
1269
1278
|
label: "Scatter Chart",
|
|
1270
1279
|
category: "plugin",
|
|
1271
1280
|
defaultProps: { chartType: "scatter" }
|
|
1272
1281
|
});
|
|
1273
1282
|
//#endregion
|
|
1274
|
-
export {
|
|
1283
|
+
export { Pe as ChartBarRenderer, Z as ChartRenderer, $ as ObjectChart, Le as chartComponents };
|
package/dist/index.umd.cjs
CHANGED
|
@@ -4,4 +4,4 @@ ${n.map(([e,n])=>{let r=n.theme?.[t]||n.color;return r?` --color-${e}: ${r};`:n
|
|
|
4
4
|
`)}
|
|
5
5
|
}
|
|
6
6
|
`).join(`
|
|
7
|
-
`)}}):null},A=a.Tooltip,j=a.Legend})),N=g({default:()=>P});function P({chartType:e=`bar`,data:t=[],config:r={},xAxisKey:o=`name`,series:s=[],className:c=``,onChartClick:l}){let u=e===`column`?`bar`:e,d=Array.isArray(t)?t:[],[f,p]=n.useState(!1),m=n.useCallback(e=>{if(!l||!e)return;let t=Array.isArray(e.activePayload)?e.activePayload[0]:void 0;l({category:e.activeLabel==null?void 0:String(e.activeLabel),series:t?.dataKey?String(t.dataKey):void 0,value:typeof t?.value==`number`?t.value:void 0})},[l]),h=n.useCallback(e=>{if(!l||!e)return;let t=e.payload?.[o],n=s[0]?.dataKey||`value`;l({category:t==null?void 0:String(t),series:n,value:typeof e.payload?.[n]==`number`?e.payload[n]:void 0})},[l,o,s]),g=l?{onClick:m,style:{cursor:`pointer`}}:{},_=l?{onClick:h,style:{cursor:`pointer`}}:{};n.useEffect(()=>{let e=()=>p(window.innerWidth<640);return e(),window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[]);let v={bar:a.BarChart,"horizontal-bar":a.BarChart,line:a.LineChart,area:a.AreaChart,pie:a.PieChart,donut:a.PieChart,radar:a.RadarChart,scatter:a.ScatterChart,funnel:a.FunnelChart,combo:a.BarChart}[u]||a.BarChart,y=n.useCallback(e=>{if(e==null||e===``)return``;let t=typeof e==`string`?e:String(e);if(/^\d{4}-\d{2}-\d{2}/.test(t)){let e=new Date(t);if(!Number.isNaN(e.getTime())){let t=(d.length>1?Math.abs(new Date(String(d[d.length-1][o]??``)).getTime()-new Date(String(d[0][o]??``)).getTime()):0)/(1e3*60*60*24);try{return t<=62?e.toLocaleDateString(void 0,{month:`short`,day:`numeric`}):e.toLocaleDateString(void 0,{month:`short`,year:`numeric`})}catch{return e.toISOString().slice(0,10)}}}return f&&t.length>8?t.slice(0,8)+`…`:t},[d,o,f]),b=n.useMemo(()=>d.some(e=>String(e[o]||``).length>5),[d,o]),x=()=>[`hsl(var(--chart-1))`,`hsl(var(--chart-2))`,`hsl(var(--chart-3))`,`hsl(var(--chart-4))`,`hsl(var(--chart-5))`],T=n.useCallback(e=>{if(e==null||e===``)return``;let t=typeof e==`number`?e:Number(e);if(!Number.isFinite(t))return String(e);try{return new Intl.NumberFormat(void 0,{notation:`compact`,maximumFractionDigits:1}).format(t)}catch{return String(t)}},[]),E=n.useMemo(()=>({tickLine:!1,tickMargin:10,axisLine:!1,interval:`preserveStartEnd`,minTickGap:f?32:48,tickFormatter:y,...!f&&b&&{angle:-35,textAnchor:`end`,height:60}}),[f,b,y]);if(u===`pie`||u===`donut`){let e=u===`donut`?60:0,t=x(),n={...r};return d.forEach((e,r)=>{let i=e?.[o];if(i==null||i===``)return;let a=String(i);n[a]||(n[a]={label:a,color:t[r%t.length]})}),(0,i.jsx)(S,{config:n,className:c,children:(0,i.jsxs)(a.PieChart,{children:[(0,i.jsx)(A,{cursor:!1,content:(0,i.jsx)(C,{hideLabel:!0})}),(0,i.jsx)(a.Pie,{data:d,dataKey:s[0]?.dataKey||`value`,nameKey:o||`name`,innerRadius:e,strokeWidth:5,paddingAngle:2,outerRadius:80,..._,children:d.map((e,r)=>{let s=n[String(e[o])]?.color;return s||=t[r%t.length],(0,i.jsx)(a.Cell,{fill:L(s)},`cell-${r}`)})}),(0,i.jsx)(j,{verticalAlign:`bottom`,wrapperStyle:{fontSize:f?`11px`:`12px`,paddingTop:`8px`},content:(0,i.jsx)(w,{nameKey:o,className:`flex-wrap`})})]})})}if(u===`funnel`){let e=s[0]?.dataKey||`value`,t=x(),n=l?t=>{t&&l({category:t?.payload?.[o]??t?.[o],value:t?.payload?.[e]??t?.[e]})}:void 0;return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.FunnelChart,{children:[(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsxs)(a.Funnel,{dataKey:e,data:d,nameKey:o,isAnimationActive:!0,...n?{onClick:n,style:{cursor:`pointer`}}:{},children:[(0,i.jsx)(a.LabelList,{position:`right`,fill:`hsl(var(--foreground))`,stroke:`none`,dataKey:o}),d.map((e,n)=>(0,i.jsx)(a.Cell,{fill:L(t[n%t.length])},`funnel-cell-${n}`))]})]})})}if(u===`radar`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.RadarChart,{data:d,children:[(0,i.jsx)(a.PolarGrid,{}),(0,i.jsx)(a.PolarAngleAxis,{dataKey:o}),(0,i.jsx)(a.PolarRadiusAxis,{}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map(e=>{let t=L(r[e.dataKey]?.color||F);return(0,i.jsx)(a.Radar,{dataKey:e.dataKey,stroke:t,fill:t,fillOpacity:.6},e.dataKey)})]})});if(u===`scatter`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.ScatterChart,{children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),(0,i.jsx)(a.XAxis,{type:`number`,dataKey:o,name:String(r[o]?.label||o),tickLine:!1,axisLine:!1,minTickGap:f?32:48}),(0,i.jsx)(a.YAxis,{type:`number`,dataKey:s[0]?.dataKey||`value`,name:String(r[s[0]?.dataKey]?.label||s[0]?.dataKey),tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(a.ZAxis,{type:`number`,range:[60,400]}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=x(),o=L(r[e.dataKey]?.color||n[t%n.length]);return(0,i.jsx)(a.Scatter,{name:r[e.dataKey]?.label||e.dataKey,data:d,fill:o},e.dataKey)})]})});if(u===`combo`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.BarChart,{data:d,children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),(0,i.jsx)(a.XAxis,{dataKey:o,...E}),(0,i.jsx)(a.YAxis,{yAxisId:`left`,tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(a.YAxis,{yAxisId:`right`,orientation:`right`,tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=L(r[e.dataKey]?.color||F),o=e.chartType||(t===0?`bar`:`line`),s=o===`bar`?`left`:`right`;return o===`line`?(0,i.jsx)(a.Line,{yAxisId:s,type:`monotone`,dataKey:e.dataKey,stroke:n,strokeWidth:2,dot:!1},e.dataKey):o===`area`?(0,i.jsx)(a.Area,{yAxisId:s,type:`monotone`,dataKey:e.dataKey,fill:n,stroke:n,fillOpacity:.4},e.dataKey):(0,i.jsx)(a.Bar,{yAxisId:s,dataKey:e.dataKey,fill:n,radius:4},e.dataKey)})]})});let D=u===`horizontal-bar`;return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(v,{data:d,layout:D?`vertical`:`horizontal`,...g,children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),D?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(a.XAxis,{type:`number`,tickLine:!1,axisLine:!1,tickFormatter:T}),(0,i.jsx)(a.YAxis,{type:`category`,dataKey:o,tickLine:!1,axisLine:!1,width:Math.min(140,Math.max(60,Math.max(...d.map(e=>String(e[o]??``).length))*7)),tickFormatter:y})]}):(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(a.XAxis,{dataKey:o,...E}),(0,i.jsx)(a.YAxis,{tickLine:!1,axisLine:!1,tickFormatter:T,width:48})]}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=x(),o=L(r[e.dataKey]?.color||n[t%n.length]||F);if(u===`bar`||u===`horizontal-bar`){let t=s.length===1&&d.length>1;return(0,i.jsx)(a.Bar,{dataKey:e.dataKey,fill:o,radius:4,children:t&&d.map((e,t)=>(0,i.jsx)(a.Cell,{fill:L(n[t%n.length])},`cell-${t}`))},e.dataKey)}return u===`line`?(0,i.jsx)(a.Line,{type:`monotone`,dataKey:e.dataKey,stroke:o,strokeWidth:2,dot:!1},e.dataKey):u===`area`?(0,i.jsx)(a.Area,{type:`monotone`,dataKey:e.dataKey,fill:o,stroke:o,fillOpacity:.4},e.dataKey):null})]})})}var F,I,L,R=h((()=>{M(),F=`hsl(var(--primary))`,I={slate:`#64748b`,gray:`#6b7280`,zinc:`#71717a`,neutral:`#737373`,stone:`#78716c`,red:`#ef4444`,orange:`#f97316`,amber:`#f59e0b`,yellow:`#eab308`,lime:`#84cc16`,green:`#22c55e`,emerald:`#10b981`,teal:`#14b8a6`,cyan:`#06b6d4`,sky:`#0ea5e9`,blue:`#3b82f6`,indigo:`#6366f1`,violet:`#8b5cf6`,purple:`#a855f7`,fuchsia:`#d946ef`,pink:`#ec4899`,rose:`#f43f5e`},L=e=>I[e]||e})),z=n.default.lazy(()=>Promise.resolve().then(()=>(b(),v))),B=n.default.lazy(()=>Promise.resolve().then(()=>(R(),N))),V=({schema:e})=>(0,i.jsx)(n.Suspense,{fallback:(0,i.jsx)(r.Skeleton,{className:`w-full h-48 sm:h-64 md:h-80 lg:h-[400px]`}),children:(0,i.jsx)(z,{data:e.data,dataKey:e.dataKey,xAxisKey:e.xAxisKey,height:e.height,className:e.className,color:e.color})}),H=({schema:e,onChartClick:t})=>{let a=n.default.useMemo(()=>{let t=e.series,n=e.xAxisKey,r=e.config;if(n||(e.index?n=e.index:e.category&&(n=e.category)),t||(e.categories?t=e.categories.map(e=>({dataKey:e})):e.value&&(t=[{dataKey:e.value}])),!r&&t){let n=e.colors||[`hsl(var(--chart-1))`,`hsl(var(--chart-2))`,`hsl(var(--chart-3))`],i={};t.forEach((e,t)=>{i[e.dataKey]={label:e.label||e.dataKey,color:n[t%n.length]}}),r=i}return{chartType:e.chartType,data:Array.isArray(e.data)?e.data:[],config:r,xAxisKey:n,series:t,className:e.className}},[e]);return(0,i.jsx)(n.Suspense,{fallback:(0,i.jsx)(r.Skeleton,{className:`w-full h-48 sm:h-64 md:h-80 lg:h-[400px]`}),children:(0,i.jsx)(B,{chartType:a.chartType,data:a.data,config:a.config,xAxisKey:a.xAxisKey,series:a.series,className:a.className,onChartClick:t})})};function U(e){return e.replace(/[_-]/g,` `).replace(/\b\w/g,e=>e.toUpperCase())}function W(e,t){let{field:n,function:r,groupBy:i}=t,a={};for(let t of e){let e=String(t[i]??`Unknown`);a[e]||(a[e]=[]),a[e].push(t)}return Object.entries(a).map(([e,t])=>{let a=t.map(e=>Number(e[n])||0),o;switch(r){case`count`:o=t.length;break;case`avg`:o=a.length>0?a.reduce((e,t)=>e+t,0)/a.length:0;break;case`min`:o=a.length>0?Math.min(...a):0;break;case`max`:o=a.length>0?Math.max(...a):0;break;default:o=a.reduce((e,t)=>e+t,0);break}return{[i]:e,[n]:o}})}async function G(e,n,r,i,a){if(!e.length||!n)return e;let o=a||((e,t)=>t),s=`__raw_${n}`,c=r?.fields?.[n];if(!c){let t=/^\d{4}-\d{2}-\d{2}/;return e.map(e=>{let r=e[n],i=String(r??``),a=t.test(i)?i:U(i);return{...e,[n]:o(i,a),[s]:r}})}let l=c.type;if(l===`select`||l===`picklist`||l===`dropdown`){let t=c.options||[];if(t.length===0)return e.map(e=>{let t=e[n],r=String(t??``),i=U(r);return{...e,[n]:o(r,i),[s]:t}});let r={};for(let e of t)typeof e==`string`?r[e]=e:e&&typeof e==`object`&&(r[String(e.value)]=e.label||String(e.value));return e.map(e=>{let t=e[n],i=String(t??``),a=r[i]||U(i);return{...e,[n]:o(i,a),[s]:t}})}if(l===`lookup`||l===`master_detail`){let r=c.reference_to||c.reference;if(!r||!i||typeof i.find!=`function`)return e.map(e=>({...e,[s]:e[n]}));let a=[...new Set(e.map(e=>e[n]).filter(e=>e!=null))];if(a.length===0)return e.map(e=>({...e,[s]:e[n]}));let o=c.id_field||`id`;try{let l=(0,t.extractRecords)(await i.find(r,{$filter:{[o]:{$in:a}},$top:a.length})),u=c.reference_field||c.display_field||`name`,d={};for(let e of l){let t=String(e[o]??e.id??e._id??``),n=e[u]||e.name||e.label||e.title||t;t&&(d[t]=String(n))}return e.map(e=>{let t=e[n],r=String(t??``);return{...e,[n]:d[r]||r,[s]:t}})}catch(t){return console.warn(`[ObjectChart] Failed to resolve lookup labels:`,t),e.map(e=>({...e,[s]:e[n]}))}}if(l===`date`||l===`datetime`||l===`date_time`||l===`timestamp`||l===`time`)return e.map(e=>({...e,[s]:e[n]}));let u=/^\d{4}-\d{2}-\d{2}/;return e.map(e=>{let t=e[n],r=String(t??``);return{...e,[n]:u.test(r)?r:U(r),[s]:t}})}var K=e=>{let{schema:a}=e,l=(0,n.useContext)(o.SchemaRendererContext),u=e.dataSource||l?.dataSource,d=(0,o.useDataScope)(a.bind),{fieldOptionLabel:f}=(0,c.useSafeFieldLabel)(),p=(0,n.useRef)(f);(0,n.useEffect)(()=>{p.current=f},[f]);let[m,h]=(0,n.useState)([]),[g,_]=(0,n.useState)(!1),[v,y]=(0,n.useState)(null),[b,x]=(0,n.useState)(null),S=(0,n.useMemo)(()=>a.aggregate?JSON.stringify(a.aggregate):``,[a.aggregate]),C=(0,n.useMemo)(()=>a.filter?JSON.stringify(a.filter):``,[a.filter]),w=(0,n.useCallback)(async(e,n)=>{if(!(!e||!a.objectName)){n.current&&(_(!0),y(null));try{let r,i=(0,t.resolveDateMacros)(a.filter);if(a.aggregate&&typeof e.aggregate==`function`){let t=await e.aggregate(a.objectName,{field:a.aggregate.field,function:a.aggregate.function,groupBy:a.aggregate.groupBy,filter:i});r=Array.isArray(t)?t:[]}else if(typeof e.find==`function`)r=(0,t.extractRecords)(await e.find(a.objectName,{$filter:i})),a.aggregate&&r.length>0&&(r=W(r,a.aggregate));else return;let o=a.aggregate?.groupBy||a.xAxisKey;if(o&&typeof e.getObjectSchema==`function`)try{let t=await e.getObjectSchema(a.objectName);r=await G(r,o,t,e,(e,t)=>p.current(a.objectName,o,e,t))}catch{}n.current&&h(r)}catch(e){console.error(`[ObjectChart] Fetch error:`,e),n.current&&y(e instanceof Error?e.message:`Failed to load chart data`)}finally{n.current&&_(!1)}}},[a.objectName,S,C,a.xAxisKey]);(0,n.useEffect)(()=>{let e={current:!0};return a.objectName&&!d&&!a.data&&w(u,e),()=>{e.current=!1}},[a.objectName,u,d,a.data,C,S,w]);let T=d||a.data||m,E=Array.isArray(T)?T:[],D=a.drillDown,O=a.aggregate?.groupBy||a.xAxisKey,k=(0,n.useMemo)(()=>{if(!O)return new Map;let e=new Map,t=`__raw_${O}`;for(let n of E){let r=n?.[O];if(r==null)continue;let i=t in(n||{})?n[t]:r;e.set(String(r),i)}return e},[E,O]),A={...a,data:E};if(g&&E.length===0)return(0,i.jsx)(`div`,{className:`flex items-center justify-center text-muted-foreground text-sm p-4 `+(a.className||``),"data-testid":`chart-loading`,children:`Loading chart data…`});if(v)return(0,i.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-2 p-4 `+(a.className||``),"data-testid":`chart-error`,role:`alert`,children:[(0,i.jsx)(s.AlertCircle,{className:`h-6 w-6 text-destructive opacity-60`}),(0,i.jsx)(`p`,{className:`text-xs text-destructive font-medium`,children:`Failed to load chart data`}),(0,i.jsx)(`p`,{className:`text-xs text-muted-foreground max-w-xs text-center`,children:v})]});if(!u&&a.objectName&&E.length===0)return(0,i.jsxs)(`div`,{className:`flex items-center justify-center text-muted-foreground text-sm p-4 `+(a.className||``),"data-testid":`chart-no-datasource`,children:[`No data source available for “`,a.objectName,`”`]});let j=(0,t.isDrillEnabled)(D)?e=>{let t=e.category,n=t!=null&&k.has(String(t))?k.get(String(t)):t;x({...e,category:n,categoryLabel:t,scope:`cell`})}:void 0,M=b&&a.objectName?(()=>{let e=(0,t.computeDrillFilter)(D,b,{groupByField:O}),n={...a.filter||{},...e},s=(0,t.resolveDrillTitle)(D,b,a.title||`Details`),c=D?.target??`drawer`,l=(0,i.jsx)(`div`,{className:`overflow-auto`,"data-testid":`chart-drill-body`,children:(0,i.jsx)(o.SchemaRenderer,{schema:{type:`object-data-table`,objectName:a.objectName,filter:n,pagination:!0,pageSize:D?.maxRows,columns:D?.columns?.map(e=>({accessorKey:e,header:e}))},dataSource:u})});return c===`dialog`?(0,i.jsx)(r.Dialog,{open:!0,onOpenChange:e=>!e&&x(null),children:(0,i.jsxs)(r.DialogContent,{className:`max-w-4xl`,children:[(0,i.jsx)(r.DialogHeader,{children:(0,i.jsx)(r.DialogTitle,{children:s})}),l]})}):(0,i.jsx)(r.Sheet,{open:!0,onOpenChange:e=>!e&&x(null),children:(0,i.jsxs)(r.SheetContent,{side:`right`,className:`w-full sm:max-w-2xl md:max-w-3xl lg:max-w-4xl flex flex-col`,children:[(0,i.jsx)(r.SheetHeader,{children:(0,i.jsx)(r.SheetTitle,{children:s})}),(0,i.jsx)(`div`,{className:`flex-1 overflow-hidden mt-2`,children:l})]})})})():null;return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(H,{...e,schema:A,onChartClick:j}),M]})};t.ComponentRegistry.register(`object-chart`,K,{namespace:`plugin-charts`,label:`Object Chart`,category:`view`,inputs:[{name:`objectName`,type:`string`,label:`Object Name`,required:!0},{name:`data`,type:`array`,label:`Data`,description:`Optional static data`},{name:`filter`,type:`array`,label:`Filter`},{name:`aggregate`,type:`object`,label:`Aggregate`,description:`Aggregation config: { field, function, groupBy }`}]});var q={"bar-chart":V,chart:H};t.ComponentRegistry.register(`bar-chart`,V,{namespace:`plugin-charts`,label:`Bar Chart`,category:`plugin`,inputs:[{name:`data`,type:`array`,label:`Data`,required:!0},{name:`dataKey`,type:`string`,label:`Data Key`,defaultValue:`value`},{name:`xAxisKey`,type:`string`,label:`X-Axis Key`,defaultValue:`name`},{name:`height`,type:`number`,label:`Height`,defaultValue:400},{name:`color`,type:`color`,label:`Color`,defaultValue:`#8884d8`}],defaultProps:{data:[{name:`Jan`,value:400},{name:`Feb`,value:300},{name:`Mar`,value:600},{name:`Apr`,value:800},{name:`May`,value:500}],dataKey:`value`,xAxisKey:`name`,height:400,color:`#8884d8`}}),t.ComponentRegistry.register(`chart`,K,{namespace:`view`,category:`view`,label:`Chart`,inputs:[{name:`objectName`,type:`string`,label:`Object Name`,required:!0},{name:`type`,type:`string`,label:`Chart Type`},{name:`categoryField`,type:`string`,label:`Category Field`},{name:`valueField`,type:`string`,label:`Value Field`}]}),t.ComponentRegistry.register(`chart`,H,{namespace:`plugin-charts`,label:`Chart`,category:`plugin`,inputs:[{name:`chartType`,type:`enum`,label:`Chart Type`,enum:[{label:`Bar`,value:`bar`},{label:`Line`,value:`line`},{label:`Area`,value:`area`},{label:`Pie`,value:`pie`},{label:`Donut`,value:`donut`},{label:`Radar`,value:`radar`},{label:`Scatter`,value:`scatter`}],defaultValue:`bar`},{name:`data`,type:`code`,label:`Data (JSON)`,required:!0},{name:`config`,type:`code`,label:`Config (JSON)`},{name:`xAxisKey`,type:`string`,label:`X Axis Key`,defaultValue:`name`},{name:`series`,type:`code`,label:`Series (JSON Array)`,required:!0},{name:`className`,type:`string`,label:`CSS Class`}],defaultProps:{chartType:`bar`,data:[{name:`Jan`,sales:400,revenue:240},{name:`Feb`,sales:300,revenue:139},{name:`Mar`,sales:600,revenue:380},{name:`Apr`,sales:800,revenue:430},{name:`May`,sales:500,revenue:220}],config:{sales:{label:`Sales`,color:`#8884d8`},revenue:{label:`Revenue`,color:`#82ca9d`}},xAxisKey:`name`,series:[{dataKey:`sales`},{dataKey:`revenue`}]}}),t.ComponentRegistry.register(`chart:bar`,H,{namespace:`plugin-charts`,label:`Bar Chart (Alias)`,category:`plugin`,defaultProps:{chartType:`bar`}}),t.ComponentRegistry.register(`pie-chart`,H,{namespace:`plugin-charts`,label:`Pie Chart`,category:`plugin`,defaultProps:{chartType:`pie`}}),t.ComponentRegistry.register(`donut-chart`,H,{namespace:`plugin-charts`,label:`Donut Chart`,category:`plugin`,defaultProps:{chartType:`donut`}}),t.ComponentRegistry.register(`radar-chart`,H,{namespace:`plugin-charts`,label:`Radar Chart`,category:`plugin`,defaultProps:{chartType:`radar`}}),t.ComponentRegistry.register(`scatter-chart`,H,{namespace:`plugin-charts`,label:`Scatter Chart`,category:`plugin`,defaultProps:{chartType:`scatter`}}),e.ChartBarRenderer=V,e.ChartRenderer=H,e.ObjectChart=K,e.chartComponents=q});
|
|
7
|
+
`)}}):null},A=a.Tooltip,j=a.Legend})),N=g({default:()=>P});function P({chartType:e=`bar`,data:t=[],config:r={},xAxisKey:o=`name`,series:s=[],className:c=``,onChartClick:l}){let u=e===`column`?`bar`:e,d=Array.isArray(t)?t:[],[f,p]=n.useState(!1),m=n.useCallback(e=>{if(!l||!e)return;let t=Array.isArray(e.activePayload)?e.activePayload[0]:void 0;l({category:e.activeLabel==null?void 0:String(e.activeLabel),series:t?.dataKey?String(t.dataKey):void 0,value:typeof t?.value==`number`?t.value:void 0})},[l]),h=n.useCallback(e=>{if(!l||!e)return;let t=e.payload?.[o],n=s[0]?.dataKey||`value`;l({category:t==null?void 0:String(t),series:n,value:typeof e.payload?.[n]==`number`?e.payload[n]:void 0})},[l,o,s]),g=l?{onClick:m,style:{cursor:`pointer`}}:{},_=l?{onClick:h,style:{cursor:`pointer`}}:{};n.useEffect(()=>{let e=()=>p(window.innerWidth<640);return e(),window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[]);let v={bar:a.BarChart,"horizontal-bar":a.BarChart,line:a.LineChart,area:a.AreaChart,pie:a.PieChart,donut:a.PieChart,radar:a.RadarChart,scatter:a.ScatterChart,funnel:a.FunnelChart,combo:a.BarChart}[u]||a.BarChart,y=n.useCallback(e=>{if(e==null||e===``)return``;let t=typeof e==`string`?e:String(e);if(/^\d{4}-\d{2}-\d{2}/.test(t)){let e=new Date(t);if(!Number.isNaN(e.getTime())){let t=(d.length>1?Math.abs(new Date(String(d[d.length-1][o]??``)).getTime()-new Date(String(d[0][o]??``)).getTime()):0)/(1e3*60*60*24);try{return t<=62?e.toLocaleDateString(void 0,{month:`short`,day:`numeric`}):e.toLocaleDateString(void 0,{month:`short`,year:`numeric`})}catch{return e.toISOString().slice(0,10)}}}return f&&t.length>8?t.slice(0,8)+`…`:t},[d,o,f]),b=n.useMemo(()=>d.some(e=>String(e[o]||``).length>5),[d,o]),x=()=>[`hsl(var(--chart-1))`,`hsl(var(--chart-2))`,`hsl(var(--chart-3))`,`hsl(var(--chart-4))`,`hsl(var(--chart-5))`],T=n.useCallback(e=>{if(e==null||e===``)return``;let t=typeof e==`number`?e:Number(e);if(!Number.isFinite(t))return String(e);try{return new Intl.NumberFormat(void 0,{notation:`compact`,maximumFractionDigits:1}).format(t)}catch{return String(t)}},[]),E=n.useMemo(()=>({tickLine:!1,tickMargin:10,axisLine:!1,interval:`preserveStartEnd`,minTickGap:f?32:48,tickFormatter:y,...!f&&b&&{angle:-35,textAnchor:`end`,height:60}}),[f,b,y]);if(u===`pie`||u===`donut`){let e=u===`donut`?60:0,t=x(),n={...r};return d.forEach((e,r)=>{let i=e?.[o];if(i==null||i===``)return;let a=String(i);n[a]||(n[a]={label:a,color:t[r%t.length]})}),(0,i.jsx)(S,{config:n,className:c,children:(0,i.jsxs)(a.PieChart,{children:[(0,i.jsx)(A,{cursor:!1,content:(0,i.jsx)(C,{hideLabel:!0})}),(0,i.jsx)(a.Pie,{data:d,dataKey:s[0]?.dataKey||`value`,nameKey:o||`name`,innerRadius:e,strokeWidth:5,paddingAngle:2,outerRadius:80,..._,children:d.map((e,r)=>{let s=n[String(e[o])]?.color;return s||=t[r%t.length],(0,i.jsx)(a.Cell,{fill:L(s)},`cell-${r}`)})}),(0,i.jsx)(j,{verticalAlign:`bottom`,wrapperStyle:{fontSize:f?`11px`:`12px`,paddingTop:`8px`},content:(0,i.jsx)(w,{nameKey:o,className:`flex-wrap`})})]})})}if(u===`funnel`){let e=s[0]?.dataKey||`value`,t=x(),n=l?t=>{t&&l({category:t?.payload?.[o]??t?.[o],value:t?.payload?.[e]??t?.[e]})}:void 0;return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.FunnelChart,{children:[(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsxs)(a.Funnel,{dataKey:e,data:d,nameKey:o,isAnimationActive:!0,...n?{onClick:n,style:{cursor:`pointer`}}:{},children:[(0,i.jsx)(a.LabelList,{position:`right`,fill:`hsl(var(--foreground))`,stroke:`none`,dataKey:o}),d.map((e,n)=>(0,i.jsx)(a.Cell,{fill:L(t[n%t.length])},`funnel-cell-${n}`))]})]})})}if(u===`radar`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.RadarChart,{data:d,children:[(0,i.jsx)(a.PolarGrid,{}),(0,i.jsx)(a.PolarAngleAxis,{dataKey:o}),(0,i.jsx)(a.PolarRadiusAxis,{}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map(e=>{let t=L(r[e.dataKey]?.color||F);return(0,i.jsx)(a.Radar,{dataKey:e.dataKey,stroke:t,fill:t,fillOpacity:.6},e.dataKey)})]})});if(u===`scatter`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.ScatterChart,{children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),(0,i.jsx)(a.XAxis,{type:`number`,dataKey:o,name:String(r[o]?.label||o),tickLine:!1,axisLine:!1,minTickGap:f?32:48}),(0,i.jsx)(a.YAxis,{type:`number`,dataKey:s[0]?.dataKey||`value`,name:String(r[s[0]?.dataKey]?.label||s[0]?.dataKey),tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(a.ZAxis,{type:`number`,range:[60,400]}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=x(),o=L(r[e.dataKey]?.color||n[t%n.length]);return(0,i.jsx)(a.Scatter,{name:r[e.dataKey]?.label||e.dataKey,data:d,fill:o},e.dataKey)})]})});if(u===`combo`)return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(a.BarChart,{data:d,children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),(0,i.jsx)(a.XAxis,{dataKey:o,...E}),(0,i.jsx)(a.YAxis,{yAxisId:`left`,tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(a.YAxis,{yAxisId:`right`,orientation:`right`,tickLine:!1,axisLine:!1,tickFormatter:T,width:48}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=L(r[e.dataKey]?.color||F),o=e.chartType||(t===0?`bar`:`line`),s=o===`bar`?`left`:`right`;return o===`line`?(0,i.jsx)(a.Line,{yAxisId:s,type:`monotone`,dataKey:e.dataKey,stroke:n,strokeWidth:2,dot:!1},e.dataKey):o===`area`?(0,i.jsx)(a.Area,{yAxisId:s,type:`monotone`,dataKey:e.dataKey,fill:n,stroke:n,fillOpacity:.4},e.dataKey):(0,i.jsx)(a.Bar,{yAxisId:s,dataKey:e.dataKey,fill:n,radius:4},e.dataKey)})]})});let D=u===`horizontal-bar`;return(0,i.jsx)(S,{config:r,className:c,children:(0,i.jsxs)(v,{data:d,layout:D?`vertical`:`horizontal`,...g,children:[(0,i.jsx)(a.CartesianGrid,{vertical:!1}),D?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(a.XAxis,{type:`number`,tickLine:!1,axisLine:!1,tickFormatter:T}),(0,i.jsx)(a.YAxis,{type:`category`,dataKey:o,tickLine:!1,axisLine:!1,width:Math.min(140,Math.max(60,Math.max(...d.map(e=>String(e[o]??``).length))*7)),tickFormatter:y})]}):(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(a.XAxis,{dataKey:o,...E}),(0,i.jsx)(a.YAxis,{tickLine:!1,axisLine:!1,tickFormatter:T,width:48})]}),(0,i.jsx)(A,{content:(0,i.jsx)(C,{})}),(0,i.jsx)(j,{content:(0,i.jsx)(w,{}),...f&&{verticalAlign:`bottom`,wrapperStyle:{fontSize:`11px`,paddingTop:`8px`}}}),s.map((e,t)=>{let n=x(),o=L(r[e.dataKey]?.color||n[t%n.length]||F);if(u===`bar`||u===`horizontal-bar`){let t=s.length===1&&d.length>1;return(0,i.jsx)(a.Bar,{dataKey:e.dataKey,fill:o,radius:4,children:t&&d.map((e,t)=>(0,i.jsx)(a.Cell,{fill:L(n[t%n.length])},`cell-${t}`))},e.dataKey)}return u===`line`?(0,i.jsx)(a.Line,{type:`monotone`,dataKey:e.dataKey,stroke:o,strokeWidth:2,dot:!1},e.dataKey):u===`area`?(0,i.jsx)(a.Area,{type:`monotone`,dataKey:e.dataKey,fill:o,stroke:o,fillOpacity:.4},e.dataKey):null})]})})}var F,I,L,R=h((()=>{M(),F=`hsl(var(--primary))`,I={slate:`#64748b`,gray:`#6b7280`,zinc:`#71717a`,neutral:`#737373`,stone:`#78716c`,red:`#ef4444`,orange:`#f97316`,amber:`#f59e0b`,yellow:`#eab308`,lime:`#84cc16`,green:`#22c55e`,emerald:`#10b981`,teal:`#14b8a6`,cyan:`#06b6d4`,sky:`#0ea5e9`,blue:`#3b82f6`,indigo:`#6366f1`,violet:`#8b5cf6`,purple:`#a855f7`,fuchsia:`#d946ef`,pink:`#ec4899`,rose:`#f43f5e`},L=e=>I[e]||e})),z=n.default.lazy(()=>Promise.resolve().then(()=>(b(),v))),B=n.default.lazy(()=>Promise.resolve().then(()=>(R(),N))),V=({schema:e})=>(0,i.jsx)(n.Suspense,{fallback:(0,i.jsx)(r.Skeleton,{className:`w-full h-48 sm:h-64 md:h-80 lg:h-[400px]`}),children:(0,i.jsx)(z,{data:e.data,dataKey:e.dataKey,xAxisKey:e.xAxisKey,height:e.height,className:e.className,color:e.color})}),H=({schema:e,onChartClick:t})=>{let a=n.default.useMemo(()=>{let t=e.series,n=e.xAxisKey,r=e.config;if(n||(e.index?n=e.index:e.category&&(n=e.category)),t||(e.categories?t=e.categories.map(e=>({dataKey:e})):e.value&&(t=[{dataKey:e.value}])),!r&&t){let n=e.colors||[`hsl(var(--chart-1))`,`hsl(var(--chart-2))`,`hsl(var(--chart-3))`],i={};t.forEach((e,t)=>{i[e.dataKey]={label:e.label||e.dataKey,color:n[t%n.length]}}),r=i}return{chartType:e.chartType,data:Array.isArray(e.data)?e.data:[],config:r,xAxisKey:n,series:t,className:e.className}},[e]);return(0,i.jsx)(n.Suspense,{fallback:(0,i.jsx)(r.Skeleton,{className:`w-full h-48 sm:h-64 md:h-80 lg:h-[400px]`}),children:(0,i.jsx)(B,{chartType:a.chartType,data:a.data,config:a.config,xAxisKey:a.xAxisKey,series:a.series,className:a.className,onChartClick:t})})};function U(e){return e.replace(/[_-]/g,` `).replace(/\b\w/g,e=>e.toUpperCase())}function W(e,t){let{field:n,function:r,groupBy:i}=t,a={};for(let t of e){let e=String(t[i]??`Unknown`);a[e]||(a[e]=[]),a[e].push(t)}return Object.entries(a).map(([e,t])=>{let a=t.map(e=>Number(e[n])||0),o;switch(r){case`count`:o=t.length;break;case`avg`:o=a.length>0?a.reduce((e,t)=>e+t,0)/a.length:0;break;case`min`:o=a.length>0?Math.min(...a):0;break;case`max`:o=a.length>0?Math.max(...a):0;break;default:o=a.reduce((e,t)=>e+t,0);break}return{[i]:e,[n]:o}})}async function G(e,n,r,i,a){if(!e.length||!n)return e;let o=a||((e,t)=>t),s=`__raw_${n}`,c=r?.fields?.[n];if(!c){let t=/^\d{4}-\d{2}-\d{2}/;return e.map(e=>{let r=e[n],i=String(r??``),a=t.test(i)?i:U(i);return{...e,[n]:o(i,a),[s]:r}})}let l=c.type;if(l===`select`||l===`picklist`||l===`dropdown`){let t=c.options||[];if(t.length===0)return e.map(e=>{let t=e[n],r=String(t??``),i=U(r);return{...e,[n]:o(r,i),[s]:t}});let r={};for(let e of t)typeof e==`string`?r[e]=e:e&&typeof e==`object`&&(r[String(e.value)]=e.label||String(e.value));return e.map(e=>{let t=e[n],i=String(t??``),a=r[i]||U(i);return{...e,[n]:o(i,a),[s]:t}})}if(l===`lookup`||l===`master_detail`){let r=c.reference_to||c.reference;if(!r||!i||typeof i.find!=`function`)return e.map(e=>({...e,[s]:e[n]}));let a=[...new Set(e.map(e=>e[n]).filter(e=>e!=null))];if(a.length===0)return e.map(e=>({...e,[s]:e[n]}));let o=c.id_field||`id`;try{let l=(0,t.extractRecords)(await i.find(r,{$filter:{[o]:{$in:a}},$top:a.length})),u=c.reference_field||c.display_field||`name`,d={};for(let e of l){let t=String(e[o]??e.id??e._id??``),n=e[u]||e.name||e.label||e.title||t;t&&(d[t]=String(n))}return e.map(e=>{let t=e[n],r=String(t??``);return{...e,[n]:d[r]||r,[s]:t}})}catch(t){return console.warn(`[ObjectChart] Failed to resolve lookup labels:`,t),e.map(e=>({...e,[s]:e[n]}))}}if(l===`date`||l===`datetime`||l===`date_time`||l===`timestamp`||l===`time`)return e.map(e=>({...e,[s]:e[n]}));let u=/^\d{4}-\d{2}-\d{2}/;return e.map(e=>{let t=e[n],r=String(t??``);return{...e,[n]:u.test(r)?r:U(r),[s]:t}})}var K=e=>{let{schema:a}=e,l=(0,n.useContext)(o.SchemaRendererContext),u=e.dataSource||l?.dataSource,d=(0,o.useDataScope)(a.bind),{fieldOptionLabel:f}=(0,c.useSafeFieldLabel)(),p=(0,n.useRef)(f);(0,n.useEffect)(()=>{p.current=f},[f]);let[m,h]=(0,n.useState)([]),[g,_]=(0,n.useState)(()=>!(Array.isArray(a.data)&&a.data.length>0)&&!!a.objectName),[v,y]=(0,n.useState)(null),[b,x]=(0,n.useState)(null),S=(0,n.useMemo)(()=>a.aggregate?JSON.stringify(a.aggregate):``,[a.aggregate]),C=(0,n.useMemo)(()=>a.filter?JSON.stringify(a.filter):``,[a.filter]),w=(0,n.useCallback)(async(e,n)=>{if(!e||!a.objectName){n.current&&_(!1);return}n.current&&(_(!0),y(null));try{let r,i=(0,t.resolveDateMacros)(a.filter);if(a.aggregate&&typeof e.aggregate==`function`){let t=await e.aggregate(a.objectName,{field:a.aggregate.field,function:a.aggregate.function,groupBy:a.aggregate.groupBy,filter:i});r=Array.isArray(t)?t:[]}else if(typeof e.find==`function`)r=(0,t.extractRecords)(await e.find(a.objectName,{$filter:i})),a.aggregate&&r.length>0&&(r=W(r,a.aggregate));else return;let o=a.aggregate?.groupBy||a.xAxisKey;if(o&&typeof e.getObjectSchema==`function`)try{let t=await e.getObjectSchema(a.objectName);r=await G(r,o,t,e,(e,t)=>p.current(a.objectName,o,e,t))}catch{}n.current&&h(r)}catch(e){console.error(`[ObjectChart] Fetch error:`,e),n.current&&y(e instanceof Error?e.message:`Failed to load chart data`)}finally{n.current&&_(!1)}},[a.objectName,S,C,a.xAxisKey]);(0,n.useEffect)(()=>{let e={current:!0};return a.objectName&&!d&&!a.data?w(u,e):e.current&&_(!1),()=>{e.current=!1}},[a.objectName,u,d,a.data,C,S,w]);let T=d||a.data||m,E=Array.isArray(T)?T:[],D=a.drillDown,O=a.aggregate?.groupBy||a.xAxisKey,k=(0,n.useMemo)(()=>{if(!O)return new Map;let e=new Map,t=`__raw_${O}`;for(let n of E){let r=n?.[O];if(r==null)continue;let i=t in(n||{})?n[t]:r;e.set(String(r),i)}return e},[E,O]),A={...a,data:E};if(g&&E.length===0)return(0,i.jsx)(`div`,{className:`flex items-center justify-center text-muted-foreground text-sm p-4 `+(a.className||``),"data-testid":`chart-loading`,children:`Loading chart data…`});if(v)return(0,i.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-2 p-4 `+(a.className||``),"data-testid":`chart-error`,role:`alert`,children:[(0,i.jsx)(s.AlertCircle,{className:`h-6 w-6 text-destructive opacity-60`}),(0,i.jsx)(`p`,{className:`text-xs text-destructive font-medium`,children:`Failed to load chart data`}),(0,i.jsx)(`p`,{className:`text-xs text-muted-foreground max-w-xs text-center`,children:v})]});if(!u&&a.objectName&&E.length===0)return(0,i.jsxs)(`div`,{className:`flex items-center justify-center text-muted-foreground text-sm p-4 `+(a.className||``),"data-testid":`chart-no-datasource`,children:[`No data source available for “`,a.objectName,`”`]});let j=(0,t.isDrillEnabled)(D)?e=>{let t=e.category,n=t!=null&&k.has(String(t))?k.get(String(t)):t;x({...e,category:n,categoryLabel:t,scope:`cell`})}:void 0,M=b&&a.objectName?(()=>{let e=(0,t.computeDrillFilter)(D,b,{groupByField:O}),n={...a.filter||{},...e},s=(0,t.resolveDrillTitle)(D,b,a.title||`Details`),c=D?.target??`drawer`,l=(0,i.jsx)(`div`,{className:`overflow-auto`,"data-testid":`chart-drill-body`,children:(0,i.jsx)(o.SchemaRenderer,{schema:{type:`object-data-table`,objectName:a.objectName,filter:n,pagination:!0,pageSize:D?.maxRows,columns:D?.columns?.map(e=>({accessorKey:e,header:e}))},dataSource:u})});return c===`dialog`?(0,i.jsx)(r.Dialog,{open:!0,onOpenChange:e=>!e&&x(null),children:(0,i.jsxs)(r.DialogContent,{className:`max-w-4xl`,children:[(0,i.jsx)(r.DialogHeader,{children:(0,i.jsx)(r.DialogTitle,{children:s})}),l]})}):(0,i.jsx)(r.Sheet,{open:!0,onOpenChange:e=>!e&&x(null),children:(0,i.jsxs)(r.SheetContent,{side:`right`,className:`w-full sm:max-w-2xl md:max-w-3xl lg:max-w-4xl flex flex-col`,children:[(0,i.jsx)(r.SheetHeader,{children:(0,i.jsx)(r.SheetTitle,{children:s})}),(0,i.jsx)(`div`,{className:`flex-1 overflow-hidden mt-2`,children:l})]})})})():null;return(0,i.jsxs)(`div`,{className:`relative`,children:[(0,i.jsx)(r.RefreshIndicator,{active:g&&E.length>0}),(0,i.jsx)(H,{...e,schema:A,onChartClick:j}),M]})};t.ComponentRegistry.register(`object-chart`,K,{namespace:`plugin-charts`,label:`Object Chart`,category:`view`,inputs:[{name:`objectName`,type:`string`,label:`Object Name`,required:!0},{name:`data`,type:`array`,label:`Data`,description:`Optional static data`},{name:`filter`,type:`array`,label:`Filter`},{name:`aggregate`,type:`object`,label:`Aggregate`,description:`Aggregation config: { field, function, groupBy }`}]});var q={"bar-chart":V,chart:H};t.ComponentRegistry.register(`bar-chart`,V,{namespace:`plugin-charts`,label:`Bar Chart`,category:`plugin`,inputs:[{name:`data`,type:`array`,label:`Data`,required:!0},{name:`dataKey`,type:`string`,label:`Data Key`,defaultValue:`value`},{name:`xAxisKey`,type:`string`,label:`X-Axis Key`,defaultValue:`name`},{name:`height`,type:`number`,label:`Height`,defaultValue:400},{name:`color`,type:`color`,label:`Color`,defaultValue:`#8884d8`}],defaultProps:{data:[{name:`Jan`,value:400},{name:`Feb`,value:300},{name:`Mar`,value:600},{name:`Apr`,value:800},{name:`May`,value:500}],dataKey:`value`,xAxisKey:`name`,height:400,color:`#8884d8`}}),t.ComponentRegistry.register(`chart`,K,{namespace:`view`,category:`view`,label:`Chart`,inputs:[{name:`objectName`,type:`string`,label:`Object Name`,required:!0},{name:`type`,type:`string`,label:`Chart Type`},{name:`categoryField`,type:`string`,label:`Category Field`},{name:`valueField`,type:`string`,label:`Value Field`}]}),t.ComponentRegistry.register(`chart`,H,{namespace:`plugin-charts`,label:`Chart`,category:`plugin`,inputs:[{name:`chartType`,type:`enum`,label:`Chart Type`,enum:[{label:`Bar`,value:`bar`},{label:`Line`,value:`line`},{label:`Area`,value:`area`},{label:`Pie`,value:`pie`},{label:`Donut`,value:`donut`},{label:`Radar`,value:`radar`},{label:`Scatter`,value:`scatter`}],defaultValue:`bar`},{name:`data`,type:`code`,label:`Data (JSON)`,required:!0},{name:`config`,type:`code`,label:`Config (JSON)`},{name:`xAxisKey`,type:`string`,label:`X Axis Key`,defaultValue:`name`},{name:`series`,type:`code`,label:`Series (JSON Array)`,required:!0},{name:`className`,type:`string`,label:`CSS Class`}],defaultProps:{chartType:`bar`,data:[{name:`Jan`,sales:400,revenue:240},{name:`Feb`,sales:300,revenue:139},{name:`Mar`,sales:600,revenue:380},{name:`Apr`,sales:800,revenue:430},{name:`May`,sales:500,revenue:220}],config:{sales:{label:`Sales`,color:`#8884d8`},revenue:{label:`Revenue`,color:`#82ca9d`}},xAxisKey:`name`,series:[{dataKey:`sales`},{dataKey:`revenue`}]}}),t.ComponentRegistry.register(`chart:bar`,H,{namespace:`plugin-charts`,label:`Bar Chart (Alias)`,category:`plugin`,defaultProps:{chartType:`bar`}}),t.ComponentRegistry.register(`pie-chart`,H,{namespace:`plugin-charts`,label:`Pie Chart`,category:`plugin`,defaultProps:{chartType:`pie`}}),t.ComponentRegistry.register(`donut-chart`,H,{namespace:`plugin-charts`,label:`Donut Chart`,category:`plugin`,defaultProps:{chartType:`donut`}}),t.ComponentRegistry.register(`radar-chart`,H,{namespace:`plugin-charts`,label:`Radar Chart`,category:`plugin`,defaultProps:{chartType:`radar`}}),t.ComponentRegistry.register(`scatter-chart`,H,{namespace:`plugin-charts`,label:`Scatter Chart`,category:`plugin`,defaultProps:{chartType:`scatter`}}),e.ChartBarRenderer=V,e.ChartRenderer=H,e.ObjectChart=K,e.chartComponents=q});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@object-ui/plugin-charts",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.8.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"description": "Chart components plugin for Object UI, powered by Recharts",
|
|
@@ -26,11 +26,11 @@
|
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"lucide-react": "^1.16.0",
|
|
28
28
|
"recharts": "^3.8.1",
|
|
29
|
-
"@object-ui/components": "4.
|
|
30
|
-
"@object-ui/core": "4.
|
|
31
|
-
"@object-ui/i18n": "4.
|
|
32
|
-
"@object-ui/react": "4.
|
|
33
|
-
"@object-ui/types": "4.
|
|
29
|
+
"@object-ui/components": "4.8.0",
|
|
30
|
+
"@object-ui/core": "4.8.0",
|
|
31
|
+
"@object-ui/i18n": "4.8.0",
|
|
32
|
+
"@object-ui/react": "4.8.0",
|
|
33
|
+
"@object-ui/types": "4.8.0"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"react": "^18.0.0 || ^19.0.0",
|