@burdenoff/microfe-vibecontrols 2026.519.2 → 2026.519.4

package/dist/components/actions/ActionForm.js

@@ -28,38 +28,38 @@ var u = {
 	retryCount: 0,
 	confirmationRequired: !1
 };
-function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLoading: g = !1 }) {
-	let [_, v] = r({
+function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLoading: g = !1, extraSection: _ }) {
+	let [v, y] = r({
 		...u,
 		...f
-	}), [y, b] = r(f?.tags?.join(", ") ?? ""), x = n(null), S = s(), C = e();
+	}), [b, x] = r(f?.tags?.join(", ") ?? ""), S = n(null), C = s(), w = e();
 	t(() => {
-		x.current?.showModal();
+		S.current?.showModal();
 	}, []);
-	let w = (e, t) => v((n) => ({
+	let T = (e, t) => y((n) => ({
 		...n,
 		[e]: t
-	})), T = (e) => {
+	})), E = (e) => {
 		e.preventDefault();
-		let t = y.split(",").map((e) => e.trim()).filter(Boolean);
+		let t = b.split(",").map((e) => e.trim()).filter(Boolean);
 		m({
-			..._,
+			...v,
 			tags: t
 		});
-	}, E = "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg focus:border-transparent transition-all", D = "block text-sm font-medium text-text-secondary mb-1";
+	}, D = "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg focus:border-transparent transition-all", O = "block text-sm font-medium text-text-secondary mb-1";
 	return /* @__PURE__ */ c("dialog", {
-		ref: x,
+		ref: S,
 		className: "fixed inset-0 z-50 m-auto p-0 bg-transparent backdrop:bg-transparent",
 		onClose: h,
 		children: /* @__PURE__ */ l(a, { children: [/* @__PURE__ */ c(o.div, {
 			className: "fixed inset-0 bg-bg-overlay",
-			initial: S ? void 0 : { opacity: 0 },
+			initial: C ? void 0 : { opacity: 0 },
 			animate: { opacity: 1 },
 			exit: { opacity: 0 },
 			onClick: h
 		}), /* @__PURE__ */ l(o.div, {
 			className: "relative w-full max-w-2xl max-h-[85vh] overflow-y-auto bg-bg-surface rounded-lg shadow-xl",
-			initial: S ? void 0 : {
+			initial: C ? void 0 : {
 				opacity: 0,
 				scale: .95,
 				y: 8
@@ -94,50 +94,50 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 					children: /* @__PURE__ */ c(i, { className: "w-5 h-5 text-text-secondary" })
 				})]
 			}), /* @__PURE__ */ l("form", {
-				onSubmit: T,
+				onSubmit: E,
 				className: "p-6 space-y-4",
 				children: [
 					/* @__PURE__ */ l("div", {
 						className: "grid grid-cols-2 gap-4",
 						children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.nameSlug", "Name (slug)")
+							className: O,
+							children: w("vibecontrols.actions.form.nameSlug", "Name (slug)")
 						}), /* @__PURE__ */ c("input", {
-							className: E,
-							value: _.name,
-							onChange: (e) => w("name", e.target.value),
+							className: D,
+							value: v.name,
+							onChange: (e) => T("name", e.target.value),
 							placeholder: "my-action",
 							required: !0
 						})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.displayName", "Display Name")
+							className: O,
+							children: w("vibecontrols.actions.form.displayName", "Display Name")
 						}), /* @__PURE__ */ c("input", {
-							className: E,
-							value: _.displayName,
-							onChange: (e) => w("displayName", e.target.value),
+							className: D,
+							value: v.displayName,
+							onChange: (e) => T("displayName", e.target.value),
 							placeholder: "My Action",
 							required: !0
 						})] })]
 					}),
 					/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-						className: D,
