@franzzemen/brokenstock-shell 0.4.1 → 0.4.3

package/fesm2022/franzzemen-brokenstock-shell.mjs

@@ -1865,6 +1865,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
+/**
+ * Elements that mean "the user is typing", where an unmodified shortcut must not fire.
+ *
+ * Kept as a set of tag names plus a `contenteditable` check rather than a
+ * selector string, so it is greppable and so the reasoning stays attached to it.
+ */
+const TEXT_ENTRY_TAGS = new Set(['INPUT', 'TEXTAREA', 'SELECT']);
 class KeyboardShortcutService {
     #groups;
     #activeGroupId;
@@ -1880,6 +1887,18 @@ class KeyboardShortcutService {
         this.#focusService = inject(TerminalFocusService);
         this.helpVisible = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "helpVisible" }] : /* istanbul ignore next */ []));
+        /**
+         * True while unmodified shortcuts are being suppressed — the user is typing,
+         * or a dialog is open.
+         *
+         * Exposed because a screen binding BARE keys needs to tell the user whether the
+         * next keystroke acts or types, and that indicator must read the service's own
+         * dispatch state. A screen keeping its own boolean will eventually disagree
+         * with the service, and an indicator that lies about whether a keystroke sells
+         * a thousand shares is worse than no indicator at all.
+         */
+        this.suppressed = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "suppressed" }] : /* istanbul ignore next */ []));
         this.activeShortcuts = computed(() => {
             const groupId = this.#activeGroupId();
             if (!groupId)
@@ -1894,11 +1913,44 @@ class KeyboardShortcutService {
             this.#document.addEventListener('keydown', (event) => {
                 this.#handleKeydown(event);
             });
+            // ⚠ THE WRITE IS DEFERRED, AND THAT IS NOT AN OPTIMISATION.
+            //
+            // `element.focus()` dispatches `focusin` SYNCHRONOUSLY. Angular calls
+            // `.focus()` from template-driven code — an autofocused input, the shell's
+            // terminal reclaiming focus — so this listener can run in the middle of a
+            // render, and a signal write there throws NG0600, "writing to signals is
+            // not allowed while Angular renders the template".
+            //
+            // That throw shipped: it aborted the login transition, so the sign-in POST
+            // returned 200 and the app still showed "not logged in", with every
+            // authenticated request that followed answering 401. Nothing in the failure
+            // pointed at the keyboard.
+            //
+            // A microtask runs after the render completes, which is soon enough for an
+            // indicator a human reads and late enough to be outside the reactive
+            // context. The value is compared first so an unchanged focus move writes
+            // nothing at all.
+            const refresh = () => {
+                queueMicrotask(() => {
+                    const next = this.#isSuppressed();
+                    if (next !== this.suppressed())
+                        this.suppressed.set(next);
+                });
+            };
+            this.#document.addEventListener('focusin', refresh, true);
+            this.#document.addEventListener('focusout', refresh, true);
         });
     }
     registerGroup(groupId, shortcuts) {
         this.#groups.set(groupId, shortcuts);
         this.#activeGroupId.set(groupId);
+        // Same hazard as the focus listener above: a screen registers from
+        // `ngOnInit`, which Angular may run inside a render.
+        queueMicrotask(() => {
+            const next = this.#isSuppressed();
+            if (next !== this.suppressed())
+                this.suppressed.set(next);
+        });
     }
     unregisterGroup(groupId) {
         this.#groups.delete(groupId);
@@ -1910,17 +1962,61 @@ class KeyboardShortcutService {
     toggleHelp() {
         this.helpVisible.update(v => !v);
     }
+    /**
+     * Would an unmodified shortcut be ignored right now?
+     *
+     * Two cases: a text-entry element has focus, or a dialog is open. Alt
+     * combinations are exempt — they do not collide with typing, which is why
+     * every binding in the app before this guard existed used one.
+     */
+    #isSuppressed() {
+        const active = this.#document.activeElement;
+        if (active) {
+            if (TEXT_ENTRY_TAGS.has(active.tagName))
+                return true;
+            if (active.isContentEditable)
+                return true;
+        }
+        // Angular Material puts every dialog in this container. A shortcut firing
+        // behind an open dialog acts on a screen the user cannot currently see.
+        return this.#document.querySelector('.cdk-overlay-container .cdk-overlay-pane') !== null;
+    }
+    #matches(shortcut, event) {
+        // The physical key when `code` is given, the produced character otherwise.
+        const hit = shortcut.code ? shortcut.code === event.code : shortcut.key === event.key;
+        if (!hit)
+            return false;
+        if (shortcut.modifier === 'Alt')
+            return event.altKey;
+        if (shortcut.modifier === 'Shift') {
+            return event.shiftKey && !event.altKey && !event.ctrlKey && !event.metaKey;
+        }
+        // Unmodified. `ctrl`/`alt`/`meta` are excluded because the page still
+        // receives a keystroke carrying the digit when the browser handles
+        // `ctrl`+1 as a tab switch — without this, switching tabs would also fire
+        // whatever a bare `1` is bound to.
+        return !event.shiftKey && !event.altKey && !event.ctrlKey && !event.metaKey;
+    }
     #handleKeydown(event) {
         const activeId = this.#activeGroupId();
         if (activeId) {
             const shortcuts = this.#groups.get(activeId);
             if (shortcuts) {
-                const match = shortcuts.find(s => {
-                    if (s.modifier === 'Alt')
-                        return event.altKey && s.key === event.key;
-                    return !event.altKey && !event.ctrlKey && !event.metaKey && s.key === event.key;
-                });
+                const match = shortcuts.find(s => this.#matches(s, event));
                 if (match) {
+                    const alt = match.modifier === 'Alt';
+                    // Alt bindings are exempt from both guards below, so nothing that
+                    // existed before them changes behaviour: Alt does not collide with
+                    // typing, and holding Alt+ArrowDown to walk a list is wanted.
+                    if (!alt) {
+                        // A key held down repeats at roughly thirty a second. On a screen
+                        // where a bare key places an order, that is fifteen orders in half a
+                        // second, and a synchronous action path will run every one of them.
+                        if (event.repeat)
+                            return false;
+                        if (this.#isSuppressed())
+                            return false;
+                    }
                     event.preventDefault();
                     this.#zone.run(() => match.action());
                     return true;