use-callback-ref/dist/es2015/useTransformRef.js

The same useRef, but with callback

import { assignRef } from './assignRef';
import { useCallbackRef } from './useRef';
/**
 * Create a _lense_ on Ref, making it possible to transform ref value
 * @param {ReactRef} ref
 * @param {Function} transformer. 👉 Ref would be __NOT updated__ on `transformer` update.
 * @returns {RefObject}
 *
 * @see https://github.com/theKashey/use-callback-ref#usetransformref-to-replace-reactuseimperativehandle
 * @example
 *
 * const ResizableWithRef = forwardRef((props, ref) =>
 *  <Resizable {...props} ref={useTransformRef(ref, i => i ? i.resizable : null)}/>
 * );
 */
export function useTransformRef(ref, transformer) {
    return useCallbackRef(null, function (value) { return assignRef(ref, transformer(value)); });
}