-						children: C("vibecontrols.actions.form.description", "Description")
+						className: O,
+						children: w("vibecontrols.actions.form.description", "Description")
 					}), /* @__PURE__ */ c("textarea", {
-						className: `${E} resize-none`,
+						className: `${D} resize-none`,
 						rows: 2,
-						value: _.description,
-						onChange: (e) => w("description", e.target.value),
+						value: v.description,
+						onChange: (e) => T("description", e.target.value),
 						placeholder: "What does this action do?"
 					})] }),
 					/* @__PURE__ */ l("div", {
 						className: "grid grid-cols-2 gap-4",
 						children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.actionType", "Action Type")
+							className: O,
+							children: w("vibecontrols.actions.form.actionType", "Action Type")
 						}), /* @__PURE__ */ l("select", {
-							className: E,
-							value: _.actionType,
-							onChange: (e) => w("actionType", e.target.value),
+							className: D,
+							value: v.actionType,
+							onChange: (e) => T("actionType", e.target.value),
 							children: [
 								/* @__PURE__ */ c("option", {
 									value: "COMMAND",
@@ -157,12 +157,12 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 								})
 							]
 						})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.triggerType", "Trigger Type")
+							className: O,
+							children: w("vibecontrols.actions.form.triggerType", "Trigger Type")
 						}), /* @__PURE__ */ l("select", {
-							className: E,
-							value: _.triggerType,
-							onChange: (e) => w("triggerType", e.target.value),
+							className: D,
+							value: v.triggerType,
+							onChange: (e) => T("triggerType", e.target.value),
 							children: [
 								/* @__PURE__ */ c("option", {
 									value: "MANUAL",
@@ -183,113 +183,113 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 							]
 						})] })]
 					}),
-					_.triggerType === "SCHEDULED" && /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-						className: D,
-						children: C("vibecontrols.actions.form.schedule", "Schedule (cron expression)")
+					v.triggerType === "SCHEDULED" && /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
+						className: O,
+						children: w("vibecontrols.actions.form.schedule", "Schedule (cron expression)")
 					}), /* @__PURE__ */ c("input", {
-						className: E,
-						value: _.schedule,
-						onChange: (e) => w("schedule", e.target.value),
+						className: D,
+						value: v.schedule,
+						onChange: (e) => T("schedule", e.target.value),
 						placeholder: "*/5 * * * *"
 					})] }),
 					/* @__PURE__ */ l("div", {
 						className: "grid grid-cols-2 gap-4",
 						children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.category", "Category")
+							className: O,
+							children: w("vibecontrols.actions.form.category", "Category")
 						}), /* @__PURE__ */ c("input", {
-							className: E,
-							value: _.category,
-							onChange: (e) => w("category", e.target.value),
+							className: D,
+							value: v.category,
+							onChange: (e) => T("category", e.target.value),
 							placeholder: "deployment, testing, etc."
 						})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: D,
-							children: C("vibecontrols.actions.form.tags", "Tags (comma separated)")
+							className: O,
+							children: w("vibecontrols.actions.form.tags", "Tags (comma separated)")
 						}), /* @__PURE__ */ c("input", {
-							className: E,
-							value: y,
-							onChange: (e) => b(e.target.value),
+							className: D,
+							value: b,
+							onChange: (e) => x(e.target.value),
 							placeholder: "ci, deploy, infra"
 						})] })]
 					}),
