Drawer
after Emil Kowalski
A drawer that rises from the bottom, drags and flicks away, and makes the page behind it recede.
npx shadcn@latest add https://piruicy.com/r/drawer.json
Details
- 500ms on cubic-bezier(0.32, 0.72, 0, 1), the iOS-like curve Vaul uses.
- While dragging, the transform is written straight onto the drawer; an inherited CSS variable made every descendant restyle and lag.
- It closes past 30% of its height or on a flick faster than 0.4 px/ms; pulled up past open, it resists more the further it goes.
- It never drags while its content is scrolled, nor within 100ms of that content reaching the top, and a second finger is ignored.
- A real dialog: focus moves in and stays, Escape closes, and focus returns to what opened it.
© 2026 Dhaval Khandhadia. Use it in anything you build; don’t resell it. MIT with the Commons Clause.