+
+
+
diff --git a/docs/config/setup/modules/mermaidAPI.md b/docs/config/setup/modules/mermaidAPI.md
index 1a68b05bd..d17533a03 100644
--- a/docs/config/setup/modules/mermaidAPI.md
+++ b/docs/config/setup/modules/mermaidAPI.md
@@ -98,7 +98,7 @@ mermaid.initialize(config);
#### Defined in
-[mermaidAPI.ts:635](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L635)
+[mermaidAPI.ts:634](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L634)
## Functions
@@ -129,7 +129,7 @@ Return the last node appended
#### Defined in
-[mermaidAPI.ts:277](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L277)
+[mermaidAPI.ts:276](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L276)
---
@@ -155,7 +155,7 @@ the cleaned up svgCode
#### Defined in
-[mermaidAPI.ts:223](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L223)
+[mermaidAPI.ts:222](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L222)
---
@@ -167,10 +167,10 @@ Create the user styles
#### Parameters
-| Name | Type | Description |
-| :---------- | :------------------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------ |
-| `config` | `MermaidConfig` | configuration that has style and theme settings to use |
-| `classDefs` | `undefined` \| `null` \| `Record`<`string`, `DiagramStyleClassDef`> | the classDefs in the diagram text. Might be null if none were defined. Usually is the result of a call to getClasses(...) |
+| Name | Type | Description |
+| :---------- | :--------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------ |
+| `config` | `MermaidConfig` | configuration that has style and theme settings to use |
+| `classDefs` | `undefined` \| `null` \| `Map`<`string`, `DiagramStyleClassDef`> | the classDefs in the diagram text. Might be null if none were defined. Usually is the result of a call to getClasses(...) |
#### Returns
@@ -190,12 +190,12 @@ the string with all the user styles
#### Parameters
-| Name | Type |
-| :---------- | :-------------------------------------------------------- |
-| `config` | `MermaidConfig` |
-| `graphType` | `string` |
-| `classDefs` | `undefined` \| `Record`<`string`, `DiagramStyleClassDef`> |
-| `svgId` | `string` |
+| Name | Type |
+| :---------- | :----------------------------------------------------- |
+| `config` | `MermaidConfig` |
+| `graphType` | `string` |
+| `classDefs` | `undefined` \| `Map`<`string`, `DiagramStyleClassDef`> |
+| `svgId` | `string` |
#### Returns
@@ -203,7 +203,7 @@ the string with all the user styles
#### Defined in
-[mermaidAPI.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L200)
+[mermaidAPI.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L199)
---
@@ -256,7 +256,7 @@ Put the svgCode into an iFrame. Return the iFrame code
#### Defined in
-[mermaidAPI.ts:254](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L254)
+[mermaidAPI.ts:253](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L253)
---
@@ -281,4 +281,4 @@ Remove any existing elements from the given document
#### Defined in
-[mermaidAPI.ts:327](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L327)
+[mermaidAPI.ts:326](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L326)
diff --git a/docs/ecosystem/mermaid-chart.md b/docs/ecosystem/mermaid-chart.md
index 07572d044..f1ca85af0 100644
--- a/docs/ecosystem/mermaid-chart.md
+++ b/docs/ecosystem/mermaid-chart.md
@@ -6,6 +6,10 @@
# Mermaid Chart
+The Future of Diagramming & Visual Collaboration
+
+Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
+
@@ -18,22 +22,26 @@
- **Editor** - A web based editor for creating and editing Mermaid diagrams.
-- **Presentation** - A presentation mode for viewing Mermaid diagrams in a slideshow format.
+- **Visual Editor** - The Visual Editor enables users of all skill levels to create diagrams easily and efficiently, with both GUI and code-based editing options.
-- **Collaboration** - A web based collaboration feature for multi-user editing on Mermaid diagrams in real-time (Pro plan).
+- **AI Chat** - Use our embedded AI Chat to generate diagrams from natural language descriptions.
- **Plugins** - A plugin system for extending the functionality of Mermaid.
- Plugins are available for:
+ Official Mermaid Chart plugins:
- - [ChatGPT](https://docs.mermaidchart.com/plugins/chatgpt)
+ - [Mermaid Chart GPT](https://chat.openai.com/g/g-1IRFKwq4G-mermaid-chart)
+ - [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=MermaidChart.vscode-mermaid-chart)
- [JetBrains IDE](https://plugins.jetbrains.com/plugin/23043-mermaid-chart)
- [Microsoft PowerPoint and Word](https://appsource.microsoft.com/en-us/product/office/WA200006214?tab=Overview)
- - [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=MermaidChart.vscode-mermaid-chart)
-- **AI diagramming** - A feature for generating Mermaid diagrams from text using AI (Pro plan).
+ Visit our [Plugins](https://www.mermaidchart.com/plugins) page for more information.
-- **More** - To learn more, visit our [Product](https://www.mermaidchart.com/product) page.
+- **Collaboration** - A web based collaboration feature for multi-user editing on Mermaid diagrams in real-time (Pro and Enterprise plans).
+
+- **Comments** - Enhance collaboration by adding comments to diagrams.
+
+- **Presentations** - A presentation mode for viewing Mermaid diagrams in a slideshow format.
## Plans
@@ -43,11 +51,9 @@
- **Enterprise** - A paid plan for enterprise use that includes all Pro features, and more.
-## Access
+To learn more, visit our [Pricing](https://mermaidchart.com/pricing) page.
-Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
-
-Mermaid Chart is currently offering a 14-day free trial of our newly-launched Pro tier. To learn more, visit our [Pricing](https://mermaidchart.com/pricing) page.
+Mermaid Chart is currently offering a 14-day free trial on our Pro and Enterprise tiers. Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
## Mermaid JS contributions
diff --git a/docs/intro/getting-started.md b/docs/intro/getting-started.md
index 735859644..a626d1f53 100644
--- a/docs/intro/getting-started.md
+++ b/docs/intro/getting-started.md
@@ -157,7 +157,7 @@ For a list of Mermaid Plugins and Integrations, visit the [Integrations page](..
Mermaid Chart plugins are available for:
-- [ChatGPT](https://docs.mermaidchart.com/plugins/chatgpt)
+- [ChatGPT](https://docs.mermaidchart.com/plugins/mermaid-chart-gpt)
- [JetBrains IDE](https://docs.mermaidchart.com/plugins/jetbrains-ide)
- [Microsoft PowerPoint](https://docs.mermaidchart.com/plugins/microsoft-powerpoint)
- [Microsoft Word](https://docs.mermaidchart.com/plugins/microsoft-word)
diff --git a/docs/news/blog.md b/docs/news/blog.md
index d88c9ed23..65fa9246e 100644
--- a/docs/news/blog.md
+++ b/docs/news/blog.md
@@ -6,6 +6,18 @@
# Blog
+## [How to Choose the Right Documentation Software](https://www.mermaidchart.com/blog/posts/how-to-choose-the-right-documentation-software/)
+
+7 May 2024 · 5 mins
+
+How to Choose the Right Documentation Software. Reliable and efficient documentation software is crucial in the fast-paced world of software development.
+
+## [AI in software diagramming: What trends will define the future?](https://www.mermaidchart.com/blog/posts/ai-in-software-diagramming/)
+
+24 April 2024 · 5 mins
+
+Artificial intelligence (AI) tools are changing the way developers work.
+
## [Mermaid Chart Unveils Visual Editor for Sequence Diagrams](https://www.mermaidchart.com/blog/posts/mermaid-chart-unveils-visual-editor-for-sequence-diagrams/)
8 April 2024 · 5 mins
diff --git a/docs/syntax/flowchart.md b/docs/syntax/flowchart.md
index 8edb5e208..7efc5497b 100644
--- a/docs/syntax/flowchart.md
+++ b/docs/syntax/flowchart.md
@@ -881,7 +881,7 @@ Examples of tooltip usage below:
```html
@@ -913,7 +913,7 @@ flowchart LR
> **Success** The tooltip functionality and the ability to link to urls are available from version 0.5.2.
-?> Due to limitations with how Docsify handles JavaScript callback functions, an alternate working demo for the above code can be viewed at [this jsfiddle](https://jsfiddle.net/Ogglas/2o73vdez/7).
+?> Due to limitations with how Docsify handles JavaScript callback functions, an alternate working demo for the above code can be viewed at [this jsfiddle](https://jsfiddle.net/yk4h7qou/2/).
Links are opened in the same browser tab/window by default. It is possible to change this by adding a link target to the click definition (`_self`, `_blank`, `_parent` and `_top` are supported):
@@ -957,7 +957,7 @@ Beginner's tip—a full example using interactive links in a html context:
'
);
let states = stateDb.getStates();
- expect(states[testStateId].descriptions[0]).toEqual('desc outside the script ');
+ expect(states.get(testStateId).descriptions[0]).toEqual('desc outside the script ');
});
it('adds the description to the state with the given id', () => {
stateDb.addDescription(testStateId, 'the description');
let states = stateDb.getStates();
- expect(states[testStateId].descriptions[0]).toEqual('the description');
+ expect(states.get(testStateId).descriptions[0]).toEqual('the description');
});
});
});
diff --git a/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js b/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js
index c387ff7b3..53063f41a 100644
--- a/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js
+++ b/packages/mermaid/src/diagrams/state/stateDiagram-v2.spec.js
@@ -405,7 +405,7 @@ describe('state diagram V2, ', function () {
stateDiagram.parser.yy.extract(stateDiagram.parser.yy.getRootDocV2());
const states = stateDb.getStates();
- expect(states['Active'].doc[0].id).toEqual('Idle');
+ expect(states.get('Active').doc[0].id).toEqual('Idle');
const rels = stateDb.getRelations();
const rel_Inactive_Idle = rels.find((rel) => rel.id1 === 'Inactive' && rel.id2 === 'Idle');
diff --git a/packages/mermaid/src/diagrams/state/stateRenderer-v2.js b/packages/mermaid/src/diagrams/state/stateRenderer-v2.js
index 8ebc948cd..0ecc0a73a 100644
--- a/packages/mermaid/src/diagrams/state/stateRenderer-v2.js
+++ b/packages/mermaid/src/diagrams/state/stateRenderer-v2.js
@@ -81,7 +81,7 @@ export const setConf = function (cnf) {
*
* @param {string} text - the diagram text to be parsed
* @param diagramObj
- * @returns {Record} ClassDef styles (a Map with keys = strings, values = )
+ * @returns {Map} ClassDef styles (a Map with keys = strings, values = )
*/
export const getClasses = function (text, diagramObj) {
diagramObj.db.extract(diagramObj.db.getRootDocV2());
@@ -129,13 +129,13 @@ export function stateDomId(itemId = '', counter = 0, type = '', typeSpacer = DOM
* @param g - graph
* @param {object} parent
* @param {object} parsedItem - parsed statement item
- * @param {object[]} diagramStates - the list of all known states for the diagram
+ * @param {Map} diagramStates - the list of all known states for the diagram
* @param {object} diagramDb
* @param {boolean} altFlag - for clusters, add the "statediagram-cluster-alt" CSS class
*/
const setupNode = (g, parent, parsedItem, diagramStates, diagramDb, altFlag) => {
const itemId = parsedItem.id;
- const classStr = getClassesFromDbInfo(diagramStates[itemId]);
+ const classStr = getClassesFromDbInfo(diagramStates.get(itemId));
if (itemId !== 'root') {
let shape = SHAPE_STATE;
@@ -308,7 +308,7 @@ const setupNode = (g, parent, parsedItem, diagramStates, diagramDb, altFlag) =>
* @param g
* @param parentParsedItem - parsed Item that is the parent of this document (doc)
* @param doc - the document to set up; it is a list of parsed statements
- * @param {object[]} diagramStates - the list of all known states for the diagram
+ * @param {Map} diagramStates - the list of all known states for the diagram
* @param diagramDb
* @param {boolean} altFlag
* @todo This duplicates some of what is done in stateDb.js extract method
diff --git a/packages/mermaid/src/docs/ecosystem/mermaid-chart.md b/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
index 94b6773e4..732b9b68c 100644
--- a/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
+++ b/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
@@ -1,5 +1,9 @@
# Mermaid Chart
+The Future of Diagramming & Visual Collaboration
+
+Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
+
@@ -12,22 +16,26 @@
- **Editor** - A web based editor for creating and editing Mermaid diagrams.
-- **Presentation** - A presentation mode for viewing Mermaid diagrams in a slideshow format.
+- **Visual Editor** - The Visual Editor enables users of all skill levels to create diagrams easily and efficiently, with both GUI and code-based editing options.
-- **Collaboration** - A web based collaboration feature for multi-user editing on Mermaid diagrams in real-time (Pro plan).
+- **AI Chat** - Use our embedded AI Chat to generate diagrams from natural language descriptions.
- **Plugins** - A plugin system for extending the functionality of Mermaid.
- Plugins are available for:
+ Official Mermaid Chart plugins:
- - [ChatGPT](https://docs.mermaidchart.com/plugins/chatgpt)
+ - [Mermaid Chart GPT](https://chat.openai.com/g/g-1IRFKwq4G-mermaid-chart)
+ - [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=MermaidChart.vscode-mermaid-chart)
- [JetBrains IDE](https://plugins.jetbrains.com/plugin/23043-mermaid-chart)
- [Microsoft PowerPoint and Word](https://appsource.microsoft.com/en-us/product/office/WA200006214?tab=Overview)
- - [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=MermaidChart.vscode-mermaid-chart)
-- **AI diagramming** - A feature for generating Mermaid diagrams from text using AI (Pro plan).
+ Visit our [Plugins](https://www.mermaidchart.com/plugins) page for more information.
-- **More** - To learn more, visit our [Product](https://www.mermaidchart.com/product) page.
+- **Collaboration** - A web based collaboration feature for multi-user editing on Mermaid diagrams in real-time (Pro and Enterprise plans).
+
+- **Comments** - Enhance collaboration by adding comments to diagrams.
+
+- **Presentations** - A presentation mode for viewing Mermaid diagrams in a slideshow format.
## Plans
@@ -37,11 +45,9 @@
- **Enterprise** - A paid plan for enterprise use that includes all Pro features, and more.
-## Access
+To learn more, visit our [Pricing](https://mermaidchart.com/pricing) page.
-Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
-
-Mermaid Chart is currently offering a 14-day free trial of our newly-launched Pro tier. To learn more, visit our [Pricing](https://mermaidchart.com/pricing) page.
+Mermaid Chart is currently offering a 14-day free trial on our Pro and Enterprise tiers. Sign up for a free account at [Mermaid Chart](https://www.mermaidchart.com/app/sign-up).
## Mermaid JS contributions
diff --git a/packages/mermaid/src/docs/intro/getting-started.md b/packages/mermaid/src/docs/intro/getting-started.md
index 2bfa36bb7..574881c4f 100644
--- a/packages/mermaid/src/docs/intro/getting-started.md
+++ b/packages/mermaid/src/docs/intro/getting-started.md
@@ -146,7 +146,7 @@ For a list of Mermaid Plugins and Integrations, visit the [Integrations page](..
Mermaid Chart plugins are available for:
-- [ChatGPT](https://docs.mermaidchart.com/plugins/chatgpt)
+- [ChatGPT](https://docs.mermaidchart.com/plugins/mermaid-chart-gpt)
- [JetBrains IDE](https://docs.mermaidchart.com/plugins/jetbrains-ide)
- [Microsoft PowerPoint](https://docs.mermaidchart.com/plugins/microsoft-powerpoint)
- [Microsoft Word](https://docs.mermaidchart.com/plugins/microsoft-word)
diff --git a/packages/mermaid/src/docs/news/blog.md b/packages/mermaid/src/docs/news/blog.md
index 267bd48a6..4ada1e05c 100644
--- a/packages/mermaid/src/docs/news/blog.md
+++ b/packages/mermaid/src/docs/news/blog.md
@@ -1,5 +1,17 @@
# Blog
+## [How to Choose the Right Documentation Software](https://www.mermaidchart.com/blog/posts/how-to-choose-the-right-documentation-software/)
+
+7 May 2024 · 5 mins
+
+How to Choose the Right Documentation Software. Reliable and efficient documentation software is crucial in the fast-paced world of software development.
+
+## [AI in software diagramming: What trends will define the future?](https://www.mermaidchart.com/blog/posts/ai-in-software-diagramming/)
+
+24 April 2024 · 5 mins
+
+Artificial intelligence (AI) tools are changing the way developers work.
+
## [Mermaid Chart Unveils Visual Editor for Sequence Diagrams](https://www.mermaidchart.com/blog/posts/mermaid-chart-unveils-visual-editor-for-sequence-diagrams/)
8 April 2024 · 5 mins
diff --git a/packages/mermaid/src/docs/syntax/flowchart.md b/packages/mermaid/src/docs/syntax/flowchart.md
index ba0e9ce9e..acffbc693 100644
--- a/packages/mermaid/src/docs/syntax/flowchart.md
+++ b/packages/mermaid/src/docs/syntax/flowchart.md
@@ -567,7 +567,7 @@ Examples of tooltip usage below:
```html
@@ -588,7 +588,7 @@ flowchart LR
> **Success** The tooltip functionality and the ability to link to urls are available from version 0.5.2.
-?> Due to limitations with how Docsify handles JavaScript callback functions, an alternate working demo for the above code can be viewed at [this jsfiddle](https://jsfiddle.net/Ogglas/2o73vdez/7).
+?> Due to limitations with how Docsify handles JavaScript callback functions, an alternate working demo for the above code can be viewed at [this jsfiddle](https://jsfiddle.net/yk4h7qou/2/).
Links are opened in the same browser tab/window by default. It is possible to change this by adding a link target to the click definition (`_self`, `_blank`, `_parent` and `_top` are supported):
@@ -620,7 +620,7 @@ Beginner's tip—a full example using interactive links in a html context: