@readium/navigator-html-injectables 2.4.2-beta.1 → 2.4.2-beta.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readium/navigator-html-injectables",
-  "version": "2.4.2-beta.1",
+  "version": "2.4.2-beta.3",
   "type": "module",
   "description": "An embeddable solution for connecting frames of HTML publications with a Readium Navigator",
   "author": "readium",

package/src/keyboard/KeyCombinationManager.ts

@@ -19,19 +19,30 @@ export class KeyCombinationManager {
      */
     public match(event: KeyboardEvent, combos: KeyCombo[]): boolean {
         for (const combo of combos) {
-            const keyMatch = event.keyCode === combo.keyCode;
-            const ctrlMatch = combo.ctrl === undefined || event.ctrlKey === combo.ctrl;
-            const shiftMatch = combo.shift === undefined || event.shiftKey === combo.shift;
-            const altMatch = combo.alt === undefined || event.altKey === combo.alt;
-            const metaMatch = combo.meta === undefined || event.metaKey === combo.meta;
-
-            if (keyMatch && ctrlMatch && shiftMatch && altMatch && metaMatch) {
+            if (this.matchesCombo(event, combo)) {
                 return true;
             }
         }
         return false;
     }
 
+    private matchesCombo(event: KeyboardEvent, combo: KeyCombo): boolean {
+        return event.keyCode === combo.keyCode &&
+               this.matchesModifier(event.ctrlKey, combo.ctrl) &&
+               this.matchesModifier(event.shiftKey, combo.shift) &&
+               this.matchesModifier(event.altKey, combo.alt) &&
+               this.matchesModifier(event.metaKey, combo.meta);
+    }
+
+    private matchesModifier(eventModifier: boolean, comboModifier?: boolean): boolean {
+        if (comboModifier === undefined) {
+            // Modifier not specified: must NOT be pressed
+            return !eventModifier;
+        }
+        // Modifier specified: must match exactly
+        return eventModifier === comboModifier;
+    }
+
     /**
      * Creates an event handler that will call the provided handler when any of the key combinations match
      */
@@ -139,7 +150,7 @@ export class KeyCombinationManager {
                 if (this.match(event, [handlerConfig])) {
                     const suppress = handlerConfig.suppressOnInteractiveElement;
                     if (suppress) {
-                        const active = document.activeElement;
+                        const active = (wnd?.document ?? document).activeElement;
                         if (Array.isArray(suppress) ? suppress.some(sel => active?.matches(sel)) : isInteractiveElement(active)) return;
                     }
                     event.preventDefault();

package/types/src/keyboard/KeyCombinationManager.d.ts

@@ -14,6 +14,8 @@ export declare class KeyCombinationManager {
      * Checks if the given keyboard event matches any of the provided key combinations
      */
     match(event: KeyboardEvent, combos: KeyCombo[]): boolean;
+    private matchesCombo;
+    private matchesModifier;
     /**
      * Creates an event handler that will call the provided handler when any of the key combinations match
      */