@object-ui/plugin-dashboard 4.0.11 → 4.2.1

package/dist/index.js

@@ -2,9 +2,9 @@ import { ComponentRegistry as e, computeDrillFilter as t, extractRecords as n, i
 import { SchemaRenderer as o, SchemaRendererContext as s, useActionEngine as c, useDataScope as l, useDnd as u, useHasDndProvider as d, useObjectLabel as f } from "@object-ui/react";
 import { Button as p, Card as m, CardContent as h, CardHeader as g, CardTitle as _, Combobox as v, ConfigPanelRenderer as y, ConfigRow as b, Dialog as x, DialogContent as S, DialogHeader as C, DialogTitle as w, Sheet as T, SheetContent as E, SheetHeader as D, SheetTitle as O, Skeleton as k, cn as A, getLazyIcon as j, useConfigDraft as M } from "@object-ui/components";
 import * as N from "react";
-import { Fragment as ee, forwardRef as P, useCallback as F, useContext as te, useEffect as I, useMemo as L, useRef as ne, useState as R } from "react";
-import { AlertCircle as z, ArrowDownIcon as re, ArrowUpIcon as B, Edit as V, GripVertical as H, Loader2 as U, MinusIcon as W, RefreshCw as ie, Save as ae, Settings as G, X as oe } from "lucide-react";
-import { DndContext as se, PointerSensor as ce, closestCenter as K, useSensor as le, useSensors as ue } from "@dnd-kit/core";
+import { Fragment as ee, forwardRef as te, useCallback as P, useContext as ne, useEffect as F, useMemo as I, useRef as re, useState as L } from "react";
+import { AlertCircle as R, ArrowDownIcon as z, ArrowUpIcon as ie, Edit as B, GripVertical as V, Loader2 as ae, MinusIcon as H, RefreshCw as oe, Save as se, Settings as U, X as W } from "lucide-react";
+import { DndContext as ce, PointerSensor as G, closestCenter as K, useSensor as le, useSensors as ue } from "@dnd-kit/core";
 import { SortableContext as de, arrayMove as fe, rectSortingStrategy as pe, useSortable as me, verticalListSortingStrategy as he } from "@dnd-kit/sortable";
 import { CSS as q } from "@dnd-kit/utilities";
 import { Fragment as J, jsx as Y, jsxs as X } from "react/jsx-runtime";
@@ -65,7 +65,7 @@ var Oe = [
 function Ae(e) {
 	return ke.has(e) ? { enabled: !0 } : void 0;
 }
-var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount: i, userActions: a, designMode: s, selectedWidgetId: l, onWidgetClick: u, onWidgetsReorder: d, modalHandler: v, scriptHandlers: y, hideHeaderText: b, ...x }, S) => {
+var $ = te(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount: i, userActions: a, designMode: s, selectedWidgetId: l, onWidgetClick: u, onWidgetsReorder: d, modalHandler: v, scriptHandlers: y, hideHeaderText: b, ...x }, S) => {
 	let C = (() => {
 		if (e.columns != null) return e.columns;
 		let t = e.widgets ?? [], n = 0;
@@ -74,44 +74,44 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 			t > n && (n = t), (e.layout?.w ?? 0) > n && (n = e.layout.w);
 		}
 		return n > 4 ? 12 : 4;
-	})(), w = C, T = e.gap || 4, [E, D] = R(!1), [O, k] = R(!1), j = ne(null), { executeAction: M, engine: N } = c({ actions: L(() => (e.header?.actions ?? []).map((e) => ({
+	})(), w = C, T = e.gap || 4, [E, D] = L(!1), [O, k] = L(!1), j = re(null), { executeAction: M, engine: N } = c({ actions: I(() => (e.header?.actions ?? []).map((e) => ({
 		name: e.actionUrl || e.label,
 		type: e.actionType || "url",
 		target: e.actionUrl,
 		label: e.label
-	})), [e.header?.actions]) }), { dashboardLabel: P, dashboardDescription: te, dashboardActionLabel: z, widgetTitle: re, widgetDescription: B, fieldLabel: V } = f(), H = e.name, U = F((e) => H ? z(H, e.actionUrl || e.label, e.label) : e.label, [H, z]), W = F((e) => {
+	})), [e.header?.actions]) }), { dashboardLabel: te, dashboardDescription: ne, dashboardActionLabel: R, widgetTitle: z, widgetDescription: ie, fieldLabel: B } = f(), V = e.name, ae = P((e) => V ? R(V, e.actionUrl || e.label, e.label) : e.label, [V, R]), H = P((e) => {
 		let t = Q(e.title);
-		return !H || !e.id || t === void 0 ? t : re(H, e.id, t);
-	}, [H, re]), ae = F((e) => {
+		return !V || !e.id || t === void 0 ? t : z(V, e.id, t);
+	}, [V, z]), se = P((e) => {
 		let t = Q(e.description);
-		return !H || !e.id ? t : B(H, e.id, t);
-	}, [H, B]);
-	I(() => {
+		return !V || !e.id ? t : ie(V, e.id, t);
+	}, [V, ie]);
+	F(() => {
 		let e = N.getRunner();
 		if (v && e.setModalHandler(v), y) for (let [t, n] of Object.entries(y)) e.registerScript(t, n);
 	}, [
 		N,
 		v,
 		y
-	]), I(() => {
+	]), F(() => {
 		let e = () => k(window.innerWidth < 768);
 		return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
 	}, []);
-	let G = F(() => {
+	let U = P(() => {
 		r && (D(!0), r(), setTimeout(() => D(!1), 600));
 	}, [r]);
-	I(() => {
-		if (!(!e.refreshInterval || e.refreshInterval <= 0 || !r)) return j.current = setInterval(G, e.refreshInterval * 1e3), () => {
+	F(() => {
+		if (!(!e.refreshInterval || e.refreshInterval <= 0 || !r)) return j.current = setInterval(U, e.refreshInterval * 1e3), () => {
 			j.current && clearInterval(j.current);
 		};
 	}, [
 		e.refreshInterval,
 		r,
-		G
+		U
 	]);
-	let oe = F((e, t) => {
+	let W = P((e, t) => {
 		!s || !u || !t || (e.stopPropagation(), u(t));
-	}, [s, u]), me = F((t, n, r) => {
+	}, [s, u]), me = P((t, n, r) => {
 		if (!s || !u) return;
 		let i = e.widgets || [];
 		if (t.key === "Enter" || t.key === " ") t.preventDefault(), u(n ?? null);
@@ -128,9 +128,9 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 		s,
 		u,
 		e.widgets
-	]), q = F((e) => {
+	]), q = P((e) => {
 		!s || !u || e.target === e.currentTarget && u(null);
-	}, [s, u]), J = !!(s && d), ge = ue(le(ce, { activationConstraint: { distance: 5 } })), _e = F((t) => {
+	}, [s, u]), J = !!(s && d), ge = ue(le(G, { activationConstraint: { distance: 5 } })), _e = P((t) => {
 		if (!J) return;
 		let { active: n, over: r } = t;
 		if (!r || n.id === r.id) return;
@@ -162,7 +162,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 					objectName: e.object || (Z(t) ? t.object : void 0),
 					aggregate: r,
 					filter: (Z(t) ? t.filter : void 0) || e.filter,
-					label: n.label || W(e) || "",
+					label: n.label || H(e) || "",
 					fallbackValue: n.value,
 					trend: n.trend,
 					icon: n.icon,
@@ -173,7 +173,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 					prefix: n.prefix,
 					suffix: n.suffix,
 					drillDown: n.drillDown ?? { enabled: !0 },
-					title: n.label || W(e) || ""
+					title: n.label || H(e) || ""
 				};
 			}
 			if ((t === "gauge" || t === "solid-gauge") && e.object) {
@@ -187,10 +187,16 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 					objectName: e.object,
 					aggregate: t,
 					filter: e.filter,
-					label: n.label || W(e) || "",
+					label: n.label || H(e) || "",
 					fallbackValue: n.fallbackValue ?? n.value,
 					icon: n.icon,
-					description: n.description
+					description: n.description,
+					colorVariant: e.colorVariant,
+					format: n.format,
+					currency: n.currency,
+					prefix: n.prefix,
+					suffix: n.suffix,
+					invert: n.invert
 				};
 			}
 			let r = {}[t] || t;
@@ -210,7 +216,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 						xAxisKey: i,
 						series: [{
 							dataKey: c,
-							label: l ? V(l, c, c) : c
+							label: l ? B(l, c, c) : c
 						}],
 						colors: Oe,
 						drillDown: n.drillDown ?? Ae(r),
@@ -231,7 +237,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 						xAxisKey: i,
 						series: [{
 							dataKey: a,
-							label: V(e.object, a, a)
+							label: B(e.object, a, a)
 						}],
 						colors: Oe,
 						drillDown: n.drillDown ?? Ae(r),
@@ -245,7 +251,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 					xAxisKey: i,
 					series: [{
 						dataKey: a,
-						label: e.object ? V(e.object, a, a) : a
+						label: e.object ? B(e.object, a, a) : a
 					}],
 					colors: Oe,
 					className: "h-[200px] sm:h-[250px] md:h-[300px]"
@@ -362,14 +368,14 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 				...e,
 				...n
 			};
-		})(), c = e.type === "metric", u = W(e), d = ae(e), f = e.id || u || `widget-${t}`, p = s && l === e.id, v = s ? {
+		})(), c = e.type === "metric", u = H(e), d = se(e), f = e.id || u || `widget-${t}`, p = s && l === e.id, v = s ? {
 			"data-testid": `dashboard-preview-widget-${e.id}`,
 			"data-widget-id": e.id,
 			role: "button",
 			tabIndex: 0,
 			"aria-selected": p,
 			"aria-label": `Widget: ${u || `Widget ${t + 1}`}`,
-			onClick: (t) => oe(t, e.id),
+			onClick: (t) => W(t, e.id),
 			onKeyDown: (n) => me(n, e.id, t)
 		} : {}, y = s ? A("cursor-pointer rounded-lg transition-all outline-none", "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", p ? "ring-2 ring-primary shadow-md bg-primary/5 dark:bg-primary/10" : "hover:ring-2 hover:ring-primary/40 hover:shadow-sm") : void 0, b = !O && i && !J ? {
 			gridColumn: `span ${i.w}`,
@@ -433,15 +439,15 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 		children: [
 			!b && e.header.showTitle !== !1 && e.title && /* @__PURE__ */ Y("h2", {
 				className: "text-lg font-semibold tracking-tight",
-				children: H ? P({
-					name: H,
+				children: V ? te({
+					name: V,
 					label: Q(e.title)
 				}) : Q(e.title)
 			}),
 			!b && e.header.showDescription !== !1 && e.description && /* @__PURE__ */ Y("p", {
 				className: "text-sm text-muted-foreground mt-1",
-				children: H ? te({
-					name: H,
+				children: V ? ne({
+					name: V,
 					description: Q(e.description)
 				}) : Q(e.description)
 			}),
@@ -469,7 +475,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 							}
 							console.warn(`[DashboardRenderer] Unknown header actionType="${t}" for "${r}"`);
 						},
-						children: [n && /* @__PURE__ */ Y(n, { className: "w-4 h-4 mr-1.5" }), U(e)]
+						children: [n && /* @__PURE__ */ Y(n, { className: "w-4 h-4 mr-1.5" }), ae(e)]
 					}, t);
 				})
 			})
