From 5e6215d4f2d1829ec051f90dec2a7caf06fd40b9 Mon Sep 17 00:00:00 2001
From: Knut Sveidqvist <knsv@sveido.com>
Date: Fri, 28 Jun 2024 08:32:33 +0200
Subject: [PATCH] #5237 Fix for issue with text-centering in state-diagrams
 with htmlLabels true and subgraph title bkg

---
 packages/mermaid/src/diagrams/flowchart/styles.ts | 5 ++++-
 packages/mermaid/src/rendering-util/createText.ts | 5 +----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/mermaid/src/diagrams/flowchart/styles.ts b/packages/mermaid/src/diagrams/flowchart/styles.ts
index 4821f4e19..549fddec1 100644
--- a/packages/mermaid/src/diagrams/flowchart/styles.ts
+++ b/packages/mermaid/src/diagrams/flowchart/styles.ts
@@ -41,6 +41,9 @@ const getStyles = (options: FlowChartStyleOptions) =>
   .cluster-label span {
     color: ${options.titleColor};
   }
+  .cluster-label span p {
+    background-color: transparent;
+  }
 
   .label text,span {
     fill: ${options.nodeTextColor || options.textColor};
@@ -56,7 +59,7 @@ const getStyles = (options: FlowChartStyleOptions) =>
     stroke: ${options.nodeBorder};
     stroke-width: 1px;
   }
-  .flowchart-label text {
+  .node .label text {
     text-anchor: middle;
   }
   // .flowchart-label .text-outer-tspan {
diff --git a/packages/mermaid/src/rendering-util/createText.ts b/packages/mermaid/src/rendering-util/createText.ts
index 307f25734..5faba227a 100644
--- a/packages/mermaid/src/rendering-util/createText.ts
+++ b/packages/mermaid/src/rendering-util/createText.ts
@@ -233,10 +233,7 @@ export const createText = async (
       structuredText,
       text ? addSvgBackground : false
     );
-    svgLabel.setAttribute(
-      'style',
-      style.replace('fill:', 'color:') + (isNode ? ';text-anchor: middle;' : '')
-    );
+    svgLabel.setAttribute('style', style.replace('fill:', 'color:'));
     return svgLabel;
   }
 };