Skip to content

Mermaid diagram support #8

Description

@engineervix

Summary

Support Mermaid diagrams as a fenced code block extension (```mermaid), alongside the existing D2 support. Mermaid has broader recognition and a large existing user base.

Proposed behaviour

```mermaid
graph LR
  A[Browser] --> B[Server] --> C[(Database)]
```

Implementation notes

  • Two rendering approaches to evaluate:
    1. Server-side (preferred): use a Go Mermaid renderer or call the Mermaid CLI via exec.Command at build time — produces static SVG with no client-side JS
    2. Client-side fallback: inject the Mermaid JS bundle and render in the browser — simpler but adds JS weight and breaks the "no runtime JS for content" principle
  • Prefer option 1 to stay consistent with D2's build-time SVG approach
  • Check: github.com/thinking-and-coding/mermaid-go or similar; evaluate maturity before committing to a dependency
  • Light/dark theme variants should be handled the same way as D2 (two SVGs, CSS-toggled)

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    contentContent authoring featuresenhancementNew feature or request

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions