All files / src/value use-on-change.ts

100% Statements 13/13
100% Branches 2/2
100% Functions 7/7
100% Lines 9/9

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 2031x   31x   31x       20x 10x       31x 54x 29x 25x      
import { useEffect } from "react"
import { MotionValue, Subscriber } from "./"
import { isMotionValue } from "./utils/is-motion-value"
 
export function useOnChange<T>(
    value: MotionValue<T> | number | string,
    callback: Subscriber<T>
) {
    useEffect(() => {
        if (isMotionValue(value)) return value.onChange(callback)
    }, [callback])
}
 
export function useMultiOnChange(values: MotionValue[], handler: () => void) {
    useEffect(() => {
        const subscriptions = values.map((value) => value.onChange(handler))
        return () => subscriptions.forEach((unsubscribe) => unsubscribe())
    })
}