@burdenoff/microfe-bigconsole 2026.729.2 → 2026.729.4

package/dist/bigconsole/components/widgets/PropertiesPanel.js

@@ -4,27 +4,28 @@ import { getWidgetDefinition as t } from "./WidgetRegistry.js";
 import n from "../../hooks/useWidgetOperations.js";
 import r from "../../hooks/useDrilldownOperations.js";
 import i from "../../hooks/useWidgetActions.js";
-import a from "../../hooks/useDataSinkOperations.js";
-import o from "../../hooks/useParserOperations.js";
+import a from "../../hooks/useEventWebhooks.js";
+import o from "../../hooks/useDataSinkOperations.js";
+import s from "../../hooks/useParserOperations.js";
 import "../../hooks/index.js";
-import { getWidgetBinding as s, getWidgetBindingStatus as c, reconcilePanelConfig as ee, serializeWidgetBinding as te } from "../../utils/widgetBinding.js";
-import ne from "./ActionConfigDialog.js";
-import re from "./webhook-config/WebhookConfigPanel.js";
+import { getWidgetBinding as c, getWidgetBindingStatus as ee, reconcilePanelConfig as te, serializeWidgetBinding as ne } from "../../utils/widgetBinding.js";
+import re from "./ActionConfigDialog.js";
+import ie from "./webhook-config/WebhookConfigPanel.js";
 import "./webhook-config/index.js";
-import ie from "./event-logs/EventLogViewer.js";
+import ae from "./event-logs/EventLogViewer.js";
 import "./event-logs/index.js";
-import ae from "./DrilldownConfigPanel.js";
-import { AdvancedSection as oe } from "../builder/inspector/AdvancedSection.js";
-import { AppearanceSection as se } from "../builder/inspector/AppearanceSection.js";
-import { GeneralSection as ce } from "../builder/inspector/GeneralSection.js";
-import { DataBindingSection as le } from "../builder/inspector/DataBindingSection.js";
+import oe from "./DrilldownConfigPanel.js";
+import { AdvancedSection as se } from "../builder/inspector/AdvancedSection.js";
+import { AppearanceSection as ce } from "../builder/inspector/AppearanceSection.js";
+import { GeneralSection as le } from "../builder/inspector/GeneralSection.js";
+import { DataBindingSection as ue } from "../builder/inspector/DataBindingSection.js";
 import "../builder/inspector/index.js";
