Merge branch '6671-code-coverage' of https://github.com/mermaid-js/mermaid into 6671-code-coverage

.build/common.ts

@@ -33,11 +33,6 @@ export const packageOptions = {
     packageName: 'mermaid-layout-elk',
     file: 'layouts.ts',
   },
-  'mermaid-layout-tidy-tree': {
-    name: 'mermaid-layout-tidy-tree',
-    packageName: 'mermaid-layout-tidy-tree',
-    file: 'index.ts',
-  },
   examples: {
     name: 'mermaid-examples',
     packageName: 'examples',

.changeset/brave-baths-behave.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Prevent HTML tags from being escaped in sandbox label rendering

.changeset/brave-memes-flash.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Support edge animation in hand drawn look

.changeset/busy-mirrors-try.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Resolved parsing error where direction TD was not recognized within subgraphs

.changeset/chilly-words-march.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Correct viewBox casing and make SVGs responsive

.changeset/crazy-loops-matter.md

@@ -0,0 +1,5 @@
+---
+'mermaid': patch
+---
+
+fix: Handle arrows correctly when auto number is enabled

.changeset/curly-apes-prove.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Improve participant parsing and prevent recursive loops on invalid syntax

.changeset/hungry-baths-glow.md

@@ -0,0 +1,5 @@
+---
+'mermaid': minor
+---
+
+feat: Added support for new participant types (`actor`, `boundary`, `control`, `entity`, `database`, `collections`, `queue`) in `sequenceDiagram`.

.changeset/lazy-brooms-battle.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-feat: add alias support for new participant syntax of sequence diagrams

.changeset/loud-results-melt.md

@@ -1,5 +0,0 @@
----
-'mermaid': minor
----
-
-feat: Add half-arrowheads (solid & stick) and central connection support

.changeset/short-seals-sort.md

@@ -1,5 +0,0 @@
----
-'mermaid': minor
----
-
-feat: allow to put notes in namespaces on classDiagram

.changeset/slow-lemons-know.md

@@ -1,5 +0,0 @@
----
-'@mermaid': patch
----
-
-fix: Mindmap breaking in ELK layout

.changeset/sweet-games-build.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix(er-diagram): prevent syntax error when using 'u', numbers, and decimals in node names

.changeset/ten-plums-bet.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Support ComponentQueue_Ext to prevent parsing error

.changeset/wide-lines-trade.md

@@ -1,5 +0,0 @@
----
-'mermaid': patch
----
-
-fix: Mindmap rendering issue when the number of Level 2 nodes exceeds 11

.cspell/code-terms.txt

@@ -1,5 +1,3 @@
-!viewbox
-# It should be viewBox
 # This file contains coding related terms
 ALPHANUM
 antiscript

.cspell/libraries.txt

@@ -64,7 +64,6 @@ rscratch
 shiki
 Slidev
 sparkline
-speccharts
 sphinxcontrib
 ssim
 stylis

.cspell/mermaid-terms.txt

@@ -5,10 +5,8 @@ bmatrix
 braintree
 catmull
 compositTitleSize
-cose
 curv
 doublecircle
-elem
 elems
 gantt
 gitgraph

.cspell/misc-terms.txt

@@ -1,5 +1,4 @@
 BRANDES
-Buzan
 circo
 handDrawn
 KOEPF

.esbuild/util.ts

@@ -71,9 +71,6 @@ export const getBuildConfig = (options: MermaidBuildOptions): BuildOptions => {
 
   const external: string[] = ['require', 'fs', 'path'];
   const outFileName = getFileName(name, options);
-  const { dependencies, version } = JSON.parse(
-    readFileSync(resolve(__dirname, `../packages/${packageName}/package.json`), 'utf-8')
-  );
   const output: BuildOptions = buildOptions({
     ...rest,
     absWorkingDir: resolve(__dirname, `../packages/${packageName}`),
@@ -85,13 +82,15 @@ export const getBuildConfig = (options: MermaidBuildOptions): BuildOptions => {
     chunkNames: `chunks/${outFileName}/[name]-[hash]`,
     define: {
       // This needs to be stringified for esbuild
-      'injected.includeLargeFeatures': `${includeLargeFeatures}`,
-      'injected.version': `'${version}'`,
+      includeLargeFeatures: `${includeLargeFeatures}`,
       'import.meta.vitest': 'undefined',
     },
   });
 
   if (core) {
+    const { dependencies } = JSON.parse(
+      readFileSync(resolve(__dirname, `../packages/${packageName}/package.json`), 'utf-8')
+    );
     // Core build is used to generate file without bundled dependencies.
     // This is used by downstream projects to bundle dependencies themselves.
     // Ignore dependencies and any dependencies of dependencies

.github/workflows/codeql.yml

@@ -26,8 +26,8 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: ['javascript', 'actions']
-        # CodeQL supports [ 'actions', 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
+        language: ['javascript']
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
         # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
 
     steps:
@@ -36,7 +36,7 @@ jobs:
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@5378192d256ef1302a6980fffe5ca04426d43091 # v3.28.21
+        uses: github/codeql-action/init@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10
         with:
           config-file: ./.github/codeql/codeql-config.yml
           languages: ${{ matrix.language }}
@@ -48,7 +48,7 @@ jobs:
       # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
       # If this step fails, then you should remove it and run the build manually (see below)
       - name: Autobuild
-        uses: github/codeql-action/autobuild@5378192d256ef1302a6980fffe5ca04426d43091 # v3.28.21
+        uses: github/codeql-action/autobuild@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10
 
       # ℹ️ Command-line programs to run using the OS shell.
       # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
@@ -62,4 +62,4 @@ jobs:
       #   make release
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@5378192d256ef1302a6980fffe5ca04426d43091 # v3.28.21
+        uses: github/codeql-action/analyze@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10

.github/workflows/e2e-applitools.yml

@@ -53,7 +53,7 @@ jobs:
           args: -X POST "$APPLITOOLS_SERVER_URL/api/externals/github/push?apiKey=$APPLITOOLS_API_KEY&CommitSha=$GITHUB_SHA&BranchName=${APPLITOOLS_BRANCH}$&ParentBranchName=$APPLITOOLS_PARENT_BRANCH"
 
       - name: Cypress run
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         id: cypress
         with:
           start: pnpm run dev

.github/workflows/e2e-timings.yml

@@ -27,12 +27,12 @@ jobs:
         with:
           node-version-file: '.node-version'
       - name: Install dependencies
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         with:
           runTests: false
 
       - name: Cypress run
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         id: cypress
         with:
           install: false
@@ -58,7 +58,7 @@ jobs:
           echo "EOF" >> $GITHUB_OUTPUT
 
       - name: Commit and create pull request
-        uses: peter-evans/create-pull-request@84ae59a2cdc2258d6fa0732dd66352dddae2a412
+        uses: peter-evans/create-pull-request@18e469570b1cf0dfc11d60ec121099f8ff3e617a
         with:
           add-paths: |
             cypress/timings.json

.github/workflows/e2e.yml

@@ -38,6 +38,8 @@ jobs:
       options: --user 1001
     steps:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
+        with:
+          fetch-depth: 0
       - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
       - name: Setup Node.js
         uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0
@@ -45,7 +47,7 @@ jobs:
           node-version-file: '.node-version'
       - name: Cache snapshots
         id: cache-snapshot
-        uses: actions/cache@0400d5f644dc74513175e3cd8d07132dd4860809 # v4.2.4
+        uses: actions/cache@0c907a75c2c80ebcb7f088228285e798b750cf8f # v4.2.1
         with:
           path: ./cypress/snapshots
           key: ${{ runner.os }}-snapshots-${{ env.targetHash }}
@@ -55,11 +57,12 @@ jobs:
         if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }}
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
         with:
+          fetch-depth: 0
           ref: ${{ env.targetHash }}
 
       - name: Install dependencies
         if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }}
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         with:
           # just perform install
           runTests: false
@@ -83,6 +86,8 @@ jobs:
         containers: [1, 2, 3, 4, 5]
     steps:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
+        with:
+          fetch-depth: 0
 
       - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
         # uses version from "packageManager" field in package.json
@@ -95,13 +100,13 @@ jobs:
       # These cached snapshots are downloaded, providing the reference snapshots.
       - name: Cache snapshots
         id: cache-snapshot
-        uses: actions/cache/restore@0400d5f644dc74513175e3cd8d07132dd4860809 # v4.2.4
+        uses: actions/cache/restore@0c907a75c2c80ebcb7f088228285e798b750cf8f # v4.2.1
         with:
           path: ./cypress/snapshots
           key: ${{ runner.os }}-snapshots-${{ env.targetHash }}
 
       - name: Install dependencies
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         with:
           runTests: false
 
@@ -117,7 +122,7 @@ jobs:
       # Install NPM dependencies, cache them correctly
       # and run all Cypress tests
       - name: Cypress run
-        uses: cypress-io/github-action@108b8684ae52e735ff7891524cbffbcd4be5b19f # v6.7.16
+        uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12
         id: cypress
         with:
           install: false
@@ -137,13 +142,118 @@ jobs:
           SPLIT_INDEX: ${{ strategy.job-index }}
           SPLIT_FILE: 'cypress/timings.json'
           VITEST_COVERAGE: true
+      - name: Debug coverage generation
+        if: ${{ steps.cypress.conclusion == 'success' }}
+        run: |
+          echo "Checking if coverage files were generated:"
+          ls -la coverage/ || echo "No coverage directory"
+          ls -la coverage/cypress/ || echo "No coverage/cypress directory"
+          echo "Looking for any .info files:"
+          find . -name "*.info" -type f | head -10 || echo "No .info files found"
+      - name: Prepare coverage artifacts
+        if: ${{ steps.cypress.conclusion == 'success' }}
+        run: |
+          mkdir -p coverage/cypress
+          if [ -f coverage/cypress/coverage-final.json ]; then
+            cp coverage/cypress/coverage-final.json coverage/cypress/coverage-final-${{ matrix.containers }}.json
+            echo "Created coverage-final-${{ matrix.containers }}.json"
+            ls -la coverage/cypress/coverage-final-${{ matrix.containers }}.json
+          else
+            echo "Error: coverage/cypress/coverage-final.json not found"
+            exit 1
+          fi
+      - name: Upload e2e coverage artifact
+        if: ${{ steps.cypress.conclusion == 'success' }}
+        uses: actions/upload-artifact@v4
+        with:
+          name: e2e-coverage-${{ matrix.containers }}
+          path: coverage/cypress/coverage-final-${{ matrix.containers }}.json
 
+  coverage-merge:
+    runs-on: ubuntu-latest
+    needs: e2e
+    steps:
+      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
+        with:
+          fetch-depth: 0
+      - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
+      - name: Setup Node.js
+        uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0
+        with:
+          node-version-file: '.node-version'
+      - name: Download e2e coverage shards
+        uses: actions/download-artifact@v4
+        with:
+          pattern: e2e-coverage-*
+          path: coverage/e2e-shards
+          merge-multiple: true
+      - name: Debug downloaded artifacts
+        run: |
+          echo "Contents of coverage/e2e-shards:"
+          find coverage/e2e-shards -type f -name "*.info" | head -20
+          echo "All files in coverage/e2e-shards:"
+          ls -la coverage/e2e-shards/
+          echo "Directory structure:"
+          find coverage/e2e-shards -type f | head -20
+          echo "Looking for coverage-final.json files:"
+          find coverage/e2e-shards -name "coverage-final.json" | head -20
+      - name: Install dependencies for merging
+        run: pnpm install --frozen-lockfile
+        env:
+          CYPRESS_CACHE_FOLDER: .cache/Cypress
+      - name: Prepare coverage files for merge script
+        run: |
+          mkdir -p coverage/vitest coverage/cypress
+          # Copy E2E coverage-final.json files to the structure expected by scripts/coverage.ts
+          for i in {1..5}; do
+            if [ -f "coverage/e2e-shards/coverage-final-$i.json" ]; then
+              cp "coverage/e2e-shards/coverage-final-$i.json" "coverage/cypress/coverage-final.json"
+              echo "Copied coverage-final-$i.json to cypress/"
+              break
+            fi
+          done
+          # Create a minimal but valid vitest coverage-final.json
+          echo '{"type":"Coverage","version":"1.1","data":{}}' > coverage/vitest/coverage-final.json
+          echo "Prepared coverage files:"
+          ls -la coverage/vitest/
+          ls -la coverage/cypress/
+          echo "Checking file contents:"
+          echo "Vitest coverage file:"
+          cat coverage/vitest/coverage-final.json
+          echo "Cypress coverage file:"
+          cat coverage/cypress/coverage-final.json
+          echo "Validating JSON files:"
+          if jq . coverage/vitest/coverage-final.json > /dev/null; then
+            echo "✓ Vitest coverage file is valid JSON"
+          else
+            echo "✗ Vitest coverage file is invalid JSON"
+            exit 1
+          fi
+          if jq . coverage/cypress/coverage-final.json > /dev/null; then
+            echo "✓ Cypress coverage file is valid JSON"
+          else
+            echo "✗ Cypress coverage file is invalid JSON"
+            exit 1
+          fi
+      - name: Generate LCOV from coverage data
+        run: |
+          mkdir -p coverage/combined
+          # Convert coverage-final.json to LCOV format using nyc
+          if [ -f coverage/cypress/coverage-final.json ]; then
+            echo "Converting Cypress coverage to LCOV..."
+            npx nyc report --reporter=lcov --report-dir=coverage/combined --cwd=. --temp-dir=coverage/cypress
+            echo "LCOV generation completed"
+            ls -la coverage/combined/
+          else
+            echo "No Cypress coverage file found"
+            exit 1
+          fi
       - name: Upload Coverage to Codecov
         uses: codecov/codecov-action@13ce06bfc6bbe3ecf90edbbf1bc32fe5978ca1d3 # v5.3.1
         # Run step only pushes to develop and pull_requests
-        if: ${{ steps.cypress.conclusion == 'success' && (github.event_name == 'pull_request' || github.ref == 'refs/heads/develop')}}
+        if: ${{ github.event_name == 'pull_request' || github.ref == 'refs/heads/develop'}}
         with:
-          files: coverage/cypress/lcov.info
+          files: coverage/combined/lcov.info
           flags: e2e
           name: mermaid-codecov
           fail_ci_if_error: false

.github/workflows/link-checker.yml

@@ -32,7 +32,7 @@ jobs:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
 
       - name: Restore lychee cache
-        uses: actions/cache@0400d5f644dc74513175e3cd8d07132dd4860809 # v4.2.4
+        uses: actions/cache@0c907a75c2c80ebcb7f088228285e798b750cf8f # v4.2.1
         with:
           path: .lycheecache
           key: cache-lychee-${{ github.sha }}

.github/workflows/release.yml

@@ -36,10 +36,11 @@ jobs:
 
       - name: Create Release Pull Request or Publish to npm
         id: changesets
-        uses: changesets/action@06245a4e0a36c064a573d4150030f5ec548e4fcc # v1.4.10
+        uses: changesets/action@c8bada60c408975afd1a20b3db81d6eee6789308 # v1.4.9
         with:
           version: pnpm changeset:version
           publish: pnpm changeset:publish
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           NPM_CONFIG_PROVENANCE: true

.github/workflows/scorecard.yml

@@ -20,18 +20,18 @@ jobs:
         with:
           persist-credentials: false
       - name: Run analysis
-        uses: ossf/scorecard-action@4eaacf0543bb3f2c246792bd56e8cdeffafb205a # v2.4.3
+        uses: ossf/scorecard-action@f49aabe0b5af0936a0987cfb85d86b75731b0186 # v2.4.1
         with:
           results_file: results.sarif
           results_format: sarif
           publish_results: true
       - name: Upload artifact
-        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4.6.2
+        uses: actions/upload-artifact@4cec3d8aa04e39d1a68397de0c4cd6fb9dce8ec1 # v4.6.1
         with:
           name: SARIF file
           path: results.sarif
           retention-days: 5
       - name: Upload to code-scanning
-        uses: github/codeql-action/upload-sarif@5378192d256ef1302a6980fffe5ca04426d43091 # v3.28.21
+        uses: github/codeql-action/upload-sarif@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10
         with:
           sarif_file: results.sarif

.github/workflows/test.yml

@@ -10,6 +10,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
+        with:
+          fetch-depth: 0
 
       - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
         # uses version from "packageManager" field in package.json
@@ -41,7 +43,6 @@ jobs:
       - name: Verify out-of-tree build with TypeScript
         run: |
           pnpm test:check:tsc
-
       - name: Upload Coverage to Codecov
         uses: codecov/codecov-action@13ce06bfc6bbe3ecf90edbbf1bc32fe5978ca1d3 # v5.3.1
         # Run step only pushes to develop and pull_requests

.github/workflows/update-browserlist.yml

@@ -19,7 +19,7 @@ jobs:
           message: 'chore: update browsers list'
           push: false
       - name: Create Pull Request
-        uses: peter-evans/create-pull-request@84ae59a2cdc2258d6fa0732dd66352dddae2a412 # v7.0.9
+        uses: peter-evans/create-pull-request@67ccf781d68cd99b580ae25a5c18a1cc84ffff1f # v7.0.6
         with:
           branch: update-browserslist
           title: Update Browserslist

.github/workflows/validate-lockfile.yml

@@ -1,7 +1,7 @@
 name: Validate pnpm-lock.yaml
 
 on:
-  pull_request_target:
+  pull_request:
     paths:
       - 'pnpm-lock.yaml'
       - '**/package.json'
@@ -15,8 +15,13 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
-          ref: ${{ github.event.pull_request.head.sha }}
-          repository: ${{ github.event.pull_request.head.repo.full_name }}
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
 
       - name: Validate pnpm-lock.yaml entries
         id: validate # give this step an ID so we can reference its outputs
@@ -30,7 +35,7 @@ jobs:
 
           # 2) No unwanted vitepress paths
           if grep -qF 'packages/mermaid/src/vitepress' pnpm-lock.yaml; then
-            issues+=("• Disallowed path 'packages/mermaid/src/vitepress' present. Run \`rm -rf packages/mermaid/src/vitepress && pnpm install\` to regenerate.")
+            issues+=("• Disallowed path 'packages/mermaid/src/vitepress' present. Run `rm -rf packages/mermaid/src/vitepress && pnpm install` to regenerate.")
           fi
 
           # 3) Lockfile only changes when package.json changes
@@ -50,41 +55,16 @@ jobs:
             exit 1
           fi
 
-      - name: Find existing lockfile validation comment
-        if: always()
-        uses: peter-evans/find-comment@v3
-        id: find-comment
-        with:
-          issue-number: ${{ github.event.pull_request.number }}
-          comment-author: 'github-actions[bot]'
-          body-includes: 'Lockfile Validation Failed'
-
       - name: Comment on PR if validation failed
         if: failure()
-        uses: peter-evans/create-or-update-comment@v5
+        uses: peter-evans/create-or-update-comment@v4
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
           issue-number: ${{ github.event.pull_request.number }}
-          comment-id: ${{ steps.find-comment.outputs.comment-id }}
-          edit-mode: replace
           body: |
-            ❌ **Lockfile Validation Failed**
-
             The following issue(s) were detected:
             ${{ steps.validate.outputs.errors }}
 
             Please address these and push an update.
 
             _Posted automatically by GitHub Actions_
-
-      - name: Delete comment if validation passed
-        if: success() && steps.find-comment.outputs.comment-id != ''
-        uses: actions/github-script@v7
-        with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          script: |
-            await github.rest.issues.deleteComment({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              comment_id: ${{ steps.find-comment.outputs.comment-id }},
-            });

.gitignore

@@ -4,7 +4,6 @@ node_modules/
 coverage/
 .idea/
 .pnpm-store/
-.instructions/
 
 dist
 v8-compile-cache-0

.nycrc

@@ -0,0 +1,14 @@
+{
+  "reporter": ["text", "lcov", "json", "html"],
+  "exclude": [
+    "node_modules/**/*",
+    "cypress/**/*",
+    "coverage/**/*",
+    "**/*.spec.js",
+    "**/*.spec.ts",
+    "**/*.test.js",
+    "**/*.test.ts"
+  ],
+  "all": true,
+  "check-coverage": false
+}

.vite/build.ts

@@ -78,8 +78,6 @@ export const getBuildConfig = ({ minify, core, watch, entryName }: BuildOptions)
     },
     define: {
       'import.meta.vitest': 'undefined',
-      'injected.includeLargeFeatures': 'true',
-      'injected.version': `'0.0.0'`,
     },
     resolve: {
       extensions: [],
@@ -96,6 +94,10 @@ export const getBuildConfig = ({ minify, core, watch, entryName }: BuildOptions)
       }),
       ...visualizerOptions(packageName, core),
     ],
+    define: {
+      // Needs to be string
+      includeLargeFeatures: 'true',
+    },
   };
 
   if (watch && config.build) {

Dockerfile

@@ -5,7 +5,7 @@ USER 0:0
 RUN corepack enable \
     && corepack enable pnpm
 
-RUN apk add --no-cache git~=2.43 \
+RUN apk add --no-cache git~=2.43.4 \
     && git config --add --system safe.directory /mermaid
 
 ENV NODE_OPTIONS="--max_old_space_size=8192"

codecov.yml

@@ -0,0 +1,27 @@
+coverage:
+  status:
+    project:
+      default:
+        target: auto
+        threshold: 1%
+    patch:
+      default:
+        target: auto
+        threshold: 1%
+
+comment:
+  layout: 'reach,diff,flags,tree'
+  behavior: default
+  require_changes: false
+
+flags:
+  unit:
+    paths:
+      - packages/
+  e2e:
+    paths:
+      - packages/
+
+# Wait for both unit and e2e coverage uploads before finalizing
+notify:
+  after_n_builds: 2

cypress.config.ts

@@ -15,6 +15,13 @@ export default eyesPlugin(
       setupNodeEvents(on, config) {
         coverage(on, config);
         cypressSplit(on, config);
+
+        // Ensure coverage generates LCOV format
+        on('task', {
+          coverage: () => {
+            return null;
+          },
+        });
         on('before:browser:launch', (browser, launchOptions) => {
           if (browser.name === 'chrome' && browser.isHeadless) {
             launchOptions.args.push('--window-size=1440,1024', '--force-device-scale-factor=1');

cypress/helpers/util.ts

@@ -6,7 +6,6 @@ interface CypressConfig {
   listUrl?: boolean;
   listId?: string;
   name?: string;
-  screenshot?: boolean;
 }
 type CypressMermaidConfig = MermaidConfig & CypressConfig;
 
@@ -91,33 +90,20 @@ export const renderGraph = (
 
 export const openURLAndVerifyRendering = (
   url: string,
-  { screenshot = true, ...options }: CypressMermaidConfig,
+  options: CypressMermaidConfig,
   validation?: any
 ): void => {
   const name: string = (options.name ?? cy.state('runnable').fullTitle()).replace(/\s+/g, '-');
 
   cy.visit(url);
   cy.window().should('have.property', 'rendered', true);
+  cy.get('svg').should('be.visible');
 
-  // Handle sandbox mode where SVG is inside an iframe
-  if (options.securityLevel === 'sandbox') {
-    cy.get('iframe').should('be.visible');
-    if (validation) {
-      cy.get('iframe').should(validation);
-    }
-  } else {
-    cy.get('svg').should('be.visible');
-    // cspell:ignore viewbox
-    cy.get('svg').should('not.have.attr', 'viewbox');
-
-    if (validation) {
-      cy.get('svg').should(validation);
-    }
+  if (validation) {
+    cy.get('svg').should(validation);
   }
 
-  if (screenshot) {
-    verifyScreenshot(name);
-  }
+  verifyScreenshot(name);
 };
 
 export const verifyScreenshot = (name: string): void => {

cypress/integration/other/configuration.spec.js

@@ -98,12 +98,12 @@ describe('Configuration', () => {
     it('should handle arrowMarkerAbsolute set to true', () => {
       renderGraph(
         `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]
-    `,
+        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]
+        `,
         {
           arrowMarkerAbsolute: true,
         }
@@ -113,7 +113,8 @@ describe('Configuration', () => {
         cy.get('path')
           .first()
           .should('have.attr', 'marker-end')
-          .and('include', 'url(http://localhost');
+          .should('exist')
+          .and('include', 'url(http\\:\\/\\/localhost');
       });
     });
     it('should not taint the initial configuration when using multiple directives', () => {

cypress/integration/rendering/c4.spec.js

@@ -114,28 +114,4 @@ describe('C4 diagram', () => {
       {}
     );
   });
-  it('C4.6 should render C4Context diagram with ComponentQueue_Ext', () => {
-    imgSnapshotTest(
-      `
-      C4Context
-      title System Context diagram with ComponentQueue_Ext
-
-      Enterprise_Boundary(b0, "BankBoundary0") {
-          Person(customerA, "Banking Customer A", "A customer of the bank, 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") {
-            ComponentQueue_Ext(msgQueue, "Message Queue", "RabbitMQ", "External message queue system for processing banking transactions")
-            System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
-          }
-        }
-
-      BiRel(customerA, SystemAA, "Uses")
-      Rel(SystemAA, msgQueue, "Sends messages to")
-      Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
-      `,
-      {}
-    );
-  });
 });

cypress/integration/rendering/classDiagram-v2.spec.js

@@ -562,20 +562,6 @@ class C13["With Città foreign language"]
       `
     );
   });
-  it('should add notes in namespaces', function () {
-    imgSnapshotTest(
-      `
-      classDiagram
-      note "This is a outer note"
-      note for C1 "This is a outer note for C1"
-      namespace Namespace1 {
-        note "This is a inner note"
-        note for C1 "This is a inner note for C1"
-        class C1
-      }
-      `
-    );
-  });
   it('should render a simple class diagram with no members', () => {
     imgSnapshotTest(
       `

cypress/integration/rendering/classDiagram-v3.spec.js

@@ -709,20 +709,6 @@ class C13["With Città foreign language"]
       `
     );
   });
-  it('should add notes in namespaces', function () {
-    imgSnapshotTest(
-      `
-      classDiagram
-      note "This is a outer note"
-      note for C1 "This is a outer note for C1"
-      namespace Namespace1 {
-        note "This is a inner note"
-        note for C1 "This is a inner note for C1"
-        class C1
-      }
-      `
-    );
-  });
   it('should render a simple class diagram with no members', () => {
     imgSnapshotTest(
       `

cypress/integration/rendering/classDiagram.spec.js

@@ -524,18 +524,5 @@ describe('Class diagram', () => {
       `,
       {}
     );
-    it('should handle an empty class body with empty braces', () => {
-      imgSnapshotTest(
-        ` classDiagram
-        class FooBase~T~ {}
-    class Bar {
-        +Zip
-        +Zap()
-    }
-    FooBase <|-- Ba
-        `,
-        { flowchart: { defaultRenderer: 'elk' } }
-      );
-    });
   });
 });

cypress/integration/rendering/erDiagram.spec.js

@@ -369,92 +369,4 @@ ORDER ||--|{ LINE-ITEM : contains
       );
     });
   });
-
-  describe('Special characters and numbers syntax', () => {
-    it('should render ER diagram with numeric entity names', () => {
-      imgSnapshotTest(
-        `
-        erDiagram
-          1 ||--|| ORDER : places
-          ORDER ||--|{ 2 : contains
-          2 ||--o{ 3.5 : references
-        `,
-        { logLevel: 1 }
-      );
-    });
-
-    it('should render ER diagram with "u" character in entity names and cardinality', () => {
-      imgSnapshotTest(
-        `
-        erDiagram
-          CUSTOMER ||--|| u : has
-          u ||--|| ORDER : places
-          PROJECT u--o{ TEAM_MEMBER : "parent"
-        `,
-        { logLevel: 1 }
-      );
-    });
-
-    it('should render ER diagram with decimal numbers in relationships', () => {
-      imgSnapshotTest(
-        `
-        erDiagram
-          2.5 ||--|| 1.5 : has
-          CUSTOMER ||--o{ 3.14 : references
-          1.0 ||--|{ ORDER : contains
-        `,
-        { logLevel: 1 }
-      );
-    });
-
-    it('should render ER diagram with numeric entity names and attributes', () => {
-      imgSnapshotTest(
-        `
-        erDiagram
-          1 {
-            string name
-            int value
-          }
-          1 ||--|| ORDER : places
-          ORDER {
-            float price
-            string description
-          }
-        `,
-        { logLevel: 1 }
-      );
-    });
-
-    it('should render complex ER diagram with mixed special entity names', () => {
-      imgSnapshotTest(
-        `
-        erDiagram
-          CUSTOMER ||--o{ 1 : places
-          1 ||--|{ u : contains
-          1.5
-          u ||--|| 2.5 : processes
-          2.5 {
-            string id
-            float value
-          }
-          u {
-            varchar(50) name
-            int count
-          }
-        `,
-        { logLevel: 1 }
-      );
-    });
-    it('should render ER diagram with standalone numeric entities', () => {
-      imgSnapshotTest(
-        `erDiagram
-         PRODUCT ||--o{ ORDER-ITEM : has
-         1.5
-         u
-         1
-        `,
-        { logLevel: 1 }
-      );
-    });
-  });
 });

cypress/integration/rendering/flowchart-elk.spec.js

@@ -109,7 +109,7 @@ describe('Flowchart ELK', () => {
       const style = svg.attr('style');
       expect(style).to.match(/^max-width: [\d.]+px;$/);
       const maxWidthValue = parseFloat(style.match(/[\d.]+/g).join(''));
-      verifyNumber(maxWidthValue, 380, 15);
+      verifyNumber(maxWidthValue, 380);
     });
   });
   it('8-elk: should render a flowchart when useMaxWidth is false', () => {
@@ -128,7 +128,7 @@ describe('Flowchart ELK', () => {
       const width = parseFloat(svg.attr('width'));
       // use within because the absolute value can be slightly different depending on the environment ±5%
       // expect(height).to.be.within(446 * 0.95, 446 * 1.05);
-      verifyNumber(width, 380, 15);
+      verifyNumber(width, 380);
       expect(svg).to.not.have.attr('style');
     });
   });

cypress/integration/rendering/flowchart-handDrawn.spec.js

@@ -1029,19 +1029,4 @@ graph TD
       }
     );
   });
-
-  it('FDH49: should add edge animation', () => {
-    renderGraph(
-      `
-      flowchart TD
-          A(["Start"]) L_A_B_0@--> B{"Decision"}
-          B --> C["Option A"] & D["Option B"]
-          style C stroke-width:4px,stroke-dasharray: 5
-          L_A_B_0@{ animation: slow } 
-          L_B_D_0@{ animation: fast }`,
-      { look: 'handDrawn', screenshot: false }
-    );
-    cy.get('path#L_A_B_0').should('have.class', 'edge-animation-slow');
-    cy.get('path#L_B_D_0').should('have.class', 'edge-animation-fast');
-  });
 });

cypress/integration/rendering/flowchart-v2.spec.js

@@ -79,18 +79,6 @@ describe('Flowchart v2', () => {
       { htmlLabels: true, flowchart: { htmlLabels: true }, securityLevel: 'loose' }
     );
   });
-  it('6a: should render complex HTML in labels with sandbox security', () => {
-    imgSnapshotTest(
-      `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]
-      `,
-      { securityLevel: 'sandbox', flowchart: { htmlLabels: true } }
-    );
-  });
   it('7: should render a flowchart when useMaxWidth is true (default)', () => {
     renderGraph(
       `flowchart TD
@@ -1198,17 +1186,4 @@ end
       imgSnapshotTest(graph, { htmlLabels: false });
     });
   });
-
-  it('V2 - 17: should apply class def colour to edge label', () => {
-    imgSnapshotTest(
-      ` graph LR
-    id1(Start) link@-- "Label" -->id2(Stop)
-    style id1 fill:#f9f,stroke:#333,stroke-width:4px
-
-class id2 myClass
-classDef myClass fill:#bbf,stroke:#f66,stroke-width:2px,color:white,stroke-dasharray: 5 5
-class link myClass
-`
-    );
-  });
 });

cypress/integration/rendering/flowchart.spec.js

@@ -774,21 +774,6 @@ describe('Graph', () => {
       expect(svg).to.not.have.attr('style');
     });
   });
-  it('40: should add edge animation', () => {
-    renderGraph(
-      `
-      flowchart TD
-          A(["Start"]) L_A_B_0@--> B{"Decision"}
-          B --> C["Option A"] & D["Option B"]
-          style C stroke-width:4px,stroke-dasharray: 5
-          L_A_B_0@{ animation: slow } 
-          L_B_D_0@{ animation: fast }`,
-      { screenshot: false }
-    );
-    // Verify animation classes are applied to both edges
-    cy.get('path#L_A_B_0').should('have.class', 'edge-animation-slow');
-    cy.get('path#L_B_D_0').should('have.class', 'edge-animation-fast');
-  });
   it('58: handle styling with style expressions', () => {
     imgSnapshotTest(
       `
@@ -988,19 +973,4 @@ graph TD
       }
     );
   });
-
-  it('70: should render a subgraph with direction TD', () => {
-    imgSnapshotTest(
-      `
-      flowchart LR
-        subgraph A
-          direction TD
-          a --> b
-        end
-      `,
-      {
-        fontFamily: 'courier',
-      }
-    );
-  });
 });

cypress/integration/rendering/gantt.spec.js

@@ -803,34 +803,4 @@ describe('Gantt diagram', () => {
       {}
     );
   });
-  it('should handle numeric timestamps with dateFormat x', () => {
-    imgSnapshotTest(
-      `
-     gantt
-     title Process time profile (ms)
-     dateFormat x
-     axisFormat %L
-     tickInterval 250millisecond
-
-     section Pipeline
-     Parse JSON p1: 000, 120
-    `,
-      {}
-    );
-  });
-  it('should handle numeric timestamps with dateFormat X', () => {
-    imgSnapshotTest(
-      `
-     gantt
-     title Process time profile (ms)
-     dateFormat X
-     axisFormat %L
-     tickInterval 250millisecond
-
-     section Pipeline
-     Parse JSON p1: 000, 120
-    `,
-      {}
-    );
-  });
 });

cypress/integration/rendering/mindmap-tidy-tree.spec.js

@@ -1,79 +0,0 @@
-import { imgSnapshotTest } from '../../helpers/util.ts';
-
-describe('Mindmap Tidy Tree', () => {
-  it('1-tidy-tree: should render a simple mindmap without children', () => {
-    imgSnapshotTest(
-      ` ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap))
-        A
-        B
-      `
-    );
-  });
-  it('2-tidy-tree: should render a simple mindmap', () => {
-    imgSnapshotTest(
-      ` ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap is a long thing))
-        A
-        B
-        C
-        D
-      `
-    );
-  });
-  it('3-tidy-tree: should render a  mindmap with different shapes', () => {
-    imgSnapshotTest(
-      ` ---
-      config:
-        layout: tidy-tree
-      ---
-      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
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-      `
-    );
-  });
-  it('4-tidy-tree: should render a mindmap with children', () => {
-    imgSnapshotTest(
-      ` ---
-      config:
-        layout: tidy-tree
-      ---
-       mindmap
-      ((This is a mindmap))
-        child1
-         grandchild 1
-         grandchild 2
-        child2
-         grandchild 3
-         grandchild 4
-        child3
-         grandchild 5
-         grandchild 6
-      `
-    );
-  });
-});

cypress/integration/rendering/mindmap.spec.ts

