mce 0.15.3 → 0.15.4

package/dist/crdt/Doc.d.ts

@@ -38,7 +38,6 @@ export declare class Doc extends Model {
     reset(): this;
     protected _addNode(data: Element, options?: AddNodeOptions): Node;
     addNode(data: Element, options?: AddNodeOptions): Node;
-    addNodes(dataItems: Element[], options?: AddNodeOptions): Node[];
     set(source: Document): this;
     protected _proxyProps(obj: CoreObject, yMap: Y.Map<any>, isMeta?: boolean): void;
     protected _proxyChildren(node: Node, childrenIds: Y.Array<string>): void;

package/dist/index.js

@@ -1,5 +1,5 @@
 import { Node as Node$1, Element2D, Timeline, Engine, Camera2D, DrawboardEffect, Aabb2D, IN_BROWSER, clamp, assets, TimelineNode, Transform2D, Obb2D, render, Vector2 as Vector2$1, customNodes, Animation, IN_MAC_OS } from "modern-canvas";
-import { reactive, computed, watch, markRaw, ref, warn, shallowRef, onBeforeUnmount, defineComponent, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, toDisplayString, createVNode, useAttrs, createBlock, resolveDynamicComponent, normalizeClass, mergeProps, createElementVNode, inject, toValue, getCurrentInstance, provide, useId, readonly, toRef, onMounted, onDeactivated, onActivated, onScopeDispose, useModel, useTemplateRef, withDirectives, vShow, vModelText, nextTick, Fragment, renderList, renderSlot, mergeModels, resolveComponent, withModifiers, withCtx, Teleport, createTextVNode, createSlots, normalizeProps, guardReactiveProps, onBeforeMount, h, isRef, useSlots } from "vue";
+import { reactive, computed, watch, markRaw, isReactive, ref, warn, shallowRef, onBeforeUnmount, defineComponent, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, toDisplayString, createVNode, useAttrs, createBlock, resolveDynamicComponent, normalizeClass, mergeProps, createElementVNode, inject, toValue, getCurrentInstance, provide, useId, readonly, toRef, onMounted, onDeactivated, onActivated, onScopeDispose, useModel, useTemplateRef, withDirectives, vShow, vModelText, nextTick, Fragment, renderList, renderSlot, mergeModels, resolveComponent, withModifiers, withCtx, Teleport, createTextVNode, createSlots, normalizeProps, guardReactiveProps, onBeforeMount, h, isRef, useSlots } from "vue";
 import { useFileDialog, useEventListener, isClient, onClickOutside, useDebounceFn, useResizeObserver as useResizeObserver$1, useLocalStorage, useImage } from "@vueuse/core";
 import { getObjectValueByPath, setObjectValueByPath, Observable, Reactivable, idGenerator, property, normalizeTextContent, normalizeCRLF, isEqualObject } from "modern-idoc";
 import { saveAs } from "file-saver";
@@ -536,11 +536,6 @@ class Doc extends Model {
   async load(initFn) {
     return super.load(async () => {
       await initFn?.();
-      this._proxyNode(
-        this.root,
-        this._yProps,
-        this._yChildrenIds
-      );
       this._yChildren.observe(this._yChildrenChange.bind(this));
     });
   }
@@ -611,9 +606,6 @@ class Doc extends Model {
   addNode(data, options) {
     return this.transact(() => this._addNode(data, options));
   }
-  addNodes(dataItems, options) {
-    return this.transact(() => dataItems.map((data) => this._addNode(data, options)));
-  }
   set(source) {
     const { children = [], meta = {}, ..._props } = source;
     const props = {
@@ -628,7 +620,12 @@ class Doc extends Model {
     }
     this._yProps.set("meta", new Y.Map(Object.entries(meta)));
     this._transacting = true;
-    this.addNodes(children);
+    this._proxyNode(
+      this.root,
+      this._yProps,
+      this._yChildrenIds
+    );
+    this.root.append(children);
     return this;
   }
   _proxyProps(obj, yMap, isMeta = false) {
@@ -695,8 +692,13 @@ class Doc extends Model {
         return;
       }
       this.transact(() => {
-        childrenIds.insert(newIndex, [child.id]);
         this._debug(`addChild ${child.id}`, child.name, newIndex);
+        if (!isReactive(child)) {
+          child = reactive(child);
+          node.children[newIndex] = child;
+        }
+        this._proxyNode(child);
+        childrenIds.insert(newIndex, [child.id]);
       });
     });
     node.on("removeChild", (child, oldIndex) => {
@@ -704,11 +706,11 @@ class Doc extends Model {
         return;
       }
       this.transact(() => {
+        this._debug(`removeChild ${child.id}`, child.name, oldIndex);
         const index = childrenIds.toJSON().indexOf(child.id);
         if (index > -1) {
           childrenIds.delete(index, 1);
         }
-        this._debug(`removeChild ${child.id}`, child.name, oldIndex);
       });
     });
     node.children.forEach((child) => {
@@ -793,6 +795,7 @@ class Doc extends Model {
       });
       node.on("destroy", () => {
         this._nodeMap.delete(node.id);
+        this._yChildren.delete(node.id);
         this._debug("destroy", node.id);
       });
       this._proxyProps(node, yNode);
@@ -2080,6 +2083,7 @@ const _2_load = defineMixin((editor) => {
   const load = async (source) => {
     state.value = "loading";
     const items = [];
+    let hasLoader = false;
     try {
       for (const loader of loaders.values()) {
         if (await loader.test(source)) {
@@ -2089,13 +2093,14 @@ const _2_load = defineMixin((editor) => {
           } else {
             items.push(res);
           }
+          hasLoader = true;
           break;
         }
       }
     } finally {
       state.value = void 0;
     }
-    if (!items.length) {
+    if (!hasLoader) {
       throw new Error(`Failed to load source "${source}"`);
     }
     return items;
@@ -3295,36 +3300,74 @@ const _clipboard = definePlugin((editor, options) => {
   } = editor;
   const copiedData = ref();
   const useClipboard = options.clipboard !== false && SUPPORTS_CLIPBOARD;
-  function toClipboardItem(source) {
+  const copy = async (source) => {
     if (typeof source === "string") {
-      const type = "text/plain";
-      return new ClipboardItem({ [type]: new Blob([source], { type }) });
+      if (useClipboard) {
+        await navigator.clipboard.write([
+          new ClipboardItem({
+            "text/plain": new Blob([source], { type: "text/plain" })
+          })
+        ]);
+      }
     } else if (source instanceof Blob) {
-      return new ClipboardItem({ [source.type]: source });
-    } else {
-      const type = "text/html";
-      const content = `<mce-clipboard>${JSON.stringify(source)}</mce-clipboard>`;
-      return new ClipboardItem({
-        [type]: new Blob([content], { type })
-      });
-    }
-  }
-  const copy = async (source) => {
-    if (source === void 0) {
-      source = selection.value.map((v) => {
-        const json = v.toJSON();
-        delete json.style.left;
-        delete json.style.top;
-        return json;
-      });
-    }
-    if (useClipboard) {
-      await navigator.clipboard.write([
-        toClipboardItem(source)
-      ]);
+      if (useClipboard) {
+        await navigator.clipboard.write([
+          new ClipboardItem({
+            [source.type]: source
+          })
+        ]);
+      }
     } else {
-      if (Array.isArray(source)) {
-        copiedData.value = source;
+      if (useClipboard) {
+        const textItems = [];
+        let html = "";
+        if (!source) {
+          const selected = selection.value;
+          html += `<mce-clipboard>${JSON.stringify(selected.map((v) => {
+            const json = v.toJSON();
+            if (json.style) {
+              delete json.style.left;
+              delete json.style.top;
+            }
+            return json;
+          }))}</mce-clipboard>`;
+          const cb = (child) => {
+            if (child instanceof Element2D) {
+              const _text2 = child.text.base.toString();
+              textItems.push(_text2);
+              html += `<span>${_text2}</span>`;
+            }
+            return false;
+          };
+          selected.forEach((node) => {
+            cb(node);
+            node.findOne(cb);
+          });
+        } else {
+          html += `<mce-clipboard>${JSON.stringify(source)}</mce-clipboard>`;
+        }
+        const items = {};
+        if (textItems.length) {
+          items["text/plain"] = new Blob([textItems.join("\n")], { type: "text/plain" });
+        }
+        if (html) {
+          items["text/html"] = new Blob([html], { type: "text/html" });
+        }
+        await navigator.clipboard.write([
+          new ClipboardItem(items)
+        ]);
+      } else {
+        if (source === void 0) {
+          source = selection.value.map((v) => {
+            const json = v.toJSON();
+            delete json.style.left;
+            delete json.style.top;
+            return json;
+          });
+        }
+        if (Array.isArray(source)) {
+          copiedData.value = source;
+        }
       }
     }
   };
@@ -3343,10 +3386,17 @@ const _clipboard = definePlugin((editor, options) => {
   async function _paste(items) {
     const elements = [];
     for (const item of items) {
-      for (const type of item.types) {
+      const types = [...item.types];
+      const index = types.indexOf("text/html");
+      if (index > -1) {
+        types.splice(index, 1);
+        types.unshift("text/html");
+      }
+      for (const type of types) {
         const blob = await item.getType(type);
         if (await canLoad(blob)) {
           elements.push(...await load(blob));
+          break;
         } else {
           console.warn(`Unhandled clipboard ${blob.type}`, await blob.text());
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mce",
   "type": "module",
-  "version": "0.15.3",
+  "version": "0.15.4",
   "description": "The headless canvas editor framework. only the ESM.",
   "author": "wxm",
   "license": "MIT",