feat: insert child node command

tzuyi0817 · May 17, 2024 · 55d7c07 · 55d7c07
1 parent b4e2f98
commit 55d7c07
Show file tree

Hide file tree

Showing 6 changed files with 41 additions and 27 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -20,5 +20,5 @@
   },
   "files.associations": {},
   "typescript.tsdk": "node_modules/typescript/lib",
-  "cSpell.words": ["dotenv", "bbox", "deepmerge", "clsx", "svgdotjs", "uuidv4", "contenteditable", "rbox"]
+  "cSpell.words": ["dotenv", "bbox", "deepmerge", "clsx", "svgdotjs", "uuidv4", "contenteditable", "rbox", "sonarjs"]
 }
diff --git a/packages/mind-mapping/core/node/expand-button.ts b/packages/mind-mapping/core/node/expand-button.ts
@@ -13,7 +13,7 @@ class ExpandButton {
   constructor(public parent: MindNode) {}
 
   get isRequired() {
-    return this.parent.node.children.length && !this.parent.renderTree.isRoot;
+    return this.parent.nodeData.children.length && !this.parent.renderTree.isRoot;
   }
   get expandButtonSize() {
     return this.parent.renderer.options.expandButtonSize;

diff --git a/packages/mind-mapping/core/node/index.ts b/packages/mind-mapping/core/node/index.ts
@@ -57,20 +57,20 @@ class MindNode extends CreateNode {
   get childrenAreaHeight() {
     return this.children.reduce((total, { height }) => total + height, 0);
   }
-  get node() {
+  get nodeData() {
     return this.renderTree.node;
   }
   get deep() {
     return this.renderTree.deep ?? 0;
   }
   get isActive() {
-    return this.node.isActive ?? false;
+    return this.nodeData.isActive ?? false;
   }
   get isExpand() {
-    return this.node.isExpand ?? true;
+    return this.nodeData.isExpand ?? true;
   }
   get isShowGeneralization() {
-    return this.isExpand && !!this.node.data.generalization;
+    return this.isExpand && !!this.nodeData.data.generalization;
   }
   get linesGroup() {
     return this.renderer.mindMapping.linesGroup;
@@ -79,10 +79,10 @@ class MindNode extends CreateNode {
     return this.renderer.mindMapping.nodesGroup;
   }
   set isActive(value: boolean) {
-    this.renderTree.node.isActive = value;
+    this.nodeData.isActive = value;
   }
   set isExpand(value: boolean) {
-    this.renderTree.node.isExpand = value;
+    this.nodeData.isExpand = value;
   }
   createContent() {
     this.text = this.createTextNode();
@@ -132,9 +132,9 @@ class MindNode extends CreateNode {
           await Promise.all(this.children.map(child => child.render()));
         }
         resolve(true);
-        if (!this.node.isEditor) return;
+        if (!this.nodeData.isEditor) return;
         this.renderer.editor.show({ node: this, isInsert: true });
-        this.node.isEditor = false;
+        this.nodeData.isEditor = false;
       });
     });
   }

diff --git a/packages/mind-mapping/core/renderer/command.ts b/packages/mind-mapping/core/renderer/command.ts
@@ -23,25 +23,20 @@ class RendererCommand {
     this.command.add('REMOVE_NODE', this.removeNode);
   }
   insertNode(specifyNodes: MindNode[] = []) {
-    if (!this.renderer.activeNodes.size && !specifyNodes.length) return;
-    const nodes = specifyNodes.length ? specifyNodes : [...this.renderer.activeNodes];
+    const nodes = this.setupSelectNodes(specifyNodes);
+    if (!nodes) return;
     const isMultiple = nodes.length > 1;
     const { isActive, isEditor } = this.getNodeBehavior(isMultiple);
     const { secondary, branch } = this.renderer.options.createNodeText;
 
     for (const node of nodes) {
       if (!node.parent) continue;
-      const { children } = node.parent.node;
+      const { children } = node.parent.nodeData;
       const index = children.findIndex(child => child.instance === node);
 
       if (index < 0) continue;
       const text = node.deep === 1 ? secondary : branch;
-      const insertData = {
-        data: { text },
-        children: [],
-        isActive,
-        isEditor,
-      };
+      const insertData = { data: { text }, children: [], isActive, isEditor };
 
       children.splice(index + 1, 0, insertData);
     }
@@ -50,15 +45,29 @@ class RendererCommand {
     this.renderer.render();
   }
   insertChildNode(specifyNodes: MindNode[] = []) {
-    console.log(specifyNodes, 'insertChildNode');
+    const nodes = this.setupSelectNodes(specifyNodes);
+    if (!nodes) return;
+    const isMultiple = nodes.length > 1;
+    const { isActive, isEditor } = this.getNodeBehavior(isMultiple);
+    const { secondary, branch } = this.renderer.options.createNodeText;
+
+    for (const node of nodes) {
+      const text = node.renderTree.isRoot ? secondary : branch;
+      const insertData = { data: { text }, children: [], isActive, isEditor };
+
+      node.nodeData.children.push(insertData);
+    }
+    this.renderer.editor.hide();
+    this.renderer.clearActiveNodes();
+    this.renderer.render();
   }
   removeNode(specifyNodes: MindNode[] = []) {
-    if (!this.renderer.activeNodes.size && !specifyNodes.length) return;
-    const nodes = specifyNodes.length ? specifyNodes : [...this.renderer.activeNodes];
+    const nodes = this.setupSelectNodes(specifyNodes);
+    if (!nodes) return;
     const root = nodes.find(node => node.renderTree.isRoot);
 
     if (root) {
-      root.node.children = [];
+      root.nodeData.children = [];
       this.renderer.clearActiveNodes();
     } else {
       const manualActiveNode = this.getManualActiveNode(nodes);
@@ -75,6 +84,11 @@ class RendererCommand {
     this.renderer.editor.hide();
     this.renderer.render();
   }
+  setupSelectNodes(specifyNodes: MindNode[]) {
+    if (!this.renderer.activeNodes.size && !specifyNodes.length) return null;
+
+    return specifyNodes.length ? specifyNodes : [...this.renderer.activeNodes];
+  }
   getNodeBehavior(isMultiple: boolean) {
     const { createNodeBehavior } = this.renderer.options;
     const { DEFAULT } = CREATE_NODE_BEHAVIOR;
@@ -91,7 +105,7 @@ class RendererCommand {
     const parent = node.parent;
 
     if (!parent || !activeNodes.has(node)) return null;
-    const siblings = parent.node.children;
+    const siblings = parent.nodeData.children;
 
     if (siblings.length === 1) return parent;
     const index = findNodeIndex(node, siblings);

diff --git a/packages/mind-mapping/core/renderer/index.ts b/packages/mind-mapping/core/renderer/index.ts
@@ -129,12 +129,12 @@ class Renderer {
     if (!nodes.length) return;
     const insertNodes = this.separateNodes(nodes);
 
-    toNode.node.children.push(...insertNodes);
+    toNode.nodeData.children.push(...insertNodes);
     this.render();
   }
   moveNodesToBeSibling(nodes: MindNode[], toNode: MindNode, position: 'before' | 'after') {
     if (!toNode.parent || !nodes.length) return;
-    const { children } = toNode.parent.node;
+    const { children } = toNode.parent.nodeData;
     const index = findNodeIndex(toNode, children);
 
     if (index < 0) return;

diff --git a/packages/mind-mapping/utils/element.ts b/packages/mind-mapping/utils/element.ts
@@ -70,7 +70,7 @@ export function findNodeIndex(node: MindNode, siblings: MappingBase[]) {
 
 export function removeNode(node: MindNode) {
   if (!node.parent) return false;
-  const { children } = node.parent.node;
+  const { children } = node.parent.nodeData;
   const index = findNodeIndex(node, children);
 
   if (index < 0) return false;