Properly merge incoming props (#1265)

* rename inconsistent `passThroughProps` and `passthroughProps` to more
concise `incomingProps`

This is going to make a bit more sense in the next commits of this
branch, hold on!

* split props into `propsWeControl` and `propsTheyControl`

This will allow us to merge the props with a bit more control. Instead
of overriding every prop from the user' props with our props, we can now
merge event listeners.

* update `render` API to accept `propsWeControl` and `propsTheyControl`

* improve the merge logic

This will essentially do the exact same thing we were doing before:
```js
let props = { ...propsTheyControl, ...propsWeControl }
```

But instead of overriding everything, we will merge the event listener
related props like `onClick`, `onKeyDown`, ...

* fix typo in tests

* simplify naming

- Rename `propsWeControl` to `ourProps`
- Rename `propsTheyControl` to `theirProps`

* update changelog

packages/@headlessui-react/src/internal/visually-hidden.tsx

@@ -7,22 +7,25 @@ let DEFAULT_VISUALLY_HIDDEN_TAG = 'div' as const
 export let VisuallyHidden = forwardRefWithAs(function VisuallyHidden<
   TTag extends ElementType = typeof DEFAULT_VISUALLY_HIDDEN_TAG
 >(props: Props<TTag>, ref: Ref<HTMLElement>) {
-  return render({
-    props: {
-      ...props,
-      ref,
-      style: {
-        position: 'absolute',
-        width: 1,
-        height: 1,
-        padding: 0,
-        margin: -1,
-        overflow: 'hidden',
-        clip: 'rect(0, 0, 0, 0)',
-        whiteSpace: 'nowrap',
-        borderWidth: '0',
-      },
+  let theirProps = props
+  let ourProps = {
+    ref,
+    style: {
+      position: 'absolute',
+      width: 1,
+      height: 1,
+      padding: 0,
+      margin: -1,
+      overflow: 'hidden',
+      clip: 'rect(0, 0, 0, 0)',
+      whiteSpace: 'nowrap',
+      borderWidth: '0',
     },
+  }
+
+  return render({
+    ourProps,
+    theirProps,
     slot: {},
     defaultTag: DEFAULT_VISUALLY_HIDDEN_TAG,
     name: 'VisuallyHidden',