leafer-ui 1.12.0 → 1.12.2

package/dist/web.js

@@ -425,8 +425,8 @@ var LeaferUI = function(exports) {
         };
     }
     const {sin: sin$5, cos: cos$5, acos: acos, sqrt: sqrt$3} = Math;
-    const {float: float$2} = MathHelper;
-    const tempPoint$3 = {};
+    const {float: float$3} = MathHelper;
+    const tempPoint$4 = {};
     function getWorld() {
         return Object.assign(Object.assign(Object.assign({}, getMatrixData()), getBoundsData()), {
             scaleX: 1,
@@ -483,8 +483,8 @@ var LeaferUI = function(exports) {
             to.f = t.f * pixelRatio;
         },
         scaleOfOuter(t, origin, scaleX, scaleY) {
-            M$6.toInnerPoint(t, origin, tempPoint$3);
-            M$6.scaleOfInner(t, tempPoint$3, scaleX, scaleY);
+            M$6.toInnerPoint(t, origin, tempPoint$4);
+            M$6.scaleOfInner(t, tempPoint$4, scaleX, scaleY);
         },
         scaleOfInner(t, origin, scaleX, scaleY = scaleX) {
             M$6.translateInner(t, origin.x, origin.y);
@@ -502,8 +502,8 @@ var LeaferUI = function(exports) {
             t.d = c * sinR + d * cosR;
         },
         rotateOfOuter(t, origin, rotation) {
-            M$6.toInnerPoint(t, origin, tempPoint$3);
-            M$6.rotateOfInner(t, tempPoint$3, rotation);
+            M$6.toInnerPoint(t, origin, tempPoint$4);
+            M$6.rotateOfInner(t, tempPoint$4, rotation);
         },
         rotateOfInner(t, origin, rotation) {
             M$6.translateInner(t, origin.x, origin.y);
@@ -524,8 +524,8 @@ var LeaferUI = function(exports) {
             }
         },
         skewOfOuter(t, origin, skewX, skewY) {
-            M$6.toInnerPoint(t, origin, tempPoint$3);
-            M$6.skewOfInner(t, tempPoint$3, skewX, skewY);
+            M$6.toInnerPoint(t, origin, tempPoint$4);
+            M$6.skewOfInner(t, tempPoint$4, skewX, skewY);
         },
         skewOfInner(t, origin, skewX, skewY = 0) {
             M$6.translateInner(t, origin.x, origin.y);
@@ -673,12 +673,12 @@ var LeaferUI = function(exports) {
                     const cosR = c / scaleY;
                     rotation = PI_2 - (d > 0 ? acos(-cosR) : -acos(cosR));
                 }
-                const cosR = float$2(cos$5(rotation));
+                const cosR = float$3(cos$5(rotation));
                 const sinR = sin$5(rotation);
-                scaleX = float$2(scaleX), scaleY = float$2(scaleY);
-                skewX = cosR ? float$2((c / scaleY + sinR) / cosR / OneRadian, 9) : 0;
-                skewY = cosR ? float$2((b / scaleX - sinR) / cosR / OneRadian, 9) : 0;
-                rotation = float$2(rotation / OneRadian);
+                scaleX = float$3(scaleX), scaleY = float$3(scaleY);
+                skewX = cosR ? float$3((c / scaleY + sinR) / cosR / OneRadian, 9) : 0;
+                skewY = cosR ? float$3((b / scaleX - sinR) / cosR / OneRadian, 9) : 0;
+                rotation = float$3(rotation / OneRadian);
             } else {
                 scaleX = a;
                 scaleY = d;
@@ -720,6 +720,7 @@ var LeaferUI = function(exports) {
         }
     };
     const M$6 = MatrixHelper;
+    const {float: float$2} = MathHelper;
     const {toInnerPoint: toInnerPoint$2, toOuterPoint: toOuterPoint$3} = MatrixHelper;
     const {sin: sin$4, cos: cos$4, abs: abs$5, sqrt: sqrt$2, atan2: atan2$2, min: min$2, round: round$2} = Math;
     const PointHelper = {
@@ -769,22 +770,27 @@ var LeaferUI = function(exports) {
         },
         tempToInnerOf(t, matrix) {
             const {tempPoint: temp} = P$5;
-            copy$a(temp, t);
+            copy$9(temp, t);
             toInnerPoint$2(matrix, temp, temp);
             return temp;
         },
         tempToOuterOf(t, matrix) {
             const {tempPoint: temp} = P$5;
-            copy$a(temp, t);
+            copy$9(temp, t);
             toOuterPoint$3(matrix, temp, temp);
             return temp;
         },
         tempToInnerRadiusPointOf(t, matrix) {
             const {tempRadiusPoint: temp} = P$5;
-            copy$a(temp, t);
+            copy$9(temp, t);
             P$5.toInnerRadiusPointOf(t, matrix, temp);
             return temp;
         },
+        copyRadiusPoint(t, point, x, y) {
+            copy$9(t, point);
+            setRadius(t, x, y);
+            return t;
+        },
         toInnerRadiusPointOf(t, matrix, to) {
             to || (to = t);
             toInnerPoint$2(matrix, t, to);
@@ -852,14 +858,14 @@ var LeaferUI = function(exports) {
             return points;
         },
         isSame(t, point) {
-            return t.x === point.x && t.y === point.y;
+            return float$2(t.x) === float$2(point.x) && float$2(t.y) === float$2(point.y);
         },
         reset(t) {
             P$5.reset(t);
         }
     };
     const P$5 = PointHelper;
-    const {getDistanceFrom: getDistanceFrom, copy: copy$a, getAtan2: getAtan2} = P$5;
+    const {getDistanceFrom: getDistanceFrom, copy: copy$9, setRadius: setRadius, getAtan2: getAtan2} = P$5;
     class Point {
         constructor(x, y) {
             this.set(x, y);
@@ -932,7 +938,7 @@ var LeaferUI = function(exports) {
             return this;
         }
     }
-    const tempPoint$2 = new Point;
+    const tempPoint$3 = new Point;
     class Matrix {
         constructor(a, b, c, d, e, f) {
             this.set(a, b, c, d, e, f);
@@ -1245,7 +1251,7 @@ var LeaferUI = function(exports) {
             return t;
         },
         toOffsetOutBounds(t, to, offsetBounds) {
-            if (!to) to = t; else copy$9(to, t);
+            if (!to) to = t; else copy$8(to, t);
             if (!offsetBounds) offsetBounds = t;
             to.offsetX = B.maxX(offsetBounds);
             to.offsetY = B.maxY(offsetBounds);
@@ -1392,7 +1398,7 @@ var LeaferUI = function(exports) {
                 if (bounds && (bounds.width || bounds.height)) {
                     if (first) {
                         first = false;
-                        if (!addMode) copy$9(t, bounds);
+                        if (!addMode) copy$8(t, bounds);
                     } else {
                         add$2(t, bounds);
                     }
@@ -1477,7 +1483,7 @@ var LeaferUI = function(exports) {
         }
     };
     const B = BoundsHelper;
-    const {add: add$2, copy: copy$9} = B;
+    const {add: add$2, copy: copy$8} = B;
     class Bounds {
         get minX() {
             return BoundsHelper.minX(this);
@@ -2084,7 +2090,7 @@ var LeaferUI = function(exports) {
     __decorate([ contextMethod() ], Canvas.prototype, "fillText", null);
     __decorate([ contextMethod() ], Canvas.prototype, "measureText", null);
     __decorate([ contextMethod() ], Canvas.prototype, "strokeText", null);
-    const {copy: copy$8, multiplyParent: multiplyParent$4, pixelScale: pixelScale} = MatrixHelper, {round: round$1} = Math, tempPixelBounds = new Bounds, tempPixelBounds2 = new Bounds;
+    const {copy: copy$7, multiplyParent: multiplyParent$4, pixelScale: pixelScale} = MatrixHelper, {round: round$1} = Math, tempPixelBounds = new Bounds, tempPixelBounds2 = new Bounds;
     const minSize = {
         width: 1,
         height: 1,
@@ -2241,7 +2247,7 @@ var LeaferUI = function(exports) {
             const {pixelRatio: pixelRatio} = this;
             this.filter = `blur(${blur * pixelRatio}px)`;
         }
-        copyWorld(canvas, from, to, blendMode, ceilPixel = true) {
+        copyWorld(canvas, from, to, blendMode, ceilPixel) {
             if (blendMode) this.blendMode = blendMode;
             if (from) {
                 this.setTempPixelBounds(from, ceilPixel);
@@ -2252,7 +2258,7 @@ var LeaferUI = function(exports) {
             }
             if (blendMode) this.blendMode = "source-over";
         }
-        copyWorldToInner(canvas, fromWorld, toInnerBounds, blendMode, ceilPixel = true) {
+        copyWorldToInner(canvas, fromWorld, toInnerBounds, blendMode, ceilPixel) {
             if (fromWorld.b || fromWorld.c) {
                 this.save();
                 this.resetTransform();
@@ -2265,7 +2271,7 @@ var LeaferUI = function(exports) {
                 if (blendMode) this.blendMode = "source-over";
             }
         }
-        copyWorldByReset(canvas, from, to, blendMode, onlyResetTransform, ceilPixel = true) {
+        copyWorldByReset(canvas, from, to, blendMode, onlyResetTransform, ceilPixel) {
             this.resetTransform();
             this.copyWorld(canvas, from, to, blendMode, ceilPixel);
             if (!onlyResetTransform) this.useWorldTransform();
@@ -2335,7 +2341,7 @@ var LeaferUI = function(exports) {
         getSameCanvas(useSameWorldTransform, useSameSmooth) {
             const {size: size, pixelSnap: pixelSnap} = this, canvas = this.manager ? this.manager.get(size) : Creator.canvas(Object.assign({}, size));
             canvas.save();
-            if (useSameWorldTransform) copy$8(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
+            if (useSameWorldTransform) copy$7(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
             if (useSameSmooth) canvas.smooth = this.smooth;
             canvas.pixelSnap !== pixelSnap && (canvas.pixelSnap = pixelSnap);
             return canvas;
@@ -2467,14 +2473,14 @@ var LeaferUI = function(exports) {
     const {setPoint: setPoint$1, addPoint: addPoint$1} = TwoPointBoundsHelper;
     const {set: set$1, toNumberPoints: toNumberPoints} = PointHelper;
     const {M: M$5, L: L$6, C: C$4, Q: Q$4, Z: Z$5} = PathCommandMap;
-    const tempPoint$1 = {};
+    const tempPoint$2 = {};
     const BezierHelper = {
         points(data, originPoints, curve, close) {
             let points = toNumberPoints(originPoints);
             data.push(M$5, points[0], points[1]);
             if (curve && points.length > 5) {
                 let aX, aY, bX, bY, cX, cY, c1X, c1Y, c2X, c2Y;
-                let ba, cb, d, len = points.length;
+                let baX, baY, ba, cb, d, len = points.length;
                 const t = curve === true ? .5 : curve;
                 if (close) {
                     points = [ points[len - 2], points[len - 1], ...points, points[0], points[1], points[2], points[3] ];
@@ -2487,7 +2493,9 @@ var LeaferUI = function(exports) {
                     bY = points[i + 1];
                     cX = points[i + 2];
                     cY = points[i + 3];
-                    ba = sqrt$1(pow(bX - aX, 2) + pow(bY - aY, 2));
+                    baX = bX - aX;
+                    baY = bY - aY;
+                    ba = sqrt$1(pow(baX, 2) + pow(baY, 2));
                     cb = sqrt$1(pow(cX - bX, 2) + pow(cY - bY, 2));
                     if (!ba && !cb) continue;
                     d = ba + cb;
@@ -2500,7 +2508,7 @@ var LeaferUI = function(exports) {
                     if (i === 2) {
                         if (!close) data.push(Q$4, c1X, c1Y, bX, bY);
                     } else {
-                        data.push(C$4, c2X, c2Y, c1X, c1Y, bX, bY);
+                        if (baX || baY) data.push(C$4, c2X, c2Y, c1X, c1Y, bX, bY);
                     }
                     c2X = bX + cb * cX;
                     c2Y = bY + cb * cY;
@@ -2635,8 +2643,8 @@ var LeaferUI = function(exports) {
             addMode ? addPoint$1(pointBounds, fromX, fromY) : setPoint$1(pointBounds, fromX, fromY);
             addPoint$1(pointBounds, toX, toY);
             for (let i = 0, len = tList.length; i < len; i++) {
-                getPointAndSet(tList[i], fromX, fromY, x1, y1, x2, y2, toX, toY, tempPoint$1);
-                addPoint$1(pointBounds, tempPoint$1.x, tempPoint$1.y);
+                getPointAndSet(tList[i], fromX, fromY, x1, y1, x2, y2, toX, toY, tempPoint$2);
+                addPoint$1(pointBounds, tempPoint$2.x, tempPoint$2.y);
             }
         },
         getPointAndSet(t, fromX, fromY, x1, y1, x2, y2, toX, toY, setPoint) {
@@ -3068,6 +3076,7 @@ var LeaferUI = function(exports) {
             }
         },
         ellipse(data, x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise) {
+            if (radiusX === radiusY) return arc$2(data, x, y, radiusX, startAngle, endAngle, anticlockwise);
             if (isNull(rotation)) {
                 data.push(F$3, x, y, radiusX, radiusY);
             } else {
@@ -3080,6 +3089,7 @@ var LeaferUI = function(exports) {
             if (isNull(startAngle)) {
                 data.push(P$2, x, y, radius);
             } else {
+                if (isNull(startAngle)) startAngle = 0;
                 if (isNull(endAngle)) endAngle = 360;
                 data.push(O$2, x, y, radius, startAngle, endAngle, anticlockwise ? 1 : 0);
             }
@@ -3280,7 +3290,7 @@ var LeaferUI = function(exports) {
     };
     const {M: M$1, L: L$2, C: C, Q: Q, Z: Z$1, N: N, D: D$1, X: X, G: G, F: F$1, O: O, P: P, U: U} = PathCommandMap;
     const {toTwoPointBounds: toTwoPointBounds, toTwoPointBoundsByQuadraticCurve: toTwoPointBoundsByQuadraticCurve, arcTo: arcTo$1, arc: arc, ellipse: ellipse$1} = BezierHelper;
-    const {addPointBounds: addPointBounds, copy: copy$7, addPoint: addPoint, setPoint: setPoint, addBounds: addBounds, toBounds: toBounds$1} = TwoPointBoundsHelper;
+    const {addPointBounds: addPointBounds, copy: copy$6, addPoint: addPoint, setPoint: setPoint, addBounds: addBounds, toBounds: toBounds$1} = TwoPointBoundsHelper;
     const debug$b = Debug.get("PathBounds");
     let radius, radiusX, radiusY;
     const tempPointBounds = {};
@@ -3356,7 +3366,7 @@ var LeaferUI = function(exports) {
 
                   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$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$6(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 9;
@@ -3374,7 +3384,7 @@ var LeaferUI = function(exports) {
 
                   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$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$6(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 7;
@@ -3391,7 +3401,7 @@ var LeaferUI = function(exports) {
 
                   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$7(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$6(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 6;
@@ -3411,6 +3421,7 @@ var LeaferUI = function(exports) {
         smooth(data, cornerRadius, _cornerSmoothing) {
             let command, lastCommand, commandLen;
             let i = 0, x = 0, y = 0, startX = 0, startY = 0, secondX = 0, secondY = 0, lastX = 0, lastY = 0;
+            if (isArray(cornerRadius)) cornerRadius = cornerRadius[0] || 0;
             const len = data.length;
             const smooth = [];
             while (i < len) {
@@ -3808,7 +3819,9 @@ var LeaferUI = function(exports) {
     const ImageManager = {
         maxRecycled: 10,
         recycledList: [],
-        patternTasker: new TaskProcessor,
+        patternTasker: new TaskProcessor({
+            parallel: 1
+        }),
         get(config) {
             let image = Resource.get(config.url);
             if (!image) Resource.set(config.url, image = Creator.image(config));
@@ -4338,7 +4351,7 @@ var LeaferUI = function(exports) {
             EventCreator.register(target);
         };
     }
-    const {copy: copy$6, toInnerPoint: toInnerPoint$1, toOuterPoint: toOuterPoint$1, scaleOfOuter: scaleOfOuter$2, rotateOfOuter: rotateOfOuter$2, skewOfOuter: skewOfOuter, multiplyParent: multiplyParent$3, divideParent: divideParent, getLayout: getLayout} = MatrixHelper;
+    const {copy: copy$5, toInnerPoint: toInnerPoint$1, toOuterPoint: toOuterPoint$1, scaleOfOuter: scaleOfOuter$2, rotateOfOuter: rotateOfOuter$2, skewOfOuter: skewOfOuter, multiplyParent: multiplyParent$3, divideParent: divideParent, getLayout: getLayout} = MatrixHelper;
     const matrix$1 = {}, {round: round} = Math;
     const LeafHelper = {
         updateAllMatrix(leaf, checkAutoLayout, waitAutoLayout) {
@@ -4434,7 +4447,7 @@ var LeaferUI = function(exports) {
                 if (scaleY) transition = scaleY;
                 scaleY = scaleX;
             }
-            copy$6(matrix$1, o);
+            copy$5(matrix$1, o);
             scaleOfOuter$2(matrix$1, origin, scaleX, scaleY);
             if (L.hasHighPosition(t)) {
                 L.setTransform(t, matrix$1, resize, transition);
@@ -4453,7 +4466,7 @@ var LeaferUI = function(exports) {
         },
         rotateOfLocal(t, origin, angle, transition) {
             const o = t.__localMatrix;
-            copy$6(matrix$1, o);
+            copy$5(matrix$1, o);
             rotateOfOuter$2(matrix$1, origin, angle);
             if (L.hasHighPosition(t)) L.setTransform(t, matrix$1, false, transition); else t.set({
                 x: t.x + matrix$1.e - o.e,
@@ -4465,18 +4478,18 @@ var LeaferUI = function(exports) {
             L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize, transition);
         },
         skewOfLocal(t, origin, skewX, skewY = 0, resize, transition) {
-            copy$6(matrix$1, t.__localMatrix);
+            copy$5(matrix$1, t.__localMatrix);
             skewOfOuter(matrix$1, origin, skewX, skewY);
             L.setTransform(t, matrix$1, resize, transition);
         },
         transformWorld(t, transform, resize, transition) {
-            copy$6(matrix$1, t.worldTransform);
+            copy$5(matrix$1, t.worldTransform);
             multiplyParent$3(matrix$1, transform);
             if (t.parent) divideParent(matrix$1, t.parent.scrollWorldTransform);
             L.setTransform(t, matrix$1, resize, transition);
         },
         transform(t, transform, resize, transition) {
-            copy$6(matrix$1, t.localTransform);
+            copy$5(matrix$1, t.localTransform);
             multiplyParent$3(matrix$1, transform);
             L.setTransform(t, matrix$1, resize, transition);
         },
@@ -4514,7 +4527,7 @@ var LeaferUI = function(exports) {
             return innerOrigin;
         },
         getRelativeWorld(t, relative, temp) {
-            copy$6(matrix$1, t.worldTransform);
+            copy$5(matrix$1, t.worldTransform);
             divideParent(matrix$1, relative.scrollWorldTransform);
             return temp ? matrix$1 : Object.assign({}, matrix$1);
         },
@@ -4652,9 +4665,52 @@ var LeaferUI = function(exports) {
                 if (exclude && exclude === branch) continue;
                 updateBounds$3(branch);
             }
+        },
+        move(branch, x, y) {
+            let w;
+            const {children: children} = branch;
+            for (let i = 0, len = children.length; i < len; i++) {
+                branch = children[i];
+                w = branch.__world;
+                w.e += x;
+                w.f += y;
+                w.x += x;
+                w.y += y;
+                if (branch.isBranch) move$3(branch, x, y);
+            }
+        },
+        scale(branch, x, y, scaleX, scaleY, a, b) {
+            let w;
+            const {children: children} = branch;
+            const changeScaleX = scaleX - 1;
+            const changeScaleY = scaleY - 1;
+            for (let i = 0, len = children.length; i < len; i++) {
+                branch = children[i];
+                w = branch.__world;
+                w.a *= scaleX;
+                w.d *= scaleY;
+                if (w.b || w.c) {
+                    w.b *= scaleX;
+                    w.c *= scaleY;
+                }
+                if (w.e === w.x && w.f === w.y) {
+                    w.x = w.e += (w.e - a) * changeScaleX + x;
+                    w.y = w.f += (w.f - b) * changeScaleY + y;
+                } else {
+                    w.e += (w.e - a) * changeScaleX + x;
+                    w.f += (w.f - b) * changeScaleY + y;
+                    w.x += (w.x - a) * changeScaleX + x;
+                    w.y += (w.y - b) * changeScaleY + y;
+                }
+                w.width *= scaleX;
+                w.height *= scaleY;
+                w.scaleX *= scaleX;
+                w.scaleY *= scaleY;
+                if (branch.isBranch) scale$1(branch, x, y, scaleX, scaleY, a, b);
+            }
         }
     };
-    const {pushAllChildBranch: pushAllChildBranch$1, pushAllBranchStack: pushAllBranchStack, updateBoundsByBranchStack: updateBoundsByBranchStack} = BranchHelper;
+    const {pushAllChildBranch: pushAllChildBranch$1, pushAllBranchStack: pushAllBranchStack, updateBoundsByBranchStack: updateBoundsByBranchStack, move: move$3, scale: scale$1} = BranchHelper;
     const WaitHelper = {
         run(wait) {
             if (wait && wait.length) {
@@ -4667,7 +4723,7 @@ var LeaferUI = function(exports) {
         }
     };
     const {getRelativeWorld: getRelativeWorld$1, updateBounds: updateBounds$2} = LeafHelper;
-    const {toOuterOf: toOuterOf$3, getPoints: getPoints, copy: copy$5} = BoundsHelper;
+    const {toOuterOf: toOuterOf$3, getPoints: getPoints, copy: copy$4} = BoundsHelper;
     const localContent = "_localContentBounds";
     const worldContent = "_worldContentBounds", worldBox = "_worldBoxBounds", worldStroke = "_worldStrokeBounds";
     class LeafLayout {
@@ -4903,7 +4959,7 @@ var LeaferUI = function(exports) {
                 matrix = getRelativeWorld$1(leaf, relative, true);
             }
             if (!layoutBounds) layoutBounds = MatrixHelper.getLayout(matrix);
-            copy$5(layoutBounds, bounds);
+            copy$4(layoutBounds, bounds);
             PointHelper.copy(layoutBounds, point);
             if (unscale) {
                 const {scaleX: scaleX, scaleY: scaleY} = layoutBounds;
@@ -5448,7 +5504,7 @@ var LeaferUI = function(exports) {
         }
     };
     const {setLayout: setLayout, multiplyParent: multiplyParent$2, translateInner: translateInner, defaultWorld: defaultWorld} = MatrixHelper;
-    const {toPoint: toPoint$3, tempPoint: tempPoint} = AroundHelper;
+    const {toPoint: toPoint$3, tempPoint: tempPoint$1} = AroundHelper;
     const LeafMatrix = {
         __updateWorldMatrix() {
             const {parent: parent, __layout: __layout, __world: __world, __scrollWorld: __scrollWorld, __: __} = this;
@@ -5467,8 +5523,8 @@ var LeaferUI = function(exports) {
                 local.e = data.x + data.offsetX;
                 local.f = data.y + data.offsetY;
                 if (data.around || data.origin) {
-                    toPoint$3(data.around || data.origin, layout.boxBounds, tempPoint);
-                    translateInner(local, -tempPoint.x, -tempPoint.y, !data.around);
+                    toPoint$3(data.around || data.origin, layout.boxBounds, tempPoint$1);
+                    translateInner(local, -tempPoint$1.x, -tempPoint$1.y, !data.around);
                 }
             }
             this.__layout.matrixChanged = undefined;
@@ -5476,7 +5532,7 @@ var LeaferUI = function(exports) {
     };
     const {updateMatrix: updateMatrix$1, updateAllMatrix: updateAllMatrix$2} = LeafHelper;
     const {updateBounds: updateBounds$1} = BranchHelper;
-    const {toOuterOf: toOuterOf$2, copyAndSpread: copyAndSpread$2, copy: copy$4} = BoundsHelper;
+    const {toOuterOf: toOuterOf$2, copyAndSpread: copyAndSpread$2, copy: copy$3} = BoundsHelper;
     const {toBounds: toBounds} = PathBounds;
     const LeafBounds = {
         __updateWorldBounds() {
@@ -5585,7 +5641,7 @@ var LeaferUI = function(exports) {
         },
         __updateRenderBounds(_bounds) {
             const layout = this.__layout, {renderSpread: renderSpread} = layout;
-            isNumber(renderSpread) && renderSpread <= 0 ? copy$4(layout.renderBounds, layout.strokeBounds) : copyAndSpread$2(layout.renderBounds, layout.boxBounds, renderSpread);
+            isNumber(renderSpread) && renderSpread <= 0 ? copy$3(layout.renderBounds, layout.strokeBounds) : copyAndSpread$2(layout.renderBounds, layout.boxBounds, renderSpread);
         }
     };
     const LeafRender = {
@@ -5681,7 +5737,7 @@ var LeaferUI = function(exports) {
     const {stintSet: stintSet$4} = DataHelper;
     const {toInnerPoint: toInnerPoint, toOuterPoint: toOuterPoint, multiplyParent: multiplyParent$1} = MatrixHelper;
     const {toOuterOf: toOuterOf$1} = BoundsHelper;
-    const {copy: copy$3, move: move$2} = PointHelper;
+    const {copy: copy$2, move: move$2} = PointHelper;
     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;
     exports.Leaf = class Leaf {
         get tag() {
@@ -5998,14 +6054,14 @@ var LeaferUI = function(exports) {
             if (this.parent) {
                 this.parent.worldToInner(world, to, distance, relative);
             } else {
-                if (to) copy$3(to, world);
+                if (to) copy$2(to, world);
             }
         }
         localToWorld(local, to, distance, relative) {
             if (this.parent) {
                 this.parent.innerToWorld(local, to, distance, relative);
             } else {
-                if (to) copy$3(to, local);
+                if (to) copy$2(to, local);
             }
         }
         worldToInner(world, to, distance, relative) {
@@ -6118,10 +6174,10 @@ var LeaferUI = function(exports) {
         hit(_world, _hitRadius) {
             return true;
         }
-        __hitWorld(_point) {
+        __hitWorld(_point, _forceHitFill) {
             return true;
         }
-        __hit(_local) {
+        __hit(_local, _forceHitFill) {
             return true;
         }
         __hitFill(_inner) {
@@ -6470,7 +6526,7 @@ var LeaferUI = function(exports) {
             this.levelMap = null;
         }
     }
-    const version = "1.12.0";
+    const version = "1.12.2";
     const debug$5 = Debug.get("LeaferCanvas");
     class LeaferCanvas extends LeaferCanvasBase {
         set zIndex(zIndex) {
@@ -6500,6 +6556,7 @@ var LeaferUI = function(exports) {
             if (this.parentView) {
                 const pStyle = this.parentView.style;
                 pStyle.webkitUserSelect = pStyle.userSelect = "none";
+                this.view.classList.add("leafer-canvas-view");
             }
             if (Platform.syncDomFont && !this.parentView) {
                 style.display = "none";
@@ -6559,19 +6616,9 @@ var LeaferUI = function(exports) {
         updateViewSize() {
             const {width: width, height: height, pixelRatio: pixelRatio} = this;
             const {style: style} = this.view;
-            if (this.unreal) {
-                const {config: config, autoWidthStr: autoWidthStr, autoHeightStr: autoHeightStr} = this;
-                if (config.width) {
-                    if (isUndefined(autoWidthStr)) this.autoWidthStr = style.width || "";
-                    style.width = config.width + "px";
-                } else if (!isUndefined(autoWidthStr)) style.width = autoWidthStr;
-                if (config.height) {
-                    if (isUndefined(autoHeightStr)) this.autoHeightStr = style.height || "";
-                    style.height = config.height + "px";
-                } else if (!isUndefined(autoHeightStr)) style.height = autoHeightStr;
-            } else {
-                style.width = width + "px";
-                style.height = height + "px";
+            style.width = width + "px";
+            style.height = height + "px";
+            if (!this.unreal) {
                 this.view.width = Math.ceil(width * pixelRatio);
                 this.view.height = Math.ceil(height * pixelRatio);
             }
@@ -6659,20 +6706,20 @@ var LeaferUI = function(exports) {
         }
         unrealCanvas() {
             if (!this.unreal && this.parentView) {
-                const view = this.view;
+                let view = this.view;
                 if (view) view.remove();
-                this.view = this.parentView;
+                view = this.view = document.createElement("div");
+                this.parentView.appendChild(this.view);
+                view.classList.add("leafer-app-view");
                 this.unreal = true;
             }
         }
         destroy() {
-            if (this.view) {
+            const {view: view} = this;
+            if (view) {
                 this.stopAutoLayout();
                 this.stopListenPixelRatio();
-                if (!this.unreal) {
-                    const view = this.view;
-                    if (view.parentElement) view.remove();
-                }
+                if (view.parentElement) view.remove();
                 super.destroy();
             }
         }
@@ -7296,6 +7343,8 @@ var LeaferUI = function(exports) {
         }
     }
     Renderer.clipSpread = 10;
+    const tempPoint = {};
+    const {copyRadiusPoint: copyRadiusPoint$1} = PointHelper;
     const {hitRadiusPoint: hitRadiusPoint$1} = BoundsHelper;
     class Picker {
         constructor(target, selector) {
@@ -7421,15 +7470,15 @@ var LeaferUI = function(exports) {
             this.eachFind(branch.children, branch.__onlyHitMask);
         }
         eachFind(children, hitMask) {
-            let child, hit;
+            let child, hit, data;
             const {point: point} = this, len = children.length;
             for (let i = len - 1; i > -1; i--) {
-                child = children[i];
-                if (!child.__.visible || hitMask && !child.__.mask) continue;
-                hit = child.__.hitRadius ? true : hitRadiusPoint$1(child.__world, point);
+                child = children[i], data = child.__;
+                if (!data.visible || hitMask && !data.mask) continue;
+                hit = hitRadiusPoint$1(child.__world, data.hitRadius ? copyRadiusPoint$1(tempPoint, point, data.hitRadius) : point);
                 if (child.isBranch) {
                     if (hit || child.__ignoreHitWorld) {
-                        if (child.isBranchLeaf && child.__.__clipAfterFill && !child.__hitWorld(point)) continue;
+                        if (child.isBranchLeaf && data.__clipAfterFill && !child.__hitWorld(point, true)) continue;
                         if (child.topChildren) this.eachFind(child.topChildren, false);
                         this.eachFind(child.children, child.__onlyHitMask);
                         if (child.isBranchLeaf) this.hitChild(child, point);
@@ -7960,7 +8009,7 @@ var LeaferUI = function(exports) {
                     if (stroke && !__fillAfterStroke) data.__isStrokes ? Paint.strokes(stroke, this, canvas, options) : Paint.stroke(stroke, this, canvas, options);
                 }
             } else {
-                if (data.__pathInputed) drawFast(this, canvas, options); else this.__drawFast(canvas, options);
+                if (data.__pathForRender) drawFast(this, canvas, options); else this.__drawFast(canvas, options);
             }
         },
         __drawShape(canvas, options) {
@@ -8080,7 +8129,7 @@ var LeaferUI = function(exports) {
         getPath(curve, pathForRender) {
             this.__layout.update();
             let path = pathForRender ? this.__.__pathForRender : this.__.path;
-            if (!path) pen.set(path = []), this.__drawPathByBox(pen);
+            if (!path) pen.set(path = []), this.__drawPathByBox(pen, !pathForRender);
             return curve ? PathConvert.toCanvasData(path, true) : path;
         }
         getPathString(curve, pathForRender, floatLength) {
@@ -8108,17 +8157,18 @@ var LeaferUI = function(exports) {
         }
         __drawPath(canvas) {
             canvas.beginPath();
-            this.__drawPathByData(canvas, this.__.path);
+            this.__drawPathByData(canvas, this.__.path, true);
         }
-        __drawPathByData(drawer, data) {
-            data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer);
+        __drawPathByData(drawer, data, ignoreCornerRadius) {
+            data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer, ignoreCornerRadius);
         }
-        __drawPathByBox(drawer) {
+        __drawPathByBox(drawer, ignoreCornerRadius) {
             const {x: x, y: y, width: width, height: height} = this.__layout.boxBounds;
-            if (this.__.cornerRadius) {
+            if (this.__.cornerRadius && !ignoreCornerRadius) {
                 const {cornerRadius: cornerRadius} = this.__;
                 drawer.roundRect(x, y, width, height, isNumber(cornerRadius) ? [ cornerRadius ] : cornerRadius);
             } else drawer.rect(x, y, width, height);
+            drawer.closePath();
         }
         drawImagePlaceholder(_paint, canvas, renderOptions) {
             Paint.fill(this.__.placeholderColor, this, canvas, renderOptions);
@@ -8305,6 +8355,9 @@ var LeaferUI = function(exports) {
         get layoutLocked() {
             return !this.layouter.running;
         }
+        get view() {
+            return this.canvas && this.canvas.view;
+        }
         get FPS() {
             return this.renderer ? this.renderer.FPS : 60;
         }
@@ -8356,7 +8409,6 @@ var LeaferUI = function(exports) {
             this.__controllers.push(this.renderer = Creator.renderer(this, canvas, config), this.watcher = Creator.watcher(this, config), this.layouter = Creator.layouter(this, config));
             if (this.isApp) this.__setApp();
             this.__checkAutoLayout();
-            this.view = canvas.view;
             if (!parentApp) {
                 this.selector = Creator.selector(this);
                 this.interaction = Creator.interaction(this, canvas, this.selector, config);
@@ -8636,7 +8688,7 @@ var LeaferUI = function(exports) {
                             if (this.canvasManager) this.canvasManager.destroy();
                         }
                         if (this.canvas) this.canvas.destroy();
-                        this.config.view = this.view = this.parentApp = null;
+                        this.config.view = this.parentApp = null;
                         if (this.userConfig) this.userConfig.view = null;
                         super.destroy();
                         setTimeout(() => {
@@ -8788,7 +8840,6 @@ var LeaferUI = function(exports) {
                 if (startAngle || endAngle) {
                     if (innerRadius < 1) ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius, 0, startAngle, endAngle, false);
                     ellipse(path, rx, ry, rx, ry, 0, endAngle, startAngle, true);
-                    if (innerRadius < 1) closePath$2(path);
                 } else {
                     if (innerRadius < 1) {
                         ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius);
@@ -8796,16 +8847,16 @@ var LeaferUI = function(exports) {
                     }
                     ellipse(path, rx, ry, rx, ry, 0, 360, 0, true);
                 }
-                if (Platform.ellipseToCurve) this.__.path = this.getPath(true);
             } else {
                 if (startAngle || endAngle) {
                     moveTo$3(path, rx, ry);
                     ellipse(path, rx, ry, rx, ry, 0, startAngle, endAngle, false);
-                    closePath$2(path);
                 } else {
                     ellipse(path, rx, ry, rx, ry);
                 }
             }
+            closePath$2(path);
+            if (Platform.ellipseToCurve) this.__.path = this.getPath(true);
         }
     };
     __decorate([ dataProcessor(EllipseData) ], exports.Ellipse.prototype, "__", void 0);
@@ -9560,6 +9611,7 @@ var LeaferUI = function(exports) {
     exports.MoveEvent.BEFORE_MOVE = "move.before_move";
     exports.MoveEvent.START = "move.start";
     exports.MoveEvent.MOVE = "move";
+    exports.MoveEvent.DRAG_ANIMATE = "move.drag_animate";
     exports.MoveEvent.END = "move.end";
     exports.MoveEvent = __decorate([ registerUIEvent() ], exports.MoveEvent);
     exports.TouchEvent = class TouchEvent extends UIEvent {};
@@ -9627,6 +9679,7 @@ var LeaferUI = function(exports) {
                 ctrlKey: e.ctrlKey,
                 shiftKey: e.shiftKey,
                 metaKey: e.metaKey,
+                time: Date.now(),
                 buttons: isUndefined(e.buttons) ? 1 : e.buttons === 0 ? pointerUpButtons : e.buttons,
                 origin: e
             };
@@ -9658,6 +9711,7 @@ var LeaferUI = function(exports) {
     const {getDragEventData: getDragEventData, getDropEventData: getDropEventData, getSwipeEventData: getSwipeEventData} = InteractionHelper;
     class Dragger {
         constructor(interaction) {
+            this.dragDataList = [];
             this.interaction = interaction;
         }
         setDragData(data) {
@@ -9720,6 +9774,7 @@ var LeaferUI = function(exports) {
             this.dragData = getDragEventData(downData, dragData, data);
             if (throughPath) this.dragData.throughPath = throughPath;
             this.dragData.path = path;
+            this.dragDataList.push(this.dragData);
             if (this.moving) {
                 data.moving = true;
                 this.dragData.moveType = "drag";
@@ -9770,9 +9825,9 @@ var LeaferUI = function(exports) {
             interaction.emit(exports.DragEvent.ENTER, data, path, dragEnterPath);
             this.dragEnterPath = path;
         }
-        dragEnd(data, speed) {
+        dragEnd(data) {
             if (!this.dragging && !this.moving) return;
-            if (this.checkDragEndAnimate(data, speed)) return;
+            if (this.checkDragEndAnimate(data)) return;
             this.dragEndReal(data);
         }
         dragEndReal(data) {
@@ -9814,11 +9869,13 @@ var LeaferUI = function(exports) {
         }
         dragReset() {
             exports.DragEvent.list = exports.DragEvent.data = this.draggableList = this.dragData = this.downData = this.dragOverPath = this.dragEnterPath = null;
+            this.dragDataList = [];
         }
         checkDragEndAnimate(_data, _speed) {
             return false;
         }
         animate(_func, _off) {}
+        stopAnimate() {}
         checkDragOut(_data) {}
         autoMoveOnDragOut(_data) {}
         autoMoveCancel() {}
@@ -10203,6 +10260,9 @@ var LeaferUI = function(exports) {
                 this.pointerHover(hoverData);
             }
         }
+        stopDragAnimate() {
+            this.dragger.stopAnimate();
+        }
         updateDownData(data, options, merge) {
             const {downData: downData} = this;
             if (!data && downData) data = downData;
@@ -10381,28 +10441,27 @@ var LeaferUI = function(exports) {
     Platform.getSelector = function(leaf) {
         return leaf.leafer ? leaf.leafer.selector : Platform.selector || (Platform.selector = Creator.selector());
     };
-    const {toInnerRadiusPointOf: toInnerRadiusPointOf, copy: copy$2, setRadius: setRadius} = PointHelper;
+    const {toInnerRadiusPointOf: toInnerRadiusPointOf, copyRadiusPoint: copyRadiusPoint} = PointHelper;
     const {hitRadiusPoint: hitRadiusPoint, hitPoint: hitPoint} = BoundsHelper;
     const inner = {}, worldRadiusPoint = {};
     const leaf = exports.Leaf.prototype;
     leaf.hit = function(worldPoint, hitRadius = 0) {
         this.updateLayout();
-        copy$2(worldRadiusPoint, worldPoint);
-        setRadius(worldRadiusPoint, hitRadius);
+        copyRadiusPoint(worldRadiusPoint, worldPoint, hitRadius);
         const world = this.__world;
         if (hitRadius ? !hitRadiusPoint(world, worldRadiusPoint) : !hitPoint(world, worldRadiusPoint)) return false;
         return this.isBranch ? Platform.getSelector(this).hitPoint(Object.assign({}, worldRadiusPoint), hitRadius, {
             target: this
         }) : this.__hitWorld(worldRadiusPoint);
     };
-    leaf.__hitWorld = function(point) {
+    leaf.__hitWorld = function(point, forceHitFill) {
         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);
+            copyRadiusPoint(inner, point, data.hitRadius);
+            point = inner;
         }
         toInnerRadiusPointOf(point, world, inner);
         if (data.hitBox || isSmall) {
@@ -10413,7 +10472,7 @@ var LeaferUI = function(exports) {
             this.__updateHitCanvas();
             if (!layout.boundsChanged) layout.hitCanvasChanged = false;
         }
-        return this.__hit(inner);
+        return this.__hit(inner, forceHitFill);
     };
     leaf.__hitFill = function(inner) {
         const h = this.__hitCanvas;
@@ -10472,12 +10531,12 @@ var LeaferUI = function(exports) {
         this.__drawHitPath(h);
         h.setStrokeOptions(data);
     };
-    ui$1.__hit = function(inner) {
+    ui$1.__hit = function(inner, forceHitFill) {
         if (this.__box && this.__box.__hit(inner)) return true;
         const data = this.__;
         if (data.__isHitPixel && this.__hitPixel(inner)) return true;
         const {hitFill: hitFill} = data;
-        const needHitFillPath = (data.fill || data.__isCanvas) && (hitFill === "path" || hitFill === "pixel" && !(data.__isAlphaPixelFill || data.__isCanvas)) || hitFill === "all";
+        const needHitFillPath = (data.fill || data.__isCanvas) && (hitFill === "path" || hitFill === "pixel" && !(data.__isAlphaPixelFill || data.__isCanvas)) || hitFill === "all" || forceHitFill;
         if (needHitFillPath && this.__hitFill(inner)) return true;
         const {hitStroke: hitStroke, __maxStrokeWidth: strokeWidth} = data;
         const needHitStrokePath = data.stroke && (hitStroke === "path" || hitStroke === "pixel" && !data.__isAlphaPixelStroke) || hitStroke === "all";
@@ -11468,10 +11527,12 @@ var LeaferUI = function(exports) {
     function createPatternTask(paint, ui, canvas, renderOptions) {
         if (!paint.patternTask) {
             paint.patternTask = ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function*() {
-                paint.patternTask = null;
-                if (canvas.bounds.hit(ui.__nowWorld)) PaintImage.createPattern(paint, ui, canvas, renderOptions);
+                PaintImage.createPattern(paint, ui, canvas, renderOptions);
                 ui.forceUpdate("surface");
-            }), 300);
+            }), 0, () => {
+                paint.patternTask = null;
+                return canvas.bounds.hit(ui.__nowWorld);
+            });
         }
     }
     function createPattern(paint, ui, canvas, renderOptions) {
@@ -12576,7 +12637,7 @@ var LeaferUI = function(exports) {
     exports.surfaceType = surfaceType;
     exports.tempBounds = tempBounds$2;
     exports.tempMatrix = tempMatrix$2;
-    exports.tempPoint = tempPoint$2;
+    exports.tempPoint = tempPoint$3;
     exports.tryToNumber = tryToNumber;
     exports.useCanvas = useCanvas;
     exports.useModule = useModule;