@visactor/vtable-plugins 1.17.7-alpha.1 → 1.17.7-alpha.2

package/dist/vtable-plugins.js

@@ -1525,13 +1525,10 @@
 
     class CurvePath {
       constructor() {
-        this._curves = [], this.bounds = new AABBBounds();
-      }
-      get curves() {
-        return this._curves;
+        this.curves = [], this.bounds = new AABBBounds();
       }
       getCurveLengths() {
-        return this._curves.map(curve => curve.getLength());
+        return this.curves.map(curve => curve.getLength());
       }
       getPointAt(t) {
         return {
@@ -1773,83 +1770,7 @@
         y = cubicCalc(p0.y, p1.y, p2.y, p3.y, t);
       return new Point(x, y);
     }
-    function quadCalc(p0, p1, p2, t) {
-      const one = 1 - t;
-      return one * one * p0 + 2 * one * t * p1 + t * t * p2;
-    }
-    function quadPointAt(p0, p1, p2, t) {
-      const x = quadCalc(p0.x, p1.x, p2.x, t),
-        y = quadCalc(p0.y, p1.y, p2.y, t);
-      return new Point(x, y);
-    }
-    function quadLength(p0, p1, p2, iterationCount) {
-      return snapLength([p0.x, p1.x, p2.x], [p0.y, p1.y, p2.y]);
-    }
 
-    class QuadraticBezierCurve extends Curve {
-      constructor(p0, p1, p2) {
-        super(), this.type = CurveTypeEnum.QuadraticBezierCurve, this.p0 = p0, this.p1 = p1, this.p2 = p2;
-      }
-      _validPoint() {
-        return Number.isFinite(this.p0.x + this.p0.y + this.p1.x + this.p1.y + this.p2.x + this.p2.y);
-      }
-      getPointAt(t) {
-        if (!1 !== this.defined) return quadPointAt(this.p0, this.p1, this.p2, t);
-        throw new Error("defined为false的点不能getPointAt");
-      }
-      calcLength() {
-        return this._validPoint() ? quadLength(this.p0, this.p1, this.p2) : 60;
-      }
-      calcProjLength(direction) {
-        return direction === Direction.ROW ? abs(this.p0.x - this.p2.x) : direction === Direction.COLUMN ? abs(this.p0.y - this.p2.y) : 0;
-      }
-      getAngleAt(t) {
-        const minT = max(t - .01, 0),
-          maxT = min(t + .01, 1),
-          minP = this.getPointAt(minT),
-          maxP = this.getPointAt(maxT);
-        return atan2(maxP.y - minP.y, maxP.x - minP.x);
-      }
-      draw(path, x, y, sx, sy, percent) {
-        if (path.moveTo(this.p0.x * sx + x, this.p0.y * sy + y), percent >= 1) path.quadraticCurveTo(this.p1.x * sx + x, this.p1.y * sy + y, this.p2.x * sx + x, this.p2.y * sy + y);else if (percent > 0) {
-          const [curve1] = divideQuad(this, percent);
-          path.quadraticCurveTo(curve1.p1.x * sx + x, curve1.p1.y * sy + y, curve1.p2.x * sx + x, curve1.p2.y * sy + y);
-        }
-      }
-      getYAt(x) {
-        throw new Error("QuadraticBezierCurve暂不支持getYAt");
-      }
-      includeX(x) {
-        throw new Error("QuadraticBezierCurve暂不支持includeX");
-      }
-    }
-
-    function divideCubic(curve, t) {
-      const {
-          p0: p0,
-          p1: p1,
-          p2: p2,
-          p3: p3
-        } = curve,
-        pt = cubicPointAt(p0, p1, p2, p3, t),
-        c1 = PointService.pointAtPP(p0, p1, t),
-        c2 = PointService.pointAtPP(p1, p2, t),
-        c3 = PointService.pointAtPP(p2, p3, t),
-        c12 = PointService.pointAtPP(c1, c2, t),
-        c23 = PointService.pointAtPP(c2, c3, t);
-      return [new CubicBezierCurve(p0, c1, c12, pt), new CubicBezierCurve(pt, c23, c3, p3)];
-    }
-    function divideQuad(curve, t) {
-      const {
-          p0: p0,
-          p1: p1,
-          p2: p2
-        } = curve,
-        pt = quadPointAt(p0, p1, p2, t),
-        c1 = PointService.pointAtPP(p0, p1, t),
-        c2 = PointService.pointAtPP(p1, p2, t);
-      return [new QuadraticBezierCurve(p0, c1, pt), new QuadraticBezierCurve(pt, c2, p2)];
-    }
     class CubicBezierCurve extends Curve {
       constructor(p0, p1, p2, p3) {
         super(), this.type = CurveTypeEnum.CubicBezierCurve, this.p0 = p0, this.p1 = p1, this.p2 = p2, this.p3 = p3;
@@ -1874,22 +1795,6 @@
           maxP = this.getPointAt(maxT);
         return atan2(maxP.y - minP.y, maxP.x - minP.x);
       }
-      draw(path, x, y, sx, sy, percent) {
-        if (path.moveTo(this.p0.x * sx + x, this.p0.y * sy + y), percent >= 1) path.bezierCurveTo(this.p1.x * sx + x, this.p1.y * sy + y, this.p2.x * sx + x, this.p2.y * sy + y, this.p3.x * sx + x, this.p3.y * sy + y);else if (percent > 0) {
-          const [curve1] = divideCubic(this, percent);
-          path.bezierCurveTo(curve1.p1.x * sx + x, curve1.p1.y * sy + y, curve1.p2.x * sx + x, curve1.p2.y * sy + y, curve1.p3.x * sx + x, curve1.p3.y * sy + y);
-        }
-      }
-      includeX(x) {
-        const minX = min(this.p0.x, this.p1.x, this.p2.x, this.p3.x),
-          maxX = max(this.p0.x, this.p1.x, this.p2.x, this.p3.x);
-        return x >= minX && x <= maxX;
-      }
-      getYAt(x) {
-        const minX = min(this.p0.x, this.p1.x, this.p2.x, this.p3.x),
-          t = (x - minX) / (max(this.p0.x, this.p1.x, this.p2.x, this.p3.x) - minX);
-        return this.getPointAt(t).y;
-      }
     }
 
     class LineCurve extends Curve {
@@ -1912,25 +1817,6 @@
       calcProjLength(direction) {
         return direction === Direction.ROW ? abs(this.p0.x - this.p1.x) : direction === Direction.COLUMN ? abs(this.p0.y - this.p1.y) : 0;
       }
-      draw(path, x, y, sx, sy, percent) {
-        if (path.moveTo(this.p0.x * sx + x, this.p0.y * sy + y), percent >= 1) path.lineTo(this.p1.x * sx + x, this.p1.y * sy + y);else if (percent > 0) {
-          const p = this.getPointAt(percent);
-          path.lineTo(p.x * sx + x, p.y * sy + y);
-        }
-      }
-      includeX(x) {
-        return x >= this.p0.x && x <= this.p1.x || x >= this.p1.x && x <= this.p0.x;
-      }
-      getYAt(x) {
-        if (this.includeX(x)) {
-          let minP = this.p0,
-            maxP = this.p1;
-          this.p0.x > this.p1.x && (minP = this.p1, maxP = this.p0);
-          const percent = (x - minP.x) / (maxP.x - minP.x);
-          return minP.y + percent * (maxP.y - minP.y);
-        }
-        return 1 / 0;
-      }
     }
 
     class SegContext {
@@ -2269,7 +2155,7 @@
           default:
             if (this._t <= 0) this.context.lineTo(this._x, y, !1 !== this._lastDefined && !1 !== p.defined, this.lastPoint), this.context.lineTo(x, y, !1 !== this._lastDefined && !1 !== p.defined, p);else {
               const x1 = this._x * (1 - this._t) + x * this._t;
-              .5 === this._t ? this.context.lineTo(x1, this._y, !1 !== this._lastDefined, this.lastPoint) : this.context.lineTo(x1, this._y, !1 !== this._lastDefined && !1 !== p.defined, this.lastPoint), this.context.lineTo(x1, y, !1 !== this._lastDefined && !1 !== p.defined, p);
+              this.context.lineTo(x1, this._y, !1 !== this._lastDefined && !1 !== p.defined, this.lastPoint), this.context.lineTo(x1, y, !1 !== this._lastDefined && !1 !== p.defined, p);
             }
         }
         this._lastDefined = p.defined, this._x = x, this._y = y, this.lastPoint = p;
@@ -2467,45 +2353,6 @@
     }
     const genCatmullRomClosedSegments = commonGenCatmullRomSegments("catmullRomClosed", CatmullRomClosed);
 
-    class CurveContext {
-      constructor(path) {
-        this.path = path, this._lastX = this._lastY = this._startX = this._startY = 0;
-      }
-      moveTo(x, y) {
-        return this._lastX = this._startX = x, this._lastY = this._startY = y, this;
-      }
-      lineTo(x, y) {
-        const curve = this.addLinearCurve(x, y);
-        this.path.addCurve(curve), this._lastX = x, this._lastY = y;
-      }
-      addLinearCurve(x, y) {
-        return new LineCurve(new Point(this._lastX, this._lastY), new Point(x, y));
-      }
-      quadraticCurveTo(aCPx, aCPy, aX, aY) {
-        const curve = new QuadraticBezierCurve(new Point(this._lastX, this._lastY), new Point(aCPx, aCPy), new Point(aX, aY));
-        this.path.addCurve(curve), this._lastX = aX, this._lastY = aY;
-      }
-      bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) {
-        const curve = new CubicBezierCurve(new Point(this._lastX, this._lastY), new Point(cp1x, cp1y), new Point(cp2x, cp2y), new Point(x, y));
-        this.path.addCurve(curve), this._lastX = x, this._lastY = y;
-      }
-      arcTo(aX1, aY1, aX2, aY2, aRadius) {
-        throw new Error("CurveContext不支持调用arcTo");
-      }
-      ellipse(aX, aY, xRadius, yRadius, aRotation, aStartAngle, aEndAngle, aClockwise) {
-        throw new Error("CurveContext不支持调用ellipse");
-      }
-      rect(x, y, w, h) {
-        throw new Error("CurveContext不支持调用rect");
-      }
-      arc(x, y, radius, startAngle, endAngle, counterclockwise) {
-        throw new Error("CurveContext不支持调用arc");
-      }
-      closePath() {
-        this.path.curves.length < 2 || this.lineTo(this._startX, this._startY);
-      }
-    }
-
     function calcLineCache(points, curveType, params) {
       var _a, _b;
       switch (curveType) {
@@ -2537,9 +2384,6 @@
       constructor(ctx) {
         super(), this.commandList = [], ctx && (this._ctx = ctx), this._boundsContext = new BoundsContext(this.bounds);
       }
-      get curves() {
-        return this.tryBuildCurves();
-      }
       setCtx(ctx) {
         this._ctx = ctx;
       }
@@ -2571,21 +2415,14 @@
         return this.commandList.push([enumCommandMap.Z]), this._ctx && this._ctx.closePath(), this;
       }
       addCurve(curve) {
-        this._curves.push(curve);
+        this.curves.push(curve);
       }
       clear() {
-        this.transformCbList = null, this.commandList.length = 0, this._curves.length = 0;
+        this.transformCbList = null, this.commandList.length = 0, this.curves.length = 0;
       }
       beginPath() {
         this.clear();
       }
-      tryBuildCurves() {
-        if (!this._curves || !this._curves.length) {
-          const curveContext = new CurveContext(this);
-          renderCommandList(this.commandList, curveContext, 0, 0, 1, 1);
-        }
-        return this._curves;
-      }
       toString() {
         if (!this.toStringCbList) {
           const list = [];
@@ -2616,7 +2453,7 @@
         } = line.attribute;
         if (!points) return;
         const cache = calcLineCache(points, curveType);
-        "x" === clipRangeByDimension ? this.direction = Direction.ROW : "y" === clipRangeByDimension ? this.direction = Direction.COLUMN : "auto" === clipRangeByDimension && (this.direction = cache.direction), this._curves = cache.curves;
+        "x" === clipRangeByDimension ? this.direction = Direction.ROW : "y" === clipRangeByDimension ? this.direction = Direction.COLUMN : "auto" === clipRangeByDimension && (this.direction = cache.direction), this.curves = cache.curves;
       }
       fromCustomPath2D(path, x, y, sX, sY) {
         return this.clear(), this._runCommandList(path.commandList, x, y, sX, sY), this._updateBounds(), this;
@@ -2704,10 +2541,10 @@
               x = current[5], y = current[6], controlX = current[3], controlY = current[4], this.bezierCurveTo(current[1] + l, current[2] + t, controlX + l, controlY + t, x + l, y + t);
               break;
             case "s":
-              tempX = x + current[3], tempY = y + current[4], null === previous[0].match(/[CcSs]/) ? (controlX = x, controlY = y) : (controlX = 2 * x - controlX, controlY = 2 * y - controlY), tempControlX = x + current[1], tempControlY = y + current[2], this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t), controlX = tempControlX, controlY = tempControlY, x = tempX, y = tempY;
+              tempX = x + current[3], tempY = y + current[4], controlX = 2 * x - controlX, controlY = 2 * y - controlY, this.bezierCurveTo(controlX + l, controlY + t, x + current[1] + l, y + current[2] + t, tempX + l, tempY + t), controlX = x + current[1], controlY = y + current[2], x = tempX, y = tempY;
               break;
             case "S":
-              tempX = current[3], tempY = current[4], null === previous[0].match(/[CcSs]/) ? (controlX = x, controlY = y) : (controlX = 2 * x - controlX, controlY = 2 * y - controlY), tempControlX = current[1], tempControlY = current[2], this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t), controlX = tempControlX, controlY = tempControlY, x = tempX, y = tempY;
+              tempX = current[3], tempY = current[4], controlX = 2 * x - controlX, controlY = 2 * y - controlY, this.bezierCurveTo(controlX + l, controlY + t, current[1] + l, current[2] + t, tempX + l, tempY + t), x = tempX, y = tempY, controlX = current[1], controlY = current[2];
               break;
             case "q":
               tempX = x + current[3], tempY = y + current[4], controlX = x + current[1], controlY = y + current[2], this.quadraticCurveTo(controlX + l, controlY + t, tempX + l, tempY + t), x = tempX, y = tempY;
