@flanksource/clicky-ui 0.3.27 → 0.3.29

package/dist/data/ai/PromptCatalog/PromptPageHeader.cjs

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const button = require("../../../components/button.cjs");
+const Badge = require("../../Badge.cjs");
+const ErrorDetails = require("../../diagnostics/ErrorDetails.cjs");
+const promptCatalogModel = require("./prompt-catalog-model.cjs");
+const PromptSourceBadge = require("./PromptSourceBadge.cjs");
+const UiArrowLeft = require("../../../icons/components/UiArrowLeft.cjs");
+const UiWarningTriangle = require("../../../icons/components/UiWarningTriangle.cjs");
+function PromptPageHeader({
+  entry,
+  selectedLayer,
+  onBack,
+  actions
+}) {
+  const effective = promptCatalogModel.effectiveLayer(entry);
+  const shadowing = selectedLayer ? promptCatalogModel.layersAbove(entry, selectedLayer) : [];
+  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex flex-col gap-2 border-b border-border px-density-4 py-density-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+      onBack ? /* @__PURE__ */ jsxRuntime.jsx(
+        button.Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          onClick: onBack,
+          "aria-label": "Back to prompts",
+          children: /* @__PURE__ */ jsxRuntime.jsx(UiArrowLeft.UiArrowLeft, {})
+        }
+      ) : null,
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-lg font-semibold leading-tight", children: entry.title }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            PromptSourceBadge.PromptSourceBadge,
+            {
+              source: entry.source,
+              parseError: entry.parseError
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(ErrorDetails.CopyBadge, { label: "id", value: entry.id }),
+          entry.configPath && entry.configPath !== entry.id ? /* @__PURE__ */ jsxRuntime.jsx(ErrorDetails.CopyBadge, { label: "config", value: entry.configPath }) : null
+        ] }),
+        entry.description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: entry.description }) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs("dl", { className: "mt-2 grid gap-x-6 gap-y-1 text-xs sm:grid-cols-[auto_1fr]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground", children: "Used by" }),
+          /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "flex flex-wrap gap-1", children: (entry.usedBy ?? []).length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "—" }) : (entry.usedBy ?? []).map((command) => /* @__PURE__ */ jsxRuntime.jsx(
+            Badge.Badge,
+            {
+              variant: "soft",
+              tone: "neutral",
+              size: "xs",
+              className: "font-mono",
+              clickToCopy: false,
+              children: command
+            },
+            command
+          )) }),
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground", children: "Runs as" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "dd",
+            {
+              className: entry.effective.error ? "text-destructive" : "font-mono",
+              children: [
+                promptCatalogModel.runtimeSummary(entry.effective),
+                entry.effective.model ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1 font-sans text-muted-foreground", children: [
+                  "(from ",
+                  entry.effective.modelSource,
+                  ")"
+                ] }) : null
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground", children: "Runs from" }),
+          /* @__PURE__ */ jsxRuntime.jsx("dd", { children: effective ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            promptCatalogModel.layerLabel(effective.origin),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 font-mono text-muted-foreground", children: effective.filePath ?? effective.path })
+          ] }) : "built-in default" })
+        ] })
+      ] }),
+      actions ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: actions }) : null
+    ] }),
+    shadowing.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        role: "alert",
+        className: "flex items-center gap-2 rounded-md border border-amber-300 bg-amber-500/10 px-3 py-2 text-xs text-amber-800 dark:border-amber-500/40 dark:text-amber-300",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(UiWarningTriangle.UiWarningTriangle, { className: "shrink-0" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+            "A higher layer (",
+            shadowing.map((layer) => promptCatalogModel.layerLabel(layer.origin)).join(", "),
+            ") overrides this prompt; saving here changes nothing until that override is removed."
+          ] })
+        ]
+      }
+    ) : null
+  ] });
+}
+exports.PromptPageHeader = PromptPageHeader;
+//# sourceMappingURL=PromptPageHeader.cjs.map

