[BUG] fix (tab) indentation within CodeMirror

static/js/cm-decorations.ts

@@ -1,6 +1,6 @@
 import { Decoration, DecorationSet, EditorView, GutterMarker, MatchDecorator, ViewPlugin, ViewUpdate, gutter, } from '@codemirror/view'
 import { RangeSet, StateEffect, StateField } from '@codemirror/state'
-
+import { IndentContext } from '@codemirror/language'
 
 export const addErrorLine = StateEffect.define<{ row: number }>();
 export const addErrorWord = StateEffect.define<{ row: number, col: number }>();
@@ -247,4 +247,20 @@ export const placeholders = ViewPlugin.fromClass(class {
     provide: plugin => EditorView.atomicRanges.of(view => {
       return view.plugin(plugin)?.placeholders || Decoration.none
     })
-})
+})
+
+export function basicIndent(context: IndentContext, pos: number) {
+    const nextIndentationSize = context.lineIndent(pos, -1);
+    let prevIndentationSize;
+    try {
+        prevIndentationSize = context.lineIndent(pos + 1, -1);
+    } catch (error) {
+        prevIndentationSize = 0;
+    }
+    const indentBy = Math.max(
+        prevIndentationSize,
+        nextIndentationSize
+    );
+    return indentBy;
+
+}

static/js/cm-editor.ts

@@ -3,9 +3,9 @@ import { EditorView, ViewUpdate, drawSelection, dropCursor, highlightActiveLine,
         highlightActiveLineGutter, highlightSpecialChars, keymap, lineNumbers } from '@codemirror/view'
 import { EditorState, Compartment, StateEffect, Prec } from '@codemirror/state'
 import { EventEmitter } from "./event-emitter";
-import { deleteTrailingWhitespace, defaultKeymap, historyKeymap } from '@codemirror/commands'
+import { deleteTrailingWhitespace, defaultKeymap, historyKeymap, indentWithTab } from '@codemirror/commands'
 import { history } from "@codemirror/commands"
-import { indentOnInput, defaultHighlightStyle, syntaxHighlighting ,LanguageSupport } from "@codemirror/language"
+import { indentOnInput, defaultHighlightStyle, syntaxHighlighting ,LanguageSupport, indentUnit, indentService } from "@codemirror/language"
 import { highlightSelectionMatches, searchKeymap } from "@codemirror/search";
 import { 
     errorLineField, debugLineField, decorationsTheme, addDebugLine, 
@@ -14,7 +14,8 @@ import {
     incorrectLineField,
     removeIncorrectLineEffect,
     addDebugWords,
-    placeholders
+    placeholders,
+    basicIndent
 } from "./cm-decorations";
 import {LRLanguage} from "@codemirror/language"
 import { languagePerLevel } from "./lezer-parsers/language-packages";
@@ -24,6 +25,10 @@ import { error } from "./modal";
 import { ClientMessages } from "./client-messages";
 import { Tag, styleTags, tags as t } from "@lezer/highlight";
 
+
+// CodeMirror requires # of indentation to be in spaces.
+const indentSize = ' '.repeat(4);
+
 export class HedyCodeMirrorEditorCreator implements HedyEditorCreator {
     /**
      * This function should initialize the editor and set up all the required
@@ -114,7 +119,10 @@ export class HedyCodeMirrorEditor implements HedyEditor {
                     ...defaultKeymap,
                     ...searchKeymap, // we need to replace this with our own search widget
                     ...historyKeymap,
+                    indentWithTab,
                 ]),
+                indentUnit.of(indentSize),
+                indentService.of(basicIndent),
                 monokai,
                 this.readMode.of(EditorState.readOnly.of(isReadOnly)),
                 errorLineField,