search

formaat-design / reshaped

Community repository for storing examples, reporting issues and tracking roadmap
https://reshaped.so
97 stars 3 forks source link

Allow Modal's to scroll on mobile devices #242

Closed petewins closed 2 months ago

petewins commented 2 months ago

Is your feature request related to a problem? Please describe. On mobile, user's can't scroll up inside a modal, It seems they are able to scroll down but scrolling back up will trigger the modals swipe to close.

Describe the solution you'd like Not sure what will be the ideal solution, but one thing that comes to mind is a prop to opt-out?

Describe alternatives you've considered Might add an onMove event.stopPropagation() on my overflow container to temp prevent this behavior

example: Mobile devices currently can't scroll up, it closes the modal instead

https://github.com/formaat-design/reshaped/assets/19542805/42697aee-9bee-4d34-8e81-f83c1cd6cc8d

blvdmitry commented 2 months ago

Good point, I think it might be better to prevent swiping while scrolling is meant to happen first of all (can detect that based on the elements dimensions and scroll position). That should resolve the issue without opting-out manually with a prop

blvdmitry commented 2 months ago

Can you check if this works for you in 2.10.19? There already was partial handling of this use case which I forgot existed but it wasn't handling it correctly in some cases

https://github.com/formaat-design/reshaped/assets/887379/fdd29f6b-fda8-4da7-acb9-7778df086d14

petewins commented 2 months ago

@blvdmitry, works as expected now, thank you for a quick fix