From c0b14021b73f1e62971a40457b161b17555273fd Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 3 Apr 2025 11:15:45 +0530
Subject: [PATCH 01/45] feat: Add support for examples in diagram definition

---
 .../mermaid/src/diagram-api/detectType.ts     | 31 ++++++++-----------
 .../mermaid/src/diagram-api/diagramAPI.ts     |  4 +--
 .../mermaid/src/diagram-api/loadDiagram.ts    | 31 ++++++++++---------
 packages/mermaid/src/diagram-api/types.ts     | 15 +++++----
 packages/mermaid/src/diagram.spec.ts          | 22 ++++++-------
 packages/mermaid/src/mermaid.ts               | 20 +++++++++++-
 6 files changed, 70 insertions(+), 53 deletions(-)

diff --git a/packages/mermaid/src/diagram-api/detectType.ts b/packages/mermaid/src/diagram-api/detectType.ts
index aed8ca964..78cd12ab7 100644
--- a/packages/mermaid/src/diagram-api/detectType.ts
+++ b/packages/mermaid/src/diagram-api/detectType.ts
@@ -1,15 +1,10 @@
 import type { MermaidConfig } from '../config.type.js';
-import { log } from '../logger.js';
-import type {
-  DetectorRecord,
-  DiagramDetector,
-  DiagramLoader,
-  ExternalDiagramDefinition,
-} from './types.js';
-import { anyCommentRegex, directiveRegex, frontMatterRegex } from './regexes.js';
 import { UnknownDiagramError } from '../errors.js';
+import { log } from '../logger.js';
+import { anyCommentRegex, directiveRegex, frontMatterRegex } from './regexes.js';
+import type { DetectorRecord, ExternalDiagramDefinition } from './types.js';
 