@@ -159,10 +159,12 @@ root
   });
   it('square shape', () => {
     imgSnapshotTest(
-      `mindmap
+      `
+mindmap
     root[
       The root
-    ]`,
+    ]
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -170,10 +172,12 @@ root
   });
   it('rounded rect shape', () => {
     imgSnapshotTest(
-      `mindmap
+      `
+mindmap
     root((
       The root
-    ))`,
+    ))
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -181,10 +185,12 @@ root
   });
   it('circle shape', () => {
     imgSnapshotTest(
-      `mindmap
+      `
+mindmap
     root(
       The root
-    )`,
+    )
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -192,8 +198,10 @@ root
   });
   it('default shape', () => {
     imgSnapshotTest(
-      `mindmap
-  The root`,
+      `
+mindmap
+  The root
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -201,10 +209,12 @@ root
   });
   it('adding children', () => {
     imgSnapshotTest(
-      `mindmap
+      `
+mindmap
   The root
     child1
-    child2`,
+    child2
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -212,11 +222,13 @@ root
   });
   it('adding grand children', () => {
     imgSnapshotTest(
-      `mindmap
+      `
+mindmap
   The root
     child1
       child2
-      child3`,
+      child3
+      `,
       {},
       undefined,
       shouldHaveRoot
@@ -228,50 +240,28 @@ root
         `mindmap
     id1[\`**Start** with
     a second line 😎\`]
-      id2[\`The dog in **the** hog... a *very long text* about it Word!\`]`
+      id2[\`The dog in **the** hog... a *very long text* about it
+Word!\`]
+`
       );
     });
   });
   describe('Include char sequence "graph" in text (#6795)', () => {
     it('has a label with char sequence "graph"', () => {
       imgSnapshotTest(
-        ` mindmap
+        `
+        mindmap
           root
             Photograph
               Waterfall
               Landscape
             Geography
               Mountains
-              Rocks`,
+              Rocks
+        `,
         { flowchart: { defaultRenderer: 'elk' } }
       );
     });
   });
-  describe('Level 2 nodes exceeding 11', () => {
-    it('should render all Level 2 nodes correctly when there are more than 11', () => {
-      imgSnapshotTest(
-        `mindmap
-root
-  Node1
-  Node2
-  Node3
-  Node4
-  Node5
-  Node6
-  Node7
-  Node8
-  Node9
-  Node10
-  Node11
-  Node12
-  Node13
-  Node14
-  Node15`,
-        {},
-        undefined,
-        shouldHaveRoot
-      );
-    });
-  });
   /* The end */
 });

cypress/integration/rendering/sequencediagram-v2.spec.js

@@ -655,975 +655,5 @@ describe('Sequence Diagram Special Cases', () => {
         expect(svg).to.not.have.attr('style');
       });
     });
