use-force-update.mjs 723 B

12345678910111213141516171819
  1. import { frame } from 'motion-dom';
  2. import { useState, useCallback } from 'react';
  3. import { useIsMounted } from './use-is-mounted.mjs';
  4. function useForceUpdate() {
  5. const isMounted = useIsMounted();
  6. const [forcedRenderCount, setForcedRenderCount] = useState(0);
  7. const forceRender = useCallback(() => {
  8. isMounted.current && setForcedRenderCount(forcedRenderCount + 1);
  9. }, [forcedRenderCount]);
  10. /**
  11. * Defer this to the end of the next animation frame in case there are multiple
  12. * synchronous calls.
  13. */
  14. const deferredForceRender = useCallback(() => frame.postRender(forceRender), [forceRender]);
  15. return [deferredForceRender, forcedRenderCount];
  16. }
  17. export { useForceUpdate };