built-in support for rendering d2 diagrams

[micmejia]

Aside from mermaid diagrams, can we add support to automatically render d2 diagrams?

d2 has greater features and produces prettier diagrams (IMO).

[Josh-Cena]

We support Mermaid because GitHub supports Mermaid.

Any Markdown feature not supported by GitHub will not be under our consideration; you can build a solution in userland using swizzling and Remark plugins.

[slorber]

We probably won't officially support d2 diagrams ourselves, but we'd be happy to help the community to provide support through a plugin.

The good news is that D2 docs is based on Docusaurus: https://github.com/terrastruct/d2-docs

Unfortunately the integration demonstrated here doesn't look ideal, relying to pre-generating svgs before building the Docusaurus site.

# Title

<div
className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/hello-world.svg2')}}></div>

@alixander let me know if you need a bit of support to implement a better integration and create a docusaurus plugin.

If you can run D2 from Node.js we can probably create a Remark plugin that outputs both a code block and a diagram when you use:

```d2 diagram
x -> y: hello world
```

[alixander]

If you can run D2 from Node.js

That's the first domino! GitHub also client-side renders, so we won't be supported by GitHub until our WASM package is out. And we want to wait til 1.0 before then.

Appreciate it @slorber , hope we can revisit before long

[Airkro]

Remark plugins can almost do anything for markdown, and Kroki.io as an open-source online service, supports many useful diagrams, including d2 / plantuml.

So I created remark-kroki a few years ago to render many diagrams in Docusaurus. It may solve your problem.

A real-world example: