@passui/react 0.1.44 → 0.1.45

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@passui/react",
-    "version": "0.1.44",
+    "version": "0.1.45",
     "description": "Passui: native React controls, design tokens, presentation and appearance.",
     "license": "MIT",
     "repository": {

package/src/components/context-menu/context-menu-host.tsx

@@ -5,7 +5,7 @@ import { CheckIcon } from "../../icons/icons"
 import { cn } from "../../lib/class-names"
 import { belongsToFloatingSurface, registerFloatingLayer } from "../../lib/floating-layers"
 import { screenEdges } from "../../lib/screen-edges"
-import { spring, fluidOvershoot } from "../../motion/transitions"
+import { spring, fluidCollapse, fluidOvershoot } from "../../motion/transitions"
 import { concealMenuSource } from "./conceal-menu-source"
 import { findMenuTypeaheadIndex, isMenuNavigationKey, nextMenuIndex } from "./menu-navigation"
 import { menuPosition } from "./menu-position"
@@ -321,7 +321,11 @@ function Menu({ menu }: { menu: OpenMenu }) {
                               }
                             : undefined
                     }
-                    exit={reducedMotion ? { opacity: 0 } : menuSurfaceExit(source)}
+                    exit={
+                        reducedMotion
+                            ? { opacity: 0 }
+                            : { ...menuSurfaceExit(source), transition: fluidCollapse }
+                    }
                     transition={
                         reducedMotion
                             ? { duration: 0 }

package/src/components/popover/popover.tsx

@@ -13,6 +13,7 @@ import { screenEdges } from "../../lib/screen-edges"
 import {
     contentCrossfade,
     floatingPanelMotion,
+    fluidCollapse,
     fluidOvershoot,
     spring,
 } from "../../motion/transitions"
@@ -302,7 +303,11 @@ function OpenPopover({
                               }
                             : undefined
                     }
-                    exit={reducedMotion || !reveal ? { opacity: 0 } : menuSurfaceExit(reveal)}
+                    exit={
+                        reducedMotion || !reveal
+                            ? { opacity: 0 }
+                            : { ...menuSurfaceExit(reveal), transition: fluidCollapse }
+                    }
                     transition={
                         reducedMotion
                             ? { duration: 0 }
@@ -313,6 +318,13 @@ function OpenPopover({
             <motion.div
                 initial={reducedMotion ? false : anchorRef ? { opacity: 0 } : undefined}
                 animate={reducedMotion ? undefined : anchorRef ? { opacity: 1 } : undefined}
+                exit={
+                    reducedMotion
+                        ? undefined
+                        : anchorRef
+                          ? { opacity: 0, transition: { duration: 0.12 } }
+                          : undefined
+                }
                 transition={reducedMotion ? { duration: 0 } : { duration: 0.16, delay: 0.06 }}
             >
                 {children}