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

Merge of feat: sequence diagram background rect #889

Browse Source
This commit is contained in:
knsv
2019-07-25 12:04:01 -07:00
parent 5b85fe9293 1ac126fb7a
commit 533b55bb68
4 changed files with 344 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -79,6 +79,7 @@
"-)" return '-)';
\- return 'MINUS';
"." return 'DOT';
[\_] return 'UNDERSCORE';
\+ return 'PLUS';
\% return 'PCT';
"=" return 'EQUALS';
@@ -263,79 +264,71 @@ statement
separator: NEWLINE | SEMI | EOF ;
verticeStatement:
vertex link vertex
{ yy.addLink($1,$3,$2);$$ = [$1,$3];}
| vertex
vertex link vertex
{ yy.addLink($1,$3,$2);$$ = [$1,$3];}
| vertex link vertex DOT idString
{ yy.addLink($1,$3,$2);$$ = [$1,$3];yy.setClass($3,$5);}
| vertex DOT idString link vertex
{ yy.addLink($1,$5,$4);$$ = [$1,$5];yy.setClass($1,$3);}
| vertex DOT idString link vertex DOT idString
{ yy.addLink($1,$5,$4);$$ = [$1,$5];yy.setClass($5,$7);yy.setClass($1,$3);}
|vertex
{$$ = [$1];}
|vertex DOT idString
{$$ = [$1];yy.setClass($1,$3)}
;
vertex: alphaNum SQS text SQE
vertex: idString SQS text SQE
{$$ = $1;yy.addVertex($1,$3,'square');}
| alphaNum SQS text SQE spaceList
| idString SQS text SQE spaceList
{$$ = $1;yy.addVertex($1,$3,'square');}
| alphaNum PS PS text PE PE
| idString PS PS text PE PE
{$$ = $1;yy.addVertex($1,$4,'circle');}
| alphaNum PS PS text PE PE spaceList
| idString PS PS text PE PE spaceList
{$$ = $1;yy.addVertex($1,$4,'circle');}
| alphaNum '(-' text '-)'
| idString '(-' text '-)'
{$$ = $1;yy.addVertex($1,$3,'ellipse');}
| alphaNum '(-' text '-)' spaceList
| idString '(-' text '-)' spaceList
{$$ = $1;yy.addVertex($1,$3,'ellipse');}
| alphaNum PS text PE
| idString PS text PE
{$$ = $1;yy.addVertex($1,$3,'round');}
| alphaNum PS text PE spaceList
| idString PS text PE spaceList
{$$ = $1;yy.addVertex($1,$3,'round');}
| alphaNum DIAMOND_START text DIAMOND_STOP
| idString DIAMOND_START text DIAMOND_STOP
{$$ = $1;yy.addVertex($1,$3,'diamond');}
| alphaNum DIAMOND_START text DIAMOND_STOP spaceList
| idString DIAMOND_START text DIAMOND_STOP spaceList
{$$ = $1;yy.addVertex($1,$3,'diamond');}
| alphaNum TAGEND text SQE
| idString TAGEND text SQE
{$$ = $1;yy.addVertex($1,$3,'odd');}
| alphaNum TAGEND text SQE spaceList
| idString TAGEND text SQE spaceList
{$$ = $1;yy.addVertex($1,$3,'odd');}
| alphaNum TRAPSTART text TRAPEND
| idString TRAPSTART text TRAPEND
{$$ = $1;yy.addVertex($1,$3,'trapezoid');}
| alphaNum TRAPSTART text TRAPEND spaceList
| idString TRAPSTART text TRAPEND spaceList
{$$ = $1;yy.addVertex($1,$3,'trapezoid');}
| alphaNum INVTRAPSTART text INVTRAPEND
| idString INVTRAPSTART text INVTRAPEND
{$$ = $1;yy.addVertex($1,$3,'inv_trapezoid');}
| alphaNum INVTRAPSTART text INVTRAPEND spaceList
| idString INVTRAPSTART text INVTRAPEND spaceList
{$$ = $1;yy.addVertex($1,$3,'inv_trapezoid');}
| alphaNum TRAPSTART text INVTRAPEND
| idString TRAPSTART text INVTRAPEND
{$$ = $1;yy.addVertex($1,$3,'lean_right');}
| alphaNum TRAPSTART text INVTRAPEND spaceList
| idString TRAPSTART text INVTRAPEND spaceList
{$$ = $1;yy.addVertex($1,$3,'lean_right');}
| alphaNum INVTRAPSTART text TRAPEND
| idString INVTRAPSTART text TRAPEND
{$$ = $1;yy.addVertex($1,$3,'lean_left');}
| alphaNum INVTRAPSTART text TRAPEND spaceList
| idString INVTRAPSTART text TRAPEND spaceList
{$$ = $1;yy.addVertex($1,$3,'lean_left');}
/* | alphaNum SQS text TAGSTART
/* | idString SQS text TAGSTART
{$$ = $1;yy.addVertex($1,$3,'odd_right');}
| alphaNum SQS text TAGSTART spaceList
| idString SQS text TAGSTART spaceList
{$$ = $1;yy.addVertex($1,$3,'odd_right');} */
| alphaNum
| idString
{$$ = $1;yy.addVertex($1);}
| alphaNum spaceList
| idString spaceList
{$$ = $1;yy.addVertex($1);}
;
alphaNum
: alphaNumStatement
{$$=$1;}
| alphaNum alphaNumStatement
{$$=$1+''+$2;}
;
alphaNumStatement
: DIR
{$$=$1;}
| alphaNumToken
{$$=$1;}
| DOWN
{$$='v';}
| MINUS
{$$='-';}
;
link: linkStatement arrowText
{$1.text = $2;$$ = $1;}
@@ -533,7 +526,34 @@ textToken : textNoTagsToken | TAGSTART | TAGEND | '==' | '--' | PCT | DEFA
textNoTagsToken: alphaNumToken | SPACE | MINUS | keywords ;
alphaNumToken : ALPHA | PUNCTUATION | UNICODE_TEXT | NUM | COLON | COMMA | PLUS | EQUALS | MULT | DOT | BRKT ;
idString
:idStringToken
{$$=$1}
| idString idStringToken
{$$=$1+''+$2}
;
alphaNum
: alphaNumStatement
{$$=$1;}
| alphaNum alphaNumStatement
{$$=$1+''+$2;}
;
alphaNumStatement
: DIR
{$$=$1;}
| alphaNumToken
{$$=$1;}
| DOWN
{$$='v';}
| MINUS
{$$='-';}
;
alphaNumToken : PUNCTUATION | UNICODE_TEXT | NUM| ALPHA | COLON | COMMA | PLUS | EQUALS | MULT | DOT | BRKT ;
idStringToken : ALPHA|UNDERSCORE |UNICODE_TEXT | NUM| COLON | COMMA | PLUS |MINUS| DOWN |EQUALS | MULT | BRKT ;
graphCodeTokens: TRAPSTART | TRAPEND | INVTRAPSTART | INVTRAPEND | PIPE | PS | PE | SQS | SQE | DIAMOND_START | DIAMOND_STOP | TAGSTART | TAGEND | ARROW_CROSS | ARROW_POINT | ARROW_CIRCLE | ARROW_OPEN | QUOTE | SEMI ;
%%

