@primer/components/lib/hooks/useRenderForcingRef.js

Primer react components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useRenderForcingRef = useRenderForcingRef;

var _react = require("react");

/**
 * There are certain situations where a ref might be set after the current render cycle for a
 * component has finished.  e.g. a forward ref from a conditionally rendered child component.
 * In these situations, we need to force a re-render, which is done here by the useState hook.
 * @type TRef The type of the RefObject which should be created.
 */
function useRenderForcingRef() {
  const [refCurrent, setRefCurrent] = (0, _react.useState)(null);
  const ref = (0, _react.useRef)(null);
  ref.current = refCurrent;
  const setRef = (0, _react.useCallback)(newRef => {
    ref.current = newRef;
    setRefCurrent(newRef);
  }, [ref]);
  return [ref, setRef];
}