leafer-draw 1.3.2 → 1.4.0

package/dist/web.module.js

@@ -1533,10 +1533,10 @@ const DataHelper = {
         Object.keys(merge).forEach(key => {
             var _a, _b;
             value = merge[key];
-            if ((value === null || value === void 0 ? void 0 : value.constructor) === Object && ((_a = t[key]) === null || _a === void 0 ? void 0 : _a.constructor) === Object)
+            if ((value === null || value === undefined ? undefined : value.constructor) === Object && ((_a = t[key]) === null || _a === undefined ? undefined : _a.constructor) === Object)
                 return assign(t[key], merge[key], exclude && exclude[key]);
             if (exclude && (key in exclude)) {
-                if (((_b = exclude[key]) === null || _b === void 0 ? void 0 : _b.constructor) === Object)
+                if (((_b = exclude[key]) === null || _b === undefined ? undefined : _b.constructor) === Object)
                     assign(t[key] = {}, merge[key], exclude[key]);
                 return;
             }
@@ -1705,7 +1705,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
 
 
 function __decorate(decorators, target, key, desc) {
@@ -1773,7 +1773,7 @@ let Canvas$1 = class Canvas {
     }
     setTransform(_a, _b, _c, _d, _e, _f) { }
     resetTransform() { }
-    getTransform() { return void 0; }
+    getTransform() { return undefined; }
     save() { }
     restore() { }
     transform(a, b, c, d, e, f) {
@@ -1830,12 +1830,12 @@ let Canvas$1 = class Canvas {
     ellipse(_x, _y, _radiusX, _radiusY, _rotation, _startAngle, _endAngle, _anticlockwise) { }
     rect(_x, _y, _width, _height) { }
     roundRect(_x, _y, _width, _height, _radius) { }
-    createConicGradient(_startAngle, _x, _y) { return void 0; }
-    createLinearGradient(_x0, _y0, _x1, _y1) { return void 0; }
-    createPattern(_image, _repetition) { return void 0; }
-    createRadialGradient(_x0, _y0, _r0, _x1, _y1, _r1) { return void 0; }
+    createConicGradient(_startAngle, _x, _y) { return undefined; }
+    createLinearGradient(_x0, _y0, _x1, _y1) { return undefined; }
+    createPattern(_image, _repetition) { return undefined; }
+    createRadialGradient(_x0, _y0, _r0, _x1, _y1, _r1) { return undefined; }
     fillText(_text, _x, _y, _maxWidth) { }
-    measureText(_text) { return void 0; }
+    measureText(_text) { return undefined; }
     strokeText(_text, _x, _y, _maxWidth) { }
     destroy() {
         this.context = null;
@@ -1843,79 +1843,79 @@ let Canvas$1 = class Canvas {
 };
 __decorate([
     contextAttr('imageSmoothingEnabled')
-], Canvas$1.prototype, "smooth", void 0);
+], Canvas$1.prototype, "smooth", undefined);
 __decorate([
     contextAttr('imageSmoothingQuality')
-], Canvas$1.prototype, "smoothLevel", void 0);
+], Canvas$1.prototype, "smoothLevel", undefined);
 __decorate([
     contextAttr('globalAlpha')
-], Canvas$1.prototype, "opacity", void 0);
+], Canvas$1.prototype, "opacity", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "fillStyle", void 0);
+], Canvas$1.prototype, "fillStyle", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "strokeStyle", void 0);
+], Canvas$1.prototype, "strokeStyle", undefined);
 __decorate([
     contextAttr('lineWidth')
-], Canvas$1.prototype, "strokeWidth", void 0);
+], Canvas$1.prototype, "strokeWidth", undefined);
 __decorate([
     contextAttr('lineCap')
-], Canvas$1.prototype, "strokeCap", void 0);
+], Canvas$1.prototype, "strokeCap", undefined);
 __decorate([
     contextAttr('lineJoin')
-], Canvas$1.prototype, "strokeJoin", void 0);
+], Canvas$1.prototype, "strokeJoin", undefined);
 __decorate([
     contextAttr('lineDashOffset')
-], Canvas$1.prototype, "dashOffset", void 0);
+], Canvas$1.prototype, "dashOffset", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "miterLimit", void 0);
+], Canvas$1.prototype, "miterLimit", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "shadowBlur", void 0);
+], Canvas$1.prototype, "shadowBlur", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "shadowColor", void 0);
+], Canvas$1.prototype, "shadowColor", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "shadowOffsetX", void 0);
+], Canvas$1.prototype, "shadowOffsetX", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "shadowOffsetY", void 0);
+], Canvas$1.prototype, "shadowOffsetY", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "filter", void 0);
+], Canvas$1.prototype, "filter", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "font", void 0);
+], Canvas$1.prototype, "font", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "fontKerning", void 0);
+], Canvas$1.prototype, "fontKerning", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "fontStretch", void 0);
+], Canvas$1.prototype, "fontStretch", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "fontVariantCaps", void 0);
+], Canvas$1.prototype, "fontVariantCaps", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "textAlign", void 0);
+], Canvas$1.prototype, "textAlign", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "textBaseline", void 0);
+], Canvas$1.prototype, "textBaseline", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "textRendering", void 0);
+], Canvas$1.prototype, "textRendering", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "wordSpacing", void 0);
+], Canvas$1.prototype, "wordSpacing", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "letterSpacing", void 0);
+], Canvas$1.prototype, "letterSpacing", undefined);
 __decorate([
     contextAttr()
-], Canvas$1.prototype, "direction", void 0);
+], Canvas$1.prototype, "direction", undefined);
 __decorate([
     contextMethod()
 ], Canvas$1.prototype, "setTransform", null);
@@ -3384,7 +3384,7 @@ class TaskItem {
         this.task = task;
     }
     run() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter(this, undefined, undefined, function* () {
             try {
                 if (this.task && !this.isComplete && this.parent.running)
                     yield this.task();
@@ -3696,7 +3696,7 @@ class LeaferImage {
     load(onSuccess, onError) {
         if (!this.loading) {
             this.loading = true;
-            ImageManager.tasker.add(() => __awaiter(this, void 0, void 0, function* () {
+            ImageManager.tasker.add(() => __awaiter(this, undefined, undefined, function* () {
                 return yield Platform.origin.loadImage(this.url).then((img) => {
                     this.ready = true;
                     this.width = img.naturalWidth || img.width;
@@ -3821,10 +3821,10 @@ function autoLayoutType(defaultValue) {
     return decorateLeafAttr(defaultValue, (key) => attr({
         set(value) {
             if (this.__setAttr(key, value)) {
-                this.__layout.matrixChanged || this.__layout.matrixChange();
                 this.__hasAutoLayout = !!(this.origin || this.around || this.flow);
                 if (!this.__local)
                     this.__layout.createLocal();
+                doBoundsType(this);
             }
         }
     }));
@@ -4207,55 +4207,62 @@ const LeafHelper = {
         y += t.y;
         transition ? t.animate({ x, y }, transition) : (t.x = x, t.y = y);
     },
-    zoomOfWorld(t, origin, scaleX, scaleY, resize) {
-        L.zoomOfLocal(t, getTempLocal(t, origin), scaleX, scaleY, resize);
+    zoomOfWorld(t, origin, scaleX, scaleY, resize, transition) {
+        L.zoomOfLocal(t, getTempLocal(t, origin), scaleX, scaleY, resize, transition);
     },
-    zoomOfLocal(t, origin, scaleX, scaleY = scaleX, resize) {
-        copy$6(matrix, t.__localMatrix);
+    zoomOfLocal(t, origin, scaleX, scaleY = scaleX, resize, transition) {
+        const o = t.__localMatrix;
+        if (typeof scaleY !== 'number') {
+            if (scaleY)
+                transition = scaleY;
+            scaleY = scaleX;
+        }
+        copy$6(matrix, o);
         scaleOfOuter$2(matrix, origin, scaleX, scaleY);
         if (t.origin || t.around) {
-            L.setTransform(t, matrix, resize);
+            L.setTransform(t, matrix, resize, transition);
         }
         else {
-            moveByMatrix(t, matrix);
-            t.scaleResize(scaleX, scaleY, resize !== true);
+            const x = t.x + matrix.e - o.e, y = t.y + matrix.f - o.f;
+            if (transition && !resize)
+                t.animate({ x, y, scaleX: t.scaleX * scaleX, scaleY: t.scaleY * scaleY }, transition);
+            else
+                t.x = x, t.y = y, t.scaleResize(scaleX, scaleY, resize !== true);
         }
     },
-    rotateOfWorld(t, origin, angle) {
-        L.rotateOfLocal(t, getTempLocal(t, origin), angle);
+    rotateOfWorld(t, origin, angle, transition) {
+        L.rotateOfLocal(t, getTempLocal(t, origin), angle, transition);
     },
-    rotateOfLocal(t, origin, angle) {
-        copy$6(matrix, t.__localMatrix);
+    rotateOfLocal(t, origin, angle, transition) {
+        const o = t.__localMatrix;
+        copy$6(matrix, o);
         rotateOfOuter$2(matrix, origin, angle);
-        if (t.origin || t.around) {
-            L.setTransform(t, matrix);
-        }
-        else {
-            moveByMatrix(t, matrix);
-            t.rotation = MathHelper.formatRotation(t.rotation + angle);
-        }
+        if (t.origin || t.around)
+            L.setTransform(t, matrix, false, transition);
+        else
+            t.set({ x: t.x + matrix.e - o.e, y: t.y + matrix.f - o.f, rotation: MathHelper.formatRotation(t.rotation + angle) }, transition);
     },
-    skewOfWorld(t, origin, skewX, skewY, resize) {
-        L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize);
+    skewOfWorld(t, origin, skewX, skewY, resize, transition) {
+        L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize, transition);
     },
-    skewOfLocal(t, origin, skewX, skewY = 0, resize) {
+    skewOfLocal(t, origin, skewX, skewY = 0, resize, transition) {
         copy$6(matrix, t.__localMatrix);
         skewOfOuter(matrix, origin, skewX, skewY);
-        L.setTransform(t, matrix, resize);
+        L.setTransform(t, matrix, resize, transition);
     },
-    transformWorld(t, transform, resize) {
+    transformWorld(t, transform, resize, transition) {
         copy$6(matrix, t.worldTransform);
         multiplyParent$2(matrix, transform);
         if (t.parent)
             divideParent(matrix, t.parent.worldTransform);
-        L.setTransform(t, matrix, resize);
+        L.setTransform(t, matrix, resize, transition);
     },
-    transform(t, transform, resize) {
+    transform(t, transform, resize, transition) {
         copy$6(matrix, t.localTransform);
         multiplyParent$2(matrix, transform);
-        L.setTransform(t, matrix, resize);
+        L.setTransform(t, matrix, resize, transition);
     },
-    setTransform(t, transform, resize) {
+    setTransform(t, transform, resize, transition) {
         const data = t.__, originPoint = data.origin && L.getInnerOrigin(t, data.origin);
         const layout = getLayout(transform, originPoint, data.around && L.getInnerOrigin(t, data.around));
         if (resize) {
@@ -4270,7 +4277,7 @@ const LeafHelper = {
             t.scaleResize(scaleX, scaleY, false);
         }
         else
-            t.set(layout);
+            t.set(layout, transition);
     },
     getFlipTransform(t, axis) {
         const m = getMatrixData();
@@ -4307,11 +4314,6 @@ const LeafHelper = {
 };
 const L = LeafHelper;
 const { updateAllMatrix: updateAllMatrix$3, updateMatrix: updateMatrix$2, updateAllWorldOpacity: updateAllWorldOpacity$1, updateAllChange: updateAllChange$1 } = L;
-function moveByMatrix(t, matrix) {
-    const { e, f } = t.__localMatrix;
-    t.x += matrix.e - e;
-    t.y += matrix.f - f;
-}
 function getTempLocal(t, world) {
     t.__layout.update();
     return t.parent ? PointHelper.tempToInnerOf(world, t.parent.__world) : world;
@@ -5175,8 +5177,7 @@ const LeafBounds = {
     __updateAutoLayout() {
         this.__layout.matrixChanged = true;
         if (this.isBranch) {
-            if (this.leaferIsReady)
-                this.leafer.layouter.addExtra(this);
+            this.__extraUpdate();
             if (this.__.flow) {
                 if (this.__layout.boxChanged)
                     this.__updateFlowLayout();
@@ -5329,7 +5330,7 @@ let Leaf = class Leaf {
     get __worldFlipped() { return this.__world.scaleX < 0 || this.__world.scaleY < 0; }
     get __onlyHitMask() { return this.__hasMask && !this.__.hitChildren; }
     get __ignoreHitWorld() { return (this.__hasMask || this.__hasEraser) && this.__.hitChildren; }
-    get __inLazyBounds() { const { leafer } = this; return leafer && leafer.created && leafer.lazyBounds.hit(this.__world); }
+    get __inLazyBounds() { return this.leaferIsCreated && this.leafer.lazyBounds.hit(this.__world); }
     get pathInputed() { return this.__.__pathInputed; }
     set event(map) { this.on(map); }
     constructor(data) {
@@ -5440,6 +5441,10 @@ let Leaf = class Leaf {
     forceRender(_bounds, _sync) {
         this.forceUpdate('surface');
     }
+    __extraUpdate() {
+        if (this.leaferIsReady)
+            this.leafer.layouter.addExtra(this);
+    }
     __updateWorldMatrix() { }
     __updateLocalMatrix() { }
     __updateWorldBounds() { }
@@ -5582,11 +5587,11 @@ let Leaf = class Leaf {
         const layer = this.leafer ? this.leafer.zoomLayer : this;
         return layer.getWorldPoint(page, relative, distance, change);
     }
-    setTransform(matrix, resize) {
-        setTransform(this, matrix, resize);
+    setTransform(matrix, resize, transition) {
+        setTransform(this, matrix, resize, transition);
     }
-    transform(matrix, resize) {
-        transform(this, matrix, resize);
+    transform(matrix, resize, transition) {
+        transform(this, matrix, resize, transition);
     }
     move(x, y, transition) {
         moveLocal(this, x, y, transition);
@@ -5594,32 +5599,32 @@ let Leaf = class Leaf {
     moveInner(x, y, transition) {
         moveWorld(this, x, y, true, transition);
     }
-    scaleOf(origin, scaleX, scaleY, resize) {
-        zoomOfLocal(this, getLocalOrigin(this, origin), scaleX, scaleY, resize);
+    scaleOf(origin, scaleX, scaleY, resize, transition) {
+        zoomOfLocal(this, getLocalOrigin(this, origin), scaleX, scaleY, resize, transition);
     }
-    rotateOf(origin, rotation) {
-        rotateOfLocal(this, getLocalOrigin(this, origin), rotation);
+    rotateOf(origin, rotation, transition) {
+        rotateOfLocal(this, getLocalOrigin(this, origin), rotation, transition);
     }
-    skewOf(origin, skewX, skewY, resize) {
-        skewOfLocal(this, getLocalOrigin(this, origin), skewX, skewY, resize);
+    skewOf(origin, skewX, skewY, resize, transition) {
+        skewOfLocal(this, getLocalOrigin(this, origin), skewX, skewY, resize, transition);
     }
-    transformWorld(worldTransform, resize) {
-        transformWorld(this, worldTransform, resize);
+    transformWorld(worldTransform, resize, transition) {
+        transformWorld(this, worldTransform, resize, transition);
     }
     moveWorld(x, y, transition) {
         moveWorld(this, x, y, false, transition);
     }
-    scaleOfWorld(worldOrigin, scaleX, scaleY, resize) {
-        zoomOfWorld(this, worldOrigin, scaleX, scaleY, resize);
+    scaleOfWorld(worldOrigin, scaleX, scaleY, resize, transition) {
+        zoomOfWorld(this, worldOrigin, scaleX, scaleY, resize, transition);
     }
     rotateOfWorld(worldOrigin, rotation) {
         rotateOfWorld(this, worldOrigin, rotation);
     }
-    skewOfWorld(worldOrigin, skewX, skewY, resize) {
-        skewOfWorld(this, worldOrigin, skewX, skewY, resize);
+    skewOfWorld(worldOrigin, skewX, skewY, resize, transition) {
+        skewOfWorld(this, worldOrigin, skewX, skewY, resize, transition);
     }
-    flip(axis) {
-        transform(this, getFlipTransform(this, axis));
+    flip(axis, transition) {
+        transform(this, getFlipTransform(this, axis), false, transition);
     }
     scaleResize(scaleX, scaleY = scaleX, _noResize) {
         this.scaleX *= scaleX;
@@ -6007,7 +6012,7 @@ class LeafLevelList {
     }
 }
 
-const version = "1.3.2";
+const version = "1.4.0";
 
 const debug$4 = Debug.get('LeaferCanvas');
 class LeaferCanvas extends LeaferCanvasBase {
@@ -6127,7 +6132,7 @@ class LeaferCanvas extends LeaferCanvasBase {
             }
         }
         else {
-            window.addEventListener('resize', () => {
+            window.addEventListener('resize', this.windowListener = () => {
                 const pixelRatio = Platform.devicePixelRatio;
                 if (this.pixelRatio !== pixelRatio) {
                     const { width, height } = this;
@@ -6156,11 +6161,9 @@ class LeaferCanvas extends LeaferCanvasBase {
     }
     stopAutoLayout() {
         this.autoLayout = false;
-        this.resizeListener = null;
-        if (this.resizeObserver) {
+        if (this.resizeObserver)
             this.resizeObserver.disconnect();
-            this.resizeObserver = null;
-        }
+        this.resizeListener = this.resizeObserver = null;
     }
     emitResize(size) {
         const oldSize = {};
@@ -6181,6 +6184,10 @@ class LeaferCanvas extends LeaferCanvasBase {
     destroy() {
         if (this.view) {
             this.stopAutoLayout();
+            if (this.windowListener) {
+                window.removeEventListener('resize', this.windowListener);
+                this.windowListener = null;
+            }
             if (!this.unreal) {
                 const view = this.view;
                 if (view.parentElement)
@@ -6207,7 +6214,10 @@ function useCanvas(_canvasType, _power) {
             canvas.height = height;
             return canvas;
         },
-        canvasToDataURL: (canvas, type, quality) => canvas.toDataURL(mineType(type), quality),
+        canvasToDataURL: (canvas, type, quality) => {
+            const imageType = mineType(type), url = canvas.toDataURL(imageType, quality);
+            return imageType === 'image/bmp' ? url.replace('image/png;', 'image/bmp;') : url;
+        },
         canvasToBolb: (canvas, type, quality) => new Promise((resolve) => canvas.toBlob(resolve, mineType(type), quality)),
         canvasSaveAs: (canvas, filename, quality) => {
             const url = canvas.toDataURL(mineType(fileType(filename)), quality);
@@ -6252,7 +6262,7 @@ function useCanvas(_canvasType, _power) {
 Platform.name = 'web';
 Platform.isMobile = 'ontouchstart' in window;
 Platform.requestRender = function (render) { window.requestAnimationFrame(render); };
-defineKey(Platform, 'devicePixelRatio', { get() { return Math.max(1, devicePixelRatio); } });
+defineKey(Platform, 'devicePixelRatio', { get() { return devicePixelRatio; } });
 const { userAgent } = navigator;
 if (userAgent.indexOf("Firefox") > -1) {
     Platform.conicGradientRotate90 = true;
@@ -6528,7 +6538,7 @@ class Layouter {
     }
     partLayout() {
         var _a;
-        if (!((_a = this.__updatedList) === null || _a === void 0 ? void 0 : _a.length))
+        if (!((_a = this.__updatedList) === null || _a === undefined ? undefined : _a.length))
             return;
         const t = Run.start('PartLayout');
         const { target, __updatedList: updateList } = this;
@@ -6943,6 +6953,7 @@ class UIData extends LeafData {
         return t.fill && this.__hasStroke;
     }
     get __clipAfterFill() { const t = this; return (t.cornerRadius || t.innerShadow || t.__pathInputed); }
+    get __hasSurface() { const t = this; return (t.fill || t.stroke); }
     get __autoWidth() { return !this._width; }
     get __autoHeight() { return !this._height; }
     get __autoSide() { return !this._width || !this._height; }
@@ -7446,199 +7457,199 @@ let UI = UI_1 = class UI extends Leaf {
 };
 __decorate([
     dataProcessor(UIData)
-], UI.prototype, "__", void 0);
+], UI.prototype, "__", undefined);
 __decorate([
     zoomLayerType()
-], UI.prototype, "zoomLayer", void 0);
+], UI.prototype, "zoomLayer", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "id", void 0);
+], UI.prototype, "id", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "name", void 0);
+], UI.prototype, "name", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "className", void 0);
+], UI.prototype, "className", undefined);
 __decorate([
     surfaceType('pass-through')
-], UI.prototype, "blendMode", void 0);
+], UI.prototype, "blendMode", undefined);
 __decorate([
     opacityType(1)
-], UI.prototype, "opacity", void 0);
+], UI.prototype, "opacity", undefined);
 __decorate([
     visibleType(true)
-], UI.prototype, "visible", void 0);
+], UI.prototype, "visible", undefined);
 __decorate([
     surfaceType(false)
-], UI.prototype, "locked", void 0);
+], UI.prototype, "locked", undefined);
 __decorate([
     sortType(0)
-], UI.prototype, "zIndex", void 0);
+], UI.prototype, "zIndex", undefined);
 __decorate([
     maskType(false)
-], UI.prototype, "mask", void 0);
+], UI.prototype, "mask", undefined);
 __decorate([
     eraserType(false)
-], UI.prototype, "eraser", void 0);
+], UI.prototype, "eraser", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "x", void 0);
+], UI.prototype, "x", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "y", void 0);
+], UI.prototype, "y", undefined);
 __decorate([
     boundsType(100, true)
-], UI.prototype, "width", void 0);
+], UI.prototype, "width", undefined);
 __decorate([
     boundsType(100, true)
-], UI.prototype, "height", void 0);
+], UI.prototype, "height", undefined);
 __decorate([
     scaleType(1, true)
-], UI.prototype, "scaleX", void 0);
+], UI.prototype, "scaleX", undefined);
 __decorate([
     scaleType(1, true)
-], UI.prototype, "scaleY", void 0);
+], UI.prototype, "scaleY", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "rotation", void 0);
+], UI.prototype, "rotation", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "skewX", void 0);
+], UI.prototype, "skewX", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "skewY", void 0);
+], UI.prototype, "skewY", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "offsetX", void 0);
+], UI.prototype, "offsetX", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "offsetY", void 0);
+], UI.prototype, "offsetY", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "scrollX", void 0);
+], UI.prototype, "scrollX", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "scrollY", void 0);
+], UI.prototype, "scrollY", undefined);
 __decorate([
     autoLayoutType()
-], UI.prototype, "origin", void 0);
+], UI.prototype, "origin", undefined);
 __decorate([
     autoLayoutType()
-], UI.prototype, "around", void 0);
+], UI.prototype, "around", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "lazy", void 0);
+], UI.prototype, "lazy", undefined);
 __decorate([
     naturalBoundsType(1)
-], UI.prototype, "pixelRatio", void 0);
+], UI.prototype, "pixelRatio", undefined);
 __decorate([
     pathInputType()
-], UI.prototype, "path", void 0);
+], UI.prototype, "path", undefined);
 __decorate([
     pathType()
-], UI.prototype, "windingRule", void 0);
+], UI.prototype, "windingRule", undefined);
 __decorate([
     pathType(true)
-], UI.prototype, "closed", void 0);
+], UI.prototype, "closed", undefined);
 __decorate([
     boundsType(0)
-], UI.prototype, "padding", void 0);
+], UI.prototype, "padding", undefined);
 __decorate([
     boundsType(false)
-], UI.prototype, "lockRatio", void 0);
+], UI.prototype, "lockRatio", undefined);
 __decorate([
     boundsType()
-], UI.prototype, "widthRange", void 0);
+], UI.prototype, "widthRange", undefined);
 __decorate([
     boundsType()
-], UI.prototype, "heightRange", void 0);
+], UI.prototype, "heightRange", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "draggable", void 0);
+], UI.prototype, "draggable", undefined);
 __decorate([
     dataType()
-], UI.prototype, "dragBounds", void 0);
+], UI.prototype, "dragBounds", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "editable", void 0);
+], UI.prototype, "editable", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hittable", void 0);
+], UI.prototype, "hittable", undefined);
 __decorate([
     hitType('path')
-], UI.prototype, "hitFill", void 0);
+], UI.prototype, "hitFill", undefined);
 __decorate([
     strokeType('path')
-], UI.prototype, "hitStroke", void 0);
+], UI.prototype, "hitStroke", undefined);
 __decorate([
     hitType(false)
-], UI.prototype, "hitBox", void 0);
+], UI.prototype, "hitBox", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hitChildren", void 0);
+], UI.prototype, "hitChildren", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hitSelf", void 0);
+], UI.prototype, "hitSelf", undefined);
 __decorate([
     hitType()
-], UI.prototype, "hitRadius", void 0);
+], UI.prototype, "hitRadius", undefined);
 __decorate([
     cursorType('')
-], UI.prototype, "cursor", void 0);
+], UI.prototype, "cursor", undefined);
 __decorate([
     surfaceType()
-], UI.prototype, "fill", void 0);
+], UI.prototype, "fill", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "stroke", void 0);
+], UI.prototype, "stroke", undefined);
 __decorate([
     strokeType('inside')
-], UI.prototype, "strokeAlign", void 0);
+], UI.prototype, "strokeAlign", undefined);
 __decorate([
     strokeType(1)
-], UI.prototype, "strokeWidth", void 0);
+], UI.prototype, "strokeWidth", undefined);
 __decorate([
     strokeType(false)
-], UI.prototype, "strokeWidthFixed", void 0);
+], UI.prototype, "strokeWidthFixed", undefined);
 __decorate([
     strokeType('none')
-], UI.prototype, "strokeCap", void 0);
+], UI.prototype, "strokeCap", undefined);
 __decorate([
     strokeType('miter')
-], UI.prototype, "strokeJoin", void 0);
+], UI.prototype, "strokeJoin", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "dashPattern", void 0);
+], UI.prototype, "dashPattern", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "dashOffset", void 0);
+], UI.prototype, "dashOffset", undefined);
 __decorate([
     strokeType(10)
-], UI.prototype, "miterLimit", void 0);
+], UI.prototype, "miterLimit", undefined);
 __decorate([
     pathType(0)
-], UI.prototype, "cornerRadius", void 0);
+], UI.prototype, "cornerRadius", undefined);
 __decorate([
     pathType()
-], UI.prototype, "cornerSmoothing", void 0);
+], UI.prototype, "cornerSmoothing", undefined);
 __decorate([
     effectType()
-], UI.prototype, "shadow", void 0);
+], UI.prototype, "shadow", undefined);
 __decorate([
     effectType()
-], UI.prototype, "innerShadow", void 0);
+], UI.prototype, "innerShadow", undefined);
 __decorate([
     effectType()
-], UI.prototype, "blur", void 0);
+], UI.prototype, "blur", undefined);
 __decorate([
     effectType()
-], UI.prototype, "backgroundBlur", void 0);
+], UI.prototype, "backgroundBlur", undefined);
 __decorate([
     effectType()
-], UI.prototype, "grayscale", void 0);
+], UI.prototype, "grayscale", undefined);
 __decorate([
     dataType({})
-], UI.prototype, "data", void 0);
+], UI.prototype, "data", undefined);
 __decorate([
     rewrite(Leaf.prototype.reset)
 ], UI.prototype, "reset", null);
