From 9093ba56e6eec25ef223475d1354a52e30d0d552 Mon Sep 17 00:00:00 2001
From: yuetsh <517252939@qq.com>
Date: Wed, 20 May 2026 08:12:46 -0600
Subject: [PATCH] fix in low version

---
 src/mermaid-legacy.d.ts              |  1 +
 src/shared/composables/useMermaid.ts | 25 +++++++++++++++++++------
 2 files changed, 20 insertions(+), 6 deletions(-)
 create mode 100644 src/mermaid-legacy.d.ts

diff --git a/src/mermaid-legacy.d.ts b/src/mermaid-legacy.d.ts
new file mode 100644
index 0000000..a0c9382
--- /dev/null
+++ b/src/mermaid-legacy.d.ts
@@ -0,0 +1 @@
+declare module "mermaid-legacy"
diff --git a/src/shared/composables/useMermaid.ts b/src/shared/composables/useMermaid.ts
index a34c690..0925627 100644
--- a/src/shared/composables/useMermaid.ts
+++ b/src/shared/composables/useMermaid.ts
@@ -5,6 +5,7 @@ const mermaidThemeVariables = {
   primaryTextColor: "#0f172a",
   primaryBorderColor: "#0284c7",
   lineColor: "#64748b",
+  arrowheadColor: "#64748b",
   secondaryColor: "#f5f3ff",
   tertiaryColor: "#ecfdf5",
   background: "#ffffff",
@@ -256,14 +257,16 @@ function getChromeVersion(): number {
 }
 
 let mermaidInstance: any = null
+let mermaidIsLegacy = false
 
 async function loadMermaid() {
   if (!mermaidInstance) {
-    const mermaidModule =
-      getChromeVersion() < 94
-        ? await import("mermaid-legacy")
-        : await import("mermaid")
-    mermaidInstance = mermaidModule.default
+    if (getChromeVersion() < 94) {
+      mermaidInstance = (await import("mermaid-legacy")).default
+      mermaidIsLegacy = true
+    } else {
+      mermaidInstance = (await import("mermaid")).default
+    }
     mermaidInstance.initialize({
       startOnLoad: false,
       securityLevel: "strict",
@@ -294,7 +297,17 @@ export function useMermaid() {
     try {
       const m = await loadMermaid()
       const id = `mermaid-${getRandomId()}`
-      const { svg } = await m.render(id, mermaidCode)
+      // v9 (mermaid-legacy): callback-based render(id, code, cb)
+      // v10+: Promise-based render(id, code) → { svg }
+      const svg = mermaidIsLegacy
+        ? await new Promise<string>((resolve, reject) => {
+            try {
+              m.render(id, mermaidCode, resolve)
+            } catch (e) {
+              reject(e)
+            }
+          })
+        : (await m.render(id, mermaidCode)).svg
       if (gen !== renderGeneration) return
       container.innerHTML = svg
       applyFlowchartDisplayStyle(container)