meo-canvas - v8.1.0
    Preparing search index...

    Function sequence

    • Chains several animations on one value, each starting where the last finished.

      A Track moves between two values, which covers most of what a scene needs. A value that has to move, wait, and move again — a badge that drops in, pauses, then slides away — would otherwise mean working out each boundary by hand and keeping those numbers in step with every later edit. Declaring the legs instead keeps the arithmetic in one place.

      Returns the same shape a track does, so the two are interchangeable at the call site.

      Type Parameters

      Parameters

      Returns Track<T>

      const badge = sequence({
      from: -28,
      steps: [
      { to: 0, spring: { stiffness: 200, damping: 15 } }, // drop in
      { to: 0, duration: 0.5, hold: 0.35 }, // rest there
      { to: -28, duration: 0.3, ease: 'inCubic' }, // leave
      ],
      delay: 0.35,
      })

      Box({ transform: { translateY: badge.at(page) } })