package/dist/data/ai/PromptCatalog/PromptPageHeader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPageHeader.cjs","sources":["../../../../src/data/ai/PromptCatalog/PromptPageHeader.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Button } from \"../../../components/button\";\nimport { UiArrowLeft, UiWarningTriangle } from \"../../../icons\";\nimport { Badge } from \"../../Badge\";\nimport { CopyBadge } from \"../../diagnostics/ErrorDetails\";\nimport {\n  effectiveLayer,\n  layerLabel,\n  layersAbove,\n  runtimeSummary,\n} from \"./prompt-catalog-model\";\nimport { PromptSourceBadge } from \"./PromptSourceBadge\";\nimport type { PromptCatalogEntry, PromptCatalogLayer } from \"./types\";\n\nexport type PromptPageHeaderProps = {\n  entry: PromptCatalogEntry;\n  selectedLayer?: PromptCatalogLayer | undefined;\n  onBack?: (() => void) | undefined;\n  actions?: ReactNode | undefined;\n};\n\nexport function PromptPageHeader({\n  entry,\n  selectedLayer,\n  onBack,\n  actions,\n}: PromptPageHeaderProps) {\n  const effective = effectiveLayer(entry);\n  const shadowing = selectedLayer ? layersAbove(entry, selectedLayer) : [];\n  return (\n    <header className=\"flex flex-col gap-2 border-b border-border px-density-4 py-density-3\">\n      <div className=\"flex items-start gap-3\">\n        {onBack ? (\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"icon\"\n            onClick={onBack}\n            aria-label=\"Back to prompts\"\n          >\n            <UiArrowLeft />\n          </Button>\n        ) : null}\n        <div className=\"min-w-0 flex-1\">\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <h1 className=\"text-lg font-semibold leading-tight\">\n              {entry.title}\n            </h1>\n            <PromptSourceBadge\n              source={entry.source}\n              parseError={entry.parseError}\n            />\n            <CopyBadge label=\"id\" value={entry.id} />\n            {entry.configPath && entry.configPath !== entry.id ? (\n              <CopyBadge label=\"config\" value={entry.configPath} />\n            ) : null}\n          </div>\n          {entry.description ? (\n            <p className=\"mt-1 text-sm text-muted-foreground\">\n              {entry.description}\n            </p>\n          ) : null}\n          <dl className=\"mt-2 grid gap-x-6 gap-y-1 text-xs sm:grid-cols-[auto_1fr]\">\n            <dt className=\"text-muted-foreground\">Used by</dt>\n            <dd className=\"flex flex-wrap gap-1\">\n              {(entry.usedBy ?? []).length === 0 ? (\n                <span className=\"text-muted-foreground\">—</span>\n              ) : (\n                (entry.usedBy ?? []).map((command) => (\n                  <Badge\n                    key={command}\n                    variant=\"soft\"\n                    tone=\"neutral\"\n                    size=\"xs\"\n                    className=\"font-mono\"\n                    clickToCopy={false}\n                  >\n                    {command}\n                  </Badge>\n                ))\n              )}\n            </dd>\n            <dt className=\"text-muted-foreground\">Runs as</dt>\n            <dd\n              className={\n                entry.effective.error ? \"text-destructive\" : \"font-mono\"\n              }\n            >\n              {runtimeSummary(entry.effective)}\n              {entry.effective.model ? (\n                <span className=\"ml-1 font-sans text-muted-foreground\">\n                  (from {entry.effective.modelSource})\n                </span>\n              ) : null}\n            </dd>\n            <dt className=\"text-muted-foreground\">Runs from</dt>\n            <dd>\n              {effective ? (\n                <>\n                  {layerLabel(effective.origin)}\n                  <span className=\"ml-1 font-mono text-muted-foreground\">\n                    {effective.filePath ?? effective.path}\n                  </span>\n                </>\n              ) : (\n                \"built-in default\"\n              )}\n            </dd>\n          </dl>\n        </div>\n        {actions ? <div className=\"shrink-0\">{actions}</div> : null}\n      </div>\n      {shadowing.length > 0 ? (\n        <div\n          role=\"alert\"\n          className=\"flex items-center gap-2 rounded-md border border-amber-300 bg-amber-500/10 px-3 py-2 text-xs text-amber-800 dark:border-amber-500/40 dark:text-amber-300\"\n        >\n          <UiWarningTriangle className=\"shrink-0\" />\n          <span>\n            A higher layer (\n            {shadowing.map((layer) => layerLabel(layer.origin)).join(\", \")})\n            overrides this prompt; saving here changes nothing until that\n            override is removed.\n          </span>\n        </div>\n      ) : null}\n    </header>\n  );\n}\n"],"names":["effectiveLayer","layersAbove","jsxs","jsx","Button","UiArrowLeft","PromptSourceBadge","CopyBadge","Badge","runtimeSummary","Fragment","layerLabel","UiWarningTriangle"],"mappings":"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"}

package/dist/data/ai/PromptCatalog/PromptPageHeader.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from '../../../../../../node_modules/@types/react/index.d.ts';
+import { PromptCatalogEntry, PromptCatalogLayer } from './types';
+export type PromptPageHeaderProps = {
+    entry: PromptCatalogEntry;
+    selectedLayer?: PromptCatalogLayer | undefined;
+    onBack?: (() => void) | undefined;
+    actions?: ReactNode | undefined;
+};
+export declare function PromptPageHeader({ entry, selectedLayer, onBack, actions, }: PromptPageHeaderProps): import("react").JSX.Element;
+//# sourceMappingURL=PromptPageHeader.d.ts.map