@@ -7699,7 +7710,7 @@ let Group = class Group extends UI {
 };
 __decorate([
     dataProcessor(GroupData)
-], Group.prototype, "__", void 0);
+], Group.prototype, "__", undefined);
 Group = __decorate([
     useModule(Branch),
     registerUI()
@@ -7870,8 +7881,6 @@ let Leafer = Leafer_1 = class Leafer extends Group {
     __setAttr(attrName, newValue) {
         if (this.canvas) {
             if (canvasSizeAttrs.includes(attrName)) {
-                if (!newValue)
-                    debug.warn(attrName + ' is 0');
                 this.__changeCanvasSize(attrName, newValue);
             }
             else if (attrName === 'fill') {
@@ -8074,10 +8083,10 @@ let Leafer = Leafer_1 = class Leafer extends Group {
 Leafer.list = new LeafList();
 __decorate([
     dataProcessor(LeaferData)
-], Leafer.prototype, "__", void 0);
+], Leafer.prototype, "__", undefined);
 __decorate([
     boundsType()
-], Leafer.prototype, "pixelRatio", void 0);
+], Leafer.prototype, "pixelRatio", undefined);
 Leafer = Leafer_1 = __decorate([
     registerUI()
 ], Leafer);
@@ -8090,7 +8099,7 @@ let Rect = class Rect extends UI {
 };
 __decorate([
     dataProcessor(RectData)
-], Rect.prototype, "__", void 0);
+], Rect.prototype, "__", undefined);
 Rect = __decorate([
     useModule(RectRender),
     rewriteAble(),
@@ -8115,6 +8124,8 @@ let Box = class Box extends Group {
         const data = this.__;
         if (this.children.length) {
             if (data.__autoSide) {
+                if (data.__hasSurface)
+                    this.__extraUpdate();
                 super.__updateBoxBounds();
                 const { boxBounds } = this.__layout;
                 if (!data.__autoSize) {
@@ -8179,13 +8190,13 @@ let Box = class Box extends Group {
 };
 __decorate([
     dataProcessor(BoxData)
-], Box.prototype, "__", void 0);
+], Box.prototype, "__", undefined);
 __decorate([
     dataType(false)
-], Box.prototype, "resizeChildren", void 0);
+], Box.prototype, "resizeChildren", undefined);
 __decorate([
     affectRenderBoundsType('show')
-], Box.prototype, "overflow", void 0);
+], Box.prototype, "overflow", undefined);
 __decorate([
     rewrite(rect.__updateStrokeSpread)
 ], Box.prototype, "__updateStrokeSpread", null);
@@ -8224,13 +8235,13 @@ let Frame = class Frame extends Box {
 };
 __decorate([
     dataProcessor(FrameData)
-], Frame.prototype, "__", void 0);
+], Frame.prototype, "__", undefined);
 __decorate([
     surfaceType('#FFFFFF')
-], Frame.prototype, "fill", void 0);
+], Frame.prototype, "fill", undefined);
 __decorate([
     affectRenderBoundsType('hide')
-], Frame.prototype, "overflow", void 0);
+], Frame.prototype, "overflow", undefined);
 Frame = __decorate([
     registerUI()
 ], Frame);
