Enables zooming of mermaid diagrams by supporting horizontal scroll
---
Release Notes:
- improved: Mermaid diagrams can now be zoomed and horizontally
scrolled, in both the markdown preview and the agent panel
Mermaid diagrams with long node labels rendered as an unreadable jumble:
each label was painted as one long line over a box sized for wrapped
text, overflowing into neighboring nodes. With this change, labels wrap
to the box width the layout computed.
**Root cause:** mermaid's default `htmlLabels: true` makes merman emit
labels as HTML inside `<foreignObject>`, which resvg cannot rasterize.
merman's resvg-safe pipeline replaces each one with a single-line
`<text>` fallback that only honors explicit `<br>` breaks, so
soft-wrapped labels collapse onto one long line — while the node boxes
were laid out for the wrapped text.
**Fix:** disable HTML labels in the site config (both the top-level key,
which merman reads for node labels, and `flowchart.htmlLabels`, which it
reads for edge labels). merman then emits native SVG `<text>`/`<tspan>`
labels wrapped to the same measured width the layout used, and the
foreignObject fallback never runs for these diagrams.
One behavior preserved deliberately: a literal `\n` in label text used
to become a line break as a side effect of the foreignObject fallback
(`fallback.rs` converts `\n` when flattening HTML labels).
`render_mermaid` now normalizes `\n` to `<br/>` before rendering so the
native path keeps that behavior; the existing
`backslash_n_converted_to_line_break` test covers it.
Side effect: class diagram member text also switches from the lossy
fallback to native SVG text; the accent-class test was updated
accordingly (accent classes now land directly on `text`/`tspan`
elements).
Verified with `cargo nextest run -p mermaid_render`, `-p markdown`,
`script/clippy -p mermaid_render`, and `cargo fmt --check`.
Release Notes:
- Fixed mermaid diagram labels overflowing and overlapping nodes when
long labels wrap
---------
Co-authored-by: cameron <cameron.studdstreet@gmail.com>
I was a silly goose didn't notice my `git push` failed, so merged #57967
without a critical commit, and some follow-ups.
This PR just cherry-picks those commits.
Release Notes:
- N/A or Added/Fixed/Improved ...
Following up on #57644 by @cameron1024, this PR updates `merman` to
v0.6.
With merman 0.6's new raster-safe SVG pipeline, Zed can move generic
`usvg`/`resvg` cleanup passes out of this crate and rely on merman for
them instead.
**What's moved to merman:**
- `foreignObject` fallback text generation
- Unsupported CSS cleanup
- Invalid SVG attribute cleanup
**What's kept in Zed:**
- Theme CSS injection and accent color assignment
- Zed-specific fallback overlay handling
**Integration note:**
In merman v0.6, fallback overlay groups are marked with
`data-merman-foreignobject="fallback"` and preserve source classes like
`node` or `section-*`, so host CSS can still style fallback text. This
PR updates Zed's accent tracker to check for this marker, ensuring
fallback overlays are not treated as real layout nodes.
I also added a render-stage test for the new contract: the SVG output
from `render_mermaid` is already raster-safe before Zed-specific
post-processing runs.
---
### Self-Review Checklist:
- [x] I've reviewed my own diff for quality, security, and reliability
- [x] Unsafe blocks (if any) have justifying comments
- [x] The content is consistent with the [UI/UX
checklist](https://github.com/zed-industries/zed/blob/main/CONTRIBUTING.md#uiux-checklist)
- [x] Tests cover the new/changed behavior
- [x] Performance impact has been considered and is acceptable
### Release Notes:
- Improved rendering of Mermaid diagrams in Markdown previews.
### Tests:
- `cargo +1.95 fmt --check -p mermaid_render`
- `cargo +1.95 test -p mermaid_render`
- `cargo +1.95 clippy -p mermaid_render --all-targets -- -D warnings`
- `git diff --check HEAD~1..HEAD`
---------
Co-authored-by: cameron <cameron.studdstreet@gmail.com>
This debug assert was actually invalid, and panicked in debug builds on
valid diagrams. We start building a node only when we find a
`translate()` that we need to fix up, but unconditionally call
`finish_node`. But since `finish_node` does `if let Some(...) =
self.building.take()`, it's a no-op if there is no node being built, so
it's safe to call.
Renamed to `maybe_finish_node` to communicate this fact
Release Notes:
- N/A or Added/Fixed/Improved ...
Closes FR-49
This PR fixes stack overflow in flowcharts with deeply nested subgraphs.
Rewrote recursive call to iterate with an explicit stack on heap. Added
test which reproduces the overflow.
We use our fork now, with patch on existing v0.4.0:
1c765dcca2
Release Notes:
- Fixed a crash in when rendering Mermaid diagram flowcharts with deeply
nested subgraphs.
