Portable diagram automation

Mermaid to assets.Source code to maps.MCP for agents.

A standalone toolkit for teams that need reproducible Mermaid assets, source-code diagrams, and agent-friendly diagram workflows without carrying Vault-specific content.

Install npm 0.1.3 MCP Registry active Quay.io image Smithery View on GitHub

npm 0.1.3 MCP Registry active Quay.io v0.1.0 Node ≥20.11 Outputs SVG + JPEG MCP 3 explicit tools License MIT

terminal

npm install -D vaults-diagram-tools

npx vaults-mermaid-render diagram.mmd --output-dir out
npx vaults-source-diagrams --source-dir src --output-dir diagrams
npx vaults-diagram-mcp

Quick start

From Mermaid source to durable assets.

Use the public CLIs directly from a checkout, npm install, one-shot npx command, GHCR image, or Quay.io Podman image.

Render one diagram

npx --yes --package vaults-diagram-tools \
  vaults-mermaid-render diagram.mmd --output-dir out \
  --manifest out/manifest.json

Generate diagrams from code

npx --yes --package vaults-diagram-tools \
  vaults-source-diagrams --source-dir src --output-dir diagrams

3 CLIs

Renderer, source-diagram generator, and MCP server share the same portable package and release lifecycle.

Keep Mermaid source as .mmd or .mermaid.
Render .svg and .jpg in the same cycle.
Use manifests when delivery needs traceability.

Core tools

One package. Three operational surfaces.

Designed for documentation pipelines, agent workflows, and repositories that need diagram outputs without app-specific assumptions.

`vaults-mermaid-render`

Renders Mermaid sources to SVG/JPEG, writes manifests, supports themes, and can emit optional PNG or text sidecars.

`vaults-source-diagrams`

Builds Mermaid diagrams from source-code structure and can focus selections while preserving traceability metadata.

`vaults-diagram-mcp`

Exposes only render_mermaid_text, render_mermaid_file, and generate_source_diagrams over MCP stdio.

Workflows

Built for reproducible diagram delivery.

Each workflow keeps source, rendered assets, and validation surfaces close together.

Markdown docs

Link the Mermaid source, SVG, and JPEG from Markdown; show source inline with a fenced mermaid block.

Source graph reviews

Generate dependency diagrams from real code paths, then inspect manifest selection data for requested files and omitted connectors.

Agent automation

Attach the MCP server to clients that need controlled diagram rendering without granting generic filesystem tools.

Examples

Dracula-themed assets generated by this repo.

Existing examples reuse the package renderer and keep source plus rendered artifacts available for inspection.

Distribution

Install where the workflow runs.

Use npm 0.1.3 for projects, npx for one-shot automation, MCP Registry or Smithery for discovery, GHCR/release assets for offline handoff, and Quay.io for Podman pulls.

npm and one-shot npx

Current npm latest is vaults-diagram-tools@0.1.3.

npm install -D vaults-diagram-tools
npx --yes --package vaults-diagram-tools vaults-mermaid-render diagram.mmd --output-dir out

Container image

Use GHCR for the GitHub release image or Quay.io for the published Podman image.

docker run --rm \
  ghcr.io/malnati/vaults-diagram-tools:v0.1.1 \
  --help

podman run --rm \
  quay.io/ricardomalnati/vaults-diagram-tools:v0.1.0 \
  --help

GitHub release

Release v0.1.1 remains the latest GitHub release and GHCR artifact line; Quay.io carries the Podman image at v0.1.0; npm and MCP Registry metadata are at 0.1.3.

MCP Registry

io.github.Malnati/vaults-diagram-tools is active at version 0.1.3; PR #17 aligned the publisher name.

Smithery

ricardomalnati/vaults-diagram-tools is already published for Smithery discovery.

CDN facade

Browser-safe helper exports are available through npm CDNs; rendering stays in Node, container, or MCP runtime.

Compliance

Portable tooling, clear boundaries.

Project code is MIT licensed and distribution artifacts preserve license, notices, third-party notices, and bundled upstream license files.

Markdown policy: keep Mermaid source linked as .mmd, render .svg and .jpg, and show inline source with mermaid fences.
Credits: Dracula palette through beautiful-mermaid; Iconify JSON packages for Font Awesome 4, SVG Logos, and Lucide Icons.
Validation: npm test includes license notice checks plus renderer, source-diagram, and MCP tests.
Distribution: npm 0.1.3, MCP Registry active at 0.1.3, Smithery published, GitHub Release/GHCR v0.1.1, Quay.io Podman image v0.1.0.