drizzle-cube 0.2.12 → 0.2.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/charts.js +15 -15
- package/dist/client/chunks/{chart-activitygridchart-CUGN9Xq9.js → chart-activitygridchart-BSA93MaS.js} +895 -887
- package/dist/client/chunks/chart-activitygridchart-BSA93MaS.js.map +1 -0
- package/dist/client/chunks/chart-areachart-Cz-Bv8ZB.js +238 -0
- package/dist/client/chunks/chart-areachart-Cz-Bv8ZB.js.map +1 -0
- package/dist/client/chunks/{chart-axisformatcontrols-Ch_IYF94.js → chart-axisformatcontrols-BNfQgqND.js} +2 -2
- package/dist/client/chunks/{chart-axisformatcontrols-Ch_IYF94.js.map → chart-axisformatcontrols-BNfQgqND.js.map} +1 -1
- package/dist/client/chunks/{chart-barchart-D_op06r-.js → chart-barchart-CI8LhTwO.js} +73 -70
- package/dist/client/chunks/chart-barchart-CI8LhTwO.js.map +1 -0
- package/dist/client/chunks/chart-bubblechart-DaFSD3dc.js +247 -0
- package/dist/client/chunks/chart-bubblechart-DaFSD3dc.js.map +1 -0
- package/dist/client/chunks/{chart-charttooltip-Bx3I8jQv.js → chart-charttooltip-hLOOlEDZ.js} +4 -4
- package/dist/client/chunks/{chart-charttooltip-Bx3I8jQv.js.map → chart-charttooltip-hLOOlEDZ.js.map} +1 -1
- package/dist/client/chunks/chart-datatable-Dj_3LWKH.js +350 -0
- package/dist/client/chunks/chart-datatable-Dj_3LWKH.js.map +1 -0
- package/dist/client/chunks/chart-kpidelta-D45MO-i1.js +435 -0
- package/dist/client/chunks/chart-kpidelta-D45MO-i1.js.map +1 -0
- package/dist/client/chunks/chart-kpinumber-J3jJ1lz7.js +400 -0
- package/dist/client/chunks/chart-kpinumber-J3jJ1lz7.js.map +1 -0
- package/dist/client/chunks/{chart-kpitext-BZkC9u3A.js → chart-kpitext-Bo86g7Jn.js} +24 -24
- package/dist/client/chunks/chart-kpitext-Bo86g7Jn.js.map +1 -0
- package/dist/client/chunks/{chart-linechart-DqFmLbRe.js → chart-linechart-B7HFYqC7.js} +77 -73
- package/dist/client/chunks/chart-linechart-B7HFYqC7.js.map +1 -0
- package/dist/client/chunks/{chart-markdownchart-9n_TemoB.js → chart-markdownchart-C-lDJMtY.js} +20 -19
- package/dist/client/chunks/chart-markdownchart-C-lDJMtY.js.map +1 -0
- package/dist/client/chunks/{chart-piechart-CrXFd9pE.js → chart-piechart-CJCJZXmm.js} +17 -17
- package/dist/client/chunks/chart-piechart-CJCJZXmm.js.map +1 -0
- package/dist/client/chunks/{chart-radarchart-tar2GBkO.js → chart-radarchart-CJ-8qPmX.js} +19 -19
- package/dist/client/chunks/chart-radarchart-CJ-8qPmX.js.map +1 -0
- package/dist/client/chunks/{chart-radialbarchart-ab8Swtal.js → chart-radialbarchart-C8PlVtXx.js} +16 -16
- package/dist/client/chunks/chart-radialbarchart-C8PlVtXx.js.map +1 -0
- package/dist/client/chunks/{chart-scatterchart-BP06BeU5.js → chart-scatterchart-CXujAIug.js} +29 -29
- package/dist/client/chunks/chart-scatterchart-CXujAIug.js.map +1 -0
- package/dist/client/chunks/{chart-treemapchart-DAiixITm.js → chart-treemapchart-D9lYs_Y9.js} +20 -20
- package/dist/client/chunks/chart-treemapchart-D9lYs_Y9.js.map +1 -0
- package/dist/client/chunks/{charts-CHzWeaY1.js → charts-PgJ3XcwQ.js} +70 -70
- package/dist/client/chunks/{charts-CHzWeaY1.js.map → charts-PgJ3XcwQ.js.map} +1 -1
- package/dist/client/chunks/{components-DnM9CCUS.js → components-Cd068oGo.js} +4249 -4146
- package/dist/client/chunks/components-Cd068oGo.js.map +1 -0
- package/dist/client/chunks/{index-DlsvcKXf.js → index-Baq5aJv1.js} +2 -2
- package/dist/client/chunks/{index-DlsvcKXf.js.map → index-Baq5aJv1.js.map} +1 -1
- package/dist/client/components/AnalyticsPortlet.d.ts +2 -1
- package/dist/client/components/DashboardPortletCard.d.ts +3 -3
- package/dist/client/components/charts/ActivityGridChart.d.ts +3 -1
- package/dist/client/components/charts/AreaChart.d.ts +3 -1
- package/dist/client/components/charts/BarChart.d.ts +3 -1
- package/dist/client/components/charts/BubbleChart.d.ts +3 -1
- package/dist/client/components/charts/DataTable.d.ts +3 -1
- package/dist/client/components/charts/KpiDelta.d.ts +3 -1
- package/dist/client/components/charts/KpiNumber.d.ts +3 -1
- package/dist/client/components/charts/KpiText.d.ts +3 -1
- package/dist/client/components/charts/LineChart.d.ts +3 -1
- package/dist/client/components/charts/MarkdownChart.d.ts +3 -1
- package/dist/client/components/charts/PieChart.d.ts +3 -1
- package/dist/client/components/charts/RadarChart.d.ts +3 -1
- package/dist/client/components/charts/RadialBarChart.d.ts +3 -1
- package/dist/client/components/charts/ScatterChart.d.ts +3 -1
- package/dist/client/components/charts/TreeMapChart.d.ts +3 -1
- package/dist/client/components.js +2 -2
- package/dist/client/hooks/useCubeFieldLabel.d.ts +16 -0
- package/dist/client/hooks/useScrollDetection.d.ts +27 -0
- package/dist/client/hooks/useTheme.d.ts +11 -0
- package/dist/client/hooks.js +9 -9
- package/dist/client/index.d.ts +6 -1
- package/dist/client/index.js +53 -45
- package/dist/client/index.js.map +1 -1
- package/dist/client/providers/CubeApiProvider.d.ts +22 -0
- package/dist/client/providers/CubeFeaturesProvider.d.ts +15 -0
- package/dist/client/providers/CubeMetaProvider.d.ts +17 -0
- package/dist/client/providers/CubeProvider.d.ts +28 -8
- package/dist/client/providers.js +4 -3
- package/dist/client/providers.js.map +1 -1
- package/dist/client/styles.css +1 -1
- package/dist/client/utils/chartUtils.d.ts +2 -2
- package/dist/client/utils/filterUtils.d.ts +15 -0
- package/dist/client-bundle-stats.html +1 -1
- package/package.json +1 -1
- package/dist/client/chunks/chart-activitygridchart-CUGN9Xq9.js.map +0 -1
- package/dist/client/chunks/chart-areachart-B4tknnsY.js +0 -239
- package/dist/client/chunks/chart-areachart-B4tknnsY.js.map +0 -1
- package/dist/client/chunks/chart-barchart-D_op06r-.js.map +0 -1
- package/dist/client/chunks/chart-bubblechart-BsaIXUbS.js +0 -214
- package/dist/client/chunks/chart-bubblechart-BsaIXUbS.js.map +0 -1
- package/dist/client/chunks/chart-datatable-C7MS9q4Y.js +0 -283
- package/dist/client/chunks/chart-datatable-C7MS9q4Y.js.map +0 -1
- package/dist/client/chunks/chart-kpidelta-7-KOmb3w.js +0 -436
- package/dist/client/chunks/chart-kpidelta-7-KOmb3w.js.map +0 -1
- package/dist/client/chunks/chart-kpinumber-HOPfcK2N.js +0 -398
- package/dist/client/chunks/chart-kpinumber-HOPfcK2N.js.map +0 -1
- package/dist/client/chunks/chart-kpitext-BZkC9u3A.js.map +0 -1
- package/dist/client/chunks/chart-linechart-DqFmLbRe.js.map +0 -1
- package/dist/client/chunks/chart-markdownchart-9n_TemoB.js.map +0 -1
- package/dist/client/chunks/chart-piechart-CrXFd9pE.js.map +0 -1
- package/dist/client/chunks/chart-radarchart-tar2GBkO.js.map +0 -1
- package/dist/client/chunks/chart-radialbarchart-ab8Swtal.js.map +0 -1
- package/dist/client/chunks/chart-scatterchart-BP06BeU5.js.map +0 -1
- package/dist/client/chunks/chart-treemapchart-DAiixITm.js.map +0 -1
- package/dist/client/chunks/components-DnM9CCUS.js.map +0 -1
|
@@ -1,75 +1,78 @@
|
|
|
1
|
-
import { jsx as t, jsxs as o, Fragment as
|
|
2
|
-
import { useState as te, useMemo as
|
|
3
|
-
import { ComposedChart as se, CartesianGrid as re, XAxis as ie, YAxis as
|
|
1
|
+
import { jsx as t, jsxs as o, Fragment as Z } from "react/jsx-runtime";
|
|
2
|
+
import ee, { useState as te, useMemo as S } from "react";
|
|
3
|
+
import { ComposedChart as se, CartesianGrid as re, XAxis as ie, YAxis as B, Legend as ae, Bar as ne, Cell as le, Line as H } from "recharts";
|
|
4
4
|
import { C as oe } from "./chart-chartcontainer-CdwzIKP1.js";
|
|
5
|
-
import { C as ce } from "./chart-charttooltip-
|
|
6
|
-
import { u as de, t as
|
|
7
|
-
import { p as ue, s as ge } from "./chart-areachart-
|
|
8
|
-
|
|
9
|
-
data:
|
|
5
|
+
import { C as ce } from "./chart-charttooltip-hLOOlEDZ.js";
|
|
6
|
+
import { u as de, t as me, i as xe, C as fe, f as T, N as he, P as K, a as P } from "./chart-activitygridchart-BSA93MaS.js";
|
|
7
|
+
import { p as ue, s as ge } from "./chart-areachart-Cz-Bv8ZB.js";
|
|
8
|
+
const we = ee.memo(function({
|
|
9
|
+
data: m,
|
|
10
10
|
chartConfig: s,
|
|
11
11
|
displayConfig: l = {},
|
|
12
|
-
queryObject:
|
|
13
|
-
height:
|
|
14
|
-
colorPalette:
|
|
12
|
+
queryObject: O,
|
|
13
|
+
height: u = "100%",
|
|
14
|
+
colorPalette: I
|
|
15
15
|
}) {
|
|
16
|
-
const [v,
|
|
16
|
+
const [v, V] = te(null), x = de(), z = l?.stackType ?? (l?.stacked ? "normal" : "none"), W = z !== "none", $ = z === "percent", L = {
|
|
17
17
|
showLegend: l?.showLegend ?? !0,
|
|
18
18
|
showGrid: l?.showGrid ?? !0,
|
|
19
19
|
showTooltip: l?.showTooltip ?? !0
|
|
20
|
-
},
|
|
21
|
-
let
|
|
22
|
-
s?.xAxis && s?.yAxis ? (
|
|
23
|
-
const { data: k, seriesKeys:
|
|
24
|
-
x,
|
|
20
|
+
}, g = l?.leftYAxisFormat, N = l?.rightYAxisFormat;
|
|
21
|
+
let f, a = [], _ = [], c = null;
|
|
22
|
+
s?.xAxis && s?.yAxis ? (f = Array.isArray(s.xAxis) ? s.xAxis[0] : s.xAxis, a = Array.isArray(s.yAxis) ? s.yAxis : [s.yAxis], _ = s.series || []) : s?.x && s?.y ? (f = s.x, a = Array.isArray(s.y) ? s.y : [s.y]) : c = "Invalid or missing chart axis configuration", !c && (!f || !a || a.length === 0) && (c = "Missing required X-axis or Y-axis fields");
|
|
23
|
+
const { data: k, seriesKeys: h } = S(() => c || !m || m.length === 0 || !f ? { data: [], seriesKeys: [] } : me(
|
|
25
24
|
m,
|
|
25
|
+
f,
|
|
26
26
|
a,
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
), [
|
|
27
|
+
O,
|
|
28
|
+
_,
|
|
29
|
+
x
|
|
30
|
+
), [m, f, a, O, _, x, c]), p = S(
|
|
31
|
+
() => s?.yAxisAssignment || {},
|
|
32
|
+
[s?.yAxisAssignment]
|
|
33
|
+
), C = S(() => {
|
|
31
34
|
const r = {};
|
|
32
35
|
return a.forEach((n) => {
|
|
33
|
-
const
|
|
34
|
-
r[
|
|
36
|
+
const y = x(n);
|
|
37
|
+
r[y] = n;
|
|
35
38
|
}), r;
|
|
36
|
-
}, [a,
|
|
37
|
-
if (k.length === 0 ||
|
|
39
|
+
}, [a, x]), b = a.some((r) => p[r] === "right"), R = a.filter((r) => (p[r] || "left") === "left"), G = a.filter((r) => p[r] === "right"), { chartData: d, skippedCount: F } = S(() => {
|
|
40
|
+
if (k.length === 0 || h.length === 0)
|
|
38
41
|
return { chartData: [], skippedCount: 0 };
|
|
39
|
-
const r = k.filter((
|
|
42
|
+
const r = k.filter((y) => h.some((w) => xe(y[w]))), n = k.length - r.length;
|
|
40
43
|
return { chartData: r, skippedCount: n };
|
|
41
|
-
}, [k,
|
|
44
|
+
}, [k, h]);
|
|
42
45
|
try {
|
|
43
|
-
if (!
|
|
44
|
-
return /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-text-muted", style: { height:
|
|
46
|
+
if (!m || m.length === 0)
|
|
47
|
+
return /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-text-muted", style: { height: u }, children: /* @__PURE__ */ o("div", { className: "text-center", children: [
|
|
45
48
|
/* @__PURE__ */ t("div", { className: "text-sm font-semibold mb-1", children: "No data available" }),
|
|
46
49
|
/* @__PURE__ */ t("div", { className: "text-xs text-dc-text-secondary", children: "No data points to display in bar chart" })
|
|
47
50
|
] }) });
|
|
48
51
|
if (c)
|
|
49
|
-
return /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-warning", style: { height:
|
|
52
|
+
return /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-warning", style: { height: u }, children: /* @__PURE__ */ o("div", { className: "text-center", children: [
|
|
50
53
|
/* @__PURE__ */ t("div", { className: "text-sm font-semibold mb-1", children: "Configuration Error" }),
|
|
51
54
|
/* @__PURE__ */ t("div", { className: "text-xs", children: c })
|
|
52
55
|
] }) });
|
|
53
|
-
const r =
|
|
54
|
-
const i = e[
|
|
56
|
+
const r = W && !b, n = $ && !b, y = n ? "expand" : void 0, w = h.length === 1 && d.some((e) => {
|
|
57
|
+
const i = e[h[0]];
|
|
55
58
|
return typeof i == "number" && i < 0;
|
|
56
|
-
}),
|
|
59
|
+
}), X = L.showLegend, U = {
|
|
57
60
|
...fe,
|
|
58
61
|
left: 40,
|
|
59
62
|
// Space for left Y-axis label
|
|
60
63
|
right: b ? 40 : 20
|
|
61
64
|
// Extra space for right Y-axis label if needed
|
|
62
|
-
},
|
|
63
|
-
let
|
|
64
|
-
return D.length > 0 && (
|
|
65
|
+
}, q = ue(l?.target || ""), D = ge(q, d.length);
|
|
66
|
+
let M = d;
|
|
67
|
+
return D.length > 0 && (M = d.map((e, i) => ({
|
|
65
68
|
...e,
|
|
66
69
|
__target: D[i] || null
|
|
67
|
-
}))), !d || d.length === 0 ? /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-text-muted", style: { height:
|
|
70
|
+
}))), !d || d.length === 0 ? /* @__PURE__ */ t("div", { className: "flex items-center justify-center w-full text-dc-text-muted", style: { height: u }, children: /* @__PURE__ */ o("div", { className: "text-center", children: [
|
|
68
71
|
/* @__PURE__ */ t("div", { className: "text-sm font-semibold mb-1", children: "No valid data" }),
|
|
69
72
|
/* @__PURE__ */ t("div", { className: "text-xs text-dc-text-secondary", children: "No valid data points for bar chart after transformation" })
|
|
70
|
-
] }) }) : /* @__PURE__ */ o("div", { className: "relative w-full", style: { height:
|
|
71
|
-
/* @__PURE__ */ t(oe, { height: F > 0 ? "calc(100% - 20px)" : "100%", children: /* @__PURE__ */ o(se, { data:
|
|
72
|
-
|
|
73
|
+
] }) }) : /* @__PURE__ */ o("div", { className: "relative w-full", style: { height: u }, children: [
|
|
74
|
+
/* @__PURE__ */ t(oe, { height: F > 0 ? "calc(100% - 20px)" : "100%", children: /* @__PURE__ */ o(se, { data: M, margin: U, stackOffset: y, children: [
|
|
75
|
+
L.showGrid && /* @__PURE__ */ t(re, { strokeDasharray: "3 3" }),
|
|
73
76
|
/* @__PURE__ */ t(
|
|
74
77
|
ie,
|
|
75
78
|
{
|
|
@@ -81,15 +84,15 @@ function Fe({
|
|
|
81
84
|
}
|
|
82
85
|
),
|
|
83
86
|
/* @__PURE__ */ t(
|
|
84
|
-
|
|
87
|
+
B,
|
|
85
88
|
{
|
|
86
89
|
yAxisId: "left",
|
|
87
90
|
orientation: "left",
|
|
88
91
|
tick: { fontSize: 12 },
|
|
89
|
-
tickFormatter: n ? (e) => `${(e * 100).toFixed(0)}%` :
|
|
92
|
+
tickFormatter: n ? (e) => `${(e * 100).toFixed(0)}%` : g ? (e) => T(e, g) : void 0,
|
|
90
93
|
domain: n ? [0, 1] : void 0,
|
|
91
|
-
label: n ? void 0 :
|
|
92
|
-
value:
|
|
94
|
+
label: n ? void 0 : R.length > 0 ? {
|
|
95
|
+
value: g?.label || x(R[0]),
|
|
93
96
|
angle: -90,
|
|
94
97
|
position: "left",
|
|
95
98
|
style: { textAnchor: "middle", fontSize: "12px" }
|
|
@@ -97,36 +100,36 @@ function Fe({
|
|
|
97
100
|
}
|
|
98
101
|
),
|
|
99
102
|
b && /* @__PURE__ */ t(
|
|
100
|
-
|
|
103
|
+
B,
|
|
101
104
|
{
|
|
102
105
|
yAxisId: "right",
|
|
103
106
|
orientation: "right",
|
|
104
107
|
tick: { fontSize: 12 },
|
|
105
|
-
tickFormatter: N ? (e) =>
|
|
106
|
-
label:
|
|
107
|
-
value: N?.label ||
|
|
108
|
+
tickFormatter: N ? (e) => T(e, N) : void 0,
|
|
109
|
+
label: G.length > 0 ? {
|
|
110
|
+
value: N?.label || x(G[0]),
|
|
108
111
|
angle: 90,
|
|
109
112
|
position: "right",
|
|
110
113
|
style: { textAnchor: "middle", fontSize: "12px" }
|
|
111
114
|
} : void 0
|
|
112
115
|
}
|
|
113
116
|
),
|
|
114
|
-
|
|
117
|
+
L.showTooltip && /* @__PURE__ */ t(
|
|
115
118
|
ce,
|
|
116
119
|
{
|
|
117
120
|
formatter: (e, i) => {
|
|
118
121
|
if (e == null)
|
|
119
122
|
return ["No data", i];
|
|
120
123
|
if (i === "Target")
|
|
121
|
-
return [
|
|
124
|
+
return [T(e, g), "Target Value"];
|
|
122
125
|
if (n && typeof e == "number")
|
|
123
126
|
return [`${(e * 100).toFixed(1)}%`, i];
|
|
124
|
-
const
|
|
125
|
-
return [
|
|
127
|
+
const A = C[i], E = (A && p[A] === "right" ? "right" : "left") === "right" ? N : g;
|
|
128
|
+
return [T(e, E), i];
|
|
126
129
|
}
|
|
127
130
|
}
|
|
128
131
|
),
|
|
129
|
-
|
|
132
|
+
X && /* @__PURE__ */ t(
|
|
130
133
|
ae,
|
|
131
134
|
{
|
|
132
135
|
wrapperStyle: { fontSize: "12px", paddingTop: "25px" },
|
|
@@ -135,38 +138,38 @@ function Fe({
|
|
|
135
138
|
layout: "horizontal",
|
|
136
139
|
align: "center",
|
|
137
140
|
verticalAlign: "bottom",
|
|
138
|
-
onMouseEnter: (e) =>
|
|
139
|
-
onMouseLeave: () =>
|
|
141
|
+
onMouseEnter: (e) => V(String(e.dataKey || "")),
|
|
142
|
+
onMouseLeave: () => V(null)
|
|
140
143
|
}
|
|
141
144
|
),
|
|
142
|
-
|
|
143
|
-
const
|
|
145
|
+
h.map((e, i) => {
|
|
146
|
+
const A = C[e], Y = A && p[A] === "right" ? "right" : "left";
|
|
144
147
|
return /* @__PURE__ */ t(
|
|
145
148
|
ne,
|
|
146
149
|
{
|
|
147
150
|
dataKey: e,
|
|
148
|
-
yAxisId:
|
|
151
|
+
yAxisId: Y,
|
|
149
152
|
stackId: r ? "stack" : void 0,
|
|
150
|
-
fill: w ?
|
|
153
|
+
fill: w ? K : I?.colors && I.colors[i % I.colors.length] || P[i % P.length],
|
|
151
154
|
fillOpacity: v ? v === e ? 1 : 0.3 : 1,
|
|
152
|
-
children: w && d.map((
|
|
153
|
-
const
|
|
155
|
+
children: w && d.map((E, J) => {
|
|
156
|
+
const j = E[e], Q = typeof j == "number" && j < 0 ? he : K;
|
|
154
157
|
return /* @__PURE__ */ t(
|
|
155
158
|
le,
|
|
156
159
|
{
|
|
157
|
-
fill:
|
|
160
|
+
fill: Q,
|
|
158
161
|
fillOpacity: v ? v === e ? 1 : 0.3 : 1
|
|
159
162
|
},
|
|
160
|
-
`cell-${
|
|
163
|
+
`cell-${J}`
|
|
161
164
|
);
|
|
162
165
|
})
|
|
163
166
|
},
|
|
164
167
|
e
|
|
165
168
|
);
|
|
166
169
|
}),
|
|
167
|
-
D.length > 0 && /* @__PURE__ */ o(
|
|
170
|
+
D.length > 0 && /* @__PURE__ */ o(Z, { children: [
|
|
168
171
|
/* @__PURE__ */ t(
|
|
169
|
-
|
|
172
|
+
H,
|
|
170
173
|
{
|
|
171
174
|
type: "monotone",
|
|
172
175
|
dataKey: "__target",
|
|
@@ -179,7 +182,7 @@ function Fe({
|
|
|
179
182
|
}
|
|
180
183
|
),
|
|
181
184
|
/* @__PURE__ */ t(
|
|
182
|
-
|
|
185
|
+
H,
|
|
183
186
|
{
|
|
184
187
|
type: "monotone",
|
|
185
188
|
dataKey: "__target",
|
|
@@ -203,14 +206,14 @@ function Fe({
|
|
|
203
206
|
] })
|
|
204
207
|
] });
|
|
205
208
|
} catch (r) {
|
|
206
|
-
return /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center w-full text-dc-error p-4", style: { height:
|
|
209
|
+
return /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center w-full text-dc-error p-4", style: { height: u }, children: /* @__PURE__ */ o("div", { className: "text-center", children: [
|
|
207
210
|
/* @__PURE__ */ t("div", { className: "text-sm font-semibold mb-1", children: "Bar Chart Error" }),
|
|
208
211
|
/* @__PURE__ */ t("div", { className: "text-xs mb-2", children: r instanceof Error ? r.message : "Unknown rendering error" }),
|
|
209
212
|
/* @__PURE__ */ t("div", { className: "text-xs text-dc-text-muted", children: "Check the data and configuration" })
|
|
210
213
|
] }) });
|
|
211
214
|
}
|
|
212
|
-
}
|
|
215
|
+
});
|
|
213
216
|
export {
|
|
214
|
-
|
|
217
|
+
we as default
|
|
215
218
|
};
|
|
216
|
-
//# sourceMappingURL=chart-barchart-
|
|
219
|
+
//# sourceMappingURL=chart-barchart-CI8LhTwO.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart-barchart-CI8LhTwO.js","sources":["../../../src/client/components/charts/BarChart.tsx"],"sourcesContent":["import React, { useState, useMemo } from 'react'\nimport { ComposedChart, Bar, Line, XAxis, YAxis, CartesianGrid, Cell, Legend } from 'recharts'\nimport ChartContainer from './ChartContainer'\nimport ChartTooltip from './ChartTooltip'\nimport { CHART_COLORS, POSITIVE_COLOR, NEGATIVE_COLOR, CHART_MARGINS } from '../../utils/chartConstants'\nimport { transformChartDataWithSeries, isValidNumericValue, formatAxisValue } from '../../utils/chartUtils'\nimport { parseTargetValues, spreadTargetValues } from '../../utils/targetUtils'\nimport { useCubeFieldLabel } from '../../hooks/useCubeFieldLabel'\nimport type { ChartProps } from '../../types'\n\nconst BarChart = React.memo(function BarChart({\n data,\n chartConfig,\n displayConfig = {},\n queryObject,\n height = \"100%\",\n colorPalette\n}: ChartProps) {\n const [hoveredLegend, setHoveredLegend] = useState<string | null>(null)\n // Use specialized hook to avoid re-renders from unrelated context changes\n const getFieldLabel = useCubeFieldLabel()\n\n // Determine stacking from stackType (new) or stacked (legacy)\n const stackType = displayConfig?.stackType ?? (displayConfig?.stacked ? 'normal' : 'none')\n const shouldStack = stackType !== 'none'\n const isPercentStack = stackType === 'percent'\n\n const safeDisplayConfig = {\n showLegend: displayConfig?.showLegend ?? true,\n showGrid: displayConfig?.showGrid ?? true,\n showTooltip: displayConfig?.showTooltip ?? true\n }\n\n // Extract axis format configs\n const leftYAxisFormat = displayConfig?.leftYAxisFormat\n const rightYAxisFormat = displayConfig?.rightYAxisFormat\n\n // Validate chartConfig - support both legacy and new formats\n // Do validation but don't early return yet (hooks must come first)\n let xAxisField: string | undefined\n let yAxisFields: string[] = []\n let seriesFields: string[] = []\n let configError: string | null = null\n\n if (chartConfig?.xAxis && chartConfig?.yAxis) {\n // New format\n xAxisField = Array.isArray(chartConfig.xAxis) ? chartConfig.xAxis[0] : chartConfig.xAxis\n yAxisFields = Array.isArray(chartConfig.yAxis) ? chartConfig.yAxis : [chartConfig.yAxis]\n seriesFields = chartConfig.series || []\n } else if (chartConfig?.x && chartConfig?.y) {\n // Legacy format\n xAxisField = chartConfig.x\n yAxisFields = Array.isArray(chartConfig.y) ? chartConfig.y : [chartConfig.y]\n } else {\n configError = 'Invalid or missing chart axis configuration'\n }\n\n if (!configError && (!xAxisField || !yAxisFields || yAxisFields.length === 0)) {\n configError = 'Missing required X-axis or Y-axis fields'\n }\n\n // Transform data (will be empty arrays if config is invalid)\n const { data: transformedData, seriesKeys } = useMemo(() => {\n if (configError || !data || data.length === 0 || !xAxisField) {\n return { data: [], seriesKeys: [] }\n }\n return transformChartDataWithSeries(\n data,\n xAxisField,\n yAxisFields,\n queryObject,\n seriesFields,\n getFieldLabel\n )\n }, [data, xAxisField, yAxisFields, queryObject, seriesFields, getFieldLabel, configError])\n\n // Dual Y-axis support: extract yAxisAssignment from chartConfig (memoized to prevent object recreation)\n const yAxisAssignment = useMemo(() =>\n chartConfig?.yAxisAssignment || {},\n [chartConfig?.yAxisAssignment]\n )\n\n // Build mapping from series key (label) to original field name\n const seriesKeyToField: Record<string, string> = useMemo(() => {\n const mapping: Record<string, string> = {}\n yAxisFields.forEach((field) => {\n const label = getFieldLabel(field)\n mapping[label] = field\n })\n return mapping\n }, [yAxisFields, getFieldLabel])\n\n // Determine if we need a right Y-axis\n const hasRightAxis = yAxisFields.some((field) => yAxisAssignment[field] === 'right')\n\n // Get fields for left and right axes for labels\n const leftAxisFields = yAxisFields.filter((f) => (yAxisAssignment[f] || 'left') === 'left')\n const rightAxisFields = yAxisFields.filter((f) => yAxisAssignment[f] === 'right')\n\n // Null handling: Filter out data points where ALL measure values are null\n // This prevents rendering empty bars and makes the chart clearer\n const { chartData, skippedCount } = useMemo(() => {\n if (transformedData.length === 0 || seriesKeys.length === 0) {\n return { chartData: [], skippedCount: 0 }\n }\n const filtered = transformedData.filter(row => {\n // Keep the row if at least one series has a valid numeric value\n return seriesKeys.some(key => isValidNumericValue(row[key]))\n })\n const skipped = transformedData.length - filtered.length\n return { chartData: filtered, skippedCount: skipped }\n }, [transformedData, seriesKeys])\n\n // Now handle early returns AFTER all hooks\n try {\n if (!data || data.length === 0) {\n return (\n <div className=\"flex items-center justify-center w-full text-dc-text-muted\" style={{ height }}>\n <div className=\"text-center\">\n <div className=\"text-sm font-semibold mb-1\">No data available</div>\n <div className=\"text-xs text-dc-text-secondary\">No data points to display in bar chart</div>\n </div>\n </div>\n )\n }\n\n if (configError) {\n return (\n <div className=\"flex items-center justify-center w-full text-dc-warning\" style={{ height }}>\n <div className=\"text-center\">\n <div className=\"text-sm font-semibold mb-1\">Configuration Error</div>\n <div className=\"text-xs\">{configError}</div>\n </div>\n </div>\n )\n }\n\n // Determine stack offset for percentage stacking\n // Disable stacking when dual Y-axis is used (bars on different axes can't be stacked)\n const effectiveShouldStack = shouldStack && !hasRightAxis\n const effectiveIsPercentStack = isPercentStack && !hasRightAxis\n const stackOffset = effectiveIsPercentStack ? 'expand' as const : undefined\n\n // Check if we should use positive/negative coloring\n // This is enabled when we have single series data with mixed positive/negative values\n const usePositiveNegativeColoring = seriesKeys.length === 1 && chartData.some(row => {\n const value = row[seriesKeys[0]]\n return typeof value === 'number' && value < 0\n })\n\n // Determine if legend will be shown\n const showLegend = safeDisplayConfig.showLegend\n\n // Use custom chart margins with extra space for Y-axis labels\n const chartMargins = {\n ...CHART_MARGINS,\n left: 40, // Space for left Y-axis label\n right: hasRightAxis ? 40 : 20 // Extra space for right Y-axis label if needed\n }\n \n // Process target values and add to chart data\n const targetValues = parseTargetValues(displayConfig?.target || '')\n const spreadTargets = spreadTargetValues(targetValues, chartData.length)\n \n // Add target data to chart data if targets exist\n let enhancedChartData = chartData\n if (spreadTargets.length > 0) {\n enhancedChartData = chartData.map((dataPoint, index) => ({\n ...dataPoint,\n __target: spreadTargets[index] || null\n }))\n }\n \n // Validate transformed data\n if (!chartData || chartData.length === 0) {\n return (\n <div className=\"flex items-center justify-center w-full text-dc-text-muted\" style={{ height }}>\n <div className=\"text-center\">\n <div className=\"text-sm font-semibold mb-1\">No valid data</div>\n <div className=\"text-xs text-dc-text-secondary\">No valid data points for bar chart after transformation</div>\n </div>\n </div>\n )\n }\n\n return (\n <div className=\"relative w-full\" style={{ height }}>\n <ChartContainer height={skippedCount > 0 ? `calc(100% - 20px)` : \"100%\"}>\n <ComposedChart data={enhancedChartData} margin={chartMargins} stackOffset={stackOffset}>\n {safeDisplayConfig.showGrid && (\n <CartesianGrid strokeDasharray=\"3 3\" />\n )}\n <XAxis\n dataKey=\"name\"\n tick={{ fontSize: 12 }}\n angle={-45}\n textAnchor=\"end\"\n height={60}\n />\n <YAxis\n yAxisId=\"left\"\n orientation=\"left\"\n tick={{ fontSize: 12 }}\n tickFormatter={\n effectiveIsPercentStack\n ? (v) => `${(v * 100).toFixed(0)}%`\n : leftYAxisFormat\n ? (value) => formatAxisValue(value, leftYAxisFormat)\n : undefined\n }\n domain={effectiveIsPercentStack ? [0, 1] : undefined}\n label={\n effectiveIsPercentStack\n ? undefined\n : leftAxisFields.length > 0\n ? {\n value: leftYAxisFormat?.label || getFieldLabel(leftAxisFields[0]),\n angle: -90,\n position: 'left',\n style: { textAnchor: 'middle', fontSize: '12px' }\n }\n : undefined\n }\n />\n {hasRightAxis && (\n <YAxis\n yAxisId=\"right\"\n orientation=\"right\"\n tick={{ fontSize: 12 }}\n tickFormatter={rightYAxisFormat ? (value) => formatAxisValue(value, rightYAxisFormat) : undefined}\n label={\n rightAxisFields.length > 0\n ? {\n value: rightYAxisFormat?.label || getFieldLabel(rightAxisFields[0]),\n angle: 90,\n position: 'right',\n style: { textAnchor: 'middle', fontSize: '12px' }\n }\n : undefined\n }\n />\n )}\n {safeDisplayConfig.showTooltip && (\n <ChartTooltip\n formatter={(value: any, name: any) => {\n // Handle null values in tooltip\n if (value === null || value === undefined) {\n return ['No data', name]\n }\n if (name === 'Target') {\n // Use left Y-axis format for target values\n return [formatAxisValue(value, leftYAxisFormat), 'Target Value']\n }\n // Format as percentage when using percent stacking\n if (effectiveIsPercentStack && typeof value === 'number') {\n return [`${(value * 100).toFixed(1)}%`, name]\n }\n // Determine which axis format to use based on series name\n const originalField = seriesKeyToField[name]\n const axisId = originalField && yAxisAssignment[originalField] === 'right' ? 'right' : 'left'\n const formatConfig = axisId === 'right' ? rightYAxisFormat : leftYAxisFormat\n return [formatAxisValue(value, formatConfig), name]\n }}\n />\n )}\n {showLegend && (\n <Legend \n wrapperStyle={{ fontSize: '12px', paddingTop: '25px' }}\n iconType=\"rect\"\n iconSize={8}\n layout=\"horizontal\"\n align=\"center\"\n verticalAlign=\"bottom\"\n onMouseEnter={(o) => setHoveredLegend(String(o.dataKey || ''))}\n onMouseLeave={() => setHoveredLegend(null)}\n />\n )}\n {seriesKeys.map((seriesKey, index) => {\n // Look up the original field name to get its axis assignment\n const originalField = seriesKeyToField[seriesKey]\n const axisId = originalField && yAxisAssignment[originalField] === 'right' ? 'right' : 'left'\n return (\n <Bar\n key={seriesKey}\n dataKey={seriesKey}\n yAxisId={axisId}\n stackId={effectiveShouldStack ? 'stack' : undefined}\n fill={\n usePositiveNegativeColoring\n ? POSITIVE_COLOR\n : (colorPalette?.colors && colorPalette.colors[index % colorPalette.colors.length]) ||\n CHART_COLORS[index % CHART_COLORS.length]\n }\n fillOpacity={hoveredLegend ? (hoveredLegend === seriesKey ? 1 : 0.3) : 1}\n >\n {usePositiveNegativeColoring &&\n chartData.map((entry, entryIndex) => {\n const value = entry[seriesKey]\n const fillColor = typeof value === 'number' && value < 0 ? NEGATIVE_COLOR : POSITIVE_COLOR\n return (\n <Cell\n key={`cell-${entryIndex}`}\n fill={fillColor}\n fillOpacity={hoveredLegend ? (hoveredLegend === seriesKey ? 1 : 0.3) : 1}\n />\n )\n })}\n </Bar>\n )\n })}\n {spreadTargets.length > 0 && (\n <>\n {/* White background line */}\n <Line\n type=\"monotone\"\n dataKey=\"__target\"\n yAxisId=\"left\"\n stroke=\"#ffffff\"\n strokeWidth={2}\n dot={false}\n activeDot={false}\n connectNulls={false}\n />\n {/* Grey dashed line on top */}\n <Line\n type=\"monotone\"\n dataKey=\"__target\"\n yAxisId=\"left\"\n name=\"Target\"\n stroke=\"#8B5CF6\"\n strokeWidth={2}\n strokeDasharray=\"2 3\"\n dot={false}\n activeDot={false}\n connectNulls={false}\n />\n </>\n )}\n </ComposedChart>\n </ChartContainer>\n {skippedCount > 0 && (\n <div className=\"text-xs text-dc-text-muted text-center mt-1\">\n {skippedCount} data point{skippedCount !== 1 ? 's' : ''} with no values hidden\n </div>\n )}\n </div>\n )\n } catch (error) {\n // 'BarChart rendering error\n return (\n <div className=\"flex flex-col items-center justify-center w-full text-dc-error p-4\" style={{ height }}>\n <div className=\"text-center\">\n <div className=\"text-sm font-semibold mb-1\">Bar Chart Error</div>\n <div className=\"text-xs mb-2\">{error instanceof Error ? error.message : 'Unknown rendering error'}</div>\n <div className=\"text-xs text-dc-text-muted\">Check the data and configuration</div>\n </div>\n </div>\n )\n }\n})\n\nexport default BarChart"],"names":["BarChart","React","data","chartConfig","displayConfig","queryObject","height","colorPalette","hoveredLegend","setHoveredLegend","useState","getFieldLabel","useCubeFieldLabel","stackType","shouldStack","isPercentStack","safeDisplayConfig","leftYAxisFormat","rightYAxisFormat","xAxisField","yAxisFields","seriesFields","configError","transformedData","seriesKeys","useMemo","transformChartDataWithSeries","yAxisAssignment","seriesKeyToField","mapping","field","label","hasRightAxis","leftAxisFields","f","rightAxisFields","chartData","skippedCount","filtered","row","key","isValidNumericValue","skipped","jsx","jsxs","effectiveShouldStack","effectiveIsPercentStack","stackOffset","usePositiveNegativeColoring","value","showLegend","chartMargins","CHART_MARGINS","targetValues","parseTargetValues","spreadTargets","spreadTargetValues","enhancedChartData","dataPoint","index","ChartContainer","ComposedChart","CartesianGrid","XAxis","YAxis","v","formatAxisValue","ChartTooltip","name","originalField","formatConfig","Legend","o","seriesKey","axisId","Bar","POSITIVE_COLOR","CHART_COLORS","entry","entryIndex","fillColor","NEGATIVE_COLOR","Cell","Fragment","Line","error"],"mappings":"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"}
|
|
@@ -0,0 +1,247 @@
|
|
|
1
|
+
import { jsx as y, jsxs as te } from "react/jsx-runtime";
|
|
2
|
+
import Ae, { useSyncExternalStore as Fe, useCallback as we, useRef as ne, useState as oe, useMemo as Se, useLayoutEffect as ve, useEffect as ce } from "react";
|
|
3
|
+
import { g as de, s as ze, w as Te, u as $e, b as D, c as Ne, d as ue, i as ke, p as me, C as xe, l as fe, e as ye, h as Ye, m as Re, q as Ve, j as he, o as pe, a as se, k as ge, n as be, f as N } from "./chart-activitygridchart-BSA93MaS.js";
|
|
4
|
+
const H = {
|
|
5
|
+
listeners: /* @__PURE__ */ new Set(),
|
|
6
|
+
subscribe(w) {
|
|
7
|
+
return this.listeners.add(w), () => this.listeners.delete(w);
|
|
8
|
+
},
|
|
9
|
+
notify() {
|
|
10
|
+
this.listeners.forEach((w) => w());
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
Te(() => {
|
|
14
|
+
H.notify();
|
|
15
|
+
});
|
|
16
|
+
function Be() {
|
|
17
|
+
const w = Fe(
|
|
18
|
+
H.subscribe.bind(H),
|
|
19
|
+
de,
|
|
20
|
+
// Client-side snapshot
|
|
21
|
+
de
|
|
22
|
+
// Server-side snapshot (SSR)
|
|
23
|
+
), p = we((r) => {
|
|
24
|
+
ze(r), H.notify();
|
|
25
|
+
}, []);
|
|
26
|
+
return { theme: w, setTheme: p };
|
|
27
|
+
}
|
|
28
|
+
const Le = Ae.memo(function({
|
|
29
|
+
data: p,
|
|
30
|
+
chartConfig: r,
|
|
31
|
+
displayConfig: i = {},
|
|
32
|
+
queryObject: E,
|
|
33
|
+
height: q = "100%",
|
|
34
|
+
colorPalette: M
|
|
35
|
+
}) {
|
|
36
|
+
const U = ne(null), S = ne(null), [k, j] = oe({ width: 0, height: 0 }), [Y, W] = oe(!1), { theme: re } = Be(), g = $e(), s = Se(() => ({
|
|
37
|
+
showLegend: i?.showLegend ?? !0,
|
|
38
|
+
showGrid: i?.showGrid ?? !0,
|
|
39
|
+
showTooltip: i?.showTooltip ?? !0,
|
|
40
|
+
minBubbleSize: i?.minBubbleSize ?? 5,
|
|
41
|
+
maxBubbleSize: i?.maxBubbleSize ?? 50,
|
|
42
|
+
bubbleOpacity: i?.bubbleOpacity ?? 0.7,
|
|
43
|
+
xAxisFormat: i?.xAxisFormat,
|
|
44
|
+
leftYAxisFormat: i?.leftYAxisFormat
|
|
45
|
+
}), [
|
|
46
|
+
i?.showLegend,
|
|
47
|
+
i?.showGrid,
|
|
48
|
+
i?.showTooltip,
|
|
49
|
+
i?.minBubbleSize,
|
|
50
|
+
i?.maxBubbleSize,
|
|
51
|
+
i?.bubbleOpacity,
|
|
52
|
+
i?.xAxisFormat,
|
|
53
|
+
i?.leftYAxisFormat
|
|
54
|
+
]);
|
|
55
|
+
return ve(() => {
|
|
56
|
+
let a = 0;
|
|
57
|
+
const d = 10;
|
|
58
|
+
let u, m;
|
|
59
|
+
const n = () => {
|
|
60
|
+
if (S.current) {
|
|
61
|
+
const { width: b, height: o } = S.current.getBoundingClientRect();
|
|
62
|
+
if (b > 0 && o > 0)
|
|
63
|
+
return j({ width: b, height: o }), W(!0), !0;
|
|
64
|
+
}
|
|
65
|
+
return !1;
|
|
66
|
+
};
|
|
67
|
+
if (!n() && a < d) {
|
|
68
|
+
const b = () => {
|
|
69
|
+
!n() && a < d && (a++, m = setTimeout(() => {
|
|
70
|
+
u = requestAnimationFrame(b);
|
|
71
|
+
}, 50 * a));
|
|
72
|
+
};
|
|
73
|
+
u = requestAnimationFrame(b);
|
|
74
|
+
}
|
|
75
|
+
return () => {
|
|
76
|
+
u && cancelAnimationFrame(u), m && clearTimeout(m);
|
|
77
|
+
};
|
|
78
|
+
}, []), ce(() => {
|
|
79
|
+
let a = null;
|
|
80
|
+
const d = () => {
|
|
81
|
+
if (S.current) {
|
|
82
|
+
const { width: u, height: m } = S.current.getBoundingClientRect();
|
|
83
|
+
u > 0 && m > 0 && (j({ width: u, height: m }), Y || W(!0));
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
return S.current && (a = new ResizeObserver((u) => {
|
|
87
|
+
for (const m of u) {
|
|
88
|
+
const { width: n, height: v } = m.contentRect;
|
|
89
|
+
n > 0 && v > 0 && (j({ width: n, height: v }), Y || W(!0));
|
|
90
|
+
}
|
|
91
|
+
}), a.observe(S.current), d()), window.addEventListener("resize", d), () => {
|
|
92
|
+
a && a.disconnect(), window.removeEventListener("resize", d);
|
|
93
|
+
};
|
|
94
|
+
}, [Y]), ce(() => {
|
|
95
|
+
if (!p || p.length === 0 || !U.current || !Y || k.width === 0 || (D(U.current).selectAll("*").remove(), !r?.xAxis || !r?.yAxis || !r?.series))
|
|
96
|
+
return;
|
|
97
|
+
const a = Array.isArray(r.xAxis) ? r.xAxis[0] : r.xAxis, d = Array.isArray(r.yAxis) ? r.yAxis[0] : r.yAxis, u = Array.isArray(r.series) ? r.series[0] : r.series, m = Array.isArray(r.sizeField) ? r.sizeField[0] : r.sizeField || d, n = Array.isArray(r.colorField) ? r.colorField[0] : r.colorField;
|
|
98
|
+
if (!a || !d || !u || !m)
|
|
99
|
+
return;
|
|
100
|
+
const v = Ne(E, a), b = E?.timeDimensions?.some(
|
|
101
|
+
(e) => e.dimension === a
|
|
102
|
+
) || !1, o = p.map((e) => {
|
|
103
|
+
const t = e[a];
|
|
104
|
+
let l, x;
|
|
105
|
+
if (b && t) {
|
|
106
|
+
const c = String(t);
|
|
107
|
+
let h;
|
|
108
|
+
if (c.match(/^\d{4}-\d{2}-\d{2}[T ]/)) {
|
|
109
|
+
let F = c;
|
|
110
|
+
c.includes(" ") && (F = c.replace(" ", "T").replace("+00", "Z").replace(/\+\d{2}:\d{2}$/, "Z")), !F.endsWith("Z") && !F.includes("+") && (F = F + "Z"), h = new Date(F);
|
|
111
|
+
} else
|
|
112
|
+
h = new Date(c);
|
|
113
|
+
l = isNaN(h.getTime()) ? parseFloat(c) : h.getTime(), x = ue(t, v);
|
|
114
|
+
} else {
|
|
115
|
+
const c = ue(t, v) || t;
|
|
116
|
+
l = typeof c == "string" ? parseFloat(c) : c, x = String(c);
|
|
117
|
+
}
|
|
118
|
+
const f = me(e[d]), $ = me(e[m]), B = e[u];
|
|
119
|
+
return {
|
|
120
|
+
x: l,
|
|
121
|
+
xLabel: x,
|
|
122
|
+
// Store formatted label for tooltip display
|
|
123
|
+
y: f,
|
|
124
|
+
// Type assertion: filter below ensures this is never null
|
|
125
|
+
size: $ !== null ? Math.abs($) : 0,
|
|
126
|
+
// Ensure positive size
|
|
127
|
+
color: n ? e[n] : B,
|
|
128
|
+
series: B,
|
|
129
|
+
label: `${B || "Unknown"}`,
|
|
130
|
+
isValid: ke(l) && f !== null && $ !== null && $ > 0
|
|
131
|
+
};
|
|
132
|
+
}).filter((e) => e.isValid && e.size > 0);
|
|
133
|
+
if (o.length === 0) return;
|
|
134
|
+
const R = {
|
|
135
|
+
...xe,
|
|
136
|
+
left: xe.left + 30,
|
|
137
|
+
// Add extra 30px left margin for Y-axis label
|
|
138
|
+
bottom: s.showLegend && n ? 100 : 40
|
|
139
|
+
// Add extra space for legend
|
|
140
|
+
}, L = k.width - R.left - R.right, z = k.height - R.top - R.bottom, le = D(U.current).attr("width", k.width).attr("height", k.height), T = le.append("g").attr("transform", `translate(${R.left},${R.top})`), I = fe().domain(ye(o, (e) => e.x)).range([0, L]).nice(), C = fe().domain(ye(o, (e) => e.y)).range([z, 0]).nice(), Z = Ye().domain([0, Re(o, (e) => e.size)]).range([s.minBubbleSize, s.maxBubbleSize]);
|
|
141
|
+
let V, O = !1, X = [];
|
|
142
|
+
if (n && o.length > 0) {
|
|
143
|
+
const e = o.map((t) => {
|
|
144
|
+
const l = t.color;
|
|
145
|
+
return typeof l == "string" ? parseFloat(l) : l;
|
|
146
|
+
}).filter((t) => !isNaN(t));
|
|
147
|
+
if (O = e.length === o.length && e.every((t) => typeof t == "number"), O) {
|
|
148
|
+
const t = Math.min(...e), l = Math.max(...e);
|
|
149
|
+
V = Ve().domain([t, l]).range(M?.gradient || he);
|
|
150
|
+
} else
|
|
151
|
+
X = [...new Set(o.map((t) => String(t.color)))], V = pe().domain(X).range(M?.colors || se);
|
|
152
|
+
} else
|
|
153
|
+
V = pe().domain(["default"]).range([se[0]]);
|
|
154
|
+
const Q = (e, t) => getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t, ie = re !== "light", A = ie ? Q("--dc-text-muted", "#cbd5e1") : Q("--dc-text-secondary", "#374151"), G = ie ? Q("--dc-border", "#475569") : "#9ca3af";
|
|
155
|
+
if (s.showGrid) {
|
|
156
|
+
const e = T.append("g").attr("class", "grid").attr("transform", `translate(0,${z})`).call(
|
|
157
|
+
ge(I).tickSize(-z).tickFormat(() => "")
|
|
158
|
+
);
|
|
159
|
+
e.selectAll("line").style("stroke", G).style("stroke-dasharray", "3,3").style("opacity", 0.3), e.select(".domain").style("stroke", "none");
|
|
160
|
+
const t = T.append("g").attr("class", "grid").call(
|
|
161
|
+
be(C).tickSize(-L).tickFormat(() => "")
|
|
162
|
+
);
|
|
163
|
+
t.selectAll("line").style("stroke", G).style("stroke-dasharray", "3,3").style("opacity", 0.3), t.select(".domain").style("stroke", "none");
|
|
164
|
+
}
|
|
165
|
+
const J = ge(I);
|
|
166
|
+
b ? J.tickFormat((e) => {
|
|
167
|
+
const t = new Date(e);
|
|
168
|
+
if (isNaN(t.getTime())) return String(e);
|
|
169
|
+
switch (v?.toLowerCase()) {
|
|
170
|
+
case "year":
|
|
171
|
+
return String(t.getUTCFullYear());
|
|
172
|
+
case "quarter": {
|
|
173
|
+
const l = Math.floor(t.getUTCMonth() / 3) + 1;
|
|
174
|
+
return `${t.getUTCFullYear()}-Q${l}`;
|
|
175
|
+
}
|
|
176
|
+
case "month":
|
|
177
|
+
return `${t.getUTCFullYear()}-${String(t.getUTCMonth() + 1).padStart(2, "0")}`;
|
|
178
|
+
case "week":
|
|
179
|
+
case "day":
|
|
180
|
+
return `${t.getUTCFullYear()}-${String(t.getUTCMonth() + 1).padStart(2, "0")}-${String(t.getUTCDate()).padStart(2, "0")}`;
|
|
181
|
+
case "hour":
|
|
182
|
+
return `${String(t.getUTCMonth() + 1).padStart(2, "0")}-${String(t.getUTCDate()).padStart(2, "0")} ${String(t.getUTCHours()).padStart(2, "0")}:00`;
|
|
183
|
+
default:
|
|
184
|
+
return `${t.getUTCFullYear()}-${String(t.getUTCMonth() + 1).padStart(2, "0")}`;
|
|
185
|
+
}
|
|
186
|
+
}) : s.xAxisFormat && J.tickFormat((e) => N(e, s.xAxisFormat));
|
|
187
|
+
const K = T.append("g").attr("transform", `translate(0,${z})`).call(J);
|
|
188
|
+
K.selectAll("text").style("fill", A), K.selectAll("line, path").style("stroke", G), K.append("text").attr("x", L / 2).attr("y", 35).attr("fill", A).style("text-anchor", "middle").style("font-size", "12px").text(s.xAxisFormat?.label || g(a));
|
|
189
|
+
const ae = be(C);
|
|
190
|
+
s.leftYAxisFormat && ae.tickFormat((e) => N(e, s.leftYAxisFormat));
|
|
191
|
+
const P = T.append("g").call(ae);
|
|
192
|
+
P.selectAll("text").style("fill", A), P.selectAll("line, path").style("stroke", G), P.append("text").attr("transform", "rotate(-90)").attr("y", -35).attr("x", -z / 2).attr("fill", A).style("text-anchor", "middle").style("font-size", "12px").text(s.leftYAxisFormat?.label || g(d));
|
|
193
|
+
const _ = D("body").append("div").attr("class", "bubble-chart-tooltip").style("position", "absolute").style("padding", "8px").style("background", "rgba(0, 0, 0, 0.8)").style("color", "white").style("border-radius", "4px").style("font-size", "12px").style("pointer-events", "none").style("opacity", 0).style("z-index", 1e3), ee = T.selectAll(".bubble").data(o).enter().append("circle").attr("class", "bubble").attr("cx", (e) => I(e.x)).attr("cy", (e) => C(e.y)).attr("r", (e) => Z(e.size)).style("fill", (e) => n && e.color !== void 0 ? V(O ? e.color : String(e.color)) : se[0]).style("opacity", s.bubbleOpacity).style("stroke", "#fff").style("stroke-width", 1).style("cursor", "pointer");
|
|
194
|
+
if (s.showTooltip && ee.on("mouseover", function(e, t) {
|
|
195
|
+
D(this).transition().duration(200).style("opacity", 1).attr("r", Z(t.size) * 1.1);
|
|
196
|
+
const l = [
|
|
197
|
+
`<strong>${t.series || "Unknown"}</strong>`,
|
|
198
|
+
`${g(a)}: ${t.xLabel || (s.xAxisFormat ? N(t.x, s.xAxisFormat) : t.x)}`,
|
|
199
|
+
`${g(d)}: ${s.leftYAxisFormat ? N(t.y, s.leftYAxisFormat) : t.y}`,
|
|
200
|
+
`${g(m)}: ${s.leftYAxisFormat ? N(t.size, s.leftYAxisFormat) : t.size}`,
|
|
201
|
+
n && t.color ? `${g(n)}: ${t.color}` : ""
|
|
202
|
+
].filter(Boolean).join("<br>");
|
|
203
|
+
_.html(l).style("left", e.pageX + 10 + "px").style("top", e.pageY - 10 + "px").transition().duration(200).style("opacity", 1);
|
|
204
|
+
}).on("mousemove", function(e) {
|
|
205
|
+
_.style("left", e.pageX + 10 + "px").style("top", e.pageY - 10 + "px");
|
|
206
|
+
}).on("mouseout", function(e, t) {
|
|
207
|
+
D(this).transition().duration(200).style("opacity", s.bubbleOpacity).attr("r", Z(t.size)), _.transition().duration(200).style("opacity", 0);
|
|
208
|
+
}), s.showLegend && n)
|
|
209
|
+
if (O) {
|
|
210
|
+
const l = Math.min(...o.map((h) => h.color)), x = Math.max(...o.map((h) => h.color)), f = T.append("g").attr("class", "color-legend").attr("transform", `translate(${L / 2 - 200 / 2}, ${z + 60})`), B = le.append("defs").append("linearGradient").attr("id", "color-scale-gradient").attr("x1", "0%").attr("y1", "0%").attr("x2", "100%").attr("y2", "0%"), c = M?.gradient || he;
|
|
211
|
+
c.forEach((h, F) => {
|
|
212
|
+
B.append("stop").attr("offset", `${F / (c.length - 1) * 100}%`).attr("stop-color", h);
|
|
213
|
+
}), f.append("rect").attr("width", 200).attr("height", 20).style("fill", "url(#color-scale-gradient)").style("stroke", "#ccc").style("stroke-width", 1), f.append("text").attr("x", 0).attr("y", 35).attr("text-anchor", "start").style("font-size", "11px").style("fill", A).text(s.leftYAxisFormat ? N(l, s.leftYAxisFormat) : l.toFixed(2)), f.append("text").attr("x", 200).attr("y", 35).attr("text-anchor", "end").style("font-size", "11px").style("fill", A).text(s.leftYAxisFormat ? N(x, s.leftYAxisFormat) : x.toFixed(2)), f.append("text").attr("x", 200 / 2).attr("y", -5).attr("text-anchor", "middle").style("font-size", "12px").style("font-weight", "bold").style("fill", A).text(g(n));
|
|
214
|
+
} else {
|
|
215
|
+
const e = X;
|
|
216
|
+
if (e.length > 0) {
|
|
217
|
+
const l = T.append("g").attr("class", "legend").attr("transform", `translate(${L / 2 - e.length * 80 / 2}, ${z + 60})`).selectAll(".legend-item").data(e).enter().append("g").attr("class", "legend-item").attr("transform", (x, f) => `translate(${f * 80}, 0)`).style("cursor", "pointer");
|
|
218
|
+
l.append("circle").attr("cx", 5).attr("cy", 5).attr("r", 5).style("fill", (x) => V(x)).style("opacity", s.bubbleOpacity), l.append("text").attr("x", 15).attr("y", 5).attr("dy", ".35em").style("font-size", "11px").style("fill", A).text((x) => String(x)), l.on("mouseover", function(x, f) {
|
|
219
|
+
ee.transition().duration(200).style("opacity", ($) => n && String($.color) === f ? 1 : 0.2);
|
|
220
|
+
}).on("mouseout", function() {
|
|
221
|
+
ee.transition().duration(200).style("opacity", s.bubbleOpacity);
|
|
222
|
+
});
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
return () => {
|
|
226
|
+
_.remove();
|
|
227
|
+
};
|
|
228
|
+
}, [p, r, s, E, k, Y, M, re, g]), !p || p.length === 0 ? /* @__PURE__ */ y("div", { className: "flex items-center justify-center w-full text-dc-text-muted", style: { height: q }, children: /* @__PURE__ */ te("div", { className: "text-center", children: [
|
|
229
|
+
/* @__PURE__ */ y("div", { className: "text-sm font-semibold mb-1", children: "No data available" }),
|
|
230
|
+
/* @__PURE__ */ y("div", { className: "text-xs text-dc-text-secondary", children: "No data points to display in bubble chart" })
|
|
231
|
+
] }) }) : r?.xAxis && r?.yAxis && r?.series ? /* @__PURE__ */ y("div", { className: "w-full flex-1 flex flex-col relative", style: { height: q, minHeight: "250px", overflow: "hidden" }, children: /* @__PURE__ */ te("div", { ref: S, className: "w-full h-full relative", children: [
|
|
232
|
+
/* @__PURE__ */ y("svg", { ref: U, className: "w-full h-full" }),
|
|
233
|
+
!Y && /* @__PURE__ */ y("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ y("div", { className: "text-dc-text-muted text-sm", children: "Measuring chart dimensions..." }) })
|
|
234
|
+
] }) }) : /* @__PURE__ */ y("div", { className: "flex items-center justify-center w-full text-dc-warning", style: { height: q }, children: /* @__PURE__ */ te("div", { className: "text-center", children: [
|
|
235
|
+
/* @__PURE__ */ y("div", { className: "text-sm font-semibold mb-1", children: "Configuration Required" }),
|
|
236
|
+
/* @__PURE__ */ y("div", { className: "text-xs", children: "Bubble chart requires xAxis, yAxis, series, and sizeField dimensions" }),
|
|
237
|
+
/* @__PURE__ */ y("div", { className: "text-xs mt-1", children: "Optional: colorField for bubble coloring" })
|
|
238
|
+
] }) });
|
|
239
|
+
}), Ge = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
240
|
+
__proto__: null,
|
|
241
|
+
default: Le
|
|
242
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
243
|
+
export {
|
|
244
|
+
Ge as B,
|
|
245
|
+
Be as u
|
|
246
|
+
};
|
|
247
|
+
//# sourceMappingURL=chart-bubblechart-DaFSD3dc.js.map
|