@@ -482,12 +488,12 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 		children: [be, /* @__PURE__ */ X(p, {
 			variant: "outline",
 			size: "sm",
-			onClick: G,
+			onClick: U,
 			disabled: E,
 			"aria-label": "Refresh dashboard",
-			children: [/* @__PURE__ */ Y(ie, { className: A("h-4 w-4 mr-2", E && "animate-spin") }), E ? "Refreshing…" : "Refresh All"]
+			children: [/* @__PURE__ */ Y(oe, { className: A("h-4 w-4 mr-2", E && "animate-spin") }), E ? "Refreshing…" : "Refresh All"]
 		})]
-	}), Ce = L(() => (e.widgets ?? []).map((e) => e.id).filter((e) => !!e), [e.widgets]), we = L(() => (e.widgets ?? []).filter((e) => e.type === "metric").map((e) => e.id).filter((e) => !!e), [e.widgets]), Te = L(() => (e.widgets ?? []).filter((e) => e.type !== "metric").map((e) => e.id).filter((e) => !!e), [e.widgets]);
+	}), Ce = I(() => (e.widgets ?? []).map((e) => e.id).filter((e) => !!e), [e.widgets]), we = I(() => (e.widgets ?? []).filter((e) => e.type === "metric").map((e) => e.id).filter((e) => !!e), [e.widgets]), Te = I(() => (e.widgets ?? []).filter((e) => e.type !== "metric").map((e) => e.id).filter((e) => !!e), [e.widgets]);
 	if (O) {
 		let n = e.widgets?.filter((e) => e.type === "metric") || [], r = e.widgets?.filter((e) => e.type !== "metric") || [], i = /* @__PURE__ */ X("div", {
 			ref: S,
@@ -520,7 +526,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 				})
 			]
 		});
-		return J ? /* @__PURE__ */ Y(se, {
+		return J ? /* @__PURE__ */ Y(ce, {
 			sensors: ge,
 			collisionDetection: K,
 			onDragEnd: _e,
@@ -548,7 +554,7 @@ var $ = P(({ schema: e, className: t, dataSource: n, onRefresh: r, recordCount:
 			})
 		]
 	});
-	return J ? /* @__PURE__ */ Y(se, {
+	return J ? /* @__PURE__ */ Y(ce, {
 		sensors: ge,
 		collisionDetection: K,
 		onDragEnd: _e,
@@ -760,13 +766,13 @@ var Fe = ({ schema: e, className: t, onLayoutChange: n, onSchemaChange: r, onRef
 							onClick: E,
 							size: "sm",
 							variant: "default",
-							children: [/* @__PURE__ */ Y(ae, { className: "h-4 w-4 mr-2" }), "Save Layout"]
+							children: [/* @__PURE__ */ Y(se, { className: "h-4 w-4 mr-2" }), "Save Layout"]
 						}),
 						/* @__PURE__ */ X(p, {
 							onClick: D,
 							size: "sm",
 							variant: "outline",
-							children: [/* @__PURE__ */ Y(oe, { className: "h-4 w-4 mr-2" }), "Reset"]
+							children: [/* @__PURE__ */ Y(W, { className: "h-4 w-4 mr-2" }), "Reset"]
 						}),
 						/* @__PURE__ */ Y(p, {
 							onClick: () => u(!1),
@@ -780,12 +786,12 @@ var Fe = ({ schema: e, className: t, onLayoutChange: n, onSchemaChange: r, onRef
 						variant: "outline",
 						disabled: f,
 						"aria-label": "Refresh dashboard",
-						children: [/* @__PURE__ */ Y(ie, { className: A("h-4 w-4 mr-2", f && "animate-spin") }), f ? "Refreshing…" : "Refresh All"]
+						children: [/* @__PURE__ */ Y(oe, { className: A("h-4 w-4 mr-2", f && "animate-spin") }), f ? "Refreshing…" : "Refresh All"]
 					}), /* @__PURE__ */ X(p, {
 						onClick: () => u(!0),
 						size: "sm",
 						variant: "outline",
-						children: [/* @__PURE__ */ Y(V, { className: "h-4 w-4 mr-2" }), "Edit Layout"]
+						children: [/* @__PURE__ */ Y(B, { className: "h-4 w-4 mr-2" }), "Edit Layout"]
 					})] })
 				})]
 			}),
