Fix for node with wrong type

cypress/integration/rendering/stateDiagram-v2.spec.js

@@ -359,6 +359,18 @@ stateDiagram-v2
       }
     );
   });
+  it('v2 state label with names in it', () => {
+    imgSnapshotTest(
+      `
+      stateDiagram-v2
+        Yswsii: Your state with spaces in it
+        [*] --> Yswsii
+    `,
+      {
+        logLevel: 0,
+      }
+    );
+  });
   it('v2 Simplest composite state', () => {
     imgSnapshotTest(
       `

dist/mermaid.core.js

@@ -24130,7 +24130,11 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
 
           if (nodeDb[node.id].description === node.id) {
             // If the previous description was the is, remove it
-            nodeDb[node.id].description = [node.description];
+            if (Array.isArray(node.description)) {
+              nodeDb[node.id].description = node.description;
+            } else {
+              nodeDb[node.id].description = [node.description];
+            }
           } else {
             nodeDb[node.id].description = [nodeDb[node.id].description, node.description];
           }
@@ -24139,8 +24143,6 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
           nodeDb[node.id].description = node.description;
         }
       }
-
-      nodeDb[node.id].description = _common_common__WEBPACK_IMPORTED_MODULE_5__["default"].sanitizeTextOrArray(nodeDb[node.id].description, (0,_config__WEBPACK_IMPORTED_MODULE_6__.getConfig)());
     } // Save data for description and group so that for instance a statement without description overwrites
     // one with description
     // group
@@ -24154,10 +24156,18 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
       nodeDb[node.id].classes = nodeDb[node.id].classes + ' ' + (altFlag ? 'statediagram-cluster statediagram-cluster-alt' : 'statediagram-cluster');
     }
 
+    var nodeShape = nodeDb[node.id].shape;
+    var nodeLabelText = nodeDb[node.id].description;
+
+    if (Array.isArray(nodeLabelText) && nodeLabelText.length == 1) {
+      nodeShape = 'rect';
+      nodeLabelText = nodeLabelText[0];
+    }
+
     var nodeData = {
       labelStyle: '',
-      shape: nodeDb[node.id].shape,
+      shape: nodeShape,
-      labelText: nodeDb[node.id].description,
+      labelText: nodeLabelText,
       // typeof nodeDb[node.id].description === 'object'
       //   ? nodeDb[node.id].description[0]
       //   : nodeDb[node.id].description,

dist/mermaid.js

@@ -24161,7 +24161,11 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
 
           if (nodeDb[node.id].description === node.id) {
             // If the previous description was the is, remove it
-            nodeDb[node.id].description = [node.description];
+            if (Array.isArray(node.description)) {
+              nodeDb[node.id].description = node.description;
+            } else {
+              nodeDb[node.id].description = [node.description];
+            }
           } else {
             nodeDb[node.id].description = [nodeDb[node.id].description, node.description];
           }
@@ -24170,8 +24174,6 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
           nodeDb[node.id].description = node.description;
         }
       }
-
-      nodeDb[node.id].description = _common_common__WEBPACK_IMPORTED_MODULE_5__["default"].sanitizeTextOrArray(nodeDb[node.id].description, (0,_config__WEBPACK_IMPORTED_MODULE_6__.getConfig)());
     } // Save data for description and group so that for instance a statement without description overwrites
     // one with description
     // group
@@ -24185,10 +24187,18 @@ var setupNode = function setupNode(g, parent, node, altFlag) {
       nodeDb[node.id].classes = nodeDb[node.id].classes + ' ' + (altFlag ? 'statediagram-cluster statediagram-cluster-alt' : 'statediagram-cluster');
     }
 
+    var nodeShape = nodeDb[node.id].shape;
+    var nodeLabelText = nodeDb[node.id].description;
+
+    if (Array.isArray(nodeLabelText) && nodeLabelText.length == 1) {
+      nodeShape = 'rect';
+      nodeLabelText = nodeLabelText[0];
+    }
+
     var nodeData = {
       labelStyle: '',
-      shape: nodeDb[node.id].shape,
+      shape: nodeShape,
-      labelText: nodeDb[node.id].description,
+      labelText: nodeLabelText,
       // typeof nodeDb[node.id].description === 'object'
       //   ? nodeDb[node.id].description[0]
       //   : nodeDb[node.id].description,

src/dagre-wrapper/shapes/util.js

@@ -19,11 +19,13 @@ export const labelHelper = (parent, node, _classes, isNode) => {
   // Create the label and insert it after the rect
   const label = shapeSvg.insert('g').attr('class', 'label').attr('style', node.labelStyle);
 
+  const labelText = typeof node.labelText === 'string' ? node.labelText:node.labelText[0];
+
   const text = label
     .node()
     .appendChild(
       createLabel(
-        sanitizeText(decodeEntities(node.labelText), getConfig()),
+        sanitizeText(decodeEntities(labelText), getConfig()),
         node.labelStyle,
         false,
         isNode

src/diagrams/state/stateRenderer-v2.js

@@ -70,11 +70,7 @@ const setupNode = (g, parent, node, altFlag) => {
           nodeDb[node.id].shape = 'rectWithTitle';
           if (nodeDb[node.id].description === node.id) {
             // If the previous description was the is, remove it
-            if (Array.isArray(node.description)) {
+            nodeDb[node.id].description = [node.description];
-              nodeDb[node.id].description = node.description;
-            } else {
-              nodeDb[node.id].description = [node.description];
-            }
           } else {
             nodeDb[node.id].description = [nodeDb[node.id].description, node.description];
           }
@@ -83,6 +79,15 @@ const setupNode = (g, parent, node, altFlag) => {
           nodeDb[node.id].description = node.description;
         }
       }
+      nodeDb[node.id].description = common.sanitizeTextOrArray(
+        nodeDb[node.id].description,
+        getConfig()
+      );
+    }
+
+    //
+    if (nodeDb[node.id].description.length === 1 && nodeDb[node.id].shape === 'rectWithTitle') {
+      nodeDb[node.id].shape = 'rect';
     }
 
     // Save data for description and group so that for instance a statement without description overwrites
@@ -100,17 +105,10 @@ const setupNode = (g, parent, node, altFlag) => {
         (altFlag ? 'statediagram-cluster statediagram-cluster-alt' : 'statediagram-cluster');
     }
 
-    let nodeShape = nodeDb[node.id].shape;
-    let nodeLabelText = nodeDb[node.id].description;
-    if (Array.isArray(nodeLabelText) && nodeLabelText.length == 1) {
-      nodeShape = 'rect';
-      nodeLabelText = nodeLabelText[0];
-    }
-
     const nodeData = {
       labelStyle: '',
-      shape: nodeShape,
+      shape: nodeDb[node.id].shape,
-      labelText: nodeLabelText,
+      labelText: nodeDb[node.id].description,
       // typeof nodeDb[node.id].description === 'object'
       //   ? nodeDb[node.id].description[0]
       //   : nodeDb[node.id].description,