Temzasse / react-modal-sheet

Flexible bottom sheet component built with Framer Motion to provide buttery smooth UX while keeping accessibility in mind ๐Ÿช
https://temzasse.github.io/react-modal-sheet/
MIT License
783 stars 74 forks source link

Is it possible to set snapshot as the content height value? #69

Closed jungpaeng closed 1 year ago

jungpaeng commented 2 years ago

If the content height is 300, I would like to set the snapshot to 300. Also, if the height of the content changes, I want to recognize it.

jungpaeng commented 2 years ago

It is similar to this issue. #46 In react-spring-bottom-sheet, the minHeight argument is provided to the snapshot points

milosjovancevic commented 1 year ago

Hello folks, any updates on this? On my project I have 3 or 4 sheet's with different children(height). Any idea how to make Sheet height dynamic?

milosjovancevic commented 1 year ago

Hello again, After some time spent on figuring out solution (I failed to do so) I came by a pull request opened in repository https://github.com/Temzasse/react-modal-sheet/pull/83 which solved the problem I had. Since my project deadline is soon I decided to fork the solution from this exceptional gentleman & developer @nickgraffis and publish it in npm. Here is the link in case someone needs it https://www.npmjs.com/package/@milosj/react-modal-sheet

After that you just add useContentHeight prop to your Sheet component and everything works like a charm. Sheet height is adjusted to the height of the children.

Once more big thanks to @nickgraffis!

Best regards, Miloลก

Temzasse commented 1 year ago

Sorry for taking so long to respond to this ๐Ÿ˜…

I took a look at the PR and it seems like a good change (just need to resolve some prop naming nit picks). I wonder if there are other things that should be taken into account for this to work as people expect ๐Ÿค” I guess we can publish the fix from Nick and figure out other things later if this change already helps people.

aliceathens commented 1 year ago

Sorry for taking so long to respond to this ๐Ÿ˜…

I took a look at the PR and it seems like a good change (just need to resolve some prop naming nit picks). I wonder if there are other things that should be taken into account for this to work as people expect ๐Ÿค” I guess we can publish the fix from Nick and figure out other things later if this change already helps people.

I would really appreciate this feature!

Temzasse commented 1 year ago

Sheet detent is now implemented in v1.7.0. Please let me know if it doesn't solve your content height related issues ๐Ÿ™‚