feat: IR editor use custom theme

ErnestThePoet · Mar 24, 2024 · 59974cc · 59974cc
1 parent 8ad4f7d
commit 59974cc
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 2 deletions.
diff --git a/src/modules/ir/registerIr.ts b/src/modules/ir/registerIr.ts
@@ -13,6 +13,22 @@ export function registerIr(monaco: Monaco) {
         id: irLanguageId
     });
 
+    monaco.editor.defineTheme("ir-theme", {
+        base: "vs",
+        inherit: true,
+        rules: [
+            {
+                token: "function",
+                foreground: "#74531f"
+            },
+            {
+                token: "number.size",
+                foreground: "#0097ff"
+            }
+        ],
+        colors: {}
+    });
+
     const irKeywords = [
         "FUNCTION",
         "DEC",
@@ -32,18 +48,26 @@ export function registerIr(monaco: Monaco) {
         keywords: irKeywords,
         identifier: /[a-zA-Z_]\w*/,
         whitespace: /[ \t\r\n]+/,
-        defaultToken: "invalid",
+        defaultToken: "source",
         tokenizer: {
             root: [
                 [/#-?\d+/, "number"],
-                [/\d+/, "number"],
+                [/\d+/, "number.size"],
                 [
                     /(:=)|(\+)|(-)|(\*)|(\/)|(==)|(!=)|(<=)|(<)|(>=)|(>)|(&)/,
                     "operators"
                 ],
                 [/:/, "delimiter"],
                 [/;.*/, "comment"],
                 [/@whitespace/, "white"],
+                [
+                    /(FUNCTION)(@whitespace)(@identifier)/,
+                    ["keyword", "white", "function"]
+                ],
+                [
+                    /(CALL)(@whitespace)(@identifier)/,
+                    ["keyword", "white", "function"]
+                ],
                 [
                     /@identifier/,
                     {

diff --git a/src/pages/Home/components/IrEditor/IrEditor.tsx b/src/pages/Home/components/IrEditor/IrEditor.tsx
@@ -192,6 +192,7 @@ const IrEditor: React.FC<IrEditorProps> = (props: IrEditorProps) => {
         <div className={styles.divMonacoEditorWrapper}>
             <Editor
                 language="ir"
+                theme="ir-theme"
                 beforeMount={monaco => {
                     monacoRef.current = monaco;
                     registerIr(monaco);