-					_.actionType === "COMMAND" && /* @__PURE__ */ l("div", {
+					v.actionType === "COMMAND" && /* @__PURE__ */ l("div", {
 						className: "space-y-4 p-4 rounded-lg bg-bg-sunken/50 border border-border-default",
 						children: [
 							/* @__PURE__ */ c("h3", {
 								className: "text-sm font-semibold text-text-primary",
-								children: C("vibecontrols.actions.form.commandSettings", "Command Settings")
+								children: w("vibecontrols.actions.form.commandSettings", "Command Settings")
 							}),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.command", "Command")
+								className: O,
+								children: w("vibecontrols.actions.form.command", "Command")
 							}), /* @__PURE__ */ c("textarea", {
-								className: `${E} font-mono resize-none`,
+								className: `${D} font-mono resize-none`,
 								rows: 3,
-								value: _.command,
-								onChange: (e) => w("command", e.target.value),
+								value: v.command,
+								onChange: (e) => T("command", e.target.value),
 								placeholder: "echo 'Hello World'",
 								required: !0
 							})] }),
 							/* @__PURE__ */ l("div", {
 								className: "grid grid-cols-2 gap-4",
 								children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.workingDirectory", "Working Directory")
+									className: O,
+									children: w("vibecontrols.actions.form.workingDirectory", "Working Directory")
 								}), /* @__PURE__ */ c("input", {
-									className: E,
-									value: _.workingDirectory,
-									onChange: (e) => w("workingDirectory", e.target.value),
+									className: D,
+									value: v.workingDirectory,
+									onChange: (e) => T("workingDirectory", e.target.value),
 									placeholder: "/home/user/project"
 								})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.targetAgent", "Target Agent")
+									className: O,
+									children: w("vibecontrols.actions.form.targetAgent", "Target Agent")
 								}), /* @__PURE__ */ l("select", {
-									className: E,
-									value: _.targetAgentId,
-									onChange: (e) => w("targetAgentId", e.target.value),
+									className: D,
+									value: v.targetAgentId,
+									onChange: (e) => T("targetAgentId", e.target.value),
 									children: [/* @__PURE__ */ c("option", {
 										value: "",
-										children: C("vibecontrols.actions.form.anyAvailableAgent", "Any available agent")
+										children: w("vibecontrols.actions.form.anyAvailableAgent", "Any available agent")
 									}), p.map((e) => /* @__PURE__ */ l("option", {
 										value: e.id,
 										disabled: !e.isActive,
 										children: [
 											e.name,
 											" ",
-											e.isActive ? "" : C("vibecontrols.actions.form.offline", "(offline)")
+											e.isActive ? "" : w("vibecontrols.actions.form.offline", "(offline)")
 										]
 									}, e.id))]
 								})] })]
 							})
 						]
 					}),
-					_.actionType === "SCRIPT" && /* @__PURE__ */ l("div", {
+					v.actionType === "SCRIPT" && /* @__PURE__ */ l("div", {
 						className: "space-y-4 p-4 rounded-lg bg-bg-sunken/50 border border-border-default",
 						children: [
 							/* @__PURE__ */ c("h3", {
 								className: "text-sm font-semibold text-text-primary",
-								children: C("vibecontrols.actions.form.scriptSettings", "Script Settings")
+								children: w("vibecontrols.actions.form.scriptSettings", "Script Settings")
 							}),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.script", "Script")
+								className: O,
+								children: w("vibecontrols.actions.form.script", "Script")
 							}), /* @__PURE__ */ c("textarea", {
-								className: `${E} font-mono resize-none`,
+								className: `${D} font-mono resize-none`,
 								rows: 6,
-								value: _.script,
-								onChange: (e) => w("script", e.target.value),
+								value: v.script,
+								onChange: (e) => T("script", e.target.value),
 								placeholder: "#!/bin/bash\necho 'Hello'",
 								required: !0
 							})] }),
 							/* @__PURE__ */ l("div", {
 								className: "grid grid-cols-2 gap-4",
 								children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.interpreter", "Interpreter")
+									className: O,
+									children: w("vibecontrols.actions.form.interpreter", "Interpreter")
 								}), /* @__PURE__ */ l("select", {
-									className: E,
-									value: _.scriptInterpreter,
-									onChange: (e) => w("scriptInterpreter", e.target.value),
+									className: D,
+									value: v.scriptInterpreter,
+									onChange: (e) => T("scriptInterpreter", e.target.value),
 									children: [
 										/* @__PURE__ */ c("option", {
 											value: "bash",
@@ -305,62 +305,62 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 										})
 									]
 								})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.targetAgent", "Target Agent")
