Triggers while focussed on input field since v3.0.0

[laurensnl]

Since updating to v3.0.0, the hotkeys also trigger while entering text in an input field.

I use the hook like this:

useHotkeys('d', () => toggle());

[JohannesKlauss]

Weird, I'll look into it. Thanks for raising the issue.

[JohannesKlauss]

Fixed in 3.0.1

[richardsolomou]

@JohannesKlauss This seems to still be affecting elements with contenteditable

[laurensnl]

After the update to v3.0.1, I get this error when pressing a hotkey while focussed on an input field:

Cannot read property 'enableOnTags' of undefined

[houmark]

I can confirm getting the same error as @laurensnl

[JohannesKlauss]

I am sorry, I'll look into it. Shouldn't create a major update before the holidays, haha.

[JohannesKlauss]

Should be fixed with 3.0.2

[laurensnl]

The good news is that the error is gone. The bad news is that letters that are assigned to an hotkey cannot be entered in input fields anymore.

Example
I have assigned the 'd' key as an hotkey:

useHotkeys('d', () => toggleDarkMode());

When I'm typing in a text field, I can not enter a 'd'.

[JohannesKlauss]

Fixed with 3.0.3

[laurensnl]

Thanks @JohannesKlauss! I can confirm that everything works as expected now. 🎉

[richardsolomou]

@JohannesKlauss This is still affecting elements with contenteditable

[JohannesKlauss]

@richardsolomou I'll try to have a look at it over the weekend.

[rvrheenen]

@JohannesKlauss This is still affecting elements with contenteditable

I had the same problem, and I found a workaround for in the meantime:

const useHotkeyPreventer = (ref) => {
  if (ref.current) {
    ref.current.onKeyDown = (event) => {
      event.stopPropagation();
    };
  }
};

const ref = useRef(null);
useHotkeyPreventer(ref);

and in the rendering part:

<ComponentThatIsEditable contentEditable="true" ref={ref} />

[JohannesKlauss]

@richardsolomou Finally fixed this behavior in the 3.3.0 version.
If a target element has its contentEditable attribute set to true, hotkeys won't trigger.