Title
Drawer scrollable content conflicts with drawer swipe/drag gestures
Body
Description
In the Drawer Scrollable content example from the docs:
https://coss.com/ui/docs/components/drawer#scrollable-content
the scrollable content area appears to conflict with the Drawer swipe/drag gesture. When trying to drag the scrollbar/
thumb or scroll inside the drawer content, the drawer drag/dismiss gesture can take over, making the scrollbar
difficult or impossible to drag reliably.
Steps to reproduce
- Open the Drawer docs page:
https://coss.com/ui/docs/components/drawer#scrollable-content
- Open the "Scrollable content" drawer example.
- Try to drag the scrollbar/thumb inside the drawer content area.
- Also try scrolling near the scroll boundary.
Actual behavior
The drawer's drag/swipe behavior competes with the scrollable area. In some cases, dragging the scrollbar or scroll
area moves/dismisses the drawer instead of scrolling the content.
Expected behavior
Scrollable content inside DrawerPanel should take priority over drawer drag gestures. Users should be able to drag
the scrollbar/thumb and scroll the content without accidentally dragging or dismissing the drawer.
Possible solutions
-
Provide a public prop to disable drawer swipe dismissal, for example:
<Drawer disableSwipeDismissal>
...
</Drawer>
-
Or make DrawerPanel / ScrollArea stop drawer swipe handling while the user is interacting with scrollable content.
-
Or ignore drawer swipe gestures that originate from the scrollbar/thumb or scrollable viewport.
Context
This is especially noticeable when using DrawerPanel for long lists or settings panels where scrolling is the primary
interaction. The current behavior makes scrollable drawers hard to use on touch devices and with custom scrollbars.
Title
Drawer scrollable content conflicts with drawer swipe/drag gestures
Body
Description
In the Drawer
Scrollable contentexample from the docs:https://coss.com/ui/docs/components/drawer#scrollable-content
the scrollable content area appears to conflict with the Drawer swipe/drag gesture. When trying to drag the scrollbar/
thumb or scroll inside the drawer content, the drawer drag/dismiss gesture can take over, making the scrollbar
difficult or impossible to drag reliably.
Steps to reproduce
https://coss.com/ui/docs/components/drawer#scrollable-content
Actual behavior
The drawer's drag/swipe behavior competes with the scrollable area. In some cases, dragging the scrollbar or scroll
area moves/dismisses the drawer instead of scrolling the content.
Expected behavior
Scrollable content inside
DrawerPanelshould take priority over drawer drag gestures. Users should be able to dragthe scrollbar/thumb and scroll the content without accidentally dragging or dismissing the drawer.
Possible solutions
Provide a public prop to disable drawer swipe dismissal, for example:
Or make DrawerPanel / ScrollArea stop drawer swipe handling while the user is interacting with scrollable content.
Or ignore drawer swipe gestures that originate from the scrollbar/thumb or scrollable viewport.
Context
This is especially noticeable when using DrawerPanel for long lists or settings panels where scrolling is the primary
interaction. The current behavior makes scrollable drawers hard to use on touch devices and with custom scrollbars.