How to handle key events when I have global listeners?

[PEZ]

Thanks for providing this component!

I want to control an animation with the slider. So I have only one slider. I want the same things to happen when I press keys like right or left when the slider has focus as when it doesn't have focus. Currently I can control the animation with keys. The slider also has event handlers for the keys, and as I want to control the animation from the slider, it gets to be a double command that I don't know how to deal with. Anyone has some pointers for me?

Possibly related:

• Feature request: provide a way of detecting when react-slider has/loses focus #292

[msf-caesar]

Try with removing the event handlers for key events from the slider component. Instead, add a global event listener that listens for key events regardless of focus. In the event handler for the key events, check if the slider has focus. If it does, control the animation accordingly. This way, you can have consistent control over the animation whether the slider has focus or not.

[PEZ]

Thanks! 🙏 In my case it seems like removing the event handlers for the keys. Will start there.