From bba5e5938e0c09f80214b8feafd9b3a302d10d27 Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Wed, 22 Oct 2025 17:06:21 +0530 Subject: [PATCH 1/5] fix: mindmap rendering issue when level nodes exceed 11 on-behalf-of: @Mermaid-Chart --- .../mindmap/mindmapDb.getData.test.ts | 32 +++++++++++++++++++ .../mermaid/src/diagrams/mindmap/mindmapDb.ts | 2 +- 2 files changed, 33 insertions(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/mindmap/mindmapDb.getData.test.ts b/packages/mermaid/src/diagrams/mindmap/mindmapDb.getData.test.ts index 7c10c0104..a72122143 100644 --- a/packages/mermaid/src/diagrams/mindmap/mindmapDb.getData.test.ts +++ b/packages/mermaid/src/diagrams/mindmap/mindmapDb.getData.test.ts @@ -293,5 +293,37 @@ describe('MindmapDb getData function', () => { expect(edgeA1_aaa.section).toBe(1); expect(edgeA_a2.section).toBe(2); }); + + it('should wrap section numbers when there are more than 11 level 2 nodes', () => { + db.addNode(0, 'root', 'Example', 0); + + for (let i = 1; i <= 15; i++) { + db.addNode(1, `child${i}`, `${i}`, 0); + } + + const result = db.getData(); + + expect(result.nodes).toHaveLength(16); + + const child1 = result.nodes.find((n) => n.label === '1') as MindmapLayoutNode; + const child11 = result.nodes.find((n) => n.label === '11') as MindmapLayoutNode; + const child12 = result.nodes.find((n) => n.label === '12') as MindmapLayoutNode; + const child13 = result.nodes.find((n) => n.label === '13') as MindmapLayoutNode; + const child14 = result.nodes.find((n) => n.label === '14') as MindmapLayoutNode; + const child15 = result.nodes.find((n) => n.label === '15') as MindmapLayoutNode; + + expect(child1.section).toBe(0); + expect(child11.section).toBe(10); + + expect(child12.section).toBe(0); + expect(child13.section).toBe(1); + expect(child14.section).toBe(2); + expect(child15.section).toBe(3); + + expect(child12.cssClasses).toBe('mindmap-node section-0'); + expect(child13.cssClasses).toBe('mindmap-node section-1'); + expect(child14.cssClasses).toBe('mindmap-node section-2'); + expect(child15.cssClasses).toBe('mindmap-node section-3'); + }); }); }); diff --git a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts index a86c3fdc5..e6302d151 100644 --- a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts +++ b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts @@ -203,7 +203,7 @@ export class MindmapDB { // For other nodes, inherit parent's section number if (node.children) { for (const [index, child] of node.children.entries()) { - const childSectionNumber = node.level === 0 ? index : sectionNumber; + const childSectionNumber = node.level === 0 ? index % 11 : sectionNumber; this.assignSections(child, childSectionNumber); } } From b136acdc670dee2e4825d5d93e825c0ed0551beb Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Wed, 22 Oct 2025 17:53:48 +0530 Subject: [PATCH 2/5] chore:add changeset on-behalf-of: @Mermaid-Chart --- .changeset/wide-lines-trade.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/wide-lines-trade.md diff --git a/.changeset/wide-lines-trade.md b/.changeset/wide-lines-trade.md new file mode 100644 index 000000000..1df76a81f --- /dev/null +++ b/.changeset/wide-lines-trade.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +fix: Mindmap rendering issue when the number of Level 2 nodes exceeds 11 From 74318f9337462ffc82915299c6a99d368a10fa67 Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Wed, 5 Nov 2025 14:28:59 +0530 Subject: [PATCH 3/5] chore: use MAX_SECTIONS constant instead of hardcoded value on-behalf-of: @Mermaid-Chart --- packages/mermaid/src/diagrams/mindmap/mindmapDb.ts | 3 ++- packages/mermaid/src/diagrams/mindmap/svgDraw.ts | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts index e6302d151..71df343b6 100644 --- a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts +++ b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts @@ -7,6 +7,7 @@ import type { MindmapNode } from './mindmapTypes.js'; import defaultConfig from '../../defaultConfig.js'; import type { LayoutData, Node, Edge } from '../../rendering-util/types.js'; import { getUserDefinedConfig } from '../../config.js'; +import { MAX_SECTIONS } from './svgDraw.js'; // Extend Node type for mindmap-specific properties export type MindmapLayoutNode = Node & { @@ -203,7 +204,7 @@ export class MindmapDB { // For other nodes, inherit parent's section number if (node.children) { for (const [index, child] of node.children.entries()) { - const childSectionNumber = node.level === 0 ? index % 11 : sectionNumber; + const childSectionNumber = node.level === 0 ? (index % MAX_SECTIONS) - 1 : sectionNumber; this.assignSections(child, childSectionNumber); } } diff --git a/packages/mermaid/src/diagrams/mindmap/svgDraw.ts b/packages/mermaid/src/diagrams/mindmap/svgDraw.ts index 8aee82e30..bf8ee81b3 100644 --- a/packages/mermaid/src/diagrams/mindmap/svgDraw.ts +++ b/packages/mermaid/src/diagrams/mindmap/svgDraw.ts @@ -5,7 +5,7 @@ import { parseFontSize } from '../../utils.js'; import type { MermaidConfig } from '../../config.type.js'; import type { MindmapDB } from './mindmapDb.js'; -const MAX_SECTIONS = 12; +export const MAX_SECTIONS = 12; type ShapeFunction = ( db: MindmapDB, From 61f74ffc5e08c399e49d820a675f7ca8bd5f7f11 Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Wed, 5 Nov 2025 14:54:51 +0530 Subject: [PATCH 4/5] fix: incorrect section number logic by using index % (MAX_SECTIONS - 1) on-behalf-of: @Mermaid-Chart --- packages/mermaid/src/diagrams/mindmap/mindmapDb.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts index 71df343b6..07f945d61 100644 --- a/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts +++ b/packages/mermaid/src/diagrams/mindmap/mindmapDb.ts @@ -204,7 +204,7 @@ export class MindmapDB { // For other nodes, inherit parent's section number if (node.children) { for (const [index, child] of node.children.entries()) { - const childSectionNumber = node.level === 0 ? (index % MAX_SECTIONS) - 1 : sectionNumber; + const childSectionNumber = node.level === 0 ? index % (MAX_SECTIONS - 1) : sectionNumber; this.assignSections(child, childSectionNumber); } } From 03e858981831ccb54ef51011dba7a0ee82b31f9e Mon Sep 17 00:00:00 2001 From: darshanr0107 Date: Fri, 14 Nov 2025 11:14:21 +0530 Subject: [PATCH 5/5] chore: add visual test on-behalf-of: @Mermaid-Chart --- cypress/integration/rendering/mindmap.spec.ts | 26 +++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/cypress/integration/rendering/mindmap.spec.ts b/cypress/integration/rendering/mindmap.spec.ts index e0409ed46..98ca8a6c9 100644 --- a/cypress/integration/rendering/mindmap.spec.ts +++ b/cypress/integration/rendering/mindmap.spec.ts @@ -247,5 +247,31 @@ root ); }); }); + describe('Level 2 nodes exceeding 11', () => { + it('should render all Level 2 nodes correctly when there are more than 11', () => { + imgSnapshotTest( + `mindmap +root + Node1 + Node2 + Node3 + Node4 + Node5 + Node6 + Node7 + Node8 + Node9 + Node10 + Node11 + Node12 + Node13 + Node14 + Node15`, + {}, + undefined, + shouldHaveRoot + ); + }); + }); /* The end */ });