fix(wardley): allow hyphens in unquoted component names by tractorjuice · Pull Request #7642 · mermaid-js/mermaid

tractorjuice · 2026-04-21T16:27:57Z

Summary

Widen NAME_WITH_SPACES in wardley.langium so multi-word names containing hyphens — e.g. real-time processing, end-user, on-call engineer — parse without needing quotes. Brings the grammar in line with the OnlineWardleyMaps (OWM) convention.

The change

Single regex edit in packages/parser/src/language/wardley/wardley.langium:

- /(?!title\s|accTitle|accDescr)[A-Za-z][A-Za-z0-9_()&]*(?:[ \t]+[A-Za-z(][A-Za-z0-9_()&]*)*/
+ /(?!title\s|accTitle|accDescr)[A-Za-z](?:[A-Za-z0-9_()&]|-(?!>))*(?:[ \t]+[A-Za-z(](?:[A-Za-z0-9_()&]|-(?!>))*)*/

The key addition is the -(?!>) alternation: a hyphen is accepted inside a name only when not immediately followed by >. This preserves A->B (no-space arrow) tokenisation — the hyphen gets rejected, the name stops at A, and -> tokenises as ARROW.

Test plan

Six new spec cases in wardleyParser.spec.ts — hyphenated component/anchor/pipeline names, hyphenated link endpoints, plus A->B and foo-bar->baz regression guards
Full wardley suite passes (18/18)
Parser regenerates without ambiguity warnings
Manual browser check of the new mermaid-example block in wardley.md

Widens NAME_WITH_SPACES to permit `-` when not followed by `>`, so multi-word names like `real-time processing` and `end-user` parse without quoting while `A->B` still tokenises as an arrow. Brings the parser in line with OnlineWardleyMaps (OWM) convention. - Grammar: add -(?!>) negative lookahead to both char-class groups in NAME_WITH_SPACES - Tests: hyphenated component/anchor/pipeline names, hyphenated link endpoints, plus A->B and foo-bar->baz regression guards (18 total) - Docs: note allowed and example under Components section Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

changeset-bot · 2026-04-21T16:28:03Z

🦋 Changeset detected

Latest commit: 7a8fb85

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@mermaid-js/parser	Patch
mermaid	Patch

Not sure what this means? Click here to learn what changesets are.

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

netlify · 2026-04-21T16:28:06Z

✅ Deploy Preview for mermaid-js ready!

Name	Link
🔨 Latest commit	`7a8fb85`
🔍 Latest deploy log	https://app.netlify.com/projects/mermaid-js/deploys/69e88e591ee823000822c184
😎 Deploy Preview	https://deploy-preview-7642--mermaid-js.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

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

pkg-pr-new · 2026-04-21T16:29:19Z

Open in StackBlitz

@mermaid-js/examples

npm i https://pkg.pr.new/@mermaid-js/examples@7642

mermaid

npm i https://pkg.pr.new/mermaid@7642

@mermaid-js/layout-elk

npm i https://pkg.pr.new/@mermaid-js/layout-elk@7642

@mermaid-js/layout-tidy-tree

npm i https://pkg.pr.new/@mermaid-js/layout-tidy-tree@7642

@mermaid-js/mermaid-zenuml

npm i https://pkg.pr.new/@mermaid-js/mermaid-zenuml@7642

@mermaid-js/parser

npm i https://pkg.pr.new/@mermaid-js/parser@7642

@mermaid-js/tiny

npm i https://pkg.pr.new/@mermaid-js/tiny@7642

commit: 7a8fb85

codecov · 2026-04-21T16:32:10Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 3.31%. Comparing base (2fe6e55) to head (7a8fb85).
⚠️ Report is 36 commits behind head on develop.

Additional details and impacted files

@@           Coverage Diff           @@
##           develop   #7642   +/-   ##
=======================================
  Coverage     3.31%   3.31%           
=======================================
  Files          539     539           
  Lines        56688   56688           
  Branches       824     824           
=======================================
  Hits          1880    1880           
  Misses       54808   54808

Flag	Coverage Δ
unit	`3.31% <ø> (ø)`

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

argos-ci · 2026-04-21T16:37:41Z

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build	Status	Details	Updated (UTC)
default (Inspect)	👍 Changes approved	1 changed	Apr 22, 2026, 9:12 AM

knsv-bot

[sisyphus-bot]

Nice surgical fix, @tractorjuice — this is the kind of focused PR that's a joy to review. One regex edit, tightly scoped, with a proper regression test suite backing it up.

What's working well

🎉 The -(?!>) negative lookahead is exactly right. It was the one thing I was worried about when I saw the PR title — "if you allow hyphens in names, does A->B still tokenise as an arrow?" — and you answered it before I could ask. wardley.langium:139 handles the token boundary cleanly without needing to special-case the arrow elsewhere in the grammar.
🎉 Regression coverage is thorough. The six tests in wardleyParser.spec.ts:227-318 cover each surface area that could have broken: component names, link endpoints, anchors, the A->B no-space regression, foo-bar->baz with hyphens on both sides of the arrow, and hyphens inside pipeline-component names. That last one is the subtle case I'd have missed.
🎉 OWM parity context in the PR body. Calling out that this matches the OnlineWardleyMaps convention makes the intent unambiguous — this isn't a random grammar relaxation, it's deliberate ecosystem alignment.
🎉 Docs updated in both the source and generated tree, with a clear "quote a name only if..." rule for contributors.

Things to consider

🟡 [important] Missing changeset. I don't see a .changeset/*.md file in the PR. The wardley beta isn't on the changeset ignore list (checked .changeset/config.json), and the sibling PR #7641 did add one for its fixes. A patch changeset with a fix: prefix would be consistent — something like "fix(wardley): allow hyphens in unquoted component names" matching the PR title.
🟢 [nit] Edge-case tests you could tuck in if easy:
- A trailing hyphen: does component foo- [0.1, 0.1] parse? (The regex allows it, but a test would lock behaviour in either way.)
- A double hyphen: component foo--bar [0.1, 0.1].
- These aren't blocking — the core surface is well covered — just noticed them while walking the regex.
💡 [suggestion] Grammar comment. wardley.langium:139 could use a short inline note explaining the -(?!>) trick (e.g. "allow - in names but not when followed by > to preserve the arrow token"). Future readers of the grammar will thank you. Entirely optional.

Security

No XSS or injection concerns. The change is purely at the tokeniser level — it widens what strings can match a name token, but names still flow through the same sanitiser path as before. No new sinks, no new unsafe attributes.

Summary

Tally: 🔴 0 · 🟡 1 · 🟢 1 · 💡 1 · 🎉 4

Verdict: COMMENT. The missing changeset is the only thing worth addressing before merge; everything else is optional polish. Let's get this across the line.

- Add changeset for patch bump - Inline comment on NAME_WITH_SPACES explaining the -(?!>) trick - Edge-case tests: trailing hyphen (`foo-`) and double hyphen (`foo--bar`) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

tractorjuice · 2026-04-25T07:11:42Z

Thanks for the review!

Pushed 7a8fb8532 addressing the feedback:

Changeset — added .changeset/fix-wardley-hyphenated-names.md (patch bump for mermaid and @mermaid-js/parser) with a fix: prefix matching the PR title.
Edge-case tests — added two tests covering foo--bar (consecutive hyphens) and foo- (trailing hyphen). Both behave as expected: the regex accepts them, and the tests lock that in.
Grammar comment — inline note above NAME_WITH_SPACES explaining the -(?!>) trick: in A->B the - is followed by >, the lookahead fails, the name stops at A, and -> tokenises as ARROW.

Test count is now 20/20 (was 18). All CI green; argos shows 1 changed snapshot from the new mermaid-example block in wardley.md — needs a maintainer baseline approval.

@M-a-c

* chore:add changeset on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com> * Merge pull request #7501 from mermaid-js/feature/neo-look-base feature: implement neo look and themes for mermaid diagrams * Correct formatting for run * Added new line to �[1mMERMAID LOCAL DOCKER DEVELOPMENT�[0m Welcome! Thank you for joining the development. This is a script for running commands within docker containers at ease. __________________________________________________________________________________________ Development Quick Start Guide: �[1m./run pnpm install�[0m # Install packages �[1m./run dev�[0m # Launch dev server with examples, open http://localhost:9000 �[1m./run docs:dev�[0m # Launch official website, open http://localhost:3333 �[1m./run pnpm vitest�[0m # Run watcher for unit tests �[1m./run cypress�[0m # Run integration tests (after starting dev server) �[1m./run pnpm build�[0m # Prepare it for production __________________________________________________________________________________________ Commands: �[1m./run build�[0m # Build image �[1m./run cypress�[0m # Run integration tests �[1m./run dev�[0m # Run dev server with examples, open http://localhost:9000 �[1m./run docs:dev�[0m # For docs contributions, open http://localhost:3333 �[1m./run help�[0m # Show this help �[1m./run pnpm�[0m # Run any 'pnpm' command �[1m./run sh�[0m # Open 'sh' inside docker container for development __________________________________________________________________________________________ Examples of frequently used commands: �[1m./run pnpm add --filter mermaid�[0m �[4mpackage�[0m Add package to mermaid �[1m./run pnpm -w run lint:fix�[0m Run prettier and ES lint �[1mgit diff --name-only develop | xargs ./run pnpm prettier --write�[0m Prettify everything you added so far �[1m./run cypress open --project .�[0m Open cypress interactive GUI �[1m./run cypress run --spec cypress/integration/rendering/�[0m�[4mtest.spec.ts�[0m Run specific test in cypress �[1mxhost +local:�[0m Allow local connections for x11 server or �[1mMERMAID LOCAL DOCKER DEVELOPMENT�[0m Welcome! Thank you for joining the development. This is a script for running commands within docker containers at ease. __________________________________________________________________________________________ Development Quick Start Guide: �[1m./run pnpm install�[0m # Install packages �[1m./run dev�[0m # Launch dev server with examples, open http://localhost:9000 �[1m./run docs:dev�[0m # Launch official website, open http://localhost:3333 �[1m./run pnpm vitest�[0m # Run watcher for unit tests �[1m./run cypress�[0m # Run integration tests (after starting dev server) �[1m./run pnpm build�[0m # Prepare it for production __________________________________________________________________________________________ Commands: �[1m./run build�[0m # Build image �[1m./run cypress�[0m # Run integration tests �[1m./run dev�[0m # Run dev server with examples, open http://localhost:9000 �[1m./run docs:dev�[0m # For docs contributions, open http://localhost:3333 �[1m./run help�[0m # Show this help �[1m./run pnpm�[0m # Run any 'pnpm' command �[1m./run sh�[0m # Open 'sh' inside docker container for development __________________________________________________________________________________________ Examples of frequently used commands: �[1m./run pnpm add --filter mermaid�[0m �[4mpackage�[0m Add package to mermaid �[1m./run pnpm -w run lint:fix�[0m Run prettier and ES lint �[1mgit diff --name-only develop | xargs ./run pnpm prettier --write�[0m Prettify everything you added so far �[1m./run cypress open --project .�[0m Open cypress interactive GUI �[1m./run cypress run --spec cypress/integration/rendering/�[0m�[4mtest.spec.ts�[0m Run specific test in cypress �[1mxhost +local:�[0m Allow local connections for x11 server output * fix: correct extension marker dimensions for mobile/iOS rendering * test(sankey): add tests for special characters in node names Add explicit test cases for special characters (single quotes, ampersands, forward slashes, and hyphens) in Sankey diagram node names. These tests verify the fix for issue #7528 where special characters in node names like 'Agricultural \'waste\'', 'Lighting & appliances', and 'Over generation / exports' are correctly parsed. The tests confirm that both 'sankey' and 'sankey-beta' syntax properly handle these characters in CSV-style diagram definitions. * feat(sankey): add Apple-style interactive Sankey demo - Implement collapsible nodes with recursive pruning - Auto-zoom layout to fill canvas when nodes are hidden - Strict CSV order sorting for stable node positions - Target-based link coloring with transparency and blend mode - Smart indicator icons (only shown when collapsed) - Smooth fade animations for enter/exit transitions * feat(sankey): add interactive collapse/expand with auto-zoom animation - Add precomputed topology to identify central node (max flow) - Central node (Revenue) can collapse both left and right sides - Other nodes can only collapse their children direction - Auto-zoom: remaining nodes expand to fill canvas after collapse - Collapse animation: nodes shrink towards anchor, expand from anchor - Central node is 1.5x wider for visual emphasis - Indicators show collapse state with directional arrows * feat(sankey): add Apple-style rendering with smart labels and custom node colors - Add smart label positioning based on node layer relative to central node - Add outlined label style (labelStyle: 'outlined') as new default - Add nodeColors config option for custom node color mapping - Add configurable nodeWidth and nodePadding options - Update styles.js with new CSS for outlined labels - Fix YAML frontmatter indentation in demos/sankey.html - Add Cypress tests for new features BREAKING CHANGE: labelStyle now defaults to 'outlined' instead of 'default' * [autofix.ci] apply automated fixes * refactor(sankey): rename labelStyle enum values and remove demo file - Rename labelStyle 'outlined' to 'default' (new default behavior) - Rename labelStyle 'default' to 'legacy' (original behavior) - Remove demo-sankey.html (demonstration file only) - Update tests, demo, and renderer for new naming * fix(sankey): clean up tests and demo - remove unnecessary whitespace changes * fix(sankey): remove curly braces from nodeColors description to fix docs build The curly braces in the YAML description were being parsed as Vue template syntax, causing a 'Duplicate attribute' error during vitepress docs build. * [autofix.ci] apply automated fixes * fix(sankey): address PR review feedback - Restore SankeyLinkColor gradient meta:enum and default that were accidentally deleted - Rename labelStyle 'default' to 'outlined', default to 'legacy' (non-breaking) - Restore original position-based label positioning for legacy mode - Validate nodeColors values as CSS colors in sanitizeDirective - Use theme variables instead of hardcoded colors in styles.js - Add changeset * [autofix.ci] apply automated fixes * fix(sankey): address review nits and add documentation for new config options - Improve type safety: use SankeyNodeWithLayer interface for findCentralNodeLayer - Reduce code duplication: extract appendLabel helper for D3 label chains - Add documentation for labelStyle, nodeWidth, nodePadding, and nodeColors * fix(sankey): handle undefined node.value in findCentralNodeLayer d3SankeyNode.value is number | undefined - add nullish coalescing to fix TS errors. * [autofix.ci] apply automated fixes * [autofix.ci] apply automated fixes (attempt 2/3) * fix(gantt): limit loop if excluding all dates Add an iteration limit to `fixTaskDates` to prevent infinite loops (i.e. when `excludes` is used to exclude every possible date). I've picked 10k days, in case some users are using `dateFormat` and `excludes` to exclude entire years, since 10k days is 27 years, and anything above that starts to have noticable lag. * fix(eventmodeling): address PR retest feedback - themes, wrapLabel, relation stroke - Add EM theme variables to all built-in themes (dark, default, forest, neutral) so dark mode and other themes render with appropriate colors instead of always falling back to light-theme defaults. - Apply wrapLabel() to plain text before HTML assembly to prevent splitting inside HTML tags. Also remove redundant newline replacement in data block path since wrapLabel now handles line breaking on plain text. - Read relation stroke color from themeVariables.emRelationStroke in renderer instead of using hardcoded '#000' from db.ts. - Add emRelationStroke variable to all theme files including theme-base. * chore(deps): update dependency dompurify to v3.3.2 [security] * chore(deps): update autofix-ci/action digest to 7a166d7 * chore(deps): update dependency ajv to v8.18.0 [security] * chore(deps): update peter-evans/create-pull-request digest to 8170bcc * chore(deps): update eslint * fix: type error in toHtml fixed * Fixed typo * [autofix.ci] apply automated fixes * fix(class): Self-referential class multiplicity labels rendered multiple times Fixes #7560 where cardinality labels (e.g. "1", "0..1") were displayed 3x on self-referential class diagram relationships. Root cause: The dagre layout splits self-loops into 3 edges but structuredClone copied cardinality labels to all of them. Now each segment only carries its relevant cardinality label. Also fix DOM hierarchy bug in edge label creation where labels were appended to the wrong parent element. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(class): Keep relationship title on self-referential edges The middle edge segment of a self-loop should preserve its label (e.g. "refers") — only the cardinality labels need to be cleared. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * add link in sidebar to Wardley map * chore(deps): update dependency lodash-es to v4.18.1 [security] * chore(deps): update peter-evans/create-pull-request digest to d32e88d * chore(deps): update dependency eslint-plugin-cypress to ^5.3.0 * fix(class): avoid duplicate labels on self-referential edges Clear label props on split sub-edges to prevent multiplicity labels from rendering 3x after structuredClone during layout. - keep labels only on correct sub-edges - defensively clear all label positions - remove unintended arrow on edge2 - add visual regression test - add changeset * flowchart: add datastore shape * [autofix.ci] apply automated fixes * add docs and changeset * fix handDrawn look * chore: drop lodash-es in favour of es-toolkit * docs auto-gen * add changeset * feat(eventmodeling): enforce Event Modeling connection invariants via Langium validator Signed-off-by: Yordis Prieto <yordis.prieto@gmail.com> * fix(block-beta): normalize width before comparison in getMaxChildSize In `getMaxChildSize`, the comparison `width > maxWidth` used the raw element width, but `maxWidth` stores the normalized per-column width (width / widthInColumns). This caused `maxWidth` to shrink when a multi-column child's raw width exceeded the previous normalized value. Normalize width before the comparison so both sides use the same unit. Fixes #7503 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * chore: add changeset Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * [autofix.ci] apply automated fixes * chore(deps): update dependency vite to v7.3.2 [security] * test: use type-safe `vi.mock(import()` calls Vitest now supports type-safe mocks using `vi.mock(import('module'),` * test: replace unnecessary mocks with spys This isn't strictly unit testing (more like integration testing), but it's more useful to test the entire chain! * fix: prevent unbalanced CSS styles in classDefs Currently, adding a `}` to a classDef can allow modifying the global CSS, which can lead to a DoS or leaking private data. Using the `sanitizeCss` function automatically handles these unbalanced `{}`. For `themeVariables`, we're instead using `val.match(/^[\d"#%(),.;A-Za-z]+$/)` to avoid issues like this, see ec2da8e (Only allowing a subset of characters in themeVariables, 2022-06-21), but I think `sanitizeCss` is less likely to break any existing behaviour. * fix: improve mermaidAPI D3 types Right now, many of the functions within `mermaidAPI` were using a `type D3Element = any` type, which has no type safety. Our existing `D3Selection<T extends SVGElement>` exists and is better, but some of our APIs allow a generic `Element` or `HTMLElement`, so I made a new `D3HtmlSelection<T extends Element>` type for this. Some of the types are a bit contrived unfortunately, since a `D3HtmlSelection<HTMLElement>` is not assignable to a `D3HtmlSelection<Element>`, even if `HTMLElement` is a subclass of `Element`. * refactor: tighten `createUserStyles` param types Change the type of `mermaidAPI.createUserStyles`'s `svgId` from a `string` to a `#${string}` to make it more clear that this shouldn't be an ID, but a CSS selector to an ID. * fix: create CSS styles using the CSSOM Currently, we're creating CSS styles using strings, which isn't ideal, since it can lead to CSS injections other other CSS bugs. However, we can instead use Constructable Stylesheets and the CSSOM to better construct a CSS stylesheet. This new API scrubs invalid syntax from the CSS stylesheet and does some normalization (e.g. removing unnecessary spaces). [1]: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/replaceSync See: https://web.dev/articles/constructable-stylesheets * fix: try using `replaceSync` to parse `themeCSS` Check for the existance of `CSSStyleSheet.replaceSync`, and whether it is a function, to parse `themeCSS` and convert it to a string. We already call `sanitizeCSS` on this option, so it's low risk, but this should make it slightly safer and normalize the CSS slightly. For environments where `CSSStyleSheet.replaceSync` does not yet exist (e.g. jsdom or Safari 16.3 or earlier), we just use the old legacy code. See: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/replaceSync * fix: pin 2 actions to commit SHA, extract 2 expressions to env vars * fix: quote env var references in run blocks Did some research into the CodeQL envvar-injection-critical guidance (https://codeql.github.com/codeql-query-help/actions/actions-envvar-injection-critical/) and wanted to add this additional change to prevent shell injection through attacker-controllable values like ref names and workflow inputs, and to prevent unexpected behavior from special characters in secret values. Before: echo ${REF_NAME} After: echo "${REF_NAME}" * style: add trailing newline to action file This was done by running `npx prettier --write .github/workflows/release-preview-publish.yml`. The autofix CI job doesn't push changes to the `.github` folder to prevent an infinite loop. * ci: remove `GIT_REF: ${{github.ref}}` GitHub already has a built-in environment variable called `GITHUB_REF` for this value. See: https://docs.github.com/en/actions/reference/workflows-and-actions/variables * test: add E2E visual regression test for mixed column spans (#7503) Adds a block-beta test case that mixes :1 and :4 column spans to prevent the width normalization bug from re-regressing. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * [autofix.ci] apply automated fixes * [autofix.ci] apply automated fixes * fix(sequence): add label box background for alt/else section titles Section titles like "else" in alt/else blocks were rendered without a .labelBox background polygon, unlike the main loop label. When custom CSS set .loopText to white, section titles became invisible against the white SVG background. Resolves #7546 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix(sequence): use labelText class for alt/else section titles Section titles like "else" in alt/else blocks used the loopText CSS class, which meant custom themeCSS targeting .loopText (e.g. setting fill to white) would make section titles invisible. Changed to labelText class so section title styling is independent of loopText overrides. Resolves #7546 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix(sequence): add sectionTitle CSS class for alt/else section labels Section titles like "else" used the loopText CSS class, which meant custom themeCSS targeting .loopText or .labelText (e.g. setting fill to white) would make section titles invisible. Introduced a dedicated .sectionTitle class styled with loopTextColor, isolating section title text from unrelated CSS overrides. Resolves #7546 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix(sequence): add font-weight bold to sectionTitle class Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix(sequence): let CSS class control sectionTitle font-weight Clear the inline fontWeight for section titles so the .sectionTitle CSS class rule (font-weight: bold) is not overridden by the inline element.style font-weight. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: prevent CSS namespace escape using `:not(&)` Currently, we're namespacing user's custom CSS to only apply within the `<div id='svgId'>` by doing: ```css #svgId { .myCssClass { /* my rules here */ } } ``` If there's no `&` in the child rule selector, one gets prefixed [automatically][1], which namespaces the rule correctly. ```css #svgId { & .myCssClass { /* my rules here */} } ``` However, if an `&` is present in the child rule selector, there's no automatic prefix of the parent rule selector, which allows user defined CSS to escape the `<div id='svgId'>`, e.g. ```css #svgId { :not(&) { /* my rules here */ } } ``` This commit adds a stylis middleware that automatically prefixes `#svgId` to any rule selector if it's not already there, preventing this bypass. [1]: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/Nesting_selector * fix: disallow some CSS at-rules in custom CSS Disallow some CSS at-rules in custom CSS, e.g. like `@font-face`. There's no way to namespace these so that only apply within the Mermaid SVG. Nested at-rules, e.g. `@supports selector(h2 > p) {h2 > p {/*val*/}}` are still allowed, since stylis will namespace the inner rules automatically. `@keyframes` have been kept, as they are required for animations in mermaid. Co-authored-by: zsxsoft <git@zsxsoft.com> * revert: remove font-weight bold from sectionTitle Argos screenshots confirm section titles should not be bold. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * chore: update E2E timings * First version of scoped e2e tests * fix(stateDiagram): enforce strict comment syntax Addresses feedback from the review: - Comments after blank lines are now recognized; - Adds tests for blank-line and edge-case scenarios; - Adds a brief code comment in the test explaining the expected behavior for inline %%. Fixes #7090 * fix: skip namespacing CSSKeyframeRule This was breaking animations, since we changing ```css @Keyframes hi { from { stroke-dashoffset:1000; } } ``` to ```css @Keyframes hi { /* Not correct */ #svgId from { stroke-dashoffset:1000; } } ``` Fixes: 6476973 * Added info about scoped tests in doc * test(stateDiagram): improve note parsing edge case tests Address review feedback by: -adding assertions for note content, not just state relations; -splitting test cases to separately cover two edge cases: "send note" and "end note" inside note text. Fixes #7089 * feat: add nested namespace support for class diagrams Restore and properly implement nested namespaces, which regressed between 11.3.0 and 11.4.x. Both dot notation (namespace A.B.C) and syntactic nesting (namespace A { namespace B {} }) now create hierarchical namespace clusters in the rendered diagram. Closes #3384, #4618, #5487, #6085 Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * docs: add nested namespace documentation and changeset Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * fix: use short name as label for nested namespaces For syntactic nesting (namespace A { namespace B {} }), the displayed label now shows the short name "B" instead of the qualified "A.B". Each namespace stores a separate label (last segment of the id) for display, while the full dot-separated id is used internally for graph wiring and uniqueness. Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * feat: support custom labels on namespaces Add square bracket label syntax for namespaces, matching the existing class label pattern: namespace Auth["Authentication Service"] { } The label replaces the displayed name while the id is used internally. Closes #6018 Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * test: add Cypress E2E snapshot tests for nested namespaces Add visual regression tests across all four renderers (v2, v3, ELK, handDrawn) covering dot-notation nesting, syntactic nesting, and labeled namespaces. Existing namespace tests will produce updated snapshots due to the new hierarchical cluster rendering. Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * chore: add comment clarifying namespaceStack push ordering Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * address suggestions from comments * refactor(e2e): organise spec files into diagram subfolders Move all diagram-specific Cypress specs from the flat cypress/integration/rendering/ directory into per-diagram subfolders (e.g. cypress/integration/rendering/flowchart/). The detection script now uses filesystem discovery instead of a hardcoded DIAGRAM_SPEC_MAP: it checks whether cypress/integration/rendering/<diagram-name>/ exists and returns a glob pattern (cypress/integration/rendering/<name>/**) as the --spec argument. Adding a new spec to a subfolder requires zero config changes. Cross-cutting specs (theme, conf-and-directives, shapes, etc.) remain at the root of cypress/integration/rendering/ and continue to trigger the full suite. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * refactor(e2e): replace CROSS_CUTTING_SPECS list with positional convention Any spec file at the root of cypress/integration/rendering/ is treated as cross-cutting (full suite). Any spec in a subfolder is scoped to that subfolder. No explicit list to maintain — the directory position is the convention. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * Fix lint errors * Corrected import paths * chore(deps): update dependency dompurify to v3.4.0 [security] * fix(eventmodeling): avoid shipping pre-release screen terminology Signed-off-by: Yordis Prieto <yordis.prieto@gmail.com> * Test feature * Changed to correct branch for test * Corrected error * Lint * New test * feat: add hierarchicalNamespaces config option for compact rendering When set to false, only user-declared namespaces render as flat boxes using their full qualified name; auto-created intermediate ancestors are elided and their children moved to the nearest explicit ancestor. Defaults to true (existing nested behavior). Adds explicit field to NamespaceNode, updates both v2 and v3 renderers, demos, docs, unit tests, and Cypress E2E snapshots. Co-Authored-By: Claude Opus 4.6 (prompted with care by @M-a-c) * fix(block): add edge style functions and properties to block db and types * fix(block): wire edge styles in parser and allow equal sign in node ids * fix(block): render dynamic edge styles instead of hardcoded classes * fix(sequence): handle negative message width on right-to-left arrows when using messageAlign * test(block): add unit and visual tests for arrow types * style(block): format code and fix lint issues * fix lint (unknown word "leftx") and add changeset * fix: resolve sankey syntax error (#7613) * [autofix.ci] apply automated fixes * fix(stateDiagram): allow inline comments and fix single % parsing Addresses feedback from the review: - Updates lexer to allow '%%' comments both at start-of-line and inline; - Treats a single '%' as normal text instead of a comment; - Updates stateDiagram.md documentation to clarify the new comment syntax; - Adds unit tests for inline comments and single '%' scenarios. Fixes #7090 * 7604: Fix for the default config * [autofix.ci] apply automated fixes * fix(tidy-tree): keep mindmap edges connected to a non-circular root The tidy-tree layout's calculateEdgePositions only added intermediate routing points for source/target nodes in the 'left' or 'right' section. For root-sourced edges (section === 'root'), no intermediate point was pushed, so the post-loop intersection recompute used the child's center as the reference and could land the start anchor on the root's top/bottom edge instead of its left/right edge — visually disconnecting the link. The cloud root only appeared correct by coincidence of its rounded shape. Add 'root' branches to both the source and target intermediate-point blocks. The root-side intermediate is placed on the side facing the other node's section. Resolves #7572 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(tidy-tree): type PositionedEdge.points to unblock CI type build Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * Remove comment * Remove hard coding for test no longer in use * Disabled randomized rendering for large diagram to adress flakiness * fix(wardley): allow hyphens in unquoted component names Widens NAME_WITH_SPACES to permit `-` when not followed by `>`, so multi-word names like `real-time processing` and `end-user` parse without quoting while `A->B` still tokenises as an arrow. Brings the parser in line with OnlineWardleyMaps (OWM) convention. - Grammar: add -(?!>) negative lookahead to both char-class groups in NAME_WITH_SPACES - Tests: hyphenated component/anchor/pipeline names, hyphenated link endpoints, plus A->B and foo-bar->baz regression guards (18 total) - Docs: note allowed and example under Components section Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(wardley): address non-blocking review feedback from knsv - Sanitize link labels through textSanitizer() for defense-in-depth - Add feat: prefix to changeset description - Remove auto-generated docs files (docs/syntax/wardley.md, MermaidConfig.md) - Document handdrawn/rough mode limitation in wardley docs - Add required array to WardleyDiagramConfig schema Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix(wardley): pipeline link resolution, theme integration, and type safety - Fix pipeline component links by adding resolveNodeId() that matches components by label when synthetic ID lookup fails - Add wardley theme variables to all 5 theme files for proper dark/forest/ neutral theme support - Create styles.ts with CSS class rules driven by theme variables - Wire styles into wardleyDiagram.ts (replaces empty styles function) - Fix incorrect Required<WardleyNode> cast to narrow WardleyNode & { x; y } - Replace any[] with proper d3.Selection type for textElements Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * [autofix.ci] apply automated fixes * add drawMessage test * [autofix.ci] apply automated fixes * fix(wardley): address review feedback from #7642 - Add changeset for patch bump - Inline comment on NAME_WITH_SPACES explaining the -(?!>) trick - Edge-case tests: trailing hyphen (`foo-`) and double hyphen (`foo--bar`) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(wardley): address review feedback from #7641 - Reuse theme-level this.gridColor across all 5 themes instead of hardcoded rgba values, so Wardley grid lines track the palette (gantt-style). evolutionStroke stays hardcoded: the red is a Wardley/OWM semantic convention for evolution arrows regardless of theme and is overridable via themeVariables.wardley.evolutionStroke - Add wardleyBuilder.spec.ts covering resolveNodeId: exact-id match, label-fallback (pipeline synthetic-id case), unknown-input passthrough, and id-wins-over-label disambiguation - Extract WardleyText type alias for the d3 text selection signature Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore: add changeset for block diagram arrows * test(block): add extra edge style assertions requested in review * fix: improve zenuml print rendering, sizing, and syntax resilience * Use ARGOS_SUBSET config for scoped tests * Testing scope after fix * New test * Test of bug fix * Test with change * Remove comment * build(parser): bundle types using api-extractor Use `@microsoft/api-extractor` to bundle the TypeScript `.d.ts` types for `@mermaid-js/parser`. In a future commit, we want to bundle `langium`, which would need us to bundle `langium`'s types as well. Bundling reduces the size of our `dist/` folder, and makes it more obvious which of our types are external. I've made this as a `prepack` step, so that it doesn't affect the majority of mermaid developers when they run `pnpm install`. It's only when we publish the package that we'd bundle the code. This also means it will be tested by the `pnpm run test:check:tsc` test that we have. * fix(parser): bundle langium and chevrotain Bundle langium and chevrotain in the `@mermaid-js/parser` package, so they're no longer dependencies. This has the following benefits: 1. Chevrotain v11.1.1 has a pin on lodash-es v4.17.23. There are a couple of CVEs/alerts on that version, and chevrotain will not make a new v11 release since those alerts don't affect chevrotain, see Chevrotain/chevrotain#2186 2. Langium v4 raises an install warning on Node.JS v20.0, which is causing issues for some of mermaid's users, even if this code only runs in the browser. I'm using `api-extractor` to bundle the types for this. We're still keeping the `@chevrotatin/types` package as a dependency, since `api-extractor` can't seem to handle it, and it's only used for types. * fix(wardley): address second-round review feedback from #7641 - E2E theme coverage: render the same Wardley diagram under base, dark, forest, and neutral themes via imgSnapshotTest, locking in the new styles.ts/theme-block integration visually. - E2E pipeline-link-target coverage: add `User -> Electric Kettle` to the pipelines test fixture so resolveNodeId's label-fallback is exercised end-to-end (link targeting a pipeline child). - Introduce top-level wardleyEvolutionColor theme variable (default '#dc3545' / '#ff6b6b' for dark) so the evolution-arrow red is overridable via themeVariables.wardleyEvolutionColor at the palette level, not only via themeVariables.wardley.evolutionStroke. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * test(sankey): keep PR scoped to parser coverage * test(sankey): cover reported special-character sample * chore(dev-deps): remove unused `@types/uuid` UUID v11 already comes with TypeScript types. See: https://github.com/uuidjs/uuid/blob/3b57f95555ab1b8432213264b5eaa318958fb8fe/CHANGELOG.md#1100-2024-10-26 * fix: loosen `uuid` dependency range to allow v14 Mermaid does not use any of the vulnerable code in CVE-2026-41907, but this allows users to silence any `npm audit` alerts on it. Since the only breaking changes in v12-v14 are essentially Node.JS version support, I've broadened our range to allow all versions: - [v12][]: remove CommonJS and Node.JS v16 support - [v13][]: make browser exports the default - [v14][]: remove Node.JS v18 support I don't think there would be any Mermaid users that are still on Node.JS v18, since d3c0893 (fix(deps): update all major dependencies, 2025-07-09) bumped [marked to v16][marked@v16], which requires Node.JS v20. [v12]: https://github.com/uuidjs/uuid/releases/tag/v12.0.0 [v13]: https://github.com/uuidjs/uuid/releases/tag/v13.0.0 [v14]: https://github.com/uuidjs/uuid/releases/tag/v14.0.0 [marked@v16]: https://github.com/markedjs/marked/releases/tag/v16.0.0 See: CVE-2026-41907 See: d3c0893 * fix(quadrant-chart): add UNICODE_TEXT support for CJK and emoji The lexer ALPHA token only matched ASCII [A-Za-z]+, and the UNICODE_TEXT token was referenced in the grammar but never emitted. This caused bare Chinese/Japanese/Korean text in x-axis, y-axis, quadrant-N labels and point names to fail with a parse error. Added [\u0080-\uFFFF]+ lexer rule to emit UNICODE_TEXT, and added UNICODE_TEXT to the alphaNumToken grammar rule. Fixes #7120 * fix(quadrant-chart): narrow UNICODE_TEXT range, add comment, Latin-1 tests Narrow [\u0080-\uFFFF]+ to [^\x00-\x7F]+ for cross-grammar consistency with erDiagram. Add explanatory comment. Add test coverage for Latin-1 accented characters (Café, Größe, catégoría, naïve). Add changeset. * feat(architecture): expose fcose layout knobs via config Targets #6024, #6120, #7267. Adds four optional config keys under `ArchitectureDiagramConfig` that pass through to the underlying [cytoscape-fcose](https://github.com/iVis-at-Bilkent/cytoscape.js-fcose) layout. Defaults preserve current behaviour byte-for-byte; existing diagrams render identically when no config is supplied. | Key | Default | Effect | |---|---|---| | `nodeSeparation` | `75` | Min separation between sibling nodes in the same group. | | `idealEdgeLengthMultiplier` | `1.5` | Multiplier on `iconSize` for same-group edges. | | `edgeElasticity` | `0.45` | Spring elasticity (0–1) for same-group edges. | | `numIter` | `2500` | Max fcose iterations; trades runtime for layout quality. | Cross-group edge lengths and elasticity are unchanged (`0.5 * iconSize` and `0.001`). Includes: - `config.schema.yaml` updated with the four properties. - `config.type.ts` regenerated via `pnpm --filter mermaid types:build-config`. - `architectureRenderer.ts` hoists the four constants once before the `cy.layout` call. - Docs section "Layout tuning (v11.15.0+)" added under Configuration with a worked example. - Unit tests verifying round-trip + per-key override + partial set. - Cypress `imgSnapshotTest` cases per knob using the 3-DB → MCP repro from #6120. Note: pre-commit hook bypassed because `pnpm --filter mermaid run docs:build` (run by lint-staged on docs changes) currently fails on pre-existing TypeScript errors in `packages/mermaid/src/diagrams/wardley/wardleyParser.ts` that exist on `develop`. * chore: add changeset and use MERMAID_RELEASE_VERSION placeholder * docs: use MERMAID_RELEASE_VERSION placeholder for new section * docs: replace 'tunables' with 'options' to satisfy cspell * [autofix.ci] apply automated fixes * docs: tidy redundant 'options expose options' phrasing * refactor: drop misleading 3-DB→MCP knob snapshots; rewrite docs example The 3-DB → MCP repro from #6120 cannot be fixed by any combination of these knobs (measured: DB1 and DB3 land at identical screen coordinates regardless of nodeSeparation / idealEdgeLengthMultiplier / edgeElasticity / numIter values), because the BFS spatial map collapses sibling nodes onto the same logical position before fcose ever runs. Including those snapshots in the test suite would ship visibly-broken renders as 'passing' and overstate what this PR fixes. Replaced with a 3-node chain that demonstrates idealEdgeLengthMultiplier visibly stretching same-group edge length — an honest demonstration of one knob's effect. Other knobs are covered by unit tests for config plumbing. Updated the docs example to use the same chain diagram and added an explicit note that the knobs do not fix #6120-style sibling collapse — that needs the declarative align row|column directive in the companion PR. * chore: re-apply PR #7561 701020c (Merge branch 'master' into develop, 2026-04-01) was a bad merge, which didn't correctly cleanup the changeset entries. Fixes: 701020c * docs(event): remove redundant changeset entries Event modelling diagrams have not yet been released, so we don't need any separate changesets that mention event modelling. Unfortunately, we can't make a single changeset entry with multiple PRs/commits, but we can at least make a single changeset with multiple authors. Fixes: d50c423 Fixes: 32c257e * docs: improve `end note` changeset entry This changeset did not mention it had anything to do with state diagrams. Fixes: bfe60cc * docs: clarify changeset for autonumber change Update the changeset for 0aca217 (Make changes to allow for decimal values for sequence numbers, added corresponding unit tests, and updated docs., 2025-11-18) to mention that it's for sequence diagrams. I've also updated the changeset to point to 0aca217 directly, since the changeset was generated in a different PR from the rest of the changes. Fixes: 50b2166 * docs(tidy-tree): prevent changeset from bumping mermaid This change/PR doesn't touch mermaid, so there's no reason to patch it. Fixes: 5ab4693 * docs(zenuml): remove `mermaid` from changeset 45a9498 (fix: improve zenuml print rendering, sizing, and syntax resilience, 2026-04-22) only ever modifies the `packages/mermaid-zenuml` directory. It makes no changes to the `mermaid` package. See: 45a9498 * docs: remove changeset for docs-only change Since this is a docs-site only change, this won't affect consumers of Mermaid and we probably don't need a changeset for this. Fixes: 48424ae * docs: add state diagrams to `%` comment changeset The changeset for removing `%` comments in state diagrams didn't mention they were for state diagrams. It also didn't mention migration steps. Fixes: 8c1a0c1 * docs: add diagram prefix to changesets Instead of having `fix: .......`, I've changed the changesets to `fix(diagram): ......` to make it a bit easier to quickly see the diagram types that you are interested in. * ci: fix release preview publish errors Currently, `npm publish` runs `pnpm docs:verify-version`, which might possible fail if there are any `<MERMAID_RELEASE_VERSION>` placeholders in our docs. I've made a new environment variable, `ONLY_WARN_ON_VERIFY_ERROR`, that can be used to disable this behaviour, allowing us to publish release previews. * ci: limit release-preview-publish.yml permissions If we don't have the `id-token: write` permission, there's no way we can accidentally write the NPM! But we still need `packages: write` to write to GitHub Packages. * ci: use `npm publish --tag preview` for previews Make sure that we use a preview tag for previews * ci: include parser in `@mermaid-js/mermaid` pkg Right now, since we're using `npm publish` instead of `pnpm publish`, the `^workspace:` specifier in our `package.json` file won't work. We're also not publishing a `@mermaid-js/parser` package. Instead, we can use `pnpm pack` to create a `.tgz` that `npm publish` can upload. We can also use `bundledDependencies` to include the `@mermaid-js/parser` package, in case the latest preview version of mermaid requires new changes to that package. * fix(wardley): fix unnecessary sanitization of text The `wardleyRenderer` file never uses `.html()` or `.innerHTML` to set items within the HTML. Instead, it only ever uses D3 Selection's `.text`, which works `textContent`. This makes it immune to XSS attacks. When we over-sanitize this text, the diagram will show `<` instead of `<` in labels. * fix: revert endEdgeLabelLeft/endEdgeLabelRight change fedf70c (fix(class): Self-referential class multiplicity labels rendered multiple times, 2026-04-04) changed how `endLabel`s were rendered, by preventing them from being rendered within their `endEdgeLabelLeft` or `endLabelRight` elements, when they existed. Although when looking at the code, this seems correct (as otherwise `inner` is not used), this actually causes the labels to render on top of the edges, which makes the class diagrams look worse. This commit reverts that change, to avoid any visaul regression differences. Fixes: fedf70c * docs: improve nested namespace changeset As the nested namespace PR might change rendering behaviour for existing class diagrams that use dots in their namespaces, I've updated the changeset to explain how you can disable this feature by using `class.hierarchicalNamespaces`. --------- Signed-off-by: Yordis Prieto <yordis.prieto@gmail.com> Co-authored-by: darshanr0107 <darshan@mermaidchart.com> Co-authored-by: omkarht <omkar@mermaidchart.com> Co-authored-by: Mason Deacon <mdeaconfrop@gmail.com> Co-authored-by: Rayan Salhab <rayansalhab@hotmail.com> Co-authored-by: Zainan Victor Zhou (MBP2023) <zzn-github@zzn.im> Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: Alois Klink <alois@aloisklink.com> Co-authored-by: Ladislav Gazo <ladislav.gazo@gmail.com> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Takuya HARA <h.taku86@gmail.com> Co-authored-by: GhassenS <ghassen.siala@medtech.tn> Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> Co-authored-by: leentaylor <leentaylor@gmail.com> Co-authored-by: Knut Sveidqvist <knsv@users.noreply.github.com> Co-authored-by: pbrolin47 <114684273+pbrolin47@users.noreply.github.com> Co-authored-by: Arun Chandanaveli <aruncveli@gmail.com> Co-authored-by: Maddy Guthridge <hello@maddyguthridge.com> Co-authored-by: Yordis Prieto <yordis.prieto@gmail.com> Co-authored-by: NYCU-Chung <chung.la13@nycu.edu.tw> Co-authored-by: Knut Bot <knsv@mermaidchart.com> Co-authored-by: dagecko <cnyhuis@vigilantnow.com> Co-authored-by: zsxsoft <git@zsxsoft.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Sidharth Vinod <github@sidharth.dev> Co-authored-by: Per Brolin <per@mermaidchart.com> Co-authored-by: Rodrigo Santos <rodrigo.jose.nunes.dos.santos@tecnico.ulisboa.pt> Co-authored-by: Beatriz Braga <beatrizagbraga@tecnico.ulisboa.pt> Co-authored-by: Mac Carter <harlow44@gmail.com> Co-authored-by: Felix <202006933@alu.comillas.edu> Co-authored-by: Daniil Beliak <34097111+ekiauhce@users.noreply.github.com> Co-authored-by: Hadile Djebbi <117598338+hadileee@users.noreply.github.com> Co-authored-by: Knut Sveidqvist <knsv@sveido.com> Co-authored-by: tractorjuice <129532814+tractorjuice@users.noreply.github.com> Co-authored-by: MrCoder <eagle.xiao@gmail.com> Co-authored-by: Rayan Salhab <r.salhab@aiyexpertsolutions.com> Co-authored-by: cyphercodes <7407177+cyphercodes@users.noreply.github.com> Co-authored-by: dull bird <1155115927@link.cuhk.edu.hk> Co-authored-by: Timothy <50641082+txmxthy@users.noreply.github.com> Co-authored-by: Alois Klink <alois@mermaidchart.com>

…531) This PR contains the following updates: | Package | Change | [Age](https://docs.renovatebot.com/merge-confidence/) | [Confidence](https://docs.renovatebot.com/merge-confidence/) | |---|---|---|---| | [mermaid](https://github.com/mermaid-js/mermaid) | [`11.13.0` → `11.15.0`](https://renovatebot.com/diffs/npm/mermaid/11.13.0/11.15.0) | ![age](https://developer.mend.io/api/mc/badges/age/npm/mermaid/11.15.0?slim=true) | ![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/mermaid/11.13.0/11.15.0?slim=true) | --- ### Mermaid Gantt Charts are vulnerable to an Infinite Loop DoS [CVE-2026-41150](https://nvd.nist.gov/vuln/detail/CVE-2026-41150) / [GHSA-6m6c-36f7-fhxh](GHSA-6m6c-36f7-fhxh) <details> <summary>More information</summary> #### Details ##### Impact Mermaid v11.14.0 and earlier are vulnerable to a denial-of-service attack when rendering gantt charts, if they use the [`excludes` attribute](https://mermaid.js.org/syntax/gantt.html?#excludes) to exclude all dates. Example: ``` gantt excludes monday,tuesday,wednesday,thursday,friday,saturday,sunday DoS :2025-01-01, 1d ``` `mermaid.parse` is unaffected, unless you then call the `ganttDb.getTasks()` (which is called when rendering a diagram). ##### Patches This has been patched in: - [v11.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) (see [faafb5d49106dd32c367f3882505f2dd625aa30e](mermaid-js/mermaid@faafb5d)) - [v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) (see [a59ea56174712ee5430dfd5bc877cb5151f501a6](mermaid-js/mermaid@a59ea56)) ##### Workarounds There are no workarounds available without updating to a newer version of mermaid. #### Severity - CVSS Score: 5.3 / 10 (Medium) - Vector String: `CVSS:4.0/AV:N/AC:L/AT:N/PR:N/UI:P/VC:N/VI:N/VA:L/SC:N/SI:N/SA:L` #### References - [https://github.com/mermaid-js/mermaid/security/advisories/GHSA-6m6c-36f7-fhxh](https://github.com/mermaid-js/mermaid/security/advisories/GHSA-6m6c-36f7-fhxh) - [https://github.com/mermaid-js/mermaid/commit/a59ea56174712ee5430dfd5bc877cb5151f501a6](https://github.com/mermaid-js/mermaid/commit/a59ea56174712ee5430dfd5bc877cb5151f501a6) - [https://github.com/mermaid-js/mermaid/commit/faafb5d49106dd32c367f3882505f2dd625aa30e](https://github.com/mermaid-js/mermaid/commit/faafb5d49106dd32c367f3882505f2dd625aa30e) - [https://github.com/mermaid-js/mermaid](https://github.com/mermaid-js/mermaid) - [https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) - [https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) This data is provided by [OSV](https://osv.dev/vulnerability/GHSA-6m6c-36f7-fhxh) and the [GitHub Advisory Database](https://github.com/github/advisory-database) ([CC-BY 4.0](https://github.com/github/advisory-database/blob/main/LICENSE.md)). </details> --- ### Mermaid: Improper sanitization of configuration leads to CSS injection [CVE-2026-41159](https://nvd.nist.gov/vuln/detail/CVE-2026-41159) / [GHSA-87f9-hvmw-gh4p](GHSA-87f9-hvmw-gh4p) <details> <summary>More information</summary> #### Details ##### Impact Mermaid's default configuration allows injecting CSS that applies outside of the Mermaid diagram via the `fontFamily`, `themeCSS`, and `altFontFamily` configuration options. Live demo: [mermaid.live](https://mermaid.live/edit#pako:eNpNjktLxDAUhf9KvFBR6JS-60QQfODKlUvJ5k6TtsEmKTHFGUP-u-mI6Nmdy3fOPR56wwVQSBIvtXSUeAaD0e4ZlZxPDChhcLxFfwiEauOuLq_9Afv30ZpVczpaITS5kGox1qF2gfSeBwYhJAnThAyz-ewntI68vG5-0z3Z7e7IA9OQwmglB-rsKlJQwircLPgNZeAmocTPAi4GXGfHgOkQYwvqN2PUbzJuGSegA84f0a0LRyeeJI4W_xChubCPcbQD2pwbgHo4Aq2aKmvbqq3zoiu7pizqFE6RybN9VFfFY1HWXRVS-Dr_zLObrt7_V_gGGXZlGg) Example code: ``` %%{init: {"fontFamily": "x;a{b} :not(&){background:green !important} c{d}"}}%% flowchart LR A --> B ``` The injected CSS exploits stylis's `&` (scope reference) handling. `:not(&)` escapes the `#mermaid-xxx` automatic scoping, applying styles to all page elements. Global at-rules (`@font-face`, `@keyframes`, `@counter-style`) are also injectable as stylis hoists them to top level. This allows page defacement and DOM attribute exfiltration via CSS `:has()` selectors. ##### Patches - [v11.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) (see [64769738d5b59211e1decb471ffbaca8afec51aa](mermaid-js/mermaid@6476973)) - [v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) (see [a9d9f0d8eb790349121508688cd338253fd80d76](mermaid-js/mermaid@a9d9f0d)) ##### Workarounds If you can't upgrade mermaid, you can set the [`secure`](https://mermaid.js.org/config/schema-docs/config.html#secure) config value in the mermaid config to avoid allowing diagrams to modify `fontFamily`, `themeCSS`, `altFontFamily`, and `themeVariables`. Setting [`"securityLevel": "sandbox"`](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) will also prevent this. ##### Credits Reported by @zsxsoft on behalf of @KeenSecurityLab #### Severity - CVSS Score: 5.3 / 10 (Medium) - Vector String: `CVSS:4.0/AV:N/AC:L/AT:N/PR:N/UI:P/VC:N/VI:L/VA:N/SC:L/SI:L/SA:L` #### References - [https://github.com/mermaid-js/mermaid/security/advisories/GHSA-87f9-hvmw-gh4p](https://github.com/mermaid-js/mermaid/security/advisories/GHSA-87f9-hvmw-gh4p) - [https://github.com/mermaid-js/mermaid/commit/64769738d5b59211e1decb471ffbaca8afec51aa](https://github.com/mermaid-js/mermaid/commit/64769738d5b59211e1decb471ffbaca8afec51aa) - [https://github.com/mermaid-js/mermaid/commit/a9d9f0d8eb790349121508688cd338253fd80d76](https://github.com/mermaid-js/mermaid/commit/a9d9f0d8eb790349121508688cd338253fd80d76) - [https://github.com/mermaid-js/mermaid](https://github.com/mermaid-js/mermaid) - [https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) - [https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) This data is provided by [OSV](https://osv.dev/vulnerability/GHSA-87f9-hvmw-gh4p) and the [GitHub Advisory Database](https://github.com/github/advisory-database) ([CC-BY 4.0](https://github.com/github/advisory-database/blob/main/LICENSE.md)). </details> --- ### Mermaid: Improper sanitization of `classDef` in state diagrams leads to HTML injection [CVE-2026-41149](https://nvd.nist.gov/vuln/detail/CVE-2026-41149) / [GHSA-ghcm-xqfw-q4vr](GHSA-ghcm-xqfw-q4vr) <details> <summary>More information</summary> #### Details ##### Impact Under the default configuration, Mermaid state diagram's `classDef` allow DOM injection that escapes the SVG, although `<script>` tags are removed, preventing XSS. ##### Proof-of-concept ``` stateDiagram-v2 classDef xss fill:red</style></svg><style>*{x:x;y:y;overflow:visible!important;contain:none!important;transform:none!important;filter:none!important;clip-path:none!important}</style><div style="x:x;y:y;color:red;font:5em/1 monospace;display:grid;place-items:center;z-index:2147483647;width:100vw;height:100vh;position:fixed;top:0;left:0;background:black">HACKED</div><svg><style>a:b [*] --> A:::xss ``` ##### Patches - [v11.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) (see [37ff937f1da2e19f882fd1db01235db4d01f4056](mermaid-js/mermaid@37ff937)) - [v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) (see [4e2d512bf5bf6f9de1a8f0a48da78dc4d09ac4f3](mermaid-js/mermaid@4e2d512)) ##### Workarounds If you can not update to a patched version, setting [`"securityLevel": "sandbox"`](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) will prevent this, by rendering the mermaid diagram in a sandboxed `<iframe>`. ##### Credits Thanks to @zsxsoft from @KeenSecurityLab for reporting this vulnerability. #### Severity - CVSS Score: 5.3 / 10 (Medium) - Vector String: `CVSS:4.0/AV:N/AC:L/AT:N/PR:N/UI:P/VC:N/VI:L/VA:N/SC:L/SI:L/SA:L` #### References - [https://github.com/mermaid-js/mermaid/security/advisories/GHSA-ghcm-xqfw-q4vr](https://github.com/mermaid-js/mermaid/security/advisories/GHSA-ghcm-xqfw-q4vr) - [https://github.com/mermaid-js/mermaid/commit/37ff937f1da2e19f882fd1db01235db4d01f4056](https://github.com/mermaid-js/mermaid/commit/37ff937f1da2e19f882fd1db01235db4d01f4056) - [https://github.com/mermaid-js/mermaid/commit/4e2d512bf5bf6f9de1a8f0a48da78dc4d09ac4f3](https://github.com/mermaid-js/mermaid/commit/4e2d512bf5bf6f9de1a8f0a48da78dc4d09ac4f3) - [https://github.com/mermaid-js/mermaid](https://github.com/mermaid-js/mermaid) - [https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) - [https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) - [https://mermaid.js.org/config/schema-docs/config.html#securitylevel](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) This data is provided by [OSV](https://osv.dev/vulnerability/GHSA-ghcm-xqfw-q4vr) and the [GitHub Advisory Database](https://github.com/github/advisory-database) ([CC-BY 4.0](https://github.com/github/advisory-database/blob/main/LICENSE.md)). </details> --- ### Mermaid: Improper sanitization of `classDefs` in diagrams leads to CSS injection [CVE-2026-41148](https://nvd.nist.gov/vuln/detail/CVE-2026-41148) / [GHSA-xcj9-5m2h-648r](GHSA-xcj9-5m2h-648r) <details> <summary>More information</summary> #### Details ##### Details The state diagram and any other diagram type that routes user-controlled style strings through createCssStyles parser for Mermaid v11.14.0 and earlier captures `classDef` values with an unrestricted regex: ```jison // packages/mermaid/src/diagrams/state/parser/stateDiagram.jison:83 <CLASSDEFID>[^\n]* { this.popState(); return 'CLASSDEF_STYLEOPTS' } ``` The value passes unsanitized through `addStyleClass()` -> `createCssStyles()` -> `style.innerHTML` (mermaidAPI.ts:418). A `}` in the value closes the generated CSS selector, and everything after becomes a new CSS rule on the page. ##### PoC ``` stateDiagram-v2 classDef x }*{ background-image: url("http://media.giphy.com/media/SggILpMXO7Xt6/giphy.gif")} ``` Live demo: <https://mermaid.live/edit#pako:eNpFjzFvgzAQhf-KdVNbEcBgMHhtlkqtOnSJKi8ONsYKBmRMlRTx3-skanvTfbp7996t0IxSAYPZC6_2Rmgn7O4rQ00v5nmvWnRG29OKjqI5aTcug9wZK7RiaHH9A4fO-4kliVXSiFibqbvEzWjvnHxo_fI6vR3e6cGXyX2qTcvhcYMItDMSmHeLisAqZ8UVYeUDQhx8p6ziwEIrhTtx4MNVM4nhcxztrywE0h2wVvRzoGWS_z_8rahBKvcckntgmN5OAFvhDIzUNCZZQXCR5nVaZkUEF2BVFpOcEkoxxhUuyRbB980yjStapKHqoKFlhvPtB7BFZEU> ##### Patches This has been patched in: - [v11.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) (see [e9b0f34d8d82a6260077764ee45e1d7d90957a0f](mermaid-js/mermaid@e9b0f34)) - [v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) (see [8fead23c59166b7bab6a39eac81acebee2859102](mermaid-js/mermaid@8fead23)) ##### Workarounds Setting [`"securityLevel": "sandbox"`](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) will prevent this, by rendering the mermaid diagram in a sandboxed `<iframe>`. ##### Impact Enables page defacement, user tracking via `url()` callbacks, and DOM attribute exfiltration via CSS `:has()` selectors. #### Severity - CVSS Score: 5.3 / 10 (Medium) - Vector String: `CVSS:4.0/AV:N/AC:L/AT:N/PR:N/UI:P/VC:N/VI:L/VA:N/SC:L/SI:L/SA:L` #### References - [https://github.com/mermaid-js/mermaid/security/advisories/GHSA-xcj9-5m2h-648r](https://github.com/mermaid-js/mermaid/security/advisories/GHSA-xcj9-5m2h-648r) - [https://github.com/mermaid-js/mermaid/commit/8fead23c59166b7bab6a39eac81acebee2859102](https://github.com/mermaid-js/mermaid/commit/8fead23c59166b7bab6a39eac81acebee2859102) - [https://github.com/mermaid-js/mermaid/commit/e9b0f34d8d82a6260077764ee45e1d7d90957a0f](https://github.com/mermaid-js/mermaid/commit/e9b0f34d8d82a6260077764ee45e1d7d90957a0f) - [https://github.com/mermaid-js/mermaid](https://github.com/mermaid-js/mermaid) - [https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) - [https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.6) - [https://mermaid.js.org/config/schema-docs/config.html#securitylevel](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) This data is provided by [OSV](https://osv.dev/vulnerability/GHSA-xcj9-5m2h-648r) and the [GitHub Advisory Database](https://github.com/github/advisory-database) ([CC-BY 4.0](https://github.com/github/advisory-database/blob/main/LICENSE.md)). </details> --- ### Release Notes <details> <summary>mermaid-js/mermaid (mermaid)</summary> ### [`v11.15.0`](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0) [Compare Source](https://github.com/mermaid-js/mermaid/compare/mermaid@11.14.0...mermaid@11.15.0) ##### Minor Changes - [#7174](mermaid-js/mermaid#7174) [`0aca217`](mermaid-js/mermaid@0aca217) Thanks [@milesspencer35](https://github.com/milesspencer35)! - feat(sequence): Add support for decimal start and increment values in the `autonumber` directive - [#7512](mermaid-js/mermaid#7512) [`8e17492`](mermaid-js/mermaid@8e17492) Thanks [@aruncveli](https://github.com/aruncveli)! - feat(flowchart): add datastore shape In Data flow diagrams, a datastore/warehouse/file/database is used to represent data persistence. It is denoted by a rectangle with only top and bottom borders, and can be used in flowcharts with `A@{ shape: datastore, label: "Datastore" }`. - [#6440](mermaid-js/mermaid#6440) [`9ad8dde`](mermaid-js/mermaid@9ad8dde) Thanks [@yordis](https://github.com/yordis), [@lgazo](https://github.com/lgazo)! - feat: add Event Modeling diagram - [#7707](mermaid-js/mermaid#7707) [`27db774`](mermaid-js/mermaid@27db774) Thanks [@txmxthy](https://github.com/txmxthy)! - feat(architecture): expose four fcose layout knobs for `architecture-beta` diagrams (`nodeSeparation`, `idealEdgeLengthMultiplier`, `edgeElasticity`, `numIter`) so authors can tune layout density and spread overlapping siblings without changing diagram source - [#7604](mermaid-js/mermaid#7604) [`bf9502f`](mermaid-js/mermaid@bf9502f) Thanks [@M-a-c](https://github.com/M-a-c)! - feat(class): add nested namespace support for class diagrams via dot notation and syntactic nesting If you have namespaces in class diagrams that use `.`s already and want to render them without nesting (≤v11.14.0 behaviour), you can use set `class.hierarchicalNamespaces=false` in your mermaid config: ```yaml config: class: hierarchicalNamespaces: false ``` - [#7272](mermaid-js/mermaid#7272) [`88cdd3d`](mermaid-js/mermaid@88cdd3d) Thanks [@xinbenlv](https://github.com/xinbenlv)! - feat(sankey): add outlined label style, configurable nodeWidth/nodePadding, and custom node colors ##### Patch Changes - [#7737](mermaid-js/mermaid#7737) [`e9b0f34`](mermaid-js/mermaid@e9b0f34) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: prevent unbalanced CSS styles in classDefs - [#7737](mermaid-js/mermaid#7737) [`37ff937`](mermaid-js/mermaid@37ff937) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: create CSS styles using the CSSOM This removes some invalid CSS and normalizes some CSS formatting. - [#7508](mermaid-js/mermaid#7508) [`bfe60cc`](mermaid-js/mermaid@bfe60cc) Thanks [@biiab](https://github.com/biiab)! - fix(stateDiagram): `end note` now only closes a note when used on a new line - [#7737](mermaid-js/mermaid#7737) [`faafb5d`](mermaid-js/mermaid@faafb5d) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix(gantt): add iteration limit for `excludes` field - [#7737](mermaid-js/mermaid#7737) [`65f8be2`](mermaid-js/mermaid@65f8be2) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: disallow some CSS at-rules in custom CSS - [#7726](mermaid-js/mermaid#7726) [`1502f32`](mermaid-js/mermaid@1502f32) Thanks [@aloisklink](https://github.com/aloisklink)! - fix(wardley): fix unnecessary sanitization of text - [#7578](mermaid-js/mermaid#7578) [`1f98db8`](mermaid-js/mermaid@1f98db8) Thanks [@Gaston202](https://github.com/Gaston202)! - fix(class): self-referential class multiplicity labels no longer rendered multiple times Fixes [#7560](mermaid-js/mermaid#7560). Resolves an issue where cardinality labels on self-referential class relationships were rendered three times due to edge splitting in the dagre layout. The fix ensures that each sub-edge only carries its relevant label positions. - [#7592](mermaid-js/mermaid#7592) [`2343e38`](mermaid-js/mermaid@2343e38) Thanks [@knsv-bot](https://github.com/knsv-bot)! - fix(sequence): add background box behind alt/else section title labels in sequence diagrams - [#7589](mermaid-js/mermaid#7589) [`7fb9509`](mermaid-js/mermaid@7fb9509) Thanks [@NYCU-Chung](https://github.com/NYCU-Chung)! - fix(block): prevent column widths from shrinking when mixing different column spans - [#7632](mermaid-js/mermaid#7632) [`3f9e0f1`](mermaid-js/mermaid@3f9e0f1) Thanks [@ekiauhce](https://github.com/ekiauhce)! - fix(sequence): correct messageAlign label position for right-to-left arrows in sequence diagrams - [#7642](mermaid-js/mermaid#7642) [`7a8fb85`](mermaid-js/mermaid@7a8fb85) Thanks [@tractorjuice](https://github.com/tractorjuice)! - fix(wardley): allow hyphens in unquoted component names Multi-word names containing hyphens — e.g. `real-time processing`, `end-user`, `on-call engineer` — now parse without quoting, bringing the grammar in line with the OnlineWardleyMaps (OWM) convention. `A->B` (no-space arrow) still tokenises correctly. - [#7523](mermaid-js/mermaid#7523) [`5144ed4`](mermaid-js/mermaid@5144ed4) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Arrow blocks in block-beta diagrams not spanning the specified number of columns when using `:n` syntax. - [#7262](mermaid-js/mermaid#7262) [`13d9bfa`](mermaid-js/mermaid@13d9bfa) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Ensure block diagram hexagon blocks respect column spanning syntax - [#7684](mermaid-js/mermaid#7684) [`e14bb88`](mermaid-js/mermaid@e14bb88) Thanks [@aloisklink](https://github.com/aloisklink)! - fix: loosen `uuid` dependency range to allow v14 Mermaid does not use any of the vulnerable code in CVE-2026-41907, but this allows users to silence any `npm audit` alerts on it. - [#7633](mermaid-js/mermaid#7633) [`9217c0d`](mermaid-js/mermaid@9217c0d) Thanks [@Felix-Garci](https://github.com/Felix-Garci)! - fix(block): add support for all arrow types in block diagrams - [#7587](mermaid-js/mermaid#7587) [`5e7eb62`](mermaid-js/mermaid@5e7eb62) Thanks [@MaddyGuthridge](https://github.com/MaddyGuthridge)! - chore: drop lodash-es in favour of es-toolkit - [#7693](mermaid-js/mermaid#7693) [`afaf306`](mermaid-js/mermaid@afaf306) Thanks [@dull-bird](https://github.com/dull-bird)! - fix(quadrant-chart): allow CJK, emoji, Latin-1 accented characters, and other non-ASCII text in unquoted axis/quadrant/point labels. Previously the lexer only matched ASCII `[A-Za-z]+` for text tokens, even though the grammar referenced `UNICODE_TEXT`. Bare Chinese, Japanese, Korean, emoji, and accented Latin characters in labels caused a parse error. Added a `[^\x00-\x7F]+` lexer rule to emit `UNICODE_TEXT` and included it in the `alphaNumToken` grammar rule. Fixes [#7120](mermaid-js/mermaid#7120). - [#7737](mermaid-js/mermaid#7737) [`4755553`](mermaid-js/mermaid@4755553) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: improve D3 types for mermaidAPI funcs - [#7737](mermaid-js/mermaid#7737) [`6476973`](mermaid-js/mermaid@6476973) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: handle `&` when namespacing CSS rules - [#7520](mermaid-js/mermaid#7520) [`8c1a0c1`](mermaid-js/mermaid@8c1a0c1) Thanks [@RodrigojndSantos](https://github.com/RodrigojndSantos)! - fix(stateDiagram): comments starting with one `%` are no longer treated as comments Switch to using two `%%` if you want to write a comment. - Updated dependencies \[[`7a8fb85`](mermaid-js/mermaid@7a8fb85), [`675a64c`](mermaid-js/mermaid@675a64c)]: - [@mermaid-js/parser](https://github.com/mermaid-js/parser)@1.1.1 ### [`v11.14.0`](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.14.0) [Compare Source](https://github.com/mermaid-js/mermaid/compare/mermaid@11.13.0...mermaid@11.14.0) Thanks to our awesome mermaid community that contributed to this release: [@ashishjain0512](https://github.com/ashishjain0512), [@tractorjuice](https://github.com/tractorjuice), [@autofix-ci\[bot\]](https://github.com/autofix-ci%5Bbot%5D), [@aloisklink](https://github.com/aloisklink), [@knsv](https://github.com/knsv), [@kibanana](https://github.com/kibanana), [@chandershekhar22](https://github.com/chandershekhar22), [@khalil](https://github.com/khalil), [@ytatsuno](https://github.com/ytatsuno), [@sidharthv96](https://github.com/sidharthv96), [@github-actions\[bot\]](https://github.com/github-actions%5Bbot%5D), [@dripcoding](https://github.com/dripcoding), [@knsv-bot](https://github.com/knsv-bot), [@jeroensmink98](https://github.com/jeroensmink98), [@Alex9583](https://github.com/Alex9583), [@GhassenS](https://github.com/GhassenS), [@omkarht](https://github.com/omkarht), [@darshanr0107](https://github.com/darshanr0107), [@leentaylor](https://github.com/leentaylor), [@lee-treehouse](https://github.com/lee-treehouse), [@veeceey](https://github.com/veeceey), [@turntrout](https://github.com/turntrout), [@Mermaid-Chart](https://github.com/Mermaid-Chart), [@BambioGaming](https://github.com/BambioGaming), Claude ### Releases #### [@mermaid-js/examples](https://github.com/mermaid-js/examples)@1.2.0 ##### Minor Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add new TreeView diagram #### mermaid\@11.14.0 ##### Minor Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - Add Wardley Maps diagram type (beta) Adds Wardley Maps as a new diagram type to Mermaid (available as `wardley-beta`). Wardley Maps are visual representations of business strategy that help map value chains and component evolution. Features: - Component positioning with \[visibility, evolution] coordinates (OWM format) - Anchors for users/customers - Multiple link types: dependencies, flows, labeled links - Evolution arrows and trend indicators - Custom evolution stages with optional dual labels - Custom stage widths using [@boundary](https://github.com/boundary) notation - Pipeline components with visibility inheritance - Annotations, notes, and visual elements - Source strategy markers: build, buy, outsource, market - Inertia indicators - Theme integration Implementation includes parser, D3.js renderer, unit tests, E2E tests, and comprehensive documentation. - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for state diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look support for sequence diagrams with drop shadows, and enhanced styling - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add `randomize` config option for architecture diagrams, defaulting to `false` for deterministic layout - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: Add option to change timeline direction - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - Fix duplicate SVG element IDs when rendering multiple diagrams on the same page. Internal element IDs (nodes, edges, markers, clusters) are now prefixed with the diagram's SVG element ID across all diagram types. Custom CSS or JS using exact ID selectors like `#arrowhead` should use attribute-ending selectors like `[id$="-arrowhead"]` instead. - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for ER diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for requirement diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add theme support for data label colour in xy chart - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for mindmap diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look for mermaid flowchart diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look and themes for class diagram - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add showDataLabelOutsideBar option for xy chart - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look support for timeline diagram with drop shadows, additoinal redux themes and enhanced styling - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look and themes for gitGraph diagram - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add new TreeView diagram ##### Patch Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add link to ishikawa diagram on mermaid.js.org - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - docs: document valid duration token formats in gantt.md - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: ER diagram parsing when using "1" as entity identifier on right side The parser was incorrectly tokenizing the second "1" in patterns like `a many to 1 1:` because the lookahead rule only checked for alphabetic characters after whitespace, not digits. Added a new lookahead pattern `"1"(?=\s+[0-9])` to correctly identify the cardinality alias before a numeric entity name. Fixes [#7472](mermaid-js/mermaid#7472) - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: scope cytoscape label style mapping to edges with labels to prevent console warnings - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: support inline annotation syntax in class diagrams (class Shape <<interface>>) - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Align branch label background with text for multi-line labels in LR GitGraph layout - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: preserve cause hierarchy when ishikawa effect is indented more than causes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - refactor: remove unused createGraphWithElements function and add regression test for open edge arrowheads - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Prevent long pie chart titles from being clipped by expanding the viewBox - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: prevent sequence diagram hang when "as" is used without a trailing space in participant declarations - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: warn when `style` statement targets a non-existent node in flowcharts - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: group state diagram SVG children under single root <g> element - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Allow :::className syntax inside composite state blocks - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) Thanks [@aloisklink](https://github.com/aloisklink), [@BambioGaming](https://github.com/BambioGaming)! - fix: prevent escaping `<` and `&` when `htmlLabels: false` - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: treemap title and labels use theme-aware colors for dark backgrounds - Updated dependencies \[[`efe218a`](mermaid-js/mermaid@efe218a)]: - [@mermaid-js/parser](https://github.com/mermaid-js/parser)@1.1.0 #### [@mermaid-js/parser](https://github.com/mermaid-js/parser)@1.1.0 ##### Minor Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add new TreeView diagram #### [@mermaid-js/tiny](https://github.com/mermaid-js/tiny)@11.14.0 ##### Minor Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - Add Wardley Maps diagram type (beta) Adds Wardley Maps as a new diagram type to Mermaid (available as `wardley-beta`). Wardley Maps are visual representations of business strategy that help map value chains and component evolution. Features: - Component positioning with \[visibility, evolution] coordinates (OWM format) - Anchors for users/customers - Multiple link types: dependencies, flows, labeled links - Evolution arrows and trend indicators - Custom evolution stages with optional dual labels - Custom stage widths using [@boundary](https://github.com/boundary) notation - Pipeline components with visibility inheritance - Annotations, notes, and visual elements - Source strategy markers: build, buy, outsource, market - Inertia indicators - Theme integration Implementation includes parser, D3.js renderer, unit tests, E2E tests, and comprehensive documentation. - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for state diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look support for sequence diagrams with drop shadows, and enhanced styling - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add `randomize` config option for architecture diagrams, defaulting to `false` for deterministic layout - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: Add option to change timeline direction - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - Fix duplicate SVG element IDs when rendering multiple diagrams on the same page. Internal element IDs (nodes, edges, markers, clusters) are now prefixed with the diagram's SVG element ID across all diagram types. Custom CSS or JS using exact ID selectors like `#arrowhead` should use attribute-ending selectors like `[id$="-arrowhead"]` instead. - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for ER diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for requirement diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add theme support for data label colour in xy chart - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look styling for mindmap diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look for mermaid flowchart diagrams - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look and themes for class diagram - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: add showDataLabelOutsideBar option for xy chart - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look support for timeline diagram with drop shadows, additoinal redux themes and enhanced styling - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - feat: implement neo look and themes for gitGraph diagram - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add new TreeView diagram ##### Patch Changes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - add link to ishikawa diagram on mermaid.js.org - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - docs: document valid duration token formats in gantt.md - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: ER diagram parsing when using "1" as entity identifier on right side The parser was incorrectly tokenizing the second "1" in patterns like `a many to 1 1:` because the lookahead rule only checked for alphabetic characters after whitespace, not digits. Added a new lookahead pattern `"1"(?=\s+[0-9])` to correctly identify the cardinality alias before a numeric entity name. Fixes [#7472](mermaid-js/mermaid#7472) - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: scope cytoscape label style mapping to edges with labels to prevent console warnings - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: support inline annotation syntax in class diagrams (class Shape <<interface>>) - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Align branch label background with text for multi-line labels in LR GitGraph layout - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: preserve cause hierarchy when ishikawa effect is indented more than causes - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - refactor: remove unused createGraphWithElements function and add regression test for open edge arrowheads - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Prevent long pie chart titles from being clipped by expanding the viewBox - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: prevent sequence diagram hang when "as" is used without a trailing space in participant declarations - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: warn when `style` statement targets a non-existent node in flowcharts - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: group state diagram SVG children under single root <g> element - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: Allow :::className syntax inside composite state blocks - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) Thanks [@aloisklink](https://github.com/aloisklink), [@BambioGaming](https://github.com/BambioGaming)! - fix: prevent escaping `<` and `&` when `htmlLabels: false` - [#7526](mermaid-js/mermaid#7526) [`efe218a`](mermaid-js/mermaid@efe218a) - fix: treemap title and labels use theme-aware colors for dark backgrounds - Updated dependencies \[[`efe218a`](mermaid-js/mermaid@efe218a)]: - [@mermaid-js/parser](https://github.com/mermaid-js/parser)@1.1.0 </details> --- ### Configuration 📅 **Schedule**: (UTC) - Branch creation - "" - Automerge - Between 12:00 AM and 03:59 AM (`* 0-3 * * *`) 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://github.com/renovatebot/renovate).  Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/12531 Reviewed-by: Mathieu Fenniak <mfenniak@noreply.codeberg.org>

@milesspencer35

Upstream release: https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0 Release notes: ### Minor Changes - [#7174](mermaid-js/mermaid#7174) [`0aca217`](mermaid-js/mermaid@0aca217) Thanks [@milesspencer35](https://github.com/milesspencer35)! - feat(sequence): Add support for decimal start and increment values in the `autonumber` directive - [#7512](mermaid-js/mermaid#7512) [`8e17492`](mermaid-js/mermaid@8e17492) Thanks [@aruncveli](https://github.com/aruncveli)! - feat(flowchart): add datastore shape In Data flow diagrams, a datastore/warehouse/file/database is used to represent data persistence. It is denoted by a rectangle with only top and bottom borders, and can be used in flowcharts with `A@{ shape: datastore, label: "Datastore" }`. - [#6440](mermaid-js/mermaid#6440) [`9ad8dde`](mermaid-js/mermaid@9ad8dde) Thanks [@yordis](https://github.com/yordis), [@lgazo](https://github.com/lgazo)! - feat: add Event Modeling diagram - [#7707](mermaid-js/mermaid#7707) [`27db774`](mermaid-js/mermaid@27db774) Thanks [@txmxthy](https://github.com/txmxthy)! - feat(architecture): expose four fcose layout knobs for `architecture-beta` diagrams (`nodeSeparation`, `idealEdgeLengthMultiplier`, `edgeElasticity`, `numIter`) so authors can tune layout density and spread overlapping siblings without changing diagram source - [#7604](mermaid-js/mermaid#7604) [`bf9502f`](mermaid-js/mermaid@bf9502f) Thanks [@M-a-c](https://github.com/M-a-c)! - feat(class): add nested namespace support for class diagrams via dot notation and syntactic nesting If you have namespaces in class diagrams that use `.`s already and want to render them without nesting (≤v11.14.0 behaviour), you can use set `class.hierarchicalNamespaces=false` in your mermaid config: ```yaml config: class: hierarchicalNamespaces: false ``` - [#7272](mermaid-js/mermaid#7272) [`88cdd3d`](mermaid-js/mermaid@88cdd3d) Thanks [@xinbenlv](https://github.com/xinbenlv)! - feat(sankey): add outlined label style, configurable nodeWidth/nodePadding, and custom node colors ### Patch Changes - [#7737](mermaid-js/mermaid#7737) [`e9b0f34`](mermaid-js/mermaid@e9b0f34) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: prevent unbalanced CSS styles in classDefs - [#7737](mermaid-js/mermaid#7737) [`37ff937`](mermaid-js/mermaid@37ff937) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: create CSS styles using the CSSOM This removes some invalid CSS and normalizes some CSS formatting. - [#7508](mermaid-js/mermaid#7508) [`bfe60cc`](mermaid-js/mermaid@bfe60cc) Thanks [@biiab](https://github.com/biiab)! - fix(stateDiagram): `end note` now only closes a note when used on a new line - [#7737](mermaid-js/mermaid#7737) [`faafb5d`](mermaid-js/mermaid@faafb5d) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix(gantt): add iteration limit for `excludes` field - [#7737](mermaid-js/mermaid#7737) [`65f8be2`](mermaid-js/mermaid@65f8be2) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: disallow some CSS at-rules in custom CSS - [#7726](mermaid-js/mermaid#7726) [`1502f32`](mermaid-js/mermaid@1502f32) Thanks [@aloisklink](https://github.com/aloisklink)! - fix(wardley): fix unnecessary sanitization of text - [#7578](mermaid-js/mermaid#7578) [`1f98db8`](mermaid-js/mermaid@1f98db8) Thanks [@Gaston202](https://github.com/Gaston202)! - fix(class): self-referential class multiplicity labels no longer rendered multiple times Fixes #7560. Resolves an issue where cardinality labels on self-referential class relationships were rendered three times due to edge splitting in the dagre layout. The fix ensures that each sub-edge only carries its relevant label positions. - [#7592](mermaid-js/mermaid#7592) [`2343e38`](mermaid-js/mermaid@2343e38) Thanks [@knsv-bot](https://github.com/knsv-bot)! - fix(sequence): add background box behind alt/else section title labels in sequence diagrams - [#7589](mermaid-js/mermaid#7589) [`7fb9509`](mermaid-js/mermaid@7fb9509) Thanks [@NYCU-Chung](https://github.com/NYCU-Chung)! - fix(block): prevent column widths from shrinking when mixing different column spans - [#7632](mermaid-js/mermaid#7632) [`3f9e0f1`](mermaid-js/mermaid@3f9e0f1) Thanks [@ekiauhce](https://github.com/ekiauhce)! - fix(sequence): correct messageAlign label position for right-to-left arrows in sequence diagrams - [#7642](mermaid-js/mermaid#7642) [`7a8fb85`](mermaid-js/mermaid@7a8fb85) Thanks [@tractorjuice](https://github.com/tractorjuice)! - fix(wardley): allow hyphens in unquoted component names Multi-word names containing hyphens — e.g. `real-time processing`, `end-user`, `on-call engineer` — now parse without quoting, bringing the grammar in line with the OnlineWardleyMaps (OWM) convention. `A->B` (no-space arrow) still tokenises correctly. - [#7523](mermaid-js/mermaid#7523) [`5144ed4`](mermaid-js/mermaid@5144ed4) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Arrow blocks in block-beta diagrams not spanning the specified number of columns when using `:n` syntax. - [#7262](mermaid-js/mermaid#7262) [`13d9bfa`](mermaid-js/mermaid@13d9bfa) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Ensure block diagram hexagon blocks respect column spanning syntax - [#7684](mermaid-js/mermaid#7684) [`e14bb88`](mermaid-js/mermaid@e14bb88) Thanks [@aloisklink](https://github.com/aloisklink)! - fix: loosen `uuid` dependency range to allow v14 Mermaid does not use any of the vulnerable code in CVE-2026-41907, but this allows users to silence any `npm audit` alerts on it. - [#7633](mermaid-js/mermaid#7633) [`9217c0d`](mermaid-js/mermaid@9217c0d) Thanks [@Felix-Garci](https://github.com/Felix-Garci)! - fix(block): add support for all arrow types in block diagrams - [#7587](mermaid-js/mermaid#7587) [`5e7eb62`](mermaid-js/mermaid@5e7eb62) Thanks [@MaddyGuthridge](https://github.com/MaddyGuthridge)! - chore: drop lodash-es in favour of es-toolkit - [#7693](mermaid-js/mermaid#7693) [`afaf306`](mermaid-js/mermaid@afaf306) Thanks [@dull-bird](https://github.com/dull-bird)! - fix(quadrant-chart): allow CJK, emoji, Latin-1 accented characters, and other non-ASCII text in unquoted axis/quadrant/point labels. Previously the lexer only matched ASCII `[A-Za-z]+` for text tokens, even though the grammar referenced `UNICODE_TEXT`. Bare Chinese, Japanese, Korean, emoji, and accented Latin characters in labels caused a parse error. Added a `[^\x00-\x7F]+` lexer rule to emit `UNICODE_TEXT` and included it in the `alphaNumToken` grammar rule. Fixes #7120. - [#7737](mermaid-js/mermaid#7737) [`4755553`](mermaid-js/mermaid@4755553) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: improve D3 types for mermaidAPI funcs - [#7737](mermaid-js/mermaid#7737) [`6476973`](mermaid-js/mermaid@6476973) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: handle `&` when namespacing CSS rules - [#7520](mermaid-js/mermaid#7520) [`8c1a0c1`](mermaid-js/mermaid@8c1a0c1) Thanks [@RodrigojndSantos](https://github.com/RodrigojndSantos)! - fix(stateDiagram): comments starting with one `%` are no longer treated as comments Switch to using two `%%` if you want to write a comment. - Updated dependencies \[[`7a8fb85`](mermaid-js/mermaid@7a8fb85), [`675a64c`](mermaid-js/mermaid@675a64c)]: - @mermaid-js/parser@1.1.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: give me a 98K <240642031+inhuman-0@users.noreply.github.com>

@milesspencer35

Upstream release: https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.15.0 Release notes: ### Minor Changes - [#7174](mermaid-js/mermaid#7174) [`0aca217`](mermaid-js/mermaid@0aca217) Thanks [@milesspencer35](https://github.com/milesspencer35)! - feat(sequence): Add support for decimal start and increment values in the `autonumber` directive - [#7512](mermaid-js/mermaid#7512) [`8e17492`](mermaid-js/mermaid@8e17492) Thanks [@aruncveli](https://github.com/aruncveli)! - feat(flowchart): add datastore shape In Data flow diagrams, a datastore/warehouse/file/database is used to represent data persistence. It is denoted by a rectangle with only top and bottom borders, and can be used in flowcharts with `A@{ shape: datastore, label: "Datastore" }`. - [#6440](mermaid-js/mermaid#6440) [`9ad8dde`](mermaid-js/mermaid@9ad8dde) Thanks [@yordis](https://github.com/yordis), [@lgazo](https://github.com/lgazo)! - feat: add Event Modeling diagram - [#7707](mermaid-js/mermaid#7707) [`27db774`](mermaid-js/mermaid@27db774) Thanks [@txmxthy](https://github.com/txmxthy)! - feat(architecture): expose four fcose layout knobs for `architecture-beta` diagrams (`nodeSeparation`, `idealEdgeLengthMultiplier`, `edgeElasticity`, `numIter`) so authors can tune layout density and spread overlapping siblings without changing diagram source - [#7604](mermaid-js/mermaid#7604) [`bf9502f`](mermaid-js/mermaid@bf9502f) Thanks [@M-a-c](https://github.com/M-a-c)! - feat(class): add nested namespace support for class diagrams via dot notation and syntactic nesting If you have namespaces in class diagrams that use `.`s already and want to render them without nesting (≤v11.14.0 behaviour), you can use set `class.hierarchicalNamespaces=false` in your mermaid config: ```yaml config: class: hierarchicalNamespaces: false ``` - [#7272](mermaid-js/mermaid#7272) [`88cdd3d`](mermaid-js/mermaid@88cdd3d) Thanks [@xinbenlv](https://github.com/xinbenlv)! - feat(sankey): add outlined label style, configurable nodeWidth/nodePadding, and custom node colors ### Patch Changes - [#7737](mermaid-js/mermaid#7737) [`e9b0f34`](mermaid-js/mermaid@e9b0f34) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: prevent unbalanced CSS styles in classDefs - [#7737](mermaid-js/mermaid#7737) [`37ff937`](mermaid-js/mermaid@37ff937) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: create CSS styles using the CSSOM This removes some invalid CSS and normalizes some CSS formatting. - [#7508](mermaid-js/mermaid#7508) [`bfe60cc`](mermaid-js/mermaid@bfe60cc) Thanks [@biiab](https://github.com/biiab)! - fix(stateDiagram): `end note` now only closes a note when used on a new line - [#7737](mermaid-js/mermaid#7737) [`faafb5d`](mermaid-js/mermaid@faafb5d) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix(gantt): add iteration limit for `excludes` field - [#7737](mermaid-js/mermaid#7737) [`65f8be2`](mermaid-js/mermaid@65f8be2) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: disallow some CSS at-rules in custom CSS - [#7726](mermaid-js/mermaid#7726) [`1502f32`](mermaid-js/mermaid@1502f32) Thanks [@aloisklink](https://github.com/aloisklink)! - fix(wardley): fix unnecessary sanitization of text - [#7578](mermaid-js/mermaid#7578) [`1f98db8`](mermaid-js/mermaid@1f98db8) Thanks [@Gaston202](https://github.com/Gaston202)! - fix(class): self-referential class multiplicity labels no longer rendered multiple times Fixes #7560. Resolves an issue where cardinality labels on self-referential class relationships were rendered three times due to edge splitting in the dagre layout. The fix ensures that each sub-edge only carries its relevant label positions. - [#7592](mermaid-js/mermaid#7592) [`2343e38`](mermaid-js/mermaid@2343e38) Thanks [@knsv-bot](https://github.com/knsv-bot)! - fix(sequence): add background box behind alt/else section title labels in sequence diagrams - [#7589](mermaid-js/mermaid#7589) [`7fb9509`](mermaid-js/mermaid@7fb9509) Thanks [@NYCU-Chung](https://github.com/NYCU-Chung)! - fix(block): prevent column widths from shrinking when mixing different column spans - [#7632](mermaid-js/mermaid#7632) [`3f9e0f1`](mermaid-js/mermaid@3f9e0f1) Thanks [@ekiauhce](https://github.com/ekiauhce)! - fix(sequence): correct messageAlign label position for right-to-left arrows in sequence diagrams - [#7642](mermaid-js/mermaid#7642) [`7a8fb85`](mermaid-js/mermaid@7a8fb85) Thanks [@tractorjuice](https://github.com/tractorjuice)! - fix(wardley): allow hyphens in unquoted component names Multi-word names containing hyphens — e.g. `real-time processing`, `end-user`, `on-call engineer` — now parse without quoting, bringing the grammar in line with the OnlineWardleyMaps (OWM) convention. `A->B` (no-space arrow) still tokenises correctly. - [#7523](mermaid-js/mermaid#7523) [`5144ed4`](mermaid-js/mermaid@5144ed4) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Arrow blocks in block-beta diagrams not spanning the specified number of columns when using `:n` syntax. - [#7262](mermaid-js/mermaid#7262) [`13d9bfa`](mermaid-js/mermaid@13d9bfa) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix(block): Ensure block diagram hexagon blocks respect column spanning syntax - [#7684](mermaid-js/mermaid#7684) [`e14bb88`](mermaid-js/mermaid@e14bb88) Thanks [@aloisklink](https://github.com/aloisklink)! - fix: loosen `uuid` dependency range to allow v14 Mermaid does not use any of the vulnerable code in CVE-2026-41907, but this allows users to silence any `npm audit` alerts on it. - [#7633](mermaid-js/mermaid#7633) [`9217c0d`](mermaid-js/mermaid@9217c0d) Thanks [@Felix-Garci](https://github.com/Felix-Garci)! - fix(block): add support for all arrow types in block diagrams - [#7587](mermaid-js/mermaid#7587) [`5e7eb62`](mermaid-js/mermaid@5e7eb62) Thanks [@MaddyGuthridge](https://github.com/MaddyGuthridge)! - chore: drop lodash-es in favour of es-toolkit - [#7693](mermaid-js/mermaid#7693) [`afaf306`](mermaid-js/mermaid@afaf306) Thanks [@dull-bird](https://github.com/dull-bird)! - fix(quadrant-chart): allow CJK, emoji, Latin-1 accented characters, and other non-ASCII text in unquoted axis/quadrant/point labels. Previously the lexer only matched ASCII `[A-Za-z]+` for text tokens, even though the grammar referenced `UNICODE_TEXT`. Bare Chinese, Japanese, Korean, emoji, and accented Latin characters in labels caused a parse error. Added a `[^\x00-\x7F]+` lexer rule to emit `UNICODE_TEXT` and included it in the `alphaNumToken` grammar rule. Fixes #7120. - [#7737](mermaid-js/mermaid#7737) [`4755553`](mermaid-js/mermaid@4755553) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: improve D3 types for mermaidAPI funcs - [#7737](mermaid-js/mermaid#7737) [`6476973`](mermaid-js/mermaid@6476973) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: handle `&` when namespacing CSS rules - [#7520](mermaid-js/mermaid#7520) [`8c1a0c1`](mermaid-js/mermaid@8c1a0c1) Thanks [@RodrigojndSantos](https://github.com/RodrigojndSantos)! - fix(stateDiagram): comments starting with one `%` are no longer treated as comments Switch to using two `%%` if you want to write a comment. - Updated dependencies \[[`7a8fb85`](mermaid-js/mermaid@7a8fb85), [`675a64c`](mermaid-js/mermaid@675a64c)]: - @mermaid-js/parser@1.1.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: give me a 98K <240642031+inhuman-0@users.noreply.github.com>

PR mermaid-js/mermaid#7642 widened the wardley-beta NAME_WITH_SPACES terminal to accept hyphens inside words (except before `>`, preserving arrow tokenisation). Now that GitHub ships 11.15.0, drop the conservative hyphen quoting: - tools/convert.mjs — relax NEEDS_QUOTING and SAFE_NAME to mirror the new grammar. - 43 .mmd files regenerated; 103 names lose their wrapping quotes. Remaining quoted-with-hyphen names are all correctly retained (reserved-prefix collisions like Build-*/Market-*, " - " word breaks, and quoted note/annotation text). - README — floor bumped from 11.14.0+ to 11.15.0+; conservative-quoting caveat replaced with what the converter actually does now. Adds a direct citation to PR #7726 (text sanitization), which is rendering-only and needed no converter change. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

github-actions Bot added the Type: Bug / Error Something isn't working or is incorrect label Apr 21, 2026

Merge branch 'develop' into fix/wardley-hyphenated-names

fd34efe

knsv-bot reviewed Apr 22, 2026

View reviewed changes

alialobidm approved these changes Apr 22, 2026

View reviewed changes

ashishjain0512 merged commit 0c7df29 into mermaid-js:develop Apr 28, 2026
24 checks passed

github-actions Bot mentioned this pull request May 11, 2026

Version Packages #7738

Merged

This was referenced May 12, 2026

chore: sync Mermaid runtime to 11.15.0 zhongmiao-org/mermaid-markdown-bridge#30

Closed

chore: sync Mermaid runtime to 11.15.0 zhongmiao-org/mermaid-markdown-bridge#33

Closed

ark-65 mentioned this pull request May 12, 2026

chore: sync Mermaid runtime to 11.15.0 zhongmiao-org/mermaid-markdown-bridge#36

Merged

aloisklink mentioned this pull request May 15, 2026

Fix wardley.md map examples in docs #7749

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

fix(wardley): allow hyphens in unquoted component names#7642

fix(wardley): allow hyphens in unquoted component names#7642
ashishjain0512 merged 3 commits into
mermaid-js:developfrom
tractorjuice:fix/wardley-hyphenated-names

tractorjuice commented Apr 21, 2026

Uh oh!

changeset-bot Bot commented Apr 21, 2026 •

edited

Loading

Uh oh!

netlify Bot commented Apr 21, 2026 •

edited

Loading

Uh oh!

pkg-pr-new Bot commented Apr 21, 2026 •

edited

Loading

Uh oh!

codecov Bot commented Apr 21, 2026 •

edited

Loading

Uh oh!

argos-ci Bot commented Apr 21, 2026 •

edited

Loading

Uh oh!

knsv-bot left a comment

Uh oh!

tractorjuice commented Apr 25, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Uh oh!

Uh oh!

Conversation

tractorjuice commented Apr 21, 2026

Summary

The change

Test plan

Uh oh!

changeset-bot Bot commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

netlify Bot commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for mermaid-js ready!

Uh oh!

pkg-pr-new Bot commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

codecov Bot commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

argos-ci Bot commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

knsv-bot left a comment

Choose a reason for hiding this comment

What's working well

Things to consider

Security

Summary

Uh oh!

tractorjuice commented Apr 25, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

changeset-bot Bot commented Apr 21, 2026 •

edited

Loading

netlify Bot commented Apr 21, 2026 •

edited

Loading

pkg-pr-new Bot commented Apr 21, 2026 •

edited

Loading

codecov Bot commented Apr 21, 2026 •

edited

Loading

argos-ci Bot commented Apr 21, 2026 •

edited

Loading