Skip to content

Releases: JohannesKlauss/react-hotkeys-hook

v4.1.0-1

25 Dec 12:54
Compare
Choose a tag to compare
v4.1.0-1 Pre-release
Pre-release

Streamline pressed down keys handling. Remove doubled set from useHotkeys. Add special handling for meta key

Full Changelog: v4.1.0-0...v4.1.0-1

v4.1.0-0

25 Dec 11:34
Compare
Choose a tag to compare
v4.1.0-0 Pre-release
Pre-release

Fixed Meta key issue in macOS

Full Changelog: v4.0.8...v4.1.0-0

v4.0.8

22 Dec 12:44
Compare
Choose a tag to compare

What's Changed

  • Fix rerender when using HotkeysProvider and a bug in removing bound hotkeys by @JohannesKlauss in #875

Full Changelog: v4.0.7...v4.0.8

4.0.7

22 Dec 12:15
Compare
Choose a tag to compare

What's Changed

New Contributors

Full Changelog: v4.0.6...v4.0.7

4.0.3

08 Nov 16:01
Compare
Choose a tag to compare

🐛 Bugfixes

  • Fix #827 (window is not defined). Ensure compat with SSR rendering by guarding access of window object

4.0.2

04 Nov 15:08
Compare
Choose a tag to compare

🏗️ Improvements

  • Greatly reduce bundle size by tree shaking lodash

4.0.1

04 Nov 14:58
Compare
Choose a tag to compare

Chore

  • Bump lodash version to mitigate security issues

4.0.0

04 Nov 14:45
Compare
Choose a tag to compare

🎉 Happy Release day Version 4!

Note that there are a lot of breaking changes, so it will be unlikely that your app won't need any updating.

🚨 Breaking Changes

  • filter merges into enabled
  • enabled takes a Trigger. A trigger can either be a boolean or a a function that return a boolean to determine if the option should trigger. The function gets the keyboardEvent and the hotkeysEvent which you can use to determine if the hotkey should be enabled or not.
  • splitKey is now called combinationKey (still defaults to +)
  • splitKey now refers to the separation of keystrokes (defaults to ,)
  • The dependency list is now properly typed as DependencyList instead of any[]
  • cmd and command hotkeys are not longer available. Use meta instead.
  • enableOnTags has been renamed to enableOnFormTags

➕ Features useHotkeys

Arguments

  • The options object and the dependency array are swappable. This means that you can call useHotkeys in multiple ways:
    • useHotkeys('ctrl+a', () => console.log('pressed'))
    • useHotkeys('ctrl+a', () => console.log('pressed'), options)
    • useHotkeys('ctrl+a', () => console.log('pressed'), [dependencyA, dependencyB])
    • useHotkeys('ctrl+a', () => console.log('pressed'), options, [dependencyA, dependencyB])
    • useHotkeys('ctrl+a', () => console.log('pressed'), [dependencyA, dependencyB], options) (possible, but not recommended, might be dropped for release)
  • The first argument can be an array: useHotkeys(['ctrl+a', 'shift+b'], () => console.log('pressed'))

Scopes

  • Scopes You can now group hotkeys together in scopes. To use that feature you need to wrap your app in a <HotkeysProvider> component. Scopes are toggled by using the useHotkeysContext() hook. It returns the following functions:
    • enableScope: (scope: string) => void - Activates given scope, i.e. activateScope('settings')
    • disableScope: (scope: string) => void - Deactivates given scope, i.e. deactivateScope('settings')
    • toggleScope: (scope: string) => void - Toggles a given scope, i.e. toggleScope('settings')
    • enabledScopes: string[] - Returns an array with all active scopes (defaults to ['*'] for wildcard)
    • hotkeys: Hotkey[] - Returns an array of all currently bound hotkeys
    • The default scope is * which matches all hotkeys no matter their scope(s).
  • To set a scope to a hotkey, use the scopes option in the options object: useHotkeys('a', () => console.log('I am in scope settings'), {scopes: 'settings'}). This hotkey will only be active, when the "settings" scope is activated.
    • A hotkey can hold multiple scopes: useHotkeys('a', () => console.log('I am in scope settings'), {scopes: ['settings', 'profile']})`

Options

  • enabled takes a Trigger. A trigger can either be a boolean or a a function that return a boolean to determine if the option should trigger. The function gets the keyboardEvent and the hotkeysEvent which you can use to determine if the hotkey should be enabled or not. Default is true.
  • preventDefault take a Trigger to determine if the browsers default behavior should be prevented (calling e.preventDefault() internally if Trigger resolves to true). Defaults to false.
  • enableOnTags now also accepts a boolean. If set to true, all form Tags will be enabled (defaults to false)

➕ Features isHotkeyPressed

  • takes an array or string as first argument to check if the key or combination of keys is currently pressed down: isHotkeyPressed('a') | isHotkeyPressed(['a', 'b']) | isHotkeyPressed('a, b')
  • takes a splitKey string to split between hotkeys (only works if first argument is a string): isHotkeyPressed('a+,', '+')

Detailed Info can be found in the documentation: https://react-hotkeys-hook.vercel.app/docs/intro

4.0.0-7

04 Nov 13:48
Compare
Choose a tag to compare
4.0.0-7 Pre-release
Pre-release

🚨 Breaking Changes

  • Rename activateScope to enableScope, deactivateScope to disableScope and activeScopes to enabledScopes

4.0.0-6

04 Nov 13:36
Compare
Choose a tag to compare
4.0.0-6 Pre-release
Pre-release

🐛 Bugfixes

  • Map left to arrowLeft, right to arrowRight, etc.