@@ -2779,29 +2616,21 @@
       }
       getLength() {
         if (this.direction === Direction.COLUMN) {
-          if (!this._curves.length) return 0;
-          const sc = this._curves[0],
-            ec = this._curves[this._curves.length - 1];
+          if (!this.curves.length) return 0;
+          const sc = this.curves[0],
+            ec = this.curves[this.curves.length - 1];
           return abs(sc.p0.y - ec.p1.y);
         }
         if (this.direction === Direction.ROW) {
-          if (!this._curves.length) return 0;
-          const sc = this._curves[0],
-            ec = this._curves[this._curves.length - 1];
+          if (!this.curves.length) return 0;
+          const sc = this.curves[0],
+            ec = this.curves[this.curves.length - 1];
           return abs(sc.p0.x - ec.p1.x);
         }
-        return this._curves.reduce((l, c) => l + c.getLength(), 0);
-      }
-      getYAt(x) {
-        if (!this.curves) return 1 / 0;
-        for (let i = 0; i < this.curves.length; i++) {
-          const curve = this.curves[i];
-          if (curve.includeX(x)) return curve.getYAt(x);
-        }
-        return 1 / 0;
+        return this.curves.reduce((l, c) => l + c.getLength(), 0);
       }
       getAttrAt(distance) {
-        if (!this._curves) return {
+        if (!this.curves) return {
           pos: {
             x: 0,
             y: 0
@@ -2810,8 +2639,8 @@
         };
         let curve,
           _dis = 0;
-        for (let i = 0; i < this._curves.length; i++) {
-          curve = this._curves[i];
+        for (let i = 0; i < this.curves.length; i++) {
+          curve = this.curves[i];
           const cl = curve.getLength(this.direction);
           if (_dis + cl >= distance) break;
           _dis += cl;
@@ -2822,21 +2651,6 @@
           angle: curve.getAngleAt(t)
         };
       }
-      drawWithClipRange(ctx, size, x, y, clipRange) {
-        this.tryBuildCurves();
-        const totalLen = this.getLength() * clipRange;
-        let currLen = 0;
-        for (let i = 0; i < this._curves.length; i++) {
-          const curve = this._curves[i],
-            cl = curve.getLength(this.direction);
-          if (!(currLen + cl <= totalLen)) {
-            const percent = 1 - (currLen + cl - totalLen) / cl;
-            curve.draw(ctx, x, y, size, size, percent);
-            break;
-          }
-          curve.draw(ctx, x, y, size, size, 1), currLen += cl;
-        }
-      }
     }
     const temp = ["l", 0, 0, 0, 0, 0, 0, 0];
     function scale(current, sX, sY) {
@@ -2934,9 +2748,6 @@
       forceBoundsHeight: void 0,
       opacity: 1,
       background: null,
-      autoAnimateTexture: !1,
-      textureRatio: 1,
-      textureOptions: null,
       backgroundOpacity: 1,
       backgroundCornerRadius: 0,
       texture: null,
@@ -2945,13 +2756,7 @@
       texturePadding: 2,
       backgroundMode: "no-repeat",
       backgroundFit: !0,
-      backgroundKeepAspectRatio: !1,
-      backgroundClip: !0,
-      backgroundScale: 1,
-      backgroundOffsetX: 0,
-      backgroundOffsetY: 0,
       blur: 0,
-      filter: "",
       cursor: null,
       html: null,
       react: null
@@ -2988,8 +2793,7 @@
       globalCompositeOperation: "",
       overflow: "hidden",
       shadowPickMode: "graphic",
-      keepStrokeScale: !1,
-      clipConfig: null
+      keepStrokeScale: !1
     }, DefaultDebugAttribute), DefaultStyle), DefaultTransform);
     const DefaultArcAttribute = Object.assign(Object.assign({}, DefaultAttribute), {
       startAngle: 0,
@@ -3030,8 +2834,7 @@
       justifyContent: "flex-start",
       alignItems: "flex-start",
       alignContent: "flex-start",
-      baseOpacity: 1,
-      cornerType: "round"
+      baseOpacity: 1
     });
     const DefaultGlyphAttribute = Object.assign(Object.assign({}, DefaultAttribute), {
       path: "",
@@ -3052,7 +2855,6 @@
     const DefaultPathAttribute = Object.assign(Object.assign({}, DefaultAttribute), {
       path: new CustomPath2D(),
       fillStrokeOrder: 1,
-      clipRange: 1,
       customPath: () => {
         Logger.getInstance().warn("空函数");
       }
@@ -3068,8 +2870,7 @@
       x1: 0,
       y1: 0,
       strokeBoundsBuffer: 0,
-      cornerRadius: 0,
-      cornerType: "round"
+      cornerRadius: 0
     });
     Object.assign(Object.assign({}, DefaultAttribute), {
       width: 0,
@@ -3077,24 +2878,19 @@
       x1: 0,
       y1: 0,
       cornerRadius: 0,
-      length: 0,
-      cornerType: "round"
+      length: 0
     });
     const DefaultSymbolAttribute = Object.assign(Object.assign({}, DefaultAttribute), {
       symbolType: "circle",
       size: 10,
-      keepDirIn3d: !0,
-      clipRange: 1
+      keepDirIn3d: !0
     });
     const DefaultTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), {
       strokeBoundsBuffer: 0,
       keepDirIn3d: !0
     });
     const DefaultRichTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), {
-      upgradeAttrs: null,
       editable: !1,
-      editOptions: null,
-      ascentDescentMode: "actual",
       width: 300,
       height: 300,
       ellipsis: !0,
@@ -3114,13 +2910,10 @@
       repeatY: "no-repeat",
       image: "",
       width: 0,
-      height: 0,
-      maxWidth: 500,
-      maxHeight: 500
+      height: 0
     }, DefaultAttribute), {
       fill: !0,
-      cornerRadius: 0,
-      cornerType: "round"
+      cornerRadius: 0
     });
     const DefaultRichTextIconAttribute = Object.assign(Object.assign({}, DefaultImageAttribute), {
       backgroundShowMode: "never",
@@ -3800,26 +3593,8 @@
           return (t *= 2) < 1 ? amplitude * Math.pow(2, 10 * (t -= 1)) * Math.sin((t - s) * pi2 / period) * -.5 : amplitude * Math.pow(2, -10 * (t -= 1)) * Math.sin((t - s) * pi2 / period) * .5 + 1;
         };
       }
