Have correct enter behavior in for Editable and Codable

ts/editor/changeTimer.ts

@@ -41,6 +41,6 @@ export function saveNow(keepFocus: boolean): void {
         saveField(currentField, "key");
     } else {
         // triggers onBlur, which saves
-        currentField.blurEditable();
+        currentField.blur();
     }
 }

ts/editor/codable.ts

@@ -55,6 +55,13 @@ export class Codable extends HTMLTextAreaElement {
         this.codeMirror = CodeMirror.fromTextArea(this, codeMirrorOptions);
     }
 
+    teardown(): string {
+        this.active = false;
+        this.codeMirror.toTextArea();
+        this.codeMirror = undefined;
+        return parseHTML(this.value);
+    }
+
     focus(): void {
         this.codeMirror.focus();
     }
@@ -63,10 +70,7 @@ export class Codable extends HTMLTextAreaElement {
         this.codeMirror.setCursor(this.codeMirror.lineCount(), 0);
     }
 
-    teardown(): string {
+    enterBehavior(): void {
-        this.active = false;
+        /* default */
-        this.codeMirror.toTextArea();
-        this.codeMirror = undefined;
-        return parseHTML(this.value);
     }
 }

ts/editor/editable.ts

@@ -1,7 +1,7 @@
 // Copyright: Ankitects Pty Ltd and contributors
 // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
-import { nodeIsInline, caretToEnd } from "./helpers";
+import { nodeIsInline, caretToEnd, getBlockElement } from "./helpers";
 
 function containsInlineContent(field: Element): boolean {
     if (field.childNodes.length === 0) {
@@ -40,4 +40,14 @@ export class Editable extends HTMLElement {
     caretToEnd() {
         caretToEnd(this);
     }
+
+    enterBehavior(event: KeyboardEvent): void {
+        if (
+            !getBlockElement(this.getRootNode() as Document | ShadowRoot) !==
+            event.shiftKey
+        ) {
+            event.preventDefault();
+            document.execCommand("insertLineBreak");
+        }
+    }
 }

ts/editor/editingArea.ts

@@ -130,14 +130,6 @@ export class EditingArea extends HTMLDivElement {
         this.activeInput.blur();
     }
 
-    /* legacy */
-    focusEditable(): void {
-        focus();
-    }
-    blurEditable(): void {
-        blur();
-    }
-
     caretToEnd(): void {
         this.activeInput.caretToEnd();
     }
@@ -146,6 +138,10 @@ export class EditingArea extends HTMLDivElement {
         return document.activeElement === this;
     }
 
+    enterBehavior(event: KeyboardEvent): void {
+        this.activeInput.enterBehavior(event);
+    }
+
     toggleHtmlEdit(): void {
         const hadFocus = this.hasFocus();
 
@@ -163,4 +159,17 @@ export class EditingArea extends HTMLDivElement {
             this.caretToEnd();
         }
     }
+
+    /**
+     * @deprecated Use focus instead
+     */
+    focusEditable(): void {
+        focus();
+    }
+    /**
+     * @deprecated Use blur instead
+     */
+    blurEditable(): void {
+        blur();
+    }
 }

ts/editor/focusHandlers.ts

@@ -9,7 +9,7 @@ import { bridgeCommand } from "./lib";
 
 export function onFocus(evt: FocusEvent): void {
     const currentField = evt.currentTarget as EditingArea;
-    currentField.focusEditable();
+    currentField.focus();
     bridgeCommand(`focus:${currentField.ord}`);
     enableButtons();
 }

ts/editor/index.ts

@@ -50,7 +50,7 @@ export function focusField(n: number): void {
     const field = getEditorField(n);
 
     if (field) {
-        field.editingArea.focusEditable();
+        field.editingArea.focus();
         field.editingArea.caretToEnd();
         updateActiveButtons(new Event("manualfocus"));
     }
@@ -61,7 +61,7 @@ export function focusIfField(x: number, y: number): boolean {
     for (let i = 0; i < elements.length; i++) {
         const elem = elements[i] as EditingArea;
         if (elem instanceof EditingArea) {
-            elem.focusEditable();
+            elem.focus();
             return true;
         }
     }

ts/editor/inputHandlers.ts

@@ -7,7 +7,7 @@
 
 import { updateActiveButtons } from "./toolbar";
 import { EditingArea } from "./editingArea";
-import { nodeIsElement, getBlockElement } from "./helpers";
+import { nodeIsElement } from "./helpers";
 import { triggerChangeTimer } from "./changeTimer";
 import { registerShortcut } from "lib/shortcuts";
 
@@ -22,17 +22,12 @@ export function onKey(evt: KeyboardEvent): void {
 
     // esc clears focus, allowing dialog to close
     if (evt.code === "Escape") {
-        currentField.blurEditable();
+        return currentField.blur();
-        return;
     }
 
     // prefer <br> instead of <div></div>
-    if (
+    if (evt.code === "Enter") {
-        evt.code === "Enter" &&
+        return currentField.enterBehavior(evt);
-        !getBlockElement(currentField.shadowRoot!) !== evt.shiftKey
-    ) {
-        evt.preventDefault();
-        document.execCommand("insertLineBreak");
     }
 
     // // fix Ctrl+right/left handling in RTL fields