diff --git a/.changeset/grumpy-cheetahs-deliver.md b/.changeset/grumpy-cheetahs-deliver.md new file mode 100644 index 000000000..fa6736d42 --- /dev/null +++ b/.changeset/grumpy-cheetahs-deliver.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +`mermaidAPI.getDiagramFromText()` now returns a new db instance on each call for state diagrams diff --git a/.changeset/heavy-moose-mix.md b/.changeset/heavy-moose-mix.md new file mode 100644 index 000000000..c02d62446 --- /dev/null +++ b/.changeset/heavy-moose-mix.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +Added versioning to StateDB and updated tests and diagrams to use it. diff --git a/.changeset/silver-olives-marry.md b/.changeset/silver-olives-marry.md new file mode 100644 index 000000000..d709b17ba --- /dev/null +++ b/.changeset/silver-olives-marry.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +fix: `mermaidAPI.getDiagramFromText()` now returns a new different db for each sequence diagram. Added unique IDs for messages. diff --git a/.changeset/weak-trees-perform.md b/.changeset/weak-trees-perform.md new file mode 100644 index 000000000..17175301d --- /dev/null +++ b/.changeset/weak-trees-perform.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +fix: `getDirection` and `setDirection` in `stateDb` refactored to return and set actual direction diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 6be6f3b5d..b7313b621 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -4,7 +4,7 @@ contact_links: url: https://github.com/mermaid-js/mermaid/discussions about: Ask the Community questions or share your own graphs in our discussions. - name: Discord - url: https://discord.gg/AgrbSrBer3 + url: https://discord.gg/sKeNQX4Wtj about: Join our Community on Discord for Help and a casual chat. - name: Documentation url: https://mermaid.js.org diff --git a/.github/lychee.toml b/.github/lychee.toml index 288ab054a..5070c3d50 100644 --- a/.github/lychee.toml +++ b/.github/lychee.toml @@ -47,7 +47,10 @@ exclude = [ "https://(www.)?drupal.org", # Swimm returns 404, eventhough the link is valid -"https://docs.swimm.io" +"https://docs.swimm.io", + +# Timeout +"https://huehive.co" ] # Exclude all private IPs from checking. diff --git a/.github/workflows/autofix.yml b/.github/workflows/autofix.yml index 7280278d2..5b1066661 100644 --- a/.github/workflows/autofix.yml +++ b/.github/workflows/autofix.yml @@ -13,13 +13,13 @@ jobs: autofix: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 # uses version from "packageManager" field in package.json - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' diff --git a/.github/workflows/build-docs.yml b/.github/workflows/build-docs.yml index 79e9deea1..79ed53de1 100644 --- a/.github/workflows/build-docs.yml +++ b/.github/workflows/build-docs.yml @@ -18,12 +18,12 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' diff --git a/.github/workflows/check-readme-in-sync.yml b/.github/workflows/check-readme-in-sync.yml index 5c940c087..ed5c70208 100644 --- a/.github/workflows/check-readme-in-sync.yml +++ b/.github/workflows/check-readme-in-sync.yml @@ -18,7 +18,7 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout repository - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - name: Check for difference in README.md and docs/README.md run: | diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml index 94ede60ab..a6400a86a 100644 --- a/.github/workflows/codeql.yml +++ b/.github/workflows/codeql.yml @@ -32,11 +32,11 @@ jobs: steps: - name: Checkout repository - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 # Initializes the CodeQL tools for scanning. - name: Initialize CodeQL - uses: github/codeql-action/init@c36620d31ac7c881962c3d9dd939c40ec9434f2b # v3.26.12 + 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@c36620d31ac7c881962c3d9dd939c40ec9434f2b # v3.26.12 + 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@c36620d31ac7c881962c3d9dd939c40ec9434f2b # v3.26.12 + uses: github/codeql-action/analyze@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10 diff --git a/.github/workflows/dependency-review.yml b/.github/workflows/dependency-review.yml index 521735e6e..69c435631 100644 --- a/.github/workflows/dependency-review.yml +++ b/.github/workflows/dependency-review.yml @@ -15,6 +15,6 @@ jobs: runs-on: ubuntu-latest steps: - name: 'Checkout Repository' - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - name: 'Dependency Review' - uses: actions/dependency-review-action@5a2ce3f5b92ee19cbb1541a4984c76d921601d7c # v4.3.4 + uses: actions/dependency-review-action@3b139cfc5fae8b618d3eae3675e383bb1769c019 # v4.5.0 diff --git a/.github/workflows/e2e-applitools.yml b/.github/workflows/e2e-applitools.yml index b1eb70674..9c357a581 100644 --- a/.github/workflows/e2e-applitools.yml +++ b/.github/workflows/e2e-applitools.yml @@ -32,13 +32,13 @@ jobs: run: | echo "::error,title=Not using Applitools::APPLITOOLS_API_KEY is empty, disabling Applitools for this run." - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 # uses version from "packageManager" field in package.json - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: node-version-file: '.node-version' @@ -54,7 +54,7 @@ jobs: APPLITOOLS_SERVER_URL: 'https://eyesapi.applitools.com' - name: Cypress run - uses: cypress-io/github-action@d79d2d530a66e641eb4a5f227e13bc985c60b964 # v4.2.2 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 id: cypress with: start: pnpm run dev diff --git a/.github/workflows/e2e-timings.yml b/.github/workflows/e2e-timings.yml index e3f724d81..b51557b69 100644 --- a/.github/workflows/e2e-timings.yml +++ b/.github/workflows/e2e-timings.yml @@ -19,18 +19,18 @@ jobs: image: cypress/browsers:node-20.11.0-chrome-121.0.6167.85-1-ff-120.0-edge-121.0.2277.83-1 options: --user 1001 steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: node-version-file: '.node-version' - name: Install dependencies - uses: cypress-io/github-action@0da3c06ed8217b912deea9d8ee69630baed1737e # v6.7.6 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 with: runTests: false - name: Cypress run - uses: cypress-io/github-action@0da3c06ed8217b912deea9d8ee69630baed1737e # v6.7.6 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 id: cypress with: install: false @@ -51,3 +51,8 @@ jobs: author_name: 'github-actions[bot]' author_email: '41898282+github-actions[bot]@users.noreply.github.com' message: 'chore: update E2E timings' + - name: Create Pull Request + uses: peter-evans/create-pull-request@v5 + with: + branch: release-promotion + title: Update E2E Timings diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 1392963fb..56883b987 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -7,9 +7,6 @@ on: - master - release/** pull_request: - issue_comment: - types: - - created merge_group: concurrency: ${{ github.workflow }}-${{ github.ref }} @@ -31,41 +28,38 @@ env: ) || github.event.before }} - # Check if this is a new comment with '/visual-test' RUN_VISUAL_TEST: >- - ${{ github.event_name == 'issue_comment' && github.event.action == 'created' && contains(github.event.comment.body, '/visual-test') && github.event.issue.pull_request != null }} + ${{ github.repository == 'mermaid-js/mermaid' && (github.event_name != 'pull_request' || !startsWith(github.head_ref, 'renovate/')) }} jobs: cache: - if: ${{ github.event_name != 'issue_comment' || contains(github.event.comment.body, '/visual-test') }} runs-on: ubuntu-latest container: image: cypress/browsers:node-20.11.0-chrome-121.0.6167.85-1-ff-120.0-edge-121.0.2277.83-1 options: --user 1001 steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: node-version-file: '.node-version' - name: Cache snapshots id: cache-snapshot - uses: actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9 # v4.0.2 + uses: actions/cache@0c907a75c2c80ebcb7f088228285e798b750cf8f # v4.2.1 with: - save-always: true path: ./cypress/snapshots key: ${{ runner.os }}-snapshots-${{ env.targetHash }} # If a snapshot for a given Hash is not found, we checkout that commit, run the tests and cache the snapshots. - name: Switch to base branch if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 with: ref: ${{ env.targetHash }} - name: Install dependencies if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} - uses: cypress-io/github-action@0da3c06ed8217b912deea9d8ee69630baed1737e # v6.7.6 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 with: # just perform install runTests: false @@ -88,26 +82,26 @@ jobs: matrix: containers: [1, 2, 3, 4, 5] steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 # uses version from "packageManager" field in package.json - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: node-version-file: '.node-version' # These cached snapshots are downloaded, providing the reference snapshots. - name: Cache snapshots id: cache-snapshot - uses: actions/cache/restore@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9 # v4.0.2 + 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@0da3c06ed8217b912deea9d8ee69630baed1737e # v6.7.6 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 with: runTests: false @@ -123,7 +117,7 @@ jobs: # Install NPM dependencies, cache them correctly # and run all Cypress tests - name: Cypress run - uses: cypress-io/github-action@0da3c06ed8217b912deea9d8ee69630baed1737e # v6.7.6 + uses: cypress-io/github-action@18a6541367f4580a515371905f499a27a44e8dbe # v6.7.12 id: cypress with: install: false @@ -134,8 +128,6 @@ jobs: # e.g. if this action was run from a fork record: ${{ env.RUN_VISUAL_TEST == 'true' && secrets.CYPRESS_RECORD_KEY != '' }} env: - # Only set Argos environment variables if the visual test comment trigger is present - ARGOS_TOKEN: ${{ env.RUN_VISUAL_TEST == 'true' && secrets.ARGOS_TOKEN || '' }} ARGOS_PARALLEL: ${{ env.RUN_VISUAL_TEST == 'true' }} ARGOS_PARALLEL_TOTAL: ${{ env.RUN_VISUAL_TEST == 'true' && strategy.job-total || 1 }} ARGOS_PARALLEL_INDEX: ${{ env.RUN_VISUAL_TEST == 'true' && matrix.containers || 1 }} @@ -147,7 +139,7 @@ jobs: VITEST_COVERAGE: true - name: Upload Coverage to Codecov - uses: codecov/codecov-action@e28ff129e5465c2c0dcc6f003fc735cb6ae0c673 # v4.5.0 + 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')}} with: diff --git a/.github/workflows/link-checker.yml b/.github/workflows/link-checker.yml index 0a2b74dfe..f855ed23b 100644 --- a/.github/workflows/link-checker.yml +++ b/.github/workflows/link-checker.yml @@ -29,17 +29,17 @@ jobs: # lychee only uses the GITHUB_TOKEN to avoid rate-limiting contents: read steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - name: Restore lychee cache - uses: actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9 # v4.0.2 + uses: actions/cache@0c907a75c2c80ebcb7f088228285e798b750cf8f # v4.2.1 with: path: .lycheecache key: cache-lychee-${{ github.sha }} restore-keys: cache-lychee- - name: Link Checker - uses: lycheeverse/lychee-action@c053181aa0c3d17606addfe97a9075a32723548a # v1.9.3 + uses: lycheeverse/lychee-action@f613c4a64e50d792e0b31ec34bbcbba12263c6a6 # v2.3.0 with: args: >- --config .github/lychee.toml diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index 24e7ee35d..50edaa271 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -15,7 +15,7 @@ jobs: docker-lint: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - uses: hadolint/hadolint-action@54c9adbab1582c2ef04b2016b760714a4bfde3cf # v3.1.0 with: @@ -23,13 +23,13 @@ jobs: lint: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 # uses version from "packageManager" field in package.json - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' diff --git a/.github/workflows/pr-labeler.yml b/.github/workflows/pr-labeler.yml index c9faaa062..44860845f 100644 --- a/.github/workflows/pr-labeler.yml +++ b/.github/workflows/pr-labeler.yml @@ -22,7 +22,7 @@ jobs: pull-requests: write # write permission is required to label PRs steps: - name: Label PR - uses: release-drafter/release-drafter@3f0f87098bd6b5c5b9a36d49c41d998ea58f9348 # v6.0.0 + uses: release-drafter/release-drafter@b1476f6e6eb133afa41ed8589daba6dc69b4d3f5 # v6.1.0 with: config-name: pr-labeler.yml disable-autolabeler: false diff --git a/.github/workflows/publish-docs.yml b/.github/workflows/publish-docs.yml index 587ddae08..1a9ccafb6 100644 --- a/.github/workflows/publish-docs.yml +++ b/.github/workflows/publish-docs.yml @@ -23,12 +23,12 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' @@ -37,7 +37,7 @@ jobs: run: pnpm install --frozen-lockfile - name: Setup Pages - uses: actions/configure-pages@1f0c5cde4bc74cd7e1254d0cb4de8d49e9068c7d # v4.0.0 + uses: actions/configure-pages@983d7736d9b0ae728b81ab479565c72886d7745b # v5.0.0 - name: Run Build run: pnpm --filter mermaid run docs:build:vitepress diff --git a/.github/workflows/release-preview-publish.yml b/.github/workflows/release-preview-publish.yml index fa48d3659..665222b35 100644 --- a/.github/workflows/release-preview-publish.yml +++ b/.github/workflows/release-preview-publish.yml @@ -9,14 +9,14 @@ jobs: publish-preview: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 with: fetch-depth: 0 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' diff --git a/.github/workflows/release-preview.yml b/.github/workflows/release-preview.yml index 7b7dba987..38938dff4 100644 --- a/.github/workflows/release-preview.yml +++ b/.github/workflows/release-preview.yml @@ -26,12 +26,12 @@ jobs: timeout-minutes: 5 steps: - name: Checkout Repo - uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3.6.0 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 4e8e9cd83..649c40034 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -21,12 +21,12 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout Repo - uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3.6.0 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' @@ -36,7 +36,7 @@ jobs: - name: Create Release Pull Request or Publish to npm id: changesets - uses: changesets/action@3de3850952bec538fde60aac71731376e57b9b57 # v1.4.8 + uses: changesets/action@c8bada60c408975afd1a20b3db81d6eee6789308 # v1.4.9 with: version: pnpm changeset:version publish: pnpm changeset:publish diff --git a/.github/workflows/scorecard.yml b/.github/workflows/scorecard.yml index c35f2645b..4901b3781 100644 --- a/.github/workflows/scorecard.yml +++ b/.github/workflows/scorecard.yml @@ -16,22 +16,22 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout code - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 with: persist-credentials: false - name: Run analysis - uses: ossf/scorecard-action@dc50aa9510b46c811795eb24b2f1ba02a914e534 # v2.3.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@65c4c4a1ddee5b72f698fdd19549f0f0fb45cf08 # v4.6.0 + 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@c36620d31ac7c881962c3d9dd939c40ec9434f2b # v3.26.12 + uses: github/codeql-action/upload-sarif@b56ba49b26e50535fa1e7f7db0f4f7b4bf65d80d # v3.28.10 with: sarif_file: results.sarif diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 7323ec027..527ab7401 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -9,13 +9,13 @@ jobs: unit-test: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 # uses version from "packageManager" field in package.json - name: Setup Node.js - uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4.0.4 + uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0 with: cache: pnpm node-version-file: '.node-version' @@ -43,7 +43,7 @@ jobs: pnpm test:check:tsc - name: Upload Coverage to Codecov - uses: codecov/codecov-action@e28ff129e5465c2c0dcc6f003fc735cb6ae0c673 # v4.5.0 + uses: codecov/codecov-action@13ce06bfc6bbe3ecf90edbbf1bc32fe5978ca1d3 # v5.3.1 # Run step only pushes to develop and pull_requests if: ${{ github.event_name == 'pull_request' || github.ref == 'refs/heads/develop' }} with: diff --git a/.github/workflows/update-browserlist.yml b/.github/workflows/update-browserlist.yml index 1b26271f7..94de12ad3 100644 --- a/.github/workflows/update-browserlist.yml +++ b/.github/workflows/update-browserlist.yml @@ -8,8 +8,8 @@ jobs: update-browser-list: runs-on: ubuntu-latest steps: - - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 - - uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 + - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 + - uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0 - run: npx update-browserslist-db@latest - name: Commit changes uses: EndBug/add-and-commit@a94899bca583c204427a224a7af87c02f9b325d5 # v9.1.4 @@ -19,7 +19,7 @@ jobs: message: 'chore: update browsers list' push: false - name: Create Pull Request - uses: peter-evans/create-pull-request@c5a7806660adbe173f04e3e038b0ccdcd758773c # v6.1.0 + uses: peter-evans/create-pull-request@67ccf781d68cd99b580ae25a5c18a1cc84ffff1f # v7.0.6 with: branch: update-browserslist title: Update Browserslist diff --git a/.node-version b/.node-version index 87834047a..7d41c735d 100644 --- a/.node-version +++ b/.node-version @@ -1 +1 @@ -20.12.2 +22.14.0 diff --git a/Dockerfile b/Dockerfile index 7be53d24e..533604407 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,4 +1,4 @@ -FROM node:20.12.2-alpine3.19@sha256:7a91aa397f2e2dfbfcdad2e2d72599f374e0b0172be1d86eeb73f1d33f36a4b2 +FROM node:22.12.0-alpine3.19@sha256:40dc4b415c17b85bea9be05314b4a753f45a4e1716bb31c01182e6c53d51a654 USER 0:0 diff --git a/README.md b/README.md index 280725af7..2fca46b25 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ Generate diagrams from markdown-like text. Live Editor!

- ๐Ÿ“– Documentation | ๐Ÿš€ Getting Started | ๐ŸŒ CDN | ๐Ÿ™Œ Join Us + ๐Ÿ“– Documentation | ๐Ÿš€ Getting Started | ๐ŸŒ CDN | ๐Ÿ™Œ Join Us

็ฎ€ไฝ“ไธญๆ–‡ @@ -33,7 +33,7 @@ Try Live Editor previews of future releases: live editor] +``` +gitGraph + commit + commit + branch develop + checkout develop + commit + commit + checkout main + merge develop + commit + commit +``` + +```mermaid +gitGraph + commit + commit + branch develop + checkout develop + commit + commit + checkout main + merge develop + commit + commit +``` + ### Bar chart (using gantt chart) [docs - live editor] ``` diff --git a/README.zh-CN.md b/README.zh-CN.md index a3046ab54..e5b20caed 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -15,7 +15,7 @@ Mermaid ๅฎžๆ—ถ็ผ–่พ‘ๅ™จ!

- ๐Ÿ“– ๆ–‡ๆกฃ | ๐Ÿš€ ๅ…ฅ้—จ | ๐ŸŒ CDN | ๐Ÿ™Œ ๅŠ ๅ…ฅๆˆ‘ไปฌ + ๐Ÿ“– ๆ–‡ๆกฃ | ๐Ÿš€ ๅ…ฅ้—จ | ๐ŸŒ CDN | ๐Ÿ™Œ ๅŠ ๅ…ฅๆˆ‘ไปฌ