+									className: O,
+									children: w("vibecontrols.actions.form.targetAgent", "Target Agent")
 								}), /* @__PURE__ */ l("select", {
-									className: E,
-									value: _.targetAgentId,
-									onChange: (e) => w("targetAgentId", e.target.value),
+									className: D,
+									value: v.targetAgentId,
+									onChange: (e) => T("targetAgentId", e.target.value),
 									children: [/* @__PURE__ */ c("option", {
 										value: "",
-										children: C("vibecontrols.actions.form.anyAvailableAgent", "Any available agent")
+										children: w("vibecontrols.actions.form.anyAvailableAgent", "Any available agent")
 									}), p.map((e) => /* @__PURE__ */ l("option", {
 										value: e.id,
 										disabled: !e.isActive,
 										children: [
 											e.name,
 											" ",
-											e.isActive ? "" : C("vibecontrols.actions.form.offline", "(offline)")
+											e.isActive ? "" : w("vibecontrols.actions.form.offline", "(offline)")
 										]
 									}, e.id))]
 								})] })]
 							}),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.workingDirectory", "Working Directory")
+								className: O,
+								children: w("vibecontrols.actions.form.workingDirectory", "Working Directory")
 							}), /* @__PURE__ */ c("input", {
-								className: E,
-								value: _.workingDirectory,
-								onChange: (e) => w("workingDirectory", e.target.value),
+								className: D,
+								value: v.workingDirectory,
+								onChange: (e) => T("workingDirectory", e.target.value),
 								placeholder: "/home/user/project"
 							})] })
 						]
 					}),
-					_.actionType === "WEBHOOK" && /* @__PURE__ */ l("div", {
+					v.actionType === "WEBHOOK" && /* @__PURE__ */ l("div", {
 						className: "space-y-4 p-4 rounded-lg bg-bg-sunken/50 border border-border-default",
 						children: [
 							/* @__PURE__ */ c("h3", {
 								className: "text-sm font-semibold text-text-primary",
-								children: C("vibecontrols.actions.form.webhookSettings", "Webhook Settings")
+								children: w("vibecontrols.actions.form.webhookSettings", "Webhook Settings")
 							}),
 							/* @__PURE__ */ l("div", {
 								className: "grid grid-cols-[1fr_auto] gap-4",
 								children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.url", "URL")
+									className: O,
+									children: w("vibecontrols.actions.form.url", "URL")
 								}), /* @__PURE__ */ c("input", {
-									className: E,
-									value: _.webhookUrl,
-									onChange: (e) => w("webhookUrl", e.target.value),
+									className: D,
+									value: v.webhookUrl,
+									onChange: (e) => T("webhookUrl", e.target.value),
 									placeholder: "https://api.example.com/hook",
 									required: !0
 								})] }), /* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-									className: D,
-									children: C("vibecontrols.actions.form.method", "Method")
+									className: O,
+									children: w("vibecontrols.actions.form.method", "Method")
 								}), /* @__PURE__ */ l("select", {
-									className: E,
-									value: _.webhookMethod,
-									onChange: (e) => w("webhookMethod", e.target.value),
+									className: D,
+									value: v.webhookMethod,
+									onChange: (e) => T("webhookMethod", e.target.value),
 									children: [
 										/* @__PURE__ */ c("option", {
 											value: "GET",
@@ -386,22 +386,22 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 								})] })]
 							}),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.bodyJson", "Body (JSON)")
+								className: O,
+								children: w("vibecontrols.actions.form.bodyJson", "Body (JSON)")
 							}), /* @__PURE__ */ c("textarea", {
-								className: `${E} font-mono resize-none`,
+								className: `${D} font-mono resize-none`,
 								rows: 4,
-								value: _.webhookBody,
-								onChange: (e) => w("webhookBody", e.target.value),
+								value: v.webhookBody,
+								onChange: (e) => T("webhookBody", e.target.value),
 								placeholder: "{\"key\": \"value\"}"
 							})] }),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.authType", "Auth Type")
