dsh-visualize

简体中文 | English

Let DSH do more than reply with plain text. After the model calls visualize, the Web UI renders an interactive card directly in the conversation — useful for simulators, charts, comparison panels, or UI mockups.

Installation

The recommended approach is to install directly from GitHub into DSH's web profile:

dsh plugin --profile web add github:Nagi-ovo/dsh-visualize
# 如果 dsh web 正在运行，重启后刷新页面

You can run dsh --profile web --dump-config to confirm the plugin has made it into the final configuration. To modify the source, clone the repository and run dsh plugin --profile web add . from the repo directory; build artifacts are already committed, so no extra build step is needed. Users who rely on the community plugin-registry can also install it from "Settings → Plugins".

How to use

Just tell the model what you want to see, for example "make a sorting-algorithm visualization with adjustable parameters". The model writes an HTML fragment and then calls visualize(path, title?, mode?) to drop it into the conversation. For content that's best compared side by side, use mode: "wide".

Cards follow DSH's light/dark theme and whale-blue palette. On session replay, pages are restored from persisted tool results and do not require the original fragment files to still exist.

Security

Cards run inside sandboxed iframes with an opaque origin and cannot reach the host page. CSP blocks network requests, nested pages, and form submissions, while allowing static assets only from pinned CDNs. A single fragment is capped at 1000000 bytes by default; you can change this with maxFragmentBytes.

Limitations

Currently, interactive cards render only in the Web UI; TUI and headless clients display plain tool results. Buttons inside a card cannot yet send follow-up messages to the main conversation.

Inspired by Codex's desktop /visualize; the layered skill references and Chart.js-first approach are borrowed from himself65/finance-skills.