leafer-ui 1.9.5 → 1.9.7

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()), {
@@ -392,6 +392,15 @@ var LeaferUI = function(exports) {
             t.c *= scaleY;
             t.d *= scaleY;
         },
+        pixelScale(t, pixelRatio, to) {
+            to || (to = t);
+            to.a = t.a * pixelRatio;
+            to.b = t.b * pixelRatio;
+            to.c = t.c * pixelRatio;
+            to.d = t.d * pixelRatio;
+            to.e = t.e * pixelRatio;
+            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);
@@ -583,12 +592,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;
@@ -882,6 +891,10 @@ var LeaferUI = function(exports) {
             this.scaleY *= y || x;
             return this;
         }
+        pixelScale(pixelRatio) {
+            MatrixHelper.pixelScale(this, pixelRatio);
+            return this;
+        }
         scaleOfOuter(origin, x, y) {
             MatrixHelper.scaleOfOuter(this, origin, x, y);
             return this;
@@ -1085,7 +1098,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 +1275,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;
@@ -1991,7 +2004,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} = MatrixHelper, {round: round$1} = Math, tempPixelBounds = new Bounds, tempPixelBounds2 = new Bounds;
+    const {copy: copy$8, multiplyParent: multiplyParent$4, pixelScale: pixelScale} = MatrixHelper, {round: round$1} = Math, tempPixelBounds = new Bounds, tempPixelBounds2 = new Bounds;
     const minSize = {
         width: 1,
         height: 1,
@@ -2089,12 +2102,7 @@ var LeaferUI = function(exports) {
         setWorld(matrix, parentMatrix) {
             const {pixelRatio: pixelRatio, pixelSnap: pixelSnap} = this, w = this.worldTransform;
             if (parentMatrix) multiplyParent$4(matrix, parentMatrix, w);
-            w.a = matrix.a * pixelRatio;
-            w.b = matrix.b * pixelRatio;
-            w.c = matrix.c * pixelRatio;
-            w.d = matrix.d * pixelRatio;
-            w.e = matrix.e * pixelRatio;
-            w.f = matrix.f * pixelRatio;
+            pixelScale(matrix, pixelRatio, w);
             if (pixelSnap) {
                 if (matrix.half && matrix.half * pixelRatio % 2) w.e = round$1(w.e - .5) + .5, w.f = round$1(w.f - .5) + .5; else w.e = round$1(w.e), 
                 w.f = round$1(w.f);
@@ -4008,6 +4016,17 @@ var LeaferUI = function(exports) {
             }
         }));
     }
+    function dimType(defaultValue) {
+        return decorateLeafAttr(defaultValue, key => attr({
+            set(value) {
+                if (this.__setAttr(key, value)) {
+                    const data = this.__;
+                    DataHelper.stintSet(data, "__useDim", data.dim || data.bright || data.dimskip);
+                    this.__layout.surfaceChange();
+                }
+            }
+        }));
+    }
     function opacityType(defaultValue) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
@@ -4048,7 +4067,7 @@ var LeaferUI = function(exports) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
                 if (this.__setAttr(key, value)) {
-                    this.__layout.surfaceChanged || this.__layout.surfaceChange();
+                    this.__layout.surfaceChange();
                     this.waitParent(() => {
                         this.parent.__layout.childrenSortChange();
                     });
@@ -4082,7 +4101,7 @@ var LeaferUI = function(exports) {
             set(value) {
                 if (this.__setAttr(key, value)) {
                     this.__layout.hitCanvasChanged = true;
-                    if (Debug.showBounds === "hit") this.__layout.surfaceChanged || this.__layout.surfaceChange();
+                    if (Debug.showBounds === "hit") this.__layout.surfaceChange();
                     if (this.leafer) this.leafer.updateCursor();
                 }
             }
@@ -5105,6 +5124,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";
@@ -5479,6 +5499,7 @@ var LeaferUI = function(exports) {
             if (options.shape) return this.__renderShape(canvas, options);
             if (this.__worldOpacity) {
                 const data = this.__;
+                if (data.bright && !options.topRendering) return options.topList.add(this);
                 canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
                 canvas.opacity = options.dimOpacity && !data.dimskip ? data.opacity * options.dimOpacity : data.opacity;
                 if (this.__.__single) {
@@ -5525,7 +5546,9 @@ var LeaferUI = function(exports) {
             this.__nowWorld = this.__getNowWorld(options);
             if (this.__worldOpacity) {
                 const data = this.__;
-                if (data.dim) options.dimOpacity = data.dim === true ? .2 : data.dim; else if (data.dimskip) options.dimOpacity && (options.dimOpacity = 0);
+                if (data.__useDim) {
+                    if (data.dim) options.dimOpacity = data.dim === true ? .2 : data.dim; else if (data.bright && !options.topRendering) return options.topList.add(this); else if (data.dimskip) options.dimOpacity && (options.dimOpacity = 0);
+                }
                 if (data.__single && !this.isBranchLeaf) {
                     if (data.eraser === "path") return this.__renderEraser(canvas, options);
                     const tempCanvas = canvas.getSameCanvas(false, true);
@@ -6350,7 +6373,7 @@ var LeaferUI = function(exports) {
             this.levelMap = null;
         }
     }
-    const version = "1.9.5";
+    const version = "1.9.7";
     const debug$5 = Debug.get("LeaferCanvas");
     class LeaferCanvas extends LeaferCanvasBase {
         set zIndex(zIndex) {
@@ -7083,7 +7106,7 @@ var LeaferUI = function(exports) {
             };
             if (this.needFill) canvas.fillWorld(bounds, this.config.fill);
             if (Debug.showRepaint) Debug.drawRepaint(canvas, bounds);
-            this.target.__render(canvas, options);
+            Platform.render(this.target, canvas, options);
             this.renderBounds = realBounds = realBounds || bounds;
             this.renderOptions = options;
             this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
@@ -7252,7 +7275,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;
         }
@@ -7352,6 +7375,14 @@ var LeaferUI = function(exports) {
         selector: (target, options) => new Selector(target, options)
     });
     Platform.layout = Layouter.fullLayout;
+    Platform.render = function(target, canvas, options) {
+        const topOptions = Object.assign(Object.assign({}, options), {
+            topRendering: true
+        });
+        options.topList = new LeafList;
+        target.__render(canvas, options);
+        if (options.topList.length) options.topList.forEach(item => item.__render(canvas, topOptions));
+    };
     function effectType(defaultValue) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
@@ -7670,8 +7701,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 +7767,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 +7779,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 +7854,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();
@@ -8040,8 +8100,8 @@ var LeaferUI = function(exports) {
     __decorate([ opacityType(1) ], exports.UI.prototype, "opacity", void 0);
     __decorate([ visibleType(true) ], exports.UI.prototype, "visible", void 0);
     __decorate([ surfaceType(false) ], exports.UI.prototype, "locked", void 0);
-    __decorate([ surfaceType(false) ], exports.UI.prototype, "dim", void 0);
-    __decorate([ surfaceType(false) ], exports.UI.prototype, "dimskip", void 0);
+    __decorate([ dimType(false) ], exports.UI.prototype, "dim", void 0);
+    __decorate([ dimType(false) ], exports.UI.prototype, "dimskip", void 0);
     __decorate([ sortType(0) ], exports.UI.prototype, "zIndex", void 0);
     __decorate([ maskType(false) ], exports.UI.prototype, "mask", void 0);
     __decorate([ eraserType(false) ], exports.UI.prototype, "eraser", void 0);
@@ -8346,7 +8406,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 +8587,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 +8747,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 +8757,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 +8784,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 +8795,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 +8963,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 +8973,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 +10382,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 +10400,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 +10412,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 +11553,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 +11634,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 +12094,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 +12112,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;
@@ -12267,6 +12336,7 @@ var LeaferUI = function(exports) {
     exports.defineDataProcessor = defineDataProcessor;
     exports.defineKey = defineKey;
     exports.defineLeafAttr = defineLeafAttr;
+    exports.dimType = dimType;
     exports.doBoundsType = doBoundsType;
     exports.doStrokeType = doStrokeType;
     exports.effectType = effectType;