UNPKG

@atlaskit/motion

Version:

A set of utilities to apply motion in your application.

32 lines 1.08 kB
import { useCallback, useEffect, useRef } from 'react'; import { getHookDeps } from './get-hook-deps'; /** * Will return request animation frame as a function which will clean itself up. */ export var useRequestAnimationFrame = function useRequestAnimationFrame() { var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : { cleanup: 'unmount' }; var frames = useRef([]); useEffect(function () { return function () { if (frames.current.length) { frames.current.forEach(function (id) { return cancelAnimationFrame(id); }); frames.current = []; } }; // We dynamically set this so we either clean up on the next effect - or on unmount. // eslint-disable-next-line react-hooks/exhaustive-deps }, getHookDeps(opts)); return useCallback(function (handler) { var id = requestAnimationFrame(function (time) { frames.current = frames.current.filter(function (frameId) { return frameId !== id; }); handler(time); }); frames.current.push(id); }, []); };