@@ -8277,16 +8288,16 @@ let Ellipse = class Ellipse extends UI {
 };
 __decorate([
     dataProcessor(EllipseData)
-], Ellipse.prototype, "__", void 0);
+], Ellipse.prototype, "__", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "innerRadius", void 0);
+], Ellipse.prototype, "innerRadius", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "startAngle", void 0);
+], Ellipse.prototype, "startAngle", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "endAngle", void 0);
+], Ellipse.prototype, "endAngle", undefined);
 Ellipse = __decorate([
     registerUI()
 ], Ellipse);
@@ -8345,22 +8356,22 @@ let Line = class Line extends UI {
 };
 __decorate([
     dataProcessor(LineData)
-], Line.prototype, "__", void 0);
+], Line.prototype, "__", undefined);
 __decorate([
     affectStrokeBoundsType('center')
-], Line.prototype, "strokeAlign", void 0);
+], Line.prototype, "strokeAlign", undefined);
 __decorate([
     boundsType(0)
-], Line.prototype, "height", void 0);
+], Line.prototype, "height", undefined);
 __decorate([
     pathType()
-], Line.prototype, "points", void 0);
+], Line.prototype, "points", undefined);
 __decorate([
     pathType(0)
-], Line.prototype, "curve", void 0);
+], Line.prototype, "curve", undefined);
 __decorate([
     pathType(false)
-], Line.prototype, "closed", void 0);
+], Line.prototype, "closed", undefined);
 Line = __decorate([
     registerUI()
 ], Line);
