@visactor/vrender 1.0.12 → 1.0.13

package/dist/index.es.js

@@ -4609,6 +4609,34 @@ class GradientParser {
     }
     return c;
   }
+  static processColorStops(colorStops) {
+    if (!colorStops || 0 === colorStops.length) return [];
+    if (colorStops.some(item => item.length)) {
+      const stops = colorStops.map(item => ({
+        color: item.value,
+        offset: item.length ? parseFloat(item.length.value) / 100 : -1
+      }));
+      stops[0].offset < 0 && (stops[0].offset = 0), stops[stops.length - 1].offset < 0 && (stops[stops.length - 1].offset = 1);
+      for (let i = 1; i < stops.length - 1; i++) if (stops[i].offset < 0) {
+        const prevWithOffsetIdx = i - 1;
+        let nextWithOffsetIdx = i + 1;
+        for (; nextWithOffsetIdx < stops.length && stops[nextWithOffsetIdx].offset < 0;) nextWithOffsetIdx++;
+        const startOffset = stops[prevWithOffsetIdx].offset,
+          endOffset = stops[nextWithOffsetIdx].offset,
+          unspecCount = nextWithOffsetIdx - prevWithOffsetIdx;
+        for (let j = 1; j < unspecCount; j++) stops[prevWithOffsetIdx + j].offset = startOffset + (endOffset - startOffset) * j / unspecCount;
+        i = nextWithOffsetIdx - 1;
+      }
+      return stops;
+    }
+    return colorStops.map((item, index) => {
+      const offset = colorStops.length > 1 ? index / (colorStops.length - 1) : 0;
+      return {
+        color: item.value,
+        offset: offset
+      };
+    });
+  }
   static ParseConic(datum) {
     const {
         orientation: orientation,
@@ -4622,10 +4650,7 @@ class GradientParser {
       y: .5,
       startAngle: sa,
       endAngle: sa + pi2,
-      stops: colorStops.map(item => ({
-        color: item.value,
-        offset: parseFloat(item.length.value) / 100
-      }))
+      stops: GradientParser.processColorStops(colorStops)
     };
   }
   static ParseRadial(datum) {
@@ -4640,10 +4665,7 @@ class GradientParser {
       y1: .5,
       r0: 0,
       r1: 1,
-      stops: colorStops.map(item => ({
-        color: item.value,
-        offset: parseFloat(item.length.value) / 100
-      }))
+      stops: GradientParser.processColorStops(colorStops)
     };
   }
   static ParseLinear(datum) {
@@ -4665,10 +4687,7 @@ class GradientParser {
       y0: y0,
       x1: x1,
       y1: y1,
-      stops: colorStops.map(item => ({
-        color: item.value,
-        offset: parseFloat(item.length.value) / 100
-      }))
+      stops: GradientParser.processColorStops(colorStops)
     };
   }
 }
@@ -12397,7 +12416,7 @@ class RichText extends Graphic {
       case "right":
         deltaX = -aabbBounds.width();
     }
-    return aabbBounds.translate(deltaX, deltaY), application.graphicService.updateTempAABBBounds(aabbBounds), null == attribute.forceBoundsHeight && null == attribute.forceBoundsWidth || application.graphicService.updateHTMLTextAABBBounds(attribute, richtextTheme, aabbBounds), this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1, this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1, application.graphicService.transformAABBBounds(attribute, aabbBounds, richtextTheme, !1, this), 0 === aabbBounds.width() && 0 === aabbBounds.height() && aabbBounds.clear(), aabbBounds;
+    return height || ("middle" === this.verticalDirection ? deltaY -= aabbBounds.height() / 2 : "bottom" === this.verticalDirection && (deltaY -= aabbBounds.height())), aabbBounds.translate(deltaX, deltaY), application.graphicService.updateTempAABBBounds(aabbBounds), null == attribute.forceBoundsHeight && null == attribute.forceBoundsWidth || application.graphicService.updateHTMLTextAABBBounds(attribute, richtextTheme, aabbBounds), this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1, this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1, application.graphicService.transformAABBBounds(attribute, aabbBounds, richtextTheme, !1, this), 0 === aabbBounds.width() && 0 === aabbBounds.height() && aabbBounds.clear(), aabbBounds;
   }
   needUpdateTags(keys) {
     return super.needUpdateTags(keys, RICHTEXT_UPDATE_TAG_KEY);
@@ -19161,6 +19180,7 @@ class RichTextEditPlugin {
     }));
   }
   tryShowInputBounds() {
+    var _a, _b;
     if (!this.currRt || !this.focusing) return;
     const {
         editOptions = {}
@@ -19176,6 +19196,8 @@ class RichTextEditPlugin {
     this.shadowBounds = this.shadowBounds || createRect({}), this.shadowBounds.setAttributes({
       x: 0,
       y: 0,
+      scaleX: 1 / (null !== (_a = this.currRt.attribute.scaleX) && void 0 !== _a ? _a : 1),
+      scaleY: 1 / (null !== (_b = this.currRt.attribute.scaleY) && void 0 !== _b ? _b : 1),
       width: width,
       height: height,
       fill: !1,
@@ -19277,7 +19299,9 @@ class RichTextEditPlugin {
         y2 = getRichTextBounds(Object.assign(Object.assign({}, target.attribute), {
           textConfig: [{
             text: "a"
-          }]
+          }],
+          scaleX: 1,
+          scaleY: 1
         })).height();
       this.startCursorPos = {
         x: x,
@@ -19313,7 +19337,10 @@ class RichTextEditPlugin {
       textConfig: [{
         text: "a"
       }]
-    })), b = getRichTextBounds(attr)), "middle" === textBaseline ? dy = -b.height() / 2 : "bottom" === textBaseline && (dy = -b.height()), this.editLine && this.editLine.setAttributes({
+    })), b = getRichTextBounds(Object.assign(Object.assign({}, attr), {
+      scaleX: 1,
+      scaleY: 1
+    }))), "middle" === textBaseline ? dy = -b.height() / 2 : "bottom" === textBaseline && (dy = -b.height()), this.editLine && this.editLine.setAttributes({
       dy: dy
     }), this.editBg && this.editBg.setAttributes({
       dy: dy
@@ -19510,9 +19537,15 @@ class RichTextEditPlugin {
       } = rt.attribute;
     let dy = 0;
     if ("middle" === textBaseline) {
-      dy = getRichTextBounds(rt.attribute).height() / 2;
+      dy = getRichTextBounds(Object.assign(Object.assign({}, rt.attribute), {
+        scaleX: 1,
+        scaleY: 1
+      })).height() / 2;
     } else if ("bottom" === textBaseline) {
-      dy = getRichTextBounds(rt.attribute).height();
+      dy = getRichTextBounds(Object.assign(Object.assign({}, rt.attribute), {
+        scaleX: 1,
+        scaleY: 1
+      })).height();
     }
     return p1.y += dy, p1;
   }
@@ -30497,8 +30530,6 @@ class WaitStep extends Step {
   }
   onStart() {
     super.onStart();
-  }
-  onFirstRun() {
     const fromProps = this.getFromProps();
     this.target.setAttributes(fromProps);
   }
@@ -35143,11 +35174,1280 @@ class StreamLight extends ACustomAnimate {
   }
 }
 
