@burdenoff/microfe-bigconsole 2026.613.1 → 2026.613.3

package/dist/bigconsole/pages/DashboardBuilderPage.js

@@ -1,21 +1,22 @@
 import { useWidgetStore as e } from "../store/widgetStore.js";
 import { useDashboardStore as t } from "../store/dashboardStore.js";
 import "../store/index.js";
-import { useBigConsoleNavigate as n } from "../context/BigConsoleContext.js";
+import { useBigConsole as n, useBigConsoleNavigate as r } from "../context/BigConsoleContext.js";
 import "../context/index.js";
-import r from "../hooks/useWidgetOperations.js";
-import i from "../hooks/useDashboardOperations.js";
-import a from "../hooks/usePageOperations.js";
+import { getWidgetDefinition as i } from "../components/widgets/WidgetRegistry.js";
+import a from "../hooks/useWidgetCatalog.js";
+import o from "../hooks/useWidgetOperations.js";
+import s from "../hooks/useDashboardOperations.js";
+import c from "../hooks/usePageOperations.js";
 import "../hooks/index.js";
-import { getWidgetDefinition as o } from "../components/widgets/WidgetRegistry.js";
-import s from "../components/widgets/WidgetTypeSelector.js";
-import { findNextAvailablePosition as c } from "../utils/widgetPositioning.js";
-import l from "../components/dashboard/DashboardCanvas.js";
-import u from "../components/dashboard/ExportDashboardDialog.js";
+import l from "../components/widgets/WidgetTypeSelector.js";
+import { findNextAvailablePosition as u } from "../utils/widgetPositioning.js";
+import ee from "../components/dashboard/DashboardCanvas.js";
+import d from "../components/dashboard/ExportDashboardDialog.js";
 import "../components/dashboard/index.js";
-import { memo as d, useCallback as f, useEffect as p, useState as m } from "react";
-import { useParams as h } from "react-router-dom";
-import { ArrowLeft as g } from "lucide-react";
+import { memo as f, useCallback as p, useEffect as m, useState as h } from "react";
+import { useParams as g } from "react-router-dom";
+import { ArrowLeft as te } from "lucide-react";
 import { jsx as _, jsxs as v } from "react/jsx-runtime";
 import { Button as y } from "@burdenoff/fe-libs/ui";
 //#region src/bigconsole/pages/DashboardBuilderPage.tsx
@@ -30,19 +31,23 @@ function x(e, t) {
 	let n = b();
 	n?.register && n.register(e, t);
 }