@@ -8393,16 +8404,16 @@ let Polygon = class Polygon extends UI {
 };
 __decorate([
     dataProcessor(PolygonData)
-], Polygon.prototype, "__", void 0);
+], Polygon.prototype, "__", undefined);
 __decorate([
     pathType(3)
-], Polygon.prototype, "sides", void 0);
+], Polygon.prototype, "sides", undefined);
 __decorate([
     pathType()
-], Polygon.prototype, "points", void 0);
+], Polygon.prototype, "points", undefined);
 __decorate([
     pathType(0)
-], Polygon.prototype, "curve", void 0);
+], Polygon.prototype, "curve", undefined);
 __decorate([
     rewrite(line.__updateRenderPath)
 ], Polygon.prototype, "__updateRenderPath", null);
@@ -8434,13 +8445,13 @@ let Star = class Star extends UI {
 };
 __decorate([
     dataProcessor(StarData)
-], Star.prototype, "__", void 0);
+], Star.prototype, "__", undefined);
 __decorate([
     pathType(5)
-], Star.prototype, "corners", void 0);
+], Star.prototype, "corners", undefined);
 __decorate([
     pathType(0.382)
-], Star.prototype, "innerRadius", void 0);
+], Star.prototype, "innerRadius", undefined);
 Star = __decorate([
     registerUI()
 ], Star);
