# mergeProps



## Introduction

`mergeProps` is a utility function that combines multiple props objects together in a smart way.
This can be useful when you need to combine the results of multiple react-aria hooks onto a single
element. `mergeProps` handles combining these props together so that multiple
event handlers will be chained, multiple classes will be combined, and ids will be deduplicated.
For all other props, the last prop object overrides all previous ones.

## Example

```tsx
import {mergeProps} from '@react-aria/utils';

let a = {
  className: 'foo',
  onKeyDown(e) {
    if (e.key === 'Enter') {
      console.log('enter')
    }
  }
};

let b = {
  className: 'bar',
  onKeyDown(e) {
    if (e.key === ' ') {
      console.log('space')
    }
  }
};

let merged = mergeProps(a, b);
```

The result of the above example will be equivalent to this:

```tsx
let merged = {
  className: 'foo bar',
  onKeyDown(e) {
    a.onKeyDown(e);
    b.onKeyDown(e);
  }
};
```

## API

<FunctionAPI
  function={docs.exports.mergeProps}
  links={docs.links}
/>