-
-    describe('Central Connection Rendering Tests', () => {
-      it('should render central connection circles on actor vertical lines', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        participant Charlie
-        Alice ()->>() Bob: Central connection
-        Bob ()-->> Charlie: Reverse central connection
-        Charlie ()<<-->>() Alice: Dual central connection`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with different arrow types', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        Alice ()->>() Bob: Solid open arrow
-        Alice ()-->>() Bob: Dotted open arrow
-        Alice ()-x() Bob: Solid cross
-        Alice ()--x() Bob: Dotted cross
-        Alice ()->() Bob: Solid arrow`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with bidirectional arrows', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        Alice ()<<->>() Bob: Bidirectional solid
-        Alice ()<<-->>() Bob: Bidirectional dotted`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with activations', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        participant Charlie
-        Alice ()->>() Bob: Activate Bob
-        activate Bob
-        Bob ()-->> Charlie: Message to Charlie
-        Bob ()->>() Alice: Response to Alice
-        deactivate Bob`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections mixed with normal messages', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        participant Charlie
-        Alice ->> Bob: Normal message
-        Bob ()->>() Charlie: Central connection
-        Charlie -->> Alice: Normal dotted message
-        Alice ()<<-->>() Bob: Dual central connection
-        Bob -x Charlie: Normal cross message`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with notes', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        participant Charlie
-        Alice ()->>() Bob: Central connection
-        Note over Alice,Bob: Central connection note
-        Bob ()-->> Charlie: Reverse central connection
-        Note right of Charlie: Response note
-        Charlie ()<<-->>() Alice: Dual central connection`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with loops and alternatives', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-        participant Alice
-        participant Bob
-        participant Charlie
-        loop Every minute
-            Alice ()->>() Bob: Central heartbeat
-            Bob ()-->> Charlie: Forward heartbeat
-        end
-        alt Success
-            Charlie ()<<-->>() Alice: Success response
-        else Failure
-            Charlie ()-x() Alice: Failure response
-        end`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render central connections with different participant types', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant Alice
-          actor Bob
-          participant Charlie@{"type":"boundary"}
-          participant David@{"type":"control"}
-          participant Eve@{"type":"entity"}
-          Alice ()->>() Bob: To actor
-          Bob ()-->> Charlie: To boundary
-          Charlie ()->>() David: To control
-          David ()<<-->>() Eve: To entity
-          Eve ()-x() Alice: Back to participant`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-    });
-
-    describe('Sequence Diagram Rendering with Autonumber and All Arrow Types', () => {
-      describe('Autonumber with All Arrow Types', () => {
-        it('should render all arrow types with autonumbering', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    Alice->>Bob: Solid arrow (->>)
-    Bob-->>Alice: Dotted arrow (-->>)
-    Alice->Charlie: Solid open arrow (->)
-    Charlie-->Dave: Dotted open arrow (-->)
-    Alice-xBob: Solid cross (-x)
-    Bob--xAlice: Dotted cross (--x)
-    Alice-)Charlie: Solid point async (-)
-    Charlie--)Dave: Dotted point async (--)
-    Alice<<->>Bob: Bidirectional solid (<<->>)
-    Charlie<<-->>Dave: Bidirectional dotted (<<-->>)
-    Alice-|\\Bob: Solid top half (-|\\)
-    Bob-|/Alice: Solid bottom half (-|/)
-    Alice-\\\\Charlie: Stick top half (-\\\\)
-    Charlie-//Dave: Stick bottom half (-//)
-    Dave/|-Charlie: Solid top reverse (/|-)
-    Charlie\\|-Bob: Solid bottom reverse (\\|-)
-    Bob//-Alice: Stick top reverse (//-)
-    Alice\\\\-Bob: Stick bottom reverse (\\\\-)
-    Alice--|\\Bob: Dotted solid top (--|\\)
-    Bob--|/Alice: Dotted solid bottom (--|/)
-    Alice--\\\\Charlie: Dotted stick top (--\\\\)
-    Charlie--//Dave: Dotted stick bottom (--//)
-    Dave/|--Charlie: Dotted solid top reverse (/|--)
-    Charlie\\|--Bob: Dotted solid bottom reverse (\\|--)
-    Bob//--Alice: Dotted stick top reverse (//--)
-    Alice\\\\--Bob: Dotted stick bottom reverse (\\\\--)
-    Alice->>()Bob: Solid with central connection
-    Bob()-->>Alice: Dotted with reverse central
-    Alice()->>()Charlie: Dual central connections`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render all arrow types with autonumbering - left to right only', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    Alice->>Bob: Solid arrow (->>)
-    Alice-->>Bob: Dotted arrow (-->>)
-    Alice->Bob: Solid open arrow (->)
-    Alice-->Bob: Dotted open arrow (-->)
-    Alice-xBob: Solid cross (-x)
-    Alice--xBob: Dotted cross (--x)
-    Alice-)Bob: Solid point async (-)
-    Alice--)Bob: Dotted point async (--)
-    Alice<<->>Bob: Bidirectional solid (<<->>)
-    Alice<<-->>Bob: Bidirectional dotted (<<-->>)
-    Alice-|\\Bob: Solid top half (-|\\)
-    Alice-|/Bob: Solid bottom half (-|/)
-    Alice-\\\\Bob: Stick top half (-\\\\)
-    Alice-//Bob: Stick bottom half (-//)
-    Bob/|-Alice: Solid top reverse (/|-)
-    Bob\\|-Alice: Solid bottom reverse (\\|-)
-    Bob//-Alice: Stick top reverse (//-)
-    Bob\\\\-Alice: Stick bottom reverse (\\\\-)
-    Alice--|\\Bob: Dotted solid top (--|\\)
-    Alice--|/Bob: Dotted solid bottom (--|/)
-    Alice--\\\\Bob: Dotted stick top (--\\\\)
-    Alice--//Bob: Dotted stick bottom (--//)
-    Bob/|--Alice: Dotted solid top reverse (/|--)
-    Bob\\|--Alice: Dotted solid bottom reverse (\\|--)
-    Bob//--Alice: Dotted stick top reverse (//--)
-    Bob\\\\--Alice: Dotted stick bottom reverse (\\\\--)
-    Alice->>()Bob: Solid with central connection
-    Alice()-->>Bob: Dotted with reverse central
-    Alice()->>()Bob: Dual central connections`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render central connections with autonumbering', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice->>()Bob: Central connection at destination
-    Bob()->>Alice: Reverse central at source
-    Alice()->>()Bob: Dual central connections
-    Bob->>()Charlie: Another central connection
-    Charlie()-->>Alice: Reverse central dotted
-    Alice()<<-->>()Bob: Dual central bidirectional`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render bidirectional arrows with autonumbering', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice<<->>Bob: Bidirectional solid left to right
-    Bob<<->>Alice: Bidirectional solid right to left
-    Alice<<-->>Charlie: Bidirectional dotted left to right
-    Charlie<<-->>Alice: Bidirectional dotted right to left
-    Bob<<->>Charlie: Bidirectional solid
-    Charlie<<-->>Bob: Bidirectional dotted`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render reverse arrows with autonumbering', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob/|-Alice: Solid top reverse left to right
-    Alice/|-Bob: Solid top reverse right to left
-    Bob\\|-Alice: Solid bottom reverse left to right
-    Alice\\|-Bob: Solid bottom reverse right to left
-    Bob//-Alice: Stick top reverse left to right
-    Alice//-Bob: Stick top reverse right to left
-    Bob\\\\-Alice: Stick bottom reverse left to right
-    Alice\\\\-Bob: Stick bottom reverse right to left
-    Bob/|--Alice: Dotted solid top reverse
-    Alice\\|--Bob: Dotted solid bottom reverse
-    Bob//--Alice: Dotted stick top reverse
-    Alice\\\\--Bob: Dotted stick bottom reverse`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-      });
-
-      describe('Central Connections with Autonumber - Comprehensive Coverage', () => {
-        it('should render CENTRAL_CONNECTION with normal arrows - left to right', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice->>()Bob: Solid arrow with circle at destination
-    Alice-->>()Bob: Dotted arrow with circle at destination
-    Alice->()Bob: Open arrow with circle at destination
-    Alice--x()Bob: Cross arrow with circle at destination
-    Alice--)()Bob: Close arrow with circle at destination`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render CENTRAL_CONNECTION with normal arrows - right to left', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob->>()Alice: Solid arrow with circle at destination (RTL)
-    Charlie-->>()Bob: Dotted arrow with circle at destination (RTL)
-    Bob->()Alice: Open arrow with circle at destination (RTL)
-    Charlie--x()Alice: Cross arrow with circle at destination (RTL)
-    Bob--)()Alice: Close arrow with circle at destination (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render CENTRAL_CONNECTION with reverse arrows - left to right', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob/|-()Alice: Solid top reverse with circle (LTR)
-    Bob\\|-()Alice: Solid bottom reverse with circle (LTR)
-    Bob//-()Alice: Stick top reverse with circle (LTR)
-    Bob\\\\-()Alice: Stick bottom reverse with circle (LTR)
-    Bob/|--()Alice: Dotted solid top reverse with circle (LTR)
-    Bob\\|--()Alice: Dotted solid bottom reverse with circle (LTR)
-    Bob//--()Alice: Dotted stick top reverse with circle (LTR)
-    Bob\\\\--()Alice: Dotted stick bottom reverse with circle (LTR)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render CENTRAL_CONNECTION with reverse arrows - right to left', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice/|-()Bob: Solid top reverse with circle (RTL)
-    Alice\\|-()Bob: Solid bottom reverse with circle (RTL)
-    Alice//-()Bob: Stick top reverse with circle (RTL)
-    Alice\\\\-()Bob: Stick bottom reverse with circle (RTL)
-    Alice/|--()Bob: Dotted solid top reverse with circle (RTL)
-    Alice\\|--()Bob: Dotted solid bottom reverse with circle (RTL)
-    Alice//--()Bob: Dotted stick top reverse with circle (RTL)
-    Alice\\\\--()Bob: Dotted stick bottom reverse with circle (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_REVERSE ()->> normal LTR', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice()->>Bob: Circle at source with solid arrow
-    Alice()-->>Bob: Circle at source with dotted arrow
-    Alice()->Bob: Circle at source with open arrow
-    Alice()--xBob: Circle at source with cross arrow
-    Alice()--)Bob: Circle at source with close arrow`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_REVERSE ()->> normal RTL', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob()->>Alice: Circle at source with solid arrow (RTL)
-    Charlie()-->>Bob: Circle at source with dotted arrow (RTL)
-    Bob()->Alice: Circle at source with open arrow (RTL)
-    Charlie()--xAlice: Circle at source with cross arrow (RTL)
-    Bob()--)Alice: Circle at source with close arrow (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_REVERSE ()->> reverse LTR', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob()/|-Alice: Circle at source with solid top reverse (LTR)
-    Bob()\\|-Alice: Circle at source with solid bottom reverse (LTR)
-    Bob()//-Alice: Circle at source with stick top reverse (LTR)
-    Bob()\\\\-Alice: Circle at source with stick bottom reverse (LTR)
-    Bob()/|--Alice: Circle at source with dotted solid top reverse (LTR)
-    Bob()\\|--Alice: Circle at source with dotted solid bottom reverse (LTR)
-    Bob()//--Alice: Circle at source with dotted stick top reverse (LTR)
-    Bob()\\\\--Alice: Circle at source with dotted stick bottom reverse (LTR)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_REVERSE ()->> reverse RTL', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice()/|-Bob: Circle at source with solid top reverse (RTL)
-    Alice()\\|-Bob: Circle at source with solid bottom reverse (RTL)
-    Alice()//-Bob: Circle at source with stick top reverse (RTL)
-    Alice()\\\\-Bob: Circle at source with stick bottom reverse (RTL)
-    Alice()/|--Bob: Circle at source with dotted solid top reverse (RTL)
-    Alice()\\|--Bob: Circle at source with dotted solid bottom reverse (RTL)
-    Alice()//--Bob: Circle at source with dotted stick top reverse (RTL)
-    Alice()\\\\--Bob: Circle at source with dotted stick bottom reverse (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_DUAL ()->>() normal LTR', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice()->>()Bob: Circles at both ends with solid arrow
-    Alice()-->>()Bob: Circles at both ends with dotted arrow
-    Alice()->()Bob: Circles at both ends with open arrow
-    Alice()--x()Bob: Circles at both ends with cross arrow
-    Alice()--)()Bob: Circles at both ends with close arrow`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_DUAL ()->>() normal RTL', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob()->>()Alice: Circles at both ends with solid arrow (RTL)
-    Charlie()-->>()Bob: Circles at both ends with dotted arrow (RTL)
-    Bob()->()Alice: Circles at both ends with open arrow (RTL)
-    Charlie()--x()Alice: Circles at both ends with cross arrow (RTL)
-    Bob()--)()Alice: Circles at both ends with close arrow (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_DUAL ()->>() reverse LTR', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Bob()/|-()Alice: Circles at both ends with solid top reverse (LTR)
-    Bob()\\|-()Alice: Circles at both ends with solid bottom reverse (LTR)
-    Bob()//-()Alice: Circles at both ends with stick top reverse (LTR)
-    Bob()\\\\-()Alice: Circles at both ends with stick bottom reverse (LTR)
-    Bob()/|--()Alice: Circles at both ends with dotted solid top reverse (LTR)
-    Bob()\\|--()Alice: Circles at both ends with dotted solid bottom reverse (LTR)
-    Bob()//--()Alice: Circles at both ends with dotted stick top reverse (LTR)
-    Bob()\\\\--()Alice: Circles at both ends with dotted stick bottom reverse (LTR)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render Central_Connection_DUAL ()->>() reverse RTL', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice()/|-()Bob: Circles at both ends with solid top reverse (RTL)
-    Alice()\\|-()Bob: Circles at both ends with solid bottom reverse (RTL)
-    Alice()//-()Bob: Circles at both ends with stick top reverse (RTL)
-    Alice()\\\\-()Bob: Circles at both ends with stick bottom reverse (RTL)
-    Alice()/|--()Bob: Circles at both ends with dotted solid top reverse (RTL)
-    Alice()\\|--()Bob: Circles at both ends with dotted solid bottom reverse (RTL)
-    Alice()//--()Bob: Circles at both ends with dotted stick top reverse (RTL)
-    Alice()\\\\--()Bob: Circles at both ends with dotted stick bottom reverse (RTL)`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render mixed central connections with autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    participant David
-
-    Note over Alice,David: Normal arrows with central connections
-    Alice->>()Bob: CENTRAL_CONNECTION LTR
-    Bob->>()Alice: CENTRAL_CONNECTION RTL
-    Alice()->>Bob: CENTRAL_CONNECTION_REVERSE LTR
-    Bob()->>Alice: CENTRAL_CONNECTION_REVERSE RTL
-    Alice()->>()Bob: CENTRAL_CONNECTION_DUAL LTR
-    Bob()->>()Alice: CENTRAL_CONNECTION_DUAL RTL
-
-    Note over Alice,David: Reverse arrows with central connections
-    Bob/|-()Alice: Reverse with CENTRAL_CONNECTION LTR
-    Alice/|-()Bob: Reverse with CENTRAL_CONNECTION RTL
-    Bob()/|-Alice: Reverse with CENTRAL_CONNECTION_REVERSE LTR
-    Alice()/|-Bob: Reverse with CENTRAL_CONNECTION_REVERSE RTL
-    Bob()/|-()Alice: Reverse with CENTRAL_CONNECTION_DUAL LTR
-    Alice()/|-()Bob: Reverse with CENTRAL_CONNECTION_DUAL RTL
-
-    Note over Alice,David: Mixed with different participants
-    Alice->>()Charlie: Skip participant
-    Charlie()->>Alice: Back skip
-    Bob()->>()David: Another skip
-    David()->>()Bob: Return skip`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render central connections with bidirectional arrows and autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice()<<->>()Bob: Dual central with bidirectional solid LTR
-    Bob()<<->>()Alice: Dual central with bidirectional solid RTL
-    Alice()<<-->>()Bob: Dual central with bidirectional dotted LTR
-    Bob()<<-->>()Alice: Dual central with bidirectional dotted RTL
-    Alice<<->>()Bob: Central at end with bidirectional LTR
-    Bob()<<->>Alice: Central at start with bidirectional RTL`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-      });
-
-      describe('Self-Reference Arrows - Comprehensive Coverage', () => {
-        it('should render self-reference with normal arrows - without autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice->>Alice: Solid arrow self-reference
-    Bob-->>Bob: Dotted arrow self-reference
-    Charlie->Charlie: Open arrow self-reference
-    Alice-->Alice: Dotted open arrow self-reference
-    Bob-xBob: Cross arrow self-reference
-    Charlie--xCharlie: Dotted cross self-reference`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference with normal arrows - with autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice->>Alice: Solid arrow self-reference
-    Bob-->>Bob: Dotted arrow self-reference
-    Charlie->Charlie: Open arrow self-reference
-    Alice-->Alice: Dotted open arrow self-reference
-    Bob-xBob: Cross arrow self-reference
-    Charlie--xCharlie: Dotted cross self-reference`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference with reverse arrows - without autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-  sequenceDiagram
-      participant Alice
-      participant Bob
-      participant Charlie
-      Alice/|-Alice: Solid top reverse self-reference
-      Bob\\|-Bob: Solid bottom reverse self-reference
-      Charlie//-Charlie: Stick top reverse self-reference
-      Alice\\\\-Alice: Stick bottom reverse self-reference
-      Bob/|--Bob: Dotted solid top reverse self-reference
-      Charlie\\|--Charlie: Dotted solid bottom reverse self-reference
-      Alice//--Alice: Dotted stick top reverse self-reference
-      Bob\\\\--Bob: Dotted stick bottom reverse self-reference`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference with reverse arrows - with autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice/|-Alice: Solid top reverse self-reference
-    Bob\\|-Bob: Solid bottom reverse self-reference
-    Charlie//-Charlie: Stick top reverse self-reference
-    Alice\\\\-Alice: Stick bottom reverse self-reference
-    Bob/|--Bob: Dotted solid top reverse self-reference
-    Charlie\\|--Charlie: Dotted solid bottom reverse self-reference
-    Alice//--Alice: Dotted stick top reverse self-reference
-    Bob\\\\--Bob: Dotted stick bottom reverse self-reference`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference with bidirectional arrows - without autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice<<->>Alice: Bidirectional solid self-reference
-    Bob<<-->>Bob: Bidirectional dotted self-reference
-    Charlie<<->>Charlie: Another bidirectional solid
-    Alice<<-->>Alice: Another bidirectional dotted`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference with bidirectional arrows - with autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    Alice<<->>Alice: Bidirectional solid self-reference
-    Bob<<-->>Bob: Bidirectional dotted self-reference
-    Charlie<<->>Charlie: Another bidirectional solid
-    Alice<<-->>Alice: Another bidirectional dotted`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render comprehensive self-reference scenario - all arrow types mixed', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-
-    Note over Alice,Charlie: Normal arrows
-    Alice->>Alice: Normal solid
-    Bob-->>Bob: Normal dotted
-    Charlie->Charlie: Normal open
-
-    Note over Alice,Charlie: Reverse arrows
-    Alice/|-Alice: Reverse solid top
-    Bob\\|-Bob: Reverse solid bottom
-
-    Note over Alice,Charlie: Bidirectional arrows
-    Charlie<<->>Charlie: Bidirectional solid
-    Alice<<-->>Alice: Bidirectional dotted`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-
-        it('should render self-reference mixed with regular messages and autonumber', () => {
-          imgSnapshotTest(
-            `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-
-    Alice->>Bob: Regular message
-    Bob->>Bob: Self-reference solid
-    Bob-->>Charlie: Regular dotted
-    Charlie->>Alice: Regular back
-    Alice<<->>Alice: Self-ref bidirectional
-    Alice()->>Bob: Regular with central
-    Bob-->>Alice: Regular dotted back`,
-            { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-          );
-        });
-      });
-    });
-
-    describe('Comprehensive Test - All Message Types and Arrow Types', () => {
-      it('should render all message types and arrow types in a single comprehensive test', () => {
-        imgSnapshotTest(
-          `%%{init: {'theme':'base'}}%%
-sequenceDiagram
-    autonumber
-    participant Alice
-    participant Bob
-    participant Charlie
-    participant David
-
-    Note over Alice,David: SOLID ARROWS (Filled arrowhead)
-    Alice->>Bob: Solid arrow (->>)
-    Alice->Charlie: Solid open arrow (->)
-    Alice-xDavid: Solid cross (-x)
-    Alice-)Bob: Solid point async (-)
-
-    Note over Alice,David: DOTTED ARROWS (Dashed line)
-    Bob-->>Alice: Dotted arrow (-->>)
-    Bob-->Charlie: Dotted open arrow (-->)
-    Bob--xDavid: Dotted cross (--x)
-    Bob--)Alice: Dotted point async (--)
-
-    Note over Alice,David: BIDIRECTIONAL ARROWS
-    Alice<<->>Bob: Bidirectional solid (<<->>)
-    Charlie<<-->>David: Bidirectional dotted (<<-->>)
-
-    Note over Alice,David: REVERSE ARROWS (Half arrows)
-    Bob/|-Alice: Solid top reverse (/|-)
-    Charlie\\|-Bob: Solid bottom reverse (\\|-)
-    David//-Alice: Stick top reverse (//)
-    Alice\\\\-Bob: Stick bottom reverse (\\\\-)
-
-    Note over Alice,David: DOTTED REVERSE ARROWS
-    Bob/|--Alice: Dotted solid top reverse (/|--)
-    Charlie\\|--Bob: Dotted solid bottom reverse (\\|--)
-    David//--Alice: Dotted stick top reverse (//--)
-    Alice\\\\--Bob: Dotted stick bottom reverse (\\\\--)
-
-    Note over Alice,David: CENTRAL CONNECTIONS (Circle at destination)
-    Alice->>()Bob: Solid with circle at destination
-    Alice-->>()Charlie: Dotted with circle at destination
-    Alice->()David: Open with circle at destination
-    Alice--x()Bob: Cross with circle at destination
-
-    Note over Alice,David: CENTRAL CONNECTIONS REVERSE (Circle at source)
-    Bob()->>Alice: Circle at source with solid
-    Charlie()-->>Bob: Circle at source with dotted
-    David()->Alice: Circle at source with open
-    Bob()--xAlice: Circle at source with cross
-
-    Note over Alice,David: CENTRAL CONNECTIONS DUAL (Circles at both ends)
-    Alice()->>()Bob: Dual circles with solid
-    Alice()-->>()Charlie: Dual circles with dotted
-    Alice()->()David: Dual circles with open
-    Alice()--x()Bob: Dual circles with cross
-
-    Note over Alice,David: BIDIRECTIONAL WITH CENTRAL CONNECTIONS
-    Alice()<<->>()Bob: Dual circles with bidirectional solid
-    Charlie()<<-->>()David: Dual circles with bidirectional dotted
-
-    Note over Alice,David: SELF-REFERENCES (Same participant)
-    Alice->>Alice: Self-reference solid
-    Bob-->>Bob: Self-reference dotted
-    Charlie->Charlie: Self-reference open
-    David-xDavid: Self-reference cross
-
-    Note over Alice,David: SELF-REFERENCES WITH REVERSE ARROWS
-    Alice/|-Alice: Self-ref reverse solid top
-    Bob\\|-Bob: Self-ref reverse solid bottom
-    Charlie//-Charlie: Self-ref reverse stick top
-    David\\\\-David: Self-ref reverse stick bottom
-
-    Note over Alice,David: SELF-REFERENCES BIDIRECTIONAL
-    Alice<<->>Alice: Self-ref bidirectional solid
-    Bob<<-->>Bob: Self-ref bidirectional dotted
-
-    Note over Alice,David: MIXED COMPLEX SCENARIO
-    Alice->>Bob: Regular message
-    Bob()->>()Charlie: Central dual connection
-    Charlie-->>David: Dotted response
-    David/|-Alice: Reverse arrow
-    Alice<<->>Bob: Bidirectional back
-    Bob-xCharlie: Cross message
-    Charlie()->>David: Central reverse
-    David-->>()Alice: Dotted with circle`,
-          { sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-    });
-
-    describe('Participant Stereotypes with Aliases', () => {
-      it('should render participants with stereotypes and aliases', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant API@{ "type" : "boundary" } as Public API
-          participant Auth@{ "type" : "control" } as Auth Controller
-          participant DB@{ "type" : "database" } as User Database
-          participant Cache@{ "type" : "entity" } as Cache Layer
-          API ->> Auth: Authenticate request
-          Auth ->> DB: Query user
-          DB -->> Auth: User data
-          Auth ->> Cache: Store session
-          Cache -->> Auth: Confirmed
-          Auth -->> API: Token`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render actors with stereotypes and aliases', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          actor U@{ "type" : "actor" } as End User
-          actor A@{ "type" : "boundary" } as API Gateway
-          actor S@{ "type" : "control" } as Service Layer
-          actor D@{ "type" : "database" } as Data Store
-          U ->> A: Send request
-          A ->> S: Process
-          S ->> D: Persist
-          D -->> S: Success
-          S -->> A: Response
-          A -->> U: Result`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render mixed participants and actors with stereotypes and aliases', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          actor Client@{ "type" : "actor" } AS Mobile Client
-          participant Gateway@{ "type" : "boundary" } as API Gateway
-          participant OrderSvc@{ "type" : "control" } as Order Service
-          participant Queue@{ "type" : "queue" } as Message Queue
-          participant DB@{ "type" : "database" } as Order Database
-          participant Logs@{ "type" : "collections" } as Audit Logs
-          Client ->> Gateway: Place order
-          Gateway ->> OrderSvc: Validate order
-          OrderSvc ->> Queue: Queue for processing  as well
-          OrderSvc ->> DB: Save order
-          OrderSvc ->> Logs: Log transaction
-          Queue -->> OrderSvc: Processing started AS Well
-          DB -->> OrderSvc: Order saved
-          Logs -->> OrderSvc: Logged
-          OrderSvc -->> Gateway: Order confirmed
-          Gateway -->> Client: Confirmation`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render stereotypes with aliases in boxes', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          box rgb(200,220,255) Frontend Layer
-            actor User@{ "type" : "actor" } as End User
-            participant UI@{ "type" : "boundary" } as User Interface
-          end
-          box rgb(255,220,200) Backend Layer
-            participant API@{ "type" : "boundary" } as REST API
-            participant Svc@{ "type" : "control" } as Business Logic
-          end
-          box rgb(220,255,200) Data Layer
-            participant DB@{ "type" : "database" } as Primary DB
-            participant Cache@{ "type" : "entity" } as Cache Store
-          end
-          User ->> UI: Click button
-          UI ->> API: HTTP request
-          API ->> Svc: Process
-          Svc ->> Cache: Check cache
-          Cache -->> Svc: Cache miss
-          Svc ->> DB: Query data
-          DB -->> Svc: Data
-          Svc ->> Cache: Update cache
-          Svc -->> API: Response
-          API -->> UI: Data
-          UI -->> User: Display`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render stereotypes with aliases and complex interactions', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant Web@{ "type" : "boundary" } as Web Portal
-          participant Auth@{ "type" : "control" } as Auth Service
-          participant UserDB@{ "type" : "database" } as User DB
-          participant Queue@{ "type" : "queue" } as Event Queue
-          participant Audit@{ "type" : "collections" } as Audit Trail
-          Web ->> Auth: Login request
-          activate Auth
-          Auth ->> UserDB: Verify credentials
-          activate UserDB
-          UserDB -->> Auth: User found
-          deactivate UserDB
-          alt Valid credentials
-            Auth ->> Queue: Publish login event
-            Auth ->> Audit: Log success
-            par Parallel processing
-              Queue -->> Auth: Event queued
-              and
-              Audit -->> Auth: Logged
-            end
-            Auth -->> Web: Success token
-          else Invalid credentials
-            Auth ->> Audit: Log failure
-            Audit -->> Auth: Logged
-            Auth --x Web: Access denied
-          end
-          deactivate Auth
-          Note over Web,Audit: All interactions logged`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-    });
-
-    describe('Participant Inline Alias in Config', () => {
-      it('should render participants with inline alias in config object', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant API@{ "type" : "boundary", "alias": "Public API" }
-          participant Auth@{ "type" : "control", "alias": "Auth Service" }
-          participant DB@{ "type" : "database", "alias": "User DB" }
-          API ->> Auth: Login request
-          Auth ->> DB: Query user
-          DB -->> Auth: User data
-          Auth -->> API: Token`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render actors with inline alias in config object', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          actor U@{ "type" : "actor", "alias": "End User" }
-          actor G@{ "type" : "boundary", "alias": "Gateway" }
-          actor S@{ "type" : "control", "alias": "Service" }
-          U ->> G: Request
-          G ->> S: Process
-          S -->> G: Response
-          G -->> U: Result`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should handle mixed inline and external alias syntax', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant A@{ "type" : "boundary", "alias": "Service A" }
-          participant B@{ "type" : "control" } as Service B
-          participant C@{ "type" : "database" }
-          A ->> B: Request
-          B ->> C: Query
-          C -->> B: Data
-          B -->> A: Response`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should prioritize external alias over inline alias', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant API@{ "type" : "boundary", "alias": "Internal Name" } as External Name
-          participant DB@{ "type" : "database", "alias": "Internal DB" } AS External DB
-          API ->> DB: Query
-          DB -->> API: Result`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-
-      it('should render inline alias with only alias field (no type)', () => {
-        imgSnapshotTest(
-          `sequenceDiagram
-          participant API@{ "alias": "Public API" }
-          participant Auth@{ "alias": "Auth Service" }
-          API ->> Auth: Request
-          Auth -->> API: Response`,
-          { look: 'classic', sequence: { diagramMarginX: 50, diagramMarginY: 10 } }
-        );
-      });
-    });
   });
 });

cypress/integration/rendering/sequencediagram.spec.js

@@ -1053,167 +1053,4 @@ describe('Sequence diagram', () => {
       ]);
     });
   });
-  describe('render new arrow type', () => {
-    it('should render Solid half arrow top', () => {
-      imgSnapshotTest(
-        `
-    sequenceDiagram
-      Alice -|\\  John: Hello John, how are you? 
-      Alice-|\\  John: Hi Alice, I can hear you!
-      Alice -|\\  John: Test
-      `
-      );
-    });
-    it('should render Solid half arrow bottom', () => {
-      imgSnapshotTest(
-        `
-    sequenceDiagram
-      Alice-|/John: Hello John, how are you?
-      Alice-|/John: Hi Alice, I can hear you!
-      Alice-|/John: Test
-      `
-      );
-    });
-
-    it('should render Stick half arrow top ', () => {
-      imgSnapshotTest(
-        `
-     sequenceDiagram
-      Alice-\\\\John: Hello John, how are you?
-      Alice-\\\\John: Hi Alice, I can hear you!
-      Alice-\\\\John: Test
-      `
-      );
-    });
-    it('should render Stick half arrow bottom ', () => {
-      imgSnapshotTest(
-        `
-       sequenceDiagram
-      Alice-//John: Hello John, how are you?
-      Alice-//John: Hi Alice, I can hear you!
-      Alice-//John: Test
-      `
-      );
-    });
-    it('should render Solid half arrow top reverse ', () => {
-      imgSnapshotTest(
-        `
-       sequenceDiagram
-      Alice/|-John: Hello Alice, how are you?
-      Alice/|-John: Hi Alice, I can hear you!
-      Alice/|-John: Test
-
-      `
-      );
-    });
-
-    it('should render Solid half arrow bottom reverse ', () => {
-      imgSnapshotTest(
-        `sequenceDiagram
-        Alice \\|- John: Hello Alice, how are you?
-        Alice \\|- John: Hi Alice, I can hear you!
-        Alice \\|- John: Test`
-      );
-    });
-
-    it('should render Stick half arrow top reverse ', () => {
-      imgSnapshotTest(
-        `
-      sequenceDiagram
-      Alice //-John: Hello Alice, how are you?
-      Alice //-John: Hi Alice, I can hear you!
-      Alice //-John: Test`
-      );
-    });
-
-    it('should render Stick half arrow bottom reverse ', () => {
-      imgSnapshotTest(
-        `
-       sequenceDiagram
-      Alice \\\\-John: Hello Alice, how are you?
-      Alice \\\\-John: Hi Alice, I can hear you!
-      Alice \\\\-John: Test`
-      );
-    });
-
-    it('should render Solid half arrow top dotted', () => {
-      imgSnapshotTest(
-        `
-     sequenceDiagram
-      Alice --|\\John: Hello John, how are you?
-      Alice --|\\John: Hi Alice, I can hear you!
-      Alice --|\\John: Test`
-      );
-    });
-
-    it('should render Solid half arrow bottom dotted', () => {
-      imgSnapshotTest(
-        `
-     sequenceDiagram
-      Alice --|/John: Hello John, how are you?
-      Alice --|/John: Hi Alice, I can hear you!
-      Alice --|/John: Test`
-      );
-    });
-
-    it('should render Stick half arrow top dotted', () => {
-      imgSnapshotTest(
-        `
-     sequenceDiagram
-      Alice--\\\\John: Hello John, how are you?
-      Alice--\\\\John: Hi Alice, I can hear you!
-      Alice--\\\\John: Test`
-      );
-    });
-
-    it('should render Stick half arrow bottom dotted', () => {
-      imgSnapshotTest(
-        `
-     sequenceDiagram
-      Alice--//John: Hello John, how are you?
-      Alice--//John: Hi Alice, I can hear you!
-      Alice--//John: Test`
-      );
-    });
-
-    it('should render Solid half arrow top reverse dotted', () => {
-      imgSnapshotTest(
-        `
-  sequenceDiagram
-      Alice/|--John: Hello Alice, how are you?
-      Alice/|--John: Hi Alice, I can hear you!
-      Alice/|--John: Test`
-      );
-    });
-
-    it('should render Solid half arrow bottom reverse dotted', () => {
-      imgSnapshotTest(
-        `
-  sequenceDiagram
-      Alice\\|--John: Hello Alice, how are you?
-      Alice\\|--John: Hi Alice, I can hear you!
-      Alice\\|--John: Test`
-      );
-    });
-
-    it('should render Stick half arrow top reverse dotted ', () => {
-      imgSnapshotTest(
-        `
-  sequenceDiagram
-      Alice//--John: Hello Alice, how are you?
-      Alice//--John: Hi Alice, I can hear you!
-      Alice//--John: Test`
-      );
-    });
-
-    it('should render Stick half arrow bottom reverse dotted ', () => {
-      imgSnapshotTest(
-        `
-  sequenceDiagram
-      Alice\\\\--John: Hello Alice, how are you?
-      Alice\\\\--John: Hi Alice, I can hear you!
-      Alice\\\\--John: Test`
-      );
-    });
-  });
 });

cypress/platform/knsv2.html

@@ -32,8 +32,26 @@
       href="https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&family=Rubik+Mono+One&display=swap"
       rel="stylesheet"
     />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Recursive:wght@300..1000&display=swap"
+      rel="stylesheet"
+    />
 
     <style>
+      .recursive-mermaid {
+        font-family: 'Recursive', sans-serif;
+        font-optical-sizing: auto;
+        font-weight: 500;
+        font-style: normal;
+        font-variation-settings:
+          'slnt' 0,
+          'CASL' 0,
+          'CRSV' 0.5,
+          'MONO' 0;
+      }
+
       body {
         /* background: rgb(221, 208, 208); */
         /* background: #333; */
@@ -45,7 +63,9 @@
       h1 {
         color: grey;
       }
-
+      .mermaid {
+        border: 1px solid red;
+      }
       .mermaid2 {
         display: none;
       }
@@ -83,6 +103,11 @@
         width: 100%;
       }
 
+      .class2 {
+        fill: red;
+        fill-opacity: 1;
+      }
+
       /* tspan {
               font-size: 6px !important;
             } */
@@ -106,236 +131,6 @@
 
   <body>
     <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      root((mindmap))
-        Origins
-          Long history
-          ::icon(fa fa-book)
-          Popularisation
-            British popular psychology author Tony Buzan
-        Research
-          On effectiveness&lt;br/>and features
-          On Automatic creation
-            Uses
-                Creative techniques
-                Strategic planning
-                Argument mapping
-        Tools
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart
-       aid0
-  </pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      aid0
-
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: ogdc
-      ---
-      flowchart-elk TB
-      c1-->a2
-      subgraph one
-      a1-->a2
-      end
-      subgraph two
-      b1-->b2
-      end
-      subgraph three
-      c1-->c2
-      end
-      one --> two
-      three --> two
-      two --> c2
-
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart TB
-
-        process_C
-      subgraph container_Alpha
-        subgraph process_B
-          pppB
-        end
-        subgraph process_A
-          pppA
-        end
-        process_B-->|via_AWSBatch|container_Beta
-        process_A-->|messages|container_Beta
-      end
-
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart TB
-      subgraph container_Beta
-        process_C
-      end
-      subgraph container_Alpha
-        subgraph process_B
-          pppB
-        end
-        subgraph process_A
-          pppA
-        end
-        process_B-->|via_AWSBatch|container_Beta
-        process_A-->|messages|container_Beta
-      end
-
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart TB
-      subgraph container_Beta
-        process_C
-      end
-
-        process_B-->|via_AWSBatch|container_Beta
-
-
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      classDiagram
-      note "I love this diagram!\nDo you love it?"
-      Class01 <|-- AveryLongClass : Cool
-      &lt;&lt;interface&gt;&gt; Class01
-      Class03 "1" *-- "*" Class04
-      Class05 "1" o-- "many" Class06
-      Class07 "1" .. "*" Class08
-      Class09 "1" --> "*" C2 : Where am i?
-      Class09 "*" --* "*" C3
-      Class09 "1" --|> "1" Class07
-      Class12 <|.. Class08
-      Class11 ..>Class12
-      Class07 : equals()
-      Class07 : Object[] elementData
-      Class01 : size()
-      Class01 : int chimp
-      Class01 : int gorilla
-      Class01 : -int privateChimp
-      Class01 : +int publicGorilla
-      Class01 : #int protectedMarmoset
-      Class08 <--> C2: Cool label
-      class Class10 {
-        &lt;&lt;service&gt;&gt;
-        int id
-        test()
-      }
-      note for Class10 "Cool class\nI said it's very cool class!"
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      requirementDiagram
-        requirement test_req {
-        id: 1
-        text: the test text.
-        risk: high
-        verifymethod: test
-        }
-
-        element test_entity {
-        type: simulation
-        }
-
-        test_entity - satisfies -> test_req
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart-elk TB
-      internet
-      nat
-      router
-      compute1
-
-      subgraph project
-      router
-      nat
-        subgraph subnet1
-          compute1
-        end
-      end
-
-      %% router --> subnet1
-      subnet1  --> nat
-      %% nat --> internet
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      flowchart-elk TB
-      internet
-      nat
-      router
-      lb1
-      lb2
-      compute1
-      compute2
-      subgraph project
-      router
-      nat
-        subgraph subnet1
-          compute1
-          lb1
-        end
-        subgraph subnet2
-          compute2
-          lb2
-        end
-      end
-      internet --> router
-      router --> subnet1 & subnet2
-      subnet1 & subnet2 --> nat --> internet
-</pre
-    >
-    <pre id="diagram4" class="mermaid">
 ---
 config:
   layout: elk
@@ -362,149 +157,84 @@ treemap
     "Leaf 2.2": 25
     "Leaf 2.3": 12
 
-    </pre>
-    <pre id="diagram5" class="mermaid">
-      ---
-      config:
-        layout: elk
-        flowchart:
-          curve: rounded
-      ---
-      flowchart LR
-          I["fa:fa-code Text"] -- Mermaid js --> D["Use<br/>the<br/>editor!"]
-          I --> D & D
-          D@{ shape: question}
-          I@{ shape: question}
+classDef class1   fill:red,color:blue,stroke:#FFD600;
 
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: tidy-tree
-      ---
-      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
 
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-        flowchart:
-          curve: linear
-      ---
-      flowchart LR
-          A[A] --> B[B]
-          A[A] --- B([C])
-          A@{ shape: diamond}
-          %%B@{ shape: diamond}
-
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-        flowchart:
-          curve: linear
-      ---
-      flowchart LR
-          A[A] -- Mermaid js --> B[B]
-          A[A] -- Mermaid js --- B[B]
-          A@{ shape: diamond}
-          B@{ shape: diamond}
-
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-        flowchart:
-          curve: rounded
-      ---
-      flowchart LR
-          D["Use the editor"] -- Mermaid js --> I["fa:fa-code Text"]
-          I --> D & D
-          D@{ shape: question}
-          I@{ shape: question}
-    </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-        flowchart:
-          curve: rounded
-        elk:
-          nodePlacementStrategy: NETWORK_SIMPLEX
-      ---
-      flowchart LR
-          D["Use the editor"] -- Mermaid js --> I["fa:fa-code Text"]
-          D --> I & I
-          a["a"]
-          D@{ shape: trap-b}
-          I@{ shape: lean-l}
-    </pre>
-    <pre id="diagram4" class="mermaid">
+</pre
+    >
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
-  layout: elk
-
+  treemap:
+    valueFormat: '$0,0'
 ---
-flowchart LR
- %% subgraph s1["Untitled subgraph"]
-        C["Evaluate"]
- %% end
+treemap
+"Budget"
+    "Operations"
+        "Salaries": 7000
+        "Equipment": 2000
+        "Supplies": 1000
+    "Marketing"
+        "Advertising": 4000
+        "Events": 1000
 
-    B --> C
-    </pre>
+</pre
+    >
     <pre id="diagram4" class="mermaid">
----
-config:
-  layout: elk
-  flowchart:
-    //curve: linear
----
-flowchart LR
-%% A ==> B
-%% A2 --> B2
-A{A} --> B((Bo boo)) & B & B & B
-
+    treemap
+      title Accessible Treemap Title
+      "Category A"
+          "Item A1": 10
+          "Item A2": 20
+      "Category B"
+          "Item B1": 15
+          "Item B2": 25
     </pre>
-    <pre id="diagram4" class="mermaid">
-      ---
-      config:
-        layout: elk
-        theme: default
-        look: classic
-      ---
+    <pre id="diagram4" class="mermaid2">
       flowchart LR
-       subgraph s1["APA"]
-              D{"Use the editor"}
-        end
-       subgraph S2["S2"]
-              s1
-              I>"fa:fa-code Text"]
-              E["E"]
-        end
-          D -- Mermaid js --> I
-          D --> I & E
-          E --> I
+        AB["apa@apa@"] --> B(("`apa@apa`"))
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
+      flowchart
+        D(("for D"))
+    </pre>
+    <pre id="diagram4" class="mermaid2">
+      flowchart LR
+        A e1@==> B
+        e1@{ animate: true}
+    </pre>
+    <pre id="diagram4" class="mermaid2">
+flowchart LR
+  A e1@--> B
+  classDef animate stroke-width:2,stroke-dasharray:10\,8,stroke-dashoffset:-180,animation: edge-animation-frame 6s linear infinite, stroke-linecap: round
+  class e1 animate
+    </pre>
+    <h2>infinite</h2>
+    <pre id="diagram4" class="mermaid2">
+flowchart LR
+  A e1@--> B
+  classDef animate stroke-dasharray: 9\,5,stroke-dashoffset: 900,animation: dash 25s linear infinite;
+  class e1 animate
+    </pre>
+    <h2>Mermaid - edge-animation-slow</h2>
+    <pre id="diagram4" class="mermaid2">
+flowchart LR
+  A e1@--> B
+e1@{ animation: fast}
+    </pre>
+    <h2>Mermaid - edge-animation-fast</h2>
+    <pre id="diagram4" class="mermaid2">
+flowchart LR
+  A e1@--> B
+  classDef animate stroke-dasharray: 1000,stroke-dashoffset: 1000,animation: dash 10s linear;
+  class e1 edge-animation-fast
+    </pre>
+
+    <pre id="diagram4" class="mermaid2">
+
+info    </pre
+    >
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -529,7 +259,7 @@ config:
       end
       end
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -542,7 +272,7 @@ config:
       D-->I
       D-->I
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -581,7 +311,7 @@ flowchart LR
     n8@{ shape: rect}
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -597,7 +327,7 @@ flowchart LR
 
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -606,7 +336,7 @@ flowchart LR
     A{A} --> B & C
 </pre
     >
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -618,7 +348,7 @@ flowchart LR
     end
 </pre
     >
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   layout: elk
@@ -636,7 +366,7 @@ flowchart LR
 
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   kanban:
@@ -655,81 +385,81 @@ kanban
     task3[💻 Develop login feature]@{ ticket: 103 }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Default] --> A@{ icon: 'fa:bell', form: 'rounded' }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Style] --> A@{ icon: 'fa:bell', form: 'rounded' }
 style A fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Class] --> A@{ icon: 'fa:bell', form: 'rounded' }
 A:::AClass
 classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
   nA[Class] --> A@{ icon: 'logos:aws', form: 'rounded' }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Default] --> A@{ icon: 'fa:bell', form: 'square' }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Style] --> A@{ icon: 'fa:bell', form: 'square' }
 style A fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Class] --> A@{ icon: 'fa:bell', form: 'square' }
 A:::AClass
 classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
   nA[Class] --> A@{ icon: 'logos:aws', form: 'square' }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Default] --> A@{ icon: 'fa:bell', form: 'circle' }
 
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Style] --> A@{ icon: 'fa:bell', form: 'circle' }
 style A fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
 nA[Class] --> A@{ icon: 'fa:bell', form: 'circle' }
 A:::AClass
 classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
   nA[Class] --> A@{ icon: 'logos:aws', form: 'circle' }
   A:::AClass
   classDef AClass fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 flowchart LR
   nA[Style] --> A@{ icon: 'logos:aws', form: 'circle' }
   style A fill:#f9f,stroke:#333,stroke-width:4px
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 kanban
   id2[In progress]
     docs[Create Blog about the new diagram]@{ priority: 'Very Low', ticket: MC-2037, assigned: 'knsv' }
     </pre>
-    <pre id="diagram4" class="mermaid">
+    <pre id="diagram4" class="mermaid2">
 ---
 config:
   kanban:
@@ -793,22 +523,18 @@ kanban
         alert('It worked');
       }
       await mermaid.initialize({
-        // theme: 'base',
+        // theme: 'forest',
         // theme: 'default',
         // theme: 'forest',
         // handDrawnSeed: 12,
         // look: 'handDrawn',
         // 'elk.nodePlacement.strategy': 'NETWORK_SIMPLEX',
         // layout: 'dagre',
-        layout: 'elk',
+        // layout: 'elk',
         // layout: 'fixed',
         // htmlLabels: false,
         flowchart: { titleTopMargin: 10 },
-
-        // fontFamily: 'Caveat',
-        // fontFamily: 'Kalam',
-        // fontFamily: 'courier',
-        fontFamily: 'arial',
+        fontFamily: "'Recursive', sans-serif",
         sequence: {
           actorFontFamily: 'courier',
           noteFontFamily: 'courier',

cypress/platform/mindmap-layouts.html

@@ -1,376 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <title>Mermaid Quick Test Page</title>
-    <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
-    <style>
-      div.mermaid {
-        font-family: 'Courier New', Courier, monospace !important;
-      }
-    </style>
-  </head>
-
-  <body>
-    <pre class="mermaid">
- ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap))
-        A
-        B
-    </pre>
-    <pre class="mermaid">
- ---
-      config:
-        layout: dagre
-      ---
-      mindmap
-      root((mindmap))
-        A
-        B
-    </pre>
-    <pre class="mermaid">
- ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      root((mindmap))
-        A
-        B
-    </pre>
-    <pre class="mermaid">
- ---
-      config:
-        layout: cose-bilkent
-      ---
-      mindmap
-      root((mindmap))
-        A
-        B
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap is a long thing))
-        A
-        B
-        C
-        D
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: dagre
-      ---
-      mindmap
-      root((mindmap is a long thing))
-        A
-        B
-        C
-        D
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      root((mindmap is a long thing))
-        A
-        B
-        C
-        D
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: cose-bilkent
-      ---
-      mindmap
-      root((mindmap is a long thing))
-        A
-        B
-        C
-        D
-    </pre>
-
-    <pre class="mermaid">
-    ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap))
-        Origins
-          Long history
-          ::icon(fa fa-book)
-          Popularisation
-            British popular psychology author Tony Buzan
-        Research
-          On effectiveness&lt;br/>and features
-          On Automatic creation
-            Uses
-                Creative techniques
-                Strategic planning
-                Argument mapping
-        Tools
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: dagre
-      ---
-      mindmap
-      root((mindmap))
-        Origins
-          Long history
-          ::icon(fa fa-book)
-          Popularisation
-            British popular psychology author Tony Buzan
-        Research
-          On effectiveness&lt;br/>and features
-          On Automatic creation
-            Uses
-                Creative techniques
-                Strategic planning
-                Argument mapping
-        Tools
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      root((mindmap))
-        Origins
-          Long history
-          ::icon(fa fa-book)
-          Popularisation
-            British popular psychology author Tony Buzan
-        Research
-          On effectiveness&lt;br/>and features
-          On Automatic creation
-            Uses
-                Creative techniques
-                Strategic planning
-                Argument mapping
-        Tools
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-    </pre>
-    <pre class="mermaid">
-    ---
-      config:
-        layout: cose-bilkent
-      ---
-      mindmap
-      root((mindmap))
-        Origins
-          Long history
-          ::icon(fa fa-book)
-          Popularisation
-            British popular psychology author Tony Buzan
-        Research
-          On effectiveness&lt;br/>and features
-          On Automatic creation
-            Uses
-                Creative techniques
-                Strategic planning
-                Argument mapping
-        Tools
-              id)I am a cloud(
-                  id))I am a bang((
-                    Tools
-    </pre>
-    <pre class="mermaid">
-      ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      root((mindmap))
-        A
-          a
-            apa[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-            apa2[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          b
-          c
-          d
-        B
-            apa3[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-        D
-          apa5[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          apa4[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-
-    </pre>
-    <pre class="mermaid">
-      ---
-      config:
-        layout: dagre
-      ---
-      mindmap
-      root((mindmap))
-        A
-          a
-            apa[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-            apa2[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          b
-          c
-          d
-        B
-            apa3[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-        D
-          apa5[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          apa4[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-
-    </pre>
-    <pre class="mermaid">
-      ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      root((mindmap))
-        A
-          a
-            apa[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-            apa2[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          b
-          c
-          d
-        B
-            apa3[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-        D
-          apa5[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          apa4[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-
-    </pre>
-    <pre class="mermaid">
-      ---
-      config:
-        layout: cose-bilkent
-      ---
-      mindmap
-      root((mindmap))
-        A
-          a
-            apa[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-            apa2[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          b
-          c
-          d
-        B
-            apa3[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-        D
-          apa5[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-          apa4[I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on. I am a long long multline string passing several levels of text. Lorum ipsum and so on]
-
-    </pre>
-
-    <pre class="mermaid">
- ---
-      config:
-        layout: tidy-tree
-      ---
-      mindmap
-      ((This is a mindmap))
-        child1
-         grandchild 1
-         grandchild 2
-        child2
-         grandchild 3
-         grandchild 4
-        child3
-         grandchild 5
-         grandchild 6
-      
-    </pre>
-
-    <pre class="mermaid">
- ---
-      config:
-        layout: dagre
-      ---
-      mindmap
-      ((This is a mindmap))
-        child1
-         grandchild 1
-         grandchild 2
-        child2
-         grandchild 3
-         grandchild 4
-        child3
-         grandchild 5
-         grandchild 6
-      
-    </pre>
-
-    <pre class="mermaid">
- ---
-      config:
-        layout: elk
-      ---
-      mindmap
-      ((This is a mindmap))
-        child1
-         grandchild 1
-         grandchild 2
-        child2
-         grandchild 3
-         grandchild 4
-        child3
-         grandchild 5
-         grandchild 6
-      
-    </pre>
-
-    <pre class="mermaid">
- ---
-      config:
-        layout: cose-bilkent
-      ---
-      mindmap
-      ((This is a mindmap))
-        child1
-         grandchild 1
-         grandchild 2
-        child2
-         grandchild 3
-         grandchild 4
-        child3
-         grandchild 5
-         grandchild 6
-      
-    </pre>
-
-    <hr />
-    <script type="module">
-      import mermaid from '/mermaid.esm.mjs';
-      import tidytree from '/mermaid-layout-tidy-tree.esm.mjs';
-      import layouts from './mermaid-layout-elk.esm.mjs';
-      mermaid.registerLayoutLoaders(layouts);
-      mermaid.registerLayoutLoaders(tidytree);
-      mermaid.initialize({
-        theme: 'default',
-        logLevel: 3,
-        securityLevel: 'loose',
-      });
-    </script>
-  </body>
-</html>

cypress/platform/viewer.js

@@ -1,6 +1,5 @@
 import externalExample from './mermaid-example-diagram.esm.mjs';
 import layouts from './mermaid-layout-elk.esm.mjs';
-import tidyTree from './mermaid-layout-tidy-tree.esm.mjs';
 import zenUml from './mermaid-zenuml.esm.mjs';
 import mermaid from './mermaid.esm.mjs';
 
@@ -66,7 +65,6 @@ const contentLoaded = async function () {
     await mermaid.registerExternalDiagrams([externalExample, zenUml]);
 
     mermaid.registerLayoutLoaders(layouts);
-    mermaid.registerLayoutLoaders(tidyTree);
     mermaid.initialize(graphObj.mermaid);
     /**
      *  CC-BY-4.0

cypress/platform/yari.html

@@ -603,10 +603,6 @@
       </div>
       <div class="test">
         <pre class="mermaid">
-          ---
-            config:
-              theme: dark
-          ---
           classDiagram
             test ()--() test2
         </pre>

cypress/timings.json

@@ -2,227 +2,223 @@
   "durations": [
     {
       "spec": "cypress/integration/other/configuration.spec.js",
-      "duration": 6099
+      "duration": 6162
     },
     {
       "spec": "cypress/integration/other/external-diagrams.spec.js",
-      "duration": 2236
+      "duration": 2148
     },
     {
       "spec": "cypress/integration/other/ghsa.spec.js",
-      "duration": 3405
+      "duration": 3585
     },
     {
       "spec": "cypress/integration/other/iife.spec.js",
-      "duration": 2176
+      "duration": 2099
     },
     {
       "spec": "cypress/integration/other/interaction.spec.js",
-      "duration": 12300
+      "duration": 12119
     },
     {
       "spec": "cypress/integration/other/rerender.spec.js",
-      "duration": 2089
+      "duration": 2063
     },
     {
       "spec": "cypress/integration/other/xss.spec.js",
-      "duration": 32033
+      "duration": 31921
     },
     {
       "spec": "cypress/integration/rendering/appli.spec.js",
-      "duration": 3672
+      "duration": 3385
     },
     {
       "spec": "cypress/integration/rendering/architecture.spec.ts",
-      "duration": 103
+      "duration": 108
     },
     {
       "spec": "cypress/integration/rendering/block.spec.js",
-      "duration": 18135
+      "duration": 18063
     },
     {
       "spec": "cypress/integration/rendering/c4.spec.js",
-      "duration": 5661
+      "duration": 5519
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-elk-v3.spec.js",
-      "duration": 41456
+      "duration": 40040
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-handDrawn-v3.spec.js",
-      "duration": 38910
+      "duration": 38665
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v2.spec.js",
-      "duration": 24120
+      "duration": 22836
     },
     {
       "spec": "cypress/integration/rendering/classDiagram-v3.spec.js",
-      "duration": 38454
+      "duration": 37096
     },
     {
       "spec": "cypress/integration/rendering/classDiagram.spec.js",
-      "duration": 17099
+      "duration": 16452
     },
     {
       "spec": "cypress/integration/rendering/conf-and-directives.spec.js",
-      "duration": 9844
+      "duration": 10387
     },
     {
       "spec": "cypress/integration/rendering/current.spec.js",
-      "duration": 2951
+      "duration": 2803
     },
     {
       "spec": "cypress/integration/rendering/erDiagram-unified.spec.js",
-      "duration": 90081
+      "duration": 86891
     },
     {
       "spec": "cypress/integration/rendering/erDiagram.spec.js",
-      "duration": 19496
+      "duration": 15206
     },
     {
       "spec": "cypress/integration/rendering/errorDiagram.spec.js",
-      "duration": 3829
+      "duration": 3540
     },
     {
       "spec": "cypress/integration/rendering/flowchart-elk.spec.js",
-      "duration": 42517
+      "duration": 41975
     },
     {
       "spec": "cypress/integration/rendering/flowchart-handDrawn.spec.js",
-      "duration": 31541
+      "duration": 30909
     },
     {
       "spec": "cypress/integration/rendering/flowchart-icon.spec.js",
-      "duration": 7749
+      "duration": 7881
     },
     {
       "spec": "cypress/integration/rendering/flowchart-shape-alias.spec.ts",
-      "duration": 25230
+      "duration": 24294
     },
     {
       "spec": "cypress/integration/rendering/flowchart-v2.spec.js",
-      "duration": 49359
+      "duration": 47652
     },
     {
       "spec": "cypress/integration/rendering/flowchart.spec.js",
-      "duration": 33028
+      "duration": 32049
     },
     {
       "spec": "cypress/integration/rendering/gantt.spec.js",
-      "duration": 22271
+      "duration": 20248
     },
     {
       "spec": "cypress/integration/rendering/gitGraph.spec.js",
-      "duration": 51837
+      "duration": 51202
     },
     {
       "spec": "cypress/integration/rendering/iconShape.spec.ts",
-      "duration": 285060
+      "duration": 283546
     },
     {
       "spec": "cypress/integration/rendering/imageShape.spec.ts",
-      "duration": 59517
+      "duration": 57257
     },
     {
       "spec": "cypress/integration/rendering/info.spec.ts",
-      "duration": 3501
+      "duration": 3352
     },
     {
       "spec": "cypress/integration/rendering/journey.spec.js",
-      "duration": 7405
+      "duration": 7423
     },
     {
       "spec": "cypress/integration/rendering/kanban.spec.ts",
-      "duration": 7975
+      "duration": 7804
     },
     {
       "spec": "cypress/integration/rendering/katex.spec.js",
-      "duration": 4312
+      "duration": 3847
     },
     {
       "spec": "cypress/integration/rendering/marker_unique_id.spec.js",
-      "duration": 2630
-    },
-    {
-      "spec": "cypress/integration/rendering/mindmap-tidy-tree.spec.js",
-      "duration": 4541
+      "duration": 2637
     },
     {
       "spec": "cypress/integration/rendering/mindmap.spec.ts",
-      "duration": 12134
+      "duration": 11658
     },
     {
       "spec": "cypress/integration/rendering/newShapes.spec.ts",
-      "duration": 151160
+      "duration": 149500
     },
     {
       "spec": "cypress/integration/rendering/oldShapes.spec.ts",
-      "duration": 118044
+      "duration": 115427
     },
     {
       "spec": "cypress/integration/rendering/packet.spec.ts",
-      "duration": 5166
+      "duration": 4801
     },
     {
       "spec": "cypress/integration/rendering/pie.spec.ts",
-      "duration": 7074
+      "duration": 6786
     },
     {
       "spec": "cypress/integration/rendering/quadrantChart.spec.js",
-      "duration": 9518
+      "duration": 9422
     },
     {
       "spec": "cypress/integration/rendering/radar.spec.js",
-      "duration": 5846
+      "duration": 5652
     },
     {
       "spec": "cypress/integration/rendering/requirement.spec.js",
-      "duration": 3089
+      "duration": 2787
     },
     {
       "spec": "cypress/integration/rendering/requirementDiagram-unified.spec.js",
-      "duration": 55361
+      "duration": 53631
     },
     {
       "spec": "cypress/integration/rendering/sankey.spec.ts",
-      "duration": 7236
+      "duration": 7075
     },
     {
       "spec": "cypress/integration/rendering/sequencediagram-v2.spec.js",
-      "duration": 26057
+      "duration": 20446
     },
     {
       "spec": "cypress/integration/rendering/sequencediagram.spec.js",
-      "duration": 48401
+      "duration": 37326
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram-v2.spec.js",
-      "duration": 30364
+      "duration": 29208
     },
     {
       "spec": "cypress/integration/rendering/stateDiagram.spec.js",
-      "duration": 16862
+      "duration": 16328
     },
     {
       "spec": "cypress/integration/rendering/theme.spec.js",
-      "duration": 30553
+      "duration": 30541
     },
     {
       "spec": "cypress/integration/rendering/timeline.spec.ts",
-      "duration": 8962
+      "duration": 8611
     },
     {
       "spec": "cypress/integration/rendering/treemap.spec.ts",
-      "duration": 12486
+      "duration": 11878
     },
     {
       "spec": "cypress/integration/rendering/xyChart.spec.js",
-      "duration": 21718
+      "duration": 20400
     },
     {
       "spec": "cypress/integration/rendering/zenuml.spec.js",
-      "duration": 3882
+      "duration": 3528
     }
   ]
 }

cypress/tsconfig.json

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "target": "es2020",
     "lib": ["es2020", "dom"],
-    "types": ["cypress", "node", "@argos-ci/cypress/support"],
+    "types": ["cypress", "node", "@argos-ci/cypress/dist/support.d.ts"],
     "allowImportingTsExtensions": true,
     "noEmit": true
   },

demos/classchart.html

@@ -184,7 +184,6 @@
       }
       Admin --> Report : generates
     </pre>
-    <hr />
     <pre class="mermaid">
     classDiagram
       namespace Company.Project.Module {
@@ -241,20 +240,6 @@
       Bike --> Square : "Logo Shape"
 
     </pre>
-    <hr />
-    <pre class="mermaid">
-      classDiagram
-        note "This is a outer note"
-        note for Class1 "This is a outer note for Class1"
-        namespace ns {
-          note "This is a inner note"
-          note for Class1 "This is a inner note for Class1"
-          class Class1
-          class Class2
-        }
-    </pre>
-    <hr />
-
     <script type="module">
       import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({

demos/er-multiline.html

@@ -11,7 +11,7 @@
       rel="stylesheet"
     />
     <link
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
       rel="stylesheet"
     />
     <link

docs/community/contributing.md

@@ -29,8 +29,7 @@ In GitHub, you first [**fork a mermaid repository**](https://github.com/mermaid-
 
 Then you **clone** a copy to your local development machine (e.g. where you code) to make a copy with all the files to work with.
 
-> **💡 Tip**
-> [Here is a GitHub document that gives an overview of the process](https://docs.github.com/en/get-started/quickstart/fork-a-repo).
+> **💡 Tip** > [Here is a GitHub document that gives an overview of the process](https://docs.github.com/en/get-started/quickstart/fork-a-repo).
 
 ```bash
 git clone git@github.com/your-fork/mermaid

docs/community/intro.md

@@ -33,8 +33,7 @@ mindmap
 
 ## Join the Development
 
-> **💡 Tip**
-> **Check out our** [**detailed contribution guide**](./contributing.md).
+> **💡 Tip** > **Check out our** [**detailed contribution guide**](./contributing.md).
 
 Where to start:
 
@@ -48,8 +47,7 @@ Where to start:
 
 ## A Question Or a Suggestion?
 
-> **💡 Tip**
-> **Have a look at** [**how to open an issue**](./questions-and-suggestions.md).
+> **💡 Tip** > **Have a look at** [**how to open an issue**](./questions-and-suggestions.md).
 
 If you have faced a vulnerability [report it to us](./security.md).
 

docs/config/directives.md

@@ -22,6 +22,7 @@ While directives allow you to change most of the default configuration settings,
 Mermaid basically supports two types of configuration options to be overridden by directives.
 
 1. _General/Top Level configurations_ : These are the configurations that are available and applied to all the diagram. **Some of the most important top-level** configurations are:
+
    - theme
    - fontFamily
    - logLevel

docs/config/faq.md

@@ -6,7 +6,7 @@
 
 # Frequently Asked Questions
 
-1. [How to add title to flowchart?](https://github.com/mermaid-js/mermaid/issues/1433#issuecomment-1991554712)
+1. [How to add title to flowchart?](https://github.com/mermaid-js/mermaid/issues/556#issuecomment-363182217)
 2. [How to specify custom CSS file?](https://github.com/mermaidjs/mermaid.cli/pull/24#issuecomment-373402785)
 3. [How to fix tooltip misplacement issue?](https://github.com/mermaid-js/mermaid/issues/542#issuecomment-3343564621)
 4. [How to specify gantt diagram xAxis format?](https://github.com/mermaid-js/mermaid/issues/269#issuecomment-373229136)

docs/config/layouts.md

@@ -1,40 +0,0 @@
-> **Warning**
->
-> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
->
-> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/layouts.md](../../packages/mermaid/src/docs/config/layouts.md).
-
-# Layouts
-
-This page lists the available layout algorithms supported in Mermaid diagrams.
-
-## Supported Layouts
-
-- **elk**: [ELK (Eclipse Layout Kernel)](https://www.eclipse.org/elk/)
-- **tidy-tree**: Tidy tree layout for hierarchical diagrams [Tidy Tree Configuration](/config/tidy-tree)
-- **cose-bilkent**: Cose Bilkent layout for force-directed graphs
-- **dagre**: Dagre layout for layered graphs
-
-## How to Use
-
-You can specify the layout in your diagram's YAML config or initialization options. For example:
-
-```mermaid-example
----
-config:
-  layout: elk
----
-graph TD;
-  A-->B;
-  B-->C;
-```
-
-```mermaid
----
-config:
-  layout: elk
----
-graph TD;
-  A-->B;
-  B-->C;
-```

docs/config/setup/mermaid/README.md

@@ -10,6 +10,10 @@
 
 # mermaid
 
+## Classes
+
+- [UnknownDiagramError](classes/UnknownDiagramError.md)
+
 ## Interfaces
 
 - [DetailedError](interfaces/DetailedError.md)
@@ -23,7 +27,6 @@
 - [RenderOptions](interfaces/RenderOptions.md)
 - [RenderResult](interfaces/RenderResult.md)
 - [RunOptions](interfaces/RunOptions.md)
-- [UnknownDiagramError](interfaces/UnknownDiagramError.md)
 
 ## Type Aliases
 

docs/config/setup/mermaid/classes/UnknownDiagramError.md

@@ -0,0 +1,159 @@
+> **Warning**
+>
+> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
+>
+> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/classes/UnknownDiagramError.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/classes/UnknownDiagramError.md).
+
+[**mermaid**](../../README.md)
+
+---
+
+# Class: UnknownDiagramError
+
+Defined in: [packages/mermaid/src/errors.ts:1](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L1)
+
+## Extends
+
+- `Error`
+
+## Constructors
+
+### new UnknownDiagramError()
+
+> **new UnknownDiagramError**(`message`): [`UnknownDiagramError`](UnknownDiagramError.md)
+
+Defined in: [packages/mermaid/src/errors.ts:2](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L2)
+
+#### Parameters
+
+##### message
+
+`string`
+
+#### Returns
+
+[`UnknownDiagramError`](UnknownDiagramError.md)
+
+#### Overrides
+
+`Error.constructor`
+
+## Properties
+
+### cause?
+
+> `optional` **cause**: `unknown`
+
+Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es2022.error.d.ts:26
+
+#### Inherited from
+
+`Error.cause`
+
+---
+
+### message
+
+> **message**: `string`
+
+Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1077
+
+#### Inherited from
+
+`Error.message`
+
+---
+
+### name
+
+> **name**: `string`
+
+Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1076
+
+#### Inherited from
+
+`Error.name`
+
+---
+
+### stack?
+
+> `optional` **stack**: `string`
+
+Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1078
+
+#### Inherited from
+
+`Error.stack`
+
+---
+
+### prepareStackTrace()?
+
+> `static` `optional` **prepareStackTrace**: (`err`, `stackTraces`) => `any`
+
+Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:143
+
+Optional override for formatting stack traces
+
+#### Parameters
+
+##### err
+
+`Error`
+
+##### stackTraces
+
+`CallSite`\[]
+
+#### Returns
+
+`any`
+
+#### See
+
+<https://v8.dev/docs/stack-trace-api#customizing-stack-traces>
+
+#### Inherited from
+
+`Error.prepareStackTrace`
+
+---
+
+### stackTraceLimit
+
+> `static` **stackTraceLimit**: `number`
+
+Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:145
+
+#### Inherited from
+
+`Error.stackTraceLimit`
+
+## Methods
+
+### captureStackTrace()
+
+> `static` **captureStackTrace**(`targetObject`, `constructorOpt`?): `void`
+
+Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:136
+
+Create .stack property on a target object
+
+#### Parameters
+
+##### targetObject
+
+`object`
+
+##### constructorOpt?
+
+`Function`
+
+#### Returns
+
+`void`
+
+#### Inherited from
+
+`Error.captureStackTrace`

docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md

@@ -10,7 +10,7 @@
 
 # Interface: ExternalDiagramDefinition
 
-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)
+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
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:96](https://github.com/me
 
 > **detector**: `DiagramDetector`
 
-Defined in: [packages/mermaid/src/diagram-api/types.ts:98](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L98)
+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)
 
 ---
 
@@ -26,7 +26,7 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:98](https://github.com/me
 
 > **id**: `string`
 
-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)
+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 +34,4 @@ Defined in: [packages/mermaid/src/diagram-api/types.ts:97](https://github.com/me
 
 > **loader**: `DiagramLoader`
 
-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:97](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L97)

docs/config/setup/mermaid/interfaces/LayoutData.md

@@ -10,7 +10,7 @@
 
 # Interface: LayoutData
 
-Defined in: [packages/mermaid/src/rendering-util/types.ts:168](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L168)
+Defined in: [packages/mermaid/src/rendering-util/types.ts:145](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L145)
 
 ## Indexable
 
@@ -22,7 +22,7 @@ Defined in: [packages/mermaid/src/rendering-util/types.ts:168](https://github.co
 
 > **config**: [`MermaidConfig`](MermaidConfig.md)
 
-Defined in: [packages/mermaid/src/rendering-util/types.ts:171](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L171)
+Defined in: [packages/mermaid/src/rendering-util/types.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L148)
 
 ---
 
@@ -30,7 +30,7 @@ Defined in: [packages/mermaid/src/rendering-util/types.ts:171](https://github.co
 
 > **edges**: `Edge`\[]
 
-Defined in: [packages/mermaid/src/rendering-util/types.ts:170](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L170)
+Defined in: [packages/mermaid/src/rendering-util/types.ts:147](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L147)
 
 ---
 
@@ -38,4 +38,4 @@ Defined in: [packages/mermaid/src/rendering-util/types.ts:170](https://github.co
 
 > **nodes**: `Node`\[]
 
-Defined in: [packages/mermaid/src/rendering-util/types.ts:169](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L169)
+Defined in: [packages/mermaid/src/rendering-util/types.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L146)

docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md

@@ -10,7 +10,7 @@
 
 # Interface: LayoutLoaderDefinition
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:24](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L24)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:21](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L21)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/rendering-util/render.ts:24](https://github.co
 
 > `optional` **algorithm**: `string`
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:27](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L27)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:24](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L24)
 
 ---
 
@@ -26,7 +26,7 @@ Defined in: [packages/mermaid/src/rendering-util/render.ts:27](https://github.co
 
 > **loader**: `LayoutLoader`
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:26](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L26)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:23](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L23)
 
 ---
 
@@ -34,4 +34,4 @@ Defined in: [packages/mermaid/src/rendering-util/render.ts:26](https://github.co
 
 > **name**: `string`
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:25](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L25)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:22](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L22)

docs/config/setup/mermaid/interfaces/Mermaid.md

@@ -32,7 +32,7 @@ page.
 
 ### detectType()
 
-> **detectType**: (`text`, `config?`) => `string`
+> **detectType**: (`text`, `config`?) => `string`
 
 Defined in: [packages/mermaid/src/mermaid.ts:449](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L449)
 
@@ -105,7 +105,7 @@ An array of objects with the id of the diagram.
 
 ### ~~init()~~
 
-> **init**: (`config?`, `nodes?`, `callback?`) => `Promise`<`void`>
+> **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`>
 
 Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
 
@@ -117,7 +117,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/
 
 [`MermaidConfig`](MermaidConfig.md)
 
-**Deprecated**, please set configuration in [initialize](#initialize).
+**Deprecated**, please set configuration in [initialize](Mermaid.md#initialize).
 
 ##### nodes?
 
@@ -141,13 +141,13 @@ Called once for each rendered diagram's id.
 
 #### Deprecated
 
-Use [initialize](#initialize) and [run](#run) instead.
+Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
 
 Renders the mermaid diagrams
 
 #### Deprecated
 
-Use [initialize](#initialize) and [run](#run) instead.
+Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
 
 ---
 
@@ -176,7 +176,7 @@ Configuration object for mermaid.
 
 ### ~~mermaidAPI~~
 
-> **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); }>
+> **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:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
 
@@ -184,81 +184,73 @@ Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/
 
 #### Deprecated
 
-Use [parse](#parse) and [render](#render) instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
+Use [parse](Mermaid.md#parse) and [render](Mermaid.md#render) instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
 
 ---
 
 ### parse()
 
-> **parse**: {(`text`, `parseOptions`): `Promise`<`false` | [`ParseResult`](ParseResult.md)>; (`text`, `parseOptions?`): `Promise`<[`ParseResult`](ParseResult.md)>; }
+> **parse**: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>
 
 Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
 
-#### Call Signature
-
-> (`text`, `parseOptions`): `Promise`<`false` | [`ParseResult`](ParseResult.md)>
-
 Parse the text and validate the syntax.
 
-##### Parameters
+#### Parameters
 
-###### text
+##### text
 
 `string`
 
 The mermaid diagram definition.
 
-###### parseOptions
+##### parseOptions
 
 [`ParseOptions`](ParseOptions.md) & `object`
 
 Options for parsing.
 
-##### Returns
+#### Returns
 
 `Promise`<`false` | [`ParseResult`](ParseResult.md)>
 
 An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
 
-##### See
+#### See
 
 [ParseOptions](ParseOptions.md)
 
-##### Throws
+#### Throws
 
 Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
 
-#### Call Signature
-
-> (`text`, `parseOptions?`): `Promise`<[`ParseResult`](ParseResult.md)>
-
 Parse the text and validate the syntax.
 
-##### Parameters
+#### Parameters
 
-###### text
+##### text
 
 `string`
 
 The mermaid diagram definition.
 
-###### parseOptions?
+##### parseOptions?
 
 [`ParseOptions`](ParseOptions.md)
 
 Options for parsing.
 
-##### Returns
+#### Returns
 
 `Promise`<[`ParseResult`](ParseResult.md)>
 
 An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
 
-##### See
+#### See
 
 [ParseOptions](ParseOptions.md)
 
-##### Throws
+#### Throws
 
 Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
 
@@ -340,7 +332,7 @@ Defined in: [packages/mermaid/src/mermaid.ts:444](https://github.com/mermaid-js/
 
 ### render()
 
-> **render**: (`id`, `text`, `svgContainingElement?`) => `Promise`<[`RenderResult`](RenderResult.md)>
+> **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>
 
 Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
 

docs/config/setup/mermaid/interfaces/ParseOptions.md

@@ -10,7 +10,7 @@
 
 # Interface: ParseOptions
 
-Defined in: [packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89)
+Defined in: [packages/mermaid/src/types.ts:84](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L84)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mer
 
 > `optional` **suppressErrors**: `boolean`
 
-Defined in: [packages/mermaid/src/types.ts:94](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L94)
+Defined in: [packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89)
 
 If `true`, parse will return `false` instead of throwing error when the diagram is invalid.
 The `parseError` function will not be called.

docs/config/setup/mermaid/interfaces/ParseResult.md

@@ -10,7 +10,7 @@
 
 # Interface: ParseResult
 
-Defined in: [packages/mermaid/src/types.ts:97](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L97)
+Defined in: [packages/mermaid/src/types.ts:92](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L92)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/types.ts:97](https://github.com/mermaid-js/mer
 
 > **config**: [`MermaidConfig`](MermaidConfig.md)
 
-Defined in: [packages/mermaid/src/types.ts:105](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L105)
+Defined in: [packages/mermaid/src/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L100)
 
 The config passed as YAML frontmatter or directives
 
@@ -28,6 +28,6 @@ The config passed as YAML frontmatter or directives
 
 > **diagramType**: `string`
 
-Defined in: [packages/mermaid/src/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L101)
+Defined in: [packages/mermaid/src/types.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L96)
 
 The diagram type, e.g. 'flowchart', 'sequence', etc.

docs/config/setup/mermaid/interfaces/RenderOptions.md

@@ -10,7 +10,7 @@
 
 # Interface: RenderOptions
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:10](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L10)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:7](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L7)
 
 ## Properties
 
@@ -18,4 +18,4 @@ Defined in: [packages/mermaid/src/rendering-util/render.ts:10](https://github.co
 
 > `optional` **algorithm**: `string`
 
-Defined in: [packages/mermaid/src/rendering-util/render.ts:11](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L11)
+Defined in: [packages/mermaid/src/rendering-util/render.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L8)

docs/config/setup/mermaid/interfaces/RenderResult.md

@@ -10,7 +10,7 @@
 
 # Interface: RenderResult
 
-Defined in: [packages/mermaid/src/types.ts:115](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L115)
+Defined in: [packages/mermaid/src/types.ts:110](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L110)
 
 ## Properties
 
@@ -18,7 +18,7 @@ Defined in: [packages/mermaid/src/types.ts:115](https://github.com/mermaid-js/me
 
 > `optional` **bindFunctions**: (`element`) => `void`
 
-Defined in: [packages/mermaid/src/types.ts:133](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L133)
+Defined in: [packages/mermaid/src/types.ts:128](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L128)
 
 Bind function to be called after the svg has been inserted into the DOM.
 This is necessary for adding event listeners to the elements in the svg.
@@ -45,7 +45,7 @@ bindFunctions?.(div); // To call bindFunctions only if it's present.
 
 > **diagramType**: `string`
 
-Defined in: [packages/mermaid/src/types.ts:123](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L123)
+Defined in: [packages/mermaid/src/types.ts:118](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L118)
 
 The diagram type, e.g. 'flowchart', 'sequence', etc.
 
@@ -55,6 +55,6 @@ The diagram type, e.g. 'flowchart', 'sequence', etc.
 
 > **svg**: `string`
 
-Defined in: [packages/mermaid/src/types.ts:119](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L119)
+Defined in: [packages/mermaid/src/types.ts:114](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L114)
 
 The svg code for the rendered graph.

docs/config/setup/mermaid/interfaces/UnknownDiagramError.md

@@ -1,65 +0,0 @@
-> **Warning**
->
-> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
->
-> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/UnknownDiagramError.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/UnknownDiagramError.md).
-
-[**mermaid**](../../README.md)
-
----
-
-# Interface: UnknownDiagramError
-
-Defined in: [packages/mermaid/src/errors.ts:1](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L1)
-
-## Extends
-
-- `Error`
-
-## Properties
-
-### cause?
-
-> `optional` **cause**: `unknown`
-
-Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es2022.error.d.ts:26
-
-#### Inherited from
-
-`Error.cause`
-
----
-
-### message
-
-> **message**: `string`
-
-Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1077
-
-#### Inherited from
-
-`Error.message`
-
----
-
-### name
-
-> **name**: `string`
-
-Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1076
-
-#### Inherited from
-
-`Error.name`
-
----
-
-### stack?
-
-> `optional` **stack**: `string`
-
-Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1078
-
-#### Inherited from
-
-`Error.stack`

docs/config/setup/mermaid/type-aliases/InternalHelpers.md

@@ -10,6 +10,6 @@
 
 # Type Alias: InternalHelpers
 
-> **InternalHelpers** = _typeof_ `internalHelpers`
+> **InternalHelpers**: _typeof_ `internalHelpers`
 
 Defined in: [packages/mermaid/src/internals.ts:33](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/internals.ts#L33)

docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md

@@ -10,7 +10,7 @@
 
 # Type Alias: ParseErrorFunction()
 
-> **ParseErrorFunction** = (`err`, `hash?`) => `void`
+> **ParseErrorFunction**: (`err`, `hash`?) => `void`
 
 Defined in: [packages/mermaid/src/Diagram.ts:10](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/Diagram.ts#L10)
 

docs/config/setup/mermaid/type-aliases/SVG.md

@@ -10,6 +10,6 @@
 
 # Type Alias: SVG
 
-> **SVG** = `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
+> **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
 
-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)
+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)

docs/config/setup/mermaid/type-aliases/SVGGroup.md

@@ -10,6 +10,6 @@
 
 # Type Alias: SVGGroup
 
-> **SVGGroup** = `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`>
+> **SVGGroup**: `d3.Selection`<`SVGGElement`, `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:128](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L128)

docs/config/tidy-tree.md

@@ -1,89 +0,0 @@
-> **Warning**
->
-> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
->
-> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/tidy-tree.md](../../packages/mermaid/src/docs/config/tidy-tree.md).
-
-# Tidy-tree Layout
-
-The **tidy-tree** layout arranges nodes in a hierarchical, tree-like structure. It is especially useful for diagrams where parent-child relationships are important, such as mindmaps.
-
-## Features
-
-- Organizes nodes in a tidy, non-overlapping tree
-- Ideal for mindmaps and hierarchical data
-- Automatically adjusts spacing for readability
-
-## Example Usage
-
-```mermaid-example
----
-config:
-  layout: tidy-tree
----
-mindmap
-root((mindmap is a long thing))
-  A
-  B
-  C
-  D
-```
-
-```mermaid
----
-config:
-  layout: tidy-tree
----
-mindmap
-root((mindmap is a long thing))
-  A
-  B
-  C
-  D
-```
-
-```mermaid-example
----
-config:
-  layout: tidy-tree
----
-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
-```
-
-```mermaid
----
-config:
-  layout: tidy-tree
----
-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
-```
-
-## Note
-
-- Currently, tidy-tree is primarily supported for mindmap diagrams.

docs/ecosystem/integrations-community.md

@@ -57,8 +57,6 @@ To add an integration to this list, see the [Integrations - create page](./integ
   - [GitHub Writer](https://github.com/ckeditor/github-writer)
   - [SVG diagram generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator)
 - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅
-- [GNU Octave](https://octave.org/) ✅
-  - [octave_mermaid_js](https://github.com/CNOCTAVE/octave_mermaid_js) ✅
 - [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid)
 - [MonsterWriter](https://www.monsterwriter.com/) ✅
 - [Joplin](https://joplinapp.org) ✅
@@ -274,7 +272,6 @@ Communication tools and platforms
   - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin)
 - [Reveal CK](https://github.com/jedcn/reveal-ck)
   - [reveal-ck-mermaid-plugin](https://github.com/tmtm/reveal-ck-mermaid-plugin)
-- [speccharts: Turn your test suites into specification diagrams](https://github.com/arnaudrenaud/speccharts)
 - [Vitepress Plugin](https://github.com/sametcn99/vitepress-mermaid-renderer)
 
 <!--- cspell:ignore Blazorade HueHive --->

docs/ecosystem/mermaid-chart.md

@@ -29,6 +29,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun
 - **Plugins** - A plugin system for extending the functionality of Mermaid.
 
   Official Mermaid Chart plugins:
+
   - [Mermaid Chart GPT](https://chatgpt.com/g/g-684cc36f30208191b21383b88650a45d-mermaid-chart-diagrams-and-charts)
   - [Confluence](https://marketplace.atlassian.com/apps/1234056/mermaid-chart-for-confluence?hosting=cloud&tab=overview)
   - [Jira](https://marketplace.atlassian.com/apps/1234810/mermaid-chart-for-jira?tab=overview&hosting=cloud)
@@ -47,7 +48,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun
 
 ## Plans
 
-- **Free** - A free plan that includes six diagrams.
+- **Free** - A free plan that includes three diagrams.
 
 - **Pro** - A paid plan that includes unlimited diagrams, access to the collaboration feature, and more.
 

docs/news/announcements.md

@@ -35,11 +35,13 @@ The Mermaid Chart team is excited to introduce a new Visual Editor for Flowchart
 Learn more:
 
 - Visual Editor For Flowcharts
+
   - [Blog post](https://www.mermaidchart.com/blog/posts/mermaid-chart-releases-new-visual-editor-for-flowcharts)
 
   - [Demo video](https://www.youtube.com/watch?v=5aja0gijoO0)
 
 - Visual Editor For Sequence diagrams
+
   - [Blog post](https://www.mermaidchart.com/blog/posts/mermaid-chart-unveils-visual-editor-for-sequence-diagrams)
 
   - [Demo video](https://youtu.be/imc2u5_N6Dc)

docs/news/blog.md

@@ -6,18 +6,6 @@
 
 # Blog
 
-## [The Essential Guide to Mermaid Chart Plugin for VS Code \[08/2025\]](https://docs.mermaidchart.com/blog/posts/the-essential-guide-to-mermaid-chart-plugin-for-vs-code-08-2025)
-
-9/9/2025 • 5 mins
-
-Creating diagrams in VS Code has never been easier—the Mermaid VS Code plugin transforms text-based syntax into clear, professional visuals right inside your editor. With live previews, smart editing, and AI-powered diagram generation, it removes the friction from visualization so you can focus on coding.
-
-## [How to Create Perfect Flowcharts Using AI in 2025 Step-by-Step Guide](https://docs.mermaidchart.com/blog/posts/how-to-create-perfect-flowcharts-using-ai-in-2025-step-by-step-guide)
-
-7/22/2025 • 8 mins
-
-In 2025, AI tools make creating flowcharts faster and easier than ever. With Mermaid’s AI flowchart generator, you can turn plain text into clear, accurate diagrams in seconds. This guide walks through how it works and how to get the most out of it for technical and business workflows alike.
-
 ## [Mermaid introduces the Visual Editor for Entity Relationship diagrams](https://docs.mermaidchart.com/blog/posts/mermaid-introduces-the-visual-editor-for-entity-relationship-diagrams)
 
 7/15/2025 • 7 mins

docs/syntax/architecture.md

@@ -194,7 +194,7 @@ architecture-beta
 ## Icons
 
 By default, architecture diagram supports the following icons: `cloud`, `database`, `disk`, `internet`, `server`.
-Users can use any of the 200,000+ icons available in iconify.design, or add other custom icons, by [registering an icon pack](../config/icons.md).
+Users can use any of the 200,000+ icons available in iconify.design, or [add custom icons](../config/icons.md).
 
 After the icons are installed, they can be used in the architecture diagram by using the format "name:icon-name", where name is the value used when registering the icon pack.
 

docs/syntax/block.md

@@ -402,7 +402,7 @@ block
   blockArrowId4<["Label"]>(down)
   blockArrowId5<["Label"]>(x)
   blockArrowId6<["Label"]>(y)
-  blockArrowId7<["Label"]>(x, down)
+  blockArrowId6<["Label"]>(x, down)
 ```
 
 ```mermaid
@@ -413,7 +413,7 @@ block
   blockArrowId4<["Label"]>(down)
   blockArrowId5<["Label"]>(x)
   blockArrowId6<["Label"]>(y)
-  blockArrowId7<["Label"]>(x, down)
+  blockArrowId6<["Label"]>(x, down)
 ```
 
 #### Example - Space Blocks

docs/syntax/c4.md

@@ -139,6 +139,7 @@ The following unfinished features are not supported in the short term.
 - [ ] Legend
 
 - [x] System Context
+
   - [x] Person(alias, label, ?descr, ?sprite, ?tags, $link)
   - [x] Person_Ext
   - [x] System(alias, label, ?descr, ?sprite, ?tags, $link)
@@ -152,6 +153,7 @@ The following unfinished features are not supported in the short term.
   - [x] System_Boundary
 
 - [x] Container diagram
+
   - [x] Container(alias, label, ?techn, ?descr, ?sprite, ?tags, $link)
   - [x] ContainerDb
   - [x] ContainerQueue
@@ -161,6 +163,7 @@ The following unfinished features are not supported in the short term.
   - [x] Container_Boundary(alias, label, ?tags, $link)
 
 - [x] Component diagram
+
   - [x] Component(alias, label, ?techn, ?descr, ?sprite, ?tags, $link)
   - [x] ComponentDb
   - [x] ComponentQueue
@@ -169,15 +172,18 @@ The following unfinished features are not supported in the short term.
   - [x] ComponentQueue_Ext
 
 - [x] Dynamic diagram
+
   - [x] RelIndex(index, from, to, label, ?tags, $link)
 
 - [x] Deployment diagram
+
   - [x] Deployment_Node(alias, label, ?type, ?descr, ?sprite, ?tags, $link)
   - [x] Node(alias, label, ?type, ?descr, ?sprite, ?tags, $link): short name of Deployment_Node()
   - [x] Node_L(alias, label, ?type, ?descr, ?sprite, ?tags, $link): left aligned Node()
   - [x] Node_R(alias, label, ?type, ?descr, ?sprite, ?tags, $link): right aligned Node()
 
 - [x] Relationship Types
+
   - [x] Rel(from, to, label, ?techn, ?descr, ?sprite, ?tags, $link)
   - [x] BiRel (bidirectional relationship)
   - [x] Rel_U, Rel_Up

docs/syntax/classDiagram.md

@@ -21,7 +21,7 @@ title: Animal example
 classDiagram
     note "From Duck till Zebra"
     Animal <|-- Duck
-    note for Duck "can fly<br>can swim<br>can dive<br>can help in debugging"
+    note for Duck "can fly\ncan swim\ncan dive\ncan help in debugging"
     Animal <|-- Fish
     Animal <|-- Zebra
     Animal : +int age
@@ -50,7 +50,7 @@ title: Animal example
 classDiagram
     note "From Duck till Zebra"
     Animal <|-- Duck
-    note for Duck "can fly<br>can swim<br>can dive<br>can help in debugging"
+    note for Duck "can fly\ncan swim\ncan dive\ncan help in debugging"
     Animal <|-- Fish
     Animal <|-- Zebra
     Animal : +int age

docs/syntax/flowchart.md

@@ -326,9 +326,7 @@ Below is a comprehensive list of the newly introduced shapes and their correspon
 
 | **Semantic Name**                 | **Shape Name**         | **Short Name** | **Description**                | **Alias Supported**                                              |
 | --------------------------------- | ---------------------- | -------------- | ------------------------------ | ---------------------------------------------------------------- |
-| Bang                              | Bang                   | `bang`         | Bang                           | `bang`                                                           |
 | Card                              | Notched Rectangle      | `notch-rect`   | Represents a card              | `card`, `notched-rectangle`                                      |
-| Cloud                             | Cloud                  | `cloud`        | cloud                          | `cloud`                                                          |
 | Collate                           | Hourglass              | `hourglass`    | Represents a collate operation | `collate`, `hourglass`                                           |
 | Com Link                          | Lightning Bolt         | `bolt`         | Communication link             | `com-link`, `lightning-bolt`                                     |
 | Comment                           | Curly Brace            | `brace`        | Adds a comment                 | `brace-l`, `comment`                                             |

docs/syntax/gantt.md

@@ -360,8 +360,7 @@ gantt
   weekday monday
 ```
 
-> **Warning**
-> `millisecond` and `second` support was added in v10.3.0
+> **Warning** > `millisecond` and `second` support was added in v10.3.0
 
 ## Output in compact mode
 

docs/syntax/mindmap.md

@@ -314,22 +314,3 @@ You can also refer the [implementation in the live editor](https://github.com/me
 cspell:locale en,en-gb
 cspell:ignore Buzan
 --->
-
-## Layouts
-
-Mermaid also supports a Tidy Tree layout for mindmaps.
-
-```
----
-config:
-  layout: tidy-tree
----
-mindmap
-root((mindmap is a long thing))
-  A
-  B
-  C
-  D
-```
-
-Instructions to add and register tidy-tree layout are present in [Tidy Tree Configuration](/config/tidy-tree)

docs/syntax/radar.md

@@ -62,7 +62,7 @@ radar-beta
 radar-beta
   title Restaurant Comparison
   axis food["Food Quality"], service["Service"], price["Price"]
-  axis ambiance["Ambiance"]
+  axis ambiance["Ambiance"],
 
   curve a["Restaurant A"]{4, 3, 2, 4}
   curve b["Restaurant B"]{3, 4, 3, 3}
@@ -78,7 +78,7 @@ radar-beta
 radar-beta
   title Restaurant Comparison
   axis food["Food Quality"], service["Service"], price["Price"]
-  axis ambiance["Ambiance"]
+  axis ambiance["Ambiance"],
 
   curve a["Restaurant A"]{4, 3, 2, 4}
   curve b["Restaurant B"]{3, 4, 3, 3}

docs/syntax/sequenceDiagram.md

@@ -196,11 +196,7 @@ sequenceDiagram
 
 ### Aliases
 
-The actor can have a convenient identifier and a descriptive label. Aliases can be defined in two ways: using external syntax with the `as` keyword, or inline within the configuration object.
-
-#### External Alias Syntax
-
-You can define an alias using the `as` keyword after the participant declaration:
+The actor can have a convenient identifier and a descriptive label.
 
 ```mermaid-example
 sequenceDiagram
@@ -218,78 +214,6 @@ sequenceDiagram
     J->>A: Great!
 ```
 
-The external alias syntax also works with participant stereotype configurations, allowing you to combine type specification with aliases:
-
-```mermaid-example
-sequenceDiagram
-    participant API@{ "type": "boundary" } as Public API
-    actor DB@{ "type": "database" } as User Database
-    participant Svc@{ "type": "control" } as Auth Service
-    API->>Svc: Authenticate
-    Svc->>DB: Query user
-    DB-->>Svc: User data
-    Svc-->>API: Token
-```
-
-```mermaid
-sequenceDiagram
-    participant API@{ "type": "boundary" } as Public API
-    actor DB@{ "type": "database" } as User Database
-    participant Svc@{ "type": "control" } as Auth Service
-    API->>Svc: Authenticate
-    Svc->>DB: Query user
-    DB-->>Svc: User data
-    Svc-->>API: Token
-```
-
-#### Inline Alias Syntax
-
-Alternatively, you can define an alias directly inside the configuration object using the `"alias"` field. This works with both `participant` and `actor` keywords:
-
-```mermaid-example
-sequenceDiagram
-    participant API@{ "type": "boundary", "alias": "Public API" }
-    participant Auth@{ "type": "control", "alias": "Auth Service" }
-    participant DB@{ "type": "database", "alias": "User Database" }
-    API->>Auth: Login request
-    Auth->>DB: Query user
-    DB-->>Auth: User data
-    Auth-->>API: Access token
-```
-
-```mermaid
-sequenceDiagram
-    participant API@{ "type": "boundary", "alias": "Public API" }
-    participant Auth@{ "type": "control", "alias": "Auth Service" }
-    participant DB@{ "type": "database", "alias": "User Database" }
-    API->>Auth: Login request
-    Auth->>DB: Query user
-    DB-->>Auth: User data
-    Auth-->>API: Access token
-```
-
-#### Alias Precedence
-
-When both inline alias (in the configuration object) and external alias (using `as` keyword) are provided, the **external alias takes precedence**:
-
-```mermaid-example
-sequenceDiagram
-    participant API@{ "type": "boundary", "alias": "Internal Name" } as External Name
-    participant DB@{ "type": "database", "alias": "Internal DB" } as External DB
-    API->>DB: Query
-    DB-->>API: Result
-```
-
-```mermaid
-sequenceDiagram
-    participant API@{ "type": "boundary", "alias": "Internal Name" } as External Name
-    participant DB@{ "type": "database", "alias": "Internal DB" } as External DB
-    API->>DB: Query
-    DB-->>API: Result
-```
-
-In the example above, "External Name" and "External DB" will be displayed, not "Internal Name" and "Internal DB".
-
 ### Actor Creation and Destruction (v10.3.0+)
 
 It is possible to create and destroy actors by messages. To do so, add a create or destroy directive before the message.
@@ -405,11 +329,7 @@ Messages can be of two displayed either solid or with a dotted line.
 [Actor][Arrow][Actor]:Message text
 ```
 
-Lines can be solid or dotted, and can end with various types of arrowheads, crosses, or open arrows.
-
-#### Supported Arrow Types
-
-**Standard Arrow Types**
+There are ten types of arrows currently supported:
 
 | Type     | Description                                          |
 | -------- | ---------------------------------------------------- |
@@ -424,58 +344,6 @@ Lines can be solid or dotted, and can end with various types of arrowheads, cros
 | `-)`     | Solid line with an open arrow at the end (async)     |
 | `--)`    | Dotted line with a open arrow at the end (async)     |
 
-**Half-Arrows (v\<MERMAID_RELEASE_VERSION>+)**
-
-The following half-arrow types are supported for more expressive sequence diagrams. Both solid and dotted variants are available by increasing the number of dashes (`-` → `--`).
-
----
-
-| Type    | Description                                          |
-| ------- | ---------------------------------------------------- |
-| `-\|\`  | Solid line with top half arrowhead                   |
-| `--\|\` | Dotted line with top half arrowhead                  |
-| `-\|/`  | Solid line with bottom half arrowhead                |
-| `--\|/` | Dotted line with bottom half arrowhead               |
-| `/\|-`  | Solid line with reverse top half arrowhead           |
-| `/\|--` | Dotted line with reverse top half arrowhead          |
-| `\\-`   | Solid line with reverse bottom half arrowhead        |
-| `\\--`  | Dotted line with reverse bottom half arrowhead       |
-| `-\\`   | Solid line with top stick half arrowhead             |
-| `--\\`  | Dotted line with top stick half arrowhead            |
-| `-//`   | Solid line with bottom stick half arrowhead          |
-| `--//`  | Dotted line with bottom stick half arrowhead         |
-| `//-`   | Solid line with reverse top stick half arrowhead     |
-| `//--`  | Dotted line with reverse top stick half arrowhead    |
-| `\\-`   | Solid line with reverse bottom stick half arrowhead  |
-| `\\--`  | Dotted line with reverse bottom stick half arrowhead |
-
-## Central Connections (v\<MERMAID_RELEASE_VERSION>+)
-
-Mermaid sequence diagrams support **central lifeline connections** using a `()`.
-This is useful to represent messages or signals that connect to a central point, rather than from one actor directly to another.
-
-To indicate a central connection, append `()` to the arrow syntax.
-
-#### Basic Syntax
-
-```mermaid-example
-sequenceDiagram
-    participant Alice
-    participant John
-    Alice->>()John: Hello John
-    Alice()->>John: How are you?
-    John()->>()Alice: Great!
-```
-
-```mermaid
-sequenceDiagram
-    participant Alice
-    participant John
-    Alice->>()John: Hello John
-    Alice()->>John: How are you?
-    John()->>()Alice: Great!
-```
-
 ## Activations
 
 It is possible to activate and deactivate an actor. (de)activation can be dedicated declarations:

docs/syntax/userJourney.md

@@ -38,5 +38,3 @@ Each user journey is split into sections, these describe the part of the task
 the user is trying to complete.
 
 Tasks syntax is `Task name: <score>: <comma separated list of actors>`
-
-Score is a number between 1 and 5, inclusive.

docs/syntax/xyChart.md

@@ -138,7 +138,7 @@ xychart
 
 ## Chart Theme Variables
 
-Themes for xychart reside inside the `xychart` attribute, allowing customization through the following syntax:
+Themes for xychart resides inside xychart attribute so to set the variables use this syntax:
 
 ```yaml
 ---
@@ -163,52 +163,6 @@ config:
 | yAxisLineColor   | Color of the y-axis line                                  |
 | plotColorPalette | String of colors separated by comma e.g. "#f3456, #43445" |
 
-### Setting Colors for Lines and Bars
-
-To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette).
-
-```mermaid-example
----
-config:
-  themeVariables:
-    xyChart:
-      plotColorPalette: '#000000, #0000FF, #00FF00, #FF0000'
----
-xychart
-title "Different Colors in xyChart"
-x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"]
-y-axis "valuesY" 0 --> 50
-%% Black line
-line [10,20,30,40]
-%% Blue bar
-bar [20,30,25,35]
-%% Green bar
-bar [15,25,20,30]
-%% Red line
-line [5,15,25,35]
-```
-
-```mermaid
----
-config:
-  themeVariables:
-    xyChart:
-      plotColorPalette: '#000000, #0000FF, #00FF00, #FF0000'
----
-xychart
-title "Different Colors in xyChart"
-x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"]
-y-axis "valuesY" 0 --> 50
-%% Black line
-line [10,20,30,40]
-%% Blue bar
-bar [20,30,25,35]
-%% Green bar
-bar [15,25,20,30]
-%% Red line
-line [5,15,25,35]
-```
-
 ## Example on config and theme
 
 ```mermaid-example

eslint.config.js

@@ -17,7 +17,6 @@ export default tseslint.config(
   ...tseslint.configs.stylisticTypeChecked,
   {
     ignores: [
-      '**/*.d.ts',
       '**/dist/',
       '**/node_modules/',
       '.git/',

package.json

@@ -63,73 +63,73 @@
     ]
   },
   "devDependencies": {
-    "@applitools/eyes-cypress": "^3.56.5",
-    "@argos-ci/cypress": "^6.2.2",
+    "@applitools/eyes-cypress": "^3.44.9",
+    "@argos-ci/cypress": "^5.0.2",
     "@changesets/changelog-github": "^0.5.1",
-    "@changesets/cli": "^2.29.7",
-    "@cspell/eslint-plugin": "^9.3.0",
-    "@cypress/code-coverage": "^3.14.7",
+    "@changesets/cli": "^2.27.12",
+    "@cspell/eslint-plugin": "^8.19.4",
+    "@cypress/code-coverage": "^3.12.49",
     "@eslint/js": "^9.26.0",
-    "@rollup/plugin-typescript": "^12.1.4",
-    "@types/cors": "^2.8.19",
-    "@types/express": "^5.0.5",
+    "@rollup/plugin-typescript": "^12.1.2",
+    "@types/cors": "^2.8.17",
+    "@types/express": "^5.0.0",
     "@types/js-yaml": "^4.0.9",
     "@types/jsdom": "^21.1.7",
-    "@types/lodash": "^4.17.21",
+    "@types/lodash": "^4.17.15",
     "@types/mdast": "^4.0.4",
-    "@types/node": "^22.19.1",
+    "@types/node": "^22.13.5",
     "@types/rollup-plugin-visualizer": "^5.0.3",
-    "@vitest/coverage-v8": "^3.2.4",
-    "@vitest/spy": "^3.2.4",
-    "@vitest/ui": "^3.2.4",
+    "@vitest/coverage-v8": "^3.0.6",
+    "@vitest/spy": "^3.0.6",
+    "@vitest/ui": "^3.0.6",
     "ajv": "^8.17.1",
     "chokidar": "3.6.0",
-    "concurrently": "^9.2.1",
+    "concurrently": "^9.1.2",
     "cors": "^2.8.5",
     "cpy-cli": "^5.0.0",
     "cross-env": "^7.0.3",
-    "cspell": "^9.3.2",
-    "cypress": "^14.5.4",
+    "cspell": "^9.1.3",
+    "cypress": "^14.5.1",
     "cypress-image-snapshot": "^4.0.1",
-    "cypress-split": "^1.24.25",
-    "esbuild": "^0.25.12",
+    "cypress-split": "^1.24.14",
+    "esbuild": "^0.25.0",
     "eslint": "^9.26.0",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-cypress": "^5.2.0",
+    "eslint-plugin-cypress": "^4.3.0",
     "eslint-plugin-html": "^8.1.3",
-    "eslint-plugin-jest": "^29.0.1",
-    "eslint-plugin-jsdoc": "^61.1.12",
+    "eslint-plugin-jest": "^28.14.0",
+    "eslint-plugin-jsdoc": "^50.8.0",
     "eslint-plugin-json": "^4.0.1",
     "eslint-plugin-lodash": "^8.0.0",
     "eslint-plugin-markdown": "^5.1.0",
     "eslint-plugin-no-only-tests": "^3.3.0",
     "eslint-plugin-tsdoc": "^0.4.0",
-    "eslint-plugin-unicorn": "^62.0.0",
+    "eslint-plugin-unicorn": "^59.0.1",
     "express": "^5.1.0",
-    "globals": "^16.4.0",
-    "globby": "^14.1.0",
+    "globals": "^16.0.0",
+    "globby": "^14.0.2",
     "husky": "^9.1.7",
-    "jest": "^30.1.3",
+    "jest": "^30.0.4",
     "jison": "^0.4.18",
-    "js-yaml": "^4.1.1",
+    "js-yaml": "^4.1.0",
     "jsdom": "^26.1.0",
     "langium-cli": "3.3.0",
-    "lint-staged": "^16.1.6",
+    "lint-staged": "^16.1.2",
     "markdown-table": "^3.0.4",
     "nyc": "^17.1.0",
     "path-browserify": "^1.0.1",
-    "prettier": "^3.6.2",
-    "prettier-plugin-jsdoc": "^1.3.3",
+    "prettier": "^3.5.2",
+    "prettier-plugin-jsdoc": "^1.3.2",
     "rimraf": "^6.0.1",
-    "rollup-plugin-visualizer": "^6.0.5",
-    "start-server-and-test": "^2.1.3",
+    "rollup-plugin-visualizer": "^6.0.3",
+    "start-server-and-test": "^2.0.10",
     "tslib": "^2.8.1",
-    "tsx": "^4.20.6",
+    "tsx": "^4.7.3",
     "typescript": "~5.7.3",
     "typescript-eslint": "^8.38.0",
-    "vite": "^7.0.8",
+    "vite": "^7.0.3",
     "vite-plugin-istanbul": "^7.0.0",
-    "vitest": "^3.2.4"
+    "vitest": "^3.0.6"
   },
   "nyc": {
     "report-dir": "coverage/cypress"

packages/examples/package.json

@@ -3,7 +3,6 @@
   "version": "1.0.0",
   "description": "Mermaid examples package",
   "author": "Sidharth Vinod",
-  "license": "MIT",
   "type": "module",
   "module": "./dist/mermaid-examples.core.mjs",
   "types": "./dist/mermaid.d.ts",

packages/mermaid-example-diagram/package.json

@@ -37,12 +37,12 @@
     ]
   },
   "dependencies": {
-    "@braintree/sanitize-url": "^7.1.1",
+    "@braintree/sanitize-url": "^7.0.4",
     "d3": "^7.9.0",
     "khroma": "^2.1.0"
   },
   "devDependencies": {
-    "concurrently": "^9.2.1",
+    "concurrently": "^9.1.2",
     "mermaid": "workspace:*",
     "rimraf": "^6.0.1"
   },