382
src/diagrams/flowchart/parser/flow.js
View File

File diff suppressed because one or more lines are too long

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

@@ -1508,6 +1508,17 @@ describe('when parsing ', function () {
expect(edges.length).toBe(0)
expect(vert['i-d'].styles.length).toBe(0)
})
fit('should handle a single node with alphanumerics containing a underscore sign', function () {
// Silly but syntactically correct
const res = flow.parser.parse('graph TD;i_d;')
const vert = flow.parser.yy.getVertices()
const edges = flow.parser.yy.getEdges()
expect(edges.length).toBe(0)
expect(vert['i_d'].styles.length).toBe(0)
})
// log.debug(flow.parser.parse('graph TD;style Q background:#fff;'));
it('should handle styles for vertices', function () {
const res = flow.parser.parse('graph TD;style Q background:#fff;')
@@ -1685,6 +1696,73 @@ describe('when parsing ', function () {
expect(classes['exClass'].styles[0]).toBe('background:#bbb')
expect(classes['exClass'].styles[1]).toBe('border:1px solid red')
})
it('should be possible to apply a class to a vertex directly', function () {
let statement = ''
statement = statement + 'graph TD;' + '\n'
statement = statement + 'classDef exClass background:#bbb,border:1px solid red;' + '\n'
statement = statement + 'a-->b[test].exClass;' + '\n'
const res = flow.parser.parse(statement)
const vertices = flow.parser.yy.getVertices()
const classes = flow.parser.yy.getClasses()
expect(classes['exClass'].styles.length).toBe(2)
expect(vertices['b'].classes[0]).toBe('exClass')
expect(classes['exClass'].styles[0]).toBe('background:#bbb')
expect(classes['exClass'].styles[1]).toBe('border:1px solid red')
})
it('should be possible to apply a class to a vertex directly : usecase A[text].class ', function () {
let statement = ''
statement = statement + 'graph TD;' + '\n'
statement = statement + 'classDef exClass background:#bbb,border:1px solid red;' + '\n'
statement = statement + 'b[test].exClass;' + '\n'
const res = flow.parser.parse(statement)
const vertices = flow.parser.yy.getVertices()
const classes = flow.parser.yy.getClasses()
expect(classes['exClass'].styles.length).toBe(2)
expect(vertices['b'].classes[0]).toBe('exClass')
expect(classes['exClass'].styles[0]).toBe('background:#bbb')
expect(classes['exClass'].styles[1]).toBe('border:1px solid red')
})
it('should be possible to apply a class to a vertex directly : usecase A[text].class-->B[test2] ', function () {
let statement = ''
statement = statement + 'graph TD;' + '\n'
statement = statement + 'classDef exClass background:#bbb,border:1px solid red;' + '\n'
statement = statement + 'A[test].exClass-->B[test2];' + '\n'
const res = flow.parser.parse(statement)
const vertices = flow.parser.yy.getVertices()
const classes = flow.parser.yy.getClasses()
expect(classes['exClass'].styles.length).toBe(2)
expect(vertices['A'].classes[0]).toBe('exClass')
expect(classes['exClass'].styles[0]).toBe('background:#bbb')
expect(classes['exClass'].styles[1]).toBe('border:1px solid red')
})
it('should be possible to apply a class to a vertex directly 2', function () {
let statement = ''
statement = statement + 'graph TD;' + '\n'
statement = statement + 'classDef exClass background:#bbb,border:1px solid red;' + '\n'
statement = statement + 'a-->b[1 a a text!.].exClass;' + '\n'
const res = flow.parser.parse(statement)
const vertices = flow.parser.yy.getVertices()
const classes = flow.parser.yy.getClasses()
expect(classes['exClass'].styles.length).toBe(2)
expect(vertices['b'].classes[0]).toBe('exClass')
expect(classes['exClass'].styles[0]).toBe('background:#bbb')
expect(classes['exClass'].styles[1]).toBe('border:1px solid red')
})
it('should be possible to apply a class to a comma separated list of vertices', function () {
let statement = ''