@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/agents/components/working-document/WorkingDocumentPanel.js

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { FileText, Link2, Loader2, Lock, Maximize2, X } from "lucide-react";
 import { Switch } from "../../../ui/switch.js";
@@ -145,184 +146,259 @@ function WorkingDocumentPanel({
     conversationId,
     sourceFeature: sourceFeatureForKind(kind)
   };
-  return /* @__PURE__ */ React.createElement("div", { className: cn("flex h-full min-h-0 flex-col bg-card", className) }, enabled && /* @__PURE__ */ React.createElement(
-    RichDocumentActionProvider,
-    {
-      content: draft,
-      source: wdSource,
-      surfaceId: wdSurfaceId
-    }
-  ), showHeader && // A container: the controls fit the PANEL's width, not the screen's —
-  // the same panel sits in a 360px canvas pane, a phone and a wide
-  // window. Below 30rem the action toolkit folds into its one ⋯ menu
-  // and the view-mode button drops its word (guard:
-  // the-document-toolbar-fits-a-narrow-pane.test.tsx).
-  /* @__PURE__ */ React.createElement("div", { className: "@container/wdhead flex min-w-0 shrink-0 items-center gap-2 border-b border-border px-3 py-2" }, showHeaderTitle ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileText, { className: "h-4 w-4 shrink-0 text-muted-foreground" }), /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-1 flex-col" }, /* @__PURE__ */ React.createElement("span", { className: "truncate text-sm font-medium text-foreground" }, title || docTitleFallback), /* @__PURE__ */ React.createElement("span", { className: "flex items-center gap-1 truncate text-[11px] text-muted-foreground" }, isScratch ? "Private to you \u2014 the agent can read it, but never edits it" : isBound ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Link2, { className: "h-3 w-3 shrink-0" }), /* @__PURE__ */ React.createElement("span", { className: "truncate" }, "Synced to note", binding.label ? ` \xB7 ${binding.label}` : "")) : "Auto-saved to this conversation"))) : /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }), enabled && /* @__PURE__ */ React.createElement(
-    WorkingDocumentViewControls,
-    {
-      conversationId,
-      showDiff: kind === "working",
-      readOnly: viewOnly
-    }
-  ), enabled && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "hidden min-w-0 @[30rem]/wdhead:flex" }, /* @__PURE__ */ React.createElement(
-    RichDocumentActionSurface,
-    {
-      surfaceId: wdSurfaceId,
-      variant: "bar",
-      fallback: null
-    }
-  )), /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 @[30rem]/wdhead:hidden" }, /* @__PURE__ */ React.createElement(
-    RichDocumentActionSurface,
-    {
-      surfaceId: wdSurfaceId,
-      variant: "menu",
-      fallback: null
-    }
-  )), showOpenInWindow && /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: /* @__PURE__ */ React.createElement(Maximize2, null), onClick: openInCanvas, "aria-label": "Open in Canvas", title: "Open in Canvas" })), showEnableToggle && !isScratch && /* @__PURE__ */ React.createElement(
-    Switch,
-    {
-      checked: enabled,
-      onCheckedChange: setEnabled,
-      "aria-label": "Toggle working document"
-    }
-  ), showScratchShare && /* @__PURE__ */ React.createElement("label", { className: "flex shrink-0 cursor-pointer items-center gap-1.5" }, /* @__PURE__ */ React.createElement("span", { className: "text-[11px] font-medium text-muted-foreground" }, "Share"), /* @__PURE__ */ React.createElement(
-    Switch,
-    {
-      checked: scratchShared,
-      onCheckedChange: setScratchShared,
-      "aria-label": "Share this scratchpad with this chat"
-    }
-  ))), showSourceControls && enabled && /* @__PURE__ */ React.createElement("div", { className: "@container/wdsrc flex min-w-0 shrink-0 items-center gap-1.5 border-b border-border px-2 py-1.5" }, isScratch ? /* @__PURE__ */ React.createElement(Lock, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ React.createElement(
-    Link2,
-    {
-      className: cn(
-        "h-3.5 w-3.5 shrink-0",
-        isBound ? "text-primary" : "text-muted-foreground"
-      )
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "input",
-    {
-      type: "text",
-      value: title,
-      onChange: (e) => setTitle(e.target.value),
-      disabled: isBound || viewOnly,
-      placeholder: isScratch ? "Name this scratchpad\u2026" : "Name this document\u2026",
-      "aria-label": isScratch ? "Scratchpad name" : "Document name",
-      className: cn(
-        "min-w-0 flex-1 rounded-md border border-transparent bg-transparent px-1.5 py-0.5 text-xs font-medium text-foreground",
-        "placeholder:font-normal placeholder:text-muted-foreground",
-        "hover:border-border focus:border-border focus:outline-none focus:ring-1 focus:ring-ring",
-        "disabled:opacity-60"
-      )
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "span",
-    {
-      className: cn(
-        "shrink-0 truncate text-[11px] text-muted-foreground",
-        // "View only" always stays: it is why the name cannot be edited.
-        !viewOnly && "hidden @[26rem]/wdsrc:inline"
-      )
-    },
-    isScratch ? saving ? "Saving\u2026" : "Private \u2014 agent reads, never edits" : viewOnly ? "View only \u2014 shared with you" : isBound ? binding.label || "Bound note" : saving ? "Saving\u2026" : "Auto-saved"
-  ), isBound && /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: /* @__PURE__ */ React.createElement(X, null), onClick: unbind, "aria-label": "Unbind note (revert to this conversation's document)", title: "Unbind note", className: "shrink-0" }), !isScratch && /* @__PURE__ */ React.createElement(React.Fragment, null, !viewOnly && /* @__PURE__ */ React.createElement(
-    NotePickerPopover,
-    {
-      onSelectNote: (noteId) => {
-        if (!content.trim()) bindToNote(noteId, "replace");
-        else setPendingNoteId(noteId);
-      },
-      align: "end",
-      trigger: /* @__PURE__ */ React.createElement(Button, { variant: "outline", className: "shrink-0" }, isBound ? "Change" : "Bind note")
-    }
-  ), /* @__PURE__ */ React.createElement(
-    DocumentLinkPicker,
-    {
-      kind,
-      align: "end",
-      excludeDocumentId: binding.kind === "cx_working_document" ? binding.id : null,
-      onSelect: linkToDocument,
-      trigger: /* @__PURE__ */ React.createElement(Button, { variant: "outline", className: "shrink-0" }, "Link")
-    }
-  ), materialized && binding.kind === "cx_working_document" && !!binding.id && /* @__PURE__ */ React.createElement(
-    ShareButton,
-    {
-      resourceType: "document",
-      resourceId: binding.id,
-      resourceName: title || docTitleFallback,
-      variant: "ghost",
-      size: "sm",
-      showStatus: false
-    }
-  ))), enabled ? /* @__PURE__ */ React.createElement("div", { className: "flex min-h-0 flex-1 flex-col" }, saving && /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 items-center justify-end gap-1 px-3 pt-1 text-[11px] text-muted-foreground" }, /* @__PURE__ */ React.createElement(Loader2, { className: "h-3 w-3 animate-spin" }), "Saving"), error && /* @__PURE__ */ React.createElement("div", { className: "shrink-0 px-3 pt-1 text-[11px] text-destructive" }, error, /* @__PURE__ */ React.createElement(ErrorAlchemyMenu, { error })), conflict && /* @__PURE__ */ React.createElement("div", { className: "shrink-0 border-b border-amber-500/40 bg-amber-500/10 px-3 py-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center justify-between gap-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-xs text-amber-700 dark:text-amber-300" }, "The agent edited this document while you were typing. Your text is preserved below \u2014 choose which version to keep."), /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 gap-1.5" }, /* @__PURE__ */ React.createElement(Button, { variant: "primary", onClick: () => resolveConflict("keep-mine") }, "Keep mine"), /* @__PURE__ */ React.createElement(Button, { variant: "outline", onClick: () => resolveConflict("take-agent") }, "Use agent's version")))), /* @__PURE__ */ React.createElement("div", { className: "min-h-0 flex-1" }, conflict ? /* @__PURE__ */ React.createElement(
-    DiffViewer,
-    {
-      original: conflict.agentContent,
-      modified: draft,
-      engine: "light",
-      language: "markdown",
-      originalLabel: "Agent's version",
-      modifiedLabel: "Your version (kept)",
-      defaultView: "split",
-      showToolbar: true,
-      className: "h-full min-h-0"
-    }
-  ) : kind === "working" && mainView === "agent-diff" ? /* @__PURE__ */ React.createElement(
-    WorkingDocumentAgentDiff,
-    {
-      livePatch,
-      fallback: /* @__PURE__ */ React.createElement(
-        WorkingDocumentLatestVersionDiff,
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-full min-h-0 flex-col bg-card", className), children: [
+    enabled && /* @__PURE__ */ jsx(
+      RichDocumentActionProvider,
+      {
+        content: draft,
+        source: wdSource,
+        surfaceId: wdSurfaceId
+      }
+    ),
+    showHeader && // A container: the controls fit the PANEL's width, not the screen's —
+    // the same panel sits in a 360px canvas pane, a phone and a wide
+    // window. Below 30rem the action toolkit folds into its one ⋯ menu
+    // and the view-mode button drops its word (guard:
+    // the-document-toolbar-fits-a-narrow-pane.test.tsx).
+    /* @__PURE__ */ jsxs("div", { className: "@container/wdhead flex min-w-0 shrink-0 items-center gap-2 border-b border-border px-3 py-2", children: [
+      showHeaderTitle ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium text-foreground", children: title || docTitleFallback }),
+          /* @__PURE__ */ jsx("span", { className: "flex items-center gap-1 truncate text-[11px] text-muted-foreground", children: isScratch ? "Private to you \u2014 the agent can read it, but never edits it" : isBound ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Link2, { className: "h-3 w-3 shrink-0" }),
+            /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
+              "Synced to note",
+              binding.label ? ` \xB7 ${binding.label}` : ""
+            ] })
+          ] }) : "Auto-saved to this conversation" })
+        ] })
+      ] }) : /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1" }),
+      enabled && /* @__PURE__ */ jsx(
+        WorkingDocumentViewControls,
         {
-          documentId: binding.kind === "cx_working_document" ? binding.id : null,
-          currentContent: content
+          conversationId,
+          showDiff: kind === "working",
+          readOnly: viewOnly
         }
-      )
-    }
-  ) : /* @__PURE__ */ React.createElement(
-    WorkingDocumentEditor,
-    {
-      conversationId,
-      kind,
-      draft,
-      onChange,
-      onFlush: flush,
-      readOnly: viewOnly,
-      actionsSource: wdSource,
-      surfaceContext: resolvedSurfaceContext,
-      placeholder: isScratch ? "Private notes the agent reads, never edits" : void 0
-    }
-  ))) : /* @__PURE__ */ React.createElement("div", { className: "flex min-h-0 flex-1 flex-col items-center justify-center gap-3 px-6 py-8 text-center" }, /* @__PURE__ */ React.createElement(FileText, { className: "h-8 w-8 text-muted-foreground/40" }), /* @__PURE__ */ React.createElement("p", { className: "max-w-xs text-sm text-muted-foreground" }, isScratch ? "Scratchpad is off; turn it on for notes the agent only reads" : "Working document is off; turn it on to write with the agent"), /* @__PURE__ */ React.createElement(Button, { variant: "primary", onClick: () => setEnabled(true) }, "Enable ", docNoun)), /* @__PURE__ */ React.createElement(
-    AlertDialog,
-    {
-      open: !!pendingNoteId,
-      onOpenChange: (open) => {
-        if (!open) setPendingNoteId(null);
-      }
-    },
-    /* @__PURE__ */ React.createElement(AlertDialogContent, null, /* @__PURE__ */ React.createElement(AlertDialogHeader, null, /* @__PURE__ */ React.createElement(AlertDialogTitle, null, "Keep your current document?"), /* @__PURE__ */ React.createElement(AlertDialogDescription, null, "You already have content in this working document. Append it below the note's content, or replace it with the note.")), /* @__PURE__ */ React.createElement(AlertDialogFooter, { className: "gap-2 sm:gap-2" }, /* @__PURE__ */ React.createElement(Button, { variant: "quiet", onClick: () => setPendingNoteId(null) }, "Cancel"), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        variant: "outline",
-        onClick: () => {
-          if (pendingNoteId) bindToNote(pendingNoteId, "replace");
-          setPendingNoteId(null);
+      ),
+      enabled && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { className: "hidden min-w-0 @[30rem]/wdhead:flex", children: /* @__PURE__ */ jsx(
+          RichDocumentActionSurface,
+          {
+            surfaceId: wdSurfaceId,
+            variant: "bar",
+            fallback: null
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { className: "flex shrink-0 @[30rem]/wdhead:hidden", children: /* @__PURE__ */ jsx(
+          RichDocumentActionSurface,
+          {
+            surfaceId: wdSurfaceId,
+            variant: "menu",
+            fallback: null
+          }
+        ) }),
+        showOpenInWindow && /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: /* @__PURE__ */ jsx(Maximize2, {}), onClick: openInCanvas, "aria-label": "Open in Canvas", title: "Open in Canvas" })
+      ] }),
+      showEnableToggle && !isScratch && /* @__PURE__ */ jsx(
+        Switch,
+        {
+          checked: enabled,
+          onCheckedChange: setEnabled,
+          "aria-label": "Toggle working document"
         }
-      },
-      "Replace"
-    ), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        variant: "primary",
-        onClick: () => {
-          if (pendingNoteId) bindToNote(pendingNoteId, "append");
-          setPendingNoteId(null);
+      ),
+      showScratchShare && /* @__PURE__ */ jsxs("label", { className: "flex shrink-0 cursor-pointer items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium text-muted-foreground", children: "Share" }),
+        /* @__PURE__ */ jsx(
+          Switch,
+          {
+            checked: scratchShared,
+            onCheckedChange: setScratchShared,
+            "aria-label": "Share this scratchpad with this chat"
+          }
+        )
+      ] })
+    ] }),
+    showSourceControls && enabled && /* @__PURE__ */ jsxs("div", { className: "@container/wdsrc flex min-w-0 shrink-0 items-center gap-1.5 border-b border-border px-2 py-1.5", children: [
+      isScratch ? /* @__PURE__ */ jsx(Lock, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx(
+        Link2,
+        {
+          className: cn(
+            "h-3.5 w-3.5 shrink-0",
+            isBound ? "text-primary" : "text-muted-foreground"
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: title,
+          onChange: (e) => setTitle(e.target.value),
+          disabled: isBound || viewOnly,
+          placeholder: isScratch ? "Name this scratchpad\u2026" : "Name this document\u2026",
+          "aria-label": isScratch ? "Scratchpad name" : "Document name",
+          className: cn(
+            "min-w-0 flex-1 rounded-md border border-transparent bg-transparent px-1.5 py-0.5 text-xs font-medium text-foreground",
+            "placeholder:font-normal placeholder:text-muted-foreground",
+            "hover:border-border focus:border-border focus:outline-none focus:ring-1 focus:ring-ring",
+            "disabled:opacity-60"
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "shrink-0 truncate text-[11px] text-muted-foreground",
+            // "View only" always stays: it is why the name cannot be edited.
+            !viewOnly && "hidden @[26rem]/wdsrc:inline"
+          ),
+          children: isScratch ? saving ? "Saving\u2026" : "Private \u2014 agent reads, never edits" : viewOnly ? "View only \u2014 shared with you" : isBound ? binding.label || "Bound note" : saving ? "Saving\u2026" : "Auto-saved"
         }
-      },
-      "Append below"
-    )))
-  ));
+      ),
+      isBound && /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: /* @__PURE__ */ jsx(X, {}), onClick: unbind, "aria-label": "Unbind note (revert to this conversation's document)", title: "Unbind note", className: "shrink-0" }),
+      !isScratch && /* @__PURE__ */ jsxs(Fragment, { children: [
+        !viewOnly && /* @__PURE__ */ jsx(
+          NotePickerPopover,
+          {
+            onSelectNote: (noteId) => {
+              if (!content.trim()) bindToNote(noteId, "replace");
+              else setPendingNoteId(noteId);
+            },
+            align: "end",
+            trigger: /* @__PURE__ */ jsx(Button, { variant: "outline", className: "shrink-0", children: isBound ? "Change" : "Bind note" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DocumentLinkPicker,
+          {
+            kind,
+            align: "end",
+            excludeDocumentId: binding.kind === "cx_working_document" ? binding.id : null,
+            onSelect: linkToDocument,
+            trigger: /* @__PURE__ */ jsx(Button, { variant: "outline", className: "shrink-0", children: "Link" })
+          }
+        ),
+        materialized && binding.kind === "cx_working_document" && !!binding.id && /* @__PURE__ */ jsx(
+          ShareButton,
+          {
+            resourceType: "document",
+            resourceId: binding.id,
+            resourceName: title || docTitleFallback,
+            variant: "ghost",
+            size: "sm",
+            showStatus: false
+          }
+        )
+      ] })
+    ] }),
+    enabled ? /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [
+      saving && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center justify-end gap-1 px-3 pt-1 text-[11px] text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin" }),
+        "Saving"
+      ] }),
+      error && /* @__PURE__ */ jsxs("div", { className: "shrink-0 px-3 pt-1 text-[11px] text-destructive", children: [
+        error,
+        /* @__PURE__ */ jsx(ErrorAlchemyMenu, { error })
+      ] }),
+      conflict && /* @__PURE__ */ jsx("div", { className: "shrink-0 border-b border-amber-500/40 bg-amber-500/10 px-3 py-2", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs text-amber-700 dark:text-amber-300", children: "The agent edited this document while you were typing. Your text is preserved below \u2014 choose which version to keep." }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 gap-1.5", children: [
+          /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: () => resolveConflict("keep-mine"), children: "Keep mine" }),
+          /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => resolveConflict("take-agent"), children: "Use agent's version" })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1", children: conflict ? /* @__PURE__ */ jsx(
+        DiffViewer,
+        {
+          original: conflict.agentContent,
+          modified: draft,
+          engine: "light",
+          language: "markdown",
+          originalLabel: "Agent's version",
+          modifiedLabel: "Your version (kept)",
+          defaultView: "split",
+          showToolbar: true,
+          className: "h-full min-h-0"
+        }
+      ) : kind === "working" && mainView === "agent-diff" ? /* @__PURE__ */ jsx(
+        WorkingDocumentAgentDiff,
+        {
+          livePatch,
+          fallback: /* @__PURE__ */ jsx(
+            WorkingDocumentLatestVersionDiff,
+            {
+              documentId: binding.kind === "cx_working_document" ? binding.id : null,
+              currentContent: content
+            }
+          )
+        }
+      ) : /* @__PURE__ */ jsx(
+        WorkingDocumentEditor,
+        {
+          conversationId,
+          kind,
+          draft,
+          onChange,
+          onFlush: flush,
+          readOnly: viewOnly,
+          actionsSource: wdSource,
+          surfaceContext: resolvedSurfaceContext,
+          placeholder: isScratch ? "Private notes the agent reads, never edits" : void 0
+        }
+      ) })
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col items-center justify-center gap-3 px-6 py-8 text-center", children: [
+      /* @__PURE__ */ jsx(FileText, { className: "h-8 w-8 text-muted-foreground/40" }),
+      /* @__PURE__ */ jsx("p", { className: "max-w-xs text-sm text-muted-foreground", children: isScratch ? "Scratchpad is off; turn it on for notes the agent only reads" : "Working document is off; turn it on to write with the agent" }),
+      /* @__PURE__ */ jsxs(Button, { variant: "primary", onClick: () => setEnabled(true), children: [
+        "Enable ",
+        docNoun
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      AlertDialog,
+      {
+        open: !!pendingNoteId,
+        onOpenChange: (open) => {
+          if (!open) setPendingNoteId(null);
+        },
+        children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
+          /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
+            /* @__PURE__ */ jsx(AlertDialogTitle, { children: "Keep your current document?" }),
+            /* @__PURE__ */ jsx(AlertDialogDescription, { children: "You already have content in this working document. Append it below the note's content, or replace it with the note." })
+          ] }),
+          /* @__PURE__ */ jsxs(AlertDialogFooter, { className: "gap-2 sm:gap-2", children: [
+            /* @__PURE__ */ jsx(Button, { variant: "quiet", onClick: () => setPendingNoteId(null), children: "Cancel" }),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                onClick: () => {
+                  if (pendingNoteId) bindToNote(pendingNoteId, "replace");
+                  setPendingNoteId(null);
+                },
+                children: "Replace"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "primary",
+                onClick: () => {
+                  if (pendingNoteId) bindToNote(pendingNoteId, "append");
+                  setPendingNoteId(null);
+                },
+                children: "Append below"
+              }
+            )
+          ] })
+        ] })
+      }
+    )
+  ] });
 }
 export {
   WorkingDocumentPanel,

package/dist/agents/components/working-document/WorkingDocumentVersionHistory.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { NoteVersionHistoryPanel } from "../../../host/ui-slots.js";
 import { Loader2, RotateCcw } from "lucide-react";
@@ -69,54 +70,89 @@ function DbVersionPanel({
   const compareContent = contentFor(compare);
   const resolving = !!selected && !selected.isCurrent && !(selected.version in fetched) || !!compare && !compare.isCurrent && !(compare.version in fetched);
   if (loading) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex h-full items-center justify-center gap-2 p-6 text-sm text-muted-foreground" }, /* @__PURE__ */ React.createElement(Loader2, { className: "h-4 w-4 animate-spin" }), "Loading version history\u2026");
+    return /* @__PURE__ */ jsxs("div", { className: "flex h-full items-center justify-center gap-2 p-6 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }),
+      "Loading version history\u2026"
+    ] });
   }
   if (error) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-destructive" }, error, /* @__PURE__ */ React.createElement(ErrorAlchemyMenu, { error }));
+    return /* @__PURE__ */ jsxs("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-destructive", children: [
+      error,
+      /* @__PURE__ */ jsx(ErrorAlchemyMenu, { error })
+    ] });
   }
   if (versions.length === 0) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-muted-foreground" }, "No versions yet. Each edit by you or the agent is saved here.");
