react-hotkeys-hook 4.1.0-0 → 4.1.0

package/src/useHotkeys.ts

@@ -21,8 +21,6 @@ const stopPropagation = (e: KeyboardEvent): void => {
 
 const useSafeLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect
 
-const pressedDownKeys = new Set<string>()
-
 export default function useHotkeys<T extends HTMLElement>(
   keys: Keys,
   callback: HotkeyCallback,
@@ -30,6 +28,7 @@ export default function useHotkeys<T extends HTMLElement>(
   dependencies?: OptionsOrDependencyArray,
 ) {
   const ref = useRef<RefType<T>>(null)
+  const hasTriggeredRef = useRef(false)
 
   const _options: Options | undefined = !(options instanceof Array) ? (options as Options) : !(dependencies instanceof Array) ? (dependencies as Options) : undefined
   const _deps: DependencyList = options instanceof Array ? options : dependencies instanceof Array ? dependencies : []
@@ -65,7 +64,9 @@ export default function useHotkeys<T extends HTMLElement>(
       parseKeysHookInput(keys, memoisedOptions?.splitKey).forEach((key) => {
         const hotkey = parseHotkey(key, memoisedOptions?.combinationKey)
 
-        if (isHotkeyMatchingKeyboardEvent(e, hotkey, pressedDownKeys) || hotkey.keys?.includes('*')) {
+        if ((isHotkeyMatchingKeyboardEvent(e, hotkey) || hotkey.keys?.includes('*')) && !hasTriggeredRef.current) {
+          hasTriggeredRef.current = true
+
           maybePreventDefault(e, hotkey, memoisedOptions?.preventDefault)
 
           if (!isHotkeyEnabled(e, hotkey, memoisedOptions?.enabled)) {
@@ -74,6 +75,7 @@ export default function useHotkeys<T extends HTMLElement>(
             return
           }
 
+          // Execute the user callback for that hotkey
           cb(e, hotkey)
         }
       })
@@ -85,8 +87,6 @@ export default function useHotkeys<T extends HTMLElement>(
         return
       }
 
-      pressedDownKeys.add(event.key.toLowerCase())
-
       if ((memoisedOptions?.keydown === undefined && memoisedOptions?.keyup !== true) || memoisedOptions?.keydown) {
         listener(event)
       }
@@ -98,12 +98,7 @@ export default function useHotkeys<T extends HTMLElement>(
         return
       }
 
-      if (event.key.toLowerCase() !== 'meta') {
-        pressedDownKeys.delete(event.key.toLowerCase())
-      } else {
-        // On macOS pressing down the meta key prevents triggering the keyup event for any other key https://stackoverflow.com/a/57153300/735226.
-        pressedDownKeys.clear()
-      }
+      hasTriggeredRef.current = false
 
       if (memoisedOptions?.keyup) {
         listener(event)

package/src/validators.ts

@@ -1,5 +1,6 @@
 import { FormTags, Hotkey, Scopes, Trigger } from './types'
 import { isHotkeyPressed } from './isHotkeyPressed'
+import { mapKey } from './parseHotkeys'
 
 export function maybePreventDefault(e: KeyboardEvent, hotkey: Hotkey, preventDefault?: Trigger): void {
   if ((typeof preventDefault === 'function' && preventDefault(e, hotkey)) || preventDefault === true) {
@@ -45,7 +46,7 @@ export function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean
   return activeScopes.some(scope => scopes.includes(scope)) || activeScopes.includes('*')
 }
 
-export const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey, pressedDownKeys: Set<string>): boolean => {
+export const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey): boolean => {
   const { alt, meta, mod, shift, keys } = hotkey
   const { key: pressedKeyUppercase, code } = e
 
@@ -54,7 +55,7 @@ export const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey,
   const metaKey = isHotkeyPressed('meta')
   const ctrlKey = isHotkeyPressed('ctrl')
 
-  const keyCode = code.toLowerCase().replace('key', '')
+  const keyCode = mapKey(code)
   const pressedKey = pressedKeyUppercase.toLowerCase()
 
   if (altKey !== alt && pressedKey !== 'alt') {
@@ -82,7 +83,7 @@ export const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey,
     return true
   } else if (keys) {
     // Check if all keys are present in pressedDownKeys set
-    return keys.every(key => pressedDownKeys.has(key))
+    return isHotkeyPressed(keys)
   }
   else if (!keys) {
     // If the key is not set, we only listen for modifiers, that check went alright, so we return true