+class DisappearAnimateBase extends AStageAnimate {
+  constructor(from, to, duration, easing, params) {
+    super(from, to, duration, easing, params), this.webglCanvas = null, this.gl = null, this.program = null, this.currentAnimationRatio = 0, this.animationTime = 0;
+  }
+  onUpdate(end, ratio, out) {
+    super.onUpdate(end, ratio, out), this.currentAnimationRatio = ratio, this.animationTime = ratio * Math.PI * 2;
+  }
+  getAnimationTime() {
+    return this.currentAnimationRatio > 0 ? this.animationTime : Date.now() / 1e3;
+  }
+  getDurationFromParent() {
+    return this.duration || 1e3;
+  }
+  initWebGL(canvas) {
+    try {
+      if (this.webglCanvas = vglobal.createCanvas({
+        width: canvas.width,
+        height: canvas.height,
+        dpr: vglobal.devicePixelRatio
+      }), !this.webglCanvas) return console.warn("WebGL canvas creation failed"), !1;
+      this.webglCanvas.style.width = canvas.style.width || `${canvas.width}px`, this.webglCanvas.style.height = canvas.style.height || `${canvas.height}px`;
+      let glContext = null;
+      try {
+        glContext = this.webglCanvas.getContext("webgl"), glContext || (glContext = this.webglCanvas.getContext("experimental-webgl"));
+      } catch (e) {
+        console.warn("Failed to get WebGL context:", e);
+      }
+      if (this.gl = glContext, !this.gl) return console.warn("WebGL not supported"), !1;
+      const shaders = this.getShaderSources();
+      return this.program = this.createShaderProgram(shaders.vertex, shaders.fragment), null !== this.program;
+    } catch (error) {
+      return console.warn("Failed to initialize WebGL:", error), !1;
+    }
+  }
+  createShaderProgram(vertexSource, fragmentSource) {
+    if (!this.gl) return null;
+    const vertexShader = this.createShader(this.gl.VERTEX_SHADER, vertexSource),
+      fragmentShader = this.createShader(this.gl.FRAGMENT_SHADER, fragmentSource);
+    if (!vertexShader || !fragmentShader) return null;
+    const program = this.gl.createProgram();
+    return program ? (this.gl.attachShader(program, vertexShader), this.gl.attachShader(program, fragmentShader), this.gl.linkProgram(program), this.gl.getProgramParameter(program, this.gl.LINK_STATUS) ? program : (console.error("Shader program link error:", this.gl.getProgramInfoLog(program)), null)) : null;
+  }
+  createShader(type, source) {
+    if (!this.gl) return null;
+    const shader = this.gl.createShader(type);
+    return shader ? (this.gl.shaderSource(shader, source), this.gl.compileShader(shader), this.gl.getShaderParameter(shader, this.gl.COMPILE_STATUS) ? shader : (console.error("Shader compile error:", this.gl.getShaderInfoLog(shader)), this.gl.deleteShader(shader), null)) : null;
+  }
+  setupWebGLState(canvas) {
+    this.gl && this.webglCanvas && (this.webglCanvas.width === canvas.width && this.webglCanvas.height === canvas.height || (this.webglCanvas.width = canvas.width, this.webglCanvas.height = canvas.height), this.gl.viewport(0, 0, this.webglCanvas.width, this.webglCanvas.height), this.gl.clearColor(0, 0, 0, 0), this.gl.clear(this.gl.COLOR_BUFFER_BIT));
+  }
+  createFullScreenQuad() {
+    if (!this.gl) return null;
+    const vertices = new Float32Array([-1, -1, 0, 1, 1, -1, 1, 1, -1, 1, 0, 0, 1, 1, 1, 0]),
+      vertexBuffer = this.gl.createBuffer();
+    return this.gl.bindBuffer(this.gl.ARRAY_BUFFER, vertexBuffer), this.gl.bufferData(this.gl.ARRAY_BUFFER, vertices, this.gl.STATIC_DRAW), vertexBuffer;
+  }
+  createTextureFromCanvas(canvas) {
+    if (!this.gl) return null;
+    const texture = this.gl.createTexture();
+    return this.gl.activeTexture(this.gl.TEXTURE0), this.gl.bindTexture(this.gl.TEXTURE_2D, texture), this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, this.gl.RGBA, this.gl.UNSIGNED_BYTE, canvas), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_T, this.gl.CLAMP_TO_EDGE), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.LINEAR), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR), texture;
+  }
+  setupVertexAttributes() {
+    if (!this.gl || !this.program) return;
+    const positionLocation = this.gl.getAttribLocation(this.program, "a_position"),
+      texCoordLocation = this.gl.getAttribLocation(this.program, "a_texCoord");
+    this.gl.enableVertexAttribArray(positionLocation), this.gl.vertexAttribPointer(positionLocation, 2, this.gl.FLOAT, !1, 16, 0), this.gl.enableVertexAttribArray(texCoordLocation), this.gl.vertexAttribPointer(texCoordLocation, 2, this.gl.FLOAT, !1, 16, 8);
+  }
+  createOutputCanvas(canvas) {
+    const outputCanvas = vglobal.createCanvas({
+        width: canvas.width,
+        height: canvas.height,
+        dpr: vglobal.devicePixelRatio
+      }),
+      ctx = outputCanvas.getContext("2d");
+    return ctx ? (ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.drawImage(canvas, 0, 0), {
+      canvas: outputCanvas,
+      ctx: ctx
+    }) : null;
+  }
+  getShaderSources() {
+    return null;
+  }
+  applyWebGLEffect(canvas) {
+    return null;
+  }
+  applyCanvas2DEffect(canvas) {
+    return null;
+  }
+  supportsWebGL() {
+    return null !== this.getShaderSources();
+  }
+  supportsCanvas2D() {
+    return this.applyCanvas2DEffect !== DisappearAnimateBase.prototype.applyCanvas2DEffect;
+  }
+  release() {
+    super.release(), this.gl && (this.program && (this.gl.deleteProgram(this.program), this.program = null), this.gl = null), this.webglCanvas && (this.webglCanvas = null), this.currentAnimationRatio = 0, this.animationTime = 0;
+  }
+  afterStageRender(stage, canvas) {
+    let result = null;
+    if (this.supportsWebGL() && (this.gl || this.initWebGL(canvas) || console.warn("WebGL初始化失败，尝试Canvas 2D回退"), this.gl)) {
+      if (result = this.applyWebGLEffect(canvas), result) return result;
+      console.warn("WebGL特效执行失败，尝试Canvas 2D回退");
+    }
+    if (this.supportsCanvas2D()) {
+      if (result = this.applyCanvas2DEffect(canvas), result) return result;
+      console.warn("Canvas 2D特效执行失败");
+    }
+    return this.supportsWebGL() || this.supportsCanvas2D() || console.error(`特效类 ${this.constructor.name} 未实现任何渲染方法。请实现 applyWebGLEffect 或 applyCanvas2DEffect 方法。`), canvas;
+  }
+}
+
+class Canvas2DEffectBase extends DisappearAnimateBase {
+  constructor(from, to, duration, easing, params) {
+    super(from, to, duration, easing, params);
+  }
+  getShaderSources() {
+    return null;
+  }
+  applyWebGLEffect(canvas) {
+    return null;
+  }
+}
+class HybridEffectBase extends DisappearAnimateBase {
+  constructor(from, to, duration, easing, params) {
+    super(from, to, duration, easing, params);
+  }
+  getShaderSources() {
+    return null;
+  }
+  applyWebGLEffect(canvas) {
+    return null;
+  }
+  applyCanvas2DEffect(canvas) {
+    return null;
+  }
+  supportsWebGL() {
+    return this.getShaderSources !== HybridEffectBase.prototype.getShaderSources && null !== this.getShaderSources();
+  }
+  supportsCanvas2D() {
+    return this.applyCanvas2DEffect !== HybridEffectBase.prototype.applyCanvas2DEffect;
+  }
+  afterStageRender(stage, canvas) {
+    var _a, _b;
+    let result = null;
+    if (!1 !== (null === (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.options) || void 0 === _b ? void 0 : _b.useWebGL)) {
+      if (this.supportsWebGL() && (this.gl || this.initWebGL(canvas) || console.warn("WebGL初始化失败，尝试Canvas 2D回退"), this.gl)) {
+        if (result = this.applyWebGLEffect(canvas), result) return result;
+        console.warn("WebGL特效执行失败，尝试Canvas 2D回退");
+      }
+      if (this.supportsCanvas2D()) {
+        if (result = this.applyCanvas2DEffect(canvas), result) return result;
+        console.warn("Canvas 2D特效执行失败");
+      }
+    } else if (this.supportsCanvas2D()) {
+      if (result = this.applyCanvas2DEffect(canvas), result) return result;
+      console.warn("Canvas 2D特效执行失败");
+    } else console.warn(`${this.constructor.name}: useWebGL=false 但未实现Canvas 2D方法`);
+    return this.supportsWebGL() || this.supportsCanvas2D() || console.error(`特效类 ${this.constructor.name} 未实现任何渲染方法。请实现 applyWebGLEffect 或 applyCanvas2DEffect 方法。`), canvas;
+  }
+}
+
+class ImageProcessUtils {
+  static createTempCanvas(width, height, dpr) {
+    return vglobal.createCanvas({
+      width: width,
+      height: height,
+      dpr: dpr || vglobal.devicePixelRatio
+    });
+  }
+  static cloneImageData(imageData) {
+    const clonedData = new Uint8ClampedArray(imageData.data);
+    return new ImageData(clonedData, imageData.width, imageData.height);
+  }
+  static lerp(start, end, t) {
+    return start * (1 - t) + end * t;
+  }
+  static smoothstep(edge0, edge1, x) {
+    const t = Math.max(0, Math.min(1, (x - edge0) / (edge1 - edge0)));
+    return t * t * (3 - 2 * t);
+  }
+  static distance(x1, y1, x2, y2) {
+    const dx = x2 - x1,
+      dy = y2 - y1;
+    return Math.sqrt(dx * dx + dy * dy);
+  }
+  static normalizeAngle(angle) {
+    return (angle + Math.PI) / (2 * Math.PI);
+  }
+  static pixelNoise(x, y, pixelSize) {
+    if (pixelSize <= 0) return 0;
+    const gridX = Math.floor(x / pixelSize) * pixelSize,
+      gridY = Math.floor(y / pixelSize) * pixelSize,
+      n = 43758.5453 * Math.sin(12.9898 * gridX + 78.233 * gridY);
+    return n - Math.floor(n);
+  }
+  static generateNoiseTexture(width, height) {
+    const data = new Uint8Array(width * height);
+    for (let i = 0; i < data.length; i++) data[i] = Math.floor(256 * Math.random());
+    return data;
+  }
+  static applyCSSFilter(canvas, filter) {
+    const outputCanvas = this.createTempCanvas(canvas.width, canvas.height),
+      ctx = outputCanvas.getContext("2d");
+    return ctx ? (ctx.filter = filter, ctx.drawImage(canvas, 0, 0), ctx.filter = "none", outputCanvas) : canvas;
+  }
+  static extractChannel(imageData, channelIndex) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      channelData = new Uint8ClampedArray(data.length);
+    for (let i = 0; i < data.length; i += 4) channelData[i] = 0, channelData[i + 1] = 0, channelData[i + 2] = 0, channelData[i + 3] = data[i + 3], channelIndex >= 0 && channelIndex <= 2 && (channelData[i + channelIndex] = data[i + channelIndex]);
+    return new ImageData(channelData, width, height);
+  }
+  static blendImageData(imageData1, imageData2, ratio) {
+    const {
+        data: data1,
+        width: width,
+        height: height
+      } = imageData1,
+      {
+        data: data2
+      } = imageData2,
+      result = new Uint8ClampedArray(data1.length);
+    for (let i = 0; i < data1.length; i += 4) result[i] = Math.round(this.lerp(data1[i], data2[i], ratio)), result[i + 1] = Math.round(this.lerp(data1[i + 1], data2[i + 1], ratio)), result[i + 2] = Math.round(this.lerp(data1[i + 2], data2[i + 2], ratio)), result[i + 3] = Math.round(this.lerp(data1[i + 3], data2[i + 3], ratio));
+    return new ImageData(result, width, height);
+  }
+  static getLuminance(r, g, b) {
+    return .299 * r + .587 * g + .114 * b;
+  }
+  static applySepiaToPixel(r, g, b) {
+    return [Math.min(255, .393 * r + .769 * g + .189 * b), Math.min(255, .349 * r + .686 * g + .168 * b), Math.min(255, .272 * r + .534 * g + .131 * b)];
+  }
+  static calculateDynamicStrength(baseStrength, animationTime) {
+    return baseStrength * (animationTime / (2 * Math.PI));
+  }
+}
+class ShaderLibrary {}
+ShaderLibrary.STANDARD_VERTEX_SHADER = "\n    attribute vec2 a_position;\n    attribute vec2 a_texCoord;\n    varying vec2 v_texCoord;\n\n    void main() {\n      gl_Position = vec4(a_position, 0.0, 1.0);\n      v_texCoord = a_texCoord;\n    }\n  ", ShaderLibrary.SHADER_FUNCTIONS = "\n    // 亮度计算函数\n    float luminance(vec3 color) {\n      return dot(color, vec3(0.299, 0.587, 0.114));\n    }\n\n    // 褐色调函数\n    vec3 sepia(vec3 color) {\n      float r = color.r * 0.393 + color.g * 0.769 + color.b * 0.189;\n      float g = color.r * 0.349 + color.g * 0.686 + color.b * 0.168;\n      float b = color.r * 0.272 + color.g * 0.534 + color.b * 0.131;\n      return vec3(r, g, b);\n    }\n\n    // 线性插值函数\n    float lerp(float a, float b, float t) {\n      return a * (1.0 - t) + b * t;\n    }\n\n\n    // 简单噪声函数\n    float pixelNoise(vec2 coord, float pixelSize) {\n      vec2 gridCoord = floor(coord / pixelSize) * pixelSize;\n      return fract(sin(dot(gridCoord, vec2(12.9898, 78.233))) * 43758.5453123);\n    }\n\n    // 动态强度计算\n    float calculateDynamicStrength(float baseStrength, float time) {\n      return baseStrength * (time / 6.28318531); // 2π\n    }\n  ";
+
+class Dissolve extends HybridEffectBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b, _c, _d;
+    super(from, to, duration, easing, params), this.noiseData = null;
+    const rawNoiseScale = null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.noiseScale,
+      clampedNoiseScale = void 0 !== rawNoiseScale ? Math.max(0, Math.floor(rawNoiseScale)) : 8;
+    this.dissolveConfig = {
+      dissolveType: (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.dissolveType) || "outward",
+      useWebGL: void 0 === (null === (_c = null == params ? void 0 : params.options) || void 0 === _c ? void 0 : _c.useWebGL) || params.options.useWebGL,
+      noiseScale: clampedNoiseScale,
+      fadeEdge: void 0 === (null === (_d = null == params ? void 0 : params.options) || void 0 === _d ? void 0 : _d.fadeEdge) || params.options.fadeEdge
+    };
+  }
+  getShaderSources() {
+    return {
+      vertex: ShaderLibrary.STANDARD_VERTEX_SHADER,
+      fragment: `\n      precision mediump float;\n      uniform sampler2D u_texture;\n      uniform sampler2D u_noiseTexture;\n      uniform float u_time;\n      uniform int u_dissolveType;\n      uniform vec2 u_resolution;\n      uniform float u_noiseScale;\n      uniform bool u_fadeEdge;\n      varying vec2 v_texCoord;\n\n      ${ShaderLibrary.SHADER_FUNCTIONS}\n\n      // 向外溶解函数\n      float outwardDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        vec2 center = vec2(0.5, 0.5);\n        float distFromCenter = length(uv - center);\n        float maxDist = length(vec2(0.5, 0.5));\n\n        // 归一化距离 (0为中心，1为边缘)\n        float normalizedDist = distFromCenter / maxDist;\n\n        // 向外溶解：从边缘开始溶解，time控制溶解进度\n        // 增加安全边距，确保动画结束时完全溶解\n        float edgeThreshold = 1.2 - time * 1.5;\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          // 添加基于像素大小的噪声，让边缘呈现颗粒状\n          vec2 pixelCoord = uv * resolution; // 转换为像素坐标\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.4; // 增强噪声影响\n          edgeThreshold += noiseInfluence;\n          return normalizedDist > edgeThreshold ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.15; // 渐变宽度\n            return 1.0 - smoothstep(edgeThreshold - fadeWidth, edgeThreshold, normalizedDist);\n          } else {\n            // 硬边缘：返回0或1\n            return normalizedDist > edgeThreshold ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 向内溶解函数\n      float inwardDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        vec2 center = vec2(0.5, 0.5);\n        float distFromCenter = length(uv - center);\n        float maxDist = length(vec2(0.5, 0.5));\n\n        float normalizedDist = distFromCenter / maxDist;\n\n        // 向内溶解：从中心开始溶解，time控制溶解进度\n        // 增加系数，确保动画结束时完全溶解\n        float centerThreshold = time * 1.4;\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.4;\n          centerThreshold += noiseInfluence;\n          return normalizedDist < centerThreshold ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.15; // 渐变宽度\n            return smoothstep(centerThreshold, centerThreshold + fadeWidth, normalizedDist);\n          } else {\n            // 硬边缘：返回0或1\n            return normalizedDist < centerThreshold ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 径向溶解函数\n      float radialDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        vec2 center = vec2(0.5, 0.5);\n        float angle = atan(uv.y - center.y, uv.x - center.x);\n        float normalizedAngle = (angle + 3.14159) / (2.0 * 3.14159);\n\n        // 径向溶解：按角度顺序溶解，time控制溶解进度\n        // 增加系数，确保动画结束时完全溶解\n        float angleThreshold = time * 1.2;\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.3;\n          angleThreshold += noiseInfluence;\n          return normalizedAngle < angleThreshold ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.08; // 渐变宽度\n            return smoothstep(angleThreshold, angleThreshold + fadeWidth, normalizedAngle);\n          } else {\n            // 硬边缘：返回0或1\n            return normalizedAngle < angleThreshold ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 从左到右溶解函数\n      float leftToRightDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        // 左到右溶解：从x=0开始向x=1溶解\n        float dissolvePosition = time * 1.2; // 增加系数确保完全溶解\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.3;\n          dissolvePosition += noiseInfluence;\n          return uv.x < dissolvePosition ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.08; // 渐变宽度\n            return smoothstep(dissolvePosition, dissolvePosition + fadeWidth, uv.x);\n          } else {\n            // 硬边缘：返回0或1\n            return uv.x < dissolvePosition ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 从右到左溶解函数\n      float rightToLeftDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        // 右到左溶解：从x=1开始向x=0溶解\n        float dissolvePosition = 1.0 - time * 1.2; // 增加系数确保完全溶解\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.3;\n          dissolvePosition += noiseInfluence;\n          return uv.x > dissolvePosition ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.08; // 渐变宽度\n            return smoothstep(dissolvePosition - fadeWidth, dissolvePosition, uv.x);\n          } else {\n            // 硬边缘：返回0或1\n            return uv.x > dissolvePosition ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 从上到下溶解函数\n      float topToBottomDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        // 上到下溶解：从y=0开始向y=1溶解\n        float dissolvePosition = time * 1.2; // 增加系数确保完全溶解\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.3;\n          dissolvePosition += noiseInfluence;\n          return uv.y < dissolvePosition ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.08; // 渐变宽度\n            return smoothstep(dissolvePosition, dissolvePosition + fadeWidth, uv.y);\n          } else {\n            // 硬边缘：返回0或1\n            return uv.y < dissolvePosition ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      // 从下到上溶解函数\n      float bottomToTopDissolve(vec2 uv, float time, float pixelSize, vec2 resolution) {\n        // 下到上溶解：从y=1开始向y=0溶解\n        float dissolvePosition = 1.0 - time * 1.2; // 增加系数确保完全溶解\n\n        // 当pixelSize > 0时添加颗粒效果\n        if (pixelSize > 0.0) {\n          vec2 pixelCoord = uv * resolution;\n          float noiseValue = pixelNoise(pixelCoord, pixelSize);\n          float noiseInfluence = (noiseValue - 0.5) * 0.3;\n          dissolvePosition += noiseInfluence;\n          return uv.y > dissolvePosition ? 0.0 : 1.0;\n        } else {\n          // 平滑溶解：根据fadeEdge决定是否使用渐变\n          if (u_fadeEdge) {\n            // 柔和边缘：返回渐变值\n            float fadeWidth = 0.08; // 渐变宽度\n            return smoothstep(dissolvePosition - fadeWidth, dissolvePosition, uv.y);\n          } else {\n            // 硬边缘：返回0或1\n            return uv.y > dissolvePosition ? 0.0 : 1.0;\n          }\n        }\n      }\n\n      void main() {\n        vec2 uv = v_texCoord;\n        vec4 texColor = texture2D(u_texture, uv);\n\n        float alpha = 1.0;\n\n        // 根据溶解类型选择对应的溶解函数\n        if (u_dissolveType == 0) {\n          alpha = outwardDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 1) {\n          alpha = inwardDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 2) {\n          alpha = radialDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 3) {\n          alpha = leftToRightDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 4) {\n          alpha = rightToLeftDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 5) {\n          alpha = topToBottomDissolve(uv, u_time, u_noiseScale, u_resolution);\n        } else if (u_dissolveType == 6) {\n          alpha = bottomToTopDissolve(uv, u_time, u_noiseScale, u_resolution);\n        }\n\n        gl_FragColor = vec4(texColor.rgb, texColor.a * alpha);\n      }\n    `
+    };
+  }
+  applyWebGLEffect(canvas) {
+    if (!this.gl || !this.program || !this.webglCanvas) return canvas;
+    this.setupWebGLState(canvas);
+    const texture = this.createTextureFromCanvas(canvas);
+    if (!texture) return canvas;
+    this.noiseData || (this.noiseData = ImageProcessUtils.generateNoiseTexture(256, 256));
+    const noiseTexture = this.gl.createTexture();
+    this.gl.activeTexture(this.gl.TEXTURE1), this.gl.bindTexture(this.gl.TEXTURE_2D, noiseTexture), this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.LUMINANCE, 256, 256, 0, this.gl.LUMINANCE, this.gl.UNSIGNED_BYTE, this.noiseData), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.REPEAT), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_T, this.gl.REPEAT), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.LINEAR), this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
+    const vertexBuffer = this.createFullScreenQuad();
+    return vertexBuffer ? (this.gl.useProgram(this.program), this.setupVertexAttributes(), this.setUniforms(), this.gl.enable(this.gl.BLEND), this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA), this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4), this.gl.deleteTexture(texture), this.gl.deleteTexture(noiseTexture), this.gl.deleteBuffer(vertexBuffer), this.webglCanvas) : canvas;
+  }
+  setUniforms() {
+    if (!this.gl || !this.program || !this.webglCanvas) return;
+    const textureLocation = this.gl.getUniformLocation(this.program, "u_texture"),
+      noiseTextureLocation = this.gl.getUniformLocation(this.program, "u_noiseTexture"),
+      timeLocation = this.gl.getUniformLocation(this.program, "u_time"),
+      dissolveTypeLocation = this.gl.getUniformLocation(this.program, "u_dissolveType"),
+      resolutionLocation = this.gl.getUniformLocation(this.program, "u_resolution"),
+      noiseScaleLocation = this.gl.getUniformLocation(this.program, "u_noiseScale"),
+      fadeEdgeLocation = this.gl.getUniformLocation(this.program, "u_fadeEdge");
+    this.gl.uniform1i(textureLocation, 0), this.gl.uniform1i(noiseTextureLocation, 1), this.gl.uniform1f(timeLocation, this.currentAnimationRatio), this.gl.uniform2f(resolutionLocation, this.webglCanvas.width, this.webglCanvas.height), this.gl.uniform1f(noiseScaleLocation, this.dissolveConfig.noiseScale), this.gl.uniform1i(fadeEdgeLocation, this.dissolveConfig.fadeEdge ? 1 : 0);
+    this.gl.uniform1i(dissolveTypeLocation, {
+      outward: 0,
+      inward: 1,
+      radial: 2,
+      leftToRight: 3,
+      rightToLeft: 4,
+      topToBottom: 5,
+      bottomToTop: 6
+    }[this.dissolveConfig.dissolveType] || 0);
+  }
+  applyCanvas2DEffect(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return canvas;
+    const {
+        canvas: outputCanvasElement,
+        ctx: ctx
+      } = outputCanvas,
+      imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+      progress = this.currentAnimationRatio;
+    let dissolvedImageData;
+    switch (this.dissolveConfig.dissolveType) {
+      case "outward":
+        dissolvedImageData = this.applyOutwardDissolve(imageData, progress);
+        break;
+      case "inward":
+        dissolvedImageData = this.applyInwardDissolve(imageData, progress);
+        break;
+      case "radial":
+        dissolvedImageData = this.applyRadialDissolve(imageData, progress);
+        break;
+      case "leftToRight":
+        dissolvedImageData = this.applyLeftToRightDissolve(imageData, progress);
+        break;
+      case "rightToLeft":
+        dissolvedImageData = this.applyRightToLeftDissolve(imageData, progress);
+        break;
+      case "topToBottom":
+        dissolvedImageData = this.applyTopToBottomDissolve(imageData, progress);
+        break;
+      case "bottomToTop":
+        dissolvedImageData = this.applyBottomToTopDissolve(imageData, progress);
+        break;
+      default:
+        dissolvedImageData = imageData;
+    }
+    return ctx.putImageData(dissolvedImageData, 0, 0), outputCanvasElement;
+  }
+  applyOutwardDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const centerX = width / 2,
+      centerY = height / 2,
+      maxDist = Math.sqrt(centerX * centerX + centerY * centerY),
+      pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const dx = x - centerX,
+        dy = y - centerY,
+        normalizedDist = Math.sqrt(dx * dx + dy * dy) / maxDist;
+      let dissolveThreshold = 1.2 - 1.4 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .4 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedDist > dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeStart = dissolveThreshold - .15;
+        alpha = normalizedDist < fadeStart ? 1 : normalizedDist > dissolveThreshold ? 0 : 1 - (normalizedDist - fadeStart) / (dissolveThreshold - fadeStart);
+      } else alpha = normalizedDist > dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyInwardDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const centerX = width / 2,
+      centerY = height / 2,
+      maxDist = Math.sqrt(centerX * centerX + centerY * centerY),
+      pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const dx = x - centerX,
+        dy = y - centerY,
+        normalizedDist = Math.sqrt(dx * dx + dy * dy) / maxDist;
+      let dissolveThreshold = 1.4 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .4 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedDist < dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeEnd = dissolveThreshold + .15;
+        alpha = normalizedDist < dissolveThreshold ? 0 : normalizedDist > fadeEnd ? 1 : (normalizedDist - dissolveThreshold) / (fadeEnd - dissolveThreshold);
+      } else alpha = normalizedDist < dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyRadialDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const centerX = width / 2,
+      centerY = height / 2,
+      pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const dx = x - centerX,
+        dy = y - centerY,
+        normalizedAngle = (Math.atan2(dy, dx) + Math.PI) / (2 * Math.PI);
+      let dissolveThreshold = 1.2 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .3 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedAngle < dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeEnd = dissolveThreshold + .08;
+        alpha = normalizedAngle < dissolveThreshold ? 0 : normalizedAngle > fadeEnd ? 1 : (normalizedAngle - dissolveThreshold) / (fadeEnd - dissolveThreshold);
+      } else alpha = normalizedAngle < dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyLeftToRightDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const normalizedX = x / width;
+      let dissolveThreshold = 1.2 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .3 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedX < dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeEnd = dissolveThreshold + .08;
+        alpha = normalizedX < dissolveThreshold ? 0 : normalizedX > fadeEnd ? 1 : (normalizedX - dissolveThreshold) / (fadeEnd - dissolveThreshold);
+      } else alpha = normalizedX < dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyRightToLeftDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const normalizedX = x / width;
+      let dissolveThreshold = 1 - 1.2 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .3 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedX > dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeStart = dissolveThreshold - .08;
+        alpha = normalizedX < fadeStart ? 1 : normalizedX > dissolveThreshold ? 0 : 1 - (normalizedX - fadeStart) / (dissolveThreshold - fadeStart);
+      } else alpha = normalizedX > dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyTopToBottomDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const normalizedY = y / height;
+      let dissolveThreshold = 1.2 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .3 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedY < dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeEnd = dissolveThreshold + .08;
+        alpha = normalizedY < dissolveThreshold ? 0 : normalizedY > fadeEnd ? 1 : (normalizedY - dissolveThreshold) / (fadeEnd - dissolveThreshold);
+      } else alpha = normalizedY < dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+  applyBottomToTopDissolve(imageData, progress) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    result.set(data);
+    const pixelSize = this.dissolveConfig.noiseScale;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const normalizedY = y / height;
+      let dissolveThreshold = 1 - 1.2 * progress,
+        alpha = 1;
+      if (pixelSize > 0) {
+        dissolveThreshold += .3 * (ImageProcessUtils.pixelNoise(x, y, pixelSize) - .5), alpha = normalizedY > dissolveThreshold ? 0 : 1;
+      } else if (this.dissolveConfig.fadeEdge) {
+        const fadeStart = dissolveThreshold - .08;
+        alpha = normalizedY < fadeStart ? 1 : normalizedY > dissolveThreshold ? 0 : 1 - (normalizedY - fadeStart) / (dissolveThreshold - fadeStart);
+      } else alpha = normalizedY > dissolveThreshold ? 0 : 1;
+      const index = 4 * (y * width + x);
+      result[index + 3] = Math.floor(result[index + 3] * alpha);
+    }
+    return new ImageData(result, width, height);
+  }
+}
+
+class Grayscale extends HybridEffectBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b, _c;
+    super(from, to, duration, easing, params);
+    const rawStrength = void 0 !== (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.strength) ? params.options.strength : 1,
+      clampedStrength = Math.max(0, Math.min(1, rawStrength));
+    this.colorConfig = {
+      effectType: (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.effectType) || "grayscale",
+      strength: clampedStrength,
+      useWebGL: void 0 === (null === (_c = null == params ? void 0 : params.options) || void 0 === _c ? void 0 : _c.useWebGL) || params.options.useWebGL
+    };
+  }
+  getShaderSources() {
+    return {
+      vertex: ShaderLibrary.STANDARD_VERTEX_SHADER,
+      fragment: `\n      precision mediump float;\n      uniform sampler2D u_texture;\n      uniform float u_time;\n      uniform float u_strength;\n      uniform int u_effectType;\n      uniform vec2 u_resolution;\n      varying vec2 v_texCoord;\n\n      ${ShaderLibrary.SHADER_FUNCTIONS}\n\n      void main() {\n        vec2 uv = v_texCoord;\n        vec4 originalColor = texture2D(u_texture, uv);\n        vec3 color = originalColor.rgb;\n\n        // 计算动态强度\n        float dynamicStrength = calculateDynamicStrength(u_strength, u_time);\n\n        if (u_effectType == 0) {\n          // 灰度效果\n          float gray = luminance(color);\n          vec3 grayColor = vec3(gray);\n          color = mix(color, grayColor, dynamicStrength);\n        } else if (u_effectType == 1) {\n          // 褐色调效果\n          vec3 sepiaColor = sepia(color);\n          color = mix(color, sepiaColor, dynamicStrength);\n        }\n\n        gl_FragColor = vec4(color, originalColor.a);\n      }\n    `
+    };
+  }
+  applyWebGLEffect(canvas) {
+    if (!this.gl || !this.program || !this.webglCanvas) return null;
+    this.setupWebGLState(canvas);
+    const texture = this.createTextureFromCanvas(canvas);
+    if (!texture) return null;
+    const vertexBuffer = this.createFullScreenQuad();
+    if (!vertexBuffer) return this.gl.deleteTexture(texture), null;
+    try {
+      return this.gl.useProgram(this.program), this.setupVertexAttributes(), this.setColorUniforms(), this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4), this.webglCanvas;
+    } finally {
+      this.gl.deleteTexture(texture), this.gl.deleteBuffer(vertexBuffer);
+    }
+  }
+  setColorUniforms() {
+    if (!this.gl || !this.program) return;
+    const currentTime = this.getAnimationTime(),
+      timeLocation = this.gl.getUniformLocation(this.program, "u_time"),
+      strengthLocation = this.gl.getUniformLocation(this.program, "u_strength"),
+      effectTypeLocation = this.gl.getUniformLocation(this.program, "u_effectType"),
+      resolutionLocation = this.gl.getUniformLocation(this.program, "u_resolution");
+    this.gl.uniform1f(timeLocation, currentTime), this.gl.uniform1f(strengthLocation, this.colorConfig.strength), this.gl.uniform2f(resolutionLocation, this.webglCanvas.width, this.webglCanvas.height);
+    this.gl.uniform1i(effectTypeLocation, {
+      grayscale: 0,
+      sepia: 1
+    }[this.colorConfig.effectType] || 0);
+  }
+  applyCanvas2DEffect(canvas) {
+    if (this.colorConfig.strength <= 0) {
+      const outputCanvas = this.createOutputCanvas(canvas);
+      return outputCanvas ? outputCanvas.canvas : null;
+    }
+    if (this.canUseCSSFilter()) return this.applyCSSFilter(canvas);
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+        currentTime = this.getAnimationTime();
+      let processedImageData;
+      switch (this.colorConfig.effectType) {
+        case "grayscale":
+        default:
+          processedImageData = this.applyGrayscaleEffect(imageData, this.colorConfig.strength, currentTime);
+          break;
+        case "sepia":
+          processedImageData = this.applySepiaEffect(imageData, this.colorConfig.strength, currentTime);
+      }
+      return ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.putImageData(processedImageData, 0, 0), outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("Canvas 2D color effect failed:", error), null;
+    }
+  }
+  canUseCSSFilter() {
+    var _a;
+    return !!window.useFilterAPI && "undefined" != typeof CSS && (null === (_a = CSS.supports) || void 0 === _a ? void 0 : _a.call(CSS, "filter", "grayscale(1)"));
+  }
+  applyCSSFilter(canvas) {
+    try {
+      const outputCanvas = ImageProcessUtils.createTempCanvas(canvas.width, canvas.height),
+        ctx = outputCanvas.getContext("2d");
+      if (!ctx) return null;
+      const currentTime = this.getAnimationTime(),
+        dynamicStrength = ImageProcessUtils.calculateDynamicStrength(this.colorConfig.strength, currentTime);
+      let filterValue = "";
+      return "grayscale" === this.colorConfig.effectType ? filterValue = `grayscale(${Math.min(1, dynamicStrength)})` : "sepia" === this.colorConfig.effectType && (filterValue = `sepia(${Math.min(1, dynamicStrength)})`), ctx.filter = filterValue, ctx.drawImage(canvas, 0, 0), ctx.filter = "none", outputCanvas;
+    } catch (error) {
+      return console.warn("CSS Filter API failed, falling back to pixel processing:", error), null;
+    }
+  }
+  applyGrayscaleEffect(imageData, strength, time) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length),
+      dynamicStrength = ImageProcessUtils.calculateDynamicStrength(strength, time);
+    for (let i = 0; i < data.length; i += 4) {
+      const r = data[i],
+        g = data[i + 1],
+        b = data[i + 2],
+        a = data[i + 3],
+        gray = ImageProcessUtils.getLuminance(r, g, b);
+      result[i] = Math.round(ImageProcessUtils.lerp(r, gray, dynamicStrength)), result[i + 1] = Math.round(ImageProcessUtils.lerp(g, gray, dynamicStrength)), result[i + 2] = Math.round(ImageProcessUtils.lerp(b, gray, dynamicStrength)), result[i + 3] = a;
+    }
+    return new ImageData(result, width, height);
+  }
+  applySepiaEffect(imageData, strength, time) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length),
+      dynamicStrength = ImageProcessUtils.calculateDynamicStrength(strength, time);
+    for (let i = 0; i < data.length; i += 4) {
+      const r = data[i],
+        g = data[i + 1],
+        b = data[i + 2],
+        a = data[i + 3],
+        [sepiaR, sepiaG, sepiaB] = ImageProcessUtils.applySepiaToPixel(r, g, b);
+      result[i] = Math.round(ImageProcessUtils.lerp(r, sepiaR, dynamicStrength)), result[i + 1] = Math.round(ImageProcessUtils.lerp(g, sepiaG, dynamicStrength)), result[i + 2] = Math.round(ImageProcessUtils.lerp(b, sepiaB, dynamicStrength)), result[i + 3] = a;
+    }
+    return new ImageData(result, width, height);
+  }
+  afterStageRender(stage, canvas) {
+    if (this.canUseCSSFilter() && this.colorConfig.strength > 0) {
+      const cssResult = this.applyCSSFilter(canvas);
+      if (cssResult) return cssResult;
+    }
+    return super.afterStageRender(stage, canvas);
+  }
+}
+
+class Distortion extends HybridEffectBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b, _c;
+    super(from, to, duration, easing, params), this.distortionConfig = {
+      distortionType: (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.distortionType) || "wave",
+      strength: (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.strength) || .3,
+      useWebGL: void 0 === (null === (_c = null == params ? void 0 : params.options) || void 0 === _c ? void 0 : _c.useWebGL) || params.options.useWebGL
+    };
+  }
+  getShaderSources() {
+    return {
+      vertex: "\n      attribute vec2 a_position;\n      attribute vec2 a_texCoord;\n      varying vec2 v_texCoord;\n\n      void main() {\n        gl_Position = vec4(a_position, 0.0, 1.0);\n        v_texCoord = a_texCoord;\n      }\n    ",
+      fragment: "\n      precision mediump float;\n      uniform sampler2D u_texture;\n      uniform float u_time;\n      uniform float u_strength;\n      uniform int u_distortionType;\n      uniform vec2 u_resolution;\n      varying vec2 v_texCoord;\n\n      // 波浪扭曲函数\n      vec2 wave(vec2 uv, float time, float strength) {\n        float waveX = sin(uv.y * 10.0 + time * 3.0) * strength * 0.1;\n        float waveY = sin(uv.x * 10.0 + time * 2.0) * strength * 0.1;\n        return uv + vec2(waveX, waveY);\n      }\n\n      // 涟漪扭曲函数\n      vec2 ripple(vec2 uv, float time, float strength) {\n        vec2 center = vec2(0.5, 0.5);\n        float distance = length(uv - center);\n        float ripple = sin(distance * 20.0 - time * 5.0) * strength * 0.1;\n        vec2 direction = normalize(uv - center);\n        return uv + direction * ripple;\n      }\n\n      // 漩涡扭曲函数\n      vec2 swirl(vec2 uv, float time, float strength) {\n        vec2 center = vec2(0.5, 0.5);\n        vec2 delta = uv - center;\n        float dist = length(delta);\n        float originalAngle = atan(delta.y, delta.x);\n        float rotationAngle = dist * strength * time * 2.0;\n        float finalAngle = originalAngle + rotationAngle;\n        return center + dist * vec2(cos(finalAngle), sin(finalAngle));\n      }\n\n      void main() {\n        vec2 uv = v_texCoord;\n\n        // 根据扭曲类型应用相应变换\n        if (u_distortionType == 0) {\n          uv = wave(uv, u_time, u_strength);\n        } else if (u_distortionType == 1) {\n          uv = ripple(uv, u_time, u_strength);\n        } else if (u_distortionType == 2) {\n          uv = swirl(uv, u_time, u_strength);\n        }\n\n        // 边界检查\n        if (uv.x < 0.0 || uv.x > 1.0 || uv.y < 0.0 || uv.y > 1.0) {\n          gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);\n        } else {\n          gl_FragColor = texture2D(u_texture, uv);\n        }\n      }\n    "
+    };
+  }
+  applyWebGLEffect(canvas) {
+    if (!this.gl || !this.program || !this.webglCanvas) return null;
+    this.setupWebGLState(canvas);
+    const texture = this.createTextureFromCanvas(canvas);
+    if (!texture) return null;
+    const vertexBuffer = this.createFullScreenQuad();
+    if (!vertexBuffer) return this.gl.deleteTexture(texture), null;
+    try {
+      return this.gl.useProgram(this.program), this.setupVertexAttributes(), this.setDistortionUniforms(), this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4), this.webglCanvas;
+    } finally {
+      this.gl.deleteTexture(texture), this.gl.deleteBuffer(vertexBuffer);
+    }
+  }
+  setDistortionUniforms() {
+    if (!this.gl || !this.program) return;
+    const currentTime = this.getAnimationTime(),
+      timeLocation = this.gl.getUniformLocation(this.program, "u_time"),
+      strengthLocation = this.gl.getUniformLocation(this.program, "u_strength"),
+      distortionTypeLocation = this.gl.getUniformLocation(this.program, "u_distortionType"),
+      resolutionLocation = this.gl.getUniformLocation(this.program, "u_resolution");
+    this.gl.uniform1f(timeLocation, currentTime), this.gl.uniform1f(strengthLocation, this.distortionConfig.strength), this.gl.uniform2f(resolutionLocation, this.webglCanvas.width, this.webglCanvas.height);
+    this.gl.uniform1i(distortionTypeLocation, {
+      wave: 0,
+      ripple: 1,
+      swirl: 2
+    }[this.distortionConfig.distortionType] || 0);
+  }
+  applyCanvas2DEffect(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+        currentTime = this.getAnimationTime();
+      let distortedImageData;
+      switch (this.distortionConfig.distortionType) {
+        case "wave":
+          distortedImageData = this.applyWaveDistortion(imageData, this.distortionConfig.strength, currentTime);
+          break;
+        case "ripple":
+          distortedImageData = this.applyRippleDistortion(imageData, this.distortionConfig.strength, currentTime);
+          break;
+        case "swirl":
+          distortedImageData = this.applySwirlDistortion(imageData, this.distortionConfig.strength, currentTime);
+          break;
+        default:
+          distortedImageData = imageData;
+      }
+      return ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.putImageData(distortedImageData, 0, 0), outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("Canvas 2D distortion effect failed:", error), null;
+    }
+  }
+  applyWaveDistortion(imageData, strength, time) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length);
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const waveX = Math.sin(.1 * y + 3 * time) * strength * 20,
+        waveY = Math.sin(.1 * x + 2 * time) * strength * 20,
+        sourceX = Math.round(x - waveX),
+        sourceY = Math.round(y - waveY),
+        targetIndex = 4 * (y * width + x);
+      if (sourceX >= 0 && sourceX < width && sourceY >= 0 && sourceY < height) {
+        const sourceIndex = 4 * (sourceY * width + sourceX);
+        result[targetIndex] = data[sourceIndex], result[targetIndex + 1] = data[sourceIndex + 1], result[targetIndex + 2] = data[sourceIndex + 2], result[targetIndex + 3] = data[sourceIndex + 3];
+      } else result[targetIndex + 3] = 0;
+    }
+    return new ImageData(result, width, height);
+  }
+  applyRippleDistortion(imageData, strength, time) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length),
+      centerX = width / 2,
+      centerY = height / 2;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const dx = x - centerX,
+        dy = y - centerY,
+        distance = Math.sqrt(dx * dx + dy * dy),
+        ripple = Math.sin(.2 * distance - 5 * time) * strength * 10,
+        angle = Math.atan2(dy, dx),
+        sourceX = Math.round(x - Math.cos(angle) * ripple),
+        sourceY = Math.round(y - Math.sin(angle) * ripple),
+        targetIndex = 4 * (y * width + x);
+      if (sourceX >= 0 && sourceX < width && sourceY >= 0 && sourceY < height) {
+        const sourceIndex = 4 * (sourceY * width + sourceX);
+        result[targetIndex] = data[sourceIndex], result[targetIndex + 1] = data[sourceIndex + 1], result[targetIndex + 2] = data[sourceIndex + 2], result[targetIndex + 3] = data[sourceIndex + 3];
+      } else result[targetIndex + 3] = 0;
+    }
+    return new ImageData(result, width, height);
+  }
+  applySwirlDistortion(imageData, strength, time) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data.length),
+      centerX = width / 2,
+      centerY = height / 2;
+    for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+      const dx = x - centerX,
+        dy = y - centerY,
+        distance = Math.sqrt(dx * dx + dy * dy),
+        finalAngle = Math.atan2(dy, dx) + distance * strength * time * .02,
+        sourceX = Math.round(centerX + distance * Math.cos(finalAngle)),
+        sourceY = Math.round(centerY + distance * Math.sin(finalAngle)),
+        targetIndex = 4 * (y * width + x);
+      if (sourceX >= 0 && sourceX < width && sourceY >= 0 && sourceY < height) {
+        const sourceIndex = 4 * (sourceY * width + sourceX);
+        result[targetIndex] = data[sourceIndex], result[targetIndex + 1] = data[sourceIndex + 1], result[targetIndex + 2] = data[sourceIndex + 2], result[targetIndex + 3] = data[sourceIndex + 3];
+      } else result[targetIndex + 3] = 0;
+    }
+    return new ImageData(result, width, height);
+  }
+  afterStageRender(stage, canvas) {
+    return this.distortionConfig.strength <= 0 ? canvas : super.afterStageRender(stage, canvas);
+  }
+}
+
+class Particle extends HybridEffectBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b, _c, _d, _e;
+    super(from, to, duration, easing, params), this.particles = [], this.positionBuffer = null, this.colorBuffer = null, this.particleConfig = {
+      effectType: (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.effectType) || "gravity",
+      count: (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.count) || 4e3,
+      size: (null === (_c = null == params ? void 0 : params.options) || void 0 === _c ? void 0 : _c.size) || 20,
+      strength: (null === (_d = null == params ? void 0 : params.options) || void 0 === _d ? void 0 : _d.strength) || 1.5,
+      useWebGL: void 0 === (null === (_e = null == params ? void 0 : params.options) || void 0 === _e ? void 0 : _e.useWebGL) || params.options.useWebGL
+    };
+  }
+  getShaderSources() {
+    return {
+      vertex: "\n      attribute vec2 a_position;\n      attribute vec4 a_color;\n      attribute float a_size;\n\n      uniform vec2 u_resolution;\n      uniform float u_time;\n      uniform float u_forceStrength;\n      uniform int u_effectType;\n\n      varying vec4 v_color;\n\n      void main() {\n        // 将像素坐标转换为剪辑空间坐标\n        vec2 clipSpace = ((a_position / u_resolution) * 2.0) - 1.0;\n        clipSpace.y = -clipSpace.y; // 翻转Y轴\n\n        gl_Position = vec4(clipSpace, 0.0, 1.0);\n        gl_PointSize = a_size;\n        v_color = a_color;\n      }\n    ",
+      fragment: "\n      precision mediump float;\n      varying vec4 v_color;\n\n      void main() {\n        // 创建圆形粒子\n        vec2 coord = gl_PointCoord - vec2(0.5);\n        float distance = length(coord);\n\n        if (distance > 0.5) {\n          discard;\n        }\n\n        // 保持原始颜色，只调整透明度渐变\n        gl_FragColor = vec4(v_color.rgb, v_color.a);\n      }\n    "
+    };
+  }
+  applyWebGLEffect(canvas) {
+    if (!this.gl || !this.program || !this.webglCanvas) return null;
+    this.setupWebGLState(canvas), 0 === this.particles.length && this.extractParticles(canvas), this.updateParticles(canvas);
+    const gl = this.gl;
+    return gl.enable(gl.BLEND), gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA), gl.useProgram(this.program), this.prepareAndDrawParticles(gl), this.webglCanvas;
+  }
+  applyCanvas2DEffect(canvas) {
+    const output = this.createOutputCanvas(canvas);
+    if (!output) return null;
+    const {
+        canvas: outputCanvas,
+        ctx: ctx
+      } = output,
+      progress = this.currentAnimationRatio;
+    switch (this.particleConfig.effectType) {
+      case "explode":
+        this.applyCanvas2DExplode(ctx, canvas, progress);
+        break;
+      case "gravity":
+        this.applyCanvas2DGravity(ctx, canvas, progress);
+        break;
+      case "vortex":
+        this.applyCanvas2DVortex(ctx, canvas, progress);
+        break;
+      default:
+        ctx.globalAlpha = Math.max(0, 1 - progress), ctx.drawImage(canvas, 0, 0);
+    }
+    return outputCanvas;
+  }
+  extractParticles(canvas) {
+    const tempCanvas = ImageProcessUtils.createTempCanvas(canvas.width, canvas.height, 1),
+      tempCtx = tempCanvas.getContext("2d");
+    if (!tempCtx) return;
+    tempCtx.drawImage(canvas, 0, 0, tempCanvas.width, tempCanvas.height);
+    const data = tempCtx.getImageData(0, 0, tempCanvas.width, tempCanvas.height).data;
+    this.particles = [];
+    const step = Math.max(1, Math.floor(Math.sqrt(tempCanvas.width * tempCanvas.height / (1.5 * this.particleConfig.count))));
+    for (let y = 0; y < tempCanvas.height; y += step) for (let x = 0; x < tempCanvas.width; x += step) {
+      const index = 4 * (y * tempCanvas.width + x),
+        r = data[index],
+        g = data[index + 1],
+        b = data[index + 2],
+        a = data[index + 3];
+      if (a > 5) {
+        const realX = x / tempCanvas.width * canvas.width,
+          realY = y / tempCanvas.height * canvas.height,
+          particle = {
+            x: realX,
+            y: realY,
+            originX: realX,
+            originY: realY,
+            vx: 0,
+            vy: 0,
+            r: r / 255,
+            g: g / 255,
+            b: b / 255,
+            a: Math.max(.6, a / 255),
+            life: 1,
+            size: this.particleConfig.size * (1 + .5 * Math.random())
+          };
+        this.particles.push(particle);
+      }
+    }
+  }
+  updateParticles(canvas) {
+    const centerX = canvas.width / 2,
+      centerY = canvas.height / 2,
+      progress = this.currentAnimationRatio,
+      duration = this.getDurationFromParent(),
+      isShortAnimation = duration < 2e3,
+      timeMultiplier = isShortAnimation ? Math.max(1.5, 3e3 / duration) : 1,
+      intensityBoost = isShortAnimation ? Math.min(2, 2e3 / duration) : 1;
+    this.particles.forEach(particle => {
+      const dx = particle.x - centerX,
+        dy = particle.y - centerY,
+        distance = Math.sqrt(dx * dx + dy * dy),
+        angle = Math.atan2(dy, dx);
+      this.applyParticleForces(particle, angle, distance, progress, intensityBoost, canvas), this.updateParticleProperties(particle, progress, isShortAnimation, timeMultiplier, intensityBoost);
+    });
+  }
+  applyParticleForces(particle, angle, distance, progress, intensityBoost, canvas) {
+    const time = this.getAnimationTime();
+    switch (this.particleConfig.effectType) {
+      case "explode":
+        const explodeIntensity = progress * this.particleConfig.strength * intensityBoost * 5;
+        particle.vx += Math.cos(angle) * explodeIntensity, particle.vy += Math.sin(angle) * explodeIntensity;
+        break;
+      case "gravity":
+        this.applyGravityEffect(particle, progress, intensityBoost, canvas, time);
+        break;
+      case "vortex":
+        this.applyVortexEffect(particle, progress, intensityBoost, canvas, angle, distance);
+    }
+  }
+  applyGravityEffect(particle, progress, intensityBoost, canvas, time) {
+    const gravityThreshold = (particle.originX + .7 * particle.originY) / (canvas.width + canvas.height) * .8;
+    if (progress > gravityThreshold) {
+      const gravityProgress = (progress - gravityThreshold) / (1 - gravityThreshold),
+        gravityForce = this.particleConfig.strength * gravityProgress * gravityProgress * 12 * intensityBoost;
+      particle.vy += gravityForce;
+      const turbulence = Math.sin(3 * time + .02 * particle.originX) * Math.cos(2 * time + .015 * particle.originY);
+      particle.vx += turbulence * this.particleConfig.strength * 2 * intensityBoost;
+    }
+  }
+  applyVortexEffect(particle, progress, intensityBoost, canvas, angle, distance) {
+    const centerX = canvas.width / 2,
+      centerY = canvas.height / 2,
+      spiralAngle = angle + progress * Math.PI * .8,
+      targetRadius = distance + progress * Math.max(canvas.width, canvas.height) * .7 * 1.8,
+      targetX = centerX + Math.cos(spiralAngle) * targetRadius,
+      targetY = centerY + Math.sin(spiralAngle) * targetRadius,
+      baseForce = progress * this.particleConfig.strength * .08 * intensityBoost;
+    particle.vx += (targetX - particle.x) * baseForce, particle.vy += (targetY - particle.y) * baseForce;
+  }
+  updateParticleProperties(particle, progress, isShortAnimation, timeMultiplier, intensityBoost) {
+    const dragCoeff = isShortAnimation ? .99 : .98;
+    if (particle.vx *= dragCoeff, particle.vy *= dragCoeff, particle.x += particle.vx, particle.y += particle.vy, isShortAnimation) {
+      const lifeDecayRate = Math.max(.1, .5 / timeMultiplier);
+      particle.life = Math.max(0, 1 - progress * lifeDecayRate), particle.a = Math.max(.2, particle.life * Math.min(1, 1.2 * particle.a)), particle.size = Math.max(.7 * this.particleConfig.size, this.particleConfig.size * (.5 + .5 * particle.life));
+    } else particle.life = Math.max(0, 1 - .2 * progress), particle.a = Math.max(.1, particle.life * Math.min(1, 1.5 * particle.a)), particle.size = Math.max(.5 * this.particleConfig.size, this.particleConfig.size * (.3 + .7 * particle.life));
+  }
+  prepareAndDrawParticles(gl) {
+    const positions = new Float32Array(2 * this.particles.length),
+      colors = new Float32Array(4 * this.particles.length),
+      sizes = new Float32Array(this.particles.length);
+    this.particles.forEach((particle, i) => {
+      positions[2 * i] = particle.x, positions[2 * i + 1] = particle.y, colors[4 * i] = particle.r, colors[4 * i + 1] = particle.g, colors[4 * i + 2] = particle.b, colors[4 * i + 3] = Math.max(.1, particle.a), sizes[i] = Math.max(6, 1.5 * particle.size);
+    }), this.updateParticleBuffers(gl, positions, colors, sizes), this.setParticleUniforms(gl), gl.drawArrays(gl.POINTS, 0, this.particles.length), this.cleanupTempBuffers(gl);
+  }
+  updateParticleBuffers(gl, positions, colors, sizes) {
+    this.positionBuffer || (this.positionBuffer = gl.createBuffer()), gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer), gl.bufferData(gl.ARRAY_BUFFER, positions, gl.DYNAMIC_DRAW);
+    const positionLocation = gl.getAttribLocation(this.program, "a_position");
+    gl.enableVertexAttribArray(positionLocation), gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, !1, 0, 0), this.colorBuffer || (this.colorBuffer = gl.createBuffer()), gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer), gl.bufferData(gl.ARRAY_BUFFER, colors, gl.DYNAMIC_DRAW);
+    const colorLocation = gl.getAttribLocation(this.program, "a_color");
+    gl.enableVertexAttribArray(colorLocation), gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, !1, 0, 0);
+    const sizeBuffer = gl.createBuffer();
+    gl.bindBuffer(gl.ARRAY_BUFFER, sizeBuffer), gl.bufferData(gl.ARRAY_BUFFER, sizes, gl.DYNAMIC_DRAW);
+    const sizeLocation = gl.getAttribLocation(this.program, "a_size");
+    gl.enableVertexAttribArray(sizeLocation), gl.vertexAttribPointer(sizeLocation, 1, gl.FLOAT, !1, 0, 0), this._tempSizeBuffer = sizeBuffer;
+  }
+  setParticleUniforms(gl) {
+    const resolutionLocation = gl.getUniformLocation(this.program, "u_resolution"),
+      timeLocation = gl.getUniformLocation(this.program, "u_time"),
+      forceStrengthLocation = gl.getUniformLocation(this.program, "u_forceStrength"),
+      effectTypeLocation = gl.getUniformLocation(this.program, "u_effectType");
+    gl.uniform2f(resolutionLocation, this.webglCanvas.width, this.webglCanvas.height), gl.uniform1f(timeLocation, this.getAnimationTime()), gl.uniform1f(forceStrengthLocation, this.particleConfig.strength);
+    gl.uniform1i(effectTypeLocation, {
+      explode: 0,
+      vortex: 1,
+      gravity: 2
+    }[this.particleConfig.effectType] || 0);
+  }
+  cleanupTempBuffers(gl) {
+    const tempSizeBuffer = this._tempSizeBuffer;
+    tempSizeBuffer && (gl.deleteBuffer(tempSizeBuffer), delete this._tempSizeBuffer);
+  }
+  applyCanvas2DExplode(ctx, canvas, progress) {
+    const centerX = canvas.width / 2,
+      centerY = canvas.height / 2;
+    ctx.save(), ctx.globalAlpha = Math.max(0, 1 - progress), ctx.translate(centerX, centerY);
+    const scale = 1 + .5 * progress;
+    ctx.scale(scale, scale), ctx.translate(-centerX, -centerY), ctx.drawImage(canvas, 0, 0), ctx.restore();
+  }
+  applyCanvas2DGravity(ctx, canvas, progress) {
+    ctx.save(), ctx.globalAlpha = Math.max(0, 1 - progress);
+    const offsetY = progress * canvas.height * .3;
+    ctx.drawImage(canvas, 0, offsetY), ctx.restore();
+  }
+  applyCanvas2DVortex(ctx, canvas, progress) {
+    const centerX = canvas.width / 2,
+      centerY = canvas.height / 2;
+    ctx.save(), ctx.globalAlpha = Math.max(0, 1 - progress), ctx.translate(centerX, centerY), ctx.rotate(progress * Math.PI * 2), ctx.translate(-centerX, -centerY), ctx.drawImage(canvas, 0, 0), ctx.restore();
+  }
+}
+
+class Glitch extends Canvas2DEffectBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b;
+    super(from, to, duration, easing, params), this.glitchConfig = {
+      effectType: (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.effectType) || "rgb-shift",
+      intensity: void 0 !== (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.intensity) ? params.options.intensity : .5
+    };
+  }
+  applyCanvas2DEffect(canvas) {
+    if (this.glitchConfig.intensity <= 0) {
+      const outputCanvas = this.createOutputCanvas(canvas);
+      return outputCanvas ? outputCanvas.canvas : null;
+    }
+    try {
+      switch (this.glitchConfig.effectType) {
+        case "rgb-shift":
+        default:
+          return this.applyRGBShiftGlitch(canvas);
+        case "digital-distortion":
+          return this.applyDigitalDistortionGlitch(canvas);
+        case "scan-lines":
+          return this.applyScanLineGlitch(canvas);
+        case "data-corruption":
+          return this.applyDataCorruptionGlitch(canvas);
+      }
+    } catch (error) {
+      return console.warn("Glitch effect failed:", error), null;
+    }
+  }
+  applyRGBShiftGlitch(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+      const dynamicIntensity = ImageProcessUtils.calculateDynamicStrength(this.glitchConfig.intensity, this.getAnimationTime()),
+        maxOffset = Math.floor(20 * dynamicIntensity),
+        redOffset = this.generateRandomOffset(maxOffset),
+        greenOffset = this.generateRandomOffset(maxOffset, .3),
+        blueOffset = this.generateRandomOffset(-maxOffset),
+        tempCanvas = ImageProcessUtils.createTempCanvas(canvas.width, canvas.height),
+        tempCtx = tempCanvas.getContext("2d");
+      tempCtx.drawImage(canvas, 0, 0);
+      const originalImageData = tempCtx.getImageData(0, 0, canvas.width, canvas.height),
+        redChannelData = ImageProcessUtils.extractChannel(originalImageData, 0),
+        greenChannelData = ImageProcessUtils.extractChannel(originalImageData, 1),
+        blueChannelData = ImageProcessUtils.extractChannel(originalImageData, 2);
+      return ctx.globalCompositeOperation = "screen", tempCtx.clearRect(0, 0, canvas.width, canvas.height), tempCtx.putImageData(redChannelData, 0, 0), ctx.drawImage(tempCanvas, redOffset.x, redOffset.y), tempCtx.clearRect(0, 0, canvas.width, canvas.height), tempCtx.putImageData(greenChannelData, 0, 0), ctx.drawImage(tempCanvas, greenOffset.x, greenOffset.y), tempCtx.clearRect(0, 0, canvas.width, canvas.height), tempCtx.putImageData(blueChannelData, 0, 0), ctx.drawImage(tempCanvas, blueOffset.x, blueOffset.y), ctx.globalCompositeOperation = "source-over", outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("RGB shift glitch failed:", error), null;
+    }
+  }
+  applyDigitalDistortionGlitch(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+        dynamicIntensity = ImageProcessUtils.calculateDynamicStrength(this.glitchConfig.intensity, this.getAnimationTime()),
+        distortedImageData = this.processDigitalDistortion(imageData, dynamicIntensity);
+      return ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.putImageData(distortedImageData, 0, 0), outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("Digital distortion glitch failed:", error), null;
+    }
+  }
+  applyScanLineGlitch(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      const dynamicIntensity = ImageProcessUtils.calculateDynamicStrength(this.glitchConfig.intensity, this.getAnimationTime()),
+        lineSpacing = Math.max(2, Math.floor(10 - 8 * dynamicIntensity));
+      ctx.globalCompositeOperation = "multiply";
+      for (let y = 0; y < canvas.height; y += lineSpacing) if (Math.random() < dynamicIntensity) {
+        const opacity = .1 + .4 * dynamicIntensity;
+        ctx.fillStyle = `rgba(0, 0, 0, ${opacity})`, ctx.fillRect(0, y, canvas.width, 1);
+      }
+      ctx.globalCompositeOperation = "screen";
+      const brightLineCount = Math.floor(20 * dynamicIntensity);
+      for (let i = 0; i < brightLineCount; i++) {
+        const y = Math.random() * canvas.height,
+          opacity = .3 * dynamicIntensity;
+        ctx.fillStyle = `rgba(255, 255, 255, ${opacity})`, ctx.fillRect(0, Math.floor(y), canvas.width, 1);
+      }
+      return ctx.globalCompositeOperation = "source-over", outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("Scan line glitch failed:", error), null;
+    }
+  }
+  applyDataCorruptionGlitch(canvas) {
+    const outputCanvas = this.createOutputCanvas(canvas);
+    if (!outputCanvas) return null;
+    const {
+      ctx: ctx
+    } = outputCanvas;
+    try {
+      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+        dynamicIntensity = ImageProcessUtils.calculateDynamicStrength(this.glitchConfig.intensity, this.getAnimationTime()),
+        corruptedImageData = this.processDataCorruption(imageData, dynamicIntensity);
+      return ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.putImageData(corruptedImageData, 0, 0), outputCanvas.canvas;
+    } catch (error) {
+      return console.warn("Data corruption glitch failed:", error), null;
+    }
+  }
+  generateRandomOffset(maxOffset, scale = 1) {
+    return {
+      x: (Math.random() - .5) * maxOffset,
+      y: (Math.random() - .5) * maxOffset * scale
+    };
+  }
+  processDigitalDistortion(imageData, intensity) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data),
+      sliceCount = Math.floor(20 * intensity) + 5,
+      sliceHeight = Math.floor(height / sliceCount);
+    for (let i = 0; i < sliceCount; i++) if (Math.random() < intensity) {
+      const y = i * sliceHeight,
+        sliceEnd = Math.min(y + sliceHeight, height),
+        offset = Math.floor((Math.random() - .5) * width * intensity * .1);
+      this.shiftSliceHorizontal(result, width, height, y, sliceEnd, offset);
+    }
+    const noiseIntensity = .3 * intensity;
+    for (let i = 0; i < data.length; i += 4) Math.random() < noiseIntensity && (result[i] = 255 * Math.random(), result[i + 1] = 255 * Math.random(), result[i + 2] = 255 * Math.random());
+    return new ImageData(result, width, height);
+  }
+  shiftSliceHorizontal(data, width, height, startY, endY, offset) {
+    const tempRow = new Uint8ClampedArray(4 * width);
+    for (let y = startY; y < endY; y++) {
+      const rowStart = y * width * 4;
+      for (let x = 0; x < 4 * width; x++) tempRow[x] = data[rowStart + x];
+      for (let x = 0; x < width; x++) {
+        const targetIndex = rowStart + 4 * x,
+          sourceIndex = 4 * ((x - offset + width) % width);
+        data[targetIndex] = tempRow[sourceIndex], data[targetIndex + 1] = tempRow[sourceIndex + 1], data[targetIndex + 2] = tempRow[sourceIndex + 2], data[targetIndex + 3] = tempRow[sourceIndex + 3];
+      }
+    }
+  }
+  processDataCorruption(imageData, intensity) {
+    const {
+        data: data,
+        width: width,
+        height: height
+      } = imageData,
+      result = new Uint8ClampedArray(data),
+      stripeCount = Math.floor(15 * intensity) + 5;
+    for (let i = 0; i < stripeCount; i++) if (Math.random() < intensity) {
+      const x = Math.floor(Math.random() * width),
+        stripeWidth = Math.floor(5 * Math.random()) + 1,
+        color = Math.random() < .5 ? 0 : 255;
+      for (let y = 0; y < height; y++) for (let dx = 0; dx < stripeWidth && x + dx < width; dx++) {
+        const index = 4 * (y * width + x + dx);
+        result[index] = color, result[index + 1] = color, result[index + 2] = color;
+      }
+    }
+    const corruptionCount = Math.floor(20 * intensity);
+    for (let i = 0; i < corruptionCount; i++) {
+      const blockX = Math.floor(Math.random() * width),
+        blockY = Math.floor(Math.random() * height),
+        blockW = Math.floor(20 * Math.random()) + 5,
+        blockH = Math.floor(10 * Math.random()) + 2;
+      this.corruptBlock(result, width, height, blockX, blockY, blockW, blockH);
+    }
+    return new ImageData(result, width, height);
+  }
+  corruptBlock(data, width, height, x, y, w, h) {
+    for (let dy = 0; dy < h && y + dy < height; dy++) for (let dx = 0; dx < w && x + dx < width; dx++) {
+      const index = 4 * ((y + dy) * width + (x + dx));
+      Math.random() < .7 && (data[index] = 255 * Math.random(), data[index + 1] = 255 * Math.random(), data[index + 2] = 255 * Math.random());
+    }
+  }
+}
+
+class GaussianBlur extends AStageAnimate {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b;
+    super(from, to, duration, easing, params), this.blurConfig = {
+      blurRadius: (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.blurRadius) || 8,
+      useOptimizedBlur: void 0 === (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.useOptimizedBlur) || params.options.useOptimizedBlur
+    };
+  }
+  applyCSSBlur(canvas, radius) {
+    const c = vglobal.createCanvas({
+        width: canvas.width,
+        height: canvas.height,
+        dpr: vglobal.devicePixelRatio
+      }),
+      ctx = c.getContext("2d");
+    return ctx ? (ctx.filter = `blur(${radius}px)`, ctx.drawImage(canvas, 0, 0), ctx.filter = "none", c) : canvas;
+  }
+  applyDownsampleBlur(imageData, radius) {
+    const {
+        width: width,
+        height: height
+      } = imageData,
+      downsample = Math.max(1, Math.floor(radius / 2)),
+      smallWidth = Math.floor(width / downsample),
+      smallHeight = Math.floor(height / downsample),
+      tempCanvas = vglobal.createCanvas({
+        width: smallWidth,
+        height: smallHeight,
+        dpr: 1
+      }),
+      tempCtx = tempCanvas.getContext("2d");
+    if (!tempCtx) return imageData;
+    const originalCanvas = vglobal.createCanvas({
+        width: width,
+        height: height,
+        dpr: 1
+      }),
+      originalCtx = originalCanvas.getContext("2d");
+    return originalCtx ? (originalCtx.putImageData(imageData, 0, 0), tempCtx.drawImage(originalCanvas, 0, 0, smallWidth, smallHeight), tempCtx.filter = `blur(${radius / downsample}px)`, tempCtx.drawImage(tempCanvas, 0, 0), tempCtx.filter = "none", originalCtx.clearRect(0, 0, width, height), originalCtx.drawImage(tempCanvas, 0, 0, width, height), originalCtx.getImageData(0, 0, width, height)) : imageData;
+  }
+  afterStageRender(stage, canvas) {
+    if (this.blurConfig.blurRadius <= 0) return canvas;
+    let result;
+    if (this.blurConfig.useOptimizedBlur) result = this.applyCSSBlur(canvas, this.blurConfig.blurRadius);else {
+      const c = vglobal.createCanvas({
+          width: canvas.width,
+          height: canvas.height,
+          dpr: vglobal.devicePixelRatio
+        }),
+        ctx = c.getContext("2d");
+      if (!ctx) return !1;
+      ctx.clearRect(0, 0, canvas.width, canvas.height), ctx.drawImage(canvas, 0, 0);
+      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
+        blurredImageData = this.applyDownsampleBlur(imageData, this.blurConfig.blurRadius);
+      ctx.putImageData(blurredImageData, 0, 0), result = c;
+    }
+    const ctx = result.getContext("2d");
+    return ctx && (ctx.globalCompositeOperation = "overlay", ctx.fillStyle = "rgba(255, 255, 255, 0.1)", ctx.fillRect(0, 0, result.width, result.height), ctx.globalCompositeOperation = "source-over"), result;
+  }
+}
+
+class Pixelation extends DisappearAnimateBase {
+  constructor(from, to, duration, easing, params) {
+    var _a, _b;
+    super(from, to, duration, easing, params), this.pixelationConfig = {
+      maxPixelSize: (null === (_a = null == params ? void 0 : params.options) || void 0 === _a ? void 0 : _a.maxPixelSize) || 20,
+      method: (null === (_b = null == params ? void 0 : params.options) || void 0 === _b ? void 0 : _b.method) || "out"
+    };
+  }
+  applyDownsamplePixelation(canvas, pixelSize) {
+    if (pixelSize <= 1) return canvas;
+    const {
+        width: width,
+        height: height
+      } = canvas,
+      smallWidth = Math.ceil(width / pixelSize),
+      smallHeight = Math.ceil(height / pixelSize),
+      smallCanvas = vglobal.createCanvas({
+        width: smallWidth,
+        height: smallHeight,
+        dpr: 1
+      }),
+      smallCtx = smallCanvas.getContext("2d");
+    if (!smallCtx) return canvas;
+    const outputCanvas = vglobal.createCanvas({
+        width: width,
+        height: height,
+        dpr: vglobal.devicePixelRatio
+      }),
+      outputCtx = outputCanvas.getContext("2d");
+    return outputCtx ? (smallCtx.imageSmoothingEnabled = !1, outputCtx.imageSmoothingEnabled = !1, smallCtx.drawImage(canvas, 0, 0, smallWidth, smallHeight), outputCtx.drawImage(smallCanvas, 0, 0, width, height), outputCanvas) : canvas;
+  }
+  updateAnimationProgress() {
+    if ("in" === this.pixelationConfig.method) {
+      return this.pixelationConfig.maxPixelSize - this.currentAnimationRatio * (this.pixelationConfig.maxPixelSize - 1);
+    }
+    return 1 + this.currentAnimationRatio * (this.pixelationConfig.maxPixelSize - 1);
+  }
+  afterStageRender(stage, canvas) {
+    const currentPixelSize = this.updateAnimationProgress();
+    if (currentPixelSize <= 1) return canvas;
+    return this.applyDownsamplePixelation(canvas, currentPixelSize);
+  }
+}
+
 const registerCustomAnimate = () => {
-  AnimateExecutor.registerBuiltInAnimate("increaseCount", IncreaseCount), AnimateExecutor.registerBuiltInAnimate("fromTo", FromTo), AnimateExecutor.registerBuiltInAnimate("scaleIn", ScaleIn), AnimateExecutor.registerBuiltInAnimate("scaleOut", ScaleOut), AnimateExecutor.registerBuiltInAnimate("growHeightIn", GrowHeightIn), AnimateExecutor.registerBuiltInAnimate("growHeightOut", GrowHeightOut), AnimateExecutor.registerBuiltInAnimate("growWidthIn", GrowWidthIn), AnimateExecutor.registerBuiltInAnimate("growWidthOut", GrowWidthOut), AnimateExecutor.registerBuiltInAnimate("growCenterIn", GrowCenterIn), AnimateExecutor.registerBuiltInAnimate("growCenterOut", GrowCenterOut), AnimateExecutor.registerBuiltInAnimate("clipIn", ClipIn), AnimateExecutor.registerBuiltInAnimate("clipOut", ClipOut), AnimateExecutor.registerBuiltInAnimate("fadeIn", FadeIn), AnimateExecutor.registerBuiltInAnimate("fadeOut", FadeOut), AnimateExecutor.registerBuiltInAnimate("growPointsIn", GrowPointsIn), AnimateExecutor.registerBuiltInAnimate("growPointsOut", GrowPointsOut), AnimateExecutor.registerBuiltInAnimate("growPointsXIn", GrowPointsXIn), AnimateExecutor.registerBuiltInAnimate("growPointsXOut", GrowPointsXOut), AnimateExecutor.registerBuiltInAnimate("growPointsYIn", GrowPointsYIn), AnimateExecutor.registerBuiltInAnimate("growPointsYOut", GrowPointsYOut), AnimateExecutor.registerBuiltInAnimate("growAngleIn", GrowAngleIn), AnimateExecutor.registerBuiltInAnimate("growAngleOut", GrowAngleOut), AnimateExecutor.registerBuiltInAnimate("growRadiusIn", GrowRadiusIn), AnimateExecutor.registerBuiltInAnimate("growRadiusOut", GrowRadiusOut), AnimateExecutor.registerBuiltInAnimate("moveIn", MoveIn), AnimateExecutor.registerBuiltInAnimate("moveOut", MoveOut), AnimateExecutor.registerBuiltInAnimate("rotateIn", RotateIn), AnimateExecutor.registerBuiltInAnimate("rotateOut", RotateOut), AnimateExecutor.registerBuiltInAnimate("update", Update), AnimateExecutor.registerBuiltInAnimate("state", State), AnimateExecutor.registerBuiltInAnimate("labelItemAppear", LabelItemAppear), AnimateExecutor.registerBuiltInAnimate("labelItemDisappear", LabelItemDisappear), AnimateExecutor.registerBuiltInAnimate("poptipAppear", PoptipAppear), AnimateExecutor.registerBuiltInAnimate("poptipDisappear", PoptipDisappear), AnimateExecutor.registerBuiltInAnimate("inputText", InputText), AnimateExecutor.registerBuiltInAnimate("inputRichText", InputRichText), AnimateExecutor.registerBuiltInAnimate("outputRichText", OutputRichText), AnimateExecutor.registerBuiltInAnimate("slideRichText", SlideRichText), AnimateExecutor.registerBuiltInAnimate("slideOutRichText", SlideOutRichText), AnimateExecutor.registerBuiltInAnimate("slideIn", SlideIn), AnimateExecutor.registerBuiltInAnimate("growIn", GrowIn), AnimateExecutor.registerBuiltInAnimate("spinIn", SpinIn), AnimateExecutor.registerBuiltInAnimate("moveScaleIn", MoveScaleIn), AnimateExecutor.registerBuiltInAnimate("moveRotateIn", MoveRotateIn), AnimateExecutor.registerBuiltInAnimate("strokeIn", StrokeIn), AnimateExecutor.registerBuiltInAnimate("slideOut", SlideOut), AnimateExecutor.registerBuiltInAnimate("growOut", GrowOut), AnimateExecutor.registerBuiltInAnimate("spinOut", SpinOut), AnimateExecutor.registerBuiltInAnimate("moveScaleOut", MoveScaleOut), AnimateExecutor.registerBuiltInAnimate("moveRotateOut", MoveRotateOut), AnimateExecutor.registerBuiltInAnimate("strokeOut", StrokeOut), AnimateExecutor.registerBuiltInAnimate("pulse", PulseAnimate), AnimateExecutor.registerBuiltInAnimate("MotionPath", MotionPath), AnimateExecutor.registerBuiltInAnimate("streamLight", StreamLight);
+  AnimateExecutor.registerBuiltInAnimate("increaseCount", IncreaseCount), AnimateExecutor.registerBuiltInAnimate("fromTo", FromTo), AnimateExecutor.registerBuiltInAnimate("scaleIn", ScaleIn), AnimateExecutor.registerBuiltInAnimate("scaleOut", ScaleOut), AnimateExecutor.registerBuiltInAnimate("growHeightIn", GrowHeightIn), AnimateExecutor.registerBuiltInAnimate("growHeightOut", GrowHeightOut), AnimateExecutor.registerBuiltInAnimate("growWidthIn", GrowWidthIn), AnimateExecutor.registerBuiltInAnimate("growWidthOut", GrowWidthOut), AnimateExecutor.registerBuiltInAnimate("growCenterIn", GrowCenterIn), AnimateExecutor.registerBuiltInAnimate("growCenterOut", GrowCenterOut), AnimateExecutor.registerBuiltInAnimate("clipIn", ClipIn), AnimateExecutor.registerBuiltInAnimate("clipOut", ClipOut), AnimateExecutor.registerBuiltInAnimate("fadeIn", FadeIn), AnimateExecutor.registerBuiltInAnimate("fadeOut", FadeOut), AnimateExecutor.registerBuiltInAnimate("growPointsIn", GrowPointsIn), AnimateExecutor.registerBuiltInAnimate("growPointsOut", GrowPointsOut), AnimateExecutor.registerBuiltInAnimate("growPointsXIn", GrowPointsXIn), AnimateExecutor.registerBuiltInAnimate("growPointsXOut", GrowPointsXOut), AnimateExecutor.registerBuiltInAnimate("growPointsYIn", GrowPointsYIn), AnimateExecutor.registerBuiltInAnimate("growPointsYOut", GrowPointsYOut), AnimateExecutor.registerBuiltInAnimate("growAngleIn", GrowAngleIn), AnimateExecutor.registerBuiltInAnimate("growAngleOut", GrowAngleOut), AnimateExecutor.registerBuiltInAnimate("growRadiusIn", GrowRadiusIn), AnimateExecutor.registerBuiltInAnimate("growRadiusOut", GrowRadiusOut), AnimateExecutor.registerBuiltInAnimate("moveIn", MoveIn), AnimateExecutor.registerBuiltInAnimate("moveOut", MoveOut), AnimateExecutor.registerBuiltInAnimate("rotateIn", RotateIn), AnimateExecutor.registerBuiltInAnimate("rotateOut", RotateOut), AnimateExecutor.registerBuiltInAnimate("update", Update), AnimateExecutor.registerBuiltInAnimate("state", State), AnimateExecutor.registerBuiltInAnimate("labelItemAppear", LabelItemAppear), AnimateExecutor.registerBuiltInAnimate("labelItemDisappear", LabelItemDisappear), AnimateExecutor.registerBuiltInAnimate("poptipAppear", PoptipAppear), AnimateExecutor.registerBuiltInAnimate("poptipDisappear", PoptipDisappear), AnimateExecutor.registerBuiltInAnimate("inputText", InputText), AnimateExecutor.registerBuiltInAnimate("inputRichText", InputRichText), AnimateExecutor.registerBuiltInAnimate("outputRichText", OutputRichText), AnimateExecutor.registerBuiltInAnimate("slideRichText", SlideRichText), AnimateExecutor.registerBuiltInAnimate("slideOutRichText", SlideOutRichText), AnimateExecutor.registerBuiltInAnimate("slideIn", SlideIn), AnimateExecutor.registerBuiltInAnimate("growIn", GrowIn), AnimateExecutor.registerBuiltInAnimate("spinIn", SpinIn), AnimateExecutor.registerBuiltInAnimate("moveScaleIn", MoveScaleIn), AnimateExecutor.registerBuiltInAnimate("moveRotateIn", MoveRotateIn), AnimateExecutor.registerBuiltInAnimate("strokeIn", StrokeIn), AnimateExecutor.registerBuiltInAnimate("slideOut", SlideOut), AnimateExecutor.registerBuiltInAnimate("growOut", GrowOut), AnimateExecutor.registerBuiltInAnimate("spinOut", SpinOut), AnimateExecutor.registerBuiltInAnimate("moveScaleOut", MoveScaleOut), AnimateExecutor.registerBuiltInAnimate("moveRotateOut", MoveRotateOut), AnimateExecutor.registerBuiltInAnimate("strokeOut", StrokeOut), AnimateExecutor.registerBuiltInAnimate("pulse", PulseAnimate), AnimateExecutor.registerBuiltInAnimate("MotionPath", MotionPath), AnimateExecutor.registerBuiltInAnimate("streamLight", StreamLight), AnimateExecutor.registerBuiltInAnimate("dissolve", Dissolve), AnimateExecutor.registerBuiltInAnimate("grayscale", Grayscale), AnimateExecutor.registerBuiltInAnimate("distortion", Distortion), AnimateExecutor.registerBuiltInAnimate("particle", Particle), AnimateExecutor.registerBuiltInAnimate("glitch", Glitch), AnimateExecutor.registerBuiltInAnimate("gaussianBlur", GaussianBlur), AnimateExecutor.registerBuiltInAnimate("pixelation", Pixelation);
 };
 
