react-spring-bottom-sheet icon indicating copy to clipboard operation
react-spring-bottom-sheet copied to clipboard

Sheet is changing snapPoint when keyboard is close

Open Guiw5 opened this issue 3 years ago • 3 comments

I'm trying to find a workaround to this case, when I focus on a text input that's on sheet the soft keyboard shows up and the RESIZE event is being dispatched, so

  1. open the sheet till the maxHeight
  2. focus on the input
  3. press "done"/enter/submit key from the keyboard

hopefully a blur event hides the keyboard (not sure why this is not happening, but in the sample I added onkeypress === 'enter' to blur the input and hide the keyboard) then the resize is dispatched but the bottom sheet is going to another snap point (seems to be the closest one to 50% maxHeight since keyboard shrinks the window size to that). I was expecting as result that the sheet should be keeping the current snapPoint you already chose, with or without the keyboard on the screen.

Another thing I intended to do was cancelling the animation stopping the spring event for certain cases like this but I couldn't find the way to do that. Even note that the height probably would have to change to handle the scroll when keyboard is present

https://1lps5.csb.app/

Guiw5 avatar Oct 10 '21 19:10 Guiw5

Thanks for the detailed report 🙏 I'm rewriting the state machine atm and this exactly the type of race condition that I seek to eliminate in the new version 🥷

stipsan avatar Oct 20 '21 12:10 stipsan

Hi @stipsan, thank you for your hard work ! Any news on this issue ? Is there any hack ?

smontlouis avatar Nov 26 '21 07:11 smontlouis

Thanks @stipsan! Is this still being worked on? It makes forms inside the sheet a challenge.

treyhuffine avatar Aug 01 '22 14:08 treyhuffine