Allow Shift+Tab to move focus from tag area to last field (#2458)

ts/editor/NoteEditor.svelte

@@ -287,7 +287,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 
     function saveNow(): void {
-        commitTagEdits();
+        $commitTagEdits();
         saveFieldNow();
     }
 

ts/tag-editor/TagInput.svelte

@@ -3,11 +3,14 @@ Copyright: Ankitects Pty Ltd and contributors
 License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
 <script context="module" lang="ts">
-    let current: HTMLInputElement | null = null;
+    import { derived, writable } from "svelte/store";
 
-    export function commitTagEdits(): void {
-        current?.blur();
-    }
+    export const currentTagInput = writable<HTMLInputElement | null>(null);
+
+    export const commitTagEdits = derived<typeof currentTagInput, () => void>(
+        currentTagInput,
+        ($currentTagInput) => () => $currentTagInput?.blur(),
+    );
 </script>
 
 <script lang="ts">
@@ -253,11 +256,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     });
 
     function updateCurrent(input: HTMLInputElement): ActionReturn {
-        current = input;
+        $currentTagInput = input;
         return {
             destroy(): void {
-                if (current === input) {
-                    current = null;
+                if ($currentTagInput === input) {
+                    $currentTagInput = null;
                 }
             },
         };

ts/tag-editor/tag-options-button/TagAddButton.svelte

@@ -9,6 +9,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
     import IconConstrain from "../../components/IconConstrain.svelte";
     import Shortcut from "../../components/Shortcut.svelte";
+    import { currentTagInput } from "../TagInput.svelte";
     import { addTagIcon, tagIcon } from "./icons";
 
     export let keyCombination: string;
@@ -20,10 +21,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 </script>
 
+<!-- toggle tabindex to allow Shift+Tab to move focus to the last field -->
 <div
     class="tag-add-button"
     title="{tr.editingTagsAdd()} ({getPlatformString(keyCombination)})"
-    tabindex={0}
+    tabindex={$currentTagInput ? -1 : 0}
     on:click={appendTag}
     on:focus={appendTag}
 >