-const version = "1.0.12";
+const version = "1.0.13";
 preLoadAllModule();
 if (isBrowserEnv()) {
     loadBrowserEnv(container);
@@ -35183,4 +36483,4 @@ registerOrthoCamera();
 registerCustomAnimate();
 registerAnimate();
 
-export { AComponentAnimate, ACustomAnimate, ARC3D_NUMBER_TYPE, ARC_NUMBER_TYPE, AREA_NUMBER_TYPE, AStageAnimate, AbstractGraphicRender, Animate, AnimateExecutor, AnimateMode, AnimateStatus, Step as AnimateStep, AnimateStepType, AnimationStateManager, AnimationStateStore, AnimationStates, AnimationTransitionRegistry, Application, Arc, Arc3d, Arc3dRender, ArcRender, ArcRenderContribution, Area, AreaRender, AreaRenderContribution, AttributeUpdateType, AutoEnablePlugins, BaseCanvas, BaseEnvContribution, BaseRender, BaseRenderContributionTime, BaseWindowHandlerContribution, Basis, BeforeRenderConstribution, BoundsContext, BoundsPicker, BrowserEnvContribution, CIRCLE_NUMBER_TYPE, Canvas3DDrawItemInterceptor, Canvas3DPickItemInterceptor, CanvasArc3dPicker, CanvasArcPicker, CanvasAreaPicker, CanvasCirclePicker, CanvasFactory, CanvasGifImagePicker, CanvasGlyphPicker, CanvasGroupPicker, CanvasImagePicker, CanvasLinePicker, CanvasLottiePicker, CanvasPathPicker, CanvasPickerContribution, CanvasPolygonPicker, CanvasPyramid3dPicker, CanvasRect3dPicker, CanvasRectPicker, CanvasRichTextPicker, CanvasStarPicker, CanvasSymbolPicker, CanvasTextLayout, CanvasTextPicker, Circle, CircleRender, CircleRenderContribution, ClipAngleAnimate, ClipDirectionAnimate, ClipGraphicAnimate, ClipIn, ClipOut, ClipRadiusAnimate, ColorInterpolate, ColorStore, ColorType, CommonDrawItemInterceptorContribution, CommonRenderContribution, ComponentAnimator, Container, ContainerModule, Context2dFactory, ContributionProvider, ContributionStore, CubicBezierCurve, CurveContext, CurveTypeEnum, CustomEvent, CustomPath2D, CustomSymbolClass, DEFAULT_TEXT_FONT_FAMILY, DebugDrawItemInterceptorContribution, DefaultArcAllocate, DefaultArcAttribute, DefaultArcRenderContribution, DefaultAreaAllocate, DefaultAreaAttribute, DefaultAreaTextureRenderContribution, DefaultAttribute, DefaultBaseBackgroundRenderContribution, DefaultBaseClipRenderAfterContribution, DefaultBaseClipRenderBeforeContribution, DefaultBaseInteractiveRenderContribution, DefaultBaseTextureRenderContribution, DefaultCanvasAllocate, DefaultCanvasArcRender, DefaultCanvasAreaRender, DefaultCanvasCircleRender, DefaultCanvasGroupRender, DefaultCanvasImageRender, DefaultCanvasLineRender, DefaultCanvasPathRender, DefaultCanvasPolygonRender, DefaultCanvasRectRender, DefaultCanvasSymbolRender, DefaultCanvasTextRender, DefaultCircleAllocate, DefaultCircleAttribute, DefaultCircleRenderContribution, DefaultConnectAttribute, DefaultDebugAttribute, DefaultFillStyle, DefaultGlobal, DefaultGlobalPickerService, DefaultGlyphAttribute, DefaultGraphicAllocate, DefaultGraphicMemoryManager, DefaultGraphicService, DefaultGraphicUtil, DefaultGroupAttribute, DefaultGroupBackgroundRenderContribution, DefaultImageAttribute, DefaultImageRenderContribution, DefaultLayerService, DefaultLayout, DefaultLineAllocate, DefaultLineAttribute, DefaultMat4Allocate, DefaultMatrixAllocate, DefaultPathAllocate, DefaultPathAttribute, DefaultPickService, DefaultPickStyle, DefaultPolygonAttribute, DefaultRect3dAttribute, DefaultRectAllocate, DefaultRectAttribute, DefaultRectRenderContribution, DefaultRenderService, DefaultRichTextAttribute, DefaultRichTextIconAttribute, DefaultStarAttribute, DefaultStrokeStyle, DefaultStyle, DefaultSymbolAllocate, DefaultSymbolAttribute, DefaultSymbolClipRangeStrokeRenderContribution, DefaultSymbolRenderContribution, DefaultTextAllocate, DefaultTextAttribute, DefaultTextMeasureContribution, DefaultTextStyle, DefaultTicker, DefaultTimeline, DefaultTransform, DefaultTransformUtil, DefaultWindow, Direction, DirectionalLight, DragNDrop, DrawContribution, DrawItemInterceptor, DynamicLayerHandlerContribution, Easing, Edge, EditModule, EmptyContext2d, EnvContribution, EventManager, EventSystem, EventTarget, FORMAT_ALL_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, FORMAT_TEXT_COMMAND, Factory, FadeIn, FadeOut, FederatedEvent, FederatedMouseEvent, FederatedPointerEvent, FederatedWheelEvent, FlexLayoutPlugin, Fragment, FromTo, GLYPH_NUMBER_TYPE, GRAPHIC_UPDATE_TAG_KEY, GROUP_NUMBER_TYPE, Generator, Gesture, GifImage, GlobalPickerService, Glyph, GlyphRender, Graphic, GraphicCreator$1 as GraphicCreator, GraphicPicker, GraphicRender, GraphicService, GraphicStateExtension, GraphicUtil, Group, GroupFadeIn, GroupFadeOut, GroupRender, GroupRenderContribution, GroupUpdateAABBBoundsMode, GrowAngleIn, GrowAngleOut, GrowCenterIn, GrowCenterOut, GrowHeightIn, GrowHeightOut, GrowIn, GrowOut, GrowPointsIn, GrowPointsOut, GrowPointsXIn, GrowPointsXOut, GrowPointsYIn, GrowPointsYOut, GrowRadiusIn, GrowRadiusOut, GrowWidthIn, GrowWidthOut, HtmlAttributePlugin, IContainPointMode, IMAGE_NUMBER_TYPE, Image$1 as Image, ImageRender, ImageRenderContribution, IncreaseCount, IncrementalDrawContribution, InputRichText, InputText, InteractiveDrawItemInterceptorContribution, InteractivePickItemInterceptorContribution, InteractiveSubRenderContribution, LINE_NUMBER_TYPE, LabelItemAppear, LabelItemDisappear, Layer, LayerService, Line$1 as Line, LineRender, Linear, LinearClosed, Lottie, ManualTicker, Mat4Allocate, MathArcPicker, MathAreaPicker, MathCirclePicker, MathGlyphPicker, MathImagePicker, MathLinePicker, MathPathPicker, MathPickerContribution, MathPolygonPicker, MathRectPicker, MathSymbolPicker, MathTextPicker, MatrixAllocate, MeasureModeEnum, MonotoneX, MonotoneY, MorphingPath, MotionPath, MoveIn, MoveOut, MoveRotateIn, MoveRotateOut, MoveScaleIn, MoveScaleOut, MultiToOneMorphingPath, NOWORK_ANIMATE_ATTR, Node, OrthoCamera, OutputRichText, PATH_NUMBER_TYPE, POLYGON_NUMBER_TYPE, PURE_STYLE_KEY, PYRAMID3D_NUMBER_TYPE, Path, PathRender, PathRenderContribution, PerformanceRAF, PickItemInterceptor, PickServiceInterceptor, PickerService, PluginService, Polygon, PolygonRender, PolygonRenderContribution, PoptipAppear, PoptipDisappear, PulseAnimate, Pyramid3d, Pyramid3dRender, REACT_TO_CANOPUS_EVENTS, REACT_TO_CANOPUS_EVENTS_LIST, RECT3D_NUMBER_TYPE, RECT_NUMBER_TYPE, RICHTEXT_NUMBER_TYPE, RafBasedSTO, ReactAttributePlugin, Rect, Rect3DRender, Rect3d, RectRender, RectRenderContribution, ReflectSegContext, RenderSelector, RenderService, ResourceLoader, RichText, RichTextEditPlugin, RichTextRender, RotateBySphereAnimate, RotateIn, RotateOut, STAR_NUMBER_TYPE, STATUS$1 as STATUS, SVG_ATTRIBUTE_MAP, SVG_ATTRIBUTE_MAP_KEYS, SVG_PARSE_ATTRIBUTE_MAP, SVG_PARSE_ATTRIBUTE_MAP_KEYS, SYMBOL_NUMBER_TYPE, ScaleIn, ScaleOut, SegContext, ShadowPickServiceInterceptorContribution, ShadowRoot, ShadowRootDrawItemInterceptorContribution, ShadowRootPickItemInterceptorContribution, SlideIn, SlideOut, SlideOutRichText, SlideRichText, SpinIn, SpinOut, SplitRectAfterRenderContribution, SplitRectBeforeRenderContribution, Stage, Star, StarRender, StarRenderContribution, State, StaticLayerHandlerContribution, Step$1 as Step, StepClosed, StreamLight, StrokeIn, StrokeOut, Symbol$1 as Symbol, SymbolRender, SymbolRenderContribution, TEXT_NUMBER_TYPE, TagPointsUpdate, Text, TextDirection, TextMeasureContribution, TextRender, TextRenderContribution, Theme, TransformUtil, Update, UpdateTag, VArc, VArc3d, VArea, VCircle, VGlobal, VGlyph, VGroup, VImage, VLine, VPath, VPolygon, VPyramid3d, VRect, VRect3d, VRichText, VSymbol, VText, VWindow, ViewTransform3dPlugin, VirtualLayerHandlerContribution, WILDCARD, WindowHandlerContribution, WrapText, XMLParser, _calculateLineHeight, _interpolateColor, _registerArc, addArcToBezierPath$1 as addArcToBezierPath, addAttributeToPrototype, alignBezierCurves, alignSubpath, alternatingWave, application, applyTransformOnBezierCurves, arc3dCanvasPickModule, arc3dModule, arcCanvasPickModule, arcMathPickModule, arcModule, areaCanvasPickModule, areaMathPickModule, areaModule, bezier, bezierCurversToPath, binarySplitPolygon, bindContributionProvider, bindContributionProviderNoSingletonScope, boundStroke, browserEnvModule, builtInSymbolStrMap, builtinSymbols, builtinSymbolsMap, calcLineCache, calculateArcCornerRadius, calculateLineHeight, canvasAllocate, centerToCorner, centroidOfSubpath, circleBounds, circleCanvasPickModule, circleMathPickModule, circleModule, clock, colorEqual, colorStringInterpolationToStr, columnCenterToEdge, columnEdgeToCenter, columnLeftToRight, columnRightToLeft, container, cornerTangents, cornerToCenter, createArc, createArc3d, createArea, createCanvasEventTransformer, createCircle, createColor, createComponentAnimator, createConicalGradient, createEventTransformer, createGifImage, createGlyph, createGroup, createImage, createImageElement$1 as createImageElement, createLine, createLottie, createMat4, createPath, createPolygon, createPyramid3d, createRect, createRect3d, createRectPath, createRichText, createShadowRoot, createStage, createStar, createSymbol, createText, createWrapText, cubicCalc, cubicLength, cubicPointAt, cubicSubdivide, decodeReactDom, defaultArcAllocate, defaultArcBackgroundRenderContribution, defaultArcRenderContribution, defaultArcTextureRenderContribution, defaultAreaAllocate, defaultBaseBackgroundRenderContribution, defaultBaseClipRenderAfterContribution, defaultBaseClipRenderBeforeContribution, defaultBaseTextureRenderContribution, defaultCircleAllocate, defaultCircleBackgroundRenderContribution, defaultCircleRenderContribution, defaultCircleTextureRenderContribution, defaultGraphicMemoryManager, defaultGroupBackgroundRenderContribution, defaultImageBackgroundRenderContribution, defaultImageRenderContribution, defaultLineAllocate, defaultPathAllocate, defaultRectAllocate, defaultRectBackgroundRenderContribution, defaultRectRenderContribution, defaultRectTextureRenderContribution, defaultStarBackgroundRenderContribution, defaultStarTextureRenderContribution, defaultSymbolAllocate, defaultSymbolBackgroundRenderContribution, defaultSymbolClipRangeStrokeRenderContribution, defaultSymbolRenderContribution, defaultSymbolTextureRenderContribution, defaultTextAllocate, diagonalCenterToEdge, diagonalTopLeftToBottomRight, diff, divideCubic, drawArc, drawArcPath$1 as drawArcPath, drawAreaSegments, drawIncrementalAreaSegments, drawIncrementalSegments, drawSegments, enumCommandMap, feishuEnvModule, fillVisible, findBestMorphingRotation, findConfigIndexByCursorIdx, findCursorIdxByConfigIndex, findNextGraphic, flatten_simplify, foreach, foreachAsync, genBasisSegments, genBasisTypeSegments, genLinearClosedSegments, genLinearClosedTypeSegments, genLinearSegments, genLinearTypeSegments, genMonotoneXSegments, genMonotoneXTypeSegments, genMonotoneYSegments, genMonotoneYTypeSegments, genNumberType, genStepClosedSegments, genStepSegments, genStepTypeSegments, generatorPathEasingFunc, getAttributeFromDefaultAttrList, getConicGradientAt, getCurrentEnv, getDefaultCharacterConfig, getExtraModelMatrix, getModelMatrix, getRichTextBounds, getScaledStroke, getTextBounds, getTheme, getThemeFromGroup, gifImageCanvasPickModule, gifImageModule, globalTheme, glyphCanvasPickModule, glyphMathPickModule, glyphModule, graphicCreator, graphicService, graphicUtil, harmonyEnvModule, identityMat4, imageCanvasPickModule, imageMathPickModule, imageModule, incrementalAddTo, initAllEnv, initBrowserEnv, initFeishuEnv, initHarmonyEnv, initLynxEnv, initNodeEnv, initTTEnv, initTaroEnv, initWxEnv, inject, injectable, interpolateColor, interpolateGradientConicalColor, interpolateGradientLinearColor, interpolateGradientRadialColor, interpolatePureColorArray, interpolatePureColorArrayToStr, intersect, isBrowserEnv, isNodeEnv, isSvg, isXML, jsx, layerService, lineCanvasPickModule, lineMathPickModule, lineModule, loadAllEnv, loadAllModule, loadBrowserEnv, loadFeishuEnv, loadHarmonyEnv, loadLynxEnv, loadNodeEnv, loadTTEnv, loadTaroEnv, loadWxEnv, lookAt, lottieCanvasPickModule, lottieModule, lynxEnvModule, mapToCanvasPointForCanvas, mat3Tomat4, mat4Allocate, matrixAllocate, morphPath, multiInject, multiToOneMorph, multiplyMat4Mat3, multiplyMat4Mat4, named, newThemeObj, nodeEnvModule, oneToMultiMorph, ortho, parsePadding, parseStroke, parseSvgPath, particleEffect, pathCanvasPickModule, pathMathPickModule, pathModule, pathToBezierCurves, point$3 as point, pointEqual, pointInterpolation, pointInterpolationHighPerformance, pointsEqual, pointsInterpolation, polygonCanvasPickModule, polygonMathPickModule, polygonModule, preLoadAllModule, pulseWave, pyramid3dCanvasPickModule, pyramid3dModule, quadCalc, quadLength, quadPointAt, rafBasedSto, randomOpacity, rect3dCanvasPickModule, rect3dModule, rectCanvasPickModule, rectFillVisible, rectMathPickModule, rectModule, rectStrokeVisible, recursiveCallBinarySplit, registerAnimate, registerArc, registerArc3d, registerArc3dGraphic, registerArcGraphic, registerArea, registerAreaGraphic, registerCircle, registerCircleGraphic, registerCustomAnimate, registerDirectionalLight, registerFlexLayoutPlugin, registerGifGraphic, registerGifImage, registerGlobalEventTransformer, registerGlyph, registerGlyphGraphic, registerGroup, registerGroupGraphic, registerHtmlAttributePlugin, registerImage, registerImageGraphic, registerLine, registerLineGraphic, registerOrthoCamera, registerPath, registerPathGraphic, registerPolygon, registerPolygonGraphic, registerPyramid3d, registerPyramid3dGraphic, registerReactAttributePlugin, registerRect, registerRect3d, registerRect3dGraphic, registerRectGraphic, registerRichtext, registerRichtextGraphic, registerShadowRoot, registerShadowRootGraphic, registerStar, registerStarGraphic, registerSymbol, registerSymbolGraphic, registerText, registerTextGraphic, registerViewTransform3dPlugin, registerWindowEventTransformer, registerWrapText, registerWrapTextGraphic, renderCommandList, renderService, rewriteProto, richTextMathPickModule, richtextCanvasPickModule, richtextModule, rippleEffect, rotateX, rotateY, rotateZ, rotationScan, roughModule, rowBottomToTop, rowCenterToEdge, rowEdgeToCenter, rowTopToBottom, runFill, runStroke, scaleMat4, segments, shouldUseMat4, snakeWave, snapLength, spiralEffect, splitArc, splitArea, splitCircle, splitLine, splitPath, splitPolygon, splitRect, splitToGrids, starModule, strCommandMap, strokeVisible, symbolCanvasPickModule, symbolMathPickModule, symbolModule, taroEnvModule, textAttributesToStyle, textCanvasPickModule, textDrawOffsetX, textDrawOffsetY, textLayoutOffsetY, textMathPickModule, textModule, transformMat4, transformPointForCanvas, transformUtil, transitionRegistry, translate, ttEnvModule, version, verticalLayout, vglobal, waitForAllSubLayers, wrapCanvas, wrapContext, wxEnvModule, xul };
+export { AComponentAnimate, ACustomAnimate, ARC3D_NUMBER_TYPE, ARC_NUMBER_TYPE, AREA_NUMBER_TYPE, AStageAnimate, AbstractGraphicRender, Animate, AnimateExecutor, AnimateMode, AnimateStatus, Step as AnimateStep, AnimateStepType, AnimationStateManager, AnimationStateStore, AnimationStates, AnimationTransitionRegistry, Application, Arc, Arc3d, Arc3dRender, ArcRender, ArcRenderContribution, Area, AreaRender, AreaRenderContribution, AttributeUpdateType, AutoEnablePlugins, BaseCanvas, BaseEnvContribution, BaseRender, BaseRenderContributionTime, BaseWindowHandlerContribution, Basis, BeforeRenderConstribution, BoundsContext, BoundsPicker, BrowserEnvContribution, CIRCLE_NUMBER_TYPE, Canvas3DDrawItemInterceptor, Canvas3DPickItemInterceptor, CanvasArc3dPicker, CanvasArcPicker, CanvasAreaPicker, CanvasCirclePicker, CanvasFactory, CanvasGifImagePicker, CanvasGlyphPicker, CanvasGroupPicker, CanvasImagePicker, CanvasLinePicker, CanvasLottiePicker, CanvasPathPicker, CanvasPickerContribution, CanvasPolygonPicker, CanvasPyramid3dPicker, CanvasRect3dPicker, CanvasRectPicker, CanvasRichTextPicker, CanvasStarPicker, CanvasSymbolPicker, CanvasTextLayout, CanvasTextPicker, Circle, CircleRender, CircleRenderContribution, ClipAngleAnimate, ClipDirectionAnimate, ClipGraphicAnimate, ClipIn, ClipOut, ClipRadiusAnimate, ColorInterpolate, ColorStore, ColorType, CommonDrawItemInterceptorContribution, CommonRenderContribution, ComponentAnimator, Container, ContainerModule, Context2dFactory, ContributionProvider, ContributionStore, CubicBezierCurve, CurveContext, CurveTypeEnum, CustomEvent, CustomPath2D, CustomSymbolClass, DEFAULT_TEXT_FONT_FAMILY, DebugDrawItemInterceptorContribution, DefaultArcAllocate, DefaultArcAttribute, DefaultArcRenderContribution, DefaultAreaAllocate, DefaultAreaAttribute, DefaultAreaTextureRenderContribution, DefaultAttribute, DefaultBaseBackgroundRenderContribution, DefaultBaseClipRenderAfterContribution, DefaultBaseClipRenderBeforeContribution, DefaultBaseInteractiveRenderContribution, DefaultBaseTextureRenderContribution, DefaultCanvasAllocate, DefaultCanvasArcRender, DefaultCanvasAreaRender, DefaultCanvasCircleRender, DefaultCanvasGroupRender, DefaultCanvasImageRender, DefaultCanvasLineRender, DefaultCanvasPathRender, DefaultCanvasPolygonRender, DefaultCanvasRectRender, DefaultCanvasSymbolRender, DefaultCanvasTextRender, DefaultCircleAllocate, DefaultCircleAttribute, DefaultCircleRenderContribution, DefaultConnectAttribute, DefaultDebugAttribute, DefaultFillStyle, DefaultGlobal, DefaultGlobalPickerService, DefaultGlyphAttribute, DefaultGraphicAllocate, DefaultGraphicMemoryManager, DefaultGraphicService, DefaultGraphicUtil, DefaultGroupAttribute, DefaultGroupBackgroundRenderContribution, DefaultImageAttribute, DefaultImageRenderContribution, DefaultLayerService, DefaultLayout, DefaultLineAllocate, DefaultLineAttribute, DefaultMat4Allocate, DefaultMatrixAllocate, DefaultPathAllocate, DefaultPathAttribute, DefaultPickService, DefaultPickStyle, DefaultPolygonAttribute, DefaultRect3dAttribute, DefaultRectAllocate, DefaultRectAttribute, DefaultRectRenderContribution, DefaultRenderService, DefaultRichTextAttribute, DefaultRichTextIconAttribute, DefaultStarAttribute, DefaultStrokeStyle, DefaultStyle, DefaultSymbolAllocate, DefaultSymbolAttribute, DefaultSymbolClipRangeStrokeRenderContribution, DefaultSymbolRenderContribution, DefaultTextAllocate, DefaultTextAttribute, DefaultTextMeasureContribution, DefaultTextStyle, DefaultTicker, DefaultTimeline, DefaultTransform, DefaultTransformUtil, DefaultWindow, Direction, DirectionalLight, Dissolve, Distortion, DragNDrop, DrawContribution, DrawItemInterceptor, DynamicLayerHandlerContribution, Easing, Edge, EditModule, EmptyContext2d, EnvContribution, EventManager, EventSystem, EventTarget, FORMAT_ALL_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, FORMAT_TEXT_COMMAND, Factory, FadeIn, FadeOut, FederatedEvent, FederatedMouseEvent, FederatedPointerEvent, FederatedWheelEvent, FlexLayoutPlugin, Fragment, FromTo, GLYPH_NUMBER_TYPE, GRAPHIC_UPDATE_TAG_KEY, GROUP_NUMBER_TYPE, GaussianBlur, Generator, Gesture, GifImage, Glitch, GlobalPickerService, Glyph, GlyphRender, GradientParser, Graphic, GraphicCreator$1 as GraphicCreator, GraphicPicker, GraphicRender, GraphicService, GraphicStateExtension, GraphicUtil, Grayscale, Group, GroupFadeIn, GroupFadeOut, GroupRender, GroupRenderContribution, GroupUpdateAABBBoundsMode, GrowAngleIn, GrowAngleOut, GrowCenterIn, GrowCenterOut, GrowHeightIn, GrowHeightOut, GrowIn, GrowOut, GrowPointsIn, GrowPointsOut, GrowPointsXIn, GrowPointsXOut, GrowPointsYIn, GrowPointsYOut, GrowRadiusIn, GrowRadiusOut, GrowWidthIn, GrowWidthOut, HtmlAttributePlugin, IContainPointMode, IMAGE_NUMBER_TYPE, Image$1 as Image, ImageRender, ImageRenderContribution, IncreaseCount, IncrementalDrawContribution, InputRichText, InputText, InteractiveDrawItemInterceptorContribution, InteractivePickItemInterceptorContribution, InteractiveSubRenderContribution, LINE_NUMBER_TYPE, LabelItemAppear, LabelItemDisappear, Layer, LayerService, Line$1 as Line, LineRender, Linear, LinearClosed, Lottie, ManualTicker, Mat4Allocate, MathArcPicker, MathAreaPicker, MathCirclePicker, MathGlyphPicker, MathImagePicker, MathLinePicker, MathPathPicker, MathPickerContribution, MathPolygonPicker, MathRectPicker, MathSymbolPicker, MathTextPicker, MatrixAllocate, MeasureModeEnum, MonotoneX, MonotoneY, MorphingPath, MotionPath, MoveIn, MoveOut, MoveRotateIn, MoveRotateOut, MoveScaleIn, MoveScaleOut, MultiToOneMorphingPath, NOWORK_ANIMATE_ATTR, Node, OrthoCamera, OutputRichText, PATH_NUMBER_TYPE, POLYGON_NUMBER_TYPE, PURE_STYLE_KEY, PYRAMID3D_NUMBER_TYPE, Particle, Path, PathRender, PathRenderContribution, PerformanceRAF, PickItemInterceptor, PickServiceInterceptor, PickerService, Pixelation, PluginService, Polygon, PolygonRender, PolygonRenderContribution, PoptipAppear, PoptipDisappear, PulseAnimate, Pyramid3d, Pyramid3dRender, REACT_TO_CANOPUS_EVENTS, REACT_TO_CANOPUS_EVENTS_LIST, RECT3D_NUMBER_TYPE, RECT_NUMBER_TYPE, RICHTEXT_NUMBER_TYPE, RafBasedSTO, ReactAttributePlugin, Rect, Rect3DRender, Rect3d, RectRender, RectRenderContribution, ReflectSegContext, RenderSelector, RenderService, ResourceLoader, RichText, RichTextEditPlugin, RichTextRender, RotateBySphereAnimate, RotateIn, RotateOut, STAR_NUMBER_TYPE, STATUS$1 as STATUS, SVG_ATTRIBUTE_MAP, SVG_ATTRIBUTE_MAP_KEYS, SVG_PARSE_ATTRIBUTE_MAP, SVG_PARSE_ATTRIBUTE_MAP_KEYS, SYMBOL_NUMBER_TYPE, ScaleIn, ScaleOut, SegContext, ShadowPickServiceInterceptorContribution, ShadowRoot, ShadowRootDrawItemInterceptorContribution, ShadowRootPickItemInterceptorContribution, SlideIn, SlideOut, SlideOutRichText, SlideRichText, SpinIn, SpinOut, SplitRectAfterRenderContribution, SplitRectBeforeRenderContribution, Stage, Star, StarRender, StarRenderContribution, State, StaticLayerHandlerContribution, Step$1 as Step, StepClosed, StreamLight, StrokeIn, StrokeOut, Symbol$1 as Symbol, SymbolRender, SymbolRenderContribution, TEXT_NUMBER_TYPE, TagPointsUpdate, Text, TextDirection, TextMeasureContribution, TextRender, TextRenderContribution, Theme, TransformUtil, Update, UpdateTag, VArc, VArc3d, VArea, VCircle, VGlobal, VGlyph, VGroup, VImage, VLine, VPath, VPolygon, VPyramid3d, VRect, VRect3d, VRichText, VSymbol, VText, VWindow, ViewTransform3dPlugin, VirtualLayerHandlerContribution, WILDCARD, WindowHandlerContribution, WrapText, XMLParser, _calculateLineHeight, _interpolateColor, _registerArc, addArcToBezierPath$1 as addArcToBezierPath, addAttributeToPrototype, alignBezierCurves, alignSubpath, alternatingWave, application, applyTransformOnBezierCurves, arc3dCanvasPickModule, arc3dModule, arcCanvasPickModule, arcMathPickModule, arcModule, areaCanvasPickModule, areaMathPickModule, areaModule, bezier, bezierCurversToPath, binarySplitPolygon, bindContributionProvider, bindContributionProviderNoSingletonScope, boundStroke, browserEnvModule, builtInSymbolStrMap, builtinSymbols, builtinSymbolsMap, calcLineCache, calculateArcCornerRadius, calculateLineHeight, canvasAllocate, centerToCorner, centroidOfSubpath, circleBounds, circleCanvasPickModule, circleMathPickModule, circleModule, clock, colorEqual, colorStringInterpolationToStr, columnCenterToEdge, columnEdgeToCenter, columnLeftToRight, columnRightToLeft, container, cornerTangents, cornerToCenter, createArc, createArc3d, createArea, createCanvasEventTransformer, createCircle, createColor, createComponentAnimator, createConicalGradient, createEventTransformer, createGifImage, createGlyph, createGroup, createImage, createImageElement$1 as createImageElement, createLine, createLottie, createMat4, createPath, createPolygon, createPyramid3d, createRect, createRect3d, createRectPath, createRichText, createShadowRoot, createStage, createStar, createSymbol, createText, createWrapText, cubicCalc, cubicLength, cubicPointAt, cubicSubdivide, decodeReactDom, defaultArcAllocate, defaultArcBackgroundRenderContribution, defaultArcRenderContribution, defaultArcTextureRenderContribution, defaultAreaAllocate, defaultBaseBackgroundRenderContribution, defaultBaseClipRenderAfterContribution, defaultBaseClipRenderBeforeContribution, defaultBaseTextureRenderContribution, defaultCircleAllocate, defaultCircleBackgroundRenderContribution, defaultCircleRenderContribution, defaultCircleTextureRenderContribution, defaultGraphicMemoryManager, defaultGroupBackgroundRenderContribution, defaultImageBackgroundRenderContribution, defaultImageRenderContribution, defaultLineAllocate, defaultPathAllocate, defaultRectAllocate, defaultRectBackgroundRenderContribution, defaultRectRenderContribution, defaultRectTextureRenderContribution, defaultStarBackgroundRenderContribution, defaultStarTextureRenderContribution, defaultSymbolAllocate, defaultSymbolBackgroundRenderContribution, defaultSymbolClipRangeStrokeRenderContribution, defaultSymbolRenderContribution, defaultSymbolTextureRenderContribution, defaultTextAllocate, diagonalCenterToEdge, diagonalTopLeftToBottomRight, diff, divideCubic, drawArc, drawArcPath$1 as drawArcPath, drawAreaSegments, drawIncrementalAreaSegments, drawIncrementalSegments, drawSegments, enumCommandMap, feishuEnvModule, fillVisible, findBestMorphingRotation, findConfigIndexByCursorIdx, findCursorIdxByConfigIndex, findNextGraphic, flatten_simplify, foreach, foreachAsync, genBasisSegments, genBasisTypeSegments, genLinearClosedSegments, genLinearClosedTypeSegments, genLinearSegments, genLinearTypeSegments, genMonotoneXSegments, genMonotoneXTypeSegments, genMonotoneYSegments, genMonotoneYTypeSegments, genNumberType, genStepClosedSegments, genStepSegments, genStepTypeSegments, generatorPathEasingFunc, getAttributeFromDefaultAttrList, getConicGradientAt, getCurrentEnv, getDefaultCharacterConfig, getExtraModelMatrix, getModelMatrix, getRichTextBounds, getScaledStroke, getTextBounds, getTheme, getThemeFromGroup, gifImageCanvasPickModule, gifImageModule, globalTheme, glyphCanvasPickModule, glyphMathPickModule, glyphModule, graphicCreator, graphicService, graphicUtil, harmonyEnvModule, identityMat4, imageCanvasPickModule, imageMathPickModule, imageModule, incrementalAddTo, initAllEnv, initBrowserEnv, initFeishuEnv, initHarmonyEnv, initLynxEnv, initNodeEnv, initTTEnv, initTaroEnv, initWxEnv, inject, injectable, interpolateColor, interpolateGradientConicalColor, interpolateGradientLinearColor, interpolateGradientRadialColor, interpolatePureColorArray, interpolatePureColorArrayToStr, intersect, isBrowserEnv, isNodeEnv, isSvg, isXML, jsx, layerService, lineCanvasPickModule, lineMathPickModule, lineModule, loadAllEnv, loadAllModule, loadBrowserEnv, loadFeishuEnv, loadHarmonyEnv, loadLynxEnv, loadNodeEnv, loadTTEnv, loadTaroEnv, loadWxEnv, lookAt, lottieCanvasPickModule, lottieModule, lynxEnvModule, mapToCanvasPointForCanvas, mat3Tomat4, mat4Allocate, matrixAllocate, morphPath, multiInject, multiToOneMorph, multiplyMat4Mat3, multiplyMat4Mat4, named, newThemeObj, nodeEnvModule, oneToMultiMorph, ortho, parsePadding, parseStroke, parseSvgPath, particleEffect, pathCanvasPickModule, pathMathPickModule, pathModule, pathToBezierCurves, point$3 as point, pointEqual, pointInterpolation, pointInterpolationHighPerformance, pointsEqual, pointsInterpolation, polygonCanvasPickModule, polygonMathPickModule, polygonModule, preLoadAllModule, pulseWave, pyramid3dCanvasPickModule, pyramid3dModule, quadCalc, quadLength, quadPointAt, rafBasedSto, randomOpacity, rect3dCanvasPickModule, rect3dModule, rectCanvasPickModule, rectFillVisible, rectMathPickModule, rectModule, rectStrokeVisible, recursiveCallBinarySplit, registerAnimate, registerArc, registerArc3d, registerArc3dGraphic, registerArcGraphic, registerArea, registerAreaGraphic, registerCircle, registerCircleGraphic, registerCustomAnimate, registerDirectionalLight, registerFlexLayoutPlugin, registerGifGraphic, registerGifImage, registerGlobalEventTransformer, registerGlyph, registerGlyphGraphic, registerGroup, registerGroupGraphic, registerHtmlAttributePlugin, registerImage, registerImageGraphic, registerLine, registerLineGraphic, registerOrthoCamera, registerPath, registerPathGraphic, registerPolygon, registerPolygonGraphic, registerPyramid3d, registerPyramid3dGraphic, registerReactAttributePlugin, registerRect, registerRect3d, registerRect3dGraphic, registerRectGraphic, registerRichtext, registerRichtextGraphic, registerShadowRoot, registerShadowRootGraphic, registerStar, registerStarGraphic, registerSymbol, registerSymbolGraphic, registerText, registerTextGraphic, registerViewTransform3dPlugin, registerWindowEventTransformer, registerWrapText, registerWrapTextGraphic, renderCommandList, renderService, rewriteProto, richTextMathPickModule, richtextCanvasPickModule, richtextModule, rippleEffect, rotateX, rotateY, rotateZ, rotationScan, roughModule, rowBottomToTop, rowCenterToEdge, rowEdgeToCenter, rowTopToBottom, runFill, runStroke, scaleMat4, segments, shouldUseMat4, snakeWave, snapLength, spiralEffect, splitArc, splitArea, splitCircle, splitLine, splitPath, splitPolygon, splitRect, splitToGrids, starModule, strCommandMap, strokeVisible, symbolCanvasPickModule, symbolMathPickModule, symbolModule, taroEnvModule, textAttributesToStyle, textCanvasPickModule, textDrawOffsetX, textDrawOffsetY, textLayoutOffsetY, textMathPickModule, textModule, transformMat4, transformPointForCanvas, transformUtil, transitionRegistry, translate, ttEnvModule, version, verticalLayout, vglobal, waitForAllSubLayers, wrapCanvas, wrapContext, wxEnvModule, xul };