@agent-native/core 0.37.3 → 0.39.0

package/dist/client/rich-markdown-editor/DragHandle.js

@@ -0,0 +1,403 @@
+import { Extension } from "@tiptap/core";
+import { Plugin, PluginKey, NodeSelection } from "@tiptap/pm/state";
+/**
+ * Default editor-wrapper CSS selector the drag handle scopes itself to.
+ *
+ * The handle, the drop indicator, and the `position: relative` anchor are all
+ * appended to / measured against the closest ancestor matching this selector.
+ * Content's editor wraps its ProseMirror DOM in a `.visual-editor-wrapper`
+ * element, so that is the historical default. Other apps (e.g. the plan editor)
+ * pass their own wrapper selector via {@link DragHandleOptions.wrapperSelector}.
+ */
+export const DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR = ".visual-editor-wrapper";
+const dragHandleKey = new PluginKey("dragHandle");
+const HOVER_SIDE_OUTSET_REM = 8;
+/**
+ * App-agnostic Tiptap extension providing a Notion-style left-margin drag grip
+ * (the `::` handle), block selection, and drag-to-reorder over top-level block
+ * nodes.
+ *
+ * Behavior:
+ * - On hover over any top-level block, a `.drag-handle` grip appears in the left
+ *   margin (forgiving hit zone extends {@link HOVER_SIDE_OUTSET_REM}rem to the
+ *   sides and into the gap above/between blocks).
+ * - `mousedown` on the grip selects the block as a `NodeSelection`; dragging past
+ *   a small threshold starts a reorder, showing a floating clone preview
+ *   (`.notion-drag-preview`) and a `.notion-drop-indicator` line. `Escape`
+ *   cancels.
+ * - While dragging, the source block carries `.notion-block--dragging` and the
+ *   document element carries `.notion-editor-is-dragging` so apps can style the
+ *   in-flight state. Apps own all of these CSS class names.
+ * - Works for ANY top-level node ProseMirror renders as a direct child of the
+ *   editor — including `group: "block"`, `draggable: true` atoms such as the
+ *   plan editor's `planBlock`.
+ *
+ * The only app-specific coupling — the editor wrapper element the handle and
+ * drop indicator are anchored to — is configurable via
+ * {@link DragHandleOptions.wrapperSelector}, defaulting to
+ * {@link DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR} (`.visual-editor-wrapper`) so the
+ * Content editor keeps working byte-identically. The plan editor passes its own
+ * wrapper selector via `DragHandle.configure({ wrapperSelector })`.
+ */
+export const DragHandle = Extension.create({
+    name: "dragHandle",
+    addOptions() {
+        return {
+            wrapperSelector: DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR,
+        };
+    },
+    addProseMirrorPlugins() {
+        const editor = this.editor;
+        const wrapperSelector = this.options.wrapperSelector;
+        let handle = null;
+        let currentBlock = null;
+        let dragStartPos = null;
+        let dragSession = null;
+        const getHoverSideOutset = () => {
+            const rootFontSize = Number.parseFloat(getComputedStyle(document.documentElement).fontSize);
+            return ((Number.isFinite(rootFontSize) ? rootFontSize : 16) *
+                HOVER_SIDE_OUTSET_REM);
+        };
+        const getTopLevelBlocks = (editorView) => {
+            const blocks = [];
+            editorView.state.doc.forEach((_node, offset) => {
+                const dom = editorView.nodeDOM(offset);
+                if (!(dom instanceof HTMLElement))
+                    return;
+                blocks.push({
+                    node: dom,
+                    pmPos: offset,
+                    rect: dom.getBoundingClientRect(),
+                });
+            });
+            return blocks;
+        };
+        const findForgivingBlock = (editorView, clientX, clientY) => {
+            const blocks = getTopLevelBlocks(editorView);
+            if (blocks.length === 0)
+                return null;
+            const sideOutset = getHoverSideOutset();
+            const pageLeft = 0;
+            const pageRight = window.visualViewport?.width ?? window.innerWidth;
+            for (let index = 0; index < blocks.length; index++) {
+                const block = blocks[index];
+                const nextBlock = blocks[index + 1];
+                const blockBottomGap = nextBlock
+                    ? Math.max(0, nextBlock.rect.top - block.rect.bottom)
+                    : 0;
+                const zoneLeft = Math.max(pageLeft, block.rect.left - sideOutset);
+                const zoneRight = Math.min(pageRight, block.rect.right + sideOutset);
+                const zoneTop = index === 0
+                    ? Math.max(0, block.rect.top - blockBottomGap)
+                    : block.rect.top;
+                const zoneBottom = nextBlock ? nextBlock.rect.top : block.rect.bottom;
+                if (clientX >= zoneLeft &&
+                    clientX <= zoneRight &&
+                    clientY >= zoneTop &&
+                    clientY < zoneBottom) {
+                    return block;
+                }
+            }
+            return null;
+        };
+        const showHandleForBlock = (editorView, block) => {
+            if (!handle)
+                return;
+            currentBlock = block.node;
+            dragStartPos = block.pmPos;
+            const wrapper = editorView.dom.closest(wrapperSelector);
+            if (!wrapper)
+                return;
+            // Lazily (re)attach the grip the first time a wrapper is actually
+            // available. At plugin `view()` init the editor DOM may not yet be mounted
+            // inside the wrapper (React mounts `EditorContent` after the EditorView is
+            // constructed), so the init-time append can silently no-op and leave the
+            // grip orphaned. Re-home it here once the wrapper exists.
+            if (handle.parentElement !== wrapper) {
+                wrapper.style.position = "relative";
+                wrapper.appendChild(handle);
+            }
+            const wrapperRect = wrapper.getBoundingClientRect();
+            handle.style.display = "flex";
+            handle.style.top = `${block.rect.top - wrapperRect.top + 2}px`;
+            handle.style.left = "-24px";
+        };
+        const selectCurrentBlock = (editorView) => {
+            if (dragStartPos === null)
+                return null;
+            try {
+                const sel = NodeSelection.create(editorView.state.doc, dragStartPos);
+                editorView.dispatch(editorView.state.tr.setSelection(sel));
+                editorView.focus();
+                return sel;
+            }
+            catch {
+                return null;
+            }
+        };
+        const cleanupDragVisuals = () => {
+            dragSession?.preview?.remove();
+            dragSession?.dropLine?.remove();
+            dragSession?.sourceBlock.classList.remove("notion-block--dragging");
+            document.documentElement.classList.remove("notion-editor-is-dragging");
+        };
+        const createDragPreview = (block) => {
+            const blockRect = block.getBoundingClientRect();
+            const preview = document.createElement("div");
+            const clone = block.cloneNode(true);
+            clone.classList.remove("ProseMirror-selectednode", "notion-block--dragging");
+            clone.removeAttribute("contenteditable");
+            clone.style.background = "transparent";
+            clone.style.backgroundColor = "transparent";
+            clone.querySelectorAll("[contenteditable]").forEach((node) => {
+                node.removeAttribute("contenteditable");
+            });
+            clone.querySelectorAll("*").forEach((node) => {
+                node.style.background = "transparent";
+                node.style.backgroundColor = "transparent";
+            });
+            preview.className = "notion-drag-preview";
+            preview.style.width = `${blockRect.width}px`;
+            preview.appendChild(clone);
+            document.body.appendChild(preview);
+            return preview;
+        };
+        const createDropLine = (view) => {
+            const wrapper = view.dom.closest(wrapperSelector);
+            if (!wrapper)
+                return null;
+            const line = document.createElement("div");
+            line.className = "notion-drop-indicator";
+            wrapper.appendChild(line);
+            return line;
+        };
+        const findDropTarget = (view, clientX, clientY) => {
+            const block = findForgivingBlock(view, clientX, clientY);
+            if (!block)
+                return null;
+            const node = view.state.doc.nodeAt(block.pmPos);
+            if (!node)
+                return null;
+            const dropBefore = clientY < block.rect.top ||
+                (clientY <= block.rect.bottom &&
+                    clientY < block.rect.top + block.rect.height / 2);
+            return {
+                block: block.node,
+                before: dropBefore,
+                pos: dropBefore ? block.pmPos : block.pmPos + node.nodeSize,
+                rect: block.rect,
+            };
+        };
+        const positionDragPreview = (session, clientX, clientY) => {
+            if (!session.preview)
+                return;
+            session.preview.style.transform = `translate3d(${clientX + 12}px, ${clientY + 10}px, 0)`;
+        };
+        const updateDropLine = (session, target) => {
+            const sourceEnd = session.sourcePos + session.sourceNodeSize;
+            if (!target ||
+                target.pos === session.sourcePos ||
+                target.pos === sourceEnd ||
+                (target.pos > session.sourcePos && target.pos < sourceEnd)) {
+                session.dropPos = null;
+                session.dropLine?.remove();
+                session.dropLine = null;
+                return;
+            }
+            if (!session.dropLine)
+                session.dropLine = createDropLine(session.view);
+            if (!session.dropLine)
+                return;
+            const wrapper = session.view.dom.closest(wrapperSelector);
+            if (!wrapper)
+                return;
+            const wrapperRect = wrapper.getBoundingClientRect();
+            const editorRect = session.view.dom.getBoundingClientRect();
+            const top = target.before ? target.rect.top : target.rect.bottom;
+            session.dropPos = target.pos;
+            session.dropLine.style.left = `${editorRect.left - wrapperRect.left}px`;
+            session.dropLine.style.top = `${top - wrapperRect.top}px`;
+            session.dropLine.style.width = `${editorRect.width}px`;
+        };
+        const createHandle = () => {
+            const el = document.createElement("div");
+            el.className = "drag-handle";
+            el.contentEditable = "false";
+            el.draggable = false;
+            el.innerHTML = `<svg width="14" height="14" viewBox="0 0 16 16" fill="currentColor">
+        <circle cx="5.5" cy="3" r="1.5"/><circle cx="10.5" cy="3" r="1.5"/>
+        <circle cx="5.5" cy="8" r="1.5"/><circle cx="10.5" cy="8" r="1.5"/>
+        <circle cx="5.5" cy="13" r="1.5"/><circle cx="10.5" cy="13" r="1.5"/>
+      </svg>`;
+            return el;
+        };
+        const hideHandle = () => {
+            if (handle)
+                handle.style.display = "none";
+            currentBlock = null;
+        };
+        const removeDragListeners = () => {
+            document.removeEventListener("mousemove", handleDocumentMouseMove);
+            document.removeEventListener("mouseup", handleDocumentMouseUp);
+            document.removeEventListener("keydown", handleDocumentKeyDown);
+        };
+        const createDocumentHoverMove = (editorView) => {
+            return (event) => {
+                if (!handle || dragSession)
+                    return;
+                if (!editor.isEditable) {
+                    hideHandle();
+                    return;
+                }
+                const block = findForgivingBlock(editorView, event.clientX, event.clientY);
+                if (!block) {
+                    hideHandle();
+                    return;
+                }
+                showHandleForBlock(editorView, block);
+            };
+        };
+        const finishDragSession = (commit) => {
+            const session = dragSession;
+            if (!session)
+                return;
+            removeDragListeners();
+            if (commit && session.dragging && session.dropPos !== null) {
+                const sourceStart = session.sourcePos;
+                const sourceEnd = session.sourcePos + session.sourceNodeSize;
+                const dropPos = session.dropPos;
+                if (dropPos !== sourceStart &&
+                    dropPos !== sourceEnd &&
+                    !(dropPos > sourceStart && dropPos < sourceEnd)) {
+                    const sourceNode = session.view.state.doc.nodeAt(sourceStart);
+                    if (sourceNode) {
+                        const insertPos = dropPos > sourceStart ? dropPos - sourceNode.nodeSize : dropPos;
+                        const tr = session.view.state.tr
+                            .delete(sourceStart, sourceEnd)
+                            .insert(insertPos, sourceNode);
+                        tr.setSelection(NodeSelection.create(tr.doc, insertPos));
+                        session.view.dispatch(tr.scrollIntoView());
+                        session.view.focus();
+                    }
+                }
+            }
+            else if (!session.dragging) {
+                selectCurrentBlock(session.view);
+            }
+            cleanupDragVisuals();
+            dragSession = null;
+            hideHandle();
+        };
+        const beginDragSession = (session, event) => {
+            session.dragging = true;
+            session.preview = createDragPreview(session.sourceBlock);
+            session.sourceBlock.classList.add("notion-block--dragging");
+            document.documentElement.classList.add("notion-editor-is-dragging");
+            positionDragPreview(session, event.clientX, event.clientY);
+            updateDropLine(session, findDropTarget(session.view, event.clientX, event.clientY));
+        };
+        function handleDocumentMouseMove(event) {
+            if (!dragSession)
+                return;
+            event.preventDefault();
+            const movedEnough = Math.hypot(event.clientX - dragSession.startX, event.clientY - dragSession.startY) > 4;
+            if (!dragSession.dragging && movedEnough) {
+                beginDragSession(dragSession, event);
+            }
+            if (!dragSession.dragging)
+                return;
+            positionDragPreview(dragSession, event.clientX, event.clientY);
+            updateDropLine(dragSession, findDropTarget(dragSession.view, event.clientX, event.clientY));
+        }
+        function handleDocumentMouseUp(event) {
+            event.preventDefault();
+            finishDragSession(true);
+        }
+        function handleDocumentKeyDown(event) {
+            if (event.key !== "Escape")
+                return;
+            event.preventDefault();
+            finishDragSession(false);
+        }
+        return [
+            new Plugin({
+                key: dragHandleKey,
+                view(editorView) {
+                    handle = createHandle();
+                    const handleDocumentHoverMove = createDocumentHoverMove(editorView);
+                    const wrapper = editorView.dom.closest(wrapperSelector);
+                    if (wrapper) {
+                        wrapper.style.position = "relative";
+                        wrapper.appendChild(handle);
+                    }
+                    document.addEventListener("mousemove", handleDocumentHoverMove);
+                    handle.addEventListener("mousedown", (e) => {
+                        e.stopPropagation();
+                        if (!editor.isEditable) {
+                            e.preventDefault();
+                            return;
+                        }
+                        if (!currentBlock || dragStartPos === null)
+                            return;
+                        const sourceNode = editorView.state.doc.nodeAt(dragStartPos);
+                        if (!sourceNode)
+                            return;
+                        e.preventDefault();
+                        dragSession = {
+                            view: editorView,
+                            sourceBlock: currentBlock,
+                            sourcePos: dragStartPos,
+                            sourceNodeSize: sourceNode.nodeSize,
+                            startX: e.clientX,
+                            startY: e.clientY,
+                            dragging: false,
+                            preview: null,
+                            dropLine: null,
+                            dropPos: null,
+                        };
+                        document.addEventListener("mousemove", handleDocumentMouseMove);
+                        document.addEventListener("mouseup", handleDocumentMouseUp);
+                        document.addEventListener("keydown", handleDocumentKeyDown);
+                    });
+                    return {
+                        destroy() {
+                            document.removeEventListener("mousemove", handleDocumentHoverMove);
+                            finishDragSession(false);
+                            handle?.remove();
+                            handle = null;
+                        },
+                    };
+                },
+                props: {
+                    handleDOMEvents: {
+                        mousemove(view, event) {
+                            if (!handle)
+                                return false;
+                            if (!editor.isEditable) {
+                                hideHandle();
+                                return false;
+                            }
+                            if (dragSession)
+                                return false;
+                            const block = findForgivingBlock(view, event.clientX, event.clientY);
+                            if (!block) {
+                                hideHandle();
+                                return false;
+                            }
+                            if (block.node === currentBlock)
+                                return false;
+                            showHandleForBlock(view, block);
+                            return false;
+                        },
+                        drop() {
+                            finishDragSession(false);
+                            hideHandle();
+                            return false;
+                        },
+                    },
+                },
+            }),
+        ];
+    },
+});
+//# sourceMappingURL=DragHandle.js.map

package/dist/client/rich-markdown-editor/DragHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DragHandle.js","sourceRoot":"","sources":["../../../src/client/rich-markdown-editor/DragHandle.ts"],"names":[],"mappings":"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","sourcesContent":["import { Extension } from \"@tiptap/core\";\nimport { Plugin, PluginKey, NodeSelection } from \"@tiptap/pm/state\";\nimport { type EditorView } from \"@tiptap/pm/view\";\n\n/**\n * Default editor-wrapper CSS selector the drag handle scopes itself to.\n *\n * The handle, the drop indicator, and the `position: relative` anchor are all\n * appended to / measured against the closest ancestor matching this selector.\n * Content's editor wraps its ProseMirror DOM in a `.visual-editor-wrapper`\n * element, so that is the historical default. Other apps (e.g. the plan editor)\n * pass their own wrapper selector via {@link DragHandleOptions.wrapperSelector}.\n */\nexport const DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR = \".visual-editor-wrapper\";\n\nexport interface DragHandleOptions {\n  /**\n   * CSS selector for the editor wrapper element the handle is anchored to.\n   *\n   * Must match an ancestor of the ProseMirror editor DOM. The wrapper gets\n   * `position: relative` so the absolutely-positioned grip and drop indicator\n   * can be placed relative to it. Defaults to\n   * {@link DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR} so Content keeps working\n   * unchanged.\n   */\n  wrapperSelector: string;\n}\n\nconst dragHandleKey = new PluginKey(\"dragHandle\");\nconst HOVER_SIDE_OUTSET_REM = 8;\n\ntype DropTarget = {\n  block: HTMLElement;\n  before: boolean;\n  pos: number;\n  rect: DOMRect;\n};\n\ntype DragSession = {\n  view: EditorView;\n  sourceBlock: HTMLElement;\n  sourcePos: number;\n  sourceNodeSize: number;\n  startX: number;\n  startY: number;\n  dragging: boolean;\n  preview: HTMLElement | null;\n  dropLine: HTMLElement | null;\n  dropPos: number | null;\n};\n\ntype HoverBlock = {\n  node: HTMLElement;\n  pmPos: number;\n  rect: DOMRect;\n};\n\n/**\n * App-agnostic Tiptap extension providing a Notion-style left-margin drag grip\n * (the `::` handle), block selection, and drag-to-reorder over top-level block\n * nodes.\n *\n * Behavior:\n * - On hover over any top-level block, a `.drag-handle` grip appears in the left\n *   margin (forgiving hit zone extends {@link HOVER_SIDE_OUTSET_REM}rem to the\n *   sides and into the gap above/between blocks).\n * - `mousedown` on the grip selects the block as a `NodeSelection`; dragging past\n *   a small threshold starts a reorder, showing a floating clone preview\n *   (`.notion-drag-preview`) and a `.notion-drop-indicator` line. `Escape`\n *   cancels.\n * - While dragging, the source block carries `.notion-block--dragging` and the\n *   document element carries `.notion-editor-is-dragging` so apps can style the\n *   in-flight state. Apps own all of these CSS class names.\n * - Works for ANY top-level node ProseMirror renders as a direct child of the\n *   editor — including `group: \"block\"`, `draggable: true` atoms such as the\n *   plan editor's `planBlock`.\n *\n * The only app-specific coupling — the editor wrapper element the handle and\n * drop indicator are anchored to — is configurable via\n * {@link DragHandleOptions.wrapperSelector}, defaulting to\n * {@link DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR} (`.visual-editor-wrapper`) so the\n * Content editor keeps working byte-identically. The plan editor passes its own\n * wrapper selector via `DragHandle.configure({ wrapperSelector })`.\n */\nexport const DragHandle = Extension.create<DragHandleOptions>({\n  name: \"dragHandle\",\n\n  addOptions() {\n    return {\n      wrapperSelector: DEFAULT_DRAG_HANDLE_WRAPPER_SELECTOR,\n    };\n  },\n\n  addProseMirrorPlugins() {\n    const editor = this.editor;\n    const wrapperSelector = this.options.wrapperSelector;\n    let handle: HTMLElement | null = null;\n    let currentBlock: HTMLElement | null = null;\n    let dragStartPos: number | null = null;\n    let dragSession: DragSession | null = null;\n\n    const getHoverSideOutset = () => {\n      const rootFontSize = Number.parseFloat(\n        getComputedStyle(document.documentElement).fontSize,\n      );\n      return (\n        (Number.isFinite(rootFontSize) ? rootFontSize : 16) *\n        HOVER_SIDE_OUTSET_REM\n      );\n    };\n\n    const getTopLevelBlocks = (editorView: EditorView): HoverBlock[] => {\n      const blocks: HoverBlock[] = [];\n\n      editorView.state.doc.forEach((_node, offset) => {\n        const dom = editorView.nodeDOM(offset);\n        if (!(dom instanceof HTMLElement)) return;\n\n        blocks.push({\n          node: dom,\n          pmPos: offset,\n          rect: dom.getBoundingClientRect(),\n        });\n      });\n\n      return blocks;\n    };\n\n    const findForgivingBlock = (\n      editorView: EditorView,\n      clientX: number,\n      clientY: number,\n    ): HoverBlock | null => {\n      const blocks = getTopLevelBlocks(editorView);\n      if (blocks.length === 0) return null;\n\n      const sideOutset = getHoverSideOutset();\n      const pageLeft = 0;\n      const pageRight = window.visualViewport?.width ?? window.innerWidth;\n\n      for (let index = 0; index < blocks.length; index++) {\n        const block = blocks[index];\n        const nextBlock = blocks[index + 1];\n        const blockBottomGap = nextBlock\n          ? Math.max(0, nextBlock.rect.top - block.rect.bottom)\n          : 0;\n        const zoneLeft = Math.max(pageLeft, block.rect.left - sideOutset);\n        const zoneRight = Math.min(pageRight, block.rect.right + sideOutset);\n        const zoneTop =\n          index === 0\n            ? Math.max(0, block.rect.top - blockBottomGap)\n            : block.rect.top;\n        const zoneBottom = nextBlock ? nextBlock.rect.top : block.rect.bottom;\n\n        if (\n          clientX >= zoneLeft &&\n          clientX <= zoneRight &&\n          clientY >= zoneTop &&\n          clientY < zoneBottom\n        ) {\n          return block;\n        }\n      }\n\n      return null;\n    };\n\n    const showHandleForBlock = (editorView: EditorView, block: HoverBlock) => {\n      if (!handle) return;\n      currentBlock = block.node;\n      dragStartPos = block.pmPos;\n\n      const wrapper = editorView.dom.closest(wrapperSelector);\n      if (!wrapper) return;\n\n      // Lazily (re)attach the grip the first time a wrapper is actually\n      // available. At plugin `view()` init the editor DOM may not yet be mounted\n      // inside the wrapper (React mounts `EditorContent` after the EditorView is\n      // constructed), so the init-time append can silently no-op and leave the\n      // grip orphaned. Re-home it here once the wrapper exists.\n      if (handle.parentElement !== wrapper) {\n        (wrapper as HTMLElement).style.position = \"relative\";\n        wrapper.appendChild(handle);\n      }\n\n      const wrapperRect = wrapper.getBoundingClientRect();\n\n      handle.style.display = \"flex\";\n      handle.style.top = `${block.rect.top - wrapperRect.top + 2}px`;\n      handle.style.left = \"-24px\";\n    };\n\n    const selectCurrentBlock = (editorView: EditorView) => {\n      if (dragStartPos === null) return null;\n\n      try {\n        const sel = NodeSelection.create(editorView.state.doc, dragStartPos);\n        editorView.dispatch(editorView.state.tr.setSelection(sel));\n        editorView.focus();\n        return sel;\n      } catch {\n        return null;\n      }\n    };\n\n    const cleanupDragVisuals = () => {\n      dragSession?.preview?.remove();\n      dragSession?.dropLine?.remove();\n      dragSession?.sourceBlock.classList.remove(\"notion-block--dragging\");\n      document.documentElement.classList.remove(\"notion-editor-is-dragging\");\n    };\n\n    const createDragPreview = (block: HTMLElement): HTMLElement => {\n      const blockRect = block.getBoundingClientRect();\n      const preview = document.createElement(\"div\");\n      const clone = block.cloneNode(true) as HTMLElement;\n\n      clone.classList.remove(\n        \"ProseMirror-selectednode\",\n        \"notion-block--dragging\",\n      );\n      clone.removeAttribute(\"contenteditable\");\n      clone.style.background = \"transparent\";\n      clone.style.backgroundColor = \"transparent\";\n      clone.querySelectorAll(\"[contenteditable]\").forEach((node) => {\n        node.removeAttribute(\"contenteditable\");\n      });\n      clone.querySelectorAll<HTMLElement>(\"*\").forEach((node) => {\n        node.style.background = \"transparent\";\n        node.style.backgroundColor = \"transparent\";\n      });\n\n      preview.className = \"notion-drag-preview\";\n      preview.style.width = `${blockRect.width}px`;\n      preview.appendChild(clone);\n      document.body.appendChild(preview);\n\n      return preview;\n    };\n\n    const createDropLine = (view: EditorView): HTMLElement | null => {\n      const wrapper = view.dom.closest(wrapperSelector);\n      if (!wrapper) return null;\n\n      const line = document.createElement(\"div\");\n      line.className = \"notion-drop-indicator\";\n      wrapper.appendChild(line);\n      return line;\n    };\n\n    const findDropTarget = (\n      view: EditorView,\n      clientX: number,\n      clientY: number,\n    ): DropTarget | null => {\n      const block = findForgivingBlock(view, clientX, clientY);\n      if (!block) return null;\n\n      const node = view.state.doc.nodeAt(block.pmPos);\n      if (!node) return null;\n\n      const dropBefore =\n        clientY < block.rect.top ||\n        (clientY <= block.rect.bottom &&\n          clientY < block.rect.top + block.rect.height / 2);\n\n      return {\n        block: block.node,\n        before: dropBefore,\n        pos: dropBefore ? block.pmPos : block.pmPos + node.nodeSize,\n        rect: block.rect,\n      };\n    };\n\n    const positionDragPreview = (\n      session: DragSession,\n      clientX: number,\n      clientY: number,\n    ) => {\n      if (!session.preview) return;\n\n      session.preview.style.transform = `translate3d(${clientX + 12}px, ${clientY + 10}px, 0)`;\n    };\n\n    const updateDropLine = (\n      session: DragSession,\n      target: DropTarget | null,\n    ) => {\n      const sourceEnd = session.sourcePos + session.sourceNodeSize;\n      if (\n        !target ||\n        target.pos === session.sourcePos ||\n        target.pos === sourceEnd ||\n        (target.pos > session.sourcePos && target.pos < sourceEnd)\n      ) {\n        session.dropPos = null;\n        session.dropLine?.remove();\n        session.dropLine = null;\n        return;\n      }\n\n      if (!session.dropLine) session.dropLine = createDropLine(session.view);\n      if (!session.dropLine) return;\n\n      const wrapper = session.view.dom.closest(wrapperSelector);\n      if (!wrapper) return;\n\n      const wrapperRect = wrapper.getBoundingClientRect();\n      const editorRect = session.view.dom.getBoundingClientRect();\n      const top = target.before ? target.rect.top : target.rect.bottom;\n\n      session.dropPos = target.pos;\n      session.dropLine.style.left = `${editorRect.left - wrapperRect.left}px`;\n      session.dropLine.style.top = `${top - wrapperRect.top}px`;\n      session.dropLine.style.width = `${editorRect.width}px`;\n    };\n\n    const createHandle = () => {\n      const el = document.createElement(\"div\");\n      el.className = \"drag-handle\";\n      el.contentEditable = \"false\";\n      el.draggable = false;\n      el.innerHTML = `<svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"currentColor\">\n        <circle cx=\"5.5\" cy=\"3\" r=\"1.5\"/><circle cx=\"10.5\" cy=\"3\" r=\"1.5\"/>\n        <circle cx=\"5.5\" cy=\"8\" r=\"1.5\"/><circle cx=\"10.5\" cy=\"8\" r=\"1.5\"/>\n        <circle cx=\"5.5\" cy=\"13\" r=\"1.5\"/><circle cx=\"10.5\" cy=\"13\" r=\"1.5\"/>\n      </svg>`;\n      return el;\n    };\n\n    const hideHandle = () => {\n      if (handle) handle.style.display = \"none\";\n      currentBlock = null;\n    };\n\n    const removeDragListeners = () => {\n      document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\n      document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\n      document.removeEventListener(\"keydown\", handleDocumentKeyDown);\n    };\n\n    const createDocumentHoverMove = (editorView: EditorView) => {\n      return (event: MouseEvent) => {\n        if (!handle || dragSession) return;\n        if (!editor.isEditable) {\n          hideHandle();\n          return;\n        }\n\n        const block = findForgivingBlock(\n          editorView,\n          event.clientX,\n          event.clientY,\n        );\n\n        if (!block) {\n          hideHandle();\n          return;\n        }\n\n        showHandleForBlock(editorView, block);\n      };\n    };\n\n    const finishDragSession = (commit: boolean) => {\n      const session = dragSession;\n      if (!session) return;\n\n      removeDragListeners();\n\n      if (commit && session.dragging && session.dropPos !== null) {\n        const sourceStart = session.sourcePos;\n        const sourceEnd = session.sourcePos + session.sourceNodeSize;\n        const dropPos = session.dropPos;\n\n        if (\n          dropPos !== sourceStart &&\n          dropPos !== sourceEnd &&\n          !(dropPos > sourceStart && dropPos < sourceEnd)\n        ) {\n          const sourceNode = session.view.state.doc.nodeAt(sourceStart);\n          if (sourceNode) {\n            const insertPos =\n              dropPos > sourceStart ? dropPos - sourceNode.nodeSize : dropPos;\n            const tr = session.view.state.tr\n              .delete(sourceStart, sourceEnd)\n              .insert(insertPos, sourceNode);\n\n            tr.setSelection(NodeSelection.create(tr.doc, insertPos));\n\n            session.view.dispatch(tr.scrollIntoView());\n            session.view.focus();\n          }\n        }\n      } else if (!session.dragging) {\n        selectCurrentBlock(session.view);\n      }\n\n      cleanupDragVisuals();\n      dragSession = null;\n      hideHandle();\n    };\n\n    const beginDragSession = (session: DragSession, event: MouseEvent) => {\n      session.dragging = true;\n      session.preview = createDragPreview(session.sourceBlock);\n      session.sourceBlock.classList.add(\"notion-block--dragging\");\n      document.documentElement.classList.add(\"notion-editor-is-dragging\");\n      positionDragPreview(session, event.clientX, event.clientY);\n      updateDropLine(\n        session,\n        findDropTarget(session.view, event.clientX, event.clientY),\n      );\n    };\n\n    function handleDocumentMouseMove(event: MouseEvent) {\n      if (!dragSession) return;\n      event.preventDefault();\n\n      const movedEnough =\n        Math.hypot(\n          event.clientX - dragSession.startX,\n          event.clientY - dragSession.startY,\n        ) > 4;\n\n      if (!dragSession.dragging && movedEnough) {\n        beginDragSession(dragSession, event);\n      }\n\n      if (!dragSession.dragging) return;\n\n      positionDragPreview(dragSession, event.clientX, event.clientY);\n      updateDropLine(\n        dragSession,\n        findDropTarget(dragSession.view, event.clientX, event.clientY),\n      );\n    }\n\n    function handleDocumentMouseUp(event: MouseEvent) {\n      event.preventDefault();\n      finishDragSession(true);\n    }\n\n    function handleDocumentKeyDown(event: KeyboardEvent) {\n      if (event.key !== \"Escape\") return;\n      event.preventDefault();\n      finishDragSession(false);\n    }\n\n    return [\n      new Plugin({\n        key: dragHandleKey,\n        view(editorView) {\n          handle = createHandle();\n          const handleDocumentHoverMove = createDocumentHoverMove(editorView);\n          const wrapper = editorView.dom.closest(wrapperSelector);\n          if (wrapper) {\n            (wrapper as HTMLElement).style.position = \"relative\";\n            wrapper.appendChild(handle);\n          }\n\n          document.addEventListener(\"mousemove\", handleDocumentHoverMove);\n\n          handle.addEventListener(\"mousedown\", (e) => {\n            e.stopPropagation();\n            if (!editor.isEditable) {\n              e.preventDefault();\n              return;\n            }\n\n            if (!currentBlock || dragStartPos === null) return;\n\n            const sourceNode = editorView.state.doc.nodeAt(dragStartPos);\n            if (!sourceNode) return;\n\n            e.preventDefault();\n            dragSession = {\n              view: editorView,\n              sourceBlock: currentBlock,\n              sourcePos: dragStartPos,\n              sourceNodeSize: sourceNode.nodeSize,\n              startX: e.clientX,\n              startY: e.clientY,\n              dragging: false,\n              preview: null,\n              dropLine: null,\n              dropPos: null,\n            };\n\n            document.addEventListener(\"mousemove\", handleDocumentMouseMove);\n            document.addEventListener(\"mouseup\", handleDocumentMouseUp);\n            document.addEventListener(\"keydown\", handleDocumentKeyDown);\n          });\n\n          return {\n            destroy() {\n              document.removeEventListener(\n                \"mousemove\",\n                handleDocumentHoverMove,\n              );\n              finishDragSession(false);\n              handle?.remove();\n              handle = null;\n            },\n          };\n        },\n        props: {\n          handleDOMEvents: {\n            mousemove(view, event) {\n              if (!handle) return false;\n              if (!editor.isEditable) {\n                hideHandle();\n                return false;\n              }\n              if (dragSession) return false;\n\n              const block = findForgivingBlock(\n                view,\n                event.clientX,\n                event.clientY,\n              );\n              if (!block) {\n                hideHandle();\n                return false;\n              }\n\n              if (block.node === currentBlock) return false;\n              showHandleForBlock(view, block);\n\n              return false;\n            },\n            drop() {\n              finishDragSession(false);\n              hideHandle();\n              return false;\n            },\n          },\n        },\n      }),\n    ];\n  },\n});\n"]}

