@object-ui/plugin-charts 4.0.4 → 4.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@object-ui/plugin-charts",
-  "version": "4.0.4",
+  "version": "4.0.5",
   "type": "module",
   "license": "MIT",
   "description": "Chart components plugin for Object UI, powered by Recharts",
@@ -26,11 +26,11 @@
   "dependencies": {
     "lucide-react": "^1.14.0",
     "recharts": "^3.8.1",
-    "@object-ui/components": "4.0.4",
-    "@object-ui/core": "4.0.4",
-    "@object-ui/i18n": "4.0.4",
-    "@object-ui/react": "4.0.4",
-    "@object-ui/types": "4.0.4"
+    "@object-ui/components": "4.0.5",
+    "@object-ui/core": "4.0.5",
+    "@object-ui/i18n": "4.0.5",
+    "@object-ui/react": "4.0.5",
+    "@object-ui/types": "4.0.5"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",

package/dist/AdvancedChartImpl-DkX8ZQ5Y.js

@@ -1,412 +0,0 @@
-import * as e from "react";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Area as i, AreaChart as a, Bar as o, BarChart as s, CartesianGrid as c, Cell as l, Legend as u, Line as d, LineChart as f, Pie as p, PieChart as m, PolarAngleAxis as h, PolarGrid as g, PolarRadiusAxis as _, Radar as v, RadarChart as y, ResponsiveContainer as b, Scatter as x, ScatterChart as S, Tooltip as C, XAxis as w, YAxis as T, ZAxis as E } from "recharts";
-//#region src/ChartContainerImpl.tsx
-var D = (...e) => e.filter(Boolean).join(" "), O = {
-	light: "",
-	dark: ".dark"
-}, k = e.createContext(null);
-function A() {
-	let t = e.useContext(k);
-	if (!t) throw Error("useChart must be used within a <ChartContainer />");
-	return t;
-}
-function j({ id: t, className: i, children: a, config: o, ...s }) {
-	let c = e.useId(), l = `chart-${t || c.replace(/:/g, "")}`;
-	return /* @__PURE__ */ n(k.Provider, {
-		value: { config: o },
-		children: /* @__PURE__ */ r("div", {
-			"data-slot": "chart",
-			"data-chart": l,
-			className: D("flex w-full h-[350px] justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground", i),
-			...s,
-			children: [/* @__PURE__ */ n(M, {
-				id: l,
-				config: o
-			}), /* @__PURE__ */ n(b, {
-				width: "100%",
-				height: "100%",
-				children: a
-			})]
-		})
-	});
-}
-var M = ({ id: e, config: t }) => {
-	let r = Object.entries(t).filter(([, e]) => e.theme || e.color);
-	return r.length ? /* @__PURE__ */ n("style", { dangerouslySetInnerHTML: { __html: Object.entries(O).map(([t, n]) => `
-${n} [data-chart=${e}] {
-${r.map(([e, n]) => {
-		let r = n.theme?.[t] || n.color;
-		return r ? `  --color-${e}: ${r};` : null;
-	}).join("\n")}
-}
-`).join("\n") } }) : null;
-}, N = C;
-function P({ active: i, payload: a, className: o, indicator: s = "dot", hideLabel: c = !1, hideIndicator: l = !1, label: u, labelFormatter: d, labelClassName: f, formatter: p, color: m, nameKey: h, labelKey: g }) {
-	let { config: _ } = A(), v = e.useMemo(() => {
-		if (c || !a?.length) return null;
-		let [e] = a, t = L(_, e, `${g || e?.dataKey || e?.name || "value"}`), r = !g && typeof u == "string" ? _[u]?.label || u : t?.label;
-		return d ? /* @__PURE__ */ n("div", {
-			className: D("font-medium", f),
-			children: d(r, a)
-		}) : r ? /* @__PURE__ */ n("div", {
-			className: D("font-medium", f),
-			children: r
-		}) : null;
-	}, [
-		u,
-		d,
-		a,
-		c,
-		f,
-		_,
-		g
-	]);
-	if (!i || !a?.length) return null;
-	let y = a.length === 1 && s !== "dot";
-	return /* @__PURE__ */ r("div", {
-		className: D("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", o),
-		children: [y ? null : v, /* @__PURE__ */ n("div", {
-			className: "grid gap-1.5",
-			children: a.filter((e) => e.type !== "none").map((e, i) => {
-				let a = L(_, e, `${h || e.name || e.dataKey || "value"}`), o = m || e.payload.fill || e.color;
-				return /* @__PURE__ */ n("div", {
-					className: D("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", s === "dot" ? "items-center" : ""),
-					children: p && e?.value !== void 0 && e.name ? p(e.value, e.name, e, i, e.payload) : /* @__PURE__ */ r(t, { children: [a?.icon ? /* @__PURE__ */ n(a.icon, {}) : !l && /* @__PURE__ */ n("div", {
-						className: D("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", s === "dot" ? "h-2.5 w-2.5" : "", s === "line" ? "w-1" : "", s === "dashed" ? "w-0 border-[1.5px] border-dashed bg-transparent" : "", y && s === "dashed" ? "my-0.5" : ""),
-						style: {
-							"--color-bg": o,
-							"--color-border": o
-						}
-					}), /* @__PURE__ */ r("div", {
-						className: D("flex flex-1 justify-between leading-none", y ? "items-end" : "items-center"),
-						children: [/* @__PURE__ */ r("div", {
-							className: "grid gap-1.5",
-							children: [y ? v : null, /* @__PURE__ */ n("span", {
-								className: "text-muted-foreground",
-								children: a?.label || e.name
-							})]
-						}), e.value && /* @__PURE__ */ n("span", {
-							className: "text-foreground font-mono font-medium tabular-nums",
-							children: e.value.toLocaleString()
-						})]
-					})] })
-				}, e.dataKey);
-			})
-		})]
-	});
-}
-var F = u;
-function I({ className: e, hideIcon: t = !1, payload: i, verticalAlign: a = "bottom", nameKey: o }) {
-	let { config: s } = A();
-	return i?.length ? /* @__PURE__ */ n("div", {
-		className: D("flex items-center justify-center gap-4", a === "top" ? "pb-3" : "pt-3", e),
-		children: i.filter((e) => e.type !== "none").map((e) => {
-			let i = L(s, e, `${o || e.dataKey || "value"}`);
-			return /* @__PURE__ */ r("div", {
-				className: D("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"),
-				children: [i?.icon && !t ? /* @__PURE__ */ n(i.icon, {}) : /* @__PURE__ */ n("div", {
-					className: "h-2 w-2 shrink-0 rounded-[2px]",
-					style: { backgroundColor: e.color }
-				}), i?.label]
-			}, e.value);
-		})
-	}) : null;
-}
-function L(e, t, n) {
-	if (typeof t != "object" || !t) return;
-	let r = "payload" in t && typeof t.payload == "object" && t.payload !== null ? t.payload : void 0, i = n;
-	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];
-}
-//#endregion
-//#region src/AdvancedChartImpl.tsx
-var R = "hsl(var(--primary))", z = {
-	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"
-}, B = (e) => z[e] || e;
-function V({ chartType: t = "bar", data: u = [], config: b = {}, xAxisKey: C = "name", series: D = [], className: O = "" }) {
-	let k = Array.isArray(u) ? u : [], [A, M] = e.useState(!1);
-	e.useEffect(() => {
-		let e = () => M(window.innerWidth < 640);
-		return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
-	}, []);
-	let L = {
-		bar: s,
-		line: f,
-		area: a,
-		pie: m,
-		donut: m,
-		radar: y,
-		scatter: S,
-		combo: s
-	}[t] || s, z = e.useMemo(() => k.some((e) => String(e[C] || "").length > 5), [k, C]), V = () => [
-		"hsl(var(--chart-1))",
-		"hsl(var(--chart-2))",
-		"hsl(var(--chart-3))",
-		"hsl(var(--chart-4))",
-		"hsl(var(--chart-5))"
-	];
-	if (t === "pie" || t === "donut") {
-		let e = t === "donut" ? 60 : 0;
-		return /* @__PURE__ */ n(j, {
-			config: b,
-			className: O,
-			children: /* @__PURE__ */ r(m, { children: [
-				/* @__PURE__ */ n(N, {
-					cursor: !1,
-					content: /* @__PURE__ */ n(P, { hideLabel: !0 })
-				}),
-				/* @__PURE__ */ n(p, {
-					data: k,
-					dataKey: D[0]?.dataKey || "value",
-					nameKey: C || "name",
-					innerRadius: e,
-					strokeWidth: 5,
-					paddingAngle: 2,
-					outerRadius: 80,
-					children: k.map((e, t) => {
-						let r = b[e[C]]?.color;
-						if (!r) {
-							let e = V();
-							r = e[t % e.length];
-						}
-						return /* @__PURE__ */ n(l, { fill: B(r) }, `cell-${t}`);
-					})
-				}),
-				/* @__PURE__ */ n(F, {
-					content: /* @__PURE__ */ n(I, { nameKey: C }),
-					...A && {
-						verticalAlign: "bottom",
-						wrapperStyle: {
-							fontSize: "11px",
-							paddingTop: "8px"
-						}
-					}
-				})
-			] })
-		});
-	}
-	return t === "radar" ? /* @__PURE__ */ n(j, {
-		config: b,
-		className: O,
-		children: /* @__PURE__ */ r(y, {
-			data: k,
-			children: [
-				/* @__PURE__ */ n(g, {}),
-				/* @__PURE__ */ n(h, { dataKey: C }),
-				/* @__PURE__ */ n(_, {}),
-				/* @__PURE__ */ n(N, { content: /* @__PURE__ */ n(P, {}) }),
-				/* @__PURE__ */ n(F, {
-					content: /* @__PURE__ */ n(I, {}),
-					...A && {
-						verticalAlign: "bottom",
-						wrapperStyle: {
-							fontSize: "11px",
-							paddingTop: "8px"
-						}
-					}
-				}),
-				D.map((e) => {
-					let t = B(b[e.dataKey]?.color || R);
-					return /* @__PURE__ */ n(v, {
-						dataKey: e.dataKey,
-						stroke: t,
-						fill: t,
-						fillOpacity: .6
-					}, e.dataKey);
-				})
-			]
-		})
-	}) : t === "scatter" ? /* @__PURE__ */ n(j, {
-		config: b,
-		className: O,
-		children: /* @__PURE__ */ r(S, { children: [
-			/* @__PURE__ */ n(c, { vertical: !1 }),
-			/* @__PURE__ */ n(w, {
-				type: "number",
-				dataKey: C,
-				name: String(b[C]?.label || C),
-				tickLine: !1,
-				axisLine: !1,
-				interval: A ? Math.ceil(k.length / 5) : 0
-			}),
-			/* @__PURE__ */ n(T, {
-				type: "number",
-				dataKey: D[0]?.dataKey || "value",
-				name: String(b[D[0]?.dataKey]?.label || D[0]?.dataKey),
-				tickLine: !1,
-				axisLine: !1
-			}),
-			/* @__PURE__ */ n(E, {
-				type: "number",
-				range: [60, 400]
-			}),
-			/* @__PURE__ */ n(N, { content: /* @__PURE__ */ n(P, {}) }),
-			/* @__PURE__ */ n(F, {
-				content: /* @__PURE__ */ n(I, {}),
-				...A && {
-					verticalAlign: "bottom",
-					wrapperStyle: {
-						fontSize: "11px",
-						paddingTop: "8px"
-					}
-				}
-			}),
-			D.map((e, t) => {
-				let r = V(), i = B(b[e.dataKey]?.color || r[t % r.length]);
-				return /* @__PURE__ */ n(x, {
-					name: b[e.dataKey]?.label || e.dataKey,
-					data: k,
-					fill: i
-				}, e.dataKey);
-			})
-		] })
-	}) : t === "combo" ? /* @__PURE__ */ n(j, {
-		config: b,
-		className: O,
-		children: /* @__PURE__ */ r(s, {
-			data: k,
-			children: [
-				/* @__PURE__ */ n(c, { vertical: !1 }),
-				/* @__PURE__ */ n(w, {
-					dataKey: C,
-					tickLine: !1,
-					tickMargin: 10,
-					axisLine: !1,
-					interval: A ? Math.ceil(k.length / 5) : 0,
-					tickFormatter: (e) => !e || typeof e != "string" ? e : A && e.length > 8 ? e.slice(0, 8) + "…" : e,
-					...!A && z && {
-						angle: -35,
-						textAnchor: "end",
-						height: 60
-					}
-				}),
-				/* @__PURE__ */ n(T, {
-					yAxisId: "left",
-					tickLine: !1,
-					axisLine: !1
-				}),
-				/* @__PURE__ */ n(T, {
-					yAxisId: "right",
-					orientation: "right",
-					tickLine: !1,
-					axisLine: !1
-				}),
-				/* @__PURE__ */ n(N, { content: /* @__PURE__ */ n(P, {}) }),
-				/* @__PURE__ */ n(F, {
-					content: /* @__PURE__ */ n(I, {}),
-					...A && {
-						verticalAlign: "bottom",
-						wrapperStyle: {
-							fontSize: "11px",
-							paddingTop: "8px"
-						}
-					}
-				}),
-				D.map((e, t) => {
-					let r = B(b[e.dataKey]?.color || R), a = e.chartType || (t === 0 ? "bar" : "line"), s = a === "bar" ? "left" : "right";
-					return a === "line" ? /* @__PURE__ */ n(d, {
-						yAxisId: s,
-						type: "monotone",
-						dataKey: e.dataKey,
-						stroke: r,
-						strokeWidth: 2,
-						dot: !1
-					}, e.dataKey) : a === "area" ? /* @__PURE__ */ n(i, {
-						yAxisId: s,
-						type: "monotone",
-						dataKey: e.dataKey,
-						fill: r,
-						stroke: r,
-						fillOpacity: .4
-					}, e.dataKey) : /* @__PURE__ */ n(o, {
-						yAxisId: s,
-						dataKey: e.dataKey,
-						fill: r,
-						radius: 4
-					}, e.dataKey);
-				})
-			]
-		})
-	}) : /* @__PURE__ */ n(j, {
-		config: b,
-		className: O,
-		children: /* @__PURE__ */ r(L, {
-			data: k,
-			children: [
-				/* @__PURE__ */ n(c, { vertical: !1 }),
-				/* @__PURE__ */ n(w, {
-					dataKey: C,
-					tickLine: !1,
-					tickMargin: 10,
-					axisLine: !1,
-					interval: A ? Math.ceil(k.length / 5) : 0,
-					tickFormatter: (e) => !e || typeof e != "string" ? e : A && e.length > 8 ? e.slice(0, 8) + "…" : e,
-					...!A && z && {
-						angle: -35,
-						textAnchor: "end",
-						height: 60
-					}
-				}),
-				/* @__PURE__ */ n(N, { content: /* @__PURE__ */ n(P, {}) }),
-				/* @__PURE__ */ n(F, {
-					content: /* @__PURE__ */ n(I, {}),
-					...A && {
-						verticalAlign: "bottom",
-						wrapperStyle: {
-							fontSize: "11px",
-							paddingTop: "8px"
-						}
-					}
-				}),
-				D.map((e, r) => {
-					let a = V(), s = B(b[e.dataKey]?.color || a[r % a.length] || R);
-					if (t === "bar") {
-						let t = D.length === 1 && k.length > 1;
-						return /* @__PURE__ */ n(o, {
-							dataKey: e.dataKey,
-							fill: s,
-							radius: 4,
-							children: t && k.map((e, t) => /* @__PURE__ */ n(l, { fill: B(a[t % a.length]) }, `cell-${t}`))
-						}, e.dataKey);
-					}
-					return t === "line" ? /* @__PURE__ */ n(d, {
-						type: "monotone",
-						dataKey: e.dataKey,
-						stroke: s,
-						strokeWidth: 2,
-						dot: !1
-					}, e.dataKey) : t === "area" ? /* @__PURE__ */ n(i, {
-						type: "monotone",
-						dataKey: e.dataKey,
-						fill: s,
-						stroke: s,
-						fillOpacity: .4
-					}, e.dataKey) : null;
-				})
-			]
-		})
-	});
-}
-//#endregion
-export { V as default };

