@burdenoff/microfe-bigconsole 2026.805.1 → 2026.805.3

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

@@ -1,105 +1,53 @@
-import { memo as e, useCallback as t, useEffect as n, useRef as r, useState as i } from "react";
-import { ChevronDown as ee, ChevronRight as te, Pencil as ne, Plus as re, Zap as ie } from "lucide-react";
-import { Button as ae, Checkbox as a, Dialog as oe, DialogContent as se, DialogDescription as ce, DialogFooter as le, DialogHeader as ue, DialogTitle as de, Input as o, Select as s, SelectContent as c, SelectItem as l, SelectTrigger as u, SelectValue as d, Spinner as fe, Textarea as pe } from "@burdenoff/fe-libs/ui";
+import { BIGCONSOLE_PERMISSIONS as e } from "../../../constants/permissions.js";
+import { memo as t, useCallback as n, useEffect as r, useMemo as i, useRef as ee, useState as a } from "react";
+import { PermissionButton as te } from "@burdenoff/fe-libs/shared/components";
+import { ChevronDown as ne, ChevronRight as re, Pencil as ie, Plus as ae, Zap as oe } from "lucide-react";
+import { useI18n as se } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { Button as ce, Checkbox as le, Dialog as ue, DialogContent as de, DialogDescription as fe, DialogFooter as pe, DialogHeader as me, DialogTitle as he, Input as o, Select as s, SelectContent as c, SelectItem as l, SelectTrigger as u, SelectValue as d, Spinner as ge, Textarea as _e } from "@burdenoff/fe-libs/ui";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/ActionConfigDialog.tsx
-var me = [{
-	value: "WEBHOOK",
-	label: "Call a webhook / my API",
-	hint: "Sends an HTTP request to the URL below every time the button is clicked."
-}, {
-	value: "EMIT",
-	label: "Just emit an event (advanced)",
-	hint: "Emits widget:<name>:clicked. Wire it up yourself in the Webhooks/Events section."
-}], he = [
+var ve = [
 	"POST",
 	"GET",
 	"PUT",
 	"PATCH",
 	"DELETE"
-], ge = [
+], ye = [
 	{
 		value: "PRIMARY",
-		label: "Primary",
 		color: "var(--color-action-primary-bg)"
 	},
 	{
 		value: "SECONDARY",
-		label: "Secondary",
 		color: "var(--color-action-secondary-bg)"
 	},
 	{
 		value: "SUCCESS",
-		label: "Success",
 		color: "var(--color-status-success-bg)"
 	},
 	{
 		value: "WARNING",
-		label: "Warning",
 		color: "var(--color-status-warning-bg)"
 	},
 	{
 		value: "DANGER",
-		label: "Danger",
 		color: "var(--color-action-danger-bg)"
 	}
-], _e = [
-	{
-		value: "",
-		label: "No icon"
-	},
-	{
-		value: "refresh",
-		label: "Refresh"
-	},
-	{
-		value: "download",
-		label: "Download"
-	},
-	{
-		value: "upload",
-		label: "Upload"
-	},
-	{
-		value: "trash",
-		label: "Trash"
-	},
-	{
-		value: "edit",
-		label: "Edit"
-	},
-	{
-		value: "plus",
-		label: "Plus"
-	},
-	{
-		value: "check",
-		label: "Check"
-	},
-	{
-		value: "eye",
-		label: "View"
-	},
-	{
-		value: "copy",
-		label: "Copy"
-	},
-	{
-		value: "share",
-		label: "Share"
-	},
-	{
-		value: "settings",
-		label: "Settings"
-	},
-	{
-		value: "filter",
-		label: "Filter"
-	},
-	{
-		value: "search",
-		label: "Search"
-	}
+], be = [
+	"",
+	"refresh",
+	"download",
+	"upload",
+	"trash",
+	"edit",
+	"plus",
+	"check",
+	"eye",
+	"copy",
+	"share",
+	"settings",
+	"filter",
+	"search"
 ];
 function m(e) {
 	return e.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "");
@@ -120,57 +68,105 @@ var h = {
 	border: "1px solid var(--color-border)",
 	boxShadow: "var(--shadow-elevation-3)",
 	borderRadius: "var(--radius-button)"
-}, v = e(function({ isOpen: e, action: v, initialWebhook: y, isLoading: b = !1, saveError: ve, onClose: ye, onSave: be }) {
-	let x = !!v, S = r(null), C = r(!1), [w, T] = i(""), [E, D] = i(""), [O, k] = i(!1), [A, j] = i("PRIMARY"), [M, N] = i(""), [P, F] = i("WEBHOOK"), [I, L] = i(""), [R, z] = i("POST"), [B, V] = i(!1), [H, U] = i(!1), [xe, Se] = i(!1), [W, G] = i(!1), [K, q] = i("Confirm Action"), [J, Y] = i("Are you sure you want to proceed?"), [Ce, X] = i("Confirm"), [we, Z] = i("Cancel"), [Q, $] = i(null);
-	n(() => {
-		if (!e) return;
-		C.current = !1, L(""), z("POST"), v ? (T(v.label), D(v.name), k(!1), j(v.style), N(v.icon || ""), V(v.disabled), U(v.hidden), F("EMIT"), G(!!v.confirmation), v.confirmation ? (q(v.confirmation.title), Y(v.confirmation.message), X(v.confirmation.confirmLabel || "Confirm"), Z(v.confirmation.cancelLabel || "Cancel")) : (q("Confirm Action"), Y("Are you sure you want to proceed?"), X("Confirm"), Z("Cancel"))) : (T(""), D(""), k(!1), j("PRIMARY"), N(""), F("WEBHOOK"), V(!1), U(!1), G(!1), q("Confirm Action"), Y("Are you sure you want to proceed?"), X("Confirm"), Z("Cancel")), Se(!1), $(null);
-		let t = requestAnimationFrame(() => requestAnimationFrame(() => S.current?.focus()));
-		return () => cancelAnimationFrame(t);
-	}, [e, v]), n(() => {
-		!e || !y || C.current || (F("WEBHOOK"), L(y.url), z(y.method));
-	}, [e, y]);
-	let Te = t((e) => {
-		T(e), O || D(m(e)), Q && $(null);
-	}, [O, Q]), Ee = t((e) => {
+}, v = t(function({ isOpen: t, action: v, initialWebhook: y, isLoading: b = !1, saveError: xe, onClose: Se, onSave: Ce }) {
+	let { t: x } = se(), S = !!v, C = ee(null), w = ee(!1), [T, E] = a(""), [D, O] = a(""), [k, A] = a(!1), [j, M] = a("PRIMARY"), [N, P] = a(""), [F, I] = a("WEBHOOK"), [L, we] = a(""), [R, z] = a("POST"), [B, V] = a(!1), [H, U] = a(!1), [Te, Ee] = a(!1), [W, G] = a(!1), [K, q] = a(() => x("bigconsole.widget.actions.confirm.defaultTitle", "Confirm Action")), [J, Y] = a(() => x("bigconsole.widget.actions.confirm.defaultMessage", "Are you sure you want to proceed?")), [De, X] = a(() => x("bigconsole.widget.actions.confirm.defaultConfirmLabel", "Confirm")), [Oe, Z] = a(() => x("bigconsole.widget.actions.confirm.defaultCancelLabel", "Cancel")), [Q, $] = a(null), ke = i(() => [{
+		value: "WEBHOOK",
+		label: x("bigconsole.widget.actions.outcome.webhook.label", "Call a webhook / my API"),
+		hint: x("bigconsole.widget.actions.outcome.webhook.hint", "Sends an HTTP request to the URL below every time the button is clicked.")
+	}, {
+		value: "EMIT",
+		label: x("bigconsole.widget.actions.outcome.emit.label", "Just emit an event (advanced)"),
+		hint: x("bigconsole.widget.actions.outcome.emit.hint", "Emits widget:<name>:clicked. Wire it up yourself in the Webhooks/Events section.")
+	}], [x]), Ae = i(() => {
+		let e = {
+			PRIMARY: x("bigconsole.widget.actions.style.primary", "Primary"),
+			SECONDARY: x("bigconsole.widget.actions.style.secondary", "Secondary"),
+			SUCCESS: x("bigconsole.widget.actions.style.success", "Success"),
+			WARNING: x("bigconsole.widget.actions.style.warning", "Warning"),
+			DANGER: x("bigconsole.widget.actions.style.danger", "Danger"),
+			GHOST: x("bigconsole.widget.actions.style.ghost", "Ghost"),
+			LINK: x("bigconsole.widget.actions.style.link", "Link")
+		};
+		return ye.map((t) => ({
+			value: t.value,
+			label: e[t.value],
+			color: t.color
+		}));
+	}, [x]), je = i(() => {
+		let e = {
+			"": x("bigconsole.widget.actions.icon.none", "No icon"),
+			refresh: x("bigconsole.widget.actions.icon.refresh", "Refresh"),
+			download: x("bigconsole.widget.actions.icon.download", "Download"),
+			upload: x("bigconsole.widget.actions.icon.upload", "Upload"),
+			trash: x("bigconsole.widget.actions.icon.trash", "Trash"),
+			edit: x("bigconsole.widget.actions.icon.edit", "Edit"),
+			plus: x("bigconsole.widget.actions.icon.plus", "Plus"),
+			check: x("bigconsole.widget.actions.icon.check", "Check"),
+			eye: x("bigconsole.widget.actions.icon.eye", "View"),
+			copy: x("bigconsole.widget.actions.icon.copy", "Copy"),
+			share: x("bigconsole.widget.actions.icon.share", "Share"),
+			settings: x("bigconsole.widget.actions.icon.settings", "Settings"),
+			filter: x("bigconsole.widget.actions.icon.filter", "Filter"),
+			search: x("bigconsole.widget.actions.icon.search", "Search")
+		};
+		return be.map((t) => ({
+			value: t,
+			label: e[t]
+		}));
+	}, [x]);
+	r(() => {
+		if (!t) return;
+		w.current = !1, we(""), z("POST"), v ? (E(v.label), O(v.name), A(!1), M(v.style), P(v.icon || ""), V(v.disabled), U(v.hidden), I("EMIT"), G(!!v.confirmation), v.confirmation ? (q(v.confirmation.title), Y(v.confirmation.message), X(v.confirmation.confirmLabel || x("bigconsole.widget.actions.confirm.defaultConfirmLabel", "Confirm")), Z(v.confirmation.cancelLabel || x("bigconsole.widget.actions.confirm.defaultCancelLabel", "Cancel"))) : (q(x("bigconsole.widget.actions.confirm.defaultTitle", "Confirm Action")), Y(x("bigconsole.widget.actions.confirm.defaultMessage", "Are you sure you want to proceed?")), X(x("bigconsole.widget.actions.confirm.defaultConfirmLabel", "Confirm")), Z(x("bigconsole.widget.actions.confirm.defaultCancelLabel", "Cancel")))) : (E(""), O(""), A(!1), M("PRIMARY"), P(""), I("WEBHOOK"), V(!1), U(!1), G(!1), q(x("bigconsole.widget.actions.confirm.defaultTitle", "Confirm Action")), Y(x("bigconsole.widget.actions.confirm.defaultMessage", "Are you sure you want to proceed?")), X(x("bigconsole.widget.actions.confirm.defaultConfirmLabel", "Confirm")), Z(x("bigconsole.widget.actions.confirm.defaultCancelLabel", "Cancel"))), Ee(!1), $(null);
+		let e = requestAnimationFrame(() => requestAnimationFrame(() => C.current?.focus()));
+		return () => cancelAnimationFrame(e);
+	}, [
+		t,
+		v,
+		x
+	]), r(() => {
+		!t || !y || w.current || (I("WEBHOOK"), we(y.url), z(y.method));
+	}, [t, y]);
+	let Me = n((e) => {
+		E(e), k || O(m(e)), Q && $(null);
+	}, [k, Q]), Ne = n((e) => {
 		e.preventDefault();
-		let t = w.trim();
+		let t = T.trim();
 		if (!t) {
-			$("Button label is required"), S.current?.focus();
+			$(x("bigconsole.widget.actions.validation.labelRequired", "Button label is required")), C.current?.focus();
 			return;
 		}
-		let n = x && v ? v.name : m(O ? E : w) || m(w);
+		let n = S && v ? v.name : m(k ? D : T) || m(T);
 		if (!n) {
-			$("Enter a label using letters or numbers");
+			$(x("bigconsole.widget.actions.validation.labelLettersOrNumbers", "Enter a label using letters or numbers"));
 			return;
 		}
-		if (P === "WEBHOOK") {
-			let e = I.trim();
+		if (F === "WEBHOOK") {
+			let e = L.trim();
 			if (!e) {
-				$("Enter the URL to call when the button is clicked");
+				$(x("bigconsole.widget.actions.validation.urlRequired", "Enter the URL to call when the button is clicked"));
 				return;
 			}
 			if (!/^https?:\/\//i.test(e)) {
-				$("Webhook URL must start with http:// or https://");
+				$(x("bigconsole.widget.actions.validation.urlScheme", "Webhook URL must start with http:// or https://"));
 				return;
 			}
 		}
 		let r = W ? {
-			title: K.trim() || "Confirm Action",
-			message: J.trim() || "Are you sure?",
-			confirmLabel: Ce.trim() || "Confirm",
-			cancelLabel: we.trim() || "Cancel"
-		} : void 0, i = P === "WEBHOOK" ? {
-			url: I.trim(),
+			title: K.trim() || x("bigconsole.widget.actions.confirm.defaultTitle", "Confirm Action"),
+			message: J.trim() || x("bigconsole.widget.actions.confirm.fallbackMessage", "Are you sure?"),
+			confirmLabel: De.trim() || x("bigconsole.widget.actions.confirm.defaultConfirmLabel", "Confirm"),
+			cancelLabel: Oe.trim() || x("bigconsole.widget.actions.confirm.defaultCancelLabel", "Cancel")
+		} : void 0, i = F === "WEBHOOK" ? {
+			url: L.trim(),
 			method: R
 		} : null;
-		be(x && v ? {
+		Ce(S && v ? {
 			id: v.id,
 			name: n,
 			label: t,
 			type: "BUTTON",
-			style: A,
-			icon: M || void 0,
+			style: j,
+			icon: N || void 0,
 			confirmation: W ? r : null,
 			disabled: B,
 			hidden: H
@@ -178,41 +174,42 @@ var h = {
 			name: n,
 			label: t,
 			type: "BUTTON",
-			style: A,
-			icon: M || void 0,
+			style: j,
+			icon: N || void 0,
 			confirmation: r,
 			disabled: B,
 			hidden: H
 		}, i);
 	}, [
-		w,
-		E,
-		O,
-		P,
-		I,
+		T,
+		D,
+		k,
+		F,
+		L,
 		R,
-		A,
-		M,
+		j,
+		N,
 		B,
 		H,
 		W,
 		K,
 		J,
-		Ce,
-		we,
-		x,
+		De,
+		Oe,
+		S,
 		v,
-		be
-	]), De = (e) => ge.find((t) => t.value === e)?.color || "var(--color-action-primary-bg)", Oe = me.find((e) => e.value === P);
-	return /* @__PURE__ */ f(oe, {
-		open: e,
-		onOpenChange: (e) => !e && !b && ye(),
-		children: /* @__PURE__ */ p(se, {
+		Ce,
+		x
+	]), Pe = (e) => Ae.find((t) => t.value === e)?.color || "var(--color-action-primary-bg)", Fe = ke.find((e) => e.value === F);
+	return /* @__PURE__ */ f(ue, {
+		open: t,
+		onOpenChange: (e) => !e && !b && Se(),
+		children: /* @__PURE__ */ p(de, {
 			style: {
 				maxWidth: "500px",
 				padding: 0
 			},
-			children: [/* @__PURE__ */ f(ue, {
+			children: [/* @__PURE__ */ f(me, {
 				style: { padding: "var(--space-pagePadding) var(--space-pagePadding) 0" },
 				children: /* @__PURE__ */ p("div", {
 					style: {
@@ -231,30 +228,30 @@ var h = {
 							backgroundColor: "var(--color-action-primary-bg)",
 							boxShadow: "var(--shadow-elevation-2)"
 						},
-						children: f(x ? ne : ie, { style: {
+						children: f(S ? ie : oe, { style: {
 							height: "var(--size-icon-lg)",
 							width: "var(--size-icon-lg)",
 							color: "var(--color-action-primary-text)"
 						} })
-					}), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f(de, {
+					}), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f(he, {
 						style: {
 							fontSize: "var(--font-size-heading-h4)",
 							fontWeight: "var(--font-weight-bold)",
 							color: "var(--color-text-primary)",
 							margin: 0
 						},
-						children: x ? "Edit Button" : "Add Button"
-					}), /* @__PURE__ */ f(ce, {
+						children: S ? x("bigconsole.widget.actions.header.editTitle", "Edit Button") : x("bigconsole.widget.actions.header.addTitle", "Add Button")
+					}), /* @__PURE__ */ f(fe, {
 						style: {
 							fontSize: "var(--font-size-body-sm)",
 							color: "var(--color-text-secondary)",
 							margin: "var(--space-controlGap) 0 0 0"
 						},
-						children: x ? "Update the button and what it does" : "Add a button and choose what it does"
+						children: S ? x("bigconsole.widget.actions.header.editDescription", "Update the button and what it does") : x("bigconsole.widget.actions.header.addDescription", "Add a button and choose what it does")
 					})] })]
 				})
 			}), /* @__PURE__ */ p("form", {
-				onSubmit: Ee,
+				onSubmit: Ne,
 				children: [/* @__PURE__ */ p("div", {
 					style: {
 						padding: "var(--space-pagePadding)",
@@ -262,7 +259,7 @@ var h = {
 						overflowY: "auto"
 					},
 					children: [
-						(Q || ve) && /* @__PURE__ */ f("div", {
+						(Q || xe) && /* @__PURE__ */ f("div", {
 							style: {
 								padding: "var(--space-controlGap)",
 								backgroundColor: "var(--color-status-error-bgSubtle)",
@@ -276,7 +273,7 @@ var h = {
 									color: "var(--color-status-error-text)",
 									margin: 0
 								},
-								children: Q || ve
+								children: Q || xe
 							})
 						}),
 						/* @__PURE__ */ p("div", {
@@ -284,16 +281,20 @@ var h = {
 							children: [
 								/* @__PURE__ */ p("label", {
 									style: h,
-									children: ["Button label ", /* @__PURE__ */ f("span", {
-										style: { color: "var(--color-status-error-text)" },
-										children: "*"
-									})]
+									children: [
+										x("bigconsole.widget.actions.field.buttonLabel", "Button label"),
+										" ",
+										/* @__PURE__ */ f("span", {
+											style: { color: "var(--color-status-error-text)" },
+											children: "*"
+										})
+									]
 								}),
 								/* @__PURE__ */ f(o, {
-									ref: S,
-									value: w,
-									onChange: (e) => Te(e.target.value),
-									placeholder: "e.g., Refresh Data, Export CSV",
+									ref: C,
+									value: T,
+									onChange: (e) => Me(e.target.value),
+									placeholder: x("bigconsole.widget.actions.field.buttonLabelPlaceholder", "e.g., Refresh Data, Export CSV"),
 									disabled: b,
 									style: {
 										height: "var(--size-controlHeight-md)",
@@ -302,7 +303,7 @@ var h = {
 								}),
 								/* @__PURE__ */ f("p", {
 									style: g,
-									children: "Text shown on the button"
+									children: x("bigconsole.widget.actions.field.buttonLabelHint", "Text shown on the button")
 								})
 							]
 						}),
@@ -315,10 +316,10 @@ var h = {
 							},
 							children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
 								style: h,
-								children: "Style"
+								children: x("bigconsole.widget.actions.field.style", "Style")
 							}), /* @__PURE__ */ p(s, {
-								value: A,
-								onValueChange: (e) => j(e),
+								value: j,
+								onValueChange: (e) => M(e),
 								disabled: b,
 								children: [/* @__PURE__ */ f(u, {
 									style: {
@@ -328,30 +329,30 @@ var h = {
 									children: /* @__PURE__ */ f(d, {})
 								}), /* @__PURE__ */ f(c, {
 									style: _,
-									children: ge.map((e) => /* @__PURE__ */ f(l, {
+									children: Ae.map((e) => /* @__PURE__ */ f(l, {
 										value: e.value,
 										children: e.label
 									}, e.value))
 								})]
 							})] }), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
 								style: h,
-								children: "Icon"
+								children: x("bigconsole.widget.actions.field.icon", "Icon")
 							}), /* @__PURE__ */ p(s, {
-								value: M,
-								onValueChange: N,
+								value: N,
+								onValueChange: P,
 								disabled: b,
 								children: [/* @__PURE__ */ f(u, {
 									style: {
 										height: "var(--size-controlHeight-md)",
 										fontSize: "var(--font-size-body-sm)"
 									},
-									children: /* @__PURE__ */ f(d, { placeholder: "No icon" })
+									children: /* @__PURE__ */ f(d, { placeholder: x("bigconsole.widget.actions.icon.none", "No icon") })
 								}), /* @__PURE__ */ f(c, {
 									style: {
 										..._,
 										maxHeight: "200px"
 									},
-									children: _e.map((e) => /* @__PURE__ */ f(l, {
+									children: je.map((e) => /* @__PURE__ */ f(l, {
 										value: e.value || "none",
 										children: e.label
 									}, e.value || "none"))
@@ -373,7 +374,7 @@ var h = {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-text-muted)"
 								},
-								children: "Preview:"
+								children: x("bigconsole.widget.actions.preview.label", "Preview:")
 							}), /* @__PURE__ */ f("button", {
 								type: "button",
 								style: {
@@ -381,12 +382,12 @@ var h = {
 									fontSize: "var(--font-size-body-sm)",
 									fontWeight: "var(--font-weight-medium)",
 									borderRadius: "var(--radius-button)",
-									backgroundColor: De(A),
+									backgroundColor: Pe(j),
 									color: "var(--color-action-primary-text)",
 									border: "none",
 									cursor: "default"
 								},
-								children: w || "Button"
+								children: T || x("bigconsole.widget.actions.preview.buttonFallback", "Button")
 							})]
 						}),
 						/* @__PURE__ */ p("div", {
@@ -394,12 +395,12 @@ var h = {
 							children: [
 								/* @__PURE__ */ f("label", {
 									style: h,
-									children: "When clicked"
+									children: x("bigconsole.widget.actions.field.whenClicked", "When clicked")
 								}),
 								/* @__PURE__ */ p(s, {
-									value: P,
+									value: F,
 									onValueChange: (e) => {
-										C.current = !0, F(e);
+										w.current = !0, I(e);
 									},
 									disabled: b,
 									children: [/* @__PURE__ */ f(u, {
@@ -410,19 +411,19 @@ var h = {
 										children: /* @__PURE__ */ f(d, {})
 									}), /* @__PURE__ */ f(c, {
 										style: _,
-										children: me.map((e) => /* @__PURE__ */ f(l, {
+										children: ke.map((e) => /* @__PURE__ */ f(l, {
 											value: e.value,
 											children: e.label
 										}, e.value))
 									})]
 								}),
-								Oe && /* @__PURE__ */ f("p", {
+								Fe && /* @__PURE__ */ f("p", {
 									style: g,
-									children: Oe.hint
+									children: Fe.hint
 								})
 							]
 						}),
-						P === "WEBHOOK" && /* @__PURE__ */ p("div", {
+						F === "WEBHOOK" && /* @__PURE__ */ p("div", {
 							style: {
 								marginBottom: "var(--space-formGap)",
 								paddingLeft: "var(--space-formGap)",
@@ -434,16 +435,20 @@ var h = {
 							children: [
 								/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ p("label", {
 									style: h,
-									children: ["URL ", /* @__PURE__ */ f("span", {
-										style: { color: "var(--color-status-error-text)" },
-										children: "*"
-									})]
+									children: [
+										x("bigconsole.widget.actions.webhook.urlLabel", "URL"),
+										" ",
+										/* @__PURE__ */ f("span", {
+											style: { color: "var(--color-status-error-text)" },
+											children: "*"
+										})
+									]
 								}), /* @__PURE__ */ f(o, {
-									value: I,
+									value: L,
 									onChange: (e) => {
-										C.current = !0, L(e.target.value), Q && $(null);
+										w.current = !0, we(e.target.value), Q && $(null);
 									},
-									placeholder: "https://your-service.com/hook",
+									placeholder: x("bigconsole.widget.actions.webhook.urlPlaceholder", "https://your-service.com/hook"),
 									disabled: b,
 									style: {
 										height: "var(--size-controlHeight-md)",
@@ -454,11 +459,11 @@ var h = {
 									style: { maxWidth: "160px" },
 									children: [/* @__PURE__ */ f("label", {
 										style: h,
-										children: "Method"
+										children: x("bigconsole.widget.actions.webhook.methodLabel", "Method")
 									}), /* @__PURE__ */ p(s, {
 										value: R,
 										onValueChange: (e) => {
-											C.current = !0, z(e);
+											w.current = !0, z(e);
 										},
 										disabled: b,
 										children: [/* @__PURE__ */ f(u, {
@@ -469,7 +474,7 @@ var h = {
 											children: /* @__PURE__ */ f(d, {})
 										}), /* @__PURE__ */ f(c, {
 											style: _,
-											children: he.map((e) => /* @__PURE__ */ f(l, {
+											children: ve.map((e) => /* @__PURE__ */ f(l, {
 												value: e,
 												children: e
 											}, e))
@@ -478,20 +483,23 @@ var h = {
 								}),
 								/* @__PURE__ */ f("p", {
 									style: g,
-									children: "The widget's current data is sent as the request payload."
+									children: x("bigconsole.widget.actions.webhook.payloadHint", "The widget's current data is sent as the request payload.")
 								}),
-								/^http:\/\//i.test(I.trim()) && /* @__PURE__ */ p("p", {
+								/^http:\/\//i.test(L.trim()) && /* @__PURE__ */ p("p", {
 									style: {
 										...g,
 										color: "var(--color-status-warning-text)"
 									},
 									children: [
-										"Warning: ",
+										x("bigconsole.widget.actions.webhook.insecureWarningPrefix", "Warning:"),
+										" ",
 										/* @__PURE__ */ f("code", { children: "http://" }),
-										" is unencrypted — the widget's data will be sent in plaintext. Use",
+										" ",
+										x("bigconsole.widget.actions.webhook.insecureWarningMiddle", "is unencrypted — the widget's data will be sent in plaintext. Use"),
 										" ",
 										/* @__PURE__ */ f("code", { children: "https://" }),
-										" if it may contain anything sensitive."
+										" ",
+										x("bigconsole.widget.actions.webhook.insecureWarningSuffix", "if it may contain anything sensitive.")
 									]
 								})
 							]
@@ -509,7 +517,7 @@ var h = {
 									cursor: "pointer",
 									marginBottom: "var(--space-formGap)"
 								},
-								children: [/* @__PURE__ */ f(a, {
+								children: [/* @__PURE__ */ f(le, {
 									checked: W,
 									onCheckedChange: (e) => G(e === !0),
 									disabled: b
@@ -519,7 +527,7 @@ var h = {
 										fontWeight: "var(--font-weight-semibold)",
 										color: "var(--color-text-primary)"
 									},
-									children: "Ask for confirmation first"
+									children: x("bigconsole.widget.actions.confirm.toggleLabel", "Ask for confirmation first")
 								})]
 							}), W && /* @__PURE__ */ p("div", {
 								style: {
@@ -538,7 +546,7 @@ var h = {
 											color: "var(--color-text-secondary)",
 											marginBottom: "var(--space-controlGap)"
 										},
-										children: "Dialog Title"
+										children: x("bigconsole.widget.actions.confirm.dialogTitleLabel", "Dialog Title")
 									}), /* @__PURE__ */ f(o, {
 										value: K,
 										onChange: (e) => q(e.target.value),
@@ -556,8 +564,8 @@ var h = {
 											color: "var(--color-text-secondary)",
 											marginBottom: "var(--space-controlGap)"
 										},
-										children: "Message"
-									}), /* @__PURE__ */ f(pe, {
+										children: x("bigconsole.widget.actions.confirm.messageLabel", "Message")
+									}), /* @__PURE__ */ f(_e, {
 										value: J,
 										onChange: (e) => Y(e.target.value),
 										rows: 2,
@@ -581,9 +589,9 @@ var h = {
 												color: "var(--color-text-secondary)",
 												marginBottom: "var(--space-controlGap)"
 											},
-											children: "Confirm Button"
+											children: x("bigconsole.widget.actions.confirm.confirmButtonLabel", "Confirm Button")
 										}), /* @__PURE__ */ f(o, {
-											value: Ce,
+											value: De,
 											onChange: (e) => X(e.target.value),
 											disabled: b,
 											style: {
@@ -598,9 +606,9 @@ var h = {
 												color: "var(--color-text-secondary)",
 												marginBottom: "var(--space-controlGap)"
 											},
-											children: "Cancel Button"
+											children: x("bigconsole.widget.actions.confirm.cancelButtonLabel", "Cancel Button")
 										}), /* @__PURE__ */ f(o, {
-											value: we,
+											value: Oe,
 											onChange: (e) => Z(e.target.value),
 											disabled: b,
 											style: {
@@ -619,7 +627,7 @@ var h = {
 							},
 							children: [/* @__PURE__ */ p("button", {
 								type: "button",
-								onClick: () => Se((e) => !e),
+								onClick: () => Ee((e) => !e),
 								style: {
 									display: "flex",
 									alignItems: "center",
@@ -632,11 +640,11 @@ var h = {
 									fontWeight: "var(--font-weight-semibold)",
 									color: "var(--color-text-primary)"
 								},
-								children: [f(xe ? ee : te, { style: {
+								children: [f(Te ? ne : re, { style: {
 									height: "14px",
 									width: "14px"
-								} }), "Advanced"]
-							}), xe && /* @__PURE__ */ p("div", {
+								} }), x("bigconsole.widget.actions.advanced.toggle", "Advanced")]
+							}), Te && /* @__PURE__ */ p("div", {
 								style: {
 									marginTop: "var(--space-formGap)",
 									display: "flex",
@@ -646,15 +654,15 @@ var h = {
 								children: [/* @__PURE__ */ p("div", { children: [
 									/* @__PURE__ */ f("label", {
 										style: h,
-										children: "Event name (id)"
+										children: x("bigconsole.widget.actions.advanced.eventNameLabel", "Event name (id)")
 									}),
 									/* @__PURE__ */ f(o, {
-										value: x && v ? v.name : E,
+										value: S && v ? v.name : D,
 										onChange: (e) => {
-											D(e.target.value), k(!0);
+											O(e.target.value), A(!0);
 										},
-										placeholder: "auto from label",
-										disabled: b || x,
+										placeholder: x("bigconsole.widget.actions.advanced.eventNamePlaceholder", "auto from label"),
+										disabled: b || S,
 										style: {
 											height: "var(--size-controlHeight-md)",
 											fontSize: "var(--font-size-body-sm)",
@@ -664,15 +672,16 @@ var h = {
 									/* @__PURE__ */ p("p", {
 										style: g,
 										children: [
-											"Emits",
+											x("bigconsole.widget.actions.advanced.emitsPrefix", "Emits"),
 											" ",
 											/* @__PURE__ */ p("code", { children: [
 												"widget:",
-												x && v ? v.name : m(E || w) || "<name>",
+												S && v ? v.name : m(D || T) || "<name>",
 												":clicked"
 											] }),
-											". ",
-											x ? "Fixed once created." : "Auto-derived from the label."
+											".",
+											" ",
+											S ? x("bigconsole.widget.actions.advanced.emitsFixed", "Fixed once created.") : x("bigconsole.widget.actions.advanced.emitsAutoDerived", "Auto-derived from the label.")
 										]
 									})
 								] }), /* @__PURE__ */ p("div", {
@@ -688,7 +697,7 @@ var h = {
 											gap: "var(--space-controlGap)",
 											cursor: "pointer"
 										},
-										children: [/* @__PURE__ */ f(a, {
+										children: [/* @__PURE__ */ f(le, {
 											checked: B,
 											onCheckedChange: (e) => V(e === !0),
 											disabled: b
@@ -697,7 +706,7 @@ var h = {
 												fontSize: "var(--font-size-body-sm)",
 												color: "var(--color-text-primary)"
 											},
-											children: "Disabled"
+											children: x("bigconsole.widget.actions.advanced.disabled", "Disabled")
 										})]
 									}), /* @__PURE__ */ p("label", {
 										style: {
@@ -706,7 +715,7 @@ var h = {
 											gap: "var(--space-controlGap)",
 											cursor: "pointer"
 										},
-										children: [/* @__PURE__ */ f(a, {
+										children: [/* @__PURE__ */ f(le, {
 											checked: H,
 											onCheckedChange: (e) => U(e === !0),
 											disabled: b
@@ -715,14 +724,14 @@ var h = {
 												fontSize: "var(--font-size-body-sm)",
 												color: "var(--color-text-primary)"
 											},
-											children: "Hidden"
+											children: x("bigconsole.widget.actions.advanced.hidden", "Hidden")
 										})]
 									})]
 								})]
 							})]
 						})
 					]
-				}), /* @__PURE__ */ p(le, {
+				}), /* @__PURE__ */ p(pe, {
 					style: {
 						padding: "var(--space-formGap) var(--space-pagePadding)",
 						borderTop: "1px solid var(--color-border)",
@@ -731,40 +740,44 @@ var h = {
 						justifyContent: "flex-end",
 						gap: "var(--space-controlGap)"
 					},
-					children: [/* @__PURE__ */ f(ae, {
+					children: [/* @__PURE__ */ f(ce, {
 						type: "button",
 						variant: "outline",
-						onClick: ye,
+						onClick: Se,
 						disabled: b,
 						style: { height: "var(--size-controlHeight-md)" },
-						children: "Cancel"
-					}), /* @__PURE__ */ f(ae, {
-						type: "submit",
-						disabled: b || !w.trim(),
-						style: {
-							height: "var(--size-controlHeight-md)",
-							backgroundColor: "var(--color-action-primary-bg)"
-						},
-						children: b ? /* @__PURE__ */ p("span", {
+						children: x("bigconsole.widget.actions.footer.cancel", "Cancel")
+					}), /* @__PURE__ */ f(te, {
+						permission: S ? e.WIDGET_ACTION_UPDATE : e.WIDGET_ACTION_CREATE,
+						deniedBehavior: "disable",
+						children: /* @__PURE__ */ f(ce, {
+							type: "submit",
+							disabled: b || !T.trim(),
 							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "var(--space-iconGap)"
-							},
-							children: [/* @__PURE__ */ f(fe, { style: {
-								height: "var(--size-icon-sm)",
-								width: "var(--size-icon-sm)"
-							} }), "Saving..."]
-						}) : /* @__PURE__ */ p("span", {
-							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "var(--space-iconGap)"
+								height: "var(--size-controlHeight-md)",
+								backgroundColor: "var(--color-action-primary-bg)"
 							},
-							children: [f(x ? ne : re, { style: {
-								height: "var(--size-icon-sm)",
-								width: "var(--size-icon-sm)"
-							} }), x ? "Update Button" : "Add Button"]
+							children: b ? /* @__PURE__ */ p("span", {
+								style: {
+									display: "flex",
+									alignItems: "center",
+									gap: "var(--space-iconGap)"
+								},
+								children: [/* @__PURE__ */ f(ge, { style: {
+									height: "var(--size-icon-sm)",
+									width: "var(--size-icon-sm)"
+								} }), x("bigconsole.widget.actions.footer.saving", "Saving...")]
+							}) : /* @__PURE__ */ p("span", {
+								style: {
+									display: "flex",
+									alignItems: "center",
+									gap: "var(--space-iconGap)"
+								},
+								children: [f(S ? ie : ae, { style: {
+									height: "var(--size-icon-sm)",
+									width: "var(--size-icon-sm)"
+								} }), S ? x("bigconsole.widget.actions.footer.updateButton", "Update Button") : x("bigconsole.widget.actions.footer.addButton", "Add Button")]
+							})
 						})
 					})]
 				})]