package/dist/client/rich-markdown-editor/ImageExtension.d.ts

@@ -0,0 +1,63 @@
+import { type ImageOptions } from "@tiptap/extension-image";
+import type { EditorView } from "@tiptap/pm/view";
+/**
+ * The injectable async upload contract for the shared image block.
+ *
+ * An app provides this to turn a picked / pasted / dropped {@link File} into a
+ * hosted image. It returns the final `src` (a hosted URL) plus an optional
+ * `alt`. Plans wire it to the framework `upload-image` action; Content keeps its
+ * own richer image block and does not use this contract.
+ *
+ * When NO upload function is supplied, the shared block still renders images and
+ * round-trips `![alt](src)` markdown — it just cannot ingest local files (paste
+ * of an image URL / markdown still works via the base node's input rules).
+ */
+export type ImageUploadFn = (file: File) => Promise<{
+    src: string;
+    alt?: string;
+}>;
+export interface SharedImageOptions extends ImageOptions {
+    /**
+     * App-injected uploader. When present, the shared block accepts pasted /
+     * dropped image files and the `/image` slash command, uploading each file
+     * through this function and patching the node's `src` on resolve.
+     */
+    onImageUpload?: ImageUploadFn | null;
+}
+/**
+ * The SHARED block-level image node. Built on `@tiptap/extension-image` (a
+ * node named `image`), so:
+ *
+ *   - **GFM serialization** emits pure `![alt](src)` markdown via a block-aware
+ *     `addStorage().markdown.serialize` (it calls `closeBlock` so a block image
+ *     keeps its blank-line separator, byte-stable). It emits NO `<img width>`
+ *     HTML, so plans stay source-syncable under the GFM `html:false` contract.
+ *   - **Paste / drop** of local image files is handled by a self-contained
+ *     ProseMirror plugin that calls the injected {@link ImageUploadFn}. Pasting
+ *     an image URL or `![](url)` markdown works through the base node's input
+ *     rules even when no uploader is supplied.
+ *
+ * The node adds one transient `uploadId` attribute (never parsed/rendered to
+ * HTML, never serialized to markdown) used to track an in-flight upload.
+ *
+ * Content keeps its own richer `ImageNode` (Assets picker, AI alt-text, resize,
+ * NFM `{color}` serialization) and does NOT use this shared node — both nodes
+ * are named `image` but never coexist in the same editor because Content leaves
+ * `features.image` off and injects its own via `extraExtensions`.
+ */
+export declare const SharedImage: import("@tiptap/core").Node<SharedImageOptions, any>;
+/**
+ * Build the shared image extension, optionally wired with an app uploader.
+ *
+ * @example
+ * createImageExtension({ onImageUpload: uploadEditorImage })
+ */
+export declare function createImageExtension(options?: {
+    onImageUpload?: ImageUploadFn | null;
+}): import("@tiptap/core").Node<SharedImageOptions, any>;
+/**
+ * Open a native file picker, then upload + insert the chosen image(s) through
+ * the same flow as paste/drop. Used by the `/image` slash command.
+ */
+export declare function pickAndInsertImage(view: EditorView, upload: ImageUploadFn): void;
+//# sourceMappingURL=ImageExtension.d.ts.map

package/dist/client/rich-markdown-editor/ImageExtension.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageExtension.d.ts","sourceRoot":"","sources":["../../../src/client/rich-markdown-editor/ImageExtension.ts"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAEnE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,aAAa,GAAG,CAC1B,IAAI,EAAE,IAAI,KACP,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE5C,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;CACtC;AAoHD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,WAAW,sDAoGtB,CAAC;AAEH;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,GAAE;IAAE,aAAa,CAAC,EAAE,aAAa,GAAG,IAAI,CAAA;CAAO,wDAMvD;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,aAAa,GACpB,IAAI,CAgBN"}