1 files changed, 31 insertions, 0 deletions
diff --git a/editor/editor.ts b/editor/editor.ts
index a036311..d524a52 100644
--- a/editor/editor.ts
+++ b/editor/editor.ts
@@ -24,6 +24,7 @@ export class WuiEditor {
   private elLineNumber: HTMLElement = document.createElement("div");
   private elContent: HTMLElement = document.createElement("div");
   private isKeyControl: boolean = false;
+  private isKeyShift: boolean = false;
 
   constructor(public opts: WuiEditorOptions) {
     this.id = opts.id;
@@ -133,6 +134,7 @@ export class WuiEditor {
       };
       this.elContent.addEventListener("blur", () => {
         this.isKeyControl = false;
+        this.isKeyShift = false;
       });
     }
     this.elContent.classList.add(WUI_EDITOR_CLASS_CONTENT);
@@ -179,6 +181,17 @@ export class WuiEditor {
     document.head.appendChild(style);
   }
 
+  private insert(text: string) {
+    const selection = window.getSelection();
+    if (!selection || !selection.rangeCount) {
+      console.error(`insert: failed to get selection`);
+      return;
+    }
+    selection.deleteFromDocument();
+    selection.getRangeAt(0).insertNode(document.createTextNode(text));
+    selection.collapseToEnd();
+  }
+
   private onKeydownDocument(ed: WuiEditor, ev: KeyboardEvent) {
     switch (ev.key) {
       case "Control":
@@ -199,6 +212,20 @@ export class WuiEditor {
 
         this.addNewLine();
         return false;
+
+      case "Shift":
+        ed.isKeyShift = true;
+        break;
+
+      case "Tab":
+        if (ed.isKeyShift) {
+          // Pressing Shift+Tab should move focus out of editor,
+          // which focus to the previous component on the page or browser.
+          return true;
+        }
+        ev.preventDefault();
+        this.insert("\t");
+        return false;
     }
     return true;
   }
@@ -208,6 +235,10 @@ export class WuiEditor {
       case "Control":
         ed.isKeyControl = false;
         return true;
+
+      case "Shift":
+        ed.isKeyShift = false;
+        break;
     }
     return true;
   }