fix: Mermaid diagrams flash when editing and multiple in document

shared/editor/plugins/Mermaid.ts

@@ -49,12 +49,17 @@ function getNewState({
     const diagramDecoration = Decoration.widget(
       block.pos + block.node.nodeSize,
       () => {
-        const diagramWrapper = document.createElement("div");
-        diagramWrapper.classList.add("mermaid-diagram-wrapper");
+        const elementId = "mermaid-diagram-wrapper-" + diagramId;
+        const element =
+          document.getElementById(elementId) || document.createElement("div");
+        element.id = elementId;
+        element.classList.add("mermaid-diagram-wrapper");
 
         if (pluginState.diagramVisibility[diagramId] === false) {
-          diagramWrapper.classList.add("diagram-hidden");
-          return diagramWrapper;
+          element.classList.add("diagram-hidden");
+          return element;
+        } else {
+          element.classList.remove("diagram-hidden");
         }
 
         import("mermaid").then((module) => {
@@ -76,7 +81,7 @@ function getNewState({
               "mermaid-diagram-" + diagramId,
               block.node.textContent,
               (svgCode) => {
-                diagramWrapper.innerHTML = svgCode;
+                element.innerHTML = svgCode;
               }
             );
           } catch (error) {
@@ -85,12 +90,12 @@ function getNewState({
               "d" + "mermaid-diagram-" + diagramId
             );
             if (errorNode) {
-              diagramWrapper.appendChild(errorNode);
+              element.appendChild(errorNode);
             }
           }
         });
 
-        return diagramWrapper;
+        return element;
       },
       {
         diagramId,