8 | graph TD 9 | A --> B["<a href='javascript#9;t#colon;alert(document.location)'>AAA</a>"] 10 |11 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /.lintstagedrc.mjs: -------------------------------------------------------------------------------- 1 | export default { 2 | '!(docs/**/*)*.{ts,js,html,md,mts}': [ 3 | 'eslint --cache --cache-strategy content --fix', 4 | // don't cache prettier yet, since we use `prettier-plugin-jsdoc`, 5 | // and prettier doesn't invalidate cache on plugin updates" 6 | // https://prettier.io/docs/en/cli.html#--cache 7 | 'prettier --write', 8 | ], 9 | '.cspell/*.txt': ['tsx scripts/fixCSpell.ts'], 10 | '**/*.jison': ['pnpm -w run lint:jison'], 11 | }; 12 | -------------------------------------------------------------------------------- /packages/mermaid/src/dagre-wrapper/intersect/index.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Borrowed with love from dagre-d3. Many thanks to cpettitt! 3 | */ 4 | 5 | import node from './intersect-node.js'; 6 | import circle from './intersect-circle.js'; 7 | import ellipse from './intersect-ellipse.js'; 8 | import polygon from './intersect-polygon.js'; 9 | import rect from './intersect-rect.js'; 10 | 11 | export default { 12 | node, 13 | circle, 14 | ellipse, 15 | polygon, 16 | rect, 17 | }; 18 | -------------------------------------------------------------------------------- /packages/mermaid/src/diagrams/common/populateCommonDb.ts: -------------------------------------------------------------------------------- 1 | import type { DiagramAST } from '@mermaid-js/parser'; 2 | import type { DiagramDB } from '../../diagram-api/types.js'; 3 | 4 | export function populateCommonDb(ast: DiagramAST, db: DiagramDB) { 5 | if (ast.accDescr) { 6 | db.setAccDescription?.(ast.accDescr); 7 | } 8 | if (ast.accTitle) { 9 | db.setAccTitle?.(ast.accTitle); 10 | } 11 | if (ast.title) { 12 | db.setDiagramTitle?.(ast.title); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /cypress/integration/rendering/current.spec.js: -------------------------------------------------------------------------------- 1 | import { imgSnapshotTest } from '../../helpers/util.ts'; 2 | 3 | describe('Current diagram', () => { 4 | it('should render a state with states in it', () => { 5 | imgSnapshotTest( 6 | ` 7 | stateDiagram 8 | state PersonalizedCockpit { 9 | Other 10 | state Parent { 11 | C 12 | } 13 | } 14 | `, 15 | { 16 | logLevel: 0, 17 | } 18 | ); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /docs/config/setup/defaultConfig/README.md: -------------------------------------------------------------------------------- 1 | > **Warning** 2 | > 3 | > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT. 4 | > 5 | > ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/README.md](../../../../packages/mermaid/src/docs/config/setup/defaultConfig/README.md). 6 | 7 | [**mermaid**](../README.md) 8 | 9 | --- 10 | 11 | # defaultConfig 12 | 13 | ## Variables 14 | 15 | - [configKeys](variables/configKeys.md) 16 | - [default](variables/default.md) 17 | -------------------------------------------------------------------------------- /docs/public/icons/open-source.svg: -------------------------------------------------------------------------------- 1 | 12 | -------------------------------------------------------------------------------- /packages/examples/src/examples/pie.ts: -------------------------------------------------------------------------------- 1 | import type { DiagramMetadata } from '../types.js'; 2 | 3 | export default { 4 | id: 'pie', 5 | name: 'Pie Chart', 6 | description: 'Visualize data as proportional segments of a circle', 7 | examples: [ 8 | { 9 | title: 'Basic Pie Chart', 10 | isDefault: true, 11 | code: `pie title Pets adopted by volunteers 12 | "Dogs" : 386 13 | "Cats" : 85 14 | "Rats" : 15`, 15 | }, 16 | ], 17 | } satisfies DiagramMetadata; 18 | -------------------------------------------------------------------------------- /packages/mermaid-zenuml/src/detector.ts: -------------------------------------------------------------------------------- 1 | import type { ExternalDiagramDefinition } from 'mermaid'; 2 | 3 | const id = 'zenuml'; 4 | 5 | const detector = (txt: string) => { 6 | return /^\s*zenuml/.test(txt); 7 | }; 8 | 9 | const loader = async () => { 10 | const { diagram } = await import('./zenuml-definition.js'); 11 | return { id, diagram }; 12 | }; 13 | 14 | const plugin: ExternalDiagramDefinition = { 15 | id, 16 | detector, 17 | loader, 18 | }; 19 | 20 | export default plugin; 21 | -------------------------------------------------------------------------------- /packages/mermaid/src/diagrams/flowchart/parser/flowParser.ts: -------------------------------------------------------------------------------- 1 | // @ts-ignore: JISON doesn't support types 2 | import flowJisonParser from './flow.jison'; 3 | 4 | const newParser = Object.assign({}, flowJisonParser); 5 | 6 | newParser.parse = (src: string): unknown => { 7 | // remove the trailing whitespace after closing curly braces when ending a line break 8 | const newSrc = src.replace(/}\s*\n/g, '}\n'); 9 | return flowJisonParser.parse(newSrc); 10 | }; 11 | 12 | export default newParser; 13 | -------------------------------------------------------------------------------- /packages/mermaid/src/rendering-util/rendering-elements/intersect/index.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Borrowed with love from dagre-d3. Many thanks to cpettitt! 3 | */ 4 | 5 | import node from './intersect-node.js'; 6 | import circle from './intersect-circle.js'; 7 | import ellipse from './intersect-ellipse.js'; 8 | import polygon from './intersect-polygon.js'; 9 | import rect from './intersect-rect.js'; 10 | 11 | export default { 12 | node, 13 | circle, 14 | ellipse, 15 | polygon, 16 | rect, 17 | }; 18 | -------------------------------------------------------------------------------- /packages/mermaid/src/rendering-util/rendering-elements/shapes/state.ts: -------------------------------------------------------------------------------- 1 | import type { Node, RectOptions } from '../../types.js'; 2 | import type { D3Selection } from '../../../types.js'; 3 | import { drawRect } from './drawRect.js'; 4 | 5 | export async function state
4 | graph TB 5 | a --> b 6 | a --> c 7 | b --> d 8 | c --> d 9 |10 | 11 | 12 | 13 | 14 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /packages/examples/src/examples/architecture.ts: -------------------------------------------------------------------------------- 1 | import type { DiagramMetadata } from '../types.js'; 2 | 3 | export default { 4 | id: 'architecture', 5 | name: 'Architecture Diagram', 6 | description: 'Visualize system architecture and components', 7 | examples: [ 8 | { 9 | title: 'Basic System Architecture', 10 | isDefault: true, 11 | code: `architecture-beta 12 | group api(cloud)[API] 13 | 14 | service db(database)[Database] in api 15 | service disk1(disk)[Storage] in api 16 | service disk2(disk)[Storage] in api 17 | service server(server)[Server] in api 18 | 19 | db:L -- R:server 20 | disk1:T -- B:server 21 | disk2:T -- B:db`, 22 | }, 23 | ], 24 | } satisfies DiagramMetadata; 25 | -------------------------------------------------------------------------------- /packages/examples/src/examples/xychart.ts: -------------------------------------------------------------------------------- 1 | import type { DiagramMetadata } from '../types.js'; 2 | 3 | export default { 4 | id: 'xychart', 5 | name: 'XY Chart', 6 | description: 'Create scatter plots and line charts with customizable axes', 7 | examples: [ 8 | { 9 | title: 'Sales Revenue', 10 | isDefault: true, 11 | code: `xychart-beta 12 | title "Sales Revenue" 13 | x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec] 14 | y-axis "Revenue (in $)" 4000 --> 11000 15 | bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000] 16 | line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]`, 17 | }, 18 | ], 19 | } satisfies DiagramMetadata; 20 | -------------------------------------------------------------------------------- /packages/mermaid/src/docs/.vitepress/components/Contributors.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 |
4 | flowchart-elk
5 | a[hello] --> b[world]
6 | b --> c{test}
7 | c --> one
8 | c --> two
9 | c --> three
10 |
11 |
12 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/packages/mermaid/src/dagre-wrapper/intersect/intersect-ellipse.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @param node
3 | * @param rx
4 | * @param ry
5 | * @param point
6 | */
7 | function intersectEllipse(node, rx, ry, point) {
8 | // Formulae from: https://mathworld.wolfram.com/Ellipse-LineIntersection.html
9 |
10 | var cx = node.x;
11 | var cy = node.y;
12 |
13 | var px = cx - point.x;
14 | var py = cy - point.y;
15 |
16 | var det = Math.sqrt(rx * rx * py * py + ry * ry * px * px);
17 |
18 | var dx = Math.abs((rx * ry * px) / det);
19 | if (point.x < cx) {
20 | dx = -dx;
21 | }
22 | var dy = Math.abs((rx * ry * py) / det);
23 | if (point.y < cy) {
24 | dy = -dy;
25 | }
26 |
27 | return { x: cx + dx, y: cy + dy };
28 | }
29 |
30 | export default intersectEllipse;
31 |
--------------------------------------------------------------------------------
/packages/parser/src/language/architecture/valueConverter.ts:
--------------------------------------------------------------------------------
1 | import type { CstNode, GrammarAST, ValueType } from 'langium';
2 |
3 | import { AbstractMermaidValueConverter } from '../common/index.js';
4 |
5 | export class ArchitectureValueConverter extends AbstractMermaidValueConverter {
6 | protected runCustomConverter(
7 | rule: GrammarAST.AbstractRule,
8 | input: string,
9 | _cstNode: CstNode
10 | ): ValueType | undefined {
11 | if (rule.name === 'ARCH_ICON') {
12 | return input.replace(/[()]/g, '').trim();
13 | } else if (rule.name === 'ARCH_TEXT_ICON') {
14 | return input.replace(/["()]/g, '');
15 | } else if (rule.name === 'ARCH_TITLE') {
16 | return input.replace(/[[\]]/g, '').trim();
17 | }
18 | return undefined;
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/docs/config/setup/config/functions/getUserDefinedConfig.md:
--------------------------------------------------------------------------------
1 | > **Warning**
2 | >
3 | > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
4 | >
5 | > ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/getUserDefinedConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/getUserDefinedConfig.md).
6 |
7 | [**mermaid**](../../README.md)
8 |
9 | ---
10 |
11 | # Function: getUserDefinedConfig()
12 |
13 | > **getUserDefinedConfig**(): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
14 |
15 | Defined in: [packages/mermaid/src/config.ts:252](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L252)
16 |
17 | ## Returns
18 |
19 | [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
20 |
--------------------------------------------------------------------------------
/netlify.toml:
--------------------------------------------------------------------------------
1 | # Settings in the [build] context are global and are applied to
2 | # all contexts unless otherwise overridden by more specific contexts.
3 | [build]
4 | # Directory where the build system installs dependencies
5 | # and runs your build. Store your package.json, .nvmrc, etc here.
6 | # If not set, defaults to the root directory.
7 | base = ""
8 |
9 | # Directory that contains the deploy-ready HTML files and
10 | # assets generated by the build. This is an absolute path relative
11 | # to the base directory, which is the root by default (/).
12 | # This sample publishes the directory located at the absolute
13 | # path "root/project/build-output"
14 |
15 | publish = "mermaid-live-editor/docs"
16 |
17 | # Default build command.
18 | command = "./scripts/editor.bash"
19 |
--------------------------------------------------------------------------------
/packages/mermaid-example-diagram/src/exampleDiagramDb.js:
--------------------------------------------------------------------------------
1 | /** Created by knut on 15-01-14. */
2 | import { log } from './mermaidUtils.js';
3 |
4 | var message = '';
5 | var info = false;
6 |
7 | export const setMessage = (txt) => {
8 | log.debug('Setting message to: ' + txt);
9 | message = txt;
10 | };
11 |
12 | export const getMessage = () => {
13 | return message;
14 | };
15 |
16 | /**
17 | * Sets the info flag
18 | *
19 | * @param {boolean} inf
20 | */
21 | export const setInfo = (inf) => {
22 | info = inf;
23 | };
24 |
25 | export const getInfo = () => {
26 | return info;
27 | };
28 |
29 | export const clear = () => {
30 | message = '';
31 | info = false;
32 | };
33 |
34 | export default {
35 | setMessage,
36 | getMessage,
37 | setInfo,
38 | getInfo,
39 | clear,
40 | };
41 |
--------------------------------------------------------------------------------
/packages/mermaid/src/diagrams/state/stateDetector-V2.ts:
--------------------------------------------------------------------------------
1 | import type {
2 | DiagramDetector,
3 | DiagramLoader,
4 | ExternalDiagramDefinition,
5 | } from '../../diagram-api/types.js';
6 |
7 | const id = 'stateDiagram';
8 |
9 | const detector: DiagramDetector = (txt, config) => {
10 | if (/^\s*stateDiagram-v2/.test(txt)) {
11 | return true;
12 | }
13 | if (/^\s*stateDiagram/.test(txt) && config?.state?.defaultRenderer === 'dagre-wrapper') {
14 | return true;
15 | }
16 | return false;
17 | };
18 |
19 | const loader: DiagramLoader = async () => {
20 | const { diagram } = await import('./stateDiagram-v2.js');
21 | return { id, diagram };
22 | };
23 |
24 | const plugin: ExternalDiagramDefinition = {
25 | id,
26 | detector,
27 | loader,
28 | };
29 |
30 | export default plugin;
31 |
--------------------------------------------------------------------------------
/packages/mermaid/src/diagrams/pie/pieParser.ts:
--------------------------------------------------------------------------------
1 | import type { Pie } from '@mermaid-js/parser';
2 | import { parse } from '@mermaid-js/parser';
3 | import { log } from '../../logger.js';
4 | import type { ParserDefinition } from '../../diagram-api/types.js';
5 | import { populateCommonDb } from '../common/populateCommonDb.js';
6 | import type { PieDB } from './pieTypes.js';
7 | import { db } from './pieDb.js';
8 |
9 | const populateDb = (ast: Pie, db: PieDB) => {
10 | populateCommonDb(ast, db);
11 | db.setShowData(ast.showData);
12 | ast.sections.map(db.addSection);
13 | };
14 |
15 | export const parser: ParserDefinition = {
16 | parse: async (input: string): Promise18 | info 19 |20 | 21 |
23 | info showInfo 24 |25 | 26 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /packages/mermaid/src/rendering-util/rendering-elements/intersect/intersect-rect.js: -------------------------------------------------------------------------------- 1 | const intersectRect = (node, point) => { 2 | var x = node.x; 3 | var y = node.y; 4 | 5 | // Rectangle intersection algorithm from: 6 | // https://math.stackexchange.com/questions/108113/find-edge-between-two-boxes 7 | var dx = point.x - x; 8 | var dy = point.y - y; 9 | var w = node.width / 2; 10 | var h = node.height / 2; 11 | 12 | var sx, sy; 13 | if (Math.abs(dy) * w > Math.abs(dx) * h) { 14 | // Intersection is top or bottom of rect. 15 | if (dy < 0) { 16 | h = -h; 17 | } 18 | sx = dy === 0 ? 0 : (h * dx) / dy; 19 | sy = h; 20 | } else { 21 | // Intersection is left or right of rect. 22 | if (dx < 0) { 23 | w = -w; 24 | } 25 | sx = w; 26 | sy = dx === 0 ? 0 : (w * dy) / dx; 27 | } 28 | 29 | return { x: x + sx, y: y + sy }; 30 | }; 31 | 32 | export default intersectRect; 33 | -------------------------------------------------------------------------------- /.build/types.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-console */ 2 | import { packageOptions } from './common.js'; 3 | import { execSync } from 'child_process'; 4 | 5 | const buildType = (packageName: string) => { 6 | console.log(`Building types for ${packageName}`); 7 | try { 8 | const out = execSync(`tsc -p ./packages/${packageName}/tsconfig.json --emitDeclarationOnly`); 9 | if (out.length > 0) { 10 | console.log(out.toString()); 11 | } 12 | } catch (e) { 13 | if (e.stdout.length > 0) { 14 | console.error(e.stdout.toString()); 15 | } 16 | if (e.stderr.length > 0) { 17 | console.error(e.stderr.toString()); 18 | } 19 | // Exit the build process if we are in CI 20 | if (process.env.CI) { 21 | throw new Error(`Failed to build types for ${packageName}`); 22 | } 23 | } 24 | }; 25 | 26 | for (const { packageName } of Object.values(packageOptions)) { 27 | buildType(packageName); 28 | } 29 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: true 2 | contact_links: 3 | - name: GitHub Discussions 4 | url: https://github.com/mermaid-js/mermaid/discussions 5 | about: Ask the Community questions or share your own graphs in our discussions. 6 | - name: Discord 7 | url: https://discord.gg/sKeNQX4Wtj 8 | about: Join our Community on Discord for Help and a casual chat. 9 | - name: Documentation 10 | url: https://mermaid.js.org 11 | about: Read our documentation for all that Mermaid.js can offer. 12 | - name: Live Editor 13 | url: https://mermaid.live 14 | about: Try the live editor to preview graphs in no time. 15 | - name: Live Editor - Develop 16 | url: https://develop.git.mermaid.live 17 | about: Try unreleased changes in the develop branch. 18 | - name: Live Editor - Next 19 | url: https://next.git.mermaid.live 20 | about: Try unreleased changes in the next branch. 21 | -------------------------------------------------------------------------------- /packages/mermaid/src/diagrams/flowchart/flowDetector.ts: -------------------------------------------------------------------------------- 1 | import type { 2 | DiagramDetector, 3 | DiagramLoader, 4 | ExternalDiagramDefinition, 5 | } from '../../diagram-api/types.js'; 6 | 7 | const id = 'flowchart'; 8 | 9 | const detector: DiagramDetector = (txt, config) => { 10 | // If we have conferred to only use new flow charts this function should always return false 11 | // as in not signalling true for a legacy flowchart 12 | if ( 13 | config?.flowchart?.defaultRenderer === 'dagre-wrapper' || 14 | config?.flowchart?.defaultRenderer === 'elk' 15 | ) { 16 | return false; 17 | } 18 | return /^\s*graph/.test(txt); 19 | }; 20 | 21 | const loader: DiagramLoader = async () => { 22 | const { diagram } = await import('./flowDiagram.js'); 23 | return { id, diagram }; 24 | }; 25 | 26 | const plugin: ExternalDiagramDefinition = { 27 | id, 28 | detector, 29 | loader, 30 | }; 31 | 32 | export default plugin; 33 | -------------------------------------------------------------------------------- /packages/mermaid/src/docs/syntax/userJourney.md: -------------------------------------------------------------------------------- 1 | # User Journey Diagram 2 | 3 | > User journeys describe at a high level of detail exactly what steps different users take to complete a specific task within a system, application or website. This technique shows the current (as-is) user workflow, and reveals areas of improvement for the to-be workflow. (Wikipedia) 4 | 5 | Mermaid can render user journey diagrams: 6 | 7 | ```mermaid-example 8 | journey 9 | title My working day 10 | section Go to work 11 | Make tea: 5: Me 12 | Go upstairs: 3: Me 13 | Do work: 1: Me, Cat 14 | section Go home 15 | Go downstairs: 5: Me 16 | Sit down: 5: Me 17 | ``` 18 | 19 | Each user journey is split into sections, these describe the part of the task 20 | the user is trying to complete. 21 | 22 | Tasks syntax is `Task name:
5 | %%{init:{"theme":"base", "sequence": {"mirrorActors":false},"themeVariables": {"actorBkg":"red"}}}%%
6 | sequenceDiagram
7 | Bert->>+Ernie: Start looking for the cookie!
8 | Ernie-->>-Bert: Found it!
9 | Note left of Ernie: Cookies are good
10 |
11 |
12 | %%{init:{"theme":"base", "themeVariables": {}}}%%
13 | sequenceDiagram
14 | Bert->>+Ernie: Start looking for the cookie!
15 | Ernie-->>-Bert: Found it!
16 | Note left of Ernie: Cookies are good
17 |
18 |
19 |
31 |
32 |
--------------------------------------------------------------------------------
/packages/mermaid/src/diagrams/class/parser/class.spec.js:
--------------------------------------------------------------------------------
1 | import { parser } from './classDiagram.jison';
2 | import { ClassDB } from '../classDb.js';
3 |
4 | describe('class diagram', function () {
5 | let classDb;
6 | beforeEach(function () {
7 | classDb = new ClassDB();
8 | parser.yy = classDb;
9 | parser.yy.clear();
10 | });
11 |
12 | describe('prototype properties', function () {
13 | it.each(['__proto__', 'constructor'])('should work with a %s property', function (prop) {
14 | expect(() => parser.parse(`classDiagram\nclass ${prop}`)).not.toThrow();
15 | expect(() => parser.parse(`classDiagram\nnamespace ${prop} {\n\tclass A\n}`)).not.toThrow();
16 | });
17 | });
18 |
19 | describe('backtick escaping', function () {
20 | it('should handle backtick-quoted namespace names', function () {
21 | expect(() =>
22 | parser.parse(`classDiagram\nnamespace \`A::B\` {\n\tclass \`IPC::Sender\`\n}`)
23 | ).not.toThrow();
24 | });
25 | });
26 | });
27 |
--------------------------------------------------------------------------------
/packages/mermaid/src/__mocks__/mermaidAPI.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Mocks for `./mermaidAPI`.
3 | *
4 | * We can't easily use `vi.spyOn(mermaidAPI, "function")` since the object is frozen with `Object.freeze()`.
5 | */
6 | import * as configApi from '../config.js';
7 | import { vi } from 'vitest';
8 | import { mermaidAPI as mAPI } from '../mermaidAPI.js';
9 |
10 | // original version cannot be modified since it was frozen with `Object.freeze()`
11 | export const mermaidAPI = {
12 | render: vi.fn().mockResolvedValue({
13 | svg: '',
14 | }),
15 | parse: mAPI.parse,
16 | initialize: vi.fn(),
17 | getConfig: configApi.getConfig,
18 | setConfig: configApi.setConfig,
19 | getSiteConfig: configApi.getSiteConfig,
20 | updateSiteConfig: configApi.updateSiteConfig,
21 | reset: () => {
22 | configApi.reset();
23 | },
24 | globalReset: () => {
25 | configApi.reset(configApi.defaultConfig);
26 | },
27 | defaultConfig: configApi.defaultConfig,
28 | };
29 |
30 | export default mermaidAPI;
31 |
--------------------------------------------------------------------------------
/packages/mermaid/src/diagrams/class/classDetector-V2.ts:
--------------------------------------------------------------------------------
1 | import type {
2 | DiagramDetector,
3 | DiagramLoader,
4 | ExternalDiagramDefinition,
5 | } from '../../diagram-api/types.js';
6 |
7 | const id = 'classDiagram';
8 |
9 | const detector: DiagramDetector = (txt, config) => {
10 | // If we have configured to use dagre-wrapper then we should return true in this function for classDiagram code thus making it use the new class diagram
11 | if (/^\s*classDiagram/.test(txt) && config?.class?.defaultRenderer === 'dagre-wrapper') {
12 | return true;
13 | }
14 | // We have not opted to use the new renderer so we should return true if we detect a class diagram
15 | return /^\s*classDiagram-v2/.test(txt);
16 | };
17 |
18 | const loader: DiagramLoader = async () => {
19 | const { diagram } = await import('./classDiagram-v2.js');
20 | return { id, diagram };
21 | };
22 |
23 | const plugin: ExternalDiagramDefinition = {
24 | id,
25 | detector,
26 | loader,
27 | };
28 |
29 | export default plugin;
30 |
--------------------------------------------------------------------------------
/cypress/platform/ghsa2.html:
--------------------------------------------------------------------------------
1 |
2 |
5 |
6 |
17 |
19 | Join the community
20 | and get involved!
21 |