fix(editor): partial improvement of config syntax highlighting (#612)

Co-authored-by: th33xitus <[email protected]>

package.json

@@ -22,17 +22,16 @@
         "changelog": "git cliff v0.0.4..$(git describe --tags $(git rev-list --tags --max-count=1)) --output CHANGELOG.md"
     },
     "dependencies": {
-        "@codemirror/basic-setup": "^0.19.0",
-        "@codemirror/highlight": "^0.19.6",
+        "@codemirror/basic-setup": "^0.19.1",
+        "@codemirror/highlight": "^0.19.7",
         "@codemirror/lang-css": "^0.19.3",
-        "@codemirror/lang-javascript": "^0.19.3",
         "@codemirror/lang-json": "^0.19.1",
         "@codemirror/language": "^0.19.7",
         "@codemirror/legacy-modes": "^0.19.0",
-        "@codemirror/search": "^0.19.4",
         "@codemirror/state": "^0.19.6",
-        "@codemirror/stream-parser": "^0.19.2",
-        "@codemirror/view": "^0.19.28",
+        "@codemirror/search": "^0.19.6",
+        "@codemirror/stream-parser": "^0.19.5",
+        "@codemirror/view": "^0.19.42",
         "@sindarius/gcodeviewer": "^3.1.0",
         "@types/node": "^16.11.22",
         "@types/overlayscrollbars": "^1.12.1",

src/components/inputs/Codemirror.vue

@@ -1,8 +1,3 @@
-<style>
-.vue-codemirror .cm-editor {
-}
-</style>
-
 <template>
     <div class="vue-codemirror">
         <div ref="codemirror" v-observe-visibility="visibilityChanged"></div>

src/plugins/StreamParserGcode.ts

@@ -8,41 +8,51 @@ export const gcode = {
 
         /* Klipper macro attributes */
         if (stream.pos > zeroPos && state.klipperMacro) {
-            if (stream.match(/^\s*[A-Z_]+/)) return 'propertyName'
-            else if (stream.match(/^\s*[A-Za-z0-9_]+/)) return 'number'
-            else if (stream.match(/^{.*}/)) return 'variable'
+            stream.eatSpace()
+            if (stream.match(/^(".+"|true|false)/i)) {
+                return 'string'
+            } else if (stream.match(/^\d+/)) return 'number'
+            else if (stream.match(/^[A-Za-z\d_]+/)) return 'propertyName'
+            else if (zeroPos === 0 && stream.match(/^{[^%]+}/)) return 'variable'
         }
 
         /* comments */
-        if ([';', '#'].includes(ch ?? '')) {
+        if ([';'].includes(ch ?? '')) {
             stream.skipToEnd()
             return 'comment'
         }
 
+        const isZero = stream.pos == zeroPos
+
         /* Mxxx Gxxx commands */
-        if (stream.pos == zeroPos && stream.match(/[GMgm][\d]+/)) {
+        if (isZero && stream.match(/_?[GMgm][\d.]+/)) {
             return 'namespace'
         }
 
+        if (stream.string.substr(zeroPos).toLowerCase().startsWith('m117')) {
+            stream.skipToEnd()
+            return 'string'
+        }
+
         /* G0/1 movements */
-        if (stream.pos > zeroPos && stream.match(/[XYZIJxyzij]-?([\d]*\.[\d]+|[\d]+)?/)) {
+        if (stream.pos > zeroPos && stream.match(/[EPXYZIJ]-?([\d]*\.[\d]+|[\d]+)?/i)) {
             return 'className'
         }
 
         /* G0/1 speeds */
-        if (stream.pos > zeroPos && stream.match(/[Ff]-?([\d]*\.[\d]+|[\d]+)/)) {
+        if (stream.pos > zeroPos && stream.match(/[Ff]-?([\d]*\.[\d]+|[\d]+)?/)) {
             return 'string'
         }
 
         /* G0/1 extrusions */
-        if (stream.pos > zeroPos && stream.match(/[TtSsEe]-?([\d]*\.[\d]+|[\d]+)/)) {
+        if (stream.pos > zeroPos && stream.match(/[TtSs]-?([\d]*\.[\d]+|[\d]+)?/)) {
             return 'atom'
         }
 
-        if (stream.pos > zeroPos && stream.match(/^{.*}/)) return 'propertyName'
+        if (zeroPos === 0 && stream.pos > zeroPos && stream.match(/^{[^%]+}/)) return 'propertyName'
 
         /* Klipper macro names */
-        if (stream.pos == zeroPos && stream.match(/^[A-Z_]+/)) {
+        if (isZero && stream.match(/^\s*[A-Z_\d]+/)) {
             state.klipperMacro = true
             return 'name'
         }