Render mermaid via code blocks, instead of shortcodes (#338)

Author: stefanv

doc/content/features.md

@@ -124,3 +124,25 @@ To use them elsewhere, e.g. in Hugo templates, we provide an `svg-icon` partial.
 ```
 {{ partial "svg-icon" "my-icon" }}
 ```
+
+## Mermaid diagrams
+
+[Mermaid](https://mermaid.js.org/) diagrams are rendered from code blocks:
+
+````md
+```mermaid
+graph LR
+    A[Square Rect] -- Link text --> B((Circle))
+    A --> C(Round Rect)
+    B --> D{Rhombus}
+    C --> D
+```
+````
+
+```mermaid
+graph LR
+    A[Square Rect] -- Link text --> B((Circle))
+    A --> C(Round Rect)
+    B --> D{Rhombus}
+    C --> D
+```

layouts/_default/_markup/render-codeblock-mermaid.html

@@ -0,0 +1,4 @@
+<pre class="mermaid">
+  {{- .Inner | safeHTML }}
+</pre>
+{{ .Page.Store.Set "hasMermaid" true }}

layouts/partials/javascript.html

@@ -36,7 +36,7 @@
 </script>
 {{ end -}}
 
-{{- if .HasShortcode "mermaid" }}
+{{- if .Page.Store.Get "hasMermaid" }}
 <script type="module">
   import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10.4.0/dist/mermaid.esm.min.mjs';