-export const detectors: Record<string, DetectorRecord> = {};
+export const diagramDefinitions: Record<string, Omit<DetectorRecord, 'id'>> = {};
 
 /**
  * Detects the type of the graph text.
@@ -38,7 +33,7 @@ export const detectType = function (text: string, config?: MermaidConfig): strin
     .replace(frontMatterRegex, '')
     .replace(directiveRegex, '')
     .replace(anyCommentRegex, '\n');
-  for (const [key, { detector }] of Object.entries(detectors)) {
+  for (const [key, { detector }] of Object.entries(diagramDefinitions)) {
     const diagram = detector(text, config);
     if (diagram) {
       return key;
@@ -64,19 +59,19 @@ export const detectType = function (text: string, config?: MermaidConfig): strin
  * @param diagrams - Diagrams to lazy load, and their detectors, in order of importance.
  */
 export const registerLazyLoadedDiagrams = (...diagrams: ExternalDiagramDefinition[]) => {
-  for (const { id, detector, loader } of diagrams) {
-    addDetector(id, detector, loader);
+  for (const definition of diagrams) {
+    addDiagramDefinition(definition);
   }
 };
 
-export const addDetector = (key: string, detector: DiagramDetector, loader?: DiagramLoader) => {
-  if (detectors[key]) {
-    log.warn(`Detector with key ${key} already exists. Overwriting.`);
+export const addDiagramDefinition = ({ id, ...definition }: DetectorRecord) => {
+  if (diagramDefinitions[id]) {
+    log.warn(`Detector with key ${id} already exists. Overwriting.`);
   }
-  detectors[key] = { detector, loader };
-  log.debug(`Detector with key ${key} added${loader ? ' with loader' : ''}`);
+  diagramDefinitions[id] = definition;
+  log.debug(`Detector with key ${id} added${definition.loader ? ' with loader' : ''}`);
 };
 
 export const getDiagramLoader = (key: string) => {
-  return detectors[key].loader;
+  return diagramDefinitions[key].loader;
 };
diff --git a/packages/mermaid/src/diagram-api/diagramAPI.ts b/packages/mermaid/src/diagram-api/diagramAPI.ts
index df4514adf..29a726ae9 100644
--- a/packages/mermaid/src/diagram-api/diagramAPI.ts
+++ b/packages/mermaid/src/diagram-api/diagramAPI.ts
@@ -1,4 +1,4 @@
-import { addDetector } from './detectType.js';
+import { addDiagramDefinition } from './detectType.js';
 import { log as _log, setLogLevel as _setLogLevel } from '../logger.js';
 import {
   getConfig as _getConfig,
@@ -51,7 +51,7 @@ export const registerDiagram = (
   }
   diagrams[id] = diagram;
   if (detector) {
-    addDetector(id, detector);
+    addDiagramDefinition({ id, detector });
   }
   addStylesForDiagram(id, diagram.styles);
 
diff --git a/packages/mermaid/src/diagram-api/loadDiagram.ts b/packages/mermaid/src/diagram-api/loadDiagram.ts
index 1ec01ec06..2c570d10e 100644
--- a/packages/mermaid/src/diagram-api/loadDiagram.ts
+++ b/packages/mermaid/src/diagram-api/loadDiagram.ts
@@ -1,26 +1,27 @@
 import { log } from '../logger.js';
-import { detectors } from './detectType.js';
+import { diagramDefinitions } from './detectType.js';
 import { getDiagram, registerDiagram } from './diagramAPI.js';
 
 export const loadRegisteredDiagrams = async () => {
   log.debug(`Loading registered diagrams`);
   // Load all lazy loaded diagrams in parallel
   const results = await Promise.allSettled(
-    Object.entries(detectors).map(async ([key, { detector, loader }]) => {
-      if (loader) {
+    Object.entries(diagramDefinitions).map(async ([key, { detector, loader }]) => {
+      if (!loader) {
+        return;
+      }
+      try {
+        getDiagram(key);
+      } catch {
         try {
-          getDiagram(key);
-        } catch {
-          try {
-            // Register diagram if it is not already registered
-            const { diagram, id } = await loader();
-            registerDiagram(id, diagram, detector);
-          } catch (err) {
-            // Remove failed diagram from detectors
-            log.error(`Failed to load external diagram with key ${key}. Removing from detectors.`);
-            delete detectors[key];
-            throw err;
-          }
+          // Register diagram if it is not already registered
+          const { diagram, id } = await loader();
+          registerDiagram(id, diagram, detector);
+        } catch (err) {
+          // Remove failed diagram from detectors
+          log.error(`Failed to load external diagram with key ${key}. Removing from detectors.`);
+          delete diagramDefinitions[key];
+          throw err;
         }
       }
     })
diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts
index fdb175e52..ed1d0677c 100644
--- a/packages/mermaid/src/diagram-api/types.ts
+++ b/packages/mermaid/src/diagram-api/types.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import type * as d3 from 'd3';
-import type { SetRequired } from 'type-fest';
+import type { SetOptional, SetRequired } from 'type-fest';
 import type { Diagram } from '../Diagram.js';
 import type { BaseDiagramConfig, MermaidConfig } from '../config.type.js';
 
@@ -91,17 +91,20 @@ export interface DiagramDefinition {
   ) => void;
 }
 
-export interface DetectorRecord {
-  detector: DiagramDetector;
-  loader?: DiagramLoader;
-}
-
 export interface ExternalDiagramDefinition {
   id: string;
+  /**
+   * Title, description, and examples for the diagram are optional only for backwards compatibility.
+   * It is strongly recommended to provide these values for all new diagrams.
+   */
+  title?: string;
+  description?: string;
+  examples?: { code: string; title?: string; isDefault?: boolean }[];
   detector: DiagramDetector;
   loader: DiagramLoader;
 }
 
+export type DetectorRecord = SetOptional<ExternalDiagramDefinition, 'loader'>;
 export type DiagramDetector = (text: string, config?: MermaidConfig) => boolean;
 export type DiagramLoader = () => Promise<{ id: string; diagram: DiagramDefinition }>;
 
diff --git a/packages/mermaid/src/diagram.spec.ts b/packages/mermaid/src/diagram.spec.ts
index 873fada14..e25963614 100644
--- a/packages/mermaid/src/diagram.spec.ts
+++ b/packages/mermaid/src/diagram.spec.ts
@@ -1,6 +1,6 @@
 import { describe, test, expect } from 'vitest';
 import { Diagram } from './Diagram.js';
-import { addDetector } from './diagram-api/detectType.js';
+import { addDiagramDefinition } from './diagram-api/detectType.js';
 import { addDiagrams } from './diagram-api/diagram-orchestration.js';
 import type { DiagramLoader } from './diagram-api/types.js';
 
@@ -41,11 +41,11 @@ describe('diagram detection', () => {
   });
 
   test('should detect external diagrams', async () => {
-    addDetector(
-      'loki',
-      (str) => str.startsWith('loki'),
-      () => Promise.resolve(getDummyDiagram('loki'))
-    );
+    addDiagramDefinition({
+      id: 'loki',
+      detector: (str) => str.startsWith('loki'),
+      loader: () => Promise.resolve(getDummyDiagram('loki')),
+    });
     const diagram = await Diagram.fromText('loki TD; A-->B');
     expect(diagram).toBeInstanceOf(Diagram);
     expect(diagram.type).toBe('loki');
@@ -53,11 +53,11 @@ describe('diagram detection', () => {
 
   test('should allow external diagrams to override internal ones with same ID', async () => {
     const title = 'overridden';
-    addDetector(
-      'flowchart-elk',
-      (str) => str.startsWith('flowchart-elk'),
-      () => Promise.resolve(getDummyDiagram('flowchart-elk', title))
-    );
+    addDiagramDefinition({
+      id: 'flowchart-elk',
+      detector: (str) => str.startsWith('flowchart-elk'),
+      loader: () => Promise.resolve(getDummyDiagram('flowchart-elk', title)),
+    });
     const diagram = await Diagram.fromText('flowchart-elk TD; A-->B');
     expect(diagram).toBeInstanceOf(Diagram);
     expect(diagram.db.getDiagramTitle?.()).toBe(title);
diff --git a/packages/mermaid/src/mermaid.ts b/packages/mermaid/src/mermaid.ts
index e9fc9196a..c4bf74577 100644
--- a/packages/mermaid/src/mermaid.ts
+++ b/packages/mermaid/src/mermaid.ts
@@ -5,7 +5,11 @@
 import { registerIconPacks } from './rendering-util/icons.js';
 import { dedent } from 'ts-dedent';
 import type { MermaidConfig } from './config.type.js';
-import { detectType, registerLazyLoadedDiagrams } from './diagram-api/detectType.js';
+import {
+  detectType,
+  diagramDefinitions,
+  registerLazyLoadedDiagrams,
+} from './diagram-api/detectType.js';
 import { addDiagrams } from './diagram-api/diagram-orchestration.js';
 import { loadRegisteredDiagrams } from './diagram-api/loadDiagram.js';
 import type { ExternalDiagramDefinition, SVG, SVGGroup } from './diagram-api/types.js';
@@ -415,6 +419,18 @@ const render: typeof mermaidAPI.render = (id, text, container) => {
   });
 };
 
+const getDiagramData = (): Pick<
+  ExternalDiagramDefinition,
+  'id' | 'title' | 'description' | 'examples'
+>[] => {
+  return Object.entries(diagramDefinitions).map(([id, { title, description, examples }]) => ({
+    id,
+    title,
+    description,
+    examples,
+  }));
+};
+
 export interface Mermaid {
   startOnLoad: boolean;
   parseError?: ParseErrorFunction;
@@ -437,6 +453,7 @@ export interface Mermaid {
   setParseErrorHandler: typeof setParseErrorHandler;
   detectType: typeof detectType;
   registerIconPacks: typeof registerIconPacks;
+  getDiagramData: typeof getDiagramData;
 }
 
 const mermaid: Mermaid = {
@@ -454,6 +471,7 @@ const mermaid: Mermaid = {
   setParseErrorHandler,
   detectType,
   registerIconPacks,
+  getDiagramData,
 };
 
 export default mermaid;

From 865c4535471fc366652a8732e14a71defed0beea Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 3 Apr 2025 16:16:44 +0530
Subject: [PATCH 02/45] feat: Add title and examples for diagrams

---
 cypress/platform/sidv.html                    |  1 +
 .../architecture/architectureDetector.ts      | 18 ++++
 .../src/diagrams/block/blockDetector.ts       | 21 +++++
 .../mermaid/src/diagrams/c4/c4Detector.ts     | 41 ++++++++++
 .../src/diagrams/class/classDetector-V2.ts    | 28 +++++++
 .../mermaid/src/diagrams/er/erDetector.ts     | 30 +++++++
 .../src/diagrams/flowchart/flowDetector-v2.ts | 13 +++
 .../src/diagrams/gantt/ganttDetector.ts       | 16 ++++
 .../src/diagrams/git/gitGraphDetector.ts      | 22 +++++
 .../mermaid/src/diagrams/kanban/detector.ts   | 30 +++++++
 .../mermaid/src/diagrams/mindmap/detector.ts  | 25 ++++++
 .../mermaid/src/diagrams/packet/detector.ts   | 28 +++++++
 .../mermaid/src/diagrams/pie/pieDetector.ts   | 11 +++
 .../quadrant-chart/quadrantDetector.ts        | 21 +++++
 .../mermaid/src/diagrams/radar/detector.ts    | 18 ++++
 .../requirement/requirementDetector.ts        | 21 +++++
 .../src/diagrams/sankey/sankeyDetector.ts     | 82 +++++++++++++++++++
 .../src/diagrams/sequence/sequenceDetector.ts | 12 +++
 .../src/diagrams/state/stateDetector-V2.ts    | 14 ++++
 .../mermaid/src/diagrams/timeline/detector.ts | 14 ++++
 .../diagrams/user-journey/journeyDetector.ts  | 16 ++++
 .../src/diagrams/xychart/xychartDetector.ts   | 13 +++
 22 files changed, 495 insertions(+)

diff --git a/cypress/platform/sidv.html b/cypress/platform/sidv.html
index b0a1699da..fc505402d 100644
--- a/cypress/platform/sidv.html
+++ b/cypress/platform/sidv.html
@@ -40,6 +40,7 @@ graph TB
       const el = document.getElementById('d2');
       const { svg } = await mermaid.render('d22', value);
       console.log(svg);
+      console.log(mermaid.getDiagramData());
       el.innerHTML = svg;
       // mermaid.test1('first_slow', 1200).then((r) => console.info(r));
       // mermaid.test1('second_fast', 200).then((r) => console.info(r));
diff --git a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
index c15b474ab..4c798c263 100644
--- a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
+++ b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
@@ -19,6 +19,24 @@ const architecture: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Architecture Diagram',
+  description: 'Visualize system architecture and components',
+  examples: [
+    {
+      code: `architecture-beta
+    group api(cloud)[API]
+
+    service db(database)[Database] in api
+    service disk1(disk)[Storage] in api
+    service disk2(disk)[Storage] in api
+    service server(server)[Server] in api
+
+    db:L -- R:server
+    disk1:T -- B:server
+    disk2:T -- B:db`,
+      title: 'Basic System Architecture',
+    },
+  ],
 };
 
 export default architecture;
diff --git a/packages/mermaid/src/diagrams/block/blockDetector.ts b/packages/mermaid/src/diagrams/block/blockDetector.ts
index c4da643f0..95e1cd5ef 100644
--- a/packages/mermaid/src/diagrams/block/blockDetector.ts
+++ b/packages/mermaid/src/diagrams/block/blockDetector.ts
@@ -15,6 +15,27 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Block Diagram',
+  description: 'Create block-based visualizations with beta styling',
+  examples: [
+    {
+      code: `block-beta
+columns 1
+  db(("DB"))
+  blockArrowId6<["&nbsp;&nbsp;&nbsp;"]>(down)
+  block:ID
+    A
+    B["A wide one in the middle"]
+    C
+  end
+  space
+  D
+  ID --> D
+  C --> D
+  style B fill:#969,stroke:#333,stroke-width:4px`,
+      title: 'Basic Block Layout',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts
index b06ab6cb1..f47316481 100644
--- a/packages/mermaid/src/diagrams/c4/c4Detector.ts
+++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts
@@ -19,6 +19,47 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'C4 Diagram',
+  description:
+    'Visualize software architecture using the C4 model (Context, Container, Component, Code)',
+  examples: [
+    {
+      code: `C4Context
+    title System Context diagram for Internet Banking System
+    Enterprise_Boundary(b0, "BankBoundary0") {
+        Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
+        Person(customerB, "Banking Customer B")
+        Person_Ext(customerC, "Banking Customer C", "desc")
+
+        Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
+
+        System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
+
+        Enterprise_Boundary(b1, "BankBoundary") {
+            SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
+
+            System_Boundary(b2, "BankBoundary2") {
+                System(SystemA, "Banking System A")
+                System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts. next line.")
+            }
+
+            System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
+            SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
+
+            Boundary(b3, "BankBoundary3", "boundary") {
+                SystemQueue(SystemF, "Banking System F Queue", "A system of the bank.")
+                SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
+            }
+        }
+    }
+
+    BiRel(customerA, SystemAA, "Uses")
+    BiRel(SystemAA, SystemE, "Uses")
+    Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
+    Rel(SystemC, customerA, "Sends e-mails to")`,
+      title: 'Internet Banking System Context',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/class/classDetector-V2.ts b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
index 1823ad002..fb360d61f 100644
--- a/packages/mermaid/src/diagrams/class/classDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
@@ -24,6 +24,34 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Class Diagram',
+  description: 'Visualize class structures and relationships in object-oriented programming',
+  examples: [
+    {
+      code: `classDiagram
+    Animal <|-- Duck
+    Animal <|-- Fish
+    Animal <|-- Zebra
+    Animal : +int age
+    Animal : +String gender
+    Animal: +isMammal()
+    Animal: +mate()
+    class Duck{
+      +String beakColor
+      +swim()
+      +quack()
+    }
+    class Fish{
+      -int sizeInFeet
+      -canEat()
+    }
+    class Zebra{
+      +bool is_wild
+      +run()
+    }`,
+      title: 'Basic Class Inheritance',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/er/erDetector.ts b/packages/mermaid/src/diagrams/er/erDetector.ts
index 7da6804e0..ea4b0f8c8 100644
--- a/packages/mermaid/src/diagrams/er/erDetector.ts
+++ b/packages/mermaid/src/diagrams/er/erDetector.ts
@@ -19,6 +19,36 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Entity Relationship Diagram',
+  description: 'Visualize database schemas and relationships between entities',
+  examples: [
+    {
+      code: `erDiagram
+    CUSTOMER ||--o{ ORDER : places
+    ORDER ||--|{ ORDER_ITEM : contains
+    PRODUCT ||--o{ ORDER_ITEM : includes
+    CUSTOMER {
+        string id
+        string name
+        string email
+    }
+    ORDER {
+        string id
+        date orderDate
+        string status
+    }
+    PRODUCT {
+        string id
+        string name
+        float price
+    }
+    ORDER_ITEM {
+        int quantity
+        float price
+    }`,
+      title: 'Basic ER Schema',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
index df3f57e47..01e8eb606 100644
--- a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
@@ -31,6 +31,19 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Flowchart',
+  description: 'Visualize flowcharts and directed graphs',
+  examples: [
+    {
+      code: `flowchart TD
+    A[Christmas] -->|Get money| B(Go shopping)
+    B --> C{Let me think}
+    C -->|One| D[Laptop]
+    C -->|Two| E[iPhone]
+    C -->|Three| F[fa:fa-car Car]`,
+      title: 'Basic Flowchart',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
index e2f2a9784..3c75add65 100644
--- a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
+++ b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
@@ -19,6 +19,22 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Gantt Chart',
+  description: 'Visualize project schedules and timelines',
+  examples: [
+    {
+      code: `gantt
+    title A Gantt Diagram
+    dateFormat  YYYY-MM-DD
+    section Section
+    A task           :a1, 2014-01-01, 30d
+    Another task     :after a1  , 20d
+    section Another
+    Task in sec      :2014-01-12  , 12d
+    another task      : 24d`,
+      title: 'Basic Project Timeline',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
index ded434a65..cc2519767 100644
--- a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
@@ -16,6 +16,28 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Git Graph',
+  description: 'Visualize Git repository history and branch relationships',
+  examples: [
+    {
+      code: `gitGraph
+    commit
+    branch develop
+    checkout develop
+    commit
+    commit
+    checkout main
+    merge develop
+    commit
+    branch feature
+    checkout feature
+    commit
+    commit
+    checkout main
+    merge feature`,
+      title: 'Basic Git Flow',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/kanban/detector.ts b/packages/mermaid/src/diagrams/kanban/detector.ts
index 3c07ca4df..b3af12b43 100644
--- a/packages/mermaid/src/diagrams/kanban/detector.ts
+++ b/packages/mermaid/src/diagrams/kanban/detector.ts
@@ -18,6 +18,36 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Kanban Diagram',
+  description: 'Visualize work items in a Kanban board',
+  examples: [
+    {
+      code: `---
+config:
+  kanban:
+    ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
+---
+kanban
+  Todo
+    [Create Documentation]
+    docs[Create Blog about the new diagram]
+  [In progress]
+    id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
+  id9[Ready for deploy]
+    id8[Design grammar]@{ assigned: 'knsv' }
+  id10[Ready for test]
+    id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
+    id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
+  id11[Done]
+    id5[define getData]
+    id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
+    id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
+
+  id12[Can't reproduce]
+    id3[Weird flickering in Firefox]
+`,
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts
index 2b31fc5e8..26ff7c684 100644
--- a/packages/mermaid/src/diagrams/mindmap/detector.ts
+++ b/packages/mermaid/src/diagrams/mindmap/detector.ts
@@ -18,6 +18,31 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Mindmap',
+  description: 'Visualize ideas and concepts in a tree-like structure',
+  examples: [
+    {
+      code: `mindmap
+  root((mindmap))
+    Origins
+      Long history
+      ::icon(fa fa-book)
+      Popularisation
+        British popular psychology author Tony Buzan
+    Research
+      On effectiveness<br/>and features
+      On Automatic creation
+        Uses
+            Creative techniques
+            Strategic planning
+            Argument mapping
+    Tools
+      Pen and paper
+      Mermaid`,
+    },
+  ],
 };
 
 export default plugin;
+
+// cspell:ignore Buzan
diff --git a/packages/mermaid/src/diagrams/packet/detector.ts b/packages/mermaid/src/diagrams/packet/detector.ts
index 5aca92e6c..1f9e8fbc9 100644
--- a/packages/mermaid/src/diagrams/packet/detector.ts
+++ b/packages/mermaid/src/diagrams/packet/detector.ts
@@ -19,4 +19,32 @@ export const packet: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Packet Diagram',
+  description: 'Visualize packet data and network traffic',
+  examples: [
+    {
+      code: `---
+title: "TCP Packet"
+---
+packet-beta
+0-15: "Source Port"
+16-31: "Destination Port"
+32-63: "Sequence Number"
+64-95: "Acknowledgment Number"
+96-99: "Data Offset"
+100-105: "Reserved"
+106: "URG"
+107: "ACK"
+108: "PSH"
+109: "RST"
+110: "SYN"
+111: "FIN"
+112-127: "Window"
+128-143: "Checksum"
+144-159: "Urgent Pointer"
+160-191: "(Options and Padding)"
+192-255: "Data (variable length)"
+`,
+    },
+  ],
 };
diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts
index f5acd1aa0..66067313a 100644
--- a/packages/mermaid/src/diagrams/pie/pieDetector.ts
+++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts
@@ -19,4 +19,15 @@ export const pie: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Pie Chart',
+  description: 'Visualize data as proportional segments of a circle',
+  examples: [
+    {
+      code: `pie title Pets adopted by volunteers
+    "Dogs" : 386
+    "Cats" : 85
+    "Rats" : 15`,
+      title: 'Basic Pie Chart',
+    },
+  ],
 };
diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
index 9a77ca43a..23f9398eb 100644
--- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
+++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
@@ -19,6 +19,27 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Quadrant Chart',
+  description: 'Visualize items in a 2x2 matrix based on two variables',
+  examples: [
+    {
+      code: `quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Low Reach --> High Reach
+    y-axis Low Engagement --> High Engagement
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]`,
+      title: 'Product Positioning',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/radar/detector.ts b/packages/mermaid/src/diagrams/radar/detector.ts
index 9c29d0f00..080b276a2 100644
--- a/packages/mermaid/src/diagrams/radar/detector.ts
+++ b/packages/mermaid/src/diagrams/radar/detector.ts
@@ -19,4 +19,22 @@ export const radar: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Radar Diagram',
+  description: 'Visualize data in a radial format',
+  examples: [
+    {
+      code: `---
+title: "Grades"
+---
+radar-beta
+  axis m["Math"], s["Science"], e["English"]
+  axis h["History"], g["Geography"], a["Art"]
+  curve a["Alice"]{85, 90, 80, 70, 75, 90}
+  curve b["Bob"]{70, 75, 85, 80, 90, 85}
+
+  max 100
+  min 0
+`,
+    },
+  ],
 };
diff --git a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
index f8fd33640..7abf8627e 100644
--- a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
+++ b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
@@ -19,6 +19,27 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Requirement Diagram',
+  description: 'Visualize system requirements and their relationships',
+  examples: [
+    {
+      code: `requirementDiagram
+
+    requirement test_req {
+    id: 1
+    text: the test text.
+    risk: high
+    verifymethod: test
+    }
+
+    element test_entity {
+    type: simulation
+    }
+
+    test_entity - satisfies -> test_req`,
+      title: 'Basic Requirements',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
index 73c4d1428..58f168d88 100644
--- a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
+++ b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
@@ -15,6 +15,88 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Sankey Diagram',
+  description: 'Visualize flow quantities between different stages or processes',
+  examples: [
+    {
+      code: `---
+config:
+  sankey:
+    showValues: false
+---
+sankey-beta
+
+Agricultural 'waste',Bio-conversion,124.729
+Bio-conversion,Liquid,0.597
+Bio-conversion,Losses,26.862
+Bio-conversion,Solid,280.322
+Bio-conversion,Gas,81.144
+Biofuel imports,Liquid,35
+Biomass imports,Solid,35
+Coal imports,Coal,11.606
+Coal reserves,Coal,63.965
+Coal,Solid,75.571
+District heating,Industry,10.639
+District heating,Heating and cooling - commercial,22.505
+District heating,Heating and cooling - homes,46.184
+Electricity grid,Over generation / exports,104.453
+Electricity grid,Heating and cooling - homes,113.726
+Electricity grid,H2 conversion,27.14
+Electricity grid,Industry,342.165
+Electricity grid,Road transport,37.797
+Electricity grid,Agriculture,4.412
+Electricity grid,Heating and cooling - commercial,40.858
+Electricity grid,Losses,56.691
+Electricity grid,Rail transport,7.863
+Electricity grid,Lighting & appliances - commercial,90.008
+Electricity grid,Lighting & appliances - homes,93.494
+Gas imports,NGas,40.719
+Gas reserves,NGas,82.233
+Gas,Heating and cooling - commercial,0.129
+Gas,Losses,1.401
+Gas,Thermal generation,151.891
+Gas,Agriculture,2.096
+Gas,Industry,48.58
+Geothermal,Electricity grid,7.013
+H2 conversion,H2,20.897
+H2 conversion,Losses,6.242
+H2,Road transport,20.897
+Hydro,Electricity grid,6.995
+Liquid,Industry,121.066
+Liquid,International shipping,128.69
+Liquid,Road transport,135.835
+Liquid,Domestic aviation,14.458
+Liquid,International aviation,206.267
+Liquid,Agriculture,3.64
+Liquid,National navigation,33.218
+Liquid,Rail transport,4.413
+Marine algae,Bio-conversion,4.375
+NGas,Gas,122.952
+Nuclear,Thermal generation,839.978
+Oil imports,Oil,504.287
+Oil reserves,Oil,107.703
+Oil,Liquid,611.99
+Other waste,Solid,56.587
+Other waste,Bio-conversion,77.81
+Pumped heat,Heating and cooling - homes,193.026
+Pumped heat,Heating and cooling - commercial,70.672
+Solar PV,Electricity grid,59.901
+Solar Thermal,Heating and cooling - homes,19.263
+Solar,Solar Thermal,19.263
+Solar,Solar PV,59.901
+Solid,Agriculture,0.882
+Solid,Thermal generation,400.12
+Solid,Industry,46.477
+Thermal generation,Electricity grid,525.531
+Thermal generation,Losses,787.129
+Thermal generation,District heating,79.329
+Tidal,Electricity grid,9.452
+UK land based bioenergy,Bio-conversion,182.01
+Wave,Electricity grid,19.013
+Wind,Electricity grid,289.366`,
+      title: 'Energy Flow',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
index c1df22130..6ddd1055b 100644
--- a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
+++ b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
@@ -19,6 +19,18 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Sequence Diagram',
+  description: 'Visualize interactions between objects over time',
+  examples: [
+    {
+      code: `sequenceDiagram
+    Alice->>+John: Hello John, how are you?
+    Alice->>+John: John, can you hear me?
+    John-->>-Alice: Hi Alice, I can hear you!
+    John-->>-Alice: I feel great!`,
+      title: 'Basic Sequence',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
index 5201f3fae..5b86ea2d5 100644
--- a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
@@ -25,6 +25,20 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'State Diagram',
+  description: 'Visualize state transitions and behaviors of a system',
+  examples: [
+    {
+      code: `stateDiagram-v2
+    [*] --> Still
+    Still --> [*]
+    Still --> Moving
+    Moving --> Still
+    Moving --> Crash
+    Crash --> [*]`,
+      title: 'Basic State',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts
index a6394bd54..982487a9e 100644
--- a/packages/mermaid/src/diagrams/timeline/detector.ts
+++ b/packages/mermaid/src/diagrams/timeline/detector.ts
@@ -19,6 +19,20 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'Timeline Diagram',
+  description: 'Visualize events and milestones in chronological order',
+  examples: [
+    {
+      code: `timeline
+    title History of Social Media Platform
+    2002 : LinkedIn
+    2004 : Facebook
+         : Google
+    2005 : YouTube
+    2006 : Twitter`,
+      title: 'Project Timeline',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
index cb1d1837f..5b3ca9c2a 100644
--- a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
+++ b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
@@ -19,6 +19,22 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'User Journey Diagram',
+  description: 'Visualize user interactions and experiences with a system',
+  examples: [
+    {
+      code: `journey
+    title My working day
+    section Go to work
+      Make tea: 5: Me
+      Go upstairs: 3: Me
+      Do work: 1: Me, Cat
+    section Go home
+      Go downstairs: 5: Me
+      Sit down: 5: Me`,
+      title: 'My Working Day',
+    },
+  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
index 08be05b01..f12a76c39 100644
--- a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
+++ b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
@@ -19,6 +19,19 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
+  title: 'XY Chart',
+  description: 'Create scatter plots and line charts with customizable axes',
+  examples: [
+    {
+      code: `xychart-beta
+    title "Sales Revenue"
+    x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+    y-axis "Revenue (in $)" 4000 --> 11000
+    bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+    line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]`,
+      title: 'Sales Revenue',
+    },
+  ],
 };
 
 export default plugin;

From 5b7c1aad9eab01b82e1de7a1657d7859dcc4512f Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Thu, 3 Apr 2025 10:53:10 +0000
Subject: [PATCH 03/45] [autofix.ci] apply automated fixes

---
 .../interfaces/ExternalDiagramDefinition.md   | 47 +++++++++++++++++--
 .../setup/mermaid/interfaces/Mermaid.md       | 42 +++++++++++------
 .../setup/mermaid/interfaces/RunOptions.md    | 10 ++--
 docs/config/setup/mermaid/type-aliases/SVG.md |  2 +-
 .../setup/mermaid/type-aliases/SVGGroup.md    |  2 +-
 .../config/setup/mermaid/variables/default.md |  2 +-
 6 files changed, 78 insertions(+), 27 deletions(-)

diff --git a/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
index 34e475388..ac3e4622b 100644
--- a/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
+++ b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
@@ -10,15 +10,43 @@
 
 # Interface: ExternalDiagramDefinition
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:99](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L99)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:94](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L94)
 
 ## Properties
 
+### description?
+
+> `optional` **description**: `string`
+
+Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
+
+---
+
 ### detector
 
 > **detector**: `DiagramDetector`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L103)
+
+---
+
+### examples?
+
+> `optional` **examples**: `object`\[]
+
+Defined in: [packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)
+
+#### code
+
+> **code**: `string`
+
+#### isDefault?
+
+> `optional` **isDefault**: `boolean`
+
+#### title?
+
+> `optional` **title**: `string`
 
 ---
 
@@ -26,7 +54,7 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/m
 
 > **id**: `string`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:95](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L95)
 
 ---
 
@@ -34,4 +62,15 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/m
 
 > **loader**: `DiagramLoader`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:104](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L104)
+
+---
+
+### title?
+
+> `optional` **title**: `string`
+
+Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
+
+Title, description, and examples for the diagram are optional only for backwards compatibility.
+It is strongly recommended to provide these values for all new diagrams.
diff --git a/docs/config/setup/mermaid/interfaces/Mermaid.md b/docs/config/setup/mermaid/interfaces/Mermaid.md
index 2e5cc3571..572305a28 100644
--- a/docs/config/setup/mermaid/interfaces/Mermaid.md
+++ b/docs/config/setup/mermaid/interfaces/Mermaid.md
@@ -10,7 +10,7 @@
 
 # Interface: Mermaid
 
-Defined in: [packages/mermaid/src/mermaid.ts:418](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L418)
+Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:418](https://github.com/mermaid-js/
 
 > **contentLoaded**: () => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
+Defined in: [packages/mermaid/src/mermaid.ts:452](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L452)
 
 \##contentLoaded Callback function that is called when page is loaded. This functions fetches
 configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the
@@ -34,7 +34,7 @@ page.
 
 > **detectType**: (`text`, `config`?) => `string`
 
-Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
+Defined in: [packages/mermaid/src/mermaid.ts:454](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L454)
 
 Detects the type of the graph text.
 
@@ -86,11 +86,23 @@ A graph definition key
 
 ---
 
+### getDiagramData()
+
+> **getDiagramData**: () => `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"` | `"title"` | `"description"` | `"examples"`>\[]
+
+Defined in: [packages/mermaid/src/mermaid.ts:456](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L456)
+
+#### Returns
+
+`Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"` | `"title"` | `"description"` | `"examples"`>\[]
+
+---
+
 ### ~~init()~~
 
 > **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
+Defined in: [packages/mermaid/src/mermaid.ts:447](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L447)
 
 ## init
 
@@ -138,7 +150,7 @@ Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
 
 > **initialize**: (`config`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435)
+Defined in: [packages/mermaid/src/mermaid.ts:451](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L451)
 
 Used to set configurations for mermaid.
 This function should be called before the run function.
@@ -161,7 +173,7 @@ Configuration object for mermaid.
 
 > **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](MermaidConfig.md); `getConfig`: () => [`MermaidConfig`](MermaidConfig.md); `getDiagramFromText`: (`text`, `metadata`) => `Promise`<`Diagram`>; `getSiteConfig`: () => [`MermaidConfig`](MermaidConfig.md); `globalReset`: () => `void`; `initialize`: (`userOptions`) => `void`; `parse`: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>; `render`: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>; `reset`: () => `void`; `setConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); `updateSiteConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); }>
 
-Defined in: [packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
+Defined in: [packages/mermaid/src/mermaid.ts:441](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L441)
 
 **`Internal`**
 
@@ -175,7 +187,7 @@ Use [parse](Mermaid.md#parse) and [render](Mermaid.md#render) instead. Please [o
 
 > **parse**: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
+Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
 
 Parse the text and validate the syntax.
 
@@ -243,7 +255,7 @@ Error if the diagram is invalid and parseOptions.suppressErrors is false or not
 
 > `optional` **parseError**: [`ParseErrorFunction`](../type-aliases/ParseErrorFunction.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L420)
+Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
 
 ---
 
@@ -251,7 +263,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/
 
 > **registerExternalDiagrams**: (`diagrams`, `opts`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434)
+Defined in: [packages/mermaid/src/mermaid.ts:450](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L450)
 
 Used to register external diagram types.
 
@@ -281,7 +293,7 @@ If opts.lazyLoad is false, the diagrams will be loaded immediately.
 
 > **registerIconPacks**: (`iconLoaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439)
+Defined in: [packages/mermaid/src/mermaid.ts:455](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L455)
 
 #### Parameters
 
@@ -299,7 +311,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/
 
 > **registerLayoutLoaders**: (`loaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433)
+Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)
 
 #### Parameters
 
@@ -317,7 +329,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/
 
 > **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427)
+Defined in: [packages/mermaid/src/mermaid.ts:443](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L443)
 
 #### Parameters
 
@@ -349,7 +361,7 @@ Deprecated for external use.
 
 > **run**: (`options`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432)
+Defined in: [packages/mermaid/src/mermaid.ts:448](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L448)
 
 ## run
 
@@ -393,7 +405,7 @@ Optional runtime configs
 
 > **setParseErrorHandler**: (`parseErrorHandler`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
+Defined in: [packages/mermaid/src/mermaid.ts:453](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L453)
 
 ## setParseErrorHandler Alternative to directly setting parseError using:
 
@@ -424,4 +436,4 @@ New parseError() callback.
 
 > **startOnLoad**: `boolean`
 
-Defined in: [packages/mermaid/src/mermaid.ts:419](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L419)
+Defined in: [packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435)
diff --git a/docs/config/setup/mermaid/interfaces/RunOptions.md b/docs/config/setup/mermaid/interfaces/RunOptions.md
index ecd679aa5..850f8cba9 100644
--- a/docs/config/setup/mermaid/interfaces/RunOptions.md
+++ b/docs/config/setup/mermaid/interfaces/RunOptions.md
@@ -10,7 +10,7 @@
 
 # Interface: RunOptions
 
-Defined in: [packages/mermaid/src/mermaid.ts:41](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L41)
+Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:41](https://github.com/mermaid-js/m
 
 > `optional` **nodes**: `ArrayLike`<`HTMLElement`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
+Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
 
 The nodes to render. If this is set, `querySelector` will be ignored.
 
@@ -28,7 +28,7 @@ The nodes to render. If this is set, `querySelector` will be ignored.
 
 > `optional` **postRenderCallback**: (`id`) => `unknown`
 
-Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
+Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
 
 A callback to call after each diagram is rendered.
 
@@ -48,7 +48,7 @@ A callback to call after each diagram is rendered.
 
 > `optional` **querySelector**: `string`
 
-Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
+Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
 
 The query selector to use when finding elements to render. Default: `".mermaid"`.
 
@@ -58,6 +58,6 @@ The query selector to use when finding elements to render. Default: `".mermaid"`
 
 > `optional` **suppressErrors**: `boolean`
 
-Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
+Defined in: [packages/mermaid/src/mermaid.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L61)
 
 If `true`, errors will be logged to the console, but not thrown. Default: `false`
diff --git a/docs/config/setup/mermaid/type-aliases/SVG.md b/docs/config/setup/mermaid/type-aliases/SVG.md
index 2c72882ae..bcba8797e 100644
--- a/docs/config/setup/mermaid/type-aliases/SVG.md
+++ b/docs/config/setup/mermaid/type-aliases/SVG.md
@@ -12,4 +12,4 @@
 
 > **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:130](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L130)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:133](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L133)
diff --git a/docs/config/setup/mermaid/type-aliases/SVGGroup.md b/docs/config/setup/mermaid/type-aliases/SVGGroup.md
index 30ada9928..ab8559a66 100644
--- a/docs/config/setup/mermaid/type-aliases/SVGGroup.md
+++ b/docs/config/setup/mermaid/type-aliases/SVGGroup.md
@@ -12,4 +12,4 @@
 
 > **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`>
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:132](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L132)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L135)
diff --git a/docs/config/setup/mermaid/variables/default.md b/docs/config/setup/mermaid/variables/default.md
index 24ec84128..8b437eb6a 100644
--- a/docs/config/setup/mermaid/variables/default.md
+++ b/docs/config/setup/mermaid/variables/default.md
@@ -12,4 +12,4 @@
 
 > `const` **default**: [`Mermaid`](../interfaces/Mermaid.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
+Defined in: [packages/mermaid/src/mermaid.ts:459](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L459)

From 0c759d007594d098756a105ab24899acb4b89d99 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 3 Apr 2025 17:10:33 +0530
Subject: [PATCH 04/45] chore: Add isDefault to examples

---
 packages/mermaid/src/diagram-api/detectType.ts            | 8 ++++++++
 .../src/diagrams/architecture/architectureDetector.ts     | 1 +
 packages/mermaid/src/diagrams/block/blockDetector.ts      | 1 +
 packages/mermaid/src/diagrams/c4/c4Detector.ts            | 1 +
 packages/mermaid/src/diagrams/class/classDetector-V2.ts   | 1 +
 packages/mermaid/src/diagrams/er/erDetector.ts            | 1 +
 .../mermaid/src/diagrams/flowchart/flowDetector-v2.ts     | 1 +
 packages/mermaid/src/diagrams/gantt/ganttDetector.ts      | 1 +
 packages/mermaid/src/diagrams/git/gitGraphDetector.ts     | 1 +
 packages/mermaid/src/diagrams/kanban/detector.ts          | 1 +
 packages/mermaid/src/diagrams/mindmap/detector.ts         | 1 +
 packages/mermaid/src/diagrams/packet/detector.ts          | 1 +
 packages/mermaid/src/diagrams/pie/pieDetector.ts          | 1 +
 .../src/diagrams/quadrant-chart/quadrantDetector.ts       | 1 +
 packages/mermaid/src/diagrams/radar/detector.ts           | 1 +
 .../src/diagrams/requirement/requirementDetector.ts       | 1 +
 packages/mermaid/src/diagrams/sankey/sankeyDetector.ts    | 1 +
 .../mermaid/src/diagrams/sequence/sequenceDetector.ts     | 1 +
 packages/mermaid/src/diagrams/state/stateDetector-V2.ts   | 1 +
 packages/mermaid/src/diagrams/timeline/detector.ts        | 1 +
 .../mermaid/src/diagrams/user-journey/journeyDetector.ts  | 1 +
 packages/mermaid/src/diagrams/xychart/xychartDetector.ts  | 1 +
 22 files changed, 29 insertions(+)

diff --git a/packages/mermaid/src/diagram-api/detectType.ts b/packages/mermaid/src/diagram-api/detectType.ts
index 78cd12ab7..8dd44b37d 100644
--- a/packages/mermaid/src/diagram-api/detectType.ts
+++ b/packages/mermaid/src/diagram-api/detectType.ts
@@ -68,6 +68,14 @@ export const addDiagramDefinition = ({ id, ...definition }: DetectorRecord) => {
   if (diagramDefinitions[id]) {
     log.warn(`Detector with key ${id} already exists. Overwriting.`);
   }
+  if (
+    definition.examples &&
+    definition.examples.filter(({ isDefault }) => isDefault).length !== 1
+  ) {
+    throw new Error(
+      `Diagram with key ${id} must have exactly one default example. Set isDefault to true for one example.`
+    );
+  }
   diagramDefinitions[id] = definition;
   log.debug(`Detector with key ${id} added${definition.loader ? ' with loader' : ''}`);
 };
diff --git a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
index 4c798c263..e93c954be 100644
--- a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
+++ b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
@@ -23,6 +23,7 @@ const architecture: ExternalDiagramDefinition = {
   description: 'Visualize system architecture and components',
   examples: [
     {
+      isDefault: true,
       code: `architecture-beta
     group api(cloud)[API]
 
diff --git a/packages/mermaid/src/diagrams/block/blockDetector.ts b/packages/mermaid/src/diagrams/block/blockDetector.ts
index 95e1cd5ef..fc631db35 100644
--- a/packages/mermaid/src/diagrams/block/blockDetector.ts
+++ b/packages/mermaid/src/diagrams/block/blockDetector.ts
@@ -19,6 +19,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Create block-based visualizations with beta styling',
   examples: [
     {
+      isDefault: true,
       code: `block-beta
 columns 1
   db(("DB"))
diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts
index f47316481..9b6caa90b 100644
--- a/packages/mermaid/src/diagrams/c4/c4Detector.ts
+++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts
@@ -24,6 +24,7 @@ const plugin: ExternalDiagramDefinition = {
     'Visualize software architecture using the C4 model (Context, Container, Component, Code)',
   examples: [
     {
+      isDefault: true,
       code: `C4Context
     title System Context diagram for Internet Banking System
     Enterprise_Boundary(b0, "BankBoundary0") {
diff --git a/packages/mermaid/src/diagrams/class/classDetector-V2.ts b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
index fb360d61f..2466c7105 100644
--- a/packages/mermaid/src/diagrams/class/classDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
@@ -28,6 +28,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize class structures and relationships in object-oriented programming',
   examples: [
     {
+      isDefault: true,
       code: `classDiagram
     Animal <|-- Duck
     Animal <|-- Fish
diff --git a/packages/mermaid/src/diagrams/er/erDetector.ts b/packages/mermaid/src/diagrams/er/erDetector.ts
index ea4b0f8c8..23ad0b12b 100644
--- a/packages/mermaid/src/diagrams/er/erDetector.ts
+++ b/packages/mermaid/src/diagrams/er/erDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize database schemas and relationships between entities',
   examples: [
     {
+      isDefault: true,
       code: `erDiagram
     CUSTOMER ||--o{ ORDER : places
     ORDER ||--|{ ORDER_ITEM : contains
diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
index 01e8eb606..75fad1695 100644
--- a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
@@ -35,6 +35,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize flowcharts and directed graphs',
   examples: [
     {
+      isDefault: true,
       code: `flowchart TD
     A[Christmas] -->|Get money| B(Go shopping)
     B --> C{Let me think}
diff --git a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
index 3c75add65..e225f16fb 100644
--- a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
+++ b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize project schedules and timelines',
   examples: [
     {
+      isDefault: true,
       code: `gantt
     title A Gantt Diagram
     dateFormat  YYYY-MM-DD
diff --git a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
index cc2519767..a4225d364 100644
--- a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
@@ -20,6 +20,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize Git repository history and branch relationships',
   examples: [
     {
+      isDefault: true,
       code: `gitGraph
     commit
     branch develop
diff --git a/packages/mermaid/src/diagrams/kanban/detector.ts b/packages/mermaid/src/diagrams/kanban/detector.ts
index b3af12b43..3e026f569 100644
--- a/packages/mermaid/src/diagrams/kanban/detector.ts
+++ b/packages/mermaid/src/diagrams/kanban/detector.ts
@@ -22,6 +22,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize work items in a Kanban board',
   examples: [
     {
+      isDefault: true,
       code: `---
 config:
   kanban:
diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts
index 26ff7c684..c2b71ef37 100644
--- a/packages/mermaid/src/diagrams/mindmap/detector.ts
+++ b/packages/mermaid/src/diagrams/mindmap/detector.ts
@@ -22,6 +22,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize ideas and concepts in a tree-like structure',
   examples: [
     {
+      isDefault: true,
       code: `mindmap
   root((mindmap))
     Origins
diff --git a/packages/mermaid/src/diagrams/packet/detector.ts b/packages/mermaid/src/diagrams/packet/detector.ts
index 1f9e8fbc9..dca09201b 100644
--- a/packages/mermaid/src/diagrams/packet/detector.ts
+++ b/packages/mermaid/src/diagrams/packet/detector.ts
@@ -23,6 +23,7 @@ export const packet: ExternalDiagramDefinition = {
   description: 'Visualize packet data and network traffic',
   examples: [
     {
+      isDefault: true,
       code: `---
 title: "TCP Packet"
 ---
diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts
index 66067313a..33e627e2a 100644
--- a/packages/mermaid/src/diagrams/pie/pieDetector.ts
+++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts
@@ -23,6 +23,7 @@ export const pie: ExternalDiagramDefinition = {
   description: 'Visualize data as proportional segments of a circle',
   examples: [
     {
+      isDefault: true,
       code: `pie title Pets adopted by volunteers
     "Dogs" : 386
     "Cats" : 85
diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
index 23f9398eb..ef9244fc8 100644
--- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
+++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize items in a 2x2 matrix based on two variables',
   examples: [
     {
+      isDefault: true,
       code: `quadrantChart
     title Reach and engagement of campaigns
     x-axis Low Reach --> High Reach
diff --git a/packages/mermaid/src/diagrams/radar/detector.ts b/packages/mermaid/src/diagrams/radar/detector.ts
index 080b276a2..e1f93f4a4 100644
--- a/packages/mermaid/src/diagrams/radar/detector.ts
+++ b/packages/mermaid/src/diagrams/radar/detector.ts
@@ -23,6 +23,7 @@ export const radar: ExternalDiagramDefinition = {
   description: 'Visualize data in a radial format',
   examples: [
     {
+      isDefault: true,
       code: `---
 title: "Grades"
 ---
diff --git a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
index 7abf8627e..d764329b9 100644
--- a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
+++ b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize system requirements and their relationships',
   examples: [
     {
+      isDefault: true,
       code: `requirementDiagram
 
     requirement test_req {
diff --git a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
index 58f168d88..4f3a8d8ee 100644
--- a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
+++ b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
@@ -19,6 +19,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize flow quantities between different stages or processes',
   examples: [
     {
+      isDefault: true,
       code: `---
 config:
   sankey:
diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
index 6ddd1055b..756f565ae 100644
--- a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
+++ b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize interactions between objects over time',
   examples: [
     {
+      isDefault: true,
       code: `sequenceDiagram
     Alice->>+John: Hello John, how are you?
     Alice->>+John: John, can you hear me?
diff --git a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
index 5b86ea2d5..2bfcad010 100644
--- a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
@@ -29,6 +29,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize state transitions and behaviors of a system',
   examples: [
     {
+      isDefault: true,
       code: `stateDiagram-v2
     [*] --> Still
     Still --> [*]
diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts
index 982487a9e..fd947aa0f 100644
--- a/packages/mermaid/src/diagrams/timeline/detector.ts
+++ b/packages/mermaid/src/diagrams/timeline/detector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize events and milestones in chronological order',
   examples: [
     {
+      isDefault: true,
       code: `timeline
     title History of Social Media Platform
     2002 : LinkedIn
diff --git a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
index 5b3ca9c2a..84127f279 100644
--- a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
+++ b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Visualize user interactions and experiences with a system',
   examples: [
     {
+      isDefault: true,
       code: `journey
     title My working day
     section Go to work
diff --git a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
index f12a76c39..7e2c02046 100644
--- a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
+++ b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
@@ -23,6 +23,7 @@ const plugin: ExternalDiagramDefinition = {
   description: 'Create scatter plots and line charts with customizable axes',
   examples: [
     {
+      isDefault: true,
       code: `xychart-beta
     title "Sales Revenue"
     x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]

From 7e7a4fc665b04f0f064bc2b648a8c30370e22d41 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 08:53:37 +0530
Subject: [PATCH 05/45] chore: Move examples to different package

---
 .build/common.ts                              |  5 ++
 packages/examples/package.json                | 20 +++++
 packages/examples/src/example.spec.ts         | 32 +++++++
 .../examples/src/examples/architecture.ts     | 24 +++++
 packages/examples/src/examples/block.ts       | 27 ++++++
 packages/examples/src/examples/c4.ts          | 47 ++++++++++
 packages/examples/src/examples/class.ts       | 34 +++++++
 packages/examples/src/examples/er.ts          | 36 ++++++++
 packages/examples/src/examples/flowchart.ts   | 19 ++++
 packages/examples/src/examples/gantt.ts       | 22 +++++
 packages/examples/src/examples/git.ts         | 28 ++++++
 packages/examples/src/examples/kanban.ts      | 37 ++++++++
 packages/examples/src/examples/mindmap.ts     | 32 +++++++
 packages/examples/src/examples/packet.ts      | 34 +++++++
 packages/examples/src/examples/pie.ts         | 17 ++++
 .../examples/src/examples/quadrant-chart.ts   | 27 ++++++
 packages/examples/src/examples/radar.ts       | 25 ++++++
 packages/examples/src/examples/requirement.ts | 27 ++++++
 packages/examples/src/examples/sankey.ts      | 88 +++++++++++++++++++
 packages/examples/src/examples/sequence.ts    | 18 ++++
 packages/examples/src/examples/state.ts       | 20 +++++
 packages/examples/src/examples/timeline.ts    | 20 +++++
 .../examples/src/examples/user-journey.ts     | 22 +++++
 packages/examples/src/examples/xychart.ts     | 19 ++++
 packages/examples/src/index.ts                | 46 ++++++++++
 packages/examples/src/types.ts                | 12 +++
 packages/examples/tsconfig.json               | 12 +++
 .../mermaid/src/diagram-api/detectType.ts     | 37 ++++----
 .../mermaid/src/diagram-api/diagramAPI.ts     |  4 +-
 .../mermaid/src/diagram-api/loadDiagram.ts    |  6 +-
 packages/mermaid/src/diagram-api/types.ts     |  9 +-
 packages/mermaid/src/diagram.spec.ts          | 22 ++---
 .../architecture/architectureDetector.ts      | 19 ----
 .../src/diagrams/block/blockDetector.ts       | 22 -----
 .../mermaid/src/diagrams/c4/c4Detector.ts     | 42 ---------
 .../src/diagrams/class/classDetector-V2.ts    | 29 ------
 .../mermaid/src/diagrams/er/erDetector.ts     | 31 -------
 .../src/diagrams/flowchart/flowDetector-v2.ts | 14 ---
 .../src/diagrams/gantt/ganttDetector.ts       | 17 ----
 .../src/diagrams/git/gitGraphDetector.ts      | 23 -----
 .../mermaid/src/diagrams/kanban/detector.ts   | 31 -------
 .../mermaid/src/diagrams/mindmap/detector.ts  | 26 ------
 .../mermaid/src/diagrams/packet/detector.ts   | 29 ------
 .../mermaid/src/diagrams/pie/pieDetector.ts   | 12 ---
 .../quadrant-chart/quadrantDetector.ts        | 22 -----
 .../mermaid/src/diagrams/radar/detector.ts    | 19 ----
 .../requirement/requirementDetector.ts        | 22 -----
 .../src/diagrams/sankey/sankeyDetector.ts     | 83 -----------------
 .../src/diagrams/sequence/sequenceDetector.ts | 13 ---
 .../src/diagrams/state/stateDetector-V2.ts    | 15 ----
 .../mermaid/src/diagrams/timeline/detector.ts | 15 ----
 .../diagrams/user-journey/journeyDetector.ts  | 17 ----
 .../src/diagrams/xychart/xychartDetector.ts   | 14 ---
 packages/mermaid/src/mermaid.ts               | 16 +---
 pnpm-lock.yaml                                | 20 ++++-
 55 files changed, 806 insertions(+), 573 deletions(-)
 create mode 100644 packages/examples/package.json
 create mode 100644 packages/examples/src/example.spec.ts
 create mode 100644 packages/examples/src/examples/architecture.ts
 create mode 100644 packages/examples/src/examples/block.ts
 create mode 100644 packages/examples/src/examples/c4.ts
 create mode 100644 packages/examples/src/examples/class.ts
 create mode 100644 packages/examples/src/examples/er.ts
 create mode 100644 packages/examples/src/examples/flowchart.ts
 create mode 100644 packages/examples/src/examples/gantt.ts
 create mode 100644 packages/examples/src/examples/git.ts
 create mode 100644 packages/examples/src/examples/kanban.ts
 create mode 100644 packages/examples/src/examples/mindmap.ts
 create mode 100644 packages/examples/src/examples/packet.ts
 create mode 100644 packages/examples/src/examples/pie.ts
 create mode 100644 packages/examples/src/examples/quadrant-chart.ts
 create mode 100644 packages/examples/src/examples/radar.ts
 create mode 100644 packages/examples/src/examples/requirement.ts
 create mode 100644 packages/examples/src/examples/sankey.ts
 create mode 100644 packages/examples/src/examples/sequence.ts
 create mode 100644 packages/examples/src/examples/state.ts
 create mode 100644 packages/examples/src/examples/timeline.ts
 create mode 100644 packages/examples/src/examples/user-journey.ts
 create mode 100644 packages/examples/src/examples/xychart.ts
 create mode 100644 packages/examples/src/index.ts
 create mode 100644 packages/examples/src/types.ts
 create mode 100644 packages/examples/tsconfig.json

diff --git a/.build/common.ts b/.build/common.ts
index 86ccd15d1..7ca354c37 100644
--- a/.build/common.ts
+++ b/.build/common.ts
@@ -33,4 +33,9 @@ export const packageOptions = {
     packageName: 'mermaid-layout-elk',
     file: 'layouts.ts',
   },
+  'mermaid-examples': {
+    name: 'mermaid-examples',
+    packageName: 'examples',
+    file: 'index.ts',
+  },
 } as const satisfies Record<string, PackageOptions>;
diff --git a/packages/examples/package.json b/packages/examples/package.json
new file mode 100644
index 000000000..4200804ca
--- /dev/null
+++ b/packages/examples/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@mermaid-js/examples",
+  "version": "0.0.1",
+  "description": "Mermaid examples package",
+  "author": "Sidharth Vinod",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "clean": "rimraf dist"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "mermaid": "workspace:*"
+  }
+}
diff --git a/packages/examples/src/example.spec.ts b/packages/examples/src/example.spec.ts
new file mode 100644
index 000000000..93cceb9e5
--- /dev/null
+++ b/packages/examples/src/example.spec.ts
@@ -0,0 +1,32 @@
+import mermaid from 'mermaid';
+import { diagramData } from './index.js';
+
+describe('examples', () => {
+  beforeAll(async () => {
+    // To trigger the diagram registration
+    await mermaid.registerExternalDiagrams([]);
+  });
+
+  it('should have examples for each diagrams', () => {
+    const skippedDiagrams = [
+      // These diagrams have no examples
+      'error',
+      'info',
+      '---',
+      // These diagrams have v2 versions, with examples
+      'class',
+      'graph',
+      'flowchart-elk',
+      'flowchart',
+      'state',
+    ];
+    const diagrams = mermaid.getDiagramData().filter((d) => !skippedDiagrams.includes(d.id));
+    expect(diagrams.length).toBeGreaterThan(0);
+    for (const diagram of diagrams) {
+      const data = diagramData.find((d) => d.id === diagram.id)!;
+      expect(data).toBeDefined();
+      expect(data.examples.length).toBeGreaterThan(0);
+      expect(data.examples.filter((e) => e.isDefault).length).toBe(1);
+    }
+  });
+});
diff --git a/packages/examples/src/examples/architecture.ts b/packages/examples/src/examples/architecture.ts
new file mode 100644
index 000000000..21e6f71c1
--- /dev/null
+++ b/packages/examples/src/examples/architecture.ts
@@ -0,0 +1,24 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'architecture',
+  name: 'Architecture Diagram',
+  description: 'Visualize system architecture and components',
+  examples: [
+    {
+      title: 'Basic System Architecture',
+      code: `architecture-beta
+    group api(cloud)[API]
+
+    service db(database)[Database] in api
+    service disk1(disk)[Storage] in api
+    service disk2(disk)[Storage] in api
+    service server(server)[Server] in api
+
+    db:L -- R:server
+    disk1:T -- B:server
+    disk2:T -- B:db`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/block.ts b/packages/examples/src/examples/block.ts
new file mode 100644
index 000000000..a2b4f3dde
--- /dev/null
+++ b/packages/examples/src/examples/block.ts
@@ -0,0 +1,27 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'block',
+  name: 'Block Diagram',
+  description: 'Create block-based visualizations with beta styling',
+  examples: [
+    {
+      title: 'Basic Block Layout',
+      code: `block-beta
+columns 1
+  db(("DB"))
+  blockArrowId6<["&nbsp;&nbsp;&nbsp;"]>(down)
+  block:ID
+    A
+    B["A wide one in the middle"]
+    C
+  end
+  space
+  D
+  ID --> D
+  C --> D
+  style B fill:#969,stroke:#333,stroke-width:4px`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/c4.ts b/packages/examples/src/examples/c4.ts
new file mode 100644
index 000000000..dcfdb48e9
--- /dev/null
+++ b/packages/examples/src/examples/c4.ts
@@ -0,0 +1,47 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'c4',
+  name: 'C4 Diagram',
+  description:
+    'Visualize software architecture using the C4 model (Context, Container, Component, Code)',
+  examples: [
+    {
+      isDefault: true,
+      code: `C4Context
+    title System Context diagram for Internet Banking System
+    Enterprise_Boundary(b0, "BankBoundary0") {
+        Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
+        Person(customerB, "Banking Customer B")
+        Person_Ext(customerC, "Banking Customer C", "desc")
+
+        Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
+
+        System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
+
+        Enterprise_Boundary(b1, "BankBoundary") {
+            SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
+
+            System_Boundary(b2, "BankBoundary2") {
+                System(SystemA, "Banking System A")
+                System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts. next line.")
+            }
+
+            System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
+            SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
+
+            Boundary(b3, "BankBoundary3", "boundary") {
+                SystemQueue(SystemF, "Banking System F Queue", "A system of the bank.")
+                SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
+            }
+        }
+    }
+
+    BiRel(customerA, SystemAA, "Uses")
+    BiRel(SystemAA, SystemE, "Uses")
+    Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
+    Rel(SystemC, customerA, "Sends e-mails to")`,
+      title: 'Internet Banking System Context',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/class.ts b/packages/examples/src/examples/class.ts
new file mode 100644
index 000000000..6d3cebce5
--- /dev/null
+++ b/packages/examples/src/examples/class.ts
@@ -0,0 +1,34 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'classDiagram',
+  name: 'Class Diagram',
+  description: 'Visualize class structures and relationships in object-oriented programming',
+  examples: [
+    {
+      isDefault: true,
+      code: `classDiagram
+    Animal <|-- Duck
+    Animal <|-- Fish
+    Animal <|-- Zebra
+    Animal : +int age
+    Animal : +String gender
+    Animal: +isMammal()
+    Animal: +mate()
+    class Duck{
+      +String beakColor
+      +swim()
+      +quack()
+    }
+    class Fish{
+      -int sizeInFeet
+      -canEat()
+    }
+    class Zebra{
+      +bool is_wild
+      +run()
+    }`,
+      title: 'Basic Class Inheritance',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/er.ts b/packages/examples/src/examples/er.ts
new file mode 100644
index 000000000..75e2e0b59
--- /dev/null
+++ b/packages/examples/src/examples/er.ts
@@ -0,0 +1,36 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'er',
+  name: 'Entity Relationship Diagram',
+  description: 'Visualize database schemas and relationships between entities',
+  examples: [
+    {
+      title: 'Basic ER Schema',
+      code: `erDiagram
+    CUSTOMER ||--o{ ORDER : places
+    ORDER ||--|{ ORDER_ITEM : contains
+    PRODUCT ||--o{ ORDER_ITEM : includes
+    CUSTOMER {
+        string id
+        string name
+        string email
+    }
+    ORDER {
+        string id
+        date orderDate
+        string status
+    }
+    PRODUCT {
+        string id
+        string name
+        float price
+    }
+    ORDER_ITEM {
+        int quantity
+        float price
+    }`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/flowchart.ts b/packages/examples/src/examples/flowchart.ts
new file mode 100644
index 000000000..3f9bbadab
--- /dev/null
+++ b/packages/examples/src/examples/flowchart.ts
@@ -0,0 +1,19 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'flowchart-v2',
+  name: 'Flowchart',
+  description: 'Visualize flowcharts and directed graphs',
+  examples: [
+    {
+      isDefault: true,
+      code: `flowchart TD
+    A[Christmas] -->|Get money| B(Go shopping)
+    B --> C{Let me think}
+    C -->|One| D[Laptop]
+    C -->|Two| E[iPhone]
+    C -->|Three| F[fa:fa-car Car]`,
+      title: 'Basic Flowchart',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/gantt.ts b/packages/examples/src/examples/gantt.ts
new file mode 100644
index 000000000..c1e4cbc62
--- /dev/null
+++ b/packages/examples/src/examples/gantt.ts
@@ -0,0 +1,22 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'gantt',
+  name: 'Gantt Chart',
+  description: 'Visualize project schedules and timelines',
+  examples: [
+    {
+      isDefault: true,
+      code: `gantt
+    title A Gantt Diagram
+    dateFormat  YYYY-MM-DD
+    section Section
+    A task           :a1, 2014-01-01, 30d
+    Another task     :after a1  , 20d
+    section Another
+    Task in sec      :2014-01-12  , 12d
+    another task      : 24d`,
+      title: 'Basic Project Timeline',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/git.ts b/packages/examples/src/examples/git.ts
new file mode 100644
index 000000000..05e6df208
--- /dev/null
+++ b/packages/examples/src/examples/git.ts
@@ -0,0 +1,28 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'gitGraph',
+  name: 'Git Graph',
+  description: 'Visualize Git repository history and branch relationships',
+  examples: [
+    {
+      title: 'Basic Git Flow',
+      code: `gitGraph
+    commit
+    branch develop
+    checkout develop
+    commit
+    commit
+    checkout main
+    merge develop
+    commit
+    branch feature
+    checkout feature
+    commit
+    commit
+    checkout main
+    merge feature`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/kanban.ts b/packages/examples/src/examples/kanban.ts
new file mode 100644
index 000000000..c1478dccb
--- /dev/null
+++ b/packages/examples/src/examples/kanban.ts
@@ -0,0 +1,37 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'kanban',
+  name: 'Kanban Diagram',
+  description: 'Visualize work items in a Kanban board',
+  examples: [
+    {
+      isDefault: true,
+      title: 'Kanban Diagram',
+      code: `---
+config:
+  kanban:
+    ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
+---
+kanban
+  Todo
+    [Create Documentation]
+    docs[Create Blog about the new diagram]
+  [In progress]
+    id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
+  id9[Ready for deploy]
+    id8[Design grammar]@{ assigned: 'knsv' }
+  id10[Ready for test]
+    id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
+    id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
+  id11[Done]
+    id5[define getData]
+    id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
+    id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
+
+  id12[Can't reproduce]
+    id3[Weird flickering in Firefox]
+`,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/mindmap.ts b/packages/examples/src/examples/mindmap.ts
new file mode 100644
index 000000000..3684f736b
--- /dev/null
+++ b/packages/examples/src/examples/mindmap.ts
@@ -0,0 +1,32 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'mindmap',
+  name: 'Mindmap',
+  description: 'Visualize ideas and concepts in a tree-like structure',
+  examples: [
+    {
+      title: 'Basic Mindmap',
+      code: `mindmap
+  root((mindmap))
+    Origins
+      Long history
+      ::icon(fa fa-book)
+      Popularisation
+        British popular psychology author Tony Buzan
+    Research
+      On effectiveness<br/>and features
+      On Automatic creation
+        Uses
+            Creative techniques
+            Strategic planning
+            Argument mapping
+    Tools
+      Pen and paper
+      Mermaid`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
+
+// cspell:ignore Buzan
diff --git a/packages/examples/src/examples/packet.ts b/packages/examples/src/examples/packet.ts
new file mode 100644
index 000000000..062a6a3df
--- /dev/null
+++ b/packages/examples/src/examples/packet.ts
@@ -0,0 +1,34 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'packet',
+  name: 'Packet Diagram',
+  description: 'Visualize packet data and network traffic',
+  examples: [
+    {
+      title: 'TCP Packet',
+      code: `---
+title: "TCP Packet"
+---
+packet-beta
+0-15: "Source Port"
+16-31: "Destination Port"
+32-63: "Sequence Number"
+64-95: "Acknowledgment Number"
+96-99: "Data Offset"
+100-105: "Reserved"
+106: "URG"
+107: "ACK"
+108: "PSH"
+109: "RST"
+110: "SYN"
+111: "FIN"
+112-127: "Window"
+128-143: "Checksum"
+144-159: "Urgent Pointer"
+160-191: "(Options and Padding)"
+192-255: "Data (variable length)"`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/pie.ts b/packages/examples/src/examples/pie.ts
new file mode 100644
index 000000000..2396059f9
--- /dev/null
+++ b/packages/examples/src/examples/pie.ts
@@ -0,0 +1,17 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'pie',
+  name: 'Pie Chart',
+  description: 'Visualize data as proportional segments of a circle',
+  examples: [
+    {
+      title: 'Basic Pie Chart',
+      code: `pie title Pets adopted by volunteers
+    "Dogs" : 386
+    "Cats" : 85
+    "Rats" : 15`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/quadrant-chart.ts b/packages/examples/src/examples/quadrant-chart.ts
new file mode 100644
index 000000000..8539c16ae
--- /dev/null
+++ b/packages/examples/src/examples/quadrant-chart.ts
@@ -0,0 +1,27 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'quadrantChart',
+  name: 'Quadrant Chart',
+  description: 'Visualize items in a 2x2 matrix based on two variables',
+  examples: [
+    {
+      isDefault: true,
+      code: `quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Low Reach --> High Reach
+    y-axis Low Engagement --> High Engagement
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]`,
+      title: 'Product Positioning',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/radar.ts b/packages/examples/src/examples/radar.ts
new file mode 100644
index 000000000..1b0981be9
--- /dev/null
+++ b/packages/examples/src/examples/radar.ts
@@ -0,0 +1,25 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'radar',
+  name: 'Radar Diagram',
+  description: 'Visualize data in a radial format',
+  examples: [
+    {
+      title: 'Student Grades',
+      code: `---
+title: "Grades"
+---
+radar-beta
+  axis m["Math"], s["Science"], e["English"]
+  axis h["History"], g["Geography"], a["Art"]
+  curve a["Alice"]{85, 90, 80, 70, 75, 90}
+  curve b["Bob"]{70, 75, 85, 80, 90, 85}
+
+  max 100
+  min 0
+`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/requirement.ts b/packages/examples/src/examples/requirement.ts
new file mode 100644
index 000000000..6804ffdf8
--- /dev/null
+++ b/packages/examples/src/examples/requirement.ts
@@ -0,0 +1,27 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'requirement',
+  name: 'Requirement Diagram',
+  description: 'Visualize system requirements and their relationships',
+  examples: [
+    {
+      title: 'Basic Requirements',
+      code: `requirementDiagram
+
+    requirement test_req {
+    id: 1
+    text: the test text.
+    risk: high
+    verifymethod: test
+    }
+
+    element test_entity {
+    type: simulation
+    }
+
+    test_entity - satisfies -> test_req`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/sankey.ts b/packages/examples/src/examples/sankey.ts
new file mode 100644
index 000000000..0ac46836f
--- /dev/null
+++ b/packages/examples/src/examples/sankey.ts
@@ -0,0 +1,88 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'sankey',
+  name: 'Sankey Diagram',
+  description: 'Visualize flow quantities between different stages or processes',
+  examples: [
+    {
+      title: 'Energy Flow',
+      code: `---
+config:
+  sankey:
+    showValues: false
+---
+sankey-beta
+
+Agricultural 'waste',Bio-conversion,124.729
+Bio-conversion,Liquid,0.597
+Bio-conversion,Losses,26.862
+Bio-conversion,Solid,280.322
+Bio-conversion,Gas,81.144
+Biofuel imports,Liquid,35
+Biomass imports,Solid,35
+Coal imports,Coal,11.606
+Coal reserves,Coal,63.965
+Coal,Solid,75.571
+District heating,Industry,10.639
+District heating,Heating and cooling - commercial,22.505
+District heating,Heating and cooling - homes,46.184
+Electricity grid,Over generation / exports,104.453
+Electricity grid,Heating and cooling - homes,113.726
+Electricity grid,H2 conversion,27.14
+Electricity grid,Industry,342.165
+Electricity grid,Road transport,37.797
+Electricity grid,Agriculture,4.412
+Electricity grid,Heating and cooling - commercial,40.858
+Electricity grid,Losses,56.691
+Electricity grid,Rail transport,7.863
+Electricity grid,Lighting & appliances - commercial,90.008
+Electricity grid,Lighting & appliances - homes,93.494
+Gas imports,NGas,40.719
+Gas reserves,NGas,82.233
+Gas,Heating and cooling - commercial,0.129
+Gas,Losses,1.401
+Gas,Thermal generation,151.891
+Gas,Agriculture,2.096
+Gas,Industry,48.58
+Geothermal,Electricity grid,7.013
+H2 conversion,H2,20.897
+H2 conversion,Losses,6.242
+H2,Road transport,20.897
+Hydro,Electricity grid,6.995
+Liquid,Industry,121.066
+Liquid,International shipping,128.69
+Liquid,Road transport,135.835
+Liquid,Domestic aviation,14.458
+Liquid,International aviation,206.267
+Liquid,Agriculture,3.64
+Liquid,National navigation,33.218
+Liquid,Rail transport,4.413
+Marine algae,Bio-conversion,4.375
+NGas,Gas,122.952
+Nuclear,Thermal generation,839.978
+Oil imports,Oil,504.287
+Oil reserves,Oil,107.703
+Oil,Liquid,611.99
+Other waste,Solid,56.587
+Other waste,Bio-conversion,77.81
+Pumped heat,Heating and cooling - homes,193.026
+Pumped heat,Heating and cooling - commercial,70.672
+Solar PV,Electricity grid,59.901
+Solar Thermal,Heating and cooling - homes,19.263
+Solar,Solar Thermal,19.263
+Solar,Solar PV,59.901
+Solid,Agriculture,0.882
+Solid,Thermal generation,400.12
+Solid,Industry,46.477
+Thermal generation,Electricity grid,525.531
+Thermal generation,Losses,787.129
+Thermal generation,District heating,79.329
+Tidal,Electricity grid,9.452
+UK land based bioenergy,Bio-conversion,182.01
+Wave,Electricity grid,19.013
+Wind,Electricity grid,289.366`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/sequence.ts b/packages/examples/src/examples/sequence.ts
new file mode 100644
index 000000000..37e264510
--- /dev/null
+++ b/packages/examples/src/examples/sequence.ts
@@ -0,0 +1,18 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'sequence',
+  name: 'Sequence Diagram',
+  description: 'Visualize interactions between objects over time',
+  examples: [
+    {
+      title: 'Basic Sequence',
+      code: `sequenceDiagram
+    Alice->>+John: Hello John, how are you?
+    Alice->>+John: John, can you hear me?
+    John-->>-Alice: Hi Alice, I can hear you!
+    John-->>-Alice: I feel great!`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/state.ts b/packages/examples/src/examples/state.ts
new file mode 100644
index 000000000..bfe1c0600
--- /dev/null
+++ b/packages/examples/src/examples/state.ts
@@ -0,0 +1,20 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'stateDiagram',
+  name: 'State Diagram',
+  description: 'Visualize the states and transitions of a system',
+  examples: [
+    {
+      title: 'Basic State Diagram',
+      code: `stateDiagram-v2
+    [*] --> Still
+    Still --> [*]
+    Still --> Moving
+    Moving --> Still
+    Moving --> Crash
+    Crash --> [*]`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/timeline.ts b/packages/examples/src/examples/timeline.ts
new file mode 100644
index 000000000..2b7dbc4d1
--- /dev/null
+++ b/packages/examples/src/examples/timeline.ts
@@ -0,0 +1,20 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'timeline',
+  name: 'Timeline Diagram',
+  description: 'Visualize events and milestones in chronological order',
+  examples: [
+    {
+      isDefault: true,
+      code: `timeline
+    title History of Social Media Platform
+    2002 : LinkedIn
+    2004 : Facebook
+         : Google
+    2005 : YouTube
+    2006 : Twitter`,
+      title: 'Project Timeline',
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/user-journey.ts b/packages/examples/src/examples/user-journey.ts
new file mode 100644
index 000000000..c2d7a3b15
--- /dev/null
+++ b/packages/examples/src/examples/user-journey.ts
@@ -0,0 +1,22 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'journey',
+  name: 'User Journey Diagram',
+  description: 'Visualize user interactions and experiences with a system',
+  examples: [
+    {
+      title: 'My Working Day',
+      code: `journey
+    title My working day
+    section Go to work
+      Make tea: 5: Me
+      Go upstairs: 3: Me
+      Do work: 1: Me, Cat
+    section Go home
+      Go downstairs: 5: Me
+      Sit down: 5: Me`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/xychart.ts b/packages/examples/src/examples/xychart.ts
new file mode 100644
index 000000000..a45821edd
--- /dev/null
+++ b/packages/examples/src/examples/xychart.ts
@@ -0,0 +1,19 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'xychart',
+  name: 'XY Chart',
+  description: 'Create scatter plots and line charts with customizable axes',
+  examples: [
+    {
+      title: 'Sales Revenue',
+      code: `xychart-beta
+    title "Sales Revenue"
+    x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+    y-axis "Revenue (in $)" 4000 --> 11000
+    bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+    line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]`,
+      isDefault: true,
+    },
+  ],
+} satisfies DiagramMetadata;
diff --git a/packages/examples/src/index.ts b/packages/examples/src/index.ts
new file mode 100644
index 000000000..c762fd80a
--- /dev/null
+++ b/packages/examples/src/index.ts
@@ -0,0 +1,46 @@
+import type { DiagramMetadata } from './types.js';
+import flowChart from './examples/flowchart.js';
+import c4 from './examples/c4.js';
+import kanban from './examples/kanban.js';
+import classDiagram from './examples/class.js';
+import sequenceDiagram from './examples/sequence.js';
+import pieDiagram from './examples/pie.js';
+import userJourneyDiagram from './examples/user-journey.js';
+import mindmapDiagram from './examples/mindmap.js';
+import requirementDiagram from './examples/requirement.js';
+import radarDiagram from './examples/radar.js';
+import stateDiagram from './examples/state.js';
+import erDiagram from './examples/er.js';
+import gitDiagram from './examples/git.js';
+import architectureDiagram from './examples/architecture.js';
+import xychartDiagram from './examples/xychart.js';
+import sankeyDiagram from './examples/sankey.js';
+import ganttDiagram from './examples/gantt.js';
+import timelineDiagram from './examples/timeline.js';
+import quadrantChart from './examples/quadrant-chart.js';
+import packetDiagram from './examples/packet.js';
+import blockDiagram from './examples/block.js';
+
+export const diagramData: DiagramMetadata[] = [
+  flowChart,
+  c4,
+  kanban,
+  classDiagram,
+  sequenceDiagram,
+  pieDiagram,
+  userJourneyDiagram,
+  mindmapDiagram,
+  requirementDiagram,
+  radarDiagram,
+  stateDiagram,
+  erDiagram,
+  gitDiagram,
+  architectureDiagram,
+  xychartDiagram,
+  sankeyDiagram,
+  ganttDiagram,
+  timelineDiagram,
+  quadrantChart,
+  packetDiagram,
+  blockDiagram,
+];
diff --git a/packages/examples/src/types.ts b/packages/examples/src/types.ts
new file mode 100644
index 000000000..1658f588c
--- /dev/null
+++ b/packages/examples/src/types.ts
@@ -0,0 +1,12 @@
+export interface Example {
+  title: string;
+  code: string;
+  isDefault?: boolean;
+}
+
+export interface DiagramMetadata {
+  id: string;
+  name: string;
+  description: string;
+  examples: Example[];
+}
diff --git a/packages/examples/tsconfig.json b/packages/examples/tsconfig.json
new file mode 100644
index 000000000..b3b003dc5
--- /dev/null
+++ b/packages/examples/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "composite": true,
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+}
diff --git a/packages/mermaid/src/diagram-api/detectType.ts b/packages/mermaid/src/diagram-api/detectType.ts
index 8dd44b37d..aed8ca964 100644
--- a/packages/mermaid/src/diagram-api/detectType.ts
+++ b/packages/mermaid/src/diagram-api/detectType.ts
@@ -1,10 +1,15 @@
 import type { MermaidConfig } from '../config.type.js';
-import { UnknownDiagramError } from '../errors.js';
 import { log } from '../logger.js';
+import type {
+  DetectorRecord,
+  DiagramDetector,
+  DiagramLoader,
+  ExternalDiagramDefinition,
+} from './types.js';
 import { anyCommentRegex, directiveRegex, frontMatterRegex } from './regexes.js';
-import type { DetectorRecord, ExternalDiagramDefinition } from './types.js';
+import { UnknownDiagramError } from '../errors.js';
 
-export const diagramDefinitions: Record<string, Omit<DetectorRecord, 'id'>> = {};
+export const detectors: Record<string, DetectorRecord> = {};
 
 /**
  * Detects the type of the graph text.
@@ -33,7 +38,7 @@ export const detectType = function (text: string, config?: MermaidConfig): strin
     .replace(frontMatterRegex, '')
     .replace(directiveRegex, '')
     .replace(anyCommentRegex, '\n');
-  for (const [key, { detector }] of Object.entries(diagramDefinitions)) {
+  for (const [key, { detector }] of Object.entries(detectors)) {
     const diagram = detector(text, config);
     if (diagram) {
       return key;
@@ -59,27 +64,19 @@ export const detectType = function (text: string, config?: MermaidConfig): strin
  * @param diagrams - Diagrams to lazy load, and their detectors, in order of importance.
  */
 export const registerLazyLoadedDiagrams = (...diagrams: ExternalDiagramDefinition[]) => {
-  for (const definition of diagrams) {
-    addDiagramDefinition(definition);
+  for (const { id, detector, loader } of diagrams) {
+    addDetector(id, detector, loader);
   }
 };
 
-export const addDiagramDefinition = ({ id, ...definition }: DetectorRecord) => {
-  if (diagramDefinitions[id]) {
-    log.warn(`Detector with key ${id} already exists. Overwriting.`);
+export const addDetector = (key: string, detector: DiagramDetector, loader?: DiagramLoader) => {
+  if (detectors[key]) {
+    log.warn(`Detector with key ${key} already exists. Overwriting.`);
   }
-  if (
-    definition.examples &&
-    definition.examples.filter(({ isDefault }) => isDefault).length !== 1
-  ) {
-    throw new Error(
-      `Diagram with key ${id} must have exactly one default example. Set isDefault to true for one example.`
-    );
-  }
-  diagramDefinitions[id] = definition;
-  log.debug(`Detector with key ${id} added${definition.loader ? ' with loader' : ''}`);
+  detectors[key] = { detector, loader };
+  log.debug(`Detector with key ${key} added${loader ? ' with loader' : ''}`);
 };
 
 export const getDiagramLoader = (key: string) => {
-  return diagramDefinitions[key].loader;
+  return detectors[key].loader;
 };
diff --git a/packages/mermaid/src/diagram-api/diagramAPI.ts b/packages/mermaid/src/diagram-api/diagramAPI.ts
index 29a726ae9..df4514adf 100644
--- a/packages/mermaid/src/diagram-api/diagramAPI.ts
+++ b/packages/mermaid/src/diagram-api/diagramAPI.ts
@@ -1,4 +1,4 @@
-import { addDiagramDefinition } from './detectType.js';
+import { addDetector } from './detectType.js';
 import { log as _log, setLogLevel as _setLogLevel } from '../logger.js';
 import {
   getConfig as _getConfig,
@@ -51,7 +51,7 @@ export const registerDiagram = (
   }
   diagrams[id] = diagram;
   if (detector) {
-    addDiagramDefinition({ id, detector });
+    addDetector(id, detector);
   }
   addStylesForDiagram(id, diagram.styles);
 
diff --git a/packages/mermaid/src/diagram-api/loadDiagram.ts b/packages/mermaid/src/diagram-api/loadDiagram.ts
index 2c570d10e..b3c1cdb57 100644
--- a/packages/mermaid/src/diagram-api/loadDiagram.ts
+++ b/packages/mermaid/src/diagram-api/loadDiagram.ts
@@ -1,12 +1,12 @@
 import { log } from '../logger.js';
-import { diagramDefinitions } from './detectType.js';
+import { detectors } from './detectType.js';
 import { getDiagram, registerDiagram } from './diagramAPI.js';
 
 export const loadRegisteredDiagrams = async () => {
   log.debug(`Loading registered diagrams`);
   // Load all lazy loaded diagrams in parallel
   const results = await Promise.allSettled(
-    Object.entries(diagramDefinitions).map(async ([key, { detector, loader }]) => {
+    Object.entries(detectors).map(async ([key, { detector, loader }]) => {
       if (!loader) {
         return;
       }
@@ -20,7 +20,7 @@ export const loadRegisteredDiagrams = async () => {
         } catch (err) {
           // Remove failed diagram from detectors
           log.error(`Failed to load external diagram with key ${key}. Removing from detectors.`);
-          delete diagramDefinitions[key];
+          delete detectors[key];
           throw err;
         }
       }
diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts
index ed1d0677c..56364e9c6 100644
--- a/packages/mermaid/src/diagram-api/types.ts
+++ b/packages/mermaid/src/diagram-api/types.ts
@@ -93,18 +93,11 @@ export interface DiagramDefinition {
 
 export interface ExternalDiagramDefinition {
   id: string;
-  /**
-   * Title, description, and examples for the diagram are optional only for backwards compatibility.
-   * It is strongly recommended to provide these values for all new diagrams.
-   */
-  title?: string;
-  description?: string;
-  examples?: { code: string; title?: string; isDefault?: boolean }[];
   detector: DiagramDetector;
   loader: DiagramLoader;
 }
 
-export type DetectorRecord = SetOptional<ExternalDiagramDefinition, 'loader'>;
+export type DetectorRecord = SetOptional<Omit<ExternalDiagramDefinition, 'id'>, 'loader'>;
 export type DiagramDetector = (text: string, config?: MermaidConfig) => boolean;
 export type DiagramLoader = () => Promise<{ id: string; diagram: DiagramDefinition }>;
 
diff --git a/packages/mermaid/src/diagram.spec.ts b/packages/mermaid/src/diagram.spec.ts
index e25963614..873fada14 100644
--- a/packages/mermaid/src/diagram.spec.ts
+++ b/packages/mermaid/src/diagram.spec.ts
@@ -1,6 +1,6 @@
 import { describe, test, expect } from 'vitest';
 import { Diagram } from './Diagram.js';
-import { addDiagramDefinition } from './diagram-api/detectType.js';
+import { addDetector } from './diagram-api/detectType.js';
 import { addDiagrams } from './diagram-api/diagram-orchestration.js';
 import type { DiagramLoader } from './diagram-api/types.js';
 
@@ -41,11 +41,11 @@ describe('diagram detection', () => {
   });
 
   test('should detect external diagrams', async () => {
-    addDiagramDefinition({
-      id: 'loki',
-      detector: (str) => str.startsWith('loki'),
-      loader: () => Promise.resolve(getDummyDiagram('loki')),
-    });
+    addDetector(
+      'loki',
+      (str) => str.startsWith('loki'),
+      () => Promise.resolve(getDummyDiagram('loki'))
+    );
     const diagram = await Diagram.fromText('loki TD; A-->B');
     expect(diagram).toBeInstanceOf(Diagram);
     expect(diagram.type).toBe('loki');
@@ -53,11 +53,11 @@ describe('diagram detection', () => {
 
   test('should allow external diagrams to override internal ones with same ID', async () => {
     const title = 'overridden';
-    addDiagramDefinition({
-      id: 'flowchart-elk',
-      detector: (str) => str.startsWith('flowchart-elk'),
-      loader: () => Promise.resolve(getDummyDiagram('flowchart-elk', title)),
-    });
+    addDetector(
+      'flowchart-elk',
+      (str) => str.startsWith('flowchart-elk'),
+      () => Promise.resolve(getDummyDiagram('flowchart-elk', title))
+    );
     const diagram = await Diagram.fromText('flowchart-elk TD; A-->B');
     expect(diagram).toBeInstanceOf(Diagram);
     expect(diagram.db.getDiagramTitle?.()).toBe(title);
diff --git a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
index e93c954be..c15b474ab 100644
--- a/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
+++ b/packages/mermaid/src/diagrams/architecture/architectureDetector.ts
@@ -19,25 +19,6 @@ const architecture: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Architecture Diagram',
-  description: 'Visualize system architecture and components',
-  examples: [
-    {
-      isDefault: true,
-      code: `architecture-beta
-    group api(cloud)[API]
-
-    service db(database)[Database] in api
-    service disk1(disk)[Storage] in api
-    service disk2(disk)[Storage] in api
-    service server(server)[Server] in api
-
-    db:L -- R:server
-    disk1:T -- B:server
-    disk2:T -- B:db`,
-      title: 'Basic System Architecture',
-    },
-  ],
 };
 
 export default architecture;
diff --git a/packages/mermaid/src/diagrams/block/blockDetector.ts b/packages/mermaid/src/diagrams/block/blockDetector.ts
index fc631db35..c4da643f0 100644
--- a/packages/mermaid/src/diagrams/block/blockDetector.ts
+++ b/packages/mermaid/src/diagrams/block/blockDetector.ts
@@ -15,28 +15,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Block Diagram',
-  description: 'Create block-based visualizations with beta styling',
-  examples: [
-    {
-      isDefault: true,
-      code: `block-beta
-columns 1
-  db(("DB"))
-  blockArrowId6<["&nbsp;&nbsp;&nbsp;"]>(down)
-  block:ID
-    A
-    B["A wide one in the middle"]
-    C
-  end
-  space
-  D
-  ID --> D
-  C --> D
-  style B fill:#969,stroke:#333,stroke-width:4px`,
-      title: 'Basic Block Layout',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts
index 9b6caa90b..b06ab6cb1 100644
--- a/packages/mermaid/src/diagrams/c4/c4Detector.ts
+++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts
@@ -19,48 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'C4 Diagram',
-  description:
-    'Visualize software architecture using the C4 model (Context, Container, Component, Code)',
-  examples: [
-    {
-      isDefault: true,
-      code: `C4Context
-    title System Context diagram for Internet Banking System
-    Enterprise_Boundary(b0, "BankBoundary0") {
-        Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
-        Person(customerB, "Banking Customer B")
-        Person_Ext(customerC, "Banking Customer C", "desc")
-
-        Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
-
-        System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
-
-        Enterprise_Boundary(b1, "BankBoundary") {
-            SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
-
-            System_Boundary(b2, "BankBoundary2") {
-                System(SystemA, "Banking System A")
-                System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts. next line.")
-            }
-
-            System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
-            SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
-
-            Boundary(b3, "BankBoundary3", "boundary") {
-                SystemQueue(SystemF, "Banking System F Queue", "A system of the bank.")
-                SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
-            }
-        }
-    }
-
-    BiRel(customerA, SystemAA, "Uses")
-    BiRel(SystemAA, SystemE, "Uses")
-    Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
-    Rel(SystemC, customerA, "Sends e-mails to")`,
-      title: 'Internet Banking System Context',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/class/classDetector-V2.ts b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
index 2466c7105..1823ad002 100644
--- a/packages/mermaid/src/diagrams/class/classDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/class/classDetector-V2.ts
@@ -24,35 +24,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Class Diagram',
-  description: 'Visualize class structures and relationships in object-oriented programming',
-  examples: [
-    {
-      isDefault: true,
-      code: `classDiagram
-    Animal <|-- Duck
-    Animal <|-- Fish
-    Animal <|-- Zebra
-    Animal : +int age
-    Animal : +String gender
-    Animal: +isMammal()
-    Animal: +mate()
-    class Duck{
-      +String beakColor
-      +swim()
-      +quack()
-    }
-    class Fish{
-      -int sizeInFeet
-      -canEat()
-    }
-    class Zebra{
-      +bool is_wild
-      +run()
-    }`,
-      title: 'Basic Class Inheritance',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/er/erDetector.ts b/packages/mermaid/src/diagrams/er/erDetector.ts
index 23ad0b12b..7da6804e0 100644
--- a/packages/mermaid/src/diagrams/er/erDetector.ts
+++ b/packages/mermaid/src/diagrams/er/erDetector.ts
@@ -19,37 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Entity Relationship Diagram',
-  description: 'Visualize database schemas and relationships between entities',
-  examples: [
-    {
-      isDefault: true,
-      code: `erDiagram
-    CUSTOMER ||--o{ ORDER : places
-    ORDER ||--|{ ORDER_ITEM : contains
-    PRODUCT ||--o{ ORDER_ITEM : includes
-    CUSTOMER {
-        string id
-        string name
-        string email
-    }
-    ORDER {
-        string id
-        date orderDate
-        string status
-    }
-    PRODUCT {
-        string id
-        string name
-        float price
-    }
-    ORDER_ITEM {
-        int quantity
-        float price
-    }`,
-      title: 'Basic ER Schema',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
index 75fad1695..df3f57e47 100644
--- a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
@@ -31,20 +31,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Flowchart',
-  description: 'Visualize flowcharts and directed graphs',
-  examples: [
-    {
-      isDefault: true,
-      code: `flowchart TD
-    A[Christmas] -->|Get money| B(Go shopping)
-    B --> C{Let me think}
-    C -->|One| D[Laptop]
-    C -->|Two| E[iPhone]
-    C -->|Three| F[fa:fa-car Car]`,
-      title: 'Basic Flowchart',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
index e225f16fb..e2f2a9784 100644
--- a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
+++ b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts
@@ -19,23 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Gantt Chart',
-  description: 'Visualize project schedules and timelines',
-  examples: [
-    {
-      isDefault: true,
-      code: `gantt
-    title A Gantt Diagram
-    dateFormat  YYYY-MM-DD
-    section Section
-    A task           :a1, 2014-01-01, 30d
-    Another task     :after a1  , 20d
-    section Another
-    Task in sec      :2014-01-12  , 12d
-    another task      : 24d`,
-      title: 'Basic Project Timeline',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
index a4225d364..ded434a65 100644
--- a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts
@@ -16,29 +16,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Git Graph',
-  description: 'Visualize Git repository history and branch relationships',
-  examples: [
-    {
-      isDefault: true,
-      code: `gitGraph
-    commit
-    branch develop
-    checkout develop
-    commit
-    commit
-    checkout main
-    merge develop
-    commit
-    branch feature
-    checkout feature
-    commit
-    commit
-    checkout main
-    merge feature`,
-      title: 'Basic Git Flow',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/kanban/detector.ts b/packages/mermaid/src/diagrams/kanban/detector.ts
index 3e026f569..3c07ca4df 100644
--- a/packages/mermaid/src/diagrams/kanban/detector.ts
+++ b/packages/mermaid/src/diagrams/kanban/detector.ts
@@ -18,37 +18,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Kanban Diagram',
-  description: 'Visualize work items in a Kanban board',
-  examples: [
-    {
-      isDefault: true,
-      code: `---
-config:
-  kanban:
-    ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
----
-kanban
-  Todo
-    [Create Documentation]
-    docs[Create Blog about the new diagram]
-  [In progress]
-    id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
-  id9[Ready for deploy]
-    id8[Design grammar]@{ assigned: 'knsv' }
-  id10[Ready for test]
-    id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
-    id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
-  id11[Done]
-    id5[define getData]
-    id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
-    id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
-
-  id12[Can't reproduce]
-    id3[Weird flickering in Firefox]
-`,
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts
index c2b71ef37..2b31fc5e8 100644
--- a/packages/mermaid/src/diagrams/mindmap/detector.ts
+++ b/packages/mermaid/src/diagrams/mindmap/detector.ts
@@ -18,32 +18,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Mindmap',
-  description: 'Visualize ideas and concepts in a tree-like structure',
-  examples: [
-    {
-      isDefault: true,
-      code: `mindmap
-  root((mindmap))
-    Origins
-      Long history
-      ::icon(fa fa-book)
-      Popularisation
-        British popular psychology author Tony Buzan
-    Research
-      On effectiveness<br/>and features
-      On Automatic creation
-        Uses
-            Creative techniques
-            Strategic planning
-            Argument mapping
-    Tools
-      Pen and paper
-      Mermaid`,
-    },
-  ],
 };
 
 export default plugin;
-
-// cspell:ignore Buzan
diff --git a/packages/mermaid/src/diagrams/packet/detector.ts b/packages/mermaid/src/diagrams/packet/detector.ts
index dca09201b..5aca92e6c 100644
--- a/packages/mermaid/src/diagrams/packet/detector.ts
+++ b/packages/mermaid/src/diagrams/packet/detector.ts
@@ -19,33 +19,4 @@ export const packet: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Packet Diagram',
-  description: 'Visualize packet data and network traffic',
-  examples: [
-    {
-      isDefault: true,
-      code: `---
-title: "TCP Packet"
----
-packet-beta
-0-15: "Source Port"
-16-31: "Destination Port"
-32-63: "Sequence Number"
-64-95: "Acknowledgment Number"
-96-99: "Data Offset"
-100-105: "Reserved"
-106: "URG"
-107: "ACK"
-108: "PSH"
-109: "RST"
-110: "SYN"
-111: "FIN"
-112-127: "Window"
-128-143: "Checksum"
-144-159: "Urgent Pointer"
-160-191: "(Options and Padding)"
-192-255: "Data (variable length)"
-`,
-    },
-  ],
 };
diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts
index 33e627e2a..f5acd1aa0 100644
--- a/packages/mermaid/src/diagrams/pie/pieDetector.ts
+++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts
@@ -19,16 +19,4 @@ export const pie: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Pie Chart',
-  description: 'Visualize data as proportional segments of a circle',
-  examples: [
-    {
-      isDefault: true,
-      code: `pie title Pets adopted by volunteers
-    "Dogs" : 386
-    "Cats" : 85
-    "Rats" : 15`,
-      title: 'Basic Pie Chart',
-    },
-  ],
 };
diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
index ef9244fc8..9a77ca43a 100644
--- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
+++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts
@@ -19,28 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Quadrant Chart',
-  description: 'Visualize items in a 2x2 matrix based on two variables',
-  examples: [
-    {
-      isDefault: true,
-      code: `quadrantChart
-    title Reach and engagement of campaigns
-    x-axis Low Reach --> High Reach
-    y-axis Low Engagement --> High Engagement
-    quadrant-1 We should expand
-    quadrant-2 Need to promote
-    quadrant-3 Re-evaluate
-    quadrant-4 May be improved
-    Campaign A: [0.3, 0.6]
-    Campaign B: [0.45, 0.23]
-    Campaign C: [0.57, 0.69]
-    Campaign D: [0.78, 0.34]
-    Campaign E: [0.40, 0.34]
-    Campaign F: [0.35, 0.78]`,
-      title: 'Product Positioning',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/radar/detector.ts b/packages/mermaid/src/diagrams/radar/detector.ts
index e1f93f4a4..9c29d0f00 100644
--- a/packages/mermaid/src/diagrams/radar/detector.ts
+++ b/packages/mermaid/src/diagrams/radar/detector.ts
@@ -19,23 +19,4 @@ export const radar: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Radar Diagram',
-  description: 'Visualize data in a radial format',
-  examples: [
-    {
-      isDefault: true,
-      code: `---
-title: "Grades"
----
-radar-beta
-  axis m["Math"], s["Science"], e["English"]
-  axis h["History"], g["Geography"], a["Art"]
-  curve a["Alice"]{85, 90, 80, 70, 75, 90}
-  curve b["Bob"]{70, 75, 85, 80, 90, 85}
-
-  max 100
-  min 0
-`,
-    },
-  ],
 };
diff --git a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
index d764329b9..f8fd33640 100644
--- a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
+++ b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts
@@ -19,28 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Requirement Diagram',
-  description: 'Visualize system requirements and their relationships',
-  examples: [
-    {
-      isDefault: true,
-      code: `requirementDiagram
-
-    requirement test_req {
-    id: 1
-    text: the test text.
-    risk: high
-    verifymethod: test
-    }
-
-    element test_entity {
-    type: simulation
-    }
-
-    test_entity - satisfies -> test_req`,
-      title: 'Basic Requirements',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
index 4f3a8d8ee..73c4d1428 100644
--- a/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
+++ b/packages/mermaid/src/diagrams/sankey/sankeyDetector.ts
@@ -15,89 +15,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Sankey Diagram',
-  description: 'Visualize flow quantities between different stages or processes',
-  examples: [
-    {
-      isDefault: true,
-      code: `---
-config:
-  sankey:
-    showValues: false
----
-sankey-beta
-
-Agricultural 'waste',Bio-conversion,124.729
-Bio-conversion,Liquid,0.597
-Bio-conversion,Losses,26.862
-Bio-conversion,Solid,280.322
-Bio-conversion,Gas,81.144
-Biofuel imports,Liquid,35
-Biomass imports,Solid,35
-Coal imports,Coal,11.606
-Coal reserves,Coal,63.965
-Coal,Solid,75.571
-District heating,Industry,10.639
-District heating,Heating and cooling - commercial,22.505
-District heating,Heating and cooling - homes,46.184
-Electricity grid,Over generation / exports,104.453
-Electricity grid,Heating and cooling - homes,113.726
-Electricity grid,H2 conversion,27.14
-Electricity grid,Industry,342.165
-Electricity grid,Road transport,37.797
-Electricity grid,Agriculture,4.412
-Electricity grid,Heating and cooling - commercial,40.858
-Electricity grid,Losses,56.691
-Electricity grid,Rail transport,7.863
-Electricity grid,Lighting & appliances - commercial,90.008
-Electricity grid,Lighting & appliances - homes,93.494
-Gas imports,NGas,40.719
-Gas reserves,NGas,82.233
-Gas,Heating and cooling - commercial,0.129
-Gas,Losses,1.401
-Gas,Thermal generation,151.891
-Gas,Agriculture,2.096
-Gas,Industry,48.58
-Geothermal,Electricity grid,7.013
-H2 conversion,H2,20.897
-H2 conversion,Losses,6.242
-H2,Road transport,20.897
-Hydro,Electricity grid,6.995
-Liquid,Industry,121.066
-Liquid,International shipping,128.69
-Liquid,Road transport,135.835
-Liquid,Domestic aviation,14.458
-Liquid,International aviation,206.267
-Liquid,Agriculture,3.64
-Liquid,National navigation,33.218
-Liquid,Rail transport,4.413
-Marine algae,Bio-conversion,4.375
-NGas,Gas,122.952
-Nuclear,Thermal generation,839.978
-Oil imports,Oil,504.287
-Oil reserves,Oil,107.703
-Oil,Liquid,611.99
-Other waste,Solid,56.587
-Other waste,Bio-conversion,77.81
-Pumped heat,Heating and cooling - homes,193.026
-Pumped heat,Heating and cooling - commercial,70.672
-Solar PV,Electricity grid,59.901
-Solar Thermal,Heating and cooling - homes,19.263
-Solar,Solar Thermal,19.263
-Solar,Solar PV,59.901
-Solid,Agriculture,0.882
-Solid,Thermal generation,400.12
-Solid,Industry,46.477
-Thermal generation,Electricity grid,525.531
-Thermal generation,Losses,787.129
-Thermal generation,District heating,79.329
-Tidal,Electricity grid,9.452
-UK land based bioenergy,Bio-conversion,182.01
-Wave,Electricity grid,19.013
-Wind,Electricity grid,289.366`,
-      title: 'Energy Flow',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
index 756f565ae..c1df22130 100644
--- a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
+++ b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts
@@ -19,19 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Sequence Diagram',
-  description: 'Visualize interactions between objects over time',
-  examples: [
-    {
-      isDefault: true,
-      code: `sequenceDiagram
-    Alice->>+John: Hello John, how are you?
-    Alice->>+John: John, can you hear me?
-    John-->>-Alice: Hi Alice, I can hear you!
-    John-->>-Alice: I feel great!`,
-      title: 'Basic Sequence',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
index 2bfcad010..5201f3fae 100644
--- a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
+++ b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts
@@ -25,21 +25,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'State Diagram',
-  description: 'Visualize state transitions and behaviors of a system',
-  examples: [
-    {
-      isDefault: true,
-      code: `stateDiagram-v2
-    [*] --> Still
-    Still --> [*]
-    Still --> Moving
-    Moving --> Still
-    Moving --> Crash
-    Crash --> [*]`,
-      title: 'Basic State',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts
index fd947aa0f..a6394bd54 100644
--- a/packages/mermaid/src/diagrams/timeline/detector.ts
+++ b/packages/mermaid/src/diagrams/timeline/detector.ts
@@ -19,21 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'Timeline Diagram',
-  description: 'Visualize events and milestones in chronological order',
-  examples: [
-    {
-      isDefault: true,
-      code: `timeline
-    title History of Social Media Platform
-    2002 : LinkedIn
-    2004 : Facebook
-         : Google
-    2005 : YouTube
-    2006 : Twitter`,
-      title: 'Project Timeline',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
index 84127f279..cb1d1837f 100644
--- a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
+++ b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts
@@ -19,23 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'User Journey Diagram',
-  description: 'Visualize user interactions and experiences with a system',
-  examples: [
-    {
-      isDefault: true,
-      code: `journey
-    title My working day
-    section Go to work
-      Make tea: 5: Me
-      Go upstairs: 3: Me
-      Do work: 1: Me, Cat
-    section Go home
-      Go downstairs: 5: Me
-      Sit down: 5: Me`,
-      title: 'My Working Day',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
index 7e2c02046..08be05b01 100644
--- a/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
+++ b/packages/mermaid/src/diagrams/xychart/xychartDetector.ts
@@ -19,20 +19,6 @@ const plugin: ExternalDiagramDefinition = {
   id,
   detector,
   loader,
-  title: 'XY Chart',
-  description: 'Create scatter plots and line charts with customizable axes',
-  examples: [
-    {
-      isDefault: true,
-      code: `xychart-beta
-    title "Sales Revenue"
-    x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
-    y-axis "Revenue (in $)" 4000 --> 11000
-    bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
-    line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]`,
-      title: 'Sales Revenue',
-    },
-  ],
 };
 
 export default plugin;
diff --git a/packages/mermaid/src/mermaid.ts b/packages/mermaid/src/mermaid.ts
index c4bf74577..661617538 100644
--- a/packages/mermaid/src/mermaid.ts
+++ b/packages/mermaid/src/mermaid.ts
@@ -5,11 +5,7 @@
 import { registerIconPacks } from './rendering-util/icons.js';
 import { dedent } from 'ts-dedent';
 import type { MermaidConfig } from './config.type.js';
-import {
-  detectType,
-  diagramDefinitions,
-  registerLazyLoadedDiagrams,
-} from './diagram-api/detectType.js';
+import { detectType, detectors, registerLazyLoadedDiagrams } from './diagram-api/detectType.js';
 import { addDiagrams } from './diagram-api/diagram-orchestration.js';
 import { loadRegisteredDiagrams } from './diagram-api/loadDiagram.js';
 import type { ExternalDiagramDefinition, SVG, SVGGroup } from './diagram-api/types.js';
@@ -419,15 +415,9 @@ const render: typeof mermaidAPI.render = (id, text, container) => {
   });
 };
 
-const getDiagramData = (): Pick<
-  ExternalDiagramDefinition,
-  'id' | 'title' | 'description' | 'examples'
->[] => {
-  return Object.entries(diagramDefinitions).map(([id, { title, description, examples }]) => ({
+const getDiagramData = (): Pick<ExternalDiagramDefinition, 'id'>[] => {
+  return Object.keys(detectors).map((id) => ({
     id,
-    title,
-    description,
-    examples,
   }));
 };
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 7290deed8..6d04cfd0d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -421,6 +421,12 @@ importers:
         specifier: ^6.0.1
         version: 6.0.1
 
+  packages/mermaid-examples:
+    devDependencies:
+      mermaid:
+        specifier: workspace:*
+        version: link:../mermaid
+
   packages/mermaid-layout-elk:
     dependencies:
       d3:
@@ -3287,6 +3293,9 @@ packages:
   '@types/node@18.19.76':
     resolution: {integrity: sha512-yvR7Q9LdPz2vGpmpJX5LolrgRdWvB67MJKDPSgIIzpFbaf9a1j/f5DnLp5VDyHGMR0QZHlTr1afsD87QCXFHKw==}
 
+  '@types/node@20.17.30':
+    resolution: {integrity: sha512-7zf4YyHA+jvBNfVrk2Gtvs6x7E8V+YDW05bNfG2XkWDJfYRXrTiP/DsB2zSYTaHX0bGIujTBQdMVAhb+j7mwpg==}
+
   '@types/node@22.13.5':
     resolution: {integrity: sha512-+lTU0PxZXn0Dr1NBtC7Y8cR21AJr87dLLU953CWA6pMxxv/UDc7jYAY90upcrie1nRcD6XNG5HOYEDtgW5TxAg==}
 
@@ -9238,6 +9247,9 @@ packages:
   undici-types@5.26.5:
     resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
 
+  undici-types@6.19.8:
+    resolution: {integrity: sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==}
+
   undici-types@6.20.0:
     resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==}
 
@@ -13088,6 +13100,10 @@ snapshots:
     dependencies:
       undici-types: 5.26.5
 
+  '@types/node@20.17.30':
+    dependencies:
+      undici-types: 6.19.8
+
   '@types/node@22.13.5':
     dependencies:
       undici-types: 6.20.0
@@ -17394,7 +17410,7 @@ snapshots:
   jest-util@29.7.0:
     dependencies:
       '@jest/types': 29.6.3
-      '@types/node': 22.13.5
+      '@types/node': 20.17.30
       chalk: 4.1.2
       ci-info: 3.9.0
       graceful-fs: 4.2.11
@@ -20275,6 +20291,8 @@ snapshots:
 
   undici-types@5.26.5: {}
 
+  undici-types@6.19.8: {}
+
   undici-types@6.20.0: {}
 
   undici@5.28.4:

From 7829138fb2c70211e20f2500efb7ac0ed94d9195 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 08:58:31 +0530
Subject: [PATCH 06/45] chore: Update lockfile

---
 pnpm-lock.yaml | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6d04cfd0d..6a9591bb0 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -215,6 +215,12 @@ importers:
         specifier: ^3.0.6
         version: 3.0.6(@types/debug@4.1.12)(@types/node@22.13.5)(@vitest/ui@3.0.6)(jiti@2.4.2)(jsdom@26.0.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0)
 
+  packages/examples:
+    devDependencies:
+      mermaid:
+        specifier: workspace:*
+        version: link:../mermaid
+
   packages/mermaid:
     dependencies:
       '@braintree/sanitize-url':
@@ -421,12 +427,6 @@ importers:
         specifier: ^6.0.1
         version: 6.0.1
 
-  packages/mermaid-examples:
-    devDependencies:
-      mermaid:
-        specifier: workspace:*
-        version: link:../mermaid
-
   packages/mermaid-layout-elk:
     dependencies:
       d3:

From 9b77af540b64dbdc2da69b15fdca32c392827da3 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Sat, 5 Apr 2025 03:33:20 +0000
Subject: [PATCH 07/45] [autofix.ci] apply automated fixes

---
 .../interfaces/ExternalDiagramDefinition.md   | 43 +------------------
 .../setup/mermaid/interfaces/Mermaid.md       | 36 ++++++++--------
 .../setup/mermaid/interfaces/RunOptions.md    | 10 ++---
 docs/config/setup/mermaid/type-aliases/SVG.md |  2 +-
 .../setup/mermaid/type-aliases/SVGGroup.md    |  2 +-
 .../config/setup/mermaid/variables/default.md |  2 +-
 6 files changed, 28 insertions(+), 67 deletions(-)

diff --git a/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
index ac3e4622b..35efcddeb 100644
--- a/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
+++ b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md
@@ -14,39 +14,11 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:94](https://github.com/me
 
 ## Properties
 
-### description?
-
-> `optional` **description**: `string`
-
-Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
-
----
-
 ### detector
 
 > **detector**: `DiagramDetector`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L103)
-
----
-
-### examples?
-
-> `optional` **examples**: `object`\[]
-
-Defined in: [packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)
-
-#### code
-
-> **code**: `string`
-
-#### isDefault?
-
-> `optional` **isDefault**: `boolean`
-
-#### title?
-
-> `optional` **title**: `string`
+Defined in: [packages/mermaid/src/diagram-api/types.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L96)
 
 ---
 
@@ -62,15 +34,4 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:95](https://github.com/me
 
 > **loader**: `DiagramLoader`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:104](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L104)
-
----
-
-### title?
-
-> `optional` **title**: `string`
-
-Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
-
-Title, description, and examples for the diagram are optional only for backwards compatibility.
-It is strongly recommended to provide these values for all new diagrams.
+Defined in: [packages/mermaid/src/diagram-api/types.ts:97](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L97)
diff --git a/docs/config/setup/mermaid/interfaces/Mermaid.md b/docs/config/setup/mermaid/interfaces/Mermaid.md
index 572305a28..9789c28fa 100644
--- a/docs/config/setup/mermaid/interfaces/Mermaid.md
+++ b/docs/config/setup/mermaid/interfaces/Mermaid.md
@@ -10,7 +10,7 @@
 
 # Interface: Mermaid
 
-Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434)
+Defined in: [packages/mermaid/src/mermaid.ts:424](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L424)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/
 
 > **contentLoaded**: () => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:452](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L452)
+Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
 
 \##contentLoaded Callback function that is called when page is loaded. This functions fetches
 configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the
@@ -34,7 +34,7 @@ page.
 
 > **detectType**: (`text`, `config`?) => `string`
 
-Defined in: [packages/mermaid/src/mermaid.ts:454](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L454)
+Defined in: [packages/mermaid/src/mermaid.ts:444](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L444)
 
 Detects the type of the graph text.
 
@@ -88,13 +88,13 @@ A graph definition key
 
 ### getDiagramData()
 
-> **getDiagramData**: () => `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"` | `"title"` | `"description"` | `"examples"`>\[]
+> **getDiagramData**: () => `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"`>\[]
 
-Defined in: [packages/mermaid/src/mermaid.ts:456](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L456)
+Defined in: [packages/mermaid/src/mermaid.ts:446](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L446)
 
 #### Returns
 
-`Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"` | `"title"` | `"description"` | `"examples"`>\[]
+`Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"`>\[]
 
 ---
 
@@ -102,7 +102,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:456](https://github.com/mermaid-js/
 
 > **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:447](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L447)
+Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
 
 ## init
 
@@ -150,7 +150,7 @@ Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
 
 > **initialize**: (`config`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:451](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L451)
+Defined in: [packages/mermaid/src/mermaid.ts:441](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L441)
 
 Used to set configurations for mermaid.
 This function should be called before the run function.
@@ -173,7 +173,7 @@ Configuration object for mermaid.
 
 > **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](MermaidConfig.md); `getConfig`: () => [`MermaidConfig`](MermaidConfig.md); `getDiagramFromText`: (`text`, `metadata`) => `Promise`<`Diagram`>; `getSiteConfig`: () => [`MermaidConfig`](MermaidConfig.md); `globalReset`: () => `void`; `initialize`: (`userOptions`) => `void`; `parse`: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>; `render`: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>; `reset`: () => `void`; `setConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); `updateSiteConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); }>
 
-Defined in: [packages/mermaid/src/mermaid.ts:441](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L441)
+Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
 
 **`Internal`**
 
@@ -187,7 +187,7 @@ Use [parse](Mermaid.md#parse) and [render](Mermaid.md#render) instead. Please [o
 
 > **parse**: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
+Defined in: [packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432)
 
 Parse the text and validate the syntax.
 
@@ -255,7 +255,7 @@ Error if the diagram is invalid and parseOptions.suppressErrors is false or not
 
 > `optional` **parseError**: [`ParseErrorFunction`](../type-aliases/ParseErrorFunction.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
+Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
 
 ---
 
@@ -263,7 +263,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/
 
 > **registerExternalDiagrams**: (`diagrams`, `opts`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:450](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L450)
+Defined in: [packages/mermaid/src/mermaid.ts:440](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L440)
 
 Used to register external diagram types.
 
@@ -293,7 +293,7 @@ If opts.lazyLoad is false, the diagrams will be loaded immediately.
 
 > **registerIconPacks**: (`iconLoaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:455](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L455)
+Defined in: [packages/mermaid/src/mermaid.ts:445](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L445)
 
 #### Parameters
 
@@ -311,7 +311,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:455](https://github.com/mermaid-js/
 
 > **registerLayoutLoaders**: (`loaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)
+Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439)
 
 #### Parameters
 
@@ -329,7 +329,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/
 
 > **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:443](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L443)
+Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433)
 
 #### Parameters
 
@@ -361,7 +361,7 @@ Deprecated for external use.
 
 > **run**: (`options`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:448](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L448)
+Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
 
 ## run
 
@@ -405,7 +405,7 @@ Optional runtime configs
 
 > **setParseErrorHandler**: (`parseErrorHandler`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:453](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L453)
+Defined in: [packages/mermaid/src/mermaid.ts:443](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L443)
 
 ## setParseErrorHandler Alternative to directly setting parseError using:
 
@@ -436,4 +436,4 @@ New parseError() callback.
 
 > **startOnLoad**: `boolean`
 
-Defined in: [packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435)
+Defined in: [packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
diff --git a/docs/config/setup/mermaid/interfaces/RunOptions.md b/docs/config/setup/mermaid/interfaces/RunOptions.md
index 850f8cba9..ecd679aa5 100644
--- a/docs/config/setup/mermaid/interfaces/RunOptions.md
+++ b/docs/config/setup/mermaid/interfaces/RunOptions.md
@@ -10,7 +10,7 @@
 
 # Interface: RunOptions
 
-Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
+Defined in: [packages/mermaid/src/mermaid.ts:41](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L41)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/m
 
 > `optional` **nodes**: `ArrayLike`<`HTMLElement`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
+Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
 
 The nodes to render. If this is set, `querySelector` will be ignored.
 
@@ -28,7 +28,7 @@ The nodes to render. If this is set, `querySelector` will be ignored.
 
 > `optional` **postRenderCallback**: (`id`) => `unknown`
 
-Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
+Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
 
 A callback to call after each diagram is rendered.
 
@@ -48,7 +48,7 @@ A callback to call after each diagram is rendered.
 
 > `optional` **querySelector**: `string`
 
-Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
+Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
 
 The query selector to use when finding elements to render. Default: `".mermaid"`.
 
@@ -58,6 +58,6 @@ The query selector to use when finding elements to render. Default: `".mermaid"`
 
 > `optional` **suppressErrors**: `boolean`
 
-Defined in: [packages/mermaid/src/mermaid.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L61)
+Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
 
 If `true`, errors will be logged to the console, but not thrown. Default: `false`
diff --git a/docs/config/setup/mermaid/type-aliases/SVG.md b/docs/config/setup/mermaid/type-aliases/SVG.md
index bcba8797e..8bfb7bda0 100644
--- a/docs/config/setup/mermaid/type-aliases/SVG.md
+++ b/docs/config/setup/mermaid/type-aliases/SVG.md
@@ -12,4 +12,4 @@
 
 > **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:133](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L133)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:126](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L126)
diff --git a/docs/config/setup/mermaid/type-aliases/SVGGroup.md b/docs/config/setup/mermaid/type-aliases/SVGGroup.md
index ab8559a66..5e53052fd 100644
--- a/docs/config/setup/mermaid/type-aliases/SVGGroup.md
+++ b/docs/config/setup/mermaid/type-aliases/SVGGroup.md
@@ -12,4 +12,4 @@
 
 > **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`>
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L135)
+Defined in: [packages/mermaid/src/diagram-api/types.ts:128](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L128)
diff --git a/docs/config/setup/mermaid/variables/default.md b/docs/config/setup/mermaid/variables/default.md
index 8b437eb6a..d375684c8 100644
--- a/docs/config/setup/mermaid/variables/default.md
+++ b/docs/config/setup/mermaid/variables/default.md
@@ -12,4 +12,4 @@
 
 > `const` **default**: [`Mermaid`](../interfaces/Mermaid.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:459](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L459)
+Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)

From 695b5b2fb26cf7d8b398b1628ac5cf20fd0d0e57 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 09:10:58 +0530
Subject: [PATCH 08/45] fix: Build script

---
 .build/common.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.build/common.ts b/.build/common.ts
index 7ca354c37..efd0e3a85 100644
--- a/.build/common.ts
+++ b/.build/common.ts
@@ -33,7 +33,7 @@ export const packageOptions = {
     packageName: 'mermaid-layout-elk',
     file: 'layouts.ts',
   },
-  'mermaid-examples': {
+  examples: {
     name: 'mermaid-examples',
     packageName: 'examples',
     file: 'index.ts',

From a25ee49edda8365b7303c6e831f6cb3d89e63f7e Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 09:11:18 +0530
Subject: [PATCH 09/45] test: Add visual testing for examples

---
 .../integration/rendering/examples.spec.ts    |  7 ++++
 cypress/platform/examples.html                | 36 +++++++++++++++++++
 2 files changed, 43 insertions(+)
 create mode 100644 cypress/integration/rendering/examples.spec.ts
 create mode 100644 cypress/platform/examples.html

diff --git a/cypress/integration/rendering/examples.spec.ts b/cypress/integration/rendering/examples.spec.ts
new file mode 100644
index 000000000..8431d7803
--- /dev/null
+++ b/cypress/integration/rendering/examples.spec.ts
@@ -0,0 +1,7 @@
+import { urlSnapshotTest } from '../../helpers/util.js';
+
+describe.skip('Examples', () => {
+  it('should render all examples', () => {
+    urlSnapshotTest('http://localhost:9000/examples.html');
+  });
+});
diff --git a/cypress/platform/examples.html b/cypress/platform/examples.html
new file mode 100644
index 000000000..3add3da46
--- /dev/null
+++ b/cypress/platform/examples.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Examples</title>
+  </head>
+  <body>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
+      import { diagramData } from './mermaid-examples.esm.mjs';
+      for (const d of diagramData) {
+        const div = document.createElement('div');
+        const h1 = document.createElement('h1');
+        h1.appendChild(document.createTextNode(d.name));
+        div.appendChild(h1);
+        div.appendChild(document.createTextNode(d.description));
+        for (const example of d.examples) {
+          const pre = document.createElement('pre');
+          pre.classList.add('mermaid');
+          pre.textContent = example.code;
+          div.appendChild(pre);
+        }
+        document.body.appendChild(div);
+      }
+      mermaid.initialize({
+        startOnLoad: false,
+        logLevel: 0,
+      });
+      await mermaid.run();
+      if (window.Cypress) {
+        window.rendered = true;
+      }
+    </script>
+  </body>
+</html>

From 28bdbbca1af456096baa6eea5b110a18845d7d08 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 09:17:52 +0530
Subject: [PATCH 10/45] chore: Fix examples exports

---
 packages/examples/package.json  | 13 ++++++++++---
 packages/examples/tsconfig.json |  1 -
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/packages/examples/package.json b/packages/examples/package.json
index 4200804ca..663b3633f 100644
--- a/packages/examples/package.json
+++ b/packages/examples/package.json
@@ -4,9 +4,16 @@
   "description": "Mermaid examples package",
   "author": "Sidharth Vinod",
   "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "module": "./dist/mermaid-examples.core.mjs",
+  "types": "./dist/mermaid.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/mermaid-examples.core.mjs",
+      "default": "./dist/mermaid-examples.core.mjs"
+    },
+    "./*": "./*"
+  },
   "files": [
     "dist"
   ],
diff --git a/packages/examples/tsconfig.json b/packages/examples/tsconfig.json
index b3b003dc5..51a4b3b96 100644
--- a/packages/examples/tsconfig.json
+++ b/packages/examples/tsconfig.json
@@ -3,7 +3,6 @@
   "compilerOptions": {
     "outDir": "./dist",
     "rootDir": "./src",
-    "composite": true,
     "module": "NodeNext",
     "moduleResolution": "NodeNext"
   },

From febae345fc0266be1e0abe32ca84d38e2861db91 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 09:25:31 +0530
Subject: [PATCH 11/45] chore: Fix file extension

---
 cypress/integration/rendering/examples.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cypress/integration/rendering/examples.spec.ts b/cypress/integration/rendering/examples.spec.ts
index 8431d7803..e0006f572 100644
--- a/cypress/integration/rendering/examples.spec.ts
+++ b/cypress/integration/rendering/examples.spec.ts
@@ -1,4 +1,4 @@
-import { urlSnapshotTest } from '../../helpers/util.js';
+import { urlSnapshotTest } from '../../helpers/util.ts';
 
 describe.skip('Examples', () => {
   it('should render all examples', () => {

From 5acbd7e762469d9d89a9c77faf6617ee13367f3a Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 13:30:08 +0530
Subject: [PATCH 12/45] docs: Add changeset

---
 .changeset/gold-olives-rule.md | 7 +++++++
 1 file changed, 7 insertions(+)
 create mode 100644 .changeset/gold-olives-rule.md

diff --git a/.changeset/gold-olives-rule.md b/.changeset/gold-olives-rule.md
new file mode 100644
index 000000000..43d2ed9e9
--- /dev/null
+++ b/.changeset/gold-olives-rule.md
@@ -0,0 +1,7 @@
+---
+'@mermaid-js/examples': minor
+'mermaid': minor
+---
+
+feat: Add examples for diagrams in the `@mermaid-js/examples` package
+feat: Add `getDiagramData` to `mermaid`, which returns all the registered diagram IDs in mermaid

From 43e66a60896ff5874cb67308c8e7172b0c2bb1a8 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sat, 5 Apr 2025 14:02:58 +0530
Subject: [PATCH 13/45] chore: Unskip example test

---
 cypress/integration/rendering/examples.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cypress/integration/rendering/examples.spec.ts b/cypress/integration/rendering/examples.spec.ts
index e0006f572..cfe7999a3 100644
--- a/cypress/integration/rendering/examples.spec.ts
+++ b/cypress/integration/rendering/examples.spec.ts
@@ -1,6 +1,6 @@
 import { urlSnapshotTest } from '../../helpers/util.ts';
 
-describe.skip('Examples', () => {
+describe('Examples', () => {
   it('should render all examples', () => {
     urlSnapshotTest('http://localhost:9000/examples.html');
   });

From da6937f47490cc4d869465578cdd4a8cbfa5825d Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Apr 2025 10:08:06 +0530
Subject: [PATCH 14/45] temp: Revert all changes is cypress folder

---
 .../integration/rendering/examples.spec.ts    |  7 ----
 cypress/platform/examples.html                | 36 -------------------
 cypress/platform/sidv.html                    |  1 -
 3 files changed, 44 deletions(-)
 delete mode 100644 cypress/integration/rendering/examples.spec.ts
 delete mode 100644 cypress/platform/examples.html

diff --git a/cypress/integration/rendering/examples.spec.ts b/cypress/integration/rendering/examples.spec.ts
deleted file mode 100644
index cfe7999a3..000000000
--- a/cypress/integration/rendering/examples.spec.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { urlSnapshotTest } from '../../helpers/util.ts';
-
-describe('Examples', () => {
-  it('should render all examples', () => {
-    urlSnapshotTest('http://localhost:9000/examples.html');
-  });
-});
diff --git a/cypress/platform/examples.html b/cypress/platform/examples.html
deleted file mode 100644
index 3add3da46..000000000
--- a/cypress/platform/examples.html
+++ /dev/null
@@ -1,36 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Examples</title>
-  </head>
-  <body>
-    <script type="module">
-      import mermaid from './mermaid.esm.mjs';
-      import { diagramData } from './mermaid-examples.esm.mjs';
-      for (const d of diagramData) {
-        const div = document.createElement('div');
-        const h1 = document.createElement('h1');
-        h1.appendChild(document.createTextNode(d.name));
-        div.appendChild(h1);
-        div.appendChild(document.createTextNode(d.description));
-        for (const example of d.examples) {
-          const pre = document.createElement('pre');
-          pre.classList.add('mermaid');
-          pre.textContent = example.code;
-          div.appendChild(pre);
-        }
-        document.body.appendChild(div);
-      }
-      mermaid.initialize({
-        startOnLoad: false,
-        logLevel: 0,
-      });
-      await mermaid.run();
-      if (window.Cypress) {
-        window.rendered = true;
-      }
-    </script>
-  </body>
-</html>
diff --git a/cypress/platform/sidv.html b/cypress/platform/sidv.html
index fc505402d..b0a1699da 100644
--- a/cypress/platform/sidv.html
+++ b/cypress/platform/sidv.html
@@ -40,7 +40,6 @@ graph TB
       const el = document.getElementById('d2');
       const { svg } = await mermaid.render('d22', value);
       console.log(svg);
-      console.log(mermaid.getDiagramData());
       el.innerHTML = svg;
       // mermaid.test1('first_slow', 1200).then((r) => console.info(r));
       // mermaid.test1('second_fast', 200).then((r) => console.info(r));

From b053a88993f466a718717c137d09b2310b6f324d Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Apr 2025 17:07:56 +0530
Subject: [PATCH 15/45] docs: Add steps to add examples for new diagrams

---
 docs/community/new-diagram.md                      | 10 ++++++++++
 packages/mermaid/src/docs/community/new-diagram.md | 10 ++++++++++
 2 files changed, 20 insertions(+)

diff --git a/docs/community/new-diagram.md b/docs/community/new-diagram.md
index c214afa64..847f3ef35 100644
--- a/docs/community/new-diagram.md
+++ b/docs/community/new-diagram.md
@@ -111,3 +111,13 @@ const themes = {
 ```
 
 The actual options and values for the colors are defined in **src/theme/theme-\[xyz].js**. If you provide the options your diagram needs in the existing theme files then the theming will work smoothly without hiccups.
+
+## Examples
+
+The `@mermaid-js/examples` package contains a collection of examples that are used by tools like mermaid.live to help users get started with the new diagram.
+
+You can duplicate an existing diagram example file, eg: `packages/examples/src/examples/flowchart.ts`, and modify it with details specific to your diagram.
+
+Then you can import the example in the `packages/examples/src/index.ts` file and add it to the `examples` array.
+
+Each diagram should have at least one example, and that should be marked as default. It is good to add more examples to showcase different features of the diagram.
diff --git a/packages/mermaid/src/docs/community/new-diagram.md b/packages/mermaid/src/docs/community/new-diagram.md
index 16504ca32..147caa121 100644
--- a/packages/mermaid/src/docs/community/new-diagram.md
+++ b/packages/mermaid/src/docs/community/new-diagram.md
@@ -106,3 +106,13 @@ const themes = {
 ```
 
 The actual options and values for the colors are defined in **src/theme/theme-[xyz].js**. If you provide the options your diagram needs in the existing theme files then the theming will work smoothly without hiccups.
+
+## Examples
+
+The `@mermaid-js/examples` package contains a collection of examples that are used by tools like mermaid.live to help users get started with the new diagram.
+
+You can duplicate an existing diagram example file, eg: `packages/examples/src/examples/flowchart.ts`, and modify it with details specific to your diagram.
+
+Then you can import the example in the `packages/examples/src/index.ts` file and add it to the `examples` array.
+
+Each diagram should have at least one example, and that should be marked as default. It is good to add more examples to showcase different features of the diagram.

From 2e5d955e77520b63a3b5ae2a960389d64de6a6bc Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <github@sidharth.dev>
Date: Tue, 8 Apr 2025 04:39:41 -0700
Subject: [PATCH 16/45] Update packages/examples/src/examples/kanban.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 packages/examples/src/examples/kanban.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/examples/src/examples/kanban.ts b/packages/examples/src/examples/kanban.ts
index c1478dccb..245ecd04c 100644
--- a/packages/examples/src/examples/kanban.ts
+++ b/packages/examples/src/examples/kanban.ts
@@ -18,7 +18,7 @@ kanban
     [Create Documentation]
     docs[Create Blog about the new diagram]
   [In progress]
-    id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
+    id6[Create renderer so that it works in all cases. We also add some extra text here for testing purposes. And some more just for the extra flare.]
   id9[Ready for deploy]
     id8[Design grammar]@{ assigned: 'knsv' }
   id10[Ready for test]

From 3e6f680df2d89ddbd4d9570d1881815cb7704867 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Apr 2025 20:14:36 +0530
Subject: [PATCH 17/45] chore: Reorder fields in examples

---
 packages/examples/src/examples/architecture.ts   | 2 +-
 packages/examples/src/examples/block.ts          | 2 +-
 packages/examples/src/examples/c4.ts             | 2 +-
 packages/examples/src/examples/class.ts          | 2 +-
 packages/examples/src/examples/er.ts             | 2 +-
 packages/examples/src/examples/flowchart.ts      | 2 +-
 packages/examples/src/examples/gantt.ts          | 2 +-
 packages/examples/src/examples/git.ts            | 2 +-
 packages/examples/src/examples/kanban.ts         | 2 +-
 packages/examples/src/examples/mindmap.ts        | 2 +-
 packages/examples/src/examples/packet.ts         | 2 +-
 packages/examples/src/examples/pie.ts            | 2 +-
 packages/examples/src/examples/quadrant-chart.ts | 2 +-
 packages/examples/src/examples/radar.ts          | 2 +-
 packages/examples/src/examples/sankey.ts         | 2 +-
 packages/examples/src/examples/sequence.ts       | 2 +-
 packages/examples/src/examples/timeline.ts       | 2 +-
 packages/examples/src/examples/user-journey.ts   | 2 +-
 packages/examples/src/examples/xychart.ts        | 2 +-
 19 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/packages/examples/src/examples/architecture.ts b/packages/examples/src/examples/architecture.ts
index 21e6f71c1..d2b53d26c 100644
--- a/packages/examples/src/examples/architecture.ts
+++ b/packages/examples/src/examples/architecture.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Basic System Architecture',
+      isDefault: true,
       code: `architecture-beta
     group api(cloud)[API]
 
@@ -18,7 +19,6 @@ export default {
     db:L -- R:server
     disk1:T -- B:server
     disk2:T -- B:db`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/block.ts b/packages/examples/src/examples/block.ts
index a2b4f3dde..4ea374b52 100644
--- a/packages/examples/src/examples/block.ts
+++ b/packages/examples/src/examples/block.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Basic Block Layout',
+      isDefault: true,
       code: `block-beta
 columns 1
   db(("DB"))
@@ -21,7 +22,6 @@ columns 1
   ID --> D
   C --> D
   style B fill:#969,stroke:#333,stroke-width:4px`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/c4.ts b/packages/examples/src/examples/c4.ts
index dcfdb48e9..40ea86bc8 100644
--- a/packages/examples/src/examples/c4.ts
+++ b/packages/examples/src/examples/c4.ts
@@ -7,6 +7,7 @@ export default {
     'Visualize software architecture using the C4 model (Context, Container, Component, Code)',
   examples: [
     {
+      title: 'Internet Banking System Context',
       isDefault: true,
       code: `C4Context
     title System Context diagram for Internet Banking System
@@ -41,7 +42,6 @@ export default {
     BiRel(SystemAA, SystemE, "Uses")
     Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
     Rel(SystemC, customerA, "Sends e-mails to")`,
-      title: 'Internet Banking System Context',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/class.ts b/packages/examples/src/examples/class.ts
index 6d3cebce5..41d54bb3a 100644
--- a/packages/examples/src/examples/class.ts
+++ b/packages/examples/src/examples/class.ts
@@ -6,6 +6,7 @@ export default {
   description: 'Visualize class structures and relationships in object-oriented programming',
   examples: [
     {
+      title: 'Basic Class Inheritance',
       isDefault: true,
       code: `classDiagram
     Animal <|-- Duck
@@ -28,7 +29,6 @@ export default {
       +bool is_wild
       +run()
     }`,
-      title: 'Basic Class Inheritance',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/er.ts b/packages/examples/src/examples/er.ts
index 75e2e0b59..faa36f3c2 100644
--- a/packages/examples/src/examples/er.ts
+++ b/packages/examples/src/examples/er.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Basic ER Schema',
+      isDefault: true,
       code: `erDiagram
     CUSTOMER ||--o{ ORDER : places
     ORDER ||--|{ ORDER_ITEM : contains
@@ -30,7 +31,6 @@ export default {
         int quantity
         float price
     }`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/flowchart.ts b/packages/examples/src/examples/flowchart.ts
index 3f9bbadab..655e5795e 100644
--- a/packages/examples/src/examples/flowchart.ts
+++ b/packages/examples/src/examples/flowchart.ts
@@ -6,6 +6,7 @@ export default {
   description: 'Visualize flowcharts and directed graphs',
   examples: [
     {
+      title: 'Basic Flowchart',
       isDefault: true,
       code: `flowchart TD
     A[Christmas] -->|Get money| B(Go shopping)
@@ -13,7 +14,6 @@ export default {
     C -->|One| D[Laptop]
     C -->|Two| E[iPhone]
     C -->|Three| F[fa:fa-car Car]`,
-      title: 'Basic Flowchart',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/gantt.ts b/packages/examples/src/examples/gantt.ts
index c1e4cbc62..989eac572 100644
--- a/packages/examples/src/examples/gantt.ts
+++ b/packages/examples/src/examples/gantt.ts
@@ -6,6 +6,7 @@ export default {
   description: 'Visualize project schedules and timelines',
   examples: [
     {
+      title: 'Basic Project Timeline',
       isDefault: true,
       code: `gantt
     title A Gantt Diagram
@@ -16,7 +17,6 @@ export default {
     section Another
     Task in sec      :2014-01-12  , 12d
     another task      : 24d`,
-      title: 'Basic Project Timeline',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/git.ts b/packages/examples/src/examples/git.ts
index 05e6df208..64ba5df82 100644
--- a/packages/examples/src/examples/git.ts
+++ b/packages/examples/src/examples/git.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Basic Git Flow',
+      isDefault: true,
       code: `gitGraph
     commit
     branch develop
@@ -22,7 +23,6 @@ export default {
     commit
     checkout main
     merge feature`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/kanban.ts b/packages/examples/src/examples/kanban.ts
index 245ecd04c..fdc0b35e6 100644
--- a/packages/examples/src/examples/kanban.ts
+++ b/packages/examples/src/examples/kanban.ts
@@ -6,8 +6,8 @@ export default {
   description: 'Visualize work items in a Kanban board',
   examples: [
     {
-      isDefault: true,
       title: 'Kanban Diagram',
+      isDefault: true,
       code: `---
 config:
   kanban:
diff --git a/packages/examples/src/examples/mindmap.ts b/packages/examples/src/examples/mindmap.ts
index 3684f736b..cba39ef91 100644
--- a/packages/examples/src/examples/mindmap.ts
+++ b/packages/examples/src/examples/mindmap.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Basic Mindmap',
+      isDefault: true,
       code: `mindmap
   root((mindmap))
     Origins
@@ -24,7 +25,6 @@ export default {
     Tools
       Pen and paper
       Mermaid`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/packet.ts b/packages/examples/src/examples/packet.ts
index 062a6a3df..0ec0a32d2 100644
--- a/packages/examples/src/examples/packet.ts
+++ b/packages/examples/src/examples/packet.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'TCP Packet',
+      isDefault: true,
       code: `---
 title: "TCP Packet"
 ---
@@ -28,7 +29,6 @@ packet-beta
 144-159: "Urgent Pointer"
 160-191: "(Options and Padding)"
 192-255: "Data (variable length)"`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/pie.ts b/packages/examples/src/examples/pie.ts
index 2396059f9..d75fa5cf3 100644
--- a/packages/examples/src/examples/pie.ts
+++ b/packages/examples/src/examples/pie.ts
@@ -7,11 +7,11 @@ export default {
   examples: [
     {
       title: 'Basic Pie Chart',
+      isDefault: true,
       code: `pie title Pets adopted by volunteers
     "Dogs" : 386
     "Cats" : 85
     "Rats" : 15`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/quadrant-chart.ts b/packages/examples/src/examples/quadrant-chart.ts
index 8539c16ae..c013f57d6 100644
--- a/packages/examples/src/examples/quadrant-chart.ts
+++ b/packages/examples/src/examples/quadrant-chart.ts
@@ -6,6 +6,7 @@ export default {
   description: 'Visualize items in a 2x2 matrix based on two variables',
   examples: [
     {
+      title: 'Product Positioning',
       isDefault: true,
       code: `quadrantChart
     title Reach and engagement of campaigns
@@ -21,7 +22,6 @@ export default {
     Campaign D: [0.78, 0.34]
     Campaign E: [0.40, 0.34]
     Campaign F: [0.35, 0.78]`,
-      title: 'Product Positioning',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/radar.ts b/packages/examples/src/examples/radar.ts
index 1b0981be9..4798ffe17 100644
--- a/packages/examples/src/examples/radar.ts
+++ b/packages/examples/src/examples/radar.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Student Grades',
+      isDefault: true,
       code: `---
 title: "Grades"
 ---
@@ -19,7 +20,6 @@ radar-beta
   max 100
   min 0
 `,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/sankey.ts b/packages/examples/src/examples/sankey.ts
index 0ac46836f..99a2c07be 100644
--- a/packages/examples/src/examples/sankey.ts
+++ b/packages/examples/src/examples/sankey.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'Energy Flow',
+      isDefault: true,
       code: `---
 config:
   sankey:
@@ -82,7 +83,6 @@ Tidal,Electricity grid,9.452
 UK land based bioenergy,Bio-conversion,182.01
 Wave,Electricity grid,19.013
 Wind,Electricity grid,289.366`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/sequence.ts b/packages/examples/src/examples/sequence.ts
index 37e264510..7110e6f3d 100644
--- a/packages/examples/src/examples/sequence.ts
+++ b/packages/examples/src/examples/sequence.ts
@@ -7,12 +7,12 @@ export default {
   examples: [
     {
       title: 'Basic Sequence',
+      isDefault: true,
       code: `sequenceDiagram
     Alice->>+John: Hello John, how are you?
     Alice->>+John: John, can you hear me?
     John-->>-Alice: Hi Alice, I can hear you!
     John-->>-Alice: I feel great!`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/timeline.ts b/packages/examples/src/examples/timeline.ts
index 2b7dbc4d1..87b604422 100644
--- a/packages/examples/src/examples/timeline.ts
+++ b/packages/examples/src/examples/timeline.ts
@@ -6,6 +6,7 @@ export default {
   description: 'Visualize events and milestones in chronological order',
   examples: [
     {
+      title: 'Project Timeline',
       isDefault: true,
       code: `timeline
     title History of Social Media Platform
@@ -14,7 +15,6 @@ export default {
          : Google
     2005 : YouTube
     2006 : Twitter`,
-      title: 'Project Timeline',
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/user-journey.ts b/packages/examples/src/examples/user-journey.ts
index c2d7a3b15..9c3ccec17 100644
--- a/packages/examples/src/examples/user-journey.ts
+++ b/packages/examples/src/examples/user-journey.ts
@@ -7,6 +7,7 @@ export default {
   examples: [
     {
       title: 'My Working Day',
+      isDefault: true,
       code: `journey
     title My working day
     section Go to work
@@ -16,7 +17,6 @@ export default {
     section Go home
       Go downstairs: 5: Me
       Sit down: 5: Me`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;
diff --git a/packages/examples/src/examples/xychart.ts b/packages/examples/src/examples/xychart.ts
index a45821edd..5fb692b46 100644
--- a/packages/examples/src/examples/xychart.ts
+++ b/packages/examples/src/examples/xychart.ts
@@ -7,13 +7,13 @@ export default {
   examples: [
     {
       title: 'Sales Revenue',
+      isDefault: true,
       code: `xychart-beta
     title "Sales Revenue"
     x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
     y-axis "Revenue (in $)" 4000 --> 11000
     bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
     line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]`,
-      isDefault: true,
     },
   ],
 } satisfies DiagramMetadata;

From 94c099caa1649f2c234ae40255d077477fcb31b9 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 17 Apr 2025 21:26:10 +0530
Subject: [PATCH 18/45] docs: Update kanban example

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/examples/src/examples/kanban.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/examples/src/examples/kanban.ts b/packages/examples/src/examples/kanban.ts
index fdc0b35e6..480059fb8 100644
--- a/packages/examples/src/examples/kanban.ts
+++ b/packages/examples/src/examples/kanban.ts
@@ -11,7 +11,7 @@ export default {
       code: `---
 config:
   kanban:
-    ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
+    ticketBaseUrl: 'https://github.com/mermaid-js/mermaid/issues/#TICKET#'
 ---
 kanban
   Todo
@@ -22,12 +22,12 @@ kanban
   id9[Ready for deploy]
     id8[Design grammar]@{ assigned: 'knsv' }
   id10[Ready for test]
-    id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
+    id4[Create parsing tests]@{ ticket: 2038, assigned: 'K.Sveidqvist', priority: 'High' }
     id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
   id11[Done]
     id5[define getData]
-    id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
-    id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
+    id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: 2036, priority: 'Very High'}
+    id3[Update DB function]@{ ticket: 2037, assigned: knsv, priority: 'High' }
 
   id12[Can't reproduce]
     id3[Weird flickering in Firefox]

From 43ad4519407a59aeba806a7f67247817f167f50e Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 17 Apr 2025 21:26:46 +0530
Subject: [PATCH 19/45] fix: Remove unnecessary export from package.json

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/examples/package.json | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/examples/package.json b/packages/examples/package.json
index 663b3633f..dd7fcc2c4 100644
--- a/packages/examples/package.json
+++ b/packages/examples/package.json
@@ -11,8 +11,7 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/mermaid-examples.core.mjs",
       "default": "./dist/mermaid-examples.core.mjs"
-    },
-    "./*": "./*"
+    }
   },
   "files": [
     "dist"

From f43398dd446b066d6bfa3468f8b1636ade455149 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <github@sidharth.dev>
Date: Thu, 17 Apr 2025 08:57:53 -0700
Subject: [PATCH 20/45] Update packages/examples/tsconfig.json

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/examples/tsconfig.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/examples/tsconfig.json b/packages/examples/tsconfig.json
index 51a4b3b96..320d730e1 100644
--- a/packages/examples/tsconfig.json
+++ b/packages/examples/tsconfig.json
@@ -3,8 +3,8 @@
   "compilerOptions": {
     "outDir": "./dist",
     "rootDir": "./src",
-    "module": "NodeNext",
-    "moduleResolution": "NodeNext"
+    "module": "Node16",
+    "moduleResolution": "Node16"
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "dist"]

From f006718e56c736010d3760ca83f4d3b0f7be0afa Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 17 Apr 2025 21:30:48 +0530
Subject: [PATCH 21/45] chore: Change `getDiagramData` to
 `getRegisteredDiagramsMetadata`

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/mermaid/src/mermaid.ts | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/mermaid/src/mermaid.ts b/packages/mermaid/src/mermaid.ts
index 661617538..c8d57325f 100644
--- a/packages/mermaid/src/mermaid.ts
+++ b/packages/mermaid/src/mermaid.ts
@@ -415,7 +415,12 @@ const render: typeof mermaidAPI.render = (id, text, container) => {
   });
 };
 
-const getDiagramData = (): Pick<ExternalDiagramDefinition, 'id'>[] => {
+/**
+ * Gets the metadata for all registered diagrams.
+ * Currently only the id is returned.
+ * @returns An array of objects with the id of the diagram.
+ */
+const getRegisteredDiagramsMetadata = (): Pick<ExternalDiagramDefinition, 'id'>[] => {
   return Object.keys(detectors).map((id) => ({
     id,
   }));
@@ -443,7 +448,7 @@ export interface Mermaid {
   setParseErrorHandler: typeof setParseErrorHandler;
   detectType: typeof detectType;
   registerIconPacks: typeof registerIconPacks;
-  getDiagramData: typeof getDiagramData;
+  getRegisteredDiagramsMetadata: typeof getRegisteredDiagramsMetadata;
 }
 
 const mermaid: Mermaid = {
@@ -461,7 +466,7 @@ const mermaid: Mermaid = {
   setParseErrorHandler,
   detectType,
   registerIconPacks,
-  getDiagramData,
+  getRegisteredDiagramsMetadata,
 };
 
 export default mermaid;

From 4936ef5c306d2f892cca9a95a5deac4af6d4882b Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 17 Apr 2025 21:32:10 +0530
Subject: [PATCH 22/45] chore: Split changeset

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 .changeset/gold-olives-rule.md     | 2 --
 .changeset/platinum-olives-rule.md | 5 +++++
 2 files changed, 5 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/platinum-olives-rule.md

diff --git a/.changeset/gold-olives-rule.md b/.changeset/gold-olives-rule.md
index 43d2ed9e9..0059d1840 100644
--- a/.changeset/gold-olives-rule.md
+++ b/.changeset/gold-olives-rule.md
@@ -1,7 +1,5 @@
 ---
-'@mermaid-js/examples': minor
 'mermaid': minor
 ---
 
-feat: Add examples for diagrams in the `@mermaid-js/examples` package
 feat: Add `getDiagramData` to `mermaid`, which returns all the registered diagram IDs in mermaid
diff --git a/.changeset/platinum-olives-rule.md b/.changeset/platinum-olives-rule.md
new file mode 100644
index 000000000..af70d6538
--- /dev/null
+++ b/.changeset/platinum-olives-rule.md
@@ -0,0 +1,5 @@
+---
+'@mermaid-js/examples': minor
+---
+
+feat: Add examples for diagrams in the `@mermaid-js/examples` package

From 844f879f63b0a1afb3e1071fbc6a4689900b5a19 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 17 Apr 2025 21:42:05 +0530
Subject: [PATCH 23/45] fix: Examples unit test

---
 packages/examples/src/example.spec.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/examples/src/example.spec.ts b/packages/examples/src/example.spec.ts
index 93cceb9e5..94a8c2555 100644
--- a/packages/examples/src/example.spec.ts
+++ b/packages/examples/src/example.spec.ts
@@ -20,7 +20,9 @@ describe('examples', () => {
       'flowchart',
       'state',
     ];
-    const diagrams = mermaid.getDiagramData().filter((d) => !skippedDiagrams.includes(d.id));
+    const diagrams = mermaid
+      .getRegisteredDiagramsMetadata()
+      .filter((d) => !skippedDiagrams.includes(d.id));
     expect(diagrams.length).toBeGreaterThan(0);
     for (const diagram of diagrams) {
       const data = diagramData.find((d) => d.id === diagram.id)!;

From 8a84ede1646f94ff9e5db3253e3258654120283b Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Thu, 17 Apr 2025 16:17:01 +0000
Subject: [PATCH 24/45] [autofix.ci] apply automated fixes

---
 .../setup/mermaid/interfaces/Mermaid.md       | 41 +++++++++++--------
 .../config/setup/mermaid/variables/default.md |  2 +-
 2 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/docs/config/setup/mermaid/interfaces/Mermaid.md b/docs/config/setup/mermaid/interfaces/Mermaid.md
index 9789c28fa..fd15b306b 100644
--- a/docs/config/setup/mermaid/interfaces/Mermaid.md
+++ b/docs/config/setup/mermaid/interfaces/Mermaid.md
@@ -10,7 +10,7 @@
 
 # Interface: Mermaid
 
-Defined in: [packages/mermaid/src/mermaid.ts:424](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L424)
+Defined in: [packages/mermaid/src/mermaid.ts:429](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L429)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:424](https://github.com/mermaid-js/
 
 > **contentLoaded**: () => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
+Defined in: [packages/mermaid/src/mermaid.ts:447](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L447)
 
 \##contentLoaded Callback function that is called when page is loaded. This functions fetches
 configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the
@@ -34,7 +34,7 @@ page.
 
 > **detectType**: (`text`, `config`?) => `string`
 
-Defined in: [packages/mermaid/src/mermaid.ts:444](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L444)
+Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)
 
 Detects the type of the graph text.
 
@@ -86,23 +86,28 @@ A graph definition key
 
 ---
 
-### getDiagramData()
+### getRegisteredDiagramsMetadata()
 
-> **getDiagramData**: () => `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"`>\[]
+> **getRegisteredDiagramsMetadata**: () => `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"`>\[]
 
-Defined in: [packages/mermaid/src/mermaid.ts:446](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L446)
+Defined in: [packages/mermaid/src/mermaid.ts:451](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L451)
+
+Gets the metadata for all registered diagrams.
+Currently only the id is returned.
 
 #### Returns
 
 `Pick`<[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md), `"id"`>\[]
 
+An array of objects with the id of the diagram.
+
 ---
 
 ### ~~init()~~
 
 > **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
+Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
 
 ## init
 
@@ -150,7 +155,7 @@ Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
 
 > **initialize**: (`config`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:441](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L441)
+Defined in: [packages/mermaid/src/mermaid.ts:446](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L446)
 
 Used to set configurations for mermaid.
 This function should be called before the run function.
@@ -173,7 +178,7 @@ Configuration object for mermaid.
 
 > **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](MermaidConfig.md); `getConfig`: () => [`MermaidConfig`](MermaidConfig.md); `getDiagramFromText`: (`text`, `metadata`) => `Promise`<`Diagram`>; `getSiteConfig`: () => [`MermaidConfig`](MermaidConfig.md); `globalReset`: () => `void`; `initialize`: (`userOptions`) => `void`; `parse`: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>; `render`: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>; `reset`: () => `void`; `setConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); `updateSiteConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); }>
 
-Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
+Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
 
 **`Internal`**
 
@@ -187,7 +192,7 @@ Use [parse](Mermaid.md#parse) and [render](Mermaid.md#render) instead. Please [o
 
 > **parse**: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432)
+Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
 
 Parse the text and validate the syntax.
 
@@ -255,7 +260,7 @@ Error if the diagram is invalid and parseOptions.suppressErrors is false or not
 
 > `optional` **parseError**: [`ParseErrorFunction`](../type-aliases/ParseErrorFunction.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
+Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
 
 ---
 
@@ -263,7 +268,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/
 
 > **registerExternalDiagrams**: (`diagrams`, `opts`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:440](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L440)
+Defined in: [packages/mermaid/src/mermaid.ts:445](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L445)
 
 Used to register external diagram types.
 
@@ -293,7 +298,7 @@ If opts.lazyLoad is false, the diagrams will be loaded immediately.
 
 > **registerIconPacks**: (`iconLoaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:445](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L445)
+Defined in: [packages/mermaid/src/mermaid.ts:450](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L450)
 
 #### Parameters
 
@@ -311,7 +316,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:445](https://github.com/mermaid-js/
 
 > **registerLayoutLoaders**: (`loaders`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439)
+Defined in: [packages/mermaid/src/mermaid.ts:444](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L444)
 
 #### Parameters
 
@@ -329,7 +334,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/
 
 > **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>
 
-Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433)
+Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
 
 #### Parameters
 
@@ -361,7 +366,7 @@ Deprecated for external use.
 
 > **run**: (`options`) => `Promise`<`void`>
 
-Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
+Defined in: [packages/mermaid/src/mermaid.ts:443](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L443)
 
 ## run
 
@@ -405,7 +410,7 @@ Optional runtime configs
 
 > **setParseErrorHandler**: (`parseErrorHandler`) => `void`
 
-Defined in: [packages/mermaid/src/mermaid.ts:443](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L443)
+Defined in: [packages/mermaid/src/mermaid.ts:448](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L448)
 
 ## setParseErrorHandler Alternative to directly setting parseError using:
 
@@ -436,4 +441,4 @@ New parseError() callback.
 
 > **startOnLoad**: `boolean`
 
-Defined in: [packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
+Defined in: [packages/mermaid/src/mermaid.ts:430](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L430)
diff --git a/docs/config/setup/mermaid/variables/default.md b/docs/config/setup/mermaid/variables/default.md
index d375684c8..a953a641b 100644
--- a/docs/config/setup/mermaid/variables/default.md
+++ b/docs/config/setup/mermaid/variables/default.md
@@ -12,4 +12,4 @@
 
 > `const` **default**: [`Mermaid`](../interfaces/Mermaid.md)
 
-Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)
+Defined in: [packages/mermaid/src/mermaid.ts:454](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L454)

From e6b63fd70a2ea33ed0a6b08ff91842ba3fa41efb Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Sun, 20 Apr 2025 13:48:11 +0530
Subject: [PATCH 25/45] chore: Bump beta version to publish

---
 packages/examples/package.json | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/examples/package.json b/packages/examples/package.json
index dd7fcc2c4..c3780540c 100644
--- a/packages/examples/package.json
+++ b/packages/examples/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-js/examples",
-  "version": "0.0.1",
+  "version": "0.0.1-beta.1",
   "description": "Mermaid examples package",
   "author": "Sidharth Vinod",
   "type": "module",
@@ -22,5 +22,8 @@
   "dependencies": {},
   "devDependencies": {
     "mermaid": "workspace:*"
+  },
+  "publishConfig": {
+    "access": "public"
   }
 }

From da0c6c6c32c9c9b404802ab9fb47bccb547489a3 Mon Sep 17 00:00:00 2001
From: darshanr0107 <darshan@mermaid.com>
Date: Wed, 2 Jul 2025 11:59:20 +0530
Subject: [PATCH 26/45] log warning when duplicate commit IDs are encountered

---
 .../integration/rendering/gitGraph.spec.js    | 33 +++++++++++++++++++
 .../mermaid/src/diagrams/git/gitGraphAst.ts   |  3 ++
 2 files changed, 36 insertions(+)

diff --git a/cypress/integration/rendering/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js
index 42dc57439..c65c7969a 100644
--- a/cypress/integration/rendering/gitGraph.spec.js
+++ b/cypress/integration/rendering/gitGraph.spec.js
@@ -1569,4 +1569,37 @@ gitGraph TB:
       {}
     );
   });
+  it('77:should render gitGraph with duplicate commit IDs and log warnings', () => {
+    imgSnapshotTest(
+      `gitGraph
+     commit id:"initial commit"
+     commit id:"work on first release"
+     commit id:"design freeze from here"
+     branch v1-rc
+     checkout v1-rc
+     commit id:"bugfix 1"
+     commit id:"bigfix 2" tag:"v1.0.1"
+     branch FORK-v1.0-MDR
+     checkout FORK-v1.0-MDR
+     commit id:"working on MDR"
+     checkout v1-rc
+     commit id:"minor design changes for MDR" tag:"v1.0.2"
+     checkout FORK-v1.0-MDR
+     merge v1-rc
+     checkout main
+     commit id:"new feature for v1.1…"
+     checkout FORK-v1.0-MDR
+     commit id:"working on MDR"
+     commit id:"finishing MDR"
+     branch v1.0-MDR
+     checkout v1.0-MDR
+     commit id:"brush up release" tag:"v1.0.2-MDR"
+     checkout v1-rc
+     commit id:"bugfix without MDR"
+     checkout main
+     commit id:"work on v1.1"`,
+      {}
+    );
+    cy.log('Warning: Commit ID "working on MDR" already exists');
+  });
 });
diff --git a/packages/mermaid/src/diagrams/git/gitGraphAst.ts b/packages/mermaid/src/diagrams/git/gitGraphAst.ts
index 36595eb51..0dbc1ecb0 100644
--- a/packages/mermaid/src/diagrams/git/gitGraphAst.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraphAst.ts
@@ -125,6 +125,9 @@ export const commit = function (commitDB: CommitDB) {
   };
   state.records.head = newCommit;
   log.info('main branch', config.mainBranchName);
+  if (state.records.commits.has(newCommit.id)) {
+    log.warn(`Commit ID ${newCommit.id} already exists`);
+  }
   state.records.commits.set(newCommit.id, newCommit);
   state.records.branches.set(state.records.currBranch, newCommit.id);
   log.debug('in pushCommit ' + newCommit.id);

From 592c5bb880c3b942710a2878d386bcb3eb35c137 Mon Sep 17 00:00:00 2001
From: darshanr0107 <darshan@mermaid.com>
Date: Wed, 2 Jul 2025 12:16:17 +0530
Subject: [PATCH 27/45] add changeset

---
 .changeset/full-donuts-give.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/full-donuts-give.md

diff --git a/.changeset/full-donuts-give.md b/.changeset/full-donuts-give.md
new file mode 100644
index 000000000..e31b8d69c
--- /dev/null
+++ b/.changeset/full-donuts-give.md
@@ -0,0 +1,5 @@
+---
+'mermaid': patch
+---
+
+fix: Log a warning when duplicate commit IDs are encountered in gitGraph to help identify and debug rendering issues caused by non-unique IDs.

From c884def5fcd6711cb6e51f7352a9e6f29ef1bdf5 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 3 Jul 2025 04:14:58 +0000
Subject: [PATCH 28/45] chore: update E2E timings

---
 cypress/timings.json | 110 ++++++++++++++++++++++---------------------
 1 file changed, 57 insertions(+), 53 deletions(-)

diff --git a/cypress/timings.json b/cypress/timings.json
index 03eb22b98..d40b36b66 100644
--- a/cypress/timings.json
+++ b/cypress/timings.json
@@ -2,215 +2,219 @@
   "durations": [
     {
       "spec": "cypress/integration/other/configuration.spec.js",
-      "duration": 6130
+      "duration": 5659
     },
     {
       "spec": "cypress/integration/other/external-diagrams.spec.js",
-      "duration": 1974
+      "duration": 2015
     },
     {
       "spec": "cypress/integration/other/ghsa.spec.js",
-      "duration": 3308
+      "duration": 3195
     },
     {
       "spec": "cypress/integration/other/iife.spec.js",
-      "duration": 1877
+      "duration": 1976
     },
     {
       "spec": "cypress/integration/other/interaction.spec.js",
-      "duration": 10902
+      "duration": 11149
     },
     {
       "spec": "cypress/integration/other/rerender.spec.js",
-      "duration": 1836
+      "duration": 1910
     },
     {
       "spec": "cypress/integration/other/xss.spec.js",
-      "duration": 26467
+      "duration": 26998
     },
     {
       "spec": "cypress/integration/rendering/appli.spec.js",
-      "duration": 3129
+      "duration": 3176
     },
     {
       "spec": "cypress/integration/rendering/architecture.spec.ts",
-      "duration": 104
+      "duration": 110
     },
     {
       "spec": "cypress/integration/rendering/block.spec.js",
-      "duration": 16230
+      "duration": 16265
     },
     {
       "spec": "cypress/integration/rendering/c4.spec.js",
-      "duration": 5231
+      "duration": 5431
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-elk-v3.spec.js",
-      "duration": 38113
+      "duration": 38025
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-handDrawn-v3.spec.js",
-      "duration": 36423
+      "duration": 36179
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v2.spec.js",
-      "duration": 22509
+      "duration": 22386
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v3.spec.js",
-      "duration": 34933
+      "duration": 35378
     },
     {
       "spec": "cypress/integration/rendering/classDiagram.spec.js",
-      "duration": 14681
+      "duration": 14967
     },
     {
       "spec": "cypress/integration/rendering/conf-and-directives.spec.js",
-      "duration": 8877
+      "duration": 9140
     },
     {
       "spec": "cypress/integration/rendering/current.spec.js",
-      "duration": 2517
+      "duration": 2652
     },
     {
       "spec": "cypress/integration/rendering/erDiagram-unified.spec.js",
-      "duration": 81226
+      "duration": 82257
     },
     {
       "spec": "cypress/integration/rendering/erDiagram.spec.js",
-      "duration": 14211
+      "duration": 14138
     },
     {
       "spec": "cypress/integration/rendering/errorDiagram.spec.js",
-      "duration": 3355
+      "duration": 3718
     },
     {
       "spec": "cypress/integration/rendering/flowchart-elk.spec.js",
-      "duration": 38857
+      "duration": 39683
     },
     {
       "spec": "cypress/integration/rendering/flowchart-handDrawn.spec.js",
-      "duration": 28570
+      "duration": 28676
     },
     {
       "spec": "cypress/integration/rendering/flowchart-icon.spec.js",
-      "duration": 6902
+      "duration": 7080
     },
     {
       "spec": "cypress/integration/rendering/flowchart-shape-alias.spec.ts",
-      "duration": 23075
+      "duration": 23175
     },
     {
       "spec": "cypress/integration/rendering/flowchart-v2.spec.js",
-      "duration": 40514
+      "duration": 40846
     },
     {
       "spec": "cypress/integration/rendering/flowchart.spec.js",
-      "duration": 28611
+      "duration": 29743
     },
     {
       "spec": "cypress/integration/rendering/gantt.spec.js",
-      "duration": 16605
+      "duration": 17352
     },
     {
       "spec": "cypress/integration/rendering/gitGraph.spec.js",
-      "duration": 47636
+      "duration": 48514
     },
     {
       "spec": "cypress/integration/rendering/iconShape.spec.ts",
-      "duration": 262219
+      "duration": 262422
     },
     {
       "spec": "cypress/integration/rendering/imageShape.spec.ts",
-      "duration": 54111
+      "duration": 54513
     },
     {
       "spec": "cypress/integration/rendering/info.spec.ts",
-      "duration": 3006
+      "duration": 3025
     },
     {
       "spec": "cypress/integration/rendering/journey.spec.js",
-      "duration": 6858
+      "duration": 6994
     },
     {
       "spec": "cypress/integration/rendering/kanban.spec.ts",
-      "duration": 7281
+      "duration": 7346
     },
     {
       "spec": "cypress/integration/rendering/katex.spec.js",
-      "duration": 3579
+      "duration": 3642
     },
     {
       "spec": "cypress/integration/rendering/marker_unique_id.spec.js",
-      "duration": 2448
+      "duration": 2464
     },
     {
       "spec": "cypress/integration/rendering/mindmap.spec.ts",
-      "duration": 10618
+      "duration": 10882
     },
     {
       "spec": "cypress/integration/rendering/newShapes.spec.ts",
-      "duration": 140874
+      "duration": 142092
     },
     {
       "spec": "cypress/integration/rendering/oldShapes.spec.ts",
-      "duration": 108015
+      "duration": 109340
     },
     {
       "spec": "cypress/integration/rendering/packet.spec.ts",
-      "duration": 4241
+      "duration": 4167
     },
     {
       "spec": "cypress/integration/rendering/pie.spec.ts",
-      "duration": 5645
+      "duration": 5736
     },
     {
       "spec": "cypress/integration/rendering/quadrantChart.spec.js",
-      "duration": 8524
+      "duration": 8628
     },
     {
       "spec": "cypress/integration/rendering/radar.spec.js",
-      "duration": 5203
+      "duration": 5311
     },
     {
       "spec": "cypress/integration/rendering/requirement.spec.js",
-      "duration": 2635
+      "duration": 2619
     },
     {
       "spec": "cypress/integration/rendering/requirementDiagram-unified.spec.js",
-      "duration": 50512
+      "duration": 50640
     },
     {
       "spec": "cypress/integration/rendering/sankey.spec.ts",
-      "duration": 6692
+      "duration": 6735
     },
     {
       "spec": "cypress/integration/rendering/sequencediagram.spec.js",
-      "duration": 34559
+      "duration": 34777
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram-v2.spec.js",
-      "duration": 24421
+      "duration": 24440
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram.spec.js",
-      "duration": 15316
+      "duration": 15476
     },
     {
       "spec": "cypress/integration/rendering/theme.spec.js",
-      "duration": 28240
+      "duration": 27932
     },
     {
       "spec": "cypress/integration/rendering/timeline.spec.ts",
-      "duration": 6808
+      "duration": 8162
+    },
+    {
+      "spec": "cypress/integration/rendering/treemap.spec.ts",
+      "duration": 11763
     },
     {
       "spec": "cypress/integration/rendering/xyChart.spec.js",
-      "duration": 19359
+      "duration": 19759
     },
     {
       "spec": "cypress/integration/rendering/zenuml.spec.js",
-      "duration": 3164
+      "duration": 3316
     }
   ]
 }

From 648698a43ac39b270087c40f52f3586045522e51 Mon Sep 17 00:00:00 2001
From: darshanr0107 <darshan@mermaidchart.com>
Date: Thu, 3 Jul 2025 13:57:36 +0530
Subject: [PATCH 29/45] resolve PR comments

---
 .../integration/rendering/gitGraph.spec.js    | 33 ---------------
 .../mermaid/src/diagrams/git/gitGraph.spec.ts | 40 ++++++++++++++++++-
 2 files changed, 39 insertions(+), 34 deletions(-)

diff --git a/cypress/integration/rendering/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js
index c65c7969a..42dc57439 100644
--- a/cypress/integration/rendering/gitGraph.spec.js
+++ b/cypress/integration/rendering/gitGraph.spec.js
@@ -1569,37 +1569,4 @@ gitGraph TB:
       {}
     );
   });
-  it('77:should render gitGraph with duplicate commit IDs and log warnings', () => {
-    imgSnapshotTest(
-      `gitGraph
-     commit id:"initial commit"
-     commit id:"work on first release"
-     commit id:"design freeze from here"
-     branch v1-rc
-     checkout v1-rc
-     commit id:"bugfix 1"
-     commit id:"bigfix 2" tag:"v1.0.1"
-     branch FORK-v1.0-MDR
-     checkout FORK-v1.0-MDR
-     commit id:"working on MDR"
-     checkout v1-rc
-     commit id:"minor design changes for MDR" tag:"v1.0.2"
-     checkout FORK-v1.0-MDR
-     merge v1-rc
-     checkout main
-     commit id:"new feature for v1.1…"
-     checkout FORK-v1.0-MDR
-     commit id:"working on MDR"
-     commit id:"finishing MDR"
-     branch v1.0-MDR
-     checkout v1.0-MDR
-     commit id:"brush up release" tag:"v1.0.2-MDR"
-     checkout v1-rc
-     commit id:"bugfix without MDR"
-     checkout main
-     commit id:"work on v1.1"`,
-      {}
-    );
-    cy.log('Warning: Commit ID "working on MDR" already exists');
-  });
 });
diff --git a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
index fed21dd19..0d6eb07ec 100644
--- a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
@@ -1,4 +1,4 @@
-import { rejects } from 'assert';
+import { log } from '../../logger.js';
 import { db } from './gitGraphAst.js';
 import { parser } from './gitGraphParser.js';
 
@@ -1319,4 +1319,42 @@ describe('when parsing a gitGraph', function () {
       }
     });
   });
+  it('should log a warning when two commits have the same ID', async () => {
+    const str = `gitGraph
+     commit id:"initial commit"
+     commit id:"work on first release"
+     commit id:"design freeze from here"
+     branch v1-rc
+     checkout v1-rc
+     commit id:"bugfix 1"
+     commit id:"bigfix 2" tag:"v1.0.1"
+     branch FORK-v1.0-MDR
+     checkout FORK-v1.0-MDR
+     commit id:"working on MDR"
+     checkout v1-rc
+     commit id:"minor design changes for MDR" tag:"v1.0.2"
+     checkout FORK-v1.0-MDR
+     merge v1-rc
+     checkout main
+     commit id:"new feature for v1.1…"
+     checkout FORK-v1.0-MDR
+     commit id:"working on MDR"
+     commit id:"finishing MDR"
+     branch v1.0-MDR
+     checkout v1.0-MDR
+     commit id:"brush up release" tag:"v1.0.2-MDR"
+     checkout v1-rc
+     commit id:"bugfix without MDR"
+     checkout main
+     commit id:"work on v1.1"
+  `;
+
+    const spyOn = vi.spyOn(log, 'warn').mockImplementation(() => undefined);
+
+    await parser.parse(str);
+
+    expect(spyOn).toHaveBeenCalledWith('Commit ID working on MDR already exists');
+
+    spyOn.mockRestore();
+  });
 });

From fb017bebfdb50675cb7faf8b22fc403d9964208f Mon Sep 17 00:00:00 2001
From: darshanr0107 <darshan@mermaidchart.com>
Date: Thu, 3 Jul 2025 15:39:26 +0530
Subject: [PATCH 30/45] resolve PR comment

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/mermaid/src/diagrams/git/gitGraph.spec.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
index 0d6eb07ec..ee20a9aaf 100644
--- a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
+++ b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts
@@ -1349,12 +1349,12 @@ describe('when parsing a gitGraph', function () {
      commit id:"work on v1.1"
   `;
 
-    const spyOn = vi.spyOn(log, 'warn').mockImplementation(() => undefined);
+    const logWarnSpy = vi.spyOn(log, 'warn').mockImplementation(() => undefined);
 
     await parser.parse(str);
 
-    expect(spyOn).toHaveBeenCalledWith('Commit ID working on MDR already exists');
+    expect(logWarnSpy).toHaveBeenCalledWith('Commit ID working on MDR already exists');
 
-    spyOn.mockRestore();
+    logWarnSpy.mockRestore();
   });
 });

From ba1398190514f09a8a3c83bfa94989fa73add7dd Mon Sep 17 00:00:00 2001
From: Ashish Jain <ashishjain0512@gmail.com>
Date: Thu, 3 Jul 2025 12:56:09 +0200
Subject: [PATCH 31/45] Updated lychee for working url phpbb.com

---
 .github/lychee.toml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/.github/lychee.toml b/.github/lychee.toml
index 7e23b2351..c20b73b26 100644
--- a/.github/lychee.toml
+++ b/.github/lychee.toml
@@ -46,6 +46,9 @@ exclude = [
 # Drupal 403
 "https://(www.)?drupal.org",
 
+# Phbpp 403
+"https://www.phpbb.com/",
+
 # Swimm returns 404, even though the link is valid
 "https://docs.swimm.io",
 

From c77b968f1e2f2fc305b4afa678a0e4251c16b090 Mon Sep 17 00:00:00 2001
From: shubham-mermaid <shubham@mermaidchart.com>
Date: Thu, 3 Jul 2025 18:12:12 +0530
Subject: [PATCH 32/45] Updated phpbb url  to support 403 in lychee

---
 .github/lychee.toml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/lychee.toml b/.github/lychee.toml
index c20b73b26..03dc0c5e5 100644
--- a/.github/lychee.toml
+++ b/.github/lychee.toml
@@ -47,7 +47,7 @@ exclude = [
 "https://(www.)?drupal.org",
 
 # Phbpp 403
-"https://www.phpbb.com/",
+"https://(www.)?phpbb.com",
 
 # Swimm returns 404, even though the link is valid
 "https://docs.swimm.io",

From 89ac2932c4efa1bc8868b7a0b3b741fb99dfa6cb Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Thu, 3 Jul 2025 13:28:11 +0000
Subject: [PATCH 33/45] Version Packages

---
 .changeset/better-days-bow.md  |  6 ------
 .changeset/full-donuts-give.md |  5 -----
 packages/mermaid/CHANGELOG.md  | 13 +++++++++++++
 packages/mermaid/package.json  |  2 +-
 packages/parser/CHANGELOG.md   |  6 ++++++
 packages/parser/package.json   |  2 +-
 packages/tiny/CHANGELOG.md     | 13 +++++++++++++
 packages/tiny/package.json     |  2 +-
 8 files changed, 35 insertions(+), 14 deletions(-)
 delete mode 100644 .changeset/better-days-bow.md
 delete mode 100644 .changeset/full-donuts-give.md

diff --git a/.changeset/better-days-bow.md b/.changeset/better-days-bow.md
deleted file mode 100644
index b1baf994b..000000000
--- a/.changeset/better-days-bow.md
+++ /dev/null
@@ -1,6 +0,0 @@
----
-'mermaid': minor
-'@mermaid-js/parser': minor
----
-
-Adding support for the new diagram type nested treemap
diff --git a/.changeset/full-donuts-give.md b/.changeset/full-donuts-give.md
deleted file mode 100644
index e31b8d69c..000000000
--- a/.changeset/full-donuts-give.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Log a warning when duplicate commit IDs are encountered in gitGraph to help identify and debug rendering issues caused by non-unique IDs.
diff --git a/packages/mermaid/CHANGELOG.md b/packages/mermaid/CHANGELOG.md
index 1a266e140..f23ad68e7 100644
--- a/packages/mermaid/CHANGELOG.md
+++ b/packages/mermaid/CHANGELOG.md
@@ -1,5 +1,18 @@
 # mermaid
 
+## 11.8.0
+
+### Minor Changes
+
+- [#6590](https://github.com/mermaid-js/mermaid/pull/6590) [`f338802`](https://github.com/mermaid-js/mermaid/commit/f338802642cdecf5b7ed6c19a20cf2a81effbbee) Thanks [@knsv](https://github.com/knsv)! - Adding support for the new diagram type nested treemap
+
+### Patch Changes
+
+- [#6707](https://github.com/mermaid-js/mermaid/pull/6707) [`592c5bb`](https://github.com/mermaid-js/mermaid/commit/592c5bb880c3b942710a2878d386bcb3eb35c137) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Log a warning when duplicate commit IDs are encountered in gitGraph to help identify and debug rendering issues caused by non-unique IDs.
+
+- Updated dependencies [[`f338802`](https://github.com/mermaid-js/mermaid/commit/f338802642cdecf5b7ed6c19a20cf2a81effbbee)]:
+  - @mermaid-js/parser@0.6.0
+
 ## 11.7.0
 
 ### Minor Changes
diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json
index 8f8f64766..0c7e9dbba 100644
--- a/packages/mermaid/package.json
+++ b/packages/mermaid/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mermaid",
-  "version": "11.7.0",
+  "version": "11.8.0",
   "description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.",
   "type": "module",
   "module": "./dist/mermaid.core.mjs",
diff --git a/packages/parser/CHANGELOG.md b/packages/parser/CHANGELOG.md
index f69a9ddff..4382ca1ea 100644
--- a/packages/parser/CHANGELOG.md
+++ b/packages/parser/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @mermaid-js/parser
 
+## 0.6.0
+
+### Minor Changes
+
+- [#6590](https://github.com/mermaid-js/mermaid/pull/6590) [`f338802`](https://github.com/mermaid-js/mermaid/commit/f338802642cdecf5b7ed6c19a20cf2a81effbbee) Thanks [@knsv](https://github.com/knsv)! - Adding support for the new diagram type nested treemap
+
 ## 0.5.0
 
 ### Minor Changes
diff --git a/packages/parser/package.json b/packages/parser/package.json
index e70b9f9b3..93ade50ce 100644
--- a/packages/parser/package.json
+++ b/packages/parser/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-js/parser",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "MermaidJS parser",
   "author": "Yokozuna59",
   "contributors": [
diff --git a/packages/tiny/CHANGELOG.md b/packages/tiny/CHANGELOG.md
index 1a266e140..f23ad68e7 100644
--- a/packages/tiny/CHANGELOG.md
+++ b/packages/tiny/CHANGELOG.md
@@ -1,5 +1,18 @@
 # mermaid
 
+## 11.8.0
+
+### Minor Changes
+
+- [#6590](https://github.com/mermaid-js/mermaid/pull/6590) [`f338802`](https://github.com/mermaid-js/mermaid/commit/f338802642cdecf5b7ed6c19a20cf2a81effbbee) Thanks [@knsv](https://github.com/knsv)! - Adding support for the new diagram type nested treemap
+
+### Patch Changes
+
+- [#6707](https://github.com/mermaid-js/mermaid/pull/6707) [`592c5bb`](https://github.com/mermaid-js/mermaid/commit/592c5bb880c3b942710a2878d386bcb3eb35c137) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Log a warning when duplicate commit IDs are encountered in gitGraph to help identify and debug rendering issues caused by non-unique IDs.
+
+- Updated dependencies [[`f338802`](https://github.com/mermaid-js/mermaid/commit/f338802642cdecf5b7ed6c19a20cf2a81effbbee)]:
+  - @mermaid-js/parser@0.6.0
+
 ## 11.7.0
 
 ### Minor Changes
diff --git a/packages/tiny/package.json b/packages/tiny/package.json
index 6ae7d440c..56ba549b5 100644
--- a/packages/tiny/package.json
+++ b/packages/tiny/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-js/tiny",
-  "version": "11.7.0",
+  "version": "11.8.0",
   "description": "Tiny version of mermaid",
   "type": "commonjs",
   "main": "./dist/mermaid.tiny.js",

From 85eba01663240270bbe707b0d5ceecb72b8a243f Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Mon, 7 Jul 2025 18:02:23 +0530
Subject: [PATCH 34/45] chore: Fail build in CI on type errors

---
 .build/types.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/.build/types.ts b/.build/types.ts
index 9dec05a68..1d439d87c 100644
--- a/.build/types.ts
+++ b/.build/types.ts
@@ -10,13 +10,16 @@ const buildType = (packageName: string) => {
       console.log(out.toString());
     }
   } catch (e) {
-    console.error(e);
     if (e.stdout.length > 0) {
       console.error(e.stdout.toString());
     }
     if (e.stderr.length > 0) {
       console.error(e.stderr.toString());
     }
+    // Exit the build process if we are in CI
+    if (process.env.CI) {
+      throw new Error(`Failed to build types for ${packageName}`);
+    }
   }
 };
 

From 0da2922ee7f47959e324ec10d3d21ee70594f557 Mon Sep 17 00:00:00 2001
From: shubham-mermaid <shubham@mermaidchart.com>
Date: Mon, 7 Jul 2025 18:50:53 +0530
Subject: [PATCH 35/45] Updated parser to use treemap

---
 .changeset/stale-crabs-deny.md                       | 5 +++++
 packages/parser/src/language/index.ts                | 4 ++--
 packages/parser/src/language/treemap/treemap.langium | 4 ++--
 3 files changed, 9 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/stale-crabs-deny.md

diff --git a/.changeset/stale-crabs-deny.md b/.changeset/stale-crabs-deny.md
new file mode 100644
index 000000000..288de9e0d
--- /dev/null
+++ b/.changeset/stale-crabs-deny.md
@@ -0,0 +1,5 @@
+---
+'mermaid': minor
+---
+
+chore: use treemap instead of treemapdoc in parser.
diff --git a/packages/parser/src/language/index.ts b/packages/parser/src/language/index.ts
index c41d7eeb8..9b31af5ba 100644
--- a/packages/parser/src/language/index.ts
+++ b/packages/parser/src/language/index.ts
@@ -8,7 +8,7 @@ export {
   Architecture,
   GitGraph,
   Radar,
-  TreemapDoc,
+  Treemap,
   Branch,
   Commit,
   Merge,
@@ -20,7 +20,7 @@ export {
   isPieSection,
   isArchitecture,
   isGitGraph,
-  isTreemapDoc,
+  isTreemap,
   isBranch,
   isCommit,
   isMerge,
diff --git a/packages/parser/src/language/treemap/treemap.langium b/packages/parser/src/language/treemap/treemap.langium
index 45ee2588f..c35d5f0e9 100644
--- a/packages/parser/src/language/treemap/treemap.langium
+++ b/packages/parser/src/language/treemap/treemap.langium
@@ -34,14 +34,14 @@ interface ClassDefStatement {
     className: string
     styleText: string // Optional style text
 }
-interface TreemapDoc {
+interface Treemap {
     TreemapRows: TreemapRow[]
     title?: string
     accTitle?: string
     accDescr?: string
 }
 
-entry TreemapDoc returns TreemapDoc:
+entry Treemap returns Treemap:
     TREEMAP_KEYWORD
     (
         TitleAndAccessibilities

From 35b84761a978e5c150f847cc859b6e1c29853a5e Mon Sep 17 00:00:00 2001
From: shubham-mermaid <shubham@mermaidchart.com>
Date: Mon, 7 Jul 2025 18:54:38 +0530
Subject: [PATCH 36/45] updated validaor and tests to use treemap

---
 .../src/language/treemap/treemap-validator.ts |  8 ++++----
 packages/parser/tests/treemap.test.ts         | 20 +++++++++----------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/packages/parser/src/language/treemap/treemap-validator.ts b/packages/parser/src/language/treemap/treemap-validator.ts
index 9a9e5c469..4509b4b58 100644
--- a/packages/parser/src/language/treemap/treemap-validator.ts
+++ b/packages/parser/src/language/treemap/treemap-validator.ts
@@ -1,5 +1,5 @@
 import type { ValidationAcceptor, ValidationChecks } from 'langium';
-import type { MermaidAstType, TreemapDoc } from '../generated/ast.js';
+import type { MermaidAstType, Treemap } from '../generated/ast.js';
 import type { TreemapServices } from './module.js';
 
 /**
@@ -9,10 +9,10 @@ export function registerValidationChecks(services: TreemapServices) {
   const validator = services.validation.TreemapValidator;
   const registry = services.validation.ValidationRegistry;
   if (registry) {
-    // Use any to bypass type checking since we know TreemapDoc is part of the AST
+    // Use any to bypass type checking since we know Treemap is part of the AST
     // but the type system is having trouble with it
     const checks: ValidationChecks<MermaidAstType> = {
-      TreemapDoc: validator.checkSingleRoot.bind(validator),
+      Treemap: validator.checkSingleRoot.bind(validator),
       // Remove unused validation for TreemapRow
     };
     registry.register(checks, validator);
@@ -27,7 +27,7 @@ export class TreemapValidator {
    * Validates that a treemap has only one root node.
    * A root node is defined as a node that has no indentation.
    */
-  checkSingleRoot(doc: TreemapDoc, accept: ValidationAcceptor): void {
+  checkSingleRoot(doc: Treemap, accept: ValidationAcceptor): void {
     let rootNodeIndentation;
 
     for (const row of doc.TreemapRows) {
diff --git a/packages/parser/tests/treemap.test.ts b/packages/parser/tests/treemap.test.ts
index 6afb6e7db..b05ab39fc 100644
--- a/packages/parser/tests/treemap.test.ts
+++ b/packages/parser/tests/treemap.test.ts
@@ -1,6 +1,6 @@
 import { describe, expect, it } from 'vitest';
 import { expectNoErrorsOrAlternatives } from './test-util.js';
-import type { TreemapDoc, Section, Leaf, TreemapRow } from '../src/language/generated/ast.js';
+import type { Treemap, Section, Leaf, TreemapRow } from '../src/language/generated/ast.js';
 import type { LangiumParser } from 'langium';
 import { createTreemapServices } from '../src/language/treemap/module.js';
 
@@ -9,21 +9,21 @@ describe('Treemap Parser', () => {
   const parser: LangiumParser = services.parser.LangiumParser;
 
   const parse = (input: string) => {
-    return parser.parse<TreemapDoc>(input);
+    return parser.parse<Treemap>(input);
   };
 
   describe('Basic Parsing', () => {
     it('should parse empty treemap', () => {
       const result = parse('treemap');
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       expect(result.value.TreemapRows).toHaveLength(0);
     });
 
     it('should parse a section node', () => {
       const result = parse('treemap\n"Root"');
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       expect(result.value.TreemapRows).toHaveLength(1);
       if (result.value.TreemapRows[0].item) {
         expect(result.value.TreemapRows[0].item.$type).toBe('Section');
@@ -39,7 +39,7 @@ describe('Treemap Parser', () => {
   "Child2" : 200
 `);
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       expect(result.value.TreemapRows).toHaveLength(3);
 
       if (result.value.TreemapRows[0].item) {
@@ -95,7 +95,7 @@ describe('Treemap Parser', () => {
 
       // We're only checking that the multiple root nodes parse successfully
       // The validation errors would be reported by the validator during validation
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       expect(result.value.TreemapRows).toHaveLength(2);
     });
   });
@@ -104,7 +104,7 @@ describe('Treemap Parser', () => {
     it('should parse a treemap with title', () => {
       const result = parse('treemap\ntitle My Treemap Diagram\n"Root"\n  "Child": 100');
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       // We can't directly test the title property due to how Langium processes TitleAndAccessibilities
       // but we can verify the TreemapRows are parsed correctly
       expect(result.value.TreemapRows).toHaveLength(2);
@@ -113,7 +113,7 @@ describe('Treemap Parser', () => {
     it('should parse a treemap with accTitle', () => {
       const result = parse('treemap\naccTitle: Accessible Title\n"Root"\n  "Child": 100');
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       // We can't directly test the accTitle property due to how Langium processes TitleAndAccessibilities
       expect(result.value.TreemapRows).toHaveLength(2);
     });
@@ -123,7 +123,7 @@ describe('Treemap Parser', () => {
         'treemap\naccDescr: This is an accessible description\n"Root"\n  "Child": 100'
       );
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       // We can't directly test the accDescr property due to how Langium processes TitleAndAccessibilities
       expect(result.value.TreemapRows).toHaveLength(2);
     });
@@ -136,7 +136,7 @@ accDescr: This is an accessible description
 "Root"
   "Child": 100`);
       expectNoErrorsOrAlternatives(result);
-      expect(result.value.$type).toBe('TreemapDoc');
+      expect(result.value.$type).toBe('Treemap');
       // We can't directly test these properties due to how Langium processes TitleAndAccessibilities
       expect(result.value.TreemapRows).toHaveLength(2);
     });

From 950b107dd44b5461ce49ca10950600ccc1dc5817 Mon Sep 17 00:00:00 2001
From: shubham-mermaid <shubham@mermaidchart.com>
Date: Mon, 7 Jul 2025 19:15:50 +0530
Subject: [PATCH 37/45] update in changeset

---
 .changeset/stale-crabs-deny.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.changeset/stale-crabs-deny.md b/.changeset/stale-crabs-deny.md
index 288de9e0d..a151587be 100644
--- a/.changeset/stale-crabs-deny.md
+++ b/.changeset/stale-crabs-deny.md
@@ -1,5 +1,5 @@
 ---
-'mermaid': minor
+'mermaid': patch
 ---
 
-chore: use treemap instead of treemapdoc in parser.
+chore: use Treemap instead of TreemapDoc in parser.

From 3e545d79255b2094076d59c4788a08164187d565 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Mon, 7 Jul 2025 20:49:04 +0530
Subject: [PATCH 38/45] docs: Update changeset

---
 .changeset/stale-crabs-deny.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/stale-crabs-deny.md b/.changeset/stale-crabs-deny.md
index a151587be..29b618d8f 100644
--- a/.changeset/stale-crabs-deny.md
+++ b/.changeset/stale-crabs-deny.md
@@ -1,5 +1,5 @@
 ---
-'mermaid': patch
+'@mermaid-js/parser': patch
 ---
 
 chore: use Treemap instead of TreemapDoc in parser.

From 8fbcbb6dc923a3256fba61ca8490a5b6461eb660 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Mon, 7 Jul 2025 15:21:07 +0000
Subject: [PATCH 39/45] Version Packages

---
 .changeset/stale-crabs-deny.md | 5 -----
 packages/mermaid/CHANGELOG.md  | 7 +++++++
 packages/mermaid/package.json  | 2 +-
 packages/parser/CHANGELOG.md   | 6 ++++++
 packages/parser/package.json   | 2 +-
 packages/tiny/CHANGELOG.md     | 7 +++++++
 packages/tiny/package.json     | 2 +-
 7 files changed, 23 insertions(+), 8 deletions(-)
 delete mode 100644 .changeset/stale-crabs-deny.md

diff --git a/.changeset/stale-crabs-deny.md b/.changeset/stale-crabs-deny.md
deleted file mode 100644
index 29b618d8f..000000000
--- a/.changeset/stale-crabs-deny.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'@mermaid-js/parser': patch
----
-
-chore: use Treemap instead of TreemapDoc in parser.
diff --git a/packages/mermaid/CHANGELOG.md b/packages/mermaid/CHANGELOG.md
index f23ad68e7..c57e2a6db 100644
--- a/packages/mermaid/CHANGELOG.md
+++ b/packages/mermaid/CHANGELOG.md
@@ -1,5 +1,12 @@
 # mermaid
 
+## 11.8.1
+
+### Patch Changes
+
+- Updated dependencies [[`0da2922`](https://github.com/mermaid-js/mermaid/commit/0da2922ee7f47959e324ec10d3d21ee70594f557)]:
+  - @mermaid-js/parser@0.6.1
+
 ## 11.8.0
 
 ### Minor Changes
diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json
index 0c7e9dbba..80c83ec8e 100644
--- a/packages/mermaid/package.json
+++ b/packages/mermaid/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mermaid",
-  "version": "11.8.0",
+  "version": "11.8.1",
   "description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.",
   "type": "module",
   "module": "./dist/mermaid.core.mjs",
diff --git a/packages/parser/CHANGELOG.md b/packages/parser/CHANGELOG.md
index 4382ca1ea..da0f244a3 100644
--- a/packages/parser/CHANGELOG.md
+++ b/packages/parser/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @mermaid-js/parser
 
+## 0.6.1
+
+### Patch Changes
+
+- [#6725](https://github.com/mermaid-js/mermaid/pull/6725) [`0da2922`](https://github.com/mermaid-js/mermaid/commit/0da2922ee7f47959e324ec10d3d21ee70594f557) Thanks [@shubham-mermaid](https://github.com/shubham-mermaid)! - chore: use Treemap instead of TreemapDoc in parser.
+
 ## 0.6.0
 
 ### Minor Changes
diff --git a/packages/parser/package.json b/packages/parser/package.json
index 93ade50ce..a51229ae8 100644
--- a/packages/parser/package.json
+++ b/packages/parser/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-js/parser",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "MermaidJS parser",
   "author": "Yokozuna59",
   "contributors": [
diff --git a/packages/tiny/CHANGELOG.md b/packages/tiny/CHANGELOG.md
index f23ad68e7..c57e2a6db 100644
--- a/packages/tiny/CHANGELOG.md
+++ b/packages/tiny/CHANGELOG.md
@@ -1,5 +1,12 @@
 # mermaid
 
+## 11.8.1
+
+### Patch Changes
+
+- Updated dependencies [[`0da2922`](https://github.com/mermaid-js/mermaid/commit/0da2922ee7f47959e324ec10d3d21ee70594f557)]:
+  - @mermaid-js/parser@0.6.1
+
 ## 11.8.0
 
 ### Minor Changes
diff --git a/packages/tiny/package.json b/packages/tiny/package.json
index 56ba549b5..79dba051b 100644
--- a/packages/tiny/package.json
+++ b/packages/tiny/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mermaid-js/tiny",
-  "version": "11.8.0",
+  "version": "11.8.1",
   "description": "Tiny version of mermaid",
   "type": "commonjs",
   "main": "./dist/mermaid.tiny.js",

From 4d83263388e6475ea06ebdd45e868295d120191d Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Jul 2025 00:44:07 +0530
Subject: [PATCH 40/45] chore: Add peerDependency to @mermaid-js/examples

Co-authored-by: Alois Klink <alois@aloisklink.com>
---
 packages/examples/package.json | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/examples/package.json b/packages/examples/package.json
index c3780540c..90abc9da9 100644
--- a/packages/examples/package.json
+++ b/packages/examples/package.json
@@ -23,6 +23,9 @@
   "devDependencies": {
     "mermaid": "workspace:*"
   },
+  "peerDependencies": {
+    "mermaid": "workspace:~"
+  },
   "publishConfig": {
     "access": "public"
   }

From 3ca317c5a0982956f1320ba5c84b9d21c5141da6 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Jul 2025 00:45:47 +0530
Subject: [PATCH 41/45] chore: Add treemap example

---
 packages/examples/src/examples/treemap.ts | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 packages/examples/src/examples/treemap.ts

diff --git a/packages/examples/src/examples/treemap.ts b/packages/examples/src/examples/treemap.ts
new file mode 100644
index 000000000..a37a95d43
--- /dev/null
+++ b/packages/examples/src/examples/treemap.ts
@@ -0,0 +1,21 @@
+import type { DiagramMetadata } from '../types.js';
+
+export default {
+  id: 'treemap',
+  name: 'Treemap',
+  description: 'Visualize hierarchical data as nested rectangles',
+  examples: [
+    {
+      title: 'Treemap',
+      isDefault: true,
+      code: `treemap-beta
+"Section 1"
+    "Leaf 1.1": 12
+    "Section 1.2"
+      "Leaf 1.2.1": 12
+"Section 2"
+    "Leaf 2.1": 20
+    "Leaf 2.2": 25`,
+    },
+  ],
+} satisfies DiagramMetadata;

From 03c1201fcbc9a4e3c0f8f4401cf9624b55c11db1 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Jul 2025 00:55:24 +0530
Subject: [PATCH 42/45] chore: Add treemap example

---
 packages/examples/src/index.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/examples/src/index.ts b/packages/examples/src/index.ts
index c762fd80a..eb9160bcf 100644
--- a/packages/examples/src/index.ts
+++ b/packages/examples/src/index.ts
@@ -20,6 +20,7 @@ import timelineDiagram from './examples/timeline.js';
 import quadrantChart from './examples/quadrant-chart.js';
 import packetDiagram from './examples/packet.js';
 import blockDiagram from './examples/block.js';
+import treemapDiagram from './examples/treemap.js';
 
 export const diagramData: DiagramMetadata[] = [
   flowChart,
@@ -43,4 +44,5 @@ export const diagramData: DiagramMetadata[] = [
   quadrantChart,
   packetDiagram,
   blockDiagram,
+  treemapDiagram,
 ];

From ed297ee2355cdaf3225d1f68e9da55bcdf3a5032 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Jul 2025 00:55:44 +0530
Subject: [PATCH 43/45] fix: Add useful error message to test

---
 packages/examples/src/example.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/examples/src/example.spec.ts b/packages/examples/src/example.spec.ts
index 94a8c2555..71e3e6fab 100644
--- a/packages/examples/src/example.spec.ts
+++ b/packages/examples/src/example.spec.ts
@@ -26,7 +26,7 @@ describe('examples', () => {
     expect(diagrams.length).toBeGreaterThan(0);
     for (const diagram of diagrams) {
       const data = diagramData.find((d) => d.id === diagram.id)!;
-      expect(data).toBeDefined();
+      expect(data, `Example for ${diagram.id} is not defined`).toBeDefined();
       expect(data.examples.length).toBeGreaterThan(0);
       expect(data.examples.filter((e) => e.isDefault).length).toBe(1);
     }

From 6deb476182d6acc860b944abe2d685836836b95c Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Tue, 8 Jul 2025 01:01:47 +0530
Subject: [PATCH 44/45] docs: Update changeset

---
 .changeset/gold-olives-rule.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/gold-olives-rule.md b/.changeset/gold-olives-rule.md
index 0059d1840..6fe343774 100644
--- a/.changeset/gold-olives-rule.md
+++ b/.changeset/gold-olives-rule.md
@@ -2,4 +2,4 @@
 'mermaid': minor
 ---
 
-feat: Add `getDiagramData` to `mermaid`, which returns all the registered diagram IDs in mermaid
+feat: Add `getRegisteredDiagramsMetadata` to `mermaid`, which returns all the registered diagram IDs in mermaid

From cdd1a70b678178798466efedb641ceea39c7320e Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 8 Jul 2025 04:14:48 +0000
Subject: [PATCH 45/45] chore: update E2E timings

---
 cypress/timings.json | 108 +++++++++++++++++++++----------------------
 1 file changed, 54 insertions(+), 54 deletions(-)

diff --git a/cypress/timings.json b/cypress/timings.json
index d40b36b66..05263ad9f 100644
--- a/cypress/timings.json
+++ b/cypress/timings.json
@@ -2,219 +2,219 @@
   "durations": [
     {
       "spec": "cypress/integration/other/configuration.spec.js",
-      "duration": 5659
+      "duration": 5672
     },
     {
       "spec": "cypress/integration/other/external-diagrams.spec.js",
-      "duration": 2015
+      "duration": 1990
     },
     {
       "spec": "cypress/integration/other/ghsa.spec.js",
-      "duration": 3195
+      "duration": 3186
     },
     {
       "spec": "cypress/integration/other/iife.spec.js",
-      "duration": 1976
+      "duration": 1948
     },
     {
       "spec": "cypress/integration/other/interaction.spec.js",
-      "duration": 11149
+      "duration": 11938
     },
     {
       "spec": "cypress/integration/other/rerender.spec.js",
-      "duration": 1910
+      "duration": 1932
     },
     {
       "spec": "cypress/integration/other/xss.spec.js",
-      "duration": 26998
+      "duration": 27237
     },
     {
       "spec": "cypress/integration/rendering/appli.spec.js",
-      "duration": 3176
+      "duration": 3170
     },
     {
       "spec": "cypress/integration/rendering/architecture.spec.ts",
-      "duration": 110
+      "duration": 104
     },
     {
       "spec": "cypress/integration/rendering/block.spec.js",
-      "duration": 16265
+      "duration": 17390
     },
     {
       "spec": "cypress/integration/rendering/c4.spec.js",
-      "duration": 5431
+      "duration": 5296
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-elk-v3.spec.js",
-      "duration": 38025
+      "duration": 39004
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-handDrawn-v3.spec.js",
-      "duration": 36179
+      "duration": 37653
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v2.spec.js",
-      "duration": 22386
+      "duration": 23278
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v3.spec.js",
-      "duration": 35378
+      "duration": 36645
     },
     {
       "spec": "cypress/integration/rendering/classDiagram.spec.js",
-      "duration": 14967
+      "duration": 15418
     },
     {
       "spec": "cypress/integration/rendering/conf-and-directives.spec.js",
-      "duration": 9140
+      "duration": 9684
     },
     {
       "spec": "cypress/integration/rendering/current.spec.js",
-      "duration": 2652
+      "duration": 2570
     },
     {
       "spec": "cypress/integration/rendering/erDiagram-unified.spec.js",
-      "duration": 82257
+      "duration": 84687
     },
     {
       "spec": "cypress/integration/rendering/erDiagram.spec.js",
-      "duration": 14138
+      "duration": 14819
     },
     {
       "spec": "cypress/integration/rendering/errorDiagram.spec.js",
-      "duration": 3718
+      "duration": 3371
     },
     {
       "spec": "cypress/integration/rendering/flowchart-elk.spec.js",
-      "duration": 39683
+      "duration": 39925
     },
     {
       "spec": "cypress/integration/rendering/flowchart-handDrawn.spec.js",
-      "duration": 28676
+      "duration": 34694
     },
     {
       "spec": "cypress/integration/rendering/flowchart-icon.spec.js",
-      "duration": 7080
+      "duration": 7137
     },
     {
       "spec": "cypress/integration/rendering/flowchart-shape-alias.spec.ts",
-      "duration": 23175
+      "duration": 24740
     },
     {
       "spec": "cypress/integration/rendering/flowchart-v2.spec.js",
-      "duration": 40846
+      "duration": 42077
     },
     {
       "spec": "cypress/integration/rendering/flowchart.spec.js",
-      "duration": 29743
+      "duration": 30642
     },
     {
       "spec": "cypress/integration/rendering/gantt.spec.js",
-      "duration": 17352
+      "duration": 18085
     },
     {
       "spec": "cypress/integration/rendering/gitGraph.spec.js",
-      "duration": 48514
+      "duration": 50107
     },
     {
       "spec": "cypress/integration/rendering/iconShape.spec.ts",
-      "duration": 262422
+      "duration": 276279
     },
     {
       "spec": "cypress/integration/rendering/imageShape.spec.ts",
-      "duration": 54513
+      "duration": 56505
     },
     {
       "spec": "cypress/integration/rendering/info.spec.ts",
-      "duration": 3025
+      "duration": 3036
     },
     {
       "spec": "cypress/integration/rendering/journey.spec.js",
-      "duration": 6994
+      "duration": 6889
     },
     {
       "spec": "cypress/integration/rendering/kanban.spec.ts",
-      "duration": 7346
+      "duration": 7353
     },
     {
       "spec": "cypress/integration/rendering/katex.spec.js",
-      "duration": 3642
+      "duration": 3580
     },
     {
       "spec": "cypress/integration/rendering/marker_unique_id.spec.js",
-      "duration": 2464
+      "duration": 2508
     },
     {
       "spec": "cypress/integration/rendering/mindmap.spec.ts",
-      "duration": 10882
+      "duration": 10939
     },
     {
       "spec": "cypress/integration/rendering/newShapes.spec.ts",
-      "duration": 142092
+      "duration": 149102
     },
     {
       "spec": "cypress/integration/rendering/oldShapes.spec.ts",
-      "duration": 109340
+      "duration": 113987
     },
     {
       "spec": "cypress/integration/rendering/packet.spec.ts",
-      "duration": 4167
+      "duration": 4060
     },
     {
       "spec": "cypress/integration/rendering/pie.spec.ts",
-      "duration": 5736
+      "duration": 5715
     },
     {
       "spec": "cypress/integration/rendering/quadrantChart.spec.js",
-      "duration": 8628
+      "duration": 8945
     },
     {
       "spec": "cypress/integration/rendering/radar.spec.js",
-      "duration": 5311
+      "duration": 5337
     },
     {
       "spec": "cypress/integration/rendering/requirement.spec.js",
-      "duration": 2619
+      "duration": 2643
     },
     {
       "spec": "cypress/integration/rendering/requirementDiagram-unified.spec.js",
-      "duration": 50640
+      "duration": 52072
     },
     {
       "spec": "cypress/integration/rendering/sankey.spec.ts",
-      "duration": 6735
+      "duration": 6692
     },
     {
       "spec": "cypress/integration/rendering/sequencediagram.spec.js",
-      "duration": 34777
+      "duration": 35721
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram-v2.spec.js",
-      "duration": 24440
+      "duration": 26030
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram.spec.js",
-      "duration": 15476
+      "duration": 16333
     },
     {
       "spec": "cypress/integration/rendering/theme.spec.js",
-      "duration": 27932
+      "duration": 29287
     },
     {
       "spec": "cypress/integration/rendering/timeline.spec.ts",
-      "duration": 8162
+      "duration": 8491
     },
     {
       "spec": "cypress/integration/rendering/treemap.spec.ts",
-      "duration": 11763
+      "duration": 12291
     },
     {
       "spec": "cypress/integration/rendering/xyChart.spec.js",
-      "duration": 19759
+      "duration": 20651
     },
     {
       "spec": "cypress/integration/rendering/zenuml.spec.js",
-      "duration": 3316
+      "duration": 3218
     }
   ]
 }