@leafer/core 1.0.0-rc.19 → 1.0.0-rc.20

package/lib/core.esm.js

@@ -1,5 +1,6 @@
 const Platform = {
     image: {
+        hitCanvasSize: 100,
         maxCacheSize: 2560 * 1600,
         maxPatternSize: 4096 * 2160,
         suffix: 'leaf',
@@ -41,7 +42,7 @@ const MathHelper = {
     minus(value, isFourNumber) {
         if (value instanceof Array) {
             if (isFourNumber)
-                value = MathHelper.fourNumber(value);
+                value = MathHelper.fourNumber(value, 0);
             for (let i = 0; i < value.length; i++)
                 value[i] = -value[i];
         }
@@ -55,7 +56,7 @@ const MathHelper = {
         if (num instanceof Array) {
             switch (num.length) {
                 case 4:
-                    data = num;
+                    data = maxValue === undefined ? num : [...num];
                     break;
                 case 2:
                     data = [num[0], num[1], num[0], num[1]];
@@ -116,7 +117,7 @@ function getMatrixData() { return { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 }; }
 
 const { sin: sin$3, cos: cos$3, acos, sqrt: sqrt$3 } = Math;
 const { float: float$1 } = MathHelper;
-const tempPoint$2 = {};
+const tempPoint$3 = {};
 function getWorld() {
     return Object.assign(Object.assign(Object.assign({}, getMatrixData()), getBoundsData()), { scaleX: 1, scaleY: 1, rotation: 0, skewX: 0, skewY: 0 });
 }
@@ -157,8 +158,8 @@ const MatrixHelper = {
         t.d *= scaleY;
     },
     scaleOfOuter(t, origin, scaleX, scaleY) {
-        M$6.toInnerPoint(t, origin, tempPoint$2);
-        M$6.scaleOfInner(t, tempPoint$2, scaleX, scaleY);
+        M$6.toInnerPoint(t, origin, tempPoint$3);
+        M$6.scaleOfInner(t, tempPoint$3, scaleX, scaleY);
     },
     scaleOfInner(t, origin, scaleX, scaleY = scaleX) {
         M$6.translateInner(t, origin.x, origin.y);
@@ -176,8 +177,8 @@ const MatrixHelper = {
         t.d = c * sinR + d * cosR;
     },
     rotateOfOuter(t, origin, rotation) {
-        M$6.toInnerPoint(t, origin, tempPoint$2);
-        M$6.rotateOfInner(t, tempPoint$2, rotation);
+        M$6.toInnerPoint(t, origin, tempPoint$3);
+        M$6.rotateOfInner(t, tempPoint$3, rotation);
     },
     rotateOfInner(t, origin, rotation) {
         M$6.translateInner(t, origin.x, origin.y);
@@ -198,8 +199,8 @@ const MatrixHelper = {
         }
     },
     skewOfOuter(t, origin, skewX, skewY) {
-        M$6.toInnerPoint(t, origin, tempPoint$2);
-        M$6.skewOfInner(t, tempPoint$2, skewX, skewY);
+        M$6.toInnerPoint(t, origin, tempPoint$3);
+        M$6.skewOfInner(t, tempPoint$3, skewX, skewY);
     },
     skewOfInner(t, origin, skewX, skewY = 0) {
         M$6.translateInner(t, origin.x, origin.y);
@@ -446,19 +447,19 @@ const PointHelper = {
     },
     tempToInnerOf(t, matrix) {
         const { tempPoint: temp } = P$5;
-        copy$6(temp, t);
+        copy$7(temp, t);
         toInnerPoint$2(matrix, temp, temp);
         return temp;
     },
     tempToOuterOf(t, matrix) {
         const { tempPoint: temp } = P$5;
-        copy$6(temp, t);
+        copy$7(temp, t);
         toOuterPoint$2(matrix, temp, temp);
         return temp;
     },
     tempToInnerRadiusPointOf(t, matrix) {
         const { tempRadiusPoint: temp } = P$5;
-        copy$6(temp, t);
+        copy$7(temp, t);
         P$5.toInnerRadiusPointOf(t, matrix, temp);
         return temp;
     },
@@ -525,7 +526,7 @@ const PointHelper = {
     }
 };
 const P$5 = PointHelper;
-const { getDistanceFrom, copy: copy$6, getAtan2 } = P$5;
+const { getDistanceFrom, copy: copy$7, getAtan2 } = P$5;
 
 class Point {
     constructor(x, y) {
@@ -593,6 +594,7 @@ class Point {
         return this;
     }
 }
+const tempPoint$2 = new Point();
 
 class Matrix {
     constructor(a, b, c, d, e, f) {
@@ -602,6 +604,12 @@ class Matrix {
         typeof a === 'object' ? MatrixHelper.copy(this, a) : MatrixHelper.set(this, a, b, c, d, e, f);
         return this;
     }
+    setWith(dataWithScale) {
+        MatrixHelper.copy(this, dataWithScale);
+        this.scaleX = dataWithScale.scaleX;
+        this.scaleY = dataWithScale.scaleY;
+        return this;
+    }
     get() {
         const { a, b, c, d, e, f } = this;
         return { a, b, c, d, e, f };
@@ -621,6 +629,12 @@ class Matrix {
         MatrixHelper.scale(this, x, y);
         return this;
     }
+    scaleWith(x, y) {
+        MatrixHelper.scale(this, x, y);
+        this.scaleX *= x;
+        this.scaleY *= y || x;
+        return this;
+    }
     scaleOfOuter(origin, x, y) {
         MatrixHelper.scaleOfOuter(this, origin, x, y);
         return this;
@@ -673,6 +687,12 @@ class Matrix {
         MatrixHelper.invert(this);
         return this;
     }
+    invertWith() {
+        MatrixHelper.invert(this);
+        this.scaleX = 1 / this.scaleX;
+        this.scaleY = 1 / this.scaleY;
+        return this;
+    }
     toOuterPoint(inner, to, distance) {
         MatrixHelper.toOuterPoint(this, inner, to, distance);
     }
@@ -693,6 +713,7 @@ class Matrix {
         MatrixHelper.reset(this);
     }
 }
+const tempMatrix = new Matrix();
 
 const TwoPointBoundsHelper = {
     tempPointBounds: {},
@@ -781,7 +802,7 @@ const BoundsHelper = {
             to = t;
         }
         else {
-            copy$5(to, t);
+            copy$6(to, t);
         }
         if (parent) {
             to.offsetX = -(B.maxX(parent) - t.x);
@@ -856,8 +877,8 @@ const BoundsHelper = {
         B.move(to, -matrix.e, -matrix.f);
         B.scale(to, 1 / matrix.a, 1 / matrix.d);
     },
-    getFitMatrix(t, put) {
-        const scale = Math.min(1, Math.min(t.width / put.width, t.height / put.height));
+    getFitMatrix(t, put, baseScale = 1) {
+        const scale = Math.min(baseScale, Math.min(t.width / put.width, t.height / put.height));
         return new Matrix(scale, 0, 0, scale, -put.x * scale, -put.y * scale);
     },
     getSpread(t, spreadX, spreadY) {
@@ -891,11 +912,15 @@ const BoundsHelper = {
         t.width = float(t.width, maxLength);
         t.height = float(t.height, maxLength);
     },
-    add(t, bounds) {
+    add(t, bounds, isPoint) {
         right = t.x + t.width;
         bottom = t.y + t.height;
-        boundsRight = bounds.x + bounds.width;
-        boundsBottom = bounds.y + bounds.height;
+        boundsRight = bounds.x;
+        boundsBottom = bounds.y;
+        if (!isPoint) {
+            boundsRight += bounds.width;
+            boundsBottom += bounds.height;
+        }
         right = right > boundsRight ? right : boundsRight;
         bottom = bottom > boundsBottom ? bottom : boundsBottom;
         t.x = t.x < bounds.x ? t.x : bounds.x;
@@ -920,7 +945,7 @@ const BoundsHelper = {
                 if (first) {
                     first = false;
                     if (!addMode)
-                        copy$5(t, bounds);
+                        copy$6(t, bounds);
                 }
                 else {
                     add(t, bounds);
@@ -934,6 +959,9 @@ const BoundsHelper = {
         points.forEach((point, index) => index === 0 ? setPoint$2(tempPointBounds$1, point.x, point.y) : addPoint$2(tempPointBounds$1, point.x, point.y));
         toBounds$2(tempPointBounds$1, t);
     },
+    addPoint(t, point) {
+        add(t, point, true);
+    },
     getPoints(t) {
         const { x, y, width, height } = t;
         return [
@@ -995,7 +1023,7 @@ const BoundsHelper = {
     }
 };
 const B = BoundsHelper;
-const { add, copy: copy$5 } = B;
+const { add, copy: copy$6 } = B;
 
 class Bounds {
     get minX() { return BoundsHelper.minX(this); }
@@ -1036,8 +1064,8 @@ class Bounds {
         BoundsHelper.toInnerOf(this, matrix, to);
         return this;
     }
-    getFitMatrix(put) {
-        return BoundsHelper.getFitMatrix(this, put);
+    getFitMatrix(put, baseScale) {
+        return BoundsHelper.getFitMatrix(this, put, baseScale);
     }
     spread(fourNumber, spreadY) {
         BoundsHelper.spread(this, fourNumber, spreadY);
@@ -1083,6 +1111,10 @@ class Bounds {
         BoundsHelper.setPoints(this, points);
         return this;
     }
+    addPoint(point) {
+        BoundsHelper.addPoint(this, point);
+        return this;
+    }
     getPoints() {
         return BoundsHelper.getPoints(this);
     }
@@ -1115,6 +1147,7 @@ class Bounds {
         BoundsHelper.reset(this);
     }
 }
+const tempBounds = new Bounds();
 
 class AutoBounds {
     constructor(top, right, bottom, left, width, height) {
@@ -1535,36 +1568,7 @@ var Answer;
     Answer[Answer["NoAndSkip"] = 2] = "NoAndSkip";
     Answer[Answer["YesAndSkip"] = 3] = "YesAndSkip";
 })(Answer || (Answer = {}));
-
-const FileHelper = {
-    opacityTypes: ['png', 'webp', 'svg'],
-    upperCaseTypeMap: {},
-    mineType(type) {
-        if (!type || type.startsWith('image'))
-            return type;
-        if (type === 'jpg')
-            type = 'jpeg';
-        return 'image/' + type;
-    },
-    fileType(filename) {
-        const l = filename.split('.');
-        return l[l.length - 1];
-    },
-    isOpaqueImage(filename) {
-        const type = F$4.fileType(filename);
-        return ['jpg', 'jpeg'].some(item => item === type);
-    },
-    getExportOptions(options) {
-        switch (typeof options) {
-            case 'object': return options;
-            case 'number': return { quality: options };
-            case 'boolean': return { blob: options };
-            default: return {};
-        }
-    }
-};
-const F$4 = FileHelper;
-F$4.opacityTypes.forEach(type => F$4.upperCaseTypeMap[type] = type.toUpperCase());
+const emptyData = {};
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -1888,10 +1892,8 @@ __decorate([
     contextMethod()
 ], Canvas.prototype, "strokeText", null);
 
-const { copy: copy$4 } = MatrixHelper;
-const temp = new Bounds();
+const { copy: copy$5 } = MatrixHelper;
 const minSize = { width: 1, height: 1, pixelRatio: 1 };
-const debug$5 = Debug.get('LeaferCanvasBase');
 const canvasSizeAttrs = ['width', 'height', 'pixelRatio'];
 class LeaferCanvasBase extends Canvas {
     get width() { return this.size.width; }
@@ -1918,44 +1920,15 @@ class LeaferCanvasBase extends Canvas {
     }
     init() { }
     __createContext() {
-        this.context = this.view.getContext('2d');
+        const { view } = this;
+        const { contextSettings } = this.config;
+        this.context = contextSettings ? view.getContext('2d', contextSettings) : view.getContext('2d');
         this.__bindContext();
     }
-    export(filename, options) {
-        const { quality, blob } = FileHelper.getExportOptions(options);
-        if (filename.includes('.')) {
-            return this.saveAs(filename, quality);
-        }
-        else if (blob) {
-            return this.toBlob(filename, quality);
-        }
-        else {
-            return this.toDataURL(filename, quality);
-        }
-    }
-    toBlob(type, quality) {
-        return new Promise((resolve) => {
-            Platform.origin.canvasToBolb(this.view, type, quality).then((blob) => {
-                resolve(blob);
-            }).catch((e) => {
-                debug$5.error(e);
-                resolve(null);
-            });
-        });
-    }
-    toDataURL(type, quality) {
-        return Platform.origin.canvasToDataURL(this.view, type, quality);
-    }
-    saveAs(filename, quality) {
-        return new Promise((resolve) => {
-            Platform.origin.canvasSaveAs(this.view, filename, quality).then(() => {
-                resolve(true);
-            }).catch((e) => {
-                debug$5.error(e);
-                resolve(false);
-            });
-        });
-    }
+    export(_filename, _options) { return undefined; }
+    toBlob(_type, _quality) { return undefined; }
+    toDataURL(_type, _quality) { return undefined; }
+    saveAs(_filename, _quality) { return undefined; }
     resize(size) {
         if (this.isSameSize(size))
             return;
@@ -2023,13 +1996,9 @@ class LeaferCanvasBase extends Canvas {
     restoreBlendMode() {
         this.blendMode = this.savedBlendMode;
     }
-    hitFill(point, fillRule) {
-        return fillRule ? this.context.isPointInPath(point.x, point.y, fillRule) : this.context.isPointInPath(point.x, point.y);
-    }
-    hitStroke(point, strokeWidth) {
-        this.strokeWidth = strokeWidth;
-        return this.context.isPointInStroke(point.x, point.y);
-    }
+    hitFill(_point, _fillRule) { return true; }
+    hitStroke(_point, _strokeWidth) { return true; }
+    hitPixel(_radiusPoint, _offset, _scale = 1) { return true; }
     setWorldShadow(x, y, blur, color) {
         const { pixelRatio } = this;
         this.shadowOffsetX = x * pixelRatio;
@@ -2088,8 +2057,8 @@ class LeaferCanvasBase extends Canvas {
         if (blendMode)
             this.blendMode = blendMode;
         this.fillStyle = color;
-        temp.set(bounds).scale(this.pixelRatio);
-        this.fillRect(temp.x, temp.y, temp.width, temp.height);
+        tempBounds.set(bounds).scale(this.pixelRatio);
+        this.fillRect(tempBounds.x, tempBounds.y, tempBounds.width, tempBounds.height);
         if (blendMode)
             this.blendMode = 'source-over';
     }
@@ -2097,23 +2066,23 @@ class LeaferCanvasBase extends Canvas {
         if (blendMode)
             this.blendMode = blendMode;
         this.strokeStyle = color;
-        temp.set(bounds).scale(this.pixelRatio);
-        this.strokeRect(temp.x, temp.y, temp.width, temp.height);
+        tempBounds.set(bounds).scale(this.pixelRatio);
+        this.strokeRect(tempBounds.x, tempBounds.y, tempBounds.width, tempBounds.height);
         if (blendMode)
             this.blendMode = 'source-over';
     }
     clearWorld(bounds, ceilPixel) {
-        temp.set(bounds).scale(this.pixelRatio);
+        tempBounds.set(bounds).scale(this.pixelRatio);
         if (ceilPixel)
-            temp.ceil();
-        this.clearRect(temp.x, temp.y, temp.width, temp.height);
+            tempBounds.ceil();
+        this.clearRect(tempBounds.x, tempBounds.y, tempBounds.width, tempBounds.height);
     }
     clipWorld(bounds, ceilPixel) {
         this.beginPath();
-        temp.set(bounds).scale(this.pixelRatio);
+        tempBounds.set(bounds).scale(this.pixelRatio);
         if (ceilPixel)
-            temp.ceil();
-        this.rect(temp.x, temp.y, temp.width, temp.height);
+            tempBounds.ceil();
+        this.rect(tempBounds.x, tempBounds.y, tempBounds.width, tempBounds.height);
         this.clip();
     }
     clear() {
@@ -2127,7 +2096,7 @@ class LeaferCanvasBase extends Canvas {
         const canvas = this.manager ? this.manager.get(this.size) : Creator.canvas(Object.assign({}, this.size));
         canvas.save();
         if (useSameWorldTransform)
-            copy$4(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
+            copy$5(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
         if (useSameSmooth)
             canvas.smooth = this.smooth;
         return canvas;
@@ -2497,10 +2466,10 @@ const EllipseHelper = {
     }
 };
 
-const { M: M$4, m, L: L$5, l, H, h, V, v, C: C$4, c, S, s, Q: Q$3, q, T, t, A, a, Z: Z$4, z, N: N$3, D: D$3, X: X$3, G: G$3, F: F$3, O: O$3, P: P$3, U: U$3 } = PathCommandMap;
+const { M: M$4, m, L: L$5, l, H, h, V, v, C: C$4, c, S, s, Q: Q$3, q, T, t, A, a, Z: Z$4, z, N: N$3, D: D$3, X: X$3, G: G$3, F: F$4, O: O$3, P: P$3, U: U$3 } = PathCommandMap;
 const { rect: rect$1, roundRect: roundRect$2, arcTo: arcTo$3, arc: arc$3, ellipse: ellipse$3, quadraticCurveTo: quadraticCurveTo$1 } = BezierHelper;
 const { ellipticalArc } = EllipseHelper;
-const debug$4 = Debug.get('PathConvert');
+const debug$5 = Debug.get('PathConvert');
 const setEndPoint$1 = {};
 const PathConvert = {
     current: { dot: 0 },
@@ -2712,7 +2681,7 @@ const PathConvert = {
                     y = setEndPoint$1.y;
                     i += 9;
                     break;
-                case F$3:
+                case F$4:
                     curveMode ? ellipse$3(data, old[i + 1], old[i + 2], old[i + 3], old[i + 4], 0, 0, 360, false) : copyData(data, old, i, 5);
                     x = old[i + 1] + old[i + 3];
                     y = old[i + 2];
@@ -2737,7 +2706,7 @@ const PathConvert = {
                     i += 6;
                     break;
                 default:
-                    debug$4.error(`command: ${command} [index:${i}]`, old);
+                    debug$5.error(`command: ${command} [index:${i}]`, old);
                     return data;
             }
             lastCommand = command;
@@ -2761,7 +2730,7 @@ const PathConvert = {
 };
 const { current, pushData, copyData } = PathConvert;
 
-const { M: M$3, L: L$4, C: C$3, Q: Q$2, Z: Z$3, N: N$2, D: D$2, X: X$2, G: G$2, F: F$2, O: O$2, P: P$2, U: U$2 } = PathCommandMap;
+const { M: M$3, L: L$4, C: C$3, Q: Q$2, Z: Z$3, N: N$2, D: D$2, X: X$2, G: G$2, F: F$3, O: O$2, P: P$2, U: U$2 } = PathCommandMap;
 const { getMinDistanceFrom, getRadianFrom } = PointHelper;
 const { tan, min, abs } = Math;
 const startPoint = {};
@@ -2803,7 +2772,7 @@ const PathCommandDataHelper = {
     },
     ellipse(data, x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise) {
         if (rotation === undefined) {
-            data.push(F$2, x, y, radiusX, radiusY);
+            data.push(F$3, x, y, radiusX, radiusY);
         }
         else {
             if (startAngle === undefined)
@@ -2853,6 +2822,7 @@ class PathCreator {
     set path(value) { this.__path = value; }
     get path() { return this.__path; }
     constructor(path) {
+        this.clearPath = this.beginPath;
         this.set(path);
     }
     set(path) {
@@ -2922,8 +2892,8 @@ class PathCreator {
     }
 }
 
-const { M: M$2, L: L$3, C: C$2, Q: Q$1, Z: Z$2, N: N$1, D: D$1, X: X$1, G: G$1, F: F$1, O: O$1, P: P$1, U: U$1 } = PathCommandMap;
-const debug$3 = Debug.get('PathDrawer');
+const { M: M$2, L: L$3, C: C$2, Q: Q$1, Z: Z$2, N: N$1, D: D$1, X: X$1, G: G$1, F: F$2, O: O$1, P: P$1, U: U$1 } = PathCommandMap;
+const debug$4 = Debug.get('PathDrawer');
 const PathDrawer = {
     drawPathByData(drawer, data) {
         if (!data)
@@ -2969,7 +2939,7 @@ const PathDrawer = {
                     drawer.ellipse(data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5] * OneRadian, data[i + 6] * OneRadian, data[i + 7] * OneRadian, data[i + 8]);
                     i += 9;
                     break;
-                case F$1:
+                case F$2:
                     drawer.ellipse(data[i + 1], data[i + 2], data[i + 3], data[i + 4], 0, 0, PI2, false);
                     i += 5;
                     break;
@@ -2986,17 +2956,17 @@ const PathDrawer = {
                     i += 6;
                     break;
                 default:
-                    debug$3.error(`command: ${command} [index:${i}]`, data);
+                    debug$4.error(`command: ${command} [index:${i}]`, data);
                     return;
             }
         }
     }
 };
 
-const { M: M$1, L: L$2, C: C$1, Q, Z: Z$1, N, D, X, G, F, O, P, U } = PathCommandMap;
+const { M: M$1, L: L$2, C: C$1, Q, Z: Z$1, N, D, X, G, F: F$1, O, P, U } = PathCommandMap;
 const { toTwoPointBounds, toTwoPointBoundsByQuadraticCurve, arcTo: arcTo$1, arc, ellipse } = BezierHelper;
-const { addPointBounds, copy: copy$3, addPoint, setPoint, addBounds, toBounds: toBounds$1 } = TwoPointBoundsHelper;
-const debug$2 = Debug.get('PathBounds');
+const { addPointBounds, copy: copy$4, addPoint, setPoint, addBounds, toBounds: toBounds$1 } = TwoPointBoundsHelper;
+const debug$3 = Debug.get('PathBounds');
 let radius, radiusX, radiusY;
 const tempPointBounds = {};
 const setPointBounds = {};
@@ -3068,12 +3038,12 @@ const PathBounds = {
                     break;
                 case G:
                     ellipse(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6], data[i + 7], data[i + 8], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$3(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$4(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 9;
                     break;
-                case F:
+                case F$1:
                     x = data[i + 1];
                     y = data[i + 2];
                     radiusX = data[i + 3];
@@ -3084,7 +3054,7 @@ const PathBounds = {
                     break;
                 case O:
                     arc(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$3(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$4(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 7;
@@ -3099,13 +3069,13 @@ const PathBounds = {
                     break;
                 case U:
                     arcTo$1(null, x, y, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], tempPointBounds, setEndPoint);
-                    i === 0 ? copy$3(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
+                    i === 0 ? copy$4(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds);
                     x = setEndPoint.x;
                     y = setEndPoint.y;
                     i += 6;
                     break;
                 default:
-                    debug$2.error(`command: ${command} [index:${i}]`, data);
+                    debug$3.error(`command: ${command} [index:${i}]`, data);
                     return;
             }
         }
@@ -3191,7 +3161,37 @@ function canvasPatch(drawer) {
     roundRect(drawer);
 }
 
-const debug$1 = Debug.get('TaskProcessor');
+const FileHelper = {
+    opacityTypes: ['png', 'webp', 'svg'],
+    upperCaseTypeMap: {},
+    mineType(type) {
+        if (!type || type.startsWith('image'))
+            return type;
+        if (type === 'jpg')
+            type = 'jpeg';
+        return 'image/' + type;
+    },
+    fileType(filename) {
+        const l = filename.split('.');
+        return l[l.length - 1];
+    },
+    isOpaqueImage(filename) {
+        const type = F.fileType(filename);
+        return ['jpg', 'jpeg'].some(item => item === type);
+    },
+    getExportOptions(options) {
+        switch (typeof options) {
+            case 'object': return options;
+            case 'number': return { quality: options };
+            case 'boolean': return { blob: options };
+            default: return {};
+        }
+    }
+};
+const F = FileHelper;
+F.opacityTypes.forEach(type => F.upperCaseTypeMap[type] = type.toUpperCase());
+
+const debug$2 = Debug.get('TaskProcessor');
 class TaskItem {
     constructor(task) {
         this.parallel = true;
@@ -3206,7 +3206,7 @@ class TaskItem {
                     yield this.task();
             }
             catch (error) {
-                debug$1.error(error);
+                debug$2.error(error);
             }
         });
     }
@@ -3490,6 +3490,7 @@ const ImageManager = {
     },
     destroy() {
         I.map = {};
+        I.recycledList = [];
     }
 };
 const I = ImageManager;
@@ -3604,84 +3605,75 @@ function getNames(object) {
     return Object.getOwnPropertyNames(object);
 }
 
-function defineLeafAttr(target, key, defaultValue, mergeDescriptor) {
+function decorateLeafAttr(defaultValue, descriptorFn) {
+    return (target, key) => defineLeafAttr(target, key, defaultValue, descriptorFn && descriptorFn(key));
+}
+function attr(partDescriptor) {
+    return partDescriptor;
+}
+function defineLeafAttr(target, key, defaultValue, partDescriptor) {
     const defaultDescriptor = {
         get() { return this.__getAttr(key); },
         set(value) { this.__setAttr(key, value); },
         configurable: true,
         enumerable: true
     };
-    defineKey(target, key, Object.assign(defaultDescriptor, mergeDescriptor || {}));
+    defineKey(target, key, Object.assign(defaultDescriptor, partDescriptor || {}));
     defineDataProcessor(target, key, defaultValue);
 }
 function dataType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue);
-    };
+    return decorateLeafAttr(defaultValue);
 }
-function positionType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.matrixChanged || this.__layout.matrixChange();
-            }
-        });
-    };
+function positionType(defaultValue, checkFiniteNumber) {
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value, checkFiniteNumber);
+            this.__layout.matrixChanged || this.__layout.matrixChange();
+        }
+    }));
 }
 function autoLayoutType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.matrixChanged || this.__layout.matrixChange();
-                this.__hasAutoLayout = !!value;
-                if (!this.__local)
-                    this.__layout.createLocal();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.matrixChanged || this.__layout.matrixChange();
+            this.__hasAutoLayout = !!value;
+            if (!this.__local)
+                this.__layout.createLocal();
+        }
+    }));
 }
-function scaleType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.scaleChanged || this.__layout.scaleChange();
-            }
-        });
-    };
+function scaleType(defaultValue, checkFiniteNumber) {
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value, checkFiniteNumber);
+            this.__layout.scaleChanged || this.__layout.scaleChange();
+        }
+    }));
 }
-function rotationType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.rotationChanged || this.__layout.rotationChange();
-            }
-        });
-    };
+function rotationType(defaultValue, checkFiniteNumber) {
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value, checkFiniteNumber);
+            this.__layout.rotationChanged || this.__layout.rotationChange();
+        }
+    }));
 }
-function boundsType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                doBoundsType(this);
-            }
-        });
-    };
+function boundsType(defaultValue, checkFiniteNumber) {
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value, checkFiniteNumber) && doBoundsType(this);
+        }
+    }));
 }
 function naturalBoundsType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                doBoundsType(this);
