[react] forwardRefs ref object should be mutable (#43265)

Please fill in this template.

- [x] Use a meaningful title for the pull request. Include the name of the package modified.
- [x] Test the change in your own code. (Compile and run.)
- [x] Add or edit tests to reflect the change. (Run with `npm test`.)
- [x] Follow the advice from the [readme](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/README.md#make-a-pull-request).
- [x] Avoid [common mistakes](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/README.md#common-mistakes).
- [x] Run `npm run lint package-name` (or `tsc` if no `tslint.json` is present).

Select one of these and delete the others:

If changing an existing definition:
- [x] Provide a URL to documentation or source code which provides context for the suggested changes: #31065, #39062
- [x] If this PR brings the type definitions up to date with a new version of the JS library, update the version number in the header.
- [x] If you are making substantial changes, consider adding a `tslint.json` containing `{ "extends": "dtslint/dt.json" }`. If for reason the any rule need to be disabled, disable it for that line using `// tslint:disable-next-line [ruleName]` and not for whole package so that the need for disabling can be reviewed.

Fixes  #39062

types/react/index.d.ts

@@ -560,7 +560,7 @@ declare namespace React {
     }
 
     interface ForwardRefRenderFunction<T, P = {}> {
-        (props: PropsWithChildren<P>, ref: Ref<T>): ReactElement | null;
+        (props: PropsWithChildren<P>, ref: ((instance: T | null) => void) | MutableRefObject<T | null> | null): ReactElement | null;
         displayName?: string;
         // explicit rejected with `never` required due to
         // https://github.com/microsoft/TypeScript/issues/36826

types/react/test/index.ts

@@ -439,6 +439,17 @@ function RefCarryingComponent() {
         },
     );
 }
+const ForwardingRefComponent2 = React.forwardRef<HTMLElement>((props, ref) => {
+    return React.createElement('div', {
+        ref(e: HTMLDivElement) {
+            if (typeof ref === 'function') {
+                ref(e);
+            } else if (ref) {
+                ref.current = e;
+            }
+        }
+    });
+});
 
 const MemoizedForwardingRefComponent = React.memo(ForwardingRefComponent);
 const LazyComponent = React.lazy(() => Promise.resolve({ default: RefComponent }));