@burdenoff/microfe-botmanor 2026.1101.1 → 2026.1101.3

package/dist/botlit/pages/PromptTemplateDetailPage.js

@@ -1,19 +1,19 @@
 import { useBotlit as e } from "../providers/BotlitProvider.js";
-import { formatRelativeTime as t } from "../utils/formatters.js";
-import { BOTMANOR_PERMISSIONS as n } from "../permissions/botmanorPermissions.js";
-import { BotmanorPermissionGate as r } from "../permissions/useBotmanorPermissions.js";
-import { PageLayout as i } from "../components/PageLayout.js";
-import { Button as a } from "../components/Button.js";
+import { graphqlErrorMessage as t } from "../utils/errors.js";
+import { formatRelativeTime as n } from "../utils/formatters.js";
+import { BOTMANOR_PERMISSIONS as r } from "../permissions/botmanorPermissions.js";
+import { BotmanorPermissionGate as i } from "../permissions/useBotmanorPermissions.js";
+import { PageLayout as a } from "../components/PageLayout.js";
+import { Button as o } from "../components/Button.js";
 import "../permissions/index.js";
-import { Card as o, CardContent as s, CardDescription as c, CardHeader as l, CardTitle as u } from "../components/Card.js";
-import { Badge as d, StatusBadge as ee } from "../components/Badge.js";
-import { isNative as f, nativeCopyText as te, nativeImpact as ne, nativeNotify as p, nativeToast as re } from "../../utils/nativeBridge.js";
+import { Card as s, CardContent as c, CardDescription as l, CardHeader as u, CardTitle as d } from "../components/Card.js";
+import { Badge as f, StatusBadge as ee } from "../components/Badge.js";
+import { isNative as p, nativeCopyText as te, nativeImpact as ne, nativeNotify as m, nativeToast as re } from "../../utils/nativeBridge.js";
 import { EmptyState as ie } from "../components/EmptyState.js";
-import { FormField as m, Input as h, Textarea as g } from "../components/Input.js";
-import { toUnion as _ } from "../utils/unions.js";
-import { promptTemplateExamples as v, promptTemplateVariables as ae, useCreatePromptTemplate as oe, useDeletePromptTemplate as se, usePromptTemplate as ce, useRenderPromptTemplate as le, useUpdatePromptTemplate as ue } from "../hooks/usePromptTemplates.js";
+import { FormField as h, Input as g, Textarea as _ } from "../components/Input.js";
+import { toUnion as v } from "../utils/unions.js";
+import { promptTemplateExamples as ae, promptTemplateVariables as oe, useCreatePromptTemplate as se, useDeletePromptTemplate as ce, usePromptTemplate as le, useRenderPromptTemplate as ue, useUpdatePromptTemplate as de } from "../hooks/usePromptTemplates.js";
 import "../hooks/index.js";
-import { graphqlErrorMessage as de } from "../utils/errors.js";
 import { useMemo as fe, useState as y } from "react";
 import { PagePurpose as pe } from "@burdenoff/fe-libs/ui";
 import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