+    return /* @__PURE__ */ jsx("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-muted-foreground", children: "No versions yet. Each edit by you or the agent is saved here." });
   }
   const labelFor = (v) => `v${v.version}${v.isCurrent ? " \xB7 Current" : ""}`;
-  return /* @__PURE__ */ React.createElement("div", { className: cn("flex h-full min-h-0 flex-col", className) }, /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 flex-wrap items-center gap-2 border-b border-border bg-muted/30 px-3 py-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground" }, "Version"), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React.createElement(ChevronLeftTapButton, { variant: "transparent", ariaLabel: "Newer version", disabled: index <= 0, onClick: () => setIndex((i) => Math.max(0, i - 1)) }), /* @__PURE__ */ React.createElement("span", { className: "min-w-[5rem] text-center text-xs tabular-nums text-foreground" }, index + 1, " / ", versions.length), /* @__PURE__ */ React.createElement(ChevronRightTapButton, { variant: "transparent", ariaLabel: "Older version", disabled: index >= versions.length - 1, onClick: () => setIndex((i) => Math.min(versions.length - 1, i + 1)) })), /* @__PURE__ */ React.createElement("span", { className: "truncate text-xs text-muted-foreground" }, selected ? `${labelFor(selected)} \xB7 ${formatWhen(selected.occurredAt)}` : ""), onApplySnapshot && selected && !selected.isCurrent && /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      icon: /* @__PURE__ */ React.createElement(RotateCcw, null),
-      type: "button",
-      variant: "outline",
-      disabled: resolving || selectedContent == null,
-      className: "ml-auto",
-      onClick: () => {
-        if (selectedContent != null) onApplySnapshot(selectedContent);
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-full min-h-0 flex-col", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center gap-2 border-b border-border bg-muted/30 px-3 py-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground", children: "Version" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsx(ChevronLeftTapButton, { variant: "transparent", ariaLabel: "Newer version", disabled: index <= 0, onClick: () => setIndex((i) => Math.max(0, i - 1)) }),
+        /* @__PURE__ */ jsxs("span", { className: "min-w-[5rem] text-center text-xs tabular-nums text-foreground", children: [
+          index + 1,
+          " / ",
+          versions.length
+        ] }),
+        /* @__PURE__ */ jsx(ChevronRightTapButton, { variant: "transparent", ariaLabel: "Older version", disabled: index >= versions.length - 1, onClick: () => setIndex((i) => Math.min(versions.length - 1, i + 1)) })
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: selected ? `${labelFor(selected)} \xB7 ${formatWhen(selected.occurredAt)}` : "" }),
+      onApplySnapshot && selected && !selected.isCurrent && /* @__PURE__ */ jsx(
+        Button,
+        {
+          icon: /* @__PURE__ */ jsx(RotateCcw, {}),
+          type: "button",
+          variant: "outline",
+          disabled: resolving || selectedContent == null,
+          className: "ml-auto",
+          onClick: () => {
+            if (selectedContent != null) onApplySnapshot(selectedContent);
+          },
+          children: "Restore"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center gap-2 border-b border-border px-3 py-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground", children: "Compare to" }),
+      /* @__PURE__ */ jsxs(
+        "select",
+        {
+          value: compareIndex ?? "",
+          onChange: (e) => {
+            const v = e.target.value;
+            setCompareIndex(v === "" ? null : Number(v));
+          },
+          className: "min-w-[8rem] rounded-md border border-border bg-background px-2 py-1 text-xs",
+          children: [
+            /* @__PURE__ */ jsx("option", { value: "", children: "Nothing" }),
+            versions.map((v, i) => /* @__PURE__ */ jsxs("option", { value: i, disabled: i === index, children: [
+              labelFor(v),
+              ` \xB7 ${formatWhen(v.occurredAt)}`
+            ] }, v.version))
+          ]
+        }
+      ),
+      resolving && /* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin text-muted-foreground" })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: compare && selected && compareContent != null && selectedContent != null ? /* @__PURE__ */ jsx(
+      DiffViewer,
+      {
+        original: compareContent,
+        modified: selectedContent,
+        engine: "light",
+        language: "markdown",
+        originalLabel: labelFor(compare),
+        modifiedLabel: labelFor(selected),
+        defaultView: "highlight",
+        showToolbar: true,
+        className: "h-full min-h-0"
       }
-    },
-    "Restore"
-  )), /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 flex-wrap items-center gap-2 border-b border-border px-3 py-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground" }, "Compare to"), /* @__PURE__ */ React.createElement(
-    "select",
-    {
-      value: compareIndex ?? "",
-      onChange: (e) => {
-        const v = e.target.value;
-        setCompareIndex(v === "" ? null : Number(v));
-      },
-      className: "min-w-[8rem] rounded-md border border-border bg-background px-2 py-1 text-xs"
-    },
-    /* @__PURE__ */ React.createElement("option", { value: "" }, "Nothing"),
-    versions.map((v, i) => /* @__PURE__ */ React.createElement("option", { key: v.version, value: i, disabled: i === index }, labelFor(v), ` \xB7 ${formatWhen(v.occurredAt)}`))
-  ), resolving && /* @__PURE__ */ React.createElement(Loader2, { className: "h-3 w-3 animate-spin text-muted-foreground" })), /* @__PURE__ */ React.createElement("div", { className: "min-h-0 flex-1 overflow-hidden" }, compare && selected && compareContent != null && selectedContent != null ? /* @__PURE__ */ React.createElement(
-    DiffViewer,
-    {
-      original: compareContent,
-      modified: selectedContent,
-      engine: "light",
-      language: "markdown",
-      originalLabel: labelFor(compare),
-      modifiedLabel: labelFor(selected),
-      defaultView: "highlight",
-      showToolbar: true,
-      className: "h-full min-h-0"
-    }
-  ) : selected && selectedContent != null ? /* @__PURE__ */ React.createElement("div", { className: "h-full overflow-y-auto p-3" }, /* @__PURE__ */ React.createElement("pre", { className: "whitespace-pre-wrap break-words font-mono text-xs leading-relaxed text-foreground" }, selectedContent || "(empty)")) : /* @__PURE__ */ React.createElement("div", { className: "flex h-full items-center justify-center text-sm text-muted-foreground" }, /* @__PURE__ */ React.createElement(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Loading\u2026")));
+    ) : selected && selectedContent != null ? /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-auto p-3", children: /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap break-words font-mono text-xs leading-relaxed text-foreground", children: selectedContent || "(empty)" }) }) : /* @__PURE__ */ jsxs("div", { className: "flex h-full items-center justify-center text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
+      "Loading\u2026"
+    ] }) })
+  ] });
 }
 function HistoryBody({
   conversationId,
@@ -130,7 +166,7 @@ function HistoryBody({
     selectWorkingDocMaterialized(conversationId, "working")
   );
   if (binding.kind === "note" && binding.id) {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       NoteVersionHistoryPanel,
       {
         noteId: binding.id,
@@ -141,7 +177,7 @@ function HistoryBody({
     );
   }
   if (binding.kind === "cx_working_document" && binding.id && materialized) {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       DbVersionPanel,
       {
         documentId: binding.id,
@@ -151,14 +187,14 @@ function HistoryBody({
       }
     );
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-muted-foreground" }, "No versions yet. Each edit by you or the agent is saved here.");
+  return /* @__PURE__ */ jsx("div", { className: "flex h-full items-center justify-center p-6 text-center text-sm text-muted-foreground", children: "No versions yet. Each edit by you or the agent is saved here." });
 }
 function WorkingDocumentVersionHistory({
   conversationId,
   onRestored
 }) {
   const { draft, onChange, flush, viewOnly } = useWorkingDocument(conversationId, "working");
-  return /* @__PURE__ */ React.createElement("div", { className: "h-full min-h-0 overflow-hidden bg-background" }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx("div", { className: "h-full min-h-0 overflow-hidden bg-background", children: /* @__PURE__ */ jsx(
     HistoryBody,
     {
       conversationId,
@@ -170,7 +206,7 @@ function WorkingDocumentVersionHistory({
         onRestored?.();
       }
     }
-  ));
+  ) });
 }
 export {
   WorkingDocumentVersionHistory