dsh-mermaid-preview-plugin

A DeepSeek Harness Plugin for Previewing Mermaid Diagrams

Renders mermaid diagrams directly under the assistant message when the message content contains mermaid syntax (a ```mermaid or ```mmd fenced code block).

How it works

• Mount point: conversation.chat.turnTail (chain slot, additive - never shadows shipped UI)
• Thumbnail display: the diagram renders as a thumbnail (max height configurable, default 204px); click to enlarge in place, click again to shrink back (same element toggles, no popup)
• Rendering: the browser builds a URL-safe base64 from the diagram source (UTF-8 safe via native btoa + TextEncoder) and loads /svg/[?theme=dark] directly; light/dark themes follow the UI

This plugin uses Mermaid.ink to generate the diagram images directly: the browser builds a URL-safe base64 of the mermaid source and requests /svg/[?theme=dark], which returns an SVG. See for the service details.

Installation

Installation from github

### latest version
$ npx @deepseek-ai/dsh plugin --profile web add github:baconbao/dsh-mermaid-preview-plugin#latest

### specific version
$ npx @deepseek-ai/dsh plugin --profile web add github:baconbao/dsh-mermaid-preview-plugin#

### dev version
$ npx @deepseek-ai/dsh plugin --profile web add github:baconbao/dsh-mermaid-preview-plugin#main

Installation form source

$ git clone https://github.com/baconbao/dsh-mermaid-preview-plugin
$ cd dsh-mermaid-preview-plugin
$ pnpm install
$ cd ..
$ dsh plugin --profile web add dsh-mermaid-preview-plugin

Configuration

Configurate the mermaid.ink render server and thumbnail size

To use your own mermaid-compatible render server or adjust the thumbnail height, edit the profile's cordis.patch.yml (e.g. ~/.dsh/profiles/web/cordis.patch.yml):

- id: ui-dsh-mermaid-preview-plugin
  config:
    mermaidInkUrl: https://your-own-mermaid-ink-server.example.com
    thumbMaxHeight: 204

• mermaidInkUrl: your local mermaid-ink server.
• thumbMaxHeight: positive integer, max thumbnail height in px.
• When unset, mermaidInkUrl: https://mermaid.ink / are used (defaults)