Updating event type inference

packages/framer-motion/src/utils/__tests__/use-motion-value-event.test.tsx

@@ -0,0 +1,16 @@
+import * as React from "react"
+import { render } from "../../../jest.setup"
+import { useMotionValue } from "../../value/use-motion-value"
+import { useMotionValueEvent } from "../use-motion-value-event"
+
+describe("useMotionValueEvent", () => {
+    test("useMotionValueEvent infers type for change callback", () => {
+        const Component = () => {
+            const x = useMotionValue(0)
+            useMotionValueEvent(x, "change", (latest) => latest / 2)
+            return null
+        }
+
+        render(<Component />)
+    })
+})

packages/framer-motion/src/utils/use-motion-value-event.ts

@@ -5,7 +5,7 @@ export function useMotionValueEvent<
     V,
     EventName extends keyof MotionValueEventCallbacks<V>
 >(
-    value: MotionValue,
+    value: MotionValue<V>,
     event: EventName,
     callback: MotionValueEventCallbacks<V>[EventName]
 ) {

packages/framer-motion/src/value/__tests__/index.test.ts

@@ -2,6 +2,12 @@ import { motionValue } from "../"
 import { animate } from "../../animation/animate"
 
 describe("motionValue", () => {
+    test("change event is type-inferred", () => {
+        const value = motionValue(0)
+
+        value.on("change", (latest) => latest / 2)
+    })
+
     test("change event fires when value changes", () => {
         const value = motionValue(0)
         const callback = jest.fn()