# Mermaid 11.17.0

- Product: Mermaid (https://whatsnew.fyi/product/mermaid)
- Vendor: Mermaid
- Date: 2026-08-19
- Version: 11.17.0
- Original notes: https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.17.0
- Permalink: https://whatsnew.fyi/product/mermaid/releases/11.17.0

What's New is an index, not a publisher: every entry below links to the vendor's own release notes, which are the authoritative source. Entries are labelled where they are hand-curated sample data, pre-releases, or drawn from a secondary source such as a developer blog.

Reuse: the summaries, labels and curation here are © What's New. Quote freely with attribution and a link back; wholesale republication of the corpus is not permitted — terms: https://whatsnew.fyi/terms. The vendors' own release notes remain their publishers'.

---

- **added** — Render C4 elements through the unified shape system, using the new person shape
- **changed** — Route classDiagram to the unified (v2) renderer by default
- **added** — Add collapsible flowchart subgraphs via subgraphId@{ view: collapsed }
- **added** — Add elk.keepEntryNodeOnTop config option to keep a recursive flow's entry node on top
- **added** — Add elk.nodePlacementAlignment config option
- **added** — Add subgraph support to ER diagrams
- **added** — Add folder, bucket, console (terminal window) and browser shapes to flowcharts
- **added** — Add person shape (circular head above a rounded body) to flowcharts, usable via A@{ shape: person }
- **added** — Add legends for named line and bar series in xyChart
- **fixed** — Fix C4 named attributes such as $tags, $link and $sprite being clobbered to undefined when they arrive in an earlier positional slot
- **fixed** — Stop dagre layout from spamming warn-level logs on every node/edge/cluster
- **fixed** — Fix sibling blocks overlapping in block diagrams when one has a label wider than 200px
- **fixed** — Fix RangeError: Invalid array length crash when rendering certain edges
- **fixed** — Fix treeView icons disappearing after strict security sanitization
- **fixed** — Allow classdefs to update text color in block diagrams
- **fixed** — Let a diagram's own nodeSpacing/rankSpacing take effect in the unified dagre layout
- **fixed** — Revert behavior change from #7672 that broke arrows between subgraphs in flowcharts
- **changed** — Use fastdom to batch DOM measurements for up to 25% speedup

###### Minor Changes

-   [#7842](https://github.com/mermaid-js/mermaid/pull/7842) [`3670b4e`](https://github.com/mermaid-js/mermaid/commit/3670b4e2d99b27945240dd3fe71da9175fddcaec) Thanks [@filipsajdak](https://github.com/filipsajdak)! - feat(c4): render C4 elements through the unified shape system, using the new person shape

-   [#7812](https://github.com/mermaid-js/mermaid/pull/7812) [`cdfc0ea`](https://github.com/mermaid-js/mermaid/commit/cdfc0ea65f47bc8f9605a2a646ed87c25a692216) Thanks [@knsv-bot](https://github.com/knsv-bot)! - feat(class): route `classDiagram` to the unified (v2) renderer by default

    Set `class: { defaultRenderer: 'dagre-d3' }` in the config to restore the legacy renderer.

-   [#7785](https://github.com/mermaid-js/mermaid/pull/7785) [`c45cde9`](https://github.com/mermaid-js/mermaid/commit/c45cde9582ede4add658f62b771ba2a7efadde83) Thanks [@knsv-bot](https://github.com/knsv-bot)! - feat(flowchart): add collapsible flowchart subgraphs via `subgraphId@{ view: collapsed }`

-   [#7828](https://github.com/mermaid-js/mermaid/pull/7828) [`8eb3afc`](https://github.com/mermaid-js/mermaid/commit/8eb3afc08c64e0f5d2b2447daac417250a202c13) Thanks [@knsv-bot](https://github.com/knsv-bot)! - feat(elk): add `elk.keepEntryNodeOnTop` config option to keep a recursive flow's entry node on top

-   [#7803](https://github.com/mermaid-js/mermaid/pull/7803) [`74e44eb`](https://github.com/mermaid-js/mermaid/commit/74e44ebf86d293cee1f2314c8b8a163284ea3911) Thanks [@knsv-bot](https://github.com/knsv-bot)! - feat(elk): add `elk.nodePlacementAlignment` config option

-   [#7792](https://github.com/mermaid-js/mermaid/pull/7792) [`ea55b31`](https://github.com/mermaid-js/mermaid/commit/ea55b31bcfb36cfdfbc31a531058ee8c4ee53a4f) Thanks [@RodrigojndSantos](https://github.com/RodrigojndSantos)! - feat(er): add subgraph support to ER diagrams.

-   [#7970](https://github.com/mermaid-js/mermaid/pull/7970) [`a2c0fb6`](https://github.com/mermaid-js/mermaid/commit/a2c0fb6cdf8073b8feb10595ea3cccff0237049b) Thanks [@filipsajdak](https://github.com/filipsajdak)! - feat(flowchart): add `folder`, `bucket`, `console` (terminal window) and `browser` shapes

-   [#7842](https://github.com/mermaid-js/mermaid/pull/7842) [`ae3e115`](https://github.com/mermaid-js/mermaid/commit/ae3e1157c166fab7520d9ee2ed67b16613f6c243) Thanks [@filipsajdak](https://github.com/filipsajdak)! - feat(flowchart): add `person` shape (circular head above a rounded body), usable in flowcharts via `A@{ shape: person }`

-   [#7724](https://github.com/mermaid-js/mermaid/pull/7724) [`0fd7a9f`](https://github.com/mermaid-js/mermaid/commit/0fd7a9fe0d10a1ac39359bc5cb5341b5010a624e) Thanks [@xdumaine](https://github.com/xdumaine)! - feat(xyChart): add legends for named line and bar series

###### Patch Changes

-   [#7847](https://github.com/mermaid-js/mermaid/pull/7847) [`215fe89`](https://github.com/mermaid-js/mermaid/commit/215fe89d3ecfb47cf0836cb52bf272b14fc99f29) Thanks [@filipsajdak](https://github.com/filipsajdak)! - fix(c4): named attributes such as `$tags`, `$link` and `$sprite` are no longer clobbered to undefined when they arrive in an earlier positional slot of Person/System/Container/Component/Boundary/Rel statements.

-   [#7871](https://github.com/mermaid-js/mermaid/pull/7871) [`8d874c4`](https://github.com/mermaid-js/mermaid/commit/8d874c49fa1699cf22e99d4936b16f16dde1fc7f) Thanks [@knsv-bot](https://github.com/knsv-bot)! - fix(flowchart): stop dagre layout from spamming `warn`-level logs on every node/edge/cluster

-   [#8071](https://github.com/mermaid-js/mermaid/pull/8071) [`b3d1f63`](https://github.com/mermaid-js/mermaid/commit/b3d1f6316717faf099cbe21c9fb9f41c2e0bc069) Thanks [@pbrolin47](https://github.com/pbrolin47)! - fix(block): sibling blocks overlapping in block diagrams when one has a label wider than 200px

-   [#7870](https://github.com/mermaid-js/mermaid/pull/7870) [`71b8843`](https://github.com/mermaid-js/mermaid/commit/71b8843fb5ae25d7b884f5cc7ba856d

_[Truncated at 4000 characters — full notes: https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.17.0]_