Summary

Generated Mermaid diagrams can render with overlapping boxes and labels, making the diagram difficult to read.

Problem

When viewing a generated Mermaid diagram in Warp, parts of the graph layout can collide. In the attached screenshot, a smaller node labeled around “GetTask” overlaps other node text in the same namespace, while the larger “Worker websocket task_completed/failed” node and nearby edges crowd into the same area.

Expected behavior

Mermaid diagrams should render with enough spacing that node boxes, labels, namespace boundaries, and edges remain legible and do not overlap.

Actual behavior

The rendered Mermaid output overlaps multiple node labels and boxes. The central text is stacked/colliding, and the affected portion of the diagram is hard to interpret.

Reproduction steps or desired workflow

1. Generate or view a Mermaid diagram in Warp that includes a namespace/subgraph with multiple connected nodes.
2. Render the diagram in Warp.
3. Observe that some node boxes and labels overlap instead of being laid out with readable spacing.

Exact Mermaid source is unknown from the report; the attached screenshot shows the failing rendered state.

Artifacts

Screenshot 1: Mermaid diagram rendering with overlapping node labels and boxes inside a namespace, including “GetTask” and “Worker websocket task_completed/failed” nodes.

Warp version

v0.2026.05.05.08.56.dev_00

Operating system

macOS 26.4 (25E246)

Possible source references

• crates/editor/src/render/element/mermaid.rs: Mermaid rendering surface for editor-rendered diagrams.
• crates/editor/src/content/mermaid_diagram.rs: Mermaid diagram content handling likely involved in parsing or representing rendered Mermaid blocks.