GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-14 06:43:25 +08:00
Code Issues Projects Releases Wiki Activity

Merge branch 'develop' into pr/weedySeaDragon/3684

Browse Source 
* develop: (21 commits)
  Theme update from release 9.2
  testcode
  Delete dependabot.yml
  changed cspell config in eslint from warn to error
  Update .eslintrc.json
  fix cypress tests for erDiagram, add eslint-plugin-no-only-tests plugin because of this comment: https://github.com/mermaid-js/mermaid/pull/3647#issuecomment-1281163858
  chore: Add CORS to vite dev
  configured 3 more words in cspell.json
  removed eslint-ignore statements
  chore(deps): pin dependencies
  chore(deps): update all non-major dependencies (#3671)
  style(sequence): rename lineStarty to lineStartY
  style: fix @cspell/eslint warnings
  test(gantt): remove incorrect comment
  added words to cspell ignore words list, removed mywords.txt
  update: open graph image
  fix: prettier
  remove id attribute
  feat(issue#3675): added open graph meta tags
  updated eslint config and fixed cspell warnings
  ...
This commit is contained in:
Sidharth Vinod 2022-10-19 22:48:57 +05:30
commit f4fa68031e
No known key found for this signature in database
GPG Key ID: FB5CCD378D3907CD
66 changed files with 3241 additions and 3177 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
.eslintrc.json
View File

@ -19,9 +19,10 @@
"plugin:jsdoc/recommended",
"plugin:json/recommended",
"plugin:markdown/recommended",
"plugin:@cspell/recommended",
"prettier"
],
"plugins": ["@typescript-eslint", "html", "jest", "jsdoc", "json"],
"plugins": ["@typescript-eslint", "no-only-tests", "html", "jest", "jsdoc", "json", "@cspell"],
"rules": {
"no-console": "error",
"no-prototype-builtins": "off",
@ -48,7 +49,21 @@
}
],
"json/*": ["error", "allowComments"],
"no-empty": ["error", { "allowEmptyCatch": true }]
"@cspell/spellchecker": [
"error",
{
"checkIdentifiers": false,
"checkStrings": false,
"checkStringTemplates": false
}
],
"no-empty": [
"error",
{
"allowEmptyCatch": true
}
],
"no-only-tests/no-only-tests": "error"
},
"overrides": [
{

18
.github/dependabot.yml vendored
View File

@ -1,18 +0,0 @@
version: 2
updates:
- package-ecosystem: npm
open-pull-requests-limit: 10
directory: /
target-branch: develop
versioning-strategy: increase
schedule:
interval: weekly
day: monday
time: '07:00'
- package-ecosystem: github-actions
directory: /
target-branch: develop
schedule:
interval: weekly
day: monday
time: '07:00'

11
.vite/server.ts
View File

@ -1,7 +1,15 @@
import express from 'express';
import express, { NextFunction, Request, Response } from 'express';
import { createServer as createViteServer } from 'vite';
// import { getBuildConfig } from './build';
const cors = (req: Request, res: Response, next: NextFunction) => {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
res.header('Access-Control-Allow-Headers', 'Content-Type');
next();
};
async function createServer() {
const app = express();
@ -12,6 +20,7 @@ async function createServer() {
appType: 'custom', // don't include Vite's default HTML handling middlewares
});
app.use(cors);
app.use(express.static('./packages/mermaid/dist'));
app.use(express.static('./packages/mermaid-example-diagram/dist'));
app.use(express.static('./packages/mermaid-mindmap/dist'));

69
cSpell.json
View File

@ -2,43 +2,70 @@
"version": "0.2",
"language": "en",
"words": [
"gantt",
"mindmaps",
"visio",
"colour",
"customizability",
"Gantt",
"flatmap",
"jison",
"knsv",
"Knut",
"mermiad",
"mindmap",
"Mindmaps",
"mitigations",
"sandboxed",
"Sveidqvist",
"santize",
"stylis",
"verdana",
"Visio"
"xlink"
],
"ignoreWords": [
"Adamiecki",
"adamiecki",
"asciidoctor",
"ashish",
"astah",
"bilkent",
"bisheng",
"docsy",
"doku",
"gitea",
"gitgraph",
"grav",
"inkdrop",
"jaoude",
"kaufmann",
"knut",
"lucida",
"plantuml",
"playfair's",
"podlite",
"sveidqvist",
"tuleap",
"acyclicer",
"antiscript",
"applitools",
"Asciidoctor",
"Astah",
"Bisheng",
"bbox",
"codedoc",
"Docsy",
"Doku",
"Gitea",
"Gitgraph",
"Grav",
"Inkdrop",
"Jaoude",
"cpettitt",
"cytoscape",
"dagre",
"descr",
"docsify",
"edgechromium",
"graphlib",
"knsv",
"mdbook",
"mermerd",
"mkdocs",
"phpbb",
"Plantuml",
"Playfair's",
"Podlite",
"ranksep",
"redmine",
"setupgraphviewbox",
"sphinxcontrib",
"Tuleap"
"substate",
"techn",
"ts-nocheck",
"viewports",
"vitepress"
],
"patterns": [
{

1
cypress/helpers/util.js
View File

@ -45,7 +45,6 @@ export const imgSnapshotTest = (graphStr, _options, api = false, validation) =>
options.fontSize = '16px';
}
const useAppli = Cypress.env('useAppli');
//const useAppli = false;
cy.log('Hello ' + useAppli ? 'Appli' : 'image-snapshot');
const name = (options.name || cy.state('runnable').fullTitle()).replace(/\s+/g, '-');

2
cypress/integration/rendering/appli.spec.js
View File

@ -21,7 +21,7 @@ describe('Git Graph diagram', () => {
// // Call Open on eyes to initialize a test session
// cy.eyesOpen({
// appName: 'Demo App',
// testName: 'Ultrafast grid demo',
// testName: 'UltraFast grid demo',
// });
// // check the login page with fluent api, see more info here

2
cypress/integration/rendering/erDiagram.spec.js
View File

@ -167,7 +167,7 @@ describe('Entity Relationship Diagram', () => {
cy.get('svg');
});
it.only('should render entities with generic and array attributes', () => {
it('should render entities with generic and array attributes', () => {
renderGraph(
`
erDiagram

49
cypress/platform/knsv2.html
View File

@ -72,31 +72,26 @@ classDiagram
Student "1" --o "1" IdCard : carries
Student "1" --o "1" Bike : rides
</pre>
<pre id="diagram" class="mermaid2">
<pre id="diagram" class="mermaid">
mindmap
root
A
B
C
D
E
A2
B2
C2
D2
E2
child1((Circle))
grandchild 1
grandchild 2
child2(Round rectangle)
grandchild 3
grandchild 4
child3[Square]
grandchild 5
::icon(mdi mdi-fire)
gc6((grand<br/>child 6))
::icon(mdi mdi-fire)
gc7((grand<br/>grand<br/>child 8))
root((mindmap))
Origins
Long history
::icon(fa fa-book)
Popularisation
::icon(fa fa-book)
British popular psychology author Tony Buzan
Research
::icon(fa fa-book)
On effectivness<br/>and features
On Automatic creation
Uses
Creative techniques
Strategic planning
Argument mapping
Tools
Pen and paper
Mermaid
</pre>
<pre id="diagram" class="mermaid2">
example-diagram
@ -113,7 +108,7 @@ mindmap
// console.error('Mermaid error: ', err);
};
mermaid.initialize({
theme: 'forest',
theme: 'base',
startOnLoad: true,
logLevel: 0,
// basePath: './packages/',
@ -131,6 +126,10 @@ mindmap
console.error('In parse error:');
console.error(err);
};
// mermaid.test1('first_slow', 1200).then((r) => console.info(r));
// mermaid.test1('second_fast', 200).then((r) => console.info(r));
// mermaid.test1('third_fast', 200).then((r) => console.info(r));
// mermaid.test1('forth_slow', 1200).then((r) => console.info(r));
</script>
</body>
</html>

2
cypress/platform/xss21.html
View File

@ -94,7 +94,7 @@
}
// var diagram = ` graph TD
// A --> B["&lt;a href='javasc`;
// A --> B["&lt;a href='javascript`;
// diagram += `ript#colon;xssAttack()'&gt;AAA&lt;/a&gt;"]`;
let diagram = ` graph TD
A --> B["<a href='javasc`;

8
docs/index.html
View File

@ -15,6 +15,14 @@
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
<meta property="og:title" content="Mermaid" />
<meta property="og:url" content="https://mermaid-js.github.io/mermaid/" />
<meta property="og:image" content="https://mermaid-js.github.io/mermaid/img/header.png" />
<meta
property="og:description"
content="Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs."
/>
<meta property="og:type" content="website" />
<!-- <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css"> -->
<link rel="stylesheet" href="theme.css" />
<link

144
package.json
View File

@ -7,7 +7,7 @@
"module": "dist/mermaid.core.mjs",
"types": "dist/mermaid.d.ts",
"type": "module",
"packageManager": "pnpm@7.13.2",
"packageManager": "pnpm@7.13.5",
"exports": {
".": {
"require": "./dist/mermaid.min.js",
@ -70,81 +70,83 @@
]
},
"dependencies": {
"@braintree/sanitize-url": "^6.0.0",
"@types/node": "^18.8.1",
"@types/uuid": "^8.3.4",
"d3": "^7.0.0",
"dagre": "^0.8.5",
"dagre-d3": "^0.6.4",
"@braintree/sanitize-url": "6.0.0",
"@types/node": "18.11.0",
"@types/uuid": "8.3.4",
"d3": "7.6.1",
"dagre": "0.8.5",
"dagre-d3": "0.6.4",
"dompurify": "2.4.0",
"fast-clone": "^1.5.13",
"graphlib": "^2.1.8",
"khroma": "^2.0.0",
"lodash": "^4.17.21",
"moment-mini": "^2.24.0",
"non-layered-tidy-tree-layout": "^2.0.2",
"rollup": "^2.79.1",
"stylis": "^4.1.2",
"uuid": "^9.0.0"
"fast-clone": "1.5.13",
"graphlib": "2.1.8",
"khroma": "2.0.0",
"lodash": "4.17.21",
"moment-mini": "2.29.4",
"non-layered-tidy-tree-layout": "2.0.2",
"rollup": "2.79.1",
"stylis": "4.1.2",
"uuid": "9.0.0"
},
"devDependencies": {
"@applitools/eyes-cypress": "^3.27.1",
"@commitlint/cli": "^17.1.2",
"@commitlint/config-conventional": "^17.1.0",
"@types/d3": "^7.4.0",
"@types/dompurify": "^2.3.4",
"@types/eslint": "^8.4.6",
"@types/express": "^4.17.14",
"@types/jsdom": "^20.0.0",
"@types/lodash": "^4.14.186",
"@types/mdast": "^3.0.10",
"@types/prettier": "^2.7.1",
"@types/stylis": "^4.0.2",
"@typescript-eslint/eslint-plugin": "^5.39.0",
"@typescript-eslint/parser": "^5.39.0",
"@vitest/coverage-c8": "0.24.1",
"@vitest/ui": "0.24.1",
"concurrently": "^7.4.0",
"coveralls": "^3.1.1",
"cypress": "^10.0.0",
"cypress-image-snapshot": "^4.0.1",
"documentation": "13.2.0",
"esbuild": "^0.15.10",
"eslint": "^8.24.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-cypress": "^2.12.1",
"eslint-plugin-html": "^7.1.0",
"eslint-plugin-jest": "^27.1.0",
"eslint-plugin-jsdoc": "^39.3.6",
"eslint-plugin-json": "^3.1.0",
"eslint-plugin-markdown": "^3.0.0",
"express": "^4.18.1",
"globby": "^13.1.2",
"husky": "^8.0.1",
"identity-obj-proxy": "^3.0.0",
"jest": "29.x",
"jison": "^0.4.18",
"jsdom": "^20.0.1",
"lint-staged": "^13.0.3",
"markdown-it": "^13.0.1",
"path-browserify": "^1.0.1",
"pnpm": "^7.13.2",
"prettier": "^2.7.1",
"prettier-plugin-jsdoc": "^0.4.2",
"remark": "^14.0.2",
"rimraf": "^3.0.2",
"start-server-and-test": "^1.14.0",
"ts-node": "^10.9.1",
"typescript": "^4.8.4",
"unist-util-flatmap": "^1.0.0",
"vite": "^3.1.4",
"vitepress": "^1.0.0-alpha.19",
"vitepress-plugin-mermaid": "^2.0.8",
"vitepress-plugin-search": "^1.0.4-alpha.11",
"vitest": "0.24.1"
"@applitools/eyes-cypress": "3.27.2",
"@commitlint/cli": "17.1.2",
"@commitlint/config-conventional": "17.1.0",
"@cspell/eslint-plugin": "^6.12.0",
"@types/d3": "7.4.0",
"@types/dompurify": "2.3.4",
"@types/eslint": "8.4.6",
"@types/express": "4.17.14",
"@types/jsdom": "20.0.0",
"@types/lodash": "4.14.186",
"@types/mdast": "3.0.10",
"@types/prettier": "2.7.1",
"@types/stylis": "4.0.2",
"@typescript-eslint/eslint-plugin": "5.40.0",
"@typescript-eslint/parser": "5.40.0",
"@vitest/coverage-c8": "0.24.3",
"@vitest/ui": "0.24.3",
"concurrently": "7.4.0",
"coveralls": "3.1.1",
"cypress": "10.10.0",
"cypress-image-snapshot": "4.0.1",
"documentation": "13.2.5",
"esbuild": "0.15.11",
"eslint": "8.25.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-cypress": "2.12.1",
"eslint-plugin-html": "7.1.0",
"eslint-plugin-jest": "27.1.2",
"eslint-plugin-jsdoc": "39.3.6",
"eslint-plugin-json": "3.1.0",
"eslint-plugin-markdown": "3.0.0",
"eslint-plugin-no-only-tests": "^3.0.0",
"express": "4.18.2",
"globby": "13.1.2",
"husky": "8.0.1",
"identity-obj-proxy": "3.0.0",
"jest": "29.2.0",
"jison": "0.4.18",
"jsdom": "20.0.1",
"lint-staged": "13.0.3",
"markdown-it": "13.0.1",
"path-browserify": "1.0.1",
"pnpm": "7.13.5",
"prettier": "2.7.1",
"prettier-plugin-jsdoc": "0.4.2",
"remark": "14.0.2",
"rimraf": "3.0.2",
"start-server-and-test": "1.14.0",
"ts-node": "10.9.1",
"typescript": "4.8.4",
"unist-util-flatmap": "1.0.0",
"vite": "3.1.8",
"vitepress": "1.0.0-alpha.21",
"vitepress-plugin-mermaid": "2.0.8",
"vitepress-plugin-search": "1.0.4-alpha.11",
"vitest": "0.24.3"
},
"resolutions": {
"d3": "^7.0.0"
"d3": "7.6.1"
},
"files": [
"dist"

4
packages/mermaid-example-diagram/package.json
View File

@ -50,8 +50,8 @@
},
"dependencies": {},
"devDependencies": {
"concurrently": "^7.4.0",
"rimraf": "^3.0.2"
"concurrently": "7.4.0",
"rimraf": "3.0.2"
},
"resolutions": {
"d3": "^7.0.0"

2
packages/mermaid-example-diagram/src/detector.ts
View File

@ -2,7 +2,7 @@
export const id = 'example-diagram';
/**
* Detector function that will be called by mermaid to determine if the diagram is this type of digram.
* Detector function that will be called by mermaid to determine if the diagram is this type of diagram.
*
* @param txt The diagram text will be passed to the detector
* @returns True if the diagram text matches a diagram of this type

2
packages/mermaid-example-diagram/src/exampleDiagramRenderer.js
View File

@ -16,7 +16,7 @@ export const draw = (text, id, version) => {
log.debug('Rendering example diagram\n' + text, 'Conf: ');
const THEME_COLOR_LIMIT = getConfig().themeVariables.THEME_COLOR_LIMIT;
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

4
packages/mermaid-mindmap/package.json
View File

@ -57,8 +57,8 @@
"non-layered-tidy-tree-layout": "^2.0.2"
},
"devDependencies": {
"concurrently": "^7.4.0",
"rimraf": "^3.0.2"
"concurrently": "7.4.0",
"rimraf": "3.0.2"
},
"resolutions": {
"d3": "^7.0.0"

12
packages/mermaid-mindmap/src/mindmapRenderer.js
View File

@ -11,7 +11,7 @@ cytoscape.use(coseBilkent);
/**
* @param {any} svg The svg element to draw the diagram onto
* @param {object} mindmap The maindmap data and hierarchy
* @param {object} mindmap The mindmap data and hierarchy
* @param section
* @param {object} conf The configuration object
*/
@ -52,7 +52,7 @@ function drawEdges(edgesEl, cy) {
/**
* @param {any} svg The svg element to draw the diagram onto
* @param {object} mindmap The maindmap data and hierarchy
* @param {object} mindmap The mindmap data and hierarchy
* @param section
* @param cy
* @param {object} conf The configuration object
@ -96,7 +96,6 @@ function addNodes(mindmap, cy, conf, level) {
/**
* @param node
* @param conf
* @param cy
*/
function layoutMindmap(node, conf) {
return new Promise((resolve) => {
@ -121,7 +120,7 @@ function layoutMindmap(node, conf) {
renderEl.remove();
addNodes(node, cy, conf, 0);
// Make cytoscape care about the dimensisions of the nodes
// Make cytoscape care about the dimensions of the nodes
cy.nodes().forEach(function (n) {
n.layoutDimensions = () => {
const data = n.data();
@ -143,10 +142,7 @@ function layoutMindmap(node, conf) {
});
}
/**
* @param node
* @param cy
* @param positionedMindmap
* @param conf
*/
function positionNodes(cy) {
cy.nodes().map((node, id) => {
@ -184,7 +180,7 @@ export const draw = async (text, id, version, diagObj) => {
log.debug('Renering info diagram\n' + text);
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

4
packages/mermaid-mindmap/src/styles.js
View File

@ -22,12 +22,10 @@ const genSections = (options) => {
}
.section-${i - 1} text {
fill: ${options['cScaleLabel' + i]};
// fill: ${options['gitInv' + i]};
}
.node-icon-${i - 1} {
font-size: 40px;
color: ${options['cScaleLabel' + i]};
// color: ${options['gitInv' + i]};
}
.section-edge-${i - 1}{
stroke: ${options['cScale' + i]};
@ -36,7 +34,7 @@ const genSections = (options) => {
stroke-width: ${sw};
}
.section-${i - 1} line {
stroke: ${options['lineColor' + i]} ;
stroke: ${options['cScaleInv' + i]} ;
stroke-width: 3;
}

88
packages/mermaid/package.json
View File

@ -75,51 +75,51 @@
"stylis": "^4.1.2"
},
"devDependencies": {
"@applitools/eyes-cypress": "^3.25.7",
"@commitlint/cli": "^17.1.2",
"@commitlint/config-conventional": "^17.0.0",
"@types/d3": "^7.4.0",
"@types/dompurify": "^2.3.4",
"@types/eslint": "^8.4.6",
"@types/express": "^4.17.13",
"@types/jsdom": "^20.0.0",
"@types/lodash": "^4.14.185",
"@types/prettier": "^2.7.0",
"@types/stylis": "^4.0.2",
"@typescript-eslint/eslint-plugin": "^5.37.0",
"@typescript-eslint/parser": "^5.37.0",
"concurrently": "^7.4.0",
"coveralls": "^3.1.1",
"cypress": "^10.0.0",
"cypress-image-snapshot": "^4.0.1",
"documentation": "13.2.0",
"esbuild": "^0.15.8",
"eslint": "^8.23.1",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-cypress": "^2.12.1",
"eslint-plugin-html": "^7.1.0",
"eslint-plugin-jest": "^27.0.4",
"eslint-plugin-jsdoc": "^39.3.6",
"eslint-plugin-json": "^3.1.0",
"eslint-plugin-markdown": "^3.0.0",
"express": "^4.18.1",
"globby": "^13.1.2",
"husky": "^8.0.0",
"identity-obj-proxy": "^3.0.0",
"jison": "^0.4.18",
"@applitools/eyes-cypress": "3.27.2",
"@commitlint/cli": "17.1.2",
"@commitlint/config-conventional": "17.1.0",
"@types/d3": "7.4.0",
"@types/dompurify": "2.3.4",
"@types/eslint": "8.4.6",
"@types/express": "4.17.14",
"@types/jsdom": "20.0.0",
"@types/lodash": "4.14.186",
"@types/prettier": "2.7.1",
"@types/stylis": "4.0.2",
"@typescript-eslint/eslint-plugin": "5.40.0",
"@typescript-eslint/parser": "5.40.0",
"concurrently": "7.4.0",
"coveralls": "3.1.1",
"cypress": "10.10.0",
"cypress-image-snapshot": "4.0.1",
"documentation": "13.2.5",
"esbuild": "0.15.11",
"eslint": "8.25.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-cypress": "2.12.1",
"eslint-plugin-html": "7.1.0",
"eslint-plugin-jest": "27.1.2",
"eslint-plugin-jsdoc": "39.3.6",
"eslint-plugin-json": "3.1.0",
"eslint-plugin-markdown": "3.0.0",
"express": "4.18.2",
"globby": "13.1.2",
"husky": "8.0.1",
"identity-obj-proxy": "3.0.0",
"jison": "0.4.18",
"js-base64": "3.7.2",
"jsdom": "^20.0.0",
"lint-staged": "^13.0.0",
"moment": "^2.23.0",
"path-browserify": "^1.0.1",
"prettier": "^2.7.1",
"prettier-plugin-jsdoc": "^0.4.2",
"remark": "^14.0.2",
"rimraf": "^3.0.2",
"start-server-and-test": "^1.12.6",
"ts-node": "^10.9.1",
"typescript": "^4.8.3",
"unist-util-flatmap": "^1.0.0"
"jsdom": "20.0.1",
"lint-staged": "13.0.3",
"moment": "2.29.4",
"path-browserify": "1.0.1",
"prettier": "2.7.1",
"prettier-plugin-jsdoc": "0.4.2",
"remark": "14.0.2",
"rimraf": "3.0.2",
"start-server-and-test": "1.14.0",
"ts-node": "10.9.1",
"typescript": "4.8.4",
"unist-util-flatmap": "1.0.0"
},
"resolutions": {
"d3": "^7.0.0"

2
packages/mermaid/src/config.ts
View File

@ -166,7 +166,7 @@ export const sanitize = (options: any) => {
}
});
// Check that there no attempts of xss, there should be no tags at all in the directive
// blocking data urls as base64 urls can contain svgs with inline script tags
// blocking data urls as base64 urls can contain svg's with inline script tags
Object.keys(options).forEach((key) => {
if (typeof options[key] === 'string') {
if (

4
packages/mermaid/src/dagre-wrapper/edges.js
View File

@ -310,7 +310,7 @@ const cutPathAtIntersect = (_points, boundryNode) => {
// const node = clusterDb[edge.toCluster].node;
log.info('abc88 checking point', point, boundryNode);
// check if point is inside the boundry rect
// check if point is inside the boundary rect
if (!outsideNode(boundryNode, point) && !isInside) {
// First point inside the rect found
// Calc the intersection coord between the point anf the last point outside the rect
@ -429,7 +429,7 @@ export const insertEdge = function (elem, e, edge, clusterDb, diagramType, graph
})
.curve(curve);
// Contruct stroke classes based on properties
// Construct stroke classes based on properties
let strokeClasses;
switch (edge.thickness) {
case 'normal':

2
packages/mermaid/src/dagre-wrapper/intersect/index.js
View File

@ -1,5 +1,5 @@
/*
* Borrowed with love from from dagrge-d3. Many thanks to cpettitt!
* Borrowed with love from from dagre-d3. Many thanks to cpettitt!
*/
import node from './intersect-node.js';

4
packages/mermaid/src/dagre-wrapper/intersect/intersect-line.js
View File

@ -28,7 +28,7 @@ function intersectLine(p1, p2, q1, q2) {
// Check signs of r3 and r4. If both point 3 and point 4 lie on
// same side of line 1, the line segments do not intersect.
if (r3 !== 0 && r4 !== 0 && sameSign(r3, r4)) {
return /*DONT_INTERSECT*/;
return /*DON'T_INTERSECT*/;
}
// Compute a2, b2, c2 where line joining points 3 and 4 is G(x,y) = a2 x + b2 y + c2 = 0
@ -44,7 +44,7 @@ function intersectLine(p1, p2, q1, q2) {
// on same side of second line segment, the line segments do
// not intersect.
if (r1 !== 0 && r2 !== 0 && sameSign(r1, r2)) {
return /*DONT_INTERSECT*/;
return /*DON'T_INTERSECT*/;
}
// Line segments intersect: compute intersection point.

2
packages/mermaid/src/dagre-wrapper/mermaid-graphlib.js
View File

@ -235,7 +235,7 @@ export const adjustClustersAndEdges = (graph, depth) => {
// Check if any edge leaves the cluster (not the actual cluster, that's a link from the box)
if (edge.v !== id && edge.w !== id) {
// Any edge where either the one of the nodes is decending to the cluster but not the other
// Any edge where either the one of the nodes is descending to the cluster but not the other
// if (decendants[id].indexOf(edge.v) < 0 && decendants[id].indexOf(edge.w) < 0) {
const d1 = isDecendant(edge.v, id);

2
packages/mermaid/src/dagre-wrapper/nodes.js
View File

@ -291,7 +291,7 @@ const cylinder = (parent, node) => {
(Math.abs(x) == node.width / 2 && Math.abs(pos.y - node.y) > node.height / 2 - ry))
) {
// ellipsis equation: x*x / a*a + y*y / b*b = 1
// solve for y to get adjustion value for pos.y
// solve for y to get adjusted value for pos.y
let y = ry * ry * (1 - (x * x) / (rx * rx));
if (y != 0) y = Math.sqrt(y);
y = ry - y;

12
packages/mermaid/src/defaultConfig.ts
View File

@ -119,11 +119,11 @@ const config: MermaidConfig = {
/**
* 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 behaviour.
* deterministic. This is the default behavior.
*
* **Notes**:
*
* This matters if your files are checked into sourcecontrol e.g. git and should not change unless
* This matters if your files are checked into source control e.g. git and should not change unless
* content is changed.
*
* Default value: false
@ -633,9 +633,9 @@ const config: MermaidConfig = {
numberSectionStyles: 4,
/**
* | Parameter | Description | Type | Required | Values |
* | ---------- | --------------------------- | ---- | -------- | ---------------- |
* | axisFormat | Datetime format of the axis | 3 | Required | Date in yy-mm-dd |
* | Parameter | Description | Type | Required | Values |
* | ---------- | ---------------------------- | ---- | -------- | ---------------- |
* | axisFormat | Date/time format of the axis | 3 | Required | Date in yy-mm-dd |
*
* **Notes:**
*
@ -1169,7 +1169,7 @@ const config: MermaidConfig = {
* | --------------- | ----------- | ------- | -------- | ------------------ |
* | c4BoundaryInRow | See Notes | Integer | Required | Any Positive Value |
*
* **Notes:** How many boundarys to place in each row.
* **Notes:** How many boundaries to place in each row.
*
* Default value: 2
*/

6
packages/mermaid/src/diagram-api/diagramAPI.ts
View File

@ -7,9 +7,9 @@ import { addStylesForDiagram } from '../styles';
import { DiagramDefinition, DiagramDetector } from './types';
/*
Packaging and exposing resources for externa diagrams so that they can import
diagramAPI and have access to selct parts of mermaid common code reqiored to
create diagrams worling like the internal diagrams.
Packaging and exposing resources for external diagrams so that they can import
diagramAPI and have access to select parts of mermaid common code required to
create diagrams working like the internal diagrams.
*/
export const log = _log;
export const setLogLevel = _setLogLevel;

32
packages/mermaid/src/diagrams/c4/c4Renderer.js
View File

@ -441,20 +441,26 @@ export const drawRels = function (diagram, rels, getC4ShapeObj, diagObj) {
* @param diagram
* @param parentBoundaryAlias
* @param parentBounds
* @param currentBoundarys
* @param currentBoundaries
* @param diagObj
*/
function drawInsideBoundary(diagram, parentBoundaryAlias, parentBounds, currentBoundarys, diagObj) {
function drawInsideBoundary(
diagram,
parentBoundaryAlias,
parentBounds,
currentBoundaries,
diagObj
) {
let currentBounds = new Bounds(diagObj);
// Calculate the width limit of the boundar. label/type 的长度，
// Calculate the width limit of the boundary. label/type 的长度，
currentBounds.data.widthLimit =
parentBounds.data.widthLimit / Math.min(c4BoundaryInRow, currentBoundarys.length);
parentBounds.data.widthLimit / Math.min(c4BoundaryInRow, currentBoundaries.length);
// Math.min(
// conf.width * conf.c4ShapeInRow + conf.c4ShapeMargin * conf.c4ShapeInRow * 2,
// parentBounds.data.widthLimit / Math.min(conf.c4BoundaryInRow, currentBoundarys.length)
// parentBounds.data.widthLimit / Math.min(conf.c4BoundaryInRow, currentBoundaries.length)
// );
for (let i = 0; i < currentBoundarys.length; i++) {
let currentBoundary = currentBoundarys[i];
for (let i = 0; i < currentBoundaries.length; i++) {
let currentBoundary = currentBoundaries[i];
let Y = 0;
currentBoundary.image = { width: 0, height: 0, Y: 0 };
if (currentBoundary.sprite) {
@ -508,13 +514,13 @@ function drawInsideBoundary(diagram, parentBoundaryAlias, parentBounds, currentB
}
if (i == 0 || i % c4BoundaryInRow === 0) {
// Calculate the drawing start point of the currentBoundarys.
// Calculate the drawing start point of the currentBoundaries.
let _x = parentBounds.data.startx + conf.diagramMarginX;
let _y = parentBounds.data.stopy + conf.diagramMarginY + Y;
currentBounds.setData(_x, _x, _y, _y);
} else {
// Calculate the drawing start point of the currentBoundarys.
// Calculate the drawing start point of the currentBoundaries.
let _x =
currentBounds.data.stopx !== currentBounds.data.startx
? currentBounds.data.stopx + conf.diagramMarginX
@ -540,8 +546,6 @@ function drawInsideBoundary(diagram, parentBoundaryAlias, parentBounds, currentB
if (nextCurrentBoundarys.length > 0) {
// draw boundary inside currentBoundary
// bounds.init();
// parentBoundaryWidthLimit = bounds.data.stopx - bounds.startx;
drawInsideBoundary(
diagram,
parentBoundaryAlias,
@ -576,7 +580,7 @@ function drawInsideBoundary(diagram, parentBoundaryAlias, parentBounds, currentB
export const draw = function (_text, id, _version, diagObj) {
conf = configApi.getConfig().c4;
const securityLevel = configApi.getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);
@ -616,10 +620,10 @@ export const draw = function (_text, id, _version, diagObj) {
globalBoundaryMaxY = conf.diagramMarginY;
const title = diagObj.db.getTitle();
let currentBoundarys = diagObj.db.getBoundarys('');
let currentBoundaries = diagObj.db.getBoundarys('');
// switch (c4type) {
// case 'C4Context':
drawInsideBoundary(diagram, '', screenBounds, currentBoundarys, diagObj);
drawInsideBoundary(diagram, '', screenBounds, currentBoundaries, diagObj);
// break;
// }

2
packages/mermaid/src/diagrams/class/classDetector-V2.ts
View File

@ -1,7 +1,7 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const classDetectorV2: DiagramDetector = (txt, config) => {
// If we have confgured to use dagre-wrapper then we should return true in this function for classDiagram code thus making it use the new class diagram
// 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
if (txt.match(/^\s*classDiagram/) !== null && config?.class?.defaultRenderer === 'dagre-wrapper')
return true;
// We have not opted to use the new renderer so we should return true if we detect a class diagram

2
packages/mermaid/src/diagrams/class/classDetector.ts
View File

@ -1,7 +1,7 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const classDetector: DiagramDetector = (txt, config) => {
// If we have confgured to use dagre-wrapper then we should never return true in this function
// If we have configured to use dagre-wrapper then we should never return true in this function
if (config?.class?.defaultRenderer === 'dagre-wrapper') return false;
// We have not opted to use the new renderer so we should return true if we detect a class diagram
return txt.match(/^\s*classDiagram/) !== null;

1
packages/mermaid/src/diagrams/class/classRenderer-v2.js
View File

@ -64,6 +64,7 @@ export const addClasses = function (classes, g, _id, diagObj) {
// if (evaluate(getConfig().flowchart.htmlLabels)) {
// const node = {
// label: vertexText.replace(
// eslint-disable-next-line @cspell/spellchecker
// /fa[lrsb]?:fa-[\w-]+/g,
// s => `<i class='${s.replace(':', ' ')}'></i>`
// )

2
packages/mermaid/src/diagrams/class/classRenderer.js
View File

@ -148,7 +148,7 @@ export const draw = function (text, id, _version, diagObj) {
log.info('Rendering diagram ' + text);
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

2
packages/mermaid/src/diagrams/class/svgDraw.js
View File

@ -347,7 +347,7 @@ const buildMethodDisplay = function (parsedText) {
};
const buildLegacyDisplay = function (text) {
// if for some reason we dont have any match, use old format to parse text
// if for some reason we don't have any match, use old format to parse text
let displayText = '';
let cssStyle = '';
let memberText = '';

4
packages/mermaid/src/diagrams/common/common.ts
View File

@ -60,7 +60,7 @@ export const sanitizeTextOrArray = (
export const lineBreakRegex = /<br\s*\/?>/gi;
/**
* Whether or not a text has any linebreaks
* Whether or not a text has any line breaks
*
* @param {string} text The text to test
* @returns {boolean} Whether or not the text has breaks
@ -80,7 +80,7 @@ export const splitBreaks = (text: string): string[] => {
};
/**
* Converts placeholders to linebreaks in HTML
* Converts placeholders to line breaks in HTML
*
* @param {string} s HTML with placeholders
* @returns {string} HTML with breaks instead of placeholders

2
packages/mermaid/src/diagrams/er/erRenderer.js
View File

@ -644,7 +644,7 @@ export const draw = function (text, id, _version, diagObj) {
// inserted - this represents the insertion point for relationship paths
const firstEntity = drawEntities(svg, diagObj.db.getEntities(), g);
// TODO: externalise the addition of entities to the graph - it's a bit 'buried' in the above
// TODO: externalize the addition of entities to the graph - it's a bit 'buried' in the above
// Add all the relationships to the graph
const relationships = addRelationships(diagObj.db.getRelationships(), g);

2
packages/mermaid/src/diagrams/flowchart/flowChartShapes.js
View File

@ -279,7 +279,7 @@ function cylinder(parent, bbox, node) {
(Math.abs(x) == node.width / 2 && Math.abs(pos.y - node.y) > node.height / 2 - ry))
) {
// ellipsis equation: x*x / a*a + y*y / b*b = 1
// solve for y to get adjustion value for pos.y
// solve for y to get adjusted value for pos.y
let y = ry * ry * (1 - (x * x) / (rx * rx));
if (y != 0) y = Math.sqrt(y);
y = ry - y;

2
packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts
View File

@ -1,7 +1,7 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const flowDetectorV2: DiagramDetector = (txt, config) => {
// If we have confgured to use dagre-wrapper then we should return true in this function for graph code thus making it use the new flowchart diagram
// If we have configured to use dagre-wrapper then we should return true in this function for graph code thus making it use the new flowchart diagram
if (config?.flowchart?.defaultRenderer === 'dagre-wrapper' && txt.match(/^\s*graph/) !== null)
return true;
return txt.match(/^\s*flowchart/) !== null;

2
packages/mermaid/src/diagrams/flowchart/flowDetector.ts
View File

@ -1,7 +1,7 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const flowDetector: DiagramDetector = (txt, config) => {
// If we have confired to only use new flow charts this function shohuld always return false
// If we have conferred to only use new flow charts this function should always return false
// as in not signalling true for a legacy flowchart
if (config?.flowchart?.defaultRenderer === 'dagre-wrapper') return false;
return txt.match(/^\s*graph/) !== null;

4
packages/mermaid/src/diagrams/flowchart/parser/flow-direction.spec.js
View File

@ -2,11 +2,7 @@ import flowDb from '../flowDb';
import flow from './flow';
import filter from 'lodash/filter';
import { setConfig } from '../../../config';
// import DOMPurify from 'dompurify';
// const domPurify = DOMPurify.createDOMPurify(window);
// const clean = DOMPurify.sanitize(dirty);
setConfig({
securityLevel: 'strict',
});

2
packages/mermaid/src/diagrams/gantt/ganttDb.js
View File

@ -229,7 +229,7 @@ const getStartDate = function (prevTime, dateFormat, str) {
* Parse a string as a moment duration.
*
* The string have to be compound by a value and a shorthand duration unit. For example `5d`
* representes 5 days.
* represents 5 days.
*
* Shorthand unit supported are:
*

6
packages/mermaid/src/diagrams/gantt/ganttRenderer.js
View File

@ -27,7 +27,7 @@ export const draw = function (text, id, version, diagObj) {
// parser.parse(text);
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);
@ -610,7 +610,7 @@ export const draw = function (text, id, version, diagObj) {
}
/**
* From this stackexchange question:
* From this stack exchange question:
* http://stackoverflow.com/questions/1890203/unique-for-arrays-in-javascript
*
* @param arr
@ -629,7 +629,7 @@ export const draw = function (text, id, version, diagObj) {
}
/**
* From this stackexchange question:
* From this stack exchange question:
* http://stackoverflow.com/questions/14227981/count-how-many-strings-in-an-array-have-duplicates-in-the-same-array
*
* @param arr

11
packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js
View File

@ -65,17 +65,6 @@ describe('when parsing a gantt diagram it', function () {
expect(parserFnConstructor(str)).not.toThrow();
});
/**
* Beslutsflöde inligt nedan. Obs bla bla bla
*
* graph TD
* A[Hard pledge] -- text on link -->B(Round edge)
* B --> C{to do or not to do}
* C -->|Too| D[Result one]
* C -->|Doo| E[Result two]
*
* Params bapa - a unique bapap
*/
it('should handle a task definition', function () {
const str =
'gantt\n' +

9
packages/mermaid/src/diagrams/git/gitGraphAst.js
View File

@ -39,6 +39,7 @@ export const parseDirective = function (statement, context, type) {
// * @param currentCommit
// * @param otherCommit
// */
// eslint-disable-next-line @cspell/spellchecker
// function isfastforwardable(currentCommit, otherCommit) {
// log.debug('Entering isfastforwardable:', currentCommit.id, otherCommit.id);
// let cnt = 0;
@ -384,14 +385,14 @@ export const checkout = function (branch) {
/**
* @param arr
* @param key
* @param newval
* @param newVal
*/
function upsert(arr, key, newval) {
function upsert(arr, key, newVal) {
const index = arr.indexOf(key);
if (index === -1) {
arr.push(newval);
arr.push(newVal);
} else {
arr.splice(index, 1, newval);
arr.splice(index, 1, newVal);
}
}

22
packages/mermaid/src/diagrams/git/gitGraphRenderer-old.js
View File

@ -218,18 +218,18 @@ function cloneNode(svg, selector) {
/**
* @param svg
* @param commitid
* @param commitId
* @param branches
* @param direction
*/
function renderCommitHistory(svg, commitid, branches, direction) {
function renderCommitHistory(svg, commitId, branches, direction) {
let commit;
const numCommits = Object.keys(allCommitsDict).length;
if (typeof commitid === 'string') {
if (typeof commitId === 'string') {
do {
commit = allCommitsDict[commitid];
commit = allCommitsDict[commitId];
logger.debug('in renderCommitHistory', commit.id, commit.seq);
if (svg.select('#node-' + commitid).size() > 0) {
if (svg.select('#node-' + commitId).size() > 0) {
return;
}
svg
@ -291,15 +291,15 @@ function renderCommitHistory(svg, commitid, branches, direction) {
.attr('class', 'commit-msg')
.text(', ' + commit.message);
}
commitid = commit.parent;
} while (commitid && allCommitsDict[commitid]);
commitId = commit.parent;
} while (commitId && allCommitsDict[commitId]);
}
if (Array.isArray(commitid)) {
logger.debug('found merge commmit', commitid);
renderCommitHistory(svg, commitid[0], branches, direction);
if (Array.isArray(commitId)) {
logger.debug('found merge commmit', commitId);
renderCommitHistory(svg, commitId[0], branches, direction);
branchNum++;
renderCommitHistory(svg, commitid[1], branches, direction);
renderCommitHistory(svg, commitId[1], branches, direction);
branchNum--;
}
}

2
packages/mermaid/src/diagrams/git/layout.js
View File

@ -1,6 +1,6 @@
import { getConfig } from '../../config';
export default (dir, _branches, _commits) => {
export default (dir, _branches) => {
const config = getConfig().gitGraph;
const branches = [];
const commits = [];

5
packages/mermaid/src/diagrams/info/infoRenderer.js
View File

@ -9,16 +9,15 @@ import { getConfig } from '../../config';
* @param {any} text
* @param {any} id
* @param {any} version
* @param diagObj
*/
export const draw = (text, id, version, diagObj) => {
export const draw = (text, id, version) => {
try {
// const parser = infoParser.parser;
// parser.yy = db;
log.debug('Rendering info diagram\n' + text);
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

2
packages/mermaid/src/diagrams/pie/pieRenderer.js
View File

@ -21,7 +21,7 @@ export const draw = (txt, id, _version, diagObj) => {
log.debug('Rendering info diagram\n' + txt);
const securityLevel = configApi.getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

2
packages/mermaid/src/diagrams/requirement/requirementRenderer.js
View File

@ -311,7 +311,7 @@ export const draw = (text, id, _version, diagObj) => {
diagObj.parser.parse(text);
const securityLevel = conf.securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

6
packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js
View File

@ -130,7 +130,7 @@ Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!`;
mermaidAPI.parse(str);
diagram.renderer.draw(str, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility autonumbers
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);
});
it('should show sequence numbers when autonumber is enabled', function () {
@ -142,7 +142,7 @@ Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!`;
mermaidAPI.parse(str);
diagram.renderer.draw(str, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility autonumbers
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:', function () {
@ -1871,7 +1871,7 @@ Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!`;
mermaidAPI.parse(str1, diagram);
diagram.renderer.draw(str1, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility autonumbers
diagram.renderer.draw(str1, 'tst', '1.2.3', diagram); // needs to be rendered for the correct value of visibility auto numbers
expect(diagram.db.showSequenceNumbers()).toBe(true);
const str2 = `

50
packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts
View File

@ -204,8 +204,8 @@ export const bounds = {
* Draws an note in the diagram with the attached line
*
* @param {any} elem - The diagram to draw to.
* @param {{ x: number; y: number; message: string; width: number }} noteModel - Startx: x axis
* start position, verticalPos: y axis position, messsage: the message to be shown, width: Set
* @param {{ x: number; y: number; message: string; width: number }} noteModel - startX: x axis
* start position, verticalPos: y axis position, message: the message to be shown, width: Set
* this with a custom width to override the default configured width.
*/
const drawNote = function (elem, noteModel) {
@ -280,7 +280,7 @@ const actorFont = (cnf) => {
*
* @param {any} diagram - The parent of the message element
* @param {any} msgModel - The model containing fields describing a message
* @returns {number} LineStarty - The Y coordinate at which the message line starts
* @returns {number} lineStartY - The Y coordinate at which the message line starts
*/
const boundMessage = function (diagram, msgModel) {
bounds.bumpVerticalPos(10);
@ -292,15 +292,15 @@ const boundMessage = function (diagram, msgModel) {
bounds.bumpVerticalPos(lineHeight);
let lineStarty;
let lineStartY;
let totalOffset = textDims.height - 10;
const textWidth = textDims.width;
if (startx === stopx) {
lineStarty = bounds.getVerticalPos() + totalOffset;
lineStartY = bounds.getVerticalPos() + totalOffset;
if (!conf.rightAngles) {
totalOffset += conf.boxMargin;
lineStarty = bounds.getVerticalPos() + totalOffset;
lineStartY = bounds.getVerticalPos() + totalOffset;
}
totalOffset += 30;
const dx = Math.max(textWidth / 2, conf.width / 2);
@ -312,15 +312,15 @@ const boundMessage = function (diagram, msgModel) {
);
} else {
totalOffset += conf.boxMargin;
lineStarty = bounds.getVerticalPos() + totalOffset;
bounds.insert(startx, lineStarty - 10, stopx, lineStarty);
lineStartY = bounds.getVerticalPos() + totalOffset;
bounds.insert(startx, lineStartY - 10, stopx, lineStartY);
}
bounds.bumpVerticalPos(totalOffset);
msgModel.height += totalOffset;
msgModel.stopy = msgModel.starty + msgModel.height;
bounds.insert(msgModel.fromBounds, msgModel.starty, msgModel.toBounds, msgModel.stopy);
return lineStarty;
return lineStartY;
};
/**
@ -328,10 +328,10 @@ const boundMessage = function (diagram, msgModel) {
*
* @param {any} diagram - The parent of the message element
* @param {any} msgModel - The model containing fields describing a message
* @param {number} lineStarty - The Y coordinate at which the message line starts
* @param {number} lineStartY - The Y coordinate at which the message line starts
* @param diagObj
*/
const drawMessage = function (diagram, msgModel, lineStarty, diagObj) {
const drawMessage = function (diagram, msgModel, lineStartY, diagObj) {
const { startx, stopx, starty, message, type, sequenceIndex, sequenceVisible } = msgModel;
const textDims = utils.calculateTextDimensions(message, messageFont(conf));
const textObj = svgDraw.getTextObj();
@ -360,8 +360,8 @@ const drawMessage = function (diagram, msgModel, lineStarty, diagObj) {
.append('path')
.attr(
'd',
`M ${startx},${lineStarty} H ${startx + Math.max(conf.width / 2, textWidth / 2)} V ${
lineStarty + 25
`M ${startx},${lineStartY} H ${startx + Math.max(conf.width / 2, textWidth / 2)} V ${
lineStartY + 25
} H ${startx}`
);
} else {
@ -372,27 +372,27 @@ const drawMessage = function (diagram, msgModel, lineStarty, diagObj) {
'M ' +
startx +
',' +
lineStarty +
lineStartY +
' C ' +
(startx + 60) +
',' +
(lineStarty - 10) +
(lineStartY - 10) +
' ' +
(startx + 60) +
',' +
(lineStarty + 30) +
(lineStartY + 30) +
' ' +
startx +
',' +
(lineStarty + 20)
(lineStartY + 20)
);
}
} else {
line = diagram.append('line');
line.attr('x1', startx);
line.attr('y1', lineStarty);
line.attr('y1', lineStartY);
line.attr('x2', stopx);
line.attr('y2', lineStarty);
line.attr('y2', lineStartY);
}
// Make an SVG Container
// Draw the line
@ -440,7 +440,7 @@ const drawMessage = function (diagram, msgModel, lineStarty, diagObj) {
diagram
.append('text')
.attr('x', startx)
.attr('y', lineStarty + 4)
.attr('y', lineStartY + 4)
.attr('font-family', 'sans-serif')
.attr('font-size', '12px')
.attr('text-anchor', 'middle')
@ -587,12 +587,12 @@ function adjustLoopHeightForWrap(loopWidths, msg, preMargin, postMargin, addLoop
* @param {any} _text The text of the diagram
* @param {any} id The id of the diagram which will be used as a DOM element id¨
* @param {any} _version Mermaid version from package.json
* @param {any} diagObj A stanard diagram containing the db and the text and type etc of the diagram
* @param {any} diagObj A standard diagram containing the db and the text and type etc of the diagram
*/
export const draw = function (_text, id, _version, diagObj) {
const { securityLevel, sequence } = configApi.getConfig();
conf = sequence;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);
@ -811,8 +811,8 @@ export const draw = function (_text, id, _version, diagObj) {
msgModel.starty = bounds.getVerticalPos();
msgModel.sequenceIndex = sequenceIndex;
msgModel.sequenceVisible = diagObj.db.showSequenceNumbers();
const lineStarty = boundMessage(diagram, msgModel);
messagesToDraw.push({ messageModel: msgModel, lineStarty: lineStarty });
const lineStartY = boundMessage(diagram, msgModel);
messagesToDraw.push({ messageModel: msgModel, lineStartY: lineStartY });
bounds.models.addMessage(msgModel);
} catch (e) {
log.error('error while drawing message', e);
@ -836,7 +836,7 @@ export const draw = function (_text, id, _version, diagObj) {
}
});
messagesToDraw.forEach((e) => drawMessage(diagram, e.messageModel, e.lineStarty, diagObj));
messagesToDraw.forEach((e) => drawMessage(diagram, e.messageModel, e.lineStartY, diagObj));
if (conf.mirrorActors) {
// Draw actors below diagram

6
packages/mermaid/src/diagrams/sequence/svgDraw.js
View File

@ -509,7 +509,7 @@ export const anchorElement = function (elem) {
*
* @param {any} elem - Element to append activation rect.
* @param {any} bounds - Activation box bounds.
* @param {any} verticalPos - Precise y cooridnate of bottom activation box edge.
* @param {any} verticalPos - Precise y coordinate of bottom activation box edge.
* @param {any} conf - Sequence diagram config object.
* @param {any} actorActivations - Number of activations on the actor.
*/
@ -527,10 +527,10 @@ export const drawActivation = function (elem, bounds, verticalPos, conf, actorAc
/**
* Draws a loop in the diagram
*
* @param {any} elem - Elemenet to append the loop to.
* @param {any} elem - Element to append the loop to.
* @param {any} loopModel - LoopModel of the given loop.
* @param {any} labelText - Text within the loop.
* @param {any} conf - Diagrom configuration
* @param {any} conf - Diagram configuration
* @returns {any}
*/
export const drawLoop = function (elem, loopModel, labelText, conf) {

4
packages/mermaid/src/diagrams/state/shapes.js
View File

@ -137,7 +137,7 @@ export const drawDescrState = (g, stateDef) => {
/** Adds the creates a box around the existing content and adds a panel for the id on top of the content. */
/**
* Function that creates an title row and a frame around a substate for a composit state diagram.
* Function that creates an title row and a frame around a substate for a composite state diagram.
* The function returns a new d3 svg object with updated width and height properties;
*
* @param {any} g The d3 svg object for the substate to framed
@ -178,7 +178,7 @@ export const addTitleAndBox = (g, stateDef, altBkg) => {
// descrLine.attr('x2', graphBox.width + getConfig().state.padding);
if (stateDef.doc) {
// cnsole.warn(
// console.warn(
// stateDef.id,
// 'orgX: ',
// orgX,

2
packages/mermaid/src/diagrams/state/stateDetector.ts
View File

@ -1,7 +1,7 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const stateDetector: DiagramDetector = (txt, config) => {
// If we have confired to only use new state diagrams this function should always return false
// If we have confirmed to only use new state diagrams this function should always return false
// as in not signalling true for a legacy state diagram
if (config?.state?.defaultRenderer === 'dagre-wrapper') return false;
return txt.match(/^\s*stateDiagram/) !== null;

4
packages/mermaid/src/diagrams/state/stateRenderer-v2.js
View File

@ -56,7 +56,7 @@ const setupNode = (g, parent, node, altFlag) => {
};
}
// Build of the array of description strings accordinging
// Build of the array of description strings according
if (node.description) {
if (Array.isArray(nodeDb[node.id].description)) {
// There already is an array of strings,add to it
@ -64,7 +64,7 @@ const setupNode = (g, parent, node, altFlag) => {
nodeDb[node.id].description.push(node.description);
} else {
if (nodeDb[node.id].description.length > 0) {
// if there is a description already transformit to an array
// if there is a description already transform it to an array
nodeDb[node.id].shape = 'rectWithTitle';
if (nodeDb[node.id].description === node.id) {
// If the previous description was the is, remove it

2
packages/mermaid/src/diagrams/state/stateRenderer.js
View File

@ -47,7 +47,7 @@ const insertMarkers = function (elem) {
export const draw = function (text, id, _version, diagObj) {
conf = getConfig().state;
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);

4
packages/mermaid/src/diagrams/user-journey/journeyRenderer.ts
View File

@ -54,7 +54,7 @@ export const draw = function (text, id, version, diagObj) {
diagObj.parser.parse(text + '\n');
const securityLevel = getConfig().securityLevel;
// Handle root and Document for when rendering in sanbox mode
// Handle root and Document for when rendering in sandbox mode
let sandboxElement;
if (securityLevel === 'sandbox') {
sandboxElement = select('#i' + id);
@ -261,7 +261,7 @@ export const drawTasks = function (diagram, tasks, verticalPos) {
// Draw the box with the attached line
svgDraw.drawTask(diagram, task, conf);
bounds.insert(task.x, task.y, task.x + task.width + conf.taskMargin, 300 + 5 * 30); // stopy is the length of the descenders.
bounds.insert(task.x, task.y, task.x + task.width + conf.taskMargin, 300 + 5 * 30); // stopY is the length of the descenders.
}
};

2
packages/mermaid/src/diagrams/user-journey/svgDraw.js
View File

@ -218,7 +218,7 @@ export const drawSection = function (elem, section, conf) {
let taskCount = -1;
/**
* Draws an actor in the diagram with the attaced line
* Draws an actor in the diagram with the attached line
*
* @param {any} elem The HTML element
* @param {any} task The task to render

8
packages/mermaid/src/docs/index.html
View File

@ -15,6 +15,14 @@
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
<meta property="og:title" content="Mermaid" />
<meta property="og:url" content="https://mermaid-js.github.io/mermaid/" />
<meta property="og:image" content="https://mermaid-js.github.io/mermaid/img/header.png" />
<meta
property="og:description"
content="Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs."
/>
<meta property="og:type" content="website" />
<!-- <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css"> -->
<link rel="stylesheet" href="theme.css" />
<link

2
packages/mermaid/src/mermaidAPI.ts
View File

@ -368,7 +368,7 @@ export const removeExistingElements = (
* @param {string} id The id for the SVG element (the element to be rendered)
* @param {string} text The text for the graph definition
* @param {(svgCode: string, bindFunctions?: (element: Element) => void) => void} cb Callback which
* is called after rendering is finished with the svg code as inparam.
* is called after rendering is finished with the svg code as in param.
* @param {Element} svgContainingElement HTML element where the svg will be inserted. (Is usually element with the .mermaid class)
* inserted. If no svgContainingElement is provided then the SVG element will be appended to the body.
* @returns {void}

2
packages/mermaid/src/setupGraphViewbox.js
View File

@ -1,7 +1,7 @@
import { log } from './logger';
/**
* Applys d3 attributes
* Applies d3 attributes
*
* @param {any} d3Elem D3 Element to apply the attributes onto
* @param {[string, string][]} attrs Object.keys equivalent format of key to value mapping of attributes

2
packages/mermaid/src/themes/theme-base.js
View File

@ -126,7 +126,7 @@ class Theme {
this.specialStateColor = this.lineColor;
/* Color Scale */
/* Each color-set will have a background, a forgroupnd and a border color */
/* Each color-set will have a background, a foreground and a border color */
this.cScale0 = this.cScale0 || this.primaryColor;
this.cScale1 = this.cScale1 || this.secondaryColor;
this.cScale2 = this.cScale2 || this.tertiaryColor;

2
packages/mermaid/src/themes/theme-dark.js
View File

@ -173,7 +173,7 @@ class Theme {
this.cScale12 = this.cScale12 || '#010029';
/* Color Scale */
/* Each color-set will have a background, a forgroupnd and a border color */
/* Each color-set will have a background, a foreground and a border color */
this.cScale0 = this.cScale0 || this.primaryColor;
this.cScale1 = this.cScale1 || this.secondaryColor;
this.cScale2 = this.cScale2 || this.tertiaryColor;

17
packages/mermaid/src/themes/theme-default.js
View File

@ -121,7 +121,7 @@ class Theme {
}
updateColors() {
/* Color Scale */
/* Each color-set will have a background, a forgroupnd and a border color */
/* Each color-set will have a background, a foreground and a border color */
this.cScale0 = this.cScale0 || this.primaryColor;
this.cScale1 = this.cScale1 || this.secondaryColor;
this.cScale2 = this.cScale2 || this.tertiaryColor;
@ -147,11 +147,18 @@ class Theme {
this['cScaleInv' + i] = this['cScaleInv' + i] || adjust(this['cScale' + i], { h: 180 });
}
// Setup teh label color for the set
this.scaleLabelColor = this.scaleLabelColor || (this.darkMode ? 'black' : this.labelTextColor);
// Setup the label color for the set
this.scaleLabelColor =
this.scaleLabelColor !== 'calculated' && this.scaleLabelColor
? this.scaleLabelColor
: this.labelTextColor;
for (let i = 0; i < this.THEME_COLOR_LIMIT; i++) {
this['cScaleLabel' + i] = this['cScaleLabel' + i] || this.scaleLabelColor;
if (this.labelTextColor !== 'calculated') {
this.cScaleLabel0 = this.cScaleLabel0 || invert(this.labelTextColor);
this.cScaleLabel3 = this.cScaleLabel3 || invert(this.labelTextColor);
for (let i = 0; i < this.THEME_COLOR_LIMIT; i++) {
this['cScaleLabel' + i] = this['cScaleLabel' + i] || this.labelTextColor;
}
}
/* Flowchart variables */

7
packages/mermaid/src/themes/theme-forest.js
View File

@ -94,7 +94,7 @@ class Theme {
this.errorTextColor = '#552222';
}
updateColors() {
/* Each color-set will have a background, a forgroupnd and a border color */
/* Each color-set will have a background, a foreground and a border color */
this.cScale0 = this.cScale0 || this.primaryColor;
this.cScale1 = this.cScale1 || this.secondaryColor;
this.cScale2 = this.cScale2 || this.tertiaryColor;
@ -121,7 +121,10 @@ class Theme {
}
// Setup teh label color for the set
this.scaleLabelColor = this.scaleLabelColor || (this.darkMode ? 'black' : this.labelTextColor);
this.scaleLabelColor =
this.scaleLabelColor !== 'calculated' && this.scaleLabelColor
? this.scaleLabelColor
: this.labelTextColor;
for (let i = 0; i < this.THEME_COLOR_LIMIT; i++) {
this['cScaleLabel' + i] = this['cScaleLabel' + i] || this.scaleLabelColor;

2
packages/mermaid/src/themes/theme-neutral.js
View File

@ -110,7 +110,7 @@ class Theme {
this.border2 = this.contrast;
/* Color Scale */
/* Each color-set will have a background, a forgroupnd and a border color */
/* Each color-set will have a background, a foreground and a border color */
this.cScale0 = this.cScale0 || '#555';
this.cScale1 = this.cScale1 || '#F4F4F4';

4
packages/mermaid/src/utils.ts
View File

@ -109,7 +109,7 @@ export const detectInit = function (text: string, config?: MermaidConfig): Merma
*
* ```mermaid
* graph LR
* %%{somedirective}%%
* %%{someDirective}%%
* a-->b
* b-->c
* c-->d
@ -215,7 +215,7 @@ export const formatUrl = (linkStr, config) => {
/**
* Runs a function
*
* @param {string} functionName A dot seperated path to the function relative to the `window`
* @param {string} functionName A dot separated path to the function relative to the `window`
* @param {...any} params Parameters to pass to the function
*/
export const runFunc = (functionName, ...params) => {

5699
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff