How to simplify multiple useTransform calls, which have the same inputs?

[oemer-aran]

I am looking for guidance to simplify the following code:

  const styles = {
    opacity: useTransform(scrollYProgress, [0.3, 0.6], ["0", "1"]),
    x: useTransform(scrollYProgress, [0.3, 0.6], ["50vw", "0vw"]),
    y: useTransform(scrollYProgress, [0.3, 0.6], ["50vw", "0vw"]),
    filter: useTransform(scrollYProgress, [0.3, 0.6], ["blur(100px)", "blur(0px)"]),
  };
   // ...
  return <motion.div styles={styles] />

Desired solution:

 const styles = useTransforms(scrollYProgress, [0.3, 0.6], {
   opacity: ["0", "1"],
   x: ["50vw", "0vw"],
   y: ["50vw", "0vw"],
   filter: ["blur(100px)", "blur(0px)"],
 });

Maybe I am doing it in a completely unintended way. Please enlighten me if you can!