package/dist/data/ai/PromptCatalog/PromptPageHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPageHeader.d.ts","sourceRoot":"","sources":["../../../../src/data/ai/PromptCatalog/PromptPageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAEtE,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,aAAa,CAAC,EAAE,kBAAkB,GAAG,SAAS,CAAC;IAC/C,MAAM,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IAClC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,aAAa,EACb,MAAM,EACN,OAAO,GACR,EAAE,qBAAqB,+BAsGvB"}

package/dist/data/ai/PromptCatalog/PromptPageHeader.js

@@ -0,0 +1,102 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { Button } from "../../../components/button.js";
+import { Badge } from "../../Badge.js";
+import { CopyBadge } from "../../diagnostics/ErrorDetails.js";
+import { effectiveLayer, layersAbove, runtimeSummary, layerLabel } from "./prompt-catalog-model.js";
+import { PromptSourceBadge } from "./PromptSourceBadge.js";
+import { UiArrowLeft } from "../../../icons/components/UiArrowLeft.js";
+import { UiWarningTriangle } from "../../../icons/components/UiWarningTriangle.js";
+function PromptPageHeader({
+  entry,
+  selectedLayer,
+  onBack,
+  actions
+}) {
+  const effective = effectiveLayer(entry);
+  const shadowing = selectedLayer ? layersAbove(entry, selectedLayer) : [];
+  return /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-2 border-b border-border px-density-4 py-density-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+      onBack ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          onClick: onBack,
+          "aria-label": "Back to prompts",
+          children: /* @__PURE__ */ jsx(UiArrowLeft, {})
+        }
+      ) : null,
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold leading-tight", children: entry.title }),
+          /* @__PURE__ */ jsx(
+            PromptSourceBadge,
+            {
+              source: entry.source,
+              parseError: entry.parseError
+            }
+          ),
+          /* @__PURE__ */ jsx(CopyBadge, { label: "id", value: entry.id }),
+          entry.configPath && entry.configPath !== entry.id ? /* @__PURE__ */ jsx(CopyBadge, { label: "config", value: entry.configPath }) : null
+        ] }),
+        entry.description ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: entry.description }) : null,
+        /* @__PURE__ */ jsxs("dl", { className: "mt-2 grid gap-x-6 gap-y-1 text-xs sm:grid-cols-[auto_1fr]", children: [
+          /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: "Used by" }),
+          /* @__PURE__ */ jsx("dd", { className: "flex flex-wrap gap-1", children: (entry.usedBy ?? []).length === 0 ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "—" }) : (entry.usedBy ?? []).map((command) => /* @__PURE__ */ jsx(
+            Badge,
+            {
+              variant: "soft",
+              tone: "neutral",
+              size: "xs",
+              className: "font-mono",
+              clickToCopy: false,
+              children: command
+            },
+            command
+          )) }),
+          /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: "Runs as" }),
+          /* @__PURE__ */ jsxs(
+            "dd",
+            {
+              className: entry.effective.error ? "text-destructive" : "font-mono",
+              children: [
+                runtimeSummary(entry.effective),
+                entry.effective.model ? /* @__PURE__ */ jsxs("span", { className: "ml-1 font-sans text-muted-foreground", children: [
+                  "(from ",
+                  entry.effective.modelSource,
+                  ")"
+                ] }) : null
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: "Runs from" }),
+          /* @__PURE__ */ jsx("dd", { children: effective ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            layerLabel(effective.origin),
+            /* @__PURE__ */ jsx("span", { className: "ml-1 font-mono text-muted-foreground", children: effective.filePath ?? effective.path })
+          ] }) : "built-in default" })
+        ] })
+      ] }),
+      actions ? /* @__PURE__ */ jsx("div", { className: "shrink-0", children: actions }) : null
+    ] }),
+    shadowing.length > 0 ? /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "alert",
+        className: "flex items-center gap-2 rounded-md border border-amber-300 bg-amber-500/10 px-3 py-2 text-xs text-amber-800 dark:border-amber-500/40 dark:text-amber-300",
+        children: [
+          /* @__PURE__ */ jsx(UiWarningTriangle, { className: "shrink-0" }),
+          /* @__PURE__ */ jsxs("span", { children: [
+            "A higher layer (",
+            shadowing.map((layer) => layerLabel(layer.origin)).join(", "),
+            ") overrides this prompt; saving here changes nothing until that override is removed."
+          ] })
+        ]
+      }
+    ) : null
+  ] });
+}
+export {
+  PromptPageHeader
+};
+//# sourceMappingURL=PromptPageHeader.js.map