@@ -822,7 +828,7 @@ var Fe = ({ schema: e, className: t, onLayoutChange: n, onSchemaChange: r, onRef
 							className: "h-full w-full relative",
 							children: [l && /* @__PURE__ */ Y("div", {
 								className: "drag-handle absolute top-2 right-2 z-10 cursor-move p-1 bg-background/80 rounded border border-border",
-								children: /* @__PURE__ */ Y(H, { className: "h-4 w-4" })
+								children: /* @__PURE__ */ Y(V, { className: "h-4 w-4" })
 							}), /* @__PURE__ */ Y(o, {
 								schema: r,
 								className: "h-full w-full"
@@ -837,7 +843,7 @@ var Fe = ({ schema: e, className: t, onLayoutChange: n, onSchemaChange: r, onRef
 									children: e.title
 								}), l && /* @__PURE__ */ Y("div", {
 									className: "drag-handle cursor-move p-1 hover:bg-muted/40 rounded",
-									children: /* @__PURE__ */ Y(H, { className: "h-4 w-4" })
+									children: /* @__PURE__ */ Y(V, { className: "h-4 w-4" })
 								})]
 							}), /* @__PURE__ */ Y(h, {
 								className: "p-0 h-full",
@@ -920,7 +926,7 @@ var Be = {
 	warning: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
 	danger: "bg-rose-500/10 text-rose-600 dark:text-rose-400"
 }, Ve = ({ label: e, value: t, trend: n, icon: r, className: i, description: a, loading: o, error: s, colorVariant: c = "default", format: l, currency: u, prefix: d, suffix: f, onClick: p, ...v }) => {
-	let y = Be[c] || Be.default, { t: b } = Ie(), x = L(() => {
+	let y = Be[c] || Be.default, { t: b } = Ie(), x = I(() => {
 		let e = ze(a) || ze(n?.label);
 		if (!e) return e;
 		let t = Le(e);
@@ -929,7 +935,7 @@ var Be = {
 		a,
 		n?.label,
 		b
-	]), S = L(() => {
+	]), S = I(() => {
 		let e = typeof t == "number" || typeof t == "string" && t.trim() !== "" && isFinite(Number(t)) ? Re(t, l, u) : t ?? "", n = String(e);
 		return `${d && n.startsWith(d) ? "" : d ?? ""}${n}${f && n.endsWith(f) ? "" : f ?? ""}`;
 	}, [
@@ -938,7 +944,7 @@ var Be = {
 		u,
 		d,
 		f
-	]), C = L(() => {
+	]), C = I(() => {
 		if (typeof r == "string") {
 			let e = j(r);
 			return e ? /* @__PURE__ */ Y(e, { className: "h-4 w-4" }) : null;
@@ -966,7 +972,7 @@ var Be = {
 		}), /* @__PURE__ */ Y(h, { children: o ? /* @__PURE__ */ X("div", {
 			className: "flex items-center gap-2 text-muted-foreground",
 			"data-testid": "metric-loading",
-			children: [/* @__PURE__ */ Y(U, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ Y("span", {
+			children: [/* @__PURE__ */ Y(ae, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ Y("span", {
 				className: "text-sm",
 				children: "Loading…"
 			})]
@@ -974,7 +980,7 @@ var Be = {
 			className: "flex items-center gap-2",
 			"data-testid": "metric-error",
 			role: "alert",
-			children: [/* @__PURE__ */ Y(z, { className: "h-4 w-4 text-destructive shrink-0" }), /* @__PURE__ */ Y("span", {
+			children: [/* @__PURE__ */ Y(R, { className: "h-4 w-4 text-destructive shrink-0" }), /* @__PURE__ */ Y("span", {
 				className: "text-xs text-destructive truncate",
 				children: s
 			})]
@@ -986,9 +992,9 @@ var Be = {
 			children: [n && /* @__PURE__ */ X("span", {
 				className: A("flex items-center shrink-0 font-medium", n.direction === "up" && "text-emerald-600 dark:text-emerald-400", n.direction === "down" && "text-rose-600 dark:text-rose-400", n.direction === "neutral" && "text-muted-foreground"),
 				children: [
-					n.direction === "up" && /* @__PURE__ */ Y(B, { className: "h-3 w-3 mr-1" }),
-					n.direction === "down" && /* @__PURE__ */ Y(re, { className: "h-3 w-3 mr-1" }),
-					n.direction === "neutral" && /* @__PURE__ */ Y(W, { className: "h-3 w-3 mr-1" }),
+					n.direction === "up" && /* @__PURE__ */ Y(ie, { className: "h-3 w-3 mr-1" }),
+					n.direction === "down" && /* @__PURE__ */ Y(z, { className: "h-3 w-3 mr-1" }),
+					n.direction === "neutral" && /* @__PURE__ */ Y(H, { className: "h-3 w-3 mr-1" }),
 					n.value,
 					"%"
 				]
@@ -1018,7 +1024,7 @@ var Ue = ({ title: e, value: t, icon: n, trend: r, trendValue: i, description: a
 		}), /* @__PURE__ */ Y(h, { children: s ? /* @__PURE__ */ X("div", {
 			className: "flex items-center gap-2 text-muted-foreground",
 			"data-testid": "metric-card-loading",
-			children: [/* @__PURE__ */ Y(U, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ Y("span", {
+			children: [/* @__PURE__ */ Y(ae, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ Y("span", {
 				className: "text-sm",
 				children: "Loading…"
 			})]
@@ -1026,7 +1032,7 @@ var Ue = ({ title: e, value: t, icon: n, trend: r, trendValue: i, description: a
 			className: "flex items-center gap-2",
 			"data-testid": "metric-card-error",
 			role: "alert",
-			children: [/* @__PURE__ */ Y(z, { className: "h-4 w-4 text-destructive shrink-0" }), /* @__PURE__ */ Y("span", {
+			children: [/* @__PURE__ */ Y(R, { className: "h-4 w-4 text-destructive shrink-0" }), /* @__PURE__ */ Y("span", {
 				className: "text-xs text-destructive truncate",
 				children: c
 			})]
@@ -1038,43 +1044,43 @@ var Ue = ({ title: e, value: t, icon: n, trend: r, trendValue: i, description: a
 			children: [r && i && /* @__PURE__ */ X("span", {
 				className: A("flex items-center mr-2", r === "up" && "text-green-500", r === "down" && "text-red-500", r === "neutral" && "text-yellow-500"),
 				children: [
-					r === "up" && /* @__PURE__ */ Y(B, { className: "h-3 w-3 mr-1" }),
-					r === "down" && /* @__PURE__ */ Y(re, { className: "h-3 w-3 mr-1" }),
-					r === "neutral" && /* @__PURE__ */ Y(W, { className: "h-3 w-3 mr-1" }),
+					r === "up" && /* @__PURE__ */ Y(ie, { className: "h-3 w-3 mr-1" }),
+					r === "down" && /* @__PURE__ */ Y(z, { className: "h-3 w-3 mr-1" }),
+					r === "neutral" && /* @__PURE__ */ Y(H, { className: "h-3 w-3 mr-1" }),
 					i
 				]
 			}), He(a)]
 		})] }) })]
 	});
-}, We = ({ objectName: e, aggregate: t, filter: n, label: c, fallbackValue: l, trend: u, icon: d, className: f, description: p, dataSource: m, colorVariant: h, format: g, currency: _, prefix: v, suffix: y, drillDown: b, title: k }) => {
-	let A = te(s), j = m || A?.dataSource, [M, N] = R(!1), [ee, P] = R(null), [ne, z] = R(!1), [re, B] = R(null), [V, H] = R(null);
-	I(() => {
+}, We = ({ objectName: e, aggregate: t, filter: n, label: c, fallbackValue: l, trend: u, icon: d, className: f, description: p, dataSource: m, colorVariant: h, format: g, currency: _, prefix: v, suffix: y, invert: b, drillDown: k, title: A }) => {
+	let j = ne(s), M = m || j?.dataSource, [N, ee] = L(!1), [te, re] = L(null), [R, z] = L(!1), [ie, B] = L(null), [V, ae] = L(null);
+	F(() => {
 		let t = !0;
-		if (!(!j || !e || typeof j.getObjectSchema != "function")) return j.getObjectSchema(e).then((e) => {
-			t && H(e);
+		if (!(!M || !e || typeof M.getObjectSchema != "function")) return M.getObjectSchema(e).then((e) => {
+			t && ae(e);
 		}).catch(() => {}), () => {
 			t = !1;
 		};
-	}, [j, e]);
-	let U = L(() => {
+	}, [M, e]);
+	let H = I(() => {
 		let e = t?.field;
 		if (!e || !V?.fields) return null;
 		let n = V.fields;
 		return Array.isArray(n) ? n.find((t) => t?.name === e) || null : n[e] || null;
-	}, [V, t?.field]), W = L(() => {
+	}, [V, t?.field]), oe = I(() => {
 		if (g) return g;
-		if (U) {
-			if (U.type === "currency") {
-				let e = U.precision ?? U.scale ?? 0;
+		if (H) {
+			if (H.type === "currency") {
+				let e = H.precision ?? H.scale ?? 0;
 				return e > 0 ? `0,0.${"0".repeat(e)}` : "0,0";
 			}
-			if (U.type === "percent") return "0,0%";
-			if (U.type === "number" || U.type === "integer") return "0,0";
+			if (H.type === "percent") return "0,0%";
+			if (H.type === "number" || H.type === "integer") return "0,0";
 		}
-	}, [g, U]), ie = L(() => {
+	}, [g, H]), se = I(() => {
 		if (_) return _;
-		if (U?.type === "currency") return U.defaultCurrency || U.currency || void 0;
-	}, [_, U]), ae = L(() => t ? JSON.stringify(t) : "", [t]), G = L(() => i(n), [n]), oe = F(async (n, r) => {
+		if (H?.type === "currency") return H.defaultCurrency || H.currency || void 0;
+	}, [_, H]), U = I(() => t ? JSON.stringify(t) : "", [t]), W = I(() => i(n), [n]), ce = P(async (n, r) => {
 		if (!(!n || !e)) {
 			r.current && (z(!0), B(null));
 			try {
@@ -1084,14 +1090,14 @@ var Ue = ({ title: e, value: t, icon: n, trend: r, trendValue: i, description: a
 						field: t.field,
 						function: t.function,
 						groupBy: t.groupBy || "_all",
-						filter: G
+						filter: W
 					}), a = Array.isArray(r) ? r : [];
 					i = a.length === 0 ? 0 : t.function === "count" ? a.reduce((e, n) => e + (Number(n[t.field]) || Number(n.count) || 0), 0) : a[0][t.field] ?? 0;
 				} else if (typeof n.find == "function") {
-					let t = await n.find(e, { $filter: G });
+					let t = await n.find(e, { $filter: W });
 					i = (Array.isArray(t) ? t : t?.data || t?.records || []).length;
 				} else return;
-				r.current && P(i);
+				r.current && re(i);
 			} catch (e) {
 				console.error("[ObjectMetricWidget] Fetch error:", e), r.current && B(e instanceof Error ? e.message : "Failed to load metric");
 			} finally {
@@ -1100,80 +1106,93 @@ var Ue = ({ title: e, value: t, icon: n, trend: r, trendValue: i, description: a
 		}
 	}, [
 		e,
-		ae,
-		L(() => G ? JSON.stringify(G) : "", [G])
+		U,
+		I(() => W ? JSON.stringify(W) : "", [W])
 	]);
-	I(() => {
+	F(() => {
 		let t = { current: !0 };
-		return j && e ? oe(j, t) : (P(null), B(null)), () => {
+		return M && e ? ce(M, t) : (re(null), B(null)), () => {
 			t.current = !1;
 		};
 	}, [
-		j,
+		M,
 		e,
-		oe
+		ce
 	]);
-	let se = ee === null ? j ? "—" : l ?? "—" : ee, ce = r(b) && !!e && !!j, K = L(() => {
+	let G = te === null ? M ? "—" : l ?? "—" : te;
+	b && typeof G == "number" && isFinite(G) && G >= 0 && G <= 1 && (G = 1 - G);
+	let K = r(k) && !!e && !!M, le = I(() => {
 		let e = typeof c == "string" ? c : c?.defaultValue || "";
-		return a(b, {}, (typeof k == "string" ? k : k?.defaultValue || "") || e || "Details");
+		return a(k, {}, (typeof A == "string" ? A : A?.defaultValue || "") || e || "Details");
 	}, [
-		b,
+		k,
 		c,
-		k
-	]), le = L(() => {
-		if (!ce) return null;
-		let t = b?.target ?? "drawer", n = /* @__PURE__ */ Y("div", {
+		A
+	]), ue = I(() => {
+		if (!K) return null;
+		let t = k?.target ?? "drawer", n = k?.report, r = n && typeof n == "object" && (Array.isArray(n.columns) || "objectName" in n), i;
+		if (r) {
+			let e = n.filter, t = e ? W ? { $and: [e, W] } : e : W;
+			i = /* @__PURE__ */ Y("div", {
+				className: "h-full overflow-auto",
+				children: /* @__PURE__ */ Y(o, { schema: {
+					type: "spec-report",
+					...n,
+					filter: t
+				} })
+			});
+		} else i = /* @__PURE__ */ Y("div", {
 			className: "h-full overflow-auto",
 			children: /* @__PURE__ */ Y(o, { schema: {
 				type: "object-data-table",
 				objectName: e,
-				filter: G,
+				filter: W,
 				pageSize: 25,
 				drillDown: { enabled: !1 }
 			} })
 		});
 		return t === "modal" ? /* @__PURE__ */ Y(x, {
 			open: !0,
-			onOpenChange: (e) => !e && N(!1),
+			onOpenChange: (e) => !e && ee(!1),
 			children: /* @__PURE__ */ X(S, {
-				className: "max-w-4xl",
-				children: [/* @__PURE__ */ Y(C, { children: /* @__PURE__ */ Y(w, { children: K }) }), n]
+				className: "max-w-5xl",
+				children: [/* @__PURE__ */ Y(C, { children: /* @__PURE__ */ Y(w, { children: le }) }), i]
 			})
 		}) : /* @__PURE__ */ Y(T, {
 			open: !0,
-			onOpenChange: (e) => !e && N(!1),
+			onOpenChange: (e) => !e && ee(!1),
 			children: /* @__PURE__ */ X(E, {
 				side: "right",
-				className: "w-full sm:max-w-2xl md:max-w-3xl lg:max-w-4xl flex flex-col",
-				children: [/* @__PURE__ */ Y(D, { children: /* @__PURE__ */ Y(O, { children: K }) }), /* @__PURE__ */ Y("div", {
+				className: "w-full sm:max-w-2xl md:max-w-3xl lg:max-w-5xl flex flex-col",
+				children: [/* @__PURE__ */ Y(D, { children: /* @__PURE__ */ Y(O, { children: le }) }), /* @__PURE__ */ Y("div", {
 					className: "flex-1 overflow-hidden mt-2",
-					children: n
+					children: i
 				})]
 			})
 		});
 	}, [
-		ce,
-		b,
+		K,
+		k,
 		e,
-		G,
-		K
+		W,
+		le
 	]);
 	return /* @__PURE__ */ X(J, { children: [/* @__PURE__ */ Y(Ve, {
 		label: c,
-		value: se,
+		value: G,
 		trend: u,
 		icon: d,
 		className: f,
 		description: p,
-		loading: ne,
-		error: re,
+		loading: R,
+		error: ie,
 		colorVariant: h,
-		format: W,
-		currency: ie,
+		format: oe,
+		currency: se,
 		prefix: v,
 		suffix: y,
-		onClick: ce ? () => N(!0) : void 0
-	}), M && le] });
+		onClick: K ? () => ee(!0) : void 0
+	}), N && ue] });
 };
 //#endregion
 //#region src/PivotTable.tsx
@@ -1234,7 +1253,7 @@ var Ze = ({ schema: e, className: t, rowLabels: n, columnLabels: i, rowFieldLabe
 		});
 	}, S = (e) => (t) => {
 		(t.key === "Enter" || t.key === " ") && (t.preventDefault(), e());
-	}, C = b ? "cursor-pointer hover:bg-accent/40 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]" : "", w = Array.isArray(f) ? f : [], { rowKeys: T, colKeys: E, matrix: D, rowTotals: O, colTotals: k, grandTotal: j } = L(() => {
+	}, C = b ? "cursor-pointer hover:bg-accent/40 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]" : "", w = Array.isArray(f) ? f : [], { rowKeys: T, colKeys: E, matrix: D, rowTotals: O, colTotals: k, grandTotal: j } = I(() => {
 		let e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map(), n = {};
 		for (let r of w) {
 			let i = String(r[c] ?? ""), a = String(r[l] ?? ""), o = Number(r[u]) || 0;
@@ -1484,15 +1503,15 @@ function $e(e, t) {
 	return Array.from(a);
 }
 var et = ({ schema: e, dataSource: t, className: r }) => {
-	let a = te(s), c = t || a?.dataSource, u = l(e.bind), { fieldLabel: d, fieldOptionLabel: f } = be(), p = "No data available", m = "No data source available for";
+	let a = ne(s), c = t || a?.dataSource, u = l(e.bind), { fieldLabel: d, fieldOptionLabel: f } = be(), p = "No data available", m = "No data source available for";
 	try {
 		let { t: e } = ye(), t = e("dashboard.noDataAvailable");
 		t && t !== "dashboard.noDataAvailable" && (p = t);
 		let n = e("dashboard.noDataSourceFor");
 		n && n !== "dashboard.noDataSourceFor" && (m = n);
 	} catch {}
-	let [h, g] = R([]), [_, v] = R(null), [y, b] = R(!1), [x, S] = R(null);
-	I(() => {
+	let [h, g] = L([]), [_, v] = L(null), [y, b] = L(!1), [x, S] = L(null);
+	F(() => {
 		let t = !0;
 		return e.objectName && !u && (!e.data || e.data.length === 0) && (async () => {
 			if (!(!c || !e.objectName)) {
@@ -1520,7 +1539,7 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 		e.data,
 		e.filter,
 		_
-	]), I(() => {
+	]), F(() => {
 		let t = !0;
 		if (!(!c || !e.objectName || typeof c.getObjectSchema != "function")) return c.getObjectSchema(e.objectName).then((e) => {
 			t && v(e);
@@ -1528,7 +1547,7 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 			t = !1;
 		};
 	}, [e.objectName, c]);
-	let C = u || e.data || h, w = Array.isArray(C) ? C : [], T = L(() => {
+	let C = u || e.data || h, w = Array.isArray(C) ? C : [], T = I(() => {
 		let t = e.objectName, n = {};
 		if (_?.fields) {
 			let e = _.fields;
@@ -1769,32 +1788,43 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 		},
 		className: r
 	});
-}, tt = ({ open: e, onClose: t, title: n, target: r = "drawer", objectName: i, filter: a, dataSource: o, columns: s, maxRows: c, className: l }) => {
-	let u = {
-		type: "object-data-table",
-		objectName: i,
-		filter: a,
-		columns: s?.map((e) => ({
-			accessorKey: e,
-			header: e
-		})),
-		pagination: !0,
-		searchable: !1,
-		pageSize: c
-	}, d = /* @__PURE__ */ Y("div", {
-		className: A("overflow-auto", l),
+}, tt = ({ open: e, onClose: t, title: n, target: r = "drawer", objectName: i, filter: a, dataSource: s, columns: c, maxRows: l, className: u, report: d }) => {
+	let f = d && typeof d == "object" && (Array.isArray(d.columns) || "objectName" in d), p = /* @__PURE__ */ Y("div", {
+		className: A("overflow-auto", u),
 		"data-testid": "drill-down-body",
-		children: /* @__PURE__ */ Y(et, {
-			schema: u,
-			dataSource: o
+		children: f ? (() => {
+			let e = d.filter, t = e ? a ? { $and: [e, a] } : e : a;
+			return /* @__PURE__ */ Y(o, { schema: {
+				...d,
+				type: "spec-report",
+				report: {
+					...d,
+					filter: t
+				},
+				filter: t
+			} });
+		})() : /* @__PURE__ */ Y(et, {
+			schema: {
+				type: "object-data-table",
+				objectName: i,
+				filter: a,
+				columns: c?.map((e) => ({
+					accessorKey: e,
+					header: e
+				})),
+				pagination: !0,
+				searchable: !1,
+				pageSize: l
+			},
+			dataSource: s
 		})
 	});
 	return r === "dialog" ? /* @__PURE__ */ Y(x, {
 		open: e,
 		onOpenChange: (e) => !e && t(),
 		children: /* @__PURE__ */ X(S, {
-			className: "max-w-4xl",
-			children: [/* @__PURE__ */ Y(C, { children: /* @__PURE__ */ Y(w, { children: n }) }), d]
+			className: "max-w-5xl",
+			children: [/* @__PURE__ */ Y(C, { children: /* @__PURE__ */ Y(w, { children: n }) }), p]
 		})
 	}) : /* @__PURE__ */ Y(T, {
 		open: e,
@@ -1804,15 +1834,15 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 			className: "w-full sm:max-w-2xl md:max-w-3xl lg:max-w-4xl flex flex-col",
 			children: [/* @__PURE__ */ Y(D, { children: /* @__PURE__ */ Y(O, { children: n }) }), /* @__PURE__ */ Y("div", {
 				className: "flex-1 overflow-hidden mt-2",
-				children: d
+				children: p
 			})]
 		})
 	});
 }, nt = ({ schema: e, dataSource: o, className: c }) => {
-	let u = te(s), d = o || u?.dataSource, f = l(e.bind), [p, m] = R([]), [h, g] = R(!1), [_, v] = R(null), [y, b] = R({}), [x, S] = R({}), [C, w] = R(null), { fieldLabel: T, fieldOptionLabel: E } = be(), D = ne(T), O = ne(E);
-	I(() => {
+	let u = ne(s), d = o || u?.dataSource, f = l(e.bind), [p, m] = L([]), [h, g] = L(!1), [_, v] = L(null), [y, b] = L({}), [x, S] = L({}), [C, w] = L(null), { fieldLabel: T, fieldOptionLabel: E } = be(), D = re(T), O = re(E);
+	F(() => {
 		D.current = T, O.current = E;
-	}, [T, E]), I(() => {
+	}, [T, E]), F(() => {
 		if (!d || !e.objectName) return;
 		let t = d.getObjectSchema;
 		if (typeof t != "function") return;
@@ -1837,7 +1867,7 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 		}).catch(() => {}), () => {
 			n = !1;
 		};
-	}, [d, e.objectName]), I(() => {
+	}, [d, e.objectName]), F(() => {
 		let t = !0;
 		return e.objectName && !f && (!e.data || e.data.length === 0) && (async () => {
 			if (!(!d || !e.objectName)) {
@@ -1958,17 +1988,17 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 	let N = {
 		...e,
 		data: M
-	}, ee = e.rowField ? y[e.rowField] : void 0, P = e.columnField ? y[e.columnField] : void 0, F = e.rowField ? x[e.rowField] : void 0, L = e.drillDown;
+	}, ee = e.rowField ? y[e.rowField] : void 0, te = e.columnField ? y[e.columnField] : void 0, P = e.rowField ? x[e.rowField] : void 0, I = e.drillDown;
 	return /* @__PURE__ */ X(J, { children: [/* @__PURE__ */ Y(Ze, {
 		schema: N,
 		className: c,
 		rowLabels: ee,
-		columnLabels: P,
-		rowFieldLabel: F,
-		onDrillDown: r(L) ? (e) => w(e) : void 0
+		columnLabels: te,
+		rowFieldLabel: P,
+		onDrillDown: r(I) ? (e) => w(e) : void 0
 	}), (() => {
 		if (!C || !e.objectName) return null;
-		let n = t(L, C, {
+		let n = t(I, C, {
 			rowField: e.rowField,
 			columnField: e.columnField
 		}), r = {
@@ -1978,13 +2008,14 @@ var et = ({ schema: e, dataSource: t, className: r }) => {
 		return /* @__PURE__ */ Y(tt, {
 			open: !0,
 			onClose: () => w(null),
-			title: a(L, C, e.title || "Details"),
-			target: L?.target ?? "drawer",
+			title: a(I, C, e.title || "Details"),
+			target: I?.target ?? "drawer",
 			objectName: e.objectName,
 			filter: r,
 			dataSource: d,
-			columns: L?.columns,
-			maxRows: L?.maxRows
+			columns: I?.columns,
+			maxRows: I?.maxRows,
+			report: I?.report
 		});
 	})()] });
 }, rt = {
@@ -2691,8 +2722,8 @@ function Et({ open: e, onClose: t, config: n, onSave: r, onFieldChange: i, heade
 //#endregion
 //#region src/DashboardWithConfig.tsx
 function Dt({ schema: e, config: t, onConfigSave: n, onWidgetSave: r, onRefresh: i, recordCount: a, defaultConfigOpen: o = !1, className: s }) {
-	let [c, l] = R(o), [u, d] = R(null), [f, m] = R(e), [h, g] = R(0);
-	I(() => {
+	let [c, l] = L(o), [u, d] = L(null), [f, m] = L(e), [h, g] = L(0);
+	F(() => {
 		m(e), g((e) => e + 1);
 	}, [e]);
 	let _ = N.useMemo(() => {
@@ -2717,11 +2748,11 @@ function Dt({ schema: e, config: t, onConfigSave: n, onWidgetSave: r, onRefresh:
 			layoutW: e.layout?.w ?? 1,
 			layoutH: e.layout?.h ?? 1
 		};
-	}, [u, h]), v = F((e) => {
+	}, [u, h]), v = P((e) => {
 		d(e), l(!0);
-	}, []), y = F(() => {
+	}, []), y = P(() => {
 		d(null);
-	}, []), b = F((e, t) => {
+	}, []), b = P((e, t) => {
 		u && m((n) => n.widgets ? {
 			...n,
 			widgets: n.widgets.map((n) => {
@@ -2762,7 +2793,7 @@ function Dt({ schema: e, config: t, onConfigSave: n, onWidgetSave: r, onRefresh:
 				};
 			})
 		} : n);
-	}, [u]), x = F((e) => {
+	}, [u]), x = P((e) => {
 		if (u && r) {
 			let { drillDownEnabled: t, drillDownTarget: n, ...i } = e, a = { ...i };
 			(t || n) && (a.options = {
@@ -2775,7 +2806,7 @@ function Dt({ schema: e, config: t, onConfigSave: n, onWidgetSave: r, onRefresh:
 			}), r(u, a);
 		}
 		d(null), g((e) => e + 1);
-	}, [u, r]), S = F(() => {
+	}, [u, r]), S = P(() => {
 		l((e) => !e), d(null);
 	}, []);
 	return /* @__PURE__ */ X("div", {
@@ -2790,7 +2821,7 @@ function Dt({ schema: e, config: t, onConfigSave: n, onWidgetSave: r, onRefresh:
 					variant: c ? "default" : "outline",
 					onClick: S,
 					"data-testid": "dashboard-config-toggle",
-					children: [/* @__PURE__ */ Y(G, { className: "h-3.5 w-3.5 mr-1" }), "Settings"]
+					children: [/* @__PURE__ */ Y(U, { className: "h-3.5 w-3.5 mr-1" }), "Settings"]
 				})
 			}), /* @__PURE__ */ Y($, {
 				schema: f,