Fix mermaid after ex_doc upgrade and bumb its version

Author: garazdawi

make/ex_doc.exs

@@ -197,28 +197,34 @@ config = [
   before_closing_body_tag: fn
     :html ->
       """
-      <script>
-        function mermaidLoaded() {
-          mermaid.initialize({
-            startOnLoad: false,
-            theme: document.body.className.includes("dark") ? "dark" : "default"
-          });
-          let id = 0;
-          for (const codeEl of document.querySelectorAll("pre code.mermaid")) {
+        <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js"></script>
+        <script>
+        let initialized = false;
+
+        window.addEventListener("exdoc:loaded", () => {
+            if (!initialized) {
+            mermaid.initialize({
+                startOnLoad: false,
+                theme: document.body.className.includes("dark") ? "dark" : "default"
+            });
+            initialized = true;
+            }
+
+            let id = 0;
+            for (const codeEl of document.querySelectorAll("pre code.mermaid")) {
             const preEl = codeEl.parentElement;
             const graphDefinition = codeEl.textContent;
             const graphEl = document.createElement("div");
             const graphId = "mermaid-graph-" + id++;
             mermaid.render(graphId, graphDefinition).then(({svg, bindFunctions}) => {
-              graphEl.innerHTML = svg;
-              bindFunctions?.(graphEl);
-              preEl.insertAdjacentElement("afterend", graphEl);
-              preEl.remove();
+                graphEl.innerHTML = svg;
+                bindFunctions?.(graphEl);
+                preEl.insertAdjacentElement("afterend", graphEl);
+                preEl.remove();
             });
-          }
-        }
-      </script>
-      <script async src="https://cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js" onload="mermaidLoaded();"></script>
+            }
+        });
+        </script>
       """
 
     _ ->