package/dist/ChartImpl-ZGY2c86F.js

@@ -1,133 +0,0 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { Bar as n, BarChart as r, CartesianGrid as i, Legend as a, ResponsiveContainer as o, Tooltip as s, XAxis as c, YAxis as l } from "recharts";
-//#region src/ChartImpl.tsx
-function u({ data: u = [], dataKey: d = "value", xAxisKey: f = "name", height: p = 400, className: m = "", color: h = "hsl(var(--primary))" }) {
-	return /* @__PURE__ */ e("div", {
-		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 ${m}`,
-		children: /* @__PURE__ */ e(o, {
-			width: "100%",
-			height: p,
-			children: /* @__PURE__ */ t(r, {
-				data: u,
-				margin: {
-					top: 10,
-					right: 10,
-					left: 10,
-					bottom: 5
-				},
-				children: [
-					/* @__PURE__ */ t("defs", { children: [/* @__PURE__ */ t("linearGradient", {
-						id: "barGradient",
-						x1: "0",
-						y1: "0",
-						x2: "0",
-						y2: "1",
-						children: [
-							/* @__PURE__ */ e("stop", {
-								offset: "0%",
-								stopColor: h,
-								stopOpacity: 1
-							}),
-							/* @__PURE__ */ e("stop", {
-								offset: "90%",
-								stopColor: h,
-								stopOpacity: .6
-							}),
-							/* @__PURE__ */ e("stop", {
-								offset: "100%",
-								stopColor: h,
-								stopOpacity: .3
-							})
-						]
-					}), /* @__PURE__ */ t("filter", {
-						id: "glow",
-						height: "130%",
-						children: [
-							/* @__PURE__ */ e("feGaussianBlur", {
-								in: "SourceAlpha",
-								stdDeviation: "3",
-								result: "blur"
-							}),
-							/* @__PURE__ */ e("feOffset", {
-								in: "blur",
-								dx: "0",
-								dy: "0",
-								result: "offsetBlur"
-							}),
-							/* @__PURE__ */ e("feFlood", {
-								floodColor: h,
-								floodOpacity: "0.5",
-								result: "offsetColor"
-							}),
-							/* @__PURE__ */ e("feComposite", {
-								in: "offsetColor",
-								in2: "offsetBlur",
-								operator: "in",
-								result: "offsetBlur"
-							}),
-							/* @__PURE__ */ t("feMerge", { children: [/* @__PURE__ */ e("feMergeNode", { in: "offsetBlur" }), /* @__PURE__ */ e("feMergeNode", { in: "SourceGraphic" })] })
-						]
-					})] }),
-					/* @__PURE__ */ e(i, {
-						strokeDasharray: "3 3",
-						stroke: "hsl(var(--border))",
-						vertical: !1
-					}),
-					/* @__PURE__ */ e(c, {
-						dataKey: f,
-						tick: {
-							fill: "hsl(var(--muted-foreground))",
-							fontSize: 12,
-							fontFamily: "monospace"
-						},
-						tickLine: !1,
-						axisLine: { stroke: "hsl(var(--border))" },
-						dy: 10
-					}),
-					/* @__PURE__ */ e(l, {
-						tick: {
-							fill: "hsl(var(--muted-foreground))",
-							fontSize: 12,
-							fontFamily: "monospace"
-						},
-						tickLine: !1,
-						axisLine: !1
-					}),
-					/* @__PURE__ */ e(s, {
-						cursor: {
-							fill: "hsl(var(--muted))",
-							opacity: .2
-						},
-						contentStyle: {
-							backgroundColor: "hsl(var(--popover))",
-							borderColor: "hsl(var(--border))",
-							color: "hsl(var(--popover-foreground))",
-							borderRadius: "8px",
-							fontFamily: "monospace",
-							boxShadow: "0 4px 6px -1px rgb(0 0 0 / 0.1)"
-						},
-						itemStyle: { color: "hsl(var(--primary))" }
-					}),
-					/* @__PURE__ */ e(a, { wrapperStyle: {
-						paddingTop: "20px",
-						fontFamily: "monospace"
-					} }),
-					/* @__PURE__ */ e(n, {
-						dataKey: d,
-						fill: "url(#barGradient)",
-						radius: [
-							4,
-							4,
-							0,
-							0
-						],
-						filter: "url(#glow)",
-						animationDuration: 1500
-					})
-				]
-			})
-		})
-	});
-}
-//#endregion
-export { u as default };