-import { memo as l, useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
-import { Check as m, ChevronDown as ue, ChevronUp as de, ExternalLink as h, Info as fe, Pencil as pe, Plus as me, Trash2 as he, X as g } from "lucide-react";
-import { Button as _, Card as ge, CardContent as _e, Input as v, Label as y, Select as b, SelectContent as x, SelectItem as S, SelectTrigger as C, SelectValue as w, Sheet as ve, SheetContent as ye, SheetDescription as be, SheetHeader as xe, SheetTitle as Se, Spinner as T, Tabs as Ce, TabsContent as E, TabsList as we, TabsTrigger as D, Textarea as O } from "@burdenoff/fe-libs/ui";
-import { Fragment as Te, jsx as k, jsxs as A } from "react/jsx-runtime";
+import { memo as l, useCallback as u, useEffect as d, useMemo as de, useRef as fe, useState as f } from "react";
+import { Check as p, ChevronDown as pe, ChevronUp as me, ExternalLink as m, Info as h, Pencil as he, Plus as ge, Trash2 as _e, X as ve } from "lucide-react";
+import { Button as g, Card as ye, CardContent as be, Input as _, Label as v, Select as xe, SelectContent as Se, SelectItem as y, SelectTrigger as b, SelectValue as x, Sheet as Ce, SheetContent as we, SheetDescription as Te, SheetHeader as Ee, SheetTitle as De, Spinner as Oe, Tabs as ke, TabsContent as S, TabsList as Ae, TabsTrigger as C, Textarea as w } from "@burdenoff/fe-libs/ui";
+import { Fragment as je, jsx as T, jsxs as E } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/PropertiesPanel.tsx
-var Ee = [
+var Me = [
 	{
 		value: "BIGCONSOLE",
 		label: "BigConsole Native",
@@ -45,7 +46,7 @@ var Ee = [
 		label: "Custom",
 		description: "Custom React component"
 	}
-], De = [
+], Ne = [
 	{
 		value: "DATASINK",
 		label: "DataSink",
@@ -76,14 +77,18 @@ var Ee = [
 		label: "Sample JSON",
 		description: "Manually enter sample JSON data"
 	}
-], Oe = {
+];
+function Pe(e) {
+	return `widget:${e.toLowerCase().replace(/\s+/g, "_")}:clicked`;
+}
+var Fe = {
 	PRIMARY: "bg-action-primary",
 	SECONDARY: "bg-muted-foreground",
 	SUCCESS: "bg-status-success-bg",
 	WARNING: "bg-status-warning-bg",
 	DANGER: "bg-status-error-bg"
 };
-function ke(e) {
+function Ie(e) {
 	if (!e) return {};
 	let t = Array.isArray(e) ? e[0] : e;
 	if (!t || typeof t != "object") return {};
@@ -127,8 +132,8 @@ function ke(e) {
 		xAxisField: a
 	};
 }
-var Ae = l(function({ widget: e, onSave: t }) {
-	let [n, r] = p(""), [i, a] = p(null), o = f(!1);
+var Le = l(function({ widget: e, onSave: t }) {
+	let [n, r] = f(""), [i, a] = f(null), o = fe(!1);
 	d(() => {
 		try {
 			r(e.template && typeof e.template == "object" ? JSON.stringify(e.template, null, 2) : ""), a(null), o.current = !0;
@@ -153,27 +158,27 @@ var Ae = l(function({ widget: e, onSave: t }) {
 			a(e.message);
 		}
 	}, [n, t]);
-	return /* @__PURE__ */ A("div", {
+	return /* @__PURE__ */ E("div", {
 		style: {
 			paddingTop: "var(--space-formGap)",
 			borderTop: "1px solid var(--color-border)"
 		},
 		children: [
-			/* @__PURE__ */ A("div", {
+			/* @__PURE__ */ E("div", {
 				style: {
 					display: "flex",
 					alignItems: "center",
 					justifyContent: "space-between",
 					marginBottom: "var(--space-controlGap)"
 				},
-				children: [/* @__PURE__ */ k("label", {
+				children: [/* @__PURE__ */ T("label", {
 					style: {
 						fontSize: "var(--font-size-body-sm)",
 						fontWeight: "var(--font-weight-semibold)",
 						color: "var(--color-text-primary)"
 					},
 					children: "Template (JSON)"
-				}), i && /* @__PURE__ */ k("span", {
+				}), i && /* @__PURE__ */ T("span", {
 					style: {
 						fontSize: "var(--font-size-body-sm)",
 						color: "var(--color-status-error-text)",
@@ -182,7 +187,7 @@ var Ae = l(function({ widget: e, onSave: t }) {
 					children: "Invalid JSON"
 				})]
 			}),
-			/* @__PURE__ */ k(O, {
+			/* @__PURE__ */ T(w, {
 				value: n,
 				onChange: s,
 				spellCheck: !1,
@@ -195,7 +200,7 @@ var Ae = l(function({ widget: e, onSave: t }) {
 					resize: "vertical"
 				}
 			}),
-			i && /* @__PURE__ */ k("p", {
+			i && /* @__PURE__ */ T("p", {
 				style: {
 					fontSize: "var(--font-size-body-sm)",
 					color: "var(--color-status-error-text)",
@@ -206,14 +211,14 @@ var Ae = l(function({ widget: e, onSave: t }) {
 				},
 				children: i
 			}),
-			/* @__PURE__ */ A("div", {
+			/* @__PURE__ */ E("div", {
 				style: {
 					display: "flex",
 					alignItems: "center",
 					gap: "var(--space-controlGap)",
 					marginTop: "var(--space-controlGap)"
 				},
-				children: [/* @__PURE__ */ k(_, {
+				children: [/* @__PURE__ */ T(g, {
 					variant: "outline",
 					size: "sm",
 					onClick: c,
@@ -223,7 +228,7 @@ var Ae = l(function({ widget: e, onSave: t }) {
 						fontWeight: "var(--font-weight-semibold)"
 					},
 					children: "Format"
-				}), !i && n.trim() !== "" && /* @__PURE__ */ A("span", {
+				}), !i && n.trim() !== "" && /* @__PURE__ */ E("span", {
 					style: {
 						fontSize: "var(--font-size-body-sm)",
 						color: "var(--color-status-success-text)",
@@ -231,13 +236,13 @@ var Ae = l(function({ widget: e, onSave: t }) {
 						alignItems: "center",
 						gap: "4px"
 					},
-					children: [/* @__PURE__ */ k(m, { style: {
+					children: [/* @__PURE__ */ T(p, { style: {
 						width: "12px",
 						height: "12px"
 					} }), "Valid JSON"]
 				})]
 			}),
-			/* @__PURE__ */ A("div", {
+			/* @__PURE__ */ E("div", {
 				style: {
 					display: "flex",
 					alignItems: "center",
@@ -249,11 +254,11 @@ var Ae = l(function({ widget: e, onSave: t }) {
 					borderTop: "1px solid var(--color-border)"
 				},
 				children: [
-					/* @__PURE__ */ k("span", {
+					/* @__PURE__ */ T("span", {
 						style: { fontWeight: "var(--font-weight-medium)" },
 						children: "Ctrl+S to save"
 					}),
-					e.renderer === "ADAPTIVE_CARD" && /* @__PURE__ */ A("a", {
+					e.renderer === "ADAPTIVE_CARD" && /* @__PURE__ */ E("a", {
 						href: "https://adaptivecards.io/designer/",
 						target: "_blank",
 						rel: "noopener noreferrer",
@@ -266,12 +271,12 @@ var Ae = l(function({ widget: e, onSave: t }) {
 							fontWeight: "var(--font-weight-medium)",
 							textDecoration: "none"
 						},
-						children: ["Designer", /* @__PURE__ */ k(h, { style: {
+						children: ["Designer", /* @__PURE__ */ T(m, { style: {
 							height: "var(--size-icon-sm)",
 							width: "var(--size-icon-sm)"
 						} })]
 					}),
-					e.renderer === "BLOCKKIT" && /* @__PURE__ */ A("a", {
+					e.renderer === "BLOCKKIT" && /* @__PURE__ */ E("a", {
 						href: "https://app.slack.com/block-kit-builder",
 						target: "_blank",
 						rel: "noopener noreferrer",
@@ -284,7 +289,7 @@ var Ae = l(function({ widget: e, onSave: t }) {
 							fontWeight: "var(--font-weight-medium)",
 							textDecoration: "none"
 						},
-						children: ["Block Kit Builder", /* @__PURE__ */ k(h, { style: {
+						children: ["Block Kit Builder", /* @__PURE__ */ T(m, { style: {
 							height: "var(--size-icon-sm)",
 							width: "var(--size-icon-sm)"
 						} })]
@@ -294,8 +299,8 @@ var Ae = l(function({ widget: e, onSave: t }) {
 		]
 	});
 });
-function je(e) {
-	let t = e, n = s({
+function Re(e) {
+	let t = e, n = c({
 		dataSinkId: t.dataSinkId,
 		parserId: t.parserId,
 		config: e.config || {}
@@ -322,194 +327,252 @@ function je(e) {
 		} : void 0
 	};
 }
-var Me = l(function({ isOpen: l, onClose: h }) {
-	let [Me, Ne] = p("general"), [j, M] = p("idle"), [N, P] = p(null), [F, I] = p(!1), L = e((e) => e.selectedWidgetId), Pe = e((e) => e.widgets), R = e((e) => e.updateWidget), z = L ? Pe.get(L) : void 0, Fe = f(null), B = f({});
+var ze = l(function({ isOpen: l, onClose: m }) {
+	let [ze, Be] = f("general"), [D, O] = f("idle"), [k, A] = f(null), [j, M] = f(!1), N = e((e) => e.selectedWidgetId), Ve = e((e) => e.widgets), P = e((e) => e.updateWidget), F = N ? Ve.get(N) : void 0, I = fe(null), He = fe({});
 	d(() => {
-		if (!L) {
-			Fe.current = null, P(null), I(!1), M("idle");
+		if (!N) {
+			I.current = null, A(null), M(!1), O("idle");
 			return;
 		}
-		let e = Fe.current !== L;
-		if (Fe.current = L, z) {
-			if (F && !e) return;
-			P(je(z)), B.current = z.config || {}, I(!1), M("idle");
-		} else P(null), I(!1), M("idle");
+		let e = I.current !== N;
+		if (I.current = N, F) {
+			if (j && !e) return;
+			A(Re(F)), He.current = F.config || {}, M(!1), O("idle");
+		} else A(null), M(!1), O("idle");
 	}, [
-		L,
-		z,
-		F
+		N,
+		F,
+		j
 	]);
-	let { updateWidget: Ie } = n(z?.pageId, z?.dashboardId, { skipFetch: !0 }), { createDrilldown: Le, updateDrilldown: Re, deleteDrilldown: ze } = r(), { dataSinks: V } = a({ skipFetch: !1 }), [Be, H] = p(null), { executeParser: Ve } = o({
-		consoleId: z?.dashboardId,
+	let { updateWidget: Ue } = n(F?.pageId, F?.dashboardId, { skipFetch: !0 }), { createDrilldown: We, updateDrilldown: Ge, deleteDrilldown: Ke } = r(), { dataSinks: L } = o({ skipFetch: !1 }), [qe, Je] = f(null), { executeParser: Ye } = s({
+		consoleId: F?.dashboardId,
 		skipFetch: !0
-	}), [He, U] = p(!1), [Ue, W] = p(void 0), [We, G] = p(!1), [Ge, K] = p(null);
+	}), [Xe, Ze] = f(!1), [Qe, R] = f(void 0), [$e, z] = f(!1), [et, B] = f(null);
 	d(() => {
-		W(void 0), G(!1), K(null), U(!1);
-	}, [L]);
-	let { actions: q, loading: J, createAction: Ke, updateAction: qe, deleteAction: Je, reorderActions: Y } = i(L || void 0), [Ye, X] = p(!1), [Xe, Z] = p(void 0), [Ze, Qe] = p(!1), $e = u(() => {
-		Z(void 0), X(!0);
-	}, []), et = u((e) => {
-		Z(e), X(!0);
-	}, []), tt = u(async (e) => {
-		if (L) {
-			Qe(!0);
+		R(void 0), z(!1), B(null), Ze(!1);
+	}, [N]);
+	let { actions: V, loading: H, createAction: tt, updateAction: nt, deleteAction: rt, reorderActions: U } = i(N || void 0), { webhooks: it, loading: at, createWebhook: ot, updateWebhook: st, deleteWebhook: W, refetch: ct } = a({
+		widgetId: N || void 0,
+		skipFetch: !N
+	}), G = u((e, t) => {
+		let n = Pe(t);
+		return e.find((e) => e.widgetId === N && e.eventPattern === n) ?? null;
+	}, [N]), K = u((e) => G(it, e), [G, it]), lt = u(async (e, t) => {
+		if (!N || t === void 0) return !0;
+		let n = Pe(e), r = K(e);
+		return !r && at && (r = G((await ct())?.data?.listEventWebhookMappings ?? [], e)), t && t.url ? r ? await st({
+			id: r.id,
+			eventPattern: n,
+			webhookUrl: t.url,
+			method: t.method,
+			isActive: !0
+		}) !== null : await ot({
+			widgetId: N,
+			eventPattern: n,
+			webhookUrl: t.url,
+			method: t.method
+		}) !== null : t === null && r ? W(r.id) : !0;
+	}, [
+		N,
+		K,
+		at,
+		ct,
+		G,
+		ot,
+		st,
+		W
+	]), [ut, q] = f(!1), [J, Y] = f(void 0), [dt, ft] = f(!1), [pt, X] = f(void 0), [mt, Z] = f(null), ht = de(() => {
+		if (!J) return null;
+		let e = K(J.name);
+		return e ? {
+			url: e.webhookUrl,
+			method: e.method
+		} : null;
+	}, [J, K]), gt = pt === void 0 ? ht : pt, _t = de(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of V) {
+			let n = K(t.name);
+			n && e.set(t.name, n);
+		}
+		return e;
+	}, [V, K]), vt = u(() => {
+		X(void 0), Z(null), Y(void 0), q(!0);
+	}, []), yt = u((e) => {
+		X(void 0), Z(null), Y(e), q(!0);
+	}, []), bt = u(async (e, t) => {
+		if (N) {
+			ft(!0), Z(null);
 			try {
-				let t = null;
-				if (t = "id" in e ? await qe(e) : await Ke(e), t) {
-					let n = [...q];
-					if ("id" in e) {
-						let r = n.findIndex((t) => t.id === e.id);
-						r >= 0 && (n[r] = t);
-					} else n.push(t);
-					R(L, { actions: n.sort((e, t) => e.order - t.order) });
+				let n = "id" in e && !!e.id, r = null;
+				if (r = n ? await nt(e) : await tt(e), r) {
+					let e = [...V];
+					if (n) {
+						let t = e.findIndex((e) => e.id === r?.id);
+						t >= 0 && (e[t] = r);
+					} else e.push(r);
+					if (P(N, { actions: e.sort((e, t) => e.order - t.order) }), !await lt(r.name, t)) {
+						X(t), Z(t ? "The button was saved, but its webhook could not be saved. Check the URL and try again." : "The button was saved, but its old webhook could not be removed. Try again."), Y(r);
+						return;
+					}
+					X(void 0), Z(null), q(!1), Y(void 0);
 				}
-				X(!1), Z(void 0);
-			} catch {} finally {
-				Qe(!1);
+			} catch (e) {
+				console.warn("Failed to save widget action:", e), Z(e instanceof Error ? e.message : "Could not save the button. Please try again.");
+			} finally {
+				ft(!1);
 			}
 		}
 	}, [
-		L,
-		q,
-		Ke,
-		qe,
-		R
-	]), nt = u(async (e) => {
-		L && window.confirm("Are you sure you want to delete this action?") && await Je(e) && R(L, { actions: q.filter((t) => t.id !== e) });
+		N,
+		V,
+		tt,
+		nt,
+		P,
+		lt
+	]), xt = u(async (e) => {
+		if (N && window.confirm("Are you sure you want to delete this action?")) {
+			let t = V.find((t) => t.id === e);
+			if (await rt(e) && (P(N, { actions: V.filter((t) => t.id !== e) }), t)) {
+				let e = K(t.name);
+				e && await W(e.id);
+			}
+		}
 	}, [
-		L,
-		q,
-		Je,
-		R
-	]), rt = u(async (e) => {
-		if (!L || e === 0) return;
-		let t = [...q].sort((e, t) => e.order - t.order), n = t.map((e) => e.id);
-		[n[e - 1], n[e]] = [n[e], n[e - 1]], await Y(n) && R(L, { actions: t.map((e, t) => ({
+		N,
+		V,
+		rt,
+		P,
+		K,
+		W
+	]), St = u(async (e) => {
+		if (!N || e === 0) return;
+		let t = [...V].sort((e, t) => e.order - t.order), n = t.map((e) => e.id);
+		[n[e - 1], n[e]] = [n[e], n[e - 1]], await U(n) && P(N, { actions: t.map((e, t) => ({
 			...e,
 			order: n.indexOf(e.id)
 		})).sort((e, t) => e.order - t.order) });
 	}, [
-		L,
-		q,
-		Y,
-		R
-	]), it = u(async (e) => {
-		if (!L) return;
-		let t = [...q].sort((e, t) => e.order - t.order);
+		N,
+		V,
+		U,
+		P
+	]), Ct = u(async (e) => {
+		if (!N) return;
+		let t = [...V].sort((e, t) => e.order - t.order);
 		if (e === t.length - 1) return;
 		let n = t.map((e) => e.id);
-		[n[e], n[e + 1]] = [n[e + 1], n[e]], await Y(n) && R(L, { actions: t.map((e, t) => ({
+		[n[e], n[e + 1]] = [n[e + 1], n[e]], await U(n) && P(N, { actions: t.map((e, t) => ({
 			...e,
 			order: n.indexOf(e.id)
 		})).sort((e, t) => e.order - t.order) });
 	}, [
-		L,
-		q,
-		Y,
-		R
+		N,
+		V,
+		U,
+		P
 	]);
 	d(() => {
-		L && q.length >= 0 && !J && R(L, { actions: q });
+		N && V.length >= 0 && !H && P(N, { actions: V });
 	}, [
-		L,
-		q,
-		J,
-		R
+		N,
+		V,
+		H,
+		P
 	]);
 	let Q = u((e, t) => {
-		P((n) => n && {
+		A((n) => n && {
 			...n,
 			[e]: t
-		}), I(!0);
+		}), M(!0);
 	}, []), $ = u((e) => {
-		P((t) => t && {
+		A((t) => t && {
 			...t,
 			config: e
-		}), I(!0);
+		}), M(!0);
 	}, []);
 	d(() => {
-		if (N?.dataSinkId && V.length > 0) {
-			let e = V.find((e) => e.id === N.dataSinkId);
-			e && H(e.key);
-		} else H(null);
-	}, [N?.dataSinkId, V]);
-	let at = u((e) => {
-		if (W(void 0), G(!1), K(null), H(e), e) {
-			let t = V.find((t) => t.key === e);
-			t && (Q("dataSinkId", t.id), P((t) => t && {
+		if (k?.dataSinkId && L.length > 0) {
+			let e = L.find((e) => e.id === k.dataSinkId);
+			e && Je(e.key);
+		} else Je(null);
+	}, [k?.dataSinkId, L]);
+	let wt = u((e) => {
+		if (R(void 0), z(!1), B(null), Je(e), e) {
+			let t = L.find((t) => t.key === e);
+			t && (Q("dataSinkId", t.id), A((t) => t && {
 				...t,
 				config: {
 					...t.config,
 					dataSinkKey: e
 				}
-			}), I(!0));
-		} else Q("dataSinkId", void 0), P((e) => e && {
+			}), M(!0));
+		} else Q("dataSinkId", void 0), A((e) => e && {
 			...e,
 			config: {
 				...e.config,
 				dataSinkKey: void 0
 			},
 			parserId: void 0
-		}), I(!0);
-	}, [V, Q]), ot = u(async (e) => {
-		if (Q("parserId", e || void 0), W(void 0), G(!1), K(null), e && z) {
-			U(!0);
+		}), M(!0);
+	}, [L, Q]), Tt = u(async (e) => {
+		if (Q("parserId", e || void 0), R(void 0), z(!1), B(null), e && F) {
+			Ze(!0);
 			try {
-				let t = await Ve(e);
+				let t = await Ye(e);
 				if (t?.success) {
-					W(t.output), G(!0);
-					let e = ke(t.output);
-					(e.labelField || e.valueField) && (P((t) => {
+					R(t.output), z(!0);
+					let e = Ie(t.output);
+					(e.labelField || e.valueField) && (A((t) => {
 						if (!t) return t;
 						let n = t.config || {}, r = { ...n };
 						return e.labelField && !n.labelField && (r.labelField = e.labelField), e.valueField && !n.valueField && (r.valueField = e.valueField), e.xAxisField && !n.xAxisField && (r.xAxisField = e.xAxisField), {
 							...t,
 							config: r
 						};
-					}), I(!0));
-				} else G(!0), K(t?.error || "The parser could not produce a preview.");
+					}), M(!0));
+				} else z(!0), B(t?.error || "The parser could not produce a preview.");
 			} catch (e) {
-				G(!0), K(e instanceof Error ? e.message : "The parser could not produce a preview."), console.warn("Failed to auto-detect parser fields:", e);
+				z(!0), B(e instanceof Error ? e.message : "The parser could not produce a preview."), console.warn("Failed to auto-detect parser fields:", e);
 			} finally {
-				U(!1);
+				Ze(!1);
 			}
 		}
 	}, [
 		Q,
-		Ve,
-		z
-	]), st = u(async () => {
-		if (!(!z || !N)) {
-			M("saving");
+		Ye,
+		F
+	]), Et = u(async () => {
+		if (!(!F || !k)) {
+			O("saving");
 			try {
 				let t = {
-					...z.metadata || {},
-					description: N.description || ""
-				}, n = ee(e.getState().widgets.get(z.id)?.config ?? {}, B.current, N.config), r = te(s({
-					dataSinkId: N.dataSinkId,
-					parserId: N.parserId,
+					...F.metadata || {},
+					description: k.description || ""
+				}, n = te(e.getState().widgets.get(F.id)?.config ?? {}, He.current, k.config), r = ne(c({
+					dataSinkId: k.dataSinkId,
+					parserId: k.parserId,
 					config: {
 						...n,
 						binding: void 0
 					}
-				}), n), i = await Ie({
-					id: z.id,
-					title: N.title,
-					renderer: N.renderer,
-					template: N.template,
+				}), n), i = await Ue({
+					id: F.id,
+					title: k.title,
+					renderer: k.renderer,
+					template: k.template,
 					config: r.config,
-					refreshInterval: N.refreshInterval,
+					refreshInterval: k.refreshInterval,
 					dataSinkId: r.dataSinkId,
-					datasetId: N.datasetId,
+					datasetId: k.datasetId,
 					parserId: r.parserId,
-					parserRules: N.parserRules,
+					parserRules: k.parserRules,
 					metadata: t
-				}), a = z.drilldown;
-				if (N.drilldownConfig) {
-					let { enabled: e, targetDashboardId: t, navigationMode: n, parameterMapping: r, passGlobalFilters: i, maxDepth: o, openIn: s } = N.drilldownConfig;
-					if (z.drilldown?.id) {
-						let c = await Re({
-							id: z.drilldown.id,
+				}), a = F.drilldown;
+				if (k.drilldownConfig) {
+					let { enabled: e, targetDashboardId: t, navigationMode: n, parameterMapping: r, passGlobalFilters: i, maxDepth: o, openIn: s } = k.drilldownConfig;
+					if (F.drilldown?.id) {
+						let c = await Ge({
+							id: F.drilldown.id,
 							targetDashboardId: t,
 							parameterMapping: r,
 							navigationMode: n,
@@ -520,8 +583,8 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 						});
 						c && (a = c);
 					} else if (t) {
-						let c = await Le({
-							sourceWidgetId: z.id,
+						let c = await We({
+							sourceWidgetId: F.id,
 							targetDashboardId: t,
 							parameterMapping: r || {},
 							navigationMode: n,
@@ -534,48 +597,48 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 							enabled: e
 						});
 					}
-				} else z.drilldown?.id && !N.drilldownConfig && (await ze(z.drilldown.id), a = void 0);
-				i ? (R(z.id, {
-					title: N.title,
-					description: N.description,
-					renderer: N.renderer,
-					template: N.template,
+				} else F.drilldown?.id && !k.drilldownConfig && (await Ke(F.drilldown.id), a = void 0);
+				i ? (P(F.id, {
+					title: k.title,
+					description: k.description,
+					renderer: k.renderer,
+					template: k.template,
 					config: r.config,
-					refreshInterval: N.refreshInterval,
+					refreshInterval: k.refreshInterval,
 					dataSinkId: r.dataSinkId,
-					datasetId: N.datasetId,
+					datasetId: k.datasetId,
 					parserId: r.parserId,
-					parserRules: N.parserRules,
+					parserRules: k.parserRules,
 					drilldown: a,
 					updatedAt: (/* @__PURE__ */ new Date()).toISOString()
-				}), M("saved"), I(!1), setTimeout(() => M("idle"), 2e3)) : M("error");
+				}), O("saved"), M(!1), setTimeout(() => O("idle"), 2e3)) : O("error");
 			} catch {
-				M("error");
+				O("error");
 			}
 		}
 	}, [
-		z,
-		N,
-		Ie,
-		R,
-		Le,
-		Re,
-		ze
-	]), ct = u(() => {
-		z && (P(je(z)), B.current = z.config || {}, I(!1), M("idle"));
-	}, [z]), lt = u((e) => {
+		F,
+		k,
+		Ue,
+		P,
+		We,
+		Ge,
+		Ke
+	]), Dt = u(() => {
+		F && (A(Re(F)), He.current = F.config || {}, M(!1), O("idle"));
+	}, [F]), Ot = u((e) => {
 		$(e);
-	}, [$]), ut = u((e) => {
-		P((t) => t && {
+	}, [$]), kt = u((e) => {
+		A((t) => t && {
 			...t,
 			drilldownConfig: e
-		}), I(!0);
-	}, []), dt = z ? t(z.type) : null;
-	return /* @__PURE__ */ k(ve, {
+		}), M(!0);
+	}, []), At = F ? t(F.type) : null;
+	return /* @__PURE__ */ T(Ce, {
 		open: l,
-		onOpenChange: (e) => !e && h(),
+		onOpenChange: (e) => !e && m(),
 		modal: !1,
-		children: /* @__PURE__ */ A(ye, {
+		children: /* @__PURE__ */ E(we, {
 			style: {
 				width: "420px",
 				maxWidth: "90vw",
@@ -586,20 +649,20 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 				overflow: "hidden"
 			},
 			children: [
-				/* @__PURE__ */ k(xe, {
+				/* @__PURE__ */ T(Ee, {
 					style: {
 						padding: "var(--space-cardPadding)",
 						borderBottom: "1px solid var(--color-border)",
 						backgroundColor: "var(--color-bg-surface)",
 						flexShrink: 0
 					},
-					children: /* @__PURE__ */ A("div", {
+					children: /* @__PURE__ */ E("div", {
 						style: {
 							display: "flex",
 							alignItems: "center",
 							gap: "var(--space-controlGap)"
 						},
-						children: [/* @__PURE__ */ k("div", {
+						children: [/* @__PURE__ */ T("div", {
 							style: {
 								display: "flex",
 								height: "var(--size-controlHeight-lg)",
@@ -611,62 +674,62 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								boxShadow: "var(--shadow-elevation-2)",
 								flexShrink: 0
 							},
-							children: /* @__PURE__ */ k(fe, { style: {
+							children: /* @__PURE__ */ T(h, { style: {
 								height: "var(--size-icon-md)",
 								width: "var(--size-icon-md)",
 								color: "var(--color-action-primary-text)"
 							} })
-						}), /* @__PURE__ */ A("div", {
+						}), /* @__PURE__ */ E("div", {
 							style: {
 								flex: 1,
 								minWidth: 0
 							},
-							children: [/* @__PURE__ */ A("div", {
+							children: [/* @__PURE__ */ E("div", {
 								style: {
 									display: "flex",
 									alignItems: "center",
 									gap: "var(--space-iconGap)"
 								},
 								children: [
-									/* @__PURE__ */ k(Se, {
+									/* @__PURE__ */ T(De, {
 										style: {
 											fontSize: "var(--font-size-body-md)",
 											fontWeight: "var(--font-weight-bold)",
 											color: "var(--color-text-primary)",
 											margin: 0
 										},
-										children: z ? "Widget Properties" : "Properties"
+										children: F ? "Widget Properties" : "Properties"
 									}),
-									j === "saving" && /* @__PURE__ */ k(T, { style: {
+									D === "saving" && /* @__PURE__ */ T(Oe, { style: {
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)"
 									} }),
-									j === "saved" && /* @__PURE__ */ k(m, { style: {
+									D === "saved" && /* @__PURE__ */ T(p, { style: {
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)",
 										color: "var(--color-status-success-bg)"
 									} }),
-									j === "error" && /* @__PURE__ */ k(g, { style: {
+									D === "error" && /* @__PURE__ */ T(ve, { style: {
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)",
 										color: "var(--color-status-error-bg)"
 									} })
 								]
-							}), dt && /* @__PURE__ */ k(be, {
+							}), At && /* @__PURE__ */ T(Te, {
 								style: {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-text-secondary)",
 									margin: "var(--space-controlGap) 0 0 0",
 									fontWeight: "var(--font-weight-medium)"
 								},
-								children: dt.name
+								children: At.name
 							})]
 						})]
 					})
 				}),
-				z ? /* @__PURE__ */ A(Ce, {
-					value: Me,
-					onValueChange: (e) => Ne(e),
+				F ? /* @__PURE__ */ E(ke, {
+					value: ze,
+					onValueChange: (e) => Be(e),
 					style: {
 						flex: 1,
 						display: "flex",
@@ -674,7 +737,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 						minHeight: 0,
 						overflow: "hidden"
 					},
-					children: [/* @__PURE__ */ A(we, {
+					children: [/* @__PURE__ */ E(Ae, {
 						style: {
 							width: "100%",
 							display: "flex",
@@ -689,7 +752,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 							overflowX: "auto"
 						},
 						children: [
-							/* @__PURE__ */ k(D, {
+							/* @__PURE__ */ T(C, {
 								value: "general",
 								style: {
 									fontWeight: "var(--font-weight-semibold)",
@@ -699,7 +762,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								},
 								children: "General"
 							}),
-							/* @__PURE__ */ k(D, {
+							/* @__PURE__ */ T(C, {
 								value: "data",
 								style: {
 									fontWeight: "var(--font-weight-semibold)",
@@ -709,7 +772,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								},
 								children: "Data"
 							}),
-							/* @__PURE__ */ k(D, {
+							/* @__PURE__ */ T(C, {
 								value: "advanced",
 								style: {
 									fontWeight: "var(--font-weight-semibold)",
@@ -719,7 +782,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								},
 								children: "Advanced"
 							}),
-							/* @__PURE__ */ k(D, {
+							/* @__PURE__ */ T(C, {
 								value: "appearance",
 								style: {
 									fontWeight: "var(--font-weight-semibold)",
@@ -730,7 +793,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								children: "Style"
 							})
 						]
-					}), /* @__PURE__ */ A("div", {
+					}), /* @__PURE__ */ E("div", {
 						style: {
 							flex: 1,
 							overflow: "auto",
@@ -738,83 +801,83 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 							minHeight: 0
 						},
 						children: [
-							/* @__PURE__ */ k(E, {
+							/* @__PURE__ */ T(S, {
 								value: "general",
 								className: "mt-0",
-								children: N && /* @__PURE__ */ k("div", {
+								children: k && /* @__PURE__ */ T("div", {
 									style: {
 										display: "flex",
 										flexDirection: "column",
 										gap: "var(--space-formGap)"
 									},
-									children: /* @__PURE__ */ k(ce, {
-										title: N.title,
-										description: N.description,
-										refreshInterval: N.refreshInterval,
+									children: /* @__PURE__ */ T(le, {
+										title: k.title,
+										description: k.description,
+										refreshInterval: k.refreshInterval,
 										onTitleChange: (e) => Q("title", e),
 										onDescriptionChange: (e) => Q("description", e),
 										onRefreshIntervalChange: (e) => Q("refreshInterval", e)
 									})
 								})
 							}),
-							/* @__PURE__ */ k(E, {
+							/* @__PURE__ */ T(S, {
 								value: "data",
 								className: "mt-0 space-y-4",
-								children: N && /* @__PURE__ */ A(Te, { children: [
+								children: k && /* @__PURE__ */ E(je, { children: [
 									(() => {
-										let e = s({
-											dataSinkId: N.dataSinkId,
-											parserId: N.parserId,
+										let e = c({
+											dataSinkId: k.dataSinkId,
+											parserId: k.parserId,
 											config: {
-												...N.config,
+												...k.config,
 												binding: void 0
 											}
-										}), t = c({
+										}), t = ee({
 											binding: e,
-											loading: He,
-											error: Ge,
-											preview: Ue,
-											previewComplete: We
+											loading: Xe,
+											error: et,
+											preview: Qe,
+											previewComplete: $e
 										});
-										return /* @__PURE__ */ k(le, {
-											consoleId: z?.dashboardId || "",
+										return /* @__PURE__ */ T(ue, {
+											consoleId: F?.dashboardId || "",
 											binding: e,
-											dataSinkKey: Be,
-											dataPath: typeof N.config.dataPath == "string" ? N.config.dataPath : void 0,
+											dataSinkKey: qe,
+											dataPath: typeof k.config.dataPath == "string" ? k.config.dataPath : void 0,
 											status: t.status,
 											missingFields: t.missingFields,
-											preview: Ue,
-											error: Ge,
-											onDataSinkChange: at,
-											onParserChange: ot,
+											preview: Qe,
+											error: et,
+											onDataSinkChange: wt,
+											onParserChange: Tt,
 											onDataPathChange: (e) => $({
-												...N.config,
+												...k.config,
 												dataPath: e
 											})
 										});
 									})(),
-									/* @__PURE__ */ k("div", {
+									/* @__PURE__ */ T("div", {
 										className: "border-t border-border-subtle pt-4",
-										children: /* @__PURE__ */ k(y, {
+										children: /* @__PURE__ */ T(v, {
 											className: "text-xs text-text-secondary uppercase tracking-wide",
 											children: "Alternative Data Sources"
 										})
 									}),
-									/* @__PURE__ */ A("div", {
+									/* @__PURE__ */ E("div", {
 										className: "space-y-2",
-										children: [/* @__PURE__ */ k(y, { children: "Data Source Type" }), /* @__PURE__ */ A(b, {
-											value: N.config?.dataSourceType || "",
+										children: [/* @__PURE__ */ T(v, { children: "Data Source Type" }), /* @__PURE__ */ E(xe, {
+											value: k.config?.dataSourceType || "",
 											onValueChange: (e) => $({
-												...N.config,
+												...k.config,
 												dataSourceType: e || void 0
 											}),
-											children: [/* @__PURE__ */ k(C, {
+											children: [/* @__PURE__ */ T(b, {
 												style: {
 													height: "var(--size-controlHeight-md)",
 													fontSize: "var(--font-size-body-sm)"
 												},
-												children: /* @__PURE__ */ k(w, { placeholder: "Select type..." })
-											}), /* @__PURE__ */ k(x, {
+												children: /* @__PURE__ */ T(x, { placeholder: "Select type..." })
+											}), /* @__PURE__ */ T(Se, {
 												position: "popper",
 												side: "bottom",
 												sideOffset: 4,
@@ -827,56 +890,56 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													boxShadow: "var(--shadow-elevation-3)",
 													borderRadius: "var(--radius-button)"
 												},
-												children: De.map((e) => /* @__PURE__ */ k(S, {
+												children: Ne.map((e) => /* @__PURE__ */ T(y, {
 													value: e.value,
 													children: e.label
 												}, e.value))
 											})]
 										})]
 									}),
-									N.config?.dataSourceType === "REST_API" && /* @__PURE__ */ A("div", {
+									k.config?.dataSourceType === "REST_API" && /* @__PURE__ */ E("div", {
 										className: "space-y-3",
 										children: [
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Endpoint URL *" }), /* @__PURE__ */ k(v, {
-													value: N.config?.endpointUrl || "",
+												children: [/* @__PURE__ */ T(v, { children: "Endpoint URL *" }), /* @__PURE__ */ T(_, {
+													value: k.config?.endpointUrl || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														endpointUrl: e.target.value || void 0
 													}),
 													placeholder: "https://api.example.com/data"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "HTTP Method" }), /* @__PURE__ */ A(b, {
-													value: N.config?.httpMethod || "GET",
+												children: [/* @__PURE__ */ T(v, { children: "HTTP Method" }), /* @__PURE__ */ E(xe, {
+													value: k.config?.httpMethod || "GET",
 													onValueChange: (e) => $({
-														...N.config,
+														...k.config,
 														httpMethod: e
 													}),
-													children: [/* @__PURE__ */ k(C, {
+													children: [/* @__PURE__ */ T(b, {
 														style: { height: "var(--size-controlHeight-md)" },
-														children: /* @__PURE__ */ k(w, {})
-													}), /* @__PURE__ */ A(x, {
+														children: /* @__PURE__ */ T(x, {})
+													}), /* @__PURE__ */ E(Se, {
 														position: "popper",
 														side: "bottom",
 														sideOffset: 4,
 														children: [
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "GET",
 																children: "GET"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "POST",
 																children: "POST"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "PUT",
 																children: "PUT"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "DELETE",
 																children: "DELETE"
 															})
@@ -884,12 +947,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													})]
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Headers (JSON)" }), /* @__PURE__ */ k(O, {
-													value: N.config?.headers || "",
+												children: [/* @__PURE__ */ T(v, { children: "Headers (JSON)" }), /* @__PURE__ */ T(w, {
+													value: k.config?.headers || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														headers: e.target.value || void 0
 													}),
 													rows: 3,
@@ -897,35 +960,35 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													className: "font-mono text-xs"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Authentication" }), /* @__PURE__ */ A(b, {
-													value: N.config?.authType || "none",
+												children: [/* @__PURE__ */ T(v, { children: "Authentication" }), /* @__PURE__ */ E(xe, {
+													value: k.config?.authType || "none",
 													onValueChange: (e) => $({
-														...N.config,
+														...k.config,
 														authType: e
 													}),
-													children: [/* @__PURE__ */ k(C, {
+													children: [/* @__PURE__ */ T(b, {
 														style: { height: "var(--size-controlHeight-md)" },
-														children: /* @__PURE__ */ k(w, {})
-													}), /* @__PURE__ */ A(x, {
+														children: /* @__PURE__ */ T(x, {})
+													}), /* @__PURE__ */ E(Se, {
 														position: "popper",
 														side: "bottom",
 														sideOffset: 4,
 														children: [
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "none",
 																children: "None"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "api_key",
 																children: "API Key"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "bearer",
 																children: "Bearer Token"
 															}),
-															/* @__PURE__ */ k(S, {
+															/* @__PURE__ */ T(y, {
 																value: "basic",
 																children: "Basic Auth"
 															})
@@ -933,24 +996,24 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													})]
 												})]
 											}),
-											!!(N.config?.authType && N.config.authType !== "none") && /* @__PURE__ */ A("div", {
+											!!(k.config?.authType && k.config.authType !== "none") && /* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: String(N.config.authType) === "basic" ? "Credentials (user:pass)" : "Token/Key" }), /* @__PURE__ */ k(v, {
+												children: [/* @__PURE__ */ T(v, { children: String(k.config.authType) === "basic" ? "Credentials (user:pass)" : "Token/Key" }), /* @__PURE__ */ T(_, {
 													type: "password",
-													value: N.config?.authValue || "",
+													value: k.config?.authValue || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														authValue: e.target.value || void 0
 													}),
-													placeholder: N.config.authType === "basic" ? "username:password" : "Enter token or API key"
+													placeholder: k.config.authType === "basic" ? "username:password" : "Enter token or API key"
 												})]
 											}),
-											(N.config?.httpMethod === "POST" || N.config?.httpMethod === "PUT") && /* @__PURE__ */ A("div", {
+											(k.config?.httpMethod === "POST" || k.config?.httpMethod === "PUT") && /* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Request Body (JSON)" }), /* @__PURE__ */ k(O, {
-													value: N.config?.requestBody || "",
+												children: [/* @__PURE__ */ T(v, { children: "Request Body (JSON)" }), /* @__PURE__ */ T(w, {
+													value: k.config?.requestBody || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														requestBody: e.target.value || void 0
 													}),
 													rows: 4,
@@ -958,19 +1021,19 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													className: "font-mono text-xs"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
 												children: [
-													/* @__PURE__ */ k(y, { children: "Data Path (optional)" }),
-													/* @__PURE__ */ k(v, {
-														value: N.config?.dataPath || "",
+													/* @__PURE__ */ T(v, { children: "Data Path (optional)" }),
+													/* @__PURE__ */ T(_, {
+														value: k.config?.dataPath || "",
 														onChange: (e) => $({
-															...N.config,
+															...k.config,
 															dataPath: e.target.value || void 0
 														}),
 														placeholder: "$.data.items or .data.items"
 													}),
-													/* @__PURE__ */ k("p", {
+													/* @__PURE__ */ T("p", {
 														className: "text-xs text-text-secondary",
 														children: "JSONPath or dot notation to extract data from response"
 													})
@@ -978,26 +1041,26 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 											})
 										]
 									}),
-									N.config?.dataSourceType === "GRAPHQL" && /* @__PURE__ */ A("div", {
+									k.config?.dataSourceType === "GRAPHQL" && /* @__PURE__ */ E("div", {
 										className: "space-y-3",
 										children: [
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "GraphQL Endpoint *" }), /* @__PURE__ */ k(v, {
-													value: N.config?.graphqlEndpoint || "",
+												children: [/* @__PURE__ */ T(v, { children: "GraphQL Endpoint *" }), /* @__PURE__ */ T(_, {
+													value: k.config?.graphqlEndpoint || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														graphqlEndpoint: e.target.value || void 0
 													}),
 													placeholder: "https://api.example.com/graphql"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Query *" }), /* @__PURE__ */ k(O, {
-													value: N.config?.graphqlQuery || "",
+												children: [/* @__PURE__ */ T(v, { children: "Query *" }), /* @__PURE__ */ T(w, {
+													value: k.config?.graphqlQuery || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														graphqlQuery: e.target.value || void 0
 													}),
 													rows: 6,
@@ -1005,12 +1068,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													className: "font-mono text-xs"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Variables (JSON, optional)" }), /* @__PURE__ */ k(O, {
-													value: N.config?.graphqlVariables || "",
+												children: [/* @__PURE__ */ T(v, { children: "Variables (JSON, optional)" }), /* @__PURE__ */ T(w, {
+													value: k.config?.graphqlVariables || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														graphqlVariables: e.target.value || void 0
 													}),
 													rows: 3,
@@ -1018,12 +1081,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													className: "font-mono text-xs"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
-												children: [/* @__PURE__ */ k(y, { children: "Headers (JSON, optional)" }), /* @__PURE__ */ k(O, {
-													value: N.config?.headers || "",
+												children: [/* @__PURE__ */ T(v, { children: "Headers (JSON, optional)" }), /* @__PURE__ */ T(w, {
+													value: k.config?.headers || "",
 													onChange: (e) => $({
-														...N.config,
+														...k.config,
 														headers: e.target.value || void 0
 													}),
 													rows: 2,
@@ -1031,19 +1094,19 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 													className: "font-mono text-xs"
 												})]
 											}),
-											/* @__PURE__ */ A("div", {
+											/* @__PURE__ */ E("div", {
 												className: "space-y-2",
 												children: [
-													/* @__PURE__ */ k(y, { children: "Data Path (optional)" }),
-													/* @__PURE__ */ k(v, {
-														value: N.config?.dataPath || "",
+													/* @__PURE__ */ T(v, { children: "Data Path (optional)" }),
+													/* @__PURE__ */ T(_, {
+														value: k.config?.dataPath || "",
 														onChange: (e) => $({
-															...N.config,
+															...k.config,
 															dataPath: e.target.value || void 0
 														}),
 														placeholder: ".data.items"
 													}),
-													/* @__PURE__ */ k("p", {
+													/* @__PURE__ */ T("p", {
 														className: "text-xs text-text-secondary",
 														children: "Path to extract data from GraphQL response"
 													})
@@ -1051,12 +1114,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 											})
 										]
 									}),
-									N.config?.dataSourceType === "MOCK" && /* @__PURE__ */ A("div", {
+									k.config?.dataSourceType === "MOCK" && /* @__PURE__ */ E("div", {
 										className: "space-y-2",
-										children: [/* @__PURE__ */ k(y, { children: "Sample Data (JSON)" }), /* @__PURE__ */ k(O, {
-											value: N.config?.mockData || "",
+										children: [/* @__PURE__ */ T(v, { children: "Sample Data (JSON)" }), /* @__PURE__ */ T(w, {
+											value: k.config?.mockData || "",
 											onChange: (e) => $({
-												...N.config,
+												...k.config,
 												mockData: e.target.value || void 0
 											}),
 											rows: 5,
@@ -1066,103 +1129,99 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 									})
 								] })
 							}),
-							/* @__PURE__ */ A(E, {
+							/* @__PURE__ */ E(S, {
 								value: "advanced",
 								className: "mt-0 space-y-6",
 								children: [
-									N && /* @__PURE__ */ k(oe, {
-										renderer: N.renderer,
-										rendererOptions: Ee,
+									k && /* @__PURE__ */ T(se, {
+										renderer: k.renderer,
+										rendererOptions: Me,
 										onRendererChange: (e) => {
 											Q("renderer", e), e === "BIGCONSOLE" && Q("template", void 0);
 										},
-										templateEditor: N.renderer === "BIGCONSOLE" ? void 0 : /* @__PURE__ */ k(Ae, {
+										templateEditor: k.renderer === "BIGCONSOLE" ? void 0 : /* @__PURE__ */ T(Le, {
 											widget: {
-												...z,
-												template: N.template,
-												renderer: N.renderer
+												...F,
+												template: k.template,
+												renderer: k.renderer
 											},
 											onSave: (e) => Q("template", e)
 										})
 									}),
-									/* @__PURE__ */ A("section", {
+									/* @__PURE__ */ E("section", {
 										className: "space-y-4 border-t border-border-default pt-4",
-										children: [/* @__PURE__ */ A("div", {
+										children: [/* @__PURE__ */ E("div", {
 											className: "flex items-center justify-between",
-											children: [/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("h3", {
+											children: [/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h3", {
 												className: "text-sm font-medium",
 												children: "Widget Actions"
-											}), /* @__PURE__ */ k("p", {
+											}), /* @__PURE__ */ T("p", {
 												className: "text-xs text-text-secondary",
 												children: "Configure buttons on this widget"
-											})] }), /* @__PURE__ */ A(_, {
+											})] }), /* @__PURE__ */ E(g, {
 												size: "sm",
-												onClick: $e,
-												children: [/* @__PURE__ */ k(me, { className: "size-4" }), "Add"]
+												onClick: vt,
+												children: [/* @__PURE__ */ T(ge, { className: "size-4" }), "Add"]
 											})]
-										}), J ? /* @__PURE__ */ k("div", {
+										}), H ? /* @__PURE__ */ T("div", {
 											className: "flex justify-center py-8",
-											children: /* @__PURE__ */ k(T, { className: "size-6" })
-										}) : q.length === 0 ? /* @__PURE__ */ A("div", {
+											children: /* @__PURE__ */ T(Oe, { className: "size-6" })
+										}) : V.length === 0 ? /* @__PURE__ */ E("div", {
 											className: "py-8 text-center",
-											children: [/* @__PURE__ */ k(fe, { className: "size-10 mx-auto mb-2 text-text-secondary/50" }), /* @__PURE__ */ k("p", {
+											children: [/* @__PURE__ */ T(h, { className: "size-10 mx-auto mb-2 text-text-secondary/50" }), /* @__PURE__ */ T("p", {
 												className: "text-sm text-text-secondary",
 												children: "No actions configured"
 											})]
-										}) : /* @__PURE__ */ k("div", {
+										}) : /* @__PURE__ */ T("div", {
 											className: "space-y-2",
-											children: [...q].sort((e, t) => e.order - t.order).map((e, t) => /* @__PURE__ */ k(ge, {
+											children: [...V].sort((e, t) => e.order - t.order).map((e, t) => /* @__PURE__ */ T(ye, {
 												className: e.disabled ? "opacity-60" : "",
-												children: /* @__PURE__ */ A(_e, {
+												children: /* @__PURE__ */ E(be, {
 													className: "p-3 flex items-center gap-2",
 													children: [
-														/* @__PURE__ */ A("div", {
+														/* @__PURE__ */ E("div", {
 															className: "flex flex-col gap-0.5",
-															children: [/* @__PURE__ */ k(_, {
+															children: [/* @__PURE__ */ T(g, {
 																variant: "ghost",
 																size: "icon-sm",
-																onClick: () => rt(t),
+																onClick: () => St(t),
 																disabled: t === 0,
 																className: "h-5 w-5",
-																children: /* @__PURE__ */ k(de, { className: "size-3" })
-															}), /* @__PURE__ */ k(_, {
+																children: /* @__PURE__ */ T(me, { className: "size-3" })
+															}), /* @__PURE__ */ T(g, {
 																variant: "ghost",
 																size: "icon-sm",
-																onClick: () => it(t),
-																disabled: t === q.length - 1,
+																onClick: () => Ct(t),
+																disabled: t === V.length - 1,
 																className: "h-5 w-5",
-																children: /* @__PURE__ */ k(ue, { className: "size-3" })
+																children: /* @__PURE__ */ T(pe, { className: "size-3" })
 															})]
 														}),
-														/* @__PURE__ */ A("div", {
+														/* @__PURE__ */ E("div", {
 															className: "flex-1 min-w-0",
-															children: [/* @__PURE__ */ A("div", {
+															children: [/* @__PURE__ */ E("div", {
 																className: "flex items-center gap-2",
-																children: [/* @__PURE__ */ k("span", { className: `size-2 rounded-full ${Oe[e.style] || "bg-muted-foreground"}` }), /* @__PURE__ */ k("span", {
+																children: [/* @__PURE__ */ T("span", { className: `size-2 rounded-full ${Fe[e.style] || "bg-muted-foreground"}` }), /* @__PURE__ */ T("span", {
 																	className: "text-sm font-medium truncate",
 																	children: e.label
 																})]
-															}), /* @__PURE__ */ A("p", {
-																className: "text-xs text-text-secondary",
-																children: [
-																	e.name,
-																	" • ",
-																	e.type
-																]
+															}), /* @__PURE__ */ T("p", {
+																className: "text-xs text-text-secondary truncate",
+																children: _t.has(e.name) ? `→ ${_t.get(e.name)?.method} ${_t.get(e.name)?.webhookUrl}` : "Emits an event"
 															})]
 														}),
-														/* @__PURE__ */ A("div", {
+														/* @__PURE__ */ E("div", {
 															className: "flex gap-1",
-															children: [/* @__PURE__ */ k(_, {
+															children: [/* @__PURE__ */ T(g, {
 																variant: "ghost",
 																size: "icon-sm",
-																onClick: () => et(e),
-																children: /* @__PURE__ */ k(pe, { className: "size-4" })
-															}), /* @__PURE__ */ k(_, {
+																onClick: () => yt(e),
+																children: /* @__PURE__ */ T(he, { className: "size-4" })
+															}), /* @__PURE__ */ T(g, {
 																variant: "ghost",
 																size: "icon-sm",
-																onClick: () => nt(e.id),
-																children: /* @__PURE__ */ k(he, { className: "size-4" })
+																onClick: () => xt(e.id),
+																children: /* @__PURE__ */ T(_e, { className: "size-4" })
 															})]
 														})
 													]
@@ -1170,61 +1229,61 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 											}, e.id))
 										})]
 									}),
-									/* @__PURE__ */ A("section", {
+									/* @__PURE__ */ E("section", {
 										className: "space-y-3 border-t border-border-default pt-4",
-										children: [/* @__PURE__ */ k("h3", {
+										children: [/* @__PURE__ */ T("h3", {
 											className: "text-sm font-semibold text-text-primary",
 											children: "Drilldown"
-										}), /* @__PURE__ */ k(ae, {
-											widget: z,
-											onChange: ut
+										}), /* @__PURE__ */ T(oe, {
+											widget: F,
+											onChange: kt
 										})]
 									}),
-									/* @__PURE__ */ A("section", {
+									/* @__PURE__ */ E("section", {
 										className: "space-y-3 border-t border-border-default pt-4",
-										children: [/* @__PURE__ */ k("h3", {
+										children: [/* @__PURE__ */ T("h3", {
 											className: "text-sm font-semibold text-text-primary",
 											children: "Webhooks"
-										}), /* @__PURE__ */ k(re, {
-											dashboardId: z.dashboardId,
-											widgetId: z.id
+										}), /* @__PURE__ */ T(ie, {
+											dashboardId: F.dashboardId,
+											widgetId: F.id
 										})]
 									}),
-									/* @__PURE__ */ A("section", {
+									/* @__PURE__ */ E("section", {
 										className: "space-y-3 border-t border-border-default pt-4",
-										children: [/* @__PURE__ */ k("h3", {
+										children: [/* @__PURE__ */ T("h3", {
 											className: "text-sm font-semibold text-text-primary",
 											children: "Events"
-										}), /* @__PURE__ */ k(ie, {
-											dashboardId: z.dashboardId,
-											widgetId: z.id,
+										}), /* @__PURE__ */ T(ae, {
+											dashboardId: F.dashboardId,
+											widgetId: F.id,
 											maxHeight: "calc(100vh - 350px)"
 										})]
 									})
 								]
 							}),
-							/* @__PURE__ */ k(E, {
+							/* @__PURE__ */ T(S, {
 								value: "appearance",
 								className: "mt-0",
-								children: N && /* @__PURE__ */ k(se, {
-									widgetType: z.type,
-									config: N.config || {},
-									onChange: lt
+								children: k && /* @__PURE__ */ T(ce, {
+									widgetType: F.type,
+									config: k.config || {},
+									onChange: Ot
 								})
 							})
 						]
 					})]
-				}) : /* @__PURE__ */ k("div", {
+				}) : /* @__PURE__ */ T("div", {
 					className: "flex-1 flex items-center justify-center p-4",
-					children: /* @__PURE__ */ A("div", {
+					children: /* @__PURE__ */ E("div", {
 						className: "text-center",
-						children: [/* @__PURE__ */ k(fe, { className: "size-12 mx-auto mb-3 text-text-secondary" }), /* @__PURE__ */ k("p", {
+						children: [/* @__PURE__ */ T(h, { className: "size-12 mx-auto mb-3 text-text-secondary" }), /* @__PURE__ */ T("p", {
 							className: "text-sm text-text-secondary",
 							children: "Select a widget to edit"
 						})]
 					})
 				}),
-				z && /* @__PURE__ */ A("div", {
+				F && /* @__PURE__ */ E("div", {
 					style: {
 						padding: "var(--space-cardPadding)",
 						borderTop: "1px solid var(--color-border)",
@@ -1232,7 +1291,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 						flexShrink: 0
 					},
 					children: [
-						F && /* @__PURE__ */ A("div", {
+						j && /* @__PURE__ */ E("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
@@ -1243,13 +1302,13 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								borderRadius: "var(--radius-button)",
 								border: "1px solid var(--color-status-warning-border, rgba(251, 191, 36, 0.3))"
 							},
-							children: [/* @__PURE__ */ k("div", { style: {
+							children: [/* @__PURE__ */ T("div", { style: {
 								width: "8px",
 								height: "8px",
 								borderRadius: "50%",
 								backgroundColor: "var(--color-status-warning-bg)",
 								flexShrink: 0
-							} }), /* @__PURE__ */ k("span", {
+							} }), /* @__PURE__ */ T("span", {
 								style: {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-status-warning-text, #92400e)",
@@ -1258,7 +1317,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								children: "You have unsaved changes"
 							})]
 						}),
-						j === "saved" && !F && /* @__PURE__ */ A("div", {
+						D === "saved" && !j && /* @__PURE__ */ E("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
@@ -1269,12 +1328,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								borderRadius: "var(--radius-button)",
 								border: "1px solid var(--color-status-success-border, rgba(34, 197, 94, 0.3))"
 							},
-							children: [/* @__PURE__ */ k(m, { style: {
+							children: [/* @__PURE__ */ T(p, { style: {
 								width: "var(--size-icon-sm)",
 								height: "var(--size-icon-sm)",
 								color: "var(--color-status-success-text)",
 								flexShrink: 0
-							} }), /* @__PURE__ */ k("span", {
+							} }), /* @__PURE__ */ T("span", {
 								style: {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-status-success-text)",
@@ -1283,7 +1342,7 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								children: "All changes saved"
 							})]
 						}),
-						j === "error" && /* @__PURE__ */ A("div", {
+						D === "error" && /* @__PURE__ */ E("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
@@ -1294,12 +1353,12 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								borderRadius: "var(--radius-button)",
 								border: "1px solid var(--color-status-error-border)"
 							},
-							children: [/* @__PURE__ */ k(g, { style: {
+							children: [/* @__PURE__ */ T(ve, { style: {
 								width: "var(--size-icon-sm)",
 								height: "var(--size-icon-sm)",
 								color: "var(--color-status-error-text)",
 								flexShrink: 0
-							} }), /* @__PURE__ */ k("span", {
+							} }), /* @__PURE__ */ T("span", {
 								style: {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-status-error-text)",
@@ -1308,50 +1367,50 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 								children: "Failed to save changes"
 							})]
 						}),
-						/* @__PURE__ */ A("div", {
+						/* @__PURE__ */ E("div", {
 							style: {
 								display: "flex",
 								gap: "var(--space-controlGap)"
 							},
-							children: [/* @__PURE__ */ k(_, {
-								onClick: st,
-								disabled: j === "saving" || !F,
+							children: [/* @__PURE__ */ T(g, {
+								onClick: Et,
+								disabled: D === "saving" || !j,
 								style: {
 									flex: 1,
 									height: "var(--size-controlHeight-md)",
-									backgroundColor: F ? "var(--color-action-primary-bg)" : void 0,
-									opacity: F ? 1 : .5
+									backgroundColor: j ? "var(--color-action-primary-bg)" : void 0,
+									opacity: j ? 1 : .5
 								},
-								children: j === "saving" ? /* @__PURE__ */ A("span", {
+								children: D === "saving" ? /* @__PURE__ */ E("span", {
 									style: {
 										display: "flex",
 										alignItems: "center",
 										gap: "var(--space-iconGap)"
 									},
-									children: [/* @__PURE__ */ k(T, { style: {
+									children: [/* @__PURE__ */ T(Oe, { style: {
 										width: "var(--size-icon-sm)",
 										height: "var(--size-icon-sm)"
 									} }), "Saving..."]
-								}) : /* @__PURE__ */ A("span", {
+								}) : /* @__PURE__ */ E("span", {
 									style: {
 										display: "flex",
 										alignItems: "center",
 										gap: "var(--space-iconGap)"
 									},
-									children: [/* @__PURE__ */ k(m, { style: {
+									children: [/* @__PURE__ */ T(p, { style: {
 										width: "var(--size-icon-sm)",
 										height: "var(--size-icon-sm)"
 									} }), "Save Changes"]
 								})
-							}), /* @__PURE__ */ A(_, {
+							}), /* @__PURE__ */ E(g, {
 								variant: "outline",
-								onClick: ct,
-								disabled: j === "saving" || !F,
+								onClick: Dt,
+								disabled: D === "saving" || !j,
 								style: {
 									height: "var(--size-controlHeight-md)",
-									opacity: F ? 1 : .5
+									opacity: j ? 1 : .5
 								},
-								children: [/* @__PURE__ */ k(g, { style: {
+								children: [/* @__PURE__ */ T(ve, { style: {
 									width: "var(--size-icon-sm)",
 									height: "var(--size-icon-sm)"
 								} }), "Discard"]
@@ -1359,20 +1418,22 @@ var Me = l(function({ isOpen: l, onClose: h }) {
 						})
 					]
 				}),
-				/* @__PURE__ */ k(ne, {
-					isOpen: Ye,
-					action: Xe,
-					isLoading: Ze,
+				/* @__PURE__ */ T(re, {
+					isOpen: ut,
+					action: J,
+					initialWebhook: gt,
+					isLoading: dt,
+					saveError: mt,
 					onClose: () => {
-						X(!1), Z(void 0);
+						q(!1), Y(void 0), X(void 0), Z(null);
 					},
-					onSave: tt
+					onSave: bt
 				})
 			]
 		})
 	});
 });
 //#endregion
-export { Me as default };
+export { ze as default };
 
 //# sourceMappingURL=PropertiesPanel.js.map