leafer-draw 1.6.3 → 1.6.4

package/dist/web.module.js

@@ -490,19 +490,19 @@ const PointHelper = {
     },
     tempToInnerOf(t, matrix) {
         const { tempPoint: temp } = P$5;
-        copy$b(temp, t);
+        copy$a(temp, t);
         toInnerPoint$2(matrix, temp, temp);
         return temp;
     },
     tempToOuterOf(t, matrix) {
         const { tempPoint: temp } = P$5;
-        copy$b(temp, t);
+        copy$a(temp, t);
         toOuterPoint$3(matrix, temp, temp);
         return temp;
     },
     tempToInnerRadiusPointOf(t, matrix) {
         const { tempRadiusPoint: temp } = P$5;
-        copy$b(temp, t);
+        copy$a(temp, t);
         P$5.toInnerRadiusPointOf(t, matrix, temp);
         return temp;
     },
@@ -575,7 +575,7 @@ const PointHelper = {
     }
 };
 const P$5 = PointHelper;
-const { getDistanceFrom, copy: copy$b, getAtan2 } = P$5;
+const { getDistanceFrom, copy: copy$a, getAtan2 } = P$5;
 
 class Point {
     constructor(x, y) {
@@ -932,7 +932,7 @@ const BoundsHelper = {
             to = t;
         }
         else {
-            copy$a(to, t);
+            copy$9(to, t);
         }
         if (parent) {
             to.offsetX = -(B.maxX(parent) - t.x);
@@ -1090,7 +1090,7 @@ const BoundsHelper = {
                 if (first) {
                     first = false;
                     if (!addMode)
-                        copy$a(t, bounds);
+                        copy$9(t, bounds);
                 }
                 else {
                     add$1(t, bounds);
@@ -1171,7 +1171,7 @@ const BoundsHelper = {
     }
 };
 const B = BoundsHelper;
-const { add: add$1, copy: copy$a } = B;
+const { add: add$1, copy: copy$9 } = B;
 
 class Bounds {
     get minX() { return BoundsHelper.minX(this); }
@@ -2066,7 +2066,7 @@ __decorate([
     contextMethod()
 ], Canvas$1.prototype, "strokeText", null);
 
-const { copy: copy$9, multiplyParent: multiplyParent$3 } = MatrixHelper, { round: round$1 } = Math;
+const { copy: copy$8, multiplyParent: multiplyParent$3 } = MatrixHelper, { round: round$1 } = Math;
 const minSize = { width: 1, height: 1, pixelRatio: 1 };
 const canvasSizeAttrs = ['width', 'height', 'pixelRatio'];
 class LeaferCanvasBase extends Canvas$1 {
@@ -2269,16 +2269,19 @@ class LeaferCanvasBase extends Canvas$1 {
         if (blendMode)
             this.blendMode = 'source-over';
     }
-    clearWorld(bounds, ceilPixel) {
-        this.setTempBounds(bounds, ceilPixel);
-        this.clearRect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
-    }
     clipWorld(bounds, ceilPixel) {
         this.beginPath();
         this.setTempBounds(bounds, ceilPixel);
         this.rect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
         this.clip();
     }
+    clipUI(ruleData) {
+        ruleData.windingRule ? this.clip(ruleData.windingRule) : this.clip();
+    }
+    clearWorld(bounds, ceilPixel) {
+        this.setTempBounds(bounds, ceilPixel);
+        this.clearRect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
+    }
     clear() {
         const { pixelRatio } = this;
         this.clearRect(0, 0, this.width * pixelRatio + 2, this.height * pixelRatio + 2);
@@ -2298,7 +2301,7 @@ class LeaferCanvasBase extends Canvas$1 {
         const { size, pixelSnap } = this, canvas = this.manager ? this.manager.get(size) : Creator.canvas(Object.assign({}, size));
         canvas.save();
         if (useSameWorldTransform)
-            copy$9(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
+            copy$8(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
         if (useSameSmooth)
             canvas.smooth = this.smooth;
         canvas.pixelSnap !== pixelSnap && (canvas.pixelSnap = pixelSnap);
@@ -2677,7 +2680,7 @@ const EllipseHelper = {
 };
 
 const { M: M$4, m, L: L$5, l, H, h, V, v, C: C$3, c, S, s, Q: Q$3, q, T, t, A, a, Z: Z$4, z, N: N$3, D: D$3, X: X$3, G: G$3, F: F$4, O: O$3, P: P$3, U: U$3 } = PathCommandMap;
-const { rect: rect$3, roundRect: roundRect$2, arcTo: arcTo$3, arc: arc$3, ellipse: ellipse$4, quadraticCurveTo: quadraticCurveTo$1 } = BezierHelper;
+const { rect: rect$2, roundRect: roundRect$2, arcTo: arcTo$3, arc: arc$3, ellipse: ellipse$4, quadraticCurveTo: quadraticCurveTo$1 } = BezierHelper;
 const { ellipticalArc } = EllipseHelper;
 const debug$c = Debug.get('PathConvert');
 const setEndPoint$1 = {};
@@ -2874,7 +2877,7 @@ const PathConvert = {
                 case N$3:
                     x = old[i + 1];
                     y = old[i + 2];
-                    curveMode ? rect$3(data, x, y, old[i + 3], old[i + 4]) : copyData(data, old, i, 5);
+                    curveMode ? rect$2(data, x, y, old[i + 3], old[i + 4]) : copyData(data, old, i, 5);
                     i += 5;
                     break;
                 case D$3:
@@ -3050,7 +3053,7 @@ const PathCommandDataHelper = {
 };
 const { ellipse: ellipse$3, arc: arc$2 } = PathCommandDataHelper;
 
-const { moveTo: moveTo$4, lineTo: lineTo$3, quadraticCurveTo, bezierCurveTo, closePath: closePath$3, beginPath, rect: rect$2, roundRect: roundRect$1, ellipse: ellipse$2, arc: arc$1, arcTo: arcTo$2, drawEllipse, drawArc, drawPoints: drawPoints$2 } = PathCommandDataHelper;
+const { moveTo: moveTo$4, lineTo: lineTo$3, quadraticCurveTo, bezierCurveTo, closePath: closePath$3, beginPath, rect: rect$1, roundRect: roundRect$1, ellipse: ellipse$2, arc: arc$1, arcTo: arcTo$2, drawEllipse, drawArc, drawPoints: drawPoints$2 } = PathCommandDataHelper;
 class PathCreator {
     set path(value) { this.__path = value; }
     get path() { return this.__path; }
@@ -3097,7 +3100,7 @@ class PathCreator {
         return this;
     }
     rect(x, y, width, height) {
-        rect$2(this.__path, x, y, width, height);
+        rect$1(this.__path, x, y, width, height);
         this.paint();
         return this;
     }
@@ -3215,7 +3218,7 @@ const PathDrawer = {
 
 const { M: M$1, L: L$2, C, Q, Z: Z$1, N, D, X, G, F: F$1, O, P, U } = PathCommandMap;
 const { toTwoPointBounds, toTwoPointBoundsByQuadraticCurve, arcTo: arcTo$1, arc, ellipse: ellipse$1 } = BezierHelper;
-const { addPointBounds, copy: copy$8, addPoint, setPoint, addBounds, toBounds: toBounds$2 } = TwoPointBoundsHelper;
+const { addPointBounds, copy: copy$7, addPoint, setPoint, addBounds, toBounds: toBounds$2 } = TwoPointBoundsHelper;
 const debug$a = Debug.get('PathBounds');
 let radius, radiusX, radiusY;
 const tempPointBounds = {};
@@ -3287,7 +3290,7 @@ const PathBounds = {
                     break;
                 case G:
                     ellipse$1(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6], data[i + 7], data[i + 8], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$8(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 9;
@@ -3303,7 +3306,7 @@ const PathBounds = {
                     break;
                 case O:
                     arc(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$8(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 7;
@@ -3318,7 +3321,7 @@ const PathBounds = {
                     break;
                 case U:
                     arcTo$1(null, x, y, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$8(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 6;
@@ -4254,8 +4257,8 @@ function registerUIEvent() {
     };
 }
 
-const { copy: copy$7, toInnerPoint: toInnerPoint$1, toOuterPoint: toOuterPoint$1, scaleOfOuter: scaleOfOuter$2, rotateOfOuter: rotateOfOuter$2, skewOfOuter, multiplyParent: multiplyParent$2, divideParent, getLayout } = MatrixHelper;
-const matrix$1 = {}, { round } = Math;
+const { copy: copy$6, toInnerPoint: toInnerPoint$1, toOuterPoint: toOuterPoint$1, scaleOfOuter: scaleOfOuter$2, rotateOfOuter: rotateOfOuter$2, skewOfOuter, multiplyParent: multiplyParent$2, divideParent, getLayout } = MatrixHelper;
+const matrix = {}, { round } = Math;
 const LeafHelper = {
     updateAllMatrix(leaf, checkAutoLayout, waitAutoLayout) {
         if (checkAutoLayout && leaf.__hasAutoLayout && leaf.__layout.matrixChanged)
@@ -4350,13 +4353,13 @@ const LeafHelper = {
                 transition = scaleY;
             scaleY = scaleX;
         }
-        copy$7(matrix$1, o);
-        scaleOfOuter$2(matrix$1, origin, scaleX, scaleY);
+        copy$6(matrix, o);
+        scaleOfOuter$2(matrix, origin, scaleX, scaleY);
         if (t.origin || t.around) {
-            L.setTransform(t, matrix$1, resize, transition);
+            L.setTransform(t, matrix, resize, transition);
         }
         else {
-            const x = t.x + matrix$1.e - o.e, y = t.y + matrix$1.f - o.f;
+            const x = t.x + matrix.e - o.e, y = t.y + matrix.f - o.f;
             if (transition && !resize)
                 t.animate({ x, y, scaleX: t.scaleX * scaleX, scaleY: t.scaleY * scaleY }, transition);
             else
@@ -4368,32 +4371,32 @@ const LeafHelper = {
     },
     rotateOfLocal(t, origin, angle, transition) {
         const o = t.__localMatrix;
-        copy$7(matrix$1, o);
-        rotateOfOuter$2(matrix$1, origin, angle);
+        copy$6(matrix, o);
+        rotateOfOuter$2(matrix, origin, angle);
         if (t.origin || t.around)
-            L.setTransform(t, matrix$1, false, transition);
+            L.setTransform(t, matrix, false, transition);
         else
-            t.set({ x: t.x + matrix$1.e - o.e, y: t.y + matrix$1.f - o.f, rotation: MathHelper.formatRotation(t.rotation + angle) }, transition);
+            t.set({ x: t.x + matrix.e - o.e, y: t.y + matrix.f - o.f, rotation: MathHelper.formatRotation(t.rotation + angle) }, transition);
     },
     skewOfWorld(t, origin, skewX, skewY, resize, transition) {
         L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize, transition);
     },
     skewOfLocal(t, origin, skewX, skewY = 0, resize, transition) {
-        copy$7(matrix$1, t.__localMatrix);
-        skewOfOuter(matrix$1, origin, skewX, skewY);
-        L.setTransform(t, matrix$1, resize, transition);
+        copy$6(matrix, t.__localMatrix);
+        skewOfOuter(matrix, origin, skewX, skewY);
+        L.setTransform(t, matrix, resize, transition);
     },
     transformWorld(t, transform, resize, transition) {
-        copy$7(matrix$1, t.worldTransform);
-        multiplyParent$2(matrix$1, transform);
+        copy$6(matrix, t.worldTransform);
+        multiplyParent$2(matrix, transform);
         if (t.parent)
-            divideParent(matrix$1, t.parent.worldTransform);
-        L.setTransform(t, matrix$1, resize, transition);
+            divideParent(matrix, t.parent.worldTransform);
+        L.setTransform(t, matrix, resize, transition);
     },
     transform(t, transform, resize, transition) {
-        copy$7(matrix$1, t.localTransform);
-        multiplyParent$2(matrix$1, transform);
-        L.setTransform(t, matrix$1, resize, transition);
+        copy$6(matrix, t.localTransform);
+        multiplyParent$2(matrix, transform);
+        L.setTransform(t, matrix, resize, transition);
     },
     setTransform(t, transform, resize, transition) {
         const data = t.__, originPoint = data.origin && L.getInnerOrigin(t, data.origin);
@@ -4427,9 +4430,9 @@ const LeafHelper = {
         return innerOrigin;
     },
     getRelativeWorld(t, relative, temp) {
-        copy$7(matrix$1, t.worldTransform);
-        divideParent(matrix$1, relative.worldTransform);
-        return temp ? matrix$1 : Object.assign({}, matrix$1);
+        copy$6(matrix, t.worldTransform);
+        divideParent(matrix, relative.worldTransform);
+        return temp ? matrix : Object.assign({}, matrix);
     },
     drop(t, parent, index, resize) {
         t.setTransform(L.getRelativeWorld(t, parent, true), resize);
@@ -4568,7 +4571,7 @@ const WaitHelper = {
 };
 
 const { getRelativeWorld: getRelativeWorld$1, updateBounds: updateBounds$2 } = LeafHelper;
-const { toOuterOf: toOuterOf$2, getPoints, copy: copy$6 } = BoundsHelper;
+const { toOuterOf: toOuterOf$2, getPoints, copy: copy$5 } = BoundsHelper;
 const localContent = '_localContentBounds';
 const worldContent = '_worldContentBounds', worldBox = '_worldBoxBounds', worldStroke = '_worldStrokeBounds';
 class LeafLayout {
@@ -4728,7 +4731,7 @@ class LeafLayout {
         }
         if (!layoutBounds)
             layoutBounds = MatrixHelper.getLayout(matrix);
-        copy$6(layoutBounds, bounds);
+        copy$5(layoutBounds, bounds);
         PointHelper.copy(layoutBounds, point);
         if (unscale) {
             const { scaleX, scaleY } = layoutBounds;
@@ -5282,7 +5285,7 @@ const LeafMatrix = {
 
 const { updateMatrix: updateMatrix$1, updateAllMatrix: updateAllMatrix$2 } = LeafHelper;
 const { updateBounds: updateBounds$1 } = BranchHelper;
-const { toOuterOf: toOuterOf$1, copyAndSpread: copyAndSpread$1, copy: copy$5 } = BoundsHelper;
+const { toOuterOf: toOuterOf$1, copyAndSpread: copyAndSpread$1, copy: copy$4 } = BoundsHelper;
 const { toBounds: toBounds$1 } = PathBounds;
 const LeafBounds = {
     __updateWorldBounds() {
@@ -5413,7 +5416,7 @@ const LeafBounds = {
     },
     __updateRenderBounds() {
         const layout = this.__layout;
-        layout.renderSpread > 0 ? copyAndSpread$1(layout.renderBounds, layout.boxBounds, layout.renderSpread) : copy$5(layout.renderBounds, layout.strokeBounds);
+        layout.renderSpread > 0 ? copyAndSpread$1(layout.renderBounds, layout.boxBounds, layout.renderSpread) : copy$4(layout.renderBounds, layout.strokeBounds);
     }
 };
 
@@ -5447,7 +5450,7 @@ const LeafRender = {
         if (this.__worldOpacity) {
             canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
             this.__drawRenderPath(canvas);
-            this.windingRule ? canvas.clip(this.windingRule) : canvas.clip();
+            canvas.clipUI(this);
         }
     },
     __updateWorldOpacity() {
@@ -5518,7 +5521,7 @@ const BranchRender = {
 const { LEAF, create } = IncrementId;
 const { toInnerPoint, toOuterPoint, multiplyParent } = MatrixHelper;
 const { toOuterOf } = BoundsHelper;
-const { copy: copy$4, move } = PointHelper;
+const { copy: copy$3, move } = PointHelper;
 const { moveLocal, zoomOfLocal, rotateOfLocal, skewOfLocal, moveWorld, zoomOfWorld, rotateOfWorld, skewOfWorld, transform, transformWorld, setTransform, getFlipTransform, getLocalOrigin, getRelativeWorld, drop } = LeafHelper;
 let Leaf = class Leaf {
     get tag() { return this.__tag; }
@@ -5731,7 +5734,7 @@ let Leaf = class Leaf {
         }
         else {
             if (to)
-                copy$4(to, world);
+                copy$3(to, world);
         }
     }
     localToWorld(local, to, distance, relative) {
@@ -5740,7 +5743,7 @@ let Leaf = class Leaf {
         }
         else {
             if (to)
-                copy$4(to, local);
+                copy$3(to, local);
         }
     }
     worldToInner(world, to, distance, relative) {
@@ -6230,7 +6233,7 @@ class LeafLevelList {
     }
 }
 
-const version = "1.6.3";
+const version = "1.6.4";
 
 const debug$4 = Debug.get('LeaferCanvas');
 class LeaferCanvas extends LeaferCanvasBase {
@@ -7550,7 +7553,7 @@ const UIRender = {
     __drawAfterFill(canvas, options) {
         if (this.__.__clipAfterFill) {
             canvas.save();
-            this.windingRule ? canvas.clip(this.windingRule) : canvas.clip();
+            canvas.clipUI();
             this.__drawContent(canvas, options);
             canvas.restore();
         }
@@ -8416,8 +8419,8 @@ Rect = __decorate([
     registerUI()
 ], Rect);
 
-const { copy: copy$3, add, includes: includes$1 } = BoundsHelper;
-const rect$1 = Rect.prototype, group = Group.prototype;
+const { copy: copy$2, add, includes: includes$1 } = BoundsHelper;
+const rect = Rect.prototype, group = Group.prototype;
 const childrenRenderBounds = {};
 let Box = class Box extends Group {
     get __tag() { return 'Box'; }
@@ -8462,7 +8465,7 @@ let Box = class Box extends Group {
         const { renderBounds } = this.__layout;
         if (this.children.length) {
             super.__updateRenderBounds();
-            copy$3(childrenRenderBounds, renderBounds);
+            copy$2(childrenRenderBounds, renderBounds);
             this.__updateRectRenderBounds();
             isOverflow = !includes$1(renderBounds, childrenRenderBounds);
             if (isOverflow && this.__.overflow !== 'hide')
@@ -8514,25 +8517,25 @@ __decorate([
     affectRenderBoundsType('show')
 ], Box.prototype, "overflow", void 0);
 __decorate([
-    rewrite(rect$1.__updateStrokeSpread)
+    rewrite(rect.__updateStrokeSpread)
 ], Box.prototype, "__updateStrokeSpread", null);
 __decorate([
-    rewrite(rect$1.__updateRenderSpread)
+    rewrite(rect.__updateRenderSpread)
 ], Box.prototype, "__updateRectRenderSpread", null);
 __decorate([
-    rewrite(rect$1.__updateBoxBounds)
+    rewrite(rect.__updateBoxBounds)
 ], Box.prototype, "__updateRectBoxBounds", null);
 __decorate([
-    rewrite(rect$1.__updateStrokeBounds)
+    rewrite(rect.__updateStrokeBounds)
 ], Box.prototype, "__updateStrokeBounds", null);
 __decorate([
-    rewrite(rect$1.__updateRenderBounds)
+    rewrite(rect.__updateRenderBounds)
 ], Box.prototype, "__updateRectRenderBounds", null);
 __decorate([
-    rewrite(rect$1.__updateChange)
+    rewrite(rect.__updateChange)
 ], Box.prototype, "__updateRectChange", null);
 __decorate([
-    rewrite(rect$1.__render)
+    rewrite(rect.__render)
 ], Box.prototype, "__renderRect", null);
 __decorate([
     rewrite(group.__render)
@@ -9035,6 +9038,9 @@ __decorate([
 __decorate([
     boundsType('show')
 ], Text.prototype, "textOverflow", void 0);
+__decorate([
+    surfaceType(false)
+], Text.prototype, "textEditing", void 0);
 Text = __decorate([
     registerUI()
 ], Text);
@@ -9166,531 +9172,6 @@ function fillPathOrText(ui, canvas) {
     ui.__.__font ? fillText(ui, canvas) : (ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill());
 }
 
-let App = class App extends Leafer {
-    get __tag() { return 'App'; }
-    get isApp() { return true; }
-    constructor(userConfig, data) {
-        super(userConfig, data);
-    }
-    init(userConfig, parentApp) {
-        super.init(userConfig, parentApp);
-        if (userConfig) {
-            const { ground, tree, sky, editor } = userConfig;
-            if (ground)
-                this.ground = this.addLeafer(ground);
-            if (tree || editor)
-                this.tree = this.addLeafer(tree || { type: userConfig.type || 'design' });
-            if (sky || editor)
-                this.sky = this.addLeafer(sky);
-            if (editor)
-                Creator.editor(editor, this);
-        }
-    }
-    __setApp() {
-        const { canvas } = this;
-        const { realCanvas, view } = this.config;
-        if (realCanvas || view === this.canvas.view || !canvas.parentView)
-            this.realCanvas = true;
-        else
-            canvas.unrealCanvas();
-        this.leafer = this;
-        this.watcher.disable();
-        this.layouter.disable();
-    }
-    __updateLocalBounds() {
-        this.forEach(leafer => leafer.updateLayout());
-        super.__updateLocalBounds();
-    }
-    start() {
-        super.start();
-        this.forEach(leafer => leafer.start());
-    }
-    stop() {
-        this.forEach(leafer => leafer.stop());
-        super.stop();
-    }
-    unlockLayout() {
-        super.unlockLayout();
-        this.forEach(leafer => leafer.unlockLayout());
-    }
-    lockLayout() {
-        super.lockLayout();
-        this.forEach(leafer => leafer.lockLayout());
-    }
-    forceRender(bounds, sync) {
-        this.forEach(leafer => leafer.forceRender(bounds, sync));
-    }
-    addLeafer(merge) {
-        const leafer = new Leafer(merge);
-        this.add(leafer);
-        return leafer;
-    }
-    add(leafer, index) {
-        if (!leafer.view) {
-            if (this.realCanvas && !this.canvas.bounds) {
-                setTimeout(() => this.add(leafer, index), 10);
-                return;
-            }
-            leafer.init(this.__getChildConfig(leafer.userConfig), this);
-        }
-        super.add(leafer, index);
-        if (index !== undefined)
-            leafer.canvas.childIndex = index;
-        this.__listenChildEvents(leafer);
-    }
-    forEach(fn) {
-        this.children.forEach(fn);
-    }
-    __onCreated() {
-        this.created = this.children.every(child => child.created);
-    }
-    __onReady() {
-        if (this.children.every(child => child.ready))
-            super.__onReady();
-    }
-    __onViewReady() {
-        if (this.children.every(child => child.viewReady))
-            super.__onViewReady();
-    }
-    __onChildRenderEnd(e) {
-        this.renderer.addBlock(e.renderBounds);
-        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 && options.bounds));
-    }
-    __onResize(event) {
-        this.forEach(leafer => leafer.resize(event));
-        super.__onResize(event);
-    }
-    updateLayout() {
-        this.forEach(leafer => leafer.updateLayout());
-    }
-    __getChildConfig(userConfig) {
-        const config = Object.assign({}, this.config);
-        config.hittable = config.realCanvas = undefined;
-        if (userConfig)
-            DataHelper.assign(config, userConfig);
-        if (this.autoLayout)
-            DataHelper.copyAttrs(config, this, canvasSizeAttrs);
-        config.view = this.realCanvas ? undefined : this.view;
-        config.fill = undefined;
-        return config;
-    }
-    __listenChildEvents(leafer) {
-        leafer.once([
-            [LayoutEvent.END, this.__onReady, this],
-            [RenderEvent.START, this.__onCreated, this],
-            [RenderEvent.END, this.__onViewReady, this]
-        ]);
-        if (this.realCanvas)
-            this.__eventIds.push(leafer.on_(RenderEvent.END, this.__onChildRenderEnd, this));
-    }
-};
-App = __decorate([
-    registerUI()
-], App);
-
-const downKeyMap = {};
-const Keyboard = {
-    isHoldSpaceKey() {
-        return Keyboard.isHold('Space');
-    },
-    isHold(code) {
-        return downKeyMap[code];
-    },
-    setDownCode(code) {
-        if (!downKeyMap[code])
-            downKeyMap[code] = true;
-    },
-    setUpCode(code) {
-        downKeyMap[code] = false;
-    }
-};
-
-const PointerButton = {
-    LEFT: 1,
-    RIGHT: 2,
-    MIDDLE: 4,
-    defaultLeft(event) { if (!event.buttons)
-        event.buttons = 1; },
-    left(event) { return event.buttons === 1; },
-    right(event) { return event.buttons === 2; },
-    middle(event) { return event.buttons === 4; }
-};
-
-class UIEvent extends Event {
-    get spaceKey() { return Keyboard.isHoldSpaceKey(); }
-    get left() { return PointerButton.left(this); }
-    get right() { return PointerButton.right(this); }
-    get middle() { return PointerButton.middle(this); }
-    constructor(params) {
-        super(params.type);
-        this.bubbles = true;
-        Object.assign(this, params);
-    }
-    getBoxPoint(relative) {
-        return (relative || this.current).getBoxPoint(this);
-    }
-    getInnerPoint(relative) {
-        return (relative || this.current).getInnerPoint(this);
-    }
-    getLocalPoint(relative) {
-        return (relative || this.current).getLocalPoint(this);
-    }
-    getPagePoint() {
-        return this.current.getPagePoint(this);
-    }
-    getInner(relative) { return this.getInnerPoint(relative); }
-    getLocal(relative) { return this.getLocalPoint(relative); }
-    getPage() { return this.getPagePoint(); }
-    static changeName(oldName, newName) {
-        EventCreator.changeName(oldName, newName);
-    }
-}
-
-let PointerEvent$1 = class PointerEvent extends UIEvent {
-};
-PointerEvent$1.POINTER = 'pointer';
-PointerEvent$1.BEFORE_DOWN = 'pointer.before_down';
-PointerEvent$1.BEFORE_MOVE = 'pointer.before_move';
-PointerEvent$1.BEFORE_UP = 'pointer.before_up';
-PointerEvent$1.DOWN = 'pointer.down';
-PointerEvent$1.MOVE = 'pointer.move';
-PointerEvent$1.UP = 'pointer.up';
-PointerEvent$1.OVER = 'pointer.over';
-PointerEvent$1.OUT = 'pointer.out';
-PointerEvent$1.ENTER = 'pointer.enter';
-PointerEvent$1.LEAVE = 'pointer.leave';
-PointerEvent$1.TAP = 'tap';
-PointerEvent$1.DOUBLE_TAP = 'double_tap';
-PointerEvent$1.CLICK = 'click';
-PointerEvent$1.DOUBLE_CLICK = 'double_click';
-PointerEvent$1.LONG_PRESS = 'long_press';
-PointerEvent$1.LONG_TAP = 'long_tap';
-PointerEvent$1.MENU = 'pointer.menu';
-PointerEvent$1.MENU_TAP = 'pointer.menu_tap';
-PointerEvent$1 = __decorate([
-    registerUIEvent()
-], PointerEvent$1);
-
-const tempMove = {};
-let DragEvent$1 = class DragEvent extends PointerEvent$1 {
-    static setList(data) {
-        this.list = data instanceof LeafList ? data : new LeafList(data);
-    }
-    static setData(data) {
-        this.data = data;
-    }
-    static getValidMove(leaf, start, total) {
-        const { draggable, dragBounds } = leaf, move = leaf.getLocalPoint(total, null, true);
-        PointHelper.move(move, start.x - leaf.x, start.y - leaf.y);
-        if (dragBounds)
-            this.getMoveInDragBounds(leaf.__localBoxBounds, dragBounds === 'parent' ? leaf.parent.boxBounds : dragBounds, move, true);
-        if (draggable === 'x')
-            move.y = 0;
-        if (draggable === 'y')
-            move.x = 0;
-        return move;
-    }
-    static getMoveInDragBounds(childBox, dragBounds, move, change) {
-        const x = childBox.x + move.x, y = childBox.y + move.y, right = x + childBox.width, bottom = y + childBox.height;
-        const boundsRight = dragBounds.x + dragBounds.width, boundsBottom = dragBounds.y + dragBounds.height;
-        if (!change)
-            move = Object.assign({}, move);
-        if (BoundsHelper.includes(childBox, dragBounds)) {
-            if (x > dragBounds.x)
-                move.x += dragBounds.x - x;
-            else if (right < boundsRight)
-                move.x += boundsRight - right;
-            if (y > dragBounds.y)
-                move.y += dragBounds.y - y;
-            else if (bottom < boundsBottom)
-                move.y += boundsBottom - bottom;
-        }
-        else {
-            if (x < dragBounds.x)
-                move.x += dragBounds.x - x;
-            else if (right > boundsRight)
-                move.x += boundsRight - right;
-            if (y < dragBounds.y)
-                move.y += dragBounds.y - y;
-            else if (bottom > boundsBottom)
-                move.y += boundsBottom - bottom;
-        }
-        return move;
-    }
-    getPageMove(total) {
-        this.assignMove(total);
-        return this.current.getPagePoint(tempMove, null, true);
-    }
-    getInnerMove(relative, total) {
-        if (!relative)
-            relative = this.current;
-        this.assignMove(total);
-        return relative.getInnerPoint(tempMove, null, true);
-    }
-    getLocalMove(relative, total) {
-        if (!relative)
-            relative = this.current;
-        this.assignMove(total);
-        return relative.getLocalPoint(tempMove, null, true);
-    }
-    getPageTotal() {
-        return this.getPageMove(true);
-    }
-    getInnerTotal(relative) {
-        return this.getInnerMove(relative, true);
-    }
-    getLocalTotal(relative) {
-        return this.getLocalMove(relative, true);
-    }
-    getPageBounds() {
-        const total = this.getPageTotal(), start = this.getPagePoint(), bounds = {};
-        BoundsHelper.set(bounds, start.x - total.x, start.y - total.y, total.x, total.y);
-        BoundsHelper.unsign(bounds);
-        return bounds;
-    }
-    assignMove(total) {
-        tempMove.x = total ? this.totalX : this.moveX;
-        tempMove.y = total ? this.totalY : this.moveY;
-    }
-};
-DragEvent$1.BEFORE_DRAG = 'drag.before_drag';
-DragEvent$1.START = 'drag.start';
-DragEvent$1.DRAG = 'drag';
-DragEvent$1.END = 'drag.end';
-DragEvent$1.OVER = 'drag.over';
-DragEvent$1.OUT = 'drag.out';
-DragEvent$1.ENTER = 'drag.enter';
-DragEvent$1.LEAVE = 'drag.leave';
-DragEvent$1 = __decorate([
-    registerUIEvent()
-], DragEvent$1);
-
-let DropEvent = class DropEvent extends PointerEvent$1 {
-    static setList(data) {
-        DragEvent$1.setList(data);
-    }
-    static setData(data) {
-        DragEvent$1.setData(data);
-    }
-};
-DropEvent.DROP = 'drop';
-DropEvent = __decorate([
-    registerUIEvent()
-], DropEvent);
-
-let MoveEvent = class MoveEvent extends DragEvent$1 {
-};
-MoveEvent.BEFORE_MOVE = 'move.before_move';
-MoveEvent.START = 'move.start';
-MoveEvent.MOVE = 'move';
-MoveEvent.END = 'move.end';
-MoveEvent = __decorate([
-    registerUIEvent()
-], MoveEvent);
-
-let RotateEvent = class RotateEvent extends PointerEvent$1 {
-};
-RotateEvent.BEFORE_ROTATE = 'rotate.before_rotate';
-RotateEvent.START = 'rotate.start';
-RotateEvent.ROTATE = 'rotate';
-RotateEvent.END = 'rotate.end';
-RotateEvent = __decorate([
-    registerUIEvent()
-], RotateEvent);
-
-let SwipeEvent = class SwipeEvent extends DragEvent$1 {
-};
-SwipeEvent.SWIPE = 'swipe';
-SwipeEvent.LEFT = 'swipe.left';
-SwipeEvent.RIGHT = 'swipe.right';
-SwipeEvent.UP = 'swipe.up';
-SwipeEvent.DOWN = 'swipe.down';
-SwipeEvent = __decorate([
-    registerUIEvent()
-], SwipeEvent);
-
-let ZoomEvent = class ZoomEvent extends PointerEvent$1 {
-};
-ZoomEvent.BEFORE_ZOOM = 'zoom.before_zoom';
-ZoomEvent.START = 'zoom.start';
-ZoomEvent.ZOOM = 'zoom';
-ZoomEvent.END = 'zoom.end';
-ZoomEvent = __decorate([
-    registerUIEvent()
-], ZoomEvent);
-
-let KeyEvent = class KeyEvent extends UIEvent {
-};
-KeyEvent.DOWN = 'key.down';
-KeyEvent.HOLD = 'key.hold';
-KeyEvent.UP = 'key.up';
-KeyEvent = __decorate([
-    registerUIEvent()
-], KeyEvent);
-
-new LeafList();
-
-Debug.get('emit');
-
-const { toInnerRadiusPointOf, copy: copy$2, setRadius } = PointHelper;
-const inner = {};
-const leaf = Leaf.prototype;
-leaf.__hitWorld = function (point) {
-    const data = this.__;
-    if (!data.hitSelf)
-        return false;
-    const world = this.__world, layout = this.__layout;
-    const isSmall = world.width < 10 && world.height < 10;
-    if (data.hitRadius) {
-        copy$2(inner, point), point = inner;
-        setRadius(point, data.hitRadius);
-    }
-    toInnerRadiusPointOf(point, world, inner);
-    if (data.hitBox || isSmall) {
-        if (BoundsHelper.hitRadiusPoint(layout.boxBounds, inner))
-            return true;
-        if (isSmall)
-            return false;
-    }
-    if (layout.hitCanvasChanged || !this.__hitCanvas) {
-        this.__updateHitCanvas();
-        if (!layout.boundsChanged)
-            layout.hitCanvasChanged = false;
-    }
-    return this.__hit(inner);
-};
-leaf.__hitFill = function (inner) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitFill(inner, this.__.windingRule); };
-leaf.__hitStroke = function (inner, strokeWidth) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitStroke(inner, strokeWidth); };
-leaf.__hitPixel = function (inner) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitPixel(inner, this.__layout.renderBounds, this.__hitCanvas.hitScale); };
-leaf.__drawHitPath = function (canvas) { if (canvas)
-    this.__drawRenderPath(canvas); };
-
-const matrix = new Matrix();
-const ui$1 = UI.prototype;
-ui$1.__updateHitCanvas = function () {
-    if (this.__box)
-        this.__box.__updateHitCanvas();
-    const data = this.__, { hitCanvasManager } = this.leafer || this.parent.leafer;
-    const isHitPixelFill = (data.__isAlphaPixelFill || data.__isCanvas) && data.hitFill === 'pixel';
-    const isHitPixelStroke = data.__isAlphaPixelStroke && data.hitStroke === 'pixel';
-    const isHitPixel = isHitPixelFill || isHitPixelStroke;
-    if (!this.__hitCanvas)
-        this.__hitCanvas = isHitPixel ? hitCanvasManager.getPixelType(this, { contextSettings: { willReadFrequently: true } }) : hitCanvasManager.getPathType(this);
-    const h = this.__hitCanvas;
-    if (isHitPixel) {
-        const { renderBounds } = this.__layout;
-        const size = Platform.image.hitCanvasSize;
-        const scale = h.hitScale = tempBounds$1.set(0, 0, size, size).getFitMatrix(renderBounds).a;
-        const { x, y, width, height } = tempBounds$1.set(renderBounds).scale(scale);
-        h.resize({ width, height, pixelRatio: 1 });
-        h.clear();
-        ImageManager.patternLocked = true;
-        this.__renderShape(h, { matrix: matrix.setWith(this.__world).scaleWith(1 / scale).invertWith().translate(-x, -y) }, !isHitPixelFill, !isHitPixelStroke);
-        ImageManager.patternLocked = false;
-        h.resetTransform();
-        data.__isHitPixel = true;
-    }
-    else {
-        data.__isHitPixel && (data.__isHitPixel = false);
-    }
-    this.__drawHitPath(h);
-    h.setStrokeOptions(data);
-};
-ui$1.__hit = function (inner) {
-    if (this.__box && this.__box.__hit(inner))
-        return true;
-    const data = this.__;
-    if (data.__isHitPixel && this.__hitPixel(inner))
-        return true;
-    const { hitFill } = data;
-    const needHitFillPath = ((data.fill || data.__isCanvas) && (hitFill === 'path' || (hitFill === 'pixel' && !(data.__isAlphaPixelFill || data.__isCanvas)))) || hitFill === 'all';
-    if (needHitFillPath && this.__hitFill(inner))
-        return true;
-    const { hitStroke, __strokeWidth } = data;
-    const needHitStrokePath = (data.stroke && (hitStroke === 'path' || (hitStroke === 'pixel' && !data.__isAlphaPixelStroke))) || hitStroke === 'all';
-    if (!needHitFillPath && !needHitStrokePath)
-        return false;
-    const radiusWidth = inner.radiusX * 2;
-    let hitWidth = radiusWidth;
-    if (needHitStrokePath) {
-        switch (data.strokeAlign) {
-            case 'inside':
-                hitWidth += __strokeWidth * 2;
-                if (!needHitFillPath && this.__hitFill(inner) && this.__hitStroke(inner, hitWidth))
-                    return true;
-                hitWidth = radiusWidth;
-                break;
-            case 'center':
-                hitWidth += __strokeWidth;
-                break;
-            case 'outside':
-                hitWidth += __strokeWidth * 2;
-                if (!needHitFillPath) {
-                    if (!this.__hitFill(inner) && this.__hitStroke(inner, hitWidth))
-                        return true;
-                    hitWidth = radiusWidth;
-                }
-                break;
-        }
-    }
-    return hitWidth ? this.__hitStroke(inner, hitWidth) : false;
-};
-
-const ui = UI.prototype, rect = Rect.prototype, box$1 = Box.prototype;
-rect.__updateHitCanvas = box$1.__updateHitCanvas = function () {
-    if (this.stroke || this.cornerRadius || ((this.fill || this.__.__isCanvas) && this.hitFill === 'pixel') || this.hitStroke === 'all')
-        ui.__updateHitCanvas.call(this);
-    else if (this.__hitCanvas)
-        this.__hitCanvas = null;
-};
-rect.__hitFill = box$1.__hitFill = function (inner) {
-    return this.__hitCanvas ? ui.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
-};
-
-Text.prototype.__drawHitPath = function (canvas) {
-    const { __lineHeight, fontSize, __baseLine, __letterSpacing, __textDrawData: data } = this.__;
-    canvas.beginPath();
-    if (__letterSpacing < 0)
-        this.__drawPathByBox(canvas);
-    else
-        data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
-};
-
-function getSelector(ui) {
-    return ui.leafer ? ui.leafer.selector : (Platform.selector || (Platform.selector = Creator.selector()));
-}
-Group.prototype.pick = function (hitPoint, options) {
-    options || (options = emptyData);
-    this.updateLayout();
-    return getSelector(this).getByPoint(hitPoint, options.hitRadius || 0, Object.assign(Object.assign({}, options), { target: this }));
-};
-
-const canvas = LeaferCanvasBase.prototype;
-canvas.hitFill = function (point, fillRule) {
-    return fillRule ? this.context.isPointInPath(point.x, point.y, fillRule) : this.context.isPointInPath(point.x, point.y);
-};
-canvas.hitStroke = function (point, strokeWidth) {
-    this.strokeWidth = strokeWidth;
-    return this.context.isPointInStroke(point.x, point.y);
-};
-canvas.hitPixel = function (radiusPoint, offset, scale = 1) {
-    let { x, y, radiusX, radiusY } = radiusPoint;
-    if (offset)
-        x -= offset.x, y -= offset.y;
-    tempBounds$1.set(x - radiusX, y - radiusY, radiusX * 2, radiusY * 2).scale(scale).ceil();
-    const { data } = this.context.getImageData(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width || 1, tempBounds$1.height || 1);
-    for (let i = 0, len = data.length; i < len; i += 4) {
-        if (data[i + 3] > 0)
-            return true;
-    }
-    return data[3] > 0;
-};
-
 function strokeText(stroke, ui, canvas) {
     switch (ui.__.strokeAlign) {
         case 'center':
@@ -9716,11 +9197,14 @@ function drawAlign(stroke, align, ui, canvas) {
     out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
     fillText(ui, out);
     out.blendMode = 'normal';
+    copyWorld(canvas, out, ui);
+    out.recycle(ui.__nowWorld);
+}
+function copyWorld(canvas, out, ui) {
     if (ui.__worldFlipped || Platform.fullImageShadow)
         canvas.copyWorldByReset(out, ui.__nowWorld);
     else
         canvas.copyWorldToInner(out, ui.__nowWorld, ui.__layout.renderBounds);
-    out.recycle(ui.__nowWorld);
 }
 function drawTextStroke(ui, canvas) {
     let row, data = ui.__.__textDrawData;
@@ -9789,9 +9273,8 @@ function drawCenter(stroke, strokeWidthScale, ui, canvas) {
         Paint.strokeArrow(stroke, ui, canvas);
 }
 function drawInside(stroke, ui, canvas) {
-    const data = ui.__;
     canvas.save();
-    data.windingRule ? canvas.clip(data.windingRule) : canvas.clip();
+    canvas.clipUI(ui);
     drawCenter(stroke, 2, ui, canvas);
     canvas.restore();
 }
@@ -9805,12 +9288,9 @@ function drawOutside(stroke, ui, canvas) {
         const out = canvas.getSameCanvas(true, true);
         ui.__drawRenderPath(out);
         drawCenter(stroke, 2, ui, out);
-        data.windingRule ? out.clip(data.windingRule) : out.clip();
+        out.clipUI(data);
         out.clearWorld(renderBounds);
-        if (ui.__worldFlipped || Platform.fullImageShadow)
-            canvas.copyWorldByReset(out, ui.__nowWorld);
-        else
-            canvas.copyWorldToInner(out, ui.__nowWorld, renderBounds);
+        copyWorld(canvas, out, ui);
         out.recycle(ui.__nowWorld);
     }
 }
@@ -9866,9 +9346,7 @@ function compute(attrName, ui) {
         paints = [paints];
     recycleMap = PaintImage.recycleImage(attrName, data);
     for (let i = 0, len = paints.length, item; i < len; i++) {
-        item = getLeafPaint(attrName, paints[i], ui);
-        if (item)
-            leafPaints.push(item);
+        (item = getLeafPaint(attrName, paints[i], ui)) && leafPaints.push(item);
     }
     data['_' + attrName] = leafPaints.length ? leafPaints : undefined;
     if (leafPaints.length) {
@@ -9906,8 +9384,8 @@ function getLeafPaint(attrName, paint, ui) {
             data = PaintGradient.conicGradient(paint, boxBounds);
             break;
         case 'solid':
-            const { type, blendMode, color, opacity } = paint;
-            data = { type, blendMode, style: ColorConvert.string(color, opacity) };
+            const { type, color, opacity } = paint;
+            data = { type, style: ColorConvert.string(color, opacity) };
             break;
         default:
             if (paint.r !== undefined)
@@ -10284,7 +9762,7 @@ function checkImage(ui, canvas, paint, allowDraw) {
 }
 function drawImage(ui, canvas, paint, data) {
     canvas.save();
-    ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
+    canvas.clipUI(ui);
     if (paint.blendMode)
         canvas.blendMode = paint.blendMode;
     if (data.opacity)
@@ -10449,12 +9927,10 @@ function shadow(ui, current, shape) {
             }
             worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
         }
-        if (ui.__worldFlipped) {
+        if (ui.__worldFlipped)
             current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
-        }
-        else {
+        else
             current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
-        }
         if (end && index < end)
             other.clearWorld(copyBounds, true);
     });
@@ -10513,12 +9989,10 @@ function innerShadow(ui, current, shape) {
             copyBounds = bounds;
         }
         other.fillWorld(copyBounds, ColorConvert.string(item.color), 'source-in');
-        if (ui.__worldFlipped) {
+        if (ui.__worldFlipped)
             current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
-        }
-        else {
+        else
             current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
-        }
         if (end && index < end)
             other.clearWorld(copyBounds, true);
     });