@@ -8462,10 +8473,10 @@ let Image$1 = class Image extends Rect {
 };
 __decorate([
     dataProcessor(ImageData)
-], Image$1.prototype, "__", void 0);
+], Image$1.prototype, "__", undefined);
 __decorate([
     boundsType('')
-], Image$1.prototype, "url", void 0);
+], Image$1.prototype, "url", undefined);
 Image$1 = __decorate([
     registerUI()
 ], Image$1);
@@ -8528,25 +8539,25 @@ let Canvas = class Canvas extends Rect {
 };
 __decorate([
     dataProcessor(CanvasData)
-], Canvas.prototype, "__", void 0);
+], Canvas.prototype, "__", undefined);
 __decorate([
     resizeType(100)
-], Canvas.prototype, "width", void 0);
+], Canvas.prototype, "width", undefined);
 __decorate([
     resizeType(100)
-], Canvas.prototype, "height", void 0);
+], Canvas.prototype, "height", undefined);
 __decorate([
     resizeType(1)
-], Canvas.prototype, "pixelRatio", void 0);
+], Canvas.prototype, "pixelRatio", undefined);
 __decorate([
     resizeType(true)
-], Canvas.prototype, "smooth", void 0);
+], Canvas.prototype, "smooth", undefined);
 __decorate([
     dataType(false)
-], Canvas.prototype, "safeResize", void 0);
+], Canvas.prototype, "safeResize", undefined);
 __decorate([
     resizeType()
-], Canvas.prototype, "contextSettings", void 0);
+], Canvas.prototype, "contextSettings", undefined);
 Canvas = __decorate([
     registerUI()
 ], Canvas);
