/** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * * @format * @flow */ 'use strict'; import type React from 'React'; type Args = $ReadOnly<{| getForwardedRef: () => ?React.Ref, setLocalRef: (ref: React.ElementRef) => mixed, |}>; /** * This is a helper function for when a component needs to be able to forward a ref * to a child component, but still needs to have access to that component as part of * its implementation. * * Its main use case is in wrappers for native components. * * Usage: * * class MyView extends React.Component { * _nativeRef = null; * * _setNativeRef = setAndForwardRef({ * getForwardedRef: () => this.props.forwardedRef, * setLocalRef: ref => { * this._nativeRef = ref; * }, * }); * * render() { * return ; * } * } * * const MyViewWithRef = React.forwardRef((props, ref) => ( * * )); * * module.exports = MyViewWithRef; */ function setAndForwardRef({getForwardedRef, setLocalRef}: Args) { return function forwardRef(ref: React.ElementRef) { const forwardedRef = getForwardedRef(); setLocalRef(ref); // Forward to user ref prop (if one has been specified) if (typeof forwardedRef === 'function') { // Handle function-based refs. String-based refs are handled as functions. forwardedRef(ref); } else if (typeof forwardedRef === 'object' && forwardedRef != null) { // Handle createRef-based refs forwardedRef.current = ref; } }; } module.exports = setAndForwardRef;