+								className: O,
+								children: w("vibecontrols.actions.form.authType", "Auth Type")
 							}), /* @__PURE__ */ l("select", {
-								className: E,
-								value: _.webhookAuthType,
-								onChange: (e) => w("webhookAuthType", e.target.value),
+								className: D,
+								value: v.webhookAuthType,
+								onChange: (e) => T("webhookAuthType", e.target.value),
 								children: [
 									/* @__PURE__ */ c("option", {
 										value: "",
@@ -427,26 +427,26 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 						className: "grid grid-cols-3 gap-4",
 						children: [
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.timeout", "Timeout (ms)")
+								className: O,
+								children: w("vibecontrols.actions.form.timeout", "Timeout (ms)")
 							}), /* @__PURE__ */ c("input", {
-								className: E,
+								className: D,
 								type: "number",
 								min: 1e3,
 								max: 3e5,
-								value: _.timeoutMs,
-								onChange: (e) => w("timeoutMs", parseInt(e.target.value) || 3e4)
+								value: v.timeoutMs,
+								onChange: (e) => T("timeoutMs", parseInt(e.target.value) || 3e4)
 							})] }),
 							/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-								className: D,
-								children: C("vibecontrols.actions.form.retryCount", "Retry Count")
+								className: O,
+								children: w("vibecontrols.actions.form.retryCount", "Retry Count")
 							}), /* @__PURE__ */ c("input", {
-								className: E,
+								className: D,
 								type: "number",
 								min: 0,
 								max: 10,
-								value: _.retryCount,
-								onChange: (e) => w("retryCount", parseInt(e.target.value) || 0)
+								value: v.retryCount,
+								onChange: (e) => T("retryCount", parseInt(e.target.value) || 0)
 							})] }),
 							/* @__PURE__ */ c("div", {
 								className: "flex items-end pb-2",
@@ -454,14 +454,18 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 									className: "flex items-center gap-2 text-sm text-text-secondary cursor-pointer",
 									children: [/* @__PURE__ */ c("input", {
 										type: "checkbox",
-										checked: _.confirmationRequired,
-										onChange: (e) => w("confirmationRequired", e.target.checked),
+										checked: v.confirmationRequired,
+										onChange: (e) => T("confirmationRequired", e.target.checked),
 										className: "rounded border-border-default"
-									}), C("vibecontrols.actions.form.requireConfirmation", "Require confirmation")]
+									}), w("vibecontrols.actions.form.requireConfirmation", "Require confirmation")]
 								})
 							})
 						]
 					}),
+					_ && /* @__PURE__ */ c("div", {
+						className: "pt-4 border-t border-border-default",
+						children: _
+					}),
 					/* @__PURE__ */ l("div", {
 						className: "flex items-center justify-end gap-3 pt-4 border-t border-border-default",
 						children: [/* @__PURE__ */ c("button", {
@@ -469,12 +473,12 @@ function d({ title: d, initialData: f, agents: p, onSubmit: m, onCancel: h, isLo
 							onClick: h,
 							disabled: g,
 							className: "px-4 py-2 text-sm font-medium text-text-primary bg-bg-surface border border-border-default rounded-md hover:bg-bg-elevated transition-colors disabled:opacity-50",
-							children: C("vibecontrols.actions.form.cancel", "Cancel")
+							children: w("vibecontrols.actions.form.cancel", "Cancel")
 						}), /* @__PURE__ */ c("button", {
 							type: "submit",
 							disabled: g,
 							className: "px-4 py-2 text-sm font-medium rounded-md bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50",
-							children: g ? C("vibecontrols.actions.form.saving", "Saving...") : f ? C("vibecontrols.actions.form.updateAction", "Update Action") : C("vibecontrols.actions.form.createAction", "Create Action")
+							children: g ? w("vibecontrols.actions.form.saving", "Saving...") : f ? w("vibecontrols.actions.form.updateAction", "Update Action") : w("vibecontrols.actions.form.createAction", "Create Action")
 						})]
 					})
 				]