How to use the @popmotion/popcorn.mix function in @popmotion/popcorn

update: ([va, vb]: [number, number]) => {
        observer.update(mix(va, vb, balance));
      }
    });

const applyOverdrag = (
    origin: number,
    current: number,
    dragElastic: boolean | number
) => {
    const dragFactor = typeof dragElastic === "number" ? dragElastic : 0.35
    return mix(origin, current, dragFactor)
}

function applyOverdrag(
    origin: number,
    current: number,
    dragElastic: boolean | number
) {
    const dragFactor = typeof dragElastic === "number" ? dragElastic : 0.35
    return mix(origin, current, dragFactor)
}

export const steps = (st: number, min = 0, max = 1) => (v: number) => {
  const current = progress(min, max, v);
  return mix(min, max, stepProgress(st, current));
};

const randomInt = (min, max) => Math.round(mix(min, max, Math.random()))
const generateParagraphLength = () => randomInt(10, 40)

const randomInt = (min, max) => Math.round(mix(min, max, Math.random()))
const generateParagraphLength = () => randomInt(5, 20)

map(p => {
              recyclable[2] = mix(start, target, easing(p))
              return recyclable
            }),
            takeUntil(