search

ssleptsov / ninja-keys

Keyboard shortcuts interface for your website. Working with static HTML, Vanilla JS, Vue, React, Svelte.
https://ninja-keys-demo.vercel.app/
MIT License
1.65k stars 60 forks source link

Can't get command palette to open when <input>, <select>, or <textarea> have focus #43

Closed rickychilcott closed 1 year ago

rickychilcott commented 1 year ago

I couldn't figure out how to get cmd+k or other keyboard shortcuts to work when these elements had the focus within ninja-keys.

However, I was able to get around this by importing the hotkeys-js library myself and following the guidance in their docs (see https://github.com/jaywcjlove/hotkeys#filter)

  import "ninja-keys"
  import hotkeys from "hotkeys-js"
  hotkeys.filter = _event => true

How exactly you implement this for your project is going to depend on what framework you're using, but this might get you close.

Ideally, this would be exposed as an attribute off of ninja-keys or a configuration option, but I wanted to create this issue in case anyone else ran into it.

rickychilcott commented 1 year ago

Also, be aware that if you do this AND some of your hotkeys don't have a modifier key such as command, ctrl, or option you could be in for a world of hurt and bad UX. YMMV