Update MermaidJS example

exampleSite/content/docs/shortcodes/mermaid.md

@@ -1,6 +1,6 @@
 # Mermaid Chart
 
-[Mermaid](https://mermaidjs.github.io/) is library for generating svg charts and diagrams from text.
+[MermaidJS](https://mermaid-js.github.io/) is library for generating svg charts and diagrams from text.
 
 {{< hint info >}}
 **Override Mermaid Initialization Config**
@@ -14,33 +14,28 @@ create a `mermaid.json` file in your `assets` folder!
 {{< columns >}}
 ```tpl
 {{</* mermaid [class="text-center"]*/>}}
-sequenceDiagram
+stateDiagram-v2
-    Alice->>Bob: Hello Bob, how are you?
+    State1: The state with a note
-    alt is sick
+    note right of State1
-        Bob->>Alice: Not so good :(
+        Important information! You can write
-    else is well
+        notes.
-        Bob->>Alice: Feeling fresh like a daisy
+    end note
-    end
+    State1 --> State2
-    opt Extra response
+    note left of State2 : This is the note to the left.
-        Bob->>Alice: Thanks for asking
-    end
 {{</* /mermaid */>}}
 ```
 
 <--->
 
 {{< mermaid >}}
-sequenceDiagram
+stateDiagram-v2
-    Alice->>Bob: Hello Bob, how are you?
+    State1: The state with a note
-    alt is sick
+    note right of State1
-        Bob->>Alice: Not so good :(
+        Important information! You can write
-    else is well
+        notes.
-        Bob->>Alice: Feeling fresh like a daisy
+    end note
-    end
+    State1 --> State2
-    opt Extra response
+    note left of State2 : This is the note to the left.
-        Bob->>Alice: Thanks for asking
-    end
 {{< /mermaid >}}
 
 {{< /columns >}}
-