mce 0.16.0 → 0.16.2

package/dist/crdt/YDoc.d.ts

@@ -1,5 +1,4 @@
 import type { CoreObject } from 'modern-canvas';
-import type { Document, Element } from 'modern-idoc';
 import type { YModelEvents } from './YModel';
 import { Node } from 'modern-canvas';
 import * as Y from 'yjs';
@@ -21,20 +20,17 @@ export interface YDoc {
     emit: <K extends keyof YDocEvents & string>(event: K, ...args: YDocEvents[K]) => this;
 }
 export declare class YDoc extends YModel {
-    protected readonly root: Node;
     protected _yChildren: Y.Map<YNode>;
     protected _yChildrenIds: Y.Array<string>;
-    protected _nodeMap: Map<string, Node>;
-    constructor(root: Node, id?: string);
+    _nodeMap: Map<string, Node>;
+    constructor(id?: string);
     load(initFn?: () => void | Promise<void>): Promise<this>;
     protected _isSelfTransaction(transaction: Y.Transaction): boolean;
     protected _debug(..._args: any[]): void;
     protected _yChildrenChange(event: Y.YMapEvent<Y.Map<unknown>>, transaction: Y.Transaction): void;
     reset(): this;
     destroy(): void;
-    protected _addNode(data: Element, options?: AddNodeOptions): Node;
-    addNode(data: Element, options?: AddNodeOptions): Node;
-    set(source: Document): this;
+    proxyRoot(root: Node, props: Record<string, any>): this;
     protected _proxyProps(obj: CoreObject, yMap: Y.Map<any>, isMeta?: boolean): void;
     protected _proxyChildren(node: Node, childrenIds: Y.Array<string>): void;
     protected _proxyNode(node: Node, yNode?: YNode, yChildrenIds?: Y.Array<string>): void;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { Node as Node$1, Element2D, Camera2D, Timeline, DrawboardEffect, Engine, Aabb2D, IN_BROWSER, clamp, assets, TimelineNode, Video2D, Transform2D, Obb2D, render, Vector2 as Vector2$1, Lottie2D, customNodes, Animation, IN_MAC_OS } from "modern-canvas";
+import { Element2D, Node as Node$1, Camera2D, Timeline, DrawboardEffect, Engine, Aabb2D, IN_BROWSER, clamp, assets, TimelineNode, Video2D, Transform2D, Obb2D, render, Vector2 as Vector2$1, Lottie2D, customNodes, Animation, IN_MAC_OS } from "modern-canvas";
 import { reactive, computed, watch, markRaw, isReactive, ref, onBeforeMount, onScopeDispose, warn, shallowRef, defineComponent, unref, openBlock, createElementBlock, normalizeStyle as normalizeStyle$1, toDisplayString, createCommentVNode, onMounted, createVNode, useAttrs, createBlock, resolveDynamicComponent, normalizeClass, mergeProps, createElementVNode, inject, toValue, getCurrentInstance, provide, useId, onBeforeUnmount, readonly, toRef, onDeactivated, onActivated, useModel, useTemplateRef, withDirectives, withModifiers, vModelText, vShow, nextTick, Fragment, renderList, renderSlot, resolveComponent, withCtx, mergeModels, Teleport, createTextVNode, createSlots, normalizeProps, guardReactiveProps, h, isRef, effectScope, useSlots } from "vue";
 import { useFileDialog, useEventListener, isClient, onClickOutside, useDebounceFn, useImage, useResizeObserver as useResizeObserver$1, useLocalStorage } from "@vueuse/core";
 import { getObjectValueByPath, setObjectValueByPath, Observable, idGenerator, normalizeTextContent, property, isCRLF, textContentToString, normalizeCRLF, isEqualObject } from "modern-idoc";
@@ -468,21 +468,18 @@ class YModel extends Observable {
   }
 }
 class YDoc extends YModel {
-  constructor(root, id) {
+  _yChildren;
+  _yChildrenIds;
+  _nodeMap = /* @__PURE__ */ new Map();
+  constructor(id) {
     super(id);
-    this.root = root;
     this._yChildren = markRaw(this._yDoc.getMap("children"));
     this._yChildrenIds = markRaw(this._yDoc.getArray("childrenIds"));
     this._setupUndoManager([
       this._yChildren,
       this._yChildrenIds
     ]);
-    this._yProps.set("id", this.root.id);
-    this._yProps.set("name", this.root.name);
   }
-  _yChildren;
-  _yChildrenIds;
-  _nodeMap = /* @__PURE__ */ new Map();
   async load(initFn) {
     return super.load(async () => {
       await initFn?.();
@@ -518,7 +515,6 @@ class YDoc extends YModel {
   }
   reset() {
     super.reset();
-    this.root.resetProperties();
     this._yChildren.clear();
     this._yChildrenIds.delete(0, this._yChildrenIds.length);
     this._nodeMap.clear();
@@ -528,58 +524,21 @@ class YDoc extends YModel {
   }
   destroy() {
     this.reset();
-    this.root.remove();
     super.destroy();
   }
-  _addNode(data, options = {}) {
-    const { parentId, index, regenId } = options;
-    let parent;
-    if (parentId && parentId !== this.root.id) {
-      parent = this._nodeMap.get(parentId) ?? this.root;
-    } else {
-      parent = this.root;
-    }
-    const value = {
-      ...data,
-      meta: {
-        inCanvasIs: "Element2D",
-        ...data?.meta ?? {}
-      }
-    };
-    if (regenId) {
-      delete value.id;
-    }
-    const node = reactive(Node$1.parse(value));
-    if (index === void 0) {
-      parent.appendChild(node);
-    } else {
-      parent.moveChild(node, index);
-    }
-    this._proxyNode(node);
-    return node;
-  }
-  addNode(data, options) {
-    return this.transact(() => this._addNode(data, options));
-  }
-  set(source) {
-    const { children = [], meta = {}, ..._props } = source;
-    const props = {
-      id: this.root.id,
-      name: this.root.name,
-      ..._props
-    };
+  proxyRoot(root, props) {
+    const { meta = {}, ..._props } = props;
     this.reset();
-    for (const key in props) {
-      this._yProps.set(key, props[key]);
+    for (const key in _props) {
+      this._yProps.set(key, _props[key]);
     }
     this._yProps.set("meta", new Y.Map(Object.entries(meta)));
     this._transacting = true;
     this._proxyNode(
-      this.root,
+      root,
       this._yProps,
       this._yChildrenIds
     );
-    this.root.append(children);
     return this;
   }
   _proxyProps(obj, yMap, isMeta = false) {
@@ -837,7 +796,7 @@ class Doc extends Node$1 {
         }
       }
     }
-    const _doc2 = new YDoc(this, id);
+    const _doc2 = new YDoc(id);
     _doc2.on(
       "update",
       throttle((update, origin) => this.emit("update", update, origin), 200)
@@ -851,15 +810,24 @@ class Doc extends Node$1 {
   transact = (fn, should = true) => {
     return this._yDoc.transact(fn, should);
   };
-  addNode = (data, options) => {
-    return this._yDoc.addNode(data, options);
-  };
   undo = () => {
     this._yDoc.undoManager.undo();
   };
   redo = () => {
     this._yDoc.undoManager.redo();
   };
+  set = (source) => {
+    const { children = [], ..._props } = source;
+    const props = {
+      id: this.id,
+      name: this.name,
+      ..._props
+    };
+    this.resetProperties();
+    this._yDoc.proxyRoot(this, props);
+    this.append(children);
+    return this;
+  };
   async load() {
     const source = this._source;
     await this._yDoc.load(async () => {
@@ -872,9 +840,9 @@ class Doc extends Node$1 {
       }
       if (source && typeof source !== "string") {
         if (Array.isArray(source)) {
-          this._yDoc.set({ children: source });
+          this.set({ children: source });
         } else {
-          this._yDoc.set(source);
+          this.set(source);
         }
       }
     });
@@ -3530,13 +3498,32 @@ const _4_3_element = defineMixin((editor) => {
     const isArray = Array.isArray(value);
     let offsetIndex = index;
     const elements = root.value.transact(() => {
+      const parentId = parent?.id;
+      const index2 = offsetIndex;
       const values = isArray ? value : [value];
-      const elements2 = values.map((element) => {
-        const el = root.value.addNode(element, {
-          parentId: parent?.id,
-          index: offsetIndex,
-          regenId
-        });
+      const elements2 = values.map((data) => {
+        let parent2;
+        if (parentId && parentId !== root.value.id) {
+          parent2 = root.value._yDoc._nodeMap.get(parentId) ?? root.value;
+        } else {
+          parent2 = root.value;
+        }
+        const value2 = {
+          ...data,
+          meta: {
+            inCanvasIs: "Element2D",
+            ...data?.meta ?? {}
+          }
+        };
+        if (regenId) {
+          delete value2.id;
+        }
+        const el = reactive(Node$1.parse(value2));
+        if (index2 === void 0) {
+          parent2.appendChild(el);
+        } else {
+          parent2.moveChild(el, index2);
+        }
         if (offsetIndex !== void 0) {
           offsetIndex++;
         }
@@ -4257,7 +4244,8 @@ const _doc = definePlugin((editor, options) => {
     docLoading,
     renderEngine,
     config,
-    to
+    to,
+    waitUntilFontLoad
   } = editor;
   const getDoc = () => {
     return to("json");
@@ -4269,7 +4257,6 @@ const _doc = definePlugin((editor, options) => {
     oldRoot.remove();
     renderEngine.value.root.append(_root);
     root.value = _root;
-    _root._yDoc.root = root.value;
     emit("setDoc", _root, oldRoot);
     return _root;
   };
@@ -4277,6 +4264,7 @@ const _doc = definePlugin((editor, options) => {
     docLoading.value = true;
     emit("docLoading", source);
     try {
+      await waitUntilFontLoad();
       const _doc2 = await setDoc(await load(source));
       emit("docLoaded", source, _doc2);
       docLoading.value = false;

package/dist/mixins/4.3.element.d.ts

@@ -1,5 +1,6 @@
-import type { Element2D, Node, Vector2Like } from 'modern-canvas';
+import type { Element2D, Vector2Like } from 'modern-canvas';
 import type { Element } from 'modern-idoc';
+import { Node } from 'modern-canvas';
 declare global {
     namespace Mce {
         type AddElementPosition = Vector2Like | Anchor | 'screenCenter' | 'pointer';

package/dist/nodes/Doc.d.ts

@@ -1,7 +1,6 @@
 import type { NodeEvents } from 'modern-canvas';
-import type { Element } from 'modern-idoc';
+import type { Document } from 'modern-idoc';
 import type * as Y from 'yjs';
-import type { AddNodeOptions } from '../crdt';
 import { Node } from 'modern-canvas';
 import { YDoc } from '../crdt';
 export interface DocEvents extends NodeEvents {
@@ -16,12 +15,12 @@ export interface Doc {
 }
 export declare class Doc extends Node {
     protected readonly _localDb: boolean;
-    protected _yDoc: YDoc;
+    _yDoc: YDoc;
     protected _source: any;
     constructor(source?: Mce.DocumentSource, _localDb?: boolean);
     transact: <T>(fn: () => T, should?: boolean) => T;
-    addNode: (data: Element, options?: AddNodeOptions) => Node;
     undo: () => void;
     redo: () => void;
+    set: (source: Document) => this;
     load(): Promise<void>;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mce",
   "type": "module",
-  "version": "0.16.0",
+  "version": "0.16.2",
   "description": "A headless infinite canvas editor framework built on WebGL rendering, supports exporting to image, video, and PPT. Only the ESM.",
   "author": "wxm",
   "license": "MIT",