@visactor/vrender-core 0.22.0 → 0.22.1

package/dist/index.es.js

@@ -2963,24 +2963,40 @@ class CustomPath2D extends CurvePath {
                 case 's':
                     tempX = x + current[3];
                     tempY = y + current[4];
-                    controlX = 2 * x - controlX;
-                    controlY = 2 * y - controlY;
-                    this.bezierCurveTo(controlX + l, controlY + t, x + current[1] + l, y + current[2] + t, tempX + l, tempY + t);
-                    controlX = x + current[1];
-                    controlY = y + current[2];
+                    if (previous[0].match(/[CcSs]/) === null) {
+                        controlX = x;
+                        controlY = y;
+                    }
+                    else {
+                        controlX = 2 * x - controlX;
+                        controlY = 2 * y - controlY;
+                    }
+                    tempControlX = x + current[1];
+                    tempControlY = y + current[2];
+                    this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t);
+                    controlX = tempControlX;
+                    controlY = tempControlY;
                     x = tempX;
                     y = tempY;
                     break;
                 case 'S':
                     tempX = current[3];
                     tempY = current[4];
-                    controlX = 2 * x - controlX;
-                    controlY = 2 * y - controlY;
-                    this.bezierCurveTo(controlX + l, controlY + t, current[1] + l, current[2] + t, tempX + l, tempY + t);
+                    if (previous[0].match(/[CcSs]/) === null) {
+                        controlX = x;
+                        controlY = y;
+                    }
+                    else {
+                        controlX = 2 * x - controlX;
+                        controlY = 2 * y - controlY;
+                    }
+                    tempControlX = current[1];
+                    tempControlY = current[2];
+                    this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t);
+                    controlX = tempControlX;
+                    controlY = tempControlY;
                     x = tempX;
                     y = tempY;
-                    controlX = current[1];
-                    controlY = current[2];
                     break;
                 case 'q':
                     tempX = x + current[3];
@@ -3288,7 +3304,7 @@ const DefaultTextStyle = {
 const DefaultPickStyle = {
     pickStrokeBuffer: 0
 };
-const DefaultStyle = Object.assign(Object.assign(Object.assign(Object.assign({ forceBoundsWidth: undefined, forceBoundsHeight: undefined, opacity: 1, background: null, autoAnimateTexture: false, textureRatio: 0, textureOptions: null, backgroundOpacity: 1, backgroundCornerRadius: 0, texture: null, textureColor: 'black', textureSize: 10, texturePadding: 2, backgroundMode: 'no-repeat', backgroundFit: true, backgroundKeepAspectRatio: false, backgroundClip: true, backgroundScale: 1, backgroundOffsetX: 0, backgroundOffsetY: 0, blur: 0, filter: '', cursor: null, html: null, react: null }, DefaultFillStyle), DefaultStrokeStyle), DefaultLayout), DefaultPickStyle);
+const DefaultStyle = Object.assign(Object.assign(Object.assign(Object.assign({ forceBoundsWidth: undefined, forceBoundsHeight: undefined, opacity: 1, background: null, autoAnimateTexture: false, textureRatio: 1, textureOptions: null, backgroundOpacity: 1, backgroundCornerRadius: 0, texture: null, textureColor: 'black', textureSize: 10, texturePadding: 2, backgroundMode: 'no-repeat', backgroundFit: true, backgroundKeepAspectRatio: false, backgroundClip: true, backgroundScale: 1, backgroundOffsetX: 0, backgroundOffsetY: 0, blur: 0, filter: '', cursor: null, html: null, react: null }, DefaultFillStyle), DefaultStrokeStyle), DefaultLayout), DefaultPickStyle);
 const DefaultConnectAttribute = {
     connectedType: 'none',
     connectedStyle: {},
@@ -3321,7 +3337,7 @@ const DefaultRectAttribute = Object.assign(Object.assign({}, DefaultAttribute),
 const DefaultRect3dAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, x1: 0, y1: 0, cornerRadius: 0, length: 0, cornerType: 'round' });
 const DefaultSymbolAttribute = Object.assign(Object.assign({}, DefaultAttribute), { symbolType: 'circle', size: 10, keepDirIn3d: true, clipRange: 1 });
 const DefaultTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), { strokeBoundsBuffer: 0, keepDirIn3d: true });
