leafer-game 2.0.2 → 2.0.4

package/dist/web.module.js

@@ -252,6 +252,7 @@ class LeafData {
     }
     destroy() {
         this.__input = this.__middle = null;
+        if (this.__complexData) this.__complexData.destroy();
     }
 }
 
@@ -350,6 +351,8 @@ const {set: set$2, get: get$5, setTemp: setTemp, toTempAB: toTempAB} = FourNumbe
 
 const {round: round$6, pow: pow$2, max: max$4, floor: floor$3, PI: PI$4} = Math;
 
+const tempScaleData$1 = {};
+
 const MathHelper = {
     within(value, min, max) {
         if (isObject(min)) max = min.max, min = min.min;
@@ -393,6 +396,24 @@ const MathHelper = {
         } else if (scale) MathHelper.assignScale(scaleData, scale);
         return scaleData;
     },
+    getScaleFixedData(worldScaleData, scaleFixed, unscale, abs, _localScaleData) {
+        let {scaleX: scaleX, scaleY: scaleY} = worldScaleData;
+        if (abs || scaleFixed) scaleX < 0 && (scaleX = -scaleX), scaleY < 0 && (scaleY = -scaleY);
+        if (scaleFixed) {
+            if (scaleFixed === true) {
+                scaleX = scaleY = unscale ? 1 : 1 / scaleX;
+            } else {
+                let minScale;
+                if (isNumber(scaleFixed)) minScale = scaleFixed; else if (scaleFixed === "zoom-in") minScale = 1;
+                if (minScale) {
+                    if (scaleX > minScale || scaleY > minScale) scaleX = scaleY = unscale ? 1 : 1 / scaleX; else scaleX = scaleY = unscale ? 1 : 1 / minScale;
+                }
+            }
+        }
+        tempScaleData$1.scaleX = scaleX;
+        tempScaleData$1.scaleY = scaleY;
+        return tempScaleData$1;
+    },
     assignScale(scaleData, scale) {
         if (isNumber(scale)) {
             scaleData.scaleX = scaleData.scaleY = scale;
@@ -889,8 +910,8 @@ const PointHelper = {
         if (isObject(originPoints[0])) points = [], originPoints.forEach(p => points.push(p.x, p.y));
         return points;
     },
-    isSame(t, point) {
-        return float$4(t.x) === float$4(point.x) && float$4(t.y) === float$4(point.y);
+    isSame(t, point, quick) {
+        return quick ? t.x === point.x && t.y === point.y : float$4(t.x) === float$4(point.x) && float$4(t.y) === float$4(point.y);
     },
     reset(t) {
         P$5.reset(t);
@@ -965,8 +986,8 @@ class Point {
     getAtan2(to) {
         return PointHelper.getAtan2(this, to);
     }
-    isSame(point) {
-        return PointHelper.isSame(this, point);
+    isSame(point, quick) {
+        return PointHelper.isSame(this, point, quick);
     }
     reset() {
         PointHelper.reset(this);
@@ -1222,9 +1243,9 @@ const AroundHelper = {
         }
         if (!onlyBoxSize) to.x += box.x, to.y += box.y;
     },
-    getPoint(around, box, to) {
+    getPoint(around, box, to, onlyBoxSize = true) {
         if (!to) to = {};
-        AroundHelper.toPoint(around, box, to, true);
+        AroundHelper.toPoint(around, box, to, onlyBoxSize);
         return to;
     }
 };
@@ -1491,6 +1512,9 @@ const BoundsHelper = {
             y: y + height
         } ];
     },
+    getPoint(t, around, onlyBoxSize = false, to) {
+        return AroundHelper.getPoint(around, t, to, onlyBoxSize);
+    },
     hitRadiusPoint(t, point, pointMatrix) {
         if (pointMatrix) point = PointHelper.tempToInnerRadiusPointOf(point, pointMatrix);
         return point.x >= t.x - point.radiusX && point.x <= t.x + t.width + point.radiusX && (point.y >= t.y - point.radiusY && point.y <= t.y + t.height + point.radiusY);
@@ -1662,6 +1686,9 @@ class Bounds {
     getPoints() {
         return BoundsHelper.getPoints(this);
     }
+    getPoint(around, onlyBoxSize, to) {
+        return BoundsHelper.getPoint(this, around, onlyBoxSize, to);
+    }
     hitPoint(point, pointMatrix) {
         return BoundsHelper.hitPoint(this, point, pointMatrix);
     }
@@ -4102,6 +4129,7 @@ const ImageManager = {
         return image;
     },
     recycle(image) {
+        if (image.parent) image = image.parent;
         image.use--;
         setTimeout(() => {
             if (!image.use) {
@@ -4270,8 +4298,10 @@ class LeaferImage {
         return undefined;
     }
     clearLevels(_checkUse) {}
+    destroyFilter() {}
     destroy() {
         this.clearLevels();
+        this.destroyFilter();
         const {view: view} = this;
         if (view && view.close) view.close();
         this.config = {
@@ -4468,7 +4498,6 @@ function dimType(defaultValue) {
             if (this.__setAttr(key, value)) {
                 const data = this.__;
                 DataHelper.stintSet(data, "__useDim", data.dim || data.bright || data.dimskip);
-                this.__layout.surfaceChange();
             }
         }
     }));
@@ -4518,7 +4547,6 @@ function sortType(defaultValue) {
     return decorateLeafAttr(defaultValue, key => attr({
         set(value) {
             if (this.__setAttr(key, value)) {
-                this.__layout.surfaceChange();
                 this.waitParent(() => {
                     this.parent.__layout.childrenSortChange();
                 });
@@ -4555,7 +4583,6 @@ function hitType(defaultValue) {
         set(value) {
             if (this.__setAttr(key, value)) {
                 this.__layout.hitCanvasChanged = true;
-                if (Debug.showBounds === "hit") this.__layout.surfaceChange();
                 if (this.leafer) this.leafer.updateCursor();
             }
         }
@@ -4761,6 +4788,10 @@ const LeafHelper = {
         if (layout.stateStyleChanged) leaf.updateState();
         if (layout.opacityChanged) updateAllWorldOpacity(leaf);
         leaf.__updateChange();
+        if (layout.surfaceChanged) {
+            if (leaf.__hasComplex) L$1.updateComplex(leaf);
+            layout.surfaceChanged = false;
+        }
     },
     updateAllChange(leaf) {
         updateChange$1(leaf);
@@ -4785,6 +4816,9 @@ const LeafHelper = {
         if (!fromWorld) fromWorld = leaf.__nowWorld;
         if (leaf.__worldFlipped || Platform.fullImageShadow) currentCanvas.copyWorldByReset(fromCanvas, fromWorld, leaf.__nowWorld, blendMode, onlyResetTransform); else currentCanvas.copyWorldToInner(fromCanvas, fromWorld, leaf.__layout.renderBounds, blendMode);
     },
+    renderComplex(_leaf, _canvas, _options) {},
+    updateComplex(_leaf) {},
+    checkComplex(_leaf) {},
     moveWorld(t, x, y = 0, isInnerPoint, transition) {
         const local = isObject(x) ? Object.assign({}, x) : {
             x: x,
@@ -4896,6 +4930,9 @@ const LeafHelper = {
         divideParent(matrix$1, relative.scrollWorldTransform);
         return temp ? matrix$1 : Object.assign({}, matrix$1);
     },
+    updateScaleFixedWorld(_t) {},
+    updateOuterBounds(_t) {},
+    cacheId(_t) {},
     drop(t, parent, index, resize) {
         t.setTransform(L$1.getRelativeWorld(t, parent, true), resize);
         parent.add(t, index);
@@ -4946,7 +4983,8 @@ const LeafBoundsHelper = {
         return target.__.eraser || target.__.visible === 0 ? null : target.__layout.localStrokeBounds;
     },
     localRenderBounds(target) {
-        return target.__.eraser || target.__.visible === 0 ? null : target.__layout.localRenderBounds;
+        const {__: __, __layout: __layout} = target;
+        return __.eraser || __.visible === 0 ? null : __layout.localOuterBounds || __layout.localRenderBounds;
     },
     maskLocalBoxBounds(target, index) {
         return checkMask(target, index) && target.__localBoxBounds;
@@ -4955,7 +4993,8 @@ const LeafBoundsHelper = {
         return checkMask(target, index) && target.__layout.localStrokeBounds;
     },
     maskLocalRenderBounds(target, index) {
-        return checkMask(target, index) && target.__layout.localRenderBounds;
+        const {__layout: __layout} = target;
+        return checkMask(target, index) && (__layout.localOuterBounds || __layout.localRenderBounds);
     },
     excludeRenderBounds(child, options) {
         if (options.bounds && !options.bounds.hit(child.__world, options.matrix)) return true;
@@ -5475,7 +5514,6 @@ class LeafLayout {
     }
     opacityChange() {
         this.opacityChanged = true;
-        this.surfaceChanged || this.surfaceChange();
     }
     childrenSortChange() {
         if (!this.childrenSortChanged) {
@@ -5582,7 +5620,7 @@ class BoundsEvent extends Event {
         }
     }
     static emitWorld(leaf) {
-        if (leaf.leaferIsReady) leaf.emit(WORLD, this);
+        if (leaf.leaferIsReady) leaf.emit(WORLD, leaf);
     }
 }
 
@@ -5968,6 +6006,7 @@ const LeafMatrix = {
         const {parent: parent, __layout: __layout, __world: __world, __scrollWorld: __scrollWorld, __: __} = this;
         multiplyParent$2(this.__local || __layout, parent ? parent.__scrollWorld || parent.__world : defaultWorld, __world, !!__layout.affectScaleOrRotation, __);
         if (__scrollWorld) translateInner(Object.assign(__scrollWorld, __world), __.scrollX, __.scrollY);
+        if (__layout.scaleFixed) LeafHelper.updateScaleFixedWorld(this);
     },
     __updateLocalMatrix() {
         if (this.__local) {
@@ -6001,6 +6040,7 @@ const LeafBounds = {
     __updateWorldBounds() {
         const {__layout: __layout, __world: __world} = this;
         toOuterOf$2(__layout.renderBounds, __world, __world);
+        if (this.__hasComplex) LeafHelper.checkComplex(this);
         if (__layout.resized) {
             if (__layout.resized === "inner") this.__onUpdateSize();
             if (this.__hasLocalEvent) BoundsEvent.emitLocal(this);
@@ -6050,6 +6090,7 @@ const LeafBounds = {
             layout.renderChanged = undefined;
             if (this.parent) this.parent.__layout.renderChange();
         }
+        if (layout.outerScale) LeafHelper.updateOuterBounds(this);
         layout.resized || (layout.resized = "local");
         layout.boundsChanged = undefined;
     },
@@ -6116,7 +6157,7 @@ const LeafRender = {
             const data = this.__;
             if (data.bright && !options.topRendering) return options.topList.add(this);
             canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
-            canvas.opacity = options.dimOpacity && !data.dimskip ? data.opacity * options.dimOpacity : data.opacity;
+            canvas.opacity = options.ignoreOpacity ? 1 : options.dimOpacity && !data.dimskip ? data.opacity * options.dimOpacity : data.opacity;
             if (this.__.__single) {
                 if (data.eraser === "path") return this.__renderEraser(canvas, options);
                 const tempCanvas = canvas.getSameCanvas(true, true);
@@ -6170,7 +6211,7 @@ const BranchRender = {
                 if (data.eraser === "path") return this.__renderEraser(canvas, options);
                 const tempCanvas = canvas.getSameCanvas(false, true);
                 this.__renderBranch(tempCanvas, options);
-                canvas.opacity = options.dimOpacity ? data.opacity * options.dimOpacity : data.opacity;
+                canvas.opacity = options.ignoreOpacity ? 1 : options.dimOpacity ? data.opacity * options.dimOpacity : data.opacity;
                 canvas.copyWorldByReset(tempCanvas, nowWorld, nowWorld, data.__blendMode, true);
                 tempCanvas.recycle(nowWorld);
             } else {
@@ -6186,7 +6227,7 @@ const BranchRender = {
             const {children: children} = this;
             for (let i = 0, len = children.length; i < len; i++) {
                 child = children[i];
-                excludeRenderBounds$1(child, options) || (child.__.complex ? child.__renderComplex(canvas, options) : child.__render(canvas, options));
+                excludeRenderBounds$1(child, options) || (child.__hasComplex ? LeafHelper.renderComplex(child, canvas, options) : child.__render(canvas, options));
             }
         }
     },
@@ -6200,8 +6241,6 @@ const BranchRender = {
     }
 };
 
-const tempScaleData$1 = {};
-
 const {LEAF: LEAF, create: create} = IncrementId;
 
 const {stintSet: stintSet$4} = DataHelper;
@@ -6212,6 +6251,8 @@ const {toOuterOf: toOuterOf$1} = BoundsHelper;
 
 const {copy: copy$2, move: move$2} = PointHelper;
 
+const {getScaleFixedData: getScaleFixedData} = MathHelper;
+
 const {moveLocal: moveLocal, zoomOfLocal: zoomOfLocal, rotateOfLocal: rotateOfLocal, skewOfLocal: skewOfLocal, moveWorld: moveWorld, zoomOfWorld: zoomOfWorld, rotateOfWorld: rotateOfWorld, skewOfWorld: skewOfWorld, transform: transform, transformWorld: transformWorld, setTransform: setTransform, getFlipTransform: getFlipTransform, getLocalOrigin: getLocalOrigin, getRelativeWorld: getRelativeWorld, drop: drop} = LeafHelper;
 
 let Leaf = class Leaf {
@@ -6370,6 +6411,7 @@ let Leaf = class Leaf {
             this.__level = this.parent ? this.parent.__level + 1 : 1;
             if (this.animation) this.__runAnimation("in");
             if (this.__bubbleMap) this.__emitLifeEvent(ChildEvent.MOUNTED);
+            if (leafer.cacheId) LeafHelper.cacheId(this);
         } else {
             this.__emitLifeEvent(ChildEvent.UNMOUNTED);
         }
@@ -6499,13 +6541,8 @@ let Leaf = class Leaf {
         if (scaleX < 0) scaleX = -scaleX;
         return scaleX > 1 ? scaleX : 1;
     }
-    getRenderScaleData(abs, scaleFixed) {
-        let {scaleX: scaleX, scaleY: scaleY} = ImageManager.patternLocked ? this.__world : this.__nowWorld;
-        if (abs) scaleX < 0 && (scaleX = -scaleX), scaleY < 0 && (scaleY = -scaleY);
-        if (scaleFixed === true || scaleFixed === "zoom-in" && scaleX > 1 && scaleY > 1) scaleX = scaleY = 1;
-        tempScaleData$1.scaleX = scaleX;
-        tempScaleData$1.scaleY = scaleY;
-        return tempScaleData$1;
+    getRenderScaleData(abs, scaleFixed, unscale = true) {
+        return getScaleFixedData(ImageManager.patternLocked ? this.__world : this.__nowWorld || this.__world, scaleFixed, unscale, abs);
     }
     getTransform(relative) {
         return this.__layout.getTransform(relative || "local");
@@ -6544,14 +6581,16 @@ let Leaf = class Leaf {
             relative.innerToWorld(world, to, distance);
             world = to ? to : world;
         }
-        toInnerPoint(this.scrollWorldTransform, world, to, distance);
+        toInnerPoint(this.worldTransform, world, to, distance);
     }
     innerToWorld(inner, to, distance, relative) {
-        toOuterPoint(this.scrollWorldTransform, inner, to, distance);
+        toOuterPoint(this.worldTransform, inner, to, distance);
         if (relative) relative.worldToInner(to ? to : inner, null, distance);
     }
     getBoxPoint(world, relative, distance, change) {
-        return this.getBoxPointByInner(this.getInnerPoint(world, relative, distance, change), null, null, true);
+        const inner = this.getInnerPoint(world, relative, distance, change);
+        if (distance) return inner;
+        return this.getBoxPointByInner(inner, null, null, true);
     }
     getBoxPointByInner(inner, _relative, _distance, change) {
         const point = change ? inner : Object.assign({}, inner), {x: x, y: y} = this.boxBounds;
@@ -6667,7 +6706,6 @@ let Leaf = class Leaf {
     __drawHitPath(_canvas) {}
     __updateHitCanvas() {}
     __render(_canvas, _options) {}
-    __renderComplex(_canvas, _options) {}
     __drawFast(_canvas, _options) {}
     __draw(_canvas, _options, _originCanvas) {}
     __clip(_canvas, _options) {}
@@ -6678,7 +6716,7 @@ let Leaf = class Leaf {
     __drawPath(_canvas) {}
     __drawRenderPath(_canvas) {}
     __updatePath() {}
-    __updateRenderPath() {}
+    __updateRenderPath(_updateCache) {}
     getMotionPathData() {
         return Plugin.need("path");
     }
@@ -6752,9 +6790,11 @@ let Branch = class Branch extends Leaf {
         return 0;
     }
     __updateRenderSpread() {
+        let layout;
         const {children: children} = this;
         for (let i = 0, len = children.length; i < len; i++) {
-            if (children[i].__layout.renderSpread) return 1;
+            layout = children[i].__layout;
+            if (layout.renderSpread || layout.localOuterBounds) return 1;
         }
         return 0;
     }
@@ -7013,7 +7053,7 @@ class LeafLevelList {
     }
 }
 
-const version = "2.0.2";
+const version = "2.0.4";
 
 const debug$5 = Debug.get("LeaferCanvas");
 
@@ -8047,7 +8087,7 @@ class Selector {
         this.config = {};
         if (userConfig) this.config = DataHelper.default(userConfig, this.config);
         this.picker = new Picker(this.target = target, this);
-        this.finder = Creator.finder && Creator.finder();
+        this.finder = Creator.finder && Creator.finder(target, this.config);
     }
     getByPoint(hitPoint, hitRadius, options) {
         const {target: target, picker: picker} = this;
@@ -8089,7 +8129,9 @@ function effectType(defaultValue) {
         set(value) {
             this.__setAttr(key, value);
             if (value) this.__.__useEffect = true;
-            this.__layout.renderChanged || this.__layout.renderChange();
+            const layout = this.__layout;
+            layout.renderChanged || layout.renderChange();
+            layout.surfaceChange();
         }
     }));
 }
@@ -8303,15 +8345,16 @@ class UIData extends LeafData {
         this.__needComputePaint = undefined;
     }
     __getRealStrokeWidth(childStyle) {
-        let {strokeWidth: strokeWidth, strokeWidthFixed: strokeWidthFixed} = this;
+        let {strokeWidth: strokeWidth, strokeScaleFixed: strokeScaleFixed} = this;
         if (childStyle) {
             if (childStyle.strokeWidth) strokeWidth = childStyle.strokeWidth;
-            if (!isUndefined(childStyle.strokeWidthFixed)) strokeWidthFixed = childStyle.strokeWidthFixed;
+            if (!isUndefined(childStyle.strokeScaleFixed)) strokeScaleFixed = childStyle.strokeScaleFixed;
         }
-        if (strokeWidthFixed) {
-            const scale = this.__leaf.getClampRenderScale();
-            return scale > 1 ? strokeWidth / scale : strokeWidth;
-        } else return strokeWidth;
+        if (strokeScaleFixed) {
+            const {scaleX: scaleX} = this.__leaf.getRenderScaleData(true, strokeScaleFixed, false);
+            if (scaleX !== 1) return strokeWidth * scaleX;
+        }
+        return strokeWidth;
     }
     __setPaint(attrName, value) {
         this.__setInput(attrName, value);
@@ -8393,7 +8436,11 @@ class EllipseData extends UIData {
 
 class PolygonData extends LineData {}
 
-class StarData extends UIData {}
+class StarData extends UIData {
+    get __boxStroke() {
+        return !this.__pathInputed;
+    }
+}
 
 class PathData extends UIData {
     get __pathInputed() {
@@ -8497,7 +8544,7 @@ const UIBounds = {
         const data = this.__, {strokeAlign: strokeAlign, __maxStrokeWidth: strokeWidth} = data, box = this.__box;
         if ((data.stroke || data.hitStroke === "all") && strokeWidth && strokeAlign !== "inside") {
             boxSpread = spread = strokeAlign === "center" ? strokeWidth / 2 : strokeWidth;
-            if (!data.__boxStroke) {
+            if (!data.__boxStroke || data.__useArrow) {
                 const miterLimitAddWidth = data.__isLinePath ? 0 : 10 * spread;
                 const storkeCapAddWidth = data.strokeCap === "none" ? 0 : strokeWidth;
                 spread += Math.max(miterLimitAddWidth, storkeCapAddWidth);
@@ -8654,6 +8701,12 @@ let UI = UI_1 = class UI extends Leaf {
     get isFrame() {
         return false;
     }
+    set strokeWidthFixed(value) {
+        this.strokeScaleFixed = value;
+    }
+    get strokeWidthFixed() {
+        return this.strokeScaleFixed;
+    }
     set scale(value) {
         MathHelper.assignScale(this, value);
     }
@@ -8709,6 +8762,9 @@ let UI = UI_1 = class UI extends Leaf {
     getPathString(curve, pathForRender, floatLength) {
         return PathConvert.stringify(this.getPath(curve, pathForRender), floatLength);
     }
+    asPath(curve, pathForRender) {
+        this.path = this.getPath(curve, pathForRender);
+    }
     load() {
         this.__.__computePaint();
     }
@@ -8718,16 +8774,18 @@ let UI = UI_1 = class UI extends Leaf {
             data.lazy && !this.__inLazyBounds && !Export.running ? data.__needComputePaint = true : data.__computePaint();
         }
     }
-    __updateRenderPath() {
+    __updateRenderPath(updateCache) {
         const data = this.__;
         if (data.path) {
             data.__pathForRender = data.cornerRadius ? PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path;
-            if (data.__useArrow) PathArrow.addArrows(this);
+            if (data.__useArrow) PathArrow.addArrows(this, updateCache);
         } else data.__pathForRender && (data.__pathForRender = undefined);
     }
     __drawRenderPath(canvas) {
+        const data = this.__;
         canvas.beginPath();
-        this.__drawPathByData(canvas, this.__.__pathForRender);
+        if (data.__useArrow) PathArrow.updateArrow(this);
+        this.__drawPathByData(canvas, data.__pathForRender);
     }
     __drawPath(canvas) {
         canvas.beginPath();
@@ -8776,6 +8834,7 @@ let UI = UI_1 = class UI extends Leaf {
     static setEditOuter(_toolName) {}
     static setEditInner(_editorName) {}
     destroy() {
+        this.__.__willDestroy = true;
         this.fill = this.stroke = null;
         if (this.__animate) this.killAnimate();
         super.destroy();
@@ -8892,7 +8951,7 @@ __decorate([ strokeType("inside") ], UI.prototype, "strokeAlign", void 0);
 
 __decorate([ strokeType(1, true) ], UI.prototype, "strokeWidth", void 0);
 
-__decorate([ strokeType(false) ], UI.prototype, "strokeWidthFixed", void 0);
+__decorate([ strokeType(false) ], UI.prototype, "strokeScaleFixed", void 0);
 
 __decorate([ strokeType("none") ], UI.prototype, "strokeCap", void 0);
 
@@ -9393,6 +9452,9 @@ let Box = class Box extends Group {
     get isBranchLeaf() {
         return true;
     }
+    get __useSelfBox() {
+        return this.pathInputed;
+    }
     constructor(data) {
         super(data);
         this.__layout.renderChanged || this.__layout.renderChange();
@@ -9408,7 +9470,7 @@ let Box = class Box extends Group {
     }
     __updateRectBoxBounds() {}
     __updateBoxBounds(_secondLayout) {
-        if (this.children.length && !this.pathInputed) {
+        if (this.children.length && !this.__useSelfBox) {
             const data = this.__;
             if (data.__autoSide) {
                 if (data.__hasSurface) this.__extraUpdate();
@@ -9524,9 +9586,9 @@ let Ellipse = class Ellipse extends UI {
         return "Ellipse";
     }
     __updatePath() {
-        const {width: width, height: height, innerRadius: innerRadius, startAngle: startAngle, endAngle: endAngle} = this.__;
+        const data = this.__, {width: width, height: height, innerRadius: innerRadius, startAngle: startAngle, endAngle: endAngle} = data;
         const rx = width / 2, ry = height / 2;
-        const path = this.__.path = [];
+        const path = data.path = [];
         let open;
         if (innerRadius) {
             if (startAngle || endAngle) {
@@ -9548,7 +9610,7 @@ let Ellipse = class Ellipse extends UI {
             }
         }
         if (!open) closePath$2(path);
-        if (Platform.ellipseToCurve) this.__.path = this.getPath(true);
+        if (Platform.ellipseToCurve || data.__useArrow) data.path = this.getPath(true);
     }
 };
 
@@ -10088,7 +10150,7 @@ let App = class App extends Leafer {
         if (this.viewReady) this.renderer.update();
     }
     __render(canvas, options) {
-        if (canvas.context) this.forEach(leafer => options.matrix ? leafer.__render(canvas, options) : canvas.copyWorld(leafer.canvas, options.bounds));
+        if (canvas.context) this.forEach(leafer => options.matrix ? leafer.__render(canvas, options) : canvas.copyWorld(leafer.canvas, options.bounds, undefined, undefined, true));
     }
     __onResize(event) {
         this.forEach(leafer => leafer.resize(event));
@@ -11140,6 +11202,14 @@ class InteractionBase {
     stopDragAnimate() {
         this.dragger.stopAnimate();
     }
+    replaceDownTarget(target) {
+        const {downData: downData} = this;
+        if (downData && target) {
+            const {path: path} = downData;
+            path.remove(path.list[0]);
+            path.addAt(target, 0);
+        }
+    }
     updateDownData(data, options, merge) {
         const {downData: downData} = this;
         if (!data && downData) data = downData;
@@ -11571,6 +11641,10 @@ const KeyEventHelper = {
 const {pathCanDrag: pathCanDrag} = InteractionHelper;
 
 class Interaction extends InteractionBase {
+    get windowTarget() {
+        const {view: view} = this;
+        return view && view.ownerDocument || window;
+    }
     get notPointer() {
         const {p: p} = this;
         return p.type !== "pointer" || p.touch || this.useMultiTouch;
@@ -11616,7 +11690,7 @@ class Interaction extends InteractionBase {
         }
         for (let name in windowEvents) {
             windowEvents[name] = windowEvents[name].bind(this);
-            window.addEventListener(name, windowEvents[name]);
+            this.windowTarget.addEventListener(name, windowEvents[name]);
         }
     }
     __removeListenEvents() {
@@ -11627,7 +11701,7 @@ class Interaction extends InteractionBase {
             this.viewEvents = {};
         }
         for (let name in windowEvents) {
-            window.removeEventListener(name, windowEvents[name]);
+            this.windowTarget.removeEventListener(name, windowEvents[name]);
             this.windowEvents = {};
         }
     }
@@ -11647,7 +11721,8 @@ class Interaction extends InteractionBase {
         if (wheel.preventDefault) e.preventDefault();
     }
     preventWindowPointer(e) {
-        return !this.downData && e.target !== this.view;
+        if (this.downData || e.target === this.view) return false;
+        return this.config.shadowDOM && e.composedPath ? !e.composedPath().includes(this.view) : true;
     }
     onKeyDown(e) {
         this.keyDown(KeyEventHelper.convert(e));
@@ -11859,8 +11934,8 @@ function fills(fills, ui, canvas, renderOptions) {
             canvas.save();
             if (item.transform) canvas.transform(item.transform);
             if (originPaint.scaleFixed) {
-                const {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true);
-                if (originPaint.scaleFixed === true || originPaint.scaleFixed === "zoom-in" && scaleX > 1 && scaleY > 1) canvas.scale(1 / scaleX, 1 / scaleY);
+                const {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true, originPaint.scaleFixed, false);
+                if (scaleX !== 1) canvas.scale(scaleX, scaleY);
             }
             if (originPaint.blendMode) canvas.blendMode = originPaint.blendMode;
             fillPathOrText(ui, canvas, renderOptions);
@@ -12281,6 +12356,7 @@ function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds
         const clip = transform && !transform.onlyScale || data.path || data.cornerRadius;
         if (clip || opacity && opacity < 1 || blendMode) leafPaint.complex = clip ? 2 : true;
     }
+    if (paint.filter) PaintImage.applyFilter(leafPaint, image, paint.filter, ui);
     return true;
 }
 
@@ -12508,7 +12584,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
     let {scaleX: scaleX, scaleY: scaleY} = PaintImage.getImageRenderScaleData(paint, ui, canvas, renderOptions), id = paint.film ? paint.nowIndex : scaleX + "-" + scaleY;
     if (paint.patternId !== id && !ui.destroyed) {
         if (!(Platform.image.isLarge(paint.image, scaleX, scaleY) && !paint.data.repeat)) {
-            const {image: image, data: data} = paint, {opacity: opacity, filters: filters} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
+            const {image: image, data: data} = paint, {opacity: opacity} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
             let imageMatrix, xGap, yGap, {width: width, height: height} = image;
             if (fixScale) scaleX *= fixScale, scaleY *= fixScale;
             width *= scaleX;
@@ -12524,7 +12600,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
                 if (transform) copy$1(imageMatrix, transform);
                 scale(imageMatrix, 1 / scaleX, 1 / scaleY);
             }
-            const imageCanvas = image.getCanvas(width, height, opacity, filters, xGap, yGap, ui.leafer && ui.leafer.config.smooth, data.interlace);
+            const imageCanvas = image.getCanvas(width, height, opacity, undefined, xGap, yGap, ui.leafer && ui.leafer.config.smooth, data.interlace);
             const pattern = image.getPattern(imageCanvas, data.repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
             paint.style = pattern;
             paint.patternId = id;
@@ -12553,7 +12629,7 @@ function checkImage(paint, drawImage, ui, canvas, renderOptions) {
         if (drawImage) {
             if (data.repeat) {
                 drawImage = false;
-            } else if (!(originPaint.changeful || paint.film || Platform.name === "miniapp" && ResizeEvent.isResizing(ui) || exporting)) {
+            } else if (!(originPaint.changeful || paint.film || Platform.name === "miniapp" || exporting)) {
                 drawImage = Platform.image.isLarge(image, scaleX, scaleY) || image.width * scaleX > 8096 || image.height * scaleY > 8096;
             }
         }
@@ -12615,6 +12691,7 @@ function recycleImage(attrName, data) {
                 if (!recycleMap) recycleMap = {};
                 recycleMap[url] = true;
                 ImageManager.recyclePaint(paint);
+                if (data.__willDestroy && image.parent) PaintImage.recycleFilter(image, data.__leaf);
                 if (image.loading) {
                     if (!input) {
                         input = data.__input && data.__input[attrName] || [];
@@ -13105,7 +13182,7 @@ function createRows(drawData, content, style) {
         }, row = {
             words: []
         };
-        if (__letterSpacing) content = [ ...content ];
+        content = [ ...content ];
         for (let i = 0, len = content.length; i < len; i++) {
             char = content[i];
             if (char === "\n") {
@@ -15503,9 +15580,7 @@ const {Yes: Yes, NoAndSkip: NoAndSkip, YesAndSkip: YesAndSkip} = Answer;
 const idCondition = {}, classNameCondition = {}, tagCondition = {};
 
 class Finder {
-    constructor(target) {
-        this.innerIdMap = {};
-        this.idMap = {};
+    constructor(target, _config) {
         this.methods = {
             id: (leaf, name) => leaf.id === name ? (this.target && (this.idMap[name] = leaf), 
             1) : 0,
@@ -15515,6 +15590,13 @@ class Finder {
             tag: (leaf, name) => leaf.__tag === name ? 1 : 0,
             tags: (leaf, nameMap) => nameMap[leaf.__tag] ? 1 : 0
         };
+        this.idMap = {};
+        this.innerIdMap = {};
+        const app = target && target.app;
+        if (app) {
+            app.idMap ? this.idMap = app.idMap : app.idMap = this.idMap;
+            app.innerIdMap ? this.innerIdMap = app.innerIdMap : app.innerIdMap = this.innerIdMap;
+        }
         if (this.target = target) this.__listenEvents();
     }
     getBy(condition, branch, one, options) {
@@ -15641,8 +15723,14 @@ ui.findOne = function(condition, options) {
 
 Plugin.add("find");
 
-Creator.finder = function(target) {
-    return new Finder(target);
+Creator.finder = function(target, config) {
+    return new Finder(target, config);
+};
+
+LeafHelper.cacheId = function(t) {
+    const {leafer: leafer, id: id} = t;
+    if (id) leafer.app.idMap[id] = t;
+    if (leafer.cacheInnerId) leafer.app.innerIdMap[t.innerId] = t;
 };
 
 export { AlignHelper, Animate, AnimateEasing, AnimateEvent, AnimateList, Answer, App, AroundHelper, AutoBounds, BezierHelper, Bounds, BoundsEvent, BoundsHelper, Box, BoxData, Branch, BranchHelper, BranchRender, Canvas, CanvasData, CanvasManager, ChildEvent, ColorConvert, Creator, Cursor, DataHelper, Debug, Direction4, Direction9, DragBoundsHelper, DragEvent$1 as DragEvent, Dragger, DropEvent, Effect, Ellipse, EllipseData, EllipseHelper, Event, EventCreator, Eventer, Export, FileHelper, Filter, Finder, FourNumberHelper, Frame, FrameData, Group, GroupData, HighBezierHelper, HighCurveHelper, HitCanvasManager, Image$1 as Image, ImageData, ImageEvent, ImageManager, IncrementId, Interaction, InteractionBase, InteractionHelper, KeyEvent, Keyboard, LayoutEvent, Layouter, Leaf, LeafBounds, LeafBoundsHelper, LeafData, LeafDataProxy, LeafEventer, LeafHelper, LeafLayout, LeafLevelList, LeafList, LeafMatrix, LeafRender, Leafer, LeaferCanvas, LeaferCanvasBase, LeaferData, LeaferEvent, LeaferFilm, LeaferImage, LeaferVideo, Line, LineData, MathHelper, Matrix, MatrixHelper, MoveEvent, MyDragEvent, MyImage, MyPointerEvent, MyTouchEvent, NeedConvertToCanvasCommandMap, OneRadian, PI2, PI_2, Paint, PaintGradient, PaintImage, Path, PathArrow, PathBounds, PathCommandDataHelper, PathCommandMap, PathCommandNodeHelper, PathConvert, PathCorner, PathCreator, PathData, PathDrawer, PathHelper, PathNodeHandleType, PathNumberCommandLengthMap, PathNumberCommandMap, Pen, PenData, Picker, Platform, Plugin, Point, PointHelper, PointerButton, PointerEvent$1 as PointerEvent, Polygon, PolygonData, PropertyEvent, Rect, RectData, RectHelper, RectRender, RenderEvent, Renderer, ResizeEvent, Resource, Robot, RobotData, RotateEvent, Run, Selector, Star, StarData, State, StringNumberMap, SwipeEvent, TaskItem, TaskProcessor, Text, TextConvert, TextData, TouchEvent, Transition, TwoPointBoundsHelper, UI, UIBounds, UICreator, UIData, UIEvent, UIRender, UnitConvert, UnitConvertHelper, WaitHelper, WatchEvent, Watcher, ZoomEvent, affectRenderBoundsType, affectStrokeBoundsType, attr, autoLayoutType, boundsType, canvasPatch, canvasSizeAttrs, createAttr, createDescriptor, cursorType, dataProcessor, dataType, decorateLeafAttr, defineDataProcessor, defineKey, defineLeafAttr, dimType, doBoundsType, doStrokeType, effectType, emptyData, eraserType, extraPropertyEventMap, getBoundsData, getDescriptor, getMatrixData, getPointData, hitType, isArray, isData, isEmptyData, isFinite, isNull, isNumber, isObject, isString, isUndefined, layoutProcessor, leaferTransformAttrMap, maskType, motionPathType, naturalBoundsType, opacityType, path, pathInputType, pathType, pen, positionType, registerUI, registerUIEvent, resizeType, rewrite, rewriteAble, rotationType, scaleType, scrollType, sortType, stateStyleType, stateType, strokeType, surfaceType, tempBounds$2 as tempBounds, tempMatrix$2 as tempMatrix, tempPoint$4 as tempPoint, tryToNumber, useCanvas, useModule, version, visibleType, zoomLayerType };