package/dist/data/ai/PromptCatalog/PromptPageHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPageHeader.js","sources":["../../../../src/data/ai/PromptCatalog/PromptPageHeader.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Button } from \"../../../components/button\";\nimport { UiArrowLeft, UiWarningTriangle } from \"../../../icons\";\nimport { Badge } from \"../../Badge\";\nimport { CopyBadge } from \"../../diagnostics/ErrorDetails\";\nimport {\n  effectiveLayer,\n  layerLabel,\n  layersAbove,\n  runtimeSummary,\n} from \"./prompt-catalog-model\";\nimport { PromptSourceBadge } from \"./PromptSourceBadge\";\nimport type { PromptCatalogEntry, PromptCatalogLayer } from \"./types\";\n\nexport type PromptPageHeaderProps = {\n  entry: PromptCatalogEntry;\n  selectedLayer?: PromptCatalogLayer | undefined;\n  onBack?: (() => void) | undefined;\n  actions?: ReactNode | undefined;\n};\n\nexport function PromptPageHeader({\n  entry,\n  selectedLayer,\n  onBack,\n  actions,\n}: PromptPageHeaderProps) {\n  const effective = effectiveLayer(entry);\n  const shadowing = selectedLayer ? layersAbove(entry, selectedLayer) : [];\n  return (\n    <header className=\"flex flex-col gap-2 border-b border-border px-density-4 py-density-3\">\n      <div className=\"flex items-start gap-3\">\n        {onBack ? (\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"icon\"\n            onClick={onBack}\n            aria-label=\"Back to prompts\"\n          >\n            <UiArrowLeft />\n          </Button>\n        ) : null}\n        <div className=\"min-w-0 flex-1\">\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <h1 className=\"text-lg font-semibold leading-tight\">\n              {entry.title}\n            </h1>\n            <PromptSourceBadge\n              source={entry.source}\n              parseError={entry.parseError}\n            />\n            <CopyBadge label=\"id\" value={entry.id} />\n            {entry.configPath && entry.configPath !== entry.id ? (\n              <CopyBadge label=\"config\" value={entry.configPath} />\n            ) : null}\n          </div>\n          {entry.description ? (\n            <p className=\"mt-1 text-sm text-muted-foreground\">\n              {entry.description}\n            </p>\n          ) : null}\n          <dl className=\"mt-2 grid gap-x-6 gap-y-1 text-xs sm:grid-cols-[auto_1fr]\">\n            <dt className=\"text-muted-foreground\">Used by</dt>\n            <dd className=\"flex flex-wrap gap-1\">\n              {(entry.usedBy ?? []).length === 0 ? (\n                <span className=\"text-muted-foreground\">—</span>\n              ) : (\n                (entry.usedBy ?? []).map((command) => (\n                  <Badge\n                    key={command}\n                    variant=\"soft\"\n                    tone=\"neutral\"\n                    size=\"xs\"\n                    className=\"font-mono\"\n                    clickToCopy={false}\n                  >\n                    {command}\n                  </Badge>\n                ))\n              )}\n            </dd>\n            <dt className=\"text-muted-foreground\">Runs as</dt>\n            <dd\n              className={\n                entry.effective.error ? \"text-destructive\" : \"font-mono\"\n              }\n            >\n              {runtimeSummary(entry.effective)}\n              {entry.effective.model ? (\n                <span className=\"ml-1 font-sans text-muted-foreground\">\n                  (from {entry.effective.modelSource})\n                </span>\n              ) : null}\n            </dd>\n            <dt className=\"text-muted-foreground\">Runs from</dt>\n            <dd>\n              {effective ? (\n                <>\n                  {layerLabel(effective.origin)}\n                  <span className=\"ml-1 font-mono text-muted-foreground\">\n                    {effective.filePath ?? effective.path}\n                  </span>\n                </>\n              ) : (\n                \"built-in default\"\n              )}\n            </dd>\n          </dl>\n        </div>\n        {actions ? <div className=\"shrink-0\">{actions}</div> : null}\n      </div>\n      {shadowing.length > 0 ? (\n        <div\n          role=\"alert\"\n          className=\"flex items-center gap-2 rounded-md border border-amber-300 bg-amber-500/10 px-3 py-2 text-xs text-amber-800 dark:border-amber-500/40 dark:text-amber-300\"\n        >\n          <UiWarningTriangle className=\"shrink-0\" />\n          <span>\n            A higher layer (\n            {shadowing.map((layer) => layerLabel(layer.origin)).join(\", \")})\n            overrides this prompt; saving here changes nothing until that\n            override is removed.\n          </span>\n        </div>\n      ) : null}\n    </header>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/data/ai/PromptCatalog/PromptPagePreview.cjs

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const button = require("../../../components/button.cjs");
+const CodeBlock = require("../../CodeBlock.cjs");
+const promptPageModel = require("./prompt-page-model.cjs");
+const UiPlay = require("../../../icons/components/UiPlay.cjs");
+function PromptPagePreview({
+  entry,
+  render,
+  draftRaw
+}) {
+  const [variablesText, setVariablesText] = react.useState(
+    () => promptPageModel.seedVariables(entry)
+  );
+  const [result, setResult] = react.useState(null);
+  const [error, setError] = react.useState("");
+  const [rendering, setRendering] = react.useState(false);
+  async function run() {
+    const parsed = promptPageModel.parseVariables(variablesText);
+    if ("error" in parsed) {
+      setError(`variables: ${parsed.error}`);
+      return;
+    }
+    setRendering(true);
+    setError("");
+    try {
+      setResult(await render({ raw: draftRaw, variables: parsed.variables }));
+    } catch (cause) {
+      setError(promptPageModel.errorMessage(cause, "render failed"));
+    } finally {
+      setRendering(false);
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full min-h-0 flex-col gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex flex-col gap-1 text-xs font-medium text-muted-foreground", children: [
+      "Variables (JSON)",
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          "aria-label": "Preview variables",
+          className: "min-h-[8rem] resize-y rounded-md border border-border bg-background p-2 font-mono text-xs leading-relaxed text-foreground",
+          value: variablesText,
+          spellCheck: false,
+          onChange: (event) => setVariablesText(event.currentTarget.value)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        button.Button,
+        {
+          type: "button",
+          size: "sm",
+          onClick: run,
+          disabled: rendering,
+          loading: rendering,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(UiPlay.UiPlay, { className: "mr-1" }),
+            "Render"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: draftRaw !== void 0 ? "Renders the unsaved draft." : "Renders the saved document." }),
+      error ? /* @__PURE__ */ jsxRuntime.jsx("span", { role: "alert", className: "text-xs text-destructive", children: error }) : null
+    ] }),
+    result ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto", children: [
+      result.model ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
+        "model ",
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: result.model }),
+        result.backend ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          " ",
+          "· backend ",
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: result.backend })
+        ] }) : null
+      ] }) : null,
+      result.system ? /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-label": "Rendered system prompt", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-xs font-medium text-muted-foreground", children: "System" }),
+        /* @__PURE__ */ jsxRuntime.jsx(CodeBlock.CodeBlock, { language: "markdown", source: result.system, copyable: true })
+      ] }) : null,
+      /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-label": "Rendered user prompt", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-xs font-medium text-muted-foreground", children: "User" }),
+        /* @__PURE__ */ jsxRuntime.jsx(CodeBlock.CodeBlock, { language: "markdown", source: result.user, copyable: true })
+      ] })
+    ] }) : null
+  ] });
+}
+exports.PromptPagePreview = PromptPagePreview;
+//# sourceMappingURL=PromptPagePreview.cjs.map

package/dist/data/ai/PromptCatalog/PromptPagePreview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPagePreview.cjs","sources":["../../../../src/data/ai/PromptCatalog/PromptPagePreview.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Button } from \"../../../components/button\";\nimport { UiPlay } from \"../../../icons\";\nimport { CodeBlock } from \"../../CodeBlock\";\nimport {\n  errorMessage,\n  parseVariables,\n  seedVariables,\n} from \"./prompt-page-model\";\nimport type {\n  PromptCatalogEntry,\n  PromptRenderInput,\n  PromptRenderResult,\n} from \"./types\";\n\nexport type PromptPagePreviewProps = {\n  entry: PromptCatalogEntry;\n  render: (input: PromptRenderInput) => Promise<PromptRenderResult>;\n  // draftRaw is the unsaved document to render instead of the saved one;\n  // undefined renders what is saved.\n  draftRaw?: string | undefined;\n};\n\n// PromptPagePreview renders the template with caller-supplied variables and no\n// model call, so an edit can be checked against real inputs before it is\n// trusted — the unsaved draft when there is one.\nexport function PromptPagePreview({\n  entry,\n  render,\n  draftRaw,\n}: PromptPagePreviewProps) {\n  const [variablesText, setVariablesText] = useState(() =>\n    seedVariables(entry),\n  );\n  const [result, setResult] = useState<PromptRenderResult | null>(null);\n  const [error, setError] = useState(\"\");\n  const [rendering, setRendering] = useState(false);\n\n  async function run() {\n    const parsed = parseVariables(variablesText);\n    if (\"error\" in parsed) {\n      setError(`variables: ${parsed.error}`);\n      return;\n    }\n    setRendering(true);\n    setError(\"\");\n    try {\n      setResult(await render({ raw: draftRaw, variables: parsed.variables }));\n    } catch (cause) {\n      setError(errorMessage(cause, \"render failed\"));\n    } finally {\n      setRendering(false);\n    }\n  }\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col gap-3\">\n      <label className=\"flex flex-col gap-1 text-xs font-medium text-muted-foreground\">\n        Variables (JSON)\n        <textarea\n          aria-label=\"Preview variables\"\n          className=\"min-h-[8rem] resize-y rounded-md border border-border bg-background p-2 font-mono text-xs leading-relaxed text-foreground\"\n          value={variablesText}\n          spellCheck={false}\n          onChange={(event) => setVariablesText(event.currentTarget.value)}\n        />\n      </label>\n      <div className=\"flex items-center gap-2\">\n        <Button\n          type=\"button\"\n          size=\"sm\"\n          onClick={run}\n          disabled={rendering}\n          loading={rendering}\n        >\n          <UiPlay className=\"mr-1\" />\n          Render\n        </Button>\n        <span className=\"text-xs text-muted-foreground\">\n          {draftRaw !== undefined\n            ? \"Renders the unsaved draft.\"\n            : \"Renders the saved document.\"}\n        </span>\n        {error ? (\n          <span role=\"alert\" className=\"text-xs text-destructive\">\n            {error}\n          </span>\n        ) : null}\n      </div>\n      {result ? (\n        <div className=\"flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto\">\n          {result.model ? (\n            <p className=\"text-xs text-muted-foreground\">\n              model <span className=\"font-mono\">{result.model}</span>\n              {result.backend ? (\n                <>\n                  {\" \"}\n                  · backend <span className=\"font-mono\">{result.backend}</span>\n                </>\n              ) : null}\n            </p>\n          ) : null}\n          {result.system ? (\n            <section aria-label=\"Rendered system prompt\">\n              <h3 className=\"mb-1 text-xs font-medium text-muted-foreground\">\n                System\n              </h3>\n              <CodeBlock language=\"markdown\" source={result.system} copyable />\n            </section>\n          ) : null}\n          <section aria-label=\"Rendered user prompt\">\n            <h3 className=\"mb-1 text-xs font-medium text-muted-foreground\">\n              User\n            </h3>\n            <CodeBlock language=\"markdown\" source={result.user} copyable />\n          </section>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"names":["useState","seedVariables","parseVariables","errorMessage","jsxs","jsx","Button","UiPlay","Fragment","CodeBlock"],"mappings":"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"}

package/dist/data/ai/PromptCatalog/PromptPagePreview.d.ts

@@ -0,0 +1,8 @@
+import { PromptCatalogEntry, PromptRenderInput, PromptRenderResult } from './types';
+export type PromptPagePreviewProps = {
+    entry: PromptCatalogEntry;
+    render: (input: PromptRenderInput) => Promise<PromptRenderResult>;
+    draftRaw?: string | undefined;
+};
+export declare function PromptPagePreview({ entry, render, draftRaw, }: PromptPagePreviewProps): import("react").JSX.Element;
+//# sourceMappingURL=PromptPagePreview.d.ts.map

package/dist/data/ai/PromptCatalog/PromptPagePreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPagePreview.d.ts","sourceRoot":"","sources":["../../../../src/data/ai/PromptCatalog/PromptPagePreview.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,MAAM,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,kBAAkB,CAAC,CAAC;IAGlE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC/B,CAAC;AAKF,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,sBAAsB,+BA0FxB"}

package/dist/data/ai/PromptCatalog/PromptPagePreview.js

@@ -0,0 +1,90 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { Button } from "../../../components/button.js";
+import { CodeBlock } from "../../CodeBlock.js";
+import { seedVariables, parseVariables, errorMessage } from "./prompt-page-model.js";
+import { UiPlay } from "../../../icons/components/UiPlay.js";
+function PromptPagePreview({
+  entry,
+  render,
+  draftRaw
+}) {
+  const [variablesText, setVariablesText] = useState(
+    () => seedVariables(entry)
+  );
+  const [result, setResult] = useState(null);
+  const [error, setError] = useState("");
+  const [rendering, setRendering] = useState(false);
+  async function run() {
+    const parsed = parseVariables(variablesText);
+    if ("error" in parsed) {
+      setError(`variables: ${parsed.error}`);
+      return;
+    }
+    setRendering(true);
+    setError("");
+    try {
+      setResult(await render({ raw: draftRaw, variables: parsed.variables }));
+    } catch (cause) {
+      setError(errorMessage(cause, "render failed"));
+    } finally {
+      setRendering(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col gap-3", children: [
+    /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1 text-xs font-medium text-muted-foreground", children: [
+      "Variables (JSON)",
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          "aria-label": "Preview variables",
+          className: "min-h-[8rem] resize-y rounded-md border border-border bg-background p-2 font-mono text-xs leading-relaxed text-foreground",
+          value: variablesText,
+          spellCheck: false,
+          onChange: (event) => setVariablesText(event.currentTarget.value)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          type: "button",
+          size: "sm",
+          onClick: run,
+          disabled: rendering,
+          loading: rendering,
+          children: [
+            /* @__PURE__ */ jsx(UiPlay, { className: "mr-1" }),
+            "Render"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: draftRaw !== void 0 ? "Renders the unsaved draft." : "Renders the saved document." }),
+      error ? /* @__PURE__ */ jsx("span", { role: "alert", className: "text-xs text-destructive", children: error }) : null
+    ] }),
+    result ? /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto", children: [
+      result.model ? /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+        "model ",
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: result.model }),
+        result.backend ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          " ",
+          "· backend ",
+          /* @__PURE__ */ jsx("span", { className: "font-mono", children: result.backend })
+        ] }) : null
+      ] }) : null,
+      result.system ? /* @__PURE__ */ jsxs("section", { "aria-label": "Rendered system prompt", children: [
+        /* @__PURE__ */ jsx("h3", { className: "mb-1 text-xs font-medium text-muted-foreground", children: "System" }),
+        /* @__PURE__ */ jsx(CodeBlock, { language: "markdown", source: result.system, copyable: true })
+      ] }) : null,
+      /* @__PURE__ */ jsxs("section", { "aria-label": "Rendered user prompt", children: [
+        /* @__PURE__ */ jsx("h3", { className: "mb-1 text-xs font-medium text-muted-foreground", children: "User" }),
+        /* @__PURE__ */ jsx(CodeBlock, { language: "markdown", source: result.user, copyable: true })
+      ] })
+    ] }) : null
+  ] });
+}
+export {
+  PromptPagePreview
+};
+//# sourceMappingURL=PromptPagePreview.js.map

package/dist/data/ai/PromptCatalog/PromptPagePreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptPagePreview.js","sources":["../../../../src/data/ai/PromptCatalog/PromptPagePreview.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Button } from \"../../../components/button\";\nimport { UiPlay } from \"../../../icons\";\nimport { CodeBlock } from \"../../CodeBlock\";\nimport {\n  errorMessage,\n  parseVariables,\n  seedVariables,\n} from \"./prompt-page-model\";\nimport type {\n  PromptCatalogEntry,\n  PromptRenderInput,\n  PromptRenderResult,\n} from \"./types\";\n\nexport type PromptPagePreviewProps = {\n  entry: PromptCatalogEntry;\n  render: (input: PromptRenderInput) => Promise<PromptRenderResult>;\n  // draftRaw is the unsaved document to render instead of the saved one;\n  // undefined renders what is saved.\n  draftRaw?: string | undefined;\n};\n\n// PromptPagePreview renders the template with caller-supplied variables and no\n// model call, so an edit can be checked against real inputs before it is\n// trusted — the unsaved draft when there is one.\nexport function PromptPagePreview({\n  entry,\n  render,\n  draftRaw,\n}: PromptPagePreviewProps) {\n  const [variablesText, setVariablesText] = useState(() =>\n    seedVariables(entry),\n  );\n  const [result, setResult] = useState<PromptRenderResult | null>(null);\n  const [error, setError] = useState(\"\");\n  const [rendering, setRendering] = useState(false);\n\n  async function run() {\n    const parsed = parseVariables(variablesText);\n    if (\"error\" in parsed) {\n      setError(`variables: ${parsed.error}`);\n      return;\n    }\n    setRendering(true);\n    setError(\"\");\n    try {\n      setResult(await render({ raw: draftRaw, variables: parsed.variables }));\n    } catch (cause) {\n      setError(errorMessage(cause, \"render failed\"));\n    } finally {\n      setRendering(false);\n    }\n  }\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col gap-3\">\n      <label className=\"flex flex-col gap-1 text-xs font-medium text-muted-foreground\">\n        Variables (JSON)\n        <textarea\n          aria-label=\"Preview variables\"\n          className=\"min-h-[8rem] resize-y rounded-md border border-border bg-background p-2 font-mono text-xs leading-relaxed text-foreground\"\n          value={variablesText}\n          spellCheck={false}\n          onChange={(event) => setVariablesText(event.currentTarget.value)}\n        />\n      </label>\n      <div className=\"flex items-center gap-2\">\n        <Button\n          type=\"button\"\n          size=\"sm\"\n          onClick={run}\n          disabled={rendering}\n          loading={rendering}\n        >\n          <UiPlay className=\"mr-1\" />\n          Render\n        </Button>\n        <span className=\"text-xs text-muted-foreground\">\n          {draftRaw !== undefined\n            ? \"Renders the unsaved draft.\"\n            : \"Renders the saved document.\"}\n        </span>\n        {error ? (\n          <span role=\"alert\" className=\"text-xs text-destructive\">\n            {error}\n          </span>\n        ) : null}\n      </div>\n      {result ? (\n        <div className=\"flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto\">\n          {result.model ? (\n            <p className=\"text-xs text-muted-foreground\">\n              model <span className=\"font-mono\">{result.model}</span>\n              {result.backend ? (\n                <>\n                  {\" \"}\n                  · backend <span className=\"font-mono\">{result.backend}</span>\n                </>\n              ) : null}\n            </p>\n          ) : null}\n          {result.system ? (\n            <section aria-label=\"Rendered system prompt\">\n              <h3 className=\"mb-1 text-xs font-medium text-muted-foreground\">\n                System\n              </h3>\n              <CodeBlock language=\"markdown\" source={result.system} copyable />\n            </section>\n          ) : null}\n          <section aria-label=\"Rendered user prompt\">\n            <h3 className=\"mb-1 text-xs font-medium text-muted-foreground\">\n              User\n            </h3>\n            <CodeBlock language=\"markdown\" source={result.user} copyable />\n          </section>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AA0BO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACF,GAA2B;AACzB,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IAAS,MACjD,cAAc,KAAK;AAAA,EAAA;AAErB,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAoC,IAAI;AACpE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,iBAAe,MAAM;AACnB,UAAM,SAAS,eAAe,aAAa;AAC3C,QAAI,WAAW,QAAQ;AACrB,eAAS,cAAc,OAAO,KAAK,EAAE;AACrC;AAAA,IACF;AACA,iBAAa,IAAI;AACjB,aAAS,EAAE;AACX,QAAI;AACF,gBAAU,MAAM,OAAO,EAAE,KAAK,UAAU,WAAW,OAAO,UAAA,CAAW,CAAC;AAAA,IACxE,SAAS,OAAO;AACd,eAAS,aAAa,OAAO,eAAe,CAAC;AAAA,IAC/C,UAAA;AACE,mBAAa,KAAK;AAAA,IACpB;AAAA,EACF;AAEA,SACE,qBAAC,OAAA,EAAI,WAAU,sCACb,UAAA;AAAA,IAAA,qBAAC,SAAA,EAAM,WAAU,iEAAgE,UAAA;AAAA,MAAA;AAAA,MAE/E;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,cAAW;AAAA,UACX,WAAU;AAAA,UACV,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,UAAU,CAAC,UAAU,iBAAiB,MAAM,cAAc,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACjE,GACF;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,MAAK;AAAA,UACL,SAAS;AAAA,UACT,UAAU;AAAA,UACV,SAAS;AAAA,UAET,UAAA;AAAA,YAAA,oBAAC,QAAA,EAAO,WAAU,OAAA,CAAO;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,0BAG5B,QAAA,EAAK,WAAU,iCACb,UAAA,aAAa,SACV,+BACA,+BACN;AAAA,MACC,4BACE,QAAA,EAAK,MAAK,SAAQ,WAAU,4BAC1B,iBACH,IACE;AAAA,IAAA,GACN;AAAA,IACC,SACC,qBAAC,OAAA,EAAI,WAAU,sDACZ,UAAA;AAAA,MAAA,OAAO,QACN,qBAAC,KAAA,EAAE,WAAU,iCAAgC,UAAA;AAAA,QAAA;AAAA,QACrC,oBAAC,QAAA,EAAK,WAAU,aAAa,iBAAO,OAAM;AAAA,QAC/C,OAAO,UACN,qBAAA,UAAA,EACG,UAAA;AAAA,UAAA;AAAA,UAAI;AAAA,UACK,oBAAC,QAAA,EAAK,WAAU,aAAa,iBAAO,QAAA,CAAQ;AAAA,QAAA,EAAA,CACxD,IACE;AAAA,MAAA,EAAA,CACN,IACE;AAAA,MACH,OAAO,SACN,qBAAC,WAAA,EAAQ,cAAW,0BAClB,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAG,WAAU,kDAAiD,UAAA,UAE/D;AAAA,QACA,oBAAC,aAAU,UAAS,YAAW,QAAQ,OAAO,QAAQ,UAAQ,KAAA,CAAC;AAAA,MAAA,EAAA,CACjE,IACE;AAAA,MACJ,qBAAC,WAAA,EAAQ,cAAW,wBAClB,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAG,WAAU,kDAAiD,UAAA,QAE/D;AAAA,QACA,oBAAC,aAAU,UAAS,YAAW,QAAQ,OAAO,MAAM,UAAQ,KAAA,CAAC;AAAA,MAAA,EAAA,CAC/D;AAAA,IAAA,EAAA,CACF,IACE;AAAA,EAAA,GACN;AAEJ;"}