<PageCard>

# React Utils

<ShowFor packages={['react-dom']}>

<PackageLimited>@floating-ui/react only</PackageLimited>

</ShowFor>

</PageCard>

## `useMergeRefs(){:js}`

Merges an array of refs, returning a memoized callback ref or
`null{:js}`.

```js
import {useMergeRefs} from '@floating-ui/react';

function App() {
  const ref = useMergeRefs([ref1, ref2, ref3]);
  return <div ref={ref} />;
}
```

## `useId(){:js}`

Uses React 18's built-in `useId(){:js}` when available, or falls
back to a slightly less performant (requiring a double render)
implementation for earlier React versions.

```js
import {useId} from '@floating-ui/react';

function App() {
  const id = useId();
}
```
