Svaul
A drawer component for svelte 5. Feature rich, built from scratch with svelte runes and with no dependencies.
$ npm i
@harshmandan/svaul Inspired by vaul and vaul-svelte.
Scroll to view examples
Essentials
Non-dismissible
Closes only from its own button.
Scrolling content
Has a scrollable area inside.
Form & keyboard
Stays above the mobile keyboard.
Non-draggable region
Part of it ignores drags.
Gestures & snapping
Snap points
Rests at three heights; tap the handle to cycle.
Handle only
Only the handle drags it.
Amplified drag
Moves twice as far as the pointer.
Direction
Top drawer
Slides in from the top.
Left drawer
Slides in from the left.
Right drawer
Slides in from the right.
Styling & motion
Dark theme
A dark panel.
No background scale
The page stays still behind it.
Custom scale tint
Tints the page behind it orange.
Instant (no transitions)
Opens and closes with no animation.
Nested drawers
Drawers stacked on top of each other.