¿Framer Motion exit y AnimatePresence no están funcionando en Nextjs?

Mi prop exit o AnimatePresence no está funcionando.

Mi variante:

const imgVariant = {
initial: {
opacity: 0,
y: -100,
},
animate: {
opacity: 1,
y: 0,
transition: {
type: "spring",
stiffness: 20,
},
},
exit: {
opacity: 0,
y: 500,
transition: {
duration: 5,
},
},
};


Mi código:

<div className="h-screen bg-neutral-200 flex overflow-hidden">

<pre><code>    <AnimatePresence exitBeforeEnter>

      <div className="w-full grid place-items-center">
        <motion.img
          src={product.image}
          alt={product.name}
          className="h-[400px] object-cover z-10 cursor-pointer"
          variants={imgVariant}
          initial="initial"
          animate="animate"
          exit="exit"
          drag
          dragConstraints={{ top: 0, left: 0, right: 0, bottom: 0 }}
        />
      </div>
   </AnimatePresence>
</code></pre>

<p></div>

initial y animate funcionan normalmente, pero la animación de salida no se activa cuando cambio de ruta, ¿estoy haciendo algo mal aquí?