-      static registerFunc(name, func) {
-        Easing[name] = func;
-      }
-    }
-    function flicker(t, n) {
-      const step = 1 / n;
-      let flag = 1;
-      for (; t > step;) t -= step, flag *= -1;
-      const v = flag * t / step;
-      return v > 0 ? v : 1 + v;
     }
-    Easing.quadIn = Easing.getPowIn(2), Easing.quadOut = Easing.getPowOut(2), Easing.quadInOut = Easing.getPowInOut(2), Easing.cubicIn = Easing.getPowIn(3), Easing.cubicOut = Easing.getPowOut(3), Easing.cubicInOut = Easing.getPowInOut(3), Easing.quartIn = Easing.getPowIn(4), Easing.quartOut = Easing.getPowOut(4), Easing.quartInOut = Easing.getPowInOut(4), Easing.quintIn = Easing.getPowIn(5), Easing.quintOut = Easing.getPowOut(5), Easing.quintInOut = Easing.getPowInOut(5), Easing.backIn = Easing.getBackIn(1.7), Easing.backOut = Easing.getBackOut(1.7), Easing.backInOut = Easing.getBackInOut(1.7), Easing.elasticIn = Easing.getElasticIn(1, .3), Easing.elasticOut = Easing.getElasticOut(1, .3), Easing.elasticInOut = Easing.getElasticInOut(1, .3 * 1.5), Easing.easeInOutQuad = t => (t /= .5) < 1 ? .5 * Math.pow(t, 2) : -.5 * ((t -= 2) * t - 2), Easing.easeOutElastic = x => {
-      const c4 = 2 * Math.PI / 3;
-      return 0 === x ? 0 : 1 === x ? 1 : Math.pow(2, -10 * x) * Math.sin((10 * x - .75) * c4) + 1;
-    }, Easing.easeInOutElastic = x => {
-      const c5 = 2 * Math.PI / 4.5;
-      return 0 === x ? 0 : 1 === x ? 1 : x < .5 ? -Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5) / 2 : Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5) / 2 + 1;
-    };
-    for (let i = 0; i < 10; i++) Easing[`flicker${i}`] = t => flicker(t, i);
-    for (let i = 2; i < 10; i++) Easing[`aIn${i}`] = t => i * t * t + (1 - i) * t;
+    Easing.quadIn = Easing.getPowIn(2), Easing.quadOut = Easing.getPowOut(2), Easing.quadInOut = Easing.getPowInOut(2), Easing.cubicIn = Easing.getPowIn(3), Easing.cubicOut = Easing.getPowOut(3), Easing.cubicInOut = Easing.getPowInOut(3), Easing.quartIn = Easing.getPowIn(4), Easing.quartOut = Easing.getPowOut(4), Easing.quartInOut = Easing.getPowInOut(4), Easing.quintIn = Easing.getPowIn(5), Easing.quintOut = Easing.getPowOut(5), Easing.quintInOut = Easing.getPowInOut(5), Easing.backIn = Easing.getBackIn(1.7), Easing.backOut = Easing.getBackOut(1.7), Easing.backInOut = Easing.getBackInOut(1.7), Easing.elasticIn = Easing.getElasticIn(1, .3), Easing.elasticOut = Easing.getElasticOut(1, .3), Easing.elasticInOut = Easing.getElasticInOut(1, .3 * 1.5);
 
     class DefaultTimeline {
       constructor() {
@@ -3898,7 +3673,7 @@
         let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Generator.GenAutoIncrementId();
         let timeline = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultTimeline;
         let slience = arguments.length > 2 ? arguments[2] : undefined;
-        this.id = id, this.timeline = timeline || defaultTimeline, this.status = AnimateStatus.INITIAL, this.tailAnimate = new SubAnimate(this), this.subAnimates = [this.tailAnimate], this.timeScale = 1, this.rawPosition = -1, this._startTime = 0, this._duringTime = 0, this.timeline.addAnimate(this), this.slience = slience;
+        this.id = id, this.timeline = timeline, this.status = AnimateStatus.INITIAL, this.tailAnimate = new SubAnimate(this), this.subAnimates = [this.tailAnimate], this.timeScale = 1, this.rawPosition = -1, this._startTime = 0, this._duringTime = 0, this.timeline.addAnimate(this), this.slience = slience;
       }
       setTimeline(timeline) {
         timeline !== this.timeline && (this.timeline.removeAnimate(this, !1), timeline.addAnimate(this));
@@ -4094,7 +3869,7 @@
         (null == duration || duration < 0) && (duration = 0);
         const easingFunc = "string" == typeof easing ? Easing[easing] : easing,
           step = this._addStep(duration, null, easingFunc);
-        return step.type = AnimateStepType.to, this._appendProps(props, step, !!params && params.tempProps), step.propKeys || (step.propKeys = Object.keys(step.props)), params && params.noPreventAttrs || this.target.animates && this.target.animates.forEach(a => {
+        return step.type = AnimateStepType.to, this._appendProps(props, step, !!params && params.tempProps), step.propKeys || (step.propKeys = Object.keys(step.props)), params && params.noPreventAttrs || this.target.animates.forEach(a => {
           a.id !== this.animate.id && a.preventAttrs(step.propKeys);
         }), this;
       }
@@ -4473,785 +4248,7 @@
     }
     ResourceLoader.cache = new Map(), ResourceLoader.isLoading = !1, ResourceLoader.toLoadAueue = [], ResourceLoader.onLoadSuccessCb = [];
 
-    class BaseSymbol {
-      bounds(size, bounds) {
-        if (isNumber$1(size)) {
-          const halfS = size / 2;
-          bounds.x1 = -halfS, bounds.x2 = halfS, bounds.y1 = -halfS, bounds.y2 = halfS;
-        } else bounds.x1 = -size[0] / 2, bounds.x2 = size[0] / 2, bounds.y1 = -size[1] / 2, bounds.y2 = size[1] / 2;
-      }
-      parseSize(size) {
-        return isNumber$1(size) ? size : Math.min(size[0], size[1]);
-      }
-    }
-
-    function circle(ctx, r, x, y, z) {
-      return z ? ctx.arc(x, y, r, 0, tau, !1, z) : ctx.arc(x, y, r, 0, tau), !1;
-    }
-    class CircleSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "circle", this.pathStr = "M0.5,0A0.5,0.5,0,1,1,-0.5,0A0.5,0.5,0,1,1,0.5,0";
-      }
-      draw(ctx, size, x, y, z) {
-        return circle(ctx, this.parseSize(size) / 2, x, y, z);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return circle(ctx, this.parseSize(size) / 2 + offset, x, y, z);
-      }
-      drawToSvgPath(size, x, y, z) {
-        const r = this.parseSize(size) / 2;
-        return `M ${x - r}, ${y} a ${r},${r} 0 1,0 ${2 * r},0 a ${r},${r} 0 1,0 -${2 * r},0`;
-      }
-    }
-    var circle$1 = new CircleSymbol();
-
-    function cross(ctx, r, x, y, z) {
-      return ctx.moveTo(-3 * r + x, -r + y, z), ctx.lineTo(-r + x, -r + y, z), ctx.lineTo(-r + x, -3 * r + y, z), ctx.lineTo(r + x, -3 * r + y, z), ctx.lineTo(r + x, -r + y, z), ctx.lineTo(3 * r + x, -r + y, z), ctx.lineTo(3 * r + x, r + y, z), ctx.lineTo(r + x, r + y, z), ctx.lineTo(r + x, 3 * r + y, z), ctx.lineTo(-r + x, 3 * r + y, z), ctx.lineTo(-r + x, r + y, z), ctx.lineTo(-3 * r + x, r + y, z), ctx.closePath(), !0;
-    }
-    function crossOffset(ctx, r, x, y, offset, z) {
-      return ctx.moveTo(-3 * r + x - offset, -r + y - offset, z), ctx.lineTo(-r + x - offset, -r + y - offset, z), ctx.lineTo(-r + x - offset, -3 * r + y - offset, z), ctx.lineTo(r + x + offset, -3 * r + y - offset, z), ctx.lineTo(r + x + offset, -r + y - offset, z), ctx.lineTo(3 * r + x + offset, -r + y - offset, z), ctx.lineTo(3 * r + x + offset, r + y + offset, z), ctx.lineTo(r + x + offset, r + y + offset, z), ctx.lineTo(r + x + offset, 3 * r + y + offset, z), ctx.lineTo(-r + x - offset, 3 * r + y + offset, z), ctx.lineTo(-r + x - offset, r + y + offset, z), ctx.lineTo(-3 * r + x - offset, r + y + offset, z), ctx.closePath(), !0;
-    }
-    class CrossSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "cross", this.pathStr = "M-0.5,-0.2L-0.5,0.2L-0.2,0.2L-0.2,0.5L0.2,0.5L0.2,0.2L0.5,0.2L0.5,-0.2L0.2,-0.2L0.2,-0.5L-0.2,-0.5L-0.2,-0.2Z";
-      }
-      draw(ctx, size, x, y, z) {
-        return cross(ctx, this.parseSize(size) / 6, x, y, z);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return crossOffset(ctx, this.parseSize(size) / 6, x, y, offset, z);
-      }
-    }
-    var cross$1 = new CrossSymbol();
-
-    function diamond(ctx, r, x, y, z) {
-      return ctx.moveTo(x, y - r, z), ctx.lineTo(r + x, y, z), ctx.lineTo(x, y + r, z), ctx.lineTo(x - r, y, z), ctx.closePath(), !0;
-    }
-    class DiamondSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "diamond", this.pathStr = "M-0.5,0L0,-0.5L0.5,0L0,0.5Z";
-      }
-      draw(ctx, size, x, y, z) {
-        return diamond(ctx, this.parseSize(size) / 2, x, y, z);
-      }
-      drawFitDir(ctx, size, x, y, z) {
-        return diamond(ctx, this.parseSize(size) / 2, x, y, z);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return diamond(ctx, this.parseSize(size) / 2 + offset, x, y, z);
-      }
-    }
-    var diamond$1 = new DiamondSymbol();
-
-    function square(ctx, r, x, y) {
-      const wh = 2 * r;
-      return ctx.rect(x - r, y - r, wh, wh), !1;
-    }
-    class SquareSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "square", this.pathStr = "M-0.5,-0.5h1v1h-1Z";
-      }
-      draw(ctx, size, x, y) {
-        return square(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return square(ctx, this.parseSize(size) / 2 + offset, x, y);
-      }
-    }
-    var square$1 = new SquareSymbol();
-
-    function trianglUpOffset(ctx, r, x, y) {
-      let offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
-      return ctx.moveTo(x + r + 2 * offset, r + y + offset), ctx.lineTo(x - r - 2 * offset, r + y + offset), ctx.lineTo(x, y - r - 2 * offset), ctx.closePath(), !0;
-    }
-    class TriangleUpSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "triangleUp", this.pathStr = "M0.5,0.5 L-0.5,0.5 L0,-0.5 Z";
-      }
-      draw(ctx, size, x, y) {
-        return trianglUpOffset(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return trianglUpOffset(ctx, this.parseSize(size) / 2, x, y, offset);
-      }
-    }
-    var triangleUp = new TriangleUpSymbol();
-
-    class TriangleSymbol extends TriangleUpSymbol {
-      constructor() {
-        super(...arguments), this.type = "triangle";
-      }
-    }
-    var triangle = new TriangleSymbol();
-
-    const kr = Math.sin(Math.PI / 10) / Math.sin(7 * Math.PI / 10),
-      kx = Math.sin(tau / 10) * kr,
-      ky = -Math.cos(tau / 10) * kr;
-    function star(ctx, r, transX, transY) {
-      const x = kx * r,
-        y = ky * r;
-      ctx.moveTo(transX, -r + transY), ctx.lineTo(x + transX, y + transY);
-      for (let i = 1; i < 5; ++i) {
-        const a = tau * i / 5,
-          c = Math.cos(a),
-          s = Math.sin(a);
-        ctx.lineTo(s * r + transX, -c * r + transY), ctx.lineTo(c * x - s * y + transX, s * x + c * y + transY);
-      }
-      return ctx.closePath(), !0;
-    }
-    class StarSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "star", this.pathStr = "M0 -1L0.22451398828979266 -0.3090169943749474L0.9510565162951535 -0.30901699437494745L0.3632712640026804 0.1180339887498948L0.5877852522924732 0.8090169943749473L8.326672684688674e-17 0.3819660112501051L-0.587785252292473 0.8090169943749476L-0.3632712640026804 0.11803398874989487L-0.9510565162951536 -0.30901699437494723L-0.22451398828979274 -0.30901699437494734Z";
-      }
-      draw(ctx, size, transX, transY) {
-        return star(ctx, this.parseSize(size) / 2, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return star(ctx, this.parseSize(size) / 2 + offset, transX, transY);
-      }
-    }
-    var star$1 = new StarSymbol();
-
-    const sqrt3$1 = sqrt(3);
-    function arrow(ctx, r, transX, transY) {
-      const triangleH = r,
-        trangleBottomSide = triangleH / sqrt3$1,
-        rectW = trangleBottomSide / 5,
-        rectH = r;
-      return ctx.moveTo(0 + transX, -triangleH + transY), ctx.lineTo(trangleBottomSide / 2 + transX, transY), ctx.lineTo(rectW / 2 + transX, transY), ctx.lineTo(rectW / 2 + transX, rectH + transY), ctx.lineTo(-rectW / 2 + transX, rectH + transY), ctx.lineTo(-rectW / 2 + transX, transY), ctx.lineTo(-trangleBottomSide / 2 + transX, transY), ctx.closePath(), !0;
-    }
-    class ArrowSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "arrow", this.pathStr = "M-0.07142857142857142,0.5L0.07142857142857142,0.5L0.07142857142857142,-0.0625L0.2,-0.0625L0,-0.5L-0.2,-0.0625L-0.07142857142857142,-0.0625Z";
-      }
-      draw(ctx, size, transX, transY) {
-        return arrow(ctx, this.parseSize(size) / 2, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return arrow(ctx, this.parseSize(size) / 2 + offset, transX, transY);
-      }
-    }
-    var arrow$1 = new ArrowSymbol();
-
-    function wedge(ctx, r, transX, transY) {
-      const h = 2 * r;
-      return ctx.moveTo(transX, -r + transY), ctx.lineTo(h / 3 / 2 + transX, r + transY), ctx.lineTo(-h / 3 / 2 + transX, r + transY), ctx.closePath(), !0;
-    }
-    class WedgeSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "wedge", this.pathStr = "M0,-0.5773502691896257L-0.125,0.28867513459481287L0.125,0.28867513459481287Z";
-      }
-      draw(ctx, size, transX, transY) {
-        return wedge(ctx, this.parseSize(size) / 2, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return wedge(ctx, this.parseSize(size) / 2 + offset, transX, transY);
-      }
-    }
-    var wedge$1 = new WedgeSymbol();
-
-    function stroke(ctx, r, transX, transY) {
-      return ctx.moveTo(-r + transX, transY), ctx.lineTo(transX, r + transY), !1;
-    }
-    class StrokeSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "stroke", this.pathStr = "";
-      }
-      draw(ctx, size, transX, transY) {
-        return stroke(ctx, this.parseSize(size) / 2, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return stroke(ctx, this.parseSize(size) / 2 + offset, transX, transY);
-      }
-    }
-    var stroke$1 = new StrokeSymbol();
-
-    const c = -.5,
-      s = sqrt(3) / 2,
-      k = 1 / sqrt(12);
-    function wye(ctx, r, transX, transY) {
-      const x0 = r / 2,
-        y0 = r * k,
-        x1 = x0,
-        y1 = r * k + r,
-        x2 = -x1,
-        y2 = y1;
-      return ctx.moveTo(x0 + transX, y0 + transY), ctx.lineTo(x1 + transX, y1 + transY), ctx.lineTo(x2 + transX, y2 + transY), ctx.lineTo(c * x0 - s * y0 + transX, s * x0 + c * y0 + transY), ctx.lineTo(c * x1 - s * y1 + transX, s * x1 + c * y1 + transY), ctx.lineTo(c * x2 - s * y2 + transX, s * x2 + c * y2 + transY), ctx.lineTo(c * x0 + s * y0 + transX, c * y0 - s * x0 + transY), ctx.lineTo(c * x1 + s * y1 + transX, c * y1 - s * x1 + transY), ctx.lineTo(c * x2 + s * y2 + transX, c * y2 - s * x2 + transY), ctx.closePath(), !1;
-    }
-    class WyeSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "wye", this.pathStr = "M0.25 0.14433756729740646L0.25 0.6443375672974064L-0.25 0.6443375672974064L-0.25 0.14433756729740643L-0.6830127018922193 -0.10566243270259357L-0.4330127018922193 -0.5386751345948129L0 -0.28867513459481287L0.4330127018922193 -0.5386751345948129L0.6830127018922193 -0.10566243270259357Z";
-      }
-      draw(ctx, size, transX, transY) {
-        return wye(ctx, this.parseSize(size) / 2, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return wye(ctx, this.parseSize(size) / 2 + offset, transX, transY);
-      }
-    }
-    var wye$1 = new WyeSymbol();
-
-    function trianglLeftOffset(ctx, r, x, y, offset) {
-      return ctx.moveTo(-r + x - 2 * offset, y), ctx.lineTo(r + x + offset, r + y + 2 * offset), ctx.lineTo(r + x + offset, y - r - 2 * offset), ctx.closePath(), !0;
-    }
-    class TriangleLeftSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "triangleLeft", this.pathStr = "M-0.5,0 L0.5,0.5 L0.5,-0.5 Z";
-      }
-      draw(ctx, size, x, y) {
-        return trianglLeftOffset(ctx, this.parseSize(size) / 2, x, y, 0);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return trianglLeftOffset(ctx, this.parseSize(size) / 2, x, y, offset);
-      }
-    }
-    var triangleLeft = new TriangleLeftSymbol();
-
-    function trianglRightOffset(ctx, r, x, y) {
-      let offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
-      return ctx.moveTo(x - r - offset, r + y + 2 * offset), ctx.lineTo(r + x + 2 * offset, y), ctx.lineTo(x - r - offset, y - r - 2 * offset), ctx.closePath(), !0;
-    }
-    class TriangleRightSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "triangleRight", this.pathStr = "M-0.5,0.5 L0.5,0 L-0.5,-0.5 Z";
-      }
-      draw(ctx, size, x, y) {
-        return trianglRightOffset(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return trianglRightOffset(ctx, this.parseSize(size) / 2, x, y, offset);
-      }
-    }
-    var triangleRight = new TriangleRightSymbol();
-
-    function trianglDownOffset(ctx, r, x, y) {
-      let offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
-      return ctx.moveTo(x - r - 2 * offset, y - r - offset), ctx.lineTo(x + r + 2 * offset, y - r - offset), ctx.lineTo(x, y + r + 2 * offset), ctx.closePath(), !0;
-    }
-    class TriangleDownSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "triangleDown", this.pathStr = "M-0.5,-0.5 L0.5,-0.5 L0,0.5 Z";
-      }
-      draw(ctx, size, x, y) {
-        return trianglDownOffset(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return trianglDownOffset(ctx, this.parseSize(size) / 2, x, y, offset);
-      }
-    }
-    var triangleDown = new TriangleDownSymbol();
-
-    const sqrt3 = sqrt(3);
-    function thinTriangle(ctx, r, x, y) {
-      const h = r * sqrt3;
-      return ctx.moveTo(x, y + -h / 3 * 2), ctx.lineTo(r + x, y + h), ctx.lineTo(x - r, y + h), ctx.closePath(), !0;
-    }
-    class ThinTriangleSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "thinTriangle", this.pathStr = "M0,-0.5773502691896257L-0.5,0.28867513459481287L0.5,0.28867513459481287Z";
-      }
-      draw(ctx, size, x, y) {
-        return thinTriangle(ctx, this.parseSize(size) / 2 / sqrt3, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return thinTriangle(ctx, this.parseSize(size) / 2 / sqrt3 + offset, x, y);
-      }
-    }
-    var thinTriangle$1 = new ThinTriangleSymbol();
-
-    function arrow2Left(ctx, r, transX, transY) {
-      const r2 = 2 * r;
-      return ctx.moveTo(r + transX, transY - r2), ctx.lineTo(transX - r, transY), ctx.lineTo(r + transX, r2 + transY), !0;
-    }
-    class Arrow2LeftSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "arrow2Left", this.pathStr = "M 0.25 -0.5 L -0.25 0 l 0.25 0.5";
-      }
-      draw(ctx, size, transX, transY) {
-        return arrow2Left(ctx, this.parseSize(size) / 4, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return arrow2Left(ctx, this.parseSize(size) / 4 + offset, transX, transY);
-      }
-    }
-    var arrow2Left$1 = new Arrow2LeftSymbol();
-
-    function arrow2Right(ctx, r, transX, transY) {
-      const r2 = 2 * r;
-      return ctx.moveTo(transX - r, transY - r2), ctx.lineTo(transX + r, transY), ctx.lineTo(transX - r, r2 + transY), !0;
-    }
-    class Arrow2RightSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "arrow2Right", this.pathStr = "M -0.25 -0.5 l 0.25 0 l -0.25 0.5";
-      }
-      draw(ctx, size, transX, transY) {
-        return arrow2Right(ctx, this.parseSize(size) / 4, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return arrow2Right(ctx, this.parseSize(size) / 4 + offset, transX, transY);
-      }
-    }
-    var arrow2Right$1 = new Arrow2RightSymbol();
-
-    function arrow2Up(ctx, r, transX, transY) {
-      const r2 = 2 * r;
-      return ctx.moveTo(transX - r2, transY + r), ctx.lineTo(transX, transY - r), ctx.lineTo(transX + r2, transY + r), !0;
-    }
-    class Arrow2UpSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "arrow2Up", this.pathStr = "M -0.5 0.25 L 0 -0.25 l 0.5 0.25";
-      }
-      draw(ctx, size, transX, transY) {
-        return arrow2Up(ctx, this.parseSize(size) / 4, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return arrow2Up(ctx, this.parseSize(size) / 4 + offset, transX, transY);
-      }
-    }
-    var arrow2Up$1 = new Arrow2UpSymbol();
-
-    function arrow2Down(ctx, r, transX, transY) {
-      const r2 = 2 * r;
-      return ctx.moveTo(transX - r2, transY - r), ctx.lineTo(transX, transY + r), ctx.lineTo(transX + r2, transY - r), !0;
-    }
-    class Arrow2DownSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "arrow2Down", this.pathStr = "M -0.5 -0.25 L 0 0.25 l 0.5 -0.25";
-      }
-      draw(ctx, size, transX, transY) {
-        return arrow2Down(ctx, this.parseSize(size) / 4, transX, transY);
-      }
-      drawOffset(ctx, size, transX, transY, offset) {
-        return arrow2Down(ctx, this.parseSize(size) / 4 + offset, transX, transY);
-      }
-    }
-    var arrow2Down$1 = new Arrow2DownSymbol();
-
-    function lineV(ctx, r, x, y, z) {
-      return ctx.moveTo(x, y - r), ctx.lineTo(x, y + r), !0;
-    }
-    class LineVSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "lineV", this.pathStr = "M0,-0.5L0,0.5";
-      }
-      draw(ctx, size, x, y, z) {
-        return lineV(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return lineV(ctx, this.parseSize(size) / 2 + offset, x, y);
-      }
-      drawToSvgPath(size, x, y, z) {
-        const r = this.parseSize(size) / 2;
-        return `M ${x}, ${y - r} L ${x},${y + r}`;
-      }
-    }
-    var lineV$1 = new LineVSymbol();
-
-    function lineH(ctx, r, x, y, z) {
-      return ctx.moveTo(x - r, y), ctx.lineTo(x + r, y), !0;
-    }
-    class LineHSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "lineH", this.pathStr = "M-0.5,0L0.5,0";
-      }
-      draw(ctx, size, x, y, z) {
-        return lineH(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return lineH(ctx, this.parseSize(size) / 2 + offset, x, y);
-      }
-      drawToSvgPath(size, x, y, z) {
-        const r = this.parseSize(size) / 2;
-        return `M ${x - r}, ${y} L ${x + r},${y}`;
-      }
-    }
-    var lineH$1 = new LineHSymbol();
-
-    function close(ctx, r, x, y, z) {
-      return ctx.moveTo(x - r, y - r), ctx.lineTo(x + r, y + r), ctx.moveTo(x + r, y - r), ctx.lineTo(x - r, y + r), !0;
-    }
-    class CloseSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "close", this.pathStr = "M-0.5,-0.5L0.5,0.5,M0.5,-0.5L-0.5,0.5";
-      }
-      draw(ctx, size, x, y, z) {
-        return close(ctx, this.parseSize(size) / 2, x, y);
-      }
-      drawOffset(ctx, size, x, y, offset, z) {
-        return close(ctx, this.parseSize(size) / 2 + offset, x, y);
-      }
-      drawToSvgPath(size, x, y, z) {
-        const r = this.parseSize(size) / 2;
-        return `M ${x - r}, ${y - r} L ${x + r},${y + r} M ${x + r}, ${y - r} L ${x - r},${y + r}`;
-      }
-    }
-    var close$1 = new CloseSymbol();
-
-    function rectSizeArray(ctx, size, x, y) {
-      return ctx.rect(x - size[0] / 2, y - size[1] / 2, size[0], size[1]), !1;
-    }
-    function rectSize(ctx, size, x, y) {
-      const w = size,
-        h = size / 2;
-      return ctx.rect(x - w / 2, y - h / 2, w, h), !1;
-    }
-    class RectSymbol extends BaseSymbol {
-      constructor() {
-        super(...arguments), this.type = "rect", this.pathStr = "M -0.5,0.25 L 0.5,0.25 L 0.5,-0.25,L -0.5,-0.25 Z";
-      }
-      draw(ctx, size, x, y) {
-        return isNumber$1(size) ? rectSize(ctx, size, x, y) : rectSizeArray(ctx, size, x, y);
-      }
-      drawWithClipRange(ctx, size, x, y, clipRange, z, cb) {
-        isNumber$1(size) && (size = [size, size / 2]);
-        const drawLength = 2 * (size[0] + size[1]) * clipRange,
-          points = [{
-            x: x + size[0] / 2,
-            y: y - size[1] / 2
-          }, {
-            x: x + size[0] / 2,
-            y: y + size[1] / 2
-          }, {
-            x: x - size[0] / 2,
-            y: y + size[1] / 2
-          }, {
-            x: x - size[0] / 2,
-            y: y - size[1] / 2
-          }];
-        let currLength = 0,
-          lastP = points[3];
-        ctx.moveTo(lastP.x, lastP.y);
-        for (let i = 0; i < points.length; i++) {
-          const p = points[i],
-            len = Math.sqrt((p.x - lastP.x) * (p.x - lastP.x) + (p.y - lastP.y) * (p.y - lastP.y));
-          if (currLength + len > drawLength) {
-            const dx = (p.x - lastP.x) * (drawLength - currLength) / len,
-              dy = (p.y - lastP.y) * (drawLength - currLength) / len;
-            ctx.lineTo(lastP.x + dx, lastP.y + dy);
-            break;
-          }
-          ctx.lineTo(p.x, p.y), lastP = p, currLength += len;
-        }
-        return !1;
-      }
-      drawOffset(ctx, size, x, y, offset) {
-        return isNumber$1(size) ? rectSize(ctx, size + 2 * offset, x, y) : rectSizeArray(ctx, [size[0] + 2 * offset, size[1] + 2 * offset], x, y);
-      }
-    }
-    var rect = new RectSymbol();
-
-    const tempBounds$1 = new AABBBounds();
-    class CustomSymbolClass {
-      constructor(type, path) {
-        let isSvg = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : !1;
-        this.pathStr = "", this.type = type, isArray$1(path) ? this.svgCache = path : this.path = path, this.isSvg = isSvg;
-      }
-      drawOffset(ctx, size, x, y, offset, z, cb) {
-        return size = this.parseSize(size), this.isSvg ? !!this.svgCache && (this.svgCache.forEach(item => {
-          ctx.beginPath(), renderCommandList(item.path.commandList, ctx, x, y, size, size), cb && cb(item.path, item.attribute);
-        }), !1) : (renderCommandList(this.path.commandList, ctx, x, y, size + offset, size + offset), !1);
-      }
-      draw(ctx, size, x, y, z, cb) {
-        return size = this.parseSize(size), this.drawOffset(ctx, size, x, y, 0, z, cb);
-      }
-      parseSize(size) {
-        return isNumber$1(size) ? size : Math.min(size[0], size[1]);
-      }
-      drawWithClipRange(ctx, size, x, y, clipRange, z, cb) {
-        return size = this.parseSize(size), this.isSvg ? !!this.svgCache && (this.svgCache.forEach(item => {
-          item.path.drawWithClipRange(ctx, size, x, y, clipRange), cb && cb(item.path, item.attribute);
-        }), !1) : (this.path.drawWithClipRange(ctx, size, x, y, clipRange), !1);
-      }
-      bounds(size, bounds) {
-        if (size = this.parseSize(size), this.isSvg) {
-          if (!this.svgCache) return;
-          return bounds.clear(), void this.svgCache.forEach(_ref => {
-            let {
-              path: path
-            } = _ref;
-            tempBounds$1.x1 = path.bounds.x1 * size, tempBounds$1.y1 = path.bounds.y1 * size, tempBounds$1.x2 = path.bounds.x2 * size, tempBounds$1.y2 = path.bounds.y2 * size, bounds.union(tempBounds$1);
-          });
-        }
-        this.path.bounds && (bounds.x1 = this.path.bounds.x1 * size, bounds.y1 = this.path.bounds.y1 * size, bounds.x2 = this.path.bounds.x2 * size, bounds.y2 = this.path.bounds.y2 * size);
-      }
-    }
-
-    const builtinSymbols = [circle$1, cross$1, diamond$1, square$1, thinTriangle$1, triangle, star$1, arrow$1, wedge$1, stroke$1, wye$1, triangleLeft, triangleRight, triangleUp, triangleDown, arrow2Left$1, arrow2Right$1, arrow2Up$1, arrow2Down$1, rect, lineV$1, lineH$1, close$1];
-    const builtinSymbolsMap = {};
-    builtinSymbols.forEach(symbol => {
-      builtinSymbolsMap[symbol.type] = symbol;
-    });
-    const builtInSymbolStrMap = {
-      arrowLeft: "M 0.25 -0.5 L -0.25 0 l 0.5 0.5",
-      arrowRight: "M -0.25 -0.5 l 0.5 0.5 l -0.5 0.5",
-      rectRound: "M 0.3 -0.5 C 0.41 -0.5 0.5 -0.41 0.5 -0.3 C 0.5 -0.3 0.5 0.3 0.5 0.3 C 0.5 0.41 0.41 0.5 0.3 0.5 C 0.3 0.5 -0.3 0.5 -0.3 0.5 C -0.41 0.5 -0.5 0.41 -0.5 0.3 C -0.5 0.3 -0.5 -0.3 -0.5 -0.3 C -0.5 -0.41 -0.41 -0.5 -0.3 -0.5 C -0.3 -0.5 0.3 -0.5 0.3 -0.5 Z",
-      roundLine: "M 1.2392 -0.258 L -1.3432 -0.258 C -1.4784 -0.258 -1.588 -0.1436 -1.588 -0.002 c 0 0.1416 0.1096 0.256 0.2448 0.256 l 2.5824 0 c 0.1352 0 0.2448 -0.1144 0.2448 -0.256 C 1.484 -0.1436 1.3744 -0.258 1.2392 -0.258 z"
-    };
-
-    function getAllMatches(string, regex) {
-      const matches = [];
-      let match = regex.exec(string);
-      for (; match;) {
-        const allmatches = [];
-        allmatches.startIndex = regex.lastIndex - match[0].length;
-        const len = match.length;
-        for (let index = 0; index < len; index++) allmatches.push(match[index]);
-        matches.push(allmatches), match = regex.exec(string);
-      }
-      return matches;
-    }
-
-    class XmlNode {
-      constructor(tagname) {
-        this.tagname = tagname, this.child = [], this[":@"] = {};
-      }
-      add(key, val) {
-        "__proto__" === key && (key = "#__proto__"), this.child.push({
-          [key]: val
-        });
-      }
-      addChild(node) {
-        "__proto__" === node.tagname && (node.tagname = "#__proto__"), node[":@"] && Object.keys(node[":@"]).length > 0 ? this.child.push({
-          [node.tagname]: node.child,
-          ":@": node[":@"]
-        }) : this.child.push({
-          [node.tagname]: node.child
-        });
-      }
-    }
-    function findClosingIndex(xmlData, str, i, errMsg) {
-      const closingIndex = xmlData.indexOf(str, i);
-      if (-1 === closingIndex) throw new Error(errMsg);
-      return closingIndex + str.length - 1;
-    }
-    function tagExpWithClosingIndex(xmlData, i) {
-      let closingChar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ">";
-      let attrBoundary,
-        tagExp = "";
-      for (let index = i; index < xmlData.length; index++) {
-        let ch = xmlData[index];
-        if (attrBoundary) ch === attrBoundary && (attrBoundary = "");else if ('"' === ch || "'" === ch) attrBoundary = ch;else if (ch === closingChar[0]) {
-          if (!closingChar[1]) return {
-            data: tagExp,
-            index: index
-          };
-          if (xmlData[index + 1] === closingChar[1]) return {
-            data: tagExp,
-            index: index
-          };
-        } else "\t" === ch && (ch = " ");
-        tagExp += ch;
-      }
-    }
-    function readTagExp(xmlData, i, removeNSPrefix) {
-      let closingChar = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : ">";
-      const result = tagExpWithClosingIndex(xmlData, i + 1, closingChar);
-      if (!result) return;
-      let tagExp = result.data;
-      const closeIndex = result.index,
-        separatorIndex = tagExp.search(/\s/);
-      let tagName = tagExp,
-        attrExpPresent = !0;
-      -1 !== separatorIndex && (tagName = tagExp.substr(0, separatorIndex).replace(/\s\s*$/, ""), tagExp = tagExp.substr(separatorIndex + 1));
-      const rawTagName = tagName;
-      if (removeNSPrefix) {
-        const colonIndex = tagName.indexOf(":");
-        -1 !== colonIndex && (tagName = tagName.substr(colonIndex + 1), attrExpPresent = tagName !== result.data.substr(colonIndex + 1));
-      }
-      return {
-        tagName: tagName,
-        tagExp: tagExp,
-        closeIndex: closeIndex,
-        attrExpPresent: attrExpPresent,
-        rawTagName: rawTagName
-      };
-    }
-    const attrsRegx = new RegExp("([^\\s=]+)\\s*(=\\s*(['\"])([\\s\\S]*?)\\3)?", "gm");
-    class OrderedObjParser {
-      constructor(options) {
-        this.currentNode = null, this.options = options, this.tagsNodeStack = [], this.docTypeEntities = {};
-      }
-      addChild(currentNode, childNode, jPath) {
-        const result = childNode.tagname;
-        "string" == typeof result ? (childNode.tagname = result, currentNode.addChild(childNode)) : currentNode.addChild(childNode);
-      }
-      buildAttributesMap(attrStr, jPath, tagName) {
-        const attrs = {};
-        if (!attrStr) return;
-        const matches = getAllMatches(attrStr, attrsRegx),
-          len = matches.length;
-        for (let i = 0; i < len; i++) {
-          const attrName = matches[i][1],
-            oldVal = matches[i][4],
-            aName = attrName;
-          attrName && (attrs[aName] = void 0 === oldVal || (isNaN(oldVal) ? oldVal : Number(oldVal)));
-        }
-        return attrs;
-      }
-      parseXml(xmlData) {
-        xmlData = xmlData.replace(/\r\n?/g, "\n");
-        const xmlObj = new XmlNode("!xml");
-        let currentNode = xmlObj,
-          textData = "",
-          jPath = "";
-        for (let i = 0; i < xmlData.length; i++) {
-          if ("<" === xmlData[i]) {
-            if ("/" === xmlData[i + 1]) {
-              const closeIndex = findClosingIndex(xmlData, ">", i, "Closing Tag is not closed."),
-                propIndex = jPath.lastIndexOf(".");
-              jPath = jPath.substring(0, propIndex), currentNode = this.tagsNodeStack.pop(), currentNode && currentNode.child && textData && currentNode.child[currentNode.child.length - 1][":@"] && (currentNode.child[currentNode.child.length - 1][":@"].text = textData), textData = "", i = closeIndex;
-            } else if ("?" === xmlData[i + 1]) {
-              i = readTagExp(xmlData, i, !1, "?>").closeIndex + 1;
-            } else if ("!--" === xmlData.substr(i + 1, 3)) {
-              i = findClosingIndex(xmlData, "--\x3e", i + 4, "Comment is not closed.");
-            } else {
-              const result = readTagExp(xmlData, i, !1);
-              let tagName = result.tagName,
-                tagExp = result.tagExp;
-              const attrExpPresent = result.attrExpPresent,
-                closeIndex = result.closeIndex;
-              if (tagName !== xmlObj.tagname && (jPath += jPath ? "." + tagName : tagName), tagExp.length > 0 && tagExp.lastIndexOf("/") === tagExp.length - 1) {
-                "/" === tagName[tagName.length - 1] ? (tagName = tagName.substr(0, tagName.length - 1), jPath = jPath.substr(0, jPath.length - 1), tagExp = tagName) : tagExp = tagExp.substr(0, tagExp.length - 1);
-                const childNode = new XmlNode(tagName);
-                tagName !== tagExp && attrExpPresent && (childNode[":@"] = this.buildAttributesMap(tagExp, jPath, tagName)), this.addChild(currentNode, childNode, jPath), jPath = jPath.substr(0, jPath.lastIndexOf("."));
-              } else {
-                const childNode = new XmlNode(tagName);
-                this.tagsNodeStack.push(currentNode), tagName !== tagExp && attrExpPresent && (childNode[":@"] = this.buildAttributesMap(tagExp, jPath, tagName)), this.addChild(currentNode, childNode, jPath), currentNode = childNode;
-              }
-              textData = "", i = closeIndex;
-            }
-          } else textData += xmlData[i];
-        }
-        return xmlObj.child;
-      }
-    }
-
-    function prettify(node, options) {
-      return compress(node);
-    }
-    function compress(arr, jPath) {
-      const compressedObj = {};
-      for (let i = 0; i < arr.length; i++) {
-        const tagObj = arr[i],
-          property = propName(tagObj);
-        if (void 0 !== property && tagObj[property]) {
-          const val = compress(tagObj[property]);
-          isLeafTag(val);
-          tagObj[":@"] && assignAttributes(val, tagObj[":@"]), void 0 !== compressedObj[property] && compressedObj.hasOwnProperty(property) ? (Array.isArray(compressedObj[property]) || (compressedObj[property] = [compressedObj[property]]), compressedObj[property].push(val)) : compressedObj[property] = val;
-        }
-      }
-      return compressedObj;
-    }
-    function propName(obj) {
-      const keys = Object.keys(obj);
-      for (let i = 0; i < keys.length; i++) {
-        const key = keys[i];
-        if (":@" !== key) return key;
-      }
-    }
-    function assignAttributes(obj, attrMap, jpath) {
-      if (attrMap) {
-        const keys = Object.keys(attrMap),
-          len = keys.length;
-        for (let i = 0; i < len; i++) {
-          const atrrName = keys[i];
-          obj[atrrName] = attrMap[atrrName];
-        }
-      }
-    }
-    function isLeafTag(obj) {
-      return 0 === Object.keys(obj).length;
-    }
-
-    class XMLParser {
-      constructor(options) {
-        this.options = Object.assign({}, XMLParser.defaultOptions, options);
-      }
-      valid(xml) {
-        return xml.startsWith("<");
-      }
-      parse(xmlData) {
-        if (!this.valid) return !1;
-        const orderedResult = new OrderedObjParser(this.options).parseXml(xmlData);
-        return prettify(orderedResult, this.options);
-      }
-    }
-    XMLParser.defaultOptions = {};
-    function isSvg(str) {
-      return str.startsWith("<svg") || str.startsWith("<?xml");
-    }
-
-    undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
-      return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) {
-          try {
-            step(generator.next(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function rejected(value) {
-          try {
-            step(generator.throw(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function step(result) {
-          var value;
-          result.done ? resolve(result.value) : (value = result.value, value instanceof P ? value : new P(function (resolve) {
-            resolve(value);
-          })).then(fulfilled, rejected);
-        }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-      });
-    };
-    let NUMBER_TYPE = 0;
-    function genNumberType() {
-      return NUMBER_TYPE++;
-    }
-    var TextDirection;
-    !function (TextDirection) {
-      TextDirection[TextDirection.HORIZONTAL = 0] = "HORIZONTAL", TextDirection[TextDirection.VERTICAL = 1] = "VERTICAL";
-    }(TextDirection || (TextDirection = {}));
-    const rotateCharList = ["…", "（", "）", "—", "【", "】", "「", "」", "《", "》"],
-      rotateCharMap = new Map();
-    rotateCharList.forEach(c => rotateCharMap.set(c, !0));
-    const noRotateCharList = [""],
-      noRotateCharMap = new Map();
-    noRotateCharList.forEach(c => noRotateCharMap.set(c, !0));
-
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    const RECT_NUMBER_TYPE = genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    genNumberType();
-    const SVG_PARSE_ATTRIBUTE_MAP = {
-      "stroke-linecap": "lineCap",
-      "stroke-linejoin": "lineJoin",
-      "stroke-dasharray": "lineDash",
-      "stroke-dashoffset": "lineDashOffset",
-      "stroke-width": "lineWidth",
-      "fill-opacity": "fillOpacity",
-      "stroke-opacity": "strokeOpacity",
-      stroke: "stroke",
-      fill: "fill"
-    };
-    const SVG_PARSE_ATTRIBUTE_MAP_KEYS = Object.keys(SVG_PARSE_ATTRIBUTE_MAP);
-
-    const _tempBounds = new AABBBounds(),
-      tempMatrix = new Matrix(),
+    const tempMatrix = new Matrix(),
       tempBounds = new AABBBounds();
     const GRAPHIC_UPDATE_TAG_KEY = ["lineWidth", "scaleX", "scaleY", "angle", "anchor", "visible"];
     const tempConstantXYKey = ["x", "y"],
@@ -5297,7 +4294,7 @@
         }
       }
       get AABBBounds() {
-        return this.tryUpdateAABBBounds();
+        return this.tryUpdateAABBBounds("imprecise" === this.attribute.boundsMode);
       }
       get OBBBounds() {
         return this.tryUpdateOBBBounds();
@@ -5341,13 +4338,12 @@
       onAnimateBind(animate) {
         this._emitCustomEvent("animate-bind", animate);
       }
-      tryUpdateAABBBounds() {
-        const full = "imprecise" === this.attribute.boundsMode;
+      tryUpdateAABBBounds(full) {
         if (!this.shouldUpdateAABBBounds()) return this._AABBBounds;
         if (!this.valid) return this._AABBBounds.clear(), this._AABBBounds;
         application.graphicService.beforeUpdateAABBBounds(this, this.stage, !0, this._AABBBounds);
         const bounds = this.doUpdateAABBBounds(full);
-        return application.graphicService.afterUpdateAABBBounds(this, this.stage, this._AABBBounds, this, !0), "empty" === this.attribute.boundsMode && bounds.clear(), bounds;
+        return application.graphicService.afterUpdateAABBBounds(this, this.stage, this._AABBBounds, this, !0), bounds;
       }
       tryUpdateOBBBounds() {
         if (this._OBBBounds || (this._OBBBounds = new OBBBounds()), this.tryUpdateAABBBounds(), this.updateOBBBoundsStamp === this.updateAABBBoundsStamp) return this._OBBBounds;
@@ -5363,58 +4359,6 @@
       doUpdateOBBBounds() {
         return this._OBBBounds;
       }
-      getClipPath() {
-        const {
-          clipConfig: clipConfig
-        } = this.attribute;
-        if (!clipConfig) return null;
-        this.clipPathMap || (this.clipPathMap = new Map());
-        const {
-          shape: shape
-        } = clipConfig;
-        let path = this.clipPathMap.get(shape) || null;
-        return path || (this.clipPathMap.size > 10 && this.clipPathMap.clear(), path = this.parsePath(shape), path && this.clipPathMap.set(shape, path)), path;
-      }
-      parsePath(symbolType) {
-        if (!symbolType) return null;
-        let path = builtinSymbolsMap[symbolType];
-        if (path) return path;
-        if (path = Graphic.userSymbolMap[symbolType], path) return path;
-        const _symbolType = builtInSymbolStrMap[symbolType];
-        if (!0 === isSvg(symbolType = _symbolType || symbolType)) {
-          const parser = new XMLParser(),
-            {
-              svg: svg
-            } = parser.parse(symbolType);
-          if (!svg) return null;
-          const path = isArray$1(svg.path) ? svg.path : [svg.path];
-          _tempBounds.clear();
-          const cacheList = [];
-          path.forEach(item => {
-            const cache = new CustomPath2D().fromString(item.d),
-              attribute = {};
-            SVG_PARSE_ATTRIBUTE_MAP_KEYS.forEach(k => {
-              item[k] && (attribute[SVG_PARSE_ATTRIBUTE_MAP[k]] = item[k]);
-            }), cacheList.push({
-              path: cache,
-              attribute: attribute
-            }), _tempBounds.union(cache.bounds);
-          });
-          const width = _tempBounds.width(),
-            height = _tempBounds.height(),
-            scale = 1 / max(width, height);
-          cacheList.forEach(cache => cache.path.transform(0, 0, scale, scale));
-          const _parsedPath = new CustomSymbolClass(symbolType, cacheList, !0);
-          return Graphic.userSymbolMap[symbolType] = _parsedPath, _parsedPath;
-        }
-        const cache = new CustomPath2D().fromString(symbolType),
-          width = cache.bounds.width(),
-          height = cache.bounds.height(),
-          scale = 1 / max(width, height);
-        cache.transform(0, 0, scale, scale);
-        const _parsedPath = new CustomSymbolClass(symbolType, cache);
-        return Graphic.userSymbolMap[symbolType] = _parsedPath, _parsedPath;
-      }
       doUpdateAABBBounds(full) {
         this.updateAABBBoundsStamp++;
         const graphicTheme = this.getGraphicTheme();
@@ -5623,9 +4567,8 @@
         return this;
       }
       animate(params) {
-        var _a;
         this.animates || (this.animates = new Map());
-        const animate = new Animate(null == params ? void 0 : params.id, null !== (_a = null == params ? void 0 : params.timeline) && void 0 !== _a ? _a : this.stage && this.stage.getTimeline(), null == params ? void 0 : params.slience);
+        const animate = new Animate(null == params ? void 0 : params.id, this.stage && this.stage.getTimeline(), null == params ? void 0 : params.slience);
         if (animate.bind(this), params) {
           const {
             onStart: onStart,
@@ -5636,14 +4579,14 @@
           null != onStart && animate.onStart(onStart), null != onFrame && animate.onFrame(onFrame), null != onEnd && animate.onEnd(onEnd), null != onRemove && animate.onRemove(onRemove), animate.interpolateFunc = params.interpolate;
         }
         return this.animates.set(animate.id, animate), animate.onRemove(() => {
-          animate.stop(), this.animates.delete(animate.id);
+          this.animates.delete(animate.id);
         }), animate;
       }
       onAttributeUpdate(context) {
         context && context.skipUpdateCallback || (application.graphicService.onAttributeUpdate(this), this._emitCustomEvent("afterAttributeUpdate", context));
       }
       update(d) {
-        d ? (d.bounds && this.tryUpdateAABBBounds(), d.trans && this.tryUpdateLocalTransMatrix()) : (this.tryUpdateAABBBounds(), this.tryUpdateLocalTransMatrix());
+        d ? (d.bounds && this.tryUpdateAABBBounds("imprecise" === this.attribute.boundsMode), d.trans && this.tryUpdateLocalTransMatrix()) : (this.tryUpdateAABBBounds("imprecise" === this.attribute.boundsMode), this.tryUpdateLocalTransMatrix());
       }
       hasState(stateName) {
         return !(!this.currentStates || !this.currentStates.length) && (!!isNil$1(stateName) || this.currentStates.includes(stateName));
@@ -5701,10 +4644,9 @@
         this.hasState() && this.normalAttrs ? (this.currentStates = [], this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], this.normalAttrs = null;
       }
       removeState(stateName, hasAnimation) {
-        if (this.currentStates) {
-          const filter = isArray$1(stateName) ? s => !stateName.includes(s) : s => s !== stateName,
-            newStates = this.currentStates.filter(filter);
-          newStates.length !== this.currentStates.length && this.useStates(newStates, hasAnimation);
+        if ((this.currentStates ? this.currentStates.indexOf(stateName) : -1) >= 0) {
+          const currentStates = this.currentStates.filter(state => state !== stateName);
+          this.useStates(currentStates, hasAnimation);
         }
       }
       toggleState(stateName, hasAnimation) {
@@ -5841,7 +4783,7 @@
           if (this.stage = stage, this.layer = layer, this.setStageToShadowRoot(stage, layer), this.animates && this.animates.size) {
             const timeline = stage.getTimeline();
             this.animates.forEach(a => {
-              a.timeline === defaultTimeline && a.setTimeline(timeline);
+              a.setTimeline(timeline);
             });
           }
           this._onSetStage && this._onSetStage(this, stage, layer), application.graphicService.onSetStage(this, stage);
@@ -5888,7 +4830,7 @@
         }), step.parsedProps = nextParsedProps;
       }
       defaultInterpolate(nextStepVal, lastStepVal, key, nextAttributes, nextParsedProps, ratio) {
-        if (Number.isFinite(nextStepVal) && Number.isFinite(lastStepVal)) return nextAttributes[key] = lastStepVal + (nextStepVal - lastStepVal) * ratio, !0;
+        if (Number.isFinite(nextStepVal)) return nextAttributes[key] = lastStepVal + (nextStepVal - lastStepVal) * ratio, !0;
         if ("fill" === key) {
           nextParsedProps || (nextParsedProps = {});
           const fillColorArray = nextParsedProps.fillColorArray,
@@ -5913,20 +4855,6 @@
             });
           return color && (nextAttributes[key] = color), !0;
         }
-        if (Array.isArray(nextStepVal) && nextStepVal.length === lastStepVal.length) {
-          const nextList = [];
-          let valid = !0;
-          for (let i = 0; i < nextStepVal.length; i++) {
-            const v = lastStepVal[i],
-              val = v + (nextStepVal[i] - v) * ratio;
-            if (!Number.isFinite(val)) {
-              valid = !1;
-              break;
-            }
-            nextList.push(val);
-          }
-          valid && (nextAttributes[key] = nextList);
-        }
         return !1;
       }
       _interpolate(key, ratio, lastStepVal, nextStepVal, nextAttributes) {}
@@ -5945,7 +4873,7 @@
         return shadowRoot && (shadowRoot.shadowHost = this), this.shadowRoot = null != shadowRoot ? shadowRoot : application.graphicService.creator.shadowRoot(this), this.addUpdateBoundTag(), this.shadowRoot.setStage(this.stage, this.layer), this.shadowRoot;
       }
       detachShadow() {
-        this.shadowRoot && (this.addUpdateBoundTag(), this.shadowRoot.release(!0), this.shadowRoot = null);
+        this.shadowRoot && (this.addUpdateBoundTag(), this.shadowRoot = null);
       }
       toJson() {
         return {
@@ -5997,7 +4925,7 @@
         });
       }
       release() {
-        this.releaseStatus = "released", this.stopAnimates(), application.graphicService.onRelease(this);
+        this.releaseStatus = "released", application.graphicService.onRelease(this);
       }
       _emitCustomEvent(type, context) {
         var _a, _b;
@@ -6010,7 +4938,64 @@
     function backgroundNotImage(image) {
       return !(!image.fill && !image.stroke);
     }
-    Graphic.userSymbolMap = {}, Graphic.mixin(EventTarget);
+    Graphic.mixin(EventTarget);
+
+    undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+      return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) {
+          try {
+            step(generator.next(value));
+          } catch (e) {
+            reject(e);
+          }
+        }
+        function rejected(value) {
+          try {
+            step(generator.throw(value));
+          } catch (e) {
+            reject(e);
+          }
+        }
+        function step(result) {
+          var value;
+          result.done ? resolve(result.value) : (value = result.value, value instanceof P ? value : new P(function (resolve) {
+            resolve(value);
+          })).then(fulfilled, rejected);
+        }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+      });
+    };
+    let NUMBER_TYPE = 0;
+    function genNumberType() {
+      return NUMBER_TYPE++;
+    }
+    var TextDirection;
+    !function (TextDirection) {
+      TextDirection[TextDirection.HORIZONTAL = 0] = "HORIZONTAL", TextDirection[TextDirection.VERTICAL = 1] = "VERTICAL";
+    }(TextDirection || (TextDirection = {}));
+    const rotateCharList = ["…", "（", "）", "—", "【", "】", "「", "」", "《", "》"],
+      rotateCharMap = new Map();
+    rotateCharList.forEach(c => rotateCharMap.set(c, !0));
+    const noRotateCharList = [""],
+      noRotateCharMap = new Map();
+    noRotateCharList.forEach(c => noRotateCharMap.set(c, !0));
+
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    const RECT_NUMBER_TYPE = genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
+    genNumberType();
 
     const updateBoundsOfCommonOuterBorder = (attribute, theme, aabbBounds) => {
       const {