uwrit / leaf

Leaf Clinical Data Explorer
https://www.youtube.com/watch?v=ZuKKC7B8mHI
Other
86 stars 47 forks source link

Enter and Escape keys don't work in modals dialogs #473

Open jnothman opened 2 years ago

jnothman commented 2 years ago

We are finding that pressing Escape and Enter on the keyboard does nothing when a modal dialog is open. Is this a known issue?

ndobb commented 2 years ago

This is a great point regarding usability, thanks @jnothman. Currently the web client only listens for mouse clicks, rather than keyboard events. I'll add as an enhancement.

jnothman commented 2 years ago

Also happy to make it an open source contribution, but am not highly familiar with the reactstrap context. The impression I get is that by default Escape should work, since keyboard=True; and perhaps its not working has something to do with toggle not being defined? But since the reactstrap Modal attribute descriptions appear nonexistent this is only a guess???

Issues like https://github.com/reactstrap/reactstrap/issues/1281 imply to me that one way to get Enter (or other browser equivalent) working is to make sure that <Modal> includes a <form> with onsubmit defined as equivalent to the Primary button's click handler.