-const DefaultRichTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), { editable: false, editOptions: null, ascentDescentMode: 'actual', width: 300, height: 300, ellipsis: true, wordBreak: 'break-word', verticalDirection: 'top', textAlign: 'left', textBaseline: 'top', layoutDirection: 'horizontal', textConfig: [], disableAutoWrapLine: false, maxHeight: undefined, maxWidth: undefined, singleLine: false });
+const DefaultRichTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), { upgradeAttrs: null, editable: false, editOptions: null, ascentDescentMode: 'actual', width: 300, height: 300, ellipsis: true, wordBreak: 'break-word', verticalDirection: 'top', textAlign: 'left', textBaseline: 'top', layoutDirection: 'horizontal', textConfig: [], disableAutoWrapLine: false, maxHeight: undefined, maxWidth: undefined, singleLine: false });
 const DefaultImageAttribute = Object.assign(Object.assign({ repeatX: 'no-repeat', repeatY: 'no-repeat', image: '', width: 0, height: 0 }, DefaultAttribute), { fill: true, cornerRadius: 0, cornerType: 'round' });
 const DefaultRichTextIconAttribute = Object.assign(Object.assign({}, DefaultImageAttribute), { backgroundShowMode: 'never', backgroundWidth: 0, backgroundHeight: 0, textAlign: 'left', textBaseline: 'middle', direction: 'horizontal', margin: 0, id: '', width: 20, height: 20, backgroundFill: 'rgba(101, 117, 168, 0.1)', backgroundFillOpacity: 1, backgroundStroke: false, backgroundStrokeOpacity: 1, backgroundRadius: 4, opacity: 1 });
 
@@ -12412,6 +12428,7 @@ class Graphic extends Node {
         }
         this.animates.set(animate.id, animate);
         animate.onRemove(() => {
+            animate.stop();
             this.animates.delete(animate.id);
         });
         return animate;
