modern-canvas 0.14.9 → 0.14.10

package/dist/index.js

@@ -1,4 +1,4 @@
-import { defineProperty as rs, Observable as ue, Reactivable as ss, parseColor as ni, property as h, isGradient as li, isColorFillObject as kr, clearUndef as is, idGenerator as as, normalizeFill as ci, isNone as V, normalizeBackground as hi, normalizeForeground as ui, normalizeOutline as di, normalizeShadow as fi, normalizeShape as pi, getDefaultStyle as _i, normalizeText as mi, normalizeTextContent as gi, getDefaultTextStyle as vi, getDefaultLayoutStyle as bi, RawWeakMap as yi } from "modern-idoc";
+import { defineProperty as rs, Observable as de, Reactivable as ss, parseColor as ni, property as h, isGradient as li, isColorFillObject as kr, clearUndef as is, idGenerator as as, normalizeFill as ci, isNone as V, normalizeBackground as hi, normalizeForeground as ui, normalizeOutline as di, normalizeShadow as fi, normalizeShape as pi, getDefaultStyle as _i, normalizeText as mi, normalizeTextContent as gi, getDefaultTextStyle as vi, getDefaultLayoutStyle as bi, RawWeakMap as yi } from "modern-idoc";
 import { fonts as xi } from "modern-font";
 import { extend as wi } from "colord";
 import Pi from "colord/plugins/names";
@@ -342,7 +342,7 @@ const Zi = {
   touchmove: "pointermove",
   touchcancel: "pointercancel"
 };
-class Ji extends ue {
+class Ji extends de {
   /**
    * Current event
    */
@@ -516,10 +516,10 @@ class Pe extends ss {
 class Qi extends Pe {
   //
 }
-class de extends Qi {
+class fe extends Qi {
   //
 }
-class ne extends ue {
+class le extends de {
   constructor(e, t, s) {
     super(), this.rows = e, this.cols = t, s ? this.set(s) : this.identity();
   }
@@ -531,9 +531,9 @@ class ne extends ue {
   operate(e, t, s) {
     const { cols: i, rows: a, length: o, _array: n } = this;
     let l;
-    typeof t == "number" ? l = Array.from({ length: o }, () => t) : t instanceof Q || t instanceof ne ? l = t.toArray() : l = t;
+    typeof t == "number" ? l = Array.from({ length: o }, () => t) : t instanceof Q || t instanceof le ? l = t.toArray() : l = t;
     let c, u = [];
-    if (s ? s instanceof Q || s instanceof ne ? c = s : u = s : t instanceof Q ? c = new t.constructor() : c = this, t instanceof Q) {
+    if (s ? s instanceof Q || s instanceof le ? c = s : u = s : t instanceof Q ? c = new t.constructor() : c = this, t instanceof Q) {
       const { dim: d } = t;
       switch (e) {
         case "*":
@@ -618,7 +618,7 @@ class ne extends ue {
     return this._array.slice();
   }
 }
-class Q extends ue {
+class Q extends de {
   constructor(e) {
     super(), this.dim = e;
   }
@@ -629,9 +629,9 @@ class Q extends ue {
   operate(e, t, s) {
     const { dim: i, _array: a } = this;
     let o;
-    typeof t == "number" ? o = Array.from({ length: i }, () => t) : t instanceof ne || t instanceof Q ? o = t.toArray() : o = t;
+    typeof t == "number" ? o = Array.from({ length: i }, () => t) : t instanceof le || t instanceof Q ? o = t.toArray() : o = t;
     let n, l = [];
-    if (s ? s instanceof Q ? n = s : l = s : n = this, t instanceof ne) {
+    if (s ? s instanceof Q ? n = s : l = s : n = this, t instanceof le) {
       const { cols: c } = t;
       switch (e) {
         case "*":
@@ -929,7 +929,7 @@ class ee {
   }
 }
 wi([Pi]);
-class oe {
+class ne {
   get value() {
     return this._value;
   }
@@ -1005,13 +1005,13 @@ class oe {
     return [this.r, this.g, this.b, this.a];
   }
 }
-class ea extends ne {
+class ea extends le {
   constructor(e) {
     super(4, 4, e);
   }
 }
 const ar = pr / 180, dc = 180 / pr;
-function le(r, e, t) {
+function ce(r, e, t) {
   return Math.max(e, Math.min(r, t));
 }
 function A(r, e, t) {
@@ -1035,7 +1035,7 @@ class ta extends Q {
     super(4), this.set(e, t, s, i);
   }
 }
-class ps extends ne {
+class ps extends le {
   constructor(e) {
     super(4, 5, e);
   }
@@ -1165,7 +1165,7 @@ class ps extends ne {
     ]);
   }
   sepia(e = 1) {
-    const t = le(e, 0, 1);
+    const t = ce(e, 0, 1);
     return this.multiply([
       A(1, 0.393, t),
       A(0, 0.7689999, t),
@@ -1214,7 +1214,7 @@ class ps extends ne {
     ]);
   }
   grayscale(e = 1) {
-    const t = le(e, 0, 1), s = A(1, 0.3, t), i = A(0, 0.3, t), a = A(1, 0.59, t), o = A(0, 0.59, t), n = A(1, 0.11, t), l = A(0, 0.11, t);
+    const t = ce(e, 0, 1), s = A(1, 0.3, t), i = A(0, 0.3, t), a = A(1, 0.59, t), o = A(0, 0.59, t), n = A(1, 0.11, t), l = A(0, 0.11, t);
     return this.multiply([
       s,
       o,
@@ -1293,12 +1293,12 @@ class ps extends ne {
     return new ta(e[4] / 255, e[9] / 255, e[14] / 255, e[19] / 255);
   }
 }
-class pc extends ne {
+class pc extends le {
   constructor(e) {
     super(2, 2, e);
   }
 }
-class _s extends ne {
+class _s extends le {
   constructor(e) {
     super(3, 3, e);
   }
@@ -1428,8 +1428,8 @@ class ra extends _s {
     ]);
   }
 }
-class I extends _s {
-  static _t2d = /* @__PURE__ */ new I();
+class M extends _s {
+  static _t2d = /* @__PURE__ */ new M();
   premultiply(e) {
     return e.multiply(this, this);
   }
@@ -1440,7 +1440,7 @@ class I extends _s {
     return this.skew(0, e);
   }
   skew(e, t) {
-    return this.premultiply(I._t2d.makeSkew(e, t));
+    return this.premultiply(M._t2d.makeSkew(e, t));
   }
   makeSkew(e, t) {
     const s = Math.tan(e), i = Math.tan(t);
@@ -1469,7 +1469,7 @@ class I extends _s {
     return this.translate(e, t, s);
   }
   translate(e, t, s = 0) {
-    return this.premultiply(I._t2d.makeTranslation(e, t, s));
+    return this.premultiply(M._t2d.makeTranslation(e, t, s));
   }
   makeTranslation(e, t, s = 0) {
     return this.set([
@@ -1494,7 +1494,7 @@ class I extends _s {
     return this.scale(e, t, s);
   }
   scale(e, t, s = 1) {
-    return this.premultiply(I._t2d.makeScale(e, t, s));
+    return this.premultiply(M._t2d.makeScale(e, t, s));
   }
   makeScale(e, t, s = 1) {
     return this.set([
@@ -1519,7 +1519,7 @@ class I extends _s {
     return this.rotate(e);
   }
   rotate(e) {
-    return this.premultiply(I._t2d.makeRotation(e));
+    return this.premultiply(M._t2d.makeRotation(e));
   }
   rotate3d(e, t, s, i) {
     const [a, o, n] = this._rotate3d(e, t, s, i);
@@ -1681,7 +1681,7 @@ function oa(r, e) {
   let t = Fr[r];
   return t === void 0 && (Jt[e] === void 0 && (Jt[e] = 1), Fr[r] = t = Jt[e]++), t;
 }
-class W extends ue {
+class W extends de {
   get _gl() {
     return this._renderer.gl;
   }
@@ -3774,7 +3774,7 @@ var qa = Object.defineProperty, ys = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && qa(e, t, i), i;
 };
-class We extends de {
+class We extends fe {
   constructor(e) {
     super(), this.setProperties(e);
   }
@@ -3790,7 +3790,7 @@ var Ya = Object.defineProperty, Gt = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && Ya(e, t, i), i;
 };
-class ke extends de {
+class ke extends fe {
   constructor(e = {}) {
     super(), this.setProperties(e);
   }
@@ -3815,7 +3815,7 @@ var Ka = Object.defineProperty, xs = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && Ka(e, t, i), i;
 };
-class xe extends de {
+class xe extends fe {
   constructor(e) {
     super(), this.setProperties(e);
   }
@@ -3831,7 +3831,7 @@ var Za = Object.defineProperty, Ue = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && Za(e, t, i), i;
 };
-class H extends de {
+class H extends fe {
   constructor(e) {
     super(), this.setProperties(e);
   }
@@ -3887,7 +3887,7 @@ function eo() {
     tint: new Float32Array([1, 1, 1, 1])
   };
 }
-class E extends de {
+class E extends fe {
   static instance = new this();
   glProgram;
   constructor(e = {}) {
@@ -4075,7 +4075,7 @@ var io = Object.defineProperty, Ee = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && io(e, t, i), i;
 };
-class re extends de {
+class re extends fe {
   get valid() {
     return !!(this.width && this.height);
   }
@@ -4115,7 +4115,7 @@ var ao = Object.defineProperty, N = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && ao(e, t, i), i;
 };
-class x extends de {
+class x extends fe {
   static get EMPTY() {
     return new this({ width: 1, height: 1 });
   }
@@ -4230,7 +4230,7 @@ N([
 N([
   h({ fallback: !1 })
 ], x.prototype, "isPowerOfTwo");
-class oo extends de {
+class oo extends fe {
   frames;
   frameIndex = 0;
   get currentFrame() {
@@ -4280,12 +4280,12 @@ class ws extends x {
 class vr extends x {
   static _cached = /* @__PURE__ */ new Map();
   static get(e) {
-    const t = new oe(e), s = t.toHex();
+    const t = new ne(e), s = t.toHex();
     let i = this._cached.get(s);
     return i || (i = new vr(t), this._cached.set(s, i)), i;
   }
   constructor(e) {
-    const t = e instanceof oe ? e : new oe(e);
+    const t = e instanceof ne ? e : new ne(e);
     super({
       width: 1,
       height: 1,
@@ -4641,7 +4641,7 @@ class po extends Pe {
     return { internalKey: `____${e}` };
   }
 }
-var _o = Object.defineProperty, mo = Object.getOwnPropertyDescriptor, fe = (r, e, t, s) => {
+var _o = Object.defineProperty, mo = Object.getOwnPropertyDescriptor, ie = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? mo(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && _o(e, t, i), i;
@@ -4651,7 +4651,7 @@ function go(r) {
   let e = jr[r] ?? 0;
   return e++, jr[r] = e, e;
 }
-let M = class extends Pe {
+let I = class extends Pe {
   _meta = new po(this);
   get meta() {
     return this._meta;
@@ -4851,6 +4851,16 @@ let M = class extends Pe {
       n.emit("process", r);
     }), t && (e.renderStack.currentCall = o), s && (this.emit("processed", r), e?.emit("nodeProcessed", this));
   }
+  requestRender() {
+    this.needsRender = !0;
+  }
+  _updateProperty(r, e, t) {
+    switch (super._updateProperty(r, e, t), r) {
+      case "needsRender":
+        e && this._parent?.requestRender();
+        break;
+    }
+  }
   render(r, e) {
     const t = this.mask;
     t && (r.flush(), r.mask.push(this, t)), this._render(r), e?.(), t && (r.flush(), r.mask.pop(this));
@@ -4873,7 +4883,7 @@ let M = class extends Pe {
     this.getNode(r)?.remove();
   }
   addSibling(r) {
-    return this.equal(r) || !this.hasParent() || r.hasParent() ? this : (r.internalMode = this.internalMode, this._parent.moveChild(r, this.getIndex() + 1), this);
+    return this.equal(r) || !this.hasParent() ? this : (r.internalMode = this.internalMode, this._parent.moveChild(r, this.getIndex() + 1), this);
   }
   prepend(...r) {
     let e;
@@ -4884,7 +4894,7 @@ let M = class extends Pe {
   append(...r) {
     let e;
     Array.isArray(r[0]) ? e = r[0] : e = r, e.forEach((t) => {
-      t instanceof M ? this.appendChild(t) : this.appendChild(M.parse(t));
+      t instanceof I ? this.appendChild(t) : this.appendChild(I.parse(t));
     });
   }
   before(...r) {
@@ -4903,9 +4913,9 @@ let M = class extends Pe {
     return !e.hasParent() || !this.equal(e.parent) || this.moveChild(r, e.getIndex()), r;
   }
   appendChild(r, e = r.internalMode) {
-    if (this.equal(r) || r.hasParent())
+    if (this.equal(r))
       return r;
-    switch (e) {
+    switch (r.hasParent() && r.remove(), e) {
       case "front":
         this._children.front.push(r);
         break;
@@ -4919,8 +4929,9 @@ let M = class extends Pe {
     return r.internalMode !== e && (r.internalMode = e), r.setParent(this), this.emit("appendChild", r), r;
   }
   moveChild(r, e, t = r.internalMode) {
-    if (this.equal(r) || r.hasParent() && !this.equal(r.parent))
+    if (this.equal(r))
       return this;
+    r.hasParent() && !this.equal(r.parent) && r.remove();
     const s = this._children.getInternal(r.internalMode), i = s.indexOf(r), a = this._children.getInternal(t);
     return (r.internalMode !== t || e !== i) && (i > -1 && s.splice(i, 1), r.setParent(this), e > -1 && e < a.length ? a.splice(e, 0, r) : a.push(r), i > -1 ? this.emit("moveChild", r, e, i) : this.emit("appendChild", r)), r.internalMode !== t && (r.internalMode = t), this;
   }
@@ -4982,6 +4993,7 @@ let M = class extends Pe {
   }
   // eslint-disable-next-line unused-imports/no-unused-vars
   _render(r) {
+    this.needsRender = !1;
   }
   destroy() {
     super.destroy(), this._children.internal.forEach((r) => this.removeChild(r));
@@ -5000,46 +5012,49 @@ let M = class extends Pe {
       meta: this.meta.toJSON()
     });
   }
-  static parse(r) {
+  static parse(r, e = "Node") {
     if (Array.isArray(r))
-      return r.map((n) => this.parse(n));
-    const { is: e, meta: t = {}, children: s, ...i } = r, a = fr.get(e ?? t.inCanvasIs ?? "Node") ?? M, o = new a({ ...i, meta: t });
-    return s?.forEach((n) => o.appendChild(this.parse(n))), o;
+      return r.map((l) => this.parse(l));
+    const { is: t, meta: s = {}, children: i, ...a } = r, o = fr.get(t ?? s.inCanvasIs ?? e) ?? I, n = new o({ ...a, meta: s });
+    return i?.forEach((l) => n.appendChild(this.parse(l))), n;
   }
 };
-fe([
+ie([
   h({ fallback: as() })
-], M.prototype, "id", 2);
-fe([
+], I.prototype, "id", 2);
+ie([
   h({ fallback: as() })
-], M.prototype, "name", 2);
-fe([
+], I.prototype, "name", 2);
+ie([
   h({ fallback: "inherit" })
-], M.prototype, "processMode", 2);
-fe([
+], I.prototype, "processMode", 2);
+ie([
   h({ fallback: "default" })
-], M.prototype, "processSortMode", 2);
-fe([
+], I.prototype, "processSortMode", 2);
+ie([
   h({ fallback: "inherit" })
-], M.prototype, "renderMode", 2);
-fe([
+], I.prototype, "renderMode", 2);
+ie([
   h({ fallback: "inherit" })
-], M.prototype, "inputMode", 2);
-fe([
+], I.prototype, "inputMode", 2);
+ie([
   h({ fallback: "default" })
-], M.prototype, "internalMode", 2);
-fe([
+], I.prototype, "internalMode", 2);
+ie([
   h({ internal: !0 })
-], M.prototype, "mask", 2);
-M = fe([
+], I.prototype, "mask", 2);
+ie([
+  h({ internal: !0, default: !0 })
+], I.prototype, "needsRender", 2);
+I = ie([
   b("Node")
-], M);
+], I);
 var vo = Object.defineProperty, bo = Object.getOwnPropertyDescriptor, qe = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? bo(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && vo(e, t, i), i;
 };
-let q = class extends M {
+let q = class extends I {
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -5057,7 +5072,7 @@ let q = class extends M {
     return this._parent?.globalStartTime ?? 0;
   }
   get currentTime() {
-    return le(this._currentTime, 0, this._duration);
+    return ce(this._currentTime, 0, this._duration);
   }
   get globalStartTime() {
     return this._globalStartTime;
@@ -5069,7 +5084,7 @@ let q = class extends M {
     return this._globalStartTime + this._duration;
   }
   get currentTimeProgress() {
-    return this._duration ? le(this._currentTime / this._duration, 0, 1) : 0;
+    return this._duration ? ce(this._currentTime / this._duration, 0, 1) : 0;
   }
   isInsideTimeRange() {
     const r = this._currentTime;
@@ -5123,10 +5138,10 @@ let Ge = class extends q {
   // Batch render
   context = new uo();
   _resetContext = !0;
-  needsRender = !0;
+  needsDraw = !0;
   needsLayout = !1;
   needsPaint = !1;
-  _rawBatchables = [];
+  _drawBatchables = [];
   _layoutBatchables = [];
   _batchables = [];
   constructor(r, e = []) {
@@ -5158,21 +5173,21 @@ let Ge = class extends q {
   canRender() {
     return super.canRender() && this.isVisibleInTree();
   }
-  requestRender() {
-    this.needsRender = !0;
+  requestDraw() {
+    this.needsDraw = !0, this.requestRender();
   }
   requestLayout() {
-    this.needsLayout = !0;
+    this.needsLayout = !0, this.requestRender();
   }
   requestPaint() {
-    this.needsPaint = !0;
+    this.needsPaint = !0, this.requestRender();
   }
   _updateGlobalVisible() {
     this._parentGlobalVisible = this.getParent()?.globalVisible, this._globalVisible = (this._parentGlobalVisible ?? !0) && this.visible && this.insideTimeRange;
   }
   _updateGlobalOpacity() {
     this._parentGlobalOpacity = this.getParent()?.opacity;
-    const r = le(this.opacity, 0, 1) * (this._parentGlobalOpacity ?? 1);
+    const r = ce(this.opacity, 0, 1) * (this._parentGlobalOpacity ?? 1);
     this._globalOpacity !== r && (this._globalOpacity = r, this.requestPaint());
   }
   _draw() {
@@ -5210,14 +5225,17 @@ let Ge = class extends q {
     this._parentGlobalVisible !== e?.globalVisible && this._updateGlobalVisible(), this._parentGlobalOpacity !== e?.globalOpacity && this._updateGlobalOpacity();
   }
   _updateBatchables() {
-    const r = this.needsRender;
+    if (!this.needsRender)
+      return;
+    this.needsRender = !1;
+    const r = this.needsDraw;
     let e = this.needsLayout, t = this.needsPaint, s;
-    r && (this._rawBatchables = this._redraw(), e = !0), e && (this._layoutBatchables = this._relayout(this._rawBatchables), t = !0), t && (s = this._repaint(this._layoutBatchables)), r && this._resetContext && this.context.reset(), s && (this._batchables = s, this.needsRender = !1, this.needsLayout = !1, this.needsPaint = !1);
+    r && (this._drawBatchables = this._redraw(), e = !0), e && (this._layoutBatchables = this._relayout(this._drawBatchables), t = !0), t && (s = this._repaint(this._layoutBatchables)), r && this._resetContext && this.context.reset(), s && (this._batchables = s, this.needsDraw = !1, this.needsLayout = !1, this.needsPaint = !1);
   }
   _handleViewportTexture(r) {
     const e = this.tree?.getPreviousViewport();
     if (e && "getRect" in this) {
-      const { a: t, d: s, tx: i, ty: a } = e.canvasTransform.toObject(), { vertices: o } = r, n = new I().scale(1 / e.width * t, -1 / e.height * s).translate(
+      const { a: t, d: s, tx: i, ty: a } = e.canvasTransform.toObject(), { vertices: o } = r, n = new M().scale(1 / e.width * t, -1 / e.height * s).translate(
         - -i / e.width,
         1 + -a / e.height
       ), l = new Float32Array(o.length);
@@ -5259,8 +5277,8 @@ var wo = Object.defineProperty, Po = Object.getOwnPropertyDescriptor, Be = (r, e
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && wo(e, t, i), i;
 };
-let X = class extends M {
-  canvasTransform = new I();
+let X = class extends I {
+  canvasTransform = new M();
   renderTargetIndex = 0;
   renderTargets = [
     new re(),
@@ -5363,7 +5381,6 @@ var Eo = Object.defineProperty, So = Object.getOwnPropertyDescriptor, _t = (r, e
 };
 let T = class extends q {
   material;
-  needsRender = !0;
   get _effectMode() {
     return this.effectMode ?? "parent";
   }
@@ -5380,9 +5397,6 @@ let T = class extends q {
   constructor(r, e = []) {
     super(), this._onProcessing = this._onProcessing.bind(this), this._onNodeProcessed = this._onNodeProcessed.bind(this), this.setProperties(r).append(e);
   }
-  requestRender() {
-    this.needsRender = !0;
-  }
   _updateProperty(r, e, t) {
     switch (super._updateProperty(r, e, t), r) {
       case "glsl": {
@@ -5610,10 +5624,10 @@ var Ro = Object.defineProperty, Ao = Object.getOwnPropertyDescriptor, Ye = (r, e
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && Ro(e, t, i), i;
 };
-let ce = class extends M {
+let he = class extends I {
   static from(r, e = !1) {
     const [t, s] = r ? Array.isArray(r) ? r : [0, r] : [];
-    return new ce({
+    return new he({
       startTime: t,
       endTime: s,
       loop: e
@@ -5635,7 +5649,7 @@ let ce = class extends M {
   addTime(r) {
     const e = this.startTime, t = this.endTime;
     let s = this.currentTime;
-    return s = s + r, this.loop && s > t && (s = e + s % t), s = le(s, e, t), this.currentTime = s, this.emit("updateCurrentTime", s, r), this;
+    return s = s + r, this.loop && s > t && (s = e + s % t), s = ce(s, e, t), this.currentTime = s, this.emit("updateCurrentTime", s, r), this;
   }
   _process(r) {
     super._process(r), this.paused || this.addTime(r);
@@ -5643,22 +5657,22 @@ let ce = class extends M {
 };
 Ye([
   h({ fallback: 0 })
-], ce.prototype, "startTime", 2);
+], he.prototype, "startTime", 2);
 Ye([
   h({ fallback: 0 })
-], ce.prototype, "currentTime", 2);
+], he.prototype, "currentTime", 2);
 Ye([
   h({ fallback: Number.MAX_SAFE_INTEGER })
-], ce.prototype, "endTime", 2);
+], he.prototype, "endTime", 2);
 Ye([
   h({ fallback: !1 })
-], ce.prototype, "loop", 2);
+], he.prototype, "loop", 2);
 Ye([
   h({ fallback: !1 })
-], ce.prototype, "paused", 2);
-ce = Ye([
+], he.prototype, "paused", 2);
+he = Ye([
   b("Timeline")
-], ce);
+], he);
 var Co = Object.getOwnPropertyDescriptor, Oo = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? Co(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = o(i) || i);
@@ -5687,7 +5701,7 @@ class pe extends mr {
   input = new Ji();
   renderStack = new To();
   root = new nr().setTree(this);
-  _backgroundColor = new oe();
+  _backgroundColor = new ne();
   _previousViewport;
   _currentViewport;
   getPreviousViewport() {
@@ -5752,7 +5766,7 @@ Se([
   h({ internal: !0, default: () => xi })
 ], pe.prototype, "fonts");
 Se([
-  h({ internal: !0, default: () => new ce() })
+  h({ internal: !0, default: () => new he() })
 ], pe.prototype, "timeline");
 var Io = Object.getOwnPropertyDescriptor, Mo = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? Io(e, t) : e, a = r.length - 1, o; a >= 0; a--)
@@ -5781,12 +5795,12 @@ let De = class extends Ge {
   scale = new C(1, 1).on("update", () => this.updateGlobalTransform());
   skew = new C().on("update", () => this.updateGlobalTransform());
   pivot = new C().on("update", () => this.updateGlobalTransform());
-  extraTransform = new I();
-  transform = new I();
+  extraTransform = new M();
+  transform = new M();
   globalPosition = new C();
   globalScale = new C();
   globalSkew = new C();
-  globalTransform = new I();
+  globalTransform = new M();
   _parentTransformDirtyId;
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
@@ -5858,7 +5872,7 @@ var Uo = Object.defineProperty, Bo = Object.getOwnPropertyDescriptor, wr = (r, e
   return s && i && Uo(e, t, i), i;
 };
 let Mt = class extends De {
-  canvasTransform = new I();
+  canvasTransform = new M();
   _screenOffset = { x: 0, y: 0 };
   _zoom = new C(1, 1).on("update", () => this.updateTransform());
   get zoom() {
@@ -5904,8 +5918,8 @@ let Mt = class extends De {
   }
   setZoom(r, e = r) {
     return this._zoom.set(
-      le(r, this._minZoom.x, this._maxZoom.x),
-      le(e, this._minZoom.y, this._maxZoom.y)
+      ce(r, this._minZoom.x, this._maxZoom.x),
+      ce(e, this._minZoom.y, this._maxZoom.y)
     ), this;
   }
   _input(r, e) {
@@ -6033,7 +6047,7 @@ function vc(r) {
   }
   return e;
 }
-function Lo(r, e, t, s = new I()) {
+function Lo(r, e, t, s = new M()) {
   return r = !r || r === "none" ? "" : r, Ft(r, { width: e, height: t }).reverse().forEach(({ name: i, args: a }) => {
     const o = a.map((n) => n.normalizedIntValue);
     switch (i) {
@@ -6307,7 +6321,7 @@ var As = Object.defineProperty, jo = Object.getOwnPropertyDescriptor, Wo = (r, e
 }, qo = (r, e, t) => Wo(r, e + "", t);
 const ot = 50;
 let He = class extends T {
-  _color = new oe();
+  _color = new ne();
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -6391,7 +6405,7 @@ var Cs = Object.defineProperty, Yo = Object.getOwnPropertyDescriptor, Ko = (r, e
   return s && i && Cs(e, t, i), i;
 }, Zo = (r, e, t) => Ko(r, e + "", t);
 let Xe = class extends T {
-  _color = new oe();
+  _color = new ne();
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -6461,7 +6475,7 @@ var Os = Object.defineProperty, Jo = Object.getOwnPropertyDescriptor, Qo = (r, e
 }, en = (r, e, t) => Qo(r, e + "", t);
 const st = 50;
 let je = class extends T {
-  _color = new oe();
+  _color = new ne();
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -6832,7 +6846,7 @@ void main(void) {
     gl_FragColor += texture2D(sampler, vUv[8]) * 0.028532;
   }
 }`;
-let he = class extends T {
+let ue = class extends T {
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -6840,21 +6854,21 @@ let he = class extends T {
     const t = 1 / e.width, s = 1 / e.height, i = Math.max(this.quality, 1);
     for (let a = 0; a < i; a++)
       e.redraw(r, () => {
-        P.draw(r, he.materialX, {
+        P.draw(r, ue.materialX, {
           sampler: 0,
           uStrength: t * (this.strength / i)
         });
       });
     for (let a = 0; a < i; a++)
       e.redraw(r, () => {
-        P.draw(r, he.materialY, {
+        P.draw(r, ue.materialY, {
           sampler: 0,
           uStrength: s * (this.strength / i)
         });
       });
   }
 };
-Ms(he, "materialX", new E({
+Ms(ue, "materialX", new E({
   gl: {
     vertex: `attribute vec2 position;
 attribute vec2 uv;
@@ -6876,7 +6890,7 @@ void main(void) {
     fragment: Ns
   }
 }));
-Ms(he, "materialY", new E({
+Ms(ue, "materialY", new E({
   gl: {
     vertex: `attribute vec2 position;
 attribute vec2 uv;
@@ -6900,22 +6914,22 @@ void main(void) {
 }));
 Tr([
   h({ fallback: 4 })
-], he.prototype, "strength", 2);
+], ue.prototype, "strength", 2);
 Tr([
   h({ fallback: 3 })
-], he.prototype, "quality", 2);
-he = Tr([
+], ue.prototype, "quality", 2);
+ue = Tr([
   b("GaussianBlurEffect")
-], he);
+], ue);
 var ks = Object.defineProperty, ln = Object.getOwnPropertyDescriptor, cn = (r, e, t) => e in r ? ks(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, Ke = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? ln(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && ks(e, t, i), i;
 }, hn = (r, e, t) => cn(r, e + "", t);
 let se = class extends T {
-  blurEffect = new he();
+  blurEffect = new ue();
   viewport3 = new X();
-  _color = new oe();
+  _color = new ne();
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e);
   }
@@ -7034,7 +7048,7 @@ Bs([
 ct = Bs([
   b("EmbossEffect")
 ], ct);
-var Ls = Object.defineProperty, pn = Object.getOwnPropertyDescriptor, _n = (r, e, t) => e in r ? Ls(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, ie = (r, e, t, s) => {
+var Ls = Object.defineProperty, pn = Object.getOwnPropertyDescriptor, _n = (r, e, t) => e in r ? Ls(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, ae = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? pn(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
   return s && i && Ls(e, t, i), i;
@@ -7187,34 +7201,34 @@ void main(void) {
 }`
   }
 }));
-ie([
+ae([
   h({ fallback: 10 })
 ], G.prototype, "slices", 2);
-ie([
+ae([
   h({ fallback: 512 })
 ], G.prototype, "sampleSize", 2);
-ie([
+ae([
   h({ fallback: 100 })
 ], G.prototype, "offset", 2);
-ie([
+ae([
   h({ fallback: 0 })
 ], G.prototype, "direction", 2);
-ie([
+ae([
   h({ fallback: 2 })
 ], G.prototype, "fillMode", 2);
-ie([
+ae([
   h({ fallback: 0 })
 ], G.prototype, "seed", 2);
-ie([
+ae([
   h({ default: () => [2, 2] })
 ], G.prototype, "red", 2);
-ie([
+ae([
   h({ default: () => [-10, 4] })
 ], G.prototype, "green", 2);
-ie([
+ae([
   h({ default: () => [10, -4] })
 ], G.prototype, "blue", 2);
-G = ie([
+G = ae([
   b("GlitchEffect")
 ], G);
 var Fs = Object.defineProperty, gn = Object.getOwnPropertyDescriptor, vn = (r, e, t) => e in r ? Fs(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, Re = (r, e, t, s) => {
@@ -7633,7 +7647,7 @@ let L = class extends T {
       )).toFixed(7)
     );
   }
-  _color = new oe();
+  _color = new ne();
   constructor(r, e = []) {
     super(), this.setProperties(r).append(e), this.material = new E({
       gl: {
@@ -8157,7 +8171,7 @@ class Ar {
 function Nt(r, e) {
   const { x: t, y: s, width: i, height: a } = e;
   let o = !1;
-  const n = new I().translate(-t, -s).scale(1 / i, 1 / a);
+  const n = new M().translate(-t, -s).scale(1 / i, 1 / a);
   if (r.cropRect) {
     const {
       left: g = 0,
@@ -8229,7 +8243,7 @@ class F extends Pe {
       case "tile":
       case "opacity":
       case "enabled":
-        this.parent.requestRender();
+        this.parent.requestDraw();
         break;
       case "image":
       case "linearGradient":
@@ -8257,7 +8271,7 @@ class F extends Pe {
     }
   }
   async _updateTexture() {
-    await this.loadTexture(), this.parent.requestRender();
+    await this.loadTexture(), this.parent.requestDraw();
   }
   isValid() {
     return !!(this.enabled && (this.texture || this.animatedTexture || this.color || this.image === "viewport"));
@@ -8291,7 +8305,7 @@ class F extends Pe {
         i = o;
         break;
       }
-    return this.animatedTexture.frameIndex !== i && (this.animatedTexture.frameIndex = i, this.parent.requestRender()), this;
+    return this.animatedTexture.frameIndex !== i && (this.animatedTexture.frameIndex = i, this.parent.requestDraw()), this;
   }
   process(e) {
     this.updateFrameIndex();
@@ -8344,7 +8358,7 @@ class js extends F {
   _updateProperty(e, t, s) {
     switch (super._updateProperty(e, t, s), e) {
       case "fillWithShape":
-        this.parent.requestRender();
+        this.parent.requestDraw();
         break;
     }
   }
@@ -8366,7 +8380,7 @@ class Ws extends F {
   _updateProperty(e, t, s) {
     switch (super._updateProperty(e, t, s), e) {
       case "fillWithShape":
-        this.parent.requestRender();
+        this.parent.requestDraw();
         break;
     }
   }
@@ -8392,7 +8406,7 @@ class Ze extends F {
       case "lineCap":
       case "lineJoin":
       case "enabled":
-        this.parent.requestRender();
+        this.parent.requestDraw();
         break;
     }
   }
@@ -8487,7 +8501,7 @@ class Qe extends Pe {
       case "paths":
       case "viewBox":
       case "enabled":
-        this._updatePath2DSet(), this.parent.requestRender();
+        this._updatePath2DSet(), this.parent.requestDraw();
         break;
     }
   }
@@ -8539,7 +8553,7 @@ bt([
 bt([
   h()
 ], Qe.prototype, "paths");
-class cr extends de {
+class cr extends fe {
   constructor(e) {
     super(), this.setProperties(e);
   }
@@ -8558,7 +8572,7 @@ var jn = Object.defineProperty, me = (r, e, t, s) => {
     (o = r[a]) && (i = o(e, t, i) || i);
   return i && jn(e, t, i), i;
 };
-class ae extends Pe {
+class oe extends Pe {
   constructor(e) {
     super(), this.parent = e, this.base = new Ri(), this.base.setPropertyAccessor(this);
   }
@@ -8577,7 +8591,7 @@ class ae extends Pe {
   _updateProperty(e, t, s) {
     switch (super._updateProperty(e, t, s), e) {
       case "enabled":
-        this.parent.requestRender();
+        this.parent.requestDraw();
         break;
       case "effects":
       case "measureDom":
@@ -8595,7 +8609,7 @@ class ae extends Pe {
     this.base.fonts = this.base.fonts ?? this.parent.tree?.fonts, this.base.update(), this._texture.width = Math.ceil(this.base.boundingBox.width), this._texture.height = Math.ceil(this.base.boundingBox.height), this.base.render({
       view: this._texture.source,
       pixelRatio: this._texture.pixelRatio
-    }), this._texture.requestUpdate("source"), this.parent.requestRender();
+    }), this._texture.requestUpdate("source"), this.parent.requestDraw();
   }
   _updateTextureMap() {
     this._textureMap.clear();
@@ -8622,7 +8636,7 @@ class ae extends Pe {
     t && Object.keys(t).length > 0 && (this._textureMap.set(e, {
       texture: await this._loadTexture(t, s),
       box: s
-    }), this.parent.requestRender());
+    }), this.parent.requestDraw());
   }
   async _loadTexture(e, t) {
     return e.linearGradient || e.radialGradient ? new Vt(
@@ -8644,7 +8658,7 @@ class ae extends Pe {
     const e = this.parent;
     if (e.scale.x > 0 && e.scale.y > 0)
       return;
-    const t = e.scale.x * e.scale.y, s = e.pivot, i = new I().translate(-s.x, -s.y).scale(t > 0 ? 1 : -1, 1).translate(s.x, s.y), { a, c: o, tx: n, b: l, d: c, ty: u } = i.toObject();
+    const t = e.scale.x * e.scale.y, s = e.pivot, i = new M().translate(-s.x, -s.y).scale(t > 0 ? 1 : -1, 1).translate(s.x, s.y), { a, c: o, tx: n, b: l, d: c, ty: u } = i.toObject();
     let d, f;
     return (m, p) => {
       d = m[p], f = m[p + 1], m[p] = a * d + o * f + n, m[p + 1] = l * d + c * f + u;
@@ -8708,7 +8722,7 @@ class ae extends Pe {
   _textureDraw(e) {
     const { left: t = 0, top: s = 0, width: i, height: a } = this.base.boundingBox;
     e.fillStyle = this._texture, e.rect(t, s, i, a);
-    const o = new I().translate(-t, -s).scale(1 / i, 1 / a), { a: n, c: l, tx: c, b: u, d, ty: f } = o.toObject();
+    const o = new M().translate(-t, -s).scale(1 / i, 1 / a), { a: n, c: l, tx: c, b: u, d, ty: f } = o.toObject();
     let m, p;
     e.fill({
       transformUv: (_, g) => {
@@ -8726,38 +8740,38 @@ class ae extends Pe {
       const { width: t, height: s } = this.base.boundingBox, i = this.parent.getViewport();
       if (i) {
         const { a, d: o } = i.canvasTransform.toObject(), n = this._autoDrawMode;
-        t * a < this._autoDrawThreshold || s * o < this._autoDrawThreshold ? this._autoDrawMode = "texture" : this._autoDrawMode = "path", n !== this._autoDrawMode && this.parent.requestRender();
+        t * a < this._autoDrawThreshold || s * o < this._autoDrawThreshold ? this._autoDrawMode = "texture" : this._autoDrawMode = "path", n !== this._autoDrawMode && this.parent.requestDraw();
       }
     }
   }
 }
 me([
   h({ fallback: !0 })
-], ae.prototype, "enabled");
+], oe.prototype, "enabled");
 me([
   h({ fallback: () => [] })
-], ae.prototype, "content");
+], oe.prototype, "content");
 me([
   h({ alias: "parent.style.json" })
-], ae.prototype, "style");
+], oe.prototype, "style");
 me([
   h()
-], ae.prototype, "effects");
+], oe.prototype, "effects");
 me([
   h()
-], ae.prototype, "fill");
+], oe.prototype, "fill");
 me([
   h()
-], ae.prototype, "outline");
+], oe.prototype, "outline");
 me([
   h({ alias: "base.measureDom" })
-], ae.prototype, "measureDom");
+], oe.prototype, "measureDom");
 me([
   h({ alias: "base.fonts" })
-], ae.prototype, "fonts");
+], oe.prototype, "fonts");
 me([
   h({ fallback: "auto" })
-], ae.prototype, "drawMode");
+], oe.prototype, "drawMode");
 var Wn = Object.defineProperty, qn = Object.getOwnPropertyDescriptor, qs = (r, e, t, s) => {
   for (var i = s > 1 ? void 0 : s ? qn(e, t) : e, a = r.length - 1, o; a >= 0; a--)
     (o = r[a]) && (i = (s ? o(e, t, i) : o(i)) || i);
@@ -8767,7 +8781,7 @@ const Yn = new Set(Object.keys(bi())), Kn = new Set(Object.keys(vi()));
 let te = class extends De {
   _flex = new Ar(this);
   size = new C().on("update", () => {
-    this.onUpdateStyleProperty("transform", this.style.transform, void 0), this.onUpdateStyleProperty("transformOrigin", this.style.transformOrigin, void 0), this.updateGlobalTransform(), this.requestRender();
+    this.onUpdateStyleProperty("transform", this.style.transform, void 0), this.onUpdateStyleProperty("transformOrigin", this.style.transformOrigin, void 0), this.updateGlobalTransform(), this.requestDraw();
   });
   _allowPointerEvents = !0;
   _overflowHidden = !1;
@@ -8815,7 +8829,7 @@ let te = class extends De {
   set foreground(r) {
     this._foreground.resetProperties().setProperties(r);
   }
-  _text = new ae(this);
+  _text = new oe(this);
   get text() {
     return this._text;
   }
@@ -8883,10 +8897,10 @@ let te = class extends De {
         this.rotation = e * ar;
         break;
       case "scaleX":
-        this.scale.x = e, this.text.isValid() && (e ^ t) < 0 && this.requestRender();
+        this.scale.x = e, this.text.isValid() && (e ^ t) < 0 && this.requestDraw();
         break;
       case "scaleY":
-        this.scale.y = e, this.text.isValid() && (e ^ t) < 0 && this.requestRender();
+        this.scale.y = e, this.text.isValid() && (e ^ t) < 0 && this.requestDraw();
         break;
       case "skewX":
         this.skew.x = e;
@@ -8947,7 +8961,7 @@ let te = class extends De {
         this._allowPointerEvents = !V(e);
         break;
       case "borderRadius":
-        this.requestRender();
+        this.requestDraw();
         break;
     }
     (Kn.has(r) || Yn.has(r)) && this.text.isValid() && this.text.update(), this._flex.updateStyleProperty(r, e, t), this._flex._node?.isDirty() && this.requestLayout();
@@ -9157,10 +9171,10 @@ let hr = class extends Ys {
     }
   }
   async _load() {
-    this.animation = await $.lottie.load(this.src, this.texture.source), this.duration = this.animation.getDuration(!1) * 1e3, this.texture.requestUpdate("source"), this.requestRender();
+    this.animation = await $.lottie.load(this.src, this.texture.source), this.duration = this.animation.getDuration(!1) * 1e3, this.texture.requestUpdate("source"), this.requestDraw();
   }
   _process(r) {
-    this.animation?.goToAndStop(this.currentTime, !1), this.texture.requestUpdate("source"), this.requestRender(), super._process(r);
+    this.animation?.goToAndStop(this.currentTime, !1), this.texture.requestUpdate("source"), this.requestDraw(), super._process(r);
   }
 };
 Ks([
@@ -9182,7 +9196,7 @@ class tl extends te {
     switch (super._updateStyleProperty(e, t, s), e) {
       case "width":
       case "height":
-        this.requestRender();
+        this.requestDraw();
         break;
     }
   }
@@ -9224,7 +9238,7 @@ let ur = class extends Ys {
     return this._wait;
   }
   async _load(r) {
-    this.texture = await $.video.load(r), (!this.style.width || !this.style.height) && (this.style.width = this.texture.width, this.style.height = this.texture.height), this.requestRender();
+    this.texture = await $.video.load(r), (!this.style.width || !this.style.height) && (this.style.width = this.texture.width, this.style.height = this.texture.height), this.requestDraw();
   }
   _updateVideoCurrentTime() {
     let r = this._currentTime;
@@ -9355,7 +9369,7 @@ let dt = class extends q {
     }
     const r = this._getTargets(), e = 1 / r.length, t = this.currentTimeProgress;
     r.forEach((s, i) => {
-      const a = e === 1 ? t : le(Math.max(0, t - e * i) / e, 0, 1), o = this._cachedProps.get(s);
+      const a = e === 1 ? t : ce(Math.max(0, t - e * i) / e, 0, 1), o = this._cachedProps.get(s);
       if (!o)
         return;
       const n = this._parseKeyframes(a, o);
@@ -9490,7 +9504,7 @@ dt = Xt([
     duration: 2e3
   })
 ], dt);
-class Cr extends ue {
+class Cr extends de {
   static _instance;
   static get instance() {
     return this._instance || (this._instance = new Cr()), this._instance;
@@ -9521,7 +9535,7 @@ class Cr extends ue {
     return this.paused = !this.paused, this.refreshPaused(), this.paused;
   }
 }
-class kt extends ue {
+class kt extends de {
   static PADDING = 0.1;
   _source = null;
   _audio = null;
@@ -9688,7 +9702,7 @@ class ul {
     return new kt();
   }
 }
-class Js extends ue {
+class Js extends de {
   constructor(e, t) {
     super(), this._input = e, this._output = t;
   }
@@ -9830,7 +9844,7 @@ class Ce extends Js {
     e.setValueAtTime ? e.setValueAtTime(t, this._context.currentTime) : e.value = t;
   }
 }
-class pl extends ue {
+class pl extends de {
   _audio = null;
   _sourceNode = null;
   _gain = null;
@@ -10248,7 +10262,7 @@ let ft = class extends te {
         a.fillRect(f, m, p, _), c = 1, u = -1;
       }
     }
-    this._src?.requestUpdate("source"), this.requestRender();
+    this._src?.requestUpdate("source"), this.requestDraw();
   }
   _process(r) {
     this.syncTexture(), super._process(r);
@@ -10672,7 +10686,7 @@ function Zl(r) {
   return e;
 }
 const Rt = "WeakRef" in globalThis;
-class Jl extends ue {
+class Jl extends de {
   defaultHandler = (e) => e;
   _handlers = /* @__PURE__ */ new Map();
   _handleing = /* @__PURE__ */ new Map();
@@ -10989,7 +11003,7 @@ export {
   uo as CanvasContext,
   Ge as CanvasItem,
   ws as CanvasTexture,
-  oe as Color,
+  ne as Color,
   j as ColorAdjustEffect,
   $e as ColorFilterEffect,
   ps as ColorMatrix,
@@ -11012,12 +11026,12 @@ export {
   Je as Element2DShadow,
   Qe as Element2DShape,
   cr as Element2DStyle,
-  ae as Element2DText,
+  oe as Element2DText,
   ct as EmbossEffect,
   Or as Engine,
   Ar as FlexLayout,
   Wa as FontLoader,
-  he as GaussianBlurEffect,
+  ue as GaussianBlurEffect,
   ke as Geometry,
   $l as GifLoader,
   Pa as GlBatch2DSystem,
@@ -11058,13 +11072,13 @@ export {
   mr as MainLoop,
   Ie as MaskEffect,
   E as Material,
-  ne as Matrix,
+  le as Matrix,
   pc as Matrix2,
   _s as Matrix3,
   ea as Matrix4,
   po as Meta,
   fs as MouseInputEvent,
-  M as Node,
+  I as Node,
   De as Node2D,
   Ot as Obb2D,
   L as OutlineEffect,
@@ -11080,7 +11094,7 @@ export {
   Qi as RefCounted,
   re as RenderTarget,
   gr as Renderer,
-  de as Resource,
+  fe as Resource,
   ls as SUPPORTS_AUDIO_CONTEXT,
   Bi as SUPPORTS_CLICK_EVENTS,
   hc as SUPPORTS_CREATE_IMAGE_BITMAP,
@@ -11102,9 +11116,9 @@ export {
   Ys as TextureRect2D,
   B as Ticker,
   pt as TiltShiftTransition,
-  ce as Timeline,
+  he as Timeline,
   q as TimelineNode,
-  I as Transform2D,
+  M as Transform2D,
   tl as TransformRect2D,
   Ve as Transition,
   Lt as TwistTransition,
@@ -11130,7 +11144,7 @@ export {
   Le as alignMap,
   $ as assets,
   es as boxSizingMap,
-  le as clamp,
+  ce as clamp,
   En as clampFrag,
   Hi as createHTMLCanvas,
   oa as createIdFromString,

package/dist/scene/main/CanvasItem.d.ts

@@ -29,10 +29,10 @@ export declare class CanvasItem extends TimelineNode {
     get globalOpacity(): number;
     context: CanvasContext;
     protected _resetContext: boolean;
-    needsRender: boolean;
+    needsDraw: boolean;
     needsLayout: boolean;
     needsPaint: boolean;
-    protected _rawBatchables: CanvasBatchable[];
+    protected _drawBatchables: CanvasBatchable[];
     protected _layoutBatchables: CanvasBatchable[];
     protected _batchables: CanvasBatchable[];
     constructor(properties?: Partial<CanvasItemProperties>, nodes?: Node[]);
@@ -41,7 +41,7 @@ export declare class CanvasItem extends TimelineNode {
     hide(): void;
     isVisibleInTree(): boolean;
     canRender(): boolean;
-    requestRender(): void;
+    requestDraw(): void;
     requestLayout(): void;
     requestPaint(): void;
     protected _updateGlobalVisible(): void;

package/dist/scene/main/Effect.d.ts

@@ -36,7 +36,6 @@ export declare class Effect extends TimelineNode implements Rectangulable {
     effectMode?: EffectMode;
     glsl?: string;
     glslSrc?: string;
-    needsRender: boolean;
     protected get _effectMode(): EffectMode;
     /** Viewports */
     readonly viewport1: Viewport;
@@ -49,7 +48,6 @@ export declare class Effect extends TimelineNode implements Rectangulable {
     protected _nextSibling?: Node;
     protected _rect: RectangleLike;
     constructor(properties?: Partial<EffectProperties>, children?: Node[]);
-    requestRender(): void;
     protected _updateProperty(key: string, value: any, oldValue: any): void;
     protected _treeEnter(tree: SceneTree): void;
     protected _treeExit(oldTree: SceneTree): void;

package/dist/scene/main/Node.d.ts

@@ -67,6 +67,7 @@ export declare class Node extends CoreObject {
     protected _meta: Meta;
     get meta(): Meta;
     set meta(value: Record<string, any>);
+    needsRender: boolean;
     protected _readyed: boolean;
     constructor(properties?: Partial<NodeProperties>, nodes?: Node[]);
     setProperties(properties?: Record<string, any>): this;
@@ -110,6 +111,8 @@ export declare class Node extends CoreObject {
     protected _onUnparented(oldParent: Node): void;
     protected _onReady(): void;
     protected _onProcess(delta?: number): void;
+    requestRender(): void;
+    protected _updateProperty(key: string, newValue: any, oldValue: any): void;
     render(renderer: GlRenderer, next?: () => void): void;
     input(event: InputEvent, key: InputEventKey): void;
     getIndex(): number;
@@ -145,5 +148,5 @@ export declare class Node extends CoreObject {
     destroy(): void;
     clone(): this;
     toJSON(): Record<string, any>;
-    static parse(value: SerializedNode | SerializedNode[]): any;
+    static parse(value: SerializedNode | SerializedNode[], defaultInCanvasIs?: string): any;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "modern-canvas",
   "type": "module",
-  "version": "0.14.9",
+  "version": "0.14.10",
   "packageManager": "pnpm@10.19.0",
   "description": "A JavaScript WebGL rendering engine. only the ESM.",
   "author": "wxm",