Animating Quaternions in three js fiber?

[Decycle]

Hello,
I was trying to make a rolling dice that uses react-spring. After giving up on using Euler values, I decided to use quaternions. However, I don't know how to pass the quaternion I made to the props in animated.mesh. Can someone help me?

const Scene = () => {
  const [{ rotation }, api] = useSpring(() => ({
    rotation: [0, 0, 0, 0] as [
      x: number,
      y: number,
      z: number,
      w: number
    ],
    config: config.gentle,
  }))

  return (
  <animated.mesh
    quaternion={rotation} //doesn't work
  >
    <boxGeometry attach='geometry' args={[1, 1, 1]} />
    <meshStandardMaterial map={diceTexture} />
  </animated.mesh>
  )
}

[RafayelKh]

Hey @Decycle, did you find any solutions?