@@ -32,7 +32,7 @@ var j = [
 	"WORKSPACE",
 	"PUBLIC"
 ], M = ({ isNew: M }) => {
-	let { templateId: xe } = me(), { navigateTo: N } = e(), { data: P, loading: Se } = ce(M ? void 0 : xe), { create: Ce, loading: we } = oe(), { update: Te, loading: Ee } = ue(), { remove: De, loading: Oe } = se(), { render: ke, loading: Ae } = le(), [F, I] = y("edit"), [L, R] = y(!1), [z, je] = y({}), [B, V] = y(null), [H, U] = y(null), [W, G] = y(!1), [Me, K] = y(!1), [q, J] = y({
+	let { templateId: xe } = me(), { navigateTo: N } = e(), { data: P, loading: Se } = le(M ? void 0 : xe), { create: Ce, loading: we } = se(), { update: Te, loading: Ee } = de(), { remove: De, loading: Oe } = ce(), { render: ke, loading: Ae } = ue(), [F, I] = y("edit"), [L, R] = y(!1), [z, je] = y({}), [B, V] = y(null), [H, U] = y(null), [W, G] = y(!1), [Me, K] = y(!1), [q, J] = y({
 		name: "",
 		slug: "",
 		description: "",
@@ -99,21 +99,21 @@ var j = [
 					variables: z
 				}));
 			} catch (e) {
-				let t = de(e, "Failed to render prompt template");
-				V(null), U(t), A.error(t);
+				let n = t(e, "Failed to render prompt template");
+				V(null), U(n), A.error(n);
 			}
 		}
 	}, Le = async () => {
-		await te(P?.templateText || q.templateText), R(!0), f() && re("Copied"), setTimeout(() => R(!1), 2e3);
+		await te(P?.templateText || q.templateText), R(!0), p() && re("Copied"), setTimeout(() => R(!1), 2e3);
 	}, Re = () => {
 		P && (J({
 			name: P.name,
 			slug: P.slug,
 			description: P.description || "",
-			visibility: _(P.visibility, be, "PRIVATE"),
+			visibility: v(P.visibility, be, "PRIVATE"),
 			templateText: P.templateText,
-			variables: ae(P),
-			exampleInputs: v(P)
+			variables: oe(P),
+			exampleInputs: ae(P)
 		}), G(!0));
 	}, ze = async () => {
 		if (!(!P || !q.name || !q.slug)) {
@@ -138,21 +138,21 @@ var j = [
 		}
 	}, Be = async () => {
 		if (P) try {
-			await De(P.id), f() && p("success"), N("prompt-templates");
+			await De(P.id), p() && m("success"), N("prompt-templates");
 		} catch (e) {
-			throw f() && p("error"), e;
+			throw p() && m("error"), e;
 		}
 	}, Z = (e) => e.replace(/\{\{(\w+)\}\}/g, "<span class=\"bg-action-primary-bg/20 text-primary px-1 rounded font-mono\">{{$1}}</span>");
-	if (M) return /* @__PURE__ */ x(i, {
+	if (M) return /* @__PURE__ */ x(a, {
 		title: "Create Prompt Template",
 		description: "Define a reusable prompt template with variables",
 		actions: /* @__PURE__ */ S("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ x(a, {
+			children: [/* @__PURE__ */ x(o, {
 				variant: "outline",
 				onClick: () => N("prompt-templates"),
 				children: "Cancel"
-			}), /* @__PURE__ */ x(a, {
+			}), /* @__PURE__ */ x(o, {
 				leftIcon: /* @__PURE__ */ x(D, { size: 16 }),
 				onClick: Ne,
 				isLoading: we,
@@ -165,15 +165,15 @@ var j = [
 			children: [/* @__PURE__ */ S("div", {
 				className: "lg:col-span-2 space-y-6",
 				children: [
-					/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ x(u, { children: "Basic Information" }) }), /* @__PURE__ */ S(s, {
+					/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ x(d, { children: "Basic Information" }) }), /* @__PURE__ */ S(c, {
 						className: "space-y-4",
 						children: [
 							/* @__PURE__ */ S("div", {
 								className: "grid grid-cols-2 gap-4",
-								children: [/* @__PURE__ */ x(m, {
+								children: [/* @__PURE__ */ x(h, {
 									label: "Template Name",
 									required: !0,
-									children: /* @__PURE__ */ x(h, {
+									children: /* @__PURE__ */ x(g, {
 										placeholder: "e.g., Technical Support Template",
 										value: q.name,
 										onChange: (e) => J({
@@ -181,11 +181,11 @@ var j = [
 											name: e.target.value
 										})
 									})
-								}), /* @__PURE__ */ x(m, {
+								}), /* @__PURE__ */ x(h, {
 									label: "Slug",
 									required: !0,
 									description: "Unique identifier (lowercase, dashes)",
-									children: /* @__PURE__ */ x(h, {
+									children: /* @__PURE__ */ x(g, {
 										placeholder: "e.g., technical-support",
 										value: q.slug,
 										onChange: (e) => J({
@@ -195,9 +195,9 @@ var j = [
 									})
 								})]
 							}),
-							/* @__PURE__ */ x(m, {
+							/* @__PURE__ */ x(h, {
 								label: "Description",
-								children: /* @__PURE__ */ x(g, {
+								children: /* @__PURE__ */ x(_, {
 									placeholder: "What is this template used for?",
 									value: q.description,
 									onChange: (e) => J({
@@ -207,7 +207,7 @@ var j = [
 									rows: 2
 								})
 							}),
-							/* @__PURE__ */ x(m, {
+							/* @__PURE__ */ x(h, {
 								label: "Visibility",
 								children: /* @__PURE__ */ S("select", {
 									className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
@@ -234,14 +234,14 @@ var j = [
 							})
 						]
 					})] }),
-					/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ S(u, {
+					/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ S(d, {
 						className: "flex items-center gap-2",
 						children: [/* @__PURE__ */ x(C, { size: 18 }), "Template Content"]
-					}), /* @__PURE__ */ S(c, { children: [
+					}), /* @__PURE__ */ S(l, { children: [
 						"Use ",
 						"{{variable_name}}",
 						" syntax for variables"
-					] })] }), /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(g, {
+					] })] }), /* @__PURE__ */ S(c, { children: [/* @__PURE__ */ x(_, {
 						className: "font-mono text-sm min-h-[300px]",
 						placeholder: "You are a helpful assistant for {{company_name}}.\n\nYour role is to help users with {{task_type}}.\n\nGuidelines:\n- Be helpful and friendly\n- Provide accurate information\n- Reference: {{docs_url}}",
 						value: q.templateText,
@@ -254,54 +254,54 @@ var j = [
 						children: [/* @__PURE__ */ x("span", {
 							className: "text-sm text-text-secondary",
 							children: "Detected variables:"
-						}), Y.map((e) => /* @__PURE__ */ x(d, {
+						}), Y.map((e) => /* @__PURE__ */ x(f, {
 							variant: "secondary",
 							className: "font-mono",
 							children: e
 						}, e))]
 					})] })] }),
-					/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ S(u, {
+					/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ S(d, {
 						className: "flex items-center justify-between",
 						children: [/* @__PURE__ */ S("span", {
 							className: "flex items-center gap-2",
 							children: [/* @__PURE__ */ x(k, { size: 18 }), "Variables"]
-						}), /* @__PURE__ */ x(a, {
+						}), /* @__PURE__ */ x(o, {
 							variant: "outline",
 							size: "sm",
 							onClick: Pe,
 							children: "Add Variable"
 						})]
-					}), /* @__PURE__ */ x(c, { children: "Define the variables used in your template" })] }), /* @__PURE__ */ x(s, { children: q.variables.length > 0 ? /* @__PURE__ */ x("div", {
+					}), /* @__PURE__ */ x(l, { children: "Define the variables used in your template" })] }), /* @__PURE__ */ x(c, { children: q.variables.length > 0 ? /* @__PURE__ */ x("div", {
 						className: "space-y-4",
 						children: q.variables.map((e, t) => /* @__PURE__ */ S("div", {
 							className: "p-4 border rounded-lg bg-bg-sunken/30 space-y-3",
 							children: [/* @__PURE__ */ S("div", {
 								className: "grid grid-cols-4 gap-3",
 								children: [
-									/* @__PURE__ */ x(m, {
+									/* @__PURE__ */ x(h, {
 										label: "Name",
-										children: /* @__PURE__ */ x(h, {
+										children: /* @__PURE__ */ x(g, {
 											className: "font-mono",
 											placeholder: "variable_name",
 											value: e.name,
 											onChange: (e) => X(t, { name: e.target.value })
 										})
 									}),
-									/* @__PURE__ */ x(m, {
+									/* @__PURE__ */ x(h, {
 										label: "Type",
 										children: /* @__PURE__ */ x("select", {
 											className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
 											value: e.type,
-											onChange: (e) => X(t, { type: _(e.target.value, j, "string") }),
+											onChange: (e) => X(t, { type: v(e.target.value, j, "string") }),
 											children: j.map((e) => /* @__PURE__ */ x("option", {
 												value: e,
 												children: e
 											}, e))
 										})
 									}),
-									/* @__PURE__ */ x(m, {
+									/* @__PURE__ */ x(h, {
 										label: "Default Value",
-										children: /* @__PURE__ */ x(h, {
+										children: /* @__PURE__ */ x(g, {
 											placeholder: "Optional",
 											value: String(e.defaultValue || ""),
 											onChange: (e) => X(t, { defaultValue: e.target.value || void 0 })
@@ -320,7 +320,7 @@ var j = [
 												className: "text-sm",
 												children: "Required"
 											})]
-										}), /* @__PURE__ */ x(a, {
+										}), /* @__PURE__ */ x(o, {
 											variant: "ghost",
 											size: "sm",
 											className: "text-status-error-text",
@@ -329,9 +329,9 @@ var j = [
 										})]
 									})
 								]
-							}), /* @__PURE__ */ x(m, {
+							}), /* @__PURE__ */ x(h, {
 								label: "Description",
-								children: /* @__PURE__ */ x(h, {
+								children: /* @__PURE__ */ x(g, {
 									placeholder: "What is this variable for?",
 									value: e.description || "",
 									onChange: (e) => X(t, { description: e.target.value })
@@ -356,13 +356,13 @@ var j = [
 				]
 			}), /* @__PURE__ */ S("div", {
 				className: "space-y-6",
-				children: [/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ S(u, {
+				children: [/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ S(d, {
 					className: "flex items-center gap-2",
 					children: [/* @__PURE__ */ x(w, { size: 18 }), "Preview"]
-				}) }), /* @__PURE__ */ x(s, { children: /* @__PURE__ */ x("div", {
+				}) }), /* @__PURE__ */ x(c, { children: /* @__PURE__ */ x("div", {
 					className: "p-4 bg-bg-sunken rounded-lg text-sm whitespace-pre-wrap font-mono",
 					dangerouslySetInnerHTML: { __html: Z(q.templateText || "Enter template text...") }
-				}) })] }), /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ x(u, { children: "Quick Tips" }) }), /* @__PURE__ */ S(s, {
+				}) })] }), /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ x(d, { children: "Quick Tips" }) }), /* @__PURE__ */ S(c, {
 					className: "text-sm space-y-2",
 					children: [
 						/* @__PURE__ */ S("p", { children: [
@@ -386,28 +386,28 @@ var j = [
 			})]
 		})
 	});
-	if (Se) return /* @__PURE__ */ x(i, {
+	if (Se) return /* @__PURE__ */ x(a, {
 		title: "Loading...",
 		children: /* @__PURE__ */ x("div", { className: "h-96 bg-bg-sunken motion-safe:animate-vc-shimmer rounded-lg" })
 	});
-	if (!P) return /* @__PURE__ */ x(i, {
+	if (!P) return /* @__PURE__ */ x(a, {
 		title: "Template Not Found",
 		children: /* @__PURE__ */ x(ie, {
 			illustration: "empty-files",
 			title: "Template Not Found",
 			description: "This prompt template doesn't exist.",
-			action: /* @__PURE__ */ x(a, {
+			action: /* @__PURE__ */ x(o, {
 				onClick: () => N("prompt-templates"),
 				children: "Back to Templates"
 			})
 		})
 	});
-	let Q = ae(P), $ = v(P);
-	return /* @__PURE__ */ x(i, {
+	let Q = oe(P), $ = ae(P);
+	return /* @__PURE__ */ x(a, {
 		title: /* @__PURE__ */ S("div", {
 			className: "flex items-center gap-3",
 			children: [
-				/* @__PURE__ */ x(a, {
+				/* @__PURE__ */ x(o, {
 					variant: "ghost",
 					size: "icon",
 					onClick: () => N("prompt-templates"),
@@ -422,7 +422,7 @@ var j = [
 					children: [
 						/* @__PURE__ */ x("span", { children: P.name }),
 						/* @__PURE__ */ x(ee, { status: P.status }),
-						/* @__PURE__ */ S(d, {
+						/* @__PURE__ */ S(f, {
 							variant: "secondary",
 							className: "font-mono",
 							children: ["v", P.version]
@@ -440,26 +440,26 @@ var j = [
 		}),
 		actions: /* @__PURE__ */ S("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ x(a, {
+			children: [/* @__PURE__ */ x(o, {
 				variant: "outline",
 				leftIcon: x(L ? ge : _e, { size: 16 }),
 				onClick: Le,
 				children: L ? "Copied!" : "Copy"
-			}), W ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(a, {
+			}), W ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(o, {
 				variant: "outline",
 				onClick: () => G(!1),
 				children: "Cancel"
-			}), /* @__PURE__ */ x(a, {
+			}), /* @__PURE__ */ x(o, {
 				leftIcon: /* @__PURE__ */ x(D, { size: 16 }),
 				onClick: ze,
 				isLoading: Ee,
 				disabled: !q.name || !q.slug,
 				children: "Save Changes"
-			})] }) : Me ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(a, {
+			})] }) : Me ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(o, {
 				variant: "outline",
 				onClick: () => K(!1),
 				children: "Cancel"
-			}), /* @__PURE__ */ x(a, {
+			}), /* @__PURE__ */ x(o, {
 				variant: "destructive",
 				leftIcon: /* @__PURE__ */ x(O, { size: 16 }),
 				onClick: () => {
@@ -467,17 +467,17 @@ var j = [
 				},
 				isLoading: Oe,
 				children: "Confirm Delete"
-			})] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(r, {
-				permission: n.PROMPT_TEMPLATE_UPDATE,
-				children: /* @__PURE__ */ x(a, {
+			})] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(i, {
+				permission: r.PROMPT_TEMPLATE_UPDATE,
+				children: /* @__PURE__ */ x(o, {
 					variant: "outline",
 					leftIcon: /* @__PURE__ */ x(ve, { size: 16 }),
 					onClick: Re,
 					children: "Edit Template"
 				})
-			}), /* @__PURE__ */ x(r, {
-				permission: n.PROMPT_TEMPLATE_DELETE,
-				children: /* @__PURE__ */ x(a, {
+			}), /* @__PURE__ */ x(i, {
+				permission: r.PROMPT_TEMPLATE_DELETE,
+				children: /* @__PURE__ */ x(o, {
 					variant: "outline",
 					leftIcon: /* @__PURE__ */ x(O, { size: 16 }),
 					onClick: () => K(!0),
@@ -497,15 +497,15 @@ var j = [
 						", its declared variables and example inputs, and its version history. Edit and preview it here to perfect the instructions, then reuse it across agents so they share consistent, version-controlled behaviour."
 					]
 				}),
-				W && /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ x(u, { children: "Edit Template" }), /* @__PURE__ */ x(c, { children: "Update template details and content" })] }), /* @__PURE__ */ S(s, {
+				W && /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ x(d, { children: "Edit Template" }), /* @__PURE__ */ x(l, { children: "Update template details and content" })] }), /* @__PURE__ */ S(c, {
 					className: "space-y-4",
 					children: [
 						/* @__PURE__ */ S("div", {
 							className: "grid grid-cols-2 gap-4",
-							children: [/* @__PURE__ */ x(m, {
+							children: [/* @__PURE__ */ x(h, {
 								label: "Template Name",
 								required: !0,
-								children: /* @__PURE__ */ x(h, {
+								children: /* @__PURE__ */ x(g, {
 									placeholder: "e.g., Technical Support Template",
 									value: q.name,
 									onChange: (e) => J({
@@ -513,11 +513,11 @@ var j = [
 										name: e.target.value
 									})
 								})
-							}), /* @__PURE__ */ x(m, {
+							}), /* @__PURE__ */ x(h, {
 								label: "Slug",
 								required: !0,
 								description: "Unique identifier (lowercase, dashes)",
-								children: /* @__PURE__ */ x(h, {
+								children: /* @__PURE__ */ x(g, {
 									placeholder: "e.g., technical-support",
 									value: q.slug,
 									onChange: (e) => J({
@@ -527,9 +527,9 @@ var j = [
 								})
 							})]
 						}),
-						/* @__PURE__ */ x(m, {
+						/* @__PURE__ */ x(h, {
 							label: "Description",
-							children: /* @__PURE__ */ x(g, {
+							children: /* @__PURE__ */ x(_, {
 								placeholder: "What is this template used for?",
 								value: q.description,
 								onChange: (e) => J({
@@ -539,7 +539,7 @@ var j = [
 								rows: 2
 							})
 						}),
-						/* @__PURE__ */ x(m, {
+						/* @__PURE__ */ x(h, {
 							label: "Visibility",
 							children: /* @__PURE__ */ S("select", {
 								className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
@@ -564,10 +564,10 @@ var j = [
 								]
 							})
 						}),
-						/* @__PURE__ */ x(m, {
+						/* @__PURE__ */ x(h, {
 							label: "Template Content",
 							description: "Use {{variable_name}} syntax for variables",
-							children: /* @__PURE__ */ x(g, {
+							children: /* @__PURE__ */ x(_, {
 								className: "font-mono text-sm min-h-[200px]",
 								value: q.templateText,
 								onChange: (e) => J({
@@ -581,7 +581,7 @@ var j = [
 							children: [/* @__PURE__ */ x("span", {
 								className: "text-sm text-text-secondary",
 								children: "Detected variables:"
-							}), Y.map((e) => /* @__PURE__ */ x(d, {
+							}), Y.map((e) => /* @__PURE__ */ x(f, {
 								variant: "secondary",
 								className: "font-mono",
 								children: e
@@ -592,10 +592,10 @@ var j = [
 				/* @__PURE__ */ S("div", {
 					className: "grid grid-cols-2 md:grid-cols-4 gap-4",
 					children: [
-						/* @__PURE__ */ x(o, {
+						/* @__PURE__ */ x(s, {
 							treatment: "glass",
 							glow: !0,
-							children: /* @__PURE__ */ S(s, {
+							children: /* @__PURE__ */ S(c, {
 								className: "pt-6 text-center",
 								children: [/* @__PURE__ */ x("p", {
 									className: "text-3xl font-bold text-text-primary",
@@ -606,7 +606,7 @@ var j = [
 								})]
 							})
 						}),
-						/* @__PURE__ */ x(o, { children: /* @__PURE__ */ S(s, {
+						/* @__PURE__ */ x(s, { children: /* @__PURE__ */ S(c, {
 							className: "pt-6 text-center",
 							children: [/* @__PURE__ */ x("p", {
 								className: "text-3xl font-bold text-text-primary",
@@ -616,7 +616,7 @@ var j = [
 								children: "Examples"
 							})]
 						}) }),
-						/* @__PURE__ */ x(o, { children: /* @__PURE__ */ S(s, {
+						/* @__PURE__ */ x(s, { children: /* @__PURE__ */ S(c, {
 							className: "pt-6 text-center",
 							children: [/* @__PURE__ */ x("p", {
 								className: "text-3xl font-bold text-text-primary",
@@ -626,7 +626,7 @@ var j = [
 								children: "Revision"
 							})]
 						}) }),
-						/* @__PURE__ */ x(o, { children: /* @__PURE__ */ S(s, {
+						/* @__PURE__ */ x(s, { children: /* @__PURE__ */ S(c, {
 							className: "pt-6 text-center",
 							children: [/* @__PURE__ */ x("p", {
 								className: "text-lg font-bold text-text-primary capitalize",
@@ -641,17 +641,17 @@ var j = [
 				/* @__PURE__ */ S("div", {
 					className: "flex gap-2 border-b",
 					children: [
-						/* @__PURE__ */ S(a, {
+						/* @__PURE__ */ S(o, {
 							variant: F === "edit" ? "default" : "ghost",
 							onClick: () => I("edit"),
 							children: [/* @__PURE__ */ x(C, { className: "h-4 w-4 mr-2" }), "Template"]
 						}),
-						/* @__PURE__ */ S(a, {
+						/* @__PURE__ */ S(o, {
 							variant: F === "preview" ? "default" : "ghost",
 							onClick: () => I("preview"),
 							children: [/* @__PURE__ */ x(w, { className: "h-4 w-4 mr-2" }), "Preview"]
 						}),
-						/* @__PURE__ */ S(a, {
+						/* @__PURE__ */ S(o, {
 							variant: F === "test" ? "default" : "ghost",
 							onClick: () => I("test"),
 							children: [/* @__PURE__ */ x(E, { className: "h-4 w-4 mr-2" }), "Test"]
@@ -662,11 +662,11 @@ var j = [
 					className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
 					children: [/* @__PURE__ */ x("div", {
 						className: "lg:col-span-2",
-						children: /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ x(u, { children: "Template Content" }) }), /* @__PURE__ */ x(s, { children: /* @__PURE__ */ x("div", {
+						children: /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ x(d, { children: "Template Content" }) }), /* @__PURE__ */ x(c, { children: /* @__PURE__ */ x("div", {
 							className: "p-4 bg-bg-sunken rounded-lg font-mono text-sm whitespace-pre-wrap",
 							children: /* @__PURE__ */ x("div", { dangerouslySetInnerHTML: { __html: Z(P.templateText) } })
 						}) })] })
-					}), /* @__PURE__ */ x("div", { children: /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ S(u, {
+					}), /* @__PURE__ */ x("div", { children: /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ S(d, {
 						className: "flex items-center gap-2",
 						children: [
 							/* @__PURE__ */ x(k, { size: 18 }),
@@ -674,7 +674,7 @@ var j = [
 							Q.length,
 							")"
 						]
-					}) }), /* @__PURE__ */ x(s, { children: Q.length > 0 ? /* @__PURE__ */ x("div", {
+					}) }), /* @__PURE__ */ x(c, { children: Q.length > 0 ? /* @__PURE__ */ x("div", {
 						className: "space-y-3",
 						children: Q.map((e, t) => /* @__PURE__ */ S("div", {
 							className: "p-3 border rounded-lg",
@@ -686,11 +686,11 @@ var j = [
 										children: e.name
 									}), /* @__PURE__ */ S("div", {
 										className: "flex gap-1",
-										children: [/* @__PURE__ */ x(d, {
+										children: [/* @__PURE__ */ x(f, {
 											variant: "outline",
 											className: "text-xs",
 											children: e.type
-										}), e.required && /* @__PURE__ */ x(d, {
+										}), e.required && /* @__PURE__ */ x(f, {
 											variant: "destructive",
 											className: "text-xs",
 											children: "required"
@@ -719,7 +719,7 @@ var j = [
 						children: "No variables defined"
 					}) })] }) })]
 				}),
-				F === "preview" && /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ x(u, { children: "Rendered Preview" }), /* @__PURE__ */ x(c, { children: "Preview with example inputs (first example set)" })] }), /* @__PURE__ */ x(s, { children: /* @__PURE__ */ x("div", {
+				F === "preview" && /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ x(d, { children: "Rendered Preview" }), /* @__PURE__ */ x(l, { children: "Preview with example inputs (first example set)" })] }), /* @__PURE__ */ x(c, { children: /* @__PURE__ */ x("div", {
 					className: "p-4 bg-bg-sunken rounded-lg font-mono text-sm whitespace-pre-wrap",
 					children: $[0] ? P.templateText.replace(/\{\{(\w+)\}\}/g, (e, t) => {
 						let n = $[0][t];
@@ -731,12 +731,12 @@ var j = [
 				}) })] }),
 				F === "test" && /* @__PURE__ */ S("div", {
 					className: "grid grid-cols-1 lg:grid-cols-2 gap-6",
-					children: [/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ x(u, { children: "Test Inputs" }), /* @__PURE__ */ x(c, { children: "Enter values to test the template" })] }), /* @__PURE__ */ S(s, {
+					children: [/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ x(d, { children: "Test Inputs" }), /* @__PURE__ */ x(l, { children: "Enter values to test the template" })] }), /* @__PURE__ */ S(c, {
 						className: "space-y-4",
-						children: [Q.map((e) => /* @__PURE__ */ S(m, {
+						children: [Q.map((e) => /* @__PURE__ */ S(h, {
 							label: e.name,
 							required: e.required,
-							children: [/* @__PURE__ */ x(h, {
+							children: [/* @__PURE__ */ x(g, {
 								placeholder: e.defaultValue ? String(e.defaultValue) : `Enter ${e.name}`,
 								value: z[e.name] || "",
 								onChange: (t) => je({
@@ -747,9 +747,9 @@ var j = [
 								className: "text-xs text-text-secondary mt-1",
 								children: e.description
 							})]
-						}, e.name)), /* @__PURE__ */ x(r, {
-							permission: n.PROMPT_TEMPLATE_EXECUTE,
-							children: /* @__PURE__ */ x(a, {
+						}, e.name)), /* @__PURE__ */ x(i, {
+							permission: r.PROMPT_TEMPLATE_EXECUTE,
+							children: /* @__PURE__ */ x(o, {
 								className: "w-full",
 								leftIcon: /* @__PURE__ */ x(E, { size: 16 }),
 								onClick: Ie,
@@ -757,7 +757,7 @@ var j = [
 								children: "Render Template"
 							})
 						})]
-					})] }), /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ x(u, { children: "Output" }) }), /* @__PURE__ */ x(s, { children: H ? /* @__PURE__ */ x("div", {
+					})] }), /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ x(d, { children: "Output" }) }), /* @__PURE__ */ x(c, { children: H ? /* @__PURE__ */ x("div", {
 						role: "alert",
 						className: "flex items-start gap-2 rounded-lg border border-status-error-border/40 bg-status-error-bg/10 px-3 py-2 text-sm text-status-error-text",
 						children: /* @__PURE__ */ x("p", { children: H })
@@ -769,7 +769,7 @@ var j = [
 						children: [/* @__PURE__ */ x(E, { className: "h-8 w-8 mx-auto mb-2 opacity-50" }), /* @__PURE__ */ x("p", { children: "Enter inputs and click \"Render Template\" to see output" })]
 					}) })] })]
 				}),
-				$.length > 0 && F === "edit" && /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(l, { children: [/* @__PURE__ */ x(u, { children: "Example Inputs" }), /* @__PURE__ */ x(c, { children: "Pre-defined inputs for testing and documentation" })] }), /* @__PURE__ */ x(s, { children: /* @__PURE__ */ x("div", {
+				$.length > 0 && F === "edit" && /* @__PURE__ */ S(s, { children: [/* @__PURE__ */ S(u, { children: [/* @__PURE__ */ x(d, { children: "Example Inputs" }), /* @__PURE__ */ x(l, { children: "Pre-defined inputs for testing and documentation" })] }), /* @__PURE__ */ x(c, { children: /* @__PURE__ */ x("div", {
 					className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",
 					children: $.map((e, t) => /* @__PURE__ */ S("div", {
 						className: "p-4 border rounded-lg bg-bg-sunken/30",
@@ -791,10 +791,10 @@ var j = [
 						})]
 					}, t))
 				}) })] }),
-				/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(l, { children: /* @__PURE__ */ S(u, {
+				/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(u, { children: /* @__PURE__ */ S(d, {
 					className: "flex items-center gap-2",
 					children: [/* @__PURE__ */ x(ye, { size: 18 }), "Metadata"]
-				}) }), /* @__PURE__ */ x(s, { children: /* @__PURE__ */ S("div", {
+				}) }), /* @__PURE__ */ x(c, { children: /* @__PURE__ */ S("div", {
 					className: "grid grid-cols-2 md:grid-cols-4 gap-6 text-sm",
 					children: [
 						/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
@@ -802,21 +802,21 @@ var j = [
 							children: "Created"
 						}), /* @__PURE__ */ x("p", {
 							className: "font-medium",
-							children: t(P.createdAt)
+							children: n(P.createdAt)
 						})] }),
 						/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
 							className: "text-text-secondary",
 							children: "Updated"
 						}), /* @__PURE__ */ x("p", {
 							className: "font-medium",
-							children: t(P.updatedAt)
+							children: n(P.updatedAt)
 						})] }),
 						/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
 							className: "text-text-secondary",
 							children: "Tags"
 						}), /* @__PURE__ */ x("div", {
 							className: "flex gap-1",
-							children: P.tags.length > 0 ? P.tags.map((e) => /* @__PURE__ */ x(d, {
+							children: P.tags.length > 0 ? P.tags.map((e) => /* @__PURE__ */ x(f, {
 								variant: "secondary",
 								className: "text-xs",
 								children: e