@@ -8637,76 +8648,76 @@ let Text = class Text extends UI {
 };
 __decorate([
     dataProcessor(TextData)
-], Text.prototype, "__", void 0);
+], Text.prototype, "__", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "width", void 0);
+], Text.prototype, "width", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "height", void 0);
+], Text.prototype, "height", undefined);
 __decorate([
     dataType(false)
-], Text.prototype, "resizeFontSize", void 0);
+], Text.prototype, "resizeFontSize", undefined);
 __decorate([
     surfaceType('#000000')
-], Text.prototype, "fill", void 0);
+], Text.prototype, "fill", undefined);
 __decorate([
     affectStrokeBoundsType('outside')
-], Text.prototype, "strokeAlign", void 0);
+], Text.prototype, "strokeAlign", undefined);
 __decorate([
     hitType('all')
-], Text.prototype, "hitFill", void 0);
+], Text.prototype, "hitFill", undefined);
 __decorate([
     boundsType('')
-], Text.prototype, "text", void 0);
+], Text.prototype, "text", undefined);
 __decorate([
-    boundsType('L')
-], Text.prototype, "fontFamily", void 0);
+    boundsType('caption')
+], Text.prototype, "fontFamily", undefined);
 __decorate([
     boundsType(12)
-], Text.prototype, "fontSize", void 0);
+], Text.prototype, "fontSize", undefined);
 __decorate([
     boundsType('normal')
-], Text.prototype, "fontWeight", void 0);
+], Text.prototype, "fontWeight", undefined);
 __decorate([
     boundsType(false)
-], Text.prototype, "italic", void 0);
+], Text.prototype, "italic", undefined);
 __decorate([
     boundsType('none')
-], Text.prototype, "textCase", void 0);
+], Text.prototype, "textCase", undefined);
 __decorate([
     boundsType('none')
-], Text.prototype, "textDecoration", void 0);
+], Text.prototype, "textDecoration", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "letterSpacing", void 0);
+], Text.prototype, "letterSpacing", undefined);
 __decorate([
     boundsType({ type: 'percent', value: 1.5 })
-], Text.prototype, "lineHeight", void 0);
+], Text.prototype, "lineHeight", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "paraIndent", void 0);
+], Text.prototype, "paraIndent", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "paraSpacing", void 0);
+], Text.prototype, "paraSpacing", undefined);
 __decorate([
     boundsType('x')
-], Text.prototype, "writingMode", void 0);
+], Text.prototype, "writingMode", undefined);
 __decorate([
     boundsType('left')
-], Text.prototype, "textAlign", void 0);
+], Text.prototype, "textAlign", undefined);
 __decorate([
     boundsType('top')
-], Text.prototype, "verticalAlign", void 0);
+], Text.prototype, "verticalAlign", undefined);
 __decorate([
     boundsType(true)
-], Text.prototype, "autoSizeAlign", void 0);
+], Text.prototype, "autoSizeAlign", undefined);
 __decorate([
     boundsType('normal')
-], Text.prototype, "textWrap", void 0);
+], Text.prototype, "textWrap", undefined);
 __decorate([
     boundsType('show')
-], Text.prototype, "textOverflow", void 0);
+], Text.prototype, "textOverflow", undefined);
 Text = __decorate([
     registerUI()
 ], Text);
@@ -8719,10 +8730,10 @@ let Path = class Path extends UI {
 };
 __decorate([
     dataProcessor(PathData)
-], Path.prototype, "__", void 0);
+], Path.prototype, "__", undefined);
 __decorate([
     affectStrokeBoundsType('center')
-], Path.prototype, "strokeAlign", void 0);
+], Path.prototype, "strokeAlign", undefined);
 Path = __decorate([
     registerUI()
 ], Path);
