@leafer-game/worker 1.0.10 → 1.1.1

package/dist/worker.js

@@ -111,7 +111,7 @@ var LeaferUI = (function (exports) {
             return rotation - oldRotation;
         },
         float(num, maxLength) {
-            const a = maxLength ? pow$2(10, maxLength) : 1000000000000;
+            const a = maxLength !== undefined ? pow$2(10, maxLength) : 1000000000000;
             num = round$3(num * a) / a;
             return num === -0 ? 0 : num;
         },
@@ -1414,14 +1414,14 @@ var LeaferUI = (function (exports) {
         list: {},
         register(UI) {
             const { __tag: tag } = UI.prototype;
-            if (list$2[tag])
+            if (list$1[tag])
                 debug$e.repeat(tag);
-            list$2[tag] = UI;
+            list$1[tag] = UI;
         },
         get(tag, data, x, y, width, height) {
-            if (!list$2[tag])
+            if (!list$1[tag])
                 debug$e.error('not register ' + tag);
-            const ui = new list$2[tag](data);
+            const ui = new list$1[tag](data);
             if (x !== undefined) {
                 ui.x = x;
                 if (y)
@@ -1434,7 +1434,7 @@ var LeaferUI = (function (exports) {
             return ui;
         }
     };
-    const { list: list$2 } = UICreator;
+    const { list: list$1 } = UICreator;
 
     const debug$d = Debug.get('EventCreator');
     const EventCreator = {
@@ -1516,17 +1516,19 @@ var LeaferUI = (function (exports) {
             assign$1(t, defaultData);
             return t;
         },
-        assign(t, merge) {
+        assign(t, merge, exclude) {
             let value;
             Object.keys(merge).forEach(key => {
-                var _a;
+                var _a, _b;
                 value = merge[key];
-                if ((value === null || value === void 0 ? void 0 : value.constructor) === Object) {
-                    (((_a = t[key]) === null || _a === void 0 ? void 0 : _a.constructor) === Object) ? assign$1(t[key], merge[key]) : t[key] = merge[key];
-                }
-                else {
-                    t[key] = merge[key];
+                if ((value === null || value === void 0 ? void 0 : value.constructor) === Object && ((_a = t[key]) === null || _a === void 0 ? void 0 : _a.constructor) === Object)
+                    return assign$1(t[key], merge[key], exclude && exclude[key]);
+                if (exclude && (key in exclude)) {
+                    if (((_b = exclude[key]) === null || _b === void 0 ? void 0 : _b.constructor) === Object)
+                        assign$1(t[key] = {}, merge[key], exclude[key]);
+                    return;
                 }
+                t[key] = merge[key];
             });
         },
         copyAttrs(t, from, include) {
@@ -3894,6 +3896,8 @@ var LeaferUI = (function (exports) {
         return decorateLeafAttr(defaultValue, (key) => attr({
             set(value) {
                 this.__setAttr(key, value) && (this.__layout.opacityChanged || this.__layout.opacityChange());
+                if (this.mask)
+                    checkMask(this);
             }
         }));
     }
@@ -3910,9 +3914,20 @@ var LeaferUI = (function (exports) {
                         this.__runAnimation('in');
                 }
                 doVisible(this, key, value, oldValue);
+                if (this.mask)
+                    checkMask(this);
             }
         }));
     }
+    function checkMask(leaf) {
+        const { parent } = leaf;
+        if (parent) {
+            const { __hasMask } = parent;
+            parent.__updateMask();
+            if (__hasMask !== parent.__hasMask)
+                parent.forceUpdate();
+        }
+    }
     function doVisible(leaf, key, value, oldValue) {
         if (leaf.__setAttr(key, value)) {
             leaf.__layout.opacityChanged || leaf.__layout.opacityChange();
@@ -4051,11 +4066,11 @@ var LeaferUI = (function (exports) {
     }
 
     const debug$8 = new Debug('rewrite');
-    const list$1 = [];
+    const list = [];
     const excludeNames = ['destroy', 'constructor'];
     function rewrite(method) {
         return (target, key) => {
-            list$1.push({ name: target.constructor.name + '.' + key, run: () => { target[key] = method; } });
+            list.push({ name: target.constructor.name + '.' + key, run: () => { target[key] = method; } });
         };
     }
     function rewriteAble() {
@@ -4064,13 +4079,13 @@ var LeaferUI = (function (exports) {
         };
     }
     function doRewrite(error) {
-        if (list$1.length) {
-            list$1.forEach(item => {
+        if (list.length) {
+            list.forEach(item => {
                 if (error)
                     debug$8.error(item.name, '需在Class上装饰@rewriteAble()');
                 item.run();
             });
-            list$1.length = 0;
+            list.length = 0;
         }
     }
     setTimeout(() => doRewrite(true));
@@ -4168,20 +4183,17 @@ var LeaferUI = (function (exports) {
             }
             return true;
         },
-        moveWorld(t, x, y = 0, isInnerPoint) {
+        moveWorld(t, x, y = 0, isInnerPoint, transition) {
             const local = typeof x === 'object' ? Object.assign({}, x) : { x, y };
             isInnerPoint ? toOuterPoint$1(t.localTransform, local, local, true) : (t.parent && toInnerPoint$1(t.parent.worldTransform, local, local, true));
-            L$1.moveLocal(t, local.x, local.y);
+            L$1.moveLocal(t, local.x, local.y, transition);
         },
-        moveLocal(t, x, y = 0) {
-            if (typeof x === 'object') {
-                t.x += x.x;
-                t.y += x.y;
-            }
-            else {
-                t.x += x;
-                t.y += y;
-            }
+        moveLocal(t, x, y = 0, transition) {
+            if (typeof x === 'object')
+                y = x.y, x = x.x;
+            x += t.x;
+            y += t.y;
+            transition ? t.animate({ x, y }, transition) : (t.x = x, t.y = y);
         },
         zoomOfWorld(t, origin, scaleX, scaleY, resize) {
             L$1.zoomOfLocal(t, getTempLocal(t, origin), scaleX, scaleY, resize);
@@ -5440,8 +5452,8 @@ var LeaferUI = (function (exports) {
             canvas.clearRect(r.x, r.y, r.width, r.height);
             canvas.restore();
         }
-        __updateMask(value) {
-            this.__hasMask = value ? true : this.children.some(item => item.__.mask);
+        __updateMask(_value) {
+            this.__hasMask = this.children.some(item => item.__.mask && item.__.visible && item.__.opacity);
         }
         __renderMask(_canvas, _options) { }
         __getNowWorld(options) {
@@ -5561,11 +5573,11 @@ var LeaferUI = (function (exports) {
         transform(matrix, resize) {
             transform(this, matrix, resize);
         }
-        move(x, y) {
-            moveLocal(this, x, y);
+        move(x, y, transition) {
+            moveLocal(this, x, y, transition);
         }
-        moveInner(x, y) {
-            moveWorld(this, x, y, true);
+        moveInner(x, y, transition) {
+            moveWorld(this, x, y, true, transition);
         }
         scaleOf(origin, scaleX, scaleY, resize) {
             zoomOfLocal(this, getLocalOrigin(this, origin), scaleX, scaleY, resize);
@@ -5579,8 +5591,8 @@ var LeaferUI = (function (exports) {
         transformWorld(worldTransform, resize) {
             transformWorld(this, worldTransform, resize);
         }
-        moveWorld(x, y) {
-            moveWorld(this, x, y);
+        moveWorld(x, y, transition) {
+            moveWorld(this, x, y, false, transition);
         }
         scaleOfWorld(worldOrigin, scaleX, scaleY, resize) {
             zoomOfWorld(this, worldOrigin, scaleX, scaleY, resize);
@@ -5684,6 +5696,7 @@ var LeaferUI = (function (exports) {
     const { setListWithFn } = BoundsHelper;
     const { sort } = BranchHelper;
     const { localBoxBounds, localStrokeBounds, localRenderBounds, maskLocalBoxBounds, maskLocalStrokeBounds, maskLocalRenderBounds } = LeafBoundsHelper;
+    const debug$6 = new Debug('Branch');
     exports.Branch = class Branch extends exports.Leaf {
         __updateStrokeSpread() {
             const { children } = this;
@@ -5724,8 +5737,8 @@ var LeaferUI = (function (exports) {
             }
         }
         add(child, index) {
-            if (child === this)
-                return;
+            if (child === this || child.destroyed)
+                return debug$6.warn('add self or destroyed');
             const noIndex = index === undefined;
             if (!child.__) {
                 if (child instanceof Array)
@@ -5739,8 +5752,9 @@ var LeaferUI = (function (exports) {
             noIndex ? this.children.push(child) : this.children.splice(index, 0, child);
             if (child.isBranch)
                 this.__.__childBranchNumber = (this.__.__childBranchNumber || 0) + 1;
-            child.__layout.boxChanged || child.__layout.boxChange();
-            child.__layout.matrixChanged || child.__layout.matrixChange();
+            const childLayout = child.__layout;
+            childLayout.boxChanged || childLayout.boxChange();
+            childLayout.matrixChanged || childLayout.matrixChange();
             if (child.__bubbleMap)
                 child.__emitLifeEvent(ChildEvent.ADD);
             if (this.leafer) {
@@ -5978,7 +5992,7 @@ var LeaferUI = (function (exports) {
         }
     }
 
-    const version = "1.0.10";
+    const version = "1.1.1";
 
     class LeaferCanvas extends LeaferCanvasBase {
         get allowBackgroundColor() { return true; }
@@ -6252,7 +6266,7 @@ var LeaferUI = (function (exports) {
     }
 
     const { updateAllMatrix: updateAllMatrix$1, updateAllChange } = LeafHelper;
-    const debug$6 = Debug.get('Layouter');
+    const debug$5 = Debug.get('Layouter');
     class Layouter {
         constructor(target, userConfig) {
             this.totalTimes = 0;
@@ -6287,7 +6301,7 @@ var LeaferUI = (function (exports) {
                 target.emitEvent(new LayoutEvent(LayoutEvent.END, this.layoutedBlocks, this.times));
             }
             catch (e) {
-                debug$6.error(e);
+                debug$5.error(e);
             }
             this.layoutedBlocks = null;
         }
@@ -6301,9 +6315,9 @@ var LeaferUI = (function (exports) {
         }
         layoutOnce() {
             if (this.layouting)
-                return debug$6.warn('layouting');
+                return debug$5.warn('layouting');
             if (this.times > 3)
-                return debug$6.warn('layout max times');
+                return debug$5.warn('layout max times');
             this.times++;
             this.totalTimes++;
             this.layouting = true;
@@ -6407,7 +6421,7 @@ var LeaferUI = (function (exports) {
         }
     }
 
-    const debug$5 = Debug.get('Renderer');
+    const debug$4 = Debug.get('Renderer');
     class Renderer {
         get needFill() { return !!(!this.canvas.allowBackgroundColor && this.config.fill); }
         constructor(target, canvas, userConfig) {
@@ -6423,29 +6437,29 @@ var LeaferUI = (function (exports) {
             if (userConfig)
                 this.config = DataHelper.default(userConfig, this.config);
             this.__listenEvents();
-            this.__requestRender();
         }
         start() {
             this.running = true;
+            this.update(false);
         }
         stop() {
             this.running = false;
         }
-        update() {
-            this.changed = true;
+        update(change = true) {
+            if (!this.changed)
+                this.changed = change;
+            this.__requestRender();
         }
         requestLayout() {
             this.target.emit(LayoutEvent.REQUEST);
         }
         render(callback) {
-            if (!(this.running && this.canvas.view)) {
-                this.changed = true;
-                return;
-            }
+            if (!(this.running && this.canvas.view))
+                return this.update();
             const { target } = this;
             this.times = 0;
             this.totalBounds = new Bounds();
-            debug$5.log(target.innerName, '--->');
+            debug$4.log(target.innerName, '--->');
             try {
                 if (!target.isApp)
                     target.app.emit(RenderEvent.CHILD_START, target);
@@ -6456,9 +6470,9 @@ var LeaferUI = (function (exports) {
             }
             catch (e) {
                 this.rendering = false;
-                debug$5.error(e);
+                debug$4.error(e);
             }
-            debug$5.log('-------------|');
+            debug$4.log('-------------|');
         }
         renderAgain() {
             if (this.rendering) {
@@ -6470,9 +6484,9 @@ var LeaferUI = (function (exports) {
         }
         renderOnce(callback) {
             if (this.rendering)
-                return debug$5.warn('rendering');
+                return debug$4.warn('rendering');
             if (this.times > 3)
-                return debug$5.warn('render max times');
+                return debug$4.warn('render max times');
             this.times++;
             this.totalTimes++;
             this.rendering = true;
@@ -6509,7 +6523,7 @@ var LeaferUI = (function (exports) {
         partRender() {
             const { canvas, updateBlocks: list } = this;
             if (!list)
-                return debug$5.warn('PartRender: need update attr');
+                return debug$4.warn('PartRender: need update attr');
             this.mergeBlocks();
             list.forEach(block => { if (canvas.bounds.hit(block) && !block.isEmpty())
                 this.clipRender(block); });
@@ -6575,16 +6589,17 @@ var LeaferUI = (function (exports) {
             }
         }
         __requestRender() {
-            const startTime = Date.now();
+            if (this.requestTime)
+                return;
+            const requestTime = this.requestTime = Date.now();
             Platform.requestRender(() => {
-                this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - startTime)));
+                this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
+                this.requestTime = 0;
                 if (this.running) {
                     if (this.changed && this.canvas.view)
                         this.render();
                     this.target.emit(RenderEvent.NEXT);
                 }
-                if (this.target)
-                    this.__requestRender();
             });
         }
         __onResize(e) {
@@ -6600,7 +6615,7 @@ var LeaferUI = (function (exports) {
                 }
             }
             this.addBlock(new Bounds(0, 0, 1, 1));
-            this.changed = true;
+            this.update();
         }
         __onLayoutEnd(event) {
             if (event.data)
@@ -6611,7 +6626,7 @@ var LeaferUI = (function (exports) {
                             empty = (!leaf.__world.width || !leaf.__world.height);
                             if (empty) {
                                 if (!leaf.isLeafer)
-                                    debug$5.tip(leaf.innerName, ': empty');
+                                    debug$4.tip(leaf.innerName, ': empty');
                                 empty = (!leaf.isBranch || leaf.isBranchLeaf);
                             }
                             return empty;
@@ -6986,7 +7001,7 @@ var LeaferUI = (function (exports) {
 
     const { parse, objectToCanvasData } = PathConvert;
     const emptyPaint = {};
-    const debug$4 = Debug.get('UIData');
+    const debug$3 = Debug.get('UIData');
     class UIData extends LeafData {
         get scale() { const { scaleX, scaleY } = this; return scaleX !== scaleY ? { x: scaleX, y: scaleY } : scaleX; }
         get __strokeWidth() {
@@ -7008,7 +7023,7 @@ var LeaferUI = (function (exports) {
                 return true;
             return t.fill && this.__hasStroke;
         }
-        get __clipAfterFill() { return (this.cornerRadius || this.__pathInputed); }
+        get __clipAfterFill() { const t = this; return (t.cornerRadius || t.innerShadow || t.__pathInputed); }
         get __autoWidth() { return !this._width; }
         get __autoHeight() { return !this._height; }
         get __autoSide() { return !this._width || !this._height; }
@@ -7023,7 +7038,7 @@ var LeaferUI = (function (exports) {
             if (value < 0) {
                 this._width = -value;
                 this.__leaf.scaleX *= -1;
-                debug$4.warn('width < 0, instead -scaleX ', this);
+                debug$3.warn('width < 0, instead -scaleX ', this);
             }
             else
                 this._width = value;
@@ -7032,7 +7047,7 @@ var LeaferUI = (function (exports) {
             if (value < 0) {
                 this._height = -value;
                 this.__leaf.scaleY *= -1;
-                debug$4.warn('height < 0, instead -scaleY', this);
+                debug$3.warn('height < 0, instead -scaleY', this);
             }
             else
                 this._height = value;
@@ -7122,7 +7137,7 @@ var LeaferUI = (function (exports) {
 
     class BoxData extends GroupData {
         get __boxStroke() { return !this.__pathInputed; }
-        get __drawAfterFill() { return this.overflow === 'hide' && this.__clipAfterFill && this.__leaf.children.length; }
+        get __drawAfterFill() { const t = this; return (t.overflow === 'hide' && (t.__clipAfterFill || t.innerShadow) && t.__leaf.children.length); }
         get __clipAfterFill() { return this.__leaf.isOverflow || super.__clipAfterFill; }
     }
 
@@ -7408,11 +7423,15 @@ var LeaferUI = (function (exports) {
             super(data);
         }
         reset(_data) { }
-        set(data, isTemp) {
-            if (isTemp) {
-                this.lockNormalStyle = true;
-                Object.assign(this, data);
-                this.lockNormalStyle = false;
+        set(data, transition) {
+            if (transition) {
+                if (transition === 'temp') {
+                    this.lockNormalStyle = true;
+                    Object.assign(this, data);
+                    this.lockNormalStyle = false;
+                }
+                else
+                    this.animate(data, transition);
             }
             else
                 Object.assign(this, data);
@@ -7722,17 +7741,17 @@ var LeaferUI = (function (exports) {
             if (!this.children)
                 this.children = [];
         }
-        set(data, isTemp) {
+        set(data, transition) {
             if (data.children) {
                 const { children } = data;
                 delete data.children;
                 this.children ? this.clear() : this.__setBranch();
-                super.set(data, isTemp);
+                super.set(data, transition);
                 children.forEach(child => this.add(child));
                 data.children = children;
             }
             else
-                super.set(data, isTemp);
+                super.set(data, transition);
         }
         toJSON(options) {
             const data = super.toJSON(options);
@@ -7764,7 +7783,7 @@ var LeaferUI = (function (exports) {
     ], exports.Group);
 
     var Leafer_1;
-    const debug$3 = Debug.get('Leafer');
+    const debug$2 = Debug.get('Leafer');
     exports.Leafer = Leafer_1 = class Leafer extends exports.Group {
         get __tag() { return 'Leafer'; }
         get isApp() { return false; }
@@ -7778,20 +7797,10 @@ var LeaferUI = (function (exports) {
         constructor(userConfig, data) {
             super(data);
             this.config = {
-                type: 'design',
                 start: true,
                 hittable: true,
                 smooth: true,
-                lazySpeard: 100,
-                zoom: {
-                    min: 0.01,
-                    max: 256
-                },
-                move: {
-                    holdSpaceKey: true,
-                    holdMiddleKey: true,
-                    autoDistance: 2
-                }
+                lazySpeard: 100
             };
             this.leafs = 0;
             this.__eventIds = [];
@@ -7808,23 +7817,27 @@ var LeaferUI = (function (exports) {
         init(userConfig, parentApp) {
             if (this.canvas)
                 return;
-            this.__setLeafer(this);
-            if (userConfig)
-                DataHelper.assign(this.config, userConfig);
             let start;
             const { config } = this;
-            this.initType(config.type);
+            this.__setLeafer(this);
+            if (parentApp) {
+                this.parentApp = parentApp;
+                this.__bindApp(parentApp);
+                start = parentApp.running;
+            }
+            if (userConfig) {
+                this.parent = parentApp;
+                this.initType(userConfig.type);
+                this.parent = undefined;
+                DataHelper.assign(config, userConfig);
+            }
             const canvas = this.canvas = Creator.canvas(config);
             this.__controllers.push(this.renderer = Creator.renderer(this, canvas, config), this.watcher = Creator.watcher(this, config), this.layouter = Creator.layouter(this, config));
             if (this.isApp)
                 this.__setApp();
             this.__checkAutoLayout(config, parentApp);
             this.view = canvas.view;
-            if (parentApp) {
-                this.__bindApp(parentApp);
-                start = parentApp.running;
-            }
-            else {
+            if (!parentApp) {
                 this.selector = Creator.selector(this);
                 this.interaction = Creator.interaction(this, canvas, this.selector, config);
                 if (this.interaction) {
@@ -7845,8 +7858,8 @@ var LeaferUI = (function (exports) {
         }
         onInit() { }
         initType(_type) { }
-        set(data) {
-            this.waitInit(() => { super.set(data); });
+        set(data, transition) {
+            this.waitInit(() => { super.set(data, transition); });
         }
         start() {
             clearTimeout(this.__startTimer);
@@ -7881,7 +7894,11 @@ var LeaferUI = (function (exports) {
         forceRender(bounds) {
             this.renderer.addBlock(bounds ? new Bounds(bounds) : this.canvas.bounds);
             if (this.viewReady)
-                this.renderer.update();
+                this.renderer.render();
+        }
+        requestRender(change = false) {
+            if (this.renderer)
+                this.renderer.update(change);
         }
         updateCursor(cursor) {
             const i = this.interaction;
@@ -7928,7 +7945,7 @@ var LeaferUI = (function (exports) {
             if (this.canvas) {
                 if (canvasSizeAttrs.includes(attrName)) {
                     if (!newValue)
-                        debug$3.warn(attrName + ' is 0');
+                        debug$2.warn(attrName + ' is 0');
                     this.__changeCanvasSize(attrName, newValue);
                 }
                 else if (attrName === 'fill') {
@@ -7989,8 +8006,10 @@ var LeaferUI = (function (exports) {
                 const { imageReady } = this;
                 if (imageReady && !this.viewCompleted)
                     this.__checkViewCompleted();
-                if (!imageReady)
+                if (!imageReady) {
                     this.viewCompleted = false;
+                    this.requestRender();
+                }
             }
         }
         __checkViewCompleted(emit = true) {
@@ -8048,6 +8067,7 @@ var LeaferUI = (function (exports) {
             }
             else
                 list.push(item);
+            this.requestRender();
         }
         zoom(_zoomType, _padding, _fixedScale) {
             return needPlugin('view');
@@ -8101,14 +8121,14 @@ var LeaferUI = (function (exports) {
                             this.canvasManager.destroy();
                         }
                         this.canvas.destroy();
-                        this.config.view = this.view = null;
+                        this.config.view = this.view = this.parentApp = null;
                         if (this.userConfig)
                             this.userConfig.view = null;
                         super.destroy();
                         setTimeout(() => { ImageManager.clearRecycled(); }, 100);
                     }
                     catch (e) {
-                        debug$3.error(e);
+                        debug$2.error(e);
                     }
                 }
             };
@@ -8336,7 +8356,7 @@ var LeaferUI = (function (exports) {
     ], exports.Ellipse);
 
     const { moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1 } = PathCommandDataHelper;
-    const { rotate: rotate$1, getAngle: getAngle$1, getDistance: getDistance$2, defaultPoint } = PointHelper;
+    const { rotate: rotate$1, getAngle: getAngle$1, getDistance: getDistance$3, defaultPoint } = PointHelper;
     const { toBounds: toBounds$1 } = PathBounds;
     exports.Line = class Line extends exports.UI {
         get __tag() { return 'Line'; }
@@ -8350,7 +8370,7 @@ var LeaferUI = (function (exports) {
             return to;
         }
         set toPoint(value) {
-            this.width = getDistance$2(defaultPoint, value);
+            this.width = getDistance$3(defaultPoint, value);
             this.rotation = getAngle$1(defaultPoint, value);
             if (this.height)
                 this.height = 0;
@@ -8828,9 +8848,9 @@ var LeaferUI = (function (exports) {
                 if (ground)
                     this.ground = this.addLeafer(ground);
                 if (tree || editor)
-                    this.tree = this.addLeafer(tree);
+                    this.tree = this.addLeafer(tree || { type: userConfig.type || 'design' });
                 if (sky || editor)
-                    this.sky = this.addLeafer(sky || { type: 'draw', usePartRender: false });
+                    this.sky = this.addLeafer(sky);
                 if (editor)
                     this.sky.add(this.editor = Creator.editor(editor));
             }
@@ -9035,10 +9055,8 @@ var LeaferUI = (function (exports) {
             this.data = data;
         }
         static getValidMove(leaf, start, total) {
-            const { draggable, dragBounds, x, y } = leaf;
-            const move = leaf.getLocalPoint(total, null, true);
-            move.x += start.x - x;
-            move.y += start.y - y;
+            const { draggable, dragBounds } = leaf, move = leaf.getLocalPoint(total, null, true);
+            PointHelper.move(move, start.x - leaf.x, start.y - leaf.y);
             if (dragBounds)
                 this.getMoveInDragBounds(leaf.__local, dragBounds === 'parent' ? leaf.parent.boxBounds : dragBounds, move, true);
             if (draggable === 'x')
@@ -9048,8 +9066,7 @@ var LeaferUI = (function (exports) {
             return move;
         }
         static getMoveInDragBounds(childBox, dragBounds, move, change) {
-            const x = childBox.x + move.x, y = childBox.y + move.y;
-            const right = x + childBox.width, bottom = y + childBox.height;
+            const x = childBox.x + move.x, y = childBox.y + move.y, right = x + childBox.width, bottom = y + childBox.height;
             const boundsRight = dragBounds.x + dragBounds.width, boundsBottom = dragBounds.y + dragBounds.height;
             if (!change)
                 move = Object.assign({}, move);
@@ -9101,9 +9118,7 @@ var LeaferUI = (function (exports) {
             return this.getLocalMove(relative, true);
         }
         getPageBounds() {
-            const total = this.getPageTotal();
-            const start = this.getPagePoint();
-            const bounds = {};
+            const total = this.getPageTotal(), start = this.getPagePoint(), bounds = {};
             BoundsHelper.set(bounds, start.x - total.x, start.y - total.y, total.x, total.y);
             BoundsHelper.unsign(bounds);
             return bounds;
@@ -9189,184 +9204,7 @@ var LeaferUI = (function (exports) {
         registerUIEvent()
     ], exports.KeyEvent);
 
-    function addInteractionWindow(leafer) {
-        if (leafer.isApp)
-            return;
-        leafer.__eventIds.push(leafer.on_(exports.MoveEvent.BEFORE_MOVE, (e) => {
-            leafer.zoomLayer.move(leafer.getValidMove(e.moveX, e.moveY));
-        }), leafer.on_(exports.ZoomEvent.BEFORE_ZOOM, (e) => {
-            const { zoomLayer } = leafer;
-            const changeScale = leafer.getValidScale(e.scale);
-            if (changeScale !== 1) {
-                PointHelper.scaleOf(zoomLayer, e, changeScale);
-                zoomLayer.scale = zoomLayer.__.scaleX * changeScale;
-            }
-        }));
-    }
-
-    function document(leafer) {
-        addInteractionWindow(leafer);
-        const { move, zoom } = leafer.config;
-        move.scroll = 'limit';
-        zoom.min = 1;
-    }
-
-    function block(leafer) {
-        const { config } = leafer;
-        (config.wheel || (config.wheel = {})).preventDefault = false;
-        (config.touch || (config.touch = {})).preventDefault = 'auto';
-    }
-
-    const debug$2 = Debug.get('LeaferTypeCreator');
-    const LeaferTypeCreator = {
-        list: {},
-        register(name, fn) {
-            list[name] && debug$2.repeat(name);
-            list[name] = fn;
-        },
-        run(name, leafer) {
-            const fn = list[name];
-            fn && fn(leafer);
-        }
-    };
-    const { list, register } = LeaferTypeCreator;
-    register('design', addInteractionWindow);
-    register('document', document);
-    register('block', block);
-
-    const leafer = exports.Leafer.prototype;
-    leafer.initType = function (type) {
-        LeaferTypeCreator.run(type, this);
-    };
-    leafer.getValidMove = function (moveX, moveY) {
-        const { scroll, disabled } = this.app.config.move;
-        if (scroll) {
-            Math.abs(moveX) > Math.abs(moveY) ? moveY = 0 : moveX = 0;
-            if (scroll === 'limit') {
-                const { x, y, width, height } = new Bounds(this.__world).addPoint(this.zoomLayer);
-                const right = x + width - this.width, bottom = y + height - this.height;
-                if (x >= 0 && right <= 0)
-                    moveX = 0;
-                else if (moveX > 0) {
-                    if (x + moveX > 0)
-                        moveX = -x;
-                }
-                else if (moveX < 0 && right + moveX < 0)
-                    moveX = -right;
-                if (y >= 0 && bottom <= 0)
-                    moveY = 0;
-                else if (moveY > 0) {
-                    if (y + moveY > 0)
-                        moveY = -y;
-                }
-                else if (moveY < 0 && bottom + moveY < 0)
-                    moveY = -bottom;
-            }
-        }
-        return { x: disabled ? 0 : moveX, y: disabled ? 0 : moveY };
-    };
-    leafer.getValidScale = function (changeScale) {
-        const { scaleX } = this.zoomLayer.__, { min, max, disabled } = this.app.config.zoom, absScale = Math.abs(scaleX * changeScale);
-        if (absScale < min)
-            changeScale = min / scaleX;
-        else if (absScale > max)
-            changeScale = max / scaleX;
-        return disabled ? 1 : changeScale;
-    };
-
-    class Transformer {
-        get transforming() { return !!(this.moveData || this.zoomData || this.rotateData); }
-        constructor(interaction) {
-            this.interaction = interaction;
-        }
-        move(data) {
-            const { interaction } = this;
-            if (!data.moveType)
-                data.moveType = 'move';
-            if (!this.moveData) {
-                const { path } = interaction.selector.getByPoint(data, interaction.hitRadius);
-                data.path = path;
-                this.moveData = Object.assign(Object.assign({}, data), { moveX: 0, moveY: 0 });
-                interaction.cancelHover();
-                interaction.emit(exports.MoveEvent.START, this.moveData);
-            }
-            data.path = this.moveData.path;
-            interaction.emit(exports.MoveEvent.BEFORE_MOVE, data);
-            interaction.emit(exports.MoveEvent.MOVE, data);
-            this.transformEndWait();
-        }
-        zoom(data) {
-            const { interaction } = this;
-            if (!this.zoomData) {
-                const { path } = interaction.selector.getByPoint(data, interaction.hitRadius);
-                data.path = path;
-                this.zoomData = Object.assign(Object.assign({}, data), { scale: 1 });
-                interaction.cancelHover();
-                interaction.emit(exports.ZoomEvent.START, this.zoomData);
-            }
-            data.path = this.zoomData.path;
-            interaction.emit(exports.ZoomEvent.BEFORE_ZOOM, data);
-            interaction.emit(exports.ZoomEvent.ZOOM, data);
-            this.transformEndWait();
-        }
-        rotate(data) {
-            const { interaction } = this;
-            if (!this.rotateData) {
-                const { path } = interaction.selector.getByPoint(data, interaction.hitRadius);
-                data.path = path;
-                this.rotateData = Object.assign(Object.assign({}, data), { rotation: 0 });
-                interaction.cancelHover();
-                interaction.emit(exports.RotateEvent.START, this.rotateData);
-            }
-            data.path = this.rotateData.path;
-            interaction.emit(exports.RotateEvent.BEFORE_ROTATE, data);
-            interaction.emit(exports.RotateEvent.ROTATE, data);
-            this.transformEndWait();
-        }
-        transformEndWait() {
-            clearTimeout(this.transformTimer);
-            this.transformTimer = setTimeout(() => {
-                this.transformEnd();
-            }, this.interaction.config.pointer.transformTime);
-        }
-        transformEnd() {
-            this.moveEnd();
-            this.zoomEnd();
-            this.rotateEnd();
-        }
-        moveEnd() {
-            if (this.moveData) {
-                this.interaction.emit(exports.MoveEvent.END, this.moveData);
-                this.moveData = null;
-            }
-        }
-        zoomEnd() {
-            if (this.zoomData) {
-                this.interaction.emit(exports.ZoomEvent.END, this.zoomData);
-                this.zoomData = null;
-            }
-        }
-        rotateEnd() {
-            if (this.rotateData) {
-                this.interaction.emit(exports.RotateEvent.END, this.rotateData);
-                this.rotateData = null;
-            }
-        }
-        destroy() {
-            this.zoomData = this.moveData = this.rotateData = null;
-        }
-    }
-
     const InteractionHelper = {
-        getMoveEventData(center, move, event) {
-            return Object.assign(Object.assign({}, event), { x: center.x, y: center.y, moveX: move.x, moveY: move.y });
-        },
-        getRotateEventData(center, angle, event) {
-            return Object.assign(Object.assign({}, event), { x: center.x, y: center.y, rotation: angle });
-        },
-        getZoomEventData(center, scale, event) {
-            return Object.assign(Object.assign({}, event), { x: center.x, y: center.y, scale });
-        },
         getDragEventData(startPoint, lastPoint, event) {
             return Object.assign(Object.assign({}, event), { x: event.x, y: event.y, moveX: event.x - lastPoint.x, moveY: event.y - lastPoint.y, totalX: event.x - startPoint.x, totalY: event.y - startPoint.y });
         },
@@ -9375,18 +9213,14 @@ var LeaferUI = (function (exports) {
                 data });
         },
         getSwipeDirection(angle) {
-            if (angle < -45 && angle > -135) {
+            if (angle < -45 && angle > -135)
                 return exports.SwipeEvent.UP;
-            }
-            else if (angle > 45 && angle < 135) {
+            else if (angle > 45 && angle < 135)
                 return exports.SwipeEvent.DOWN;
-            }
-            else if (angle <= 45 && angle >= -45) {
+            else if (angle <= 45 && angle >= -45)
                 return exports.SwipeEvent.RIGHT;
-            }
-            else {
+            else
                 return exports.SwipeEvent.LEFT;
-            }
         },
         getSwipeEventData(startPoint, lastDragData, event) {
             return Object.assign(Object.assign({}, event), { moveX: lastDragData.moveX, moveY: lastDragData.moveY, totalX: event.x - startPoint.x, totalY: event.y - startPoint.y, type: I.getSwipeDirection(PointHelper.getAngle(startPoint, event)) });
@@ -9459,9 +9293,8 @@ var LeaferUI = (function (exports) {
                     interaction.emit(exports.MoveEvent.START, this.dragData);
                 }
             }
-            if (!this.moving) {
+            if (!this.moving)
                 this.dragStart(data, canDrag);
-            }
             this.drag(data);
         }
         dragStart(data, canDrag) {
@@ -9539,16 +9372,9 @@ var LeaferUI = (function (exports) {
         dragEnd(data, speed) {
             if (!this.dragging && !this.moving)
                 return;
-            const { moveX, moveY } = this.dragData;
-            if (this.interaction.config.move.dragAnimate && this.canAnimate && this.moving && (Math.abs(moveX) > 1 || Math.abs(moveY) > 1)) {
-                data = Object.assign({}, data);
-                speed = (speed || (data.pointerType === 'touch' ? 2 : 1)) * 0.9;
-                PointHelper.move(data, moveX * speed, moveY * speed);
-                this.drag(data);
-                this.animate(() => { this.dragEnd(data, 1); });
-            }
-            else
-                this.dragEndReal(data);
+            if (this.checkDragEndAnimate(data, speed))
+                return;
+            this.dragEndReal(data);
         }
         dragEndReal(data) {
             const { interaction, downData, dragData } = this;
@@ -9575,12 +9401,6 @@ var LeaferUI = (function (exports) {
             this.dragReset();
             this.animate(null, 'off');
         }
-        animate(func, off) {
-            const animateWait = func || this.animateWait;
-            if (animateWait)
-                this.interaction.target.nextRender(animateWait, null, off);
-            this.animateWait = func;
-        }
         swipe(data, downData, dragData, endDragData) {
             const { interaction } = this;
             if (PointHelper.getDistance(downData, data) > interaction.config.pointer.swipeDistance) {
@@ -9597,39 +9417,11 @@ var LeaferUI = (function (exports) {
         dragReset() {
             exports.DragEvent.list = exports.DragEvent.data = this.draggableList = this.dragData = this.downData = this.dragOverPath = this.dragEnterPath = null;
         }
-        checkDragOut(data) {
-            const { interaction } = this;
-            this.autoMoveCancel();
-            if (this.dragging && !interaction.shrinkCanvasBounds.hitPoint(data))
-                this.autoMoveOnDragOut(data);
-        }
-        autoMoveOnDragOut(data) {
-            const { interaction, downData, canDragOut } = this;
-            const { autoDistance, dragOut } = interaction.config.move;
-            if (!dragOut || !canDragOut || !autoDistance)
-                return;
-            const bounds = interaction.shrinkCanvasBounds;
-            const { x, y } = bounds;
-            const right = BoundsHelper.maxX(bounds);
-            const bottom = BoundsHelper.maxY(bounds);
-            const moveX = data.x < x ? autoDistance : (right < data.x ? -autoDistance : 0);
-            const moveY = data.y < y ? autoDistance : (bottom < data.y ? -autoDistance : 0);
-            let totalX = 0, totalY = 0;
-            this.autoMoveTimer = setInterval(() => {
-                totalX += moveX;
-                totalY += moveY;
-                PointHelper.move(downData, moveX, moveY);
-                PointHelper.move(this.dragData, moveX, moveY);
-                interaction.move(Object.assign(Object.assign({}, data), { moveX, moveY, totalX, totalY, moveType: 'drag' }));
-                interaction.pointerMoveReal(data);
-            }, 10);
-        }
-        autoMoveCancel() {
-            if (this.autoMoveTimer) {
-                clearInterval(this.autoMoveTimer);
-                this.autoMoveTimer = 0;
-            }
-        }
+        checkDragEndAnimate(_data, _speed) { return false; }
+        animate(_func, _off) { }
+        checkDragOut(_data) { }
+        autoMoveOnDragOut(_data) { }
+        autoMoveCancel() { }
         destroy() {
             this.dragReset();
         }
@@ -9699,28 +9491,12 @@ var LeaferUI = (function (exports) {
         return excludePath && excludePath.has(leaf);
     }
 
-    const MultiTouchHelper = {
-        getData(list) {
-            const a = list[0];
-            const b = list[1];
-            const lastCenter = PointHelper.getCenter(a.from, b.from);
-            const center = PointHelper.getCenter(a.to, b.to);
-            const move = { x: center.x - lastCenter.x, y: center.y - lastCenter.y };
-            const lastDistance = PointHelper.getDistance(a.from, b.from);
-            const distance = PointHelper.getDistance(a.to, b.to);
-            const scale = distance / lastDistance;
-            const angle = PointHelper.getRotation(a.from, b.from, a.to, b.to);
-            return { move, scale, angle, center };
-        }
-    };
-
     const config = {
         wheel: {
             zoomSpeed: 0.5,
             moveSpeed: 0.5,
             rotateSpeed: 0.5,
             delta: { x: 80 / 4, y: 8.0 },
-            preventDefault: true
         },
         pointer: {
             hitRadius: 5,
@@ -9731,17 +9507,18 @@ var LeaferUI = (function (exports) {
             dragHover: true,
             dragDistance: 2,
             swipeDistance: 20,
-            preventDefaultMenu: true
         },
         touch: {
-            preventDefault: true
+            preventDefault: 'auto'
         },
         multiTouch: {},
+        move: { autoDistance: 2 },
+        zoom: {},
         cursor: true,
         keyEvent: true
     };
 
-    const { pathHasEventType, getMoveEventData, getZoomEventData, getRotateEventData, pathCanDrag, pathHasOutside } = InteractionHelper;
+    const { pathHasEventType, pathCanDrag, pathHasOutside } = InteractionHelper;
     class InteractionBase {
         get dragging() { return this.dragger.dragging; }
         get transforming() { return this.transformer.transforming; }
@@ -9763,7 +9540,7 @@ var LeaferUI = (function (exports) {
             this.canvas = canvas;
             this.selector = selector;
             this.defaultPath = new LeafList(target);
-            this.transformer = new Transformer(this);
+            this.createTransformer();
             this.dragger = new Dragger(this);
             if (userConfig)
                 this.config = DataHelper.default(userConfig, this.config);
@@ -9864,14 +9641,6 @@ var LeaferUI = (function (exports) {
             data.isCancel = true;
             this.pointerUp(data);
         }
-        multiTouch(data, list) {
-            if (this.config.multiTouch.disabled)
-                return;
-            const { move, angle, scale, center } = MultiTouchHelper.getData(list);
-            this.rotate(getRotateEventData(center, angle, data));
-            this.zoom(getZoomEventData(center, scale, data));
-            this.move(getMoveEventData(center, move, data));
-        }
         menu(data) {
             this.findPath(data);
             this.emit(exports.PointerEvent.MENU, data);
@@ -9885,18 +9654,13 @@ var LeaferUI = (function (exports) {
                 this.waitRightTap = this.waitMenuTap = false;
             }
         }
-        move(data) {
-            this.transformer.move(data);
-        }
-        zoom(data) {
-            this.transformer.zoom(data);
-        }
-        rotate(data) {
-            this.transformer.rotate(data);
-        }
-        transformEnd() {
-            this.transformer.transformEnd();
-        }
+        createTransformer() { }
+        move(_data) { }
+        zoom(_data) { }
+        rotate(_data) { }
+        transformEnd() { }
+        wheel(_data) { }
+        multiTouch(_data, _list) { }
         keyDown(data) {
             if (!this.config.keyEvent)
                 return;
@@ -10134,8 +9898,9 @@ var LeaferUI = (function (exports) {
             this.longPressed = false;
         }
         __onResize() {
+            const { dragOut } = this.m;
             this.shrinkCanvasBounds = new Bounds(this.canvas.bounds);
-            this.shrinkCanvasBounds.spread(-2);
+            this.shrinkCanvasBounds.spread(-(typeof dragOut === 'number' ? dragOut : 2));
         }
         __listenEvents() {
             const { target } = this;
@@ -10155,7 +9920,8 @@ var LeaferUI = (function (exports) {
                 this.stop();
                 this.__removeListenEvents();
                 this.dragger.destroy();
-                this.transformer.destroy();
+                if (this.transformer)
+                    this.transformer.destroy();
                 this.downData = this.overPath = this.enterPath = null;
             }
         }
@@ -10491,6 +10257,8 @@ var LeaferUI = (function (exports) {
                 case 'center':
                     canvas.setStroke(stroke, __strokeWidth, options);
                     canvas.stroke();
+                    if (options.__useArrow)
+                        strokeArrow(ui, canvas);
                     break;
                 case 'inside':
                     canvas.save();
@@ -10528,6 +10296,8 @@ var LeaferUI = (function (exports) {
                 case 'center':
                     canvas.setStroke(undefined, __strokeWidth, options);
                     drawStrokesStyle(strokes, false, ui, canvas);
+                    if (options.__useArrow)
+                        strokeArrow(ui, canvas);
                     break;
                 case 'inside':
                     canvas.save();
@@ -10553,6 +10323,14 @@ var LeaferUI = (function (exports) {
             }
         }
     }
+    function strokeArrow(ui, canvas) {
+        if (ui.__.dashPattern) {
+            canvas.beginPath();
+            ui.__drawPathByData(canvas, ui.__.__pathForArrow);
+            canvas.dashPattern = null;
+            canvas.stroke();
+        }
+    }
 
     const { getSpread, getOuterOf, getByMove, getIntersectData } = BoundsHelper;
     function shape(ui, current, options) {
@@ -11055,7 +10833,7 @@ var LeaferUI = (function (exports) {
         }
     }
 
-    const { getAngle, getDistance: getDistance$1 } = PointHelper;
+    const { getAngle, getDistance: getDistance$2 } = PointHelper;
     const { get, rotateOfOuter, scaleOfOuter } = MatrixHelper;
     const { toPoint: toPoint$1 } = AroundHelper;
     const realFrom$1 = {};
@@ -11064,7 +10842,7 @@ var LeaferUI = (function (exports) {
         let { from, to, type, opacity, blendMode, stretch } = paint;
         toPoint$1(from || 'center', box, realFrom$1);
         toPoint$1(to || 'bottom', box, realTo$1);
-        const style = Platform.canvas.createRadialGradient(realFrom$1.x, realFrom$1.y, 0, realFrom$1.x, realFrom$1.y, getDistance$1(realFrom$1, realTo$1));
+        const style = Platform.canvas.createRadialGradient(realFrom$1.x, realFrom$1.y, 0, realFrom$1.x, realFrom$1.y, getDistance$2(realFrom$1, realTo$1));
         applyStops(style, paint.stops, opacity);
         const data = { type, style };
         const transform = getTransform(box, realFrom$1, realTo$1, stretch, true);
@@ -11092,7 +10870,7 @@ var LeaferUI = (function (exports) {
         return transform;
     }
 
-    const { getDistance } = PointHelper;
+    const { getDistance: getDistance$1 } = PointHelper;
     const { toPoint } = AroundHelper;
     const realFrom = {};
     const realTo = {};
@@ -11100,7 +10878,7 @@ var LeaferUI = (function (exports) {
         let { from, to, type, opacity, blendMode, stretch } = paint;
         toPoint(from || 'center', box, realFrom);
         toPoint(to || 'bottom', box, realTo);
-        const style = Platform.conicGradientSupport ? Platform.canvas.createConicGradient(0, realFrom.x, realFrom.y) : Platform.canvas.createRadialGradient(realFrom.x, realFrom.y, 0, realFrom.x, realFrom.y, getDistance(realFrom, realTo));
+        const style = Platform.conicGradientSupport ? Platform.canvas.createConicGradient(0, realFrom.x, realFrom.y) : Platform.canvas.createRadialGradient(realFrom.x, realFrom.y, 0, realFrom.x, realFrom.y, getDistance$1(realFrom, realTo));
         applyStops(style, paint.stops, opacity);
         const data = { type, style };
         const transform = getTransform(box, realFrom, realTo, stretch || 1, Platform.conicGradientRotate90);
@@ -12079,15 +11857,18 @@ var LeaferUI = (function (exports) {
             if (typeof action === 'number') {
                 this.now = action;
             }
-            else if (action instanceof Array) {
-                const { length } = action;
+            else if (typeof action === 'object') {
+                const isArray = action instanceof Array;
+                const keyframes = isArray ? action : action.keyframes;
+                this.__action = isArray ? undefined : action;
+                const { length } = keyframes;
                 if (length > 1) {
-                    const start = this.now = action[0], end = action[action.length - 1];
+                    const start = this.now = keyframes[0], end = keyframes[keyframes.length - 1];
                     this.play();
                     this.__runAction(start, end);
                 }
                 else if (length)
-                    this.now = action[0];
+                    this.now = keyframes[0];
             }
         }
         __loadRobot(frame, start, end) {
@@ -12115,16 +11896,26 @@ var LeaferUI = (function (exports) {
             this.emitEvent(new ImageEvent(ImageEvent.LOADED, { image }));
         }
         __runAction(start, end) {
+            let { FPS, loop, __action: a } = this;
+            if (a) {
+                if (a.FPS)
+                    FPS = a.FPS;
+                if (a.loop !== undefined)
+                    loop = a.loop;
+            }
             this.__timer = setTimeout(() => {
                 if (this.running) {
-                    if (this.now === end)
+                    if (this.now === end) {
+                        if (!loop)
+                            return this.stop();
                         this.now = start;
+                    }
                     else
                         this.now++;
                     this.__updateRobotBounds();
                 }
                 this.__runAction(start, end);
-            }, 1000 / this.FPS);
+            }, 1000 / FPS);
         }
         __updateRobotBounds() {
             const { nowFrame } = this;
@@ -12237,7 +12028,7 @@ var LeaferUI = (function (exports) {
         const fromStyle = transition ? getFromStyle(leaf, style) : undefined;
         leaf.killAnimate('transition');
         if (normalStyle)
-            leaf.set(normalStyle, true);
+            leaf.set(normalStyle, 'temp');
         const statesStyle = getStyle(leaf);
         if (statesStyle) {
             const { animation } = statesStyle;
@@ -12251,14 +12042,14 @@ var LeaferUI = (function (exports) {
                 delete statesStyle.animation;
             }
             leaf.normalStyle = filterStyle(statesStyle, leaf);
-            leaf.set(statesStyle, true);
+            leaf.set(statesStyle, 'temp');
         }
         else {
             leaf.normalStyle = undefined;
         }
         if (transition) {
             const toStyle = filterStyle(fromStyle, leaf);
-            leaf.set(fromStyle, true);
+            leaf.set(fromStyle, 'temp');
             leaf.animate([fromStyle, toStyle], transition, 'transition', true);
         }
         leaf.__layout.stateStyleChanged = false;
@@ -12956,7 +12747,7 @@ var LeaferUI = (function (exports) {
             this.emit(AnimateEvent.UPDATE, this);
         }
         setStyle(style) {
-            this.target.set(style, this.isTemp);
+            this.target.set(style, this.isTemp ? 'temp' : false);
         }
         clearTimer(fn) {
             if (this.timer) {
@@ -13332,6 +13123,9 @@ var LeaferUI = (function (exports) {
             from = fourNumber(from), to = fourNumber(to);
             return from.map((f, i) => number(f, to[i], t));
         },
+        text(from, to, t) {
+            return (typeof from === 'number' || typeof to === 'number') ? MathHelper.float(number(from, to, t), Math.max(getDecimalLen(from), getDecimalLen(to))) : to;
+        },
         shadow,
         innerShadow: shadow
     };
@@ -13340,6 +13134,10 @@ var LeaferUI = (function (exports) {
         number,
         color
     };
+    function getDecimalLen(num) {
+        const decimal = String(num).split('.')[1];
+        return decimal ? decimal.length : 0;
+    }
     function value(from, to, t) {
         return (typeof from === 'number' && typeof to === 'number') ? from + (to - from) * t : to;
     }
@@ -13408,23 +13206,40 @@ var LeaferUI = (function (exports) {
     const gaussWeights = [0.2955242247, 0.2692667193, 0.2190863625, 0.1494513491, 0.0666713443];
     const { sqrt } = Math;
     const HighBezierHelper = {
-        getDistance(fromX, fromY, x1, y1, x2, y2, toX, toY) {
-            let distance = 0, t1, t2, d1X, d1Y, d2X, d2Y;
+        getDistance(fromX, fromY, x1, y1, x2, y2, toX, toY, t = 1) {
+            let distance = 0, t1, t2, d1X, d1Y, d2X, d2Y, half = t / 2;
             for (let i = 0; i < gaussNodes.length; i++) {
-                t1 = 0.5 * (1 + gaussNodes[i]);
-                t2 = 0.5 * (1 - gaussNodes[i]);
+                t1 = half * (1 + gaussNodes[i]);
+                t2 = half * (1 - gaussNodes[i]);
                 d1X = getDerivative(t1, fromX, x1, x2, toX);
                 d1Y = getDerivative(t1, fromY, y1, y2, toY);
                 d2X = getDerivative(t2, fromX, x1, x2, toX);
                 d2Y = getDerivative(t2, fromY, y1, y2, toY);
                 distance += gaussWeights[i] * (sqrt(d1X * d1X + d1Y * d1Y) + sqrt(d2X * d2X + d2Y * d2Y));
             }
-            return distance * 0.5;
+            return distance * half;
         },
         getDerivative(t, fromV, v1, v2, toV) {
             const o = 1 - t;
             return 3 * o * o * (v1 - fromV) + 6 * o * t * (v2 - v1) + 3 * t * t * (toV - v2);
         },
+        getRotation(t, fromX, fromY, x1, y1, x2, y2, toX, toY) {
+            const dx = getDerivative(t, fromX, x1, x2, toX);
+            const dy = getDerivative(t, fromY, y1, y2, toY);
+            return Math.atan2(dy, dx) / OneRadian;
+        },
+        getT(distance, totalDistance, fromX, fromY, x1, y1, x2, y2, toX, toY, precision = 1) {
+            let low = 0, high = 1, middle = distance / totalDistance, realPrecision = precision / totalDistance / 3;
+            if (middle >= 1)
+                return 1;
+            if (middle <= 0)
+                return 0;
+            while (high - low > realPrecision) {
+                getDistance(fromX, fromY, x1, y1, x2, y2, toX, toY, middle) < distance ? low = middle : high = middle;
+                middle = (low + high) / 2;
+            }
+            return middle;
+        },
         cut(data, t, fromX, fromY, x1, y1, x2, y2, toX, toY) {
             const o = 1 - t;
             const ax = o * fromX + t * x1, ay = o * fromY + t * y1;
@@ -13436,7 +13251,7 @@ var LeaferUI = (function (exports) {
             data.push(PathCommandMap.C, ax, ay, bx, by, cx, cy);
         }
     };
-    const { getDerivative } = HighBezierHelper;
+    const { getDerivative, getDistance } = HighBezierHelper;
 
     const { M, L, C, Z } = PathCommandMap;
     const tempPoint = {}, tempFrom = {};
@@ -13504,11 +13319,12 @@ var LeaferUI = (function (exports) {
             }
             return { total, segments, data };
         },
-        getDistancePoint(distanceData, motionDistance) {
+        getDistancePoint(distanceData, motionDistance, motionPrecision) {
             const { segments, data } = distanceData;
             motionDistance = UnitConvert.number(motionDistance, distanceData.total);
             let total = 0, distance, to = {};
             let i = 0, index = 0, x = 0, y = 0, toX, toY, command;
+            let x1, y1, x2, y2, t;
             const len = data.length;
             while (i < len) {
                 command = data[i];
@@ -13538,11 +13354,10 @@ var LeaferUI = (function (exports) {
                         toY = data[i + 6];
                         distance = segments[index];
                         if (total + distance > motionDistance) {
-                            const x1 = data[i + 1], y1 = data[i + 2], x2 = data[i + 3], y2 = data[i + 4];
-                            motionDistance -= total;
-                            BezierHelper.getPointAndSet(motionDistance / distance, x, y, x1, y1, x2, y2, toX, toY, to);
-                            BezierHelper.getPointAndSet(Math.max(0, motionDistance - 0.1) / distance, x, y, x1, y1, x2, y2, toX, toY, tempFrom);
-                            to.rotation = PointHelper.getAngle(tempFrom, to);
+                            x1 = data[i + 1], y1 = data[i + 2], x2 = data[i + 3], y2 = data[i + 4];
+                            t = HighBezierHelper.getT(motionDistance - total, distance, x, y, x1, y1, x2, y2, toX, toY, motionPrecision);
+                            BezierHelper.getPointAndSet(t, x, y, x1, y1, x2, y2, toX, toY, to);
+                            to.rotation = HighBezierHelper.getRotation(t, x, y, x1, y1, x2, y2, toX, toY);
                             return to;
                         }
                         x = toX;
@@ -13559,11 +13374,12 @@ var LeaferUI = (function (exports) {
             }
             return to;
         },
-        getDistancePath(distanceData, motionDistance) {
+        getDistancePath(distanceData, motionDistance, motionPrecision) {
             const { segments, data } = distanceData, path = [];
             motionDistance = UnitConvert.number(motionDistance, distanceData.total);
             let total = 0, distance, to = {};
             let i = 0, index = 0, x = 0, y = 0, toX, toY, command;
+            let x1, y1, x2, y2, t;
             const len = data.length;
             while (i < len) {
                 command = data[i];
@@ -13590,12 +13406,13 @@ var LeaferUI = (function (exports) {
                         path.push(command, x, y);
                         break;
                     case C:
-                        const x1 = data[i + 1], y1 = data[i + 2], x2 = data[i + 3], y2 = data[i + 4];
+                        x1 = data[i + 1], y1 = data[i + 2], x2 = data[i + 3], y2 = data[i + 4];
                         toX = data[i + 5];
                         toY = data[i + 6];
                         distance = segments[index];
                         if (total + distance > motionDistance) {
-                            HighBezierHelper.cut(path, (motionDistance - total) / distance, x, y, x1, y1, x2, y2, toX, toY);
+                            t = HighBezierHelper.getT(motionDistance - total, distance, x, y, x1, y1, x2, y2, toX, toY, motionPrecision);
+                            HighBezierHelper.cut(path, t, x, y, x1, y1, x2, y2, toX, toY);
                             return path;
                         }
                         x = toX;
@@ -13644,6 +13461,7 @@ var LeaferUI = (function (exports) {
     const { updateMatrix, updateAllMatrix } = LeafHelper;
     const { updateBounds } = BranchHelper;
     motionPathType()(ui, 'motionPath');
+    motionPathType(1)(ui, 'motionPrecision');
     motionPathType()(ui, 'motion');
     motionPathType(true)(ui, 'motionRotation');
     ui.getMotionPathData = function () {
@@ -13654,7 +13472,7 @@ var LeaferUI = (function (exports) {
         const data = getMotionPathData(path);
         if (!data.total)
             return {};
-        const point = HighCurveHelper.getDistancePoint(data, motionDistance);
+        const point = HighCurveHelper.getDistancePoint(data, motionDistance, path.motionPrecision);
         MatrixHelper.toOuterPoint(path.localTransform, point);
         const { motionRotation } = this;
         if (motionRotation === false)
@@ -13694,7 +13512,7 @@ var LeaferUI = (function (exports) {
         if (leaf.motionPath) {
             const data = getMotionPathData(leaf);
             if (data.total)
-                leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion);
+                leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion, leaf.motionPrecision);
         }
         else {
             leaf.set(leaf.getMotionPoint(motion));
@@ -13745,6 +13563,7 @@ var LeaferUI = (function (exports) {
     exports.Cursor = Cursor;
     exports.DataHelper = DataHelper;
     exports.Debug = Debug;
+    exports.Dragger = Dragger;
     exports.Effect = Effect;
     exports.EllipseData = EllipseData;
     exports.EllipseHelper = EllipseHelper;
@@ -13783,12 +13602,10 @@ var LeaferUI = (function (exports) {
     exports.LeaferData = LeaferData;
     exports.LeaferEvent = LeaferEvent;
     exports.LeaferImage = LeaferImage;
-    exports.LeaferTypeCreator = LeaferTypeCreator;
     exports.LineData = LineData;
     exports.MathHelper = MathHelper;
     exports.Matrix = Matrix;
     exports.MatrixHelper = MatrixHelper;
-    exports.MultiTouchHelper = MultiTouchHelper;
     exports.MyDragEvent = MyDragEvent;
     exports.MyImage = MyImage;
     exports.MyPointerEvent = MyPointerEvent;
@@ -13845,7 +13662,6 @@ var LeaferUI = (function (exports) {
     exports.WaitHelper = WaitHelper;
     exports.WatchEvent = WatchEvent;
     exports.Watcher = Watcher;
-    exports.addInteractionWindow = addInteractionWindow;
     exports.affectRenderBoundsType = affectRenderBoundsType;
     exports.affectStrokeBoundsType = affectStrokeBoundsType;
     exports.attr = attr;