Skip to content

feat: enable mermaid diagram export as SVG/PNG/MMD - #595

Open
xmengnet wants to merge 1 commit into
DEEIX-AI:devfrom
xmengnet:feat/mermaid-export
Open

feat: enable mermaid diagram export as SVG/PNG/MMD#595
xmengnet wants to merge 1 commit into
DEEIX-AI:devfrom
xmengnet:feat/mermaid-export

Conversation

@xmengnet

@xmengnet xmengnet commented Aug 10, 2026

Copy link
Copy Markdown

Summary

Enable exporting mermaid diagrams from chat messages as SVG / PNG / MMD.

streamdown already ships a built-in download dropdown for diagram blocks
(gated by controls.mermaid.download); this change turns it on, overrides
its labels through the translations prop using the app's own i18n
(chat.markdown.diagram, en-US + zh-CN), and scopes the mermaid action-bar
CSS to direct child buttons so the dropdown items keep a visible hover
state.

Change type

  • Feature

Affected areas

  • Frontend / UI

Verification

  • pnpm typecheck
  • pnpm lint
  • pnpm build
  • Manual browser check: download menu shows on mermaid blocks; SVG, PNG
    and MMD downloads produce valid files (SVG text-editable, PNG 5x
    rasterized, MMD source intact); streaming disabled state, fullscreen
    and screenshot filtering unaffected.

Screenshots, API examples, or logs

Mermaid block action bar now shows a download button with SVG / PNG / MMD
options (labels localized: 下载图表 / 导出为 SVG / 导出为 PNG / 导出为 MMD).

Configuration, migration, and compatibility notes

No config, env, schema, API contract, or deployment changes. Download
filenames are fixed by the upstream library (diagram.svg / diagram.png /
diagram.mmd).

Documentation

  • Documentation is not needed for this change.

Security and privacy

  • No secrets, tokens, credentials, local config, or personal data are included.
  • User data access remains scoped by authenticated user context unless an admin-only path explicitly requires broader access.
  • Security-sensitive behavior was reviewed, including authentication, authorization, provider routing, file processing, billing, and admin APIs where relevant.

Checklist

  • I searched existing issues and pull requests.
  • Changes are focused and do not include unrelated refactors.
  • Tests or static verification were run where practical.
  • User-facing behavior, deployment steps, API contracts, or configuration changes are documented.
  • Generated artifacts are included only when this project explicitly requires them.
  • Caches, build output, .pyc files, .env files, and local storage data are not committed.

Enable streamdown's built-in download menu for mermaid blocks via controls.mermaid.download, override its labels through the translations prop (chat.markdown.diagram) in both en-US and zh-CN, and scope the mermaid action bar CSS to direct child buttons so the dropdown items keep a visible hover state.
@xmengnet
xmengnet force-pushed the feat/mermaid-export branch from 55bb5a3 to 1e674e4 Compare August 10, 2026 09:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant