@visactor/vrender 1.0.37 → 1.0.38

package/dist/index.js

@@ -24729,7 +24729,7 @@
         return !!this._inuse;
       }
       set inuse(use) {
-        use !== !!this._inuse && (this._inuse = use, use ? (this.nativeContext.save(), this.reset()) : this.nativeContext.restore());
+        use !== !!this._inuse && (this._inuse = use, use ? (this.nativeContext.save(), this.reset()) : (this.nativeContext.restore(), this._font = ""));
       }
       constructor(canvas, dpr) {
         this.fillAttributes = Object.assign(Object.assign({}, DefaultFillStyle), {
@@ -29923,6 +29923,343 @@
       loadGifImageModule || (loadGifImageModule = !0, bind(DefaultCanvasGifImageRender).toSelf().inSingletonScope(), bind(GraphicRender).toService(DefaultCanvasGifImageRender));
     });
 
+    const browser = isBrowserEnv();
+
+    function _registerArc() {
+      _registerArc.__loaded || (_registerArc.__loaded = !0, registerArcGraphic(), container.load(arcModule), container.load(browser ? arcCanvasPickModule : arcMathPickModule));
+    }
+    _registerArc.__loaded = !1;
+    const registerArc = _registerArc;
+
+    function _registerArc3d() {
+      _registerArc3d.__loaded || (_registerArc3d.__loaded = !0, registerArc3dGraphic(), registerDirectionalLight(), registerOrthoCamera(), container.load(arc3dModule), container.load(arc3dCanvasPickModule));
+    }
+    _registerArc3d.__loaded = !1;
+    const registerArc3d = _registerArc3d;
+
+    function _registerArea() {
+      _registerArea.__loaded || (_registerArea.__loaded = !0, registerAreaGraphic(), container.load(areaModule), container.load(browser ? areaCanvasPickModule : areaMathPickModule));
+    }
+    _registerArea.__loaded = !1;
+    const registerArea = _registerArea;
+
+    function _registerCircle() {
+      _registerCircle.__loaded || (_registerCircle.__loaded = !0, registerCircleGraphic(), container.load(circleModule), container.load(browser ? circleCanvasPickModule : circleMathPickModule));
+    }
+    _registerCircle.__loaded = !1;
+    const registerCircle = _registerCircle;
+
+    function _registerGlyph() {
+      _registerGlyph.__loaded || (_registerGlyph.__loaded = !0, registerGlyphGraphic(), container.load(glyphModule), container.load(browser ? glyphCanvasPickModule : glyphMathPickModule));
+    }
+    _registerGlyph.__loaded = !1;
+    const registerGlyph = _registerGlyph;
+
+    function _registerGroup() {
+      _registerGroup.__loaded || (_registerGroup.__loaded = !0, registerGroupGraphic());
+    }
+    _registerGroup.__loaded = !1;
+    const registerGroup = _registerGroup;
+
+    function _registerImage() {
+      _registerImage.__loaded || (_registerImage.__loaded = !0, registerImageGraphic(), container.load(imageModule), container.load(browser ? imageCanvasPickModule : imageMathPickModule));
+    }
+    _registerImage.__loaded = !1;
+    const registerImage = _registerImage;
+
+    function _registerLine() {
+      _registerLine.__loaded || (_registerLine.__loaded = !0, registerLineGraphic(), container.load(lineModule), container.load(browser ? lineCanvasPickModule : lineMathPickModule));
+    }
+    _registerLine.__loaded = !1;
+    const registerLine = _registerLine;
+
+    function _registerPath() {
+      _registerPath.__loaded || (_registerPath.__loaded = !0, registerPathGraphic(), container.load(pathModule), container.load(browser ? pathCanvasPickModule : pathMathPickModule));
+    }
+    _registerPath.__loaded = !1;
+    const registerPath = _registerPath;
+
+    function _registerPolygon() {
+      _registerPolygon.__loaded || (_registerPolygon.__loaded = !0, registerPolygonGraphic(), container.load(polygonModule), container.load(browser ? polygonCanvasPickModule : polygonMathPickModule));
+    }
+    _registerPolygon.__loaded = !1;
+    const registerPolygon = _registerPolygon;
+
+    function _registerPyramid3d() {
+      _registerPyramid3d.__loaded || (_registerPyramid3d.__loaded = !0, registerPyramid3dGraphic(), registerDirectionalLight(), registerOrthoCamera(), container.load(pyramid3dModule), container.load(pyramid3dCanvasPickModule));
+    }
+    _registerPyramid3d.__loaded = !1;
+    const registerPyramid3d = _registerPyramid3d;
+
+    function _registerRect() {
+      _registerRect.__loaded || (_registerRect.__loaded = !0, registerRectGraphic(), container.load(rectModule), container.load(browser ? rectCanvasPickModule : rectMathPickModule));
+    }
+    _registerRect.__loaded = !1;
+    const registerRect = _registerRect;
+
+    function _registerRect3d() {
+      _registerRect3d.__loaded || (_registerRect3d.__loaded = !0, registerRect3dGraphic(), container.load(rect3dModule), container.load(rect3dCanvasPickModule));
+    }
+    _registerRect3d.__loaded = !1;
+    const registerRect3d = _registerRect3d;
+
+    function _registerRichtext() {
+      _registerRichtext.__loaded || (_registerRichtext.__loaded = !0, registerRichtextGraphic(), container.load(richtextModule), container.load(browser ? richtextCanvasPickModule : richTextMathPickModule));
+    }
+    _registerRichtext.__loaded = !1;
+    const registerRichtext = _registerRichtext;
+
+    function _registerShadowRoot() {
+      _registerShadowRoot.__loaded || (_registerShadowRoot.__loaded = !0, registerShadowRootGraphic());
+    }
+    _registerShadowRoot.__loaded = !1;
+    const registerShadowRoot = _registerShadowRoot;
+
+    function _registerSymbol() {
+      _registerSymbol.__loaded || (_registerSymbol.__loaded = !0, registerSymbolGraphic(), container.load(symbolModule), container.load(browser ? symbolCanvasPickModule : symbolMathPickModule));
+    }
+    _registerSymbol.__loaded = !1;
+    const registerSymbol = _registerSymbol;
+
+    function _registerText() {
+      _registerText.__loaded || (_registerText.__loaded = !0, registerTextGraphic(), container.load(textModule), container.load(browser ? textCanvasPickModule : textMathPickModule));
+    }
+    _registerText.__loaded = !1;
+    const registerText = _registerText;
+
+    var __decorate$5 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+        var d,
+          c = arguments.length,
+          r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+        if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+      },
+      __metadata$1 = undefined && undefined.__metadata || function (k, v) {
+        if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
+      },
+      __param$1 = undefined && undefined.__param || function (paramIndex, decorator) {
+        return function (target, key) {
+          decorator(target, key, paramIndex);
+        };
+      };
+    let DefaultCanvasStarPicker = class extends PickerBase {
+      constructor(canvasRenderer) {
+        super(), this.canvasRenderer = canvasRenderer, this.type = "star", this.numberType = STAR_NUMBER_TYPE;
+      }
+    };
+    DefaultCanvasStarPicker = __decorate$5([injectable(), __param$1(0, inject(StarRender)), __metadata$1("design:paramtypes", [Object])], DefaultCanvasStarPicker);
+
+    let loadStarPick = !1;
+    const starCanvasPickModule = new ContainerModule((bind, unbind, isBound, rebind) => {
+      loadStarPick || (loadStarPick = !0, bind(CanvasStarPicker).to(DefaultCanvasStarPicker).inSingletonScope(), bind(CanvasPickerContribution).toService(CanvasStarPicker));
+    });
+
+    function _registerStar() {
+      _registerStar.__loaded || (_registerStar.__loaded = !0, registerStarGraphic(), container.load(starModule), container.load(starCanvasPickModule));
+    }
+    _registerStar.__loaded = !1;
+    const registerStar = _registerStar;
+
+    function _registerWrapText() {
+      _registerWrapText.__loaded || (_registerWrapText.__loaded = !0, registerWrapTextGraphic());
+    }
+    _registerWrapText.__loaded = !1;
+    const registerWrapText = _registerWrapText;
+
+    function registerGifGraphic() {
+      graphicCreator.RegisterGraphicCreator("gif", createGifImage);
+    }
+    function _registerGifImage() {
+      _registerGifImage.__loaded || (_registerGifImage.__loaded = !0, registerGifGraphic(), container.load(gifImageModule), container.load(gifImageCanvasPickModule));
+    }
+    _registerGifImage.__loaded = !1;
+    const registerGifImage = _registerGifImage;
+
+    function pseudoRandom(n) {
+      let seed = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+      let hash = 3735928559 ^ seed;
+      return hash = (2654435769 ^ hash) + (hash << 6) + (hash >> 2), hash = 3432918353 * (hash ^ n), hash = hash << 15 | hash >>> 17, hash ^= hash << 25, hash += hash << 9, hash ^= hash >> 4, hash ^= hash << 18, hash |= 1, (hash >>> 0) % 2147483647 / 2147483647;
+    }
+    function randomOpacity(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const targetRandomValue = 2 * pseudoRandom(row * columnCount + column) * Math.PI,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI + targetRandomValue) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function columnLeftToRight(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = column / columnCount,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function columnRightToLeft(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = (columnCount - 1 - column) / columnCount,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rowTopToBottom(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = row / rowCount,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rowBottomToTop(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = (rowCount - 1 - row) / rowCount,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function diagonalCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow((row - centerRow) / rowCount, 2) + Math.pow((column - centerCol) / columnCount, 2)),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function diagonalTopLeftToBottomRight(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = (row / rowCount + column / columnCount) / 2,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rotationScan(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        angle = Math.atan2(row - centerRow, column - centerCol),
+        delay = (angle < 0 ? angle + 2 * Math.PI : angle) / (2 * Math.PI),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rippleEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        normalizedDistance = Math.sqrt(Math.pow(row - centerRow, 2) + Math.pow(column - centerCol, 2)) / Math.sqrt(Math.pow(rowCount / 2, 2) + Math.pow(columnCount / 2, 2)),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI * 3 - 2 * normalizedDistance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function snakeWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const delay = (row + column) % (rowCount + columnCount) / (rowCount + columnCount),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 4 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function alternatingWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const rowPhase = row / rowCount,
+        colPhase = column / columnCount,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * rowPhase * Math.PI) * Math.sin(2 * ratio * Math.PI - 2 * colPhase * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function spiralEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow(row - centerRow, 2) + Math.pow(column - centerCol, 2)),
+        angle = Math.atan2(row - centerRow, column - centerCol),
+        delay = (distance / Math.sqrt(Math.pow(rowCount / 2, 2) + Math.pow(columnCount / 2, 2)) + angle / (2 * Math.PI)) / 2,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 4 * delay * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function columnCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerCol = columnCount / 2,
+        distance = Math.abs(column - centerCol) / centerCol,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function columnEdgeToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerCol = columnCount / 2,
+        distance = 1 - Math.abs(column - centerCol) / centerCol,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rowCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        distance = Math.abs(row - centerRow) / centerRow,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function rowEdgeToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        distance = 1 - Math.abs(row - centerRow) / centerRow,
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function cornerToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
+        normalizedDistance = Math.min(distance, 1),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * normalizedDistance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function centerToCorner(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
+        normalizedDistance = 1 - Math.min(distance, 1),
+        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * normalizedDistance * Math.PI) + 1) / 2;
+      return Math.min(1, Math.max(0, _r));
+    }
+    function pulseWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
+        normalizedDistance = Math.min(distance, 1),
+        wavePhase = 2 * ratio * Math.PI * 3,
+        decay = Math.max(0, 1 - normalizedDistance),
+        _r = minRatio + amplitude * ((Math.sin(wavePhase - 4 * normalizedDistance * Math.PI) + 1) / 2) * (.7 * decay + .3);
+      return Math.min(1, Math.max(0, _r));
+    }
+    function particleEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
+      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
+      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
+      const index = row * columnCount + column,
+        phase = 2 * pseudoRandom(index, 0) * Math.PI,
+        speed = .5 * pseudoRandom(index, 1) + .5,
+        direction = 2 * pseudoRandom(index, 2) * Math.PI,
+        centerRow = rowCount / 2,
+        centerCol = columnCount / 2,
+        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
+        normalizedDistance = Math.min(distance, 1),
+        scatterRatio = (ratio - .4) / .6,
+        movement = Math.sin(scatterRatio * speed * 8 * Math.PI + phase + direction * scatterRatio),
+        distanceEffect = Math.cos(normalizedDistance * Math.PI + scatterRatio * Math.PI),
+        _r = minRatio + amplitude * ((movement + 1) / 2 * Math.max(0, 1 - 1.2 * scatterRatio) * (.3 + .7 * distanceEffect));
+      return Math.min(1, Math.max(0, _r));
+    }
+
+    const roughModule = _roughModule;
+
     var lottie = {exports: {}};
 
     (function(module,exports){typeof navigator!=="undefined"&&function(global,factory){module.exports=factory();}(commonjsGlobal,function(){var svgNS='http://www.w3.org/2000/svg';var locationHref='';var _useWebWorker=false;var initialDefaultFrame=-999999;var setWebWorker=function setWebWorker(flag){_useWebWorker=!!flag;};var getWebWorker=function getWebWorker(){return _useWebWorker;};var setLocationHref=function setLocationHref(value){locationHref=value;};var getLocationHref=function getLocationHref(){return locationHref;};function createTag(type){// return {appendChild:function(){},setAttribute:function(){},style:{}}
@@ -30644,179 +30981,9 @@
     Lottie.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
     function createLottie(attributes) {
       return new Lottie(attributes);
-    }
-
-    var __decorate$5 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
-        var d,
-          c = arguments.length,
-          r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
-        if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
-        return c > 3 && r && Object.defineProperty(target, key, r), r;
-      },
-      __metadata$1 = undefined && undefined.__metadata || function (k, v) {
-        if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
-      },
-      __param$1 = undefined && undefined.__param || function (paramIndex, decorator) {
-        return function (target, key) {
-          decorator(target, key, paramIndex);
-        };
-      };
-    let DefaultCanvasLottiePicker = class extends RectPickerBase {
-      constructor(canvasRenderer) {
-        super(), this.canvasRenderer = canvasRenderer;
-      }
-    };
-    DefaultCanvasLottiePicker = __decorate$5([injectable(), __param$1(0, inject(RectRender)), __metadata$1("design:paramtypes", [Object])], DefaultCanvasLottiePicker);
-
-    let loadLottiePick = !1;
-    const lottieCanvasPickModule = new ContainerModule((bind, unbind, isBound, rebind) => {
-      loadLottiePick || (loadLottiePick = !0, bind(CanvasLottiePicker).to(DefaultCanvasLottiePicker).inSingletonScope(), bind(CanvasPickerContribution).toService(CanvasLottiePicker));
-    });
-
-    var __decorate$4 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
-      var d,
-        c = arguments.length,
-        r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
-      if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
-      return c > 3 && r && Object.defineProperty(target, key, r), r;
-    };
-    let DefaultCanvasLottieRender = class extends exports.DefaultCanvasRectRender {
-      constructor() {
-        super(...arguments), this.numberType = LOTTIE_NUMBER_TYPE;
-      }
-      drawShape(lottie, context, x, y, drawContext, params, fillCb, strokeCb) {
-        const _fillCb = fillCb || (() => this._drawShape.call(this, lottie, context, x, y, drawContext, params));
-        super.drawShape(lottie, context, x, y, drawContext, params, _fillCb, strokeCb);
-      }
-      _drawShape(lottie, context, x, y, drawContext, params) {
-        var _a;
-        const lottieAttribute = null !== (_a = this.tempTheme) && void 0 !== _a ? _a : getTheme(lottie, null == params ? void 0 : params.theme).rect,
-          {
-            x: originX = lottieAttribute.x,
-            y: originY = lottieAttribute.y
-          } = lottie.attribute;
-        context.setCommonStyle(lottie, lottie.attribute, originX - x, originY - y, lottieAttribute);
-        const canvas = lottie.canvas;
-        if (canvas) {
-          const pattern = context.createPattern(canvas, "no-repeat"),
-            dpr = context.dpr;
-          pattern.setTransform && pattern.setTransform(new DOMMatrix([1 / dpr, 0, 0, 1 / dpr, x, y])), context.fillStyle = pattern;
-        }
-        context.fill();
-      }
-    };
-    DefaultCanvasLottieRender = __decorate$4([injectable()], DefaultCanvasLottieRender);
-
-    let loadLottieModule = !1;
-    const lottieModule = new ContainerModule(bind => {
-      loadLottieModule || (loadLottieModule = !0, bind(DefaultCanvasLottieRender).toSelf().inSingletonScope(), bind(GraphicRender).toService(DefaultCanvasLottieRender));
-    });
-
-    const browser = isBrowserEnv();
-
-    function _registerArc() {
-      _registerArc.__loaded || (_registerArc.__loaded = !0, registerArcGraphic(), container.load(arcModule), container.load(browser ? arcCanvasPickModule : arcMathPickModule));
-    }
-    _registerArc.__loaded = !1;
-    const registerArc = _registerArc;
-
-    function _registerArc3d() {
-      _registerArc3d.__loaded || (_registerArc3d.__loaded = !0, registerArc3dGraphic(), registerDirectionalLight(), registerOrthoCamera(), container.load(arc3dModule), container.load(arc3dCanvasPickModule));
-    }
-    _registerArc3d.__loaded = !1;
-    const registerArc3d = _registerArc3d;
-
-    function _registerArea() {
-      _registerArea.__loaded || (_registerArea.__loaded = !0, registerAreaGraphic(), container.load(areaModule), container.load(browser ? areaCanvasPickModule : areaMathPickModule));
-    }
-    _registerArea.__loaded = !1;
-    const registerArea = _registerArea;
-
-    function _registerCircle() {
-      _registerCircle.__loaded || (_registerCircle.__loaded = !0, registerCircleGraphic(), container.load(circleModule), container.load(browser ? circleCanvasPickModule : circleMathPickModule));
-    }
-    _registerCircle.__loaded = !1;
-    const registerCircle = _registerCircle;
-
-    function _registerGlyph() {
-      _registerGlyph.__loaded || (_registerGlyph.__loaded = !0, registerGlyphGraphic(), container.load(glyphModule), container.load(browser ? glyphCanvasPickModule : glyphMathPickModule));
-    }
-    _registerGlyph.__loaded = !1;
-    const registerGlyph = _registerGlyph;
-
-    function _registerGroup() {
-      _registerGroup.__loaded || (_registerGroup.__loaded = !0, registerGroupGraphic());
-    }
-    _registerGroup.__loaded = !1;
-    const registerGroup = _registerGroup;
-
-    function _registerImage() {
-      _registerImage.__loaded || (_registerImage.__loaded = !0, registerImageGraphic(), container.load(imageModule), container.load(browser ? imageCanvasPickModule : imageMathPickModule));
-    }
-    _registerImage.__loaded = !1;
-    const registerImage = _registerImage;
-
-    function _registerLine() {
-      _registerLine.__loaded || (_registerLine.__loaded = !0, registerLineGraphic(), container.load(lineModule), container.load(browser ? lineCanvasPickModule : lineMathPickModule));
-    }
-    _registerLine.__loaded = !1;
-    const registerLine = _registerLine;
-
-    function _registerPath() {
-      _registerPath.__loaded || (_registerPath.__loaded = !0, registerPathGraphic(), container.load(pathModule), container.load(browser ? pathCanvasPickModule : pathMathPickModule));
-    }
-    _registerPath.__loaded = !1;
-    const registerPath = _registerPath;
-
-    function _registerPolygon() {
-      _registerPolygon.__loaded || (_registerPolygon.__loaded = !0, registerPolygonGraphic(), container.load(polygonModule), container.load(browser ? polygonCanvasPickModule : polygonMathPickModule));
-    }
-    _registerPolygon.__loaded = !1;
-    const registerPolygon = _registerPolygon;
-
-    function _registerPyramid3d() {
-      _registerPyramid3d.__loaded || (_registerPyramid3d.__loaded = !0, registerPyramid3dGraphic(), registerDirectionalLight(), registerOrthoCamera(), container.load(pyramid3dModule), container.load(pyramid3dCanvasPickModule));
-    }
-    _registerPyramid3d.__loaded = !1;
-    const registerPyramid3d = _registerPyramid3d;
-
-    function _registerRect() {
-      _registerRect.__loaded || (_registerRect.__loaded = !0, registerRectGraphic(), container.load(rectModule), container.load(browser ? rectCanvasPickModule : rectMathPickModule));
-    }
-    _registerRect.__loaded = !1;
-    const registerRect = _registerRect;
-
-    function _registerRect3d() {
-      _registerRect3d.__loaded || (_registerRect3d.__loaded = !0, registerRect3dGraphic(), container.load(rect3dModule), container.load(rect3dCanvasPickModule));
-    }
-    _registerRect3d.__loaded = !1;
-    const registerRect3d = _registerRect3d;
-
-    function _registerRichtext() {
-      _registerRichtext.__loaded || (_registerRichtext.__loaded = !0, registerRichtextGraphic(), container.load(richtextModule), container.load(browser ? richtextCanvasPickModule : richTextMathPickModule));
-    }
-    _registerRichtext.__loaded = !1;
-    const registerRichtext = _registerRichtext;
-
-    function _registerShadowRoot() {
-      _registerShadowRoot.__loaded || (_registerShadowRoot.__loaded = !0, registerShadowRootGraphic());
-    }
-    _registerShadowRoot.__loaded = !1;
-    const registerShadowRoot = _registerShadowRoot;
-
-    function _registerSymbol() {
-      _registerSymbol.__loaded || (_registerSymbol.__loaded = !0, registerSymbolGraphic(), container.load(symbolModule), container.load(browser ? symbolCanvasPickModule : symbolMathPickModule));
-    }
-    _registerSymbol.__loaded = !1;
-    const registerSymbol = _registerSymbol;
-
-    function _registerText() {
-      _registerText.__loaded || (_registerText.__loaded = !0, registerTextGraphic(), container.load(textModule), container.load(browser ? textCanvasPickModule : textMathPickModule));
-    }
-    _registerText.__loaded = !1;
-    const registerText = _registerText;
+    }
 
-    var __decorate$3 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+    var __decorate$4 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
         var d,
           c = arguments.length,
           r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30831,223 +30998,56 @@
           decorator(target, key, paramIndex);
         };
       };