@@ -8761,10 +8772,10 @@ let Pen = class Pen extends Group {
 };
 __decorate([
     dataProcessor(PenData)
-], Pen.prototype, "__", void 0);
+], Pen.prototype, "__", undefined);
 __decorate([
     penPathType()
-], Pen.prototype, "path", void 0);
+], Pen.prototype, "path", undefined);
 Pen = __decorate([
     useModule(PathCreator, ['set', 'path', 'paint']),
     registerUI()
@@ -9398,7 +9409,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
             }
             else {
                 if (!paint.patternTask) {
-                    paint.patternTask = ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function* () {
+                    paint.patternTask = ImageManager.patternTasker.add(() => __awaiter(this, undefined, undefined, function* () {
                         paint.patternTask = null;
                         if (canvas.bounds.hit(ui.__nowWorld))
                             createPattern(ui, paint, pixelRatio);
@@ -9554,7 +9565,7 @@ function shadow(ui, current, shape) {
     const end = shadow.length - 1;
     toOffsetOutBounds$1(bounds, offsetOutBounds$1);
     shadow.forEach((item, index) => {
-        other.setWorldShadow((offsetOutBounds$1.offsetX + item.x * scaleX), (offsetOutBounds$1.offsetY + item.y * scaleY), item.blur * scaleX, item.color);
+        other.setWorldShadow((offsetOutBounds$1.offsetX + item.x * scaleX), (offsetOutBounds$1.offsetY + item.y * scaleY), item.blur * scaleX, ColorConvert.string(item.color));
         spreadScale = item.spread ? 1 + item.spread * 2 / (__layout.boxBounds.width + (__layout.strokeBoxSpread || 0) * 2) : 0;
         drawWorldShadow(other, offsetOutBounds$1, spreadScale, shape);
         copyBounds = bounds;
@@ -9630,7 +9641,7 @@ function innerShadow(ui, current, shape) {
             other.copyWorld(shape.canvas, shapeBounds, bounds, 'source-out');
             copyBounds = bounds;
         }
-        other.fillWorld(copyBounds, item.color, 'source-in');
+        other.fillWorld(copyBounds, ColorConvert.string(item.color), 'source-in');
         if (ui.__worldFlipped) {
             current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
         }
@@ -9988,11 +9999,11 @@ const TextMode = 2;
 function layoutChar(drawData, style, width, _height) {
     const { rows } = drawData;
     const { textAlign, paraIndent, letterSpacing } = style;
-    let charX, addWordWidth, indentWidth, mode, wordChar;
+    let charX, addWordWidth, indentWidth, mode, wordChar, wordsLength;
     rows.forEach(row => {
         if (row.words) {
-            indentWidth = paraIndent && row.paraStart ? paraIndent : 0;
-            addWordWidth = (width && (textAlign === 'justify' || textAlign === 'both') && row.words.length > 1) ? (width - row.width - indentWidth) / (row.words.length - 1) : 0;
+            indentWidth = paraIndent && row.paraStart ? paraIndent : 0, wordsLength = row.words.length;
+            addWordWidth = (width && (textAlign === 'justify' || textAlign === 'both') && wordsLength > 1) ? (width - row.width - indentWidth) / (wordsLength - 1) : 0;
             mode = (letterSpacing || row.isOverflow) ? CharMode : (addWordWidth > 0.01 ? WordMode : TextMode);
             if (row.isOverflow && !letterSpacing)
                 row.textMode = true;
@@ -10004,7 +10015,7 @@ function layoutChar(drawData, style, width, _height) {
                 row.x += indentWidth;
                 charX = row.x;
                 row.data = [];
-                row.words.forEach(word => {
+                row.words.forEach((word, index) => {
                     if (mode === WordMode) {
                         wordChar = { char: '', x: charX };
                         charX = toWordChar(word.data, charX, wordChar);
@@ -10014,7 +10025,7 @@ function layoutChar(drawData, style, width, _height) {
                     else {
                         charX = toChar(word.data, charX, row.data, row.isOverflow);
                     }
-                    if (addWordWidth && (!row.paraEnd || textAlign === 'both')) {
+                    if (addWordWidth && (!row.paraEnd || textAlign === 'both') && (index !== wordsLength - 1)) {
                         charX += addWordWidth;
                         row.width += addWordWidth;
                     }
@@ -10266,3 +10277,4 @@ Object.assign(Effect, EffectModule);
 useCanvas();
 
 export { AlignHelper, Answer, AroundHelper, AutoBounds, BezierHelper, Bounds, BoundsHelper, Box, BoxData, Branch, BranchHelper, BranchRender, Canvas, CanvasData, CanvasManager, ChildEvent, ColorConvert, Creator, DataHelper, Debug, Direction4, Direction9, Effect, Ellipse, EllipseData, EllipseHelper, Event, EventCreator, Eventer, Export, FileHelper, Frame, FrameData, Group, GroupData, Image$1 as Image, ImageData, ImageEvent, ImageManager, IncrementId, LayoutEvent, Layouter, Leaf, LeafBounds, LeafBoundsHelper, LeafData, LeafDataProxy, LeafEventer, LeafHelper, LeafLayout, LeafLevelList, LeafList, LeafMatrix, LeafRender, Leafer, LeaferCanvas, LeaferCanvasBase, LeaferData, LeaferEvent, LeaferImage, Line, LineData, MathHelper, Matrix, MatrixHelper, MyImage, NeedConvertToCanvasCommandMap, OneRadian, PI2, PI_2, Paint, PaintGradient, PaintImage, Path, PathArrow, PathBounds, PathCommandDataHelper, PathCommandMap, PathConvert, PathCorner, PathCreator, PathData, PathDrawer, PathHelper, PathNumberCommandLengthMap, PathNumberCommandMap, Pen, PenData, Platform, Plugin, Point, PointHelper, Polygon, PolygonData, PropertyEvent, Rect, RectData, RectHelper, RectRender, RenderEvent, Renderer, ResizeEvent, Run, Star, StarData, State, StringNumberMap, TaskItem, TaskProcessor, Text, TextConvert, TextData, Transition, TwoPointBoundsHelper, UI, UIBounds, UICreator, UIData, UIRender, UnitConvert, WaitHelper, WatchEvent, Watcher, affectRenderBoundsType, affectStrokeBoundsType, attr, autoLayoutType, boundsType, canvasPatch, canvasSizeAttrs, cursorType, dataProcessor, dataType, decorateLeafAttr, defineDataProcessor, defineKey, defineLeafAttr, doBoundsType, doStrokeType, effectType, emptyData, eraserType, getBoundsData, getDescriptor, getMatrixData, getPointData, hitType, isNull, layoutProcessor, maskType, naturalBoundsType, opacityType, pathInputType, pathType, pen, positionType, registerUI, registerUIEvent, resizeType, rewrite, rewriteAble, rotationType, scaleType, sortType, strokeType, surfaceType, tempBounds$1 as tempBounds, tempMatrix, tempPoint$3 as tempPoint, useCanvas, useModule, version, visibleType, zoomLayerType };
+//# sourceMappingURL=web.module.js.map