monaco-mermaid-ng 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.js ADDED
@@ -0,0 +1,1377 @@
1
+ export default (monacoEditor) => {
2
+ monacoEditor.languages.register({ id: 'mermaid' });
3
+ const requirementDiagrams = [
4
+ 'requirement',
5
+ 'functionalRequirement',
6
+ 'interfaceRequirement',
7
+ 'performanceRequirement',
8
+ 'physicalRequirement',
9
+ 'designConstraint',
10
+ ];
11
+ const keywords = {
12
+ flowchart: {
13
+ typeKeywords: ['flowchart', 'flowchart-v2', 'flowchart-elk', 'graph'],
14
+ blockKeywords: ['subgraph', 'end'],
15
+ keywords: [
16
+ 'TB',
17
+ 'TD',
18
+ 'BT',
19
+ 'RL',
20
+ 'LR',
21
+ 'click',
22
+ 'call',
23
+ 'href',
24
+ '_self',
25
+ '_blank',
26
+ '_parent',
27
+ '_top',
28
+ 'linkStyle',
29
+ 'style',
30
+ 'classDef',
31
+ 'class',
32
+ 'direction',
33
+ 'interpolate',
34
+ ],
35
+ },
36
+ sequenceDiagram: {
37
+ typeKeywords: ['sequenceDiagram'],
38
+ blockKeywords: [
39
+ 'alt',
40
+ 'par',
41
+ 'and',
42
+ 'loop',
43
+ 'else',
44
+ 'end',
45
+ 'rect',
46
+ 'opt',
47
+ 'alt',
48
+ 'rect',
49
+ ],
50
+ keywords: [
51
+ 'participant',
52
+ 'as',
53
+ 'Note',
54
+ 'note',
55
+ 'right of',
56
+ 'left of',
57
+ 'over',
58
+ 'activate',
59
+ 'deactivate',
60
+ 'autonumber',
61
+ 'title',
62
+ 'actor',
63
+ 'accDescription',
64
+ 'link',
65
+ 'links',
66
+ ],
67
+ },
68
+ classDiagram: {
69
+ typeKeywords: ['classDiagram', 'classDiagram-v2'],
70
+ blockKeywords: ['class'],
71
+ keywords: [
72
+ 'link',
73
+ 'click',
74
+ 'callback',
75
+ 'call',
76
+ 'href',
77
+ 'cssClass',
78
+ 'direction',
79
+ 'TB',
80
+ 'BT',
81
+ 'RL',
82
+ 'LR',
83
+ 'title',
84
+ 'accDescription',
85
+ 'order',
86
+ ],
87
+ },
88
+ stateDiagram: {
89
+ typeKeywords: ['stateDiagram', 'stateDiagram-v2'],
90
+ blockKeywords: ['state', 'note', 'end'],
91
+ keywords: [
92
+ 'state',
93
+ 'as',
94
+ 'hide empty description',
95
+ 'direction',
96
+ 'TB',
97
+ 'BT',
98
+ 'RL',
99
+ 'LR',
100
+ ],
101
+ },
102
+ erDiagram: {
103
+ typeKeywords: ['erDiagram'],
104
+ blockKeywords: [],
105
+ keywords: ['title', 'accDescription'],
106
+ },
107
+ journey: {
108
+ typeKeywords: ['journey'],
109
+ blockKeywords: ['section'],
110
+ keywords: ['title'],
111
+ },
112
+ info: {
113
+ typeKeywords: ['info'],
114
+ blockKeywords: [],
115
+ keywords: ['showInfo'],
116
+ },
117
+ gantt: {
118
+ typeKeywords: ['gantt'],
119
+ blockKeywords: [],
120
+ keywords: [
121
+ 'title',
122
+ 'dateFormat',
123
+ 'axisFormat',
124
+ 'todayMarker',
125
+ 'section',
126
+ 'excludes',
127
+ 'inclusiveEndDates',
128
+ ],
129
+ },
130
+ requirementDiagram: {
131
+ typeKeywords: ['requirement', 'requirementDiagram'],
132
+ blockKeywords: requirementDiagrams.concat('element'),
133
+ keywords: [],
134
+ },
135
+ gitGraph: {
136
+ typeKeywords: ['gitGraph'],
137
+ blockKeywords: [],
138
+ keywords: [
139
+ 'accTitle',
140
+ 'accDescr',
141
+ 'commit',
142
+ 'cherry-pick',
143
+ 'branch',
144
+ 'merge',
145
+ 'reset',
146
+ 'checkout',
147
+ 'LR',
148
+ 'BT',
149
+ 'id',
150
+ 'msg',
151
+ 'type',
152
+ 'tag',
153
+ 'NORMAL',
154
+ 'REVERSE',
155
+ 'HIGHLIGHT',
156
+ ],
157
+ },
158
+ pie: {
159
+ typeKeywords: ['pie'],
160
+ blockKeywords: [],
161
+ keywords: ['title', 'showData', 'title', 'accDescription'],
162
+ },
163
+ c4Diagram: {
164
+ typeKeywords: [
165
+ 'C4Context',
166
+ 'C4Container',
167
+ 'C4Component',
168
+ 'C4Dynamic',
169
+ 'C4Deployment',
170
+ ],
171
+ blockKeywords: [
172
+ 'Boundary',
173
+ 'Enterprise_Boundary',
174
+ 'System_Boundary',
175
+ 'Container_Boundary',
176
+ 'Node',
177
+ 'Node_L',
178
+ 'Node_R',
179
+ ],
180
+ keywords: [
181
+ 'title',
182
+ 'accDescription',
183
+ 'direction',
184
+ 'TB',
185
+ 'BT',
186
+ 'RL',
187
+ 'LR',
188
+ 'Person_Ext',
189
+ 'Person',
190
+ 'SystemQueue_Ext',
191
+ 'SystemDb_Ext',
192
+ 'System_Ext',
193
+ 'SystemQueue',
194
+ 'SystemDb',
195
+ 'System',
196
+ 'ContainerQueue_Ext',
197
+ 'ContainerDb_Ext',
198
+ 'Container_Ext',
199
+ 'ContainerQueue',
200
+ 'ContainerDb',
201
+ 'Container',
202
+ 'ComponentQueue_Ext',
203
+ 'ComponentDb_Ext',
204
+ 'Component_Ext',
205
+ 'ComponentQueue',
206
+ 'ComponentDb',
207
+ 'Component',
208
+ 'Deployment_Node',
209
+ 'Rel',
210
+ 'BiRel',
211
+ 'Rel_Up',
212
+ 'Rel_U',
213
+ 'Rel_Down',
214
+ 'Rel_D',
215
+ 'Rel_Left',
216
+ 'Rel_L',
217
+ 'Rel_Right',
218
+ 'Rel_R',
219
+ 'Rel_Back',
220
+ 'RelIndex',
221
+ ],
222
+ },
223
+ mindmap: {
224
+ typeKeywords: ['mindmap'],
225
+ blockKeywords: [],
226
+ keywords: ['root', 'icon', 'class'],
227
+ },
228
+ timeline: {
229
+ typeKeywords: ['timeline'],
230
+ blockKeywords: ['section'],
231
+ keywords: ['title', 'accDescription'],
232
+ },
233
+ sankey: {
234
+ typeKeywords: ['sankey', 'sankey-beta'],
235
+ blockKeywords: [],
236
+ keywords: [],
237
+ },
238
+ quadrantChart: {
239
+ typeKeywords: ['quadrantChart'],
240
+ blockKeywords: [],
241
+ keywords: [
242
+ 'title',
243
+ 'x-axis',
244
+ 'y-axis',
245
+ 'quadrant-1',
246
+ 'quadrant-2',
247
+ 'quadrant-3',
248
+ 'quadrant-4',
249
+ 'classDef',
250
+ ],
251
+ },
252
+ xychart: {
253
+ typeKeywords: ['xychart-beta', 'xychart'],
254
+ blockKeywords: [],
255
+ keywords: [
256
+ 'title',
257
+ 'x-axis',
258
+ 'y-axis',
259
+ 'line',
260
+ 'bar',
261
+ 'horizontal',
262
+ 'vertical',
263
+ ],
264
+ },
265
+ block: {
266
+ typeKeywords: ['block-beta', 'block'],
267
+ blockKeywords: ['block', 'end'],
268
+ keywords: ['columns', 'space', 'style', 'classDef', 'class'],
269
+ },
270
+ packet: {
271
+ typeKeywords: ['packet-beta', 'packet'],
272
+ blockKeywords: [],
273
+ keywords: [],
274
+ },
275
+ kanban: {
276
+ typeKeywords: ['kanban'],
277
+ blockKeywords: [],
278
+ keywords: ['assigned', 'ticket', 'priority'],
279
+ },
280
+ architecture: {
281
+ typeKeywords: ['architecture-beta', 'architecture'],
282
+ blockKeywords: [],
283
+ keywords: [
284
+ 'group',
285
+ 'service',
286
+ 'junction',
287
+ 'cloud',
288
+ 'database',
289
+ 'disk',
290
+ 'internet',
291
+ 'server',
292
+ 'in',
293
+ ],
294
+ },
295
+ radar: {
296
+ typeKeywords: ['radar-beta', 'radar'],
297
+ blockKeywords: [],
298
+ keywords: [
299
+ 'title',
300
+ 'axis',
301
+ 'curve',
302
+ 'showLegend',
303
+ 'max',
304
+ 'min',
305
+ 'graticule',
306
+ 'ticks',
307
+ 'circle',
308
+ 'polygon',
309
+ ],
310
+ },
311
+ treemap: {
312
+ typeKeywords: ['treemap-beta', 'treemap'],
313
+ blockKeywords: [],
314
+ keywords: ['classDef', 'class'],
315
+ },
316
+ };
317
+ const configDirectiveHandler = [
318
+ /^\s*%%(?={)/,
319
+ {
320
+ token: 'string',
321
+ next: '@configDirective',
322
+ nextEmbedded: 'javascript',
323
+ },
324
+ ];
325
+ // Register a tokens provider for the mermaid language
326
+ monacoEditor.languages.setMonarchTokensProvider('mermaid', Object.assign(Object.assign({}, Object.entries(keywords)
327
+ .map((entry) => Object.fromEntries(Object.entries(entry[1]).map((deepEntry) => [
328
+ entry[0] + deepEntry[0][0].toUpperCase() + deepEntry[0].slice(1),
329
+ deepEntry[1],
330
+ ])))
331
+ .reduce((overallKeywords, nextKeyword) => (Object.assign(Object.assign({}, overallKeywords), nextKeyword)), {})), { tokenizer: {
332
+ root: [
333
+ [/^\s*gitGraph/m, 'typeKeyword', 'gitGraph'],
334
+ [/^\s*info/m, 'typeKeyword', 'info'],
335
+ [/^\s*pie/m, 'typeKeyword', 'pie'],
336
+ [
337
+ /^\s*(flowchart|flowchart-v2|flowchart-elk|graph)/m,
338
+ 'typeKeyword',
339
+ 'flowchart',
340
+ ],
341
+ [/^\s*sequenceDiagram/, 'typeKeyword', 'sequenceDiagram'],
342
+ [/^\s*classDiagram(-v2)?/, 'typeKeyword', 'classDiagram'],
343
+ [/^\s*journey/, 'typeKeyword', 'journey'],
344
+ [/^\s*gantt/, 'typeKeyword', 'gantt'],
345
+ [/^\s*stateDiagram(-v2)?/, 'typeKeyword', 'stateDiagram'],
346
+ [/^\s*er(Diagram)?/, 'typeKeyword', 'erDiagram'],
347
+ [/^\s*requirement(Diagram)?/, 'typeKeyword', 'requirementDiagram'],
348
+ [
349
+ /^\s*(C4Context|C4Container|C4Component|C4Dynamic|C4Deployment)/m,
350
+ 'typeKeyword',
351
+ 'c4Diagram',
352
+ ],
353
+ [/^\s*mindmap/m, 'typeKeyword', 'mindmap'],
354
+ [/^\s*timeline/m, 'typeKeyword', 'timeline'],
355
+ [/^\s*sankey(-beta)?/m, 'typeKeyword', 'sankey'],
356
+ [/^\s*quadrantChart/m, 'typeKeyword', 'quadrantChart'],
357
+ [/^\s*xychart(-beta)?/m, 'typeKeyword', 'xychart'],
358
+ [/^\s*block(-beta)?/m, 'typeKeyword', 'block'],
359
+ [/^\s*packet(-beta)?/m, 'typeKeyword', 'packet'],
360
+ [/^\s*kanban/m, 'typeKeyword', 'kanban'],
361
+ [/^\s*architecture(-beta)?/m, 'typeKeyword', 'architecture'],
362
+ [/^\s*radar(-beta)?/m, 'typeKeyword', 'radar'],
363
+ [/^\s*treemap(-beta)?/m, 'typeKeyword', 'treemap'],
364
+ [
365
+ /^---$/,
366
+ { token: 'keyword', next: '@frontmatter', nextEmbedded: 'yaml' },
367
+ ],
368
+ configDirectiveHandler,
369
+ [/%%[^${].*$/, 'comment'],
370
+ ],
371
+ frontmatter: [
372
+ [/^---$/, { token: 'keyword', next: '@pop', nextEmbedded: '@pop' }],
373
+ ],
374
+ configDirective: [
375
+ [/%%$/, { token: 'string', next: '@pop', nextEmbedded: '@pop' }],
376
+ ],
377
+ gitGraph: [
378
+ configDirectiveHandler,
379
+ [/option(?=s)/, { token: 'typeKeyword', next: 'optionsGitGraph' }],
380
+ [
381
+ /(accTitle|accDescr)(\s*:)(\s*[^\r\n]+$)/,
382
+ ['keyword', 'delimiter.bracket', 'string'],
383
+ ],
384
+ [
385
+ /(^\s*branch)(.*?)(\s+order)(:\s*)(\d+\s*$)/,
386
+ ['keyword', 'variable', 'keyword', 'delimiter.bracket', 'number'],
387
+ ],
388
+ [/".*?"/, 'string'],
389
+ [
390
+ /(^\s*)(branch|reset|merge|checkout)(\s*\S+)/m,
391
+ ['delimiter.bracket', 'keyword', 'variable'],
392
+ ],
393
+ [
394
+ /[a-zA-Z][\w$]*/,
395
+ {
396
+ cases: {
397
+ '@gitGraphBlockKeywords': 'typeKeyword',
398
+ '@gitGraphKeywords': 'keyword',
399
+ },
400
+ },
401
+ ],
402
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
403
+ [/\^/, 'delimiter.bracket'],
404
+ ],
405
+ optionsGitGraph: [
406
+ [
407
+ /s$/,
408
+ {
409
+ token: 'typeKeyword',
410
+ nextEmbedded: 'json',
411
+ },
412
+ ],
413
+ ['end', { token: 'typeKeyword', next: '@pop', nextEmbedded: '@pop' }],
414
+ ],
415
+ info: [
416
+ [
417
+ /[a-zA-Z][\w$]*/,
418
+ {
419
+ cases: {
420
+ '@infoBlockKeywords': 'typeKeyword',
421
+ '@infoKeywords': 'keyword',
422
+ },
423
+ },
424
+ ],
425
+ ],
426
+ pie: [
427
+ configDirectiveHandler,
428
+ [/(title|accDescription)(.*$)/, ['keyword', 'string']],
429
+ [
430
+ /[a-zA-Z][\w$]*/,
431
+ {
432
+ cases: {
433
+ '@pieBlockKeywords': 'typeKeyword',
434
+ '@pieKeywords': 'keyword',
435
+ },
436
+ },
437
+ ],
438
+ [/".*?"/, 'string'],
439
+ [/\s*\d+/, 'number'],
440
+ [/:/, 'delimiter.bracket'],
441
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
442
+ ],
443
+ flowchart: [
444
+ configDirectiveHandler,
445
+ [/[ox]?(--+|==+)[ox]/, 'transition'],
446
+ [
447
+ /[a-zA-Z][\w$]*/,
448
+ {
449
+ cases: {
450
+ '@flowchartBlockKeywords': 'typeKeyword',
451
+ '@flowchartKeywords': 'keyword',
452
+ '@default': 'variable',
453
+ },
454
+ },
455
+ ],
456
+ [/\|+.+?\|+/, 'string'],
457
+ [/\[+(\\.+?[\\/]|\/.+?[/\\])\]+/, 'string'],
458
+ [/[[>]+[^\]|[]+?\]+/, 'string'],
459
+ [/{+.+?}+/, 'string'],
460
+ [/\(+.+?\)+/, 'string'],
461
+ [/-\.+->?/, 'transition'],
462
+ [
463
+ /(-[-.])([^->][^-]+?)(-{3,}|-{2,}>|\.-+>)/,
464
+ ['transition', 'string', 'transition'],
465
+ ],
466
+ [/(==+)([^=]+?)(={3,}|={2,}>)/, ['transition', 'string', 'transition']],
467
+ [/<?(--+|==+)>|===+|---+/, 'transition'],
468
+ [/:::/, 'transition'],
469
+ [/[;&]/, 'delimiter.bracket'],
470
+ [/".*?"/, 'string'],
471
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
472
+ ],
473
+ sequenceDiagram: [
474
+ configDirectiveHandler,
475
+ [/(title:?|accDescription)([^\r\n;]*$)/, ['keyword', 'string']],
476
+ [/(autonumber)([^\r\n\S]+off[^\r\n\S]*$)/, ['keyword', 'keyword']],
477
+ [
478
+ /(autonumber)([^\r\n\S]+\d+[^\r\n\S]+\d+[^\r\n\S]*$)/,
479
+ ['keyword', 'number'],
480
+ ],
481
+ [/(autonumber)([^\r\n\S]+\d+[^\r\n\S]*$)/, ['keyword', 'number']],
482
+ [
483
+ /(link\s+)(.*?)(:)(\s*.*?)(\s*@)(\s*[^\r\n;]+)/,
484
+ [
485
+ 'keyword',
486
+ 'variable',
487
+ 'delimiter.bracket',
488
+ 'string',
489
+ 'delimiter.bracket',
490
+ 'string',
491
+ ],
492
+ ],
493
+ [
494
+ /((?:links|properties)\s+)([^\r\n:]*?)(:\s+)/,
495
+ [
496
+ { token: 'keyword' },
497
+ { token: 'variable' },
498
+ {
499
+ token: 'delimiter.bracket',
500
+ nextEmbedded: 'javascript',
501
+ next: '@sequenceDiagramLinksProps',
502
+ },
503
+ ],
504
+ ],
505
+ [
506
+ /[a-zA-Z][\w$]*/,
507
+ {
508
+ cases: {
509
+ '@sequenceDiagramBlockKeywords': 'typeKeyword',
510
+ '@sequenceDiagramKeywords': 'keyword',
511
+ '@default': 'variable',
512
+ },
513
+ },
514
+ ],
515
+ [/(--?>?>|--?[)x])[+-]?/, 'transition'],
516
+ [/(:)([^:\n]*?$)/, ['delimiter.bracket', 'string']],
517
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
518
+ ],
519
+ sequenceDiagramLinksProps: [
520
+ // [/^:/, { token: 'delimiter.bracket', nextEmbedded: 'json' }],
521
+ [
522
+ /$|;/,
523
+ { nextEmbedded: '@pop', next: '@pop', token: 'delimiter.bracket' },
524
+ ],
525
+ ],
526
+ classDiagram: [
527
+ configDirectiveHandler,
528
+ [/(^\s*(?:title|accDescription))(\s+.*$)/, ['keyword', 'string']],
529
+ [
530
+ /(\*|<\|?|o|)(--|\.\.)(\*|\|?>|o|)([ \t]*[a-zA-Z]+[ \t]*)(:)(.*?$)/,
531
+ [
532
+ 'transition',
533
+ 'transition',
534
+ 'transition',
535
+ 'variable',
536
+ 'delimiter.bracket',
537
+ 'string',
538
+ ],
539
+ ],
540
+ [/(?!class\s)([a-zA-Z]+)(\s+[a-zA-Z]+)/, ['type', 'variable']],
541
+ [/(\*|<\|?|o)?(--|\.\.)(\*|\|?>|o)?/, 'transition'],
542
+ [/^\s*class\s(?!.*\{)/, 'keyword'],
543
+ [
544
+ /[a-zA-Z][\w$]*/,
545
+ {
546
+ cases: {
547
+ '@classDiagramBlockKeywords': 'typeKeyword',
548
+ '@classDiagramKeywords': 'keyword',
549
+ '@default': 'variable',
550
+ },
551
+ },
552
+ ],
553
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
554
+ [
555
+ /(<<)(.+?)(>>)/,
556
+ ['delimiter.bracket', 'annotation', 'delimiter.bracket'],
557
+ ],
558
+ [/".*?"/, 'string'],
559
+ [/:::/, 'transition'],
560
+ [/:|\+|-|#|~|\*\s*$|\$\s*$|\(|\)|{|}/, 'delimiter.bracket'],
561
+ ],
562
+ journey: [
563
+ configDirectiveHandler,
564
+ [/(title)(.*)/, ['keyword', 'string']],
565
+ [/(section)(.*)/, ['typeKeyword', 'string']],
566
+ [
567
+ /[a-zA-Z][\w$]*/,
568
+ {
569
+ cases: {
570
+ '@journeyBlockKeywords': 'typeKeyword',
571
+ '@journeyKeywords': 'keyword',
572
+ '@default': 'variable',
573
+ },
574
+ },
575
+ ],
576
+ [
577
+ /(^\s*.+?)(:)(.*?)(:)(.*?)([,$])/,
578
+ [
579
+ 'string',
580
+ 'delimiter.bracket',
581
+ 'number',
582
+ 'delimiter.bracket',
583
+ 'variable',
584
+ 'delimiter.bracket',
585
+ ],
586
+ ],
587
+ [/,/, 'delimiter.bracket'],
588
+ [/(^\s*.+?)(:)([^:]*?)$/, ['string', 'delimiter.bracket', 'variable']],
589
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
590
+ ],
591
+ gantt: [
592
+ configDirectiveHandler,
593
+ [/(title)(.*)/, ['keyword', 'string']],
594
+ [/(section)(.*)/, ['typeKeyword', 'string']],
595
+ [/^\s*([^:\n]*?)(:)/, ['string', 'delimiter.bracket']],
596
+ [
597
+ /[a-zA-Z][\w$]*/,
598
+ {
599
+ cases: {
600
+ '@ganttBlockKeywords': 'typeKeyword',
601
+ '@ganttKeywords': 'keyword',
602
+ },
603
+ },
604
+ ],
605
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
606
+ [/:/, 'delimiter.bracket'],
607
+ ],
608
+ stateDiagram: [
609
+ configDirectiveHandler,
610
+ [/note[^:]*$/, { token: 'typeKeyword', next: 'stateDiagramNote' }],
611
+ ['hide empty description', 'keyword'],
612
+ [/^\s*state\s(?!.*\{)/, 'keyword'],
613
+ [/(<<)(fork|join|choice)(>>)/, 'annotation'],
614
+ [
615
+ /(\[\[)(fork|join|choice)(]])/,
616
+ ['delimiter.bracket', 'annotation', 'delimiter.bracket'],
617
+ ],
618
+ [
619
+ /[a-zA-Z][\w$]*/,
620
+ {
621
+ cases: {
622
+ '@stateDiagramBlockKeywords': 'typeKeyword',
623
+ '@stateDiagramKeywords': 'keyword',
624
+ '@default': 'variable',
625
+ },
626
+ },
627
+ ],
628
+ [/".*?"/, 'string'],
629
+ [/(:)([^:\n]*?$)/, ['delimiter.bracket', 'string']],
630
+ [/{|}/, 'delimiter.bracket'],
631
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
632
+ [/-->/, 'transition'],
633
+ [/\[.*?]/, 'string'],
634
+ ],
635
+ stateDiagramNote: [
636
+ [/^\s*end note$/, { token: 'typeKeyword', next: '@pop' }],
637
+ [/.*/, 'string'],
638
+ ],
639
+ erDiagram: [
640
+ configDirectiveHandler,
641
+ [/(title|accDescription)(.*$)/, ['keyword', 'string']],
642
+ [/[}|][o|](--|\.\.)[o|][{|]/, 'transition'],
643
+ [/".*?"/, 'string'],
644
+ [/(:)(.*?$)/, ['delimiter.bracket', 'string']],
645
+ [/:|{|}/, 'delimiter.bracket'],
646
+ [/([a-zA-Z]+)(\s+[a-zA-Z]+)/, ['type', 'variable']],
647
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
648
+ [/[a-zA-Z_-][\w$]*/, 'variable'],
649
+ ],
650
+ requirementDiagram: [
651
+ configDirectiveHandler,
652
+ [/->|<-|-/, 'transition'],
653
+ [/(\d+\.)*\d+/, 'number'],
654
+ [
655
+ /[a-zA-Z_-][\w$]*/,
656
+ {
657
+ cases: {
658
+ '@requirementDiagramBlockKeywords': 'typeKeyword',
659
+ '@default': 'variable',
660
+ },
661
+ },
662
+ ],
663
+ [/:|{|}|\//, 'delimiter.bracket'],
664
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
665
+ [/".*?"/, 'string'],
666
+ ],
667
+ c4Diagram: [
668
+ configDirectiveHandler,
669
+ [/(title|accDescription)(.*$)/, ['keyword', 'string']],
670
+ [/\(/, { token: 'delimiter.bracket', next: 'c4DiagramParenthesis' }],
671
+ [
672
+ /[a-zA-Z_-][\w$]*/,
673
+ {
674
+ cases: {
675
+ '@c4DiagramBlockKeywords': 'typeKeyword',
676
+ '@c4DiagramKeywords': 'keyword',
677
+ '@default': 'variable',
678
+ },
679
+ },
680
+ ],
681
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
682
+ ],
683
+ c4DiagramParenthesis: [
684
+ [/,/, 'delimiter.bracket'],
685
+ [/\)/, { next: '@pop', token: 'delimiter.bracket' }],
686
+ [/[^,)]/, 'string'],
687
+ ],
688
+ mindmap: [
689
+ configDirectiveHandler,
690
+ [/::icon\(.*?\)/, 'annotation'],
691
+ [/:::[\w]+/, 'annotation'],
692
+ [/\(\(.*?\)\)/, 'string'],
693
+ [/\(.*?\)/, 'string'],
694
+ [/\[.*?\]/, 'string'],
695
+ [/\{\{.*?\}\}/, 'string'],
696
+ [/\)\).*?\(\(/, 'string'],
697
+ [
698
+ /[a-zA-Z][\w$]*/,
699
+ {
700
+ cases: {
701
+ '@mindmapKeywords': 'keyword',
702
+ '@default': 'variable',
703
+ },
704
+ },
705
+ ],
706
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
707
+ ],
708
+ timeline: [
709
+ configDirectiveHandler,
710
+ [/(title)(.*)/, ['keyword', 'string']],
711
+ [/(section)(.*)/, ['typeKeyword', 'string']],
712
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
713
+ [/:/, 'delimiter.bracket'],
714
+ [
715
+ /[a-zA-Z][\w$]*/,
716
+ {
717
+ cases: {
718
+ '@timelineBlockKeywords': 'typeKeyword',
719
+ '@timelineKeywords': 'keyword',
720
+ '@default': 'variable',
721
+ },
722
+ },
723
+ ],
724
+ ],
725
+ sankey: [
726
+ configDirectiveHandler,
727
+ [/"[^"]*"/, 'string'],
728
+ [/'[^']*'/, 'string'],
729
+ [/,/, 'delimiter.bracket'],
730
+ [/[\d.]+/, 'number'],
731
+ [/[a-zA-Z][\w\s]*(?=,)/, 'variable'],
732
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
733
+ ],
734
+ quadrantChart: [
735
+ configDirectiveHandler,
736
+ [/(title)(.*)/, ['keyword', 'string']],
737
+ [
738
+ /(x-axis|y-axis)(\s+)(.+?)(-->)(.+)/,
739
+ ['keyword', '', 'string', 'transition', 'string'],
740
+ ],
741
+ [/(x-axis|y-axis)(\s+)(.*)/, ['keyword', '', 'string']],
742
+ [/(quadrant-[1-4])(\s+)(.*)/, ['keyword', '', 'string']],
743
+ [/(classDef)(\s+)(\w+)(.*)/, ['keyword', '', 'type', 'string']],
744
+ [
745
+ /(\w+)(:::)(\w+)(:)(\s*\[)([^\]]+)(\])/,
746
+ [
747
+ 'variable',
748
+ 'transition',
749
+ 'type',
750
+ 'delimiter.bracket',
751
+ 'delimiter.bracket',
752
+ 'number',
753
+ 'delimiter.bracket',
754
+ ],
755
+ ],
756
+ [
757
+ /(\w[\w\s]*?)(:)(\s*\[)([^\]]+)(\])/,
758
+ [
759
+ 'variable',
760
+ 'delimiter.bracket',
761
+ 'delimiter.bracket',
762
+ 'number',
763
+ 'delimiter.bracket',
764
+ ],
765
+ ],
766
+ [/[\d.]+/, 'number'],
767
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
768
+ ],
769
+ xychart: [
770
+ configDirectiveHandler,
771
+ [/(title)(\s+)(".*?"|[^\n]+)/, ['keyword', '', 'string']],
772
+ [
773
+ /(x-axis)(\s+)(".*?"|[\w]+)(\s+)(\d+)(\s*)(-->)(\s*)(\d+)/,
774
+ [
775
+ 'keyword',
776
+ '',
777
+ 'string',
778
+ '',
779
+ 'number',
780
+ '',
781
+ 'transition',
782
+ '',
783
+ 'number',
784
+ ],
785
+ ],
786
+ [
787
+ /(x-axis|y-axis)(\s+)(".*?"|[\w]+)(\s*)(\[)([^\]]+)(\])/,
788
+ [
789
+ 'keyword',
790
+ '',
791
+ 'string',
792
+ '',
793
+ 'delimiter.bracket',
794
+ 'string',
795
+ 'delimiter.bracket',
796
+ ],
797
+ ],
798
+ [/(x-axis|y-axis)(\s+)(".*?"|.*)/, ['keyword', '', 'string']],
799
+ [
800
+ /(line|bar)(\s*)(\[)([^\]]+)(\])/,
801
+ ['keyword', '', 'delimiter.bracket', 'number', 'delimiter.bracket'],
802
+ ],
803
+ [/".*?"/, 'string'],
804
+ [/\[.*?\]/, 'string'],
805
+ [/[\d.+-]+/, 'number'],
806
+ [
807
+ /[a-zA-Z][\w$]*/,
808
+ {
809
+ cases: {
810
+ '@xychartKeywords': 'keyword',
811
+ '@default': 'variable',
812
+ },
813
+ },
814
+ ],
815
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
816
+ ],
817
+ block: [
818
+ configDirectiveHandler,
819
+ [/(columns)(\s+)(\d+)/, ['keyword', '', 'number']],
820
+ [/(space)(:\d+)?/, ['keyword', 'number']],
821
+ [/(style|classDef)(\s+)(\w+)(.*)/, ['keyword', '', 'type', 'string']],
822
+ [
823
+ /(class)(\s+)(\w+)(\s+)(\w+)/,
824
+ ['keyword', '', 'variable', '', 'type'],
825
+ ],
826
+ [
827
+ /(\w+)(\s*)(\[)(".*?")(\])/,
828
+ ['variable', '', 'delimiter.bracket', 'string', 'delimiter.bracket'],
829
+ ],
830
+ [
831
+ /(\w+)(\s*)(\(\()(".*?")(\)\))/,
832
+ ['variable', '', 'delimiter.bracket', 'string', 'delimiter.bracket'],
833
+ ],
834
+ [
835
+ /(\w+)(\s*)(\(\[)(".*?")(\]\))/,
836
+ ['variable', '', 'delimiter.bracket', 'string', 'delimiter.bracket'],
837
+ ],
838
+ [
839
+ /(\w+)(\s*)(\[\[)(".*?")(\]\])/,
840
+ ['variable', '', 'delimiter.bracket', 'string', 'delimiter.bracket'],
841
+ ],
842
+ [/--+>|<--+|--+/, 'transition'],
843
+ [/".*?"/, 'string'],
844
+ [/:\d+/, 'number'],
845
+ [
846
+ /[a-zA-Z][\w$]*/,
847
+ {
848
+ cases: {
849
+ '@blockBlockKeywords': 'typeKeyword',
850
+ '@blockKeywords': 'keyword',
851
+ '@default': 'variable',
852
+ },
853
+ },
854
+ ],
855
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
856
+ ],
857
+ packet: [
858
+ configDirectiveHandler,
859
+ [
860
+ /(\d+)(-\d+)?(:)(\s*)(".*?")/,
861
+ ['number', 'number', 'delimiter.bracket', '', 'string'],
862
+ ],
863
+ [
864
+ /(\+\d+)(:)(\s*)(".*?")/,
865
+ ['number', 'delimiter.bracket', '', 'string'],
866
+ ],
867
+ [/".*?"/, 'string'],
868
+ [/\d+/, 'number'],
869
+ [/:/, 'delimiter.bracket'],
870
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
871
+ ],
872
+ kanban: [
873
+ configDirectiveHandler,
874
+ [/(@\{)/, { token: 'delimiter.bracket', next: '@kanbanMetadata' }],
875
+ [
876
+ /(\w+)(\s*)(\[)([^\]]+)(\])/,
877
+ ['variable', '', 'delimiter.bracket', 'string', 'delimiter.bracket'],
878
+ ],
879
+ [/\[.*?\]/, 'string'],
880
+ [
881
+ /[a-zA-Z][\w$]*/,
882
+ {
883
+ cases: {
884
+ '@kanbanKeywords': 'keyword',
885
+ '@default': 'variable',
886
+ },
887
+ },
888
+ ],
889
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
890
+ ],
891
+ kanbanMetadata: [
892
+ [/\}/, { token: 'delimiter.bracket', next: '@pop' }],
893
+ [/(assigned|ticket|priority)(:)/, ['keyword', 'delimiter.bracket']],
894
+ [/'[^']*'|"[^"]*"/, 'string'],
895
+ [/,/, 'delimiter.bracket'],
896
+ [/[^,}'":]+/, 'string'],
897
+ ],
898
+ architecture: [
899
+ configDirectiveHandler,
900
+ [/(group|service|junction)(\s+)(\w+)/, ['keyword', '', 'variable']],
901
+ [
902
+ /(\()(\w+)(:\w+)?(\))/,
903
+ [
904
+ 'delimiter.bracket',
905
+ 'annotation',
906
+ 'annotation',
907
+ 'delimiter.bracket',
908
+ ],
909
+ ],
910
+ [
911
+ /(\[)([^\]]+)(\])/,
912
+ ['delimiter.bracket', 'string', 'delimiter.bracket'],
913
+ ],
914
+ [/(in)(\s+)(\w+)/, ['keyword', '', 'variable']],
915
+ [/:{[TBLR]}/, 'annotation'],
916
+ [/:[TBLR]/, 'annotation'],
917
+ [/<?(--+)>?/, 'transition'],
918
+ [/\{group\}/, 'annotation'],
919
+ [
920
+ /[a-zA-Z][\w$]*/,
921
+ {
922
+ cases: {
923
+ '@architectureKeywords': 'keyword',
924
+ '@default': 'variable',
925
+ },
926
+ },
927
+ ],
928
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
929
+ ],
930
+ radar: [
931
+ configDirectiveHandler,
932
+ [/(title)(.*)/, ['keyword', 'string']],
933
+ [/(axis)(\s+)(.*)/, ['keyword', '', 'variable']],
934
+ [
935
+ /(curve)(\s+)(\w+)(\s*)(\[)?"?([^\]"{}]+)"?(\])?/,
936
+ [
937
+ 'keyword',
938
+ '',
939
+ 'variable',
940
+ '',
941
+ 'delimiter.bracket',
942
+ 'string',
943
+ 'delimiter.bracket',
944
+ ],
945
+ ],
946
+ [
947
+ /(curve)(\s+)(\w+)(\s*)(\{)([^}]+)(\})/,
948
+ [
949
+ 'keyword',
950
+ '',
951
+ 'variable',
952
+ '',
953
+ 'delimiter.bracket',
954
+ 'number',
955
+ 'delimiter.bracket',
956
+ ],
957
+ ],
958
+ [/(showLegend)(\s+)(true|false)/, ['keyword', '', 'keyword']],
959
+ [/(max|min|ticks)(\s+)(\d+)/, ['keyword', '', 'number']],
960
+ [/(graticule)(\s+)(circle|polygon)/, ['keyword', '', 'keyword']],
961
+ [/\{[^}]+\}/, 'number'],
962
+ [/\[[^\]]+\]/, 'string'],
963
+ [/"[^"]*"/, 'string'],
964
+ [/[\d.]+/, 'number'],
965
+ [
966
+ /[a-zA-Z][\w$]*/,
967
+ {
968
+ cases: {
969
+ '@radarKeywords': 'keyword',
970
+ '@default': 'variable',
971
+ },
972
+ },
973
+ ],
974
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
975
+ ],
976
+ treemap: [
977
+ configDirectiveHandler,
978
+ [/(classDef)(\s+)(\w+)(.*)/, ['keyword', '', 'type', 'string']],
979
+ [/(:::)(\w+)/, ['transition', 'type']],
980
+ [
981
+ /"([^"]+)"(\s*)(:)(\s*)(\d+)/,
982
+ ['string', '', 'delimiter.bracket', '', 'number'],
983
+ ],
984
+ [/"[^"]*"/, 'string'],
985
+ [/:\s*\d+/, 'number'],
986
+ [/\d+/, 'number'],
987
+ [/%%[^$]([^%]*(?!%%$)%?)*$/, 'comment'],
988
+ ],
989
+ } }));
990
+ monacoEditor.editor.defineTheme('mermaid-dark', {
991
+ base: 'vs-dark',
992
+ inherit: true,
993
+ colors: {},
994
+ rules: [
995
+ { token: 'typeKeyword', foreground: '9650c8', fontStyle: 'bold' },
996
+ { token: 'transition', foreground: '008800', fontStyle: 'bold' },
997
+ { token: 'identifier', foreground: '9cdcfe' },
998
+ ],
999
+ });
1000
+ monacoEditor.editor.defineTheme('mermaid', {
1001
+ base: 'vs',
1002
+ inherit: true,
1003
+ colors: {},
1004
+ rules: [
1005
+ { token: 'typeKeyword', foreground: '9650c8', fontStyle: 'bold' },
1006
+ { token: 'keyword', foreground: '649696' },
1007
+ { token: 'custom-error', foreground: 'ff0000', fontStyle: 'bold' },
1008
+ { token: 'string', foreground: 'AA8500' },
1009
+ { token: 'transition', foreground: '008800', fontStyle: 'bold' },
1010
+ { token: 'delimiter.bracket', foreground: '000000', fontStyle: 'bold' },
1011
+ { token: 'annotation', foreground: '4b4b96' },
1012
+ { token: 'number', foreground: '4b4b96' },
1013
+ { token: 'comment', foreground: '888c89' },
1014
+ { token: 'variable', foreground: 'A22889' },
1015
+ { token: 'type', foreground: '2BDEA8' },
1016
+ { token: 'identifier', foreground: '9cdcfe' },
1017
+ ],
1018
+ });
1019
+ // Register a completion item provider for the mermaid language
1020
+ monacoEditor.languages.registerCompletionItemProvider('mermaid', {
1021
+ provideCompletionItems: (model, position) => {
1022
+ const word = model.getWordUntilPosition(position);
1023
+ const range = {
1024
+ startLineNumber: position.lineNumber,
1025
+ endLineNumber: position.lineNumber,
1026
+ startColumn: word.startColumn,
1027
+ endColumn: word.endColumn,
1028
+ };
1029
+ const suggestions = [
1030
+ {
1031
+ label: 'loop',
1032
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1033
+ insertText: ['loop ${1:Loop text}', '\t$0', 'end'].join('\n'),
1034
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1035
+ documentation: 'Sequence Diagram Loops',
1036
+ },
1037
+ {
1038
+ label: 'alt',
1039
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1040
+ insertText: [
1041
+ 'alt ${1:Describing text}',
1042
+ '\t$0',
1043
+ 'else',
1044
+ '\t',
1045
+ 'end',
1046
+ ].join('\n'),
1047
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1048
+ documentation: 'Alternative Path',
1049
+ },
1050
+ {
1051
+ label: 'opt',
1052
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1053
+ insertText: ['opt ${1:Describing text}', '\t$0', 'end'].join('\n'),
1054
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1055
+ documentation: 'Optional Path',
1056
+ },
1057
+ {
1058
+ label: 'par',
1059
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1060
+ insertText: [
1061
+ 'par ${1:[Action 1]}',
1062
+ '\t$0',
1063
+ 'and ${2:[Action 2]}',
1064
+ '\t',
1065
+ 'and ${3:[Action 3]}',
1066
+ '\t',
1067
+ 'end',
1068
+ ].join('\n'),
1069
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1070
+ documentation: 'Parallel Actions',
1071
+ },
1072
+ {
1073
+ label: 'rect',
1074
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1075
+ insertText: ['rect ${1:rgb(0, 255, 0)}', '\t$0', 'end'].join('\n'),
1076
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1077
+ documentation: 'Background Color',
1078
+ },
1079
+ {
1080
+ label: 'subgraph',
1081
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1082
+ insertText: ['subgraph ${1:title}', '\t$0', 'end'].join('\n'),
1083
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1084
+ documentation: 'Subgraph',
1085
+ },
1086
+ {
1087
+ label: 'class',
1088
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1089
+ insertText: ['class ${1:className} {', '\t$0', '}'].join('\n'),
1090
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1091
+ documentation: 'Class',
1092
+ },
1093
+ {
1094
+ label: 'state',
1095
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1096
+ insertText: ['state ${1:stateName} {', '\t$0', '}'].join('\n'),
1097
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1098
+ documentation: 'State',
1099
+ },
1100
+ {
1101
+ label: 'note',
1102
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1103
+ insertText: ['note ${1:right of State1}', '\t$0', 'end note'].join('\n'),
1104
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1105
+ documentation: 'State',
1106
+ },
1107
+ {
1108
+ label: 'section',
1109
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1110
+ insertText: ['section ${1:Go to work}', '\t$0'].join('\n'),
1111
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1112
+ documentation: 'User-journey Section',
1113
+ },
1114
+ {
1115
+ label: 'element',
1116
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1117
+ insertText: ['element ${1:test_entity} {', '\t$0', '}'].join('\n'),
1118
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1119
+ documentation: 'Requirement Diagram Element',
1120
+ },
1121
+ {
1122
+ label: 'options',
1123
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1124
+ insertText: ['options', '{', ' $0', '}', 'end'].join('\n'),
1125
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1126
+ documentation: 'Git Graph Options',
1127
+ },
1128
+ {
1129
+ label: 'mindmap',
1130
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1131
+ insertText: [
1132
+ 'mindmap',
1133
+ ' root((${1:Central Topic}))',
1134
+ ' ${2:Topic 1}',
1135
+ ' ${3:Subtopic 1}',
1136
+ ' ${4:Subtopic 2}',
1137
+ ' ${5:Topic 2}',
1138
+ ' $0',
1139
+ ].join('\n'),
1140
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1141
+ documentation: 'Mindmap Diagram',
1142
+ },
1143
+ {
1144
+ label: 'timeline',
1145
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1146
+ insertText: [
1147
+ 'timeline',
1148
+ ' title ${1:History of Events}',
1149
+ ' ${2:2023} : ${3:Event 1}',
1150
+ ' : ${4:Event 2}',
1151
+ ' ${5:2024} : ${6:Event 3}',
1152
+ ' $0',
1153
+ ].join('\n'),
1154
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1155
+ documentation: 'Timeline Diagram',
1156
+ },
1157
+ {
1158
+ label: 'sankey',
1159
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1160
+ insertText: [
1161
+ 'sankey-beta',
1162
+ '',
1163
+ '${1:Source1},${2:Target1},${3:100}',
1164
+ '${4:Source2},${5:Target2},${6:50}',
1165
+ '$0',
1166
+ ].join('\n'),
1167
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1168
+ documentation: 'Sankey Diagram',
1169
+ },
1170
+ {
1171
+ label: 'quadrantChart',
1172
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1173
+ insertText: [
1174
+ 'quadrantChart',
1175
+ ' title ${1:Reach and engagement}',
1176
+ ' x-axis ${2:Low Reach} --> ${3:High Reach}',
1177
+ ' y-axis ${4:Low Engagement} --> ${5:High Engagement}',
1178
+ ' quadrant-1 ${6:We should expand}',
1179
+ ' quadrant-2 ${7:Need to promote}',
1180
+ ' quadrant-3 ${8:Re-evaluate}',
1181
+ ' quadrant-4 ${9:May be improved}',
1182
+ ' ${10:Campaign A}: [${11:0.3}, ${12:0.6}]',
1183
+ ' ${13:Campaign B}: [${14:0.45}, ${15:0.23}]',
1184
+ ' $0',
1185
+ ].join('\n'),
1186
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1187
+ documentation: 'Quadrant Chart',
1188
+ },
1189
+ {
1190
+ label: 'xychart',
1191
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1192
+ insertText: [
1193
+ 'xychart-beta',
1194
+ ' title "${1:Sales Revenue}"',
1195
+ ' x-axis [${2:jan, feb, mar, apr, may}]',
1196
+ ' y-axis "${3:Revenue (in $)}" ${4:0} --> ${5:10000}',
1197
+ ' bar [${6:5000, 6000, 7500, 8200, 9500}]',
1198
+ ' line [${7:5000, 6000, 7500, 8200, 9500}]',
1199
+ ' $0',
1200
+ ].join('\n'),
1201
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1202
+ documentation: 'XY Chart (Bar/Line)',
1203
+ },
1204
+ {
1205
+ label: 'block',
1206
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1207
+ insertText: [
1208
+ 'block-beta',
1209
+ ' columns ${1:3}',
1210
+ ' ${2:a}["${3:Block A}"]:${4:2}',
1211
+ ' ${5:b}["${6:Block B}"]',
1212
+ ' ${7:c}["${8:Block C}"]',
1213
+ ' $0',
1214
+ ].join('\n'),
1215
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1216
+ documentation: 'Block Diagram',
1217
+ },
1218
+ {
1219
+ label: 'packet',
1220
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1221
+ insertText: [
1222
+ 'packet-beta',
1223
+ ' 0-15: "${1:Source Port}"',
1224
+ ' 16-31: "${2:Destination Port}"',
1225
+ ' 32-63: "${3:Sequence Number}"',
1226
+ ' $0',
1227
+ ].join('\n'),
1228
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1229
+ documentation: 'Packet Diagram',
1230
+ },
1231
+ {
1232
+ label: 'kanban',
1233
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1234
+ insertText: [
1235
+ 'kanban',
1236
+ ' ${1:todo}[${2:Todo}]',
1237
+ ' ${3:task1}[${4:Task 1}]',
1238
+ ' ${5:task2}[${6:Task 2}]',
1239
+ ' ${7:inProgress}[${8:In Progress}]',
1240
+ ' ${9:task3}[${10:Task 3}]',
1241
+ ' ${11:done}[${12:Done}]',
1242
+ ' $0',
1243
+ ].join('\n'),
1244
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1245
+ documentation: 'Kanban Board',
1246
+ },
1247
+ {
1248
+ label: 'architecture',
1249
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1250
+ insertText: [
1251
+ 'architecture-beta',
1252
+ ' group ${1:api}(cloud)[${2:API}]',
1253
+ '',
1254
+ ' service ${3:db}(database)[${4:Database}] in ${1:api}',
1255
+ ' service ${5:server}(server)[${6:Server}] in ${1:api}',
1256
+ '',
1257
+ ' ${3:db}:R -- L:${5:server}',
1258
+ ' $0',
1259
+ ].join('\n'),
1260
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1261
+ documentation: 'Architecture Diagram',
1262
+ },
1263
+ {
1264
+ label: 'radar',
1265
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1266
+ insertText: [
1267
+ 'radar-beta',
1268
+ ' title "${1:Performance Metrics}"',
1269
+ ' axis ${2:Speed}, ${3:Quality}, ${4:Cost}, ${5:Reliability}, ${6:Flexibility}',
1270
+ ' curve ${7:Product A}{${8:80}, ${9:90}, ${10:70}, ${11:85}, ${12:75}}',
1271
+ ' curve ${13:Product B}{${14:70}, ${15:80}, ${16:90}, ${17:75}, ${18:85}}',
1272
+ ' $0',
1273
+ ].join('\n'),
1274
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1275
+ documentation: 'Radar Chart (Spider/Polar Chart)',
1276
+ },
1277
+ {
1278
+ label: 'treemap',
1279
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1280
+ insertText: [
1281
+ 'treemap-beta',
1282
+ ' "${1:Root}"',
1283
+ ' "${2:Category A}"',
1284
+ ' "${3:Item 1}": ${4:100}',
1285
+ ' "${5:Item 2}": ${6:80}',
1286
+ ' "${7:Category B}"',
1287
+ ' "${8:Item 3}": ${9:120}',
1288
+ ' "${10:Item 4}": ${11:60}',
1289
+ ' $0',
1290
+ ].join('\n'),
1291
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1292
+ documentation: 'Treemap Diagram',
1293
+ },
1294
+ {
1295
+ label: 'frontmatter',
1296
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1297
+ insertText: [
1298
+ '---',
1299
+ 'config:',
1300
+ ' theme: ${1|default,dark,forest,neutral,base|}',
1301
+ ' look: ${2|classic,handDrawn|}',
1302
+ '---',
1303
+ '$0',
1304
+ ].join('\n'),
1305
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1306
+ documentation: 'YAML Frontmatter Configuration',
1307
+ },
1308
+ ...keywords.c4Diagram.blockKeywords.map((containerType) => ({
1309
+ label: containerType,
1310
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1311
+ insertText: [
1312
+ containerType + ' (${1:boundary_id}, "New Boundary") {',
1313
+ ' $0',
1314
+ '}',
1315
+ ].join('\n'),
1316
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1317
+ documentation: 'C4 Diagram ' + containerType + ' Boundary',
1318
+ })),
1319
+ ...requirementDiagrams.map((requirementDiagramType) => ({
1320
+ label: requirementDiagramType,
1321
+ kind: monacoEditor.languages.CompletionItemKind.Snippet,
1322
+ insertText: [
1323
+ requirementDiagramType + ' ${1:test_req} {',
1324
+ '\tid: 1',
1325
+ '\ttext: the test text.',
1326
+ '\trisk: high',
1327
+ '\tverifyMethod: test',
1328
+ '}',
1329
+ ].join('\n'),
1330
+ insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
1331
+ documentation: requirementDiagramType
1332
+ .split(/(?=[A-Z])/)
1333
+ .map((part) => part[0].toUpperCase() + part.slice(1))
1334
+ .join(' '),
1335
+ })),
1336
+ ...[
1337
+ ...new Set(Object.values(keywords)
1338
+ .map((diagramKeywords) => Object.entries(diagramKeywords)
1339
+ .filter((keywordType) => keywordType[0] !== 'annotations')
1340
+ .map((entry) => entry[1]))
1341
+ .flat(2)),
1342
+ ].map((keyword) => ({
1343
+ label: keyword,
1344
+ kind: monacoEditor.languages.CompletionItemKind.Keyword,
1345
+ insertText: keyword,
1346
+ })),
1347
+ ];
1348
+ return {
1349
+ suggestions: suggestions.map((suggestion) => (Object.assign(Object.assign({}, suggestion), { range }))),
1350
+ };
1351
+ },
1352
+ });
1353
+ monacoEditor.languages.setLanguageConfiguration('mermaid', {
1354
+ autoClosingPairs: [
1355
+ {
1356
+ open: '(',
1357
+ close: ')',
1358
+ },
1359
+ {
1360
+ open: '{',
1361
+ close: '}',
1362
+ },
1363
+ {
1364
+ open: '[',
1365
+ close: ']',
1366
+ },
1367
+ ],
1368
+ brackets: [
1369
+ ['(', ')'],
1370
+ ['{', '}'],
1371
+ ['[', ']'],
1372
+ ],
1373
+ comments: {
1374
+ lineComment: '%%',
1375
+ },
1376
+ });
1377
+ };