jaywcjlove / react-hotkeys

There doesn't seem to be a way to configure this to handle events when an input is selected. I read the source code a bit and it seems like this is intentional, but I'm wondering if you have plans to support it?

My use case is: I would like to allow users to hit esc from a search box to dismiss & hide the search box. Similar to GitHub's new search box: hit "S" to activate search, hit escape to deactivate.

I'm not exactly sure how these scope things work, but it seems like this is what prevents hotkeys from activating from inputs:

react-hotkeys/src/index.js

Lines 5 to 9 in fab7c64

    
           Hotkeys.filter = function (event) { 
        
             const tagName = (event.target || event.srcElement).tagName; 
        
             Hotkeys.setScope(/^(INPUT|TEXTAREA|SELECT)$/.test(tagName) ? 'input' : 'other'); 
        
             return true; 
        
           };

@mklbtz

filter

INPUT SELECT TEXTAREA default does not handle. filter to return to the true shortcut keys set to play a role, flase shortcut keys set up failure. Reference hotkeys documentation.

<Hotkeys 
  keyName="shift+a,alt+s" 
+  filter={(event) => {
+    return true;
+  }}
  onKeyDown={this.onKeyDown.bind(this)}
  onKeyUp={this.onKeyUp.bind(this)}
/>

That's perfect! Thank you so much for the speedy response. ❤️

I just want to comment not because I agree or disagree with anything here but because I have never read a more twisted, messed up, "no logic put into it" description. Seriously Hotkeys people??? Have you read that little block of text? "default does not handle" - what the hell should that supposed to mean?? "filter to return to the true shortcut keys set to play a role" - why would you use commas or any logic when writing documentation that others will depend on? I remember when I needed this feature I had to spend hours searching through the web trying to find another person who implemented it and explained it themselves because their description didn't make any sense what so ever.
Other then that, good job guys with the whole Hotkeys thing! My team uses it and we are happy because of it (well, mostly...)!

@REX500

Sorry, My English is pretty limited. I helped me understand and answer questions through Google Translate. This maybe have inaccurate answers.

	Hotkeys.filter = function (event) {
	const tagName = (event.target \|\| event.srcElement).tagName;
	Hotkeys.setScope(/^(INPUT\|TEXTAREA\|SELECT)$/.test(tagName) ? 'input' : 'other');
	return true;
	};

Allow hot keys from input fields?

filter