leafer-ui 1.9.5 → 1.9.6

package/dist/web.js

@@ -344,7 +344,7 @@ var LeaferUI = function(exports) {
         };
     }
     const {sin: sin$5, cos: cos$5, acos: acos, sqrt: sqrt$3} = Math;
-    const {float: float$1} = MathHelper;
+    const {float: float$2} = MathHelper;
     const tempPoint$3 = {};
     function getWorld() {
         return Object.assign(Object.assign(Object.assign({}, getMatrixData()), getBoundsData()), {
@@ -583,12 +583,12 @@ var LeaferUI = function(exports) {
                     const cosR = c / scaleY;
                     rotation = PI_2 - (d > 0 ? acos(-cosR) : -acos(cosR));
                 }
-                const cosR = float$1(cos$5(rotation));
+                const cosR = float$2(cos$5(rotation));
                 const sinR = sin$5(rotation);
-                scaleX = float$1(scaleX), scaleY = float$1(scaleY);
-                skewX = cosR ? float$1((c / scaleY + sinR) / cosR / OneRadian, 9) : 0;
-                skewY = cosR ? float$1((b / scaleX - sinR) / cosR / OneRadian, 9) : 0;
-                rotation = float$1(rotation / OneRadian);
+                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);
             } else {
                 scaleX = a;
                 scaleY = d;
@@ -1085,7 +1085,7 @@ var LeaferUI = function(exports) {
     };
     const {tempPointBounds: tempPointBounds$1, setPoint: setPoint$2, addPoint: addPoint$2, toBounds: toBounds$2} = TwoPointBoundsHelper;
     const {toOuterPoint: toOuterPoint$2} = MatrixHelper;
-    const {float: float, fourNumber: fourNumber} = MathHelper;
+    const {float: float$1, fourNumber: fourNumber} = MathHelper;
     const {floor: floor$2, ceil: ceil$2} = Math;
     let right$1, bottom$1, boundsRight, boundsBottom;
     const point = {};
@@ -1262,10 +1262,10 @@ var LeaferUI = function(exports) {
             }
         },
         float(t, maxLength) {
-            t.x = float(t.x, maxLength);
-            t.y = float(t.y, maxLength);
-            t.width = float(t.width, maxLength);
-            t.height = float(t.height, maxLength);
+            t.x = float$1(t.x, maxLength);
+            t.y = float$1(t.y, maxLength);
+            t.width = float$1(t.width, maxLength);
+            t.height = float$1(t.height, maxLength);
         },
         add(t, bounds, isPoint) {
             right$1 = t.x + t.width;
@@ -5105,6 +5105,7 @@ var LeaferUI = function(exports) {
     LeaferEvent.STOP = "leafer.stop";
     LeaferEvent.RESTART = "leafer.restart";
     LeaferEvent.END = "leafer.end";
+    LeaferEvent.UPDATE_MODE = "leafer.update_mode";
     LeaferEvent.TRANSFORM = "leafer.transform";
     LeaferEvent.MOVE = "leafer.move";
     LeaferEvent.SCALE = "leafer.scale";
@@ -6350,7 +6351,7 @@ var LeaferUI = function(exports) {
             this.levelMap = null;
         }
     }
-    const version = "1.9.5";
+    const version = "1.9.6";
     const debug$5 = Debug.get("LeaferCanvas");
     class LeaferCanvas extends LeaferCanvasBase {
         set zIndex(zIndex) {
@@ -7252,7 +7253,7 @@ var LeaferUI = function(exports) {
                 item = path.list[i];
                 if (!item.__.hittable) break;
                 hittablePath.addAt(item, 0);
-                if (!item.__.hitChildren) break;
+                if (!item.__.hitChildren || item.isLeafer && item.mode === "draw") break;
             }
             return hittablePath;
         }
@@ -7670,8 +7671,6 @@ var LeaferUI = function(exports) {
                 if (!boxStyle) box.parent = t, box.__world = t.__world, boxLayout.boxBounds = layout.boxBounds;
                 box.set(value);
                 if (boxLayout.strokeChanged) layout.strokeChange();
-                if (boxLayout.renderChanged) layout.renderChange();
-                box.__updateChange();
             } else if (box) {
                 t.__box = box.parent = null;
                 box.destroy();
@@ -7738,7 +7737,7 @@ var LeaferUI = function(exports) {
         __updateRenderSpread() {
             let width = 0;
             const {shadow: shadow, innerShadow: innerShadow, blur: blur, backgroundBlur: backgroundBlur, filter: filter, renderSpread: renderSpread} = this.__;
-            if (shadow) shadow.forEach(item => width = Math.max(width, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread > 0 ? item.spread : 0) + item.blur * 1.5));
+            if (shadow) width = Effect.getShadowSpread(this, shadow);
             if (blur) width = Math.max(width, blur);
             if (filter) width += Filter.getSpread(filter);
             if (renderSpread) width += renderSpread;
@@ -7750,36 +7749,67 @@ var LeaferUI = function(exports) {
             return this.__box ? Math.max(this.__box.__updateRenderSpread(), width) : width;
         }
     };
+    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);
-            const isBiggerWidth = content.width > dragBounds.width;
-            const isBiggerHeight = content.height > dragBounds.height;
-            if (isBiggerWidth && dragBoundsType !== "outer") {
+            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 (isBiggerHeight && dragBoundsType !== "outer") {
+            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 = MathHelper.float(move.x);
-            move.y = MathHelper.float(move.y);
+            move.x = float(move.x);
+            move.y = float(move.y);
             return move;
         },
-        axisMove(leaf, move) {
-            const {draggable: draggable} = leaf;
-            if (draggable === "x") move.y = 0;
-            if (draggable === "y") move.x = 0;
-        },
-        limitMove(leaf, move) {
-            const {dragBounds: dragBounds, dragBoundsType: dragBoundsType} = leaf;
-            if (dragBounds) D.getValidMove(leaf.__localBoxBounds, dragBounds === "parent" ? leaf.parent.boxBounds : dragBounds, dragBoundsType, move, true);
-            D.axisMove(leaf, 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;
         }
     };
     const D = DragBoundsHelper;
@@ -7794,7 +7824,7 @@ var LeaferUI = function(exports) {
             }
             if (data.__useEffect) {
                 const {shadow: shadow, fill: fill, stroke: stroke} = data, otherEffect = data.innerShadow || data.blur || data.backgroundBlur || data.filter;
-                stintSet$1(data, "__isFastShadow", shadow && !otherEffect && shadow.length < 2 && !shadow[0].spread && fill && !data.__isTransparentFill && !(isArray(fill) && fill.length > 1) && (this.useFastShadow || !stroke || stroke && data.strokeAlign === "inside"));
+                stintSet$1(data, "__isFastShadow", shadow && !otherEffect && shadow.length < 2 && !shadow[0].spread && !Effect.isTransformShadow(shadow[0]) && fill && !data.__isTransparentFill && !(isArray(fill) && fill.length > 1) && (this.useFastShadow || !stroke || stroke && data.strokeAlign === "inside"));
                 data.__useEffect = !!(shadow || otherEffect);
             }
             data.__checkSingle();
@@ -8346,7 +8376,9 @@ var LeaferUI = function(exports) {
                 } else if (attrName === "zIndex") {
                     this.canvas.zIndex = newValue;
                     setTimeout(() => this.parent && this.parent.__updateSortChildren());
-                }
+                } else if (attrName === "mode") this.emit(LeaferEvent.UPDATE_MODE, {
+                    mode: newValue
+                });
             }
             return super.__setAttr(attrName, newValue);
         }
@@ -8525,6 +8557,7 @@ var LeaferUI = function(exports) {
     exports.Leafer.list = new LeafList;
     __decorate([ dataProcessor(LeaferData) ], exports.Leafer.prototype, "__", void 0);
     __decorate([ boundsType() ], exports.Leafer.prototype, "pixelRatio", void 0);
+    __decorate([ dataType("normal") ], exports.Leafer.prototype, "mode", void 0);
     exports.Leafer = Leafer_1 = __decorate([ registerUI() ], exports.Leafer);
     exports.Rect = class Rect extends exports.UI {
         get __tag() {
@@ -8684,45 +8717,8 @@ var LeaferUI = function(exports) {
     __decorate([ pathType(0) ], exports.Ellipse.prototype, "startAngle", void 0);
     __decorate([ pathType(0) ], exports.Ellipse.prototype, "endAngle", void 0);
     exports.Ellipse = __decorate([ registerUI() ], exports.Ellipse);
-    const {moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1} = PathCommandDataHelper;
-    const {rotate: rotate$1, getAngle: getAngle$1, getDistance: getDistance$2, defaultPoint: defaultPoint} = PointHelper;
-    exports.Line = class Line extends exports.UI {
-        get __tag() {
-            return "Line";
-        }
-        get toPoint() {
-            const {width: width, rotation: rotation} = this.__;
-            const to = getPointData();
-            if (width) to.x = width;
-            if (rotation) rotate$1(to, rotation);
-            return to;
-        }
-        set toPoint(value) {
-            this.width = getDistance$2(defaultPoint, value);
-            this.rotation = getAngle$1(defaultPoint, value);
-            if (this.height) this.height = 0;
-        }
-        __updatePath() {
-            const data = this.__;
-            const path = data.path = [];
-            if (data.points) {
-                drawPoints$1(path, data.points, data.curve, data.closed);
-            } else {
-                moveTo$2(path, 0, 0);
-                lineTo$2(path, this.width, 0);
-            }
-        }
-    };
-    __decorate([ dataProcessor(LineData) ], exports.Line.prototype, "__", void 0);
-    __decorate([ affectStrokeBoundsType("center") ], exports.Line.prototype, "strokeAlign", void 0);
-    __decorate([ boundsType(0) ], exports.Line.prototype, "height", void 0);
-    __decorate([ pathType() ], exports.Line.prototype, "points", void 0);
-    __decorate([ pathType(0) ], exports.Line.prototype, "curve", void 0);
-    __decorate([ pathType(false) ], exports.Line.prototype, "closed", void 0);
-    exports.Line = __decorate([ registerUI() ], exports.Line);
     const {sin: sin$1, cos: cos$1, PI: PI$1} = Math;
-    const {moveTo: moveTo$1, lineTo: lineTo$1, closePath: closePath$1, drawPoints: drawPoints} = PathCommandDataHelper;
-    const line = exports.Line.prototype;
+    const {moveTo: moveTo$2, lineTo: lineTo$2, closePath: closePath$1, drawPoints: drawPoints$1} = PathCommandDataHelper;
     exports.Polygon = class Polygon extends exports.UI {
         get __tag() {
             return "Polygon";
@@ -8731,29 +8727,25 @@ var LeaferUI = function(exports) {
             const data = this.__;
             const path = data.path = [];
             if (data.points) {
-                drawPoints(path, data.points, data.curve, true);
+                drawPoints$1(path, data.points, data.curve, true);
             } else {
                 const {width: width, height: height, sides: sides} = data;
                 const rx = width / 2, ry = height / 2;
-                moveTo$1(path, rx, 0);
+                moveTo$2(path, rx, 0);
                 for (let i = 1; i < sides; i++) {
-                    lineTo$1(path, rx + rx * sin$1(i * 2 * PI$1 / sides), ry - ry * cos$1(i * 2 * PI$1 / sides));
+                    lineTo$2(path, rx + rx * sin$1(i * 2 * PI$1 / sides), ry - ry * cos$1(i * 2 * PI$1 / sides));
                 }
                 closePath$1(path);
             }
         }
-        __updateRenderPath() {}
-        __updateBoxBounds() {}
     };
     __decorate([ dataProcessor(PolygonData) ], exports.Polygon.prototype, "__", void 0);
     __decorate([ pathType(3) ], exports.Polygon.prototype, "sides", void 0);
     __decorate([ pathType() ], exports.Polygon.prototype, "points", void 0);
     __decorate([ pathType(0) ], exports.Polygon.prototype, "curve", void 0);
-    __decorate([ rewrite(line.__updateRenderPath) ], exports.Polygon.prototype, "__updateRenderPath", null);
-    __decorate([ rewrite(line.__updateBoxBounds) ], exports.Polygon.prototype, "__updateBoxBounds", null);
     exports.Polygon = __decorate([ rewriteAble(), registerUI() ], exports.Polygon);
     const {sin: sin, cos: cos, PI: PI} = Math;
-    const {moveTo: moveTo, lineTo: lineTo, closePath: closePath} = PathCommandDataHelper;
+    const {moveTo: moveTo$1, lineTo: lineTo$1, closePath: closePath} = PathCommandDataHelper;
     exports.Star = class Star extends exports.UI {
         get __tag() {
             return "Star";
@@ -8762,9 +8754,9 @@ var LeaferUI = function(exports) {
             const {width: width, height: height, corners: corners, innerRadius: innerRadius} = this.__;
             const rx = width / 2, ry = height / 2;
             const path = this.__.path = [];
-            moveTo(path, rx, 0);
+            moveTo$1(path, rx, 0);
             for (let i = 1; i < corners * 2; i++) {
-                lineTo(path, rx + (i % 2 === 0 ? rx : rx * innerRadius) * sin(i * PI / corners), ry - (i % 2 === 0 ? ry : ry * innerRadius) * cos(i * PI / corners));
+                lineTo$1(path, rx + (i % 2 === 0 ? rx : rx * innerRadius) * sin(i * PI / corners), ry - (i % 2 === 0 ? ry : ry * innerRadius) * cos(i * PI / corners));
             }
             closePath(path);
         }
@@ -8773,6 +8765,42 @@ var LeaferUI = function(exports) {
     __decorate([ pathType(5) ], exports.Star.prototype, "corners", void 0);
     __decorate([ pathType(.382) ], exports.Star.prototype, "innerRadius", void 0);
     exports.Star = __decorate([ registerUI() ], exports.Star);
+    const {moveTo: moveTo, lineTo: lineTo, drawPoints: drawPoints} = PathCommandDataHelper;
+    const {rotate: rotate$1, getAngle: getAngle$1, getDistance: getDistance$2, defaultPoint: defaultPoint} = PointHelper;
+    exports.Line = class Line extends exports.UI {
+        get __tag() {
+            return "Line";
+        }
+        get toPoint() {
+            const {width: width, rotation: rotation} = this.__;
+            const to = getPointData();
+            if (width) to.x = width;
+            if (rotation) rotate$1(to, rotation);
+            return to;
+        }
+        set toPoint(value) {
+            this.width = getDistance$2(defaultPoint, value);
+            this.rotation = getAngle$1(defaultPoint, value);
+            if (this.height) this.height = 0;
+        }
+        __updatePath() {
+            const data = this.__;
+            const path = data.path = [];
+            if (data.points) {
+                drawPoints(path, data.points, data.curve, data.closed);
+            } else {
+                moveTo(path, 0, 0);
+                lineTo(path, this.width, 0);
+            }
+        }
+    };
+    __decorate([ dataProcessor(LineData) ], exports.Line.prototype, "__", void 0);
+    __decorate([ affectStrokeBoundsType("center") ], exports.Line.prototype, "strokeAlign", void 0);
+    __decorate([ boundsType(0) ], exports.Line.prototype, "height", void 0);
+    __decorate([ pathType() ], exports.Line.prototype, "points", void 0);
+    __decorate([ pathType(0) ], exports.Line.prototype, "curve", void 0);
+    __decorate([ pathType(false) ], exports.Line.prototype, "closed", void 0);
+    exports.Line = __decorate([ registerUI() ], exports.Line);
     exports.Image = class Image extends exports.Rect {
         get __tag() {
             return "Image";
@@ -8905,10 +8933,6 @@ var LeaferUI = function(exports) {
             DataHelper.stintSet(this, "isOverflow", !includes(b, contentBounds));
             if (this.isOverflow) setList(data.__textBoxBounds = {}, [ b, contentBounds ]), layout.renderChanged = true; else data.__textBoxBounds = b;
         }
-        __onUpdateSize() {
-            if (this.__box) this.__box.__onUpdateSize();
-            super.__onUpdateSize();
-        }
         __updateRenderSpread() {
             let width = super.__updateRenderSpread();
             if (!width) width = this.isOverflow ? 1 : 0;
@@ -8919,6 +8943,11 @@ var LeaferUI = function(exports) {
             copyAndSpread(renderBounds, this.__.__textBoxBounds, renderSpread);
             if (this.__box) this.__box.__layout.renderBounds = renderBounds;
         }
+        __updateChange() {
+            super.__updateChange();
+            const box = this.__box;
+            if (box) box.__onUpdateSize(), box.__updateChange();
+        }
         __drawRenderPath(canvas) {
             canvas.font = this.__.__font;
         }
@@ -10323,10 +10352,10 @@ var LeaferUI = function(exports) {
     };
     const PointerEventHelper = {
         convert(e, local) {
-            const base = InteractionHelper.getBase(e);
+            const base = InteractionHelper.getBase(e), {x: x, y: y} = local;
             const data = Object.assign(Object.assign({}, base), {
-                x: local.x,
-                y: local.y,
+                x: x,
+                y: y,
                 width: e.width,
                 height: e.height,
                 pointerType: e.pointerType,
@@ -10341,10 +10370,10 @@ var LeaferUI = function(exports) {
             return data;
         },
         convertMouse(e, local) {
-            const base = InteractionHelper.getBase(e);
+            const base = InteractionHelper.getBase(e), {x: x, y: y} = local;
             return Object.assign(Object.assign({}, base), {
-                x: local.x,
-                y: local.y,
+                x: x,
+                y: y,
                 width: 1,
                 height: 1,
                 pointerType: "mouse",
@@ -10353,10 +10382,10 @@ var LeaferUI = function(exports) {
         },
         convertTouch(e, local) {
             const touch = PointerEventHelper.getTouch(e);
-            const base = InteractionHelper.getBase(e);
+            const base = InteractionHelper.getBase(e), {x: x, y: y} = local;
             return Object.assign(Object.assign({}, base), {
-                x: local.x,
-                y: local.y,
+                x: x,
+                y: y,
                 width: 1,
                 height: 1,
                 pointerType: "touch",
@@ -11494,11 +11523,16 @@ var LeaferUI = function(exports) {
                 }
                 worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, "destination-out") : other.copyWorld(shape.canvas, shapeBounds, bounds, "destination-out");
             }
-            LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
+            if (Effect.isTransformShadow(item)) Effect.renderTransformShadow(ui, current, other, copyBounds, item); else LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
             if (end && index < end) other.clearWorld(copyBounds);
         });
         other.recycle(copyBounds);
     }
+    function getShadowSpread(_ui, shadow) {
+        let width = 0;
+        shadow.forEach(item => width = Math.max(width, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread > 0 ? item.spread : 0) + item.blur * 1.5));
+        return width;
+    }
     function drawWorldShadow(canvas, outBounds, spreadScale, shape) {
         const {bounds: bounds, shapeBounds: shapeBounds} = shape;
         if (Platform.fullImageShadow) {
@@ -11570,7 +11604,11 @@ var LeaferUI = function(exports) {
         shadow: shadow,
         innerShadow: innerShadow,
         blur: blur,
-        backgroundBlur: backgroundBlur
+        backgroundBlur: backgroundBlur,
+        getShadowSpread: getShadowSpread,
+        isTransformShadow(_shadow) {
+            return undefined;
+        }
     };
     const {excludeRenderBounds: excludeRenderBounds} = LeafBoundsHelper;
     let usedGrayscaleAlpha;
@@ -12026,16 +12064,17 @@ var LeaferUI = function(exports) {
         row.data = null;
     }
     function decorationText(drawData, style) {
-        let type;
+        let type, offset = 0;
         const {fontSize: fontSize, textDecoration: textDecoration} = style;
         drawData.decorationHeight = fontSize / 11;
         if (isObject(textDecoration)) {
             type = textDecoration.type;
             if (textDecoration.color) drawData.decorationColor = ColorConvert.string(textDecoration.color);
+            if (textDecoration.offset) offset = Math.min(fontSize * .3, Math.max(textDecoration.offset, -fontSize * .15));
         } else type = textDecoration;
         switch (type) {
           case "under":
-            drawData.decorationY = [ fontSize * .15 ];
+            drawData.decorationY = [ fontSize * .15 + offset ];
             break;
 
           case "delete":
@@ -12043,7 +12082,7 @@ var LeaferUI = function(exports) {
             break;
 
           case "under-delete":
-            drawData.decorationY = [ fontSize * .15, -fontSize * .35 ];
+            drawData.decorationY = [ fontSize * .15 + offset, -fontSize * .35 ];
         }
     }
     const {top: top, right: right, bottom: bottom, left: left} = exports.Direction4;