@agent-native/core 0.157.2 → 0.157.4

package/corpus/templates/content/actions/set-document-property.ts

@@ -28,6 +28,15 @@ import {
 
 export default defineAction({
   description: "Set a Notion-style property value on a document.",
+  publicAgent: {
+    expose: true,
+    readOnly: false,
+    requiresAuth: true,
+    isConsequential: true,
+    title: "Set Content Document Property",
+    description:
+      "Delegate one property update on an existing Content database document.",
+  },
   schema: z.object({
     documentId: z.string().describe("Document ID (required)"),
     databaseId: z

package/corpus/templates/content/actions/submit-content-database-form.ts

@@ -195,6 +195,15 @@ function resolveSubmittedProperties(
 export default defineAction({
   description:
     "Submit one row through a Content database form. Validates that form's required questions, resolves option labels safely, writes the title, Blocks, and property values atomically, verifies the saved row, and returns its exact page link.",
+  publicAgent: {
+    expose: true,
+    readOnly: false,
+    requiresAuth: true,
+    isConsequential: true,
+    title: "Submit Content Database Form",
+    description:
+      "Delegate a validated, atomic submission to an existing Content database form.",
+  },
   schema: submitContentDatabaseFormSchema,
   mcpApp: {
     compactCatalog: true,

package/corpus/templates/content/actions/update-document.ts

@@ -290,6 +290,15 @@ export function isStaleBuilderImageSourceComponentSave(args: {
 export default defineAction({
   description:
     "Update an existing document's title, content, icon, or favorite status.",
+  publicAgent: {
+    expose: true,
+    readOnly: false,
+    requiresAuth: true,
+    isConsequential: true,
+    title: "Update Content Document",
+    description:
+      "Delegate a sparse update to an existing Content document while preserving omitted fields.",
+  },
   schema: z.object({
     id: z.string().optional().describe("Document ID (required)"),
     title: z.string().optional().describe("New title"),

package/corpus/templates/content/app/components/editor/DocumentBlockFields.tsx

@@ -696,6 +696,7 @@ export function useBlockFieldEditor({
   content: string;
   editorResetVersion: number;
   onChange: (markdown: string) => void;
+  onSaveContent: (markdown: string) => Promise<boolean>;
 } {
   const key = `${documentId}:${propertyId}`;
 
@@ -876,7 +877,16 @@ export function useBlockFieldEditor({
     controllerRef.current?.change(markdown);
   }
 
-  return { content, editorResetVersion, onChange };
+  async function onSaveContent(markdown: string) {
+    setContent(markdown);
+    const controller = controllerRef.current;
+    if (!controller) return false;
+    controller.change(markdown);
+    await controller.flush();
+    return controller.lastSaved === markdown;
+  }
+
+  return { content, editorResetVersion, onChange, onSaveContent };
 }
 
 /**
@@ -904,15 +914,16 @@ function AdditionalBlockEditor({
   const propertyId = property.definition.id;
   const initialContent =
     typeof property.value === "string" ? property.value : "";
-  const { content, editorResetVersion, onChange } = useBlockFieldEditor({
-    documentId,
-    propertyId,
-    initialContent,
-    initialRevision: property.blocksField?.revision ?? 0,
-    save: setProperty.mutateAsync,
-    onRevisionConflict: () =>
-      toast.error(t("editor.blocksFieldRevisionConflict")),
-  });
+  const { content, editorResetVersion, onChange, onSaveContent } =
+    useBlockFieldEditor({
+      documentId,
+      propertyId,
+      initialContent,
+      initialRevision: property.blocksField?.revision ?? 0,
+      save: setProperty.mutateAsync,
+      onRevisionConflict: () =>
+        toast.error(t("editor.blocksFieldRevisionConflict")),
+    });
 
   return (
     <VisualEditor
@@ -920,6 +931,7 @@ function AdditionalBlockEditor({
       documentId={documentId}
       content={content}
       onChange={onChange}
+      onSaveContent={onSaveContent}
       editable={canEdit}
       localFileMode
     />

package/corpus/templates/content/app/components/editor/SlashCommandMenu.tsx

@@ -49,6 +49,7 @@ import { cn } from "@/lib/utils";
 import { localContentComponents } from "@/local-components";
 
 import { focusMostRecentEmptyToggleSummary } from "./extensions/NotionExtensions";
+import { createImagePickerId } from "./image-upload";
 import { buildLocalComponentSlashItems } from "./localComponentSlashItems";
 import { MathRenderer } from "./MathRenderer";
 import { buildRegistrySlashItems } from "./registrySlashItems";
@@ -179,7 +180,7 @@ export function insertMediaPlaceholder(
 ) {
   const attrs =
     type === "image"
-      ? { src: null, alt: "" }
+      ? { src: null, alt: "", uploadId: createImagePickerId() }
       : type === "video"
         ? { src: null, sourcePanelOpen: true }
         : { src: null };

package/corpus/templates/content/app/components/editor/VisualEditor.tsx

@@ -95,9 +95,13 @@ import {
   hasImageFiles,
   hasVideoFiles,
   audioUploadErrorMessage,
+  completeImageFileUpload,
+  createMediaUploadId,
+  ImageRenderError,
   imageUploadErrorMessage,
   uploadAudioFile,
   uploadImageFile,
+  waitForRenderedImage,
   uploadVideoFile,
   videoUploadErrorMessage,
 } from "./image-upload";
@@ -1020,6 +1024,7 @@ interface VisualEditorExtensionOptions {
     avatarUrl?: string;
   } | null;
   onImageComment?: (quotedText: string, offsetTop: number) => void;
+  onImageFilePickerRequest?: (request: PendingImagePicker) => void;
   onJoinTitle?: (text: string) => void;
   resolveNotionPageLink?: (notionPageId: string) => NotionPageLink | null;
   onOpenNotionPageLink?: (documentId: string) => void;
@@ -1143,19 +1148,17 @@ function mediaNodeLabel(typeName: MediaNodeType) {
   return "Audio";
 }
 
-function createMediaUploadId(kind: MediaNodeType) {
-  const random =
-    typeof crypto !== "undefined" && "randomUUID" in crypto
-      ? crypto.randomUUID()
-      : Math.random().toString(36).slice(2);
-  return `${kind}-upload-${random}`;
-}
-
 interface PendingMediaUpload {
   file: File;
   uploadId: string;
 }
 
+export interface PendingImagePicker {
+  pickerId: string;
+  position: number;
+  attrs: Record<string, unknown>;
+}
+
 function insertPendingMediaNodes(
   view: EditorView,
   typeName: MediaNodeType,
@@ -1204,7 +1207,7 @@ function updatePendingMediaNode(
       tr = tr.setNodeMarkup(pos, undefined, {
         ...node.attrs,
         ...attrs,
-        uploadId: null,
+        uploadId: attrs.uploadId ?? null,
       });
       found = true;
       return false;
@@ -1218,6 +1221,130 @@ function updatePendingMediaNode(
   return found;
 }
 
+function replacePendingMediaUploadId(
+  view: EditorView,
+  typeName: MediaNodeType,
+  currentUploadId: string,
+  nextUploadId: string,
+) {
+  let found = false;
+  let tr = view.state.tr;
+
+  view.state.doc.descendants((node, pos) => {
+    if (found) return false;
+    if (
+      node.type.name === typeName &&
+      node.attrs.uploadId === currentUploadId
+    ) {
+      tr = tr.setNodeMarkup(pos, undefined, {
+        ...node.attrs,
+        uploadId: nextUploadId,
+      });
+      found = true;
+      return false;
+    }
+    return true;
+  });
+
+  if (found) view.dispatch(tr);
+  return found;
+}
+
+function insertImageNodeAtPendingPosition(
+  view: EditorView,
+  request: PendingImagePicker,
+  attrs: Record<string, unknown>,
+  restoreSelection: boolean,
+) {
+  const imageType = view.state.schema.nodes.image;
+  if (!imageType) return false;
+  const position = Math.min(
+    Math.max(request.position, 0),
+    view.state.doc.content.size,
+  );
+  try {
+    let tr = view.state.tr.insert(
+      position,
+      imageType.create({ ...request.attrs, ...attrs }),
+    );
+    if (restoreSelection) {
+      tr = tr.setSelection(NodeSelection.create(tr.doc, position));
+    }
+    view.dispatch(tr.scrollIntoView());
+    if (restoreSelection) view.focus();
+    return true;
+  } catch (error) {
+    console.error("Could not restore the pending image node:", error);
+    return false;
+  }
+}
+
+export function ensurePendingImageUpload(
+  view: EditorView,
+  request: PendingImagePicker,
+  uploadId: string,
+) {
+  if (replacePendingMediaUploadId(view, "image", request.pickerId, uploadId)) {
+    return true;
+  }
+  return insertImageNodeAtPendingPosition(view, request, { uploadId }, false);
+}
+
+export function commitPendingImageUpload(
+  view: EditorView,
+  request: PendingImagePicker,
+  uploadId: string,
+  attrs: Record<string, unknown>,
+) {
+  if (updatePendingMediaNode(view, "image", uploadId, attrs)) return true;
+  return insertImageNodeAtPendingPosition(view, request, attrs, false);
+}
+
+function findPendingImageElement(view: EditorView, uploadId: string) {
+  return (
+    Array.from(view.dom.querySelectorAll<HTMLElement>("[data-image-upload-id]"))
+      .find((element) => element.dataset.imageUploadId === uploadId)
+      ?.querySelector<HTMLImageElement>("img") ?? null
+  );
+}
+
+export function restorePendingImagePicker(
+  view: EditorView,
+  request: PendingImagePicker,
+  currentUploadId = request.pickerId,
+) {
+  let found = false;
+  let nodePosition: number | null = null;
+  let tr = view.state.tr;
+
+  view.state.doc.descendants((node, pos) => {
+    if (found) return false;
+    if (node.type.name === "image" && node.attrs.uploadId === currentUploadId) {
+      tr = tr.setNodeMarkup(pos, undefined, {
+        ...request.attrs,
+        uploadId: null,
+      });
+      nodePosition = pos;
+      found = true;
+      return false;
+    }
+    return true;
+  });
+
+  if (found && nodePosition !== null) {
+    tr = tr.setSelection(NodeSelection.create(tr.doc, nodePosition));
+    view.dispatch(tr);
+    view.focus();
+    return true;
+  }
+  return insertImageNodeAtPendingPosition(
+    view,
+    request,
+    { uploadId: null },
+    true,
+  );
+}
+
 function getVisualEditorPlaceholder({
   editor,
   node,
@@ -1499,6 +1626,7 @@ export function createVisualEditorExtensions({
   localAwareness,
   user,
   onImageComment,
+  onImageFilePickerRequest,
   onJoinTitle,
   resolveNotionPageLink,
   onOpenNotionPageLink,
@@ -1558,6 +1686,7 @@ export function createVisualEditorExtensions({
         HTMLAttributes: { class: "notion-image" },
         documentId,
         onImageComment,
+        onImageFilePickerRequest,
       }),
       VideoNode.configure({
         HTMLAttributes: { class: "notion-video" },
@@ -1880,6 +2009,8 @@ export function VisualEditor({
   const t = useT();
   const [isDraggingMedia, setIsDraggingMedia] = useState(false);
   const wrapperRef = useRef<HTMLDivElement>(null);
+  const imageFileInputRef = useRef<HTMLInputElement>(null);
+  const pendingImagePickerRef = useRef<PendingImagePicker | null>(null);
   const onChangeRef = useRef(onChange);
   onChangeRef.current = onChange;
   const onSaveContentRef = useRef(onSaveContent);
@@ -1895,6 +2026,14 @@ export function VisualEditor({
     },
     [],
   );
+  const onImageFilePickerRequest = useCallback(
+    (request: PendingImagePicker) => {
+      if (pendingImagePickerRef.current) return;
+      pendingImagePickerRef.current = request;
+      imageFileInputRef.current?.click();
+    },
+    [],
+  );
   const resolveNotionPageLink = useCallback((notionPageId: string) => {
     const normalized = notionPageId.replace(/-/g, "").toLowerCase();
     return (
@@ -1946,6 +2085,7 @@ export function VisualEditor({
         localAwareness,
         user,
         onImageComment: onComment,
+        onImageFilePickerRequest,
         onJoinTitle,
         resolveNotionPageLink,
         onOpenNotionPageLink,
@@ -1962,6 +2102,7 @@ export function VisualEditor({
       user?.email,
       user?.color,
       onComment,
+      onImageFilePickerRequest,
       onJoinTitle,
       resolveNotionPageLink,
       onOpenNotionPageLink,
@@ -2014,6 +2155,7 @@ export function VisualEditor({
         if (options?.immediate && onSaveContentRef.current) {
           return onSaveContentRef.current(normalized);
         }
+        if (options?.immediate) return false;
         // Don't persist an empty doc before Collaboration has seeded (would
         // clobber DB content with an empty string). `registerEmitted` records
         // this as the last-emitted value and returns false to skip the save.
@@ -2225,6 +2367,93 @@ export function VisualEditor({
     },
   });
 
+  const handleImageFileInputChange = useCallback(
+    async (event: Event) => {
+      const input = event.currentTarget as HTMLInputElement;
+      const file = input.files?.[0];
+      input.value = "";
+      const request = pendingImagePickerRef.current;
+      pendingImagePickerRef.current = null;
+      if (!editor || !file || !request) return;
+
+      const uploadId = createMediaUploadId("image");
+      if (!ensurePendingImageUpload(editor.view, request, uploadId)) return;
+
+      const toastId = toast.loading(t("editor.media.uploadingImage"));
+      let staged = false;
+      let committed = false;
+      try {
+        await completeImageFileUpload({
+          file,
+          stageAttributes: (src) => {
+            if (editor.isDestroyed) return;
+            staged = commitPendingImageUpload(editor.view, request, uploadId, {
+              src,
+              uploadId,
+            });
+          },
+          waitForRender: async () => {
+            if (!staged) throw new Error(t("empty.genericError"));
+            await waitForRenderedImage(() =>
+              findPendingImageElement(editor.view, uploadId),
+            );
+          },
+          commitAttributes: (src) => {
+            if (editor.isDestroyed) return;
+            committed = commitPendingImageUpload(
+              editor.view,
+              request,
+              uploadId,
+              { src, uploadId: null },
+            );
+          },
+          persistCommittedImage: async () => {
+            if (!committed || editor.isDestroyed) return false;
+            return await persistEditorContent(editor, {
+              immediate: true,
+              userInitiated: true,
+            });
+          },
+        });
+        if (!committed) throw new Error(t("empty.genericError"));
+        toast.success(t("editor.media.imageAdded"), { id: toastId });
+      } catch (error) {
+        if (editor.isDestroyed) {
+          toast.dismiss(toastId);
+          return;
+        }
+        if (!committed) {
+          restorePendingImagePicker(editor.view, request, uploadId);
+        }
+        toast.error(
+          error instanceof ImageRenderError
+            ? t("editor.media.imageBroken")
+            : imageUploadErrorMessage(error),
+          { id: toastId },
+        );
+      }
+    },
+    [editor, t],
+  );
+
+  const handleImageFileInputCancel = useCallback(() => {
+    const request = pendingImagePickerRef.current;
+    pendingImagePickerRef.current = null;
+    if (!editor || !request) return;
+    restorePendingImagePicker(editor.view, request);
+  }, [editor]);
+
+  useEffect(() => {
+    const input = imageFileInputRef.current;
+    if (!input) return;
+    input.addEventListener("change", handleImageFileInputChange);
+    input.addEventListener("cancel", handleImageFileInputCancel);
+    return () => {
+      input.removeEventListener("change", handleImageFileInputChange);
+      input.removeEventListener("cancel", handleImageFileInputCancel);
+    };
+  }, [editor, handleImageFileInputCancel, handleImageFileInputChange]);
+
   // The shared seed / reconcile / lead-client / onUpdate-guard logic, with
   // Content's NFM serializer injected so the editor reads/writes the exact same
   // bytes as before (docToNfm / nfmToDoc / canonicalizeNfm, and the
@@ -2563,6 +2792,13 @@ export function VisualEditor({
       <RegistryBlockDataProvider value={registryBlockDataValue}>
         <EditorContent editor={editor} />
       </RegistryBlockDataProvider>
+      <input
+        ref={imageFileInputRef}
+        type="file"
+        className="hidden"
+        tabIndex={-1}
+        aria-hidden="true"
+      />
     </div>
   );
 }