1export const initEditor = (monaco) => {
2  monaco.languages.register({ id: 'mermaid' });
3
4  // Register a tokens provider for the language
5  monaco.languages.setMonarchTokensProvider('mermaid', {
6    typeKeywords: [
7      'graph',
8      'stateDiagram',
9      'sequenceDiagram',
10      'classDiagram',
11      'pie',
12      'flowchart',
13      'gantt',
14    ],
15    keywords: ['patricipant', 'as'],
16    arrows: ['---', '===', '-->', '==>'],
17
18    tokenizer: {
19      root: [
20        [/[{}]/, 'delimiter.bracket'],
21        [
22          /[a-z_$][\w$]*/,
23          { cases: { '@typeKeywords': 'keyword', '@keywords': 'keyword' } },
24        ],
25        [/[-=>ox]+/, { cases: { '@arrows': 'transition' } }],
26        [/[\[\{\(}]+.+?[\)\]\}]+/, 'string'],
27        [/\".*\"/, 'string'],
28      ],
29    },
30    whitespace: [
31      [/[ \t\r\n]+/, 'white'],
32      [/\%\%.*$/, 'comment'],
33    ],
34  });
35
36  monaco.editor.defineTheme('myCoolTheme', {
37    base: 'vs',
38    inherit: false,
39    rules: [
40      { token: 'keyword', foreground: '880000', fontStyle: 'bold' },
41      { token: 'custom-error', foreground: 'ff0000', fontStyle: 'bold' },
42      { token: 'string', foreground: 'AA8500' },
43      { token: 'transition', foreground: '008800', fontStyle: 'bold' },
44      { token: 'delimiter.bracket', foreground: '000000', fontStyle: 'bold' },
45    ],
46  });
47
48  // Register a completion item provider for the new language
49  monaco.languages.registerCompletionItemProvider('mermaid', {
50    provideCompletionItems: () => {
51      var suggestions = [
52        {
53          label: 'simpleText',
54          kind: monaco.languages.CompletionItemKind.Text,
55          insertText: 'simpleText',
56        },
57        {
58          label: 'testing',
59          kind: monaco.languages.CompletionItemKind.Keyword,
60          insertText: 'testing(${1:condition})',
61          insertTextRules:
62            monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
63        },
64        {
65          label: 'ifelse',
66          kind: monaco.languages.CompletionItemKind.Snippet,
67          insertText: [
68            'if (${1:condition}) {',
69            '\t$0',
70            '} else {',
71            '\t',
72            '}',
73          ].join('\n'),
74          insertTextRules:
75            monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
76          documentation: 'If-Else Statement',
77        },
78      ];
79      return { suggestions: suggestions };
80    },
81  });
82};
83
84export const getResizeHandler = (editor) => {
85  return (node) => editor && editor.layout();
86};
87