@@ -12533,10 +12550,12 @@ class Graphic extends Node {
         this.normalAttrs = null;
     }
     removeState(stateName, hasAnimation) {
-        const index = this.currentStates ? this.currentStates.indexOf(stateName) : -1;
-        if (index >= 0) {
-            const currentStates = this.currentStates.filter(state => state !== stateName);
-            this.useStates(currentStates, hasAnimation);
+        if (this.currentStates) {
+            const filter = isArray(stateName) ? (s) => !stateName.includes(s) : (s) => s !== stateName;
+            const newStates = this.currentStates.filter(filter);
+            if (newStates.length !== this.currentStates.length) {
+                this.useStates(newStates, hasAnimation);
+            }
         }
     }
     toggleState(stateName, hasAnimation) {
@@ -12712,7 +12731,9 @@ class Graphic extends Node {
             if (this.animates && this.animates.size) {
                 const timeline = stage.getTimeline();
                 this.animates.forEach(a => {
-                    a.setTimeline(timeline);
+                    if (a.timeline === defaultTimeline) {
+                        a.setTimeline(timeline);
+                    }
                 });
             }
             this._onSetStage && this._onSetStage(this, stage, layer);
@@ -12886,6 +12907,7 @@ class Graphic extends Node {
     detachShadow() {
         if (this.shadowRoot) {
             this.addUpdateBoundTag();
+            this.shadowRoot.release(true);
             this.shadowRoot = null;
         }
     }
@@ -12993,6 +13015,7 @@ class Graphic extends Node {
     }
     release() {
         this.releaseStatus = 'released';
+        this.stopAnimates();
         application.graphicService.onRelease(this);
     }
     _emitCustomEvent(type, context) {
@@ -13807,6 +13830,14 @@ class Group extends Graphic {
     getNoWorkAnimateAttr() {
         return Group.NOWORK_ANIMATE_ATTR;
     }
+    release(all) {
+        if (all) {
+            this.forEachChildren((g) => {
+                g.release(all);
+            });
+        }
+        super.release();
+    }
 }
 Group.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 function createGroup(attributes) {
@@ -17045,6 +17076,20 @@ let Symbol$1 = class Symbol extends Graphic {
         }
         return this._parsedPath;
     }
+    getParsedPath2D(x = 0, y = 0, size = 1) {
+        let path = null;
+        try {
+            path = new Path2D();
+        }
+        catch (err) {
+            return null;
+        }
+        const parsedPath = this.getParsedPath();
+        if (!parsedPath) {
+            return null;
+        }
+        parsedPath.draw(path, size, x, y);
+    }
     isValid() {
         return super.isValid() && this._isValid();
     }
@@ -17950,7 +17995,10 @@ class Paragraph {
         }
     }
     drawBackground(ctx, top, ascent, deltaLeft, isLineFirst, textAlign, lineHeight) {
-        if (!(this.character.background && (!this.character.backgroundOpacity || this.character.backgroundOpacity > 0))) {
+        if (!(this.text !== '' &&
+            this.text !== '\n' &&
+            this.character.background &&
+            (!this.character.backgroundOpacity || this.character.backgroundOpacity > 0))) {
             return;
         }
         let baseline = top + ascent;
@@ -17984,34 +18032,10 @@ class Paragraph {
                 }
             }
         }
-        switch (this.character.script) {
-            case 'super':
-                baseline -= this.ascent * (1 / 3);
-                break;
-            case 'sub':
-                baseline += this.descent / 2;
-                break;
-        }
-        if (direction === 'vertical') {
-            ctx.save();
-            ctx.rotateAbout(Math.PI / 2, left, baseline);
-            ctx.translate(-this.heightOrigin || -this.lineHeight / 2, -this.descent / 2);
-            ctx.translate(left, baseline);
-            left = 0;
-            baseline = 0;
-        }
-        const fillStyle = ctx.fillStyle;
-        const globalAlpha = ctx.globalAlpha;
-        ctx.fillStyle = this.character.background;
-        if (this.character.backgroundOpacity !== void 0) {
-            ctx.globalAlpha = this.character.backgroundOpacity;
-        }
         const right = left + (this.widthOrigin || this.width);
         const bottom = top + lineHeight;
         const lrtb = getFixedLRTB(left, right, top, bottom);
-        ctx.fillRect(lrtb.left, lrtb.top, lrtb.right - lrtb.left, lrtb.bottom - lrtb.top);
-        ctx.fillStyle = fillStyle;
-        ctx.globalAlpha = globalAlpha;
+        return Object.assign(Object.assign({}, lrtb), { fillStyle: this.character.background, globalAlpha: this.character.backgroundOpacity });
     }
     draw(ctx, top, ascent, deltaLeft, isLineFirst, textAlign, lineHeight) {
         let baseline = top + ascent;
@@ -18436,11 +18460,35 @@ class Line {
                 }
             }
         }
+        let fillStyle = '';
+        let globalAlpha = -1;
+        let currBgList = [];
+        const bgList = [currBgList];
         this.paragraphs.forEach((paragraph, index) => {
             if (paragraph instanceof RichTextIcon) {
                 return;
             }
-            paragraph.drawBackground(ctx, y, this.ascent, x, index === 0, this.textAlign, this.height);
+            const data = paragraph.drawBackground(ctx, y, this.ascent, x, index === 0, this.textAlign, this.height);
+            if (!data) {
+                return;
+            }
+            if (!(fillStyle === data.fillStyle && globalAlpha === data.globalAlpha)) {
+                currBgList = [];
+                bgList.push(currBgList);
+                fillStyle = data.fillStyle;
+                globalAlpha = data.globalAlpha;
+            }
+            currBgList.push(data);
+        });
+        bgList.forEach(bg => {
+            if (bg.length === 0) {
+                return;
+            }
+            const data = bg[0];
+            const end = bg[bg.length - 1];
+            ctx.fillStyle = data.fillStyle;
+            ctx.globalAlpha = data.globalAlpha;
+            ctx.fillRect(data.left, data.top, end.right - data.left, end.bottom - data.top);
         });
         this.paragraphs.forEach((paragraph, index) => {
             if (paragraph instanceof RichTextIcon) {
@@ -18872,6 +18920,9 @@ class RichText extends Graphic {
             application.graphicService.updateHTMLTextAABBBounds(attribute, richtextTheme, aabbBounds);
         }
         application.graphicService.transformAABBBounds(attribute, aabbBounds, richtextTheme, false, this);
+        if (aabbBounds.width() === 0 && aabbBounds.height() === 0) {
+            aabbBounds.clear();
+        }
         return aabbBounds;
     }
     needUpdateTags(keys) {
@@ -18907,8 +18958,8 @@ class RichText extends Graphic {
         return false;
     }
     combinedStyleToCharacter(config) {
-        const { fill, stroke, fontSize, fontFamily, fontStyle, fontWeight, lineWidth, opacity, fillOpacity, strokeOpacity } = this.attribute;
-        return Object.assign({ fill,
+        const { fill, stroke, fontSize, fontFamily, fontStyle, fontWeight, lineWidth, opacity, fillOpacity, lineHeight, strokeOpacity, upgradeAttrs } = this.attribute;
+        const out = Object.assign({ fill,
             stroke,
             fontSize,
             fontFamily,
@@ -18918,10 +18969,15 @@ class RichText extends Graphic {
             opacity,
             fillOpacity,
             strokeOpacity }, config);
+        if (upgradeAttrs === null || upgradeAttrs === void 0 ? void 0 : upgradeAttrs.lineHeight) {
+            out.lineHeight = lineHeight;
+        }
+        return out;
     }
     doUpdateFrameCache(tc) {
         var _a;
-        const { maxWidth, maxHeight, width, height, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection, singleLine, disableAutoWrapLine, editable, ascentDescentMode } = this.attribute;
+        const { maxWidth, maxHeight, width, height, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection, singleLine, disableAutoWrapLine, editable, ascentDescentMode, upgradeAttrs } = this.attribute;
+        const enableMultiBreakLine = upgradeAttrs && upgradeAttrs.multiBreakLine;
         let { textConfig: _tc = [] } = this.attribute;
         if (editable && _tc.length > 0 && !RichText.AllSingleCharacter(_tc)) {
             _tc = RichText.TransformTextConfig2SingleCharacter(_tc);
@@ -18956,7 +19012,16 @@ class RichText extends Graphic {
                 if (richTextConfig.text && richTextConfig.text.includes('\n')) {
                     const textParts = richTextConfig.text.split('\n');
                     for (let j = 0; j < textParts.length; j++) {
-                        paragraphs.push(new Paragraph(textParts[j], j !== 0, richTextConfig, ascentDescentMode));
+                        if (j === 0) {
+                            paragraphs.push(new Paragraph(textParts[j], false, richTextConfig, ascentDescentMode));
+                        }
+                        else if (textParts[j] || i === textConfig.length - 1) {
+                            paragraphs.push(new Paragraph(textParts[j], true, richTextConfig, ascentDescentMode));
+                        }
+                        else {
+                            const nextRichTextConfig = this.combinedStyleToCharacter(textConfig[i + 1]);
+                            paragraphs.push(new Paragraph(textParts[j], true, nextRichTextConfig, ascentDescentMode));
+                        }
                     }
                 }
                 else if (richTextConfig.text) {
@@ -18978,7 +19043,7 @@ class RichText extends Graphic {
         const frameHeight = richTextHeightEnable ? height : maxHeightFinite ? maxHeight : 0;
         const frame = new Frame(0, 0, frameWidth || 0, frameHeight || 0, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection || 'horizontal', !richTextWidthEnable && maxWidthFinite, !richTextHeightEnable && maxHeightFinite, singleLine || false, (_a = this._frameCache) === null || _a === void 0 ? void 0 : _a.icons);
         const wrapper = new Wrapper(frame);
-        wrapper.newLine = editable;
+        wrapper.newLine = enableMultiBreakLine;
         if (disableAutoWrapLine) {
             let lineCount = 0;
             let skip = false;
@@ -19026,7 +19091,7 @@ class RichText extends Graphic {
                 l.calcOffset(offsetSize, false);
             });
         }
-        if (editable) {
+        if (enableMultiBreakLine) {
             frame.lines.forEach(item => {
                 const lastParagraphs = item.paragraphs;
                 item.paragraphs = item.paragraphs.filter(p => p.text !== '');
@@ -20292,6 +20357,7 @@ class DefaultBaseTextureRenderContribution {
         this.time = BaseRenderContributionTime.afterFillStroke;
         this.useStyle = true;
         this.order = 10;
+        this._tempSymbolGraphic = null;
     }
     createCommonPattern(size, padding, color, targetContext, cb) {
         const r = (size - padding * 2) / 2;
@@ -20438,7 +20504,45 @@ class DefaultBaseTextureRenderContribution {
                     break;
             }
         }
-        if (pattern) {
+        if (textureOptions && textureOptions.dynamicTexture) {
+            context.save();
+            context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute);
+            context.clip();
+            const { gridConfig = {} } = textureOptions;
+            const b = graphic.AABBBounds;
+            const width = b.width();
+            const height = b.height();
+            const padding = texturePadding;
+            const cellSize = textureSize;
+            const gridColumns = gridConfig.columns ? gridConfig.columns : Math.ceil(width / cellSize);
+            const gridRows = gridConfig.rows ? gridConfig.rows : Math.ceil(height / cellSize);
+            const gutterColumn = gridConfig.gutterColumn ? gridConfig.gutterColumn : padding * 2;
+            const gutterRow = gridConfig.gutterRow ? gridConfig.gutterRow : padding * 2;
+            if (!this._tempSymbolGraphic) {
+                this._tempSymbolGraphic = createSymbol({});
+            }
+            const sizeW = gridConfig.columns ? width / gridConfig.columns : cellSize;
+            const sizeH = gridConfig.rows ? height / gridConfig.rows : cellSize;
+            this._tempSymbolGraphic.setAttributes({
+                size: [sizeW - gutterColumn, sizeH - gutterRow],
+                symbolType: texture
+            });
+            const parsedPath = this._tempSymbolGraphic.getParsedPath();
+            for (let i = 0; i < gridRows; i++) {
+                for (let j = 0; j < gridColumns; j++) {
+                    const _x = x + cellSize / 2 + j * cellSize;
+                    const _y = y + cellSize / 2 + i * cellSize;
+                    context.beginPath();
+                    if (parsedPath.draw(context, Math.min(sizeW - gutterColumn, sizeH - gutterRow), _x, _y, 0) === false) {
+                        context.closePath();
+                    }
+                    context.fillStyle = textureColor;
+                    textureOptions.dynamicTexture(context, i, j, gridRows, gridColumns, textureRatio, graphic);
+                }
+            }
+            context.restore();
+        }
+        else if (pattern) {
             context.highPerformanceSave();
             context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute);
             context.fillStyle = pattern;
@@ -26855,7 +26959,7 @@ function flatten_simplify(points, tolerance, highestQuality) {
 }
 
 function getDefaultCharacterConfig(attribute) {
-    const { fill = 'black', stroke = false, fontWeight = 'normal', fontFamily = 'Arial' } = attribute;
+    const { fill = 'black', stroke = false, fontWeight = 'normal', lineHeight, fontFamily = 'Arial' } = attribute;
     let { fontSize = 12 } = attribute;
     if (!isFinite(fontSize)) {
         fontSize = 12;
@@ -26865,7 +26969,8 @@ function getDefaultCharacterConfig(attribute) {
         stroke,
         fontSize,
         fontWeight,
-        fontFamily
+        fontFamily,
+        lineHeight
     };
 }
 function findConfigIndexByCursorIdx(textConfig, cursorIndex) {
@@ -27277,28 +27382,31 @@ class RichTextEditPlugin {
             throw new Error('不会走到这里 handleFocusOut');
         };
         this.handleMove = (e) => {
-            if (!this.isRichtext(e)) {
+            if (this.currRt && !this.currRt.attribute.editable) {
+                this.deFocus(true);
+            }
+            if (!this.isEditableRichtext(e)) {
+                this.handleLeave();
                 return;
             }
-            this.currRt = e.target;
-            this.handleEnter(e);
+            this.handleEnter();
             e.target.once('pointerleave', this.handleLeave, { capture: true });
             this.tryShowSelection(e, false);
         };
-        this.handleEnter = (e) => {
+        this.handleEnter = () => {
             this.editing = true;
             this.pluginService.stage.setCursor('text');
         };
-        this.handleLeave = (e) => {
+        this.handleLeave = () => {
             this.editing = false;
             this.pluginService.stage.setCursor('default');
         };
         this.handlePointerDown = (e) => {
-            if (this.editing) {
-                this.onFocus(e);
+            if (!this.editing || !this.isEditableRichtext(e)) {
+                this.deFocus(true);
             }
             else {
-                this.deFocus(true);
+                this.onFocus(e);
             }
             this.triggerRender();
             this.pointerDown = true;
@@ -27500,6 +27608,7 @@ class RichTextEditPlugin {
             else if (this.curCursorIdx > totalCursorCount + 0.1) {
                 this.curCursorIdx = totalCursorCount + 0.1;
             }
+            this.selectionStartCursorIdx = this.curCursorIdx;
             const pos = this.computedCursorPosByCursorIdx(this.curCursorIdx, this.currRt);
             this.setCursorAndTextArea(pos.x, pos.y1, pos.y2, this.currRt);
             this.hideSelection();
@@ -27600,7 +27709,7 @@ class RichTextEditPlugin {
             zIndex: -1
         });
         const shadow = this.getShadow(this.currRt);
-        shadow.add(this.shadowBounds);
+        this.addEditLineOrBgOrBounds(this.shadowBounds, shadow);
         this.offsetLineBgAndShadowBounds();
         this.offsetShadowRoot();
     }
@@ -27633,10 +27742,27 @@ class RichTextEditPlugin {
     stopPropagation(e) {
         e.stopPropagation();
     }
+    addEditLineOrBgOrBounds(graphic, shadowRoot) {
+        let group = shadowRoot.getElementById('emptyBoundsContainer');
+        if (!group) {
+            group = createGroup({ x: 0, y: 0, width: 0, height: 0, boundsMode: 'empty' });
+            group.id = 'emptyBoundsContainer';
+            shadowRoot.add(group);
+        }
+        group.add(graphic);
+    }
+    removeEditLineOrBgOrBounds(graphic, shadowRoot) {
+        const group = shadowRoot.getElementById('emptyBoundsContainer');
+        if (!group) {
+            return;
+        }
+        group.removeChild(graphic);
+    }
     onFocus(e, data) {
         this.updateCbs && this.updateCbs.forEach(cb => cb('beforeOnfocus', this));
         this.deFocus(false);
         this.focusing = true;
+        this.editing = true;
         const target = e.target;
         if (!(target && target.type === 'richtext')) {
             return;
@@ -27660,8 +27786,8 @@ class RichTextEditPlugin {
             this.ticker.start(true);
             const g = createGroup({ x: 0, y: 0, width: 0, height: 0 });
             this.editBg = g;
-            shadowRoot.add(this.editLine);
-            shadowRoot.add(this.editBg);
+            this.addEditLineOrBgOrBounds(this.editLine, shadowRoot);
+            this.addEditLineOrBgOrBounds(this.editBg, shadowRoot);
         }
         data = data || this.computedCursorPosByEvent(e, cache);
         if (data) {
@@ -27726,32 +27852,33 @@ class RichTextEditPlugin {
         }
     }
     deFocus(trulyDeFocus = false) {
+        this.editing = false;
         this.updateCbs && this.updateCbs.forEach(cb => cb('beforeDefocus', this, { trulyDeFocus }));
-        const target = this.currRt;
-        if (!target) {
+        const currRt = this.currRt;
+        if (!currRt) {
             return;
         }
-        const { editOptions = {} } = target.attribute;
+        const { editOptions = {} } = currRt.attribute;
         if (editOptions.stopPropagation) {
-            target.removeEventListener('*', this.stopPropagation);
+            currRt.removeEventListener('*', this.stopPropagation);
         }
         if (trulyDeFocus) {
             this.trySyncPlaceholderToTextConfig();
-            target.detachShadow();
+            currRt.detachShadow();
         }
-        const currRt = this.currRt;
         this.currRt = null;
+        const shadowRoot = this.getShadow(currRt);
         if (this.editLine) {
-            this.editLine.parent && this.editLine.parent.removeChild(this.editLine);
+            this.removeEditLineOrBgOrBounds(this.editLine, shadowRoot);
             this.editLine.release();
             this.editLine = null;
-            this.editBg.parent && this.editBg.parent.removeChild(this.editBg);
+            this.removeEditLineOrBgOrBounds(this.editBg, shadowRoot);
             this.editBg.release();
             this.editBg = null;
         }
         if (trulyDeFocus) {
             if (this.shadowBounds) {
-                this.shadowBounds.parent && this.shadowBounds.parent.removeChild(this.shadowBounds);
+                this.removeEditLineOrBgOrBounds(this.shadowBounds, shadowRoot);
                 this.shadowBounds.release();
                 this.shadowBounds = null;
             }
@@ -27762,17 +27889,10 @@ class RichTextEditPlugin {
             }
         }
         this.focusing = false;
-        const textConfig = currRt.attribute.textConfig;
-        let lastConfig = textConfig[textConfig.length - 1];
-        let cleared = false;
-        while (lastConfig && lastConfig.text === '\n') {
-            textConfig.pop();
-            lastConfig = textConfig[textConfig.length - 1];
-            cleared = true;
-        }
-        cleared && currRt.setAttributes({ textConfig });
+        currRt.removeEventListener('pointerleave', this.handleLeave);
     }
     addAnimateToLine(line) {
+        line.setAttributes({ opacity: 1 });
         line.animates &&
             line.animates.forEach(animate => {
                 animate.stop();
@@ -27903,7 +28023,7 @@ class RichTextEditPlugin {
     }
     getShadow(rt) {
         const sr = rt.shadowRoot || rt.attachShadow();
-        sr.setAttributes({ boundsMode: 'empty' });
+        sr.setAttributes({ width: 1, height: 1 });
         return sr;
     }
     getLineByPoint(cache, p1) {
@@ -27964,7 +28084,10 @@ class RichTextEditPlugin {
         return -1;
     }
     isRichtext(e) {
-        return !!(e.target && e.target.type === 'richtext' && e.target.attribute.editable);
+        return !!(e.target && e.target.type === 'richtext');
+    }
+    isEditableRichtext(e) {
+        return this.isRichtext(e) && !!e.target.attribute.editable;
     }
     triggerRender() {
         this.pluginService.stage.renderNextFrame();
@@ -28127,7 +28250,7 @@ class RichTextEditPlugin {
         }
     }
     _forceFocusByEvent(e) {
-        this.handleEnter(e);
+        this.handleEnter();
         this.handlePointerDown(e);
         this.handlePointerUp(e);
     }

package/es/allocator/bounds-allocate.js

@@ -29,4 +29,4 @@ export class DefaultBoundsAllocate {
 }
 
 export const boundsAllocate = new DefaultBoundsAllocate;
-//# sourceMappingURL=bounds-allocate.js.map
+//# sourceMappingURL=bounds-allocate.js.map

package/es/allocator/canvas-allocate.js

@@ -52,4 +52,4 @@ export class DefaultCanvasAllocate {
 }
 
 export const canvasAllocate = new DefaultCanvasAllocate;
-//# sourceMappingURL=canvas-allocate.js.map
+//# sourceMappingURL=canvas-allocate.js.map

package/es/allocator/constants.js

@@ -15,4 +15,4 @@ export const PathAllocate = Symbol.for("PathAllocate");
 export const SymbolAllocate = Symbol.for("SymbolAllocate");
 
 export const TextAllocate = Symbol.for("TextAllocate");
-//# sourceMappingURL=constants.js.map
+//# sourceMappingURL=constants.js.map

package/es/allocator/graphic-allocate.js

@@ -152,4 +152,4 @@ export class DefaultGraphicMemoryManager {
 }
 
 export const defaultGraphicMemoryManager = new DefaultGraphicMemoryManager;
-//# sourceMappingURL=graphic-allocate.js.map
+//# sourceMappingURL=graphic-allocate.js.map

package/es/allocator/matrix-allocate.js

@@ -68,4 +68,4 @@ export class DefaultMat4Allocate {
 export const matrixAllocate = new DefaultMatrixAllocate;
 
 export const mat4Allocate = new DefaultMat4Allocate;
-//# sourceMappingURL=matrix-allocate.js.map
+//# sourceMappingURL=matrix-allocate.js.map

package/es/animate/custom-animate.js

@@ -696,4 +696,5 @@ export class AnimateGroup1 extends ACustomAnimate {
             ratio = easingFunc(ratio), a.onUpdate(end, ratio, out);
         })), this.updating = !1);
     }
-}
+}
+//# sourceMappingURL=custom-animate.js.map

package/es/animate/index.js

@@ -12,5 +12,4 @@ export * from "./timeline";
 
 export * from "./group-fade";
 
-export * from "./easing";
-//# sourceMappingURL=index.js.map
+export * from "./easing";

package/es/color-string/store.js

@@ -44,4 +44,5 @@ export class ColorStore {
     }
 }
 
-ColorStore.store255 = {}, ColorStore.store1 = {};
+ColorStore.store255 = {}, ColorStore.store1 = {};
+//# sourceMappingURL=store.js.map

package/es/common/custom-path2d.js

@@ -204,15 +204,17 @@ export class CustomPath2D extends CurvePath {
                 break;
 
               case "s":
-                tempX = x + current[3], tempY = y + current[4], controlX = 2 * x - controlX, controlY = 2 * y - controlY, 
-                this.bezierCurveTo(controlX + l, controlY + t, x + current[1] + l, y + current[2] + t, tempX + l, tempY + t), 
-                controlX = x + current[1], controlY = y + current[2], x = tempX, y = tempY;
+                tempX = x + current[3], tempY = y + current[4], null === previous[0].match(/[CcSs]/) ? (controlX = x, 
+                controlY = y) : (controlX = 2 * x - controlX, controlY = 2 * y - controlY), tempControlX = x + current[1], 
+                tempControlY = y + current[2], this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t), 
+                controlX = tempControlX, controlY = tempControlY, x = tempX, y = tempY;
                 break;
 
               case "S":
-                tempX = current[3], tempY = current[4], controlX = 2 * x - controlX, controlY = 2 * y - controlY, 
-                this.bezierCurveTo(controlX + l, controlY + t, current[1] + l, current[2] + t, tempX + l, tempY + t), 
-                x = tempX, y = tempY, controlX = current[1], controlY = current[2];
+                tempX = current[3], tempY = current[4], null === previous[0].match(/[CcSs]/) ? (controlX = x, 
+                controlY = y) : (controlX = 2 * x - controlX, controlY = 2 * y - controlY), tempControlX = current[1], 
+                tempControlY = current[2], this.bezierCurveTo(controlX + l, controlY + t, tempControlX + l, tempControlY + t, tempX + l, tempY + t), 
+                controlX = tempControlX, controlY = tempControlY, x = tempX, y = tempY;
                 break;
 
               case "q":