-                this.__.__removeNaturalSize();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            doBoundsType(this);
+            this.__.__removeNaturalSize();
+        }
+    }));
 }
 function doBoundsType(leaf) {
     leaf.__layout.boxChanged || leaf.__layout.boxChange();
@@ -3689,27 +3681,22 @@ function doBoundsType(leaf) {
         leaf.__layout.matrixChanged || leaf.__layout.matrixChange();
 }
 function pathInputType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                if (this.__.__pathInputed !== 2)
-                    this.__.__pathInputed = value ? 1 : 0;
-                this.__setAttr(key, value);
-                doBoundsType(this);
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            if (this.__.__pathInputed !== 2)
+                this.__.__pathInputed = value ? 1 : 0;
+            this.__setAttr(key, value);
+            doBoundsType(this);
+        }
+    }));
 }
 const pathType = boundsType;
 function affectStrokeBoundsType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                doStrokeType(this);
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value) && doStrokeType(this);
+        }
+    }));
 }
 function doStrokeType(leaf) {
     leaf.__layout.strokeChanged || leaf.__layout.strokeChange();
@@ -3718,91 +3705,75 @@ function doStrokeType(leaf) {
 }
 const strokeType = affectStrokeBoundsType;
 function affectRenderBoundsType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.renderChanged || this.__layout.renderChange();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.renderChanged || this.__layout.renderChange();
+        }
+    }));
 }
 function surfaceType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.surfaceChanged || this.__layout.surfaceChange();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.surfaceChanged || this.__layout.surfaceChange();
+        }
+    }));
 }
 function opacityType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.opacityChanged || this.__layout.opacityChange();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.opacityChanged || this.__layout.opacityChange();
+        }
+    }));
 }
 function sortType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.surfaceChanged || this.__layout.surfaceChange();
-                this.waitParent(() => { this.parent.__layout.childrenSortChange(); });
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.surfaceChanged || this.__layout.surfaceChange();
+            this.waitParent(() => { this.parent.__layout.childrenSortChange(); });
+        }
+    }));
 }
 function maskType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.__layout.boxChanged || this.__layout.boxChange();
-                this.waitParent(() => { this.parent.__updateMask(value); });
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.__layout.boxChanged || this.__layout.boxChange();
+            this.waitParent(() => { this.parent.__updateMask(value); });
+        }
+    }));
 }
 function eraserType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                this.waitParent(() => { this.parent.__updateEraser(value); });
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            this.waitParent(() => { this.parent.__updateEraser(value); });
+        }
+    }));
 }
 function hitType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                if (Debug.showHitView) {
-                    this.__layout.surfaceChanged || this.__layout.surfaceChange();
-                }
-                if (this.leafer)
-                    this.leafer.updateCursor();
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            if (Debug.showHitView) {
+                this.__layout.surfaceChanged || this.__layout.surfaceChange();
             }
-        });
-    };
+            if (this.leafer)
+                this.leafer.updateCursor();
+        }
+    }));
 }
 function cursorType(defaultValue) {
-    return (target, key) => {
-        defineLeafAttr(target, key, defaultValue, {
-            set(value) {
-                this.__setAttr(key, value);
-                if (this.leafer)
-                    this.leafer.updateCursor();
-            }
-        });
-    };
+    return decorateLeafAttr(defaultValue, (key) => attr({
+        set(value) {
+            this.__setAttr(key, value);
+            if (this.leafer)
+                this.leafer.updateCursor();
+        }
+    }));
 }
 function dataProcessor(processor) {
     return (target, _key) => {
@@ -3865,7 +3836,7 @@ function defineDataProcessor(target, key, defaultValue) {
     Object.defineProperty(data, key, property);
 }
 
-const debug = new Debug('rewrite');
+const debug$1 = new Debug('rewrite');
 const list = [];
 const excludeNames = ['destroy', 'constructor'];
 function rewrite(method) {
@@ -3882,7 +3853,7 @@ function doRewrite(error) {
     if (list.length) {
         list.forEach(item => {
             if (error)
-                debug.error(item.name, '需在Class上装饰@rewriteAble()');
+                debug$1.error(item.name, '需在Class上装饰@rewriteAble()');
             item.run();
         });
         list.length = 0;
@@ -3918,7 +3889,7 @@ function registerUIEvent() {
     };
 }
 
-const { copy: copy$2, toInnerPoint: toInnerPoint$1, scaleOfOuter, rotateOfOuter, skewOfOuter, multiplyParent: multiplyParent$2, divideParent, getLayout } = MatrixHelper;
+const { copy: copy$3, toInnerPoint: toInnerPoint$1, scaleOfOuter, rotateOfOuter, skewOfOuter, multiplyParent: multiplyParent$2, divideParent, getLayout } = MatrixHelper;
 const matrix = {};
 const LeafHelper = {
     updateAllMatrix(leaf, checkAutoLayout, waitAutoLayout) {
@@ -3997,7 +3968,7 @@ const LeafHelper = {
         L.zoomOfLocal(t, getTempLocal(t, origin), scaleX, scaleY, resize);
     },
     zoomOfLocal(t, origin, scaleX, scaleY = scaleX, resize) {
-        copy$2(matrix, t.__localMatrix);
+        copy$3(matrix, t.__localMatrix);
         scaleOfOuter(matrix, origin, scaleX, scaleY);
         moveByMatrix(t, matrix);
         t.scaleResize(scaleX, scaleY, resize !== true);
@@ -4006,7 +3977,7 @@ const LeafHelper = {
         L.rotateOfLocal(t, getTempLocal(t, origin), angle);
     },
     rotateOfLocal(t, origin, angle) {
-        copy$2(matrix, t.__localMatrix);
+        copy$3(matrix, t.__localMatrix);
         rotateOfOuter(matrix, origin, angle);
         moveByMatrix(t, matrix);
         t.rotation = MathHelper.formatRotation(t.rotation + angle);
@@ -4015,19 +3986,19 @@ const LeafHelper = {
         L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize);
     },
     skewOfLocal(t, origin, skewX, skewY = 0, resize) {
-        copy$2(matrix, t.__localMatrix);
+        copy$3(matrix, t.__localMatrix);
         skewOfOuter(matrix, origin, skewX, skewY);
         L.setTransform(t, matrix, resize);
     },
     transformWorld(t, transform, resize) {
-        copy$2(matrix, t.worldTransform);
+        copy$3(matrix, t.worldTransform);
         multiplyParent$2(matrix, transform);
         if (t.parent)
             divideParent(matrix, t.parent.worldTransform);
         L.setTransform(t, matrix, resize);
     },
     transform(t, transform, resize) {
-        copy$2(matrix, t.localTransform);
+        copy$3(matrix, t.localTransform);
         multiplyParent$2(matrix, transform);
         L.setTransform(t, matrix, resize);
     },
@@ -4041,7 +4012,7 @@ const LeafHelper = {
         t.set(layout);
     },
     getRelativeWorld(t, relative, temp) {
-        copy$2(matrix, t.worldTransform);
+        copy$3(matrix, t.worldTransform);
         divideParent(matrix, relative.worldTransform);
         return temp ? matrix : Object.assign({}, matrix);
     },
@@ -4183,7 +4154,7 @@ const { pushAllChildBranch, pushAllBranchStack, updateBoundsByBranchStack } = Br
 
 const WaitHelper = {
     run(wait) {
-        if (wait.length) {
+        if (wait && wait.length) {
             const len = wait.length;
             for (let i = 0; i < len; i++) {
                 wait[i]();
@@ -4194,7 +4165,7 @@ const WaitHelper = {
 };
 
 const { getRelativeWorld: getRelativeWorld$1 } = LeafHelper;
-const { toOuterOf: toOuterOf$2, getPoints, copy: copy$1 } = BoundsHelper;
+const { toOuterOf: toOuterOf$2, getPoints, copy: copy$2 } = BoundsHelper;
 class LeafLayout {
     get strokeBounds() { return this._strokeBounds || this.boxBounds; }
     get renderBounds() { return this._renderBounds || this.boxBounds; }
@@ -4339,7 +4310,7 @@ class LeafLayout {
                 matrix = getRelativeWorld$1(leaf, relative, true);
         }
         const layoutBounds = MatrixHelper.getLayout(matrix);
-        copy$1(layoutBounds, bounds);
+        copy$2(layoutBounds, bounds);
         PointHelper.copy(layoutBounds, point);
         if (unscale) {
             const { scaleX, scaleY } = layoutBounds;
@@ -4733,10 +4704,16 @@ LeaferEvent.STOP = 'leafer.stop';
 LeaferEvent.RESTART = 'leafer.restart';
 LeaferEvent.END = 'leafer.end';
 
+const { isFinite } = Number;
+const debug = Debug.get('setAttr');
 const LeafDataProxy = {
-    __setAttr(name, newValue) {
+    __setAttr(name, newValue, checkFiniteNumber) {
         if (this.leafer && this.leafer.created) {
             const oldValue = this.__.__getInput(name);
+            if (checkFiniteNumber && !isFinite(newValue) && newValue !== undefined) {
+                debug.warn(this.innerName, name, newValue);
+                newValue = undefined;
+            }
             if (typeof newValue === 'object' || oldValue !== newValue) {
                 this.__[name] = newValue;
                 if (this.__proxyData)
@@ -4751,12 +4728,17 @@ const LeafDataProxy = {
                         this.emitEvent(event);
                 }
                 this.leafer.emitEvent(event);
+                return true;
+            }
+            else {
+                return false;
             }
         }
         else {
             this.__[name] = newValue;
             if (this.__proxyData)
                 this.setProxyAttr(name, newValue);
+            return true;
         }
     },
     __getAttr(name) {
@@ -4794,7 +4776,7 @@ const LeafMatrix = {
 
 const { updateMatrix, updateAllMatrix, hasParentAutoLayout } = LeafHelper;
 const { updateBounds } = BranchHelper;
-const { toOuterOf: toOuterOf$1, copyAndSpread } = BoundsHelper;
+const { toOuterOf: toOuterOf$1, copyAndSpread, copy: copy$1 } = BoundsHelper;
 const { toBounds } = PathBounds;
 const LeafBounds = {
     __updateWorldBounds() {
@@ -4912,7 +4894,8 @@ const LeafBounds = {
         copyAndSpread(this.__layout.strokeBounds, this.__layout.boxBounds, this.__layout.strokeSpread);
     },
     __updateRenderBounds() {
-        copyAndSpread(this.__layout.renderBounds, this.__layout.strokeBounds, this.__layout.renderSpread);
+        const { renderSpread, strokeBounds, renderBounds } = this.__layout;
+        renderSpread > 0 ? copyAndSpread(renderBounds, strokeBounds, renderSpread) : copy$1(renderBounds, strokeBounds);
     },
 };
 
@@ -5098,7 +5081,7 @@ let Leaf = class Leaf {
     toString() {
         return JSON.stringify(this.toJSON());
     }
-    __setAttr(_attrName, _newValue) { }
+    __setAttr(_attrName, _newValue) { return true; }
     __getAttr(_attrName) { return undefined; }
     setProxyAttr(_attrName, _newValue) { }
     getProxyAttr(_attrName) { return undefined; }
@@ -5282,24 +5265,16 @@ let Leaf = class Leaf {
     __scaleResize(_scaleX, _scaleY) { }
     __hitWorld(_point) { return true; }
     __hit(_local) { return true; }
-    __hitFill(inner, windingRule) {
-        var _a;
-        return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitFill(inner, windingRule);
-    }
-    __hitStroke(inner, strokeWidth) {
-        var _a;
-        return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitStroke(inner, strokeWidth);
-    }
-    __drawHitPath(canvas) {
-        if (canvas)
-            this.__drawRenderPath(canvas);
-    }
+    __hitFill(_inner) { return true; }
+    __hitStroke(_inner, _strokeWidth) { return true; }
+    __hitPixel(_inner) { return true; }
+    __drawHitPath(_canvas) { }
     __updateHitCanvas() { }
     __render(_canvas, _options) { }
     __drawFast(_canvas, _options) { }
     __draw(_canvas, _options) { }
     __clip(_canvas, _options) { }
-    __renderShape(_canvas, _options) { }
+    __renderShape(_canvas, _options, _ignoreFill, _ignoreStroke) { }
     __updateWorldOpacity() { }
     __updateChange() { }
     __drawPath(_canvas) { }
@@ -5638,4 +5613,4 @@ class LeafLevelList {
     }
 }
 
-export { AnimateEvent, Answer, AroundHelper, AutoBounds, BezierHelper, Bounds, BoundsHelper, Branch, BranchHelper, BranchRender, CanvasManager, ChildEvent, Creator, DataHelper, Debug, Direction4, Direction9, EllipseHelper, Event, EventCreator, FileHelper, ImageEvent, ImageManager, IncrementId, LayoutEvent, Leaf, LeafBounds, LeafBoundsHelper, LeafData, LeafDataProxy, LeafEventer, LeafHelper, LeafLayout, LeafLevelList, LeafList, LeafMatrix, LeafRender, LeaferCanvasBase, LeaferEvent, LeaferImage, MathHelper, Matrix, MatrixHelper, NeedConvertToCanvasCommandMap, OneRadian, PI2, PI_2, PathBounds, PathCommandDataHelper, PathCommandMap, PathConvert, PathCorner, PathCreator, PathDrawer, PathHelper, PathNumberCommandLengthMap, PathNumberCommandMap, Platform, Point, PointHelper, PropertyEvent, RectHelper, RenderEvent, ResizeEvent, Run, StringNumberMap, TaskItem, TaskProcessor, TwoPointBoundsHelper, UICreator, WaitHelper, WatchEvent, affectRenderBoundsType, affectStrokeBoundsType, autoLayoutType, boundsType, canvasPatch, canvasSizeAttrs, cursorType, dataProcessor, dataType, defineDataProcessor, defineKey, defineLeafAttr, doBoundsType, doStrokeType, eraserType, getBoundsData, getDescriptor, getMatrixData, getPointData, hitType, layoutProcessor, maskType, naturalBoundsType, opacityType, pathInputType, pathType, pen, positionType, registerUI, registerUIEvent, rewrite, rewriteAble, rotationType, scaleType, sortType, strokeType, surfaceType, useModule };
+export { AnimateEvent, Answer, AroundHelper, AutoBounds, BezierHelper, Bounds, BoundsHelper, Branch, BranchHelper, BranchRender, CanvasManager, ChildEvent, Creator, DataHelper, Debug, Direction4, Direction9, EllipseHelper, Event, EventCreator, FileHelper, ImageEvent, ImageManager, IncrementId, LayoutEvent, Leaf, LeafBounds, LeafBoundsHelper, LeafData, LeafDataProxy, LeafEventer, LeafHelper, LeafLayout, LeafLevelList, LeafList, LeafMatrix, LeafRender, LeaferCanvasBase, LeaferEvent, LeaferImage, MathHelper, Matrix, MatrixHelper, NeedConvertToCanvasCommandMap, OneRadian, PI2, PI_2, PathBounds, PathCommandDataHelper, PathCommandMap, PathConvert, PathCorner, PathCreator, PathDrawer, PathHelper, PathNumberCommandLengthMap, PathNumberCommandMap, Platform, Point, PointHelper, PropertyEvent, RectHelper, RenderEvent, ResizeEvent, Run, StringNumberMap, TaskItem, TaskProcessor, TwoPointBoundsHelper, UICreator, WaitHelper, WatchEvent, affectRenderBoundsType, affectStrokeBoundsType, attr, autoLayoutType, boundsType, canvasPatch, canvasSizeAttrs, cursorType, dataProcessor, dataType, decorateLeafAttr, defineDataProcessor, defineKey, defineLeafAttr, doBoundsType, doStrokeType, emptyData, eraserType, getBoundsData, getDescriptor, getMatrixData, getPointData, hitType, layoutProcessor, maskType, naturalBoundsType, opacityType, pathInputType, pathType, pen, positionType, registerUI, registerUIEvent, rewrite, rewriteAble, rotationType, scaleType, sortType, strokeType, surfaceType, tempBounds, tempMatrix, tempPoint$2 as tempPoint, useModule };