Bottomsheet guidelines - Audentio/components GitHub Wiki

  • should have a close/collapse button in case swiping is not reliably working for the user
  • should try to swipe the sheet down when there's no more inner content to scroll
    • currently not possible to do without lags on web afaik - please update if you have a solution
  • should collapse onTouchStart outside sheet
    • user is probably trying to interact with primary content and sheet should collapse
    • on desktop this should happen on onMouseDown (and overlay should instantly have pointer-events: none) so click events still fire in primary content
  • should always have a >=20px area on top with a handle.
    • This is to ensure bottomsheets are always distinct from other UI elements throughout the experience