mirrors
/
mermaid
mirror of https://github.com/mermaid-js/mermaid.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #5485 from cbugk/develop 

Add named composite state example to stateDiagram-v2
This commit is contained in:
Sidharth Vinod 2024-04-26 18:08:12 +00:00 committed by GitHub
parent d316b05fa1 3000f0208f
commit 8265e53128
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 26 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
docs/syntax/stateDiagram.md
View File

@ -160,7 +160,7 @@ In a real world use of state diagrams you often end up with diagrams that are mu
have several internal states. These are called composite states in this terminology.
In order to define a composite state you need to use the state keyword followed by an id and the body of the composite
state between {}. See the example below:
state between {}. You can name a composite state on a separate line just like a simple state. See the example below:
```mermaid-example
stateDiagram-v2
@ -169,6 +169,14 @@ stateDiagram-v2
[*] --> second
second --> [*]
}
[*] --> NamedComposite
NamedComposite: Another Composite
state NamedComposite {
[*] --> namedSimple
namedSimple --> [*]
namedSimple: Another simple
}
```
```mermaid
@ -178,6 +186,14 @@ stateDiagram-v2
[*] --> second
second --> [*]
}
[*] --> NamedComposite
NamedComposite: Another Composite
state NamedComposite {
[*] --> namedSimple
namedSimple --> [*]
namedSimple: Another simple
}
```
You can do this in several layers:

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

@ -98,7 +98,7 @@ In a real world use of state diagrams you often end up with diagrams that are mu
have several internal states. These are called composite states in this terminology.
In order to define a composite state you need to use the state keyword followed by an id and the body of the composite
state between \{\}. See the example below:
state between \{\}. You can name a composite state on a separate line just like a simple state. See the example below:
```mermaid-example
stateDiagram-v2
@ -107,6 +107,14 @@ stateDiagram-v2
[*] --> second
second --> [*]
}
[*] --> NamedComposite
NamedComposite: Another Composite
state NamedComposite {
[*] --> namedSimple
namedSimple --> [*]
namedSimple: Another simple
}
```
You can do this in several layers: