modern-canvas 0.4.21 → 0.4.22

package/dist/index.mjs

@@ -2149,13 +2149,13 @@ class Vector3 extends Vector {
   }
 }
 
-var __defProp$J = Object.defineProperty;
-var __decorateClass$R = (decorators, target, key, kind) => {
+var __defProp$L = Object.defineProperty;
+var __decorateClass$T = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$J(target, key, result);
+  if (result) __defProp$L(target, key, result);
   return result;
 };
 class MainLoop extends CoreObject {
@@ -2198,10 +2198,10 @@ class MainLoop extends CoreObject {
     this.stop();
   }
 }
-__decorateClass$R([
+__decorateClass$T([
   property({ default: 24 })
 ], MainLoop.prototype, "fps");
-__decorateClass$R([
+__decorateClass$T([
   property({ default: 1 })
 ], MainLoop.prototype, "speed");
 
@@ -4503,13 +4503,13 @@ class Geometry extends Resource {
   }
 }
 
-var __defProp$I = Object.defineProperty;
-var __decorateClass$Q = (decorators, target, key, kind) => {
+var __defProp$K = Object.defineProperty;
+var __decorateClass$S = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$I(target, key, result);
+  if (result) __defProp$K(target, key, result);
   return result;
 };
 class IndexBuffer extends Resource {
@@ -4553,20 +4553,20 @@ class IndexBuffer extends Resource {
     return result;
   }
 }
-__decorateClass$Q([
+__decorateClass$S([
   protectedProperty({ default: null })
 ], IndexBuffer.prototype, "data");
-__decorateClass$Q([
+__decorateClass$S([
   protectedProperty({ default: false })
 ], IndexBuffer.prototype, "dynamic");
 
-var __defProp$H = Object.defineProperty;
-var __decorateClass$P = (decorators, target, key, kind) => {
+var __defProp$J = Object.defineProperty;
+var __decorateClass$R = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$H(target, key, result);
+  if (result) __defProp$J(target, key, result);
   return result;
 };
 class VertexBuffer extends Resource {
@@ -4610,20 +4610,20 @@ class VertexBuffer extends Resource {
     return result;
   }
 }
-__decorateClass$P([
+__decorateClass$R([
   protectedProperty({ default: null })
 ], VertexBuffer.prototype, "data");
-__decorateClass$P([
+__decorateClass$R([
   protectedProperty({ default: false })
 ], VertexBuffer.prototype, "dynamic");
 
-var __defProp$G = Object.defineProperty;
-var __decorateClass$O = (decorators, target, key, kind) => {
+var __defProp$I = Object.defineProperty;
+var __decorateClass$Q = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$G(target, key, result);
+  if (result) __defProp$I(target, key, result);
   return result;
 };
 class VertexAttribute extends Resource {
@@ -4660,25 +4660,25 @@ class VertexAttribute extends Resource {
     return result;
   }
 }
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty()
 ], VertexAttribute.prototype, "buffer");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty({ default: 0 })
 ], VertexAttribute.prototype, "size");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty({ default: false })
 ], VertexAttribute.prototype, "normalized");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty({ default: "float" })
 ], VertexAttribute.prototype, "type");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty()
 ], VertexAttribute.prototype, "stride");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty()
 ], VertexAttribute.prototype, "offset");
-__decorateClass$O([
+__decorateClass$Q([
   protectedProperty()
 ], VertexAttribute.prototype, "divisor");
 
@@ -4922,13 +4922,13 @@ class UvGeometry extends Geometry {
   }
 }
 
-var __defProp$F = Object.defineProperty;
-var __decorateClass$N = (decorators, target, key, kind) => {
+var __defProp$H = Object.defineProperty;
+var __decorateClass$P = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$F(target, key, result);
+  if (result) __defProp$H(target, key, result);
   return result;
 };
 class Texture2D extends Resource {
@@ -5054,22 +5054,22 @@ class Texture2D extends Resource {
     }
   }
 }
-__decorateClass$N([
+__decorateClass$P([
   protectedProperty()
 ], Texture2D.prototype, "source");
-__decorateClass$N([
+__decorateClass$P([
   property({ default: 0 })
 ], Texture2D.prototype, "width");
-__decorateClass$N([
+__decorateClass$P([
   property({ default: 0 })
 ], Texture2D.prototype, "height");
-__decorateClass$N([
+__decorateClass$P([
   property({ default: "linear" })
 ], Texture2D.prototype, "filterMode");
-__decorateClass$N([
+__decorateClass$P([
   property({ default: "clamp_to_edge" })
 ], Texture2D.prototype, "wrapMode");
-__decorateClass$N([
+__decorateClass$P([
   property({ default: 1 })
 ], Texture2D.prototype, "pixelRatio");
 
@@ -5099,13 +5099,13 @@ class AnimatedTexture extends Resource {
   }
 }
 
-var __defProp$E = Object.defineProperty;
-var __decorateClass$M = (decorators, target, key, kind) => {
+var __defProp$G = Object.defineProperty;
+var __decorateClass$O = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$E(target, key, result);
+  if (result) __defProp$G(target, key, result);
   return result;
 };
 class CanvasTexture extends Texture2D {
@@ -5124,7 +5124,7 @@ class CanvasTexture extends Texture2D {
     super._updateProperty(key, value, oldValue, declaration);
   }
 }
-__decorateClass$M([
+__decorateClass$O([
   property({ default: 2 })
 ], CanvasTexture.prototype, "pixelRatio");
 
@@ -5286,13 +5286,13 @@ class PixelsTexture extends Texture2D {
   }
 }
 
-var __defProp$D = Object.defineProperty;
-var __decorateClass$L = (decorators, target, key, kind) => {
+var __defProp$F = Object.defineProperty;
+var __decorateClass$N = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$D(target, key, result);
+  if (result) __defProp$F(target, key, result);
   return result;
 };
 function resolveOptions(options) {
@@ -5536,10 +5536,10 @@ const _VideoTexture = class _VideoTexture extends Texture2D {
     }
   }
 };
-__decorateClass$L([
+__decorateClass$N([
   protectedProperty({ default: true })
 ], _VideoTexture.prototype, "autoUpdate");
-__decorateClass$L([
+__decorateClass$N([
   protectedProperty({ default: 0 })
 ], _VideoTexture.prototype, "fps");
 let VideoTexture = _VideoTexture;
@@ -5548,14 +5548,14 @@ class ViewportTexture extends PixelsTexture {
   //
 }
 
-var __defProp$C = Object.defineProperty;
+var __defProp$E = Object.defineProperty;
 var __getOwnPropDesc$I = Object.getOwnPropertyDescriptor;
-var __decorateClass$K = (decorators, target, key, kind) => {
+var __decorateClass$M = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$I(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$C(target, key, result);
+  if (kind && result) __defProp$E(target, key, result);
   return result;
 };
 const tagUidMap = {};
@@ -6060,36 +6060,36 @@ let Node = class extends CoreObject {
     return node;
   }
 };
-__decorateClass$K([
+__decorateClass$M([
   protectedProperty()
 ], Node.prototype, "name", 2);
-__decorateClass$K([
+__decorateClass$M([
   property()
 ], Node.prototype, "mask", 2);
-__decorateClass$K([
+__decorateClass$M([
   property({ default: "inherit" })
 ], Node.prototype, "processMode", 2);
-__decorateClass$K([
+__decorateClass$M([
   property({ default: "default" })
 ], Node.prototype, "processSortMode", 2);
-__decorateClass$K([
+__decorateClass$M([
   property({ default: "inherit" })
 ], Node.prototype, "renderMode", 2);
-__decorateClass$K([
+__decorateClass$M([
   property({ default: "default" })
 ], Node.prototype, "internalMode", 2);
-Node = __decorateClass$K([
+Node = __decorateClass$M([
   customNode("Node")
 ], Node);
 
-var __defProp$B = Object.defineProperty;
+var __defProp$D = Object.defineProperty;
 var __getOwnPropDesc$H = Object.getOwnPropertyDescriptor;
-var __decorateClass$J = (decorators, target, key, kind) => {
+var __decorateClass$L = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$H(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$B(target, key, result);
+  if (kind && result) __defProp$D(target, key, result);
   return result;
 };
 let TimelineNode = class extends Node {
@@ -6149,30 +6149,30 @@ let TimelineNode = class extends Node {
     this._updateCurrentTime();
   }
 };
-__decorateClass$J([
+__decorateClass$L([
   property({ default: 0 })
 ], TimelineNode.prototype, "delay", 2);
-__decorateClass$J([
+__decorateClass$L([
   property({ default: 0 })
 ], TimelineNode.prototype, "duration", 2);
-__decorateClass$J([
+__decorateClass$L([
   property({ default: false })
 ], TimelineNode.prototype, "paused", 2);
-__decorateClass$J([
+__decorateClass$L([
   protectedProperty()
 ], TimelineNode.prototype, "insideTimeRange", 2);
-TimelineNode = __decorateClass$J([
+TimelineNode = __decorateClass$L([
   customNode("TimelineNode")
 ], TimelineNode);
 
-var __defProp$A = Object.defineProperty;
+var __defProp$C = Object.defineProperty;
 var __getOwnPropDesc$G = Object.getOwnPropertyDescriptor;
-var __decorateClass$I = (decorators, target, key, kind) => {
+var __decorateClass$K = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$G(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$A(target, key, result);
+  if (kind && result) __defProp$C(target, key, result);
   return result;
 };
 let Viewport = class extends Node {
@@ -6310,30 +6310,30 @@ let Viewport = class extends Node {
     return this._projection.toArray(transpose);
   }
 };
-__decorateClass$I([
+__decorateClass$K([
   property({ default: 0 })
 ], Viewport.prototype, "x", 2);
-__decorateClass$I([
+__decorateClass$K([
   property({ default: 0 })
 ], Viewport.prototype, "y", 2);
-__decorateClass$I([
+__decorateClass$K([
   property({ default: 0 })
 ], Viewport.prototype, "width", 2);
-__decorateClass$I([
+__decorateClass$K([
   property({ default: 0 })
 ], Viewport.prototype, "height", 2);
-Viewport = __decorateClass$I([
+Viewport = __decorateClass$K([
   customNode("Viewport")
 ], Viewport);
 
-var __defProp$z = Object.defineProperty;
+var __defProp$B = Object.defineProperty;
 var __getOwnPropDesc$F = Object.getOwnPropertyDescriptor;
-var __decorateClass$H = (decorators, target, key, kind) => {
+var __decorateClass$J = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$F(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$z(target, key, result);
+  if (kind && result) __defProp$B(target, key, result);
   return result;
 };
 let Effect = class extends TimelineNode {
@@ -6574,151 +6574,34 @@ let Effect = class extends TimelineNode {
     }
   }
 };
-__decorateClass$H([
+__decorateClass$J([
   protectedProperty()
 ], Effect.prototype, "material", 2);
-__decorateClass$H([
+__decorateClass$J([
   property()
 ], Effect.prototype, "effectMode", 2);
-__decorateClass$H([
+__decorateClass$J([
   property({ default: "" })
 ], Effect.prototype, "glsl", 2);
-__decorateClass$H([
+__decorateClass$J([
   property({ default: "" })
 ], Effect.prototype, "glslSrc", 2);
-Effect = __decorateClass$H([
+Effect = __decorateClass$J([
   customNode("Effect")
 ], Effect);
 
-var __defProp$y = Object.defineProperty;
+var __defProp$A = Object.defineProperty;
 var __getOwnPropDesc$E = Object.getOwnPropertyDescriptor;
-var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$y(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$G = (decorators, target, key, kind) => {
+var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$A(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$I = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$E(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$y(target, key, result);
-  return result;
-};
-var __publicField$i = (obj, key, value) => __defNormalProp$i(obj, typeof key !== "symbol" ? key + "" : key, value);
-const frag$2 = `varying vec2 vUv[9];
-uniform sampler2D sampler;
-
-void main(void) {
-  gl_FragColor = vec4(0.0);
-  float flag = 0.0;
-  for (int i = 0; i < 9; i++) {
-   vec2 uv = vUv[i];
-   if (uv.x < 0.0 || uv.x > 1.0 || uv.y < 0.0 || uv.y > 1.0) {
-     flag = 1.0;
-     break;
-   }
-  }
-  if (flag == 1.0) {
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.028532;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.067234;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.124009;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.179044;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.20236;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.179044;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.124009;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.067234;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.028532;
-  } else {
-    gl_FragColor += texture2D(sampler, vUv[0]) * 0.028532;
-    gl_FragColor += texture2D(sampler, vUv[1]) * 0.067234;
-    gl_FragColor += texture2D(sampler, vUv[2]) * 0.124009;
-    gl_FragColor += texture2D(sampler, vUv[3]) * 0.179044;
-    gl_FragColor += texture2D(sampler, vUv[4]) * 0.20236;
-    gl_FragColor += texture2D(sampler, vUv[5]) * 0.179044;
-    gl_FragColor += texture2D(sampler, vUv[6]) * 0.124009;
-    gl_FragColor += texture2D(sampler, vUv[7]) * 0.067234;
-    gl_FragColor += texture2D(sampler, vUv[8]) * 0.028532;
-  }
-}`;
-let BlurEffect = class extends Effect {
-  constructor(properties, children = []) {
-    super();
-    this.setProperties(properties).append(children);
-  }
-  apply(renderer, source) {
-    source.redraw(renderer, () => {
-      QuadUvGeometry.draw(renderer, BlurEffect.materialX, {
-        sampler: 0,
-        strength: 1 / source.width * this.strength / this.quality
-      });
-    });
-    source.redraw(renderer, () => {
-      QuadUvGeometry.draw(renderer, BlurEffect.materialY, {
-        sampler: 0,
-        strength: 1 / source.height * this.strength / this.quality
-      });
-    });
-  }
-};
-__publicField$i(BlurEffect, "materialX", new Material({
-  vert: `attribute vec2 position;
-attribute vec2 uv;
-varying vec2 vUv[9];
-uniform float strength;
-
-void main(void) {
-  gl_Position = vec4(position, 0, 1);
-  vUv[0] = uv + vec2(-4.0 * strength, 0.0);
-  vUv[1] = uv + vec2(-3.0 * strength, 0.0);
-  vUv[2] = uv + vec2(-2.0 * strength, 0.0);
-  vUv[3] = uv + vec2(-1.0 * strength, 0.0);
-  vUv[4] = uv + vec2(0.0 * strength, 0.0);
-  vUv[5] = uv + vec2(1.0 * strength, 0.0);
-  vUv[6] = uv + vec2(2.0 * strength, 0.0);
-  vUv[7] = uv + vec2(3.0 * strength, 0.0);
-  vUv[8] = uv + vec2(4.0 * strength, 0.0);
-}`,
-  frag: frag$2
-}));
-__publicField$i(BlurEffect, "materialY", new Material({
-  vert: `attribute vec2 position;
-attribute vec2 uv;
-uniform float strength;
-varying vec2 vUv[9];
-
-void main(void) {
-  gl_Position = vec4(position, 0, 1);
-  vUv[0] = uv + vec2(0.0, -4.0 * strength);
-  vUv[1] = uv + vec2(0.0, -3.0 * strength);
-  vUv[2] = uv + vec2(0.0, -2.0 * strength);
-  vUv[3] = uv + vec2(0.0, -1.0 * strength);
-  vUv[4] = uv + vec2(0.0, 0.0 * strength);
-  vUv[5] = uv + vec2(0.0, 1.0 * strength);
-  vUv[6] = uv + vec2(0.0, 2.0 * strength);
-  vUv[7] = uv + vec2(0.0, 3.0 * strength);
-  vUv[8] = uv + vec2(0.0, 4.0 * strength);
-}`,
-  frag: frag$2
-}));
-__decorateClass$G([
-  property({ default: 4 })
-], BlurEffect.prototype, "strength", 2);
-__decorateClass$G([
-  property({ default: 3 })
-], BlurEffect.prototype, "quality", 2);
-BlurEffect = __decorateClass$G([
-  customNode("BlurEffect")
-], BlurEffect);
-
-var __defProp$x = Object.defineProperty;
-var __getOwnPropDesc$D = Object.getOwnPropertyDescriptor;
-var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$x(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$F = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$D(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$x(target, key, result);
+  if (kind && result) __defProp$A(target, key, result);
   return result;
 };
-var __publicField$h = (obj, key, value) => __defNormalProp$h(obj, key + "" , value);
+var __publicField$i = (obj, key, value) => __defNormalProp$i(obj, key + "" , value);
 let ColorAdjustEffect = class extends Effect {
   constructor(properties, children = []) {
     super();
@@ -6740,7 +6623,7 @@ let ColorAdjustEffect = class extends Effect {
     });
   }
 };
-__publicField$h(ColorAdjustEffect, "material", new Material({
+__publicField$i(ColorAdjustEffect, "material", new Material({
   vert: `precision mediump float;
 attribute vec2 position;
 attribute vec2 uv;
@@ -6775,46 +6658,46 @@ void main(void) {
   gl_FragColor = c * alpha;
 }`
 }));
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "saturation", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "contrast", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "brightness", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "red", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "green", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "blue", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "alpha", 2);
-__decorateClass$F([
+__decorateClass$I([
   property({ default: 1 })
 ], ColorAdjustEffect.prototype, "gamma", 2);
-ColorAdjustEffect = __decorateClass$F([
+ColorAdjustEffect = __decorateClass$I([
   customNode("ColorAdjustEffect")
 ], ColorAdjustEffect);
 
-var __defProp$w = Object.defineProperty;
-var __getOwnPropDesc$C = Object.getOwnPropertyDescriptor;
-var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$E = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$C(target, key) : target;
+var __defProp$z = Object.defineProperty;
+var __getOwnPropDesc$D = Object.getOwnPropertyDescriptor;
+var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$z(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$H = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$D(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$w(target, key, result);
+  if (kind && result) __defProp$z(target, key, result);
   return result;
 };
-var __publicField$g = (obj, key, value) => __defNormalProp$g(obj, key + "" , value);
+var __publicField$h = (obj, key, value) => __defNormalProp$h(obj, key + "" , value);
 let ColorFilterEffect = class extends Effect {
   _colorMatrix = new ColorMatrix();
   constructor(properties, children = []) {
@@ -6864,7 +6747,7 @@ let ColorFilterEffect = class extends Effect {
     });
   }
 };
-__publicField$g(ColorFilterEffect, "material", new Material({
+__publicField$h(ColorFilterEffect, "material", new Material({
   vert: `precision mediump float;
 attribute vec2 position;
 attribute vec2 uv;
@@ -6891,25 +6774,25 @@ void main(void) {
   );
 }`
 }));
-__decorateClass$E([
+__decorateClass$H([
   property()
 ], ColorFilterEffect.prototype, "filter", 2);
-ColorFilterEffect = __decorateClass$E([
+ColorFilterEffect = __decorateClass$H([
   customNode("ColorFilterEffect")
 ], ColorFilterEffect);
 
-var __defProp$v = Object.defineProperty;
-var __getOwnPropDesc$B = Object.getOwnPropertyDescriptor;
-var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$v(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$D = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$B(target, key) : target;
+var __defProp$y = Object.defineProperty;
+var __getOwnPropDesc$C = Object.getOwnPropertyDescriptor;
+var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$y(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$G = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$C(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$v(target, key, result);
+  if (kind && result) __defProp$y(target, key, result);
   return result;
 };
-var __publicField$f = (obj, key, value) => __defNormalProp$f(obj, key + "" , value);
+var __publicField$g = (obj, key, value) => __defNormalProp$g(obj, key + "" , value);
 const MAX_COLORS$1 = 50;
 let ColorOverlayEffect = class extends Effect {
   _color = new Color();
@@ -6935,7 +6818,7 @@ let ColorOverlayEffect = class extends Effect {
     });
   }
 };
-__publicField$f(ColorOverlayEffect, "material", new Material({
+__publicField$g(ColorOverlayEffect, "material", new Material({
   vert: `precision mediump float;
 attribute vec2 position;
 attribute vec2 uv;
@@ -6982,28 +6865,28 @@ void main(void) {
   gl_FragColor = vec4(mix(color.rgb, mask.rgb, color.a * mask.a), color.a);
 }`
 }));
-__decorateClass$D([
+__decorateClass$G([
   property({ default: [] })
 ], ColorOverlayEffect.prototype, "colors", 2);
-__decorateClass$D([
+__decorateClass$G([
   property({ default: 0.5 })
 ], ColorOverlayEffect.prototype, "alpha", 2);
-ColorOverlayEffect = __decorateClass$D([
+ColorOverlayEffect = __decorateClass$G([
   customNode("ColorOverlayEffect")
 ], ColorOverlayEffect);
 
-var __defProp$u = Object.defineProperty;
-var __getOwnPropDesc$A = Object.getOwnPropertyDescriptor;
-var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$u(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$C = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$A(target, key) : target;
+var __defProp$x = Object.defineProperty;
+var __getOwnPropDesc$B = Object.getOwnPropertyDescriptor;
+var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$x(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$F = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$B(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$u(target, key, result);
+  if (kind && result) __defProp$x(target, key, result);
   return result;
 };
-var __publicField$e = (obj, key, value) => __defNormalProp$e(obj, key + "" , value);
+var __publicField$f = (obj, key, value) => __defNormalProp$f(obj, key + "" , value);
 let ColorRemoveEffect = class extends Effect {
   _color = new Color();
   constructor(properties, children = []) {
@@ -7034,7 +6917,7 @@ let ColorRemoveEffect = class extends Effect {
     });
   }
 };
-__publicField$e(ColorRemoveEffect, "material", new Material({
+__publicField$f(ColorRemoveEffect, "material", new Material({
   vert: `precision mediump float;
 attribute vec2 position;
 attribute vec2 uv;
@@ -7067,28 +6950,28 @@ void main(void) {
   gl_FragColor = color;
 }`
 }));
-__decorateClass$C([
+__decorateClass$F([
   property({ default: [] })
 ], ColorRemoveEffect.prototype, "colors", 2);
-__decorateClass$C([
+__decorateClass$F([
   property({ default: 0.5 })
 ], ColorRemoveEffect.prototype, "epsilon", 2);
-ColorRemoveEffect = __decorateClass$C([
+ColorRemoveEffect = __decorateClass$F([
   customNode("ColorRemoveEffect")
 ], ColorRemoveEffect);
 
-var __defProp$t = Object.defineProperty;
-var __getOwnPropDesc$z = Object.getOwnPropertyDescriptor;
-var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$t(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$B = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$z(target, key) : target;
+var __defProp$w = Object.defineProperty;
+var __getOwnPropDesc$A = Object.getOwnPropertyDescriptor;
+var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$E = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$A(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$t(target, key, result);
+  if (kind && result) __defProp$w(target, key, result);
   return result;
 };
-var __publicField$d = (obj, key, value) => __defNormalProp$d(obj, key + "" , value);
+var __publicField$e = (obj, key, value) => __defNormalProp$e(obj, key + "" , value);
 const MAX_COLORS = 50;
 let ColorReplaceEffect = class extends Effect {
   _color = new Color();
@@ -7134,7 +7017,7 @@ let ColorReplaceEffect = class extends Effect {
     });
   }
 };
-__publicField$d(ColorReplaceEffect, "material", new Material({
+__publicField$e(ColorReplaceEffect, "material", new Material({
   vert: `precision mediump float;
 attribute vec2 position;
 attribute vec2 uv;
@@ -7174,13 +7057,13 @@ void main(void) {
   }
 }`
 }));
-__decorateClass$B([
+__decorateClass$E([
   property({ default: [] })
 ], ColorReplaceEffect.prototype, "colors", 2);
-__decorateClass$B([
+__decorateClass$E([
   property({ default: 0.05 })
 ], ColorReplaceEffect.prototype, "epsilon", 2);
-ColorReplaceEffect = __decorateClass$B([
+ColorReplaceEffect = __decorateClass$E([
   customNode("ColorReplaceEffect")
 ], ColorReplaceEffect);
 
@@ -7347,14 +7230,14 @@ class CanvasContext extends Path2D {
   }
 }
 
-var __defProp$s = Object.defineProperty;
-var __getOwnPropDesc$y = Object.getOwnPropertyDescriptor;
-var __decorateClass$A = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$y(target, key) : target;
+var __defProp$v = Object.defineProperty;
+var __getOwnPropDesc$z = Object.getOwnPropertyDescriptor;
+var __decorateClass$D = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$z(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$s(target, key, result);
+  if (kind && result) __defProp$v(target, key, result);
   return result;
 };
 let CanvasItem = class extends TimelineNode {
@@ -7516,19 +7399,19 @@ let CanvasItem = class extends TimelineNode {
     super._render(renderer);
   }
 };
-__decorateClass$A([
+__decorateClass$D([
   property()
 ], CanvasItem.prototype, "modulate", 2);
-__decorateClass$A([
+__decorateClass$D([
   property()
 ], CanvasItem.prototype, "blendMode", 2);
-__decorateClass$A([
+__decorateClass$D([
   protectedProperty({ default: true })
 ], CanvasItem.prototype, "visible", 2);
-__decorateClass$A([
+__decorateClass$D([
   protectedProperty({ default: 1 })
 ], CanvasItem.prototype, "opacity", 2);
-CanvasItem = __decorateClass$A([
+CanvasItem = __decorateClass$D([
   customNode("CanvasItem")
 ], CanvasItem);
 
@@ -7558,14 +7441,14 @@ class RenderStack {
   }
 }
 
-var __defProp$r = Object.defineProperty;
-var __getOwnPropDesc$x = Object.getOwnPropertyDescriptor;
-var __decorateClass$z = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$x(target, key) : target;
+var __defProp$u = Object.defineProperty;
+var __getOwnPropDesc$y = Object.getOwnPropertyDescriptor;
+var __decorateClass$C = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$y(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$r(target, key, result);
+  if (kind && result) __defProp$u(target, key, result);
   return result;
 };
 let Timeline = class extends Node {
@@ -7610,29 +7493,29 @@ let Timeline = class extends Node {
     this.addTime(delta);
   }
 };
-__decorateClass$z([
+__decorateClass$C([
   property({ default: 0 })
 ], Timeline.prototype, "startTime", 2);
-__decorateClass$z([
+__decorateClass$C([
   property({ default: 0 })
 ], Timeline.prototype, "currentTime", 2);
-__decorateClass$z([
+__decorateClass$C([
   property({ default: Number.MAX_SAFE_INTEGER })
 ], Timeline.prototype, "endTime", 2);
-__decorateClass$z([
+__decorateClass$C([
   property({ default: false })
 ], Timeline.prototype, "loop", 2);
-Timeline = __decorateClass$z([
+Timeline = __decorateClass$C([
   customNode("Timeline")
 ], Timeline);
 
-var __defProp$q = Object.defineProperty;
-var __decorateClass$y = (decorators, target, key, kind) => {
+var __defProp$t = Object.defineProperty;
+var __decorateClass$B = (decorators, target, key, kind) => {
   var result = void 0 ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(target, key, result) ) || result;
-  if (result) __defProp$q(target, key, result);
+  if (result) __defProp$t(target, key, result);
   return result;
 };
 class SceneTree extends MainLoop {
@@ -7705,19 +7588,19 @@ class SceneTree extends MainLoop {
     this.input.removeEventListeners();
   }
 }
-__decorateClass$y([
+__decorateClass$B([
   property({ default: false })
 ], SceneTree.prototype, "processPaused");
-__decorateClass$y([
+__decorateClass$B([
   property()
 ], SceneTree.prototype, "backgroundColor");
-__decorateClass$y([
+__decorateClass$B([
   protectedProperty({ default: false })
 ], SceneTree.prototype, "debug");
 
-var __getOwnPropDesc$w = Object.getOwnPropertyDescriptor;
-var __decorateClass$x = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$w(target, key) : target;
+var __getOwnPropDesc$x = Object.getOwnPropertyDescriptor;
+var __decorateClass$A = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$x(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (decorator(result)) || result;
@@ -7729,7 +7612,7 @@ let Transition = class extends Effect {
     this.setProperties(properties).append(children);
   }
 };
-Transition = __decorateClass$x([
+Transition = __decorateClass$A([
   customNode("Transition", {
     effectMode: "transition",
     processMode: "pausable",
@@ -7737,156 +7620,144 @@ Transition = __decorateClass$x([
   })
 ], Transition);
 
-var __defProp$p = Object.defineProperty;
-var __getOwnPropDesc$v = Object.getOwnPropertyDescriptor;
-var __decorateClass$w = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$v(target, key) : target;
+var __defProp$s = Object.defineProperty;
+var __getOwnPropDesc$w = Object.getOwnPropertyDescriptor;
+var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$s(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$z = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$w(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$p(target, key, result);
+  if (kind && result) __defProp$s(target, key, result);
   return result;
 };
-const frag$1 = `varying vec2 vUv;
+var __publicField$d = (obj, key, value) => __defNormalProp$d(obj, typeof key !== "symbol" ? key + "" : key, value);
+const frag$2 = `varying vec2 vUv[9];
 uniform sampler2D sampler;
-uniform vec2 uOffset;
 
 void main(void) {
-    vec4 color = vec4(0.0);
-    color += texture2D(sampler, vec2(vUv.x - uOffset.x, vUv.y + uOffset.y));
-    color += texture2D(sampler, vec2(vUv.x + uOffset.x, vUv.y + uOffset.y));
-    color += texture2D(sampler, vec2(vUv.x + uOffset.x, vUv.y - uOffset.y));
-    color += texture2D(sampler, vec2(vUv.x - uOffset.x, vUv.y - uOffset.y));
-    color *= 0.25;
-    gl_FragColor = color;
-}`;
-const clampFrag = `precision highp float;
-varying vec2 vUv;
-uniform sampler2D sampler;
-uniform vec2 uOffset;
-uniform vec4 uInputClamp;
-void main(void) {
-    vec4 color = vec4(0.0);
-    color += texture2D(sampler, clamp(vec2(vUv.x - uOffset.x, vUv.y + uOffset.y), uInputClamp.xy, uInputClamp.zw));
-    color += texture2D(sampler, clamp(vec2(vUv.x + uOffset.x, vUv.y + uOffset.y), uInputClamp.xy, uInputClamp.zw));
-    color += texture2D(sampler, clamp(vec2(vUv.x + uOffset.x, vUv.y - uOffset.y), uInputClamp.xy, uInputClamp.zw));
-    color += texture2D(sampler, clamp(vec2(vUv.x - uOffset.x, vUv.y - uOffset.y), uInputClamp.xy, uInputClamp.zw));
-    color *= 0.25;
-    gl_FragColor = color;
+  gl_FragColor = vec4(0.0);
+  float flag = 0.0;
+  for (int i = 0; i < 9; i++) {
+   vec2 uv = vUv[i];
+   if (uv.x < 0.0 || uv.x > 1.0 || uv.y < 0.0 || uv.y > 1.0) {
+     flag = 1.0;
+     break;
+   }
+  }
+  if (flag == 1.0) {
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.028532;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.067234;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.124009;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.179044;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.20236;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.179044;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.124009;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.067234;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.028532;
+  } else {
+    gl_FragColor += texture2D(sampler, vUv[0]) * 0.028532;
+    gl_FragColor += texture2D(sampler, vUv[1]) * 0.067234;
+    gl_FragColor += texture2D(sampler, vUv[2]) * 0.124009;
+    gl_FragColor += texture2D(sampler, vUv[3]) * 0.179044;
+    gl_FragColor += texture2D(sampler, vUv[4]) * 0.20236;
+    gl_FragColor += texture2D(sampler, vUv[5]) * 0.179044;
+    gl_FragColor += texture2D(sampler, vUv[6]) * 0.124009;
+    gl_FragColor += texture2D(sampler, vUv[7]) * 0.067234;
+    gl_FragColor += texture2D(sampler, vUv[8]) * 0.028532;
+  }
 }`;
-let KawaseBlurEffect = class extends Effect {
-  material;
-  _kernels = [0];
+let GaussianBlurEffect = class extends Effect {
   constructor(properties, children = []) {
     super();
-    this.material = new Material({
-      vert: `precision mediump float;
-attribute vec2 position;
-attribute vec2 uv;
-varying vec2 vUv;
-void main() {
-  gl_Position = vec4(position, 0.0, 1.0);
-  vUv = uv;
-}`,
-      frag: properties?.clamp ? clampFrag : frag$1
-    });
     this.setProperties(properties).append(children);
-    this._generateKernels();
-  }
-  _updateProperty(key, value, oldValue, declaration) {
-    super._updateProperty(key, value, oldValue, declaration);
-    switch (key) {
-      case "quality":
-      case "strength":
-        this._generateKernels();
-        break;
-    }
-  }
-  /** Auto generate kernels by blur & quality */
-  _generateKernels() {
-    const blur = Math.max(1, Math.round(this.strength));
-    const quality = Math.max(1, Math.round(this.quality));
-    const kernels = [blur];
-    if (blur > 0) {
-      let k = blur;
-      const step = blur / quality;
-      for (let i = 1; i < quality; i++) {
-        k -= step;
-        kernels.push(k);
-      }
-    }
-    this._kernels = kernels;
   }
   apply(renderer, source) {
-    const uvX = this.pixelSize[0] / source.width;
-    const uvY = this.pixelSize[1] / source.height;
-    let offset;
-    if (this.quality === 1 || this.strength === 0) {
-      offset = this._kernels[0] + 0.5;
+    const sx = 1 / source.width;
+    const sy = 1 / source.height;
+    const quality = Math.max(this.quality, 1);
+    for (let i = 0; i < quality; i++) {
       source.redraw(renderer, () => {
-        QuadUvGeometry.draw(renderer, this.material, {
+        QuadUvGeometry.draw(renderer, GaussianBlurEffect.materialX, {
           sampler: 0,
-          uOffset: [
-            offset * uvX,
-            offset * uvY
-          ],
-          uInputClamp: [0, 0, 1, 1]
+          uStrength: sx * (this.strength / quality)
         });
       });
-    } else {
-      const last = this.quality - 1;
-      for (let i = 0; i < last; i++) {
-        offset = this._kernels[i] + 0.5;
-        source.redraw(renderer, () => {
-          QuadUvGeometry.draw(renderer, this.material, {
-            sampler: 0,
-            uOffset: [
-              offset * uvX,
-              offset * uvY
-            ],
-            uInputClamp: [0, 0, 1, 1]
-          });
+    }
+    for (let i = 0; i < quality; i++) {
+      source.redraw(renderer, () => {
+        QuadUvGeometry.draw(renderer, GaussianBlurEffect.materialY, {
+          sampler: 0,
+          uStrength: sy * (this.strength / quality)
         });
-      }
-      offset = this._kernels[last] + 0.5;
-      QuadUvGeometry.draw(renderer, this.material, {
-        sampler: 0,
-        uOffset: [
-          offset * uvX,
-          offset * uvY
-        ],
-        uInputClamp: [0, 0, 1, 1]
       });
     }
   }
 };
-__decorateClass$w([
+__publicField$d(GaussianBlurEffect, "materialX", new Material({
+  vert: `attribute vec2 position;
+attribute vec2 uv;
+uniform float uStrength;
+varying vec2 vUv[9];
+
+void main(void) {
+  gl_Position = vec4(position, 0, 1);
+  vUv[0] = uv + vec2(-4.0 * uStrength, 0.0);
+  vUv[1] = uv + vec2(-3.0 * uStrength, 0.0);
+  vUv[2] = uv + vec2(-2.0 * uStrength, 0.0);
+  vUv[3] = uv + vec2(-1.0 * uStrength, 0.0);
+  vUv[4] = uv + vec2(0.0 * uStrength, 0.0);
+  vUv[5] = uv + vec2(1.0 * uStrength, 0.0);
+  vUv[6] = uv + vec2(2.0 * uStrength, 0.0);
+  vUv[7] = uv + vec2(3.0 * uStrength, 0.0);
+  vUv[8] = uv + vec2(4.0 * uStrength, 0.0);
+}`,
+  frag: frag$2
+}));
+__publicField$d(GaussianBlurEffect, "materialY", new Material({
+  vert: `attribute vec2 position;
+attribute vec2 uv;
+uniform float uStrength;
+varying vec2 vUv[9];
+
+void main(void) {
+  gl_Position = vec4(position, 0, 1);
+  vUv[0] = uv + vec2(0.0, -4.0 * uStrength);
+  vUv[1] = uv + vec2(0.0, -3.0 * uStrength);
+  vUv[2] = uv + vec2(0.0, -2.0 * uStrength);
+  vUv[3] = uv + vec2(0.0, -1.0 * uStrength);
+  vUv[4] = uv + vec2(0.0, 0.0 * uStrength);
+  vUv[5] = uv + vec2(0.0, 1.0 * uStrength);
+  vUv[6] = uv + vec2(0.0, 2.0 * uStrength);
+  vUv[7] = uv + vec2(0.0, 3.0 * uStrength);
+  vUv[8] = uv + vec2(0.0, 4.0 * uStrength);
+}`,
+  frag: frag$2
+}));
+__decorateClass$z([
   property({ default: 4 })
-], KawaseBlurEffect.prototype, "strength", 2);
-__decorateClass$w([
+], GaussianBlurEffect.prototype, "strength", 2);
+__decorateClass$z([
   property({ default: 3 })
-], KawaseBlurEffect.prototype, "quality", 2);
-__decorateClass$w([
-  property({ default: [1, 1] })
-], KawaseBlurEffect.prototype, "pixelSize", 2);
-KawaseBlurEffect = __decorateClass$w([
-  customNode("KawaseBlurEffect")
-], KawaseBlurEffect);
+], GaussianBlurEffect.prototype, "quality", 2);
+GaussianBlurEffect = __decorateClass$z([
+  customNode("GaussianBlurEffect")
+], GaussianBlurEffect);
 
-var __defProp$o = Object.defineProperty;
-var __getOwnPropDesc$u = Object.getOwnPropertyDescriptor;
-var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$v = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$u(target, key) : target;
+var __defProp$r = Object.defineProperty;
+var __getOwnPropDesc$v = Object.getOwnPropertyDescriptor;
+var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$r(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$y = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$v(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$o(target, key, result);
+  if (kind && result) __defProp$r(target, key, result);
   return result;
 };
 var __publicField$c = (obj, key, value) => __defNormalProp$c(obj, key + "" , value);
 let DropShadowEffect = class extends Effect {
-  kawaseBlurEffect = new KawaseBlurEffect();
+  blurEffect = new GaussianBlurEffect();
   viewport3 = new Viewport();
   _color = new Color();
   constructor(properties, children = []) {
@@ -7899,16 +7770,14 @@ let DropShadowEffect = class extends Effect {
       this._color.value = this.color;
       QuadUvGeometry.draw(renderer, DropShadowEffect.material, {
         sampler: 0,
-        uAlpha: this.alpha,
+        uAlpha: this._color.a,
         uColor: this._color.toArray().slice(0, 3),
-        uOffset: [-this.offset[0], this.offset[1]],
+        uOffset: [-this.offsetX, this.offsetY],
         uInputSize: [source.width, source.height, 1 / source.width, 1 / source.height]
       });
     });
-    this.kawaseBlurEffect.strength = this.blur;
-    this.kawaseBlurEffect.quality = this.quality;
-    this.kawaseBlurEffect.pixelSize = this.pixelSize;
-    this.kawaseBlurEffect.apply(renderer, this.viewport3);
+    this.blurEffect.strength = this.blur;
+    this.blurEffect.apply(renderer, this.viewport3);
     source.redraw(renderer, () => {
       this.viewport3.texture.activate(renderer, 1);
       QuadUvGeometry.draw(renderer, UvMaterial.instance, {
@@ -7947,40 +7816,34 @@ void main(void) {
   gl_FragColor = sample;
 }`
 }));
-__decorateClass$v([
-  property({ default: [4, 4] })
-], DropShadowEffect.prototype, "offset", 2);
-__decorateClass$v([
+__decorateClass$y([
   property({ default: 0 })
 ], DropShadowEffect.prototype, "color", 2);
-__decorateClass$v([
-  property({ default: 1 })
-], DropShadowEffect.prototype, "alpha", 2);
-__decorateClass$v([
-  property({ default: false })
-], DropShadowEffect.prototype, "shadowOnly", 2);
-__decorateClass$v([
-  property({ default: 2 })
+__decorateClass$y([
+  property({ default: 4 })
 ], DropShadowEffect.prototype, "blur", 2);
-__decorateClass$v([
+__decorateClass$y([
   property({ default: 4 })
-], DropShadowEffect.prototype, "quality", 2);
-__decorateClass$v([
-  property({ default: [1, 1] })
-], DropShadowEffect.prototype, "pixelSize", 2);
-DropShadowEffect = __decorateClass$v([
+], DropShadowEffect.prototype, "offsetX", 2);
+__decorateClass$y([
+  property({ default: 4 })
+], DropShadowEffect.prototype, "offsetY", 2);
+__decorateClass$y([
+  property({ default: false })
+], DropShadowEffect.prototype, "shadowOnly", 2);
+DropShadowEffect = __decorateClass$y([
   customNode("DropShadowEffect")
 ], DropShadowEffect);
 
-var __defProp$n = Object.defineProperty;
-var __getOwnPropDesc$t = Object.getOwnPropertyDescriptor;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$n(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$u = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$t(target, key) : target;
+var __defProp$q = Object.defineProperty;
+var __getOwnPropDesc$u = Object.getOwnPropertyDescriptor;
+var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$q(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$x = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$u(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$n(target, key, result);
+  if (kind && result) __defProp$q(target, key, result);
   return result;
 };
 var __publicField$b = (obj, key, value) => __defNormalProp$b(obj, key + "" , value);
@@ -8025,22 +7888,22 @@ void main(void) {
     gl_FragColor = vec4(color.rgb * alpha, alpha);
 }`
 }));
-__decorateClass$u([
+__decorateClass$x([
   property({ default: 5 })
 ], EmbossEffect.prototype, "strength", 2);
-EmbossEffect = __decorateClass$u([
+EmbossEffect = __decorateClass$x([
   customNode("EmbossEffect")
 ], EmbossEffect);
 
-var __defProp$m = Object.defineProperty;
-var __getOwnPropDesc$s = Object.getOwnPropertyDescriptor;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$t = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$s(target, key) : target;
+var __defProp$p = Object.defineProperty;
+var __getOwnPropDesc$t = Object.getOwnPropertyDescriptor;
+var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$p(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$w = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$t(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$m(target, key, result);
+  if (kind && result) __defProp$p(target, key, result);
   return result;
 };
 var __publicField$a = (obj, key, value) => __defNormalProp$a(obj, key + "" , value);
@@ -8214,46 +8077,46 @@ void main(void) {
   gl_FragColor.a = texture2D(sampler, coord).a;
 }`
 }));
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 10 })
 ], GlitchEffect.prototype, "slices", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 512 })
 ], GlitchEffect.prototype, "sampleSize", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 100 })
 ], GlitchEffect.prototype, "offset", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 0 })
 ], GlitchEffect.prototype, "direction", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 2 })
 ], GlitchEffect.prototype, "fillMode", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: 0 })
 ], GlitchEffect.prototype, "seed", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: [2, 2] })
 ], GlitchEffect.prototype, "red", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: [-10, 4] })
 ], GlitchEffect.prototype, "green", 2);
-__decorateClass$t([
+__decorateClass$w([
   property({ default: [10, -4] })
 ], GlitchEffect.prototype, "blue", 2);
-GlitchEffect = __decorateClass$t([
+GlitchEffect = __decorateClass$w([
   customNode("GlitchEffect")
 ], GlitchEffect);
 
-var __defProp$l = Object.defineProperty;
-var __getOwnPropDesc$r = Object.getOwnPropertyDescriptor;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$s = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$r(target, key) : target;
+var __defProp$o = Object.defineProperty;
+var __getOwnPropDesc$s = Object.getOwnPropertyDescriptor;
+var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$v = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$s(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$l(target, key, result);
+  if (kind && result) __defProp$o(target, key, result);
   return result;
 };
 var __publicField$9 = (obj, key, value) => __defNormalProp$9(obj, key + "" , value);
@@ -8431,40 +8294,151 @@ void main(void) {
   gl_FragColor = vec4(color.rgb + mist.rgb, color.a);
 }`
 }));
-__decorateClass$s([
+__decorateClass$v([
   property({ default: 0 })
 ], GodrayEffect.prototype, "time", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: 30 })
 ], GodrayEffect.prototype, "angle", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: 0.5 })
 ], GodrayEffect.prototype, "gain", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: 2.5 })
 ], GodrayEffect.prototype, "lacunarity", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: true })
 ], GodrayEffect.prototype, "parallel", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: [0, 0] })
 ], GodrayEffect.prototype, "center", 2);
-__decorateClass$s([
+__decorateClass$v([
   property({ default: 1 })
 ], GodrayEffect.prototype, "alpha", 2);
-GodrayEffect = __decorateClass$s([
+GodrayEffect = __decorateClass$v([
   customNode("GodrayEffect")
 ], GodrayEffect);
 
-var __defProp$k = Object.defineProperty;
+var __defProp$n = Object.defineProperty;
+var __getOwnPropDesc$r = Object.getOwnPropertyDescriptor;
+var __decorateClass$u = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$r(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp$n(target, key, result);
+  return result;
+};
+const frag$1 = `varying vec2 vUv;
+uniform sampler2D sampler;
+uniform vec2 uOffset;
+
+void main(void) {
+    vec4 color = vec4(0.0);
+    color += texture2D(sampler, vec2(vUv.x - uOffset.x, vUv.y + uOffset.y));
+    color += texture2D(sampler, vec2(vUv.x + uOffset.x, vUv.y + uOffset.y));
+    color += texture2D(sampler, vec2(vUv.x + uOffset.x, vUv.y - uOffset.y));
+    color += texture2D(sampler, vec2(vUv.x - uOffset.x, vUv.y - uOffset.y));
+    color *= 0.25;
+    gl_FragColor = color;
+}`;
+const clampFrag = `precision highp float;
+varying vec2 vUv;
+uniform sampler2D sampler;
+uniform vec2 uOffset;
+uniform vec4 uInputClamp;
+void main(void) {
+    vec4 color = vec4(0.0);
+    color += texture2D(sampler, clamp(vec2(vUv.x - uOffset.x, vUv.y + uOffset.y), uInputClamp.xy, uInputClamp.zw));
+    color += texture2D(sampler, clamp(vec2(vUv.x + uOffset.x, vUv.y + uOffset.y), uInputClamp.xy, uInputClamp.zw));
+    color += texture2D(sampler, clamp(vec2(vUv.x + uOffset.x, vUv.y - uOffset.y), uInputClamp.xy, uInputClamp.zw));
+    color += texture2D(sampler, clamp(vec2(vUv.x - uOffset.x, vUv.y - uOffset.y), uInputClamp.xy, uInputClamp.zw));
+    color *= 0.25;
+    gl_FragColor = color;
+}`;
+let KawaseBlurEffect = class extends Effect {
+  material;
+  _kernels = [0];
+  constructor(properties, children = []) {
+    super();
+    this.material = new Material({
+      vert: `precision mediump float;
+attribute vec2 position;
+attribute vec2 uv;
+varying vec2 vUv;
+void main() {
+  gl_Position = vec4(position, 0.0, 1.0);
+  vUv = uv;
+}`,
+      frag: properties?.clamp ? clampFrag : frag$1
+    });
+    this.setProperties(properties).append(children);
+    this._generateKernels();
+  }
+  _updateProperty(key, value, oldValue, declaration) {
+    super._updateProperty(key, value, oldValue, declaration);
+    switch (key) {
+      case "quality":
+      case "strength":
+        this._generateKernels();
+        break;
+    }
+  }
+  /** Auto generate kernels by blur & quality */
+  _generateKernels() {
+    const blur = Math.max(1, Math.round(this.strength));
+    const quality = Math.max(1, Math.round(this.quality));
+    const kernels = [blur];
+    if (blur > 0) {
+      let k = blur;
+      const step = blur / quality;
+      for (let i = 1; i < quality; i++) {
+        k -= step;
+        kernels.push(k);
+      }
+    }
+    this._kernels = kernels;
+  }
+  apply(renderer, source) {
+    const uvX = this.pixelSize[0] / source.width;
+    const uvY = this.pixelSize[1] / source.height;
+    this._kernels.forEach((kernel) => {
+      const offset = kernel + 0.5;
+      source.redraw(renderer, () => {
+        QuadUvGeometry.draw(renderer, this.material, {
+          sampler: 0,
+          uOffset: [
+            offset * uvX,
+            offset * uvY
+          ],
+          uInputClamp: [0, 0, 1, 1]
+        });
+      });
+    });
+  }
+};
+__decorateClass$u([
+  property({ default: 4 })
+], KawaseBlurEffect.prototype, "strength", 2);
+__decorateClass$u([
+  property({ default: 3 })
+], KawaseBlurEffect.prototype, "quality", 2);
+__decorateClass$u([
+  property({ default: [1, 1] })
+], KawaseBlurEffect.prototype, "pixelSize", 2);
+KawaseBlurEffect = __decorateClass$u([
+  customNode("KawaseBlurEffect")
+], KawaseBlurEffect);
+
+var __defProp$m = Object.defineProperty;
 var __getOwnPropDesc$q = Object.getOwnPropertyDescriptor;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$r = (decorators, target, key, kind) => {
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$t = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$q(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$k(target, key, result);
+  if (kind && result) __defProp$m(target, key, result);
   return result;
 };
 var __publicField$8 = (obj, key, value) => __defNormalProp$8(obj, key + "" , value);
@@ -8553,25 +8527,25 @@ void main(void) {
   }
 }`
 }));
-__decorateClass$r([
+__decorateClass$t([
   protectedProperty()
 ], MaskEffect.prototype, "texture", 2);
-__decorateClass$r([
+__decorateClass$t([
   property({ default: "" })
 ], MaskEffect.prototype, "src", 2);
-MaskEffect = __decorateClass$r([
+MaskEffect = __decorateClass$t([
   customNode("MaskEffect")
 ], MaskEffect);
 
-var __defProp$j = Object.defineProperty;
+var __defProp$l = Object.defineProperty;
 var __getOwnPropDesc$p = Object.getOwnPropertyDescriptor;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$q = (decorators, target, key, kind) => {
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$s = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$p(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$j(target, key, result);
+  if (kind && result) __defProp$l(target, key, result);
   return result;
 };
 var __publicField$7 = (obj, key, value) => __defNormalProp$7(obj, typeof key !== "symbol" ? key + "" : key, value);
@@ -8645,11 +8619,11 @@ void main() {
       QuadUvGeometry.draw(renderer, this.material, {
         sampler: 0,
         uThickness: [
-          this.thickness / source.width,
-          this.thickness / source.height
+          this.width / source.width,
+          this.width / source.height
         ],
         uColor: this._color.toArray().slice(0, 3),
-        uAlpha: this.alpha,
+        uAlpha: this.opacity !== 1 ? this.opacity : this._color.a,
         uAngleStep: OutlineEffect.getAngleStep(this.quality),
         uKnockout: this.knockout ? 1 : 0,
         uInputClamp: [0, 0, 1, 1]
@@ -8659,34 +8633,40 @@ void main() {
 };
 __publicField$7(OutlineEffect, "MIN_SAMPLES", 1);
 __publicField$7(OutlineEffect, "MAX_SAMPLES", 100);
-__decorateClass$q([
-  property({ default: 1 })
-], OutlineEffect.prototype, "thickness", 2);
-__decorateClass$q([
+__decorateClass$s([
   property({ default: 0 })
 ], OutlineEffect.prototype, "color", 2);
-__decorateClass$q([
+__decorateClass$s([
   property({ default: 1 })
-], OutlineEffect.prototype, "alpha", 2);
-__decorateClass$q([
+], OutlineEffect.prototype, "width", 2);
+__decorateClass$s([
+  property({ default: "solid" })
+], OutlineEffect.prototype, "style", 2);
+__decorateClass$s([
+  property()
+], OutlineEffect.prototype, "image", 2);
+__decorateClass$s([
+  property({ default: 1 })
+], OutlineEffect.prototype, "opacity", 2);
+__decorateClass$s([
   property({ default: 0.1 })
 ], OutlineEffect.prototype, "quality", 2);
-__decorateClass$q([
+__decorateClass$s([
   property({ default: false })
 ], OutlineEffect.prototype, "knockout", 2);
-OutlineEffect = __decorateClass$q([
+OutlineEffect = __decorateClass$s([
   customNode("OutlineEffect")
 ], OutlineEffect);
 
-var __defProp$i = Object.defineProperty;
+var __defProp$k = Object.defineProperty;
 var __getOwnPropDesc$o = Object.getOwnPropertyDescriptor;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$p = (decorators, target, key, kind) => {
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$r = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$o(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$i(target, key, result);
+  if (kind && result) __defProp$k(target, key, result);
   return result;
 };
 var __publicField$6 = (obj, key, value) => __defNormalProp$6(obj, key + "" , value);
@@ -8742,22 +8722,22 @@ void main(void) {
   gl_FragColor = texture2D(sampler, coord);
 }`
 }));
-__decorateClass$p([
+__decorateClass$r([
   property({ default: 10 })
 ], PixelateEffect.prototype, "strength", 2);
-PixelateEffect = __decorateClass$p([
+PixelateEffect = __decorateClass$r([
   customNode("PixelateEffect")
 ], PixelateEffect);
 
-var __defProp$h = Object.defineProperty;
+var __defProp$j = Object.defineProperty;
 var __getOwnPropDesc$n = Object.getOwnPropertyDescriptor;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __decorateClass$o = (decorators, target, key, kind) => {
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decorateClass$q = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$n(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$h(target, key, result);
+  if (kind && result) __defProp$j(target, key, result);
   return result;
 };
 var __publicField$5 = (obj, key, value) => __defNormalProp$5(obj, key + "" , value);
@@ -8766,11 +8746,18 @@ let ZoomBlurEffect = class extends Effect {
     super();
     this.setProperties(properties).append(children);
   }
-  apply(renderer, source) {
+  apply(renderer, source, context) {
+    let center = this.center;
+    if (context.targetArea) {
+      center = [
+        (context.targetArea[0] + context.targetArea[2] / 2) * source.width,
+        (context.targetArea[1] + context.targetArea[3] / 2) * source.height
+      ];
+    }
     source.redraw(renderer, () => {
       QuadUvGeometry.draw(renderer, ZoomBlurEffect.material, {
         sampler: 0,
-        uCenter: this.center ?? [source.width / 2, source.height / 2],
+        uCenter: center ?? [source.width / 2, source.height / 2],
         uInnerRadius: this.innerRadius,
         uRadius: this.radius,
         uStrength: this.strength,
@@ -8863,22 +8850,134 @@ void main() {
   gl_FragColor = color;
 }`
 }));
-__decorateClass$o([
+__decorateClass$q([
   property()
 ], ZoomBlurEffect.prototype, "center", 2);
-__decorateClass$o([
+__decorateClass$q([
   property({ default: 20 })
 ], ZoomBlurEffect.prototype, "innerRadius", 2);
-__decorateClass$o([
+__decorateClass$q([
   property({ default: -1 })
 ], ZoomBlurEffect.prototype, "radius", 2);
-__decorateClass$o([
+__decorateClass$q([
   property({ default: 0.1 })
 ], ZoomBlurEffect.prototype, "strength", 2);
-ZoomBlurEffect = __decorateClass$o([
+ZoomBlurEffect = __decorateClass$q([
   customNode("ZoomBlurEffect")
 ], ZoomBlurEffect);
 
+var __defProp$i = Object.defineProperty;
+var __decorateClass$p = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp$i(target, key, result);
+  return result;
+};
+class BaseElement2DOutline extends CoreObject {
+  constructor(parent) {
+    super();
+    this.parent = parent;
+  }
+  _updateProperty(key, value, oldValue, declaration) {
+    super._updateProperty(key, value, oldValue, declaration);
+    switch (key) {
+      case "color":
+      case "width":
+      case "style":
+      case "image":
+      case "opacity":
+        this.updateEffect();
+        break;
+    }
+  }
+  updateEffect() {
+    const name = "__$outline";
+    let effect = this.parent.getNode(name);
+    if (this.width) {
+      if (!effect) {
+        effect = new OutlineEffect({ name });
+        this.parent.appendChild(effect, "back");
+      }
+      effect.setProperties(this.getProperties());
+    } else {
+      if (effect) {
+        this.parent.removeChild(effect);
+      }
+    }
+  }
+}
+__decorateClass$p([
+  property({ default: "#000000" })
+], BaseElement2DOutline.prototype, "color");
+__decorateClass$p([
+  property({ default: 0 })
+], BaseElement2DOutline.prototype, "width");
+__decorateClass$p([
+  property({ default: "solid" })
+], BaseElement2DOutline.prototype, "style");
+__decorateClass$p([
+  property()
+], BaseElement2DOutline.prototype, "image");
+__decorateClass$p([
+  property({ default: 1 })
+], BaseElement2DOutline.prototype, "opacity");
+
+var __defProp$h = Object.defineProperty;
+var __decorateClass$o = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp$h(target, key, result);
+  return result;
+};
+class BaseElement2DShadow extends CoreObject {
+  constructor(parent) {
+    super();
+    this.parent = parent;
+  }
+  _updateProperty(key, value, oldValue, declaration) {
+    super._updateProperty(key, value, oldValue, declaration);
+    switch (key) {
+      case "color":
+      case "blur":
+      case "offsetX":
+      case "offsetY":
+        this.updateEffect();
+        break;
+    }
+  }
+  updateEffect() {
+    const name = "__$shadow";
+    let effect = this.parent.getNode(name);
+    if (this.blur || this.offsetX || this.offsetY) {
+      if (!effect) {
+        effect = new DropShadowEffect({ name });
+        this.parent.appendChild(effect, "back");
+      }
+      effect.setProperties(this.getProperties());
+    } else {
+      if (effect) {
+        this.parent.removeChild(effect);
+      }
+    }
+  }
+}
+__decorateClass$o([
+  property({ default: "#000000" })
+], BaseElement2DShadow.prototype, "color");
+__decorateClass$o([
+  property({ default: 0 })
+], BaseElement2DShadow.prototype, "blur");
+__decorateClass$o([
+  property({ default: 0 })
+], BaseElement2DShadow.prototype, "offsetY");
+__decorateClass$o([
+  property({ default: 0 })
+], BaseElement2DShadow.prototype, "offsetX");
+
 class BaseElement2DStyle extends Resource {
   _backgroundColor = new Color();
   constructor(properties) {
@@ -9020,6 +9119,8 @@ let BaseElement2D = class extends Node2D {
     this._style?.off("updateProperty", cb);
     this._style = style;
   }
+  shadow = new BaseElement2DShadow(this);
+  outline = new BaseElement2DOutline(this);
   constructor(properties, nodes = []) {
     super();
     this._updateStyleProperty = this._updateStyleProperty.bind(this);
@@ -9028,8 +9129,10 @@ let BaseElement2D = class extends Node2D {
   }
   setProperties(properties) {
     if (properties) {
-      const { style, ...restProperties } = properties;
+      const { style, shadow, outline, ...restProperties } = properties;
       style && this.style.setProperties(style);
+      shadow && this.shadow.setProperties(shadow);
+      outline && this.outline.setProperties(outline);
       super.setProperties(restProperties);
     }
     return this;
@@ -9086,9 +9189,6 @@ let BaseElement2D = class extends Node2D {
       case "filter":
         this.requestRepaint();
         break;
-      case "boxShadow":
-        this._updateBoxShadow();
-        break;
       case "maskImage":
         this._updateMaskImage();
         break;
@@ -9097,20 +9197,6 @@ let BaseElement2D = class extends Node2D {
         break;
     }
   }
-  _updateBoxShadow() {
-    const nodePath = "__$style.shadow";
-    if (this.style.boxShadow !== "none") {
-      const node = this.getNode(nodePath);
-      if (node) ; else {
-        this.appendChild(new DropShadowEffect({ name: nodePath }), "back");
-      }
-    } else {
-      const node = this.getNode(nodePath);
-      if (node) {
-        this.removeChild(node);
-      }
-    }
-  }
   _updateMaskImage() {
     const nodePath = "__$style.maskImage";
     const maskImage = this.style.maskImage;
@@ -9313,6 +9399,8 @@ let BaseElement2D = class extends Node2D {
       ...json,
       props: {
         style: this.style.toJSON(),
+        shadow: this.shadow.toJSON(),
+        outline: this.outline.toJSON(),
         ...json.props
       }
     };
@@ -13531,4 +13619,4 @@ async function render(options) {
   });
 }
 
-export { AnimatedTexture, Animation, Assets, Audio, AudioPipeline, AudioProcessor, AudioSpectrum, AudioWaveform, BaseElement2D, BaseElement2DStyle, BlurEffect, CanvasContext, CanvasItem, CanvasItemEditor, CanvasTexture, Color, ColorAdjustEffect, ColorFilterEffect, ColorMatrix, ColorOverlayEffect, ColorRemoveEffect, ColorReplaceEffect, ColorTexture, Control, CoreObject, DEG_TO_RAD, DEVICE_PIXEL_RATIO, DropShadowEffect, Effect, EffectMaterial, Element2D, Element2DStyle, EmbossEffect, Engine, EventEmitter, FlexElement2D, FlexElement2DStyle, FlexLayout, FontLoader, GIFLoader, Geometry, GlitchEffect, GodrayEffect, Graphics2D, HTMLAudio, HTMLAudioContext, HTMLSound, IN_BROWSER, Image2D, ImageTexture, IndexBuffer, Input, InputEvent, JSONLoader, KawaseBlurEffect, KawaseTransition, LeftEraseTransition, Loader, Lottie2D, LottieLoader, MainLoop, MaskEffect, Material, Matrix, Matrix2, Matrix3, Matrix4, MouseInputEvent, Node, Node2D, OutlineEffect, PI, PI_2, PixelateEffect, PixelsTexture, PointerInputEvent, Projection2D, QuadGeometry, QuadUvGeometry, RAD_TO_DEG, Range, RawWeakMap, Rect2, RefCounted, Renderer, Resource, Ruler, SUPPORTS_AUDIO_CONTEXT, SUPPORTS_CLICK_EVENTS, SUPPORTS_CREATE_IMAGE_BITMAP, SUPPORTS_IMAGE_BITMAP, SUPPORTS_MOUSE_EVENTS, SUPPORTS_OFFLINE_AUDIO_CONTEXT, SUPPORTS_POINTER_EVENTS, SUPPORTS_RESIZE_OBSERVER, SUPPORTS_TOUCH_EVENTS, SUPPORTS_WEBGL2, SUPPORTS_WEBKIT_AUDIO_CONTEXT, SUPPORTS_WEBKIT_OFFLINE_AUDIO_CONTEXT, SUPPORTS_WEB_AUDIO, SUPPORTS_WHEEL_EVENTS, Scaler, SceneTree, ScrollBar, Text2D, TextLoader, Texture2D, TextureLoader, TextureRect2D, Ticker, TiltShiftTransition, Timeline, TimelineNode, Transform2D, TransformRect2D, Transition, TwistTransition, UvGeometry, UvMaterial, Vector, Vector2, Vector3, Vector4, VertexAttribute, VertexBuffer, Video2D, VideoLoader, VideoTexture, Viewport, ViewportTexture, WebAudio, WebAudioContext, WebGLBatch2DModule, WebGLBlendMode, WebGLBufferModule, WebGLFramebufferModule, WebGLMaskModule, WebGLModule, WebGLProgramModule, WebGLRenderer, WebGLScissorModule, WebGLState, WebGLStateModule, WebGLStencilModule, WebGLTextureModule, WebGLVertexArrayModule, WebGLViewportModule, WebSound, WheelInputEvent, XScrollBar, YScrollBar, ZoomBlurEffect, assets, clamp, clampFrag, createHTMLCanvas, createNode, crossOrigin, cubicBezier, curves, customNode, customNodes, defaultOptions, defineProperty, determineCrossOrigin, ease, easeIn, easeInOut, easeOut, frag$1 as frag, getDeclarations, getDefaultCssPropertyValue, isCanvasElement, isElementNode, isImageElement, isPow2, isVideoElement, isWebgl2, lerp, linear, log2, mapWebGLBlendModes, nextPow2, nextTick, parseCSSFilter, parseCSSTransform, parseCSSTransformOrigin, parseCssFunctions, parseCssProperty, property, protectedProperty, render, timingFunctions, uid };
+export { AnimatedTexture, Animation, Assets, Audio, AudioPipeline, AudioProcessor, AudioSpectrum, AudioWaveform, BaseElement2D, BaseElement2DStyle, CanvasContext, CanvasItem, CanvasItemEditor, CanvasTexture, Color, ColorAdjustEffect, ColorFilterEffect, ColorMatrix, ColorOverlayEffect, ColorRemoveEffect, ColorReplaceEffect, ColorTexture, Control, CoreObject, DEG_TO_RAD, DEVICE_PIXEL_RATIO, DropShadowEffect, Effect, EffectMaterial, Element2D, Element2DStyle, EmbossEffect, Engine, EventEmitter, FlexElement2D, FlexElement2DStyle, FlexLayout, FontLoader, GIFLoader, GaussianBlurEffect, Geometry, GlitchEffect, GodrayEffect, Graphics2D, HTMLAudio, HTMLAudioContext, HTMLSound, IN_BROWSER, Image2D, ImageTexture, IndexBuffer, Input, InputEvent, JSONLoader, KawaseBlurEffect, KawaseTransition, LeftEraseTransition, Loader, Lottie2D, LottieLoader, MainLoop, MaskEffect, Material, Matrix, Matrix2, Matrix3, Matrix4, MouseInputEvent, Node, Node2D, OutlineEffect, PI, PI_2, PixelateEffect, PixelsTexture, PointerInputEvent, Projection2D, QuadGeometry, QuadUvGeometry, RAD_TO_DEG, Range, RawWeakMap, Rect2, RefCounted, Renderer, Resource, Ruler, SUPPORTS_AUDIO_CONTEXT, SUPPORTS_CLICK_EVENTS, SUPPORTS_CREATE_IMAGE_BITMAP, SUPPORTS_IMAGE_BITMAP, SUPPORTS_MOUSE_EVENTS, SUPPORTS_OFFLINE_AUDIO_CONTEXT, SUPPORTS_POINTER_EVENTS, SUPPORTS_RESIZE_OBSERVER, SUPPORTS_TOUCH_EVENTS, SUPPORTS_WEBGL2, SUPPORTS_WEBKIT_AUDIO_CONTEXT, SUPPORTS_WEBKIT_OFFLINE_AUDIO_CONTEXT, SUPPORTS_WEB_AUDIO, SUPPORTS_WHEEL_EVENTS, Scaler, SceneTree, ScrollBar, Text2D, TextLoader, Texture2D, TextureLoader, TextureRect2D, Ticker, TiltShiftTransition, Timeline, TimelineNode, Transform2D, TransformRect2D, Transition, TwistTransition, UvGeometry, UvMaterial, Vector, Vector2, Vector3, Vector4, VertexAttribute, VertexBuffer, Video2D, VideoLoader, VideoTexture, Viewport, ViewportTexture, WebAudio, WebAudioContext, WebGLBatch2DModule, WebGLBlendMode, WebGLBufferModule, WebGLFramebufferModule, WebGLMaskModule, WebGLModule, WebGLProgramModule, WebGLRenderer, WebGLScissorModule, WebGLState, WebGLStateModule, WebGLStencilModule, WebGLTextureModule, WebGLVertexArrayModule, WebGLViewportModule, WebSound, WheelInputEvent, XScrollBar, YScrollBar, ZoomBlurEffect, assets, clamp, clampFrag, createHTMLCanvas, createNode, crossOrigin, cubicBezier, curves, customNode, customNodes, defaultOptions, defineProperty, determineCrossOrigin, ease, easeIn, easeInOut, easeOut, frag$1 as frag, getDeclarations, getDefaultCssPropertyValue, isCanvasElement, isElementNode, isImageElement, isPow2, isVideoElement, isWebgl2, lerp, linear, log2, mapWebGLBlendModes, nextPow2, nextTick, parseCSSFilter, parseCSSTransform, parseCSSTransformOrigin, parseCssFunctions, parseCssProperty, property, protectedProperty, render, timingFunctions, uid };