mirror of
https://github.com/warmbly/warmbly.git
synced 2026-09-05 16:02:48 +00:00
Matthew Meszaros
e1a1b0a4c9
PopoverMenuContent was rendering / unmounting with no transition.
After the previous fix made all the dropdowns actually work, the
abrupt pop-in felt cheap compared to the rest of the chrome where
dialogs and sheets all animate.
Now each menu enters and exits like a shadcn-flavored popover:
initial: opacity 0, scale 0.96, y −4 (for bottom-anchored)
enter: opacity 1, scale 1, y 0 over 180ms with a snappy
out-curve (cubic-bezier
.16, 1, .3, 1)
exit: opacity 0, scale 0.97, y −2 slightly faster
Two details that make it feel deliberate rather than generic:
- transformOrigin is anchored to the trigger corner. align="end"
opens top-right, align="start" top-left, center top-center. Same
for side="top" (origin flips to bottom-x). The menu visibly
unfolds out of the trigger instead of floating in from nowhere.
- enter Y direction is sign-flipped for top-anchored menus, so the
composer's "Schedule" dropdown (side="top") rises up from the
trigger and falls back into it on close — matching the spatial
expectation set by where it opens.
Items don't stagger individually — same restraint shadcn uses; one
container animation reads cleaner than a cascade and stays fast.
Wrapped in AnimatePresence so exit animations get the chance to
play before unmount. willChange: transform, opacity hints the
compositor for a smoother frame.