leafer-ui 2.1.10 → 2.2.0

package/dist/web.module.js

@@ -856,6 +856,11 @@ const PointHelper = {
     toOuterOf(t, matrix, to) {
         toOuterPoint$3(matrix, t, to);
     },
+    toVertical(t, rotation, verticalDistance, to) {
+        const r = rotation * OneRadian;
+        t.x += -Math.sin(r) * verticalDistance;
+        t.y += Math.cos(r) * verticalDistance;
+    },
     getCenter(t, to) {
         return {
             x: t.x + (to.x - t.x) / 2,
@@ -1295,7 +1300,6 @@ const BoundsHelper = {
     },
     copyAndSpread(t, bounds, spread, isShrink, side) {
         const {x: x, y: y, width: width, height: height} = bounds;
-        if (!spread) spread = 0;
         if (isArray(spread)) {
             const four = fourNumber(spread);
             isShrink ? B.set(t, x + four[3], y + four[0], width - four[1] - four[3], height - four[2] - four[0]) : B.set(t, x - four[3], y - four[0], width + four[1] + four[3], height + four[2] + four[0]);
@@ -3577,7 +3581,8 @@ const PathDrawer = {
                 return;
             }
         }
-    }
+    },
+    drawPathByPoints(_drawer, _points, _closed) {}
 };
 
 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;
@@ -6985,7 +6990,7 @@ class LeafLevelList {
     }
 }
 
-const version = "2.1.10";
+const version = "2.2.0";
 
 const debug$5 = Debug.get("LeaferCanvas");
 
@@ -8723,8 +8728,9 @@ let UI = UI_1 = class UI extends Leaf {
         this.__drawPathByData(canvas, data.__pathForRender);
     }
     __drawPath(canvas) {
+        const data = this.__;
         canvas.beginPath();
-        this.__drawPathByData(canvas, this.__.path, true);
+        data.__usePointsMode ? PathDrawer.drawPathByPoints(canvas, data.points, data.closed) : this.__drawPathByData(canvas, data.path, true);
     }
     __drawPathByData(drawer, data, ignoreCornerRadius) {
         data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer, ignoreCornerRadius);
@@ -9581,6 +9587,9 @@ let Polygon = class Polygon extends UI {
     get __tag() {
         return "Polygon";
     }
+    get isPointsMode() {
+        return this.points && !this.pathInputed;
+    }
     __updatePath() {
         const data = this.__;
         const path = data.path = [];
@@ -9658,6 +9667,9 @@ let Line = class Line extends UI {
     get __tag() {
         return "Line";
     }
+    get isPointsMode() {
+        return this.points && !this.pathInputed;
+    }
     get toPoint() {
         const {width: width, rotation: rotation} = this.__;
         const to = getPointData();
@@ -9816,7 +9828,7 @@ let Text = class Text extends UI {
         data.__font = `${italic ? "italic " : ""}${textCase === "small-caps" ? "small-caps " : ""}${fontWeight !== "normal" ? fontWeight + " " : ""}${fontSize || 12}px ${fontFamily || "caption"}`;
         stintSet$1(data, "__padding", padding && MathHelper.fourNumber(padding));
         stintSet$1(data, "__clipText", textOverflow !== "show" && !data.__autoSize);
-        stintSet$1(data, "__isCharMode", width || height || data.__letterSpacing || textCase !== "none");
+        stintSet$1(data, "__isCharMode", width || height || data.__letterSpacing || data.motionText || textCase !== "none");
         data.__textDrawData = TextConvert.getDrawData((data.__isPlacehold = data.placeholder && data.text === "") ? data.placeholder : data.text, this.__);
     }
     __updateBoxBounds() {
@@ -9841,7 +9853,7 @@ let Text = class Text extends UI {
             this.__updateNaturalSize();
         } else super.__updateBoxBounds();
         if (italic) b.width += fontSize * .16;
-        DataHelper.stintSet(this, "isOverflow", !includes(b, contentBounds));
+        DataHelper.stintSet(this, "isOverflow", !includes(b, contentBounds) && !data.motionText);
         if (this.isOverflow) setList(data.__textBoxBounds = {}, [ b, contentBounds ]), layout.renderChanged = true; else data.__textBoxBounds = b;
     }
     __updateRenderSpread() {
@@ -11444,8 +11456,10 @@ ui$1.__hit = function(inner, forceHitFill) {
     if (!needHitFillPath && !needHitStrokePath) return false;
     const radiusWidth = inner.radiusX * 2;
     let hitWidth = radiusWidth;
+    let {strokeAlign: strokeAlign} = data;
+    if (data.motionText) hitWidth += data.fontSize / 2, strokeAlign = "center";
     if (needHitStrokePath) {
-        switch (data.strokeAlign) {
+        switch (strokeAlign) {
           case "inside":
             hitWidth += strokeWidth * 2;
             if (!needHitFillPath && this.__hitFill(inner) && this.__hitStroke(inner, hitWidth)) return true;
@@ -11479,9 +11493,9 @@ rect.__hitFill = box$1.__hitFill = function(inner) {
 };
 
 Text.prototype.__drawHitPath = function(canvas) {
-    const {__lineHeight: __lineHeight, fontSize: fontSize, __baseLine: __baseLine, __letterSpacing: __letterSpacing, __textDrawData: data} = this.__;
+    const data = this.__, {__lineHeight: __lineHeight, fontSize: fontSize, __baseLine: __baseLine, __letterSpacing: __letterSpacing, __textDrawData: drawData} = data;
     canvas.beginPath();
-    if (__letterSpacing < 0) this.__drawPathByBox(canvas); else data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
+    if (data.motionText) this.__drawPathByData(canvas, data.__pathForMotionText); else if (__letterSpacing < 0) this.__drawPathByBox(canvas); else drawData.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
 };
 
 Group.prototype.pick = function(hitPoint, options) {
@@ -11841,8 +11855,7 @@ class Interaction extends InteractionBase {
     destroy() {
         if (this.view) {
             super.destroy();
-            this.view = null;
-            this.touches = null;
+            this.view = this.touches = null;
         }
     }
 }
@@ -11889,7 +11902,8 @@ function fillPathOrText(ui, canvas, renderOptions) {
     ui.__.__font ? Paint.fillText(ui, canvas, renderOptions) : ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill();
 }
 
-function fillText(ui, canvas, _renderOptions) {
+function fillText(ui, canvas, renderOptions) {
+    if (ui.motionText) return Paint.fillMotionText(ui, canvas, renderOptions);
     const data = ui.__, {rows: rows, decorationY: decorationY} = data.__textDrawData;
     if (data.__isPlacehold && data.placeholderColor) canvas.fillStyle = data.placeholderColor;
     let row;
@@ -13251,7 +13265,8 @@ const TextMode = 2;
 
 function layoutChar(drawData, style, width, _height) {
     const {rows: rows} = drawData;
-    const {textAlign: textAlign, paraIndent: paraIndent, __letterSpacing: __letterSpacing} = style;
+    const {textAlign: textAlign, paraIndent: paraIndent} = style;
+    const useLetter = style.__letterSpacing || style.motionText;
     const justifyLast = width && textAlign.includes("both");
     const justify = justifyLast || width && textAlign.includes("justify");
     const justifyLetter = justify && textAlign.includes("letter");
@@ -13264,8 +13279,8 @@ function layoutChar(drawData, style, width, _height) {
                 remainingWidth = width - row.width - indentWidth;
                 if (justifyLetter) addLetterWidth = remainingWidth / (row.words.reduce((total, item) => total + item.data.length, 0) - 1); else addWordWidth = wordsLength > 1 ? remainingWidth / (wordsLength - 1) : 0;
             }
-            mode = __letterSpacing || row.isOverflow || justifyLetter ? CharMode : addWordWidth ? WordMode : TextMode;
-            if (row.isOverflow && !__letterSpacing) row.textMode = true;
+            mode = useLetter || row.isOverflow || justifyLetter ? CharMode : addWordWidth ? WordMode : TextMode;
+            if (row.isOverflow && !useLetter) row.textMode = true;
             if (mode === TextMode) {
                 row.x += indentWidth;
                 toTextChar$1(row);
@@ -13466,6 +13481,7 @@ function getDrawData(content, style) {
     let width = style.__getInput("width") || 0;
     let height = style.__getInput("height") || 0;
     const {__padding: padding} = style;
+    if (style.motionText) width = height = 0;
     if (padding) {
         if (width) x = padding[left], width -= padding[right] + padding[left], !width && (width = .01); else if (!style.autoSizeAlign) x = padding[left];
         if (height) y = padding[top], height -= padding[top] + padding[bottom], !height && (height = .01); else if (!style.autoSizeAlign) y = padding[top];