-    let DefaultCanvasStarPicker = class extends PickerBase {
+    let DefaultCanvasLottiePicker = class extends RectPickerBase {
       constructor(canvasRenderer) {
-        super(), this.canvasRenderer = canvasRenderer, this.type = "star", this.numberType = STAR_NUMBER_TYPE;
+        super(), this.canvasRenderer = canvasRenderer;
       }
     };
-    DefaultCanvasStarPicker = __decorate$3([injectable(), __param(0, inject(StarRender)), __metadata("design:paramtypes", [Object])], DefaultCanvasStarPicker);
+    DefaultCanvasLottiePicker = __decorate$4([injectable(), __param(0, inject(RectRender)), __metadata("design:paramtypes", [Object])], DefaultCanvasLottiePicker);
 
-    let loadStarPick = !1;
-    const starCanvasPickModule = new ContainerModule((bind, unbind, isBound, rebind) => {
-      loadStarPick || (loadStarPick = !0, bind(CanvasStarPicker).to(DefaultCanvasStarPicker).inSingletonScope(), bind(CanvasPickerContribution).toService(CanvasStarPicker));
+    let loadLottiePick = !1;
+    const lottieCanvasPickModule = new ContainerModule((bind, unbind, isBound, rebind) => {
+      loadLottiePick || (loadLottiePick = !0, bind(CanvasLottiePicker).to(DefaultCanvasLottiePicker).inSingletonScope(), bind(CanvasPickerContribution).toService(CanvasLottiePicker));
     });
 
-    function _registerStar() {
-      _registerStar.__loaded || (_registerStar.__loaded = !0, registerStarGraphic(), container.load(starModule), container.load(starCanvasPickModule));
-    }
-    _registerStar.__loaded = !1;
-    const registerStar = _registerStar;
-
-    function _registerWrapText() {
-      _registerWrapText.__loaded || (_registerWrapText.__loaded = !0, registerWrapTextGraphic());
-    }
-    _registerWrapText.__loaded = !1;
-    const registerWrapText = _registerWrapText;
-
-    function registerGifGraphic() {
-      graphicCreator.RegisterGraphicCreator("gif", createGifImage);
-    }
-    function _registerGifImage() {
-      _registerGifImage.__loaded || (_registerGifImage.__loaded = !0, registerGifGraphic(), container.load(gifImageModule), container.load(gifImageCanvasPickModule));
-    }
-    _registerGifImage.__loaded = !1;
-    const registerGifImage = _registerGifImage;
-
-    function pseudoRandom(n) {
-      let seed = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-      let hash = 3735928559 ^ seed;
-      return hash = (2654435769 ^ hash) + (hash << 6) + (hash >> 2), hash = 3432918353 * (hash ^ n), hash = hash << 15 | hash >>> 17, hash ^= hash << 25, hash += hash << 9, hash ^= hash >> 4, hash ^= hash << 18, hash |= 1, (hash >>> 0) % 2147483647 / 2147483647;
-    }
-    function randomOpacity(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const targetRandomValue = 2 * pseudoRandom(row * columnCount + column) * Math.PI,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI + targetRandomValue) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function columnLeftToRight(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = column / columnCount,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function columnRightToLeft(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = (columnCount - 1 - column) / columnCount,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rowTopToBottom(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = row / rowCount,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rowBottomToTop(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = (rowCount - 1 - row) / rowCount,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function diagonalCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow((row - centerRow) / rowCount, 2) + Math.pow((column - centerCol) / columnCount, 2)),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function diagonalTopLeftToBottomRight(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = (row / rowCount + column / columnCount) / 2,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rotationScan(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        angle = Math.atan2(row - centerRow, column - centerCol),
-        delay = (angle < 0 ? angle + 2 * Math.PI : angle) / (2 * Math.PI),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rippleEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        normalizedDistance = Math.sqrt(Math.pow(row - centerRow, 2) + Math.pow(column - centerCol, 2)) / Math.sqrt(Math.pow(rowCount / 2, 2) + Math.pow(columnCount / 2, 2)),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI * 3 - 2 * normalizedDistance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function snakeWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const delay = (row + column) % (rowCount + columnCount) / (rowCount + columnCount),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 4 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function alternatingWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const rowPhase = row / rowCount,
-        colPhase = column / columnCount,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * rowPhase * Math.PI) * Math.sin(2 * ratio * Math.PI - 2 * colPhase * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function spiralEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow(row - centerRow, 2) + Math.pow(column - centerCol, 2)),
-        angle = Math.atan2(row - centerRow, column - centerCol),
-        delay = (distance / Math.sqrt(Math.pow(rowCount / 2, 2) + Math.pow(columnCount / 2, 2)) + angle / (2 * Math.PI)) / 2,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 4 * delay * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function columnCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerCol = columnCount / 2,
-        distance = Math.abs(column - centerCol) / centerCol,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function columnEdgeToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerCol = columnCount / 2,
-        distance = 1 - Math.abs(column - centerCol) / centerCol,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rowCenterToEdge(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        distance = Math.abs(row - centerRow) / centerRow,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function rowEdgeToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        distance = 1 - Math.abs(row - centerRow) / centerRow,
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * distance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function cornerToCenter(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
-        normalizedDistance = Math.min(distance, 1),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * normalizedDistance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function centerToCorner(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
-        normalizedDistance = 1 - Math.min(distance, 1),
-        _r = minRatio + amplitude * (Math.sin(2 * ratio * Math.PI - 2 * normalizedDistance * Math.PI) + 1) / 2;
-      return Math.min(1, Math.max(0, _r));
-    }
-    function pulseWave(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
-        normalizedDistance = Math.min(distance, 1),
-        wavePhase = 2 * ratio * Math.PI * 3,
-        decay = Math.max(0, 1 - normalizedDistance),
-        _r = minRatio + amplitude * ((Math.sin(wavePhase - 4 * normalizedDistance * Math.PI) + 1) / 2) * (.7 * decay + .3);
-      return Math.min(1, Math.max(0, _r));
-    }
-    function particleEffect(ctx, row, column, rowCount, columnCount, ratio, graphic) {
-      let minRatio = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 0;
-      let amplitude = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : 1;
-      const index = row * columnCount + column,
-        phase = 2 * pseudoRandom(index, 0) * Math.PI,
-        speed = .5 * pseudoRandom(index, 1) + .5,
-        direction = 2 * pseudoRandom(index, 2) * Math.PI,
-        centerRow = rowCount / 2,
-        centerCol = columnCount / 2,
-        distance = Math.sqrt(Math.pow((row - centerRow) / centerRow, 2) + Math.pow((column - centerCol) / centerCol, 2)),
-        normalizedDistance = Math.min(distance, 1),
-        scatterRatio = (ratio - .4) / .6,
-        movement = Math.sin(scatterRatio * speed * 8 * Math.PI + phase + direction * scatterRatio),
-        distanceEffect = Math.cos(normalizedDistance * Math.PI + scatterRatio * Math.PI),
-        _r = minRatio + amplitude * ((movement + 1) / 2 * Math.max(0, 1 - 1.2 * scatterRatio) * (.3 + .7 * distanceEffect));
-      return Math.min(1, Math.max(0, _r));
-    }
+    var __decorate$3 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+      var d,
+        c = arguments.length,
+        r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+      if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+      return c > 3 && r && Object.defineProperty(target, key, r), r;
+    };
+    let DefaultCanvasLottieRender = class extends exports.DefaultCanvasRectRender {
+      constructor() {
+        super(...arguments), this.numberType = LOTTIE_NUMBER_TYPE;
+      }
+      drawShape(lottie, context, x, y, drawContext, params, fillCb, strokeCb) {
+        const _fillCb = fillCb || (() => this._drawShape.call(this, lottie, context, x, y, drawContext, params));
+        super.drawShape(lottie, context, x, y, drawContext, params, _fillCb, strokeCb);
+      }
+      _drawShape(lottie, context, x, y, drawContext, params) {
+        var _a;
+        const lottieAttribute = null !== (_a = this.tempTheme) && void 0 !== _a ? _a : getTheme(lottie, null == params ? void 0 : params.theme).rect,
+          {
+            x: originX = lottieAttribute.x,
+            y: originY = lottieAttribute.y
+          } = lottie.attribute;
+        context.setCommonStyle(lottie, lottie.attribute, originX - x, originY - y, lottieAttribute);
+        const canvas = lottie.canvas;
+        if (canvas) {
+          const pattern = context.createPattern(canvas, "no-repeat"),
+            dpr = context.dpr;
+          pattern.setTransform && pattern.setTransform(new DOMMatrix([1 / dpr, 0, 0, 1 / dpr, x, y])), context.fillStyle = pattern;
+        }
+        context.fill();
+      }
+    };
+    DefaultCanvasLottieRender = __decorate$3([injectable()], DefaultCanvasLottieRender);
 
-    const roughModule = _roughModule;
+    let loadLottieModule = !1;
+    const lottieModule = new ContainerModule(bind => {
+      loadLottieModule || (loadLottieModule = !0, bind(DefaultCanvasLottieRender).toSelf().inSingletonScope(), bind(GraphicRender).toService(DefaultCanvasLottieRender));
+    });
 
     class Easing {
       constructor() {}
@@ -32500,7 +32500,7 @@
     }
     class AStageAnimate extends ACustomAnimate {
       constructor(customFrom, customTo, duration, easing, params) {
-        super(customFrom, customTo, duration, easing, params), this.willCallBeforeStageRender = !0, this.willCallAfterStageRender = !0, this._beforeStageRender = () => {
+        super(customFrom, customTo, duration, easing, params), this.willCallBeforeStageRender = !0, this.willCallAfterStageRender = !0, this.checkStatusAfterRender = !0, this._beforeStageRender = () => {
           if (!this.willCallBeforeStageRender) return;
           this.willCallBeforeStageRender = !1;
           const stage = this.target.stage,
@@ -32513,7 +32513,7 @@
           const stage = this.target.stage,
             canvas = stage.window.getContext().canvas.nativeCanvas,
             outputCanvas = this.afterStageRender(stage, canvas);
-          outputCanvas && this.renderToStage(stage, outputCanvas);
+          outputCanvas && this.renderToStage(stage, outputCanvas), this.checkStatusAfterRender && this.animate.status === exports.AnimateStatus.END && this.animate.timeline.removeAnimate(this.animate);
         }, this.props = {};
       }
       beforeStageRender(stage, canvas) {
@@ -50690,6 +50690,8 @@
     class Brush extends AbstractComponent {
       constructor(attributes, options) {
         super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, Brush.defaultAttributes, attributes)), this.name = "brush", this._activeBrushState = !1, this._activeDrawState = !1, this._cacheDrawPoints = [], this._activeMoveState = !1, this._operatingMaskMoveDx = 0, this._operatingMaskMoveDy = 0, this._operatingMaskMoveRangeX = [-1 / 0, 1 / 0], this._operatingMaskMoveRangeY = [-1 / 0, 1 / 0], this._brushMaskAABBBoundsDict = {}, this._firstUpdate = !0, this._onBrushStart = e => {
+          if (!1 === this.attribute.interactive) return;
+          if (!1 === this._beforeBrushEvent(e)) return;
           const {
             updateTrigger = DEFAULT_BRUSH_ATTRIBUTES.updateTrigger,
             endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger,
@@ -50697,11 +50699,11 @@
           } = this.attribute;
           array(updateTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushingWithDelay)), array(endTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushEnd)), e.stopPropagation(), this._firstUpdate = !0, this._activeMoveState = brushMoved && this._isPosInBrushMask(e), this._activeDrawState = !this._activeMoveState, this._startPos = this.eventPosToStagePos(e), this._cacheDrawPoints = [this._startPos];
         }, this._onBrushing = e => {
-          this._outOfInteractiveRange(e) || (e.stopPropagation(), this._firstUpdate ? (this._activeDrawState && this._initDraw(e), this._activeMoveState && this._initMove(e), this._firstUpdate = !1) : (this._activeDrawState && this._drawing(e), this._activeMoveState && this._moving(e)));
+          !1 !== this.attribute.interactive && !1 !== this._beforeBrushEvent(e) && (this._outOfInteractiveRange(e) || (e.stopPropagation(), this._firstUpdate ? (this._activeDrawState && this._initDraw(e), this._activeMoveState && this._initMove(e), this._firstUpdate = !1) : (this._activeDrawState && this._drawing(e), this._activeMoveState && this._moving(e))));
         }, this._onBrushingWithDelay = 0 === this.attribute.delayTime ? this._onBrushing : delayMap[this.attribute.delayType](this._onBrushing, this.attribute.delayTime), this._onBrushEnd = e => {
-          this._releaseBrushUpdateEvents(), e.preventDefault(), this._activeDrawState && this._drawEnd(e), this._activeMoveState && this._moveEnd(e), this._activeDrawState = !1, this._activeMoveState = !1;
+          !1 !== this.attribute.interactive && (this._releaseBrushUpdateEvents(), e.preventDefault(), this._activeDrawState && this._drawEnd(e), this._activeMoveState && this._moveEnd(e), this._activeDrawState = !1, this._activeMoveState = !1);
         }, this._onBrushClear = e => {
-          e.preventDefault(), this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(exports.IOperateType.brushClear, e)), this._activeDrawState = !1, this._activeMoveState = !1;
+          !1 !== this.attribute.interactive && !1 !== this._beforeBrushEvent(e) && (e.preventDefault(), this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(exports.IOperateType.brushClear, e)), this._activeDrawState = !1, this._activeMoveState = !1);
         };
       }
       _bindBrushEvents() {
@@ -50713,6 +50715,7 @@
         array(trigger).forEach(t => this.stage.addEventListener(t, this._onBrushStart)), array(resetTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushClear));
       }
       _initDraw(e) {
+        if (!1 === this.attribute.interactive) return;
         const {
             brushMode: brushMode
           } = this.attribute,
@@ -50721,6 +50724,7 @@
       }
       _initMove(e) {
         var _a, _b;
+        if (!1 === this.attribute.interactive) return;
         this._cacheMovePoint = this.eventPosToStagePos(e), this._operatingMaskMoveDx = null !== (_a = this._operatingMask.attribute.dx) && void 0 !== _a ? _a : 0, this._operatingMaskMoveDy = null !== (_b = this._operatingMask.attribute.dy) && void 0 !== _b ? _b : 0;
         const {
             interactiveRange: interactiveRange
@@ -50745,6 +50749,7 @@
       }
       _drawing(e) {
         var _a;
+        if (!1 === this.attribute.interactive) return;
         const pos = this.eventPosToStagePos(e),
           {
             brushType: brushType,
@@ -50769,6 +50774,7 @@
         (Math.abs(x2 - x1) > sizeThreshold || Math.abs(y1 - y2) > sizeThreshold) && (1 !== Object.keys(this._brushMaskAABBBoundsDict).length || this._activeBrushState ? this._dispatchBrushEvent(exports.IOperateType.drawing, e) : (this._activeBrushState = !0, this._dispatchBrushEvent(exports.IOperateType.brushActive, e)));
       }
       _moving(e) {
+        if (!1 === this.attribute.interactive) return;
         const startPos = this._cacheMovePoint,
           pos = this.eventPosToStagePos(e);
         if (pos.x === (null == startPos ? void 0 : startPos.x) && pos.y === (null == startPos ? void 0 : startPos.y)) return;
@@ -50782,6 +50788,7 @@
         }), this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds, this._dispatchBrushEvent(exports.IOperateType.moving, e);
       }
       _drawEnd(e) {
+        if (!1 === this.attribute.interactive) return;
         const {
           removeOnClick = !0,
           sizeThreshold = DEFAULT_SIZE_THRESHOLD
@@ -50799,7 +50806,7 @@
         }
       }
       _moveEnd(e) {
-        this._operatingMask && this._operatingMask.setAttribute("pickable", !1), this._dispatchBrushEvent(exports.IOperateType.moveEnd, e);
+        !1 !== this.attribute.interactive && (this._operatingMask && this._operatingMask.setAttribute("pickable", !1), this._dispatchBrushEvent(exports.IOperateType.moveEnd, e));
       }
       render() {
         this._bindBrushEvents();
@@ -50906,6 +50913,10 @@
           pos = this.eventPosToStagePos(e);
         return pos.x > maxX || pos.x < minX || pos.y > maxY || pos.y < minY;
       }
+      _beforeBrushEvent(e) {
+        var _a, _b;
+        return null === (_b = (_a = this.attribute).beforeBrushChange) || void 0 === _b ? void 0 : _b.call(_a, e);
+      }
       _dispatchBrushEvent(operateType, e) {
         this._dispatchEvent(operateType, {
           operateMask: this._operatingMask,
@@ -53023,7 +53034,7 @@
       select: !0
     };
 
-    const version = "1.0.37";
+    const version = "1.0.38";
     preLoadAllModule();
     if (isBrowserEnv()) {
         loadBrowserEnv(container);