Upgrade to Mermaid 10.6.1

Bump the version of Mermaid up to 10.6.1. Per the release notes at
https://github.com/mermaid-js/mermaid/blob/develop/CHANGELOG.md the
render function is async now, so update to the new async render
function.

There's also apparently a change to use ESM, but I didn't seem to have
any trouble with just bumping the version and updating it to use async.
It looks like it's working without any change to how we load it, but I'm
not much of a frontend developer so I could be missing something.

material/templates/base.html

@@ -249,7 +249,7 @@
       </script>
     {% endblock %}
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/bundle.81fa17fe.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.9dafaff0.min.js' | url }}"></script>
       {% for script in config.extra_javascript %}
         {{ script | script_tag }}
       {% endfor %}

src/templates/assets/javascripts/components/content/mermaid/index.ts

@@ -69,7 +69,7 @@ let sequence = 0
  */
 function fetchScripts(): Observable<void> {
   return typeof mermaid === "undefined" || mermaid instanceof Element
-    ? watchScript("https://unpkg.com/mermaid@9.4.3/dist/mermaid.min.js")
+    ? watchScript("https://unpkg.com/mermaid@10.6.1/dist/mermaid.min.js")
     : of(undefined)
 }
 
@@ -104,7 +104,7 @@ export function mountMermaid(
     )
 
   /* Render diagram */
-  mermaid$.subscribe(() => {
+  mermaid$.subscribe(async () => {
     el.classList.add("mermaid") // Hack: mitigate https://bit.ly/3CiN6Du
     const id = `__mermaid_${sequence++}`
 
@@ -113,16 +113,15 @@ export function mountMermaid(
     const text = el.textContent
 
     /* Render and inject diagram */
-    mermaid.mermaidAPI.render(id, text, (svg: string, fn: Function) => {
+    const { svg, fn } = await mermaid.render(id, text);
 
-      /* Create a shadow root and inject diagram */
+    /* Create a shadow root and inject diagram */
-      const shadow = host.attachShadow({ mode: "closed" })
+    const shadow = host.attachShadow({ mode: "closed" })
-      shadow.innerHTML = svg
+    shadow.innerHTML = svg
 
-      /* Replace code block with diagram and bind functions */
+    /* Replace code block with diagram and bind functions */
-      el.replaceWith(host)
+    el.replaceWith(host)
-      fn?.(shadow)
+    fn?.(shadow)
-    })
   })
 
   /* Create and return component */