React: Function to assign multiple refs to an element (compose refs)

readme.md

Usage

const builderRef = useRef()

const [dropProps, dropRef] = useDrop({
  // ..
})

<div className="builder-content" ref={composeRefs([builderRef, dropRef])}>
</div>

compose-refs.ts

function composeRefs<T>(refs: React.Ref<T>[]): React.Ref<T> {
  return function(component: T) {
    refs.forEach((ref) => {
      if (typeof ref === 'function') {
        ref(component)
      } else if (ref && 'current' in ref) {
        ref.current = component
      }
    })
  }
}