rme 0.3.0-beta.4 → 0.3.0-beta.6

package/dist/index.d.ts

@@ -237,6 +237,12 @@ declare const createSourceCodeDelegate: (options?: CreateSourceCodeManagerOption
 
 declare const _default$1: react__default.NamedExoticComponent<EditorProps>;
 
+type ClipboardReadFunction = typeof clipboardRead;
+declare function clipboardRead(): Promise<{
+    html: string;
+    text: string;
+}>;
+
 interface AIOptions {
     defaultSelectProvider?: string;
     supportProviderInfosMap: Record<string, {
@@ -389,6 +395,7 @@ type ExtensionsOptions = {
     ai?: AIOptions;
     customCopyFunction?: CustomCopyFunction;
     overrideShortcutMap?: Record<string, string>;
+    clipboardReadFunction?: ClipboardReadFunction;
 };
 declare function extensions(options: ExtensionsOptions): any[];
 

package/dist/index.mjs

@@ -3433,6 +3433,33 @@ import { CountExtension } from "@rme-sdk/extension-count";
 import { corePreset } from "@rme-sdk/preset-core";
 import { ReactComponentExtension } from "@rme-sdk/react";
 
+// src/editor/utils/clipboard-read.ts
+function clipboardRead() {
+  return navigator.clipboard.read().then(async (data) => {
+    let html2 = "";
+    let text = "";
+    const htmlData = data.find((item) => item.types.includes("text/html"));
+    const textData = data.find((item) => item.types.includes("text/plain"));
+    const getHtml = async () => {
+      if (htmlData) {
+        const blob = await htmlData.getType("text/html");
+        html2 = await blob.text();
+      }
+    };
+    const getText = async () => {
+      if (textData) {
+        const blob = await textData.getType("text/plain");
+        text = await blob.text();
+      }
+    };
+    await Promise.all([getHtml(), getText()]);
+    return {
+      html: html2,
+      text
+    };
+  });
+}
+
 // src/editor/extensions/Ai/ai-extension.tsx
 import { extension, ExtensionTag, NodeExtension } from "@rme-sdk/core";
 import { TextSelection as TextSelection3 } from "@rme-sdk/pm/state";
@@ -3827,6 +3854,71 @@ function isTextOnlySlice(slice) {
   return false;
 }
 var ClipboardExtension = class extends PlainExtension2 {
+  constructor() {
+    super(...arguments);
+    this.handleClipboardData = async ({
+      html: html2 = "",
+      text = "",
+      view
+    }) => {
+      const editable = view.props.editable?.(view.state);
+      if (!editable) return false;
+      const currentNode = view.state.selection.$from.node();
+      if (currentNode.type.spec.code) return false;
+      if (html2.length === 0 && text.length === 0) return false;
+      console.log("html", html2);
+      console.log("text", text);
+      const transformer = getTransformerByView(view);
+      const parser = transformer.stringToDoc;
+      const schema = view.state.schema;
+      const domParser = DOMParser2.fromSchema(schema);
+      let dom;
+      if (html2.length === 0) {
+        const slice2 = parser?.(text);
+        if (!slice2 || typeof slice2 === "string") return false;
+        const res = [];
+        slice2.content.forEach((node2, index) => {
+          if (node2.type.name === "paragraph" && index === 0) {
+            node2.content.forEach((child) => {
+              res.push(child);
+            });
+          } else {
+            res.push(node2);
+          }
+        });
+        this.processImagesInNodesAsync(res, view);
+        if (res.length === 1) {
+          view.dispatch(view.state.tr.replaceSelectionWith(res[0], false));
+        } else {
+          const fragment = Fragment3.from(res);
+          view.dispatch(view.state.tr.replaceSelection(new Slice(fragment, 0, 0)));
+        }
+        return true;
+      } else {
+        const template = document.createElement("template");
+        template.innerHTML = html2;
+        dom = template.content.cloneNode(true);
+        template.remove();
+      }
+      const slice = domParser.parseSlice(dom);
+      const node = isTextOnlySlice(slice);
+      console.log("slice", slice, node);
+      if (node) {
+        if ((node.type.name === "html_image" || node.type.name === "md_image") && node.attrs.src) {
+          this.processImageNode(node, view);
+          view.dispatch(view.state.tr.replaceSelectionWith(node, true));
+        } else {
+          this.processMarkdownImageSyntax(node, view).then(() => {
+            view.dispatch(view.state.tr.replaceSelectionWith(node, true));
+          });
+        }
+        return true;
+      }
+      this.processImagesInSliceAsync(slice, view);
+      view.dispatch(view.state.tr.replaceSelection(slice));
+      return true;
+    };
+  }
   get name() {
     return "clipboard";
   }
@@ -3834,62 +3926,13 @@ var ClipboardExtension = class extends PlainExtension2 {
     return {
       props: {
         handlePaste: (view, event) => {
-          console.log("handlePaste", event);
-          const transformer = getTransformerByView(view);
-          const parser = transformer.stringToDoc;
-          const schema = view.state.schema;
-          const editable = view.props.editable?.(view.state);
           const { clipboardData } = event;
-          if (!editable || !clipboardData) return false;
+          if (!clipboardData) return false;
           const currentNode = view.state.selection.$from.node();
           if (currentNode.type.spec.code) return false;
           const text = clipboardData.getData("text/plain");
           const html2 = clipboardData.getData("text/html");
-          if (html2.length === 0 && text.length === 0) return false;
-          const domParser = DOMParser2.fromSchema(schema);
-          let dom;
-          if (html2.length === 0) {
-            const slice2 = parser?.(text);
-            if (!slice2 || typeof slice2 === "string") return false;
-            const res = [];
-            slice2.content.forEach((node2, index) => {
-              if (node2.type.name === "paragraph" && index === 0) {
-                node2.content.forEach((child) => {
-                  res.push(child);
-                });
-              } else {
-                res.push(node2);
-              }
-            });
-            this.processImagesInNodesAsync(res, view);
-            if (res.length === 1) {
-              view.dispatch(view.state.tr.replaceSelectionWith(res[0], false));
-            } else {
-              const fragment = Fragment3.from(res);
-              view.dispatch(view.state.tr.replaceSelection(new Slice(fragment, 0, 0)));
-            }
-            return true;
-          } else {
-            const template = document.createElement("template");
-            template.innerHTML = html2;
-            dom = template.content.cloneNode(true);
-            template.remove();
-          }
-          const slice = domParser.parseSlice(dom);
-          const node = isTextOnlySlice(slice);
-          if (node) {
-            if ((node.type.name === "html_image" || node.type.name === "md_image") && node.attrs.src) {
-              this.processImageNode(node, view);
-              view.dispatch(view.state.tr.replaceSelectionWith(node, true));
-            } else {
-              this.processMarkdownImageSyntax(node, view).then(() => {
-                view.dispatch(view.state.tr.replaceSelectionWith(node, true));
-              });
-            }
-            return true;
-          }
-          this.processImagesInSliceAsync(slice, view);
-          view.dispatch(view.state.tr.replaceSelection(slice));
+          this.handleClipboardData({ text, html: html2, view });
           return true;
         },
         clipboardTextSerializer: (slice, view) => {
@@ -3922,13 +3965,16 @@ var ClipboardExtension = class extends PlainExtension2 {
       },
       paste: () => {
         return (params) => {
-          if (params.tr.selection.empty) {
+          const { view } = params;
+          if (!view) return false;
+          if (!this.options.clipboardReadFunction) {
             return false;
           }
-          if (params.dispatch) {
-            console.log("execCommand paste");
-            document.execCommand("paste");
-          }
+          this.options.clipboardReadFunction().then(async (data) => {
+            let { html: html2, text } = data;
+            if (!html2 || !text) return false;
+            return await this.handleClipboardData({ html: html2, text, view });
+          });
           return true;
         };
       },
@@ -3984,13 +4030,13 @@ var ClipboardExtension = class extends PlainExtension2 {
     imageCopyHandler(node.attrs.src).then((newSrc) => {
       if (newSrc && newSrc !== node.attrs.src) {
         this.updateImageNodeSrc(view, node, newSrc);
-      } else {
-        const { state, dispatch } = view;
-        node.attrs["data-rme-loading"] = null;
-        dispatch(state.tr);
       }
     }).catch((error) => {
       console.warn("imageCopyHandler failed:", error);
+    }).finally(() => {
+      const { state, dispatch } = view;
+      node.attrs["data-rme-loading"] = null;
+      dispatch(state.tr);
     });
   }
   /**
@@ -6771,8 +6817,8 @@ import { jsx as jsx14 } from "react/jsx-runtime";
 var warningFallBack = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAAAAACIM/FCAAAChElEQVR4Ae3aMW/TQBxAcb70k91AAiGuGlZAtOlQApWaDiSdklZq2RPUTm1xUWL3PgqSpygkXlh88N54nn7S2Trd3y/CP5IQIUKECBEiRIgQIUKECBEiRIgQIUKECBEiRIgQIUKECBEiRIgQIUKECBEiRIgQIUKECBEiRIgQIUKECPmPIEKECBEiRIgQIeX82+FBO0naB4eTRRkt5P7sNWt1Rw9RQvKThI2SYR4f5OoVW2rfRAYpT6hqHc8WeVHki9mgRdWwiAmyfA9AdrlaW5tlAHxcxQMpK8feRbGxPEkrSREN5ARg/y780V0GMIwFcgXwLg9byvsAN3FA8lfAfr7jYQZ0nqKAfAb21vYVwNruSoEvMUDuE+Ai7IKECZA+RAA5A7JiN6TMgFHzIeUb4DLshoQZ0H1uPGQOvFzVQZYtYNF4yBg4DnWQMAAmjYccArN6yBQ4ajzkAFjUQ+ZAv/GQNpDXQ3Kg03hIAhT1kAJIhLi1/vJl39Ic6Mf3+a2K8PM7BgahtgEwjuKI0lqGjSI8opRdYFb3sk/jODSGEZCVuyFFDzgPzYc8JMBkN2QMpI8RQMIQ2LvdBblNgdM4Lh/aQJaHrf3sAe2nKCDhGqCfb3VEcx1UNQTItlzQ3fYAvoZYIMUHgHRSbiyPU4BPZUSX2JWEbLZcW5v2qByrmMYKxZCq1mA6z4sin08HLapOy8gGPddtttT5HuHobZiwUXr6K85h6KjLWm/PH+MdTy/GR/12knb6g8mPZ38YECJEiBAhQoQIESJEiBAhQoQIESJEiBAhQoQIESJEiBAhQoQIESJEiBAhQoQIESJEiBAhQoQIESJEiBAhQoQIESJEiBAh0fUb5q7oCGreEVEAAAAASUVORK5CYII=";
 function ImageNodeView(props) {
   const { node, selected, updateAttributes, handleViewImgSrcUrl, imageHostingHandler } = props;
-  const initRef = useRef7();
-  const popoverStore = useRef7();
+  const initRef = useRef7(null);
+  const popoverStore = useRef7(null);
   const popoverRef = useRef7(null);
   const handleStoreChange = (store) => {
     popoverStore.current = store;
@@ -6831,10 +6877,10 @@ function ImageNodeView(props) {
             });
           },
           ...node.attrs
-        }
+        },
+        `${node.attrs.src}_${node.attrs["data-rme-loading"]}`
       )
-    },
-    `${node.attrs.src}_${node.attrs["data-rme-loading"]}`
+    }
   );
   return /* @__PURE__ */ jsx14("div", { ref: popoverRef, style: { position: "relative", zIndex: selected ? 10 : "auto" }, children: /* @__PURE__ */ jsx14(
     Popover2,
@@ -8956,7 +9002,6 @@ var MathInlineView = class {
       }
       this._renderElt.replaceWith(newRenderEl);
       this._renderElt = newRenderEl;
-      console.log("this.renderElt", this._renderElt.outerHTML);
       this.dom.appendChild(this._renderElt);
       if (preview) {
         this._renderElt.classList.add("inline-input-preview");
@@ -10211,7 +10256,8 @@ function extensions(options) {
     handleViewImgSrcUrl,
     imageHostingHandler,
     imageCopyHandler,
-    customCopyFunction = defaultCopyFunction
+    customCopyFunction = defaultCopyFunction,
+    clipboardReadFunction = clipboardRead
   } = options;
   const res = [
     ...corePreset({ excludeExtensions: ["paragraph", "text"] }),
@@ -10266,7 +10312,8 @@ function extensions(options) {
       handleViewImgSrcUrl
     }),
     new ClipboardExtension({
-      imageCopyHandler
+      imageCopyHandler,
+      clipboardReadFunction
     }),
     new ReactComponentExtension({}),
     new DropCursorExtension({