All files / src/value use-velocity.ts

100% Statements 8/8
100% Branches 0/0
100% Functions 3/3
100% Lines 8/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 2631x   31x                       31x 8x   8x 2x 25x       8x    
import { useEffect } from "react"
import { MotionValue } from "."
import { useMotionValue } from "./use-motion-value"
/**
 * Creates a `MotionValue` that updates when the velocity of the provided `MotionValue` changes.
 *
 * ```javascript
 * const x = useMotionValue(0)
 * const xVelocity = useVelocity(x)
 * const xAcceleration = useVelocity(xVelocity)
 * ```
 *
 * @public
 */
export function useVelocity(value: MotionValue<number>): MotionValue<number> {
    const velocity = useMotionValue(value.getVelocity())
 
    useEffect(() => {
        return value.velocityUpdateSubscribers.add((newVelocity) => {
            velocity.set(newVelocity)
        })
    }, [value])
 
    return velocity
}