-function S(e) {
+function ne(e) {
 	let t = b();
 	t?.unregister && t.unregister(e);
 }
-var C = d(function() {
-	let { dashboardId: d } = h(), b = n(), [C, w] = m(!1), [T, E] = m(!1), [D, O] = m(!1), [k, A] = m(null), { fetchDashboard: j, updateDashboard: M, loading: N, error: P } = i(), { createWidget: F, updateWidget: I, deleteWidget: L, duplicateWidget: R, batchUpdatePositions: z } = r(void 0, d), { createPage: B, updatePage: V, deletePage: H, reorderPages: U } = a(), W = t((e) => e.setCurrentDashboard), G = t((e) => e.currentDashboard), K = t((e) => e.setViewMode), q = e((e) => e.selectWidget), J = e((e) => e.widgets), Y = e((e) => e.clipboardWidgetId), X = e((e) => e.clipboardAction), Z = e((e) => e.clearClipboard);
-	p(() => (K("edit"), () => K("view")), [K]), p(() => {
-		if (!d) {
+var S = f(function() {
+	let { dashboardId: f } = g(), b = r(), { workspaceId: S, apiGatewayUrl: C, authToken: w } = n(), { definitions: T } = a({
+		workspaceId: S,
+		apiGatewayUrl: C,
+		authToken: w
+	}), [E, D] = h(!1), [re, O] = h(!1), [ie, k] = h(!1), [A, j] = h(null), { fetchDashboard: M, updateDashboard: N, loading: P, error: F } = s(), { createWidget: I, updateWidget: L, deleteWidget: R, duplicateWidget: z, batchUpdatePositions: B } = o(void 0, f), { createPage: V, updatePage: H, deletePage: U, reorderPages: W } = c(), G = t((e) => e.setCurrentDashboard), K = t((e) => e.currentDashboard), q = t((e) => e.setViewMode), J = e((e) => e.selectWidget), Y = e((e) => e.widgets), X = e((e) => e.clipboardWidgetId), Z = e((e) => e.clipboardAction), Q = e((e) => e.clearClipboard);
+	m(() => (q("edit"), () => q("view")), [q]), m(() => {
+		if (!f) {
 			b("/dashboards");
 			return;
 		}
-		return j(d).then((e) => {
-			e ? (W({
+		return M(f).then((e) => {
+			e ? (G({
 				id: e.id,
 				title: e.name,
 				description: e.description || "",
@@ -54,39 +59,39 @@ var C = d(function() {
 				})),
 				createdAt: e.createdAt,
 				updatedAt: e.updatedAt
-			}), e.pages.length > 0 && !k && A(e.pages[0].id), e.name && x(d, e.name)) : b("/dashboards");
+			}), e.pages.length > 0 && !A && j(e.pages[0].id), e.name && x(f, e.name)) : b("/dashboards");
 		}), () => {
-			d && S(d);
+			f && ne(f);
 		};
 	}, [
-		d,
+		f,
 		b,
-		W,
-		j,
-		k
+		G,
+		M,
+		A
 	]);
-	let Q = f(async () => {
-		if (!Y || !d || !G?.pages?.[0]?.id) return;
-		let e = J.get(Y);
+	let ae = p(async () => {
+		if (!X || !f || !K?.pages?.[0]?.id) return;
+		let e = Y.get(X);
 		if (!e) {
-			Z();
+			Q();
 			return;
 		}
-		let t = G.pages[0].id, n = Array.from(J.values()), r = {
+		let t = K.pages[0].id, n = Array.from(Y.values()), r = {
 			width: e.positionWidth ?? 4,
 			height: e.positionHeight ?? 4
-		}, { x: i, y: a } = c(n, r, { cols: 12 }), o = {
+		}, { x: i, y: a } = u(n, r, { cols: 12 }), o = {
 			x: i,
 			y: a,
 			width: r.width,
 			height: r.height
-		}, s = X === "copy" ? `${e.title} (Copy)` : e.title, l = null;
+		}, s = Z === "copy" ? `${e.title} (Copy)` : e.title, c = null;
 		try {
-			l = await R(Y, o, s);
+			c = await z(X, o, s);
 		} catch {}
-		l ||= await F({
+		c ||= await I({
 			pageId: t,
-			dashboardId: d,
+			dashboardId: f,
 			type: e.type,
 			title: s,
 			description: e.description,
@@ -98,48 +103,49 @@ var C = d(function() {
 			position: o,
 			refreshInterval: e.refreshInterval ?? void 0,
 			metadata: e.metadata
-		}), l && (q(l.id), X === "cut" && await L(Y)), Z();
+		}), c && (J(c.id), Z === "cut" && await R(X)), Q();
 	}, [
-		Y,
 		X,
-		d,
-		G,
-		J,
+		Z,
+		f,
+		K,
+		Y,
+		z,
+		I,
 		R,
-		F,
-		L,
-		q,
-		Z
-	]), $ = f(async (e) => {
-		if (!d || !G?.pages?.[0]?.id) return;
-		let t = G.pages[0].id, n = e.replace(/_/g, " ").toLowerCase().replace(/^\w/, (e) => e.toUpperCase()), r = Array.from(J.values()), i = o(e), a = {
-			width: i?.defaultSize?.width ?? 4,
-			height: i?.defaultSize?.height ?? 4
-		}, { x: s, y: l } = c(r, a, { cols: 12 }), u = await F({
+		J,
+		Q
+	]), oe = p(async (e) => {
+		if (!f || !K?.pages?.[0]?.id) return;
+		let t = K.pages[0].id, n = e.replace(/_/g, " ").toLowerCase().replace(/^\w/, (e) => e.toUpperCase()), r = Array.from(Y.values()), a = T.find((t) => t.type === e) ?? i(e), o = {
+			width: a?.defaultSize?.width ?? 4,
+			height: a?.defaultSize?.height ?? 4
+		}, { x: s, y: c } = u(r, o, { cols: 12 }), l = await I({
 			pageId: t,
-			dashboardId: d,
+			dashboardId: f,
 			type: e,
 			title: n,
 			config: {},
 			position: {
 				x: s,
-				y: l,
-				width: a.width,
-				height: a.height
+				y: c,
+				width: o.width,
+				height: o.height
 			}
 		});
-		u && (q(u.id), w(!1));
+		l && (J(l.id), D(!1));
 	}, [
-		d,
-		G,
-		F,
-		q,
-		J
-	]), ee = f(() => {
+		f,
+		K,
+		I,
+		J,
+		Y,
+		T
+	]), se = p(() => {
 		b("/dashboards");
-	}, [b]), te = f(async () => {
-		if (d) {
-			E(!0);
+	}, [b]), $ = p(async () => {
+		if (f) {
+			O(!0);
 			try {
 				let t = e.getState(), n = Array.from(t.widgets.values()), r = t.dirtyWidgetIds, i = n.filter((e) => r.has(e.id));
 				if (i.length > 0) {
@@ -155,14 +161,14 @@ var C = d(function() {
 							parserRules: e.parserRules ?? void 0
 						};
 						try {
-							return await I(t);
+							return await L(t);
 						} catch (e) {
 							throw e;
 						}
 					});
 					await Promise.all(e), t.clearAllDirty();
 				}
-				n.length > 0 && await z(n.map((e) => ({
+				n.length > 0 && await B(n.map((e) => ({
 					id: e.id,
 					position: e.position || {
 						x: e.positionX ?? 0,
@@ -170,118 +176,118 @@ var C = d(function() {
 						width: e.positionWidth ?? 4,
 						height: e.positionHeight ?? 4
 					}
-				}))), G && await M({
-					id: d,
-					name: G.title,
-					description: G.description
+				}))), K && await N({
+					id: f,
+					name: K.title,
+					description: K.description
 				});
 			} catch {} finally {
-				E(!1);
+				O(!1);
 			}
 		}
 	}, [
-		d,
-		G,
-		I,
-		z,
-		M
-	]), ne = f(() => {
-		O(!0);
-	}, []), re = f(() => {
-		O(!1);
-	}, []), ie = f((e) => {
-		A(e);
-	}, []), ae = f(async () => {
-		if (!G || !d) return;
-		let e = await B({
-			dashboardId: d,
-			name: `Page ${G.pages.length + 1}`
+		f,
+		K,
+		L,
+		B,
+		N
+	]), ce = p(() => {
+		k(!0);
+	}, []), le = p(() => {
+		k(!1);
+	}, []), ue = p((e) => {
+		j(e);
+	}, []), de = p(async () => {
+		if (!K || !f) return;
+		let e = await V({
+			dashboardId: f,
+			name: `Page ${K.pages.length + 1}`
 		});
-		e && (W({
-			...G,
-			pages: [...G.pages, {
+		e && (G({
+			...K,
+			pages: [...K.pages, {
 				id: e.id,
 				title: e.name,
 				index: e.order,
 				layoutConfig: e.layoutConfig || {}
 			}]
-		}), A(e.id));
+		}), j(e.id));
 	}, [
+		K,
+		f,
 		G,
-		d,
-		W,
-		B
-	]), oe = f(async (e, t) => {
-		G && await V({
+		V
+	]), fe = p(async (e, t) => {
+		K && await H({
 			id: e,
 			name: t
-		}) && W({
-			...G,
-			pages: G.pages.map((n) => n.id === e ? {
+		}) && G({
+			...K,
+			pages: K.pages.map((n) => n.id === e ? {
 				...n,
 				title: t
 			} : n)
 		});
 	}, [
+		K,
 		G,
-		W,
-		V
-	]), se = f(async (e) => {
-		if (!G || !d) return;
-		let t = G.pages.find((t) => t.id === e);
+		H
+	]), pe = p(async (e) => {
+		if (!K || !f) return;
+		let t = K.pages.find((t) => t.id === e);
 		if (!t) return;
-		let n = await B({
-			dashboardId: d,
+		let n = await V({
+			dashboardId: f,
 			name: `${t.title} (Copy)`
 		});
-		n && (W({
-			...G,
-			pages: [...G.pages, {
+		n && (G({
+			...K,
+			pages: [...K.pages, {
 				id: n.id,
 				title: n.name,
 				index: n.order,
 				layoutConfig: n.layoutConfig || {}
 			}]
-		}), A(n.id));
+		}), j(n.id));
 	}, [
+		K,
+		f,
 		G,
-		d,
-		W,
-		B
-	]), ce = f(async (e) => {
-		if (!(!G || G.pages.length <= 1) && await H(e)) {
-			let t = G.pages.filter((t) => t.id !== e).map((e, t) => ({
+		V
+	]), me = p(async (e) => {
+		if (!(!K || K.pages.length <= 1) && await U(e)) {
+			let t = K.pages.filter((t) => t.id !== e).map((e, t) => ({
 				...e,
 				index: t
 			}));
-			W({
-				...G,
+			G({
+				...K,
 				pages: t
-			}), k === e && A(t[0]?.id || null);
+			}), A === e && j(t[0]?.id || null);
 		}
 	}, [
+		K,
 		G,
-		W,
-		k,
-		H
-	]), le = f(async (e) => {
-		!G || !d || (W({
-			...G,
+		A,
+		U
+	]), he = p(async (e) => {
+		!K || !f || (G({
+			...K,
 			pages: e.map((e, t) => ({
 				...e,
 				index: t
 			}))
-		}), await U(d, e.map((e) => e.id)));
+		}), await W(f, e.map((e) => e.id)));
 	}, [
+		K,
+		f,
 		G,
-		d,
-		W,
-		U
+		W
 	]);
-	return N || !G ? /* @__PURE__ */ _("div", {
+	return P || !K ? /* @__PURE__ */ _("div", {
 		className: "flex items-center justify-center h-full",
 		children: /* @__PURE__ */ _("div", { className: "animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full" })
-	}) : P ? /* @__PURE__ */ _("div", {
+	}) : F ? /* @__PURE__ */ _("div", {
 		className: "flex flex-col items-center justify-center h-full p-6",
 		children: /* @__PURE__ */ v("div", {
 			className: "bg-status-error-bg border border-status-error-border rounded-lg p-4 max-w-md",
@@ -292,7 +298,7 @@ var C = d(function() {
 				}),
 				/* @__PURE__ */ _("p", {
 					className: "text-sm text-text-secondary mt-1",
-					children: P.message
+					children: F.message
 				}),
 				/* @__PURE__ */ _("button", {
 					type: "button",
@@ -307,29 +313,29 @@ var C = d(function() {
 		children: [/* @__PURE__ */ v("div", {
 			className: "flex items-center gap-3 px-3 py-2 border-b border-border-default bg-bg-surface flex-shrink-0",
 			children: [/* @__PURE__ */ v(y, {
-				onClick: ee,
+				onClick: se,
 				variant: "ghost",
 				size: "sm",
 				title: "Back to Dashboards",
 				"aria-label": "Back to Dashboards",
-				children: [/* @__PURE__ */ _(g, { className: "w-4 h-4 mr-2" }), "Back"]
+				children: [/* @__PURE__ */ _(te, { className: "w-4 h-4 mr-2" }), "Back"]
 			}), /* @__PURE__ */ _("h2", {
 				className: "text-sm font-semibold text-text-primary truncate",
-				children: G.title
+				children: K.title
 			})]
 		}), /* @__PURE__ */ v("div", {
 			className: "flex flex-1 min-h-0 relative",
 			children: [
 				/* @__PURE__ */ _("div", {
 					className: `
-          ${C ? "w-72" : "w-0"}
+          ${E ? "w-72" : "w-0"}
           flex-shrink-0
           bg-bg-surface
           border-r border-border-default
           transition-all duration-300
           overflow-hidden
         `,
-					children: C && /* @__PURE__ */ v("div", {
+					children: E && /* @__PURE__ */ v("div", {
 						className: "h-full flex flex-col",
 						children: [/* @__PURE__ */ v("div", {
 							className: "flex items-center justify-between p-3 border-b border-border-default",
@@ -338,7 +344,7 @@ var C = d(function() {
 								children: "Widgets"
 							}), /* @__PURE__ */ _("button", {
 								type: "button",
-								onClick: () => w(!1),
+								onClick: () => D(!1),
 								className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-text-primary\n                  hover:bg-bg-muted\n                ",
 								children: /* @__PURE__ */ _("svg", {
 									className: "w-4 h-4",
@@ -355,13 +361,16 @@ var C = d(function() {
 							})]
 						}), /* @__PURE__ */ _("div", {
 							className: "flex-1 overflow-auto",
-							children: /* @__PURE__ */ _(s, { onSelect: $ })
+							children: /* @__PURE__ */ _(l, {
+								onSelect: oe,
+								definitions: T
+							})
 						})]
 					})
 				}),
-				!C && /* @__PURE__ */ _("button", {
+				!E && /* @__PURE__ */ _("button", {
 					type: "button",
-					onClick: () => w(!0),
+					onClick: () => D(!0),
 					className: "\n            absolute left-0 top-1/2 -translate-y-1/2 z-20\n            w-8 h-24\n            bg-bg-surface\n            border border-l-0 border-border-default\n            rounded-r-lg\n            flex items-center justify-center\n            text-text-secondary\n            hover:text-text-primary\n            hover:bg-bg-muted\n            transition-colors\n          ",
 					title: "Open widget panel",
 					children: /* @__PURE__ */ _("svg", {
@@ -379,40 +388,40 @@ var C = d(function() {
 				}),
 				/* @__PURE__ */ _("div", {
 					className: "flex-1 relative",
-					children: /* @__PURE__ */ _(l, {
-						dashboardId: G.id,
-						pageId: k || G.pages?.[0]?.id,
-						title: G.title,
-						onPaste: Q,
-						onSave: te,
-						isSaving: T,
-						onExport: ne,
-						pages: G.pages.map((e) => ({
+					children: /* @__PURE__ */ _(ee, {
+						dashboardId: K.id,
+						pageId: A || K.pages?.[0]?.id,
+						title: K.title,
+						onPaste: ae,
+						onSave: $,
+						isSaving: re,
+						onExport: ce,
+						pages: K.pages.map((e) => ({
 							id: e.id,
 							name: e.title || `Page ${(e.index ?? 0) + 1}`,
 							order: e.index ?? 0
 						})),
-						activePageId: k || G.pages?.[0]?.id,
-						onPageChange: ie,
-						onPageAdd: ae,
-						onPageRename: oe,
-						onPageDuplicate: se,
-						onPageDelete: ce,
-						onPagesReorder: le,
+						activePageId: A || K.pages?.[0]?.id,
+						onPageChange: ue,
+						onPageAdd: de,
+						onPageRename: fe,
+						onPageDuplicate: pe,
+						onPageDelete: me,
+						onPagesReorder: he,
 						showPageTabs: !0
 					})
 				}),
-				/* @__PURE__ */ _(u, {
-					isOpen: D,
-					dashboardId: G.id,
-					dashboardName: G.title,
-					onClose: re
+				/* @__PURE__ */ _(d, {
+					isOpen: ie,
+					dashboardId: K.id,
+					dashboardName: K.title,
+					onClose: le
 				})
 			]
 		})]
 	});
 });
 //#endregion
-export { C as DashboardBuilderPage, C as default };
+export { S as DashboardBuilderPage, S as default };
 
 //# sourceMappingURL=DashboardBuilderPage.js.map