Merge branch 'develop' into MultipleUpdatesToClassDiagram

* develop: (30 commits)
  Update vite
  Fix applitools cypress
  Update packages/mermaid/package.json
  chore(deps): update dependency typescript to v5
  fix typedoc
  fix(deps): update all minor dependencies
  chore(deps): update pnpm to v8
  chore(deps): update fregante/setup-git-user action to v2
  fix(deps): update all minor dependencies
  chore(deps): update dependency start-server-and-test to v2
  chore(deps): update dependency rimraf to v5
  chore(deps): update dependency eslint-plugin-unicorn to v46
  chore(deps): update actions/deploy-pages action to v2
  chore(deps): update dependency eslint-plugin-jsdoc to v43
  Split docs into build and deploy
  fix(deps): update dependency dompurify to v3
  chore(deps): update dependency concurrently to v8
  Split renovate groups
  Upgrade vitepress
  chore(deps): update pnpm to v7.30.5
  ...

packages/mermaid-example-diagram/package.json

@@ -48,8 +48,8 @@
   },
   "devDependencies": {
     "@types/cytoscape": "^3.19.9",
-    "concurrently": "^7.5.0",
-    "rimraf": "^4.0.0",
+    "concurrently": "^8.0.0",
+    "rimraf": "^5.0.0",
     "mermaid": "workspace:*"
   },
   "resolutions": {

packages/mermaid/package.json

@@ -53,14 +53,14 @@
   },
   "dependencies": {
     "@braintree/sanitize-url": "^6.0.0",
-    "@khanacademy/simple-markdown": "^0.8.6",
+    "@khanacademy/simple-markdown": "^0.9.0",
     "cytoscape": "^3.23.0",
     "cytoscape-cose-bilkent": "^4.1.0",
     "cytoscape-fcose": "^2.1.0",
     "d3": "^7.4.0",
     "dagre-d3-es": "7.0.10",
     "dayjs": "^1.11.7",
-    "dompurify": "2.4.5",
+    "dompurify": "3.0.2",
     "elkjs": "^0.8.2",
     "khroma": "^2.0.0",
     "lodash-es": "^4.17.21",
@@ -73,7 +73,7 @@
   "devDependencies": {
     "@types/cytoscape": "^3.19.9",
     "@types/d3": "^7.4.0",
-    "@types/dompurify": "^2.4.0",
+    "@types/dompurify": "^3.0.0",
     "@types/jsdom": "^21.0.0",
     "@types/lodash-es": "^4.17.7",
     "@types/micromatch": "^4.0.2",
@@ -83,7 +83,7 @@
     "@typescript-eslint/eslint-plugin": "^5.42.1",
     "@typescript-eslint/parser": "^5.42.1",
     "chokidar": "^3.5.3",
-    "concurrently": "^7.5.0",
+    "concurrently": "^8.0.0",
     "coveralls": "^3.1.1",
     "cpy-cli": "^4.2.0",
     "cspell": "^6.14.3",
@@ -98,18 +98,21 @@
     "remark": "^14.0.2",
     "remark-frontmatter": "^4.0.1",
     "remark-gfm": "^3.0.1",
-    "rimraf": "^4.0.0",
-    "start-server-and-test": "^1.14.0",
-    "typedoc": "^0.23.18",
-    "typedoc-plugin-markdown": "^3.13.6",
-    "typescript": "^4.8.4",
+    "rimraf": "^5.0.0",
+    "start-server-and-test": "^2.0.0",
+    "typedoc": "^0.24.4",
+    "typedoc-plugin-markdown": "^3.15.2",
+    "typescript": "^5.0.0",
     "unist-util-flatmap": "^1.0.0",
-    "vitepress": "^1.0.0-alpha.46",
-    "vitepress-plugin-search": "^1.0.4-alpha.19"
+    "vitepress": "^1.0.0-alpha.72",
+    "vitepress-plugin-search": "^1.0.4-alpha.20"
   },
   "files": [
-    "dist",
+    "dist/",
     "README.md"
   ],
-  "sideEffects": false
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  }
 }

packages/mermaid/src/diagrams/flowchart/elk/flowRenderer-elk.js

@@ -182,7 +182,7 @@ export const addVertices = async function (vert, svgId, root, doc, diagObj, pare
 
       // Add the element to the DOM
       if (node.type !== 'group') {
-        nodeEl = insertNode(nodes, node, vertex.dir);
+        nodeEl = await insertNode(nodes, node, vertex.dir);
         boundingBox = nodeEl.node().getBBox();
       } else {
         const svgLabel = doc.createElementNS('http://www.w3.org/2000/svg', 'text');

packages/mermaid/src/docs/ecosystem/integrations.md

@@ -21,7 +21,7 @@ They also serve as proof of concept, for the variety of things that can be built
 - [Swimm](https://swimm.io) (**Native support**)
 - [Notion](https://notion.so) (**Native support**)
 - [Observable](https://observablehq.com/@observablehq/mermaid) (**Native support**)
-- [Obsidian](https://help.obsidian.md/How+to/Format+your+notes#Diagram) (**Native support**)
+- [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) (**Native support**)
 - [GitBook](https://gitbook.com)
   - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid)
   - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli)

packages/mermaid/src/docs/syntax/classDiagram.md

@@ -403,10 +403,18 @@ click className href "url" "tooltip"
 
 ## Notes
 
-It is possible to add notes on diagram using `note "line1\nline2"` or note for class using `note for class "line1\nline2"`
+It is possible to add notes on the diagram using `note "line1\nline2"`. A note can be added for a specific class using `note for <CLASS NAME> "line1\nline2"`.
 
 ### Examples
 
+```mermaid
+classDiagram
+    note "This is a general note"
+    note for MyClass "This is a note for a class"
+    class MyClass{
+    }
+```
+
 _URL Link:_
 
 ```mmd

packages/mermaid/src/docs/syntax/flowchart.md

@@ -465,9 +465,9 @@ end
 
 Formatting:
 
-- For bold text, use double asterisks \*\* before and after the text.
-- For italics, use single asterisks \* before and after the text.
-- With traditional strings, you needed to add <br> tags for text to wrap in nodes. However, markdown strings automatically wrap text when it becomes too long and allows you to start a new line by simply using a newline character instead of a <br> tag.
+- For bold text, use double asterisks (`**`) before and after the text.
+- For italics, use single asterisks (`*`) before and after the text.
+- With traditional strings, you needed to add `<br>` tags for text to wrap in nodes. However, markdown strings automatically wrap text when it becomes too long and allows you to start a new line by simply using a newline character instead of a `<br>` tag.
 
 This feature is applicable to node labels, edge labels, and subgraph labels.