English @@ -34,7 +34,7 @@ Mermaid [![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop) [![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid) [![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid) -[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/AgrbSrBer3) +[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/sKeNQX4Wtj) [![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_) diff --git a/cypress.config.ts b/cypress.config.ts index 253e4b7cc..d077ba915 100644 --- a/cypress.config.ts +++ b/cypress.config.ts @@ -23,12 +23,10 @@ export default eyesPlugin( }); // copy any needed variables from process.env to config.env config.env.useAppli = process.env.USE_APPLI ? true : false; - config.env.useArgos = !!process.env.CI && !!process.env.ARGOS_TOKEN; + config.env.useArgos = process.env.RUN_VISUAL_TEST === 'true'; if (config.env.useArgos) { - registerArgosTask(on, config, { - token: 'fc3a35cf5200db928d65b2047861582d9444032b', - }); + registerArgosTask(on, config); } else { addMatchImageSnapshotPlugin(on, config); } diff --git a/cypress/platform/ashish2.html b/cypress/platform/ashish2.html index f9132d2e2..351dcabc2 100644 --- a/cypress/platform/ashish2.html +++ b/cypress/platform/ashish2.html @@ -4,7 +4,7 @@ - + diff --git a/cypress/platform/xss10.html b/cypress/platform/xss10.html index 91b0b94ac..9814fed41 100644 --- a/cypress/platform/xss10.html +++ b/cypress/platform/xss10.html @@ -4,7 +4,7 @@ > ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/README.md](../../../packages/mermaid/src/docs/config/setup/README.md). +**mermaid** + +--- + # mermaid ## Modules -- [config](modules/config.md) -- [defaultConfig](modules/defaultConfig.md) -- [mermaid](modules/mermaid.md) +- [config](config/README.md) +- [defaultConfig](defaultConfig/README.md) +- [mermaid](mermaid/README.md) diff --git a/docs/config/setup/classes/mermaid.UnknownDiagramError.md b/docs/config/setup/classes/mermaid.UnknownDiagramError.md deleted file mode 100644 index a3359c9d0..000000000 --- a/docs/config/setup/classes/mermaid.UnknownDiagramError.md +++ /dev/null @@ -1,171 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md](../../../../packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md). - -# Class: UnknownDiagramError - -[mermaid](../modules/mermaid.md).UnknownDiagramError - -## Hierarchy - -- `Error` - - โ†ณ **`UnknownDiagramError`** - -## Constructors - -### constructor - -โ€ข **new UnknownDiagramError**(`message`): [`UnknownDiagramError`](mermaid.UnknownDiagramError.md) - -#### Parameters - -| Name | Type | -| :-------- | :------- | -| `message` | `string` | - -#### Returns - -[`UnknownDiagramError`](mermaid.UnknownDiagramError.md) - -#### Overrides - -Error.constructor - -#### Defined in - -[packages/mermaid/src/errors.ts:2](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L2) - -## Properties - -### cause - -โ€ข `Optional` **cause**: `unknown` - -#### Inherited from - -Error.cause - -#### Defined in - -node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es2022.error.d.ts:24 - ---- - -### message - -โ€ข **message**: `string` - -#### Inherited from - -Error.message - -#### Defined in - -node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1077 - ---- - -### name - -โ€ข **name**: `string` - -#### Inherited from - -Error.name - -#### Defined in - -node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1076 - ---- - -### stack - -โ€ข `Optional` **stack**: `string` - -#### Inherited from - -Error.stack - -#### Defined in - -node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1078 - ---- - -### prepareStackTrace - -โ–ช `Static` `Optional` **prepareStackTrace**: (`err`: `Error`, `stackTraces`: `CallSite`\[]) => `any` - -Optional override for formatting stack traces - -**`See`** - - - -#### Type declaration - -โ–ธ (`err`, `stackTraces`): `any` - -##### Parameters - -| Name | Type | -| :------------ | :------------ | -| `err` | `Error` | -| `stackTraces` | `CallSite`\[] | - -##### Returns - -`any` - -#### Inherited from - -Error.prepareStackTrace - -#### Defined in - -node_modules/.pnpm/@types+node\@20.16.11/node_modules/@types/node/globals.d.ts:98 - ---- - -### stackTraceLimit - -โ–ช `Static` **stackTraceLimit**: `number` - -#### Inherited from - -Error.stackTraceLimit - -#### Defined in - -node_modules/.pnpm/@types+node\@20.16.11/node_modules/@types/node/globals.d.ts:100 - -## Methods - -### captureStackTrace - -โ–ธ **captureStackTrace**(`targetObject`, `constructorOpt?`): `void` - -Create .stack property on a target object - -#### Parameters - -| Name | Type | -| :---------------- | :--------- | -| `targetObject` | `object` | -| `constructorOpt?` | `Function` | - -#### Returns - -`void` - -#### Inherited from - -Error.captureStackTrace - -#### Defined in - -node_modules/.pnpm/@types+node\@20.16.11/node_modules/@types/node/globals.d.ts:91 diff --git a/docs/config/setup/config/README.md b/docs/config/setup/config/README.md new file mode 100644 index 000000000..67fca78eb --- /dev/null +++ b/docs/config/setup/config/README.md @@ -0,0 +1,28 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/README.md](../../../../packages/mermaid/src/docs/config/setup/config/README.md). + +[**mermaid**](../README.md) + +--- + +# config + +## Variables + +- [defaultConfig](variables/defaultConfig.md) + +## Functions + +- [addDirective](functions/addDirective.md) +- [getConfig](functions/getConfig.md) +- [getSiteConfig](functions/getSiteConfig.md) +- [reset](functions/reset.md) +- [sanitize](functions/sanitize.md) +- [saveConfigFromInitialize](functions/saveConfigFromInitialize.md) +- [setConfig](functions/setConfig.md) +- [setSiteConfig](functions/setSiteConfig.md) +- [updateCurrentConfig](functions/updateCurrentConfig.md) +- [updateSiteConfig](functions/updateSiteConfig.md) diff --git a/docs/config/setup/config/functions/addDirective.md b/docs/config/setup/config/functions/addDirective.md new file mode 100644 index 000000000..1e51c0108 --- /dev/null +++ b/docs/config/setup/config/functions/addDirective.md @@ -0,0 +1,29 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/addDirective.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/addDirective.md). + +[**mermaid**](../../README.md) + +--- + +# Function: addDirective() + +> **addDirective**(`directive`): `void` + +Defined in: [packages/mermaid/src/config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188) + +Pushes in a directive to the configuration + +## Parameters + +### directive + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The directive to push in + +## Returns + +`void` diff --git a/docs/config/setup/config/functions/getConfig.md b/docs/config/setup/config/functions/getConfig.md new file mode 100644 index 000000000..0d5a7dc26 --- /dev/null +++ b/docs/config/setup/config/functions/getConfig.md @@ -0,0 +1,29 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/getConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/getConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: getConfig() + +> **getConfig**(): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131) + +## getConfig + +| Function | Description | Type | Return Values | +| --------- | ------------------------- | ----------- | ------------------------------ | +| getConfig | Obtains the currentConfig | Get Request | Any Values from current Config | + +**Notes**: Avoid calling this function repeatedly. Instead, store the result in a variable and use it, and pass it down to function calls. + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The currentConfig diff --git a/docs/config/setup/config/functions/getSiteConfig.md b/docs/config/setup/config/functions/getSiteConfig.md new file mode 100644 index 000000000..f6490eb59 --- /dev/null +++ b/docs/config/setup/config/functions/getSiteConfig.md @@ -0,0 +1,29 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/getSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/getSiteConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: getSiteConfig() + +> **getSiteConfig**(): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96) + +## getSiteConfig + +| Function | Description | Type | Values | +| ------------- | ------------------------------------------------- | ----------- | -------------------------------- | +| setSiteConfig | Returns the current siteConfig base configuration | Get Request | Returns Any Values in siteConfig | + +**Notes**: Returns **any** values in siteConfig. + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The siteConfig diff --git a/docs/config/setup/config/functions/reset.md b/docs/config/setup/config/functions/reset.md new file mode 100644 index 000000000..914537e44 --- /dev/null +++ b/docs/config/setup/config/functions/reset.md @@ -0,0 +1,42 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/reset.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/reset.md). + +[**mermaid**](../../README.md) + +--- + +# Function: reset() + +> **reset**(`config`): `void` + +Defined in: [packages/mermaid/src/config.ts:221](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L221) + +## reset + +| Function | Description | Type | Required | Values | +| -------- | ---------------------------- | ----------- | -------- | ------ | +| reset | Resets currentConfig to conf | Put Request | Required | None | + +## conf + +| Parameter | Description | Type | Required | Values | +| --------- | -------------------------------------------------------------- | ---------- | -------- | -------------------------------------------- | +| conf | base set of values, which currentConfig could be **reset** to. | Dictionary | Required | Any Values, with respect to the secure Array | + +**Notes**: (default: current siteConfig ) (optional, default `getSiteConfig()`) + +## Parameters + +### config + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) = `siteConfig` + +base set of values, which currentConfig could be **reset** to. +Defaults to the current siteConfig (e.g returned by [getSiteConfig](getSiteConfig.md)). + +## Returns + +`void` diff --git a/docs/config/setup/config/functions/sanitize.md b/docs/config/setup/config/functions/sanitize.md new file mode 100644 index 000000000..ce69da673 --- /dev/null +++ b/docs/config/setup/config/functions/sanitize.md @@ -0,0 +1,36 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/sanitize.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/sanitize.md). + +[**mermaid**](../../README.md) + +--- + +# Function: sanitize() + +> **sanitize**(`options`): `void` + +Defined in: [packages/mermaid/src/config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146) + +## sanitize + +| Function | Description | Type | Values | +| -------- | -------------------------------------- | ----------- | ------ | +| sanitize | Sets the siteConfig to desired values. | Put Request | None | + +Ensures options parameter does not attempt to override siteConfig secure keys **Notes**: modifies +options in-place + +## Parameters + +### options + +`any` + +The potential setConfig parameter + +## Returns + +`void` diff --git a/docs/config/setup/config/functions/saveConfigFromInitialize.md b/docs/config/setup/config/functions/saveConfigFromInitialize.md new file mode 100644 index 000000000..e911f493d --- /dev/null +++ b/docs/config/setup/config/functions/saveConfigFromInitialize.md @@ -0,0 +1,25 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/saveConfigFromInitialize.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/saveConfigFromInitialize.md). + +[**mermaid**](../../README.md) + +--- + +# Function: saveConfigFromInitialize() + +> **saveConfigFromInitialize**(`conf`): `void` + +Defined in: [packages/mermaid/src/config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75) + +## Parameters + +### conf + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +## Returns + +`void` diff --git a/docs/config/setup/config/functions/setConfig.md b/docs/config/setup/config/functions/setConfig.md new file mode 100644 index 000000000..3ef79580c --- /dev/null +++ b/docs/config/setup/config/functions/setConfig.md @@ -0,0 +1,39 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/setConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/setConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: setConfig() + +> **setConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113) + +## setConfig + +| Function | Description | Type | Values | +| ------------- | ------------------------------------- | ----------- | --------------------------------------- | +| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array | + +**Notes**: Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure +keys. Any values found in conf with key found in siteConfig.secure will be replaced with the +corresponding siteConfig value. + +## Parameters + +### conf + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The potential currentConfig + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The currentConfig merged with the sanitized conf diff --git a/docs/config/setup/config/functions/setSiteConfig.md b/docs/config/setup/config/functions/setSiteConfig.md new file mode 100644 index 000000000..d2be54b88 --- /dev/null +++ b/docs/config/setup/config/functions/setSiteConfig.md @@ -0,0 +1,40 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/setSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/setSiteConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: setSiteConfig() + +> **setSiteConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61) + +## setSiteConfig + +| Function | Description | Type | Values | +| ------------- | ------------------------------------- | ----------- | --------------------------------------- | +| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array | + +**Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls +to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig) +will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this +function _Default value: At default, will mirror Global Config_ + +## Parameters + +### conf + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The base currentConfig to use as siteConfig + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +The new siteConfig diff --git a/docs/config/setup/config/functions/updateCurrentConfig.md b/docs/config/setup/config/functions/updateCurrentConfig.md new file mode 100644 index 000000000..d90b4f497 --- /dev/null +++ b/docs/config/setup/config/functions/updateCurrentConfig.md @@ -0,0 +1,29 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/updateCurrentConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/updateCurrentConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: updateCurrentConfig() + +> **updateCurrentConfig**(`siteCfg`, `_directives`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15) + +## Parameters + +### siteCfg + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +### \_directives + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)\[] + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) diff --git a/docs/config/setup/config/functions/updateSiteConfig.md b/docs/config/setup/config/functions/updateSiteConfig.md new file mode 100644 index 000000000..ba98ede2b --- /dev/null +++ b/docs/config/setup/config/functions/updateSiteConfig.md @@ -0,0 +1,25 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/updateSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/updateSiteConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Function: updateSiteConfig() + +> **updateSiteConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79) + +## Parameters + +### conf + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +## Returns + +[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) diff --git a/docs/config/setup/config/variables/defaultConfig.md b/docs/config/setup/config/variables/defaultConfig.md new file mode 100644 index 000000000..3b08411fd --- /dev/null +++ b/docs/config/setup/config/variables/defaultConfig.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/variables/defaultConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/variables/defaultConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Variable: defaultConfig + +> `const` **defaultConfig**: [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) + +Defined in: [packages/mermaid/src/config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8) diff --git a/docs/config/setup/defaultConfig/README.md b/docs/config/setup/defaultConfig/README.md new file mode 100644 index 000000000..8554f8a8c --- /dev/null +++ b/docs/config/setup/defaultConfig/README.md @@ -0,0 +1,16 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/README.md](../../../../packages/mermaid/src/docs/config/setup/defaultConfig/README.md). + +[**mermaid**](../README.md) + +--- + +# defaultConfig + +## Variables + +- [configKeys](variables/configKeys.md) +- [default](variables/default.md) diff --git a/docs/config/setup/defaultConfig/variables/configKeys.md b/docs/config/setup/defaultConfig/variables/configKeys.md new file mode 100644 index 000000000..821b7aec6 --- /dev/null +++ b/docs/config/setup/defaultConfig/variables/configKeys.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/variables/configKeys.md](../../../../../packages/mermaid/src/docs/config/setup/defaultConfig/variables/configKeys.md). + +[**mermaid**](../../README.md) + +--- + +# Variable: configKeys + +> `const` **configKeys**: `Set`<`string`> + +Defined in: [packages/mermaid/src/defaultConfig.ts:270](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L270) diff --git a/docs/config/setup/defaultConfig/variables/default.md b/docs/config/setup/defaultConfig/variables/default.md new file mode 100644 index 000000000..ccb6d1302 --- /dev/null +++ b/docs/config/setup/defaultConfig/variables/default.md @@ -0,0 +1,21 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/variables/default.md](../../../../../packages/mermaid/src/docs/config/setup/defaultConfig/variables/default.md). + +[**mermaid**](../../README.md) + +--- + +# Variable: default + +> `const` **default**: `RequiredDeep`<[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)> + +Defined in: [packages/mermaid/src/defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18) + +Default mermaid configuration options. + +Please see the Mermaid config JSON Schema for the default JSON values. +Non-JSON JS default values are listed in this file, e.g. functions, or +`undefined` (explicitly set so that `configKeys` finds them). diff --git a/docs/config/setup/interfaces/mermaid.DetailedError.md b/docs/config/setup/interfaces/mermaid.DetailedError.md deleted file mode 100644 index 3b019e58a..000000000 --- a/docs/config/setup/interfaces/mermaid.DetailedError.md +++ /dev/null @@ -1,49 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md). - -# Interface: DetailedError - -[mermaid](../modules/mermaid.md).DetailedError - -## Properties - -### error - -โ€ข `Optional` **error**: `any` - -#### Defined in - -[packages/mermaid/src/utils.ts:785](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L785) - ---- - -### hash - -โ€ข **hash**: `any` - -#### Defined in - -[packages/mermaid/src/utils.ts:783](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L783) - ---- - -### message - -โ€ข `Optional` **message**: `string` - -#### Defined in - -[packages/mermaid/src/utils.ts:786](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L786) - ---- - -### str - -โ€ข **str**: `string` - -#### Defined in - -[packages/mermaid/src/utils.ts:781](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L781) diff --git a/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md b/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md deleted file mode 100644 index 04f97f2bc..000000000 --- a/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md +++ /dev/null @@ -1,39 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md). - -# Interface: ExternalDiagramDefinition - -[mermaid](../modules/mermaid.md).ExternalDiagramDefinition - -## Properties - -### detector - -โ€ข **detector**: `DiagramDetector` - -#### Defined in - -[packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101) - ---- - -### id - -โ€ข **id**: `string` - -#### Defined in - -[packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100) - ---- - -### loader - -โ€ข **loader**: `DiagramLoader` - -#### Defined in - -[packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102) diff --git a/docs/config/setup/interfaces/mermaid.LayoutData.md b/docs/config/setup/interfaces/mermaid.LayoutData.md deleted file mode 100644 index 46c9134e8..000000000 --- a/docs/config/setup/interfaces/mermaid.LayoutData.md +++ /dev/null @@ -1,43 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutData.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutData.md). - -# Interface: LayoutData - -[mermaid](../modules/mermaid.md).LayoutData - -## Indexable - -โ–ช \[key: `string`]: `any` - -## Properties - -### config - -โ€ข **config**: [`MermaidConfig`](mermaid.MermaidConfig.md) - -#### 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) - ---- - -### edges - -โ€ข **edges**: `Edge`\[] - -#### 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) - ---- - -### nodes - -โ€ข **nodes**: `Node`\[] - -#### 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) diff --git a/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md b/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md deleted file mode 100644 index 90a64187c..000000000 --- a/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md +++ /dev/null @@ -1,39 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md). - -# Interface: LayoutLoaderDefinition - -[mermaid](../modules/mermaid.md).LayoutLoaderDefinition - -## Properties - -### algorithm - -โ€ข `Optional` **algorithm**: `string` - -#### 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) - ---- - -### loader - -โ€ข **loader**: `LayoutLoader` - -#### 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) - ---- - -### name - -โ€ข **name**: `string` - -#### 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) diff --git a/docs/config/setup/interfaces/mermaid.Mermaid.md b/docs/config/setup/interfaces/mermaid.Mermaid.md deleted file mode 100644 index f4e9eb4ec..000000000 --- a/docs/config/setup/interfaces/mermaid.Mermaid.md +++ /dev/null @@ -1,388 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md). - -# Interface: Mermaid - -[mermaid](../modules/mermaid.md).Mermaid - -## Properties - -### contentLoaded - -โ€ข **contentLoaded**: () => `void` - -#### Type declaration - -โ–ธ (): `void` - -\##contentLoaded Callback function that is called when page is loaded. This functions fetches -configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the -page. - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436) - ---- - -### detectType - -โ€ข **detectType**: (`text`: `string`, `config?`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `string` - -#### Type declaration - -โ–ธ (`text`, `config?`): `string` - -Detects the type of the graph text. - -Takes into consideration the possible existence of an `%%init` directive - -##### Parameters - -| Name | Type | Description | -| :-------- | :------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| `text` | `string` | The text defining the graph. For example: `mermaid %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%% graph LR a-->b b-->c c-->d d-->e e-->f f-->g g-->h ` | -| `config?` | [`MermaidConfig`](mermaid.MermaidConfig.md) | The mermaid config. | - -##### Returns - -`string` - -A graph definition key - -#### Defined in - -[packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438) - ---- - -### init - -โ€ข **init**: (`config?`: [`MermaidConfig`](mermaid.MermaidConfig.md), `nodes?`: `string` | `HTMLElement` | `NodeListOf`<`HTMLElement`>, `callback?`: (`id`: `string`) => `unknown`) => `Promise`<`void`> - -**`Deprecated`** - -Use [initialize](mermaid.Mermaid.md#initialize) and [run](mermaid.Mermaid.md#run) instead. - -#### Type declaration - -โ–ธ (`config?`, `nodes?`, `callback?`): `Promise`<`void`> - -##### Parameters - -| Name | Type | -| :---------- | :------------------------------------------------------- | -| `config?` | [`MermaidConfig`](mermaid.MermaidConfig.md) | -| `nodes?` | `string` \| `HTMLElement` \| `NodeListOf`<`HTMLElement`> | -| `callback?` | (`id`: `string`) => `unknown` | - -##### Returns - -`Promise`<`void`> - -#### Defined in - -[packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431) - ---- - -### initialize - -โ€ข **initialize**: (`config`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void` - -#### Type declaration - -โ–ธ (`config`): `void` - -Used to set configurations for mermaid. -This function should be called before the run function. - -##### Parameters - -| Name | Type | Description | -| :------- | :------------------------------------------ | :-------------------------------- | -| `config` | [`MermaidConfig`](mermaid.MermaidConfig.md) | Configuration object for mermaid. | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435) - ---- - -### mermaidAPI - -โ€ข **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.defaultConfig; `getConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getConfig; `getDiagramFromText`: (`text`: `string`, `metadata`: `Pick`<`DiagramMetadata`, `"title"`>) => `Promise`<`Diagram`> ; `getSiteConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getSiteConfig; `globalReset`: () => `void` ; `initialize`: (`userOptions`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void` ; `parse`: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)> ; `render`: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)> ; `reset`: () => `void` ; `setConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.setConfig; `updateSiteConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.updateSiteConfig }> - -**`Deprecated`** - -Use [parse](mermaid.Mermaid.md#parse) and [render](mermaid.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. - -#### Defined in - -[packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425) - ---- - -### parse - -โ€ข **parse**: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)> - -#### Type declaration - -โ–ธ (`text`, `parseOptions`): `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`> - -Parse the text and validate the syntax. - -##### Parameters - -| Name | Type | Description | -| :------------- | :----------------------------------------------------------------------- | :------------------------------ | -| `text` | `string` | The mermaid diagram definition. | -| `parseOptions` | [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` } | Options for parsing. | - -##### Returns - -`Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`> - -An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`. - -**`See`** - -[ParseOptions](mermaid.ParseOptions.md) - -**`Throws`** - -Error if the diagram is invalid and parseOptions.suppressErrors is false or not set. - -โ–ธ (`text`, `parseOptions?`): `Promise`<[`ParseResult`](mermaid.ParseResult.md)> - -##### Parameters - -| Name | Type | -| :-------------- | :---------------------------------------- | -| `text` | `string` | -| `parseOptions?` | [`ParseOptions`](mermaid.ParseOptions.md) | - -##### Returns - -`Promise`<[`ParseResult`](mermaid.ParseResult.md)> - -#### Defined in - -[packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426) - ---- - -### parseError - -โ€ข `Optional` **parseError**: [`ParseErrorFunction`](../modules/mermaid.md#parseerrorfunction) - -#### Defined in - -[packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L420) - ---- - -### registerExternalDiagrams - -โ€ข **registerExternalDiagrams**: (`diagrams`: [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[], `opts`: { `lazyLoad?`: `boolean` = true }) => `Promise`<`void`> - -#### Type declaration - -โ–ธ (`diagrams`, `opts?`): `Promise`<`void`> - -Used to register external diagram types. - -##### Parameters - -| Name | Type | Default value | Description | -| :--------------- | :--------------------------------------------------------------------- | :------------ | :-------------------------------------------------------------------------- | -| `diagrams` | [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[] | `undefined` | Array of [ExternalDiagramDefinition](mermaid.ExternalDiagramDefinition.md). | -| `opts` | `Object` | `{}` | If opts.lazyLoad is false, the diagrams will be loaded immediately. | -| `opts.lazyLoad?` | `boolean` | `true` | - | - -##### Returns - -`Promise`<`void`> - -#### Defined in - -[packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434) - ---- - -### registerIconPacks - -โ€ข **registerIconPacks**: (`iconLoaders`: `IconLoader`\[]) => `void` - -#### Type declaration - -โ–ธ (`iconLoaders`): `void` - -##### Parameters - -| Name | Type | -| :------------ | :-------------- | -| `iconLoaders` | `IconLoader`\[] | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439) - ---- - -### registerLayoutLoaders - -โ€ข **registerLayoutLoaders**: (`loaders`: [`LayoutLoaderDefinition`](mermaid.LayoutLoaderDefinition.md)\[]) => `void` - -#### Type declaration - -โ–ธ (`loaders`): `void` - -##### Parameters - -| Name | Type | -| :-------- | :--------------------------------------------------------------- | -| `loaders` | [`LayoutLoaderDefinition`](mermaid.LayoutLoaderDefinition.md)\[] | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433) - ---- - -### render - -โ€ข **render**: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)> - -#### Type declaration - -โ–ธ (`id`, `text`, `svgContainingElement?`): `Promise`<[`RenderResult`](mermaid.RenderResult.md)> - -##### Parameters - -| Name | Type | -| :---------------------- | :-------- | -| `id` | `string` | -| `text` | `string` | -| `svgContainingElement?` | `Element` | - -##### Returns - -`Promise`<[`RenderResult`](mermaid.RenderResult.md)> - -#### Defined in - -[packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427) - ---- - -### run - -โ€ข **run**: (`options`: [`RunOptions`](mermaid.RunOptions.md)) => `Promise`<`void`> - -#### Type declaration - -โ–ธ (`options?`): `Promise`<`void`> - -## run - -Function that goes through the document to find the chart definitions in there and render them. - -The function tags the processed attributes with the attribute data-processed and ignores found -elements with the attribute already set. This way the init function can be triggered several -times. - -```mermaid-example -graph LR; - a(Find elements)-->b{Processed} - b-->|Yes|c(Leave element) - b-->|No |d(Transform) -``` - -```mermaid -graph LR; - a(Find elements)-->b{Processed} - b-->|Yes|c(Leave element) - b-->|No |d(Transform) -``` - -Renders the mermaid diagrams - -##### Parameters - -| Name | Type | Description | -| :-------- | :------------------------------------ | :----------------------- | -| `options` | [`RunOptions`](mermaid.RunOptions.md) | Optional runtime configs | - -##### Returns - -`Promise`<`void`> - -#### Defined in - -[packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432) - ---- - -### setParseErrorHandler - -โ€ข **setParseErrorHandler**: (`parseErrorHandler`: (`err`: `any`, `hash`: `any`) => `void`) => `void` - -#### Type declaration - -โ–ธ (`parseErrorHandler`): `void` - -## setParseErrorHandler Alternative to directly setting parseError using: - -```js -mermaid.parseError = function (err, hash) { - forExampleDisplayErrorInGui(err); // do something with the error -}; -``` - -This is provided for environments where the mermaid object can't directly have a new member added -to it (eg. dart interop wrapper). (Initially there is no parseError member of mermaid). - -##### Parameters - -| Name | Type | Description | -| :------------------ | :-------------------------------------- | :------------------------- | -| `parseErrorHandler` | (`err`: `any`, `hash`: `any`) => `void` | New parseError() callback. | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437) - ---- - -### startOnLoad - -โ€ข **startOnLoad**: `boolean` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:419](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L419) diff --git a/docs/config/setup/interfaces/mermaid.MermaidConfig.md b/docs/config/setup/interfaces/mermaid.MermaidConfig.md deleted file mode 100644 index 14c348145..000000000 --- a/docs/config/setup/interfaces/mermaid.MermaidConfig.md +++ /dev/null @@ -1,541 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md). - -# Interface: MermaidConfig - -[mermaid](../modules/mermaid.md).MermaidConfig - -## Properties - -### altFontFamily - -โ€ข `Optional` **altFontFamily**: `string` - -#### Defined in - -[packages/mermaid/src/config.type.ts:122](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L122) - ---- - -### architecture - -โ€ข `Optional` **architecture**: `ArchitectureDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:194](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L194) - ---- - -### arrowMarkerAbsolute - -โ€ข `Optional` **arrowMarkerAbsolute**: `boolean` - -Controls whether or arrow markers in html code are absolute paths or anchors. -This matters if you are using base tag settings. - -#### Defined in - -[packages/mermaid/src/config.type.ts:141](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L141) - ---- - -### block - -โ€ข `Optional` **block**: `BlockDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:201](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L201) - ---- - -### c4 - -โ€ข `Optional` **c4**: `C4DiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:198](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L198) - ---- - -### class - -โ€ข `Optional` **class**: `ClassDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:187](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L187) - ---- - -### darkMode - -โ€ข `Optional` **darkMode**: `boolean` - -#### Defined in - -[packages/mermaid/src/config.type.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L113) - ---- - -### deterministicIDSeed - -โ€ข `Optional` **deterministicIDSeed**: `string` - -This option is the optional seed for deterministic ids. -If set to `undefined` but deterministicIds is `true`, a simple number iterator is used. -You can set this attribute to base the seed on a static string. - -#### Defined in - -[packages/mermaid/src/config.type.ts:181](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L181) - ---- - -### deterministicIds - -โ€ข `Optional` **deterministicIds**: `boolean` - -This option controls if the generated ids of nodes in the SVG are -generated randomly or based on a seed. -If set to `false`, the IDs are generated based on the current date and -thus are not deterministic. This is the default behavior. - -This matters if your files are checked into source control e.g. git and -should not change unless content is changed. - -#### Defined in - -[packages/mermaid/src/config.type.ts:174](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L174) - ---- - -### dompurifyConfig - -โ€ข `Optional` **dompurifyConfig**: `Config` - -#### Defined in - -[packages/mermaid/src/config.type.ts:202](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L202) - ---- - -### elk - -โ€ข `Optional` **elk**: `Object` - -#### Type declaration - -| Name | Type | Description | -| :----------------------- | :-------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `cycleBreakingStrategy?` | `"GREEDY"` \| `"DEPTH_FIRST"` \| `"INTERACTIVE"` \| `"MODEL_ORDER"` \| `"GREEDY_MODEL_ORDER"` | This strategy decides how to find cycles in the graph and deciding which edges need adjustment to break loops. | -| `mergeEdges?` | `boolean` | Elk specific option that allows edges to share path where it convenient. It can make for pretty diagrams but can also make it harder to read the diagram. | -| `nodePlacementStrategy?` | `"SIMPLE"` \| `"NETWORK_SIMPLEX"` \| `"LINEAR_SEGMENTS"` \| `"BRANDES_KOEPF"` | Elk specific option affecting how nodes are placed. | - -#### Defined in - -[packages/mermaid/src/config.type.ts:91](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L91) - ---- - -### er - -โ€ข `Optional` **er**: `ErDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:189](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L189) - ---- - -### flowchart - -โ€ข `Optional` **flowchart**: `FlowchartDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:182](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L182) - ---- - -### fontFamily - -โ€ข `Optional` **fontFamily**: `string` - -Specifies the font to be used in the rendered diagrams. -Can be any possible CSS `font-family`. -See - -#### Defined in - -[packages/mermaid/src/config.type.ts:121](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L121) - ---- - -### fontSize - -โ€ข `Optional` **fontSize**: `number` - -#### Defined in - -[packages/mermaid/src/config.type.ts:204](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L204) - ---- - -### forceLegacyMathML - -โ€ข `Optional` **forceLegacyMathML**: `boolean` - -This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS -fonts and browser's MathML implementation, this option is recommended if consistent rendering is important. -If set to true, ignores legacyMathML. - -#### Defined in - -[packages/mermaid/src/config.type.ts:163](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L163) - ---- - -### gantt - -โ€ข `Optional` **gantt**: `GanttDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:184](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L184) - ---- - -### gitGraph - -โ€ข `Optional` **gitGraph**: `GitGraphDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:197](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L197) - ---- - -### handDrawnSeed - -โ€ข `Optional` **handDrawnSeed**: `number` - -Defines the seed to be used when using handDrawn look. This is important for the automated tests as they will always find differences without the seed. The default value is 0 which gives a random seed. - -#### Defined in - -[packages/mermaid/src/config.type.ts:76](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L76) - ---- - -### htmlLabels - -โ€ข `Optional` **htmlLabels**: `boolean` - -#### Defined in - -[packages/mermaid/src/config.type.ts:114](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L114) - ---- - -### journey - -โ€ข `Optional` **journey**: `JourneyDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:185](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L185) - ---- - -### kanban - -โ€ข `Optional` **kanban**: `KanbanDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:196](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L196) - ---- - -### layout - -โ€ข `Optional` **layout**: `string` - -Defines which layout algorithm to use for rendering the diagram. - -#### Defined in - -[packages/mermaid/src/config.type.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L81) - ---- - -### legacyMathML - -โ€ข `Optional` **legacyMathML**: `boolean` - -This option specifies if Mermaid can expect the dependent to include KaTeX stylesheets for browsers -without their own MathML implementation. If this option is disabled and MathML is not supported, the math -equations are replaced with a warning. If this option is enabled and MathML is not supported, Mermaid will -fall back to legacy rendering for KaTeX. - -#### Defined in - -[packages/mermaid/src/config.type.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L156) - ---- - -### logLevel - -โ€ข `Optional` **logLevel**: `0` | `2` | `1` | `"trace"` | `"debug"` | `"info"` | `"warn"` | `"error"` | `"fatal"` | `3` | `4` | `5` - -This option decides the amount of logging to be used by mermaid. - -#### Defined in - -[packages/mermaid/src/config.type.ts:127](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L127) - ---- - -### look - -โ€ข `Optional` **look**: `"classic"` | `"handDrawn"` - -Defines which main look to use for the diagram. - -#### Defined in - -[packages/mermaid/src/config.type.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L71) - ---- - -### markdownAutoWrap - -โ€ข `Optional` **markdownAutoWrap**: `boolean` - -#### Defined in - -[packages/mermaid/src/config.type.ts:205](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L205) - ---- - -### maxEdges - -โ€ข `Optional` **maxEdges**: `number` - -Defines the maximum number of edges that can be drawn in a graph. - -#### Defined in - -[packages/mermaid/src/config.type.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L90) - ---- - -### maxTextSize - -โ€ข `Optional` **maxTextSize**: `number` - -The maximum allowed size of the users text diagram - -#### Defined in - -[packages/mermaid/src/config.type.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L85) - ---- - -### mindmap - -โ€ข `Optional` **mindmap**: `MindmapDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:195](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L195) - ---- - -### packet - -โ€ข `Optional` **packet**: `PacketDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L200) - ---- - -### pie - -โ€ข `Optional` **pie**: `PieDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:190](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L190) - ---- - -### quadrantChart - -โ€ข `Optional` **quadrantChart**: `QuadrantChartConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:191](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L191) - ---- - -### requirement - -โ€ข `Optional` **requirement**: `RequirementDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:193](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L193) - ---- - -### sankey - -โ€ข `Optional` **sankey**: `SankeyDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L199) - ---- - -### secure - -โ€ข `Optional` **secure**: `string`\[] - -This option controls which `currentConfig` keys are considered secure and -can only be changed via call to `mermaid.initialize`. -This prevents malicious graph directives from overriding a site's default security. - -#### Defined in - -[packages/mermaid/src/config.type.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L148) - ---- - -### securityLevel - -โ€ข `Optional` **securityLevel**: `"strict"` | `"loose"` | `"antiscript"` | `"sandbox"` - -Level of trust for parsed diagram - -#### Defined in - -[packages/mermaid/src/config.type.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L131) - ---- - -### sequence - -โ€ข `Optional` **sequence**: `SequenceDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:183](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L183) - ---- - -### startOnLoad - -โ€ข `Optional` **startOnLoad**: `boolean` - -Dictates whether mermaid starts on Page load - -#### Defined in - -[packages/mermaid/src/config.type.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L135) - ---- - -### state - -โ€ข `Optional` **state**: `StateDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L188) - ---- - -### suppressErrorRendering - -โ€ข `Optional` **suppressErrorRendering**: `boolean` - -Suppresses inserting 'Syntax error' diagram in the DOM. -This is useful when you want to control how to handle syntax errors in your application. - -#### Defined in - -[packages/mermaid/src/config.type.ts:211](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L211) - ---- - -### theme - -โ€ข `Optional` **theme**: `"default"` | `"base"` | `"dark"` | `"forest"` | `"neutral"` | `"null"` - -Theme, the CSS style sheet. -You may also use `themeCSS` to override this value. - -#### Defined in - -[packages/mermaid/src/config.type.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L64) - ---- - -### themeCSS - -โ€ข `Optional` **themeCSS**: `string` - -#### Defined in - -[packages/mermaid/src/config.type.ts:66](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L66) - ---- - -### themeVariables - -โ€ข `Optional` **themeVariables**: `any` - -#### Defined in - -[packages/mermaid/src/config.type.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L65) - ---- - -### timeline - -โ€ข `Optional` **timeline**: `TimelineDiagramConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:186](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L186) - ---- - -### wrap - -โ€ข `Optional` **wrap**: `boolean` - -#### Defined in - -[packages/mermaid/src/config.type.ts:203](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L203) - ---- - -### xyChart - -โ€ข `Optional` **xyChart**: `XYChartConfig` - -#### Defined in - -[packages/mermaid/src/config.type.ts:192](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L192) diff --git a/docs/config/setup/interfaces/mermaid.ParseOptions.md b/docs/config/setup/interfaces/mermaid.ParseOptions.md deleted file mode 100644 index bac54b8ca..000000000 --- a/docs/config/setup/interfaces/mermaid.ParseOptions.md +++ /dev/null @@ -1,22 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md). - -# Interface: ParseOptions - -[mermaid](../modules/mermaid.md).ParseOptions - -## Properties - -### suppressErrors - -โ€ข `Optional` **suppressErrors**: `boolean` - -If `true`, parse will return `false` instead of throwing error when the diagram is invalid. -The `parseError` function will not be called. - -#### Defined in - -[packages/mermaid/src/types.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L64) diff --git a/docs/config/setup/interfaces/mermaid.ParseResult.md b/docs/config/setup/interfaces/mermaid.ParseResult.md deleted file mode 100644 index e2eb5df50..000000000 --- a/docs/config/setup/interfaces/mermaid.ParseResult.md +++ /dev/null @@ -1,33 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md). - -# Interface: ParseResult - -[mermaid](../modules/mermaid.md).ParseResult - -## Properties - -### config - -โ€ข **config**: [`MermaidConfig`](mermaid.MermaidConfig.md) - -The config passed as YAML frontmatter or directives - -#### Defined in - -[packages/mermaid/src/types.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L75) - ---- - -### diagramType - -โ€ข **diagramType**: `string` - -The diagram type, e.g. 'flowchart', 'sequence', etc. - -#### Defined in - -[packages/mermaid/src/types.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L71) diff --git a/docs/config/setup/interfaces/mermaid.RenderOptions.md b/docs/config/setup/interfaces/mermaid.RenderOptions.md deleted file mode 100644 index 9319cb3b1..000000000 --- a/docs/config/setup/interfaces/mermaid.RenderOptions.md +++ /dev/null @@ -1,19 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderOptions.md). - -# Interface: RenderOptions - -[mermaid](../modules/mermaid.md).RenderOptions - -## Properties - -### algorithm - -โ€ข `Optional` **algorithm**: `string` - -#### 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) diff --git a/docs/config/setup/interfaces/mermaid.RenderResult.md b/docs/config/setup/interfaces/mermaid.RenderResult.md deleted file mode 100644 index cce7f6928..000000000 --- a/docs/config/setup/interfaces/mermaid.RenderResult.md +++ /dev/null @@ -1,66 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md). - -# Interface: RenderResult - -[mermaid](../modules/mermaid.md).RenderResult - -## Properties - -### bindFunctions - -โ€ข `Optional` **bindFunctions**: (`element`: `Element`) => `void` - -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. - -```js -const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B'); -div.innerHTML = svg; -bindFunctions?.(div); // To call bindFunctions only if it's present. -``` - -#### Type declaration - -โ–ธ (`element`): `void` - -##### Parameters - -| Name | Type | -| :-------- | :-------- | -| `element` | `Element` | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L103) - ---- - -### diagramType - -โ€ข **diagramType**: `string` - -The diagram type, e.g. 'flowchart', 'sequence', etc. - -#### Defined in - -[packages/mermaid/src/types.ts:93](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L93) - ---- - -### svg - -โ€ข **svg**: `string` - -The svg code for the rendered graph. - -#### Defined in - -[packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89) diff --git a/docs/config/setup/interfaces/mermaid.RunOptions.md b/docs/config/setup/interfaces/mermaid.RunOptions.md deleted file mode 100644 index 0bcfc2356..000000000 --- a/docs/config/setup/interfaces/mermaid.RunOptions.md +++ /dev/null @@ -1,71 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md). - -# Interface: RunOptions - -[mermaid](../modules/mermaid.md).RunOptions - -## Properties - -### nodes - -โ€ข `Optional` **nodes**: `ArrayLike`<`HTMLElement`> - -The nodes to render. If this is set, `querySelector` will be ignored. - -#### Defined in - -[packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49) - ---- - -### postRenderCallback - -โ€ข `Optional` **postRenderCallback**: (`id`: `string`) => `unknown` - -A callback to call after each diagram is rendered. - -#### Type declaration - -โ–ธ (`id`): `unknown` - -##### Parameters - -| Name | Type | -| :--- | :------- | -| `id` | `string` | - -##### Returns - -`unknown` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53) - ---- - -### querySelector - -โ€ข `Optional` **querySelector**: `string` - -The query selector to use when finding elements to render. Default: `".mermaid"`. - -#### Defined in - -[packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45) - ---- - -### suppressErrors - -โ€ข `Optional` **suppressErrors**: `boolean` - -If `true`, errors will be logged to the console, but not thrown. Default: `false` - -#### Defined in - -[packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57) diff --git a/docs/config/setup/mermaid/README.md b/docs/config/setup/mermaid/README.md new file mode 100644 index 000000000..3e2cd7a28 --- /dev/null +++ b/docs/config/setup/mermaid/README.md @@ -0,0 +1,40 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/README.md](../../../../packages/mermaid/src/docs/config/setup/mermaid/README.md). + +[**mermaid**](../README.md) + +--- + +# mermaid + +## Classes + +- [UnknownDiagramError](classes/UnknownDiagramError.md) + +## Interfaces + +- [DetailedError](interfaces/DetailedError.md) +- [ExternalDiagramDefinition](interfaces/ExternalDiagramDefinition.md) +- [LayoutData](interfaces/LayoutData.md) +- [LayoutLoaderDefinition](interfaces/LayoutLoaderDefinition.md) +- [Mermaid](interfaces/Mermaid.md) +- [MermaidConfig](interfaces/MermaidConfig.md) +- [ParseOptions](interfaces/ParseOptions.md) +- [ParseResult](interfaces/ParseResult.md) +- [RenderOptions](interfaces/RenderOptions.md) +- [RenderResult](interfaces/RenderResult.md) +- [RunOptions](interfaces/RunOptions.md) + +## Type Aliases + +- [InternalHelpers](type-aliases/InternalHelpers.md) +- [ParseErrorFunction](type-aliases/ParseErrorFunction.md) +- [SVG](type-aliases/SVG.md) +- [SVGGroup](type-aliases/SVGGroup.md) + +## Variables + +- [default](variables/default.md) diff --git a/docs/config/setup/mermaid/classes/UnknownDiagramError.md b/docs/config/setup/mermaid/classes/UnknownDiagramError.md new file mode 100644 index 000000000..c077f0e34 --- /dev/null +++ b/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 + + + +#### 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` diff --git a/docs/config/setup/mermaid/interfaces/DetailedError.md b/docs/config/setup/mermaid/interfaces/DetailedError.md new file mode 100644 index 000000000..9dae6581a --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/DetailedError.md @@ -0,0 +1,45 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/DetailedError.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/DetailedError.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: DetailedError + +Defined in: [packages/mermaid/src/utils.ts:780](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L780) + +## Properties + +### error? + +> `optional` **error**: `any` + +Defined in: [packages/mermaid/src/utils.ts:785](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L785) + +--- + +### hash + +> **hash**: `any` + +Defined in: [packages/mermaid/src/utils.ts:783](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L783) + +--- + +### message? + +> `optional` **message**: `string` + +Defined in: [packages/mermaid/src/utils.ts:786](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L786) + +--- + +### str + +> **str**: `string` + +Defined in: [packages/mermaid/src/utils.ts:781](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L781) diff --git a/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md new file mode 100644 index 000000000..34e475388 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md @@ -0,0 +1,37 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: ExternalDiagramDefinition + +Defined in: [packages/mermaid/src/diagram-api/types.ts:99](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L99) + +## Properties + +### detector + +> **detector**: `DiagramDetector` + +Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101) + +--- + +### id + +> **id**: `string` + +Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100) + +--- + +### loader + +> **loader**: `DiagramLoader` + +Defined in: [packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102) diff --git a/docs/config/setup/mermaid/interfaces/LayoutData.md b/docs/config/setup/mermaid/interfaces/LayoutData.md new file mode 100644 index 000000000..b4c88454e --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/LayoutData.md @@ -0,0 +1,41 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutData.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutData.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: LayoutData + +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 + +\[`key`: `string`]: `any` + +## Properties + +### config + +> **config**: [`MermaidConfig`](MermaidConfig.md) + +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) + +--- + +### edges + +> **edges**: `Edge`\[] + +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) + +--- + +### nodes + +> **nodes**: `Node`\[] + +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) diff --git a/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md b/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md new file mode 100644 index 000000000..aac23f764 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md @@ -0,0 +1,37 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: LayoutLoaderDefinition + +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 + +### algorithm? + +> `optional` **algorithm**: `string` + +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) + +--- + +### loader + +> **loader**: `LayoutLoader` + +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) + +--- + +### name + +> **name**: `string` + +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) diff --git a/docs/config/setup/mermaid/interfaces/Mermaid.md b/docs/config/setup/mermaid/interfaces/Mermaid.md new file mode 100644 index 000000000..2e5cc3571 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/Mermaid.md @@ -0,0 +1,427 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/Mermaid.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/Mermaid.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: Mermaid + +Defined in: [packages/mermaid/src/mermaid.ts:418](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L418) + +## Properties + +### contentLoaded() + +> **contentLoaded**: () => `void` + +Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436) + +\##contentLoaded Callback function that is called when page is loaded. This functions fetches +configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the +page. + +#### Returns + +`void` + +--- + +### detectType() + +> **detectType**: (`text`, `config`?) => `string` + +Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438) + +Detects the type of the graph text. + +Takes into consideration the possible existence of an `%%init` directive + +#### Parameters + +##### text + +`string` + +The text defining the graph. For example: + +```mermaid-example + %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%% + graph LR + a-->b + b-->c + c-->d + d-->e + e-->f + f-->g + g-->h +``` + +```mermaid + %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%% + graph LR + a-->b + b-->c + c-->d + d-->e + e-->f + f-->g + g-->h +``` + +##### config? + +[`MermaidConfig`](MermaidConfig.md) + +The mermaid config. + +#### Returns + +`string` + +A graph definition key + +--- + +### ~~init()~~ + +> **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`> + +Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431) + +## init + +#### Parameters + +##### config? + +[`MermaidConfig`](MermaidConfig.md) + +**Deprecated**, please set configuration in [initialize](Mermaid.md#initialize). + +##### nodes? + +**Default**: `.mermaid`. One of the following: + +- A DOM Node +- An array of DOM nodes (as would come from a jQuery selector) +- A W3C selector, a la `.mermaid` + +`string` | `HTMLElement` | `NodeListOf`<`HTMLElement`> + +##### callback? + +(`id`) => `unknown` + +Called once for each rendered diagram's id. + +#### Returns + +`Promise`<`void`> + +#### Deprecated + +Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead. + +Renders the mermaid diagrams + +#### Deprecated + +Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead. + +--- + +### initialize() + +> **initialize**: (`config`) => `void` + +Defined in: [packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435) + +Used to set configurations for mermaid. +This function should be called before the run function. + +#### Parameters + +##### config + +[`MermaidConfig`](MermaidConfig.md) + +Configuration object for mermaid. + +#### Returns + +`void` + +--- + +### ~~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); }> + +Defined in: [packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425) + +**`Internal`** + +#### Deprecated + +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)> + +Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426) + +Parse the text and validate the syntax. + +#### Parameters + +##### text + +`string` + +The mermaid diagram definition. + +##### parseOptions + +[`ParseOptions`](ParseOptions.md) & `object` + +Options for parsing. + +#### 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 + +[ParseOptions](ParseOptions.md) + +#### Throws + +Error if the diagram is invalid and parseOptions.suppressErrors is false or not set. + +Parse the text and validate the syntax. + +#### Parameters + +##### text + +`string` + +The mermaid diagram definition. + +##### parseOptions? + +[`ParseOptions`](ParseOptions.md) + +Options for parsing. + +#### 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 + +[ParseOptions](ParseOptions.md) + +#### Throws + +Error if the diagram is invalid and parseOptions.suppressErrors is false or not set. + +--- + +### parseError? + +> `optional` **parseError**: [`ParseErrorFunction`](../type-aliases/ParseErrorFunction.md) + +Defined in: [packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L420) + +--- + +### registerExternalDiagrams() + +> **registerExternalDiagrams**: (`diagrams`, `opts`) => `Promise`<`void`> + +Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434) + +Used to register external diagram types. + +#### Parameters + +##### diagrams + +[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md)\[] + +Array of [ExternalDiagramDefinition](ExternalDiagramDefinition.md). + +##### opts + +If opts.lazyLoad is false, the diagrams will be loaded immediately. + +###### lazyLoad? + +`boolean` = `true` + +#### Returns + +`Promise`<`void`> + +--- + +### registerIconPacks() + +> **registerIconPacks**: (`iconLoaders`) => `void` + +Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439) + +#### Parameters + +##### iconLoaders + +`IconLoader`\[] + +#### Returns + +`void` + +--- + +### registerLayoutLoaders() + +> **registerLayoutLoaders**: (`loaders`) => `void` + +Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433) + +#### Parameters + +##### loaders + +[`LayoutLoaderDefinition`](LayoutLoaderDefinition.md)\[] + +#### Returns + +`void` + +--- + +### render() + +> **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)> + +Defined in: [packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427) + +#### Parameters + +##### id + +`string` + +##### text + +`string` + +##### svgContainingElement? + +`Element` + +#### Returns + +`Promise`<[`RenderResult`](RenderResult.md)> + +#### Deprecated + +- use the `mermaid.render` function instead of `mermaid.mermaidAPI.render` + +Deprecated for external use. + +--- + +### run() + +> **run**: (`options`) => `Promise`<`void`> + +Defined in: [packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432) + +## run + +Function that goes through the document to find the chart definitions in there and render them. + +The function tags the processed attributes with the attribute data-processed and ignores found +elements with the attribute already set. This way the init function can be triggered several +times. + +```mermaid-example +graph LR; + a(Find elements)-->b{Processed} + b-->|Yes|c(Leave element) + b-->|No |d(Transform) +``` + +```mermaid +graph LR; + a(Find elements)-->b{Processed} + b-->|Yes|c(Leave element) + b-->|No |d(Transform) +``` + +Renders the mermaid diagrams + +#### Parameters + +##### options + +[`RunOptions`](RunOptions.md) = `...` + +Optional runtime configs + +#### Returns + +`Promise`<`void`> + +--- + +### setParseErrorHandler() + +> **setParseErrorHandler**: (`parseErrorHandler`) => `void` + +Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437) + +## setParseErrorHandler Alternative to directly setting parseError using: + +```js +mermaid.parseError = function (err, hash) { + forExampleDisplayErrorInGui(err); // do something with the error +}; +``` + +This is provided for environments where the mermaid object can't directly have a new member added +to it (eg. dart interop wrapper). (Initially there is no parseError member of mermaid). + +#### Parameters + +##### parseErrorHandler + +(`err`, `hash`) => `void` + +New parseError() callback. + +#### Returns + +`void` + +--- + +### startOnLoad + +> **startOnLoad**: `boolean` + +Defined in: [packages/mermaid/src/mermaid.ts:419](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L419) diff --git a/docs/config/setup/mermaid/interfaces/MermaidConfig.md b/docs/config/setup/mermaid/interfaces/MermaidConfig.md new file mode 100644 index 000000000..7734e135b --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/MermaidConfig.md @@ -0,0 +1,461 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/MermaidConfig.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/MermaidConfig.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: MermaidConfig + +Defined in: [packages/mermaid/src/config.type.ts:58](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L58) + +## Properties + +### altFontFamily? + +> `optional` **altFontFamily**: `string` + +Defined in: [packages/mermaid/src/config.type.ts:122](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L122) + +--- + +### architecture? + +> `optional` **architecture**: `ArchitectureDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:194](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L194) + +--- + +### arrowMarkerAbsolute? + +> `optional` **arrowMarkerAbsolute**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:141](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L141) + +Controls whether or arrow markers in html code are absolute paths or anchors. +This matters if you are using base tag settings. + +--- + +### block? + +> `optional` **block**: `BlockDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:201](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L201) + +--- + +### c4? + +> `optional` **c4**: `C4DiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:198](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L198) + +--- + +### class? + +> `optional` **class**: `ClassDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:187](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L187) + +--- + +### darkMode? + +> `optional` **darkMode**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L113) + +--- + +### deterministicIds? + +> `optional` **deterministicIds**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:174](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L174) + +This option controls if the generated ids of nodes in the SVG are +generated randomly or based on a seed. +If set to `false`, the IDs are generated based on the current date and +thus are not deterministic. This is the default behavior. + +This matters if your files are checked into source control e.g. git and +should not change unless content is changed. + +--- + +### deterministicIDSeed? + +> `optional` **deterministicIDSeed**: `string` + +Defined in: [packages/mermaid/src/config.type.ts:181](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L181) + +This option is the optional seed for deterministic ids. +If set to `undefined` but deterministicIds is `true`, a simple number iterator is used. +You can set this attribute to base the seed on a static string. + +--- + +### dompurifyConfig? + +> `optional` **dompurifyConfig**: `Config` + +Defined in: [packages/mermaid/src/config.type.ts:202](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L202) + +--- + +### elk? + +> `optional` **elk**: `object` + +Defined in: [packages/mermaid/src/config.type.ts:91](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L91) + +#### cycleBreakingStrategy? + +> `optional` **cycleBreakingStrategy**: `"GREEDY"` | `"DEPTH_FIRST"` | `"INTERACTIVE"` | `"MODEL_ORDER"` | `"GREEDY_MODEL_ORDER"` + +This strategy decides how to find cycles in the graph and deciding which edges need adjustment to break loops. + +#### mergeEdges? + +> `optional` **mergeEdges**: `boolean` + +Elk specific option that allows edges to share path where it convenient. It can make for pretty diagrams but can also make it harder to read the diagram. + +#### nodePlacementStrategy? + +> `optional` **nodePlacementStrategy**: `"SIMPLE"` | `"NETWORK_SIMPLEX"` | `"LINEAR_SEGMENTS"` | `"BRANDES_KOEPF"` + +Elk specific option affecting how nodes are placed. + +--- + +### er? + +> `optional` **er**: `ErDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:189](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L189) + +--- + +### flowchart? + +> `optional` **flowchart**: `FlowchartDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:182](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L182) + +--- + +### fontFamily? + +> `optional` **fontFamily**: `string` + +Defined in: [packages/mermaid/src/config.type.ts:121](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L121) + +Specifies the font to be used in the rendered diagrams. +Can be any possible CSS `font-family`. +See + +--- + +### fontSize? + +> `optional` **fontSize**: `number` + +Defined in: [packages/mermaid/src/config.type.ts:204](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L204) + +--- + +### forceLegacyMathML? + +> `optional` **forceLegacyMathML**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:163](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L163) + +This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS +fonts and browser's MathML implementation, this option is recommended if consistent rendering is important. +If set to true, ignores legacyMathML. + +--- + +### gantt? + +> `optional` **gantt**: `GanttDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:184](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L184) + +--- + +### gitGraph? + +> `optional` **gitGraph**: `GitGraphDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:197](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L197) + +--- + +### handDrawnSeed? + +> `optional` **handDrawnSeed**: `number` + +Defined in: [packages/mermaid/src/config.type.ts:76](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L76) + +Defines the seed to be used when using handDrawn look. This is important for the automated tests as they will always find differences without the seed. The default value is 0 which gives a random seed. + +--- + +### htmlLabels? + +> `optional` **htmlLabels**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:114](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L114) + +--- + +### journey? + +> `optional` **journey**: `JourneyDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:185](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L185) + +--- + +### kanban? + +> `optional` **kanban**: `KanbanDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:196](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L196) + +--- + +### layout? + +> `optional` **layout**: `string` + +Defined in: [packages/mermaid/src/config.type.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L81) + +Defines which layout algorithm to use for rendering the diagram. + +--- + +### legacyMathML? + +> `optional` **legacyMathML**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L156) + +This option specifies if Mermaid can expect the dependent to include KaTeX stylesheets for browsers +without their own MathML implementation. If this option is disabled and MathML is not supported, the math +equations are replaced with a warning. If this option is enabled and MathML is not supported, Mermaid will +fall back to legacy rendering for KaTeX. + +--- + +### logLevel? + +> `optional` **logLevel**: `0` | `2` | `1` | `"trace"` | `"debug"` | `"info"` | `"warn"` | `"error"` | `"fatal"` | `3` | `4` | `5` + +Defined in: [packages/mermaid/src/config.type.ts:127](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L127) + +This option decides the amount of logging to be used by mermaid. + +--- + +### look? + +> `optional` **look**: `"classic"` | `"handDrawn"` + +Defined in: [packages/mermaid/src/config.type.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L71) + +Defines which main look to use for the diagram. + +--- + +### markdownAutoWrap? + +> `optional` **markdownAutoWrap**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:205](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L205) + +--- + +### maxEdges? + +> `optional` **maxEdges**: `number` + +Defined in: [packages/mermaid/src/config.type.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L90) + +Defines the maximum number of edges that can be drawn in a graph. + +--- + +### maxTextSize? + +> `optional` **maxTextSize**: `number` + +Defined in: [packages/mermaid/src/config.type.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L85) + +The maximum allowed size of the users text diagram + +--- + +### mindmap? + +> `optional` **mindmap**: `MindmapDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:195](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L195) + +--- + +### packet? + +> `optional` **packet**: `PacketDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L200) + +--- + +### pie? + +> `optional` **pie**: `PieDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:190](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L190) + +--- + +### quadrantChart? + +> `optional` **quadrantChart**: `QuadrantChartConfig` + +Defined in: [packages/mermaid/src/config.type.ts:191](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L191) + +--- + +### requirement? + +> `optional` **requirement**: `RequirementDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:193](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L193) + +--- + +### sankey? + +> `optional` **sankey**: `SankeyDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L199) + +--- + +### secure? + +> `optional` **secure**: `string`\[] + +Defined in: [packages/mermaid/src/config.type.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L148) + +This option controls which `currentConfig` keys are considered secure and +can only be changed via call to `mermaid.initialize`. +This prevents malicious graph directives from overriding a site's default security. + +--- + +### securityLevel? + +> `optional` **securityLevel**: `"strict"` | `"loose"` | `"antiscript"` | `"sandbox"` + +Defined in: [packages/mermaid/src/config.type.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L131) + +Level of trust for parsed diagram + +--- + +### sequence? + +> `optional` **sequence**: `SequenceDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:183](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L183) + +--- + +### startOnLoad? + +> `optional` **startOnLoad**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L135) + +Dictates whether mermaid starts on Page load + +--- + +### state? + +> `optional` **state**: `StateDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L188) + +--- + +### suppressErrorRendering? + +> `optional` **suppressErrorRendering**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:211](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L211) + +Suppresses inserting 'Syntax error' diagram in the DOM. +This is useful when you want to control how to handle syntax errors in your application. + +--- + +### theme? + +> `optional` **theme**: `"default"` | `"base"` | `"dark"` | `"forest"` | `"neutral"` | `"null"` + +Defined in: [packages/mermaid/src/config.type.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L64) + +Theme, the CSS style sheet. +You may also use `themeCSS` to override this value. + +--- + +### themeCSS? + +> `optional` **themeCSS**: `string` + +Defined in: [packages/mermaid/src/config.type.ts:66](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L66) + +--- + +### themeVariables? + +> `optional` **themeVariables**: `any` + +Defined in: [packages/mermaid/src/config.type.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L65) + +--- + +### timeline? + +> `optional` **timeline**: `TimelineDiagramConfig` + +Defined in: [packages/mermaid/src/config.type.ts:186](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L186) + +--- + +### wrap? + +> `optional` **wrap**: `boolean` + +Defined in: [packages/mermaid/src/config.type.ts:203](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L203) + +--- + +### xyChart? + +> `optional` **xyChart**: `XYChartConfig` + +Defined in: [packages/mermaid/src/config.type.ts:192](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L192) diff --git a/docs/config/setup/mermaid/interfaces/ParseOptions.md b/docs/config/setup/mermaid/interfaces/ParseOptions.md new file mode 100644 index 000000000..e3a968378 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/ParseOptions.md @@ -0,0 +1,24 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseOptions.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: ParseOptions + +Defined in: [packages/mermaid/src/types.ts:59](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L59) + +## Properties + +### suppressErrors? + +> `optional` **suppressErrors**: `boolean` + +Defined in: [packages/mermaid/src/types.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L64) + +If `true`, parse will return `false` instead of throwing error when the diagram is invalid. +The `parseError` function will not be called. diff --git a/docs/config/setup/mermaid/interfaces/ParseResult.md b/docs/config/setup/mermaid/interfaces/ParseResult.md new file mode 100644 index 000000000..95d662b42 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/ParseResult.md @@ -0,0 +1,33 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseResult.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseResult.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: ParseResult + +Defined in: [packages/mermaid/src/types.ts:67](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L67) + +## Properties + +### config + +> **config**: [`MermaidConfig`](MermaidConfig.md) + +Defined in: [packages/mermaid/src/types.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L75) + +The config passed as YAML frontmatter or directives + +--- + +### diagramType + +> **diagramType**: `string` + +Defined in: [packages/mermaid/src/types.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L71) + +The diagram type, e.g. 'flowchart', 'sequence', etc. diff --git a/docs/config/setup/mermaid/interfaces/RenderOptions.md b/docs/config/setup/mermaid/interfaces/RenderOptions.md new file mode 100644 index 000000000..e3a9483f2 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/RenderOptions.md @@ -0,0 +1,21 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderOptions.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: RenderOptions + +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 + +### algorithm? + +> `optional` **algorithm**: `string` + +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) diff --git a/docs/config/setup/mermaid/interfaces/RenderResult.md b/docs/config/setup/mermaid/interfaces/RenderResult.md new file mode 100644 index 000000000..c6dc3cf08 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/RenderResult.md @@ -0,0 +1,60 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderResult.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderResult.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: RenderResult + +Defined in: [packages/mermaid/src/types.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L85) + +## Properties + +### bindFunctions()? + +> `optional` **bindFunctions**: (`element`) => `void` + +Defined in: [packages/mermaid/src/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L103) + +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. + +```js +const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B'); +div.innerHTML = svg; +bindFunctions?.(div); // To call bindFunctions only if it's present. +``` + +#### Parameters + +##### element + +`Element` + +#### Returns + +`void` + +--- + +### diagramType + +> **diagramType**: `string` + +Defined in: [packages/mermaid/src/types.ts:93](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L93) + +The diagram type, e.g. 'flowchart', 'sequence', etc. + +--- + +### svg + +> **svg**: `string` + +Defined in: [packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89) + +The svg code for the rendered graph. diff --git a/docs/config/setup/mermaid/interfaces/RunOptions.md b/docs/config/setup/mermaid/interfaces/RunOptions.md new file mode 100644 index 000000000..ecd679aa5 --- /dev/null +++ b/docs/config/setup/mermaid/interfaces/RunOptions.md @@ -0,0 +1,63 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RunOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RunOptions.md). + +[**mermaid**](../../README.md) + +--- + +# Interface: RunOptions + +Defined in: [packages/mermaid/src/mermaid.ts:41](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L41) + +## Properties + +### nodes? + +> `optional` **nodes**: `ArrayLike`<`HTMLElement`> + +Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49) + +The nodes to render. If this is set, `querySelector` will be ignored. + +--- + +### postRenderCallback()? + +> `optional` **postRenderCallback**: (`id`) => `unknown` + +Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53) + +A callback to call after each diagram is rendered. + +#### Parameters + +##### id + +`string` + +#### Returns + +`unknown` + +--- + +### querySelector? + +> `optional` **querySelector**: `string` + +Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45) + +The query selector to use when finding elements to render. Default: `".mermaid"`. + +--- + +### suppressErrors? + +> `optional` **suppressErrors**: `boolean` + +Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57) + +If `true`, errors will be logged to the console, but not thrown. Default: `false` diff --git a/docs/config/setup/mermaid/type-aliases/InternalHelpers.md b/docs/config/setup/mermaid/type-aliases/InternalHelpers.md new file mode 100644 index 000000000..6baf786fe --- /dev/null +++ b/docs/config/setup/mermaid/type-aliases/InternalHelpers.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/InternalHelpers.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/InternalHelpers.md). + +[**mermaid**](../../README.md) + +--- + +# Type Alias: 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) diff --git a/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md b/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md new file mode 100644 index 000000000..78f27854c --- /dev/null +++ b/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md @@ -0,0 +1,29 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md). + +[**mermaid**](../../README.md) + +--- + +# Type Alias: ParseErrorFunction() + +> **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) + +## Parameters + +### err + +`string` | [`DetailedError`](../interfaces/DetailedError.md) | `unknown` + +### hash? + +`any` + +## Returns + +`void` diff --git a/docs/config/setup/mermaid/type-aliases/SVG.md b/docs/config/setup/mermaid/type-aliases/SVG.md new file mode 100644 index 000000000..2c72882ae --- /dev/null +++ b/docs/config/setup/mermaid/type-aliases/SVG.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVG.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVG.md). + +[**mermaid**](../../README.md) + +--- + +# Type Alias: SVG + +> **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`> + +Defined in: [packages/mermaid/src/diagram-api/types.ts:130](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L130) diff --git a/docs/config/setup/mermaid/type-aliases/SVGGroup.md b/docs/config/setup/mermaid/type-aliases/SVGGroup.md new file mode 100644 index 000000000..30ada9928 --- /dev/null +++ b/docs/config/setup/mermaid/type-aliases/SVGGroup.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVGGroup.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVGGroup.md). + +[**mermaid**](../../README.md) + +--- + +# Type Alias: SVGGroup + +> **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`> + +Defined in: [packages/mermaid/src/diagram-api/types.ts:132](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L132) diff --git a/docs/config/setup/mermaid/variables/default.md b/docs/config/setup/mermaid/variables/default.md new file mode 100644 index 000000000..24ec84128 --- /dev/null +++ b/docs/config/setup/mermaid/variables/default.md @@ -0,0 +1,15 @@ +> **Warning** +> +> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. +> +> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/variables/default.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/variables/default.md). + +[**mermaid**](../../README.md) + +--- + +# Variable: default + +> `const` **default**: [`Mermaid`](../interfaces/Mermaid.md) + +Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442) diff --git a/docs/config/setup/modules/config.md b/docs/config/setup/modules/config.md deleted file mode 100644 index 78a301bf0..000000000 --- a/docs/config/setup/modules/config.md +++ /dev/null @@ -1,276 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/config.md](../../../../packages/mermaid/src/docs/config/setup/modules/config.md). - -# Module: config - -## Variables - -### defaultConfig - -โ€ข `Const` **defaultConfig**: [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -#### Defined in - -[packages/mermaid/src/config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8) - -## Functions - -### addDirective - -โ–ธ **addDirective**(`directive`): `void` - -Pushes in a directive to the configuration - -#### Parameters - -| Name | Type | Description | -| :---------- | :-------------------------------------------------------- | :----------------------- | -| `directive` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The directive to push in | - -#### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188) - ---- - -### getConfig - -โ–ธ **getConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -## getConfig - -| Function | Description | Type | Return Values | -| --------- | ------------------------- | ----------- | ------------------------------ | -| getConfig | Obtains the currentConfig | Get Request | Any Values from current Config | - -**Notes**: Avoid calling this function repeatedly. Instead, store the result in a variable and use it, and pass it down to function calls. - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -The currentConfig - -#### Defined in - -[packages/mermaid/src/config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131) - ---- - -### getSiteConfig - -โ–ธ **getSiteConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -## getSiteConfig - -| Function | Description | Type | Values | -| ------------- | ------------------------------------------------- | ----------- | -------------------------------- | -| setSiteConfig | Returns the current siteConfig base configuration | Get Request | Returns Any Values in siteConfig | - -**Notes**: Returns **any** values in siteConfig. - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -The siteConfig - -#### Defined in - -[packages/mermaid/src/config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96) - ---- - -### reset - -โ–ธ **reset**(`config?`): `void` - -## reset - -| Function | Description | Type | Required | Values | -| -------- | ---------------------------- | ----------- | -------- | ------ | -| reset | Resets currentConfig to conf | Put Request | Required | None | - -## conf - -| Parameter | Description | Type | Required | Values | -| --------- | -------------------------------------------------------------- | ---------- | -------- | -------------------------------------------- | -| conf | base set of values, which currentConfig could be **reset** to. | Dictionary | Required | Any Values, with respect to the secure Array | - -**Notes**: (default: current siteConfig ) (optional, default `getSiteConfig()`) - -#### Parameters - -| Name | Type | Default value | Description | -| :------- | :-------------------------------------------------------- | :------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| `config` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | `siteConfig` | base set of values, which currentConfig could be **reset** to. Defaults to the current siteConfig (e.g returned by [getSiteConfig](config.md#getsiteconfig)). | - -#### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/config.ts:221](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L221) - ---- - -### sanitize - -โ–ธ **sanitize**(`options`): `void` - -## sanitize - -| Function | Description | Type | Values | -| -------- | -------------------------------------- | ----------- | ------ | -| sanitize | Sets the siteConfig to desired values. | Put Request | None | - -Ensures options parameter does not attempt to override siteConfig secure keys **Notes**: modifies -options in-place - -#### Parameters - -| Name | Type | Description | -| :-------- | :---- | :-------------------------------- | -| `options` | `any` | The potential setConfig parameter | - -#### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146) - ---- - -### saveConfigFromInitialize - -โ–ธ **saveConfigFromInitialize**(`conf`): `void` - -#### Parameters - -| Name | Type | -| :----- | :-------------------------------------------------------- | -| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | - -#### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75) - ---- - -### setConfig - -โ–ธ **setConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -## setConfig - -| Function | Description | Type | Values | -| ------------- | ------------------------------------- | ----------- | --------------------------------------- | -| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array | - -**Notes**: Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure -keys. Any values found in conf with key found in siteConfig.secure will be replaced with the -corresponding siteConfig value. - -#### Parameters - -| Name | Type | Description | -| :----- | :-------------------------------------------------------- | :-------------------------- | -| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The potential currentConfig | - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -The currentConfig merged with the sanitized conf - -#### Defined in - -[packages/mermaid/src/config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113) - ---- - -### setSiteConfig - -โ–ธ **setSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -## setSiteConfig - -| Function | Description | Type | Values | -| ------------- | ------------------------------------- | ----------- | --------------------------------------- | -| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array | - -**Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls -to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig) -will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this -function _Default value: At default, will mirror Global Config_ - -#### Parameters - -| Name | Type | Description | -| :----- | :-------------------------------------------------------- | :------------------------------------------ | -| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The base currentConfig to use as siteConfig | - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -The new siteConfig - -#### Defined in - -[packages/mermaid/src/config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61) - ---- - -### updateCurrentConfig - -โ–ธ **updateCurrentConfig**(`siteCfg`, `_directives`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -#### Parameters - -| Name | Type | -| :------------ | :----------------------------------------------------------- | -| `siteCfg` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | -| `_directives` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)\[] | - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -#### Defined in - -[packages/mermaid/src/config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15) - ---- - -### updateSiteConfig - -โ–ธ **updateSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -#### Parameters - -| Name | Type | -| :----- | :-------------------------------------------------------- | -| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | - -#### Returns - -[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) - -#### Defined in - -[packages/mermaid/src/config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79) diff --git a/docs/config/setup/modules/defaultConfig.md b/docs/config/setup/modules/defaultConfig.md deleted file mode 100644 index b4cf55dd1..000000000 --- a/docs/config/setup/modules/defaultConfig.md +++ /dev/null @@ -1,33 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/defaultConfig.md](../../../../packages/mermaid/src/docs/config/setup/modules/defaultConfig.md). - -# Module: defaultConfig - -## Variables - -### configKeys - -โ€ข `Const` **configKeys**: `Set`<`string`> - -#### Defined in - -[packages/mermaid/src/defaultConfig.ts:270](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L270) - ---- - -### default - -โ€ข `Const` **default**: `RequiredDeep`<[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)> - -Default mermaid configuration options. - -Please see the Mermaid config JSON Schema for the default JSON values. -Non-JSON JS default values are listed in this file, e.g. functions, or -`undefined` (explicitly set so that `configKeys` finds them). - -#### Defined in - -[packages/mermaid/src/defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18) diff --git a/docs/config/setup/modules/mermaid.md b/docs/config/setup/modules/mermaid.md deleted file mode 100644 index 60c219f2d..000000000 --- a/docs/config/setup/modules/mermaid.md +++ /dev/null @@ -1,90 +0,0 @@ -> **Warning** -> -> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. -> -> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/mermaid.md](../../../../packages/mermaid/src/docs/config/setup/modules/mermaid.md). - -# Module: mermaid - -## Classes - -- [UnknownDiagramError](../classes/mermaid.UnknownDiagramError.md) - -## Interfaces - -- [DetailedError](../interfaces/mermaid.DetailedError.md) -- [ExternalDiagramDefinition](../interfaces/mermaid.ExternalDiagramDefinition.md) -- [LayoutData](../interfaces/mermaid.LayoutData.md) -- [LayoutLoaderDefinition](../interfaces/mermaid.LayoutLoaderDefinition.md) -- [Mermaid](../interfaces/mermaid.Mermaid.md) -- [MermaidConfig](../interfaces/mermaid.MermaidConfig.md) -- [ParseOptions](../interfaces/mermaid.ParseOptions.md) -- [ParseResult](../interfaces/mermaid.ParseResult.md) -- [RenderOptions](../interfaces/mermaid.RenderOptions.md) -- [RenderResult](../interfaces/mermaid.RenderResult.md) -- [RunOptions](../interfaces/mermaid.RunOptions.md) - -## Type Aliases - -### 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) - ---- - -### ParseErrorFunction - -ฦฌ **ParseErrorFunction**: (`err`: `string` | [`DetailedError`](../interfaces/mermaid.DetailedError.md) | `unknown`, `hash?`: `any`) => `void` - -#### Type declaration - -โ–ธ (`err`, `hash?`): `void` - -##### Parameters - -| Name | Type | -| :------ | :--------------------------------------------------------------------------------- | -| `err` | `string` \| [`DetailedError`](../interfaces/mermaid.DetailedError.md) \| `unknown` | -| `hash?` | `any` | - -##### Returns - -`void` - -#### Defined in - -[packages/mermaid/src/Diagram.ts:10](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/Diagram.ts#L10) - ---- - -### SVG - -ฦฌ **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`> - -#### Defined in - -[packages/mermaid/src/diagram-api/types.ts:130](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L130) - ---- - -### SVGGroup - -ฦฌ **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`> - -#### Defined in - -[packages/mermaid/src/diagram-api/types.ts:132](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L132) - -## Variables - -### default - -โ€ข `Const` **default**: [`Mermaid`](../interfaces/mermaid.Mermaid.md) - -#### Defined in - -[packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442) diff --git a/docs/ecosystem/img/python-mermaid-integration-updated.png b/docs/ecosystem/img/python-mermaid-integration-updated.png new file mode 100644 index 000000000..37ad58420 Binary files /dev/null and b/docs/ecosystem/img/python-mermaid-integration-updated.png differ diff --git a/docs/ecosystem/integrations-create.md b/docs/ecosystem/integrations-create.md index f5e938d4d..921368406 100644 --- a/docs/ecosystem/integrations-create.md +++ b/docs/ecosystem/integrations-create.md @@ -24,7 +24,7 @@ Currently pending [IANA](https://www.iana.org/) recognition. ### Mermaid Discord workspace -We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/AgrbSrBer3) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel. +We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/sKeNQX4Wtj) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel. ### Add to Mermaid Ecosystem diff --git a/docs/ecosystem/mermaid-chart.md b/docs/ecosystem/mermaid-chart.md index 1348219c1..79fe3c788 100644 --- a/docs/ecosystem/mermaid-chart.md +++ b/docs/ecosystem/mermaid-chart.md @@ -48,7 +48,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun ## Plans -- **Free** - A free plan that includes five diagrams. +- **Free** - A free plan that includes three diagrams. - **Pro** - A paid plan that includes unlimited diagrams, access to the collaboration feature, and more. @@ -56,7 +56,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun To learn more, visit our [Pricing](https://mermaidchart.com/pricing) page. -Mermaid Chart is currently offering a 14-day free trial on our Pro and Enterprise tiers. Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up). +Mermaid Chart is currently offering a 7-day free trial on our Pro and Enterprise tiers. Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up). ## Mermaid JS contributions diff --git a/docs/ecosystem/tutorials.md b/docs/ecosystem/tutorials.md index 6d7966c31..8a6a9e8e2 100644 --- a/docs/ecosystem/tutorials.md +++ b/docs/ecosystem/tutorials.md @@ -52,28 +52,33 @@ Examples are provided in [Getting Started](../intro/getting-started.md) [K8s.dev blog: Improve your documentation with Mermaid.js diagrams](https://www.kubernetes.dev/blog/2021/12/01/improve-your-documentation-with-mermaid.js-diagrams/) -## Jupyter Integration with mermaid-js +## Jupyter / Python Integration with mermaid-js -Here's an example of Python integration with mermaid-js which uses the mermaid.ink service, that displays the graph in a Jupyter notebook. +Here's an example of Python integration with mermaid-js which uses the mermaid.ink service, that displays the graph in a Jupyter notebook and save it as _.png_ image with the stated resolution (in this example, `dpi=1200`). ```python import base64 +import io, requests from IPython.display import Image, display +from PIL import Image as im import matplotlib.pyplot as plt def mm(graph): graphbytes = graph.encode("utf8") base64_bytes = base64.urlsafe_b64encode(graphbytes) base64_string = base64_bytes.decode("ascii") - display(Image(url="https://mermaid.ink/img/" + base64_string)) + img = im.open(io.BytesIO(requests.get('https://mermaid.ink/img/' + base64_string).content)) + plt.imshow(img) + plt.axis('off') # allow to hide axis + plt.savefig('image.png', dpi=1200) mm(""" graph LR; - A--> B & C & D; - B--> A & E; - C--> A & E; - D--> A & E; - E--> B & C & D; + A--> B & C & D + B--> A & E + C--> A & E + D--> A & E + E--> B & C & D """) ``` @@ -81,4 +86,4 @@ graph LR; ![Example graph of the Python integration](img/python-mermaid-integration.png) - + diff --git a/docs/intro/index.md b/docs/intro/index.md index 35707ee8f..0b9ace410 100644 --- a/docs/intro/index.md +++ b/docs/intro/index.md @@ -22,7 +22,7 @@ It is a JavaScript based diagramming and charting tool that renders Markdown-ins [![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master) [![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid) [![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid) -[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/AgrbSrBer3) +[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/sKeNQX4Wtj) [![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_) diff --git a/docs/news/blog.md b/docs/news/blog.md index 70a31e5c0..c9808505b 100644 --- a/docs/news/blog.md +++ b/docs/news/blog.md @@ -6,18 +6,36 @@ # Blog -## [Mermaid 11.4 is out: New Features and Kanban Diagramming](https://www.mermaidchart.com/blog/posts/mermaid-11-4-is-out-new-features-and-kanban-diagramming) +## [GUI for editing Mermaid Class Diagrams](https://docs.mermaidchart.com/blog/posts/gui-for-editing-mermaid-class-diagrams) -Mermaid 11.4 brings enhanced functionality with the introduction of Kanban diagrams, allowing users to create visual workflows with status columns and task details. +1/17/2025 โ€ข 5 mins + +Discover how the latest update to the Mermaid Visual Editor transforms class diagramming. With new intuitive tools for creating and editing diagrams, dynamic relationship management, and customizable layouts, this feature-packed enhancement streamlines your diagramming experience like never before. + +## [7 ER Diagram Examples For Database Modeling from Mermaid AI](https://docs.mermaidchart.com/blog/posts/7-er-diagram-examples-for-database-modeling-from-mermaid-ai) + +1/16/2025 โ€ข 6 mins + +Entity relationship (ER) diagrams are a cornerstone of database design, providing a blueprint for modeling your database and enabling clear communication across functions in your organization. As data volumes continue to soar and as AI models demand clean, well-organized data, ER diagrams have become more vital than ever. You can now quickly build ER diagrams with Mermaid Chart, Mermaid AI to Kickstart and fine tune your diagrams . From e-commerce payment flows to social media interactions and healthcare systems, ER diagrams are powering modern, data-driven environments. + +## [Mermaid Whiteboard: Visual Collaboration Made Universal](https://docs.mermaidchart.com/blog/posts/mermaid-whiteboard-visual-collaboration-made-universal) + +12/6/2024 โ€ข 2 mins + +The Mermaid Whiteboard combines Mermaid syntax with a drag-and-drop interface, making it easier for teams to create, edit, and refine diagrams together. Whether you prefer working with code, visuals, Mermaid AI or all three, this tool adapts to your needs while keeping everything tied to Mermaidโ€™s syntax. Key Features 1. Dual-Mode Editing Switch seamlessly between \[โ€ฆ] + +## [Mermaid 11.4 is out: New Features and Kanban Diagramming](https://www.mermaidchart.com/blog/posts/mermaid-11-4-is-out-new-features-and-kanban-diagramming) October 31, 2024 ยท 2 mins +Mermaid 11.4 brings enhanced functionality with the introduction of Kanban diagrams, allowing users to create visual workflows with status columns and task details. + ## [How To Build an ER Diagram with Mermaid Chart](https://www.mermaidchart.com/blog/posts/how-to-build-an-er-diagram-with-mermaid-chart) -An entity relationship (ER) diagram acts like a blueprint for your database. This makes ER diagrams effective tools for anyone dealing with complex databases, data modeling, and AI model training. - October 24, 2024 ยท 4 mins +An entity relationship (ER) diagram acts like a blueprint for your database. This makes ER diagrams effective tools for anyone dealing with complex databases, data modeling, and AI model training. + ## [Expanding the Horizons of Mermaid Flowcharts: Introducing 30 New Shapes!](https://www.mermaidchart.com/blog/posts/new-mermaid-flowchart-shapes/) 24 September 2024 ยท 5 mins diff --git a/eslint.config.js b/eslint.config.js index 3278c7eb4..7a144ee00 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -137,7 +137,6 @@ export default tseslint.config( 'unicorn/no-instanceof-array': 'error', 'unicorn/no-typeof-undefined': 'error', 'unicorn/no-unnecessary-await': 'error', - 'unicorn/no-unsafe-regex': 'warn', 'unicorn/no-useless-promise-resolve-reject': 'error', 'unicorn/prefer-array-find': 'error', 'unicorn/prefer-array-flat-map': 'error', diff --git a/package.json b/package.json index c4c692d85..59621b1e8 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "version": "10.2.4", "description": "Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.", "type": "module", - "packageManager": "pnpm@9.9.0+sha512.60c18acd138bff695d339be6ad13f7e936eea6745660d4cc4a776d5247c540d0edee1a563695c183a66eb917ef88f2b4feb1fc25f32a7adcadc7aaf3438e99c1", + "packageManager": "pnpm@10.4.1+sha512.c753b6c3ad7afa13af388fa6d808035a008e30ea9993f58c6663e2bc5ff21679aa834db094987129aa4d488b86df57f7b634981b2f827cdcacc698cc0cfb88af", "keywords": [ "diagram", "markdown", @@ -63,72 +63,73 @@ ] }, "devDependencies": { - "@applitools/eyes-cypress": "^3.44.4", - "@argos-ci/cypress": "^2.2.2", - "@changesets/changelog-github": "^0.5.0", - "@changesets/cli": "^2.27.7", + "@applitools/eyes-cypress": "^3.44.9", + "@argos-ci/cypress": "^3.2.0", + "@changesets/changelog-github": "^0.5.1", + "@changesets/cli": "^2.27.12", "@cspell/eslint-plugin": "^8.8.4", - "@cypress/code-coverage": "^3.12.30", + "@cypress/code-coverage": "^3.12.49", "@eslint/js": "^9.4.0", - "@rollup/plugin-typescript": "^11.1.6", + "@rollup/plugin-typescript": "^12.1.2", "@types/cors": "^2.8.17", - "@types/express": "^4.17.21", + "@types/express": "^5.0.0", "@types/js-yaml": "^4.0.9", - "@types/jsdom": "^21.1.6", - "@types/lodash": "^4.17.0", - "@types/mdast": "^4.0.3", - "@types/node": "^20.11.30", - "@types/rollup-plugin-visualizer": "^4.2.4", - "@vitest/coverage-v8": "^1.4.0", - "@vitest/spy": "^1.4.0", - "@vitest/ui": "^1.4.0", - "ajv": "^8.12.0", - "chokidar": "^3.6.0", - "concurrently": "^8.2.2", + "@types/jsdom": "^21.1.7", + "@types/lodash": "^4.17.15", + "@types/mdast": "^4.0.4", + "@types/node": "^22.13.5", + "@types/rollup-plugin-visualizer": "^5.0.3", + "@vitest/coverage-v8": "^3.0.6", + "@vitest/spy": "^3.0.6", + "@vitest/ui": "^3.0.6", + "ajv": "^8.17.1", + "chokidar": "^4.0.3", + "concurrently": "^9.1.2", "cors": "^2.8.5", "cpy-cli": "^5.0.0", "cross-env": "^7.0.3", - "cspell": "^8.6.0", - "cypress": "^13.14.1", + "cspell": "^8.6.1", + "cypress": "^14.0.3", "cypress-image-snapshot": "^4.0.1", - "cypress-split": "^1.24.0", - "esbuild": "^0.21.5", - "eslint": "^9.4.0", - "eslint-config-prettier": "^9.1.0", - "eslint-plugin-cypress": "^3.3.0", - "eslint-plugin-html": "^8.1.1", + "cypress-split": "^1.24.14", + "esbuild": "^0.25.0", + "eslint": "^9.20.1", + "eslint-config-prettier": "^10.0.0", + "eslint-plugin-cypress": "^4.1.0", + "eslint-plugin-html": "^8.1.2", "eslint-plugin-jest": "^28.6.0", - "eslint-plugin-jsdoc": "^50.0.0", - "eslint-plugin-json": "^4.0.0", + "eslint-plugin-jsdoc": "^50.0.1", + "eslint-plugin-json": "^4.0.1", "eslint-plugin-lodash": "^8.0.0", - "eslint-plugin-markdown": "^5.0.0", - "eslint-plugin-no-only-tests": "^3.1.0", - "eslint-plugin-tsdoc": "^0.3.0", - "eslint-plugin-unicorn": "^56.0.0", - "express": "^4.19.1", - "globals": "^15.4.0", - "globby": "^14.0.1", - "husky": "^9.0.11", + "eslint-plugin-markdown": "^5.1.0", + "eslint-plugin-no-only-tests": "^3.3.0", + "eslint-plugin-tsdoc": "^0.4.0", + "eslint-plugin-unicorn": "^57.0.0", + "express": "^4.19.2", + "globals": "^16.0.0", + "globby": "^14.0.2", + "husky": "^9.1.7", "jest": "^29.7.0", "jison": "^0.4.18", "js-yaml": "^4.1.0", - "jsdom": "^24.0.0", - "langium-cli": "3.0.3", - "lint-staged": "^15.2.2", - "markdown-table": "^3.0.3", - "nyc": "^15.1.0", + "jsdom": "^26.0.0", + "langium-cli": "3.3.0", + "lint-staged": "^15.2.11", + "markdown-table": "^3.0.4", + "nyc": "^17.1.0", "path-browserify": "^1.0.1", - "prettier": "^3.2.5", - "prettier-plugin-jsdoc": "^1.3.0", - "rimraf": "^5.0.5", - "rollup-plugin-visualizer": "^5.12.0", - "start-server-and-test": "^2.0.3", - "tsx": "^4.7.1", - "typescript": "~5.4.5", - "typescript-eslint": "^8.0.0-alpha.34", - "vite": "^5.2.3", - "vite-plugin-istanbul": "^6.0.0", - "vitest": "^1.4.0" + "prettier": "^3.5.2", + "prettier-plugin-jsdoc": "^1.3.2", + "rimraf": "^6.0.1", + "rollup-plugin-visualizer": "^5.14.0", + "start-server-and-test": "^2.0.10", + "tslib": "^2.8.1", + "tsx": "^4.7.3", + "typescript": "~5.7.3", + "typescript-eslint": "^8.24.1", + "vite": "^6.1.1", + "vite-plugin-istanbul": "^7.0.0", + "vitest": "^3.0.6" }, "nyc": { "report-dir": "coverage/cypress" @@ -136,6 +137,10 @@ "pnpm": { "patchedDependencies": { "roughjs": "patches/roughjs.patch" - } + }, + "onlyBuiltDependencies": [ + "cypress", + "esbuild" + ] } } diff --git a/packages/mermaid-example-diagram/package.json b/packages/mermaid-example-diagram/package.json index 28cb54b9e..75eaa498e 100644 --- a/packages/mermaid-example-diagram/package.json +++ b/packages/mermaid-example-diagram/package.json @@ -37,14 +37,14 @@ ] }, "dependencies": { - "@braintree/sanitize-url": "^7.0.0", + "@braintree/sanitize-url": "^7.0.4", "d3": "^7.9.0", "khroma": "^2.1.0" }, "devDependencies": { - "concurrently": "^8.2.2", + "concurrently": "^9.1.2", "mermaid": "workspace:*", - "rimraf": "^5.0.5" + "rimraf": "^6.0.1" }, "files": [ "dist" diff --git a/packages/mermaid-layout-elk/package.json b/packages/mermaid-layout-elk/package.json index a043d4c38..2ce9bc278 100644 --- a/packages/mermaid-layout-elk/package.json +++ b/packages/mermaid-layout-elk/package.json @@ -37,7 +37,7 @@ "mermaid": "workspace:^" }, "peerDependencies": { - "mermaid": "^11.0.0" + "mermaid": "^11.0.2" }, "files": [ "dist" diff --git a/packages/mermaid-zenuml/package.json b/packages/mermaid-zenuml/package.json index 192f4e0c4..7a419c433 100644 --- a/packages/mermaid-zenuml/package.json +++ b/packages/mermaid-zenuml/package.json @@ -33,7 +33,7 @@ ], "license": "MIT", "dependencies": { - "@zenuml/core": "^3.23.27" + "@zenuml/core": "^3.23.28" }, "devDependencies": { "mermaid": "workspace:^" diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index 71abdfdb4..58b39b1cc 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -67,68 +67,67 @@ ] }, "dependencies": { - "@braintree/sanitize-url": "^7.0.1", - "@iconify/utils": "^2.1.32", + "@braintree/sanitize-url": "^7.0.4", + "@iconify/utils": "^2.1.33", "@mermaid-js/parser": "workspace:^", "@types/d3": "^7.4.3", - "cytoscape": "^3.29.2", + "cytoscape": "^3.29.3", "cytoscape-cose-bilkent": "^4.1.0", "cytoscape-fcose": "^2.2.0", "d3": "^7.9.0", "d3-sankey": "^0.12.3", "dagre-d3-es": "7.0.11", - "dayjs": "^1.11.10", + "dayjs": "^1.11.13", "dompurify": "^3.2.1", "katex": "^0.16.9", "khroma": "^2.1.0", "lodash-es": "^4.17.21", - "marked": "^13.0.2", + "marked": "^15.0.7", "roughjs": "^4.6.6", - "stylis": "^4.3.1", + "stylis": "^4.3.6", "ts-dedent": "^2.2.0", - "uuid": "^9.0.1" + "uuid": "^11.1.0" }, "devDependencies": { - "@adobe/jsonschema2md": "^8.0.0", + "@adobe/jsonschema2md": "^8.0.2", "@iconify/types": "^2.0.0", - "@types/cytoscape": "^3.21.4", + "@types/cytoscape": "^3.21.9", "@types/cytoscape-fcose": "^2.2.4", "@types/d3-sankey": "^0.12.4", - "@types/d3-scale": "^4.0.8", - "@types/d3-scale-chromatic": "^3.0.3", - "@types/d3-selection": "^3.0.10", - "@types/d3-shape": "^3.1.6", - "@types/jsdom": "^21.1.6", + "@types/d3-scale": "^4.0.9", + "@types/d3-scale-chromatic": "^3.1.0", + "@types/d3-selection": "^3.0.11", + "@types/d3-shape": "^3.1.7", + "@types/jsdom": "^21.1.7", "@types/katex": "^0.16.7", "@types/lodash-es": "^4.17.12", - "@types/micromatch": "^4.0.6", - "@types/prettier": "^3.0.0", - "@types/stylis": "^4.2.5", - "@types/uuid": "^9.0.8", - "ajv": "^8.12.0", - "chokidar": "^3.6.0", - "concurrently": "^8.2.2", - "csstree-validator": "^3.0.0", - "globby": "^14.0.1", + "@types/micromatch": "^4.0.9", + "@types/stylis": "^4.2.7", + "@types/uuid": "^10.0.0", + "ajv": "^8.17.1", + "chokidar": "^4.0.3", + "concurrently": "^9.1.2", + "csstree-validator": "^4.0.1", + "globby": "^14.0.2", "jison": "^0.4.18", "js-base64": "^3.7.7", - "jsdom": "^24.0.0", - "json-schema-to-typescript": "^13.1.2", - "micromatch": "^4.0.5", + "jsdom": "^26.0.0", + "json-schema-to-typescript": "^15.0.4", + "micromatch": "^4.0.8", "path-browserify": "^1.0.1", - "prettier": "^3.2.5", + "prettier": "^3.5.2", "remark": "^15.0.1", "remark-frontmatter": "^5.0.0", - "remark-gfm": "^4.0.0", - "rimraf": "^5.0.5", - "start-server-and-test": "^2.0.3", - "type-fest": "^4.13.1", - "typedoc": "^0.25.12", - "typedoc-plugin-markdown": "^3.17.1", - "typescript": "~5.4.3", + "remark-gfm": "^4.0.1", + "rimraf": "^6.0.1", + "start-server-and-test": "^2.0.10", + "type-fest": "^4.35.0", + "typedoc": "^0.27.8", + "typedoc-plugin-markdown": "^4.4.2", + "typescript": "~5.7.3", "unist-util-flatmap": "^1.0.0", "unist-util-visit": "^5.0.0", - "vitepress": "^1.0.1", + "vitepress": "^1.0.2", "vitepress-plugin-search": "1.0.4-alpha.22" }, "files": [ diff --git a/packages/mermaid/src/config.ts b/packages/mermaid/src/config.ts index 31f0592de..9468a3e46 100644 --- a/packages/mermaid/src/config.ts +++ b/packages/mermaid/src/config.ts @@ -230,7 +230,7 @@ const ConfigWarning = { } as const; type ConfigWarningStrings = keyof typeof ConfigWarning; -const issuedWarnings: { [key in ConfigWarningStrings]?: boolean } = {}; +const issuedWarnings: Partial> = {}; const issueWarning = (warning: ConfigWarningStrings) => { if (issuedWarnings[warning]) { return; diff --git a/packages/mermaid/src/diagrams/architecture/architectureTypes.ts b/packages/mermaid/src/diagrams/architecture/architectureTypes.ts index cad2c5c36..a7af33ca7 100644 --- a/packages/mermaid/src/diagrams/architecture/architectureTypes.ts +++ b/packages/mermaid/src/diagrams/architecture/architectureTypes.ts @@ -106,9 +106,7 @@ export const isValidArchitectureDirectionPair = function ( return x !== 'LL' && x !== 'RR' && x !== 'TT' && x !== 'BB'; }; -export type ArchitectureDirectionPairMap = { - [key in ArchitectureDirectionPair]?: string; -}; +export type ArchitectureDirectionPairMap = Partial>; /** * Creates a pair of the directions of each side of an edge. This function should be used instead of manually creating it to ensure that the source is always the first character. diff --git a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts index 9b3236f90..900460dca 100644 --- a/packages/mermaid/src/diagrams/git/gitGraph.spec.ts +++ b/packages/mermaid/src/diagrams/git/gitGraph.spec.ts @@ -84,7 +84,7 @@ describe('when parsing a gitGraph', function () { const commits = db.getCommits(); expect(commits.size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('a commit'); expect(db.getCurrentBranch()).toBe('main'); }); @@ -246,7 +246,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -263,7 +263,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -281,7 +281,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual(['test']); @@ -299,7 +299,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -317,7 +317,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -335,7 +335,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -353,7 +353,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test commit'); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -371,7 +371,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test commit'); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual([]); @@ -389,7 +389,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -407,7 +407,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -425,7 +425,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).not.toBeNull(); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -443,7 +443,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe(''); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -461,7 +461,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test msg'); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -480,7 +480,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test msg'); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -498,7 +498,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test msg'); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); @@ -516,7 +516,7 @@ describe('when parsing a gitGraph', function () { expect(db.getCurrentBranch()).toBe('main'); expect(db.getDirection()).toBe('LR'); expect(db.getBranches().size).toBe(1); - const key = commits.keys().next().value; + const key = commits.keys().next().value!; expect(commits.get(key)?.message).toBe('test msg'); expect(commits.get(key)?.id).toBe('1111'); expect(commits.get(key)?.tags).toStrictEqual(['test tag']); diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index f05908522..5616a0ab9 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,7 +1,7 @@ import type { InfoFields, InfoDB } from './infoTypes.js'; -import { version } from '../../../package.json'; +import packageJson from '../../../package.json' assert { type: 'json' }; -export const DEFAULT_INFO_DB: InfoFields = { version } as const; +export const DEFAULT_INFO_DB: InfoFields = { version: packageJson.version } as const; export const getVersion = (): string => DEFAULT_INFO_DB.version; diff --git a/packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison.spec.ts b/packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison.spec.ts index d4bcdbf8f..bf1d1f2ec 100644 --- a/packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison.spec.ts +++ b/packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison.spec.ts @@ -9,7 +9,7 @@ const parserFnConstructor = (str: string) => { }; }; -const mockDB: Record> = { +const mockDB: Record> = { setQuadrant1Text: vi.fn(), setQuadrant2Text: vi.fn(), setQuadrant3Text: vi.fn(), diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDb.ts b/packages/mermaid/src/diagrams/sequence/sequenceDb.ts index 69ddeaf18..c6b44dac0 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDb.ts +++ b/packages/mermaid/src/diagrams/sequence/sequenceDb.ts @@ -1,4 +1,5 @@ import { getConfig } from '../../diagram-api/diagramAPI.js'; +import type { DiagramDB } from '../../diagram-api/types.js'; import { log } from '../../logger.js'; import { ImperativeState } from '../../utils/imperativeState.js'; import { sanitizeText } from '../common/common.js'; @@ -28,273 +29,7 @@ interface SequenceState { lastDestroyed?: Actor; } -const state = new ImperativeState(() => ({ - prevActor: undefined, - actors: new Map(), - createdActors: new Map(), - destroyedActors: new Map(), - boxes: [], - messages: [], - notes: [], - sequenceNumbersEnabled: false, - wrapEnabled: undefined, - currentBox: undefined, - lastCreated: undefined, - lastDestroyed: undefined, -})); - -export const addBox = function (data: { text: string; color: string; wrap: boolean }) { - state.records.boxes.push({ - name: data.text, - wrap: data.wrap ?? autoWrap(), - fill: data.color, - actorKeys: [], - }); - state.records.currentBox = state.records.boxes.slice(-1)[0]; -}; - -export const addActor = function ( - id: string, - name: string, - description: { text: string; wrap?: boolean | null; type: string }, - type: string -) { - let assignedBox = state.records.currentBox; - const old = state.records.actors.get(id); - if (old) { - // If already set and trying to set to a new one throw error - if (state.records.currentBox && old.box && state.records.currentBox !== old.box) { - throw new Error( - `A same participant should only be defined in one Box: ${old.name} can't be in '${old.box.name}' and in '${state.records.currentBox.name}' at the same time.` - ); - } - - // Don't change the box if already - assignedBox = old.box ? old.box : state.records.currentBox; - old.box = assignedBox; - - // Don't allow description nulling - if (old && name === old.name && description == null) { - return; - } - } - - // Don't allow null descriptions, either - if (description?.text == null) { - description = { text: name, type }; - } - if (type == null || description.text == null) { - description = { text: name, type }; - } - - state.records.actors.set(id, { - box: assignedBox, - name: name, - description: description.text, - wrap: description.wrap ?? autoWrap(), - prevActor: state.records.prevActor, - links: {}, - properties: {}, - actorCnt: null, - rectData: null, - type: type ?? 'participant', - }); - if (state.records.prevActor) { - const prevActorInRecords = state.records.actors.get(state.records.prevActor); - if (prevActorInRecords) { - prevActorInRecords.nextActor = id; - } - } - - if (state.records.currentBox) { - state.records.currentBox.actorKeys.push(id); - } - state.records.prevActor = id; -}; - -const activationCount = (part: string) => { - let i; - let count = 0; - if (!part) { - return 0; - } - for (i = 0; i < state.records.messages.length; i++) { - if ( - state.records.messages[i].type === LINETYPE.ACTIVE_START && - state.records.messages[i].from === part - ) { - count++; - } - if ( - state.records.messages[i].type === LINETYPE.ACTIVE_END && - state.records.messages[i].from === part - ) { - count--; - } - } - return count; -}; - -export const addMessage = function ( - idFrom: Message['from'], - idTo: Message['to'], - message: { text: string; wrap?: boolean }, - answer: Message['answer'] -) { - state.records.messages.push({ - from: idFrom, - to: idTo, - message: message.text, - wrap: message.wrap ?? autoWrap(), - answer: answer, - }); -}; - -export const addSignal = function ( - idFrom?: Message['from'], - idTo?: Message['to'], - message?: { text: string; wrap: boolean }, - messageType?: number, - activate = false -) { - if (messageType === LINETYPE.ACTIVE_END) { - const cnt = activationCount(idFrom ?? ''); - if (cnt < 1) { - // Bail out as there is an activation signal from an inactive participant - const error = new Error('Trying to inactivate an inactive participant (' + idFrom + ')'); - - // @ts-ignore: we are passing hash param to the error object, however we should define our own custom error class to make it type safe - error.hash = { - text: '->>-', - token: '->>-', - line: '1', - loc: { first_line: 1, last_line: 1, first_column: 1, last_column: 1 }, - expected: ["'ACTIVE_PARTICIPANT'"], - }; - throw error; - } - } - state.records.messages.push({ - from: idFrom, - to: idTo, - message: message?.text ?? '', - wrap: message?.wrap ?? autoWrap(), - type: messageType, - activate, - }); - return true; -}; - -export const hasAtLeastOneBox = function () { - return state.records.boxes.length > 0; -}; - -export const hasAtLeastOneBoxWithTitle = function () { - return state.records.boxes.some((b) => b.name); -}; - -export const getMessages = function () { - return state.records.messages; -}; - -export const getBoxes = function () { - return state.records.boxes; -}; -export const getActors = function () { - return state.records.actors; -}; -export const getCreatedActors = function () { - return state.records.createdActors; -}; -export const getDestroyedActors = function () { - return state.records.destroyedActors; -}; -export const getActor = function (id: string) { - // TODO: do we ever use this function in a way that it might return undefined? - return state.records.actors.get(id)!; -}; -export const getActorKeys = function () { - return [...state.records.actors.keys()]; -}; -export const enableSequenceNumbers = function () { - state.records.sequenceNumbersEnabled = true; -}; -export const disableSequenceNumbers = function () { - state.records.sequenceNumbersEnabled = false; -}; -export const showSequenceNumbers = () => state.records.sequenceNumbersEnabled; - -export const setWrap = function (wrapSetting?: boolean) { - state.records.wrapEnabled = wrapSetting; -}; - -const extractWrap = (text?: string): { cleanedText?: string; wrap?: boolean } => { - if (text === undefined) { - return {}; - } - text = text.trim(); - const wrap = - /^:?wrap:/.exec(text) !== null ? true : /^:?nowrap:/.exec(text) !== null ? false : undefined; - const cleanedText = (wrap === undefined ? text : text.replace(/^:?(?:no)?wrap:/, '')).trim(); - return { cleanedText, wrap }; -}; - -export const autoWrap = () => { - // if setWrap has been called, use that value, otherwise use the value from the config - // TODO: refactor, always use the config value let setWrap update the config value - if (state.records.wrapEnabled !== undefined) { - return state.records.wrapEnabled; - } - return getConfig().sequence?.wrap ?? false; -}; - -export const clear = function () { - state.reset(); - commonClear(); -}; - -export const parseMessage = function (str: string) { - const trimmedStr = str.trim(); - const { wrap, cleanedText } = extractWrap(trimmedStr); - const message = { - text: cleanedText, - wrap, - }; - log.debug(`parseMessage: ${JSON.stringify(message)}`); - return message; -}; - -// We expect the box statement to be color first then description -// The color can be rgb,rgba,hsl,hsla, or css code names #hex codes are not supported for now because of the way the char # is handled -// We extract first segment as color, the rest of the line is considered as text -export const parseBoxData = function (str: string) { - const match = /^((?:rgba?|hsla?)\s*\(.*\)|\w*)(.*)$/.exec(str); - let color = match?.[1] ? match[1].trim() : 'transparent'; - let title = match?.[2] ? match[2].trim() : undefined; - - // check that the string is a color - if (window?.CSS) { - if (!window.CSS.supports('color', color)) { - color = 'transparent'; - title = str.trim(); - } - } else { - const style = new Option().style; - style.color = color; - if (style.color !== color) { - color = 'transparent'; - title = str.trim(); - } - } - const { wrap, cleanedText } = extractWrap(title); - return { - text: cleanedText ? sanitizeText(cleanedText, getConfig()) : undefined, - color, - wrap, - }; -}; - -export const LINETYPE = { +const LINETYPE = { SOLID: 0, DOTTED: 1, NOTE: 2, @@ -327,342 +62,597 @@ export const LINETYPE = { PAR_OVER_START: 32, BIDIRECTIONAL_SOLID: 33, BIDIRECTIONAL_DOTTED: 34, -}; +} as const; -export const ARROWTYPE = { +const ARROWTYPE = { FILLED: 0, OPEN: 1, -}; +} as const; -export const PLACEMENT = { +const PLACEMENT = { LEFTOF: 0, RIGHTOF: 1, OVER: 2, -}; +} as const; -export const addNote = function ( - actor: { actor: string }, - placement: Message['placement'], - message: { text: string; wrap?: boolean } -) { - const note: Note = { - actor: actor, - placement: placement, - message: message.text, - wrap: message.wrap ?? autoWrap(), - }; +export class SequenceDB implements DiagramDB { + private readonly state = new ImperativeState(() => ({ + prevActor: undefined, + actors: new Map(), + createdActors: new Map(), + destroyedActors: new Map(), + boxes: [], + messages: [], + notes: [], + sequenceNumbersEnabled: false, + wrapEnabled: undefined, + currentBox: undefined, + lastCreated: undefined, + lastDestroyed: undefined, + })); - //@ts-ignore: Coerce actor into a [to, from, ...] array - // eslint-disable-next-line unicorn/prefer-spread - const actors = [].concat(actor, actor); - state.records.notes.push(note); - state.records.messages.push({ - from: actors[0], - to: actors[1], - message: message.text, - wrap: message.wrap ?? autoWrap(), - type: LINETYPE.NOTE, - placement: placement, - }); -}; + constructor() { + // Needed for JISON since it only supports direct properties + this.apply = this.apply.bind(this); + this.parseBoxData = this.parseBoxData.bind(this); + this.parseMessage = this.parseMessage.bind(this); -export const addLinks = function (actorId: string, text: { text: string }) { - // find the actor - const actor = getActor(actorId); - // JSON.parse the text - try { - let sanitizedText = sanitizeText(text.text, getConfig()); - sanitizedText = sanitizedText.replace(/&/g, '&'); - sanitizedText = sanitizedText.replace(/=/g, '='); - const links = JSON.parse(sanitizedText); - // add the deserialized text to the actor's links field. - insertLinks(actor, links); - } catch (e) { - log.error('error while parsing actor link text', e); - } -}; + this.clear(); -export const addALink = function (actorId: string, text: { text: string }) { - // find the actor - const actor = getActor(actorId); - try { - const links: Record = {}; - let sanitizedText = sanitizeText(text.text, getConfig()); - const sep = sanitizedText.indexOf('@'); - sanitizedText = sanitizedText.replace(/&/g, '&'); - sanitizedText = sanitizedText.replace(/=/g, '='); - const label = sanitizedText.slice(0, sep - 1).trim(); - const link = sanitizedText.slice(sep + 1).trim(); - - links[label] = link; - // add the deserialized text to the actor's links field. - insertLinks(actor, links); - } catch (e) { - log.error('error while parsing actor link text', e); - } -}; - -/** - * @param actor - the actor to add the links to - * @param links - the links to add to the actor - */ -function insertLinks(actor: Actor, links: Record) { - if (actor.links == null) { - actor.links = links; - } else { - for (const key in links) { - actor.links[key] = links[key]; - } - } -} - -export const addProperties = function (actorId: string, text: { text: string }) { - // find the actor - const actor = getActor(actorId); - // JSON.parse the text - try { - const sanitizedText = sanitizeText(text.text, getConfig()); - const properties: Record = JSON.parse(sanitizedText); - // add the deserialized text to the actor's property field. - insertProperties(actor, properties); - } catch (e) { - log.error('error while parsing actor properties text', e); - } -}; - -/** - * @param actor - the actor to add the properties to - * @param properties - the properties to add to the actor's properties - */ -function insertProperties(actor: Actor, properties: Record) { - if (actor.properties == null) { - actor.properties = properties; - } else { - for (const key in properties) { - actor.properties[key] = properties[key]; - } - } -} - -function boxEnd() { - state.records.currentBox = undefined; -} - -export const addDetails = function (actorId: string, text: { text: string }) { - // find the actor - const actor = getActor(actorId); - const elem = document.getElementById(text.text)!; - - // JSON.parse the text - try { - const text = elem.innerHTML; - const details = JSON.parse(text); - // add the deserialized text to the actor's property field. - if (details.properties) { - insertProperties(actor, details.properties); - } - - if (details.links) { - insertLinks(actor, details.links); - } - } catch (e) { - log.error('error while parsing actor details text', e); - } -}; - -export const getActorProperty = function (actor: Actor, key: string) { - if (actor?.properties !== undefined) { - return actor.properties[key]; + this.setWrap(getConfig().wrap); + this.LINETYPE = LINETYPE; + this.ARROWTYPE = ARROWTYPE; + this.PLACEMENT = PLACEMENT; } - return undefined; -}; - -// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-redundant-type-constituents -export const apply = function (param: any | AddMessageParams | AddMessageParams[]) { - if (Array.isArray(param)) { - param.forEach(function (item) { - apply(item); + public addBox(data: { text: string; color: string; wrap: boolean }) { + this.state.records.boxes.push({ + name: data.text, + wrap: data.wrap ?? this.autoWrap(), + fill: data.color, + actorKeys: [], }); - } else { - switch (param.type) { - case 'sequenceIndex': - state.records.messages.push({ - from: undefined, - to: undefined, - message: { - start: param.sequenceIndex, - step: param.sequenceIndexStep, - visible: param.sequenceVisible, - }, - wrap: false, - type: param.signalType, - }); - break; - case 'addParticipant': - addActor(param.actor, param.actor, param.description, param.draw); - break; - case 'createParticipant': - if (state.records.actors.has(param.actor)) { - throw new Error( - "It is not possible to have actors with the same id, even if one is destroyed before the next is created. Use 'AS' aliases to simulate the behavior" - ); - } - state.records.lastCreated = param.actor; - addActor(param.actor, param.actor, param.description, param.draw); - state.records.createdActors.set(param.actor, state.records.messages.length); - break; - case 'destroyParticipant': - state.records.lastDestroyed = param.actor; - state.records.destroyedActors.set(param.actor, state.records.messages.length); - break; - case 'activeStart': - addSignal(param.actor, undefined, undefined, param.signalType); - break; - case 'activeEnd': - addSignal(param.actor, undefined, undefined, param.signalType); - break; - case 'addNote': - addNote(param.actor, param.placement, param.text); - break; - case 'addLinks': - addLinks(param.actor, param.text); - break; - case 'addALink': - addALink(param.actor, param.text); - break; - case 'addProperties': - addProperties(param.actor, param.text); - break; - case 'addDetails': - addDetails(param.actor, param.text); - break; - case 'addMessage': - if (state.records.lastCreated) { - if (param.to !== state.records.lastCreated) { - throw new Error( - 'The created participant ' + - state.records.lastCreated.name + - ' does not have an associated creating message after its declaration. Please check the sequence diagram.' - ); - } else { - state.records.lastCreated = undefined; - } - } else if (state.records.lastDestroyed) { - if ( - param.to !== state.records.lastDestroyed && - param.from !== state.records.lastDestroyed - ) { - throw new Error( - 'The destroyed participant ' + - state.records.lastDestroyed.name + - ' does not have an associated destroying message after its declaration. Please check the sequence diagram.' - ); - } else { - state.records.lastDestroyed = undefined; - } - } - addSignal(param.from, param.to, param.msg, param.signalType, param.activate); - break; - case 'boxStart': - addBox(param.boxData); - break; - case 'boxEnd': - boxEnd(); - break; - case 'loopStart': - addSignal(undefined, undefined, param.loopText, param.signalType); - break; - case 'loopEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'rectStart': - addSignal(undefined, undefined, param.color, param.signalType); - break; - case 'rectEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'optStart': - addSignal(undefined, undefined, param.optText, param.signalType); - break; - case 'optEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'altStart': - addSignal(undefined, undefined, param.altText, param.signalType); - break; - case 'else': - addSignal(undefined, undefined, param.altText, param.signalType); - break; - case 'altEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'setAccTitle': - setAccTitle(param.text); - break; - case 'parStart': - addSignal(undefined, undefined, param.parText, param.signalType); - break; - case 'and': - addSignal(undefined, undefined, param.parText, param.signalType); - break; - case 'parEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'criticalStart': - addSignal(undefined, undefined, param.criticalText, param.signalType); - break; - case 'option': - addSignal(undefined, undefined, param.optionText, param.signalType); - break; - case 'criticalEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; - case 'breakStart': - addSignal(undefined, undefined, param.breakText, param.signalType); - break; - case 'breakEnd': - addSignal(undefined, undefined, undefined, param.signalType); - break; + this.state.records.currentBox = this.state.records.boxes.slice(-1)[0]; + } + + public addActor( + id: string, + name: string, + description: { text: string; wrap?: boolean | null; type: string }, + type: string + ) { + let assignedBox = this.state.records.currentBox; + const old = this.state.records.actors.get(id); + if (old) { + // If already set and trying to set to a new one throw error + if (this.state.records.currentBox && old.box && this.state.records.currentBox !== old.box) { + throw new Error( + `A same participant should only be defined in one Box: ${old.name} can't be in '${old.box.name}' and in '${this.state.records.currentBox.name}' at the same time.` + ); + } + + // Don't change the box if already + assignedBox = old.box ? old.box : this.state.records.currentBox; + old.box = assignedBox; + + // Don't allow description nulling + if (old && name === old.name && description == null) { + return; + } + } + + // Don't allow null descriptions, either + if (description?.text == null) { + description = { text: name, type }; + } + if (type == null || description.text == null) { + description = { text: name, type }; + } + + this.state.records.actors.set(id, { + box: assignedBox, + name: name, + description: description.text, + wrap: description.wrap ?? this.autoWrap(), + prevActor: this.state.records.prevActor, + links: {}, + properties: {}, + actorCnt: null, + rectData: null, + type: type ?? 'participant', + }); + if (this.state.records.prevActor) { + const prevActorInRecords = this.state.records.actors.get(this.state.records.prevActor); + if (prevActorInRecords) { + prevActorInRecords.nextActor = id; + } + } + + if (this.state.records.currentBox) { + this.state.records.currentBox.actorKeys.push(id); + } + this.state.records.prevActor = id; + } + + private activationCount(part: string) { + let i; + let count = 0; + if (!part) { + return 0; + } + for (i = 0; i < this.state.records.messages.length; i++) { + if ( + this.state.records.messages[i].type === this.LINETYPE.ACTIVE_START && + this.state.records.messages[i].from === part + ) { + count++; + } + if ( + this.state.records.messages[i].type === this.LINETYPE.ACTIVE_END && + this.state.records.messages[i].from === part + ) { + count--; + } + } + return count; + } + + public addMessage( + idFrom: Message['from'], + idTo: Message['to'], + message: { text: string; wrap?: boolean }, + answer: Message['answer'] + ) { + this.state.records.messages.push({ + id: this.state.records.messages.length.toString(), + from: idFrom, + to: idTo, + message: message.text, + wrap: message.wrap ?? this.autoWrap(), + answer: answer, + }); + } + + public addSignal( + idFrom?: Message['from'], + idTo?: Message['to'], + message?: { text: string; wrap: boolean }, + messageType?: number, + activate = false + ) { + if (messageType === this.LINETYPE.ACTIVE_END) { + const cnt = this.activationCount(idFrom ?? ''); + if (cnt < 1) { + // Bail out as there is an activation signal from an inactive participant + const error = new Error('Trying to inactivate an inactive participant (' + idFrom + ')'); + + // @ts-ignore: we are passing hash param to the error object, however we should define our own custom error class to make it type safe + error.hash = { + text: '->>-', + token: '->>-', + line: '1', + loc: { first_line: 1, last_line: 1, first_column: 1, last_column: 1 }, + expected: ["'ACTIVE_PARTICIPANT'"], + }; + throw error; + } + } + this.state.records.messages.push({ + id: this.state.records.messages.length.toString(), + from: idFrom, + to: idTo, + message: message?.text ?? '', + wrap: message?.wrap ?? this.autoWrap(), + type: messageType, + activate, + }); + return true; + } + + public hasAtLeastOneBox() { + return this.state.records.boxes.length > 0; + } + + public hasAtLeastOneBoxWithTitle() { + return this.state.records.boxes.some((b) => b.name); + } + + public getMessages() { + return this.state.records.messages; + } + + public getBoxes() { + return this.state.records.boxes; + } + public getActors() { + return this.state.records.actors; + } + public getCreatedActors() { + return this.state.records.createdActors; + } + public getDestroyedActors() { + return this.state.records.destroyedActors; + } + public getActor(id: string) { + // TODO: do we ever use this function in a way that it might return undefined? + return this.state.records.actors.get(id)!; + } + public getActorKeys() { + return [...this.state.records.actors.keys()]; + } + public enableSequenceNumbers() { + this.state.records.sequenceNumbersEnabled = true; + } + public disableSequenceNumbers() { + this.state.records.sequenceNumbersEnabled = false; + } + public showSequenceNumbers() { + return this.state.records.sequenceNumbersEnabled; + } + + public setWrap(wrapSetting?: boolean) { + this.state.records.wrapEnabled = wrapSetting; + } + + private extractWrap(text?: string): { cleanedText?: string; wrap?: boolean } { + if (text === undefined) { + return {}; + } + text = text.trim(); + const wrap = + /^:?wrap:/.exec(text) !== null ? true : /^:?nowrap:/.exec(text) !== null ? false : undefined; + const cleanedText = (wrap === undefined ? text : text.replace(/^:?(?:no)?wrap:/, '')).trim(); + return { cleanedText, wrap }; + } + + public autoWrap() { + // if setWrap has been called, use that value, otherwise use the value from the config + // TODO: refactor, always use the config value let setWrap update the config value + if (this.state.records.wrapEnabled !== undefined) { + return this.state.records.wrapEnabled; + } + return getConfig().sequence?.wrap ?? false; + } + + public clear() { + this.state.reset(); + commonClear(); + } + + public parseMessage(str: string) { + const trimmedStr = str.trim(); + const { wrap, cleanedText } = this.extractWrap(trimmedStr); + const message = { + text: cleanedText, + wrap, + }; + log.debug(`parseMessage: ${JSON.stringify(message)}`); + return message; + } + + // We expect the box statement to be color first then description + // The color can be rgb,rgba,hsl,hsla, or css code names #hex codes are not supported for now because of the way the char # is handled + // We extract first segment as color, the rest of the line is considered as text + public parseBoxData(str: string) { + const match = /^((?:rgba?|hsla?)\s*\(.*\)|\w*)(.*)$/.exec(str); + let color = match?.[1] ? match[1].trim() : 'transparent'; + let title = match?.[2] ? match[2].trim() : undefined; + + // check that the string is a color + if (window?.CSS) { + if (!window.CSS.supports('color', color)) { + color = 'transparent'; + title = str.trim(); + } + } else { + const style = new Option().style; + style.color = color; + if (style.color !== color) { + color = 'transparent'; + title = str.trim(); + } + } + const { wrap, cleanedText } = this.extractWrap(title); + return { + text: cleanedText ? sanitizeText(cleanedText, getConfig()) : undefined, + color, + wrap, + }; + } + + public readonly LINETYPE: typeof LINETYPE; + public readonly ARROWTYPE: typeof ARROWTYPE; + public readonly PLACEMENT: typeof PLACEMENT; + + public addNote( + actor: { actor: string }, + placement: Message['placement'], + message: { text: string; wrap?: boolean } + ) { + const note: Note = { + actor: actor, + placement: placement, + message: message.text, + wrap: message.wrap ?? this.autoWrap(), + }; + + //@ts-ignore: Coerce actor into a [to, from, ...] array + // eslint-disable-next-line unicorn/prefer-spread + const actors = [].concat(actor, actor); + this.state.records.notes.push(note); + this.state.records.messages.push({ + id: this.state.records.messages.length.toString(), + from: actors[0], + to: actors[1], + message: message.text, + wrap: message.wrap ?? this.autoWrap(), + type: this.LINETYPE.NOTE, + placement: placement, + }); + } + + public addLinks(actorId: string, text: { text: string }) { + // find the actor + const actor = this.getActor(actorId); + // JSON.parse the text + try { + let sanitizedText = sanitizeText(text.text, getConfig()); + sanitizedText = sanitizedText.replace(/=/g, '='); + sanitizedText = sanitizedText.replace(/&/g, '&'); + const links = JSON.parse(sanitizedText); + // add the deserialized text to the actor's links field. + this.insertLinks(actor, links); + } catch (e) { + log.error('error while parsing actor link text', e); } } -}; -export default { - addActor, - addMessage, - addSignal, - addLinks, - addDetails, - addProperties, - autoWrap, - setWrap, - enableSequenceNumbers, - disableSequenceNumbers, - showSequenceNumbers, - getMessages, - getActors, - getCreatedActors, - getDestroyedActors, - getActor, - getActorKeys, - getActorProperty, - getAccTitle, - getBoxes, - getDiagramTitle, - setDiagramTitle, - getConfig: () => getConfig().sequence, - clear, - parseMessage, - parseBoxData, - LINETYPE, - ARROWTYPE, - PLACEMENT, - addNote, - setAccTitle, - apply, - setAccDescription, - getAccDescription, - hasAtLeastOneBox, - hasAtLeastOneBoxWithTitle, -}; + public addALink(actorId: string, text: { text: string }) { + // find the actor + const actor = this.getActor(actorId); + try { + const links: Record = {}; + let sanitizedText = sanitizeText(text.text, getConfig()); + const sep = sanitizedText.indexOf('@'); + sanitizedText = sanitizedText.replace(/=/g, '='); + sanitizedText = sanitizedText.replace(/&/g, '&'); + const label = sanitizedText.slice(0, sep - 1).trim(); + const link = sanitizedText.slice(sep + 1).trim(); + + links[label] = link; + // add the deserialized text to the actor's links field. + this.insertLinks(actor, links); + } catch (e) { + log.error('error while parsing actor link text', e); + } + } + + private insertLinks(actor: Actor, links: Record) { + if (actor.links == null) { + actor.links = links; + } else { + for (const key in links) { + actor.links[key] = links[key]; + } + } + } + + public addProperties(actorId: string, text: { text: string }) { + // find the actor + const actor = this.getActor(actorId); + // JSON.parse the text + try { + const sanitizedText = sanitizeText(text.text, getConfig()); + const properties: Record = JSON.parse(sanitizedText); + // add the deserialized text to the actor's property field. + this.insertProperties(actor, properties); + } catch (e) { + log.error('error while parsing actor properties text', e); + } + } + + private insertProperties(actor: Actor, properties: Record) { + if (actor.properties == null) { + actor.properties = properties; + } else { + for (const key in properties) { + actor.properties[key] = properties[key]; + } + } + } + + private boxEnd() { + this.state.records.currentBox = undefined; + } + + public addDetails(actorId: string, text: { text: string }) { + // find the actor + const actor = this.getActor(actorId); + const elem = document.getElementById(text.text)!; + + // JSON.parse the text + try { + const text = elem.innerHTML; + const details = JSON.parse(text); + // add the deserialized text to the actor's property field. + if (details.properties) { + this.insertProperties(actor, details.properties); + } + + if (details.links) { + this.insertLinks(actor, details.links); + } + } catch (e) { + log.error('error while parsing actor details text', e); + } + } + + public getActorProperty(actor: Actor, key: string) { + if (actor?.properties !== undefined) { + return actor.properties[key]; + } + + return undefined; + } + + // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-redundant-type-constituents + public apply(param: any | AddMessageParams | AddMessageParams[]) { + if (Array.isArray(param)) { + param.forEach((item) => { + this.apply(item); + }); + } else { + switch (param.type) { + case 'sequenceIndex': + this.state.records.messages.push({ + id: this.state.records.messages.length.toString(), + from: undefined, + to: undefined, + message: { + start: param.sequenceIndex, + step: param.sequenceIndexStep, + visible: param.sequenceVisible, + }, + wrap: false, + type: param.signalType, + }); + break; + case 'addParticipant': + this.addActor(param.actor, param.actor, param.description, param.draw); + break; + case 'createParticipant': + if (this.state.records.actors.has(param.actor)) { + throw new Error( + "It is not possible to have actors with the same id, even if one is destroyed before the next is created. Use 'AS' aliases to simulate the behavior" + ); + } + this.state.records.lastCreated = param.actor; + this.addActor(param.actor, param.actor, param.description, param.draw); + this.state.records.createdActors.set(param.actor, this.state.records.messages.length); + break; + case 'destroyParticipant': + this.state.records.lastDestroyed = param.actor; + this.state.records.destroyedActors.set(param.actor, this.state.records.messages.length); + break; + case 'activeStart': + this.addSignal(param.actor, undefined, undefined, param.signalType); + break; + case 'activeEnd': + this.addSignal(param.actor, undefined, undefined, param.signalType); + break; + case 'addNote': + this.addNote(param.actor, param.placement, param.text); + break; + case 'addLinks': + this.addLinks(param.actor, param.text); + break; + case 'addALink': + this.addALink(param.actor, param.text); + break; + case 'addProperties': + this.addProperties(param.actor, param.text); + break; + case 'addDetails': + this.addDetails(param.actor, param.text); + break; + case 'addMessage': + if (this.state.records.lastCreated) { + if (param.to !== this.state.records.lastCreated) { + throw new Error( + 'The created participant ' + + this.state.records.lastCreated.name + + ' does not have an associated creating message after its declaration. Please check the sequence diagram.' + ); + } else { + this.state.records.lastCreated = undefined; + } + } else if (this.state.records.lastDestroyed) { + if ( + param.to !== this.state.records.lastDestroyed && + param.from !== this.state.records.lastDestroyed + ) { + throw new Error( + 'The destroyed participant ' + + this.state.records.lastDestroyed.name + + ' does not have an associated destroying message after its declaration. Please check the sequence diagram.' + ); + } else { + this.state.records.lastDestroyed = undefined; + } + } + this.addSignal(param.from, param.to, param.msg, param.signalType, param.activate); + break; + case 'boxStart': + this.addBox(param.boxData); + break; + case 'boxEnd': + this.boxEnd(); + break; + case 'loopStart': + this.addSignal(undefined, undefined, param.loopText, param.signalType); + break; + case 'loopEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'rectStart': + this.addSignal(undefined, undefined, param.color, param.signalType); + break; + case 'rectEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'optStart': + this.addSignal(undefined, undefined, param.optText, param.signalType); + break; + case 'optEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'altStart': + this.addSignal(undefined, undefined, param.altText, param.signalType); + break; + case 'else': + this.addSignal(undefined, undefined, param.altText, param.signalType); + break; + case 'altEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'setAccTitle': + setAccTitle(param.text); + break; + case 'parStart': + this.addSignal(undefined, undefined, param.parText, param.signalType); + break; + case 'and': + this.addSignal(undefined, undefined, param.parText, param.signalType); + break; + case 'parEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'criticalStart': + this.addSignal(undefined, undefined, param.criticalText, param.signalType); + break; + case 'option': + this.addSignal(undefined, undefined, param.optionText, param.signalType); + break; + case 'criticalEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + case 'breakStart': + this.addSignal(undefined, undefined, param.breakText, param.signalType); + break; + case 'breakEnd': + this.addSignal(undefined, undefined, undefined, param.signalType); + break; + } + } + } + + public setAccTitle = setAccTitle; + public setAccDescription = setAccDescription; + public setDiagramTitle = setDiagramTitle; + public getAccTitle = getAccTitle; + public getAccDescription = getAccDescription; + public getDiagramTitle = getDiagramTitle; + public getConfig() { + return getConfig().sequence; + } +} diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js b/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js index fde813cef..1fb35bce6 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js +++ b/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js @@ -3,6 +3,7 @@ import { setSiteConfig } from '../../diagram-api/diagramAPI.js'; import mermaidAPI from '../../mermaidAPI.js'; import { Diagram } from '../../Diagram.js'; import { addDiagrams } from '../../diagram-api/diagram-orchestration.js'; +import { SequenceDB } from './sequenceDb.js'; beforeAll(async () => { // Is required to load the sequence diagram @@ -92,19 +93,19 @@ function addConf(conf, key, value) { } // const parser = sequence.parser; -let diagram; describe('more than one sequence diagram', () => { it('should not have duplicated messages', async () => { - const diagram1 = await Diagram.fromText(` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob:Hello Bob, how are you? Bob-->Alice: I am good thanks!`); - expect(diagram1.db.getMessages()).toMatchInlineSnapshot(` + expect(diagram.db.getMessages()).toMatchInlineSnapshot(` [ { "activate": false, "from": "Alice", + "id": "0", "message": "Hello Bob, how are you?", "to": "Bob", "type": 5, @@ -113,6 +114,7 @@ describe('more than one sequence diagram', () => { { "activate": false, "from": "Bob", + "id": "1", "message": "I am good thanks!", "to": "Alice", "type": 6, @@ -130,6 +132,7 @@ describe('more than one sequence diagram', () => { { "activate": false, "from": "Alice", + "id": "0", "message": "Hello Bob, how are you?", "to": "Bob", "type": 5, @@ -138,6 +141,7 @@ describe('more than one sequence diagram', () => { { "activate": false, "from": "Bob", + "id": "1", "message": "I am good thanks!", "to": "Alice", "type": 6, @@ -157,6 +161,7 @@ describe('more than one sequence diagram', () => { { "activate": false, "from": "Alice", + "id": "0", "message": "Hello John, how are you?", "to": "John", "type": 5, @@ -165,6 +170,7 @@ describe('more than one sequence diagram', () => { { "activate": false, "from": "John", + "id": "1", "message": "I am good thanks!", "to": "Alice", "type": 6, @@ -176,6 +182,7 @@ describe('more than one sequence diagram', () => { }); describe('when parsing a sequenceDiagram', function () { + let diagram; beforeEach(async function () { diagram = await Diagram.fromText(` sequenceDiagram @@ -183,14 +190,7 @@ Alice->Bob:Hello Bob, how are you? Note right of Bob: Bob thinks Bob-->Alice: I am good thanks!`); }); - it('should handle a sequenceDiagram definition', async function () { - const str = ` -sequenceDiagram -Alice->Bob:Hello Bob, how are you? -Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`; - - await mermaidAPI.parse(str); + it('should handle a sequenceDiagram definition', function () { const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -208,7 +208,6 @@ Alice->Bob:Hello Bob, how are you? Note right of Bob: Bob thinks Bob-->Alice: I am good thanks!`; - await mermaidAPI.parse(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility auto numbers expect(diagram.db.showSequenceNumbers()).toBe(false); }); @@ -220,20 +219,20 @@ Alice->Bob:Hello Bob, how are you? Note right of Bob: Bob thinks Bob-->Alice: I am good thanks!`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); + await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility auto numbers expect(diagram.db.showSequenceNumbers()).toBe(true); }); it('should handle a sequenceDiagram definition with a title:', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram title: Diagram Title Alice->Bob:Hello Bob, how are you? Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`; +Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -249,14 +248,13 @@ Bob-->Alice: I am good thanks!`; }); it('should handle a sequenceDiagram definition with a title without a :', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram title Diagram Title Alice->Bob:Hello Bob, how are you? Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`; +Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -272,22 +270,20 @@ Bob-->Alice: I am good thanks!`; }); it('should handle a sequenceDiagram definition with a accessibility title and description (accDescr)', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram title: Diagram Title accTitle: This is the title accDescr: Accessibility Description Alice->Bob:Hello Bob, how are you? -`; +`); - await mermaidAPI.parse(str); expect(diagram.db.getDiagramTitle()).toBe('Diagram Title'); expect(diagram.db.getAccTitle()).toBe('This is the title'); expect(diagram.db.getAccDescription()).toBe('Accessibility Description'); - const messages = diagram.db.getMessages(); }); it('should handle a sequenceDiagram definition with a accessibility title and multiline description (accDescr)', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram accTitle: This is the title accDescr { @@ -295,21 +291,18 @@ Accessibility Description } Alice->Bob:Hello Bob, how are you? -`; +`); - await mermaidAPI.parse(str); expect(diagram.db.getAccTitle()).toBe('This is the title'); expect(diagram.db.getAccDescription()).toBe('Accessibility\nDescription'); - const messages = diagram.db.getMessages(); }); it('should space in actor names', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob:Hello Bob, how are - you? -Bob-->Alice: I am good thanks!`; +Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -321,12 +314,11 @@ Bob-->Alice: I am good thanks!`; expect(messages[1].from).toBe('Bob'); }); it('should handle dashes in actor names', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice-in-Wonderland->Bob:Hello Bob, how are - you? -Bob-->Alice-in-Wonderland:I am good thanks!`; +Bob-->Alice-in-Wonderland:I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice-in-Wonderland').description).toBe('Alice-in-Wonderland'); expect(actors.get('Bob').description).toBe('Bob'); @@ -339,14 +331,13 @@ Bob-->Alice-in-Wonderland:I am good thanks!`; }); it('should handle dashes in participant names', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant Alice-in-Wonderland participant Bob Alice-in-Wonderland->Bob:Hello Bob, how are - you? -Bob-->Alice-in-Wonderland:I am good thanks!`; +Bob-->Alice-in-Wonderland:I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect([...actors.keys()]).toEqual(['Alice-in-Wonderland', 'Bob']); expect(actors.get('Alice-in-Wonderland').description).toBe('Alice-in-Wonderland'); @@ -360,14 +351,12 @@ Bob-->Alice-in-Wonderland:I am good thanks!`; }); it('should alias participants', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant A as Alice participant B as Bob A->B:Hello Bob, how are you? -B-->A: I am good thanks!`; - - await mermaidAPI.parse(str); +B-->A: I am good thanks!`); const actors = diagram.db.getActors(); @@ -381,7 +370,7 @@ B-->A: I am good thanks!`; expect(messages[1].from).toBe('B'); }); it('should alias a mix of actors and participants apa12', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram actor Alice as Alice2 actor Bob @@ -391,9 +380,7 @@ sequenceDiagram Bob->>Alice: Hi Alice Alice->>John: Hi John John->>Mandy: Hi Mandy - Mandy ->>Joan: Hi Joan`; - - await mermaidAPI.parse(str); + Mandy ->>Joan: Hi Joan`); const actors = diagram.db.getActors(); expect([...actors.keys()]).toEqual(['Alice', 'Bob', 'John', 'Mandy', 'Joan']); @@ -409,14 +396,12 @@ sequenceDiagram expect(messages[4].to).toBe('Joan'); }); it('should alias actors apa13', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram actor A as Alice actor B as Bob A->B:Hello Bob, how are you? -B-->A: I am good thanks!`; - - await mermaidAPI.parse(str); +B-->A: I am good thanks!`); const actors = diagram.db.getActors(); expect([...actors.keys()]).toEqual(['A', 'B']); @@ -429,11 +414,10 @@ B-->A: I am good thanks!`; expect(messages[1].from).toBe('B'); }); it('should handle in async messages', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram -Alice-xBob:Hello Bob, how are you?`; +Alice-xBob:Hello Bob, how are you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -444,11 +428,10 @@ Alice-xBob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.SOLID_CROSS); }); it('should handle in async dotted messages', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram -Alice--xBob:Hello Bob, how are you?`; +Alice--xBob:Hello Bob, how are you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -459,11 +442,10 @@ Alice--xBob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.DOTTED_CROSS); }); it('should handle in sync messages', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram -Alice-)Bob:Hello Bob, how are you?`; +Alice-)Bob:Hello Bob, how are you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -474,11 +456,10 @@ Alice-)Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.SOLID_POINT); }); it('should handle in sync dotted messages', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram -Alice--)Bob:Hello Bob, how are you?`; +Alice--)Bob:Hello Bob, how are you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -489,11 +470,10 @@ Alice--)Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.DOTTED_POINT); }); it('should handle in arrow messages', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram -Alice->>Bob:Hello Bob, how are you?`; +Alice->>Bob:Hello Bob, how are you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -504,9 +484,10 @@ Alice->>Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.SOLID); }); it('should handle in arrow messages', async () => { - const str = 'sequenceDiagram\n' + 'Alice-->>Bob:Hello Bob, how are you?'; + const diagram = await Diagram.fromText( + 'sequenceDiagram\n' + 'Alice-->>Bob:Hello Bob, how are you?' + ); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -517,11 +498,12 @@ Alice->>Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.DOTTED); }); it('should handle bidirectional arrow messages', async () => { - const str = ` + const diagram = await Diagram.fromText( + ` sequenceDiagram -Alice<<->>Bob:Hello Bob, how are you?`; +Alice<<->>Bob:Hello Bob, how are you?` + ); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -532,11 +514,12 @@ Alice<<->>Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.BIDIRECTIONAL_SOLID); }); it('should handle bidirectional dotted arrow messages', async () => { - const str = ` + const diagram = await Diagram.fromText( + ` sequenceDiagram - Alice<<-->>Bob:Hello Bob, how are you?`; + Alice<<-->>Bob:Hello Bob, how are you?` + ); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -547,14 +530,13 @@ Alice<<->>Bob:Hello Bob, how are you?`; expect(messages[0].type).toBe(diagram.db.LINETYPE.BIDIRECTIONAL_DOTTED); }); it('should handle actor activation', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice-->>Bob:Hello Bob, how are you? activate Bob Bob-->>Alice:Hello Alice, I'm fine and you? -deactivate Bob`; +deactivate Bob`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -570,12 +552,11 @@ deactivate Bob`; expect(messages[3].from).toBe('Bob'); }); it('should handle actor one line notation activation', async () => { - const str = ` - sequenceDiagram - Alice-->>+Bob:Hello Bob, how are you? - Bob-->>- Alice:Hello Alice, I'm fine and you?`; + const diagram = await Diagram.fromText(` + sequenceDiagram + Alice-->>+Bob:Hello Bob, how are you? + Bob-->>- Alice:Hello Alice, I'm fine and you?`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -592,14 +573,13 @@ deactivate Bob`; expect(messages[3].from).toBe('Bob'); }); it('should handle stacked activations', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice-->>+Bob:Hello Bob, how are you? Bob-->>+Carol:Carol, let me introduce Alice? Bob-->>- Alice:Hello Alice, please meet Carol? - Carol->>- Bob:Oh Bob, I'm so happy to be here!`; + Carol->>- Bob:Oh Bob, I'm so happy to be here!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); expect(actors.get('Bob').description).toBe('Bob'); @@ -645,14 +625,13 @@ deactivate Bob`; }); it('should handle comments in a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment Note right of Bob: Bob thinks - Bob-->Alice: I am good thanks!`; + Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -664,16 +643,15 @@ deactivate Bob`; expect(messages[2].from).toBe('Bob'); }); it('should handle new lines in a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment Note right of Bob: Bob thinks Bob-->Alice: I am good thanks! - `; + `); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -685,10 +663,9 @@ deactivate Bob`; expect(messages[2].from).toBe('Bob'); }); it('should handle semicolons', async () => { - const str = ` -sequenceDiagram;Alice->Bob: Hello Bob, how are you?;Note right of Bob: Bob thinks;Bob-->Alice: I am good thanks!;`; + const diagram = await Diagram.fromText(` +sequenceDiagram;Alice->Bob: Hello Bob, how are you?;Note right of Bob: Bob thinks;Bob-->Alice: I am good thanks!;`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -700,15 +677,14 @@ sequenceDiagram;Alice->Bob: Hello Bob, how are you?;Note right of Bob: Bob think expect(messages[2].from).toBe('Bob'); }); it('should handle one leading space in lines in a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`; +Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -720,15 +696,14 @@ Bob-->Alice: I am good thanks!`; expect(messages[2].from).toBe('Bob'); }); it('should handle several leading spaces in lines in a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`; +Bob-->Alice: I am good thanks!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -740,7 +715,7 @@ Bob-->Alice: I am good thanks!`; expect(messages[2].from).toBe('Bob'); }); it('should handle several leading spaces in lines in a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant Alice participant Bob @@ -751,9 +726,8 @@ John->John: Fight against hypochondria Note right of John: Rational thoughts
prevail... John-->Alice: Great! John->Bob: How about you? -Bob-->John: Jolly good!`; +Bob-->John: Jolly good!`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -765,7 +739,7 @@ Bob-->John: Jolly good!`; expect(messages[2].from).toBe('John'); }); it('should handle different line breaks', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant 1 as multiline
text participant 2 as multiline
text @@ -779,9 +753,7 @@ note right of 3: multiline
text note right of 4: multiline
text 4->>1: multiline
text note right of 1: multiline
text -`; - - await mermaidAPI.parse(str); +`); const actors = diagram.db.getActors(); expect(actors.get('1').description).toBe('multiline
text'); @@ -800,7 +772,7 @@ note right of 1: multiline
text expect(messages[7].message).toBe('multiline
text'); }); it('should handle notes and messages without wrap specified', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant 1 participant 2 @@ -814,9 +786,7 @@ note right of 3:nowrap: single-line text note right of 4: multiline
text 4->>1:nowrap: multiline
text note right of 1:nowrap: multiline
text -`; - - await mermaidAPI.parse(str); +`); const messages = diagram.db.getMessages(); expect(messages[0].message).toBe('single-line text'); @@ -839,7 +809,7 @@ note right of 1:nowrap: multiline
text expect(messages[7].wrap).toBe(false); }); it('should handle notes and messages with wrap specified', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant 1 participant 2 @@ -849,9 +819,7 @@ participant 4 note right of 2:wrap: single-line text 2->>3:wrap: multiline
text note right of 3:wrap: multiline
text -`; - - await mermaidAPI.parse(str); +`); const messages = diagram.db.getMessages(); expect(messages[0].message).toBe('single-line text'); @@ -864,15 +832,13 @@ note right of 3:wrap: multiline
text expect(messages[3].wrap).toBe(true); }); it('should handle notes and messages with nowrap or line breaks', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant 1 participant 2 1->>2: single-line text note right of 2: single-line text -`; - - await mermaidAPI.parse(str); +`); const messages = diagram.db.getMessages(); expect(messages[0].message).toBe('single-line text'); @@ -881,27 +847,23 @@ note right of 2: single-line text expect(messages[1].wrap).toBe(false); }); it('should handle notes over a single actor', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? Note over Bob: Bob thinks -`; - - await mermaidAPI.parse(str); +`); const messages = diagram.db.getMessages(); expect(messages[1].from).toBe('Bob'); expect(messages[1].to).toBe('Bob'); }); it('should handle notes over multiple actors', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? Note over Alice,Bob: confusion Note over Bob,Alice: resolution -`; - - await mermaidAPI.parse(str); +`); const messages = diagram.db.getMessages(); expect(messages[1].from).toBe('Alice'); @@ -910,7 +872,7 @@ Note over Bob,Alice: resolution expect(messages[2].to).toBe('Alice'); }); it('should handle loop statements', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? @@ -919,9 +881,8 @@ Note right of Bob: Bob thinks loop Multiple happy responses Bob-->Alice: I am good thanks! -end`; +end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -933,7 +894,7 @@ end`; expect(messages[1].from).toBe('Bob'); }); it('should add a rect around sequence', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment @@ -941,9 +902,8 @@ end`; Note right of Bob: Bob thinks Bob-->Alice: I am good thanks end - `; + `); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -957,7 +917,7 @@ end`; }); it('should allow for nested rects', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? %% Comment @@ -967,8 +927,8 @@ end`; end Bob-->Alice: I am good thanks end - `; - await mermaidAPI.parse(str); + `); + const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -984,7 +944,7 @@ end`; expect(messages[6].type).toEqual(diagram.db.LINETYPE.RECT_END); }); it('should handle opt statements', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? @@ -993,9 +953,8 @@ Note right of Bob: Bob thinks opt Perhaps a happy response Bob-->Alice: I am good thanks! -end`; +end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); actors.get('Bob').description = 'Bob'; @@ -1007,7 +966,7 @@ end`; expect(messages[1].from).toBe('Bob'); }); it('should handle alt statements', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? @@ -1018,9 +977,8 @@ alt isWell Bob-->Alice: I am good thanks! else isSick Bob-->Alice: Feel sick... -end`; +end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); @@ -1033,7 +991,7 @@ end`; expect(messages[1].from).toBe('Bob'); }); it('should handle alt statements with multiple elses', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? @@ -1046,8 +1004,8 @@ else isSick Bob-->Alice: Feel sick... else default Bob-->Alice: :-) -end`; - await mermaidAPI.parse(str); +end`); + const messages = diagram.db.getMessages(); expect(messages.length).toBe(9); expect(messages[1].from).toBe('Bob'); @@ -1060,13 +1018,12 @@ end`; expect(messages[8].type).toBe(diagram.db.LINETYPE.ALT_END); }); it('should handle critical statements without options', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram critical Establish a connection to the DB Service-->DB: connect - end`; + end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Service').description).toBe('Service'); @@ -1080,7 +1037,7 @@ sequenceDiagram expect(messages[2].type).toBe(diagram.db.LINETYPE.CRITICAL_END); }); it('should handle critical statements with options', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram critical Establish a connection to the DB Service-->DB: connect @@ -1088,9 +1045,8 @@ sequenceDiagram Service-->Service: Log error option Credentials rejected Service-->Service: Log different error - end`; + end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Service').description).toBe('Service'); @@ -1108,16 +1064,15 @@ sequenceDiagram expect(messages[6].type).toBe(diagram.db.LINETYPE.CRITICAL_END); }); it('should handle break statements', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Consumer-->API: Book something API-->BookingService: Start booking process break when the booking process fails API-->Consumer: show failure end - API-->BillingService: Start billing process`; + API-->BillingService: Start billing process`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Consumer').description).toBe('Consumer'); @@ -1134,7 +1089,7 @@ sequenceDiagram expect(messages[5].from).toBe('API'); }); it('should handle par statements a sequenceDiagram', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram par Parallel one Alice->>Bob: Hello Bob, how are you? @@ -1145,9 +1100,8 @@ Bob-->>Alice: Fine! and Parallel three Alice->>Bob: What do you think about it? Bob-->>Alice: It's good! -end`; +end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); @@ -1161,15 +1115,14 @@ end`; expect(messages[2].from).toBe('Bob'); }); it('it should handle par_over statements', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram par_over Parallel overlap Alice ->> Bob: Message Note left of Alice: Alice note Note right of Bob: Bob note -end`; +end`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('Alice').description).toBe('Alice'); @@ -1184,120 +1137,102 @@ end`; expect(messages[3].from).toBe('Bob'); }); it('should handle special characters in signals', async () => { - const str = 'sequenceDiagram\n' + 'Alice->Bob: -:<>,;# comment'; - - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText('sequenceDiagram\n' + 'Alice->Bob: -:<>,;# comment'); const messages = diagram.db.getMessages(); expect(messages[0].message).toBe('-:<>,'); }); it('should handle special characters in notes', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? -Note right of Bob: -:<>,;# comment`; - - await mermaidAPI.parse(str); +Note right of Bob: -:<>,;# comment`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe('-:<>,'); }); it('should handle special characters in loop', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? loop -:<>,;# comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe('-:<>,'); }); it('should handle special characters in opt', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? opt -:<>,;# comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe('-:<>,'); }); it('should handle special characters in alt', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? alt -:<>,;# comment Bob-->Alice: I am good thanks! else ,<>:-#; comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe('-:<>,'); expect(messages[3].message).toBe(',<>:-'); }); it('should handle special characters in par', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? par -:<>,;# comment Bob-->Alice: I am good thanks! and ,<>:-#; comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe('-:<>,'); expect(messages[3].message).toBe(',<>:-'); }); it('should handle no-label loop', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? loop Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe(''); expect(messages[2].message).toBe('I am good thanks!'); }); it('should handle no-label opt', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? opt # comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe(''); expect(messages[2].message).toBe('I am good thanks!'); }); it('should handle no-label alt', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? alt;Bob-->Alice: I am good thanks! else # comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe(''); @@ -1306,15 +1241,13 @@ end`; expect(messages[4].message).toBe('I am good thanks!'); }); it('should handle no-label par', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram Alice->Bob: Hello Bob, how are you? par;Bob-->Alice: I am good thanks! and # comment Bob-->Alice: I am good thanks! -end`; - - await mermaidAPI.parse(str); +end`); const messages = diagram.db.getMessages(); expect(messages[1].message).toBe(''); @@ -1324,7 +1257,7 @@ end`; }); it('should handle links', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant a as Alice participant b as Bob @@ -1335,9 +1268,8 @@ links a: { "On-Call": "https://oncall.contoso.com/?svc=alice" } link a: Endpoint @ https://alice.contoso.com link a: Swagger @ https://swagger.contoso.com link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com -`; +`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('a').links.Repo).toBe('https://repo.contoso.com/'); expect(actors.get('b').links.Repo).toBe(undefined); @@ -1352,16 +1284,15 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com it('should handle properties EXPERIMENTAL: USE WITH CAUTION', async () => { //Be aware that the syntax for "properties" is likely to be changed. - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant a as Alice participant b as Bob participant c as Charlie properties a: {"class": "internal-service-actor", "icon": "@clock"} properties b: {"class": "external-service-actor", "icon": "@computer"} -`; +`); - await mermaidAPI.parse(str); const actors = diagram.db.getActors(); expect(actors.get('a').properties.class).toBe('internal-service-actor'); expect(actors.get('b').properties.class).toBe('external-service-actor'); @@ -1371,7 +1302,7 @@ properties b: {"class": "external-service-actor", "icon": "@computer"} }); it('should handle box', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram box green Group 1 participant a as Alice @@ -1384,9 +1315,8 @@ links a: { "On-Call": "https://oncall.contoso.com/?svc=alice" } link a: Endpoint @ https://alice.contoso.com link a: Swagger @ https://swagger.contoso.com link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com -`; +`); - await mermaidAPI.parse(str); const boxes = diagram.db.getBoxes(); expect(boxes[0].name).toEqual('Group 1'); expect(boxes[0].actorKeys).toEqual(['a', 'b']); @@ -1394,7 +1324,7 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com }); it('should handle box without color', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram box Group 1 participant a as Alice @@ -1407,9 +1337,8 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com link a: Endpoint @ https://alice.contoso.com link a: Swagger @ https://swagger.contoso.com link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com - `; + `); - await mermaidAPI.parse(str); const boxes = diagram.db.getBoxes(); expect(boxes[0].name).toEqual('Group 1'); expect(boxes[0].actorKeys).toEqual(['a', 'b']); @@ -1417,7 +1346,7 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com }); it('should handle box without description', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram box Aqua participant a as Alice @@ -1430,9 +1359,8 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com link a: Endpoint @ https://alice.contoso.com link a: Swagger @ https://swagger.contoso.com link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com - `; + `); - await mermaidAPI.parse(str); const boxes = diagram.db.getBoxes(); expect(boxes[0].name).toBeFalsy(); expect(boxes[0].actorKeys).toEqual(['a', 'b']); @@ -1440,7 +1368,7 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com }); it('should handle simple actor creation', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant a as Alice a ->>b: Hello Bob? @@ -1449,8 +1377,7 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com c ->> b: Hello b? create actor d as Donald a ->> d: Hello Donald? - `; - await mermaidAPI.parse(str); + `); const actors = diagram.db.getActors(); const createdActors = diagram.db.getCreatedActors(); expect(actors.get('c').name).toEqual('c'); @@ -1463,7 +1390,7 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com expect(createdActors.get('d')).toEqual(3); }); it('should handle simple actor destruction', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant a as Alice a ->>b: Hello Bob? @@ -1472,14 +1399,13 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com b ->> c: Where is Alice? destroy c b ->> c: Where are you? - `; - await mermaidAPI.parse(str); + `); const destroyedActors = diagram.db.getDestroyedActors(); expect(destroyedActors.get('a')).toEqual(1); expect(destroyedActors.get('c')).toEqual(3); }); it('should handle the creation and destruction of the same actor', async () => { - const str = ` + const diagram2 = await Diagram.fromText(` sequenceDiagram a ->>b: Hello Bob? create participant c @@ -1487,10 +1413,9 @@ link a: Tests @ https://tests.contoso.com/?svc=alice@contoso.com c ->> b: Hello b? destroy c b ->> c : Bye c ! - `; - await mermaidAPI.parse(str); - const createdActors = diagram.db.getCreatedActors(); - const destroyedActors = diagram.db.getDestroyedActors(); + `); + const createdActors = diagram2.db.getCreatedActors(); + const destroyedActors = diagram2.db.getDestroyedActors(); expect(createdActors.get('c')).toEqual(1); expect(destroyedActors.get('c')).toEqual(3); }); @@ -1514,7 +1439,12 @@ describe('when checking the bounds in a sequenceDiagram', function () { }); let conf; - beforeEach(function () { + let diagram; + beforeEach(async function () { + diagram = await Diagram.fromText(` + sequenceDiagram + Alice->Bob:Hello Bob, how are you? + Bob-->Alice: I am good thanks!`); mermaidAPI.reset(); diagram.renderer.bounds.init(); conf = diagram.db.getConfig(); @@ -1570,7 +1500,7 @@ describe('when checking the bounds in a sequenceDiagram', function () { expect(bounds.stopx).toBe(300); expect(bounds.stopy).toBe(400); }); - it('should handle multiple loops withtout expanding the bounds', () => { + it('should handle multiple loops without expanding the bounds', () => { diagram.renderer.bounds.insert(100, 100, 1000, 1000); diagram.renderer.bounds.verticalPos = 200; diagram.renderer.bounds.newLoop(); @@ -1643,7 +1573,7 @@ describe('when rendering a sequenceDiagram APA', function () { setSiteConfig({ logLevel: 5, sequence: conf }); }); let conf; - beforeEach(async function () { + beforeEach(function () { mermaidAPI.reset(); // }); @@ -1662,11 +1592,6 @@ describe('when rendering a sequenceDiagram APA', function () { mirrorActors: false, }; setSiteConfig({ logLevel: 5, sequence: conf }); - diagram = await Diagram.fromText(` -sequenceDiagram -Alice->Bob:Hello Bob, how are you? -Note right of Bob: Bob thinks -Bob-->Alice: I am good thanks!`); }); ['tspan', 'fo', 'old', undefined].forEach(function (textPlacement) { it(` @@ -1675,7 +1600,7 @@ it should handle one actor, when textPlacement is ${textPlacement}`, async () => sequenceDiagram participant Alice`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); // diagram.renderer.setConf(mermaidAPI.getConfig().sequence); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); @@ -1687,14 +1612,12 @@ participant Alice`; }); }); it('should handle same actor with different whitespace properly', async () => { - const str = ` + const diagram = await Diagram.fromText(` sequenceDiagram participant Alice participant Alice participant Alice -`; - - await mermaidAPI.parse(str); +`); const actors = diagram.db.getActors(); expect([...actors.keys()]).toEqual(['Alice']); @@ -1705,9 +1628,9 @@ sequenceDiagram participant Alice Note over Alice: Alice thinks `; + const diagram = await Diagram.fromText(str); expect(mermaidAPI.getConfig().sequence.mirrorActors).toBeFalsy(); - await mermaidAPI.parse(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1723,7 +1646,7 @@ sequenceDiagram participant Alice Note left of Alice: Alice thinks`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1739,7 +1662,7 @@ sequenceDiagram participant Alice Note right of Alice: Alice thinks`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1754,7 +1677,7 @@ Note right of Alice: Alice thinks`; sequenceDiagram Alice->Bob: Hello Bob, how are you?`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1772,7 +1695,7 @@ participant Bob end Alice->Bob: Hello Bob, how are you?`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1786,8 +1709,8 @@ Alice->Bob: Hello Bob, how are you?`; %%{init: {'logLevel': 0}}%% sequenceDiagram Alice->Bob: Hello Bob, how are you?`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1802,12 +1725,11 @@ Alice->Bob: Hello Bob, how are you?`; const str = ` %%{init: { 'logLevel': 0}}%% sequenceDiagram -%%{ -wrap -}%% +%%{wrap}%% Alice->Bob: Hello Bob, how are you?`; await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const msgs = diagram.db.getMessages(); @@ -1827,8 +1749,8 @@ Alice->Bob: Hello Bob, how are you? Note over Alice,Bob: Looks Note over Bob,Alice: Looks back `; + const diagram = await Diagram.fromText(str); // mermaidAPI.initialize({logLevel:0}) - await mermaidAPI.parse(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1843,7 +1765,7 @@ sequenceDiagram Alice->Bob: Hello Bob, how are you? Bob->Alice: Fine!`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1859,7 +1781,7 @@ Alice->Bob: Hello Bob, how are you? Note right of Bob: Bob thinks Bob->Alice: Fine!`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1878,7 +1800,7 @@ Alice->Bob: Hello Bob, how are you? Note left of Alice: Bob thinks Bob->Alice: Fine!`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1895,7 +1817,7 @@ Alice->>Bob:wrap: Hello Bob, how are you? If you are not available right now, I Note left of Alice: Bob thinks Bob->>Alice: Fine!`; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1917,6 +1839,7 @@ Note left of Alice: Bob thinks Bob->>Alice: Fine!`; await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1940,6 +1863,8 @@ Note left of Alice: Bob thinks Bob->>Alice: Fine!`; await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); + await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1962,6 +1887,7 @@ Note left of Alice: Bob thinks Bob->>Alice: Fine!`; // mermaidAPI.initialize({ logLevel: 0 }); await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -1985,9 +1911,9 @@ Alice->Bob: Hello Bob, how are you? loop Cheers Bob->Alice: Fine! end`; - await mermaidAPI.parse(str); - await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); + const diagram = await Diagram.fromText(str); + await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); expect(bounds.startx).toBe(0); expect(bounds.starty).toBe(0); @@ -2003,7 +1929,7 @@ end`; Bob->Alice: I feel surrounded by darkness end `; - await mermaidAPI.parse(str); + const diagram = await Diagram.fromText(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); expect(bounds.startx).toBe(0); @@ -2037,20 +1963,23 @@ describe('when rendering a sequenceDiagram with actor mirror activated', () => { }); let conf; - beforeEach(function () { + let diagram; + beforeEach(async function () { + diagram = await Diagram.fromText(` + sequenceDiagram + Alice->Bob:Hello Bob, how are you? + Bob-->Alice: I am good thanks!`); mermaidAPI.reset(); conf = diagram.db.getConfig(); diagram.renderer.bounds.init(); }); ['tspan', 'fo', 'old', undefined].forEach(function (textPlacement) { it('should handle one actor, when textPlacement is' + textPlacement, async () => { - mermaidAPI.initialize(addConf(conf, 'textPlacement', textPlacement)); - diagram.renderer.bounds.init(); const str = ` sequenceDiagram participant Alice`; + const diagram = await Diagram.fromText(str); diagram.renderer.bounds.init(); - await mermaidAPI.parse(str); await diagram.renderer.draw(str, 'tst', '1.2.3', diagram); const { bounds, models } = diagram.renderer.bounds.getBounds(); @@ -2071,3 +2000,27 @@ ${prop}-->>A: Hello, how are you?`) ).resolves.toBeDefined(); }); }); + +describe('sequence db class', () => { + let sequenceDb; + beforeEach(() => { + sequenceDb = new SequenceDB(); + }); + // This is to ensure that functions used in sequence JISON are exposed as function from SequenceDB + it('should have functions used in sequence JISON as own property', () => { + const functionsUsedInParser = [ + 'apply', + 'parseBoxData', + 'LINETYPE', + 'setDiagramTitle', + 'setAccTitle', + 'setAccDescription', + 'parseMessage', + 'PLACEMENT', + ]; + + for (const fun of functionsUsedInParser) { + expect(Object.hasOwn(sequenceDb, fun)).toBe(true); + } + }); +}); diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDiagram.ts b/packages/mermaid/src/diagrams/sequence/sequenceDiagram.ts index f8d71c95e..f2b701712 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDiagram.ts +++ b/packages/mermaid/src/diagrams/sequence/sequenceDiagram.ts @@ -1,16 +1,26 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore: JISON doesn't support types import parser from './parser/sequenceDiagram.jison'; -import db from './sequenceDb.js'; +import { SequenceDB } from './sequenceDb.js'; import styles from './styles.js'; +import { setConfig } from '../../diagram-api/diagramAPI.js'; import renderer from './sequenceRenderer.js'; +import type { MermaidConfig } from '../../config.type.js'; export const diagram: DiagramDefinition = { parser, - db, + get db() { + return new SequenceDB(); + }, renderer, styles, - init: ({ wrap }) => { - db.setWrap(wrap); + init: (cnf: MermaidConfig) => { + if (!cnf.sequence) { + cnf.sequence = {}; + } + if (cnf.wrap) { + cnf.sequence.wrap = cnf.wrap; + setConfig({ sequence: { wrap: cnf.wrap } }); + } }, }; diff --git a/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts b/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts index 951d84b86..389171d3c 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts +++ b/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts @@ -1538,7 +1538,6 @@ const calculateLoopBounds = async function (messages, actors, _maxWidthPerActor, let current, noteModel, msgModel; for (const msg of messages) { - msg.id = utils.random({ length: 10 }); switch (msg.type) { case diagObj.db.LINETYPE.LOOP_START: case diagObj.db.LINETYPE.ALT_START: diff --git a/packages/mermaid/src/diagrams/sequence/types.ts b/packages/mermaid/src/diagrams/sequence/types.ts index 10c1c8ed3..7cf2ead9c 100644 --- a/packages/mermaid/src/diagrams/sequence/types.ts +++ b/packages/mermaid/src/diagrams/sequence/types.ts @@ -20,6 +20,7 @@ export interface Actor { } export interface Message { + id: string; from?: string; to?: string; message: diff --git a/packages/mermaid/src/diagrams/state/parser/state-parser.spec.js b/packages/mermaid/src/diagrams/state/parser/state-parser.spec.js index 9fa8acab8..89701cbce 100644 --- a/packages/mermaid/src/diagrams/state/parser/state-parser.spec.js +++ b/packages/mermaid/src/diagrams/state/parser/state-parser.spec.js @@ -1,4 +1,4 @@ -import stateDb from '../stateDb.js'; +import { StateDB } from '../stateDb.js'; import stateDiagram from './stateDiagram.jison'; import { setConfig } from '../../../config.js'; @@ -7,7 +7,9 @@ setConfig({ }); describe('state parser can parse...', () => { + let stateDb; beforeEach(function () { + stateDb = new StateDB(2); stateDiagram.parser.yy = stateDb; stateDiagram.parser.yy.clear(); }); @@ -18,7 +20,6 @@ describe('state parser can parse...', () => { const diagramText = `stateDiagram-v2 state "Small State 1" as namedState1`; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('namedState1')).not.toBeUndefined(); @@ -31,7 +32,6 @@ describe('state parser can parse...', () => { const diagramText = `stateDiagram-v2 namedState1 : Small State 1`; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('namedState1')).not.toBeUndefined(); @@ -42,7 +42,6 @@ describe('state parser can parse...', () => { const diagramText = `stateDiagram-v2 namedState1:Small State 1`; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('namedState1')).not.toBeUndefined(); @@ -60,7 +59,6 @@ describe('state parser can parse...', () => { state assemblies `; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('assemble')).not.toBeUndefined(); expect(states.get('assemblies')).not.toBeUndefined(); @@ -71,7 +69,6 @@ describe('state parser can parse...', () => { state "as" as as `; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('as')).not.toBeUndefined(); expect(states.get('as').descriptions.join(' ')).toEqual('as'); @@ -96,7 +93,6 @@ describe('state parser can parse...', () => { namedState2 --> bigState2: should point to \\nbigState2 container`; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('namedState1')).not.toBeUndefined(); @@ -120,7 +116,6 @@ describe('state parser can parse...', () => { inner1 --> inner2 }`; stateDiagram.parser.parse(diagramText); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get('bigState1')).not.toBeUndefined(); @@ -137,7 +132,6 @@ describe('state parser can parse...', () => { stateDiagram-v2 [*] --> ${prop} ${prop} --> [*]`); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); expect(states.get(prop)).not.toBeUndefined(); }); diff --git a/packages/mermaid/src/diagrams/state/parser/state-style.spec.js b/packages/mermaid/src/diagrams/state/parser/state-style.spec.js index fed63c444..7db5f59d5 100644 --- a/packages/mermaid/src/diagrams/state/parser/state-style.spec.js +++ b/packages/mermaid/src/diagrams/state/parser/state-style.spec.js @@ -1,13 +1,15 @@ -import stateDb from '../stateDb.js'; -import stateDiagram from './stateDiagram.jison'; import { setConfig } from '../../../config.js'; +import { StateDB } from '../stateDb.js'; +import stateDiagram from './stateDiagram.jison'; setConfig({ securityLevel: 'strict', }); describe('ClassDefs and classes when parsing a State diagram', () => { + let stateDb; beforeEach(function () { + stateDb = new StateDB(2); stateDiagram.parser.yy = stateDb; stateDiagram.parser.yy.clear(); }); @@ -16,7 +18,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { describe('defining (classDef)', () => { it('has "classDef" as a keyword, an id, and can set a css style attribute', function () { stateDiagram.parser.parse('stateDiagram-v2\n classDef exampleClass background:#bbb;'); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const styleClasses = stateDb.getClasses(); expect(styleClasses.get('exampleClass').styles.length).toEqual(1); @@ -27,7 +28,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { stateDiagram.parser.parse( 'stateDiagram-v2\n classDef exampleClass background:#bbb, font-weight:bold, font-style:italic;' ); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const styleClasses = stateDb.getClasses(); expect(styleClasses.get('exampleClass').styles.length).toEqual(3); @@ -41,7 +41,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { stateDiagram.parser.parse( 'stateDiagram-v2\n classDef exampleStyleClass background:#bbb,border:1.5px solid red;' ); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDiagram.parser.yy.getClasses(); expect(classes.get('exampleStyleClass').styles.length).toBe(2); @@ -53,7 +52,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { stateDiagram.parser.parse( 'stateDiagram-v2\n classDef exampleStyleClass background: #bbb,border:1.5px solid red;' ); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDiagram.parser.yy.getClasses(); expect(classes.get('exampleStyleClass').styles.length).toBe(2); @@ -65,7 +63,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { stateDiagram.parser.parse( 'stateDiagram-v2\n classDef __proto__ background:#bbb,border:1.5px solid red;\n classDef constructor background:#bbb,border:1.5px solid red;' ); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDiagram.parser.yy.getClasses(); expect(classes.get('__proto__').styles.length).toBe(2); expect(classes.get('constructor').styles.length).toBe(2); @@ -81,7 +78,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += 'class a exampleStyleClass'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDb.getClasses(); expect(classes.get('exampleStyleClass').styles.length).toEqual(2); @@ -102,7 +98,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += 'class a_a exampleStyleClass'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDiagram.parser.yy.getClasses(); expect(classes.get('exampleStyleClass').styles.length).toBe(2); @@ -122,7 +117,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += 'a --> b:::exampleStyleClass' + '\n'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); const classes = stateDiagram.parser.yy.getClasses(); @@ -141,7 +135,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += '[*]:::exampleStyleClass --> b\n'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); const classes = stateDiagram.parser.yy.getClasses(); @@ -161,7 +154,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += 'class a,b exampleStyleClass'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); let classes = stateDiagram.parser.yy.getClasses(); let states = stateDiagram.parser.yy.getStates(); @@ -180,7 +172,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += 'class a,b,c, d, e exampleStyleClass'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const classes = stateDiagram.parser.yy.getClasses(); const states = stateDiagram.parser.yy.getStates(); @@ -208,7 +199,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { diagram += '}\n'; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDiagram.parser.yy.getStates(); @@ -224,7 +214,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { stateDiagram.parser.parse(`stateDiagram-v2 id1 style id1 background:#bbb`); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const data4Layout = stateDiagram.parser.yy.getData(); expect(data4Layout.nodes[0].cssStyles).toEqual(['background:#bbb']); @@ -234,7 +223,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { id1 id2 style id1,id2 background:#bbb`); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const data4Layout = stateDiagram.parser.yy.getData(); expect(data4Layout.nodes[0].cssStyles).toEqual(['background:#bbb']); @@ -247,7 +235,6 @@ describe('ClassDefs and classes when parsing a State diagram', () => { id2 style id1,id2 background:#bbb, font-weight:bold, font-style:italic;`); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const data4Layout = stateDiagram.parser.yy.getData(); expect(data4Layout.nodes[0].cssStyles).toEqual([ diff --git a/packages/mermaid/src/diagrams/state/shapes.js b/packages/mermaid/src/diagrams/state/shapes.js index f0ab4136b..b18b4ca0e 100644 --- a/packages/mermaid/src/diagrams/state/shapes.js +++ b/packages/mermaid/src/diagrams/state/shapes.js @@ -1,6 +1,6 @@ import { line, curveBasis } from 'd3'; import idCache from './id-cache.js'; -import stateDb from './stateDb.js'; +import { StateDB } from './stateDb.js'; import utils from '../../utils.js'; import common from '../common/common.js'; import { getConfig } from '../../diagram-api/diagramAPI.js'; @@ -414,13 +414,13 @@ let edgeCount = 0; export const drawEdge = function (elem, path, relation) { const getRelationType = function (type) { switch (type) { - case stateDb.relationType.AGGREGATION: + case StateDB.relationType.AGGREGATION: return 'aggregation'; - case stateDb.relationType.EXTENSION: + case StateDB.relationType.EXTENSION: return 'extension'; - case stateDb.relationType.COMPOSITION: + case StateDB.relationType.COMPOSITION: return 'composition'; - case stateDb.relationType.DEPENDENCY: + case StateDB.relationType.DEPENDENCY: return 'dependency'; } }; @@ -459,7 +459,7 @@ export const drawEdge = function (elem, path, relation) { svgPath.attr( 'marker-end', - 'url(' + url + '#' + getRelationType(stateDb.relationType.DEPENDENCY) + 'End' + ')' + 'url(' + url + '#' + getRelationType(StateDB.relationType.DEPENDENCY) + 'End' + ')' ); if (relation.title !== undefined) { diff --git a/packages/mermaid/src/diagrams/state/stateCommon.ts b/packages/mermaid/src/diagrams/state/stateCommon.ts index 17a1bd24a..2902ce6b0 100644 --- a/packages/mermaid/src/diagrams/state/stateCommon.ts +++ b/packages/mermaid/src/diagrams/state/stateCommon.ts @@ -3,11 +3,14 @@ */ // default diagram direction -export const DEFAULT_DIAGRAM_DIRECTION = 'LR'; +export const DEFAULT_DIAGRAM_DIRECTION = 'TB'; // default direction for any nested documents (composites) export const DEFAULT_NESTED_DOC_DIR = 'TB'; +// parsed statement type for a direction +export const STMT_DIRECTION = 'dir'; + // parsed statement type for a state export const STMT_STATE = 'state'; // parsed statement type for a relation diff --git a/packages/mermaid/src/diagrams/state/stateDb.js b/packages/mermaid/src/diagrams/state/stateDb.js index 1f12425e6..029db9c6f 100644 --- a/packages/mermaid/src/diagrams/state/stateDb.js +++ b/packages/mermaid/src/diagrams/state/stateDb.js @@ -1,28 +1,29 @@ +import { getConfig } from '../../diagram-api/diagramAPI.js'; import { log } from '../../logger.js'; import { generateId } from '../../utils.js'; import common from '../common/common.js'; -import { getConfig } from '../../diagram-api/diagramAPI.js'; import { - setAccTitle, - getAccTitle, - getAccDescription, - setAccDescription, clear as commonClear, - setDiagramTitle, + getAccDescription, + getAccTitle, getDiagramTitle, + setAccDescription, + setAccTitle, + setDiagramTitle, } from '../common/commonDb.js'; import { dataFetcher, reset as resetDataFetching } from './dataFetcher.js'; import { getDir } from './stateRenderer-v3-unified.js'; import { DEFAULT_DIAGRAM_DIRECTION, - STMT_STATE, - STMT_RELATION, - STMT_CLASSDEF, - STMT_STYLEDEF, - STMT_APPLYCLASS, DEFAULT_STATE_TYPE, DIVIDER_TYPE, + STMT_APPLYCLASS, + STMT_CLASSDEF, + STMT_DIRECTION, + STMT_RELATION, + STMT_STATE, + STMT_STYLEDEF, } from './stateCommon.js'; const START_NODE = '[*]'; @@ -46,15 +47,6 @@ function newClassesList() { return new Map(); } -let nodes = []; -let edges = []; - -let direction = DEFAULT_DIAGRAM_DIRECTION; -let rootDoc = []; -let classes = newClassesList(); // style classes defined by a classDef - -// -------------------------------------- - const newDoc = () => { return { /** @type {{ id1: string, id2: string, relationTitle: string }[]} */ @@ -63,564 +55,652 @@ const newDoc = () => { documents: {}, }; }; -let documents = { - root: newDoc(), -}; - -let currentDocument = documents.root; -let startEndCount = 0; -let dividerCnt = 0; - -export const lineType = { - LINE: 0, - DOTTED_LINE: 1, -}; - -export const relationType = { - AGGREGATION: 0, - EXTENSION: 1, - COMPOSITION: 2, - DEPENDENCY: 3, -}; const clone = (o) => JSON.parse(JSON.stringify(o)); -const setRootDoc = (o) => { - log.info('Setting root doc', o); - // rootDoc = { id: 'root', doc: o }; - rootDoc = o; -}; +export class StateDB { + /** + * @param {1 | 2} version - v1 renderer or v2 renderer. + */ + constructor(version) { + this.clear(); -const getRootDoc = () => rootDoc; + this.version = version; -const docTranslator = (parent, node, first) => { - if (node.stmt === STMT_RELATION) { - docTranslator(parent, node.state1, true); - docTranslator(parent, node.state2, false); - } else { - if (node.stmt === STMT_STATE) { - if (node.id === '[*]') { - node.id = first ? parent.id + '_start' : parent.id + '_end'; - node.start = first; - } else { - // This is just a plain state, not a start or end - node.id = node.id.trim(); - } - } - - if (node.doc) { - const doc = []; - // Check for concurrency - let currentDoc = []; - let i; - for (i = 0; i < node.doc.length; i++) { - if (node.doc[i].type === DIVIDER_TYPE) { - // debugger; - const newNode = clone(node.doc[i]); - newNode.doc = clone(currentDoc); - doc.push(newNode); - currentDoc = []; - } else { - currentDoc.push(node.doc[i]); - } - } - - // If any divider was encountered - if (doc.length > 0 && currentDoc.length > 0) { - const newNode = { - stmt: STMT_STATE, - id: generateId(), - type: 'divider', - doc: clone(currentDoc), - }; - doc.push(clone(newNode)); - node.doc = doc; - } - - node.doc.forEach((docNode) => docTranslator(node, docNode, true)); - } - } -}; -const getRootDocV2 = () => { - docTranslator({ id: 'root' }, { id: 'root', doc: rootDoc }, true); - return { id: 'root', doc: rootDoc }; - // Here -}; - -/** - * Convert all of the statements (stmts) that were parsed into states and relationships. - * This is done because a state diagram may have nested sections, - * where each section is a 'document' and has its own set of statements. - * Ex: the section within a fork has its own statements, and incoming and outgoing statements - * refer to the fork as a whole (document). - * See the parser grammar: the definition of a document is a document then a 'line', where a line can be a statement. - * This will push the statement into the list of statements for the current document. - * - * @param _doc - */ -const extract = (_doc) => { - // const res = { states: [], relations: [] }; - let doc; - if (_doc.doc) { - doc = _doc.doc; - } else { - doc = _doc; - } - // let doc = root.doc; - // if (!doc) { - // doc = root; - // } - log.info(doc); - clear(true); - - log.info('Extract initial document:', doc); - - doc.forEach((item) => { - log.warn('Statement', item.stmt); - switch (item.stmt) { - case STMT_STATE: - addState( - item.id.trim(), - item.type, - item.doc, - item.description, - item.note, - item.classes, - item.styles, - item.textStyles - ); - break; - case STMT_RELATION: - addRelation(item.state1, item.state2, item.description); - break; - case STMT_CLASSDEF: - addStyleClass(item.id.trim(), item.classes); - break; - case STMT_STYLEDEF: - { - const ids = item.id.trim().split(','); - const styles = item.styleClass.split(','); - ids.forEach((id) => { - let foundState = getState(id); - if (foundState === undefined) { - const trimmedId = id.trim(); - addState(trimmedId); - foundState = getState(trimmedId); - } - foundState.styles = styles.map((s) => s.replace(/;/g, '')?.trim()); - }); - } - break; - case STMT_APPLYCLASS: - setCssClass(item.id.trim(), item.styleClass); - break; - } - }); - - const diagramStates = getStates(); - const config = getConfig(); - const look = config.look; - resetDataFetching(); - dataFetcher(undefined, getRootDocV2(), diagramStates, nodes, edges, true, look, classes); - nodes.forEach((node) => { - if (Array.isArray(node.label)) { - // add the rest as description - node.description = node.label.slice(1); - if (node.isGroup && node.description.length > 0) { - throw new Error( - 'Group nodes can only have label. Remove the additional description for node [' + - node.id + - ']' - ); - } - // add first description as label - node.label = node.label[0]; - } - }); -}; - -/** - * Function called by parser when a node definition has been found. - * - * @param {null | string} id - * @param {null | string} type - * @param {null | string} doc - * @param {null | string | string[]} descr - description for the state. Can be a string or a list or strings - * @param {null | string} note - * @param {null | string | string[]} classes - class styles to apply to this state. Can be a string (1 style) or an array of styles. If it's just 1 class, convert it to an array of that 1 class. - * @param {null | string | string[]} styles - styles to apply to this state. Can be a string (1 style) or an array of styles. If it's just 1 style, convert it to an array of that 1 style. - * @param {null | string | string[]} textStyles - text styles to apply to this state. Can be a string (1 text test) or an array of text styles. If it's just 1 text style, convert it to an array of that 1 text style. - */ -export const addState = function ( - id, - type = DEFAULT_STATE_TYPE, - doc = null, - descr = null, - note = null, - classes = null, - styles = null, - textStyles = null -) { - const trimmedId = id?.trim(); - // add the state if needed - if (!currentDocument.states.has(trimmedId)) { - log.info('Adding state ', trimmedId, descr); - currentDocument.states.set(trimmedId, { - id: trimmedId, - descriptions: [], - type, - doc, - note, - classes: [], - styles: [], - textStyles: [], - }); - } else { - if (!currentDocument.states.get(trimmedId).doc) { - currentDocument.states.get(trimmedId).doc = doc; - } - if (!currentDocument.states.get(trimmedId).type) { - currentDocument.states.get(trimmedId).type = type; - } + // Needed for JISON since it only supports direct properties + this.setRootDoc = this.setRootDoc.bind(this); + this.getDividerId = this.getDividerId.bind(this); + this.setDirection = this.setDirection.bind(this); + this.trimColon = this.trimColon.bind(this); } - if (descr) { - log.info('Setting state description', trimmedId, descr); - if (typeof descr === 'string') { - addDescription(trimmedId, descr.trim()); - } + /** + * @private + * @type {1 | 2} + */ + version; - if (typeof descr === 'object') { - descr.forEach((des) => addDescription(trimmedId, des.trim())); - } - } - - if (note) { - const doc2 = currentDocument.states.get(trimmedId); - doc2.note = note; - doc2.note.text = common.sanitizeText(doc2.note.text, getConfig()); - } - - if (classes) { - log.info('Setting state classes', trimmedId, classes); - const classesList = typeof classes === 'string' ? [classes] : classes; - classesList.forEach((cssClass) => setCssClass(trimmedId, cssClass.trim())); - } - - if (styles) { - log.info('Setting state styles', trimmedId, styles); - const stylesList = typeof styles === 'string' ? [styles] : styles; - stylesList.forEach((style) => setStyle(trimmedId, style.trim())); - } - - if (textStyles) { - log.info('Setting state styles', trimmedId, styles); - const textStylesList = typeof textStyles === 'string' ? [textStyles] : textStyles; - textStylesList.forEach((textStyle) => setTextStyle(trimmedId, textStyle.trim())); - } -}; - -export const clear = function (saveCommon) { + /** + * @private + * @type {Array} + */ nodes = []; + /** + * @private + * @type {Array} + */ edges = []; + + /** + * @private + * @type {Array} + */ + rootDoc = []; + /** + * @private + * @type {Map} + */ + classes = newClassesList(); // style classes defined by a classDef + + /** + * @private + * @type {Object} + */ documents = { root: newDoc(), }; - currentDocument = documents.root; - // number of start and end nodes; used to construct ids + /** + * @private + * @type {Object} + */ + currentDocument = this.documents.root; + /** + * @private + * @type {number} + */ startEndCount = 0; - classes = newClassesList(); - if (!saveCommon) { - commonClear(); + /** + * @private + * @type {number} + */ + dividerCnt = 0; + + static relationType = { + AGGREGATION: 0, + EXTENSION: 1, + COMPOSITION: 2, + DEPENDENCY: 3, + }; + + setRootDoc(o) { + log.info('Setting root doc', o); + // rootDoc = { id: 'root', doc: o }; + this.rootDoc = o; + if (this.version === 1) { + this.extract(o); + } else { + this.extract(this.getRootDocV2()); + } } -}; -export const getState = function (id) { - return currentDocument.states.get(id); -}; - -export const getStates = function () { - return currentDocument.states; -}; -export const logDocuments = function () { - log.info('Documents = ', documents); -}; -export const getRelations = function () { - return currentDocument.relations; -}; - -/** - * If the id is a start node ( [*] ), then return a new id constructed from - * the start node name and the current start node count. - * else return the given id - * - * @param {string} id - * @returns {string} - the id (original or constructed) - */ -function startIdIfNeeded(id = '') { - let fixedId = id; - if (id === START_NODE) { - startEndCount++; - fixedId = `${START_TYPE}${startEndCount}`; + getRootDoc() { + return this.rootDoc; } - return fixedId; -} -/** - * If the id is a start node ( [*] ), then return the start type ('start') - * else return the given type - * - * @param {string} id - * @param {string} type - * @returns {string} - the type that should be used - */ -function startTypeIfNeeded(id = '', type = DEFAULT_STATE_TYPE) { - return id === START_NODE ? START_TYPE : type; -} + /** + * @private + * @param {Object} parent + * @param {Object} node + * @param {boolean} first + */ + docTranslator(parent, node, first) { + if (node.stmt === STMT_RELATION) { + this.docTranslator(parent, node.state1, true); + this.docTranslator(parent, node.state2, false); + } else { + if (node.stmt === STMT_STATE) { + if (node.id === '[*]') { + node.id = first ? parent.id + '_start' : parent.id + '_end'; + node.start = first; + } else { + // This is just a plain state, not a start or end + node.id = node.id.trim(); + } + } -/** - * If the id is an end node ( [*] ), then return a new id constructed from - * the end node name and the current start_end node count. - * else return the given id - * - * @param {string} id - * @returns {string} - the id (original or constructed) - */ -function endIdIfNeeded(id = '') { - let fixedId = id; - if (id === END_NODE) { - startEndCount++; - fixedId = `${END_TYPE}${startEndCount}`; + if (node.doc) { + const doc = []; + // Check for concurrency + let currentDoc = []; + let i; + for (i = 0; i < node.doc.length; i++) { + if (node.doc[i].type === DIVIDER_TYPE) { + const newNode = clone(node.doc[i]); + newNode.doc = clone(currentDoc); + doc.push(newNode); + currentDoc = []; + } else { + currentDoc.push(node.doc[i]); + } + } + + // If any divider was encountered + if (doc.length > 0 && currentDoc.length > 0) { + const newNode = { + stmt: STMT_STATE, + id: generateId(), + type: 'divider', + doc: clone(currentDoc), + }; + doc.push(clone(newNode)); + node.doc = doc; + } + + node.doc.forEach((docNode) => this.docTranslator(node, docNode, true)); + } + } } - return fixedId; -} -/** - * If the id is an end node ( [*] ), then return the end type - * else return the given type - * - * @param {string} id - * @param {string} type - * @returns {string} - the type that should be used - */ -function endTypeIfNeeded(id = '', type = DEFAULT_STATE_TYPE) { - return id === END_NODE ? END_TYPE : type; -} + /** + * @private + */ + getRootDocV2() { + this.docTranslator({ id: 'root' }, { id: 'root', doc: this.rootDoc }, true); + return { id: 'root', doc: this.rootDoc }; + // Here + } -/** - * - * @param item1 - * @param item2 - * @param relationTitle - */ -export function addRelationObjs(item1, item2, relationTitle) { - let id1 = startIdIfNeeded(item1.id.trim()); - let type1 = startTypeIfNeeded(item1.id.trim(), item1.type); - let id2 = startIdIfNeeded(item2.id.trim()); - let type2 = startTypeIfNeeded(item2.id.trim(), item2.type); + /** + * Convert all of the statements (stmts) that were parsed into states and relationships. + * This is done because a state diagram may have nested sections, + * where each section is a 'document' and has its own set of statements. + * Ex: the section within a fork has its own statements, and incoming and outgoing statements + * refer to the fork as a whole (document). + * See the parser grammar: the definition of a document is a document then a 'line', where a line can be a statement. + * This will push the statement into the list of statements for the current document. + * @private + * @param _doc + */ + extract(_doc) { + // const res = { states: [], relations: [] }; + let doc; + if (_doc.doc) { + doc = _doc.doc; + } else { + doc = _doc; + } + // let doc = root.doc; + // if (!doc) { + // doc = root; + // } + log.info(doc); + this.clear(true); + log.info('Extract initial document:', doc); + + doc.forEach((item) => { + log.warn('Statement', item.stmt); + switch (item.stmt) { + case STMT_STATE: + this.addState( + item.id.trim(), + item.type, + item.doc, + item.description, + item.note, + item.classes, + item.styles, + item.textStyles + ); + break; + case STMT_RELATION: + this.addRelation(item.state1, item.state2, item.description); + break; + case STMT_CLASSDEF: + this.addStyleClass(item.id.trim(), item.classes); + break; + case STMT_STYLEDEF: + { + const ids = item.id.trim().split(','); + const styles = item.styleClass.split(','); + ids.forEach((id) => { + let foundState = this.getState(id); + if (foundState === undefined) { + const trimmedId = id.trim(); + this.addState(trimmedId); + foundState = this.getState(trimmedId); + } + foundState.styles = styles.map((s) => s.replace(/;/g, '')?.trim()); + }); + } + break; + case STMT_APPLYCLASS: + this.setCssClass(item.id.trim(), item.styleClass); + break; + } + }); + + const diagramStates = this.getStates(); + const config = getConfig(); + const look = config.look; + + resetDataFetching(); + dataFetcher( + undefined, + this.getRootDocV2(), + diagramStates, + this.nodes, + this.edges, + true, + look, + this.classes + ); + this.nodes.forEach((node) => { + if (Array.isArray(node.label)) { + // add the rest as description + node.description = node.label.slice(1); + if (node.isGroup && node.description.length > 0) { + throw new Error( + 'Group nodes can only have label. Remove the additional description for node [' + + node.id + + ']' + ); + } + // add first description as label + node.label = node.label[0]; + } + }); + } + + /** + * Function called by parser when a node definition has been found. + * + * @param {null | string} id + * @param {null | string} type + * @param {null | string} doc + * @param {null | string | string[]} descr - description for the state. Can be a string or a list or strings + * @param {null | string} note + * @param {null | string | string[]} classes - class styles to apply to this state. Can be a string (1 style) or an array of styles. If it's just 1 class, convert it to an array of that 1 class. + * @param {null | string | string[]} styles - styles to apply to this state. Can be a string (1 style) or an array of styles. If it's just 1 style, convert it to an array of that 1 style. + * @param {null | string | string[]} textStyles - text styles to apply to this state. Can be a string (1 text test) or an array of text styles. If it's just 1 text style, convert it to an array of that 1 text style. + */ addState( - id1, - type1, - item1.doc, - item1.description, - item1.note, - item1.classes, - item1.styles, - item1.textStyles - ); - addState( - id2, - type2, - item2.doc, - item2.description, - item2.note, - item2.classes, - item2.styles, - item2.textStyles - ); + id, + type = DEFAULT_STATE_TYPE, + doc = null, + descr = null, + note = null, + classes = null, + styles = null, + textStyles = null + ) { + const trimmedId = id?.trim(); + // add the state if needed + if (!this.currentDocument.states.has(trimmedId)) { + log.info('Adding state ', trimmedId, descr); + this.currentDocument.states.set(trimmedId, { + id: trimmedId, + descriptions: [], + type, + doc, + note, + classes: [], + styles: [], + textStyles: [], + }); + } else { + if (!this.currentDocument.states.get(trimmedId).doc) { + this.currentDocument.states.get(trimmedId).doc = doc; + } + if (!this.currentDocument.states.get(trimmedId).type) { + this.currentDocument.states.get(trimmedId).type = type; + } + } - currentDocument.relations.push({ - id1, - id2, - relationTitle: common.sanitizeText(relationTitle, getConfig()), - }); -} + if (descr) { + log.info('Setting state description', trimmedId, descr); + if (typeof descr === 'string') { + this.addDescription(trimmedId, descr.trim()); + } -/** - * Add a relation between two items. The items may be full objects or just the string id of a state. - * - * @param {string | object} item1 - * @param {string | object} item2 - * @param {string} title - */ -export const addRelation = function (item1, item2, title) { - if (typeof item1 === 'object') { - addRelationObjs(item1, item2, title); - } else { - const id1 = startIdIfNeeded(item1.trim()); - const type1 = startTypeIfNeeded(item1); - const id2 = endIdIfNeeded(item2.trim()); - const type2 = endTypeIfNeeded(item2); + if (typeof descr === 'object') { + descr.forEach((des) => this.addDescription(trimmedId, des.trim())); + } + } - addState(id1, type1); - addState(id2, type2); - currentDocument.relations.push({ + if (note) { + const doc2 = this.currentDocument.states.get(trimmedId); + doc2.note = note; + doc2.note.text = common.sanitizeText(doc2.note.text, getConfig()); + } + + if (classes) { + log.info('Setting state classes', trimmedId, classes); + const classesList = typeof classes === 'string' ? [classes] : classes; + classesList.forEach((cssClass) => this.setCssClass(trimmedId, cssClass.trim())); + } + + if (styles) { + log.info('Setting state styles', trimmedId, styles); + const stylesList = typeof styles === 'string' ? [styles] : styles; + stylesList.forEach((style) => this.setStyle(trimmedId, style.trim())); + } + + if (textStyles) { + log.info('Setting state styles', trimmedId, styles); + const textStylesList = typeof textStyles === 'string' ? [textStyles] : textStyles; + textStylesList.forEach((textStyle) => this.setTextStyle(trimmedId, textStyle.trim())); + } + } + + clear(saveCommon) { + this.nodes = []; + this.edges = []; + this.documents = { + root: newDoc(), + }; + this.currentDocument = this.documents.root; + + // number of start and end nodes; used to construct ids + this.startEndCount = 0; + this.classes = newClassesList(); + if (!saveCommon) { + commonClear(); + } + } + + getState(id) { + return this.currentDocument.states.get(id); + } + getStates() { + return this.currentDocument.states; + } + logDocuments() { + log.info('Documents = ', this.documents); + } + getRelations() { + return this.currentDocument.relations; + } + + /** + * If the id is a start node ( [*] ), then return a new id constructed from + * the start node name and the current start node count. + * else return the given id + * + * @param {string} id + * @returns {string} - the id (original or constructed) + * @private + */ + startIdIfNeeded(id = '') { + let fixedId = id; + if (id === START_NODE) { + this.startEndCount++; + fixedId = `${START_TYPE}${this.startEndCount}`; + } + return fixedId; + } + + /** + * If the id is a start node ( [*] ), then return the start type ('start') + * else return the given type + * + * @param {string} id + * @param {string} type + * @returns {string} - the type that should be used + * @private + */ + startTypeIfNeeded(id = '', type = DEFAULT_STATE_TYPE) { + return id === START_NODE ? START_TYPE : type; + } + + /** + * If the id is an end node ( [*] ), then return a new id constructed from + * the end node name and the current start_end node count. + * else return the given id + * + * @param {string} id + * @returns {string} - the id (original or constructed) + * @private + */ + endIdIfNeeded(id = '') { + let fixedId = id; + if (id === END_NODE) { + this.startEndCount++; + fixedId = `${END_TYPE}${this.startEndCount}`; + } + return fixedId; + } + + /** + * If the id is an end node ( [*] ), then return the end type + * else return the given type + * + * @param {string} id + * @param {string} type + * @returns {string} - the type that should be used + * @private + */ + endTypeIfNeeded(id = '', type = DEFAULT_STATE_TYPE) { + return id === END_NODE ? END_TYPE : type; + } + + /** + * + * @param item1 + * @param item2 + * @param relationTitle + */ + addRelationObjs(item1, item2, relationTitle) { + let id1 = this.startIdIfNeeded(item1.id.trim()); + let type1 = this.startTypeIfNeeded(item1.id.trim(), item1.type); + let id2 = this.startIdIfNeeded(item2.id.trim()); + let type2 = this.startTypeIfNeeded(item2.id.trim(), item2.type); + + this.addState( + id1, + type1, + item1.doc, + item1.description, + item1.note, + item1.classes, + item1.styles, + item1.textStyles + ); + this.addState( + id2, + type2, + item2.doc, + item2.description, + item2.note, + item2.classes, + item2.styles, + item2.textStyles + ); + + this.currentDocument.relations.push({ id1, id2, - title: common.sanitizeText(title, getConfig()), + relationTitle: common.sanitizeText(relationTitle, getConfig()), }); } -}; -export const addDescription = function (id, descr) { - const theState = currentDocument.states.get(id); - const _descr = descr.startsWith(':') ? descr.replace(':', '').trim() : descr; - theState.descriptions.push(common.sanitizeText(_descr, getConfig())); -}; + /** + * Add a relation between two items. The items may be full objects or just the string id of a state. + * + * @param {string | object} item1 + * @param {string | object} item2 + * @param {string} title + */ + addRelation(item1, item2, title) { + if (typeof item1 === 'object') { + this.addRelationObjs(item1, item2, title); + } else { + const id1 = this.startIdIfNeeded(item1.trim()); + const type1 = this.startTypeIfNeeded(item1); + const id2 = this.endIdIfNeeded(item2.trim()); + const type2 = this.endTypeIfNeeded(item2); -export const cleanupLabel = function (label) { - if (label.substring(0, 1) === ':') { - return label.substr(2).trim(); - } else { - return label.trim(); - } -}; - -const getDividerId = () => { - dividerCnt++; - return 'divider-id-' + dividerCnt; -}; - -/** - * Called when the parser comes across a (style) class definition - * @example classDef my-style fill:#f96; - * - * @param {string} id - the id of this (style) class - * @param {string | null} styleAttributes - the string with 1 or more style attributes (each separated by a comma) - */ -export const addStyleClass = function (id, styleAttributes = '') { - // create a new style class object with this id - if (!classes.has(id)) { - classes.set(id, { id: id, styles: [], textStyles: [] }); // This is a classDef - } - const foundClass = classes.get(id); - if (styleAttributes !== undefined && styleAttributes !== null) { - styleAttributes.split(STYLECLASS_SEP).forEach((attrib) => { - // remove any trailing ; - const fixedAttrib = attrib.replace(/([^;]*);/, '$1').trim(); - - // replace some style keywords - if (RegExp(COLOR_KEYWORD).exec(attrib)) { - const newStyle1 = fixedAttrib.replace(FILL_KEYWORD, BG_FILL); - const newStyle2 = newStyle1.replace(COLOR_KEYWORD, FILL_KEYWORD); - foundClass.textStyles.push(newStyle2); - } - foundClass.styles.push(fixedAttrib); - }); - } -}; - -/** - * Return all of the style classes - * @returns {{} | any | classes} - */ -export const getClasses = function () { - return classes; -}; - -/** - * Add a (style) class or css class to a state with the given id. - * If the state isn't already in the list of known states, add it. - * Might be called by parser when a style class or CSS class should be applied to a state - * - * @param {string | string[]} itemIds The id or a list of ids of the item(s) to apply the css class to - * @param {string} cssClassName CSS class name - */ -export const setCssClass = function (itemIds, cssClassName) { - itemIds.split(',').forEach(function (id) { - let foundState = getState(id); - if (foundState === undefined) { - const trimmedId = id.trim(); - addState(trimmedId); - foundState = getState(trimmedId); + this.addState(id1, type1); + this.addState(id2, type2); + this.currentDocument.relations.push({ + id1, + id2, + title: common.sanitizeText(title, getConfig()), + }); } - foundState.classes.push(cssClassName); - }); -}; - -/** - * Add a style to a state with the given id. - * @example style stateId fill:#f9f,stroke:#333,stroke-width:4px - * where 'style' is the keyword - * stateId is the id of a state - * the rest of the string is the styleText (all of the attributes to be applied to the state) - * - * @param itemId The id of item to apply the style to - * @param styleText - the text of the attributes for the style - */ -export const setStyle = function (itemId, styleText) { - const item = getState(itemId); - if (item !== undefined) { - item.styles.push(styleText); } -}; -/** - * Add a text style to a state with the given id - * - * @param itemId The id of item to apply the css class to - * @param cssClassName CSS class name - */ -export const setTextStyle = function (itemId, cssClassName) { - const item = getState(itemId); - if (item !== undefined) { - item.textStyles.push(cssClassName); + addDescription(id, descr) { + const theState = this.currentDocument.states.get(id); + const _descr = descr.startsWith(':') ? descr.replace(':', '').trim() : descr; + theState.descriptions.push(common.sanitizeText(_descr, getConfig())); } -}; -const getDirection = () => direction; -const setDirection = (dir) => { - direction = dir; -}; + cleanupLabel(label) { + if (label.substring(0, 1) === ':') { + return label.substr(2).trim(); + } else { + return label.trim(); + } + } -const trimColon = (str) => (str && str[0] === ':' ? str.substr(1).trim() : str.trim()); + getDividerId() { + this.dividerCnt++; + return 'divider-id-' + this.dividerCnt; + } -export const getData = () => { - const config = getConfig(); - return { nodes, edges, other: {}, config, direction: getDir(getRootDocV2()) }; -}; + /** + * Called when the parser comes across a (style) class definition + * @example classDef my-style fill:#f96; + * + * @param {string} id - the id of this (style) class + * @param {string | null} styleAttributes - the string with 1 or more style attributes (each separated by a comma) + */ + addStyleClass(id, styleAttributes = '') { + // create a new style class object with this id + if (!this.classes.has(id)) { + this.classes.set(id, { id: id, styles: [], textStyles: [] }); // This is a classDef + } + const foundClass = this.classes.get(id); + if (styleAttributes !== undefined && styleAttributes !== null) { + styleAttributes.split(STYLECLASS_SEP).forEach((attrib) => { + // remove any trailing ; + const fixedAttrib = attrib.replace(/([^;]*);/, '$1').trim(); -export default { - getConfig: () => getConfig().state, - getData, - addState, - clear, - getState, - getStates, - getRelations, - getClasses, - getDirection, - addRelation, - getDividerId, - setDirection, - cleanupLabel, - lineType, - relationType, - logDocuments, - getRootDoc, - setRootDoc, - getRootDocV2, - extract, - trimColon, - getAccTitle, - setAccTitle, - getAccDescription, - setAccDescription, - addStyleClass, - setCssClass, - addDescription, - setDiagramTitle, - getDiagramTitle, -}; + // replace some style keywords + if (RegExp(COLOR_KEYWORD).exec(attrib)) { + const newStyle1 = fixedAttrib.replace(FILL_KEYWORD, BG_FILL); + const newStyle2 = newStyle1.replace(COLOR_KEYWORD, FILL_KEYWORD); + foundClass.textStyles.push(newStyle2); + } + foundClass.styles.push(fixedAttrib); + }); + } + } + + /** + * Return all of the style classes + * @returns {{} | any | classes} + */ + getClasses() { + return this.classes; + } + + /** + * Add a (style) class or css class to a state with the given id. + * If the state isn't already in the list of known states, add it. + * Might be called by parser when a style class or CSS class should be applied to a state + * + * @param {string | string[]} itemIds The id or a list of ids of the item(s) to apply the css class to + * @param {string} cssClassName CSS class name + */ + setCssClass(itemIds, cssClassName) { + itemIds.split(',').forEach((id) => { + let foundState = this.getState(id); + if (foundState === undefined) { + const trimmedId = id.trim(); + this.addState(trimmedId); + foundState = this.getState(trimmedId); + } + foundState.classes.push(cssClassName); + }); + } + + /** + * Add a style to a state with the given id. + * @example style stateId fill:#f9f,stroke:#333,stroke-width:4px + * where 'style' is the keyword + * stateId is the id of a state + * the rest of the string is the styleText (all of the attributes to be applied to the state) + * + * @param itemId The id of item to apply the style to + * @param styleText - the text of the attributes for the style + */ + setStyle(itemId, styleText) { + const item = this.getState(itemId); + if (item !== undefined) { + item.styles.push(styleText); + } + } + + /** + * Add a text style to a state with the given id + * + * @param itemId The id of item to apply the css class to + * @param cssClassName CSS class name + */ + setTextStyle(itemId, cssClassName) { + const item = this.getState(itemId); + if (item !== undefined) { + item.textStyles.push(cssClassName); + } + } + + /** + * Finds the direction statement in the root document. + * @private + * @returns {{ value: string } | undefined} - the direction statement if present + */ + getDirectionStatement() { + return this.rootDoc.find((doc) => doc.stmt === STMT_DIRECTION); + } + + getDirection() { + return this.getDirectionStatement()?.value ?? DEFAULT_DIAGRAM_DIRECTION; + } + + setDirection(dir) { + const doc = this.getDirectionStatement(); + if (doc) { + doc.value = dir; + } else { + this.rootDoc.unshift({ stmt: STMT_DIRECTION, value: dir }); + } + } + + trimColon(str) { + return str && str[0] === ':' ? str.substr(1).trim() : str.trim(); + } + + getData() { + const config = getConfig(); + return { + nodes: this.nodes, + edges: this.edges, + other: {}, + config, + direction: getDir(this.getRootDocV2()), + }; + } + + getConfig() { + return getConfig().state; + } + getAccTitle = getAccTitle; + setAccTitle = setAccTitle; + getAccDescription = getAccDescription; + setAccDescription = setAccDescription; + setDiagramTitle = setDiagramTitle; + getDiagramTitle = getDiagramTitle; +} diff --git a/packages/mermaid/src/diagrams/state/stateDb.spec.js b/packages/mermaid/src/diagrams/state/stateDb.spec.js index ff0581200..783b9212c 100644 --- a/packages/mermaid/src/diagrams/state/stateDb.spec.js +++ b/packages/mermaid/src/diagrams/state/stateDb.spec.js @@ -1,8 +1,9 @@ -import stateDb from './stateDb.js'; +import { StateDB } from './stateDb.js'; describe('State Diagram stateDb', () => { + let stateDb; beforeEach(() => { - stateDb.clear(); + stateDb = new StateDB(1); }); describe('addStyleClass', () => { @@ -20,8 +21,9 @@ describe('State Diagram stateDb', () => { }); describe('addDescription to a state', () => { + let stateDb; beforeEach(() => { - stateDb.clear(); + stateDb = new StateDB(1); stateDb.addState('state1'); }); @@ -73,3 +75,25 @@ describe('State Diagram stateDb', () => { }); }); }); + +describe('state db class', () => { + let stateDb; + beforeEach(() => { + stateDb = new StateDB(1); + }); + // This is to ensure that functions used in state JISON are exposed as function from StateDb + it('should have functions used in flow JISON as own property', () => { + const functionsUsedInParser = [ + 'setRootDoc', + 'trimColon', + 'getDividerId', + 'setAccTitle', + 'setAccDescription', + 'setDirection', + ]; + + for (const fun of functionsUsedInParser) { + expect(Object.hasOwn(stateDb, fun)).toBe(true); + } + }); +}); diff --git a/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js b/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js index 53063f41a..a79e44d5d 100644 --- a/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js +++ b/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js @@ -1,11 +1,13 @@ -import { parser } from './parser/stateDiagram.jison'; -import stateDb from './stateDb.js'; -import stateDiagram from './parser/stateDiagram.jison'; +import stateDiagram, { parser } from './parser/stateDiagram.jison'; +import { DEFAULT_DIAGRAM_DIRECTION } from './stateCommon.js'; +import { StateDB } from './stateDb.js'; describe('state diagram V2, ', function () { // TODO - these examples should be put into ./parser/stateDiagram.spec.js describe('when parsing an info graph it', function () { + let stateDb; beforeEach(function () { + stateDb = new StateDB(2); parser.yy = stateDb; stateDiagram.parser.yy = stateDb; stateDiagram.parser.yy.clear(); @@ -127,7 +129,6 @@ describe('state diagram V2, ', function () { `; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const rels = stateDb.getRelations(); const rel_1_2 = rels.find((rel) => rel.id1 === 'State1' && rel.id2 === 'State2'); @@ -402,7 +403,6 @@ describe('state diagram V2, ', function () { `; stateDiagram.parser.parse(diagram); - stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2()); const states = stateDb.getStates(); expect(states.get('Active').doc[0].id).toEqual('Idle'); @@ -413,5 +413,34 @@ describe('state diagram V2, ', function () { const rel_Active_Active = rels.find((rel) => rel.id1 === 'Active' && rel.id2 === 'Active'); expect(rel_Active_Active.relationTitle).toEqual('LOG'); }); + + it('should check default diagram direction', () => { + const diagram = ` + stateDiagram + [*] --> Still + Still --> [*] + `; + + parser.parse(diagram); + + // checking default direction if no direction is specified + const defaultDir = stateDb.getDirection(); + expect(defaultDir).toEqual(DEFAULT_DIAGRAM_DIRECTION); + }); + + it('retrieve the diagram direction correctly', () => { + const diagram = ` + stateDiagram + direction LR + [*] --> Still + Still --> [*] + `; + + parser.parse(diagram); + + //retrieve the diagram direction + const currentDirection = stateDb.getDirection(); + expect(currentDirection).toEqual('LR'); + }); }); }); diff --git a/packages/mermaid/src/diagrams/state/stateDiagram-v2.ts b/packages/mermaid/src/diagrams/state/stateDiagram-v2.ts index 8fd98e930..b0309fa84 100644 --- a/packages/mermaid/src/diagrams/state/stateDiagram-v2.ts +++ b/packages/mermaid/src/diagrams/state/stateDiagram-v2.ts @@ -1,13 +1,15 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore: JISON doesn't support types import parser from './parser/stateDiagram.jison'; -import db from './stateDb.js'; +import { StateDB } from './stateDb.js'; import styles from './styles.js'; import renderer from './stateRenderer-v3-unified.js'; export const diagram: DiagramDefinition = { parser, - db, + get db() { + return new StateDB(2); + }, renderer, styles, init: (cnf) => { diff --git a/packages/mermaid/src/diagrams/state/stateDiagram.spec.js b/packages/mermaid/src/diagrams/state/stateDiagram.spec.js index 7fcf4d0a6..362c86ccd 100644 --- a/packages/mermaid/src/diagrams/state/stateDiagram.spec.js +++ b/packages/mermaid/src/diagrams/state/stateDiagram.spec.js @@ -1,9 +1,11 @@ import { parser } from './parser/stateDiagram.jison'; -import stateDb from './stateDb.js'; +import { StateDB } from './stateDb.js'; describe('state diagram, ', function () { describe('when parsing an info graph it', function () { + let stateDb; beforeEach(function () { + stateDb = new StateDB(1); parser.yy = stateDb; }); diff --git a/packages/mermaid/src/diagrams/state/stateDiagram.ts b/packages/mermaid/src/diagrams/state/stateDiagram.ts index bd8383287..50d313e76 100644 --- a/packages/mermaid/src/diagrams/state/stateDiagram.ts +++ b/packages/mermaid/src/diagrams/state/stateDiagram.ts @@ -1,13 +1,15 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore: JISON doesn't support types import parser from './parser/stateDiagram.jison'; -import db from './stateDb.js'; +import { StateDB } from './stateDb.js'; import styles from './styles.js'; import renderer from './stateRenderer.js'; export const diagram: DiagramDefinition = { parser, - db, + get db() { + return new StateDB(1); + }, renderer, styles, init: (cnf) => { diff --git a/packages/mermaid/src/diagrams/state/stateRenderer-v3-unified.ts b/packages/mermaid/src/diagrams/state/stateRenderer-v3-unified.ts index 109417c03..2998c8173 100644 --- a/packages/mermaid/src/diagrams/state/stateRenderer-v3-unified.ts +++ b/packages/mermaid/src/diagrams/state/stateRenderer-v3-unified.ts @@ -36,7 +36,6 @@ export const getClasses = function ( text: string, diagramObj: any ): Map { - diagramObj.db.extract(diagramObj.db.getRootDocV2()); return diagramObj.db.getClasses(); }; diff --git a/packages/mermaid/src/diagrams/state/stateRenderer.js b/packages/mermaid/src/diagrams/state/stateRenderer.js index 17b674cb5..e621e9c13 100644 --- a/packages/mermaid/src/diagrams/state/stateRenderer.js +++ b/packages/mermaid/src/diagrams/state/stateRenderer.js @@ -136,7 +136,6 @@ const renderDoc = (doc, diagram, parentId, altBkg, root, domDocument, diagObj) = return {}; }); - diagObj.db.extract(doc); const states = diagObj.db.getStates(); const relations = diagObj.db.getRelations(); diff --git a/packages/mermaid/src/diagrams/xychart/parser/xychart.jison.spec.ts b/packages/mermaid/src/diagrams/xychart/parser/xychart.jison.spec.ts index d113250aa..2c2c0b4b9 100644 --- a/packages/mermaid/src/diagrams/xychart/parser/xychart.jison.spec.ts +++ b/packages/mermaid/src/diagrams/xychart/parser/xychart.jison.spec.ts @@ -9,7 +9,7 @@ const parserFnConstructor = (str: string) => { }; }; -const mockDB: Record> = { +const mockDB: Record> = { setOrientation: vi.fn(), setDiagramTitle: vi.fn(), setXAxisTitle: vi.fn(), diff --git a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue index 5006ed022..5dc50ee0e 100644 --- a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue +++ b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue @@ -16,7 +16,7 @@ import { teamMembers } from '../contributors';


- Join the community + Join the community and get involved!

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue index 4b1b250bb..94c32d840 100644 --- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue +++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue @@ -1,40 +1,114 @@