marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-20 15:59:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Updated flowcharts with the new syntax

Browse Source
This commit is contained in:
Knut Sveidqvist
2022-04-30 11:36:00 +02:00
parent bada661bd0
commit 85e157f0d3
5 changed files with 1137 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/diagrams/flowchart/parser/flow.jison
View File

@@ -7,8 +7,9 @@
/* lexical grammar */
%lex
%x string
%x title
%x accDescription
%x acc_title
%x acc_descr
%x acc_descr_multiline
%x dir
%x vertex
%x click
@@ -28,10 +29,14 @@
<arg_directive>((?:(?!\}\%\%).|\n)*) return 'arg_directive';
\%\%(?!\{)[^\n]* /* skip comments */
[^\}]\%\%[^\n]* /* skip comments */
title { this.begin("title");return 'title'; }
<title>(?!\n|;|#)*[^\n]* { this.popState(); return "title_value"; }
accDescription { this.begin("accDescription");return 'accDescription'; }
<accDescription>(?!\n|;|#)*[^\n]* { this.popState(); return "description_value"; }
accTitle\s*":"\s* { this.begin("acc_title");return 'acc_title'; }
<acc_title>(?!\n|;|#)*[^\n]* { this.popState(); return "acc_title_value"; }
accDescr\s*":"\s* { this.begin("acc_descr");return 'acc_descr'; }
<acc_descr>(?!\n|;|#)*[^\n]* { this.popState(); return "acc_descr_value"; }
accDescr\s*"{"\s* { this.begin("acc_descr_multiline");}
<acc_descr_multiline>[\}] { this.popState(); }
<acc_descr_multiline>[^\}]* return "acc_descr_multiline_value";
// <acc_descr_multiline>.*[^\n]* { return "acc_descr_line"}
["] this.begin("string");
<string>["] this.popState();
<string>[^"]* return "STR";
@@ -343,27 +348,13 @@ statement
| subgraph separator document end
{$$=yy.addSubGraph(undefined,$3,undefined);}
| direction
| title title_value { $$=$2.trim();yy.setTitle($$); }
| accDescription description_value { $$=$2.trim();yy.setAccDescription($$); }
| acc_title acc_title_value { $$=$2.trim();yy.setTitle($$); }
| acc_descr acc_descr_value { $$=$2.trim();yy.setAccDescription($$); }
| acc_descr_multiline_value { $$=$1.trim();yy.setAccDescription($$); }
;
separator: NEWLINE | SEMI | EOF ;
// verticeStatement:
// vertex link vertex
// { yy.addLink($1,$3,$2);$$ = [$1,$3];}
// | vertex link vertex STYLE_SEPARATOR idString
// { yy.addLink($1,$3,$2);$$ = [$1,$3];yy.setClass($3,$5);}
// | vertex STYLE_SEPARATOR idString link vertex
// { yy.addLink($1,$5,$4);$$ = [$1,$5];yy.setClass($1,$3);}
// | vertex STYLE_SEPARATOR idString link vertex STYLE_SEPARATOR idString
// { yy.addLink($1,$5,$4);$$ = [$1,$5];yy.setClass($5,$7);yy.setClass($1,$3);}
// |vertex
// {$$ = [$1];}
// |vertex STYLE_SEPARATOR idString
// {$$ = [$1];yy.setClass($1,$3)}
// ;
verticeStatement: verticeStatement link node
{ /* console.warn('vs',$1.stmt,$3); */ yy.addLink($1.stmt,$3,$2); $$ = { stmt: $3, nodes: $3.concat($1.nodes) } }

29
src/diagrams/flowchart/parser/flow.spec.js
View File

@@ -157,10 +157,10 @@ describe('parsing a flow chart', function () {
expect(vertices['1'].id).toBe('1');
});
it('should add title and description to flow chart', function () {
it('should add accTitle and accDescr to flow chart', function () {
const flowChart = `graph LR
title Big decisions
accDescription Flow chart of the decision making process
accTitle: Big decisions
accDescr: Flow chart of the decision making process
A[Hard] -->|Text| B(Round)
B --> C{Decision}
C -->|One| D[Result 1]
@@ -171,4 +171,27 @@ describe('parsing a flow chart', function () {
expect(flow.parser.yy.getTitle()).toBe('Big decisions');
expect(flow.parser.yy.getAccDescription()).toBe('Flow chart of the decision making process');
});
it('should add accTitle and a multi line accDescr to flow chart', function () {
const flowChart = `graph LR
accTitle: Big decisions
accDescr {
Flow chart of the decision making process
with a second line
}
A[Hard] -->|Text| B(Round)
B --> C{Decision}
C -->|One| D[Result 1]
C -->|Two| E[Result 2]
`;
flow.parser.parse(flowChart);
expect(flow.parser.yy.getTitle()).toBe('Big decisions');
console.log(flow.parser.yy.getAccDescription());
expect(flow.parser.yy.getAccDescription()).toBe(
`Flow chart of the decision making process
with a second line`
);
});
});