Merge branch 'develop' into aakansha/types
This commit is contained in:
commit
63dca5bb86
|
@ -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:
|
||||
|
|
|
@ -21,7 +21,7 @@ export const updateCurrentConfig = (siteCfg: MermaidConfig, _directives: Mermaid
|
|||
let sumOfDirectives: MermaidConfig = {};
|
||||
for (const d of _directives) {
|
||||
sanitize(d);
|
||||
// Apply the data from the directive where the the overrides the themeVariables
|
||||
// Apply the data from the directive where the overrides the themeVariables
|
||||
sumOfDirectives = assignWithDepth(sumOfDirectives, d);
|
||||
}
|
||||
|
||||
|
|
|
@ -45,7 +45,7 @@ flowchart
|
|||
a --> C2
|
||||
```
|
||||
|
||||
To handle this case a special type of edge is inserted. The edge to/from the cluster is replaced with an edge to/from a node in the cluster which is tagged with toCluster/fromCluster. When rendering this edge the intersection between the edge and the border of the cluster is calculated making the edge start/stop there. In practice this renders like an an edge to/from the cluster.
|
||||
To handle this case a special type of edge is inserted. The edge to/from the cluster is replaced with an edge to/from a node in the cluster which is tagged with toCluster/fromCluster. When rendering this edge the intersection between the edge and the border of the cluster is calculated making the edge start/stop there. In practice this renders like an edge to/from the cluster.
|
||||
|
||||
In the diagram above the root diagram would be rendered with C1 whereas C2 would be rendered recursively.
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
/*
|
||||
* Borrowed with love from from dagre-d3. Many thanks to cpettitt!
|
||||
* Borrowed with love from dagre-d3. Many thanks to cpettitt!
|
||||
*/
|
||||
|
||||
import node from './intersect-node.js';
|
||||
|
|
|
@ -262,7 +262,7 @@ const getBlocksFlat = () => {
|
|||
return [...Object.values(blockDatabase)];
|
||||
};
|
||||
/**
|
||||
* Returns the the hierarchy of blocks
|
||||
* Returns the hierarchy of blocks
|
||||
* @returns
|
||||
*/
|
||||
const getBlocks = () => {
|
||||
|
|
|
@ -141,7 +141,7 @@ describe('when parsing flowcharts', function () {
|
|||
expect(edges[3].type).toBe('arrow_point');
|
||||
expect(edges[3].text).toBe('');
|
||||
});
|
||||
it('should handle chaining and multiple nodes in in link statement FVC ', function () {
|
||||
it('should handle chaining and multiple nodes in link statement FVC ', function () {
|
||||
const res = flow.parser.parse(`
|
||||
graph TD
|
||||
A --> B & B2 & C --> D2;
|
||||
|
@ -181,7 +181,7 @@ describe('when parsing flowcharts', function () {
|
|||
expect(edges[5].type).toBe('arrow_point');
|
||||
expect(edges[5].text).toBe('');
|
||||
});
|
||||
it('should handle chaining and multiple nodes in in link statement with extra info in statements', function () {
|
||||
it('should handle chaining and multiple nodes in link statement with extra info in statements', function () {
|
||||
const res = flow.parser.parse(`
|
||||
graph TD
|
||||
A[ h ] -- hello --> B[" test "]:::exClass & C --> D;
|
||||
|
|
|
@ -64,7 +64,7 @@ describe('parsing a flow chart', function () {
|
|||
expect(edges[0].end).toBe('monograph');
|
||||
});
|
||||
|
||||
describe('special characters should be be handled.', function () {
|
||||
describe('special characters should be handled.', function () {
|
||||
const charTest = function (char, result) {
|
||||
const res = flow.parser.parse('graph TD;A(' + char + ')-->B;');
|
||||
|
||||
|
|
|
@ -145,7 +145,7 @@ const getRootDocV2 = () => {
|
|||
* Ex: the section within a fork has its own statements, and incoming and outgoing statements
|
||||
* refer to the fork as a whole (document).
|
||||
* See the parser grammar: the definition of a document is a document then a 'line', where a line can be a statement.
|
||||
* This will push the statement into the the list of statements for the current document.
|
||||
* This will push the statement into the list of statements for the current document.
|
||||
*
|
||||
* @param _doc
|
||||
*/
|
||||
|
|
|
@ -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:
|
||||
|
|
1037
pnpm-lock.yaml
1037
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue