refun/node/map-safe-request-animation-frame.js

A collection of React Hook-enabled functions that compose harmoniously with each other. Similar to `recompose`, but:

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.mapSafeRequestAnimationFrame = exports.mapSafeRequestAnimationFrameFactory = void 0;

var _react = require("react");

var _tsfn = require("tsfn");

const mapSafeRequestAnimationFrameFactory = (requestAnimationFrameFn, cancelAnimationFrameFn) => propName => props => {
  const timerIdsRef = (0, _react.useRef)(_tsfn.EMPTY_OBJECT);
  const setSafeRafRef = (0, _react.useRef)();
  const useEffectFnRef = (0, _react.useRef)();

  if (setSafeRafRef.current === _tsfn.UNDEFINED) {
    timerIdsRef.current = new Set();

    setSafeRafRef.current = cb => {
      if (timerIdsRef.current === _tsfn.EMPTY_OBJECT) {
        return _tsfn.NOOP;
      }

      const timerId = requestAnimationFrameFn(() => {
        timerIdsRef.current.delete(timerId);
        cb();
      });
      timerIdsRef.current.add(timerId);
      return () => {
        cancelAnimationFrameFn(timerId);
        timerIdsRef.current.delete(timerId);
      };
    };

    useEffectFnRef.current = () => () => {
      timerIdsRef.current.forEach(id => cancelAnimationFrameFn(id));
      timerIdsRef.current.clear();
      timerIdsRef.current = _tsfn.EMPTY_OBJECT;
    };
  }

  (0, _react.useEffect)(useEffectFnRef.current, _tsfn.EMPTY_ARRAY);
  return { ...props,
    [propName]: setSafeRafRef.current
  };
};

exports.mapSafeRequestAnimationFrameFactory = mapSafeRequestAnimationFrameFactory;
const mapSafeRequestAnimationFrame = mapSafeRequestAnimationFrameFactory(_tsfn.requestAnimationFrame, _tsfn.cancelAnimationFrame);
exports.mapSafeRequestAnimationFrame = mapSafeRequestAnimationFrame;