From a50d610e385c149ea4d31d5e734d455bf6bb5cc9 Mon Sep 17 00:00:00 2001
From: highoncomputers <highoncomputers@users.noreply.github.com>
Date: Wed, 1 Jul 2026 03:52:47 +0000
Subject: [PATCH] fix: add missing xmlns:xlink namespace for Mermaid PNG export

Mermaid SVG output sometimes uses xlink:href attributes without
declaring the xmlns:xlink namespace on the root <svg> element. When
converting SVG to PNG via canvas, browsers require valid XML and fail
to load the image, causing the PNG export to silently fail.

Fix by detecting xlink:href usage and injecting the required namespace.

Closes #541
---
 packages/streamdown/lib/mermaid/utils.ts | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/streamdown/lib/mermaid/utils.ts b/packages/streamdown/lib/mermaid/utils.ts
index 0242d786..8a0fe818 100644
--- a/packages/streamdown/lib/mermaid/utils.ts
+++ b/packages/streamdown/lib/mermaid/utils.ts
@@ -1,3 +1,13 @@
+/**
+ * Ensure SVG string has required XML namespaces for canvas rendering
+ */
+function normalizeSvg(svg: string): string {
+  if (svg.includes("xlink:href") && !svg.includes("xmlns:xlink")) {
+    return svg.replace("<svg", '<svg xmlns:xlink="http://www.w3.org/1999/xlink"');
+  }
+  return svg;
+}
+
 /**
  * Convert SVG string to PNG blob for export
  */
@@ -8,9 +18,11 @@ export const svgToPngBlob = (
   const scale = options?.scale ?? 5;
 
   return new Promise((resolve, reject) => {
+    const normalized = normalizeSvg(svgString);
+
     const encoded =
       "data:image/svg+xml;base64," +
-      btoa(unescape(encodeURIComponent(svgString)));
+      btoa(unescape(encodeURIComponent(normalized)));
 
     const img = new Image();
     img.crossOrigin = "anonymous";