forward-ref-as

A wrapper around React.forwardRef() that allows HTML attributes and prop types to be derived from the as prop.

Usage no npm install needed!

<script type="module">
  import forwardRefAs from 'https://cdn.skypack.dev/forward-ref-as';
</script>

README


forwardRefAs()

A wrapper around React.forwardRef() that allows HTML attributes and prop types to be inferred from an as prop.
npm i forward-ref-as

Bundlephobia Types Code coverage Build status NPM Version MIT License


Quick start

import forwardRefAs from 'forward-ref-as'

// Forwards `ref` to the underlying button and adds strong
// types for the `as` prop.
const Button = forwardRefAs<'button', ButtonProps>(
  ({as: As = 'button', ...props}, ref) => <As ref={ref} {...props} />
)

// ✅ Will pass type checking and autocomplete correctly
;<Button as='a' href='https://jaredLunde.com' />

API

forwardRefAs()

A wrapper around React.forwardRef() with the same call signature, but a type signature that allows as prop HTML attributes and React prop types to be inferred.

LICENSE

MIT