Scoll animation loop

Hey. I have an character jumping up and down in a loop. Have a number input and blended animations and i want to play the animation when user scroll down on a framer site. Have pasted this into framer, but it doen't seems to work probably.

import React, { useState } from "react"
import { addPropertyControls } from "framer"
import RiveComponent, {
    componentName,
    propertyControls,
} from "https://rive.app/api/s/-nDwES5_dEeOt7ZvOtV7dg/framer/"
import { useScroll, useMotionValueEvent } from "framer-motion"
function App(props) {
    const { scrollYProgress } = useScroll()
    const [scrollPct, setScrollPct] = useState(0)
    useMotionValueEvent(scrollYProgress, "change", (latest) => {
        setScrollPct(latest * 200)
    })
    return <RiveComponent {...props} number1={scrollPct} number2={scrollPct} />
}
/**
@framerSupportedLayoutWidth any-prefer-fixed
@framerSupportedLayoutHeight any-prefer-fixed
*/
export default App as React.ComponentType
App.displayName = componentName
addPropertyControls(App, propertyControls)