react-hotkeys-hook 3.4.5 → 4.0.0-0

package/README.md

@@ -37,7 +37,7 @@ A React hook for using keyboard shortcuts in components.
 ## Quick Start
 
 ```jsx harmony
-import { useHotkeys } from 'react-use-hotkeys-hook'
+import { useHotkeys } from 'react-hotkeys-hook'
 
 export const ExampleComponent = () => {
   const [count, setCount] = useState(0)

package/dist/BoundHotkeysProxyProvider.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import { Hotkey } from './types';
+declare type BoundHotkeysProxyProviderType = {
+    addHotkey: (hotkey: Hotkey) => void;
+    removeHotkey: (hotkey: Hotkey) => void;
+};
+export declare const useBoundHotkeysProxy: () => BoundHotkeysProxyProviderType | undefined;
+interface Props {
+    children: ReactNode;
+    addHotkey: (hotkey: Hotkey) => void;
+    removeHotkey: (hotkey: Hotkey) => void;
+}
+export default function BoundHotkeysProxyProviderProvider({ addHotkey, removeHotkey, children }: Props): JSX.Element;
+export {};

package/dist/HotkeysProvider.d.ts

@@ -1,16 +1,16 @@
 import { Hotkey } from './types';
 import { ReactNode } from 'react';
 declare type HotkeysContextType = {
-    hotkeys: Hotkey[];
+    hotkeys: ReadonlyArray<Hotkey>;
     activeScopes: string[];
     toggleScope: (scope: string) => void;
     activateScope: (scope: string) => void;
     deactivateScope: (scope: string) => void;
 };
+export declare const useHotkeysContext: () => HotkeysContextType;
 interface Props {
-    initialActiveScopes?: string[];
+    initiallyActiveScopes?: string[];
     children: ReactNode;
 }
-export declare const useHotkeysContext: () => HotkeysContextType;
-export declare const HotkeysProvider: ({ initialActiveScopes, children }: Props) => JSX.Element;
+export declare const HotkeysProvider: ({ initiallyActiveScopes, children }: Props) => JSX.Element;
 export {};

package/dist/index.js

@@ -1,2 +1,2 @@
-import{useCallback as R,useLayoutEffect as N,useRef as S}from"react";var A=["ctrl","shift","alt","meta","mod"];function H(t,o=","){return typeof t=="string"?t.split(o):t}function b(t,o="+"){let e=t.toLocaleLowerCase().split(o).map(a=>a.trim()),i={alt:e.includes("alt"),ctrl:e.includes("ctrl"),shift:e.includes("shift"),meta:e.includes("meta"),mod:e.includes("mod")},c=e.filter(a=>!A.includes(a));return{...i,keys:c}}function E(t,o,e){(typeof e=="function"&&e(t,o)||e===!0)&&t.preventDefault()}function K(t,o,e){return typeof e=="function"?e(t,o):e===!0||e===void 0}function h(t){return g(t,["INPUT","TEXTAREA","SELECT"])}function g({target:t},o){let e=t&&t.tagName;return Boolean(e&&o&&o.includes(e))}function T(t,o){return t.length===0&&o?(console.warn("A hotkey has a set scopes options, although no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>"),!0):o?t.some(e=>o.includes(e))||t.includes("*"):!0}var x=(t,o,e)=>{let{alt:i,ctrl:c,meta:a,mod:r,shift:d,keys:n}=o,{altKey:l,ctrlKey:u,metaKey:f,shiftKey:p,key:s,code:m}=t,y=m.toLowerCase().replace("key",""),k=s.toLowerCase();if(l!==i&&k!=="alt"||p!==d&&k!=="shift")return!1;if(r){if(!f&&!u)return!1}else if(f!==a&&y!=="meta"||u!==c&&y!=="ctrl")return!1;return n&&n.length===1&&(n.includes(k)||n.includes(y))?!0:n?n.every(L=>e.has(L)):!n};import{createContext as O,useMemo as M,useState as P,useContext as D}from"react";var C=O(void 0),v=()=>{let t=D(C);return t===void 0?{hotkeys:[],activeScopes:[],toggleScope:()=>{},activateScope:()=>{},deactivateScope:()=>{}}:t},I=({initialActiveScopes:t=["*"],children:o})=>{let[e,i]=P(t?.length>0?t:["*"]),c=M(()=>e.includes("*"),[e]),a=n=>{i(c?[n]:[...e,n])},r=n=>{let l=e.filter(u=>u!==n);l.length===0?i(["*"]):i(l)},d=n=>{e.includes(n)?r(n):a(n)};return React.createElement(C.Provider,{value:{activeScopes:e,hotkeys:[],activateScope:a,deactivateScope:r,toggleScope:d}},o)};function w(t,o,e,i){let c=S(null),{current:a}=S(new Set),r=e instanceof Array?i instanceof Array?void 0:i:e,d=e instanceof Array?e:i instanceof Array?i:[],n=R(o,[...d]),l=v();return N(()=>{if(r?.enabled===!1||!T(l.activeScopes,r?.scopes))return;let u=s=>{h(s)&&!g(s,r?.enableOnTags)||c.current!==null&&document.activeElement!==c.current||(console.log("isContentEditable",s.target?.isContentEditable),!(s.target?.isContentEditable&&!r?.enableOnContentEditable)&&H(t,r?.splitKey).forEach(m=>{let y=b(m,r?.combinationKey);if(x(s,y,a)||y.keys?.includes("*")){if(E(s,y,r?.preventDefault),!K(s,y,r?.enabled))return;n(s,y)}}))},f=s=>{a.add(s.key.toLowerCase()),(r?.keydown===void 0&&r?.keyup!==!0||r?.keydown)&&u(s)},p=s=>{r?.keyup&&u(s),a.delete(s.key.toLowerCase())};return document.addEventListener("keyup",p),document.addEventListener("keydown",f),()=>{document.removeEventListener("keyup",p),document.removeEventListener("keydown",f)}},[t,n,r]),c}export{I as HotkeysProvider,w as useHotkeys,v as useHotkeysContext};
+import{useCallback as _,useLayoutEffect as j,useRef as B}from"react";var O=["ctrl","shift","alt","meta","mod"];function v(t,o=","){return typeof t=="string"?t.split(o):t}function H(t,o="+"){let e=t.toLocaleLowerCase().split(o).map(c=>c.trim()),y={alt:e.includes("alt"),ctrl:e.includes("ctrl"),shift:e.includes("shift"),meta:e.includes("meta"),mod:e.includes("mod")},i=e.filter(c=>!O.includes(c));return{...y,keys:i}}function b(t,o,e){(typeof e=="function"&&e(t,o)||e===!0)&&t.preventDefault()}function h(t,o,e){return typeof e=="function"?e(t,o):e===!0||e===void 0}function P(t){return g(t,["input","textarea","select"])}function g({target:t},o=!1){let e=t&&t.tagName;return o instanceof Array?Boolean(e&&o&&o.some(y=>y.toLowerCase()===e.toLowerCase())):Boolean(e&&o&&o===!0)}function E(t,o){return t.length===0&&o?(console.warn('A hotkey has the "scopes" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'),!0):o?t.some(e=>o.includes(e))||t.includes("*"):!0}var C=(t,o,e)=>{let{alt:y,ctrl:i,meta:c,mod:r,shift:p,keys:a}=o,{altKey:k,ctrlKey:d,metaKey:l,shiftKey:s,key:u,code:n}=t,m=n.toLowerCase().replace("key",""),f=u.toLowerCase();if(k!==y&&f!=="alt"||s!==p&&f!=="shift")return!1;if(r){if(!l&&!d)return!1}else if(l!==c&&m!=="meta"||d!==i&&m!=="ctrl")return!1;return a&&a.length===1&&(a.includes(f)||a.includes(m))?!0:a?a.every(M=>e.has(M)):!a};import{createContext as I,useMemo as N,useState as T,useContext as F}from"react";import{createContext as R,useContext as D}from"react";var S=R(void 0),w=()=>D(S);function x({addHotkey:t,removeHotkey:o,children:e}){return React.createElement(S.Provider,{value:{addHotkey:t,removeHotkey:o}},e)}var A=I({hotkeys:[],activeScopes:[],toggleScope:()=>{},activateScope:()=>{},deactivateScope:()=>{}}),K=()=>F(A),U=({initiallyActiveScopes:t=["*"],children:o})=>{let[e,y]=T(t?.length>0?t:["*"]),[i,c]=T([]),r=N(()=>e.includes("*"),[e]),p=s=>{y(r?[s]:Array.from(new Set([...e,s])))},a=s=>{let u=e.filter(n=>n!==s);u.length===0?y(["*"]):y(u)},k=s=>{e.includes(s)?a(s):p(s)},d=s=>{c([...i,s])},l=s=>{c(i.filter(u=>u.keys!==s.keys))};return React.createElement(A.Provider,{value:{activeScopes:e,hotkeys:i,activateScope:p,deactivateScope:a,toggleScope:k}},React.createElement(x,{addHotkey:d,removeHotkey:l},o))};function L(t,o,e,y){let i=B(null),{current:c}=B(new Set),r=e instanceof Array?y instanceof Array?void 0:y:e,p=e instanceof Array?e:y instanceof Array?y:[],a=_(o,[...p]),k=K(),d=w();return j(()=>{if(r?.enabled===!1||!E(k.activeScopes,r?.scopes))return;let l=n=>{P(n)&&!g(n,r?.enableOnFormTags)||i.current!==null&&document.activeElement!==i.current&&!i.current.contains(document.activeElement)||n.target?.isContentEditable&&!r?.enableOnContentEditable||v(t,r?.splitKey).forEach(m=>{let f=H(m,r?.combinationKey);if(C(n,f,c)||f.keys?.includes("*")){if(b(n,f,r?.preventDefault),!h(n,f,r?.enabled))return;a(n,f)}})},s=n=>{c.add(n.key.toLowerCase()),(r?.keydown===void 0&&r?.keyup!==!0||r?.keydown)&&l(n)},u=n=>{c.delete(n.key.toLowerCase()),r?.keyup&&l(n)};return(i.current||document).addEventListener("keyup",u),(i.current||document).addEventListener("keydown",s),d&&v(t,r?.splitKey).forEach(n=>d.addHotkey(H(n,r?.combinationKey))),()=>{(i.current||document).removeEventListener("keyup",u),(i.current||document).removeEventListener("keydown",s),d&&v(t,r?.splitKey).forEach(n=>d.removeHotkey(H(n,r?.combinationKey)))}},[t,a,r]),i}export{U as HotkeysProvider,L as useHotkeys,K as useHotkeysContext};
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/useHotkeys.ts", "../src/parseHotkeys.ts", "../src/validators.ts", "../src/HotkeysProvider.tsx"],
-  "sourcesContent": ["import { HotkeyCallback, Keys, OptionsOrDependencyArray, RefType } from './types'\nimport { useCallback, useLayoutEffect, useRef } from 'react'\nimport { parseHotkey, parseKeysHookInput } from './parseHotkeys'\nimport {\n  isHotkeyEnabled,\n  isHotkeyEnabledOnTag,\n  isHotkeyMatchingKeyboardEvent,\n  isKeyboardEventTriggeredByInput,\n  isScopeActive,\n  maybePreventDefault,\n} from './validators'\nimport { useHotkeysContext } from './HotkeysProvider'\n\nexport default function useHotkeys<T extends HTMLElement>(\n  keys: Keys,\n  callback: HotkeyCallback,\n  options?: OptionsOrDependencyArray,\n  dependencies?: OptionsOrDependencyArray\n) {\n  const ref = useRef<RefType<T>>(null)\n  const { current: pressedDownKeys } = useRef<Set<string>>(new Set())\n\n  const _options = !(options instanceof Array) ? options : !(dependencies instanceof Array) ? dependencies : undefined\n  const _deps = options instanceof Array ? options : dependencies instanceof Array ? dependencies : []\n\n  const cb = useCallback(callback, [..._deps])\n  const ctx = useHotkeysContext()\n\n  useLayoutEffect(() => {\n    if (_options?.enabled === false || !isScopeActive(ctx.activeScopes, _options?.scopes)) {\n      return\n    }\n\n    const listener = (e: KeyboardEvent) => {\n      if (isKeyboardEventTriggeredByInput(e) && !isHotkeyEnabledOnTag(e, _options?.enableOnTags)) {\n        return\n      }\n\n      if (ref.current !== null && document.activeElement !== ref.current) {\n        return\n      }\n\n      console.log('isContentEditable', ((e.target as HTMLElement)?.isContentEditable))\n\n      if (((e.target as HTMLElement)?.isContentEditable && !_options?.enableOnContentEditable)) {\n        return\n      }\n\n      parseKeysHookInput(keys, _options?.splitKey).forEach((key) => {\n        const hotkey = parseHotkey(key, _options?.combinationKey)\n\n        if (isHotkeyMatchingKeyboardEvent(e, hotkey, pressedDownKeys) || hotkey.keys?.includes('*')) {\n          maybePreventDefault(e, hotkey, _options?.preventDefault)\n\n          if (!isHotkeyEnabled(e, hotkey, _options?.enabled)) {\n            return\n          }\n\n          cb(e, hotkey)\n        }\n      })\n    }\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      pressedDownKeys.add(event.key.toLowerCase())\n\n      if ((_options?.keydown === undefined && _options?.keyup !== true) || _options?.keydown) {\n        listener(event)\n      }\n    }\n\n    const handleKeyUp = (event: KeyboardEvent) => {\n      if (_options?.keyup) {\n        listener(event)\n      }\n\n      pressedDownKeys.delete(event.key.toLowerCase())\n    }\n\n    document.addEventListener('keyup', handleKeyUp)\n    document.addEventListener('keydown', handleKeyDown)\n\n    return () => {\n      document.removeEventListener('keyup', handleKeyUp)\n      document.removeEventListener('keydown', handleKeyDown)\n    }\n  }, [keys, cb, _options])\n\n  return ref\n}\n", "import { Hotkey, KeyboardModifiers, Keys } from './types'\n\nconst reservedModifierKeywords = ['ctrl', 'shift', 'alt', 'meta', 'mod']\n\nexport function parseKeysHookInput(keys: Keys, splitKey: string = ','): string[] {\n  if (typeof keys === 'string') {\n    return keys.split(splitKey)\n  }\n\n  return keys\n}\n\nexport function parseHotkey(hotkey: string, combinationKey: string = '+'): Hotkey {\n  const keys = hotkey\n    .toLocaleLowerCase()\n    .split(combinationKey)\n    .map((k) => k.trim())\n\n  const modifiers: KeyboardModifiers = {\n    alt: keys.includes('alt'),\n    ctrl: keys.includes('ctrl'),\n    shift: keys.includes('shift'),\n    meta: keys.includes('meta'),\n    mod: keys.includes('mod'),\n  }\n\n  const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k))\n\n  return {\n    ...modifiers,\n    keys: singleCharKeys,\n  }\n}\n", "import { FormTags, Hotkey, Scopes, Trigger } from './types'\n\nexport function maybePreventDefault(e: KeyboardEvent, hotkey: Hotkey, preventDefault?: Trigger): void {\n  if ((typeof preventDefault === 'function' && preventDefault(e, hotkey)) || preventDefault === true) {\n    e.preventDefault()\n  }\n}\n\nexport function isHotkeyEnabled(e: KeyboardEvent, hotkey: Hotkey, enabled?: Trigger): boolean {\n  if (typeof enabled === 'function') {\n    return enabled(e, hotkey)\n  }\n\n  return enabled === true || enabled === undefined\n}\n\nexport function isKeyboardEventTriggeredByInput(ev: KeyboardEvent): boolean {\n  return isHotkeyEnabledOnTag(ev, ['INPUT', 'TEXTAREA', 'SELECT'])\n}\n\nexport function isHotkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags?: FormTags[]): boolean {\n  const targetTagName = target && (target as HTMLElement).tagName\n\n  return Boolean(targetTagName && enabledOnTags && enabledOnTags.includes(targetTagName as FormTags))\n}\n\nexport function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean {\n  if (activeScopes.length === 0 && scopes) {\n    console.warn(\n      'A hotkey has a set scopes options, although no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'\n    )\n\n    return true\n  }\n\n  if (!scopes) {\n    return true\n  }\n\n  return activeScopes.some(scope => scopes.includes(scope)) || activeScopes.includes('*')\n}\n\nexport const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey, pressedDownKeys: Set<string>): boolean => {\n  const { alt, ctrl, meta, mod, shift, keys } = hotkey\n  const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKeyUppercase, code } = e\n\n  const keyCode = code.toLowerCase().replace('key', '')\n  const pressedKey = pressedKeyUppercase.toLowerCase()\n\n  if (altKey !== alt && pressedKey !== 'alt') {\n    return false\n  }\n\n  if (shiftKey !== shift && pressedKey !== 'shift') {\n    return false\n  }\n\n  // Mod is a special key name that is checking for meta on macOS and ctrl on other platforms\n  if (mod) {\n    if (!metaKey && !ctrlKey) {\n      return false\n    }\n  } else {\n    if (metaKey !== meta && keyCode !== 'meta') {\n      return false\n    }\n\n    if (ctrlKey !== ctrl && keyCode !== 'ctrl') {\n      return false\n    }\n  }\n\n  // All modifiers are correct, now check the key\n  // If the key is set we check for the key\n  if (keys && keys.length === 1 && (keys.includes(pressedKey) || keys.includes(keyCode))) {\n    return true\n  } else if (keys) {\n    // Check if all keys are present in pressedDownKeys set\n    return keys.every(key => pressedDownKeys.has(key))\n  }\n  else if (!keys) {\n    // If the key is not set, we only listen for modifiers, that check went alright, so we return true\n    return true\n  }\n\n  // There is nothing that matches.\n  return false\n}\n", "import { Hotkey } from './types'\nimport { createContext, ReactNode, useMemo, useState, useContext } from 'react'\n\ntype HotkeysContextType = {\n  hotkeys: Hotkey[]\n  activeScopes: string[]\n  toggleScope: (scope: string) => void\n  activateScope: (scope: string) => void\n  deactivateScope: (scope: string) => void\n}\n\nconst HotkeysContext = createContext<HotkeysContextType | undefined>(undefined)\n\ninterface Props {\n  initialActiveScopes?: string[]\n  children: ReactNode\n}\n\nexport const useHotkeysContext = () => {\n  const context = useContext(HotkeysContext)\n\n  // The context is only needed for special features like global scoping, so we don't throw an error if it's not defined\n  if (context === undefined) {\n    return {\n      hotkeys: [],\n      activeScopes: [],\n      toggleScope: () => {},\n      activateScope: () => {},\n      deactivateScope: () => {},\n    }\n  }\n\n  return context\n}\n\nexport const HotkeysProvider = ({initialActiveScopes = ['*'], children}: Props) => {\n  const [activeScopes, setActiveScopes] = useState(initialActiveScopes?.length > 0 ? initialActiveScopes : ['*'])\n\n  const isAllActive = useMemo(() => activeScopes.includes('*'), [activeScopes])\n\n  const activateScope = (scope: string) => {\n    if (isAllActive) {\n      setActiveScopes([scope])\n    } else {\n      setActiveScopes([...activeScopes, scope])\n    }\n  }\n\n  const deactivateScope = (scope: string) => {\n    const scopes = activeScopes.filter(s => s !== scope)\n\n    if (scopes.length === 0) {\n      setActiveScopes(['*'])\n    } else {\n      setActiveScopes(scopes)\n    }\n  }\n\n  const toggleScope = (scope: string) => {\n    if (activeScopes.includes(scope)) {\n      deactivateScope(scope)\n    } else {\n      activateScope(scope)\n    }\n  }\n\n  return (\n    <HotkeysContext.Provider value={{activeScopes, hotkeys: [], activateScope, deactivateScope, toggleScope}}>\n      {children}\n    </HotkeysContext.Provider>\n  )\n}\n"],
-  "mappings": "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",
+  "sources": ["../src/useHotkeys.ts", "../src/parseHotkeys.ts", "../src/validators.ts", "../src/HotkeysProvider.tsx", "../src/BoundHotkeysProxyProvider.tsx"],
+  "sourcesContent": ["import { HotkeyCallback, Keys, OptionsOrDependencyArray, RefType } from './types'\nimport { useCallback, useLayoutEffect, useRef } from 'react'\nimport { parseHotkey, parseKeysHookInput } from './parseHotkeys'\nimport {\n  isHotkeyEnabled,\n  isHotkeyEnabledOnTag,\n  isHotkeyMatchingKeyboardEvent,\n  isKeyboardEventTriggeredByInput,\n  isScopeActive,\n  maybePreventDefault,\n} from './validators'\nimport { useHotkeysContext } from './HotkeysProvider'\nimport { useBoundHotkeysProxy } from './BoundHotkeysProxyProvider'\n\nexport default function useHotkeys<T extends HTMLElement>(\n  keys: Keys,\n  callback: HotkeyCallback,\n  options?: OptionsOrDependencyArray,\n  dependencies?: OptionsOrDependencyArray,\n) {\n  const ref = useRef<RefType<T>>(null)\n  const { current: pressedDownKeys } = useRef<Set<string>>(new Set())\n\n  const _options = !(options instanceof Array) ? options : !(dependencies instanceof Array) ? dependencies : undefined\n  const _deps = options instanceof Array ? options : dependencies instanceof Array ? dependencies : []\n\n  const cb = useCallback(callback, [..._deps])\n  const ctx = useHotkeysContext()\n\n  const proxy = useBoundHotkeysProxy()\n\n  useLayoutEffect(() => {\n    if (_options?.enabled === false || !isScopeActive(ctx.activeScopes, _options?.scopes)) {\n      return\n    }\n\n    const listener = (e: KeyboardEvent) => {\n      if (isKeyboardEventTriggeredByInput(e) && !isHotkeyEnabledOnTag(e, _options?.enableOnFormTags)) {\n        return\n      }\n\n      if (ref.current !== null && document.activeElement !== ref.current && !ref.current.contains(document.activeElement)) {\n        return\n      }\n\n      if (((e.target as HTMLElement)?.isContentEditable && !_options?.enableOnContentEditable)) {\n        return\n      }\n\n      parseKeysHookInput(keys, _options?.splitKey).forEach((key) => {\n        const hotkey = parseHotkey(key, _options?.combinationKey)\n\n        if (isHotkeyMatchingKeyboardEvent(e, hotkey, pressedDownKeys) || hotkey.keys?.includes('*')) {\n          maybePreventDefault(e, hotkey, _options?.preventDefault)\n\n          if (!isHotkeyEnabled(e, hotkey, _options?.enabled)) {\n            return\n          }\n\n          cb(e, hotkey)\n        }\n      })\n    }\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      pressedDownKeys.add(event.key.toLowerCase())\n\n      if ((_options?.keydown === undefined && _options?.keyup !== true) || _options?.keydown) {\n        listener(event)\n      }\n    }\n\n    const handleKeyUp = (event: KeyboardEvent) => {\n      pressedDownKeys.delete(event.key.toLowerCase())\n\n      if (_options?.keyup) {\n        listener(event)\n      }\n    }\n\n    // @ts-ignore\n    (ref.current || document).addEventListener('keyup', handleKeyUp);\n    // @ts-ignore\n    (ref.current || document).addEventListener('keydown', handleKeyDown)\n\n    if (proxy) {\n      parseKeysHookInput(keys, _options?.splitKey).forEach((key) => proxy.addHotkey(parseHotkey(key, _options?.combinationKey)))\n    }\n\n    return () => {\n      // @ts-ignore\n      (ref.current || document).removeEventListener('keyup', handleKeyUp);\n      // @ts-ignore\n      (ref.current || document).removeEventListener('keydown', handleKeyDown)\n\n      if (proxy) {\n        parseKeysHookInput(keys, _options?.splitKey).forEach((key) => proxy.removeHotkey(parseHotkey(key, _options?.combinationKey)))\n      }\n    }\n  }, [keys, cb, _options])\n\n  return ref\n}\n", "import { Hotkey, KeyboardModifiers, Keys } from './types'\n\nconst reservedModifierKeywords = ['ctrl', 'shift', 'alt', 'meta', 'mod']\n\nexport function parseKeysHookInput(keys: Keys, splitKey: string = ','): string[] {\n  if (typeof keys === 'string') {\n    return keys.split(splitKey)\n  }\n\n  return keys\n}\n\nexport function parseHotkey(hotkey: string, combinationKey: string = '+'): Hotkey {\n  const keys = hotkey\n    .toLocaleLowerCase()\n    .split(combinationKey)\n    .map((k) => k.trim())\n\n  const modifiers: KeyboardModifiers = {\n    alt: keys.includes('alt'),\n    ctrl: keys.includes('ctrl'),\n    shift: keys.includes('shift'),\n    meta: keys.includes('meta'),\n    mod: keys.includes('mod'),\n  }\n\n  const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k))\n\n  return {\n    ...modifiers,\n    keys: singleCharKeys,\n  }\n}\n", "import { FormTags, Hotkey, Scopes, Trigger } from './types'\n\nexport function maybePreventDefault(e: KeyboardEvent, hotkey: Hotkey, preventDefault?: Trigger): void {\n  if ((typeof preventDefault === 'function' && preventDefault(e, hotkey)) || preventDefault === true) {\n    e.preventDefault()\n  }\n}\n\nexport function isHotkeyEnabled(e: KeyboardEvent, hotkey: Hotkey, enabled?: Trigger): boolean {\n  if (typeof enabled === 'function') {\n    return enabled(e, hotkey)\n  }\n\n  return enabled === true || enabled === undefined\n}\n\nexport function isKeyboardEventTriggeredByInput(ev: KeyboardEvent): boolean {\n  return isHotkeyEnabledOnTag(ev, ['input', 'textarea', 'select'])\n}\n\nexport function isHotkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags: FormTags[] | boolean = false): boolean {\n  const targetTagName = target && (target as HTMLElement).tagName\n\n  if (enabledOnTags instanceof Array) {\n    return Boolean(targetTagName && enabledOnTags && enabledOnTags.some(tag => tag.toLowerCase() === targetTagName.toLowerCase()))\n  }\n\n  return Boolean(targetTagName && enabledOnTags && enabledOnTags === true)\n}\n\nexport function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean {\n  if (activeScopes.length === 0 && scopes) {\n    console.warn(\n      'A hotkey has the \"scopes\" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'\n    )\n\n    return true\n  }\n\n  if (!scopes) {\n    return true\n  }\n\n  return activeScopes.some(scope => scopes.includes(scope)) || activeScopes.includes('*')\n}\n\nexport const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey, pressedDownKeys: Set<string>): boolean => {\n  const { alt, ctrl, meta, mod, shift, keys } = hotkey\n  const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKeyUppercase, code } = e\n\n  const keyCode = code.toLowerCase().replace('key', '')\n  const pressedKey = pressedKeyUppercase.toLowerCase()\n\n  if (altKey !== alt && pressedKey !== 'alt') {\n    return false\n  }\n\n  if (shiftKey !== shift && pressedKey !== 'shift') {\n    return false\n  }\n\n  // Mod is a special key name that is checking for meta on macOS and ctrl on other platforms\n  if (mod) {\n    if (!metaKey && !ctrlKey) {\n      return false\n    }\n  } else {\n    if (metaKey !== meta && keyCode !== 'meta') {\n      return false\n    }\n\n    if (ctrlKey !== ctrl && keyCode !== 'ctrl') {\n      return false\n    }\n  }\n\n  // All modifiers are correct, now check the key\n  // If the key is set we check for the key\n  if (keys && keys.length === 1 && (keys.includes(pressedKey) || keys.includes(keyCode))) {\n    return true\n  } else if (keys) {\n    // Check if all keys are present in pressedDownKeys set\n    return keys.every(key => pressedDownKeys.has(key))\n  }\n  else if (!keys) {\n    // If the key is not set, we only listen for modifiers, that check went alright, so we return true\n    return true\n  }\n\n  // There is nothing that matches.\n  return false\n}\n", "import { Hotkey } from './types'\nimport { createContext, ReactNode, useMemo, useState, useContext } from 'react'\nimport BoundHotkeysProxyProviderProvider from './BoundHotkeysProxyProvider'\n\ntype HotkeysContextType = {\n  hotkeys: ReadonlyArray<Hotkey>\n  activeScopes: string[]\n  toggleScope: (scope: string) => void\n  activateScope: (scope: string) => void\n  deactivateScope: (scope: string) => void\n}\n\n// The context is only needed for special features like global scoping, so we use a graceful default fallback\nconst HotkeysContext = createContext<HotkeysContextType>({\n  hotkeys: [],\n  activeScopes: [], // This array has to be empty to check if the provider is set or not\n  toggleScope: () => {},\n  activateScope: () => {},\n  deactivateScope: () => {},\n})\n\nexport const useHotkeysContext = () => {\n  return useContext(HotkeysContext)\n}\n\ninterface Props {\n  initiallyActiveScopes?: string[]\n  children: ReactNode\n}\n\nexport const HotkeysProvider = ({initiallyActiveScopes = ['*'], children}: Props) => {\n  const [internalActiveScopes, setInternalActiveScopes] = useState(initiallyActiveScopes?.length > 0 ? initiallyActiveScopes : ['*'])\n  const [boundHotkeys, setBoundHotkeys] = useState<Hotkey[]>([]);\n\n  const isAllActive = useMemo(() => internalActiveScopes.includes('*'), [internalActiveScopes])\n\n  const activateScope = (scope: string) => {\n    if (isAllActive) {\n      setInternalActiveScopes([scope])\n    } else {\n      setInternalActiveScopes(Array.from(new Set([...internalActiveScopes, scope])))\n    }\n  }\n\n  const deactivateScope = (scope: string) => {\n    const scopes = internalActiveScopes.filter(s => s !== scope)\n\n    if (scopes.length === 0) {\n      setInternalActiveScopes(['*'])\n    } else {\n      setInternalActiveScopes(scopes)\n    }\n  }\n\n  const toggleScope = (scope: string) => {\n    if (internalActiveScopes.includes(scope)) {\n      deactivateScope(scope)\n    } else {\n      activateScope(scope)\n    }\n  }\n\n  const addBoundHotkey = (hotkey: Hotkey) => {\n    setBoundHotkeys([...boundHotkeys, hotkey])\n  }\n\n  const removeBoundHotkey = (hotkey: Hotkey) => {\n    setBoundHotkeys(boundHotkeys.filter(h => h.keys !== hotkey.keys))\n  }\n\n  return (\n    <HotkeysContext.Provider value={{activeScopes: internalActiveScopes, hotkeys: boundHotkeys, activateScope, deactivateScope, toggleScope}}>\n      <BoundHotkeysProxyProviderProvider addHotkey={addBoundHotkey} removeHotkey={removeBoundHotkey}>\n        {children}\n      </BoundHotkeysProxyProviderProvider>\n    </HotkeysContext.Provider>\n  )\n}\n", "import { createContext, ReactNode, useContext } from 'react'\nimport { Hotkey } from './types'\n\ntype BoundHotkeysProxyProviderType = {\n  addHotkey: (hotkey: Hotkey) => void,\n  removeHotkey: (hotkey: Hotkey) => void,\n}\n\nconst BoundHotkeysProxyProvider = createContext<BoundHotkeysProxyProviderType | undefined>(undefined)\n\nexport const useBoundHotkeysProxy = () => {\n  return useContext(BoundHotkeysProxyProvider)\n}\n\ninterface Props {\n  children: ReactNode\n  addHotkey: (hotkey: Hotkey) => void\n  removeHotkey: (hotkey: Hotkey) => void\n}\n\nexport default function BoundHotkeysProxyProviderProvider({ addHotkey, removeHotkey, children }: Props) {\n  return <BoundHotkeysProxyProvider.Provider value={{addHotkey, removeHotkey}}>{children}</BoundHotkeysProxyProvider.Provider>\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/types.d.ts

@@ -1,5 +1,5 @@
 import type { DependencyList } from 'react';
-export declare type FormTags = 'INPUT' | 'TEXTAREA' | 'SELECT';
+export declare type FormTags = 'input' | 'textarea' | 'select' | 'INPUT' | 'TEXTAREA' | 'SELECT';
 export declare type Keys = string | string[];
 export declare type Scopes = string | string[];
 export declare type RefType<T> = T | null;
@@ -19,7 +19,7 @@ export declare type HotkeyCallback = (keyboardEvent: KeyboardEvent, hotkeysEvent
 export declare type Trigger = boolean | ((keyboardEvent: KeyboardEvent, hotkeysEvent: HotkeysEvent) => boolean);
 export declare type Options = {
     enabled?: Trigger;
-    enableOnTags?: FormTags[];
+    enableOnFormTags?: FormTags[] | boolean;
     enableOnContentEditable?: boolean;
     combinationKey?: string;
     splitKey?: string;

package/dist/validators.d.ts

@@ -2,6 +2,6 @@ import { FormTags, Hotkey, Scopes, Trigger } from './types';
 export declare function maybePreventDefault(e: KeyboardEvent, hotkey: Hotkey, preventDefault?: Trigger): void;
 export declare function isHotkeyEnabled(e: KeyboardEvent, hotkey: Hotkey, enabled?: Trigger): boolean;
 export declare function isKeyboardEventTriggeredByInput(ev: KeyboardEvent): boolean;
-export declare function isHotkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags?: FormTags[]): boolean;
+export declare function isHotkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags?: FormTags[] | boolean): boolean;
 export declare function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean;
 export declare const isHotkeyMatchingKeyboardEvent: (e: KeyboardEvent, hotkey: Hotkey, pressedDownKeys: Set<string>) => boolean;

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "react-hotkeys-hook",
-  "version": "3.4.5",
+  "version": "4.0.0-0",
   "repository": "https://JohannesKlauss@github.com/JohannesKlauss/react-keymap-hook.git",
   "homepage": "https://johannesklauss.github.io/react-hotkeys-hook/",
   "author": "Johannes Klauss",
   "main": "dist/index.js",
-  "typings": "dist/index.d.ts",
-  "module": "dist/react-hotkeys-hook.esm.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/index.js",
   "files": [
     "dist",
     "src"
@@ -25,8 +25,7 @@
   ],
   "license": "MIT",
   "scripts": {
-    "start": "tsdx watch",
-    "build": "tsdx build",
+    "build": "node ./esbuild.js && tsc --project tsconfig.build.json",
     "test": "jest",
     "publish": "np"
   },
@@ -37,48 +36,40 @@
       "@babel/preset-react"
     ]
   },
-  "jest": {
-    "setupFilesAfterEnv": [
-      "./setupTests.js"
-    ],
-    "testPathIgnorePatterns": [
-      "pkg",
-      ".docz",
-      "docs"
-    ]
-  },
   "prettier": {
-    "printWidth": 80,
-    "semi": true,
+    "printWidth": 120,
+    "semi": false,
     "singleQuote": true,
     "trailingComma": "es5"
   },
-  "dependencies": {
-    "hotkeys-js": "3.9.3"
-  },
   "devDependencies": {
-    "@babel/core": "7.17.10",
-    "@babel/plugin-proposal-class-properties": "7.16.7",
-    "@babel/preset-env": "7.17.10",
-    "@babel/preset-react": "7.16.7",
-    "@babel/preset-typescript": "7.16.7",
-    "@testing-library/react": "13.2.0",
-    "@testing-library/react-hooks": "8.0.0",
-    "@testing-library/user-event": "13.5.0",
-    "@types/jest": "27.5.1",
-    "@types/react": "18.0.9",
-    "@types/react-dom": "18.0.3",
-    "eslint-plugin-prettier": "4.0.0",
-    "jest": "26.6.3",
-    "prettier": "2.6.2",
-    "react": "18.1.0",
-    "react-dom": "18.1.0",
-    "react-test-renderer": "18.1.0",
-    "tsdx": "0.14.1",
+    "@babel/core": "7.18.9",
+    "@babel/plugin-proposal-class-properties": "7.18.6",
+    "@babel/plugin-transform-react-jsx": "7.18.6",
+    "@babel/preset-env": "7.18.9",
+    "@babel/preset-react": "7.18.6",
+    "@babel/preset-typescript": "7.18.6",
+    "@testing-library/jest-dom": "5.16.4",
+    "@testing-library/react": "13.3.0",
+    "@testing-library/react-hooks": "8.0.1",
+    "@testing-library/user-event": "14.3.0",
+    "@types/jest": "28.1.6",
+    "@types/lodash": "^4.14.182",
+    "@types/react": "18.0.15",
+    "@types/react-dom": "18.0.6",
+    "esbuild": "0.14.49",
+    "eslint-plugin-prettier": "4.2.1",
+    "jest": "28.1.3",
+    "jest-environment-jsdom": "28.1.3",
+    "prettier": "2.7.1",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-test-renderer": "18.2.0",
     "tslib": "2.4.0",
-    "typescript": "4.6.4"
+    "typescript": "4.7.4"
   },
   "peerDependencies": {
+    "lodash": ">=4.17.21",
     "react": ">=16.8.1",
     "react-dom": ">=16.8.1"
   }

package/src/BoundHotkeysProxyProvider.tsx

@@ -0,0 +1,23 @@
+import { createContext, ReactNode, useContext } from 'react'
+import { Hotkey } from './types'
+
+type BoundHotkeysProxyProviderType = {
+  addHotkey: (hotkey: Hotkey) => void,
+  removeHotkey: (hotkey: Hotkey) => void,
+}
+
+const BoundHotkeysProxyProvider = createContext<BoundHotkeysProxyProviderType | undefined>(undefined)
+
+export const useBoundHotkeysProxy = () => {
+  return useContext(BoundHotkeysProxyProvider)
+}
+
+interface Props {
+  children: ReactNode
+  addHotkey: (hotkey: Hotkey) => void
+  removeHotkey: (hotkey: Hotkey) => void
+}
+
+export default function BoundHotkeysProxyProviderProvider({ addHotkey, removeHotkey, children }: Props) {
+  return <BoundHotkeysProxyProvider.Provider value={{addHotkey, removeHotkey}}>{children}</BoundHotkeysProxyProvider.Provider>
+}

package/src/HotkeysProvider.tsx

@@ -0,0 +1,78 @@
+import { Hotkey } from './types'
+import { createContext, ReactNode, useMemo, useState, useContext } from 'react'
+import BoundHotkeysProxyProviderProvider from './BoundHotkeysProxyProvider'
+
+type HotkeysContextType = {
+  hotkeys: ReadonlyArray<Hotkey>
+  activeScopes: string[]
+  toggleScope: (scope: string) => void
+  activateScope: (scope: string) => void
+  deactivateScope: (scope: string) => void
+}
+
+// The context is only needed for special features like global scoping, so we use a graceful default fallback
+const HotkeysContext = createContext<HotkeysContextType>({
+  hotkeys: [],
+  activeScopes: [], // This array has to be empty to check if the provider is set or not
+  toggleScope: () => {},
+  activateScope: () => {},
+  deactivateScope: () => {},
+})
+
+export const useHotkeysContext = () => {
+  return useContext(HotkeysContext)
+}
+
+interface Props {
+  initiallyActiveScopes?: string[]
+  children: ReactNode
+}
+
+export const HotkeysProvider = ({initiallyActiveScopes = ['*'], children}: Props) => {
+  const [internalActiveScopes, setInternalActiveScopes] = useState(initiallyActiveScopes?.length > 0 ? initiallyActiveScopes : ['*'])
+  const [boundHotkeys, setBoundHotkeys] = useState<Hotkey[]>([]);
+
+  const isAllActive = useMemo(() => internalActiveScopes.includes('*'), [internalActiveScopes])
+
+  const activateScope = (scope: string) => {
+    if (isAllActive) {
+      setInternalActiveScopes([scope])
+    } else {
+      setInternalActiveScopes(Array.from(new Set([...internalActiveScopes, scope])))
+    }
+  }
+
+  const deactivateScope = (scope: string) => {
+    const scopes = internalActiveScopes.filter(s => s !== scope)
+
+    if (scopes.length === 0) {
+      setInternalActiveScopes(['*'])
+    } else {
+      setInternalActiveScopes(scopes)
+    }
+  }
+
+  const toggleScope = (scope: string) => {
+    if (internalActiveScopes.includes(scope)) {
+      deactivateScope(scope)
+    } else {
+      activateScope(scope)
+    }
+  }
+
+  const addBoundHotkey = (hotkey: Hotkey) => {
+    setBoundHotkeys([...boundHotkeys, hotkey])
+  }
+
+  const removeBoundHotkey = (hotkey: Hotkey) => {
+    setBoundHotkeys(boundHotkeys.filter(h => h.keys !== hotkey.keys))
+  }
+
+  return (
+    <HotkeysContext.Provider value={{activeScopes: internalActiveScopes, hotkeys: boundHotkeys, activateScope, deactivateScope, toggleScope}}>
+      <BoundHotkeysProxyProviderProvider addHotkey={addBoundHotkey} removeHotkey={removeBoundHotkey}>
+        {children}
+      </BoundHotkeysProxyProviderProvider>
+    </HotkeysContext.Provider>
+  )
+}

package/src/index.ts

@@ -1,7 +1,10 @@
-import { useIsHotkeyPressed } from './useIsHotkeyPressed';
-import { useHotkeys, Options } from './useHotkeys';
-import hotkeys from 'hotkeys-js';
+import useHotkeys from './useHotkeys'
+import type { Options } from './types'
+import { HotkeysProvider, useHotkeysContext } from './HotkeysProvider'
 
-const isHotkeyPressed = hotkeys.isPressed;
-
-export { useHotkeys, useIsHotkeyPressed, isHotkeyPressed, Options };
+export {
+  useHotkeys,
+  useHotkeysContext,
+  HotkeysProvider,
+  Options,
+}

package/src/isHotkeyPressed.ts

@@ -0,0 +1,51 @@
+import { Hotkey } from './types'
+import { parseHotkey } from './parseHotkeys'
+import isEqual from 'lodash/isEqual'
+
+const currentlyPressedKeys: Set<Hotkey> = new Set<Hotkey>()
+
+export function isHotkeyPressed(key: string | string[], splitKey: string = ','): boolean {
+  const hotkeyArray = Array.isArray(key) ? key : key.split(splitKey)
+
+  return hotkeyArray.every((hotkey) => {
+    const parsedHotkey = parseHotkey(hotkey)
+
+    for (const pressedHotkey of currentlyPressedKeys) {
+      if (isEqual(parsedHotkey, pressedHotkey)) {
+        return true
+      }
+    }
+  })
+}
+
+export function pushToCurrentlyPressedKeys(key: string | string[]): void {
+  const hotkeyArray = Array.isArray(key) ? key : [key]
+
+  hotkeyArray.forEach(hotkey => currentlyPressedKeys.add(parseHotkey(hotkey)))
+}
+
+export function removeFromCurrentlyPressedKeys(key: string | string[]): void {
+  const hotkeyArray = Array.isArray(key) ? key : [key]
+
+  hotkeyArray.forEach((hotkey) => {
+    const parsedHotkey = parseHotkey(hotkey)
+
+    for (const pressedHotkey of currentlyPressedKeys) {
+      if (pressedHotkey.keys?.every((key) => parsedHotkey.keys?.includes(key))) {
+        currentlyPressedKeys.delete(pressedHotkey)
+      }
+    }
+  })
+}
+
+(() => {
+  window.addEventListener('DOMContentLoaded', () => {
+    document.addEventListener('keydown', e => {
+      pushToCurrentlyPressedKeys(e.key)
+    })
+
+    document.addEventListener('keyup', e => {
+      removeFromCurrentlyPressedKeys(e.key)
+    })
+  })
+})()

package/src/parseHotkeys.ts

@@ -0,0 +1,33 @@
+import { Hotkey, KeyboardModifiers, Keys } from './types'
+
+const reservedModifierKeywords = ['ctrl', 'shift', 'alt', 'meta', 'mod']
+
+export function parseKeysHookInput(keys: Keys, splitKey: string = ','): string[] {
+  if (typeof keys === 'string') {
+    return keys.split(splitKey)
+  }
+
+  return keys
+}
+
+export function parseHotkey(hotkey: string, combinationKey: string = '+'): Hotkey {
+  const keys = hotkey
+    .toLocaleLowerCase()
+    .split(combinationKey)
+    .map((k) => k.trim())
+
+  const modifiers: KeyboardModifiers = {
+    alt: keys.includes('alt'),
+    ctrl: keys.includes('ctrl'),
+    shift: keys.includes('shift'),
+    meta: keys.includes('meta'),
+    mod: keys.includes('mod'),
+  }
+
+  const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k))
+
+  return {
+    ...modifiers,
+    keys: singleCharKeys,
+  }
+}

package/src/types.ts

@@ -0,0 +1,41 @@
+import type { DependencyList } from 'react'
+
+export type FormTags = 'input' | 'textarea' | 'select' | 'INPUT' | 'TEXTAREA' | 'SELECT'
+export type Keys = string | string[]
+export type Scopes = string | string[]
+
+export type RefType<T> = T | null
+
+export type KeyboardModifiers = {
+  alt?: boolean
+  ctrl?: boolean
+  meta?: boolean
+  shift?: boolean
+  mod?: boolean
+}
+
+export type Hotkey = KeyboardModifiers & {
+  keys?: string[]
+  scopes?: Scopes
+}
+
+export type HotkeysEvent = Hotkey & {}
+
+export type HotkeyCallback = (keyboardEvent: KeyboardEvent, hotkeysEvent: HotkeysEvent) => void
+
+export type Trigger = boolean | ((keyboardEvent: KeyboardEvent, hotkeysEvent: HotkeysEvent) => boolean)
+
+export type Options = {
+  enabled?: Trigger // Main setting that determines if the hotkey is enabled or not. (Default: true)
+  enableOnFormTags?: FormTags[] | boolean // Enable hotkeys on a list of tags. (Default: false)
+  enableOnContentEditable?: boolean // Enable hotkeys on tags with contentEditable props. (Default: false)
+  combinationKey?: string // Character to split keys in hotkeys combinations. (Default: +)
+  splitKey?: string // Character to separate different hotkeys. (Default: ,)
+  scopes?: Scopes // Scope
+  keyup?: boolean // Trigger on keyup event? (Default: undefined)
+  keydown?: boolean // Trigger on keydown event? (Default: true)
+  preventDefault?: Trigger // Prevent default browser behavior? (Default: true)
+  description?: string // Use this option to describe what the hotkey does. (Default: undefined)
+}
+
+export type OptionsOrDependencyArray = Options | DependencyList

package/src/useHotkeys.ts

@@ -1,91 +1,103 @@
-import hotkeys, { HotkeysEvent, KeyHandler } from 'hotkeys-js';
-import React, { useCallback, useEffect, useRef } from 'react';
-
-type AvailableTags = 'INPUT' | 'TEXTAREA' | 'SELECT';
-
-// We implement our own custom filter system.
-hotkeys.filter = () => true;
-
-const tagFilter = ({ target }: KeyboardEvent, enableOnTags?: AvailableTags[]) => {
-  const targetTagName = target && (target as HTMLElement).tagName;
-
-  return Boolean((targetTagName && enableOnTags && enableOnTags.includes(targetTagName as AvailableTags)));
-};
-
-const isKeyboardEventTriggeredByInput = (ev: KeyboardEvent) => {
-  return tagFilter(ev, ['INPUT', 'TEXTAREA', 'SELECT']);
-};
-
-export type Options = {
-  enabled?: boolean; // Main setting that determines if the hotkey is enabled or not. (Default: true)
-  filter?: typeof hotkeys.filter; // A filter function returning whether the callback should get triggered or not. (Default: undefined)
-  filterPreventDefault?: boolean; // Prevent default browser behavior if the filter function returns false. (Default: true)
-  enableOnTags?: AvailableTags[]; // Enable hotkeys on a list of tags. (Default: [])
-  enableOnContentEditable?: boolean; // Enable hotkeys on tags with contentEditable props. (Default: false)
-  splitKey?: string; // Character to split keys in hotkeys combinations. (Default +)
-  scope?: string; // Scope. Currently not doing anything.
-  keyup?: boolean; // Trigger on keyup event? (Default: undefined)
-  keydown?: boolean; // Trigger on keydown event? (Default: true)
-};
-
-export function useHotkeys<T extends Element>(keys: string, callback: KeyHandler, options?: Options): React.MutableRefObject<T | null>;
-export function useHotkeys<T extends Element>(keys: string, callback: KeyHandler, deps?: any[]): React.MutableRefObject<T | null>;
-export function useHotkeys<T extends Element>(keys: string, callback: KeyHandler, options?: Options, deps?: any[]): React.MutableRefObject<T | null>;
-export function useHotkeys<T extends Element>(keys: string, callback: KeyHandler, options?: any[] | Options, deps?: any[]): React.MutableRefObject<T | null> {
-  if (options instanceof Array) {
-    deps = options;
-    options = undefined;
-  }
-
-  const {
-    enableOnTags,
-    filter,
-    keyup,
-    keydown,
-    filterPreventDefault = true,
-    enabled = true,
-    enableOnContentEditable = false,
-  } = options as Options || {};
-  const ref = useRef<T | null>(null);
-
-  // The return value of this callback determines if the browsers default behavior is prevented.
-  const memoisedCallback = useCallback((keyboardEvent: KeyboardEvent, hotkeysEvent: HotkeysEvent) => {
-    if (filter && !filter(keyboardEvent)) {
-      return !filterPreventDefault;
+import { HotkeyCallback, Keys, OptionsOrDependencyArray, RefType } from './types'
+import { useCallback, useLayoutEffect, useRef } from 'react'
+import { parseHotkey, parseKeysHookInput } from './parseHotkeys'
+import {
+  isHotkeyEnabled,
+  isHotkeyEnabledOnTag,
+  isHotkeyMatchingKeyboardEvent,
+  isKeyboardEventTriggeredByInput,
+  isScopeActive,
+  maybePreventDefault,
+} from './validators'
+import { useHotkeysContext } from './HotkeysProvider'
+import { useBoundHotkeysProxy } from './BoundHotkeysProxyProvider'
+
+export default function useHotkeys<T extends HTMLElement>(
+  keys: Keys,
+  callback: HotkeyCallback,
+  options?: OptionsOrDependencyArray,
+  dependencies?: OptionsOrDependencyArray,
+) {
+  const ref = useRef<RefType<T>>(null)
+  const { current: pressedDownKeys } = useRef<Set<string>>(new Set())
+
+  const _options = !(options instanceof Array) ? options : !(dependencies instanceof Array) ? dependencies : undefined
+  const _deps = options instanceof Array ? options : dependencies instanceof Array ? dependencies : []
+
+  const cb = useCallback(callback, [..._deps])
+  const ctx = useHotkeysContext()
+
+  const proxy = useBoundHotkeysProxy()
+
+  useLayoutEffect(() => {
+    if (_options?.enabled === false || !isScopeActive(ctx.activeScopes, _options?.scopes)) {
+      return
     }
 
-    // Check whether the hotkeys was triggered inside an input and that input is enabled or if it was triggered by a content editable tag and it is enabled.
-    if (
-      (isKeyboardEventTriggeredByInput(keyboardEvent) && !tagFilter(keyboardEvent, enableOnTags))
-      || ((keyboardEvent.target as HTMLElement)?.isContentEditable && !enableOnContentEditable)
-    ) {
-      return true;
-    }
+    const listener = (e: KeyboardEvent) => {
+      if (isKeyboardEventTriggeredByInput(e) && !isHotkeyEnabledOnTag(e, _options?.enableOnFormTags)) {
+        return
+      }
+
+      if (ref.current !== null && document.activeElement !== ref.current && !ref.current.contains(document.activeElement)) {
+        return
+      }
+
+      if (((e.target as HTMLElement)?.isContentEditable && !_options?.enableOnContentEditable)) {
+        return
+      }
+
+      parseKeysHookInput(keys, _options?.splitKey).forEach((key) => {
+        const hotkey = parseHotkey(key, _options?.combinationKey)
+
+        if (isHotkeyMatchingKeyboardEvent(e, hotkey, pressedDownKeys) || hotkey.keys?.includes('*')) {
+          maybePreventDefault(e, hotkey, _options?.preventDefault)
 
-    if (ref.current === null || document.activeElement === ref.current) {
-      callback(keyboardEvent, hotkeysEvent);
-      return true;
+          if (!isHotkeyEnabled(e, hotkey, _options?.enabled)) {
+            return
+          }
+
+          cb(e, hotkey)
+        }
+      })
     }
 
-    return false;
-  }, deps ? [ref, enableOnTags, filter, ...deps] : [ref, enableOnTags, filter]);
+    const handleKeyDown = (event: KeyboardEvent) => {
+      pressedDownKeys.add(event.key.toLowerCase())
+
+      if ((_options?.keydown === undefined && _options?.keyup !== true) || _options?.keydown) {
+        listener(event)
+      }
+    }
 
-  useEffect(() => {
-    if (!enabled) {
-      hotkeys.unbind(keys, memoisedCallback);
+    const handleKeyUp = (event: KeyboardEvent) => {
+      pressedDownKeys.delete(event.key.toLowerCase())
 
-      return;
+      if (_options?.keyup) {
+        listener(event)
+      }
     }
 
-    // In this case keydown is likely undefined, so we set it to false, since hotkeys needs the `keydown` key to have a value.
-    if (keyup && keydown !== true) {
-      (options as Options).keydown = false;
+    // @ts-ignore
+    (ref.current || document).addEventListener('keyup', handleKeyUp);
+    // @ts-ignore
+    (ref.current || document).addEventListener('keydown', handleKeyDown)
+
+    if (proxy) {
+      parseKeysHookInput(keys, _options?.splitKey).forEach((key) => proxy.addHotkey(parseHotkey(key, _options?.combinationKey)))
     }
 
-    hotkeys(keys, (options as Options) || {}, memoisedCallback);
+    return () => {
+      // @ts-ignore
+      (ref.current || document).removeEventListener('keyup', handleKeyUp);
+      // @ts-ignore
+      (ref.current || document).removeEventListener('keydown', handleKeyDown)
 
-    return () => hotkeys.unbind(keys, memoisedCallback);
-  }, [memoisedCallback, keys, enabled]);
+      if (proxy) {
+        parseKeysHookInput(keys, _options?.splitKey).forEach((key) => proxy.removeHotkey(parseHotkey(key, _options?.combinationKey)))
+      }
+    }
+  }, [keys, cb, _options])
 
-  return ref;
+  return ref
 }

package/src/validators.ts

@@ -0,0 +1,92 @@
+import { FormTags, Hotkey, Scopes, Trigger } from './types'
+
+export function maybePreventDefault(e: KeyboardEvent, hotkey: Hotkey, preventDefault?: Trigger): void {
+  if ((typeof preventDefault === 'function' && preventDefault(e, hotkey)) || preventDefault === true) {
+    e.preventDefault()
+  }
+}
+
+export function isHotkeyEnabled(e: KeyboardEvent, hotkey: Hotkey, enabled?: Trigger): boolean {
+  if (typeof enabled === 'function') {
+    return enabled(e, hotkey)
+  }
+
+  return enabled === true || enabled === undefined
+}
+
+export function isKeyboardEventTriggeredByInput(ev: KeyboardEvent): boolean {
+  return isHotkeyEnabledOnTag(ev, ['input', 'textarea', 'select'])
+}
+
+export function isHotkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags: FormTags[] | boolean = false): boolean {
+  const targetTagName = target && (target as HTMLElement).tagName
+
+  if (enabledOnTags instanceof Array) {
+    return Boolean(targetTagName && enabledOnTags && enabledOnTags.some(tag => tag.toLowerCase() === targetTagName.toLowerCase()))
+  }
+
+  return Boolean(targetTagName && enabledOnTags && enabledOnTags === true)
+}
+
+export function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean {
+  if (activeScopes.length === 0 && scopes) {
+    console.warn(
+      'A hotkey has the "scopes" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'
+    )
+
+    return true
+  }
+
+  if (!scopes) {
+    return true
+  }
+
+  return activeScopes.some(scope => scopes.includes(scope)) || activeScopes.includes('*')
+}
+
+export const isHotkeyMatchingKeyboardEvent = (e: KeyboardEvent, hotkey: Hotkey, pressedDownKeys: Set<string>): boolean => {
+  const { alt, ctrl, meta, mod, shift, keys } = hotkey
+  const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKeyUppercase, code } = e
+
+  const keyCode = code.toLowerCase().replace('key', '')
+  const pressedKey = pressedKeyUppercase.toLowerCase()
+
+  if (altKey !== alt && pressedKey !== 'alt') {
+    return false
+  }
+
+  if (shiftKey !== shift && pressedKey !== 'shift') {
+    return false
+  }
+
+  // Mod is a special key name that is checking for meta on macOS and ctrl on other platforms
+  if (mod) {
+    if (!metaKey && !ctrlKey) {
+      return false
+    }
+  } else {
+    if (metaKey !== meta && keyCode !== 'meta') {
+      return false
+    }
+
+    if (ctrlKey !== ctrl && keyCode !== 'ctrl') {
+      return false
+    }
+  }
+
+  // All modifiers are correct, now check the key
+  // If the key is set we check for the key
+  if (keys && keys.length === 1 && (keys.includes(pressedKey) || keys.includes(keyCode))) {
+    return true
+  } else if (keys) {
+    // Check if all keys are present in pressedDownKeys set
+    return keys.every(key => pressedDownKeys.has(key))
+  }
+  else if (!keys) {
+    // If the key is not set, we only listen for modifiers, that check went alright, so we return true
+    return true
+  }
+
+  // There is nothing that matches.
+  return false
+}

package/src/index.test.tsx

@@ -1,230 +0,0 @@
-import React from 'react';
-import { useHotkeys } from './index';
-import { renderHook } from '@testing-library/react-hooks';
-import { fireEvent, render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import hotkeys from 'hotkeys-js';
-
-const HotkeysOnInput = ({ onPress, useTags }: { onPress: () => void, useTags?: boolean }) => {
-  useHotkeys('a', onPress, { enableOnTags: useTags ? ['INPUT'] : undefined });
-
-  return (
-    <input type='text' data-testid={'input'} />
-  );
-};
-
-const HotkeysFilteredOnInput = ({ onPress, useTags }: { onPress: () => void, useTags?: boolean }) => {
-  useHotkeys('a', onPress, { enableOnTags: useTags ? ['TEXTAREA'] : undefined });
-
-  return (
-    <input type='text' data-testid={'input'} />
-  );
-};
-
-const HotkeysOnKeyup = ({ onPress, keyup, keydown }: { onPress: () => void, keyup?: boolean, keydown?: boolean }) => {
-  useHotkeys('a', onPress, { keyup, keydown });
-
-  return (
-    <input type='text' data-testid={'input'} />
-  );
-};
-
-const HotkeysWithRef = ({ onPress }: { onPress: () => void }) => {
-  const ref = useHotkeys<HTMLElement>('a', onPress);
-
-  return (
-    <section ref={ref} tabIndex={0} data-testid={'container'}>
-      <input type='text' data-testid={'input'} />
-    </section>
-  );
-};
-
-test('useHotkeys should only fire when element is focused if a ref is set.', () => {
-  const onPress = jest.fn();
-
-  render(<HotkeysWithRef onPress={onPress} />);
-
-  userEvent.keyboard('A');
-
-  expect(onPress).not.toBeCalled();
-
-  userEvent.click(screen.getByTestId('container'));
-  userEvent.keyboard('A');
-
-  expect(onPress).toBeCalled();
-});
-
-test('useHotkeys should listen to key presses', () => {
-  const callback = jest.fn();
-
-  renderHook(() => useHotkeys('a', callback));
-
-  userEvent.keyboard('A');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-});
-
-test('useHotkeys correctly assign deps when used as third argument and options being omitted', async () => {
-  let count = 0;
-  const callback = jest.fn();
-
-  renderHook(() => useHotkeys('a', () => callback(++count), [count]));
-
-  userEvent.keyboard('A');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-  expect(callback.mock.calls[0][0]).toEqual(1);
-
-  userEvent.keyboard('A');
-
-  expect(callback).toHaveBeenCalledTimes(2);
-  expect(callback.mock.calls[1][0]).toEqual(2);
-});
-
-test('useHotkeys should use correct char to split combinations', () => {
-  const callback = jest.fn();
-
-  renderHook(() => useHotkeys('Shift-A', callback, { splitKey: '-' }));
-
-  userEvent.keyboard('{Shift>}A{/Shift}');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-
-  userEvent.keyboard('{Shift>}A{/Shift}');
-
-  expect(callback).toHaveBeenCalledTimes(2);
-});
-
-test('useHotkeys should use correctly assign options and deps argument when using all four arguments', () => {
-  const callback = jest.fn();
-
-  renderHook(() => useHotkeys('shift-a', callback, { splitKey: '-' }, []));
-
-  userEvent.keyboard('{Shift>}A{/Shift}');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-
-  userEvent.keyboard('{Shift>}A{/Shift}');
-
-  expect(callback).toHaveBeenCalledTimes(2);
-
-  userEvent.keyboard('{Shift>}A{/Shift}');
-
-  expect(callback).toHaveBeenCalledTimes(3);
-});
-
-test('useHotkeys should only trigger once if neither keyup nor keydown are set', () => {
-  const onPress = jest.fn();
-
-  render(<HotkeysOnKeyup onPress={onPress} />);
-
-  fireEvent.keyUp(document.body, { key: 'a', keyCode: 65 });
-
-  expect(onPress).not.toHaveBeenCalled();
-
-  fireEvent.keyDown(document.body, { key: 'a', keyCode: 65 });
-
-  expect(onPress).toHaveBeenCalled();
-});
-
-test('useHotkeys should only trigger once if keyup is set and keydown is not', () => {
-  const onPress = jest.fn();
-
-  render(<HotkeysOnKeyup onPress={onPress} keyup={true} />);
-
-  fireEvent.keyDown(document.body, { key: 'a', keyCode: 65 });
-
-  expect(onPress).not.toHaveBeenCalled();
-
-  fireEvent.keyUp(document.body, { key: 'a', keyCode: 65 });
-
-  expect(onPress).toHaveBeenCalled();
-});
-
-test('useHotkeys should trigger twice if keyup and keydown is set to true', () => {
-  let called = false;
-
-  render(<HotkeysOnKeyup onPress={() => called = true} keyup={true} keydown={true} />);
-
-  userEvent.keyboard('A');
-
-  expect(called).toBe(true);
-
-  userEvent.keyboard('A');
-
-  expect(called).toBe(true);
-});
-
-test('useHotkeys should be enabled on given form tags', async () => {
-  const onPress = jest.fn();
-  render(<HotkeysOnInput onPress={onPress} useTags={true} />);
-
-  const input = document.querySelector('input');
-
-  expect(input).not.toBe(null);
-
-  userEvent.keyboard('A');
-
-  expect(onPress).toHaveBeenCalled();
-});
-
-test('useHotkeys should not be enabled on given form tags when filter specifies different input field', async () => {
-  const onPress = jest.fn();
-  render(<HotkeysFilteredOnInput onPress={onPress} useTags={true} />);
-
-  userEvent.type(screen.getByRole('textbox'), 'A');
-
-  expect(onPress).toHaveBeenCalledTimes(0);
-});
-
-test('useHotkeys should not be enabled on given form tags when tags is not set', async () => {
-  const onPress = jest.fn();
-  render(<HotkeysFilteredOnInput onPress={onPress} useTags={false} />);
-
-  userEvent.type(screen.getByRole('textbox'), 'A');
-
-  expect(onPress).toHaveBeenCalledTimes(0);
-});
-
-test('useHotkeys should use its own custom filter system instead of the global hotkeys one', () => {
-  const callback = jest.fn();
-  const { rerender } = renderHook((returnFilterVal: boolean = false) => useHotkeys('a', callback, { filter: () => returnFilterVal }));
-
-  userEvent.keyboard('A');
-
-  expect(callback).not.toHaveBeenCalled();
-
-  rerender(true);
-
-  userEvent.keyboard('A');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-});
-
-test('useHotkeys should not be enabled when enabled flag is set to false', () => {
-  const callback = jest.fn();
-
-  const { rerender } = renderHook((enabled: boolean = false) => useHotkeys('a', callback, { enabled }));
-
-  userEvent.keyboard('A');
-
-  expect(callback).not.toHaveBeenCalled();
-
-  rerender(true);
-
-  userEvent.keyboard('A');
-
-  expect(callback).toHaveBeenCalledTimes(1);
-});
-
-test('useHotkeys should unbind the hotkey when enabled is set from true to false', () => {
-  hotkeys.unbind = jest.fn();
-
-  const { rerender } = renderHook((enabled: boolean = true) => useHotkeys('a', () => true, { enabled }));
-
-  expect(hotkeys.unbind).not.toHaveBeenCalled()
-
-  rerender(false);
-
-  expect(hotkeys.unbind).toHaveBeenCalledTimes(2)
-})

package/src/useIsHotkeyPressed.ts

@@ -1,8 +0,0 @@
-import hotkeys from 'hotkeys-js';
-
-/**
- * @deprecated Use isHotkeyPressed instead. Will be removed version 4.
- */
-export function useIsHotkeyPressed() {
-  return hotkeys.isPressed;
-}