From 520e06d2eb78454940b5f6a4330b7a5689ca4ca1 Mon Sep 17 00:00:00 2001
From: Knut Sveidqvist <knsv@sveido.com>
Date: Fri, 31 May 2024 10:52:23 +0200
Subject: [PATCH] #5237 State diagram bugfixes

---
 cypress/platform/knsv2.html                        | 14 +++++++++-----
 packages/mermaid/package.json                      |  2 +-
 packages/mermaid/src/diagrams/state/dataFetcher.js |  5 +++++
 packages/mermaid/src/diagrams/state/stateDb.js     |  5 ++---
 .../src/rendering-util/rendering-elements/nodes.js |  1 +
 .../rendering-elements/shapes/rectWithTitle.ts     | 12 ++++++++++++
 .../rendering-elements/shapes/roundedRect.ts       |  1 -
 7 files changed, 30 insertions(+), 10 deletions(-)
 create mode 100644 packages/mermaid/src/rendering-util/rendering-elements/shapes/rectWithTitle.ts

diff --git a/cypress/platform/knsv2.html b/cypress/platform/knsv2.html
index 1c46866c5..473cd22ed 100644
--- a/cypress/platform/knsv2.html
+++ b/cypress/platform/knsv2.html
@@ -136,13 +136,17 @@ sequenceDiagram
       </pre
     >
 
-    <pre id="diagram" class="mermaid2">
-      %%{init: {"layout": "elk", "mergeEdges": true} }%%
+    <pre id="diagram" class="mermaid">
 stateDiagram
-      A --> B
+  S:Stillas
       </pre
     >
     <pre id="diagram" class="mermaid">
+stateDiagram
+  state "This is a state description" as S
+      </pre
+    >
+    <pre id="diagram" class="mermaid2">
       %%{init: {"layout": "elk", "mergeEdges": true} }%%
 flowchart
       A --> B(This is B)
@@ -254,8 +258,8 @@ stateDiagram-v2
         handdrawnSeed: 12,
         look: 'handdrawn',
         'elk.nodePlacement.strategy': 'NETWORK_SIMPLEX',
-        // layout: 'dagre',
-        layout: 'elk',
+        layout: 'dagre',
+        // layout: 'elk',
         flowchart: { titleTopMargin: 10 },
         // fontFamily: 'Caveat',
         // fontFamily: 'Kalam',
diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json
index a844e9087..5dbc9ee43 100644
--- a/packages/mermaid/package.json
+++ b/packages/mermaid/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-chart/mermaid",
-  "version": "11.0.0-beta.3",
+  "version": "11.0.0-beta.6",
   "description": "Markdown-ish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.",
   "type": "module",
   "module": "./dist/mermaid.core.mjs",
diff --git a/packages/mermaid/src/diagrams/state/dataFetcher.js b/packages/mermaid/src/diagrams/state/dataFetcher.js
index 022fa8cc7..b8302cc22 100644
--- a/packages/mermaid/src/diagrams/state/dataFetcher.js
+++ b/packages/mermaid/src/diagrams/state/dataFetcher.js
@@ -408,3 +408,8 @@ export const dataFetcher = (
     setupDoc(parsedItem, parsedItem.doc, diagramStates, nodes, edges, !altFlag, useRough, look);
   }
 };
+
+export const reset = () => {
+  nodeDb = {};
+  graphItemCount = 0;
+};
diff --git a/packages/mermaid/src/diagrams/state/stateDb.js b/packages/mermaid/src/diagrams/state/stateDb.js
index cfe53b0f6..1b7f542fb 100644
--- a/packages/mermaid/src/diagrams/state/stateDb.js
+++ b/packages/mermaid/src/diagrams/state/stateDb.js
@@ -11,7 +11,7 @@ import {
   setDiagramTitle,
   getDiagramTitle,
 } from '../common/commonDb.js';
-import { dataFetcher } from './dataFetcher.js';
+import { dataFetcher, reset as resetDataFetching } from './dataFetcher.js';
 
 import {
   DEFAULT_DIAGRAM_DIRECTION,
@@ -584,9 +584,8 @@ export const getData = () => {
   const config = getConfig();
   const useRough = config.look === 'handdrawn';
   const look = config.look;
+  resetDataFetching();
   dataFetcher(undefined, getRootDocV2(), diagramStates, nodes, edges, true, useRough, look);
-
-  console.log('State Nodes XDX:', nodes);
   return { nodes, edges, other: {}, config };
 };
 
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/nodes.js b/packages/mermaid/src/rendering-util/rendering-elements/nodes.js
index 99791a167..964a9a9b3 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/nodes.js
+++ b/packages/mermaid/src/rendering-util/rendering-elements/nodes.js
@@ -36,6 +36,7 @@ const shapes = {
   choice,
   note,
   roundedRect,
+  rectWithTitle: roundedRect,
   squareRect,
   stadium,
   subroutine,
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectWithTitle.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectWithTitle.ts
new file mode 100644
index 000000000..636116132
--- /dev/null
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectWithTitle.ts
@@ -0,0 +1,12 @@
+import type { Node, RectOptions } from '$root/rendering-util/types.d.ts';
+import { drawRect } from './drawRect.js';
+
+export const roundedRect = async (parent: SVGAElement, node: Node) => {
+  const options = {
+    rx: 5,
+    ry: 5,
+    classes: '',
+  } as RectOptions;
+
+  return drawRect(parent, node, options);
+};
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/roundedRect.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/roundedRect.ts
index aa254c000..636116132 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/roundedRect.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/roundedRect.ts
@@ -8,6 +8,5 @@ export const roundedRect = async (parent: SVGAElement, node: Node) => {
     classes: '',
   } as RectOptions;
 
-  console.log('roundedRect XDX');
   return drawRect(parent, node, options);
 };