Package Exports

@seznam/compose-react-refs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@seznam/compose-react-refs) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Compose react refs

A simple utility for composing two or more react refs (ref objects and callbacks are both supported and can be mixed) into a single callback ref.

This utility does not use react hooks, therefore it can be used in class components (and even outside of react world) safely.

Installation

compose-react-refs is available as npm package, you can use npm to install it:

npm install --save @seznam/compose-react-refs

Usage

The following example shows usage in a functional component that composes an external ref with its own ref it uses to focus the renderer <input> element:

import * as React from 'react'
import composeRefs from '@seznam/compose-react-refs'

export default React.forwardRef((props, externalRef) => {
  const myRef = React.useRef(null)
  
  React.useEffect(() => {
    myRef.current.focus()
  })

  return <input {...props} ref={composeRefs(myRef, externalRef)}/>
})

The refs will be updated in the order in which they were provided to the composeRefs function.