Guides
Gestures and scroll
Configure swipe-to-dismiss and avoid gesture conflicts with scrollable content.
Swipe-to-dismiss defaults to the downward direction:
magicModal.show(() => <ProfileModal />, {
swipeDirection: "down",
swipeVelocityThreshold: 500,
dampingFactor: 0.2,
});Choose "up", "down", "left", or "right". Magic Modal uses Gesture Handler 3's
usePanGesture when available and automatically falls back to the Gesture Handler 2 builder.
Scrollable content
A scroll view and a dismiss gesture compete for the same touch stream. Disable modal swipe for scroll-heavy content:
magicModal.show(() => <TermsModal />, {
swipeDirection: undefined,
});The backdrop and Android back button still close the modal unless you override their handlers.
Building a bottom sheet?
If the interaction needs snap points, nested scrolling, or continuously draggable content, use a dedicated bottom-sheet library. Disabling swipe makes ordinary modal forms and lists reliable.