modern-canvas 0.4.42 → 0.4.44

package/dist/index.cjs

@@ -543,6 +543,12 @@ class CoreObject extends EventEmitter {
     }
     return this;
   }
+  resetProperties() {
+    for (const [name, property] of this.getPropertyDeclarations()) {
+      this.setProperty(name, property.default);
+    }
+    return this;
+  }
   requestUpdate(key, oldValue, declaration) {
     if (key !== void 0) {
       const newValue = this[key];
@@ -565,8 +571,12 @@ class CoreObject extends EventEmitter {
     const properties = this.getProperties(Array.from(this._changedProperties));
     for (const key in properties) {
       const value = properties[key];
-      if (value && typeof value === "object" && "toJSON" in value && typeof value.toJSON === "function") {
-        json[key] = value.toJSON();
+      if (value && typeof value === "object") {
+        if ("toJSON" in value && typeof value.toJSON === "function") {
+          json[key] = value.toJSON();
+        } else {
+          json[key] = { ...value };
+        }
       } else {
         json[key] = value;
       }
@@ -5161,7 +5171,8 @@ class GradientTexture extends Texture2D {
     if (!ctx) {
       throw new Error("Failed to parse linear gradient, get canvas context is null.");
     }
-    const { angle, stops } = linearGradient;
+    let { angle, stops } = linearGradient;
+    angle -= Math.PI / 2;
     const halfWidth = width / 2;
     const halfHeight = height / 2;
     const length = Math.sqrt(width * width + height * height) / 2;
@@ -5598,6 +5609,56 @@ class ViewportTexture extends PixelsTexture {
   //
 }
 
+class Children extends Array {
+  front = [];
+  back = [];
+  get internal() {
+    return [
+      ...this.front,
+      ...this,
+      ...this.back
+    ];
+  }
+  constructor(...items) {
+    super();
+    this.set(items);
+  }
+  set(items) {
+    this.front.length = 0;
+    this.length = 0;
+    this.back.length = 0;
+    items.forEach((item) => {
+      switch (item.internalMode) {
+        case "front":
+          this.front.push(item);
+          break;
+        case "default":
+          this.push(item);
+          break;
+        case "back":
+          this.back.push(item);
+          break;
+      }
+    });
+    return this;
+  }
+  getInternal(includeInternal) {
+    switch (includeInternal) {
+      case "front":
+        return this.front;
+      case "default":
+        return this;
+      case "back":
+        return this.back;
+      default:
+        throw new Error(`Unknown internal mode: ${includeInternal}`);
+    }
+  }
+  toJSON() {
+    return [...this];
+  }
+}
+
 var __defProp$J = Object.defineProperty;
 var __getOwnPropDesc$I = Object.getOwnPropertyDescriptor;
 var __decorateClass$R = (decorators, target, key, kind) => {
@@ -5639,7 +5700,7 @@ exports.Node = class Node extends CoreObject {
       } = properties;
       if (meta) {
         for (const key in meta) {
-          this.setMeta(key, meta[key]);
+          this.meta[key] = meta[key];
         }
       }
       super.setProperties(restProperties);
@@ -5684,8 +5745,9 @@ exports.Node = class Node extends CoreObject {
       if (tree) {
         this.emit("treeEnter", tree);
       }
-      for (let len = this._children.length, i = 0; i < len; i++) {
-        const node = this._children[i];
+      const children = this._children.internal;
+      for (let len = children.length, i = 0; i < len; i++) {
+        const node = children[i];
         !tree && this.emit("childExitingTree", node);
         node.setTree(tree);
         tree && this.emit("childEnteredTree", node);
@@ -5709,7 +5771,7 @@ exports.Node = class Node extends CoreObject {
     this.setParent(parent);
   }
   hasParent() {
-    return !!this._parent;
+    return Boolean(this._parent);
   }
   getParent() {
     return this._parent;
@@ -5729,7 +5791,13 @@ exports.Node = class Node extends CoreObject {
     return this;
   }
   /** Children */
-  _children = [];
+  _children = new Children();
+  get children() {
+    return this._children;
+  }
+  set children(value) {
+    value instanceof Children ? this._children = value : this._children.set(value);
+  }
   get siblingIndex() {
     return this.getIndex();
   }
@@ -5737,35 +5805,18 @@ exports.Node = class Node extends CoreObject {
     this._parent?.moveChild(this, toIndex);
   }
   get previousSibling() {
-    return this._parent?.getChildren()[this.getIndex() - 1];
+    return this._parent?.children[this.getIndex() - 1];
   }
   get nextSibling() {
-    return this._parent?.getChildren()[this.getIndex() + 1];
+    return this._parent?.children[this.getIndex() + 1];
   }
   get firstSibling() {
-    return this._parent?.getChildren()[0];
+    return this._parent?.children[0];
   }
   get lastSibling() {
-    const children = this._parent?.getChildren();
+    const children = this._parent?.children;
     return children ? children[children.length - 1] : void 0;
   }
-  /** Meta */
-  _meta = /* @__PURE__ */ new Map();
-  hasMeta(name) {
-    return this._meta.has(name);
-  }
-  getMeta(name, defaultVal) {
-    return this._meta.get(name) ?? defaultVal;
-  }
-  setMeta(name, value) {
-    this._meta.set(name, value);
-  }
-  deleteMeta(name) {
-    this._meta.delete(name);
-  }
-  clearMeta() {
-    this._meta.clear();
-  }
   canProcess() {
     if (!this._tree)
       return false;
@@ -5826,8 +5877,7 @@ exports.Node = class Node extends CoreObject {
     const canProcess = this.canProcess();
     const childrenInBefore = [];
     const childrenInAfter = [];
-    for (let len = this._children.length, i = 0; i < len; i++) {
-      const child = this._children[i];
+    this._children.internal.forEach((child) => {
       switch (child.processSortMode) {
         case "default":
           childrenInAfter.push(child);
@@ -5836,7 +5886,7 @@ exports.Node = class Node extends CoreObject {
           childrenInBefore.push(child);
           break;
       }
-    }
+    });
     childrenInBefore.forEach((child) => {
       child.emit("process", delta);
     });
@@ -5887,27 +5937,14 @@ exports.Node = class Node extends CoreObject {
     }
   }
   input(event, key) {
-    for (let i = this._children.length - 1; i >= 0; i--) {
-      this._children[i].input(event, key);
-    }
+    this._children.internal.forEach((child) => child.input(event, key));
     this._input(event, key);
   }
-  /** Children */
-  getChildren(includeInternal = false) {
-    switch (includeInternal) {
-      case true:
-        return this._children;
-      case false:
-        return this._children.filter((child) => child.internalMode === "default");
-      default:
-        return this._children.filter((child) => child.internalMode === includeInternal);
-    }
-  }
-  getIndex(includeInternal = false) {
-    return this._parent?.getChildren(includeInternal).indexOf(this) ?? 0;
+  getIndex() {
+    return this._parent?.children.getInternal(this.internalMode).indexOf(this) ?? 0;
   }
   getNode(path) {
-    return this._children.find((child) => child.name === path);
+    return this._children.internal.find((child) => child.name === path);
   }
   removeNode(path) {
     this.getNode(path)?.remove();
@@ -5917,7 +5954,7 @@ exports.Node = class Node extends CoreObject {
       return this;
     }
     sibling.internalMode = this.internalMode;
-    this._parent.moveChild(sibling, this.getIndex(true) + 1);
+    this._parent.moveChild(sibling, this.getIndex() + 1);
     return this;
   }
   prepend(...nodes) {
@@ -5950,7 +5987,7 @@ exports.Node = class Node extends CoreObject {
       _nodes = nodes;
     }
     _nodes.forEach((node) => {
-      this._parent?.moveChild(node, this.getIndex(true));
+      this._parent?.moveChild(node, this.getIndex());
     });
   }
   after(...nodes) {
@@ -5961,128 +5998,83 @@ exports.Node = class Node extends CoreObject {
       _nodes = nodes;
     }
     _nodes.forEach((node) => {
-      this._parent?.moveChild(node, this.getIndex(true) + 1);
+      this._parent?.moveChild(node, this.getIndex() + 1);
     });
   }
   insertBefore(node, child) {
     if (!child.hasParent() || !this.is(child.parent)) {
       return node;
     }
-    this.moveChild(node, child.getIndex(true));
+    this.moveChild(node, child.getIndex());
     return node;
   }
   appendChild(node, internalMode = node.internalMode) {
     if (this.is(node) || node.hasParent()) {
       return node;
     }
-    let index = -1;
     switch (internalMode) {
-      case "default":
-        index = this._children.findLastIndex((node2) => node2.internalMode === "default");
-        if (index > -1) {
-          index += 1;
-        } else {
-          index = this._children.findIndex((node2) => node2.internalMode === "back");
-        }
+      case "front":
+        this._children.front.push(node);
         break;
-      case "front": {
-        index = this._children.findLastIndex((node2) => node2.internalMode === "front");
-        if (index > -1) {
-          index += 1;
-        } else {
-          index = this._children.findIndex((node2) => node2.internalMode === "default");
-        }
-        if (index > -1) {
-          index += 1;
-        } else {
-          index = this._children.findIndex((node2) => node2.internalMode === "back");
-        }
+      case "default":
+        this._children.push(node);
         break;
-      }
       case "back":
-        this._children.push(node);
+        this._children.back.push(node);
         break;
     }
-    if (index > -1) {
-      this._children.splice(index, 0, node);
-    } else {
-      this._children.push(node);
-    }
     node.internalMode = internalMode;
     node.setParent(this);
     this.emit("appendChild", node);
     return node;
   }
-  moveChild(child, toIndex, internalMode = child.internalMode) {
-    if (this.is(child) || child.hasParent() && !this.is(child.parent)) {
+  moveChild(node, toIndex, internalMode = node.internalMode) {
+    if (this.is(node) || node.hasParent() && !this.is(node.parent)) {
       return this;
     }
-    child.internalMode = internalMode;
-    const oldIndex = this._children.indexOf(child);
-    let minIndex = this._children.findIndex((_child) => {
-      switch (internalMode) {
-        case "default":
-          return _child.internalMode !== "front";
-        case "back":
-          return _child.internalMode === "back";
-        case "front":
-        default:
-          return true;
-      }
-    });
-    minIndex = minIndex > -1 ? minIndex : Math.max(0, this._children.length - 1);
-    let maxIndex = this._children.slice(minIndex).findIndex((_child) => {
-      switch (internalMode) {
-        case "front":
-          return _child.internalMode !== "front";
-        case "default":
-          return _child.internalMode === "back";
-        case "back":
-        default:
-          return false;
+    const fromArray = this._children.getInternal(node.internalMode);
+    const fromIndex = fromArray.indexOf(node);
+    const toArray = this._children.getInternal(internalMode);
+    if (node.internalMode !== internalMode || toIndex !== fromIndex) {
+      if (fromIndex > -1) {
+        fromArray.splice(fromIndex, 1);
       }
-    });
-    maxIndex = maxIndex > -1 ? minIndex + maxIndex : Math.max(0, this._children.length);
-    const newIndex = clamp(minIndex, toIndex > -1 ? toIndex : maxIndex, maxIndex);
-    if (newIndex !== oldIndex) {
-      if (oldIndex > -1) {
-        this._children.splice(oldIndex, 1);
-      }
-      child.setParent(this);
-      if (newIndex > -1 && newIndex < this._children.length) {
-        this._children.splice(newIndex, 0, child);
+      node.setParent(this);
+      if (toIndex > -1 && toIndex < toArray.length) {
+        toArray.splice(toIndex, 0, node);
       } else {
-        this._children.push(child);
+        toArray.push(node);
       }
-      if (oldIndex > -1) {
-        this.emit("moveChild", child, newIndex, oldIndex);
+      if (fromIndex > -1) {
+        this.emit("moveChild", node, toIndex, fromIndex);
       } else {
-        this.emit("appendChild", child);
+        this.emit("appendChild", node);
       }
     }
+    node.internalMode = internalMode;
     return this;
   }
   removeChild(child) {
-    const index = child.getIndex(true);
+    const index = child.getIndex();
     if (this.is(child.parent) && index > -1) {
-      this._children.splice(index, 1);
+      this._children.internal.splice(index, 1);
       child.setParent(void 0);
       this.emit("removeChild", child, index);
     }
     return child;
   }
   removeChildren() {
-    this.getChildren().forEach((child) => this.removeChild(child));
+    this._children.forEach((child) => this.removeChild(child));
   }
   remove() {
     this._parent?.removeChild(this);
   }
   forEachChild(callbackfn) {
-    this.getChildren().forEach(callbackfn);
+    this._children.forEach(callbackfn);
     return this;
   }
   forEachDescendant(callbackfn) {
-    this.getChildren().forEach((child) => {
+    this._children.forEach((child) => {
       callbackfn(child);
       child.forEachDescendant(callbackfn);
     });
@@ -6115,18 +6107,14 @@ exports.Node = class Node extends CoreObject {
   clone() {
     return new this.constructor(
       this.toJSON().props,
-      this.getChildren(true)
+      this._children.internal
     );
   }
   toJSON() {
     return {
       tag: this.tag,
-      props: {
-        name: this.name,
-        ...super.toJSON()
-      },
-      meta: Object.fromEntries(this._meta.entries()),
-      children: this.getChildren().map((child) => child.toJSON())
+      props: super.toJSON(),
+      children: [...this._children.map((child) => child.toJSON())]
     };
   }
   static parse(JSON) {
@@ -6141,7 +6129,7 @@ exports.Node = class Node extends CoreObject {
   }
 };
 __decorateClass$R([
-  protectedProperty()
+  property()
 ], exports.Node.prototype, "name", 2);
 __decorateClass$R([
   property()
@@ -6158,6 +6146,9 @@ __decorateClass$R([
 __decorateClass$R([
   property({ default: "default" })
 ], exports.Node.prototype, "internalMode", 2);
+__decorateClass$R([
+  property({ default: {} })
+], exports.Node.prototype, "meta", 2);
 exports.Node = __decorateClass$R([
   customNode("Node")
 ], exports.Node);
@@ -7673,7 +7664,7 @@ class SceneTree extends MainLoop {
   }
   free() {
     super.free();
-    this.root.getChildren(true).forEach((node) => this.root.removeChild(node));
+    this.root.children.internal.forEach((node) => this.root.removeChild(node));
     this.input.removeEventListeners();
   }
 }
@@ -8974,7 +8965,9 @@ class BaseElement2DFill extends CoreObject {
     return super.setProperties(properties);
   }
   setProperties(properties) {
-    return this._setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeFill(properties));
+    return this._setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeFill(properties)
+    );
   }
   _updateProperty(key, value, oldValue, declaration) {
     super._updateProperty(key, value, oldValue, declaration);
@@ -9018,51 +9011,40 @@ class BaseElement2DFill extends CoreObject {
     );
   }
   _getDrawOptions() {
-    let textureTransform;
     let disableWrapMode = false;
-    if (this._texture && this._texture.source instanceof ImageBitmap) {
-      textureTransform = new Transform2D();
-      const { width: imageWidth, height: imageHeight } = this._texture;
-      const { width, height } = this.parent.size;
-      if (this.cropRect) {
-        const {
-          left = 0,
-          top = 0,
-          right = 0,
-          bottom = 0
-        } = this.cropRect;
-        const w = Math.abs(1 + (left + right)) * width;
-        const h = Math.abs(1 + (top + bottom)) * height;
-        const sx = 1 / w;
-        const sy = 1 / h;
-        const tx = left * width * sx;
-        const ty = top * height * sy;
-        textureTransform.scale(sx, sy).translate(tx, ty);
-      }
-      if (this.tile) {
-        const {
-          translateX = 0,
-          translateY = 0,
-          scaleX = 1,
-          scaleY = 1
-          // flip, TODO
-          // alignment, TODO
-        } = this.tile;
-        textureTransform.scale(1 / imageWidth, 1 / imageHeight).scale(1 / scaleX, 1 / scaleY).translate(-translateX / imageWidth, -translateY / imageHeight);
-        disableWrapMode = true;
-      } else if (this.stretchRect) {
-        const { left = 0, top = 0, right = 0, bottom = 0 } = this.stretchRect;
-        const w = Math.abs(1 + (-left + -right)) * width;
-        const h = Math.abs(1 + (-top + -bottom)) * height;
-        const scaleX = 1 / w;
-        const scaleY = 1 / h;
-        const translateX = -left * width * scaleX;
-        const translateY = -top * height * scaleY;
-        textureTransform.scale(scaleX, scaleY).translate(translateX, translateY);
-        disableWrapMode = true;
-      } else {
-        textureTransform.scale(1 / width, 1 / height);
-      }
+    const { width, height } = this.parent.size;
+    const textureTransform = new Transform2D().scale(1 / width, 1 / height);
+    if (this.cropRect) {
+      const {
+        left = 0,
+        top = 0,
+        right = 0,
+        bottom = 0
+      } = this.cropRect;
+      textureTransform.scale(
+        Math.abs(1 - (left + right)),
+        Math.abs(1 - (top + bottom))
+      ).translate(left, top);
+      disableWrapMode = true;
+    }
+    if (this.tile) {
+      const {
+        translateX = 0,
+        translateY = 0,
+        scaleX = 1,
+        scaleY = 1
+        // flip, TODO
+        // alignment, TODO
+      } = this.tile;
+      textureTransform.translate(-translateX / width, -translateY / height).scale(1 / scaleX, 1 / scaleY);
+      disableWrapMode = true;
+    } else if (this.stretchRect) {
+      const { left = 0, top = 0, right = 0, bottom = 0 } = this.stretchRect;
+      textureTransform.scale(
+        Math.abs(1 - (-left + -right)),
+        Math.abs(1 - (-top + -bottom))
+      ).translate(-left, -top);
+      disableWrapMode = true;
     }
     return { disableWrapMode, textureTransform };
   }
@@ -9116,7 +9098,9 @@ var __decorateClass$t = (decorators, target, key, kind) => {
 };
 class BaseElement2DBackground extends BaseElement2DFill {
   setProperties(properties) {
-    return super._setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeBackground(properties));
+    return super._setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeBackground(properties)
+    );
   }
 }
 __decorateClass$t([
@@ -9134,7 +9118,9 @@ var __decorateClass$s = (decorators, target, key, kind) => {
 };
 class BaseElement2DForeground extends BaseElement2DFill {
   setProperties(properties) {
-    return super._setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeForeground(properties));
+    return super._setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeForeground(properties)
+    );
   }
 }
 __decorateClass$s([
@@ -9152,7 +9138,9 @@ var __decorateClass$r = (decorators, target, key, kind) => {
 };
 class BaseElement2DOutline extends BaseElement2DFill {
   setProperties(properties) {
-    return super._setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeOutline(properties));
+    return super._setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeOutline(properties)
+    );
   }
   _updateProperty(key, value, oldValue, declaration) {
     super._updateProperty(key, value, oldValue, declaration);
@@ -9202,7 +9190,9 @@ class BaseElement2DShadow extends CoreObject {
     this.parent = parent;
   }
   setProperties(properties) {
-    return super.setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeShadow(properties));
+    return super.setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeShadow(properties)
+    );
   }
   _updateProperty(key, value, oldValue, declaration) {
     super._updateProperty(key, value, oldValue, declaration);
@@ -9261,7 +9251,9 @@ class BaseElement2DShape extends CoreObject {
   }
   _path2DSet = new modernPath2d.Path2DSet();
   setProperties(properties) {
-    return super.setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeShape(properties));
+    return super.setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeShape(properties)
+    );
   }
   _updateProperty(key, value, oldValue, declaration) {
     super._updateProperty(key, value, oldValue, declaration);
@@ -9370,7 +9362,9 @@ class BaseElement2DText extends CoreObject {
   baseText = new modernText.Text();
   measureResult;
   setProperties(properties) {
-    return super.setProperties(modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeText(properties));
+    return super.setProperties(
+      modernIdoc.isNone(properties) ? void 0 : modernIdoc.normalizeText(properties)
+    );
   }
   _updateProperty(key, value, oldValue, declaration) {
     super._updateProperty(key, value, oldValue, declaration);
@@ -9555,49 +9549,49 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
     return this._background;
   }
   set background(value) {
-    this._background.setProperties(value);
+    this._background.resetProperties().setProperties(value);
   }
   _shape = new BaseElement2DShape(this);
   get shape() {
     return this._shape;
   }
   set shape(value) {
-    this._shape.setProperties(value);
+    this._shape.resetProperties().setProperties(value);
   }
   _fill = new BaseElement2DFill(this);
   get fill() {
     return this._fill;
   }
   set fill(value) {
-    this._fill.setProperties(value);
+    this._fill.resetProperties().setProperties(value);
   }
   _outline = new BaseElement2DOutline(this);
   get outline() {
     return this._outline;
   }
   set outline(value) {
-    this._outline.setProperties(value);
+    this._outline.resetProperties().setProperties(value);
   }
   _foreground = new BaseElement2DForeground(this);
   get foreground() {
     return this._foreground;
   }
   set foreground(value) {
-    this._foreground.setProperties(value);
+    this._foreground.resetProperties().setProperties(value);
   }
   _text = new BaseElement2DText(this);
   get text() {
     return this._text;
   }
   set text(value) {
-    this._text.setProperties(value);
+    this._text.resetProperties().setProperties(value);
   }
   _shadow = new BaseElement2DShadow(this);
   get shadow() {
     return this._shadow;
   }
   set shadow(value) {
-    this._shadow.setProperties(value);
+    this._shadow.resetProperties().setProperties(value);
   }
   constructor(properties, nodes = []) {
     super();
@@ -10707,7 +10701,7 @@ exports.Text2D = class Text2D extends TextureRect2D {
     }
   }
   _getSubTexts() {
-    return this.getChildren("front").filter((node) => node instanceof exports.Text2D);
+    return this.children.front.filter((node) => node instanceof exports.Text2D);
   }
   _updateSubTexts() {
     const subTexts = this._getSubTexts();
@@ -10743,7 +10737,7 @@ exports.Text2D = class Text2D extends TextureRect2D {
   }
   _updateSplit() {
     if (this._subTextsCount) {
-      this.getChildren("front").forEach((child) => this.removeChild(child));
+      this.children.front.forEach((child) => this.removeChild(child));
       this._subTextsCount = 0;
     }
     if (this.split) {
@@ -10777,7 +10771,7 @@ exports.Text2D = class Text2D extends TextureRect2D {
   }
   _drawContent() {
     if (!this.split) {
-      const onText2DRender = this.getChildren()?.find((child) => "onText2DRender" in child)?.onText2DRender;
+      const onText2DRender = this.children?.find((child) => "onText2DRender" in child)?.onText2DRender;
       if (onText2DRender) {
         onText2DRender();
       } else {
@@ -11036,7 +11030,7 @@ exports.Animation = class Animation extends exports.TimelineNode {
     let targets;
     switch (this.effectMode) {
       case "sibling":
-        targets = this.getParent()?.getChildren(true).filter((val) => val instanceof exports.CanvasItem) ?? [];
+        targets = this.getParent()?.children.internal.filter((val) => val instanceof exports.CanvasItem) ?? [];
         break;
       case "parent":
       default: