@leafer-editor/worker 1.2.1 → 1.3.0

package/dist/worker.js

@@ -1405,21 +1405,24 @@ var LeaferUI = (function (exports) {
     };
     const R = Run;
 
+    const check = [];
     const Plugin = {
         list: {},
-        add(name) {
+        add(name, ...needPlugins) {
             this.list[name] = true;
+            check.push(...needPlugins);
         },
-        check(name, tip) {
+        has(name, tip) {
             const rs = this.list[name];
             if (!rs && tip)
                 this.need(name);
             return rs;
         },
         need(name) {
-            console.error('need plugin: @leafer-in/' + name);
+            console.error('need plugin: ' + (name.includes('-x') ? '' : '@leafer-in/') + name);
         }
     };
+    setTimeout(() => check.forEach(name => Plugin.has(name, true)));
 
     const debug$g = Debug.get('UICreator');
     const UICreator = {
@@ -2050,11 +2053,11 @@ var LeaferUI = (function (exports) {
         toBlob(_type, _quality) { return undefined; }
         toDataURL(_type, _quality) { return undefined; }
         saveAs(_filename, _quality) { return undefined; }
-        resize(size) {
+        resize(size, safeResize = true) {
             if (this.isSameSize(size))
                 return;
             let takeCanvas;
-            if (this.context && !this.unreal && this.width) {
+            if (this.context && !this.unreal && safeResize && this.width) {
                 takeCanvas = this.getSameCanvas();
                 takeCanvas.copyWorld(this);
             }
@@ -4256,18 +4259,21 @@ var LeaferUI = (function (exports) {
             L$3.setTransform(t, matrix$3, resize);
         },
         setTransform(t, transform, resize) {
-            const layout = getLayout(transform, t.origin && L$3.getInnerOrigin(t, t.origin), t.around && L$3.getInnerOrigin(t, t.around));
+            const data = t.__, originPoint = data.origin && L$3.getInnerOrigin(t, data.origin);
+            const layout = getLayout(transform, originPoint, data.around && L$3.getInnerOrigin(t, data.around));
             if (resize) {
-                const scaleX = layout.scaleX / t.scaleX;
-                const scaleY = layout.scaleY / t.scaleY;
-                delete layout.scaleX;
-                delete layout.scaleY;
+                const scaleX = layout.scaleX / t.scaleX, scaleY = layout.scaleY / t.scaleY;
+                delete layout.scaleX, delete layout.scaleY;
+                if (originPoint) {
+                    BoundsHelper.scale(t.boxBounds, Math.abs(scaleX), Math.abs(scaleY));
+                    const changedPoint = L$3.getInnerOrigin(t, data.origin);
+                    PointHelper.move(layout, originPoint.x - changedPoint.x, originPoint.y - changedPoint.y);
+                }
                 t.set(layout);
-                t.scaleResize(scaleX, scaleY, resize !== true);
+                t.scaleResize(scaleX, scaleY, false);
             }
-            else {
+            else
                 t.set(layout);
-            }
         },
         getFlipTransform(t, axis) {
             const m = getMatrixData();
@@ -4808,7 +4814,6 @@ var LeaferUI = (function (exports) {
             }
         }
     }
-    LayoutEvent.CHECK_UPDATE = 'layout.check_update';
     LayoutEvent.REQUEST = 'layout.request';
     LayoutEvent.START = 'layout.start';
     LayoutEvent.BEFORE = 'layout.before';
@@ -4950,14 +4955,15 @@ var LeaferUI = (function (exports) {
             if (list) {
                 let item;
                 for (let i = 0, len = list.length; i < len; i++) {
-                    item = list[i];
-                    item.listener(event);
-                    if (item.once) {
-                        this.off(type, item.listener, capture);
-                        i--, len--;
+                    if (item = list[i]) {
+                        item.listener(event);
+                        if (item.once) {
+                            this.off(type, item.listener, capture);
+                            i--, len--;
+                        }
+                        if (event && event.isStopNow)
+                            break;
                     }
-                    if (event && event.isStopNow)
-                        break;
                 }
             }
             this.syncEventer && this.syncEventer.emitEvent(event, capture);
@@ -6004,7 +6010,7 @@ var LeaferUI = (function (exports) {
         }
     }
 
-    const version = "1.2.1";
+    const version = "1.3.0";
 
     class LeaferCanvas extends LeaferCanvasBase {
         get allowBackgroundColor() { return true; }
@@ -6072,6 +6078,7 @@ var LeaferUI = (function (exports) {
     }
     Platform.name = 'web';
     Platform.isWorker = true;
+    Platform.backgrounder = true;
     Platform.requestRender = function (render) { requestAnimationFrame(render); };
     defineKey(Platform, 'devicePixelRatio', { get() { return 1; } });
     const { userAgent } = navigator;
@@ -6804,143 +6811,26 @@ var LeaferUI = (function (exports) {
         }
     }
 
-    const { Yes: Yes$1, NoAndSkip: NoAndSkip$1, YesAndSkip: YesAndSkip$1 } = exports.Answer;
-    const idCondition = {}, classNameCondition = {}, tagCondition = {};
     class Selector {
         constructor(target, userConfig) {
             this.config = {};
-            this.innerIdMap = {};
-            this.idMap = {};
-            this.methods = {
-                id: (leaf, name) => leaf.id === name ? (this.target && (this.idMap[name] = leaf), 1) : 0,
-                innerId: (leaf, innerId) => leaf.innerId === innerId ? (this.target && (this.innerIdMap[innerId] = leaf), 1) : 0,
-                className: (leaf, name) => leaf.className === name ? 1 : 0,
-                tag: (leaf, name) => leaf.__tag === name ? 1 : 0,
-                tags: (leaf, nameMap) => nameMap[leaf.__tag] ? 1 : 0
-            };
-            this.target = target;
             if (userConfig)
                 this.config = DataHelper.default(userConfig, this.config);
-            this.picker = new Picker(target, this);
-            if (target)
-                this.__listenEvents();
-        }
-        getBy(condition, branch, one, options) {
-            switch (typeof condition) {
-                case 'number':
-                    const leaf = this.getByInnerId(condition, branch);
-                    return one ? leaf : (leaf ? [leaf] : []);
-                case 'string':
-                    switch (condition[0]) {
-                        case '#':
-                            idCondition.id = condition.substring(1), condition = idCondition;
-                            break;
-                        case '.':
-                            classNameCondition.className = condition.substring(1), condition = classNameCondition;
-                            break;
-                        default:
-                            tagCondition.tag = condition, condition = tagCondition;
-                    }
-                case 'object':
-                    if (condition.id !== undefined) {
-                        const leaf = this.getById(condition.id, branch);
-                        return one ? leaf : (leaf ? [leaf] : []);
-                    }
-                    else if (condition.tag) {
-                        const { tag } = condition, isArray = tag instanceof Array;
-                        return this.getByMethod(isArray ? this.methods.tags : this.methods.tag, branch, one, isArray ? DataHelper.toMap(tag) : tag);
-                    }
-                    else {
-                        return this.getByMethod(this.methods.className, branch, one, condition.className);
-                    }
-                case 'function':
-                    return this.getByMethod(condition, branch, one, options);
-            }
+            this.picker = new Picker(this.target = target, this);
+            this.finder = Creator.finder && Creator.finder();
         }
         getByPoint(hitPoint, hitRadius, options) {
-            if (Platform.name === 'node' && this.target)
-                this.target.emit(LayoutEvent.CHECK_UPDATE);
+            if (Platform.backgrounder && this.target)
+                this.target.updateLayout();
             return this.picker.getByPoint(hitPoint, hitRadius, options);
         }
-        getByInnerId(innerId, branch) {
-            const cache = this.innerIdMap[innerId];
-            if (cache)
-                return cache;
-            this.eachFind(this.toChildren(branch), this.methods.innerId, null, innerId);
-            return this.findLeaf;
-        }
-        getById(id, branch) {
-            const cache = this.idMap[id];
-            if (cache && LeafHelper.hasParent(cache, branch || this.target))
-                return cache;
-            this.eachFind(this.toChildren(branch), this.methods.id, null, id);
-            return this.findLeaf;
-        }
-        getByClassName(className, branch) {
-            return this.getByMethod(this.methods.className, branch, false, className);
-        }
-        getByTag(tag, branch) {
-            return this.getByMethod(this.methods.tag, branch, false, tag);
-        }
-        getByMethod(method, branch, one, options) {
-            const list = one ? null : [];
-            this.eachFind(this.toChildren(branch), method, list, options);
-            return list || this.findLeaf;
-        }
-        eachFind(children, method, list, options) {
-            let child, result;
-            for (let i = 0, len = children.length; i < len; i++) {
-                child = children[i];
-                result = method(child, options);
-                if (result === Yes$1 || result === YesAndSkip$1) {
-                    if (list) {
-                        list.push(child);
-                    }
-                    else {
-                        this.findLeaf = child;
-                        return;
-                    }
-                }
-                if (child.isBranch && result < NoAndSkip$1)
-                    this.eachFind(child.children, method, list, options);
-            }
-        }
-        toChildren(branch) {
-            this.findLeaf = null;
-            return [branch || this.target];
-        }
-        __onRemoveChild(event) {
-            const { id, innerId } = event.child;
-            if (this.idMap[id])
-                delete this.idMap[id];
-            if (this.innerIdMap[innerId])
-                delete this.innerIdMap[innerId];
-        }
-        __checkIdChange(event) {
-            if (event.attrName === 'id') {
-                const id = event.oldValue;
-                if (this.idMap[id])
-                    delete this.idMap[id];
-            }
-        }
-        __listenEvents() {
-            this.__eventIds = [
-                this.target.on_(ChildEvent.REMOVE, this.__onRemoveChild, this),
-                this.target.on_(PropertyEvent.CHANGE, this.__checkIdChange, this)
-            ];
-        }
-        __removeListenEvents() {
-            this.target.off_(this.__eventIds);
-            this.__eventIds.length = 0;
+        getBy(condition, branch, one, options) {
+            return this.finder ? this.finder.getBy(condition, branch, one, options) : Plugin.need('find');
         }
         destroy() {
-            if (this.__eventIds.length) {
-                this.__removeListenEvents();
-                this.picker.destroy();
-                this.findLeaf = null;
-                this.innerIdMap = {};
-                this.idMap = {};
-            }
+            this.picker.destroy();
+            if (this.finder)
+                this.finder.destroy();
         }
     }
 
@@ -7436,25 +7326,27 @@ var LeaferUI = (function (exports) {
         }
         reset(_data) { }
         set(data, transition) {
-            if (transition) {
-                if (transition === 'temp') {
-                    this.lockNormalStyle = true;
-                    Object.assign(this, data);
-                    this.lockNormalStyle = false;
+            if (data) {
+                if (transition) {
+                    if (transition === 'temp') {
+                        this.lockNormalStyle = true;
+                        Object.assign(this, data);
+                        this.lockNormalStyle = false;
+                    }
+                    else
+                        this.animate(data, transition);
                 }
                 else
-                    this.animate(data, transition);
+                    Object.assign(this, data);
             }
-            else
-                Object.assign(this, data);
         }
         get(name) {
             return typeof name === 'string' ? this.__.__getInput(name) : this.__.__getInputData(name);
         }
         createProxyData() { return undefined; }
-        find(_condition, _options) { return undefined; }
+        find(_condition, _options) { return Plugin.need('find'); }
         findTag(tag) { return this.find({ tag }); }
-        findOne(_condition, _options) { return undefined; }
+        findOne(_condition, _options) { return Plugin.need('find'); }
         findId(id) { return this.findOne({ id }); }
         getPath(curve, pathForRender) {
             this.__layout.update();
@@ -7506,9 +7398,9 @@ var LeaferUI = (function (exports) {
         animate(_keyframe, _options, _type, _isTemp) {
             return Plugin.need('animate');
         }
-        killAnimate(_type) { }
-        export(filename, options) {
-            return Export.export(this, filename, options);
+        killAnimate(_type, _killStyle) { }
+        export(_filename, _options) {
+            return Plugin.need('export');
         }
         clone(data) {
             const json = this.toJSON();
@@ -7754,16 +7646,18 @@ var LeaferUI = (function (exports) {
                 this.children = [];
         }
         set(data, transition) {
-            if (data.children) {
-                const { children } = data;
-                delete data.children;
-                this.children ? this.clear() : this.__setBranch();
-                super.set(data, transition);
-                children.forEach(child => this.add(child));
-                data.children = children;
+            if (data) {
+                if (data.children) {
+                    const { children } = data;
+                    delete data.children;
+                    this.children ? this.clear() : this.__setBranch();
+                    super.set(data, transition);
+                    children.forEach(child => this.add(child));
+                    data.children = children;
+                }
+                else
+                    super.set(data, transition);
             }
-            else
-                super.set(data, transition);
         }
         toJSON(options) {
             const data = super.toJSON(options);
@@ -8026,6 +7920,8 @@ var LeaferUI = (function (exports) {
                     this.requestRender();
                 }
             }
+            else
+                this.requestRender();
         }
         __checkViewCompleted(emit = true) {
             this.nextRender(() => {
@@ -8099,9 +7995,6 @@ var LeaferUI = (function (exports) {
             this.canvas && this.canvas.updateClientBounds();
         }
         receiveEvent(_event) { }
-        __checkUpdateLayout() {
-            this.__layout.update();
-        }
         emitLeafer(type) {
             this.emitEvent(new LeaferEvent(type, this));
         }
@@ -8112,7 +8005,7 @@ var LeaferUI = (function (exports) {
             this.once(LayoutEvent.END, () => this.__onReady());
             this.once(RenderEvent.START, () => this.__onCreated());
             this.once(RenderEvent.END, () => this.__onViewReady());
-            this.__eventIds.push(this.on_(WatchEvent.DATA, this.__onWatchData, this), this.on_(RenderEvent.NEXT, this.__onNextRender, this), this.on_(LayoutEvent.CHECK_UPDATE, this.__checkUpdateLayout, this));
+            this.__eventIds.push(this.on_(WatchEvent.DATA, this.__onWatchData, this), this.on_(RenderEvent.NEXT, this.__onNextRender, this));
         }
         __removeListenEvents() {
             this.off_(this.__eventIds);
@@ -8177,7 +8070,7 @@ var LeaferUI = (function (exports) {
     ], exports.Rect);
 
     const { copy: copy$6, add, includes: includes$1 } = BoundsHelper;
-    const rect$1 = exports.Rect.prototype, group$1 = exports.Group.prototype;
+    const rect$1 = exports.Rect.prototype, group = exports.Group.prototype;
     const childrenRenderBounds = {};
     exports.Box = class Box extends exports.Group {
         get __tag() { return 'Box'; }
@@ -8287,7 +8180,7 @@ var LeaferUI = (function (exports) {
         rewrite(rect$1.__render)
     ], exports.Box.prototype, "__renderRect", null);
     __decorate([
-        rewrite(group$1.__render)
+        rewrite(group.__render)
     ], exports.Box.prototype, "__renderGroup", null);
     exports.Box = __decorate([
         rewriteAble(),
@@ -8591,10 +8484,10 @@ var LeaferUI = (function (exports) {
         __updateSize() {
             const { canvas } = this;
             if (canvas) {
-                const { smooth } = this.__;
+                const { smooth, safeResize } = this.__;
+                canvas.resize(this.__, safeResize);
                 if (canvas.smooth !== smooth)
                     canvas.smooth = smooth;
-                canvas.resize(this.__);
             }
         }
         destroy() {
@@ -8620,6 +8513,9 @@ var LeaferUI = (function (exports) {
     __decorate([
         resizeType(true)
     ], exports.Canvas.prototype, "smooth", void 0);
+    __decorate([
+        dataType(false)
+    ], exports.Canvas.prototype, "safeResize", void 0);
     __decorate([
         resizeType()
     ], exports.Canvas.prototype, "contextSettings", void 0);
@@ -8765,6 +8661,9 @@ var LeaferUI = (function (exports) {
     __decorate([
         boundsType(0)
     ], exports.Text.prototype, "paraSpacing", void 0);
+    __decorate([
+        boundsType('x')
+    ], exports.Text.prototype, "writingMode", void 0);
     __decorate([
         boundsType('left')
     ], exports.Text.prototype, "textAlign", void 0);
@@ -8951,8 +8850,8 @@ var LeaferUI = (function (exports) {
             this.children.forEach(leafer => leafer.resize(event));
             super.__onResize(event);
         }
-        __checkUpdateLayout() {
-            this.children.forEach(leafer => leafer.__layout.update());
+        updateLayout() {
+            this.children.forEach(leafer => leafer.updateLayout());
         }
         __getChildConfig(userConfig) {
             let config = Object.assign({}, this.config);
@@ -10029,8 +9928,8 @@ var LeaferUI = (function (exports) {
         this.__drawRenderPath(canvas); };
 
     const matrix$2 = new Matrix();
-    const ui$3 = exports.UI.prototype;
-    ui$3.__updateHitCanvas = function () {
+    const ui$2 = exports.UI.prototype;
+    ui$2.__updateHitCanvas = function () {
         const data = this.__, { hitCanvasManager } = this.leafer;
         const isHitPixelFill = (data.__pixelFill || data.__isCanvas) && data.hitFill === 'pixel';
         const isHitPixelStroke = data.__pixelStroke && data.hitStroke === 'pixel';
@@ -10057,7 +9956,7 @@ var LeaferUI = (function (exports) {
         this.__drawHitPath(h);
         h.setStrokeOptions(data);
     };
-    ui$3.__hit = function (inner) {
+    ui$2.__hit = function (inner) {
         if (Platform.name === 'miniapp')
             this.__drawHitPath(this.__hitCanvas);
         const data = this.__;
@@ -10097,31 +9996,23 @@ var LeaferUI = (function (exports) {
         return hitWidth ? this.__hitStroke(inner, hitWidth) : false;
     };
 
-    const ui$2 = exports.UI.prototype, rect = exports.Rect.prototype, box$1 = exports.Box.prototype;
+    const ui$1 = exports.UI.prototype, rect = exports.Rect.prototype, box$1 = exports.Box.prototype;
     rect.__updateHitCanvas = box$1.__updateHitCanvas = function () {
         if (this.stroke || this.cornerRadius || ((this.fill || this.__.__isCanvas) && this.hitFill === 'pixel') || this.hitStroke === 'all')
-            ui$2.__updateHitCanvas.call(this);
+            ui$1.__updateHitCanvas.call(this);
         else if (this.__hitCanvas)
             this.__hitCanvas = null;
     };
     rect.__hitFill = box$1.__hitFill = function (inner) {
-        return this.__hitCanvas ? ui$2.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
+        return this.__hitCanvas ? ui$1.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
     };
 
-    const ui$1 = exports.UI.prototype, group = exports.Group.prototype;
     function getSelector(ui) {
         return ui.leafer ? ui.leafer.selector : (Platform.selector || (Platform.selector = Creator.selector()));
     }
-    ui$1.find = function (condition, options) {
-        return getSelector(this).getBy(condition, this, false, options);
-    };
-    ui$1.findOne = function (condition, options) {
-        return getSelector(this).getBy(condition, this, true, options);
-    };
-    group.pick = function (hitPoint, options) {
-        this.__layout.update();
-        if (!options)
-            options = {};
+    exports.Group.prototype.pick = function (hitPoint, options) {
+        this.leafer || this.updateLayout();
+        options || (options = emptyData);
         return getSelector(this).getByPoint(hitPoint, options.hitRadius || 0, Object.assign(Object.assign({}, options), { target: this }));
     };
 
@@ -11625,197 +11516,12 @@ var LeaferUI = (function (exports) {
         string
     };
 
-    const { setPoint: setPoint$2, addPoint, toBounds } = TwoPointBoundsHelper;
-    function getTrimBounds(canvas) {
-        const { width, height } = canvas.view;
-        const { data } = canvas.context.getImageData(0, 0, width, height);
-        let x, y, pointBounds, index = 0;
-        for (let i = 0; i < data.length; i += 4) {
-            if (data[i + 3] !== 0) {
-                x = index % width;
-                y = (index - x) / width;
-                pointBounds ? addPoint(pointBounds, x, y) : setPoint$2(pointBounds = {}, x, y);
-            }
-            index++;
-        }
-        const bounds = new Bounds();
-        toBounds(pointBounds, bounds);
-        return bounds.scale(1 / canvas.pixelRatio).ceil();
-    }
-
-    const ExportModule = {
-        export(leaf, filename, options) {
-            this.running = true;
-            const fileType = FileHelper.fileType(filename);
-            const isDownload = filename.includes('.');
-            options = FileHelper.getExportOptions(options);
-            return addTask((success) => new Promise((resolve) => {
-                const over = (result) => {
-                    success(result);
-                    resolve();
-                    this.running = false;
-                };
-                const { toURL } = Platform;
-                const { download } = Platform.origin;
-                if (fileType === 'json') {
-                    isDownload && download(toURL(JSON.stringify(leaf.toJSON(options.json)), 'text'), filename);
-                    return over({ data: isDownload ? true : leaf.toJSON(options.json) });
-                }
-                if (fileType === 'svg') {
-                    isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
-                    return over({ data: isDownload ? true : leaf.toSVG() });
-                }
-                const { leafer } = leaf;
-                if (leafer) {
-                    checkLazy(leaf);
-                    leafer.waitViewCompleted(() => __awaiter(this, void 0, void 0, function* () {
-                        let renderBounds, trimBounds, scaleX = 1, scaleY = 1;
-                        const { worldTransform, isLeafer, isFrame } = leaf;
-                        const { slice, trim, onCanvas } = options;
-                        const smooth = options.smooth === undefined ? leafer.config.smooth : options.smooth;
-                        const contextSettings = options.contextSettings || leafer.config.contextSettings;
-                        const screenshot = options.screenshot || leaf.isApp;
-                        const fill = (isLeafer && screenshot) ? (options.fill === undefined ? leaf.fill : options.fill) : options.fill;
-                        const needFill = FileHelper.isOpaqueImage(filename) || fill, matrix = new Matrix();
-                        if (screenshot) {
-                            renderBounds = screenshot === true ? (isLeafer ? leafer.canvas.bounds : leaf.worldRenderBounds) : screenshot;
-                        }
-                        else {
-                            let relative = options.relative || (isLeafer ? 'inner' : 'local');
-                            scaleX = worldTransform.scaleX;
-                            scaleY = worldTransform.scaleY;
-                            switch (relative) {
-                                case 'inner':
-                                    matrix.set(worldTransform);
-                                    break;
-                                case 'local':
-                                    matrix.set(worldTransform).divide(leaf.localTransform);
-                                    scaleX /= leaf.scaleX;
-                                    scaleY /= leaf.scaleY;
-                                    break;
-                                case 'world':
-                                    scaleX = 1;
-                                    scaleY = 1;
-                                    break;
-                                case 'page':
-                                    relative = leaf.leafer;
-                                default:
-                                    matrix.set(worldTransform).divide(leaf.getTransform(relative));
-                                    const l = relative.worldTransform;
-                                    scaleX /= scaleX / l.scaleX;
-                                    scaleY /= scaleY / l.scaleY;
-                            }
-                            renderBounds = leaf.getBounds('render', relative);
-                        }
-                        const scaleData = { scaleX: 1, scaleY: 1 };
-                        MathHelper.getScaleData(options.scale, options.size, renderBounds, scaleData);
-                        let pixelRatio = options.pixelRatio || 1;
-                        if (leaf.isApp) {
-                            scaleData.scaleX *= pixelRatio;
-                            scaleData.scaleY *= pixelRatio;
-                            pixelRatio = leaf.app.pixelRatio;
-                        }
-                        const { x, y, width, height } = new Bounds(renderBounds).scale(scaleData.scaleX, scaleData.scaleY);
-                        const renderOptions = { matrix: matrix.scale(1 / scaleData.scaleX, 1 / scaleData.scaleY).invert().translate(-x, -y).withScale(1 / scaleX * scaleData.scaleX, 1 / scaleY * scaleData.scaleY) };
-                        let canvas = Creator.canvas({ width: Math.round(width), height: Math.round(height), pixelRatio, smooth, contextSettings });
-                        let sliceLeaf;
-                        if (slice) {
-                            sliceLeaf = leaf;
-                            sliceLeaf.__worldOpacity = 0;
-                            leaf = leafer;
-                            renderOptions.bounds = canvas.bounds;
-                        }
-                        canvas.save();
-                        if (isFrame && fill !== undefined) {
-                            const oldFill = leaf.get('fill');
-                            leaf.fill = '';
-                            leaf.__render(canvas, renderOptions);
-                            leaf.fill = oldFill;
-                        }
-                        else {
-                            leaf.__render(canvas, renderOptions);
-                        }
-                        canvas.restore();
-                        if (sliceLeaf)
-                            sliceLeaf.__updateWorldOpacity();
-                        if (trim) {
-                            trimBounds = getTrimBounds(canvas);
-                            const old = canvas, { width, height } = trimBounds;
-                            const config = { x: 0, y: 0, width, height, pixelRatio };
-                            canvas = Creator.canvas(config);
-                            canvas.copyWorld(old, trimBounds, config);
-                        }
-                        if (needFill)
-                            canvas.fillWorld(canvas.bounds, fill || '#FFFFFF', 'destination-over');
-                        if (onCanvas)
-                            onCanvas(canvas);
-                        const data = filename === 'canvas' ? canvas : yield canvas.export(filename, options);
-                        over({ data, width: canvas.pixelWidth, height: canvas.pixelHeight, renderBounds, trimBounds });
-                    }));
-                }
-                else {
-                    over({ data: false });
-                }
-            }));
-        }
-    };
-    let tasker;
-    function addTask(task) {
-        if (!tasker)
-            tasker = new TaskProcessor();
-        return new Promise((resolve) => {
-            tasker.add(() => __awaiter(this, void 0, void 0, function* () { return yield task(resolve); }), { parallel: false });
-        });
-    }
-    function checkLazy(leaf) {
-        if (leaf.__.__needComputePaint)
-            leaf.__.__computePaint();
-        if (leaf.isBranch)
-            leaf.children.forEach(child => checkLazy(child));
-    }
-
-    const canvas = LeaferCanvasBase.prototype;
-    const debug$2 = Debug.get('@leafer-ui/export');
-    canvas.export = function (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);
-    };
-    canvas.toBlob = function (type, quality) {
-        return new Promise((resolve) => {
-            Platform.origin.canvasToBolb(this.view, type, quality).then((blob) => {
-                resolve(blob);
-            }).catch((e) => {
-                debug$2.error(e);
-                resolve(null);
-            });
-        });
-    };
-    canvas.toDataURL = function (type, quality) {
-        return Platform.origin.canvasToDataURL(this.view, type, quality);
-    };
-    canvas.saveAs = function (filename, quality) {
-        return new Promise((resolve) => {
-            Platform.origin.canvasSaveAs(this.view, filename, quality).then(() => {
-                resolve(true);
-            }).catch((e) => {
-                debug$2.error(e);
-                resolve(false);
-            });
-        });
-    };
-
     Object.assign(TextConvert, TextConvertModule);
     Object.assign(ColorConvert, ColorConvertModule);
     Object.assign(Paint, PaintModule);
     Object.assign(PaintImage, PaintImageModule);
     Object.assign(PaintGradient, PaintGradientModule);
     Object.assign(Effect, EffectModule);
-    Object.assign(Export, ExportModule);
 
     Object.assign(Creator, {
         interaction: (target, canvas, selector, options) => new InteractionBase(target, canvas, selector, options),
@@ -12960,7 +12666,7 @@ ${filterStyle}
         }
     };
 
-    const debug$1 = Debug.get('EditToolCreator');
+    const debug$2 = Debug.get('EditToolCreator');
     function registerEditTool() {
         return (target) => {
             EditToolCreator.register(target);
@@ -12971,7 +12677,7 @@ ${filterStyle}
         list: {},
         register(EditTool) {
             const { tag } = EditTool.prototype;
-            list$1[tag] && debug$1.repeat(tag);
+            list$1[tag] && debug$2.repeat(tag);
             list$1[tag] = EditTool;
         },
         get(tag, editor) {
@@ -13088,7 +12794,7 @@ ${filterStyle}
             if (userConfig)
                 this.config = DataHelper.default(userConfig, this.config);
             this.addMany(this.editMask, this.selector, this.editBox);
-            if (!Plugin.check('resize', true))
+            if (!Plugin.has('resize'))
                 this.config.editSize = 'scale';
         }
         select(target) {
@@ -13881,7 +13587,7 @@ ${filterStyle}
 
     Plugin.add('resize');
 
-    Plugin.add('editor');
+    Plugin.add('editor', 'resize');
     Creator.editor = function (options) { return new Editor(options); };
     dataType(false)(exports.Box.prototype, 'textBox');
     defineKey(exports.UI.prototype, 'editOuter', {
@@ -13928,13 +13634,14 @@ ${filterStyle}
         }));
     }
     function addViewportConfig(leafer, mergeConfig) {
-        if (mergeConfig)
-            DataHelper.assign(leafer.config, mergeConfig);
-        DataHelper.assign(leafer.config, {
+        const viewportConfig = {
             wheel: { preventDefault: true },
             touch: { preventDefault: true },
             pointer: { preventDefaultMenu: true }
-        }, leafer.userConfig);
+        };
+        if (mergeConfig)
+            DataHelper.assign(viewportConfig, mergeConfig);
+        DataHelper.assign(leafer.config, viewportConfig, leafer.userConfig);
     }
 
     function custom(leafer) {
@@ -13961,11 +13668,11 @@ ${filterStyle}
         });
     }
 
-    const debug = Debug.get('LeaferTypeCreator');
+    const debug$1 = Debug.get('LeaferTypeCreator');
     const LeaferTypeCreator = {
         list: {},
         register(name, fn) {
-            list[name] && debug.repeat(name);
+            list[name] && debug$1.repeat(name);
             list[name] = fn;
         },
         run(name, leafer) {
@@ -14490,17 +14197,17 @@ ${filterStyle}
                 switch (command) {
                     case M$1:
                     case L$1:
-                        setPoint$1(data, i + 1, x, y, scaleX, scaleY, rotation, origin);
+                        setPoint$2(data, i + 1, x, y, scaleX, scaleY, rotation, origin);
                         i += 3;
                         break;
                     case C$1:
                         for (j = 1; j < 6; j += 2)
-                            setPoint$1(data, i + j, x, y, scaleX, scaleY, rotation, origin);
+                            setPoint$2(data, i + j, x, y, scaleX, scaleY, rotation, origin);
                         i += 7;
                         break;
                     case Q$1:
                         for (j = 1; j < 4; j += 2)
-                            setPoint$1(data, i + j, x, y, scaleX, scaleY, rotation, origin);
+                            setPoint$2(data, i + j, x, y, scaleX, scaleY, rotation, origin);
                         i += 5;
                         break;
                     case O$1:
@@ -14521,7 +14228,7 @@ ${filterStyle}
             PathMatrixHelper.layout(data, 0, 0, 1, 1, rotation, center);
         }
     };
-    function setPoint$1(data, startIndex, x, y, scaleX, scaleY, rotation, origin) {
+    function setPoint$2(data, startIndex, x, y, scaleX, scaleY, rotation, origin) {
         copyFrom$1(point, data[startIndex], data[startIndex + 1]);
         if (rotation)
             rotate$1(point, rotation, origin);
@@ -14687,7 +14394,7 @@ ${filterStyle}
                                     break;
                             }
                             if (index)
-                                setPoint(path, last, index);
+                                setPoint$1(path, last, index);
                         }
                     }
                 }
@@ -14701,7 +14408,7 @@ ${filterStyle}
         copyFrom(from, data[startIndex], data[startIndex + 1]);
         copyFrom(to, data[startIndex + 2], data[startIndex + 3]);
     }
-    function setPoint(data, point, startIndex) {
+    function setPoint$1(data, point, startIndex) {
         data[startIndex] = point.x;
         data[startIndex + 1] = point.y;
     }
@@ -14724,6 +14431,195 @@ ${filterStyle}
     arrowType('none')(ui, 'endArrow');
     Object.assign(PathArrow, PathArrowModule);
 
+    const { setPoint, addPoint, toBounds } = TwoPointBoundsHelper;
+    function getTrimBounds(canvas) {
+        const { width, height } = canvas.view;
+        const { data } = canvas.context.getImageData(0, 0, width, height);
+        let x, y, pointBounds, index = 0;
+        for (let i = 0; i < data.length; i += 4) {
+            if (data[i + 3] !== 0) {
+                x = index % width;
+                y = (index - x) / width;
+                pointBounds ? addPoint(pointBounds, x, y) : setPoint(pointBounds = {}, x, y);
+            }
+            index++;
+        }
+        const bounds = new Bounds();
+        toBounds(pointBounds, bounds);
+        return bounds.scale(1 / canvas.pixelRatio).ceil();
+    }
+
+    const ExportModule = {
+        export(leaf, filename, options) {
+            this.running = true;
+            const fileType = FileHelper.fileType(filename);
+            const isDownload = filename.includes('.');
+            options = FileHelper.getExportOptions(options);
+            return addTask((success) => new Promise((resolve) => {
+                const over = (result) => {
+                    success(result);
+                    resolve();
+                    this.running = false;
+                };
+                const { toURL } = Platform;
+                const { download } = Platform.origin;
+                if (fileType === 'json') {
+                    isDownload && download(toURL(JSON.stringify(leaf.toJSON(options.json)), 'text'), filename);
+                    return over({ data: isDownload ? true : leaf.toJSON(options.json) });
+                }
+                if (fileType === 'svg') {
+                    isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
+                    return over({ data: isDownload ? true : leaf.toSVG() });
+                }
+                const { leafer } = leaf;
+                if (leafer) {
+                    checkLazy(leaf);
+                    leafer.waitViewCompleted(() => __awaiter(this, void 0, void 0, function* () {
+                        let renderBounds, trimBounds, scaleX = 1, scaleY = 1;
+                        const { worldTransform, isLeafer, isFrame } = leaf;
+                        const { slice, trim, onCanvas } = options;
+                        const smooth = options.smooth === undefined ? leafer.config.smooth : options.smooth;
+                        const contextSettings = options.contextSettings || leafer.config.contextSettings;
+                        const screenshot = options.screenshot || leaf.isApp;
+                        const fill = (isLeafer && screenshot) ? (options.fill === undefined ? leaf.fill : options.fill) : options.fill;
+                        const needFill = FileHelper.isOpaqueImage(filename) || fill, matrix = new Matrix();
+                        if (screenshot) {
+                            renderBounds = screenshot === true ? (isLeafer ? leafer.canvas.bounds : leaf.worldRenderBounds) : screenshot;
+                        }
+                        else {
+                            let relative = options.relative || (isLeafer ? 'inner' : 'local');
+                            scaleX = worldTransform.scaleX;
+                            scaleY = worldTransform.scaleY;
+                            switch (relative) {
+                                case 'inner':
+                                    matrix.set(worldTransform);
+                                    break;
+                                case 'local':
+                                    matrix.set(worldTransform).divide(leaf.localTransform);
+                                    scaleX /= leaf.scaleX;
+                                    scaleY /= leaf.scaleY;
+                                    break;
+                                case 'world':
+                                    scaleX = 1;
+                                    scaleY = 1;
+                                    break;
+                                case 'page':
+                                    relative = leaf.leafer;
+                                default:
+                                    matrix.set(worldTransform).divide(leaf.getTransform(relative));
+                                    const l = relative.worldTransform;
+                                    scaleX /= scaleX / l.scaleX;
+                                    scaleY /= scaleY / l.scaleY;
+                            }
+                            renderBounds = leaf.getBounds('render', relative);
+                        }
+                        const scaleData = { scaleX: 1, scaleY: 1 };
+                        MathHelper.getScaleData(options.scale, options.size, renderBounds, scaleData);
+                        let pixelRatio = options.pixelRatio || 1;
+                        if (leaf.isApp) {
+                            scaleData.scaleX *= pixelRatio;
+                            scaleData.scaleY *= pixelRatio;
+                            pixelRatio = leaf.app.pixelRatio;
+                        }
+                        const { x, y, width, height } = new Bounds(renderBounds).scale(scaleData.scaleX, scaleData.scaleY);
+                        const renderOptions = { matrix: matrix.scale(1 / scaleData.scaleX, 1 / scaleData.scaleY).invert().translate(-x, -y).withScale(1 / scaleX * scaleData.scaleX, 1 / scaleY * scaleData.scaleY) };
+                        let canvas = Creator.canvas({ width: Math.round(width), height: Math.round(height), pixelRatio, smooth, contextSettings });
+                        let sliceLeaf;
+                        if (slice) {
+                            sliceLeaf = leaf;
+                            sliceLeaf.__worldOpacity = 0;
+                            leaf = leafer;
+                            renderOptions.bounds = canvas.bounds;
+                        }
+                        canvas.save();
+                        if (isFrame && fill !== undefined) {
+                            const oldFill = leaf.get('fill');
+                            leaf.fill = '';
+                            leaf.__render(canvas, renderOptions);
+                            leaf.fill = oldFill;
+                        }
+                        else {
+                            leaf.__render(canvas, renderOptions);
+                        }
+                        canvas.restore();
+                        if (sliceLeaf)
+                            sliceLeaf.__updateWorldOpacity();
+                        if (trim) {
+                            trimBounds = getTrimBounds(canvas);
+                            const old = canvas, { width, height } = trimBounds;
+                            const config = { x: 0, y: 0, width, height, pixelRatio };
+                            canvas = Creator.canvas(config);
+                            canvas.copyWorld(old, trimBounds, config);
+                        }
+                        if (needFill)
+                            canvas.fillWorld(canvas.bounds, fill || '#FFFFFF', 'destination-over');
+                        if (onCanvas)
+                            onCanvas(canvas);
+                        const data = filename === 'canvas' ? canvas : yield canvas.export(filename, options);
+                        over({ data, width: canvas.pixelWidth, height: canvas.pixelHeight, renderBounds, trimBounds });
+                    }));
+                }
+                else {
+                    over({ data: false });
+                }
+            }));
+        }
+    };
+    let tasker;
+    function addTask(task) {
+        if (!tasker)
+            tasker = new TaskProcessor();
+        return new Promise((resolve) => {
+            tasker.add(() => __awaiter(this, void 0, void 0, function* () { return yield task(resolve); }), { parallel: false });
+        });
+    }
+    function checkLazy(leaf) {
+        if (leaf.__.__needComputePaint)
+            leaf.__.__computePaint();
+        if (leaf.isBranch)
+            leaf.children.forEach(child => checkLazy(child));
+    }
+
+    const canvas = LeaferCanvasBase.prototype;
+    const debug = Debug.get('@leafer-in/export');
+    canvas.export = function (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);
+    };
+    canvas.toBlob = function (type, quality) {
+        return new Promise((resolve) => {
+            Platform.origin.canvasToBolb(this.view, type, quality).then((blob) => {
+                resolve(blob);
+            }).catch((e) => {
+                debug.error(e);
+                resolve(null);
+            });
+        });
+    };
+    canvas.toDataURL = function (type, quality) {
+        return Platform.origin.canvasToDataURL(this.view, type, quality);
+    };
+    canvas.saveAs = function (filename, quality) {
+        return new Promise((resolve) => {
+            Platform.origin.canvasSaveAs(this.view, filename, quality).then(() => {
+                resolve(true);
+            }).catch((e) => {
+                debug.error(e);
+                resolve(false);
+            });
+        });
+    };
+
+    Object.assign(Export, ExportModule);
+    exports.UI.prototype.export = function (filename, options) {
+        return Export.export(this, filename, options);
+    };
+
     const textCaseMap = {
         'none': 'none',
         'title': 'capitalize',
@@ -14926,8 +14822,7 @@ ${filterStyle}
         registerInnerEditor()
     ], exports.TextEditor);
 
-    Plugin.add('text-editor');
-    setTimeout(() => Plugin.check('editor', true));
+    Plugin.add('text-editor', 'editor');
 
     class HTMLTextData extends ImageData {
         setText(value) {
@@ -15092,6 +14987,7 @@ ${filterStyle}
     exports.PathNumberCommandLengthMap = PathNumberCommandLengthMap;
     exports.PathNumberCommandMap = PathNumberCommandMap;
     exports.PenData = PenData;
+    exports.Picker = Picker;
     exports.Platform = Platform;
     exports.Plugin = Plugin;
     exports.Point = Point;