MDExMermaid

MDEx plugin for Mermaid.

Usage

Mix.install([
  {:mdex_mermaid, "~> 0.1"}
])

markdown = """
# Flowchart

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
```
"""

mdex = MDEx.new(markdown: markdown) |> MDExMermaid.attach()

MDEx.to_html!(mdex) |> IO.puts()
#=>
# <script type="module">
#   import mermaid from &#39;https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs&#39;;
#   const theme = window.matchMedia && window.matchMedia(&#39;(prefers-color-scheme: dark)&#39;).matches ? &#39;dark&#39; : &#39;default&#39;;
#   mermaid.initialize({securityLevel: &#39;loose&#39;, theme: theme});
# </script>
# <h1>Flowchart</h1>
# <pre id="mermaid-1" class="mermaid" phx-update="ignore">graph TD;
#     A-->B;
#     A-->C;
#     B-->D;
#     C-->D;
# </pre>

See attach/2 for more info.