@tifan/pi-mermaid-open

Find skipped Mermaid diagrams and show them in a terminal image viewer.

Packages

Package details

extension

Install @tifan/pi-mermaid-open from npm and Pi will load the resources declared by the package manifest.

$ pi install npm:@tifan/pi-mermaid-open
Package
@tifan/pi-mermaid-open
Version
0.2.1
Published
Sep 14, 2026
Downloads
394/mo · 91/wk
Author
tifan
License
MIT
Types
extension
Size
26.6 KB
Dependencies
1 dependency · 1 peer
Pi manifest JSON
{
  "extensions": [
    "./src/index.ts"
  ],
  "video": "https://raw.githubusercontent.com/tifandotme/pi-extensions/refs/heads/master/packages/pi-mermaid-open/assets/demo.mp4"
}

Security note

Pi packages can execute code and influence agent behavior. Review the source before installing third-party packages.

README

@tifan/pi-mermaid-open

Find Mermaid diagrams that Pi left unrendered and show one in a terminal image viewer.

https://github.com/user-attachments/assets/8be5b7cf-fc21-4979-a245-4ba0984360de

How it works

  • Scans assistant messages in the current branch for ```mermaid and ```mmd fences.
  • Hides diagrams that Pi already rendered and labels skipped diagrams by reason.
  • Renders diagrams as 4x PNGs with @mermaid-js/mermaid-cli.
  • Uses a non-blocking Herdr overlay with Kitty graphics when available.
  • Uses Pi's image viewer in other TUI sessions.
  • Saves PNGs under <agent-dir>/artifacts/mermaid/ outside TUI mode.
  • In Herdr, use +/= and - to zoom, h/j/k/l or the arrow keys to pan, 0 to reset, and Enter or Escape to close.

Install

pi install npm:@tifan/pi-mermaid-open

Requirements

  • Bun is optional. The extension uses bunx -y @mermaid-js/mermaid-cli when Bun is available and falls back to npx -y @mermaid-js/mermaid-cli.
  • Herdr with Kitty graphics support is optional. In a compatible Herdr TUI session, /mermaid-open automatically links the bundled Herdr plugin, so you do not need to install it separately. Other TUI sessions use Pi's image viewer.
  • Network access on first use unless Mermaid CLI is already cached.
  • A Chromium browser available to Puppeteer. The extension skips Puppeteer's automatic browser download, so Puppeteer must find an existing cache or configured browser executable.

Commands

  • /mermaid-open: Pick a Mermaid diagram from recent assistant messages, render it, and open the PNG.

Release notes

See CHANGELOG.md

License

MIT