Side modal closure confirmation popover

[hjbrown11]

Hi team,

I was recently implementing a side modal and attempting to have a popover appear not only when you press the close button, but also on press of the escape key. In the example I made, if a user presses the close button with the form dirty, we open an alert dialogue which asks if they want to save their changes or cancel them, however I have been unable to replicate this behaviour with the escape key so the form closes in a dirty and neither saved nor cancelled state.

It would be great if this component had an easy way to replicate close button behaviour on Esc key press!

[SiTaggart]

Hi @hjbrown11

In theory this should be possible as there should be a hideOnEsc prop that you can toggle to false. In practice, that doesn't seem to work and might be a bug. I'll investigate this more and see if we can schedule a fix to unblock this.

Thanks

[hjbrown11]

Hi @SiTaggart - thanks so much, I was struggling to find a way to mirror the behaviour, appreciate your input 😊

[TheSisb]

Small update: a hideOnEsc prop will be added in the next version of Paste Core (when this PR merges: #3297)

[SiTaggart]

An example Codesandbox (don't judge my code) is now available demo'ing this https://codesandbox.io/s/sidemodal-esc-zj4r8c?file=/src/index.tsx