leafer-ui 1.9.8 → 1.9.10

package/dist/web.module.js

@@ -249,7 +249,7 @@ class LeafData {
 
 let tempA, tempB, tempTo;
 
-const {max: max$4} = Math, tempFour = [ 0, 0, 0, 0 ];
+const {max: max$5} = Math, tempFour = [ 0, 0, 0, 0 ];
 
 const FourNumberHelper = {
     zero: [ ...tempFour ],
@@ -263,7 +263,7 @@ const FourNumberHelper = {
         return to;
     },
     setTemp(top, right, bottom, left) {
-        return set$1(tempFour, top, right, bottom, left);
+        return set$2(tempFour, top, right, bottom, left);
     },
     toTempAB(a, b, change) {
         tempTo = change ? isNumber(a) ? b : a : [];
@@ -301,24 +301,24 @@ const FourNumberHelper = {
         return data;
     },
     max(t, other, change) {
-        if (isNumber(t) && isNumber(other)) return max$4(t, other);
+        if (isNumber(t) && isNumber(other)) return max$5(t, other);
         toTempAB(t, other, change);
-        return set$1(tempTo, max$4(tempA[0], tempB[0]), max$4(tempA[1], tempB[1]), max$4(tempA[2], tempB[2]), max$4(tempA[3], tempB[3]));
+        return set$2(tempTo, max$5(tempA[0], tempB[0]), max$5(tempA[1], tempB[1]), max$5(tempA[2], tempB[2]), max$5(tempA[3], tempB[3]));
     },
     add(t, other, change) {
         if (isNumber(t) && isNumber(other)) return t + other;
         toTempAB(t, other, change);
-        return set$1(tempTo, tempA[0] + tempB[0], tempA[1] + tempB[1], tempA[2] + tempB[2], tempA[3] + tempB[3]);
+        return set$2(tempTo, tempA[0] + tempB[0], tempA[1] + tempB[1], tempA[2] + tempB[2], tempA[3] + tempB[3]);
     },
     swapAndScale(t, scaleX, scaleY, change) {
         if (isNumber(t)) return scaleX === scaleY ? t * scaleX : [ t * scaleY, t * scaleX ];
         const to = change ? t : [];
         const [top, right, bottom, left] = t.length === 4 ? t : get$5(t);
-        return set$1(to, bottom * scaleY, left * scaleX, top * scaleY, right * scaleX);
+        return set$2(to, bottom * scaleY, left * scaleX, top * scaleY, right * scaleX);
     }
 };
 
-const {set: set$1, get: get$5, setTemp: setTemp, toTempAB: toTempAB} = FourNumberHelper;
+const {set: set$2, get: get$5, setTemp: setTemp, toTempAB: toTempAB} = FourNumberHelper;
 
 const {round: round$3, pow: pow$1, PI: PI$3} = Math;
 
@@ -720,7 +720,7 @@ const M$6 = MatrixHelper;
 
 const {toInnerPoint: toInnerPoint$2, toOuterPoint: toOuterPoint$3} = MatrixHelper;
 
-const {sin: sin$4, cos: cos$4, abs: abs$3, sqrt: sqrt$2, atan2: atan2$2, min: min$1, round: round$2} = Math;
+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 = {
     defaultPoint: getPointData(),
@@ -813,12 +813,12 @@ const PointHelper = {
         return getDistanceFrom(t.x, t.y, point.x, point.y);
     },
     getDistanceFrom(x1, y1, x2, y2) {
-        const x = abs$3(x2 - x1);
-        const y = abs$3(y2 - y1);
+        const x = abs$5(x2 - x1);
+        const y = abs$5(y2 - y1);
         return sqrt$2(x * x + y * y);
     },
     getMinDistanceFrom(x1, y1, x2, y2, x3, y3) {
-        return min$1(getDistanceFrom(x1, y1, x2, y2), getDistanceFrom(x2, y2, x3, y3));
+        return min$2(getDistanceFrom(x1, y1, x2, y2), getDistanceFrom(x2, y2, x3, y3));
     },
     getAngle(t, to) {
         return getAtan2(t, to) / OneRadian;
@@ -2592,11 +2592,11 @@ const RectHelper = {
     }
 };
 
-const {sin: sin$3, cos: cos$3, hypot: hypot, atan2: atan2$1, ceil: ceil$1, abs: abs$2, PI: PI$2, sqrt: sqrt$1, pow: pow} = Math;
+const {sin: sin$3, cos: cos$3, hypot: hypot, atan2: atan2$1, ceil: ceil$1, abs: abs$4, PI: PI$2, sqrt: sqrt$1, pow: pow} = Math;
 
 const {setPoint: setPoint$1, addPoint: addPoint$1} = TwoPointBoundsHelper;
 
-const {set: set, toNumberPoints: toNumberPoints} = PointHelper;
+const {set: set$1, toNumberPoints: toNumberPoints} = PointHelper;
 
 const {M: M$5, L: L$6, C: C$4, Q: Q$4, Z: Z$5} = PathCommandMap;
 
@@ -2667,14 +2667,14 @@ const BezierHelper = {
         const lenCB = hypot(CBx, CBy);
         let totalRadian = endRadian - startRadian;
         if (totalRadian < 0) totalRadian += PI2;
-        if (lenBA < 1e-12 || lenCB < 1e-12 || totalRadian < 1e-12 || abs$2(totalRadian - PI$2) < 1e-12) {
+        if (lenBA < 1e-12 || lenCB < 1e-12 || totalRadian < 1e-12 || abs$4(totalRadian - PI$2) < 1e-12) {
             if (data) data.push(L$6, x1, y1);
             if (setPointBounds) {
                 setPoint$1(setPointBounds, fromX, fromY);
                 addPoint$1(setPointBounds, x1, y1);
             }
-            if (setStartPoint) set(setStartPoint, fromX, fromY);
-            if (setEndPoint) set(setEndPoint, x1, y1);
+            if (setStartPoint) set$1(setStartPoint, fromX, fromY);
+            if (setEndPoint) set$1(setEndPoint, x1, y1);
             return;
         }
         const anticlockwise = BAx * CBy - CBx * BAy < 0;
@@ -2700,7 +2700,7 @@ const BezierHelper = {
         let totalRadian = endRadian - startRadian;
         if (totalRadian < 0) totalRadian += PI2; else if (totalRadian > PI2) totalRadian -= PI2;
         if (anticlockwise) totalRadian -= PI2;
-        const parts = ceil$1(abs$2(totalRadian / PI_2));
+        const parts = ceil$1(abs$4(totalRadian / PI_2));
         const partRadian = totalRadian / parts;
         const partRadian4Sin = sin$3(partRadian / 4);
         const control = 8 / 3 * partRadian4Sin * partRadian4Sin / sin$3(partRadian / 2);
@@ -2714,7 +2714,7 @@ const BezierHelper = {
         let fromX = cx + x, fromY = cy + y;
         if (data) data.push(data.length ? L$6 : M$5, fromX, fromY);
         if (setPointBounds) setPoint$1(setPointBounds, fromX, fromY);
-        if (setStartPoint) set(setStartPoint, fromX, fromY);
+        if (setStartPoint) set$1(setStartPoint, fromX, fromY);
         for (let i = 0; i < parts; i++) {
             endCos = cos$3(endRadian);
             endSin = sin$3(endRadian);
@@ -2733,7 +2733,7 @@ const BezierHelper = {
             startRadian = endRadian;
             endRadian += partRadian;
         }
-        if (setEndPoint) set(setEndPoint, cx + x, cy + y);
+        if (setEndPoint) set$1(setEndPoint, cx + x, cy + y);
     },
     quadraticCurveTo(data, fromX, fromY, x1, y1, toX, toY) {
         data.push(C$4, (fromX + 2 * x1) / 3, (fromY + 2 * y1) / 3, (toX + 2 * x1) / 3, (toY + 2 * y1) / 3, toX, toY);
@@ -3167,7 +3167,7 @@ const {M: M$3, L: L$4, C: C$2, Q: Q$2, Z: Z$3, N: N$2, D: D$3, X: X$2, G: G$2, F
 
 const {getMinDistanceFrom: getMinDistanceFrom, getRadianFrom: getRadianFrom} = PointHelper;
 
-const {tan: tan, min: min, abs: abs$1} = Math;
+const {tan: tan, min: min$1, abs: abs$3} = Math;
 
 const startPoint = {};
 
@@ -3225,7 +3225,7 @@ const PathCommandDataHelper = {
     arcTo(data, x1, y1, x2, y2, radius, lastX, lastY) {
         if (!isUndefined(lastX)) {
             const d = getMinDistanceFrom(lastX, lastY, x1, y1, x2, y2);
-            radius = min(radius, min(d / 2, d / 2 * abs$1(tan(getRadianFrom(lastX, lastY, x1, y1, x2, y2) / 2))));
+            radius = min$1(radius, min$1(d / 2, d / 2 * abs$3(tan(getRadianFrom(lastX, lastY, x1, y1, x2, y2) / 2))));
         }
         data.push(U$2, x1, y1, x2, y2, radius);
     },
@@ -4023,7 +4023,7 @@ const I$1 = ImageManager;
 
 const {IMAGE: IMAGE, create: create$1} = IncrementId;
 
-const {floor: floor$1, max: max$3} = Math;
+const {floor: floor$1, max: max$4} = Math;
 
 class LeaferImage {
     get url() {
@@ -4112,7 +4112,7 @@ class LeaferImage {
             }
             if (data) return data;
         }
-        const canvas = Platform.origin.createCanvas(max$3(floor$1(width + (xGap || 0)), 1), max$3(floor$1(height + (yGap || 0)), 1));
+        const canvas = Platform.origin.createCanvas(max$4(floor$1(width + (xGap || 0)), 1), max$4(floor$1(height + (yGap || 0)), 1));
         const ctx = canvas.getContext("2d");
         if (opacity) ctx.globalAlpha = opacity;
         ctx.imageSmoothingEnabled = smooth === false ? false : true;
@@ -6815,7 +6815,7 @@ class LeafLevelList {
     }
 }
 
-const version = "1.9.8";
+const version = "1.9.10";
 
 const debug$5 = Debug.get("LeaferCanvas");
 
@@ -7687,7 +7687,7 @@ class Picker {
             children: [ target ]
         } : target);
         const {list: list} = this.findList;
-        const leaf = this.getBestMatchLeaf(list, options.bottomList, ignoreHittable);
+        const leaf = this.getBestMatchLeaf(list, options.bottomList, ignoreHittable, !!options.findList);
         const path = ignoreHittable ? this.getPath(leaf) : this.getHitablePath(leaf);
         this.clear();
         return through ? {
@@ -7702,7 +7702,7 @@ class Picker {
     hitPoint(hitPoint, hitRadius, options) {
         return !!this.getByPoint(hitPoint, hitRadius, options).target;
     }
-    getBestMatchLeaf(list, bottomList, ignoreHittable) {
+    getBestMatchLeaf(list, bottomList, ignoreHittable, allowNull) {
         const findList = this.findList = new LeafList;
         if (list.length) {
             let find;
@@ -7733,15 +7733,27 @@ class Picker {
                 if (findList.length) return findList.list[0];
             }
         }
+        if (allowNull) return null;
         return ignoreHittable ? list[0] : list.find(item => LeafHelper.worldHittable(item));
     }
     getPath(leaf) {
-        const path = new LeafList;
+        const path = new LeafList, syncList = [], {target: target} = this;
         while (leaf) {
+            if (leaf.syncEventer) syncList.push(leaf.syncEventer);
             path.add(leaf);
             leaf = leaf.parent;
+            if (leaf === target) break;
+        }
+        if (syncList.length) {
+            syncList.forEach(item => {
+                while (item) {
+                    if (item.__.hittable) path.add(item);
+                    item = item.parent;
+                    if (item === target) break;
+                }
+            });
         }
-        if (this.target) path.add(this.target);
+        if (target) path.add(target);
         return path;
     }
     getHitablePath(leaf) {
@@ -8239,12 +8251,12 @@ class ImageData extends RectData {
     }
     __getData() {
         const data = super.__getData();
-        delete data.fill;
+        if (data.url) delete data.fill;
         return data;
     }
     __getInputData(names, options) {
         const data = super.__getInputData(names, options);
-        delete data.fill;
+        if (data.url) delete data.fill;
         return data;
     }
 }
@@ -8263,7 +8275,7 @@ class CanvasData extends RectData {
     }
 }
 
-const {max: max$2, add: add$1} = FourNumberHelper;
+const {max: max$3, add: add$1} = FourNumberHelper;
 
 const UIBounds = {
     __updateStrokeSpread() {
@@ -8279,7 +8291,7 @@ const UIBounds = {
         }
         if (data.__useArrow) spread += strokeWidth * 5;
         if (box) {
-            spread = max$2(spread, box.__layout.strokeSpread = box.__updateStrokeSpread());
+            spread = max$3(spread, box.__layout.strokeSpread = box.__updateStrokeSpread());
             boxSpread = Math.max(boxSpread, box.__layout.strokeBoxSpread);
         }
         this.__layout.strokeBoxSpread = boxSpread;
@@ -8289,86 +8301,18 @@ const UIBounds = {
         let spread = 0;
         const {shadow: shadow, innerShadow: innerShadow, blur: blur, backgroundBlur: backgroundBlur, filter: filter, renderSpread: renderSpread} = this.__, {strokeSpread: strokeSpread} = this.__layout, box = this.__box;
         if (shadow) spread = Effect.getShadowRenderSpread(this, shadow);
-        if (blur) spread = max$2(spread, blur);
+        if (blur) spread = max$3(spread, blur);
         if (filter) spread = add$1(spread, Filter.getSpread(filter));
         if (renderSpread) spread = add$1(spread, renderSpread);
         if (strokeSpread) spread = add$1(spread, strokeSpread);
         let shapeSpread = spread;
-        if (innerShadow) shapeSpread = max$2(shapeSpread, Effect.getInnerShadowSpread(this, innerShadow));
-        if (backgroundBlur) shapeSpread = max$2(shapeSpread, backgroundBlur);
+        if (innerShadow) shapeSpread = max$3(shapeSpread, Effect.getInnerShadowSpread(this, innerShadow));
+        if (backgroundBlur) shapeSpread = max$3(shapeSpread, backgroundBlur);
         this.__layout.renderShapeSpread = shapeSpread;
-        return box ? max$2(box.__updateRenderSpread(), spread) : spread;
-    }
-};
-
-const {float: float} = MathHelper;
-
-const tempContent = new Bounds, tempMerge = new Bounds, tempIntersect = new Bounds;
-
-const DragBoundsHelper = {
-    limitMove(leaf, move) {
-        const {dragBounds: dragBounds, dragBoundsType: dragBoundsType} = leaf;
-        if (dragBounds) D.getValidMove(leaf.__localBoxBounds, D.getDragBounds(leaf), dragBoundsType, move, true);
-        D.axisMove(leaf, move);
-    },
-    limitScaleOf(leaf, origin, scale) {
-        const {dragBounds: dragBounds, dragBoundsType: dragBoundsType} = leaf;
-        if (dragBounds) D.getValidScaleOf(leaf.__localBoxBounds, D.getDragBounds(leaf), dragBoundsType, leaf.getLocalPointByInner(leaf.getInnerPointByBox(origin)), scale, true);
-    },
-    axisMove(leaf, move) {
-        const {draggable: draggable} = leaf;
-        if (draggable === "x") move.y = 0;
-        if (draggable === "y") move.x = 0;
-    },
-    getDragBounds(leaf) {
-        const {dragBounds: dragBounds} = leaf;
-        return dragBounds === "parent" ? leaf.parent.boxBounds : dragBounds;
-    },
-    isInnerMode(content, dragBounds, dragBoundsType, sideType) {
-        return dragBoundsType === "inner" || dragBoundsType === "auto" && content[sideType] > dragBounds[sideType];
-    },
-    getValidMove(content, dragBounds, dragBoundsType, move, change) {
-        const x = content.x + move.x, y = content.y + move.y, right = x + content.width, bottom = y + content.height;
-        const boundsRight = dragBounds.x + dragBounds.width, boundsBottom = dragBounds.y + dragBounds.height;
-        if (!change) move = Object.assign({}, move);
-        if (D.isInnerMode(content, dragBounds, dragBoundsType, "width")) {
-            if (x > dragBounds.x) move.x += dragBounds.x - x; else if (right < boundsRight) move.x += boundsRight - right;
-        } else {
-            if (x < dragBounds.x) move.x += dragBounds.x - x; else if (right > boundsRight) move.x += boundsRight - right;
-        }
-        if (D.isInnerMode(content, dragBounds, dragBoundsType, "height")) {
-            if (y > dragBounds.y) move.y += dragBounds.y - y; else if (bottom < boundsBottom) move.y += boundsBottom - bottom;
-        } else {
-            if (y < dragBounds.y) move.y += dragBounds.y - y; else if (bottom > boundsBottom) move.y += boundsBottom - bottom;
-        }
-        move.x = float(move.x);
-        move.y = float(move.y);
-        return move;
-    },
-    getValidScaleOf(content, dragBounds, dragBoundsType, origin, scale, change) {
-        if (!change) scale = Object.assign({}, scale);
-        let fitScaleX, fitScaleY;
-        tempContent.set(content).scaleOf(origin, scale.x, scale.y).unsign();
-        tempMerge.set(tempContent).add(dragBounds);
-        tempIntersect.set(tempContent).intersect(dragBounds);
-        if (D.isInnerMode(content, dragBounds, dragBoundsType, "width")) {
-            fitScaleX = tempMerge.width / tempContent.width;
-        } else {
-            fitScaleX = tempIntersect.width / tempContent.width;
-        }
-        if (D.isInnerMode(content, dragBounds, dragBoundsType, "height")) {
-            fitScaleY = tempMerge.height / tempContent.height;
-        } else {
-            fitScaleY = tempIntersect.height / tempContent.height;
-        }
-        scale.x = float(tempIntersect.width) ? scale.x * fitScaleX : 1;
-        scale.y = float(tempIntersect.height) ? scale.y * fitScaleY : 1;
-        return scale;
+        return box ? max$3(box.__updateRenderSpread(), spread) : spread;
     }
 };
 
-const D = DragBoundsHelper;
-
 const {stintSet: stintSet$1} = DataHelper;
 
 const UIRender = {
@@ -10034,6 +9978,102 @@ class UIEvent extends Event {
     }
 }
 
+const {float: float, sign: sign} = MathHelper, {min: min, max: max$2, abs: abs$2} = Math;
+
+const tempContent = new Bounds, tempDragBounds = new Bounds;
+
+const DragBoundsHelper = {
+    limitMove(leaf, move) {
+        const {dragBounds: dragBounds, dragBoundsType: dragBoundsType} = leaf;
+        if (dragBounds) D.getValidMove(leaf.__localBoxBounds, D.getDragBounds(leaf), dragBoundsType, move, true);
+        D.axisMove(leaf, move);
+    },
+    limitScaleOf(leaf, origin, scale, lockRatio) {
+        const {dragBounds: dragBounds, dragBoundsType: dragBoundsType} = leaf;
+        if (dragBounds) D.getValidScaleOf(leaf.__localBoxBounds, D.getDragBounds(leaf), dragBoundsType, leaf.getLocalPointByInner(leaf.getInnerPointByBox(origin)), scale, lockRatio, true);
+    },
+    axisMove(leaf, move) {
+        const {draggable: draggable} = leaf;
+        if (draggable === "x") move.y = 0;
+        if (draggable === "y") move.x = 0;
+    },
+    getDragBounds(leaf) {
+        const {dragBounds: dragBounds} = leaf;
+        return dragBounds === "parent" ? leaf.parent.boxBounds : dragBounds;
+    },
+    isInnerMode(content, dragBounds, dragBoundsType, sideType) {
+        return dragBoundsType === "inner" || dragBoundsType === "auto" && content[sideType] > dragBounds[sideType];
+    },
+    getValidMove(content, dragBounds, dragBoundsType, move, change) {
+        const x = content.x + move.x, y = content.y + move.y, right = x + content.width, bottom = y + content.height;
+        const boundsRight = dragBounds.x + dragBounds.width, boundsBottom = dragBounds.y + dragBounds.height;
+        if (!change) move = Object.assign({}, move);
+        if (D.isInnerMode(content, dragBounds, dragBoundsType, "width")) {
+            if (x > dragBounds.x) move.x += dragBounds.x - x; else if (right < boundsRight) move.x += boundsRight - right;
+        } else {
+            if (x < dragBounds.x) move.x += dragBounds.x - x; else if (right > boundsRight) move.x += boundsRight - right;
+        }
+        if (D.isInnerMode(content, dragBounds, dragBoundsType, "height")) {
+            if (y > dragBounds.y) move.y += dragBounds.y - y; else if (bottom < boundsBottom) move.y += boundsBottom - bottom;
+        } else {
+            if (y < dragBounds.y) move.y += dragBounds.y - y; else if (bottom > boundsBottom) move.y += boundsBottom - bottom;
+        }
+        move.x = float(move.x);
+        move.y = float(move.y);
+        return move;
+    },
+    getValidScaleOf(content, dragBounds, dragBoundsType, origin, scale, lockRatio, change) {
+        if (!change) scale = Object.assign({}, scale);
+        tempDragBounds.set(dragBounds);
+        tempContent.set(content).scaleOf(origin, scale.x, scale.y);
+        const originLeftScale = (origin.x - content.x) / content.width, originRightScale = 1 - originLeftScale;
+        const originTopScale = (origin.y - content.y) / content.height, originBottomScale = 1 - originTopScale;
+        let correctScaleX, correctScaleY, aScale, bScale, aSize, bSize;
+        if (D.isInnerMode(content, dragBounds, dragBoundsType, "width")) {
+            correctScaleX = scale.x < 0 ? 1 / scale.x : 1;
+            if (scale.x < 0) tempContent.scaleOf(origin, correctScaleX, 1);
+            aSize = float(tempContent.minX - tempDragBounds.minX);
+            bSize = float(tempDragBounds.maxX - tempContent.maxX);
+            aScale = originLeftScale && aSize > 0 ? 1 + aSize / (originLeftScale * tempContent.width) : 1;
+            bScale = originRightScale && bSize > 0 ? 1 + bSize / (originRightScale * tempContent.width) : 1;
+            correctScaleX *= max$2(aScale, bScale);
+        } else {
+            if (scale.x < 0) tempContent.unsign();
+            aSize = float(tempDragBounds.minX - tempContent.minX);
+            bSize = float(tempContent.maxX - tempDragBounds.maxX);
+            aScale = originLeftScale && aSize > 0 ? 1 - aSize / (originLeftScale * tempContent.width) : 1;
+            bScale = originRightScale && bSize > 0 ? 1 - bSize / (originRightScale * tempContent.width) : 1;
+            correctScaleX = min(aScale, bScale);
+        }
+        if (D.isInnerMode(content, dragBounds, dragBoundsType, "height")) {
+            correctScaleY = scale.y < 0 ? 1 / scale.y : 1;
+            if (scale.y < 0) tempContent.scaleOf(origin, 1, correctScaleY);
+            aSize = float(tempContent.minY - tempDragBounds.minY);
+            bSize = float(tempDragBounds.maxY - tempContent.maxY);
+            aScale = originTopScale && aSize > 0 ? 1 + aSize / (originTopScale * tempContent.height) : 1;
+            bScale = originBottomScale && bSize > 0 ? 1 + bSize / (originBottomScale * tempContent.height) : 1;
+            correctScaleY *= max$2(aScale, bScale);
+            if (lockRatio) {
+                aScale = max$2(abs$2(correctScaleX), abs$2(correctScaleY));
+                correctScaleX = sign(correctScaleX) * aScale;
+                correctScaleY = sign(correctScaleY) * aScale;
+            }
+        } else {
+            if (scale.y < 0) tempContent.unsign();
+            aSize = float(tempDragBounds.minY - tempContent.minY);
+            bSize = float(tempContent.maxY - tempDragBounds.maxY);
+            aScale = originTopScale && aSize > 0 ? 1 - aSize / (originTopScale * tempContent.height) : 1;
+            bScale = originBottomScale && bSize > 0 ? 1 - bSize / (originBottomScale * tempContent.height) : 1;
+            correctScaleY = min(aScale, bScale);
+        }
+        scale.x *= isFinite(correctScaleX) ? correctScaleX : 1;
+        scale.y *= isFinite(correctScaleY) ? correctScaleY : 1;
+        return scale;
+    }
+};
+
+const D = DragBoundsHelper;
+
 let PointerEvent$1 = class PointerEvent extends UIEvent {};
 
 PointerEvent$1.POINTER = "pointer";
@@ -11906,7 +11946,14 @@ const PaintModule = {
 
 let origin = {}, tempMatrix$1 = getMatrixData();
 
-const {get: get$3, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, multiplyParent: multiplyParent, scale: scaleHelper, rotate: rotate, skew: skewHelper} = MatrixHelper;
+const {get: get$3, set: set, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, multiplyParent: multiplyParent, scale: scaleHelper, rotate: rotate, skew: skewHelper} = MatrixHelper;
+
+function stretchMode(data, box, scaleX, scaleY) {
+    const transform = get$3();
+    translate$1(transform, box.x, box.y);
+    if (scaleX) scaleHelper(transform, scaleX, scaleY);
+    data.transform = transform;
+}
 
 function fillOrFitMode(data, box, x, y, scaleX, scaleY, rotation) {
     const transform = get$3();
@@ -11923,8 +11970,11 @@ function clipMode(data, box, x, y, scaleX, scaleY, rotation, skew, clipScaleX, c
     const transform = get$3();
     layout(transform, box, x, y, scaleX, scaleY, rotation, skew);
     if (clipScaleX) {
-        tempMatrix$1.a = clipScaleX, tempMatrix$1.d = clipScaleY;
-        multiplyParent(transform, tempMatrix$1);
+        if (rotation || skew) {
+            set(tempMatrix$1);
+            scaleOfOuter$1(tempMatrix$1, box, clipScaleX, clipScaleY);
+            multiplyParent(transform, tempMatrix$1);
+        } else scaleOfOuter$1(transform, box, clipScaleX, clipScaleY);
     }
     data.transform = transform;
 }
@@ -12020,7 +12070,10 @@ function getPatternData(paint, box, image) {
     if (offset) PointHelper.move(tempImage, offset);
     switch (mode) {
       case "stretch":
-        if (!sameBox) width = box.width, height = box.height;
+        if (!sameBox) {
+            scaleX = box.width / width, scaleY = box.height / height;
+            stretchMode(data, box, scaleX, scaleY);
+        }
         break;
 
       case "normal":
@@ -12029,7 +12082,7 @@ function getPatternData(paint, box, image) {
             let clipScaleX, clipScaleY;
             if (clipSize) clipScaleX = box.width / clipSize.width, clipScaleY = box.height / clipSize.height;
             clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, clipScaleX, clipScaleY);
-            if (clipScaleX) scaleX = scaleX ? scaleX * clipScaleX : scaleX, scaleY = scaleY ? scaleY * clipScaleY : clipScaleY;
+            if (clipScaleX) scaleX = scaleX ? scaleX * clipScaleX : clipScaleX, scaleY = scaleY ? scaleY * clipScaleY : clipScaleY;
         }
         break;
 
@@ -12046,17 +12099,14 @@ function getPatternData(paint, box, image) {
         if (scaleX) fillOrFitMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation);
     }
     if (!data.transform) {
-        if (box.x || box.y) {
-            data.transform = get$2();
-            translate(data.transform, box.x, box.y);
-        }
+        if (box.x || box.y) translate(data.transform = get$2(), box.x, box.y);
     }
-    if (scaleX && mode !== "stretch") {
+    data.width = width;
+    data.height = height;
+    if (scaleX) {
         data.scaleX = scaleX;
         data.scaleY = scaleY;
     }
-    data.width = width;
-    data.height = height;
     if (opacity) data.opacity = opacity;
     if (filters) data.filters = filters;
     if (repeat) data.repeat = isString(repeat) ? repeat === "x" ? "repeat-x" : "repeat-y" : "repeat";
@@ -12188,7 +12238,7 @@ function ignoreRender(ui, value) {
 
 const {get: get$1, scale: scale, copy: copy$1} = MatrixHelper;
 
-const {floor: floor, ceil: ceil, max: max$1, abs: abs} = Math;
+const {floor: floor, ceil: ceil, max: max$1, abs: abs$1} = Math;
 
 function createPattern(ui, paint, pixelRatio) {
     let {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true, paint.scaleFixed);
@@ -12199,8 +12249,8 @@ function createPattern(ui, paint, pixelRatio) {
         scaleX *= pixelRatio;
         scaleY *= pixelRatio;
         if (sx) {
-            sx = abs(sx);
-            sy = abs(sy);
+            sx = abs$1(sx);
+            sy = abs$1(sy);
             imageMatrix = get$1();
             copy$1(imageMatrix, transform);
             scale(imageMatrix, 1 / sx, 1 / sy);
@@ -12342,6 +12392,7 @@ const PaintImageModule = {
     recycleImage: recycleImage,
     createData: createData,
     getPatternData: getPatternData,
+    stretchMode: stretchMode,
     fillOrFitMode: fillOrFitMode,
     clipMode: clipMode,
     repeatMode: repeatMode
@@ -12452,7 +12503,7 @@ const PaintGradientModule = {
     getTransform: getTransform
 };
 
-const {copy: copy, move: move, toOffsetOutBounds: toOffsetOutBounds$1} = BoundsHelper, {max: max} = Math;
+const {copy: copy, move: move, toOffsetOutBounds: toOffsetOutBounds$1} = BoundsHelper, {max: max, abs: abs} = Math;
 
 const tempBounds = {}, tempMatrix = new Matrix;
 
@@ -12472,8 +12523,8 @@ function shadow(ui, current, shape) {
             const sx = Math.abs(nowWorld.scaleX);
             if (sx > 1) otherScale = 1 / sx;
         }
-        other.setWorldShadow(offsetOutBounds$1.offsetX + item.x * scaleX * otherScale, offsetOutBounds$1.offsetY + item.y * scaleY * otherScale, item.blur * scaleX * otherScale, ColorConvert.string(item.color));
-        transform = getShadowTransform(ui, other, shape, item, offsetOutBounds$1, otherScale);
+        other.setWorldShadow(offsetOutBounds$1.offsetX + (item.x || 0) * scaleX * otherScale, offsetOutBounds$1.offsetY + (item.y || 0) * scaleY * otherScale, (item.blur || 0) * scaleX * otherScale, ColorConvert.string(item.color));
+        transform = Effect.getShadowTransform(ui, other, shape, item, offsetOutBounds$1, otherScale);
         if (transform) other.setTransform(transform);
         drawWorldShadow(other, offsetOutBounds$1, shape);
         if (transform) other.resetTransform();
@@ -12496,7 +12547,7 @@ function shadow(ui, current, shape) {
 function getShadowRenderSpread(_ui, shadow) {
     let top = 0, right = 0, bottom = 0, left = 0, x, y, spread, blur;
     shadow.forEach(item => {
-        x = item.x || 0, y = item.y || 0, spread = item.spread || 0, blur = (item.blur || 0) * 1.5;
+        x = item.x || 0, y = item.y || 0, blur = (item.blur || 0) * 1.5, spread = abs(item.spread || 0);
         top = max(top, spread + blur - y);
         right = max(right, spread + blur + x);
         bottom = max(bottom, spread + blur + y);
@@ -12549,8 +12600,8 @@ function innerShadow(ui, current, shape) {
             if (sx > 1) otherScale = 1 / sx;
         }
         other.save();
-        other.setWorldShadow(offsetOutBounds.offsetX + item.x * scaleX * otherScale, offsetOutBounds.offsetY + item.y * scaleY * otherScale, item.blur * scaleX * otherScale);
-        transform = getShadowTransform(ui, other, shape, item, offsetOutBounds, otherScale, true);
+        other.setWorldShadow(offsetOutBounds.offsetX + (item.x || 0) * scaleX * otherScale, offsetOutBounds.offsetY + (item.y || 0) * scaleY * otherScale, (item.blur || 0) * scaleX * otherScale);
+        transform = Effect.getShadowTransform(ui, other, shape, item, offsetOutBounds, otherScale, true);
         if (transform) other.setTransform(transform);
         drawWorldShadow(other, offsetOutBounds, shape);
         other.restore();
@@ -13186,6 +13237,7 @@ const TextConvertModule = {
 };
 
 function string(color, opacity) {
+    if (!color) return "#000";
     const doOpacity = isNumber(opacity) && opacity < 1;
     if (isString(color)) {
         if (doOpacity && ColorConvert.object) color = ColorConvert.object(color); else return color;