La variante de desplazamiento personalizada de framer-motion se ve afectada por un retraso de otra variante.

Tengo un conjunto de variantes definidas de la siguiente manera:

const letterVariants: Variants = {
  visible: (custom: number) => ({
    opacity: 1,
    y: 0,
    transition: {
      delay: custom * 0.1,
    },
  }),
  hidden: {
    opacity: 0,
    y: 100,
  },
  hover: {
    y: -30,
    transition: {
      delay: 0,
    },
  },
};

que se utilizan para el título principal:

<h1 classname="font-peralta">
  {letters.map((letter, i) => (
    <motion.div classname="inline-block" variants="{letterVariants}" custom="{i}" initial="hidden" animate="visible" whilehover="hover" key="{nanoid()}">
      {letter}
    </motion.div>
  ))}
</h1>

En la representación inicial, cada letra del título principal se desvanece desde abajo. Estoy intentando hacer que cuando se haga hover (antes o después del final de la animación), las letras se deslicen hacia arriba un poco. El problema al que me enfrento es que la transición personalizada delay que permite que las letras aparezcan una por una también se aplica a la variante hover. Por lo tanto, cuando hago hover sobre la primera letra, se mueve hacia arriba y abajo de inmediato; si hago hover sobre la última letra, se levanta pero tarda x * 0.1 segundos en volver a su posición normal.

Es casi exactamente lo mismo que en este post, excepto que esa solución no ha funcionado para mí.