Skip to content

Merge back 11.13.0 to develop#7467

Closed
ashishjain0512 wants to merge 26 commits intodevelopfrom
master
Closed

Merge back 11.13.0 to develop#7467
ashishjain0512 wants to merge 26 commits intodevelopfrom
master

Conversation

@ashishjain0512
Copy link
Collaborator

📑 Summary

This pull request includes several minor features and numerous bug fixes across different diagram types and rendering behaviors in the mermaid package. The most notable updates are the addition of new diagram support and exportable types, improvements to SVG rendering and label handling, and fixes for diagram parsing and rendering issues.

New features and exports:

  • Added support for the venn-beta diagram, expanding the types of diagrams users can create.
  • Exported AsyncIconLoader, SyncIconLoader, and IconLoader types for external usage.
  • Added half-arrowheads (solid & stick) and central connection support for diagrams.
  • Added alias support for the new participant syntax in sequence diagrams.

SVG and label rendering improvements:

  • Corrected viewBox casing and made SVGs responsive for better rendering across devices.
  • Improved support for the htmlLabels Mermaid config value and prevented HTML tag escaping in sandbox label rendering. [1] [2]
  • Fixed issues with auto-wrapping in flowchart markdown labels when markdownAutoWrap: false and htmlLabels are enabled.

Diagram parsing and rendering fixes:

  • Resolved parsing errors for direction TD in subgraphs and improved participant parsing to prevent recursive loops on invalid syntax. [1] [2]
  • Allowed colons in stateDiagram-v2 transition and state description text.
  • Corrected block positioning for nested blocks spanning multiple columns.
  • Fixed arc sweep flags for BT orientation in gitGraph arrows, ensuring curves bend correctly.

Other diagram-specific fixes:

  • Fixed treemap classDef style application for proper user-defined style rendering.
  • Ensured architecture diagram lines have correct length.
  • Prevented browser hang with multiline accDescr in XY charts.
  • Derived task text color from done-task background color in Gantt charts for better readability in dark theme.
  • Restored original hexagon and roundedRect implementations.
  • Recognized '1' cardinality alias before relationship operators in ER diagrams.

Resolves #

📏 Design Decisions

Describe the way your implementation works or what design decisions you made if applicable.

📋 Tasks

Make sure you

  • 📖 have read the contribution guidelines
  • 💻 have added necessary unit/e2e tests.
  • 📓 have added documentation. Make sure MERMAID_RELEASE_VERSION is used for all new features.
  • 🦋 If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running pnpm changeset and following the prompts. Changesets that add features should be minor and those that fix bugs should be patch. Please prefix changeset messages with feat:, fix:, or chore:.

knsv and others added 26 commits February 13, 2026 16:46
chore: upgrade to Langium v4 and TypeScript v5.8

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>
* master:
  Version Packages
  Fixed issue with hero text
chore: Update banner with coupon
Reverts the global flowchart curve default from 'rounded' back to 'basis'
and instead sets edge.curve = 'rounded' on each ELK edge right before
insertEdge. This ensures ELK's orthogonal routes render with right-angle
segments and rounded corners, without changing the default for non-ELK
layouts.

Fixes #7213

Co-authored-by: knsv-bot <knsv-bot@macos.shared>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
…#7456)

* fix(gantt): restore readable outside-text color for done tasks in dark mode

When a Gantt done-task label is too wide to fit inside the bar, the renderer
places the text outside (next to the bar) with class `taskTextOutsideLeft` or
`taskTextOutsideRight` plus `doneText{N}`. The `.doneText{N}` rule uses
`taskTextDarkColor !important`, which PR #7432 changed to a dark color
(inverted from lightgrey) for contrast inside the bar. That `!important` also
overrides the lighter `taskTextOutsideColor` that `.taskTextOutside{N}` sets,
making outside-label text black/dark on the dark diagram background.

Fix: add combined-class selectors (`.doneText{N}.taskTextOutsideLeft/Right`)
after the `.doneText{N}` block, using `taskTextOutsideColor !important`. The
combined selectors have higher specificity and appear later in the cascade, so
they win over the single-class rule. Same fix applied to `.doneCritText{N}`.

Fixes regression from PR #7432 (fix for #5979).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* test(gantt): add e2e snapshot for done-task outside-text in dark mode

Covers the regression from #7433 where done-task labels displayed outside
the bar (text too wide for the bar width) rendered in unreadable dark color
in dark theme.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* test(gantt): add separate inside/outside e2e snapshots for dark mode done tasks

Split the dark mode done-task coverage into two explicit tests:
- inside-text: label fits within the bar (long bar, short label)
- outside-text: label overflows the bar (short bar, long label) — regression case for #7433

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

---------

Co-authored-by: knsv-bot <knsv-bot@macos.shared>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
* 'master' of https://github.com/mermaid-js/mermaid:
  fix(gantt): restore readable outside-text for done tasks in dark mode (#7456)
  fix(elk): scope rounded edge curve to ELK layout only (#7454)
* fix: ER diagram edge label position when htmlLabels is false

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* chore: add changeset
on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* fix: adjust edge label positioning for improved alignment
on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* fix: add  unit tests for centering logic
on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* fix: add a flag to createTspan function to center edgeLabels when htmlLabels is false

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* fix: add e2e test , modify unit test

Some optional description over here if you need to add more info

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>

* fix: update edges in dagre-wrapper,  add tests

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>
@changeset-bot
Copy link

changeset-bot bot commented Mar 9, 2026

⚠️ No Changeset found

Latest commit: b1a5e9b

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@netlify
Copy link

netlify bot commented Mar 9, 2026

Deploy Preview for mermaid-js ready!

Name Link
🔨 Latest commit b1a5e9b
🔍 Latest deploy log https://app.netlify.com/projects/mermaid-js/deploys/69aeba8c5976db000823415f
😎 Deploy Preview https://deploy-preview-7467--mermaid-js.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

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.

6 participants