@plait/mind 0.23.0 → 0.23.1

package/fesm2020/plait-mind.mjs

@@ -691,7 +691,8 @@ const adjustNodeToRoot = (board, node) => {
     delete newElement?.isCollapsed;
     const { width, height } = getTextSize(board, newElement.data.topic, TOPIC_DEFAULT_MAX_WORD_COUNT, {
         fontSize: ROOT_TOPIC_FONT_SIZE,
-        fontFamily: BRANCH_FONT_FAMILY
+        fontFamily: BRANCH_FONT_FAMILY,
+        width: node.manualWidth ? node.manualWidth : undefined
     });
     newElement.width = Math.max(width, getNodeDefaultFontSize(true));
     newElement.height = height;
@@ -2409,7 +2410,7 @@ const addEmoji = (board, element, emojiItem) => {
     const newEmojis = [...emojis];
     newEmojis.push(emojiItem);
     const newElement = {
-        data: { topic: element.data.topic, emojis: newEmojis }
+        data: { ...element.data, emojis: newEmojis }
     };
     const path = PlaitBoard.findPath(board, element);
     Transforms.setNode(board, newElement, path);
@@ -2417,7 +2418,7 @@ const addEmoji = (board, element, emojiItem) => {
 const removeEmoji = (board, element, emojiItem) => {
     const emojis = element.data.emojis.filter(value => value !== emojiItem);
     const newElement = {
-        data: { topic: element.data.topic }
+        data: { ...element.data }
     };
     if (emojis.length > 0) {
         newElement.data.emojis = emojis;
@@ -2441,6 +2442,7 @@ const replaceEmoji = (board, element, oldEmoji, newEmoji) => {
 };
 
 const removeImage = (board, element) => {
+    setImageFocus(board, element, false);
     const newElement = {
         data: { ...element.data }
     };
@@ -2951,7 +2953,7 @@ class MindNodeComponent extends PlaitPluginElementComponent {
         this.parentG = PlaitElement.getComponent(MindElement.getRoot(this.board, this.element)).rootG;
         this.drawShape();
         this.drawLink();
-        this.drawText();
+        this.drawTopic();
         this.activeDrawer.draw(this.element, this.g, { selected: this.selected, isEditing: this.textManage.isEditing });
         this.drawEmojis();
         this.drawExtend();
@@ -2960,18 +2962,6 @@ class MindNodeComponent extends PlaitPluginElementComponent {
             this.g.classList.add('branch');
         }
     }
-    editTopic() {
-        this.activeDrawer.draw(this.element, this.g, { selected: this.selected, isEditing: true });
-        if (this.element.manualWidth) {
-            const width = NodeSpace.getNodeResizableWidth(this.board, this.element);
-            this.textManage.updateWidth(width);
-        }
-        this.textManage.edit((origin) => {
-            if (origin === ExitOrigin.default) {
-                this.activeDrawer.draw(this.element, this.g, { selected: this.selected, isEditing: false });
-            }
-        });
-    }
     onContextChanged(value, previous) {
         const newNode = MindElement.getNode(value.element);
         const isEqualNode = RectangleClient.isEqual(this.node, newNode);
@@ -2984,8 +2974,7 @@ class MindNodeComponent extends PlaitPluginElementComponent {
             this.drawEmojis();
             this.drawExtend();
             this.imageDrawer.updateImage(this.g, previous.element, value.element);
-            this.textManage.updateText(this.element.data.topic);
-            this.textManage.updateRectangle();
+            this.updateTopic();
         }
         else {
             const hasSameSelected = value.selected === previous.selected;
@@ -3064,9 +3053,25 @@ class MindNodeComponent extends PlaitPluginElementComponent {
             this.extendG.remove();
         }
     }
-    drawText() {
+    drawTopic() {
         this.textManage.draw(this.element.data.topic);
         this.g.append(this.textManage.g);
+        if (this.element.manualWidth) {
+            const width = NodeSpace.getNodeResizableWidth(this.board, this.element);
+            this.textManage.updateWidth(width);
+        }
+    }
+    updateTopic() {
+        this.textManage.updateText(this.element.data.topic);
+        this.textManage.updateRectangle();
+    }
+    editTopic() {
+        this.activeDrawer.draw(this.element, this.g, { selected: this.selected, isEditing: true });
+        this.textManage.edit((origin) => {
+            if (origin === ExitOrigin.default) {
+                this.activeDrawer.draw(this.element, this.g, { selected: this.selected, isEditing: false });
+            }
+        });
     }
     ngOnDestroy() {
         super.ngOnDestroy();
@@ -3476,7 +3481,10 @@ const insertClipboardData = (board, elements, targetPoint) => {
             if (item.isRoot) {
                 newElement = adjustRootToNode(board, newElement);
                 const styles = PlaitMind.isMind(targetParent) ? { fontFamily: BRANCH_FONT_FAMILY } : { fontFamily: DEFAULT_FONT_FAMILY };
-                const { width, height } = getTextSize(board, newElement.data.topic, TOPIC_DEFAULT_MAX_WORD_COUNT, styles);
+                const { width, height } = getTextSize(board, newElement.data.topic, TOPIC_DEFAULT_MAX_WORD_COUNT, {
+                    ...styles,
+                    width: newElement.manualWidth ? newElement.manualWidth : undefined
+                });
                 newElement.width = Math.max(width, getNodeDefaultFontSize());
                 newElement.height = height;
             }
@@ -3940,7 +3948,6 @@ const withNodeImage = (board) => {
         const selectedImageElement = getSelectedImageElement(board);
         if (!PlaitBoard.isReadonly(board) && selectedImageElement && (hotkeys.isDeleteBackward(event) || hotkeys.isDeleteForward(event))) {
             addSelectedElement(board, selectedImageElement);
-            setImageFocus(board, selectedImageElement, false);
             MindTransforms.removeImage(board, selectedImageElement);
             return;
         }