react-modal-sheet

Flexible bottom sheet component built with Framer Motion to provide buttery smooth UX while keeping accessibility in mind πŸͺ

MIT License

Downloads
210.5K
Stars
828
Committers
14
react-modal-sheet - Latest Release

Published by Temzasse 5 months ago

  • Add keyboard avoidance guide and refine docs bdd132d
  • Fix ghost caret issue by blurring focused inputs upon drag start 9f34270
  • Add tolerance to value comparisons d51acb1
  • Cleanup code e4d7b71
  • Fix example dev linking setup ed6265a
  • Add virtual keyboard avoidance example c9aee7d
  • Cleanup examples 9fcb798

https://github.com/Temzasse/react-modal-sheet/compare/v3.0.0...v3.1.0

react-modal-sheet -

Published by Temzasse 5 months ago

⚠️ Breaking changes

The default export of Sheet has been changed to named export:

// ❌ OLD
import Sheet from 'react-modal-sheet';

// βœ… NEW
import { Sheet } from 'react-modal-sheet';

There shouldn't be any other breaking changes (🀞🏻) but some fields in package.json have changed that might affect the way your bundler imports the library so there might be some breaking changes for you depending on what bundler you use.

πŸ¦‹ Full changelog

  • Fix release script 6150b65
  • Merge pull request #141 from Temzasse/tsup 672750b
  • Update github workflow 9ffd87d
  • Add attw to CI checks 74dc61b
  • Update deps and scripts a0281f8
  • Fix broken imports 9b7f54a
  • Update SSR example da85e43
  • Change Sheet default export to named export 6d952de
  • Add eslintignore 08907a2
  • Update example deps 4cefa5f
  • Update min node engine version 4e1fe5c
  • Fix tests 46bd40f
  • Update github action f267a9c
  • Update lint rules and fix issues 46c5f7a
  • Replace tsdx with tsup c76b553

https://github.com/Temzasse/react-modal-sheet/compare/v2.2.1...v3.0.0

react-modal-sheet -

Published by Temzasse 5 months ago

  • Fix the error when touching the screen before <Sheet> is mounted (#152) 14d4585
  • Update disableScrollLocking docs a25d023

https://github.com/Temzasse/react-modal-sheet/compare/v2.2.0...v2.2.1

react-modal-sheet -

Published by Temzasse about 1 year ago

  • Fix framer-motion drag constraints bug ee81930

https://github.com/Temzasse/react-modal-sheet/compare/v2.1.0...v2.2.0

react-modal-sheet -

Published by Temzasse about 1 year ago

  • Use npm instead of yarn 34560f6
  • feat: adds prop to opt-out of scroll-locking (#138) 17f8500
  • Update github actions c463de0

https://github.com/Temzasse/react-modal-sheet/compare/v2.0.0...v2.1.0

react-modal-sheet -

Published by Temzasse over 1 year ago

New features ✨

  • Add Sheet.Scroller component to handle scrolling for sheet content with touch devices. Read more here.

Breaking changes πŸ”₯

  • The springConfig prop has been renamed to tweenConfig in order to reflect the internal change to using tween transition instead of a spring for the sheet animations (spring overshoot was a problem).
  • Change Sheet.Backdrop background color to be translucent black instead of gray to work better with iOS modal effect.
  • Remove unnecessary highlight layer from iOS modal effect.

Changelog

  • Update docs and scrollable snap points example 1e06c2d
  • Simplify and rename sheet transition config prop 5cd8ef3
  • Cleanup code 90e3139
  • Add sheet scroller documentation fc39ac3
  • Change springConfig prop to generic transitionConfig 4566195
  • Update example app 91293f0
  • Update readme styled-component example fbcc7c9
  • Add SheetScroller component 78375c9
  • Update sheet backdrop background color 481ee48
  • Remove ios modal effect highlight 829dcd6
  • Update styled-component dev dep 6092cbf

https://github.com/Temzasse/react-modal-sheet/compare/v1.11.1...v2.0.0

react-modal-sheet -

Published by Temzasse over 1 year ago

  • Fix snap point value calculation b5a11f3
  • Update browserlist db ca03169
  • Update README.md (#125) 406d580

https://github.com/Temzasse/react-modal-sheet/compare/v1.11.0...v1.11.1

react-modal-sheet -

Published by Temzasse over 1 year ago

  • Apply z-index -1 and visibility hidden to closed sheet cf85486
  • Increase min framer-motion dep version to 6 01f112b
  • Update dependencies a0c1f94

https://github.com/Temzasse/react-modal-sheet/compare/v1.10.2...v1.11.0

react-modal-sheet -

Published by Temzasse over 1 year ago

  • Fix sheet not closing properly after slow drag to bottom (#116) b71a6fa

https://github.com/Temzasse/react-modal-sheet/compare/v1.10.1...v1.10.2

react-modal-sheet -

Published by Temzasse over 1 year ago

  • Remove react-merge-refs dependency 414653f
  • feat: add simple mergeRefs functions (#112) e3a577d

https://github.com/Temzasse/react-modal-sheet/compare/v1.10.0...v1.10.1

react-modal-sheet -

Published by Temzasse almost 2 years ago

  • Ignore broken tests 95a88c4
  • Update package.json node engines to 16 308074d
  • Update example deps 937a4b0
  • Update deps and fix scroll prevention issue on ios f0ff45f

https://github.com/Temzasse/react-modal-sheet/compare/v1.9.0...v1.10.0

react-modal-sheet -

Published by Temzasse almost 2 years ago

  • Pass provided className to sheet components dd22d82
  • remove border from backdrop (#107) 83dc1a9

https://github.com/Temzasse/react-modal-sheet/compare/v1.8.1...v1.9.0

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Fix for disableDrag not working on Sheet Content and Sheet Header (#100) e3ddf34
  • Fix broken detents link 75e6b78

https://github.com/Temzasse/react-modal-sheet/compare/v1.8.0...v1.8.1

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Simplify code 2aee840
  • Skip y animation if user prefers reduced motion (#97) 915e8aa
  • Add logo banner to readme 56fbb46

https://github.com/Temzasse/react-modal-sheet/compare/v1.7.0...v1.8.0

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Cleanup unused code 298c186
  • Sheet detents (#96) 3302d71

https://github.com/Temzasse/react-modal-sheet/compare/v1.6.3...v1.7.0

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Remove broken y value transformation 31890ee

https://github.com/Temzasse/react-modal-sheet/compare/v1.6.2...v1.6.3

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Restrict sheet y value to be positive f4236c4
  • Improve body scroll locking 1dd08e8
  • Update examples to use latest react-aria and react-stately 3d0ff62

https://github.com/Temzasse/react-modal-sheet/compare/v1.6.1...v1.6.2

react-modal-sheet -

Published by Temzasse about 2 years ago

react-modal-sheet -

Published by Temzasse about 2 years ago

  • Add mountPoint to readme 379dbdb
  • Make the style prop of Sheet functional (#93) f19e7ba
  • feat: mount point (#94) 096275c

https://github.com/Temzasse/react-modal-sheet/compare/v1.5.2...v1.6.0

react-modal-sheet -

Published by Temzasse over 2 years ago

  • Fix typing issues 39c3930
  • Update typescript and framer-motion deps 5f53349
  • Update framer-motion peer dep version 058c852

https://github.com/Temzasse/react-modal-sheet/compare/v1.5.1...v1.5.2

Package Rankings
Top 2.1% on Npmjs.org
Related Projects