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

chore: Update cspell and fix issues

Browse Source 
- covert `cSpell.json` to `cspell.config.yaml`
- break up the word list into multiple dictionary files
- fix spelling issues
- Enable spell checking code for non-test files
This commit is contained in:
Jason Dent 2024-02-14 23:17:44 +01:00
parent fe1cff3f55
commit 4a7489a7b6
96 changed files with 998 additions and 850 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

136
.cspell/code-terms.txt Normal file
View File

@ -0,0 +1,136 @@
# This file contains coding related terms
ALPHANUM
antiscript
APPLYCLASS
ARROWHEADSTYLE
ARROWTYPE
autonumber
axisl-line
Bigdecimal
birel
BIREL
bqstring
BQUOTE
bramp
BRKT
callbackargs
callbackname
classdef
classdefid
classentity
classname
COLONSEP
COMPOSIT_STATE
concat
controlx
controly
CSSCLASS
CYLINDEREND
CYLINDERSTART
datakey
DEND
descr
distp
distq
divs
docref
DOMID
doublecircle
DOUBLECIRCLEEND
DOUBLECIRCLESTART
DQUOTE
DSTART
edgesep
EMPTYSTR
enddate
ERDIAGRAM
flatmap
forwardable
frontmatter
funs
gantt
GENERICTYPE
getBoundarys
grammr
graphtype
interp
introdcued
INVTRAPEND
INVTRAPSTART
JDBC
jison
Kaufmann
keyify
LABELPOS
LABELTYPE
LEFTOF
Lexa
linebreak
LINETYPE
LINKSTYLE
LLABEL
loglevel
LOGMSG
lookaheads
mdast
minlen
Mstartx
MULT
NODIR
NSTR
Qcontrolx
reinit
rels
reqs
rewritelinks
rgba
RIGHTOF
sankey
sequencenumber
shrc
signaltype
someclass
SPACELINE
SPACELIST
STADIUMEND
STADIUMSTART
startdate
startx
starty
STMNT
stopx
stopy
strikethrough
stringifying
struct
STYLECLASS
STYLEOPTS
subcomponent
subcomponents
SUBROUTINEEND
SUBROUTINESTART
Subschemas
substr
TAGEND
TAGSTART
techn
TESTSTR
TEXTDATA
TEXTLENGTH
titlevalue
topbar
TRAPEND
TRAPSTART
ts-nocheck
tsdoc
typeof
typestr
unshift
verifymethod
VERIFYMTHD
WARN_DOCSDIR_DOESNT_MATCH
xhost
yaxis
yfunc
yytext
zenuml

8
.cspell/contributors.txt Normal file
View File

@ -0,0 +1,8 @@
# Contributors to mermaidjs, one per line
cpettitt
Dong Cai
Nikolay Rozhkov
Peng Xiao
subhash-halder
Vinod Sidharth
Ashish Jain

52
.cspell/cspell.config.yaml Normal file
View File

@ -0,0 +1,52 @@
# yaml-language-server: $schema=https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json
$schema: https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json
dictionaryDefinitions:
- name: code-terms
path: ./code-terms.txt
description: A list of coding related terms.
addWords: true
- name: mermaid-terms
path: ./mermaid-terms.txt
description: A list of terms related to the mermaid project.
addWords: true
- name: misc-terms
path: ./misc-terms.txt
description: A list of miscellaneous terms.
- name: 3rd-party-terms
path: ./libraries.txt
description: A list of 3rd party terms from dependencies.
addWords: true
- name: contributors
path: ./contributors.txt
description: A list of contributors to the mermaid project.
type: 'W'
addWords: true
# cspell:disable
- name: suggestions
words:
- none
suggestWords:
- seperator:separator
- vertice:vertex
# cspell:enable
patterns:
- name: character-set-cyrillic
pattern: '/\p{Script_Extensions=Cyrillic}+/gu'
- name: svg-block
pattern: '<svg[\S\s]+?</svg>'
- name: json-property
pattern: '/"[\w/@-]+":/g'
dictionaries:
- mermaid-terms
- suggestions
- contributors
ignorePaths:
- '*.txt' # do not spell check local dictionaries
# cspell:dictionary misc-terms

69
.cspell/libraries.txt Normal file
View File

@ -0,0 +1,69 @@
# Add third party library terms below
acyclicer
Antlr
Appli
applitools
Asciidoctor
Astah
automerge
bilkent
bisheng
codedoc
Codemia
codepaths
csstree
cytoscape
cytoscape-cose-bilkent
dagre
dagre-d3
Deepdwn
Docsify
Docsy
DokuWiki
dompurify
elkjs
fontawesome
Foswiki
Gitea
graphlib
Grav
iconify
Inkdrop
jiti
jsdocs
jsfiddle
jsonschema
katex
khroma
mathml
matplotlib
mdbook
Mermerd
mkdocs
Nextra
nodenext
npmjs
pageview
pathe
phpbb
pixelmatch
Podlite
presetAttributify
pyplot
redmine
rehype
rscratch
sparkline
sphinxcontrib
ssim
stylis
Swimm
tsbuildinfo
Tuleap
Typora
unocss
unplugin
unstub
vite
vitest
Zune

39
.cspell/mermaid-terms.txt Normal file
View File

@ -0,0 +1,39 @@
Adamiecki
arrowend
bmatrix
braintree
catmull
compositTitleSize
doublecircle
elems
gantt
gitgraph
gzipped
knsv
Knut
marginx
marginy
Markdownish
mermaidjs
mindmap
mindmaps
multigraph
nodesep
NOTEGROUP
Pinterest
rankdir
ranksep
rect
rects
sandboxed
siebling
statediagram
substate
Sveidqvist
unfixable
Viewbox
viewports
visio
vitepress
xlink
xychart

4
.cspell/misc-terms.txt Normal file
View File

@ -0,0 +1,4 @@
colour
colours
mitigations
newbranch

19
.eslintrc.cjs
View File

@ -78,9 +78,9 @@ module.exports = {
'@cspell/spellchecker': [
'error',
{
checkIdentifiers: false,
checkStrings: false,
checkStringTemplates: false,
checkIdentifiers: true,
checkStrings: true,
checkStringTemplates: true,
},
],
'no-empty': [
@ -159,6 +159,19 @@ module.exports = {
'@typescript-eslint/no-unused-vars': 'off',
},
},
{
files: ['*.spec.{ts,js}', 'tests/**', 'cypress/**/*.js'],
rules: {
'@cspell/spellchecker': [
'error',
{
checkIdentifiers: false,
checkStrings: false,
checkStringTemplates: false,
},
],
},
},
{
files: ['*.html', '*.md', '**/*.md/*'],
rules: {

4
README.md
View File

@ -120,7 +120,7 @@ C -->|Two| E[Result 2]
```
sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
@ -132,7 +132,7 @@ Bob-->>John: Jolly good!
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!

4
README.zh-CN.md
View File

@ -93,7 +93,7 @@ C -->|Two| E[Result 2]
```
sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
@ -105,7 +105,7 @@ Bob-->>John: Jolly good!
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!

212
cSpell.json
View File

@ -1,212 +0,0 @@
{
"version": "0.2",
"language": "en",
"words": [
"acyclicer",
"adamiecki",
"alois",
"aloisklink",
"antiscript",
"antlr",
"appli",
"applitools",
"asciidoctor",
"ashish",
"ashishjain",
"astah",
"bbox",
"bilkent",
"bisheng",
"blrs",
"braintree",
"brkt",
"brolin",
"brotli",
"catmull",
"città",
"classdef",
"codedoc",
"codemia",
"colour",
"colours",
"commitlint",
"cpettitt",
"customizability",
"cuzon",
"cytoscape",
"dagre",
"deepdwn",
"descr",
"docsify",
"docsy",
"doku",
"dompurify",
"dont",
"doublecircle",
"edgechromium",
"elems",
"elkjs",
"elle",
"faber",
"flatmap",
"foswiki",
"frontmatter",
"ftplugin",
"gantt",
"gitea",
"gitgraph",
"globby",
"graphlib",
"graphviz",
"grav",
"greywolf",
"gzipped",
"huynh",
"huynhicode",
"inkdrop",
"jaoude",
"jgreywolf",
"jison",
"jiti",
"katex",
"kaufmann",
"khroma",
"klemm",
"klink",
"knsv",
"knut",
"knutsveidqvist",
"laganeckas",
"linetype",
"lintstagedrc",
"logmsg",
"lucida",
"markdownish",
"mathml",
"matthieu",
"matthieumorel",
"mdast",
"mdbook",
"mermaidjs",
"mermerd",
"mindaugas",
"mindmap",
"mindmaps",
"mitigations",
"mkdocs",
"mmorel",
"mult",
"neurodiverse",
"nextra",
"nikolay",
"nirname",
"npmjs",
"orlandoni",
"pathe",
"pbrolin",
"phpbb",
"pixelmatch",
"plantuml",
"playfair",
"pnpm",
"podlite",
"quence",
"radious",
"ranksep",
"rect",
"rects",
"reda",
"redmine",
"regexes",
"rehype",
"roledescription",
"rozhkov",
"sandboxed",
"sankey",
"setupgraphviewbox",
"shiki",
"sidharth",
"sidharthv",
"sphinxcontrib",
"ssim",
"startx",
"starty",
"statediagram",
"steph",
"stopx",
"stopy",
"stylis",
"subhash-halder",
"substate",
"sulais",
"sveidqvist",
"swimm",
"techn",
"teststr",
"textlength",
"treemap",
"ts-nocheck",
"tsdoc",
"tuleap",
"tylerlong",
"typora",
"ugge",
"unist",
"unocss",
"upvoting",
"valign",
"verdana",
"viewports",
"vinod",
"visio",
"vitepress",
"vueuse",
"xlink",
"xychart",
"yash",
"yokozuna",
"zenuml",
"zune"
],
"patterns": [
{ "name": "Markdown links", "pattern": "\\((.*)\\)", "description": "" },
{
"name": "Markdown code blocks",
"pattern": "/^(\\s*`{3,}).*[\\s\\S]*?^\\1/gmx",
"description": "Taken from the cSpell example at https://cspell.org/configuration/patterns/#verbose-regular-expressions"
},
{
"name": "Inline code blocks",
"pattern": "\\`([^\\`\\r\\n]+?)\\`",
"description": "https://stackoverflow.com/questions/41274241/how-to-capture-inline-markdown-code-but-not-a-markdown-code-fence-with-regex"
},
{ "name": "Link contents", "pattern": "\\<a(.*)\\>", "description": "" },
{ "name": "Snippet references", "pattern": "-- snippet:(.*)", "description": "" },
{
"name": "Snippet references 2",
"pattern": "\\<\\[sample:(.*)",
"description": "another kind of snippet reference"
},
{ "name": "Multi-line code blocks", "pattern": "/^\\s*```[\\s\\S]*?^\\s*```/gm" },
{
"name": "HTML Tags",
"pattern": "<[^>]*>",
"description": "Reference: https://stackoverflow.com/questions/11229831/regular-expression-to-remove-html-tags-from-a-string"
}
],
"ignoreRegExpList": [
"Markdown links",
"Markdown code blocks",
"Inline code blocks",
"Link contents",
"Snippet references",
"Snippet references 2",
"Multi-line code blocks",
"HTML Tags"
],
"ignorePaths": [
"packages/mermaid/src/docs/CHANGELOG.md",
"packages/mermaid/src/docs/.vitepress/redirect.ts",
"packages/mermaid/src/docs/.vitepress/contributor-names.json"
]
}

45
cspell.config.yaml Normal file
View File

@ -0,0 +1,45 @@
# yaml-language-server: $schema=https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json
$schema: https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json
version: '0.2'
language: en
import:
- ./.cspell/cspell.config.yaml
ignoreRegExpList:
- character-set-cyrillic
- svg-block
ignorePaths:
- '*lock.{yaml,json}'
- dist
- CHANGELOG.md
- packages/mermaid/src/docs/.vitepress/redirect.ts
- packages/mermaid/src/docs/.vitepress/contributor-names.json
- backup
- '**/*.spec.{js,ts}' # checked by eslint
- 'tests/webpack/src/index.js' # checked by eslint
- 'cypress/**/*.js' # checked by eslint
- '*.csv'
- '*.patch'
- 'docs/**/*.html'
- 'cypress/platform/**'
dictionaries:
- misc-terms
overrides:
- filename:
- '**/*.{jison,ts,mts,cjs,mjs,js,json,yaml,yml,md,html}'
- 'run'
- Dockerfile
ignoreRegExpList:
- js-unicode-escape
dictionaries:
- code-terms
- 3rd-party-terms
- fonts
- html
- lorem-ipsum
- filename: '**/package.json'
ignoreRegExpList:
- json-property
# cspell:dictionaries code-terms

4
demos/xychart.html
View File

@ -137,7 +137,7 @@ config:
plotReservedSpacePercent: 60
---
xychart-beta
title "Sales Revene"
title "Sales Revenue"
x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
y-axis "Revenue (in $)" 4000 --> 11000
bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
@ -163,7 +163,7 @@ config:
plotColorPalette: "#008000, #faba63"
---
xychart-beta
title "Sales Revene"
title "Sales Revenue"
x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
y-axis "Revenue (in $)" 4000 --> 11000
bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]

10
docs/community/contributing.md
View File

@ -132,7 +132,7 @@ All tests should run successfully without any errors or failures.
## Workflow
Contributing process is very simple and strightforward:
Contributing process is very simple and straightforward:
```mermaid
flowchart LR
@ -376,7 +376,7 @@ eg: `# Feature Name (v<MERMAID_RELEASE_VERSION>+)`
We know it can sometimes be hard to code _and_ write user documentation.
Create another issue specifically for the documentation.\
Create another issue specifically for the documentation.
You will need to help with the PR, but definitely ask for help if you feel stuck.
When it feels hard to write stuff out, explaining it to someone and having that person ask you clarifying questions can often be 80% of the work!
@ -401,14 +401,14 @@ The contents of [mermaid.js.org](https://mermaid.js.org/) are based on the docs
flowchart LR
classDef default fill:#fff,color:black,stroke:black
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be publised on Official Website"]
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be published on Official Website"]
```
```mermaid
flowchart LR
classDef default fill:#fff,color:black,stroke:black
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be publised on Official Website"]
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be published on Official Website"]
```
### Running the Documentation Website Locally
@ -519,3 +519,5 @@ You have successfully submitted your improvements! What is next?
- When a release is ready, the `release/x.x.x` branch will be created, extensively tested and knsv will be in charge of the release process.
Thanks for you help!
<!--- cspell:ignore florbs --->

2
docs/config/accessibility.md
View File

@ -19,7 +19,7 @@ Mermaid will automatically insert the [aria-roledescription](#aria-roledescripti
The [aria-roledescription](https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription) for the SVG HTML element is set to the diagram type key. (Note this may be slightly different than the keyword used for the diagram in the diagram text.)
For example: The diagram type key for a state diagram is "stateDiagram". Here (a part of) the HTML of the SVG tag that shows the automatically inserted aria-roledscription set to "stateDiagram". _(Note that some of the SVG attributes and the SVG contents are omitted for clarity.):_
For example: The diagram type key for a state diagram is "stateDiagram". Here (a part of) the HTML of the SVG tag that shows the automatically inserted aria-roledescription set to "stateDiagram". _(Note that some of the SVG attributes and the SVG contents are omitted for clarity.):_
```html
<svg

2
docs/config/theming.md
View File

@ -65,7 +65,7 @@ Example of `init` directive setting the `theme` to `forest`:
a --> b
```
> **Reminder**: the only theme that can be customed is the `base` theme. The following section covers how to use `themeVariables` for customizations.
> **Reminder**: the only theme that can be customized is the `base` theme. The following section covers how to use `themeVariables` for customizations.
## Customizing Themes with `themeVariables`

5
docs/config/usage.md
View File

@ -436,3 +436,8 @@ mermaid_config.startOnLoad = true;
> **Warning**
> This way of setting the configuration is deprecated. Instead the preferred way is to use the initialize method. This functionality is only kept for backwards compatibility.
<!---
cspell:locale en,en-gb
cspell:ignore pumbaa
--->

2
docs/ecosystem/tutorials.md
View File

@ -80,3 +80,5 @@ graph LR;
**Output**
![Example graph of the Python integration](img/python-mermaid-integration.png)
<!--- cspell:ignore Elle Jaoude Neurodiverse graphbytes --->

4
docs/intro/index.md
View File

@ -88,7 +88,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail!
@ -102,7 +102,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail!

4
docs/syntax/block.md
View File

@ -425,7 +425,7 @@ block-beta
ida space:3 idb idc
```
Note that you can set how many columns the spece block occupied using the number notaion `space:num` where num is a number indicating the num columns width. You can alsio use `space` which defaults to one column.
Note that you can set how many columns the space block occupied using the number notation `space:num` where num is a number indicating the num columns width. You can also use `space` which defaults to one column.
The variety of shapes and special blocks in Mermaid enhances the expressive power of block diagrams, allowing for more accurate and context-specific representations. These options give users the flexibility to create diagrams that are both informative and visually appealing. In the next sections, we will explore the ways to connect these blocks and customize their appearance.
@ -640,7 +640,7 @@ A common mistake is incorrect linking syntax, which can lead to unexpected resul
A - B
**Correction**:
Ensure that links between blocks are correctly specified with arrows (--> or ---) to define the direction and type of connection. Also rememeber that one of the fundaments for block diagram is to give the author full control of where the boxes are positioned so in the example you need to add a space between the boxes:
Ensure that links between blocks are correctly specified with arrows (--> or ---) to define the direction and type of connection. Also remember that one of the fundaments for block diagram is to give the author full control of where the boxes are positioned so in the example you need to add a space between the boxes:
```mermaid-example
block-beta

4
docs/syntax/c4.md
View File

@ -191,7 +191,7 @@ The following unfinished features are not supported in the short term.
- [x] Rel_L, Rel_Left
- [x] Rel_R, Rel_Right
- [x] Rel_Back
- [x] RelIndex \* Compatible with C4-Plantuml syntax, but ignores the index parameter. The sequence number is determined by the order in which the rel statements are written.
- [x] RelIndex \* Compatible with C4-PlantUML syntax, but ignores the index parameter. The sequence number is determined by the order in which the rel statements are written.
- [ ] Custom tags/stereotypes support and skin param updates
- [ ] AddElementTag(tagStereo, ?bgColor, ?fontColor, ?borderColor, ?shadowing, ?shape, ?sprite, ?techn, ?legendText, ?legendSprite): Introduces a new element tag. The styles of the tagged elements are updated and the tag is displayed in the calculated legend.
@ -621,3 +621,5 @@ UpdateRelStyle(customerA, bankA, $offsetY="60")
UpdateRelStyle(db, db2, $offsetY="-10")
```
<!--- cspell:ignore bigbank bigbankdb techn mbsfacade --->

2
docs/syntax/classDiagram.md
View File

@ -240,7 +240,7 @@ class BankAccount{
#### Generic Types
Generics can be representated as part of a class definition, and for class members/return types. In order to denote an item as generic, you enclose that type within `~` (**tilde**). **Nested** type declarations such as `List<List<int>>` are supported, though generics that include a comma are currently not supported. (such as `List<List<K, V>>`)
Generics can be represented as part of a class definition, and for class members/return types. In order to denote an item as generic, you enclose that type within `~` (**tilde**). **Nested** type declarations such as `List<List<int>>` are supported, though generics that include a comma are currently not supported. (such as `List<List<K, V>>`)
> _note_ when a generic is used within a class definition, the generic type is NOT considered part of the class name. i.e.: for any syntax which required you to reference the class name, you need to drop the type part of the definition. This also means that mermaid does not currently support having two classes with the same name, but different generic types.

2
docs/syntax/entityRelationshipDiagram.md
View File

@ -307,3 +307,5 @@ The following CSS class selectors are available for richer styling:
| `.er.relationshipLabel` | The label for a relationship |
| `.er.relationshipLabelBox` | The box surrounding a relationship label |
| `.er.relationshipLine` | The line representing a relationship between entities |
<!--- cspell:locale en,en-gb --->

6
docs/syntax/examples.md
View File

@ -175,7 +175,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts<br/>prevail...
@ -189,7 +189,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts<br/>prevail...
@ -297,3 +297,5 @@ gitGraph:
branch b2
commit
```
<!--- cspell:ignore Ashish newbranch --->

2
docs/syntax/flowchart.md
View File

@ -1200,3 +1200,5 @@ mermaid.flowchartConfig = {
width: 100%
}
```
<!--- cspell:ignore lagom --->

2
docs/syntax/gantt.md
View File

@ -298,7 +298,7 @@ gantt
## Output in compact mode
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceeding YAML settings.
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceding YAML settings.
```mermaid-example
---

4
docs/syntax/gitgraph.md
View File

@ -1626,7 +1626,7 @@ See how the commit label color and background color are changed to the values sp
### Customizing Commit Label Font Size
You can customize commit using the `commitLabelFontSize` theme variables for changing in the font soze of the commit label .
You can customize commit using the `commitLabelFontSize` theme variables for changing in the font size of the commit label .
Example:
Now let's override the default values for the `commitLabelFontSize` variable:
@ -1677,7 +1677,7 @@ See how the commit label font size changed.
### Customizing Tag Label Font Size
You can customize commit using the `tagLabelFontSize` theme variables for changing in the font soze of the tag label .
You can customize commit using the `tagLabelFontSize` theme variables for changing in the font size of the tag label .
Example:
Now let's override the default values for the `tagLabelFontSize` variable:

5
docs/syntax/mindmap.md
View File

@ -305,3 +305,8 @@ From version 9.4.0 you can simplify this code to:
```
You can also refer the implementation in the live editor [here](https://github.com/mermaid-js/mermaid-live-editor/blob/develop/src/lib/util/mermaid.ts) to see how the async loading is done.
<!---
cspell:locale en,en-gb
cspell:ignore Buzan
--->

2
docs/syntax/requirementDiagram.md
View File

@ -241,3 +241,5 @@ This example uses all features of the diagram.
test_entity3 - verifies -> test_req5
test_req <- copies - test_entity2
```
<!--- cspell:ignore reqs --->

2
docs/syntax/sankey.md
View File

@ -301,3 +301,5 @@ Graph layout can be changed by setting `nodeAlignment` to:
- `center`
- `left`
- `right`
<!--- cspell:ignore Ngas bioenergy biofuel --->

12
docs/syntax/sequenceDiagram.md
View File

@ -172,8 +172,8 @@ The actor(s) can be grouped in vertical boxes. You can define a color (if not, i
end
A->>J: Hello John, how are you?
J->>A: Great!
A->>B: Hello Bob, how is Charly?
B->>C: Hello Charly, how are you?
A->>B: Hello Bob, how is Charley?
B->>C: Hello Charley, how are you?
```
```mermaid
@ -188,8 +188,8 @@ The actor(s) can be grouped in vertical boxes. You can define a color (if not, i
end
A->>J: Hello John, how are you?
J->>A: Great!
A->>B: Hello Bob, how is Charly?
B->>C: Hello Charly, how are you?
A->>B: Hello Bob, how is Charley?
B->>C: Hello Charley, how are you?
```
## Messages
@ -646,7 +646,7 @@ It can also be turned on via the diagram code as in the diagram:
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
@ -659,7 +659,7 @@ sequenceDiagram
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!

4
docs/syntax/stateDiagram.md
View File

@ -622,7 +622,7 @@ Spaces can be added to a state by first defining the state with an id and then r
In the following example there is a state with the id **yswsii** and description **Your state with spaces in it**.
After it has been defined, **yswsii** is used in the diagram in the first transition (`[*] --> yswsii`)
and also in the transition to **YetAnotherState** (`yswsii --> YetAnotherState`).\
and also in the transition to **YetAnotherState** (`yswsii --> YetAnotherState`).
(**yswsii** has been styled so that it is different from the other states.)
```mermaid-example
@ -648,3 +648,5 @@ stateDiagram
yswsii --> YetAnotherState
YetAnotherState --> [*]
```
<!--- cspell:ignore yswsii --->

2
docs/syntax/timeline.md
View File

@ -191,7 +191,7 @@ As explained earlier, each section has a color scheme, and each time period and
However, if there is no section defined, then we have two possibilities:
1. Style time periods individually, i.e. each time period(and its coressponding events) will have its own color scheme. This is the DEFAULT behavior.
1. Style time periods individually, i.e. each time period(and its corresponding events) will have its own color scheme. This is the DEFAULT behavior.
```mermaid-example
timeline

4
docs/syntax/xyChart.md
View File

@ -139,11 +139,11 @@ The only two things required are the chart name (`xychart-beta`) and one data se
| ---------------- | --------------------------------------------------------- |
| backgroundColor | Background color of the whole chart |
| titleColor | Color of the Title text |
| xAxisLableColor | Color of the x-axis labels |
| xAxisLabelColor | Color of the x-axis labels |
| xAxisTitleColor | Color of the x-axis title |
| xAxisTickColor | Color of the x-axis tick |
| xAxisLineColor | Color of the x-axis line |
| yAxisLableColor | Color of the y-axis labels |
| yAxisLabelColor | Color of the y-axis labels |
| yAxisTitleColor | Color of the y-axis title |
| yAxisTickColor | Color of the y-axis tick |
| yAxisLineColor | Color of the y-axis line |

3
package.json
View File

@ -64,7 +64,7 @@
"@applitools/eyes-cypress": "^3.40.6",
"@commitlint/cli": "^17.6.1",
"@commitlint/config-conventional": "^17.6.1",
"@cspell/eslint-plugin": "^6.31.1",
"@cspell/eslint-plugin": "^8.3.2",
"@cypress/code-coverage": "^3.12.18",
"@rollup/plugin-typescript": "^11.1.1",
"@types/cors": "^2.8.13",
@ -85,6 +85,7 @@
"ajv": "^8.12.0",
"concurrently": "^8.0.1",
"cors": "^2.8.5",
"cspell": "^8.3.2",
"cypress": "^12.17.4",
"cypress-image-snapshot": "^4.0.1",
"esbuild": "^0.20.0",

3
packages/mermaid/package.json
View File

@ -33,7 +33,7 @@
"docs:dev": "pnpm docs:pre:vitepress && concurrently \"pnpm --filter ./src/vitepress dev\" \"tsx scripts/docs.cli.mts --watch --vitepress\"",
"docs:dev:docker": "pnpm docs:pre:vitepress && concurrently \"pnpm --filter ./src/vitepress dev:docker\" \"tsx scripts/docs.cli.mts --watch --vitepress\"",
"docs:serve": "pnpm docs:build:vitepress && vitepress serve src/vitepress",
"docs:spellcheck": "cspell --config ../../cSpell.json \"src/docs/**/*.md\"",
"docs:spellcheck": "cspell \"src/docs/**/*.md\"",
"docs:release-version": "tsx scripts/update-release-version.mts",
"docs:verify-version": "tsx scripts/update-release-version.mts --verify",
"types:build-config": "tsx scripts/create-types-from-json-schema.mts",
@ -102,7 +102,6 @@
"chokidar": "^3.5.3",
"concurrently": "^8.0.1",
"cpy-cli": "^4.2.0",
"cspell": "^6.31.1",
"csstree-validator": "^3.0.0",
"globby": "^13.1.4",
"jison": "^0.4.18",

2
packages/mermaid/src/dagre-wrapper/GraphObjects.md
View File

@ -24,7 +24,7 @@ flowchart
The new nodes C1 and C2 are a special type of nodes, clusterNodes. ClusterNodes have have the nodes in the cluster including the cluster attached in a graph object.
When rendering this diagram it it beeing rendered recursively. The diagram is rendered by the dagre-mermaid:render function which in turn will be used to render the node C1 and the node C2. The result of those renderings will be inserted as nodes in the "root" diagram. With this recursive approach it would be possible to have different layout direction for each cluster.
When rendering this diagram it is being rendered recursively. The diagram is rendered by the dagre-mermaid:render function which in turn will be used to render the node C1 and the node C2. The result of those renderings will be inserted as nodes in the "root" diagram. With this recursive approach it would be possible to have different layout direction for each cluster.
```
{ clusterNode: true, graph }

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

@ -69,13 +69,13 @@ const rect = (parent, node) => {
if (useHtmlLabels) {
label.attr(
'transform',
// This puts the labal on top of the box instead of inside it
// This puts the label on top of the box instead of inside it
`translate(${node.x - bbox.width / 2}, ${node.y - node.height / 2 + subGraphTitleTopMargin})`
);
} else {
label.attr(
'transform',
// This puts the labal on top of the box instead of inside it
// This puts the label on top of the box instead of inside it
`translate(${node.x}, ${node.y - node.height / 2 + subGraphTitleTopMargin})`
);
}

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

@ -60,7 +60,7 @@ const createLabel = (_vertexText, style, isTitle, isNode) => {
const node = {
isNode,
label: decodeEntities(vertexText).replace(
/fa[blrs]?:fa-[\w-]+/g,
/fa[blrs]?:fa-[\w-]+/g, // cspell: disable-line
(s) => `<i class='${s.replace(':', ' ')}'></i>`
),
labelStyle: style.replace('fill:', 'color:'),

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

@ -269,7 +269,7 @@ export const intersection = (node, outsidePoint, insidePoint) => {
res.y = outsidePoint.y;
}
log.debug(`abc89 topp/bott calc, Q ${Q}, q ${q}, R ${R}, r ${r}`, res);
log.debug(`abc89 topp/bott calc, Q ${Q}, q ${q}, R ${R}, r ${r}`, res); // cspell: disable-line
return res;
} else {
@ -306,20 +306,20 @@ export const intersection = (node, outsidePoint, insidePoint) => {
* and return an update path ending by the border of the node.
*
* @param {Array} _points
* @param {any} boundryNode
* @param {any} boundaryNode
* @returns {Array} Points
*/
const cutPathAtIntersect = (_points, boundryNode) => {
log.debug('abc88 cutPathAtIntersect', _points, boundryNode);
const cutPathAtIntersect = (_points, boundaryNode) => {
log.debug('abc88 cutPathAtIntersect', _points, boundaryNode);
let points = [];
let lastPointOutside = _points[0];
let isInside = false;
_points.forEach((point) => {
// check if point is inside the boundary rect
if (!outsideNode(boundryNode, point) && !isInside) {
if (!outsideNode(boundaryNode, point) && !isInside) {
// First point inside the rect found
// Calc the intersection coord between the point anf the last point outside the rect
const inter = intersection(boundryNode, lastPointOutside, point);
const inter = intersection(boundaryNode, lastPointOutside, point);
// // Check case where the intersection is the same as the last point
let pointPresent = false;

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

@ -16,7 +16,7 @@ import { log } from '../logger.js';
import { getSubGraphTitleMargins } from '../utils/subGraphTitleMargins.js';
import { getConfig } from '../diagram-api/diagramAPI.js';
const recursiveRender = async (_elem, graph, diagramtype, id, parentCluster, siteConfig) => {
const recursiveRender = async (_elem, graph, diagramType, id, parentCluster, siteConfig) => {
log.info('Graph in recursive render: XXX', graphlibJson.write(graph), parentCluster);
const dir = graph.graph().rankdir;
log.trace('Dir in recursive render - dir:', dir);
@ -57,7 +57,7 @@ const recursiveRender = async (_elem, graph, diagramtype, id, parentCluster, sit
const o = await recursiveRender(
nodes,
node.graph,
diagramtype,
diagramType,
id,
graph.node(v),
siteConfig
@ -95,7 +95,7 @@ const recursiveRender = async (_elem, graph, diagramtype, id, parentCluster, sit
log.info('Edge ' + e.v + ' -> ' + e.w + ': ', e, ' ', JSON.stringify(graph.edge(e)));
// Check if link is either from or to a cluster
log.info('Fix', clusterDb, 'ids:', e.v, e.w, 'Translateing: ', clusterDb[e.v], clusterDb[e.w]);
log.info('Fix', clusterDb, 'ids:', e.v, e.w, 'Translating: ', clusterDb[e.v], clusterDb[e.w]);
insertEdgeLabel(edgeLabels, edge);
});
@ -147,7 +147,7 @@ const recursiveRender = async (_elem, graph, diagramtype, id, parentCluster, sit
log.info('Edge ' + e.v + ' -> ' + e.w + ': ' + JSON.stringify(edge), edge);
edge.points.forEach((point) => (point.y += subGraphTitleTotalMargin / 2));
const paths = insertEdge(edgePaths, e, edge, clusterDb, diagramtype, graph, id);
const paths = insertEdge(edgePaths, e, edge, clusterDb, diagramType, graph, id);
positionEdgeLabel(edge, paths);
});
@ -161,8 +161,8 @@ const recursiveRender = async (_elem, graph, diagramtype, id, parentCluster, sit
return { elem, diff };
};
export const render = async (elem, graph, markers, diagramtype, id) => {
insertMarkers(elem, markers, diagramtype, id);
export const render = async (elem, graph, markers, diagramType, id) => {
insertMarkers(elem, markers, diagramType, id);
clearNodes();
clearEdges();
clearClusters();
@ -173,7 +173,7 @@ export const render = async (elem, graph, markers, diagramtype, id) => {
log.warn('Graph after:', JSON.stringify(graphlibJson.write(graph)));
// log.warn('Graph ever after:', graphlibJson.write(graph.node('A').graph));
const siteConfig = getConfig();
await recursiveRender(elem, graph, diagramtype, id, undefined, siteConfig);
await recursiveRender(elem, graph, diagramType, id, undefined, siteConfig);
};
// const shapeDefinitions = {};

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

@ -13,11 +13,11 @@ export const clear = () => {
clusterDb = {};
};
const isDescendant = (id, ancenstorId) => {
// if (id === ancenstorId) return true;
const isDescendant = (id, ancestorId) => {
// if (id === ancestorId) return true;
log.trace('In isDecendant', ancenstorId, ' ', id, ' = ', descendants[ancenstorId].includes(id));
if (descendants[ancenstorId].includes(id)) {
log.trace('In isDescendant', ancestorId, ' ', id, ' = ', descendants[ancestorId].includes(id));
if (descendants[ancestorId].includes(id)) {
return true;
}
@ -25,7 +25,7 @@ const isDescendant = (id, ancenstorId) => {
};
const edgeInCluster = (edge, clusterId) => {
log.info('Decendants of ', clusterId, ' is ', descendants[clusterId]);
log.info('Descendants of ', clusterId, ' is ', descendants[clusterId]);
log.info('Edge is ', edge);
// Edges to/from the cluster is not in the cluster, they are in the parent
if (edge.v === clusterId) {
@ -36,7 +36,7 @@ const edgeInCluster = (edge, clusterId) => {
}
if (!descendants[clusterId]) {
log.debug('Tilt, ', clusterId, ',not in decendants');
log.debug('Tilt, ', clusterId, ',not in descendants');
return false;
}
return (
@ -244,7 +244,7 @@ export const adjustClustersAndEdges = (graph, depth) => {
// d1 xor d2 - if either d1 is true and d2 is false or the other way around
if (d1 ^ d2) {
log.warn('Edge: ', edge, ' leaves cluster ', id);
log.warn('Decendants of XXX ', id, ': ', descendants[id]);
log.warn('Descendants of XXX ', id, ': ', descendants[id]);
clusterDb[id].externalConnections = true;
}
}
@ -286,6 +286,7 @@ export const adjustClustersAndEdges = (graph, depth) => {
clusterDb[e.w]
);
if (clusterDb[e.v] && clusterDb[e.w] && clusterDb[e.v] === clusterDb[e.w]) {
// cspell:ignore trixing
log.warn('Fixing and trixing link to self - removing XXX', e.v, e.w, e.name);
log.warn('Fixing and trixing - removing XXX', e.v, e.w, e.name);
v = getAnchorId(e.v);
@ -337,7 +338,7 @@ export const adjustClustersAndEdges = (graph, depth) => {
// Remove references to extracted cluster
// graph.edges().forEach(edge => {
// if (isDecendant(edge.v, clusterId) || isDecendant(edge.w, clusterId)) {
// if (isDescendant(edge.v, clusterId) || isDescendant(edge.w, clusterId)) {
// graph.removeEdge(edge);
// }
// });

2
packages/mermaid/src/diagram-api/types.ts
View File

@ -32,7 +32,7 @@ export interface DiagramDB {
getDiagramTitle?: () => string;
setAccTitle?: (title: string) => void;
getAccTitle?: () => string;
setAccDescription?: (describetion: string) => void;
setAccDescription?: (description: string) => void;
getAccDescription?: () => string;
setDisplayMode?: (title: string) => void;

4
packages/mermaid/src/diagrams/block/blockDB.ts
View File

@ -240,8 +240,8 @@ const setHierarchy = (block: Block[]): void => {
blocks = rootBlock.children;
};
const getColumns = (blockid: string): number => {
const block = blockDatabase[blockid];
const getColumns = (blockId: string): number => {
const block = blockDatabase[blockId];
if (!block) {
return -1;
}

8
packages/mermaid/src/diagrams/block/layout.ts
View File

@ -22,11 +22,11 @@ export function calculateBlockPosition(columns: number, position: number): Block
}
if (columns < 0) {
// Auto coulumns is set
// Auto columns is set
return { px: position, py: 0 };
}
if (columns === 1) {
// Auto coulumns is set
// Auto columns is set
return { px: 0, py: position };
}
// Calculate posX and posY
@ -145,9 +145,10 @@ function setBlockSizes(block: Block, db: BlockDB, siblingWidth = 0, siblingHeigh
height = siblingHeight;
const childWidth = (siblingWidth - xSize * padding - padding) / xSize;
const childHeight = (siblingHeight - ySize * padding - padding) / ySize;
// cspell:ignore indata
log.debug('Size indata abc88', block.id, 'childWidth', childWidth, 'maxWidth', maxWidth);
log.debug('Size indata abc88', block.id, 'childHeight', childHeight, 'maxHeight', maxHeight);
log.debug('Size indata abc88 xSize', xSize, 'paddiong', padding);
log.debug('Size indata abc88 xSize', xSize, 'padding', padding);
// set width of block to max width of children
for (const child of block.children) {
@ -238,6 +239,7 @@ function layoutBlocks(block: Block, db: BlockDB) {
const halfWidth = width / 2;
child.size.x = startingPosX + padding + halfWidth;
// cspell:ignore pyid
log.debug(
`abc91 layout blocks (calc) px, pyid:${
child.id

12
packages/mermaid/src/diagrams/block/parser/block.jison
View File

@ -173,13 +173,13 @@ spaceLines
| spaceLines NL
;
seperator
separator
: NL
{yy.getLogger().debug('Rule: seperator (NL) ');}
{yy.getLogger().debug('Rule: separator (NL) ');}
| SPACE
{yy.getLogger().debug('Rule: seperator (Space) ');}
{yy.getLogger().debug('Rule: separator (Space) ');}
| EOF
{yy.getLogger().debug('Rule: seperator (EOF) ');}
{yy.getLogger().debug('Rule: separator (EOF) ');}
;
start: BLOCK_DIAGRAM_KEY document EOF
@ -245,10 +245,10 @@ blockStatement
node
: NODE_ID
{ yy.getLogger().debug("Rule: node (NODE_ID seperator): ", $1); $$ = { id: $1 }; }
{ yy.getLogger().debug("Rule: node (NODE_ID separator): ", $1); $$ = { id: $1 }; }
| NODE_ID nodeShapeNLabel
{
yy.getLogger().debug("Rule: node (NODE_ID nodeShapeNLabel seperator): ", $1, $2);
yy.getLogger().debug("Rule: node (NODE_ID nodeShapeNLabel separator): ", $1, $2);
$$ = { id: $1, label: $2.label, typeStr: $2.typeStr, directions: $2.directions };
}
;

30
packages/mermaid/src/diagrams/c4/c4Db.js
View File

@ -11,7 +11,7 @@ let c4ShapeArray = [];
let boundaryParseStack = [''];
let currentBoundaryParse = 'global';
let parentBoundaryParse = '';
let boundarys = [
let boundaries = [
{
alias: 'global',
label: { text: 'global' },
@ -312,12 +312,12 @@ export const addPersonOrSystemBoundary = function (alias, label, type, tags, lin
}
let boundary = {};
const old = boundarys.find((boundary) => boundary.alias === alias);
const old = boundaries.find((boundary) => boundary.alias === alias);
if (old && alias === old.alias) {
boundary = old;
} else {
boundary.alias = alias;
boundarys.push(boundary);
boundaries.push(boundary);
}
// Don't allow null labels, either
@ -368,12 +368,12 @@ export const addContainerBoundary = function (alias, label, type, tags, link) {
}
let boundary = {};
const old = boundarys.find((boundary) => boundary.alias === alias);
const old = boundaries.find((boundary) => boundary.alias === alias);
if (old && alias === old.alias) {
boundary = old;
} else {
boundary.alias = alias;
boundarys.push(boundary);
boundaries.push(boundary);
}
// Don't allow null labels, either
@ -433,12 +433,12 @@ export const addDeploymentNode = function (
}
let boundary = {};
const old = boundarys.find((boundary) => boundary.alias === alias);
const old = boundaries.find((boundary) => boundary.alias === alias);
if (old && alias === old.alias) {
boundary = old;
} else {
boundary.alias = alias;
boundarys.push(boundary);
boundaries.push(boundary);
}
// Don't allow null labels, either
@ -514,7 +514,7 @@ export const updateElStyle = function (
) {
let old = c4ShapeArray.find((element) => element.alias === elementName);
if (old === undefined) {
old = boundarys.find((element) => element.alias === elementName);
old = boundaries.find((element) => element.alias === elementName);
if (old === undefined) {
return;
}
@ -697,14 +697,19 @@ export const getC4ShapeKeys = function (parentBoundary) {
return Object.keys(getC4ShapeArray(parentBoundary));
};
export const getBoundarys = function (parentBoundary) {
export const getBoundaries = function (parentBoundary) {
if (parentBoundary === undefined || parentBoundary === null) {
return boundarys;
return boundaries;
} else {
return boundarys.filter((boundary) => boundary.parentBoundary === parentBoundary);
return boundaries.filter((boundary) => boundary.parentBoundary === parentBoundary);
}
};
/**
* @deprecated Use getBoundaries instead
*/
export const getBoundarys = getBoundaries;
export const getRels = function () {
return rels;
};
@ -723,7 +728,7 @@ export const autoWrap = function () {
export const clear = function () {
c4ShapeArray = [];
boundarys = [
boundaries = [
{
alias: 'global',
label: { text: 'global' },
@ -804,6 +809,7 @@ export default {
getC4ShapeArray,
getC4Shape,
getC4ShapeKeys,
getBoundaries,
getBoundarys,
getCurrentBoundaryParse,
getParentBoundaryParse,

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

@ -542,15 +542,15 @@ function drawInsideBoundary(
);
}
parentBoundaryAlias = currentBoundary.alias;
let nextCurrentBoundarys = diagObj.db.getBoundarys(parentBoundaryAlias);
let nextCurrentBoundaries = diagObj.db.getBoundarys(parentBoundaryAlias);
if (nextCurrentBoundarys.length > 0) {
if (nextCurrentBoundaries.length > 0) {
// draw boundary inside currentBoundary
drawInsideBoundary(
diagram,
parentBoundaryAlias,
currentBounds,
nextCurrentBoundarys,
nextCurrentBoundaries,
diagObj
);
}

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

@ -687,3 +687,5 @@ export default {
insertComputerIcon,
insertClockIcon,
};
// cspell:ignoreRegExp /'Mstartx.*/g

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

@ -193,6 +193,7 @@ export const draw = function (text, id, _version, diagObj) {
const relations = diagObj.db.getRelations();
relations.forEach(function (relation) {
log.info(
// cspell:ignore tjoho
'tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)
);
g.setEdge(

8
packages/mermaid/src/diagrams/flowchart/elk/flowRenderer-elk.js
View File

@ -93,13 +93,13 @@ export const addVertices = async function (vert, svgId, root, doc, diagObj, pare
},
];
let radious = 0;
let radius = 0;
let _shape = '';
let layoutOptions = {};
// Set the shape based parameters
switch (vertex.type) {
case 'round':
radious = 5;
radius = 5;
_shape = 'rect';
break;
case 'square':
@ -163,8 +163,8 @@ export const addVertices = async function (vert, svgId, root, doc, diagObj, pare
shape: _shape,
labelText: vertexText,
labelType: vertex.labelType,
rx: radious,
ry: radious,
rx: radius,
ry: radius,
class: classStr,
style: styles.style,
id: vertex.id,

16
packages/mermaid/src/diagrams/flowchart/flowDb.js
View File

@ -29,7 +29,7 @@ let direction;
let version; // As in graph
// Functions to be run after graph rendering
let funs = [];
let funs = []; // cspell:ignore funs
const sanitizeText = (txt) => common.sanitizeText(txt, config);
@ -40,10 +40,10 @@ const sanitizeText = (txt) => common.sanitizeText(txt, config);
* @public
*/
export const lookUpDomId = function (id) {
const veritceKeys = Object.keys(vertices);
for (const veritceKey of veritceKeys) {
if (vertices[veritceKey].id === id) {
return vertices[veritceKey].domId;
const vertexKeys = Object.keys(vertices);
for (const vertexKey of vertexKeys) {
if (vertices[vertexKey].id === id) {
return vertices[vertexKey].domId;
}
}
return id;
@ -165,8 +165,8 @@ export const addSingleLink = function (_start, _end, type) {
throw new Error(
`Edge limit exceeded. ${edges.length} edges found, but the limit is ${config.maxEdges}.
Initialize mermaid with maxEdges set to a higher number to allow more edges.
You cannot set this config via configuration inside the diagram as it is a secure config.
Initialize mermaid with maxEdges set to a higher number to allow more edges.
You cannot set this config via configuration inside the diagram as it is a secure config.
You have to call mermaid.initialize.`
);
}
@ -426,7 +426,7 @@ const setupToolTips = function (element) {
const el = select(this);
const title = el.attr('title');
// Dont try to draw a tooltip if no data is provided
// Don't try to draw a tooltip if no data is provided
if (title === null) {
return;
}

12
packages/mermaid/src/diagrams/flowchart/flowRenderer-v2.js
View File

@ -81,12 +81,12 @@ export const addVertices = async function (vert, g, svgId, root, doc, diagObj) {
}
}
let radious = 0;
let radius = 0;
let _shape = '';
// Set the shape based parameters
switch (vertex.type) {
case 'round':
radious = 5;
radius = 5;
_shape = 'rect';
break;
case 'square':
@ -148,8 +148,8 @@ export const addVertices = async function (vert, g, svgId, root, doc, diagObj) {
shape: _shape,
labelText,
labelType: vertex.labelType,
rx: radious,
ry: radious,
rx: radius,
ry: radius,
class: classStr,
style: styles.style,
id: vertex.id,
@ -170,8 +170,8 @@ export const addVertices = async function (vert, g, svgId, root, doc, diagObj) {
labelType: vertex.labelType,
shape: _shape,
labelText,
rx: radious,
ry: radious,
rx: radius,
ry: radius,
class: classStr,
style: styles.style,
id: vertex.id,

12
packages/mermaid/src/diagrams/flowchart/flowRenderer.js
View File

@ -59,7 +59,7 @@ export const addVertices = async function (vert, g, svgId, root, _doc, diagObj)
const node = {
label: await renderKatex(
vertexText.replace(
/fa[blrs]?:fa-[\w-]+/g,
/fa[blrs]?:fa-[\w-]+/g, // cspell:disable-line
(s) => `<i class='${s.replace(':', ' ')}'></i>`
),
getConfig()
@ -84,12 +84,12 @@ export const addVertices = async function (vert, g, svgId, root, _doc, diagObj)
vertexNode = svgLabel;
}
let radious = 0;
let radius = 0;
let _shape = '';
// Set the shape based parameters
switch (vertex.type) {
case 'round':
radious = 5;
radius = 5;
_shape = 'rect';
break;
case 'square':
@ -147,8 +147,8 @@ export const addVertices = async function (vert, g, svgId, root, _doc, diagObj)
labelStyle: styles.labelStyle,
shape: _shape,
label: vertexNode,
rx: radious,
ry: radious,
rx: radius,
ry: radius,
class: classStr,
style: styles.style,
id: diagObj.db.lookUpDomId(vertex.id),
@ -244,7 +244,7 @@ export const addEdges = async function (edges, g, diagObj) {
edgeData.labelStyle
}">${await renderKatex(
edge.text.replace(
/fa[blrs]?:fa-[\w-]+/g,
/fa[blrs]?:fa-[\w-]+/g, // cspell:disable-line
(s) => `<i class='${s.replace(':', ' ')}'></i>`
),
getConfig()

24
packages/mermaid/src/diagrams/flowchart/parser/flow.jison
View File

@ -292,15 +292,15 @@ graphConfig
| NEWLINE graphConfig
| GRAPH NODIR
{ yy.setDirection('TB');$$ = 'TB';}
| GRAPH DIR FirstStmtSeperator
| GRAPH DIR FirstStmtSeparator
{ yy.setDirection($DIR);$$ = $DIR;}
// | GRAPH SPACE TAGEND FirstStmtSeperator
// | GRAPH SPACE TAGEND FirstStmtSeparator
// { yy.setDirection("LR");$$ = $TAGEND;}
// | GRAPH SPACE TAGSTART FirstStmtSeperator
// | GRAPH SPACE TAGSTART FirstStmtSeparator
// { yy.setDirection("RL");$$ = $TAGSTART;}
// | GRAPH SPACE UP FirstStmtSeperator
// | GRAPH SPACE UP FirstStmtSeparator
// { yy.setDirection("BT");$$ = $UP;}
// | GRAPH SPACE DOWN FirstStmtSeperator
// | GRAPH SPACE DOWN FirstStmtSeparator
// { yy.setDirection("TB");$$ = $DOWN;}
;
@ -310,7 +310,7 @@ ending: endToken ending
endToken: NEWLINE | SPACE | EOF;
FirstStmtSeperator
FirstStmtSeparator
: SEMI | NEWLINE | spaceList NEWLINE ;
@ -328,8 +328,8 @@ spaceList
;
statement
: verticeStatement separator
{ /* console.warn('finat vs', $verticeStatement.nodes); */ $$=$verticeStatement.nodes}
: vertexStatement separator
{ /* console.warn('finat vs', $vertexStatement.nodes); */ $$=$vertexStatement.nodes}
| styleStatement separator
{$$=[];}
| linkStyleStatement separator
@ -357,10 +357,10 @@ statement
separator: NEWLINE | SEMI | EOF ;
verticeStatement: verticeStatement link node
{ /* console.warn('vs',$verticeStatement.stmt,$node); */ yy.addLink($verticeStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($verticeStatement.nodes) } }
| verticeStatement link node spaceList
{ /* console.warn('vs',$verticeStatement.stmt,$node); */ yy.addLink($verticeStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($verticeStatement.nodes) } }
vertexStatement: vertexStatement link node
{ /* console.warn('vs',$vertexStatement.stmt,$node); */ yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } }
| vertexStatement link node spaceList
{ /* console.warn('vs',$vertexStatement.stmt,$node); */ yy.addLink($vertexStatement.stmt,$node,$link); $$ = { stmt: $node, nodes: $node.concat($vertexStatement.nodes) } }
|node spaceList {/*console.warn('noda', $node);*/ $$ = {stmt: $node, nodes:$node }}
|node { /*console.warn('noda', $node);*/ $$ = {stmt: $node, nodes:$node }}
;

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

@ -332,6 +332,7 @@ const getStartDate = function (prevTime, dateFormat, str) {
* @returns {[value: number, unit: dayjs.ManipulateType]} Arguments to pass to `dayjs.add()`
*/
const parseDuration = function (str) {
// cspell:disable-next-line
const statement = /^(\d+(?:\.\d+)?)([Mdhmswy]|ms)$/.exec(str.trim());
if (statement !== null) {
return [Number.parseFloat(statement[1]), statement[2]];

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

@ -178,7 +178,7 @@ export const draw = function (text, id, version, diagObj) {
// tasks are created based on their order of startTime
taskArray.sort(taskCompare);
makeGant(taskArray, w, h);
makeGantt(taskArray, w, h);
configureSvgSize(svg, h, w, conf.useMaxWidth);
@ -194,7 +194,7 @@ export const draw = function (text, id, version, diagObj) {
* @param pageWidth
* @param pageHeight
*/
function makeGant(tasks, pageWidth, pageHeight) {
function makeGantt(tasks, pageWidth, pageHeight) {
const barHeight = conf.barHeight;
const gap = barHeight + conf.barGap;
const topPadding = conf.topPadding;
@ -695,12 +695,12 @@ export const draw = function (text, id, version, diagObj) {
function vertLabels(theGap, theTopPad) {
let prevGap = 0;
const numOccurances = Object.keys(categoryHeights).map((d) => [d, categoryHeights[d]]);
const numOccurrences = Object.keys(categoryHeights).map((d) => [d, categoryHeights[d]]);
svg
.append('g') // without doing this, impossible to put grid lines behind text
.selectAll('text')
.data(numOccurances)
.data(numOccurrences)
.enter()
.append(function (d) {
const rows = d[0].split(common.lineBreakRegex);
@ -725,7 +725,7 @@ export const draw = function (text, id, version, diagObj) {
.attr('y', function (d, i) {
if (i > 0) {
for (let j = 0; j < i; j++) {
prevGap += numOccurances[i - 1][1];
prevGap += numOccurrences[i - 1][1];
return (d[1] * theGap) / 2 + prevGap * theGap + theTopPad;
}
} else {

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

@ -36,8 +36,8 @@ function getId() {
// * @param otherCommit
// */
// eslint-disable-next-line @cspell/spellchecker
// function isfastforwardable(currentCommit, otherCommit) {
// log.debug('Entering isfastforwardable:', currentCommit.id, otherCommit.id);
// function isFastForwardable(currentCommit, otherCommit) {
// log.debug('Entering isFastForwardable:', currentCommit.id, otherCommit.id);
// let cnt = 0;
// while (currentCommit.seq <= otherCommit.seq && currentCommit !== otherCommit && cnt < 1000) {
// cnt++;
@ -46,8 +46,8 @@ function getId() {
// if (Array.isArray(otherCommit.parent)) {
// log.debug('In merge commit:', otherCommit.parent);
// return (
// isfastforwardable(currentCommit, commits[otherCommit.parent[0]]) ||
// isfastforwardable(currentCommit, commits[otherCommit.parent[1]])
// isFastForwardable(currentCommit, commits[otherCommit.parent[0]]) ||
// isFastForwardable(currentCommit, commits[otherCommit.parent[1]])
// );
// } else {
// otherCommit = commits[otherCommit.parent];
@ -64,7 +64,7 @@ function getId() {
// function isReachableFrom(currentCommit, otherCommit) {
// const currentSeq = currentCommit.seq;
// const otherSeq = otherCommit.seq;
// if (currentSeq > otherSeq) return isfastforwardable(otherCommit, currentCommit);
// if (currentSeq > otherSeq) return isFastForwardable(otherCommit, currentCommit);
// return false;
// }
@ -231,7 +231,7 @@ export const merge = function (otherBranch, custom_id, override_type, custom_tag
// log.debug('Already merged');
// return;
// }
// if (isfastforwardable(currentCommit, otherCommit)) {
// if (isFastForwardable(currentCommit, otherCommit)) {
// branches[curBranch] = branches[otherBranch];
// head = commits[branches[curBranch]];
// } else {

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

@ -295,7 +295,7 @@ function renderCommitHistory(svg, commitId, branches, direction) {
}
if (Array.isArray(commitId)) {
logger.debug('found merge commmit', commitId);
logger.debug('found merge commit', commitId);
renderCommitHistory(svg, commitId[0], branches, direction);
branchNum++;
renderCommitHistory(svg, commitId[1], branches, direction);

2
packages/mermaid/src/diagrams/git/parser/gitGraph.jison
View File

@ -84,7 +84,7 @@ options
| NL
;
body
: /*emmpty*/ {$$ = []}
: /*empty*/ {$$ = []}
| body line {$1.push($2); $$=$1;}
;
line

2
packages/mermaid/src/diagrams/mindmap/mindmapDb.ts
View File

@ -133,7 +133,7 @@ const type2Str = (type: number) => {
case nodeType.BANG:
return 'bang';
case nodeType.HEXAGON:
return 'hexgon';
return 'hexgon'; // cspell: disable-line
default:
return 'no-border';
}

2
packages/mermaid/src/diagrams/pie/pieTypes.ts
View File

@ -51,7 +51,7 @@ export interface PieDB extends DiagramDB {
getDiagramTitle: () => string;
setAccTitle: (title: string) => void;
getAccTitle: () => string;
setAccDescription: (describetion: string) => void;
setAccDescription: (description: string) => void;
getAccDescription: () => string;
// diagram db

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

@ -362,6 +362,8 @@ export const draw = (text, id, _version, diagObj) => {
svg.attr('viewBox', `${svgBounds.x - padding} ${svgBounds.y - padding} ${width} ${height}`);
};
// cspell:ignore txts
export default {
draw,
};

8
packages/mermaid/src/diagrams/sankey/parser/sankey.jison
View File

@ -11,14 +11,14 @@
%lex
%options case-insensitive
%options easy_keword_rules
%options easy_keyword_rules
%x escaped_text
%x csv
// as per section 6.1 of RFC 2234 [2]
COMMA \u002C
CR \u000D
CR \u000D
LF \u000A
CRLF \u000D\u000A
ESCAPED_QUOTE \u0022
@ -32,7 +32,7 @@ TEXTDATA [\u0020-\u0021\u0023-\u002B\u002D-\u007E]
<INITIAL,csv>({CRLF}|{LF}) { return 'NEWLINE' }
<INITIAL,csv>{COMMA} { return 'COMMA' }
<INITIAL,csv>{DQUOTE} { this.pushState('escaped_text'); return 'DQUOTE'; }
<INITIAL,csv>{TEXTDATA}* { return 'NON_ESCAPED_TEXT' }
<INITIAL,csv>{TEXTDATA}* { return 'NON_ESCAPED_TEXT' }
<INITIAL,csv,escaped_text>{DQUOTE}(?!{DQUOTE}) {this.popState('escaped_text'); return 'DQUOTE'; } // unescaped DQUOTE closes string
<INITIAL,csv,escaped_text>({TEXTDATA}|{COMMA}|{CR}|{LF}|{DQUOTE}{DQUOTE})* { return 'ESCAPED_TEXT'; }
@ -65,5 +65,3 @@ field
escaped: DQUOTE ESCAPED_TEXT DQUOTE { $$=$ESCAPED_TEXT; };
non_escaped: NON_ESCAPED_TEXT { $$=$NON_ESCAPED_TEXT; };

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

@ -76,10 +76,10 @@ export const drawPopup = function (elem, actor, minMenuWidth, textAttrs, forceMe
return { height: rectData.height + linkY, width: menuWidth };
};
const popupMenuToggle = function (popid) {
const popupMenuToggle = function (popId) {
return (
"var pu = document.getElementById('" +
popid +
popId +
"'); if (pu != null) { pu.style.display = pu.style.display == 'block' ? 'none' : 'block'; }"
);
};
@ -329,8 +329,8 @@ const drawActorTypeParticipant = async function (elem, actor, conf, isFooter) {
const center = actor.x + actor.width / 2;
const centerY = actorY + 5;
const boxpluslineGroup = elem.append('g').lower();
var g = boxpluslineGroup;
const boxplusLineGroup = elem.append('g').lower();
var g = boxplusLineGroup;
if (!isFooter) {
actorCnt++;
@ -348,7 +348,7 @@ const drawActorTypeParticipant = async function (elem, actor, conf, isFooter) {
.attr('stroke-width', '0.5px')
.attr('stroke', '#999');
g = boxpluslineGroup.append('g');
g = boxplusLineGroup.append('g');
actor.actorCnt = actorCnt;
if (actor.links != null) {
@ -512,8 +512,8 @@ export const drawActor = async function (elem, actor, conf, isFooter) {
};
export const drawBox = async function (elem, box, conf) {
const boxplustextGroup = elem.append('g');
const g = boxplustextGroup;
const boxplusTextGroup = elem.append('g');
const g = boxplusTextGroup;
drawBackgroundRect(g, box);
if (box.name) {
await _drawTextCandidateFunc(conf)(

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

@ -206,7 +206,7 @@ export const addTitleAndBox = (g, stateDef, altBkg) => {
g.insert('rect', ':first-child')
.attr('x', startX)
.attr('y', lineY)
.attr('class', altBkg ? 'alt-composit' : 'composit')
.attr('class', altBkg ? 'alt-composit' : 'composit') // cspell:disable-line
.attr('width', width)
.attr(
'height',
@ -482,11 +482,11 @@ export const drawEdge = function (elem, path, relation) {
.attr('x', x)
.attr('y', y + titleHeight);
const boundstmp = title.node().getBBox();
maxWidth = Math.max(maxWidth, boundstmp.width);
minX = Math.min(minX, boundstmp.x);
const boundsTmp = title.node().getBBox();
maxWidth = Math.max(maxWidth, boundsTmp.width);
minX = Math.min(minX, boundsTmp.x);
log.info(boundstmp.x, x, y + titleHeight);
log.info(boundsTmp.x, x, y + titleHeight);
if (titleHeight === 0) {
const titleBox = title.node().getBBox();

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

@ -260,7 +260,7 @@ export const addState = function (
if (classes) {
log.info('Setting state classes', trimmedId, classes);
const classesList = typeof classes === 'string' ? [classes] : classes;
classesList.forEach((klass) => setCssClass(trimmedId, klass.trim()));
classesList.forEach((cssClass) => setCssClass(trimmedId, cssClass.trim()));
}
if (styles) {

3
packages/mermaid/src/diagrams/state/styles.js
View File

@ -202,4 +202,7 @@ g.stateGroup line {
}
`;
// todo: change composit to composite
// cspell:ignore composit
export default getStyles;

2
packages/mermaid/src/diagrams/timeline/timelineDb.js
View File

@ -53,7 +53,7 @@ export const addTask = function (period, length, event) {
};
export const addEvent = function (event) {
// fetch current task with currnetTaskId
// fetch current task with currentTaskId
const currentTask = rawTasks.find((task) => task.id === currentTaskId - 1);
//add event to the events array
currentTask.events.push(event);

6
packages/mermaid/src/diagrams/xychart/chartBuilder/components/axis/index.ts
View File

@ -27,14 +27,14 @@ export function getAxis(
axisThemeConfig: XYChartAxisThemeConfig,
tmpSVGGroup: Group
): Axis {
const textDimansionCalculator = new TextDimensionCalculatorWithFont(tmpSVGGroup);
const textDimensionCalculator = new TextDimensionCalculatorWithFont(tmpSVGGroup);
if (isBandAxisData(data)) {
return new BandAxis(
axisConfig,
axisThemeConfig,
data.categories,
data.title,
textDimansionCalculator
textDimensionCalculator
);
}
return new LinearAxis(
@ -42,6 +42,6 @@ export function getAxis(
axisThemeConfig,
[data.min, data.max],
data.title,
textDimansionCalculator
textDimensionCalculator
);
}

4
packages/mermaid/src/diagrams/xychart/chartBuilder/orchestrator.ts
View File

@ -112,7 +112,7 @@ export class Orchestrator {
}
}
private calculateHorizonatalSpace() {
private calculateHorizontalSpace() {
let availableWidth = this.chartConfig.width;
let availableHeight = this.chartConfig.height;
let titleYEnd = 0;
@ -174,7 +174,7 @@ export class Orchestrator {
private calculateSpace() {
if (this.chartConfig.chartOrientation === 'horizontal') {
this.calculateHorizonatalSpace();
this.calculateHorizontalSpace();
} else {
this.calculateVerticalSpace();
}

8
packages/mermaid/src/docs/community/contributing.md
View File

@ -130,7 +130,7 @@ You might see _lint_ or _formatting_ warnings. Those are ok during this step.
## Workflow
Contributing process is very simple and strightforward:
Contributing process is very simple and straightforward:
```mermaid-nocode
flowchart LR
@ -377,7 +377,7 @@ eg: `# Feature Name (v<MERMAID_RELEASE_VERSION>+)`
We know it can sometimes be hard to code _and_ write user documentation.
Create another issue specifically for the documentation.
Create another issue specifically for the documentation.
You will need to help with the PR, but definitely ask for help if you feel stuck.
When it feels hard to write stuff out, explaining it to someone and having that person ask you clarifying questions can often be 80% of the work!
@ -403,7 +403,7 @@ The contents of [mermaid.js.org](https://mermaid.js.org/) are based on the docs
flowchart LR
classDef default fill:#fff,color:black,stroke:black
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be publised on Official Website"]
source["Edit /packages/mermaid/src/docs"] -- automatic processing--> published["View /docs which will be published on Official Website"]
```
### Running the Documentation Website Locally
@ -521,3 +521,5 @@ You have successfully submitted your improvements! What is next?
- When a release is ready, the `release/x.x.x` branch will be created, extensively tested and knsv will be in charge of the release process.
Thanks for you help!
<!--- cspell:ignore florbs --->

2
packages/mermaid/src/docs/config/accessibility.md
View File

@ -13,7 +13,7 @@ Mermaid will automatically insert the [aria-roledescription](#aria-roledescripti
The [aria-roledescription](https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription) for the SVG HTML element is set to the diagram type key. (Note this may be slightly different than the keyword used for the diagram in the diagram text.)
For example: The diagram type key for a state diagram is "stateDiagram". Here (a part of) the HTML of the SVG tag that shows the automatically inserted aria-roledscription set to "stateDiagram". _(Note that some of the SVG attributes and the SVG contents are omitted for clarity.):_
For example: The diagram type key for a state diagram is "stateDiagram". Here (a part of) the HTML of the SVG tag that shows the automatically inserted aria-roledescription set to "stateDiagram". _(Note that some of the SVG attributes and the SVG contents are omitted for clarity.):_
```html
<svg

2
packages/mermaid/src/docs/config/theming.md
View File

@ -47,7 +47,7 @@ Example of `init` directive setting the `theme` to `forest`:
a --> b
```
> **Reminder**: the only theme that can be customed is the `base` theme. The following section covers how to use `themeVariables` for customizations.
> **Reminder**: the only theme that can be customized is the `base` theme. The following section covers how to use `themeVariables` for customizations.
## Customizing Themes with `themeVariables`

5
packages/mermaid/src/docs/config/usage.md
View File

@ -437,3 +437,8 @@ mermaid_config.startOnLoad = true;
```warning
This way of setting the configuration is deprecated. Instead the preferred way is to use the initialize method. This functionality is only kept for backwards compatibility.
```
<!---
cspell:locale en,en-gb
cspell:ignore pumbaa
--->

2
packages/mermaid/src/docs/ecosystem/tutorials.md
View File

@ -74,3 +74,5 @@ graph LR;
**Output**
![Example graph of the Python integration](img/python-mermaid-integration.png)
<!--- cspell:ignore Elle Jaoude Neurodiverse graphbytes --->

2
packages/mermaid/src/docs/intro/examples.md
View File

@ -17,7 +17,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail!

4
packages/mermaid/src/docs/syntax/block.md
View File

@ -291,7 +291,7 @@ block-beta
ida space:3 idb idc
```
Note that you can set how many columns the spece block occupied using the number notaion `space:num` where num is a number indicating the num columns width. You can alsio use `space` which defaults to one column.
Note that you can set how many columns the space block occupied using the number notation `space:num` where num is a number indicating the num columns width. You can also use `space` which defaults to one column.
The variety of shapes and special blocks in Mermaid enhances the expressive power of block diagrams, allowing for more accurate and context-specific representations. These options give users the flexibility to create diagrams that are both informative and visually appealing. In the next sections, we will explore the ways to connect these blocks and customize their appearance.
@ -445,7 +445,7 @@ block-beta
```
**Correction**:
Ensure that links between blocks are correctly specified with arrows (--> or ---) to define the direction and type of connection. Also rememeber that one of the fundaments for block diagram is to give the author full control of where the boxes are positioned so in the example you need to add a space between the boxes:
Ensure that links between blocks are correctly specified with arrows (--> or ---) to define the direction and type of connection. Also remember that one of the fundaments for block diagram is to give the author full control of where the boxes are positioned so in the example you need to add a space between the boxes:
```mermaid-example
block-beta

4
packages/mermaid/src/docs/syntax/c4.md
View File

@ -135,7 +135,7 @@ The following unfinished features are not supported in the short term.
- [x] Rel_L, Rel_Left
- [x] Rel_R, Rel_Right
- [x] Rel_Back
- [x] RelIndex \* Compatible with C4-Plantuml syntax, but ignores the index parameter. The sequence number is determined by the order in which the rel statements are written.
- [x] RelIndex \* Compatible with C4-PlantUML syntax, but ignores the index parameter. The sequence number is determined by the order in which the rel statements are written.
- [ ] Custom tags/stereotypes support and skin param updates
- [ ] AddElementTag(tagStereo, ?bgColor, ?fontColor, ?borderColor, ?shadowing, ?shape, ?sprite, ?techn, ?legendText, ?legendSprite): Introduces a new element tag. The styles of the tagged elements are updated and the tag is displayed in the calculated legend.
@ -367,3 +367,5 @@ UpdateRelStyle(customerA, bankA, $offsetY="60")
UpdateRelStyle(db, db2, $offsetY="-10")
```
<!--- cspell:ignore bigbank bigbankdb techn mbsfacade --->

2
packages/mermaid/src/docs/syntax/classDiagram.md
View File

@ -143,7 +143,7 @@ class BankAccount{
#### Generic Types
Generics can be representated as part of a class definition, and for class members/return types. In order to denote an item as generic, you enclose that type within `~` (**tilde**). **Nested** type declarations such as `List<List<int>>` are supported, though generics that include a comma are currently not supported. (such as `List<List<K, V>>`)
Generics can be represented as part of a class definition, and for class members/return types. In order to denote an item as generic, you enclose that type within `~` (**tilde**). **Nested** type declarations such as `List<List<int>>` are supported, though generics that include a comma are currently not supported. (such as `List<List<K, V>>`)
> _note_ when a generic is used within a class definition, the generic type is NOT considered part of the class name. i.e.: for any syntax which required you to reference the class name, you need to drop the type part of the definition. This also means that mermaid does not currently support having two classes with the same name, but different generic types.

2
packages/mermaid/src/docs/syntax/entityRelationshipDiagram.md
View File

@ -217,3 +217,5 @@ The following CSS class selectors are available for richer styling:
| `.er.relationshipLabel` | The label for a relationship |
| `.er.relationshipLabelBox` | The box surrounding a relationship label |
| `.er.relationshipLine` | The line representing a relationship between entities |
<!--- cspell:locale en,en-gb --->

4
packages/mermaid/src/docs/syntax/examples.md
View File

@ -96,7 +96,7 @@ sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts<br/>prevail...
@ -156,3 +156,5 @@ gitGraph:
branch b2
commit
```
<!--- cspell:ignore Ashish newbranch --->

2
packages/mermaid/src/docs/syntax/flowchart.md
View File

@ -836,3 +836,5 @@ mermaid.flowchartConfig = {
width: 100%
}
```
<!--- cspell:ignore lagom --->

2
packages/mermaid/src/docs/syntax/gantt.md
View File

@ -226,7 +226,7 @@ gantt
## Output in compact mode
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceeding YAML settings.
The compact mode allows you to display multiple tasks in the same row. Compact mode can be enabled for a gantt chart by setting the display mode of the graph via preceding YAML settings.
```mermaid
---

4
packages/mermaid/src/docs/syntax/gitgraph.md
View File

@ -959,7 +959,7 @@ See how the commit label color and background color are changed to the values sp
### Customizing Commit Label Font Size
You can customize commit using the `commitLabelFontSize` theme variables for changing in the font soze of the commit label .
You can customize commit using the `commitLabelFontSize` theme variables for changing in the font size of the commit label .
Example:
Now let's override the default values for the `commitLabelFontSize` variable:
@ -989,7 +989,7 @@ See how the commit label font size changed.
### Customizing Tag Label Font Size
You can customize commit using the `tagLabelFontSize` theme variables for changing in the font soze of the tag label .
You can customize commit using the `tagLabelFontSize` theme variables for changing in the font size of the tag label .
Example:
Now let's override the default values for the `tagLabelFontSize` variable:

5
packages/mermaid/src/docs/syntax/mindmap.md
View File

@ -204,3 +204,8 @@ From version 9.4.0 you can simplify this code to:
```
You can also refer the implementation in the live editor [here](https://github.com/mermaid-js/mermaid-live-editor/blob/develop/src/lib/util/mermaid.ts) to see how the async loading is done.
<!---
cspell:locale en,en-gb
cspell:ignore Buzan
--->

2
packages/mermaid/src/docs/syntax/requirementDiagram.md
View File

@ -156,3 +156,5 @@ This example uses all features of the diagram.
test_entity3 - verifies -> test_req5
test_req <- copies - test_entity2
```
<!--- cspell:ignore reqs --->

2
packages/mermaid/src/docs/syntax/sankey.md
View File

@ -185,3 +185,5 @@ Graph layout can be changed by setting `nodeAlignment` to:
- `center`
- `left`
- `right`
<!--- cspell:ignore Ngas bioenergy biofuel --->

6
packages/mermaid/src/docs/syntax/sequenceDiagram.md
View File

@ -129,8 +129,8 @@ end
end
A->>J: Hello John, how are you?
J->>A: Great!
A->>B: Hello Bob, how is Charly?
B->>C: Hello Charly, how are you?
A->>B: Hello Bob, how is Charley?
B->>C: Hello Charley, how are you?
```
## Messages
@ -457,7 +457,7 @@ It can also be turned on via the diagram code as in the diagram:
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop Healthcheck
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!

4
packages/mermaid/src/docs/syntax/stateDiagram.md
View File

@ -396,7 +396,7 @@ Spaces can be added to a state by first defining the state with an id and then r
In the following example there is a state with the id **yswsii** and description **Your state with spaces in it**.
After it has been defined, **yswsii** is used in the diagram in the first transition (`[*] --> yswsii`)
and also in the transition to **YetAnotherState** (`yswsii --> YetAnotherState`).
and also in the transition to **YetAnotherState** (`yswsii --> YetAnotherState`).
(**yswsii** has been styled so that it is different from the other states.)
```mermaid-example
@ -410,3 +410,5 @@ stateDiagram
yswsii --> YetAnotherState
YetAnotherState --> [*]
```
<!--- cspell:ignore yswsii --->

2
packages/mermaid/src/docs/syntax/timeline.md
View File

@ -127,7 +127,7 @@ As explained earlier, each section has a color scheme, and each time period and
However, if there is no section defined, then we have two possibilities:
1. Style time periods individually, i.e. each time period(and its coressponding events) will have its own color scheme. This is the DEFAULT behavior.
1. Style time periods individually, i.e. each time period(and its corresponding events) will have its own color scheme. This is the DEFAULT behavior.
```mermaid-example
timeline

4
packages/mermaid/src/docs/syntax/xyChart.md
View File

@ -134,11 +134,11 @@ Themes for xychart resides inside xychart attribute so to set the variables use
| ---------------- | --------------------------------------------------------- |
| backgroundColor | Background color of the whole chart |
| titleColor | Color of the Title text |
| xAxisLableColor | Color of the x-axis labels |
| xAxisLabelColor | Color of the x-axis labels |
| xAxisTitleColor | Color of the x-axis title |
| xAxisTickColor | Color of the x-axis tick |
| xAxisLineColor | Color of the x-axis line |
| yAxisLableColor | Color of the y-axis labels |
| yAxisLabelColor | Color of the y-axis labels |
| yAxisTitleColor | Color of the y-axis title |
| yAxisTickColor | Color of the y-axis tick |
| yAxisLineColor | Color of the y-axis line |

5
packages/mermaid/src/mermaidAPI.spec.ts
View File

@ -163,6 +163,7 @@ describe('mermaidAPI', () => {
});
it('decodesEntities', () => {
// cspell:ignore brrrr
const result = cleanUpSvgCode('¶ß brrrr', true, true);
expect(result).toEqual('; brrrr');
});
@ -232,6 +233,8 @@ describe('mermaidAPI', () => {
// @ts-ignore @todo TODO why is this getting a type error?
const svg_attr_spy = vi.spyOn(fauxSvgNode, 'attr').mockReturnValue(fauxSvgNode);
// cspell:ignore dthe
it('appends a div node', () => {
appendDivSvgG(fauxParentNode, 'theId', 'dtheId');
expect(parent_append_spy).toHaveBeenCalledWith('div');
@ -731,7 +734,7 @@ describe('mermaidAPI', () => {
const diagramText = `${diagramType}\n accTitle: ${a11yTitle}\n accDescr: ${a11yDescr}\n`;
const expectedDiagramType = testedDiagram.expectedType;
it('should set aria-roledscription to the diagram type AND should call addSVGa11yTitleDescription', async () => {
it('should set aria-roledescription to the diagram type AND should call addSVGa11yTitleDescription', async () => {
const a11yDiagramInfo_spy = vi.spyOn(accessibility, 'setA11yDiagramInfo');
const a11yTitleDesc_spy = vi.spyOn(accessibility, 'addSVGa11yTitleDescription');
await mermaidAPI.render(id, diagramText);

4
packages/mermaid/src/rendering-util/createText.ts
View File

@ -188,11 +188,11 @@ export const createText = (
// TODO: addHtmlLabel accepts a labelStyle. Do we possibly have that?
// text = text.replace(/\\n|\n/g, '<br />');
const htmlText = markdownToHTML(text);
// log.info('markdo wnToHTML' + text, markdownToHTML(text));
// log.info('markdownToHTML' + text, markdownToHTML(text));
const node = {
isNode,
label: decodeEntities(htmlText).replace(
/fa[blrs]?:fa-[\w-]+/g,
/fa[blrs]?:fa-[\w-]+/g, // cspell: disable-line
(s) => `<i class='${s.replace(':', ' ')}'></i>`
),
labelStyle: style.replace('fill:', 'color:'),

2
packages/mermaid/src/rendering-util/splitText.spec.ts
View File

@ -145,3 +145,5 @@ const createCheckFn = (width: number): CheckFitFunction => {
return characters.length <= width;
};
};
// cspell:ignore worl

811
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

2
run
View File

@ -72,7 +72,7 @@ $(bold ./$name pnpm) # Run any 'pnpm' command
$(bold ./$name sh) # Open 'sh' inside docker container for development
__________________________________________________________________________________________
Examples of frequiently used commands:
Examples of frequently used commands:
$(bold ./$name pnpm add --filter mermaid) $(underline package)
Add package to mermaid