@leafer-editor/worker 1.0.9 → 1.1.0

package/dist/worker.module.js

@@ -108,7 +108,7 @@ const MathHelper = {
         return rotation - oldRotation;
     },
     float(num, maxLength) {
-        const a = maxLength ? pow$1(10, maxLength) : 1000000000000;
+        const a = maxLength !== undefined ? pow$1(10, maxLength) : 1000000000000;
         num = round(num * a) / a;
         return num === -0 ? 0 : num;
     },
@@ -1411,14 +1411,13 @@ const UICreator = {
     list: {},
     register(UI) {
         const { __tag: tag } = UI.prototype;
-        if (list$3[tag]) {
+        if (list$3[tag])
             debug$f.repeat(tag);
-        }
-        else {
-            list$3[tag] = UI;
-        }
+        list$3[tag] = UI;
     },
     get(tag, data, x, y, width, height) {
+        if (!list$3[tag])
+            debug$f.error('not register ' + tag);
         const ui = new list$3[tag](data);
         if (x !== undefined) {
             ui.x = x;
@@ -1442,7 +1441,7 @@ const EventCreator = {
         Object.keys(Event).forEach(key => {
             name = Event[key];
             if (typeof name === 'string')
-                nameList[name] ? debug$e.repeat(name) : nameList[name] = Event;
+                nameList[name] && debug$e.repeat(name), nameList[name] = Event;
         });
     },
     changeName(oldName, newName) {
@@ -1644,7 +1643,7 @@ class LeafData {
         const t = this;
         if (t.blendMode === 'pass-through') {
             const leaf = this.__leaf;
-            if ((t.opacity < 1 && leaf.isBranch) || leaf.__hasEraser || t.eraser) {
+            if ((t.opacity < 1 && (leaf.isBranch || t.__hasMultiPaint)) || leaf.__hasEraser || t.eraser) {
                 t.__single = true;
             }
             else if (t.__single) {
@@ -2042,8 +2041,9 @@ class LeaferCanvasBase extends Canvas$1 {
             takeCanvas = this.getSameCanvas();
             takeCanvas.copyWorld(this);
         }
-        DataHelper.copyAttrs(this.size, size, canvasSizeAttrs);
-        this.size.pixelRatio || (this.size.pixelRatio = 1);
+        const s = this.size;
+        DataHelper.copyAttrs(s, size, canvasSizeAttrs);
+        canvasSizeAttrs.forEach(key => s[key] || (s[key] = 1));
         this.bounds = new Bounds(0, 0, this.width, this.height);
         if (this.context && !this.unreal) {
             this.updateViewSize();
@@ -2157,6 +2157,17 @@ class LeaferCanvasBase extends Canvas$1 {
         if (!onlyResetTransform)
             this.useWorldTransform();
     }
+    useGrayscaleAlpha(bounds) {
+        this.setTempBounds(bounds, true, true);
+        let alpha, pixel;
+        const { context } = this, imageData = context.getImageData(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height), { data } = imageData;
+        for (let i = 0, len = data.length; i < len; i += 4) {
+            pixel = data[i] * 0.299 + data[i + 1] * 0.587 + data[i + 2] * 0.114;
+            if (alpha = data[i + 3])
+                data[i + 3] = alpha === 255 ? pixel : alpha * (pixel / 255);
+        }
+        context.putImageData(imageData, tempBounds$1.x, tempBounds$1.y);
+    }
     useMask(maskCanvas, fromBounds, toBounds) {
         this.copyWorld(maskCanvas, fromBounds, toBounds, 'destination-in');
     }
@@ -2167,7 +2178,7 @@ class LeaferCanvasBase extends Canvas$1 {
         if (blendMode)
             this.blendMode = blendMode;
         this.fillStyle = color;
-        tempBounds$1.set(bounds).scale(this.pixelRatio);
+        this.setTempBounds(bounds);
         this.fillRect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
         if (blendMode)
             this.blendMode = 'source-over';
@@ -2176,22 +2187,18 @@ class LeaferCanvasBase extends Canvas$1 {
         if (blendMode)
             this.blendMode = blendMode;
         this.strokeStyle = color;
-        tempBounds$1.set(bounds).scale(this.pixelRatio);
+        this.setTempBounds(bounds);
         this.strokeRect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
         if (blendMode)
             this.blendMode = 'source-over';
     }
     clearWorld(bounds, ceilPixel) {
-        tempBounds$1.set(bounds).scale(this.pixelRatio);
-        if (ceilPixel)
-            tempBounds$1.ceil();
+        this.setTempBounds(bounds, ceilPixel);
         this.clearRect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
     }
     clipWorld(bounds, ceilPixel) {
         this.beginPath();
-        tempBounds$1.set(bounds).scale(this.pixelRatio);
-        if (ceilPixel)
-            tempBounds$1.ceil();
+        this.setTempBounds(bounds, ceilPixel);
         this.rect(tempBounds$1.x, tempBounds$1.y, tempBounds$1.width, tempBounds$1.height);
         this.clip();
     }
@@ -2199,6 +2206,14 @@ class LeaferCanvasBase extends Canvas$1 {
         const { pixelRatio } = this;
         this.clearRect(0, 0, this.width * pixelRatio + 2, this.height * pixelRatio + 2);
     }
+    setTempBounds(bounds, ceil, intersect) {
+        tempBounds$1.set(bounds);
+        if (intersect)
+            tempBounds$1.intersect(this.bounds);
+        tempBounds$1.scale(this.pixelRatio);
+        if (ceil)
+            tempBounds$1.ceil();
+    }
     isSameSize(size) {
         return this.width === size.width && this.height === size.height && this.pixelRatio === size.pixelRatio;
     }
@@ -4150,20 +4165,17 @@ const LeafHelper = {
         }
         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$3.moveLocal(t, local.x, local.y);
+        L$3.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$3.zoomOfLocal(t, getTempLocal(t, origin), scaleX, scaleY, resize);
@@ -5212,13 +5224,14 @@ const BranchRender = {
         this.__.__checkSingle();
     },
     __render(canvas, options) {
+        this.__nowWorld = this.__getNowWorld(options);
         if (this.__worldOpacity) {
             if (this.__.__single) {
                 if (this.__.eraser === 'path')
                     return this.__renderEraser(canvas, options);
                 const tempCanvas = canvas.getSameCanvas(false, true);
                 this.__renderBranch(tempCanvas, options);
-                const nowWorld = this.__getNowWorld(options);
+                const nowWorld = this.__nowWorld;
                 canvas.opacity = this.__.opacity;
                 canvas.copyWorldByReset(tempCanvas, nowWorld, nowWorld, this.__.__blendMode, true);
                 tempCanvas.recycle(nowWorld);
@@ -5542,11 +5555,11 @@ let Leaf = class Leaf {
     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);
@@ -5560,8 +5573,8 @@ let Leaf = class Leaf {
     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);
@@ -5959,7 +5972,7 @@ class LeafLevelList {
     }
 }
 
-const version = "1.0.9";
+const version = "1.1.0";
 
 class LeaferCanvas extends LeaferCanvasBase {
     get allowBackgroundColor() { return true; }
@@ -6428,7 +6441,8 @@ class Renderer {
         this.totalBounds = new Bounds();
         debug$6.log(target.innerName, '--->');
         try {
-            target.app.emit(RenderEvent.CHILD_START, target);
+            if (!target.isApp)
+                target.app.emit(RenderEvent.CHILD_START, target);
             this.emitRender(RenderEvent.START);
             this.renderOnce(callback);
             this.emitRender(RenderEvent.END, this.totalBounds);
@@ -6982,6 +6996,12 @@ class UIData extends LeafData {
             return strokeWidth;
     }
     get __hasStroke() { return this.stroke && this.strokeWidth; }
+    get __hasMultiPaint() {
+        const t = this;
+        if ((t.__isFills && t.fill.length > 1) || (t.__isStrokes && t.stroke.length > 1) || t.__useEffect)
+            return true;
+        return t.fill && this.__hasStroke;
+    }
     get __clipAfterFill() { return (this.cornerRadius || this.__pathInputed); }
     get __autoWidth() { return !this._width; }
     get __autoHeight() { return !this._height; }
@@ -7351,9 +7371,8 @@ const RectRender = {
                         canvas.strokeRect(half, half, width, height);
                         canvas.restore();
                     }
-                    else {
+                    else
                         canvas.strokeRect(half, half, width, height);
-                    }
                     break;
                 case 'outside':
                     canvas.strokeRect(-half, -half, width + __strokeWidth, height + __strokeWidth);
@@ -7383,11 +7402,15 @@ let UI = UI_1 = class UI extends Leaf {
         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);
@@ -7578,6 +7601,15 @@ __decorate([
 __decorate([
     boundsType(0)
 ], UI.prototype, "padding", void 0);
+__decorate([
+    boundsType(false)
+], UI.prototype, "lockRatio", void 0);
+__decorate([
+    boundsType()
+], UI.prototype, "widthRange", void 0);
+__decorate([
+    boundsType()
+], UI.prototype, "heightRange", void 0);
 __decorate([
     dataType(false)
 ], UI.prototype, "draggable", void 0);
@@ -7688,17 +7720,17 @@ let Group = class Group extends UI {
         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);
@@ -7811,8 +7843,8 @@ let Leafer = Leafer_1 = class Leafer extends Group {
     }
     onInit() { }
     initType(_type) { }
-    set(data) {
-        this.waitInit(() => { super.set(data); });
+    set(data, transition) {
+        this.waitInit(() => { super.set(data, transition); });
     }
     start() {
         clearTimeout(this.__startTimer);
@@ -7869,8 +7901,6 @@ let Leafer = Leafer_1 = class Leafer extends Group {
     __onResize(event) {
         this.emitEvent(event);
         DataHelper.copyAttrs(this.__, event, canvasSizeAttrs);
-        if (!event.width || !event.height)
-            debug$4.warn('w = 0 or h = 0');
         setTimeout(() => { if (this.canvasManager)
             this.canvasManager.clearRecycled(); }, 0);
     }
@@ -8195,9 +8225,6 @@ __decorate([
 __decorate([
     dataType(false)
 ], Box.prototype, "resizeChildren", void 0);
-__decorate([
-    dataType(false)
-], Box.prototype, "textBox", void 0);
 __decorate([
     affectRenderBoundsType('show')
 ], Box.prototype, "overflow", void 0);
@@ -8952,19 +8979,13 @@ class UIEvent extends Event {
         Object.assign(this, params);
     }
     getBoxPoint(relative) {
-        if (!relative)
-            relative = this.current;
-        return relative.getBoxPoint(this);
+        return (relative || this.current).getBoxPoint(this);
     }
     getInnerPoint(relative) {
-        if (!relative)
-            relative = this.current;
-        return relative.getInnerPoint(this);
+        return (relative || this.current).getInnerPoint(this);
     }
     getLocalPoint(relative) {
-        if (!relative)
-            relative = this.current;
-        return relative.getLocalPoint(this);
+        return (relative || this.current).getLocalPoint(this);
     }
     getPagePoint() {
         return this.current.getPagePoint(this);
@@ -9012,10 +9033,8 @@ let DragEvent = class DragEvent extends PointerEvent {
         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')
@@ -9025,8 +9044,7 @@ let DragEvent = class DragEvent extends PointerEvent {
         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);
@@ -9078,9 +9096,7 @@ let DragEvent = class DragEvent extends PointerEvent {
         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;
@@ -9198,7 +9214,8 @@ const debug$3 = Debug.get('LeaferTypeCreator');
 const LeaferTypeCreator = {
     list: {},
     register(name, fn) {
-        list$1[name] ? debug$3.repeat(name) : list$1[name] = fn;
+        list$1[name] && debug$3.repeat(name);
+        list$1[name] = fn;
     },
     run(name, leafer) {
         const fn = list$1[name];
@@ -10467,6 +10484,8 @@ function stroke(stroke, ui, canvas) {
             case 'center':
                 canvas.setStroke(stroke, __strokeWidth, options);
                 canvas.stroke();
+                if (options.__useArrow)
+                    strokeArrow(ui, canvas);
                 break;
             case 'inside':
                 canvas.save();
@@ -10504,6 +10523,8 @@ function strokes(strokes, ui, canvas) {
             case 'center':
                 canvas.setStroke(undefined, __strokeWidth, options);
                 drawStrokesStyle(strokes, false, ui, canvas);
+                if (options.__useArrow)
+                    strokeArrow(ui, canvas);
                 break;
             case 'inside':
                 canvas.save();
@@ -10529,6 +10550,14 @@ function strokes(strokes, ui, canvas) {
         }
     }
 }
+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) {
@@ -11214,16 +11243,16 @@ const EffectModule = {
 
 const { excludeRenderBounds } = LeafBoundsHelper;
 Group.prototype.__renderMask = function (canvas, options) {
-    let child, maskCanvas, contentCanvas, maskOpacity, currentMask;
+    let child, maskCanvas, contentCanvas, maskOpacity, currentMask, mask;
     const { children } = this;
     for (let i = 0, len = children.length; i < len; i++) {
-        child = children[i];
-        if (child.__.mask) {
+        child = children[i], mask = child.__.mask;
+        if (mask) {
             if (currentMask) {
                 maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity);
                 maskCanvas = contentCanvas = null;
             }
-            if (child.__.mask === 'path') {
+            if (mask === 'path' || mask === 'clipping-path') {
                 if (child.opacity < 1) {
                     currentMask = 'opacity-path';
                     maskOpacity = child.opacity;
@@ -11237,14 +11266,14 @@ Group.prototype.__renderMask = function (canvas, options) {
                 child.__clip(contentCanvas || canvas, options);
             }
             else {
-                currentMask = 'alpha';
+                currentMask = mask === 'grayscale' ? 'grayscale' : 'alpha';
                 if (!maskCanvas)
                     maskCanvas = getCanvas(canvas);
                 if (!contentCanvas)
                     contentCanvas = getCanvas(canvas);
                 child.__render(maskCanvas, options);
             }
-            if (child.__.mask !== 'clipping')
+            if (!(mask === 'clipping' || mask === 'clipping-path'))
                 continue;
         }
         if (excludeRenderBounds(child, options))
@@ -11255,6 +11284,8 @@ Group.prototype.__renderMask = function (canvas, options) {
 };
 function maskEnd(leaf, maskMode, canvas, contentCanvas, maskCanvas, maskOpacity) {
     switch (maskMode) {
+        case 'grayscale':
+            maskCanvas.useGrayscaleAlpha(leaf.__nowWorld);
         case 'alpha':
             usePixelMask(leaf, canvas, contentCanvas, maskCanvas);
             break;
@@ -11959,15 +11990,12 @@ const canvas = LeaferCanvasBase.prototype;
 const debug$1 = Debug.get('@leafer-ui/export');
 canvas.export = function (filename, options) {
     const { quality, blob } = FileHelper.getExportOptions(options);
-    if (filename.includes('.')) {
+    if (filename.includes('.'))
         return this.saveAs(filename, quality);
-    }
-    else if (blob) {
+    else if (blob)
         return this.toBlob(filename, quality);
-    }
-    else {
+    else
         return this.toDataURL(filename, quality);
-    }
 };
 canvas.toBlob = function (type, quality) {
     return new Promise((resolve) => {
@@ -13009,7 +13037,7 @@ class EditBox extends Group {
     }
     getPointStyle(userStyle) {
         const { stroke, strokeWidth, pointFill, pointSize, pointRadius } = this.editor.mergeConfig;
-        const defaultStyle = { fill: pointFill, stroke, strokeWidth, around: 'center', strokeAlign: 'center', width: pointSize, height: pointSize, cornerRadius: pointRadius };
+        const defaultStyle = { fill: pointFill, stroke, strokeWidth, around: 'center', strokeAlign: 'center', width: pointSize, height: pointSize, cornerRadius: pointRadius, offsetX: 0, offsetY: 0 };
         return userStyle ? Object.assign(defaultStyle, userStyle) : defaultStyle;
     }
     getPointsStyle() {
@@ -13091,9 +13119,10 @@ class EditBox extends Group {
         const { editor } = this;
         if (editor.single) {
             const { element } = editor;
-            if (element.isBranch) {
+            if (element.isBranch && !element.editInner) {
                 if (element.textBox) {
-                    const find = element.children.find(item => item.editable && item instanceof Text);
+                    const { children } = element;
+                    const find = children.find(item => item.editable && item instanceof Text) || children.find(item => item instanceof Text);
                     if (find)
                         return editor.openInnerEditor(find);
                 }
@@ -13353,7 +13382,8 @@ const EditToolCreator = {
     list: {},
     register(EditTool) {
         const { tag } = EditTool.prototype;
-        list[tag] ? debug.repeat(tag) : (list[tag] = EditTool);
+        list[tag] && debug.repeat(tag);
+        list[tag] = EditTool;
     },
     get(tag, editor) {
         return new list[tag](editor);
@@ -14047,12 +14077,16 @@ LineEditTool = __decorate([
 ], LineEditTool);
 
 Creator.editor = function (options) { return new Editor(options); };
+dataType(false)(Box.prototype, 'textBox');
 defineKey(UI.prototype, 'editOuter', {
     get() { return this.__.__isLinePath ? 'LineEditTool' : 'EditTool'; }
 });
 defineKey(UI.prototype, 'editInner', {
     get() { return 'PathEditor'; }
 });
+defineKey(Group.prototype, 'editInner', {
+    get() { return ''; }
+});
 defineKey(Text.prototype, 'editInner', {
     get() { return 'TextEditor'; }
 });
@@ -14349,13 +14383,13 @@ const half = { x: -0.5 };
 const angle = { connect: half, offset: { x: -0.71, bevelJoin: 0.36, roundJoin: 0.22 }, path: [1, -3, -3, 2, 0, 0, 2, -3, 3] };
 const angleSide = { connect: half, offset: { x: -1.207, bevelJoin: 0.854, roundJoin: 0.707 }, path: [1, -3, -3, 2, 0, 0, 2, -1, 0] };
 const triangleLinePath = [1, -3, 0, 2, -3, -2, 2, 0, 0, 2, -3, 2, 2, -3, 0];
-const triangle = { connect: half, offset: { x: -0.9, bevelJoin: 0.624, roundJoin: 0.4 }, path: [...triangleLinePath, 1, -2.05, 1.1, 2, -2.05, -1.1] };
+const triangle = { connect: half, offset: { x: -0.9, bevelJoin: 0.624, roundJoin: 0.4 }, path: [...triangleLinePath, 1, -2.05, 1.1, 2, -2.05, -1.1], dashPath: [1, -2, 0, 2, -0.5, 0] };
 const arrowLinePath = [1, -3, 0, 2, -3.5, -1.8, 2, 0, 0, 2, -3.5, 1.8, 2, -3, 0];
-const arrow = { connect: half, offset: { x: -1.1, bevelJoin: 0.872, roundJoin: 0.6 }, path: [...arrowLinePath, 1, -2.25, 0.95, 2, -2.25, -0.95] };
-const triangleFlip = { offset: half, path: [...triangle.path], };
+const arrow = { connect: half, offset: { x: -1.1, bevelJoin: 0.872, roundJoin: 0.6 }, path: [...arrowLinePath, 1, -2.25, 0.95, 2, -2.25, -0.95], dashPath: [1, -3, 0, 2, -0.5, 0] };
+const triangleFlip = { offset: half, path: [...triangle.path], dashPath: [1, -2.5, 0, 2, -1, 0] };
 rotate(triangleFlip.path, 180, { x: -1.5, y: 0 });
 const circleLine = { connect: { x: -1.3 }, path: [1, 1.8, -0.1, 2, 1.8, 0, 26, 0, 0, 1.8, 0, 359, 0], };
-const circle = { connect: { x: 0.5 }, path: [...circleLine.path, 1, 0, 0, 26, 0, 0, 1, 0, 360, 0] };
+const circle = { connect: { x: 0.5 }, path: [...circleLine.path, 1, 0, 0, 26, 0, 0, 1, 0, 360, 0], dashPath: [1, -0.5, 0, 2, 0.5, 0] };
 const squareLine = { connect: { x: -1.3 }, path: [1, -1.4, 0, 2, -1.4, -1.4, 2, 1.4, -1.4, 2, 1.4, 1.4, 2, -1.4, 1.4, 2, -1.4, 0] };
 const square = { path: [...squareLine.path, 2, -1.4, -0.49, 2, 1, -0.49, 1, -1.4, 0.49, 2, 1, 0.49] };
 const diamondLine = DataHelper.clone(squareLine);
@@ -14377,12 +14411,14 @@ const arrows = {
     'diamond-line': diamondLine,
     mark,
 };
-function getArrowPath(ui, arrow, from, to, scale, connectOffset) {
+function getArrowPath(ui, arrow, from, to, scale, connectOffset, hasDashPattern) {
     const { strokeCap, strokeJoin } = ui.__;
-    const { offset, connect, path } = (typeof arrow === 'object' ? arrow : arrows[arrow]);
+    const { offset, connect, path, dashPath } = (typeof arrow === 'object' ? arrow : arrows[arrow]);
     let connectX = connect ? connect.x : 0;
     let offsetX = offset ? offset.x : 0;
     const data = [...path];
+    if (hasDashPattern && dashPath)
+        data.push(...dashPath);
     if (strokeCap !== 'none')
         connectX -= 0.5;
     if (offset) {
@@ -14406,7 +14442,7 @@ const last = {}, now = {};
 const PathArrowModule = {
     list: arrows,
     addArrows(ui, changeRenderPath) {
-        const { startArrow, endArrow, strokeWidth, __pathForRender: data } = ui.__;
+        const { startArrow, endArrow, strokeWidth, dashPattern, __pathForRender: data } = ui.__;
         let command, i = 0, len = data.length, count = 0, useStartArrow = startArrow && startArrow !== 'none';
         while (i < len) {
             command = data[i];
@@ -14465,17 +14501,20 @@ const PathArrowModule = {
             if (count === 2 && useStartArrow)
                 copy(second, command === L ? now : last);
             if (i === len) {
-                const p = ui.__.__pathForRender = changeRenderPath ? [...data] : data;
+                const path = ui.__.__pathForRender = changeRenderPath ? [...data] : data;
+                const pathForArrow = ui.__.__pathForArrow = [];
                 if (useStartArrow) {
-                    p.push(...getArrowPath(ui, startArrow, second, first, strokeWidth, connectPoint));
+                    const startArrowPath = getArrowPath(ui, startArrow, second, first, strokeWidth, connectPoint, !!dashPattern);
+                    dashPattern ? pathForArrow.push(...startArrowPath) : path.push(...startArrowPath);
                     if (connectPoint.x) {
                         getDistancePoint(first, second, -connectPoint.x, true);
-                        p[1] = second.x;
-                        p[2] = second.y;
+                        path[1] = second.x;
+                        path[2] = second.y;
                     }
                 }
                 if (endArrow && endArrow !== 'none') {
-                    p.push(...getArrowPath(ui, endArrow, last, now, strokeWidth, connectPoint));
+                    const endArrowPath = getArrowPath(ui, endArrow, last, now, strokeWidth, connectPoint, !!dashPattern);
+                    dashPattern ? pathForArrow.push(...endArrowPath) : path.push(...endArrowPath);
                     if (connectPoint.x) {
                         getDistancePoint(now, last, -connectPoint.x, true);
                         let index;
@@ -14494,7 +14533,7 @@ const PathArrowModule = {
                                 break;
                         }
                         if (index)
-                            setPoint(p, last, index);
+                            setPoint(path, last, index);
                     }
                 }
             }
@@ -14619,7 +14658,7 @@ let TextEditor = class TextEditor extends InnerEditor {
         style.position = 'fixed';
         style.transformOrigin = 'left top';
         style.boxSizing = 'border-box';
-        this.isHTMLText ? div.innerHTML = text.text : div.innerText = text.text;
+        this.isHTMLText ? div.innerHTML = String(text.text) : div.innerText = String(text.text);
         const { view } = editor.app;
         (this.inBody = view instanceof HTMLCanvasElement) ? document.body.appendChild(div) : view.appendChild(div);
         this.eventIds = [
@@ -14680,8 +14719,10 @@ let TextEditor = class TextEditor extends InnerEditor {
         this.textScale = textScale;
         const { a, b, c, d, e, f } = new Matrix(text.worldTransform).scale(1 / textScale);
         let { x, y } = this.inBody ? text.app.clientBounds : text.app.tree.clientBounds;
+        if (!this.inBody)
+            x -= window.scrollX, y -= window.scrollY;
         let { width, height } = text;
-        x -= window.scrollX, y -= window.scrollY, width *= textScale, height *= textScale;
+        width *= textScale, height *= textScale;
         const data = text.__;
         if (data.__autoWidth && data.autoSizeAlign) {
             width += 20;