Remove global React$ type references (#49276)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/49276

This diff replaces the remaining `React$` global types in the codebase, in preparation for their removal in Flow.

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D69322418

fbshipit-source-id: 058a2489ce8e6bf59df2ec4e61e9708f63561671

flow-typed/npm/react-dom_v17.x.x.js

@@ -1,29 +1,28 @@
-// flow-typed signature: e556c06e721548417501c08b01fec911
-// flow-typed version: ad3adf2de8/react-dom_v17.x.x/flow_>=v0.127.x
-
 declare module 'react-dom' {
+  import type {Component} from 'react';
+
   declare var version: string;
 
   declare function findDOMNode(
-    componentOrElement: Element | ?React$Component<any, any>
+    componentOrElement: Element | ?Component<any, any>
   ): null | Element | Text;
 
-  declare function render<ElementType: React$ElementType>(
-    element: React$Element<ElementType>,
+  declare function render<ElementType: React.ElementType>(
+    element: ExactReactElement_DEPRECATED<ElementType>,
     container: Element,
     callback?: () => void
-  ): React$ElementRef<ElementType>;
+  ): React.ElementRef<ElementType>;
 
-  declare function hydrate<ElementType: React$ElementType>(
-    element: React$Element<ElementType>,
+  declare function hydrate<ElementType: React.ElementType>(
+    element: ExactReactElement_DEPRECATED<ElementType>,
     container: Element,
     callback?: () => void
-  ): React$ElementRef<ElementType>;
+  ): React.ElementRef<ElementType>;
 
   declare function createPortal(
-    node: React$Node,
+    node: React.Node,
     container: Element
-  ): React$Portal;
+  ): React.Portal;
 
   declare function unmountComponentAtNode(container: any): boolean;
 
@@ -37,30 +36,32 @@ declare module 'react-dom' {
   ): void;
 
   declare function unstable_renderSubtreeIntoContainer<
-    ElementType: React$ElementType
+    ElementType: React.ElementType
   >(
-    parentComponent: React$Component<any, any>,
-    nextElement: React$Element<ElementType>,
+    parentComponent: Component<any, any>,
+    nextElement: ExactReactElement_DEPRECATED<ElementType>,
     container: any,
     callback?: () => void
-  ): React$ElementRef<ElementType>;
+  ): React.ElementRef<ElementType>;
 }
 
 declare module 'react-dom/server' {
   declare var version: string;
 
-  declare function renderToString(element: React$Node): string;
+  declare function renderToString(element: React.Node): string;
 
-  declare function renderToStaticMarkup(element: React$Node): string;
+  declare function renderToStaticMarkup(element: React.Node): string;
 
-  declare function renderToNodeStream(element: React$Node): stream$Readable;
+  declare function renderToNodeStream(element: React.Node): stream$Readable;
 
   declare function renderToStaticNodeStream(
-    element: React$Node
+    element: React.Node
   ): stream$Readable;
 }
 
 declare module 'react-dom/test-utils' {
+  import type {Component} from 'react';
+
   declare interface Thenable {
     then(resolve: () => mixed, reject?: () => mixed): mixed,
   }
@@ -74,66 +75,66 @@ declare module 'react-dom/test-utils' {
   };
 
   declare function renderIntoDocument(
-    instance: React$Element<any>
-  ): React$Component<any, any>;
+    instance: React.MixedElement
+  ): Component<any, any>;
 
   declare function mockComponent(
-    componentClass: React$ElementType,
+    componentClass: React.ElementType,
     mockTagName?: string
   ): { [key: string]: mixed, ... };
 
-  declare function isElement(element: React$Element<any>): boolean;
+  declare function isElement(element: React.MixedElement): boolean;
 
   declare function isElementOfType(
-    element: React$Element<any>,
-    componentClass: React$ElementType
+    element: React.MixedElement,
+    componentClass: React.ElementType
   ): boolean;
 
   declare function isDOMComponent(instance: any): boolean;
 
   declare function isCompositeComponent(
-    instance: React$Component<any, any>
+    instance: Component<any, any>
   ): boolean;
 
   declare function isCompositeComponentWithType(
-    instance: React$Component<any, any>,
-    componentClass: React$ElementType
+    instance: Component<any, any>,
+    componentClass: React.ElementType
   ): boolean;
 
   declare function findAllInRenderedTree(
-    tree: React$Component<any, any>,
-    test: (child: React$Component<any, any>) => boolean
-  ): Array<React$Component<any, any>>;
+    tree: Component<any, any>,
+    test: (child: Component<any, any>) => boolean
+  ): Array<Component<any, any>>;
 
   declare function scryRenderedDOMComponentsWithClass(
-    tree: React$Component<any, any>,
+    tree: Component<any, any>,
     className: string
   ): Array<Element>;
 
   declare function findRenderedDOMComponentWithClass(
-    tree: React$Component<any, any>,
+    tree: Component<any, any>,
     className: string
   ): ?Element;
 
   declare function scryRenderedDOMComponentsWithTag(
-    tree: React$Component<any, any>,
+    tree: Component<any, any>,
     tagName: string
   ): Array<Element>;
 
   declare function findRenderedDOMComponentWithTag(
-    tree: React$Component<any, any>,
+    tree: Component<any, any>,
     tagName: string
   ): ?Element;
 
   declare function scryRenderedComponentsWithType(
-    tree: React$Component<any, any>,
-    componentClass: React$ElementType
-  ): Array<React$Component<any, any>>;
+    tree: Component<any, any>,
+    componentClass: React.ElementType
+  ): Array<Component<any, any>>;
 
   declare function findRenderedComponentWithType(
-    tree: React$Component<any, any>,
-    componentClass: React$ElementType
-  ): ?React$Component<any, any>;
+    tree: Component<any, any>,
+    componentClass: React.ElementType
+  ): ?Component<any, any>;
 
   declare function act(callback: () => void | Thenable): Thenable;
 }

flow-typed/npm/react-test-renderer_v16.x.x.js

@@ -1,50 +1,52 @@
 // Type definitions for react-test-renderer 16.x.x
 // Ported from: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-test-renderer
 
-type ReactComponentInstance = React$Component<any>;
-
-type ReactTestRendererJSON = {
-  type: string,
-  props: { [propName: string]: any, ... },
-  children: null | ReactTestRendererJSON[],
-  ...
-};
-
-type ReactTestRendererTree = ReactTestRendererJSON & {
-  nodeType: "component" | "host",
-  instance: ?ReactComponentInstance,
-  rendered: null | ReactTestRendererTree,
-  ...
-};
-
-type ReactTestInstance = {
-  instance: ?ReactComponentInstance,
-  type: string,
-  props: { [propName: string]: any, ... },
-  parent: null | ReactTestInstance,
-  children: Array<ReactTestInstance | string>,
-  find(predicate: (node: ReactTestInstance) => boolean): ReactTestInstance,
-  findByType(type: React$ElementType): ReactTestInstance,
-  findByProps(props: { [propName: string]: any, ... }): ReactTestInstance,
-  findAll(
-    predicate: (node: ReactTestInstance) => boolean,
-    options?: { deep: boolean, ... }
-  ): ReactTestInstance[],
-  findAllByType(
-    type: React$ElementType,
-    options?: { deep: boolean, ... }
-  ): ReactTestInstance[],
-  findAllByProps(
-    props: { [propName: string]: any, ... },
-    options?: { deep: boolean, ... }
-  ): ReactTestInstance[],
-  ...
-};
-
 type TestRendererOptions = { createNodeMock(element: React.MixedElement): any, ... };
 
 declare module "react-test-renderer" {
-  declare export type ReactTestRenderer = {
+  import type {Component as ReactComponent} from 'react';
+
+  type ReactComponentInstance = ReactComponent<any>;
+
+  export type ReactTestRendererJSON = {
+    type: string,
+    props: { [propName: string]: any, ... },
+    children: null | ReactTestRendererJSON[],
+    ...
+  };
+
+  export type ReactTestRendererTree = ReactTestRendererJSON & {
+    nodeType: "component" | "host",
+    instance: ?ReactComponentInstance,
+    rendered: null | ReactTestRendererTree,
+    ...
+  };
+
+  export type ReactTestInstance = {
+    instance: ?ReactComponentInstance,
+    type: string,
+    props: { [propName: string]: any, ... },
+    parent: null | ReactTestInstance,
+    children: Array<ReactTestInstance | string>,
+    find(predicate: (node: ReactTestInstance) => boolean): ReactTestInstance,
+    findByType(type: React.ElementType): ReactTestInstance,
+    findByProps(props: { [propName: string]: any, ... }): ReactTestInstance,
+    findAll(
+      predicate: (node: ReactTestInstance) => boolean,
+      options?: { deep: boolean, ... }
+    ): ReactTestInstance[],
+    findAllByType(
+      type: React.ElementType,
+      options?: { deep: boolean, ... }
+    ): ReactTestInstance[],
+    findAllByProps(
+      props: { [propName: string]: any, ... },
+      options?: { deep: boolean, ... }
+    ): ReactTestInstance[],
+    ...
+  };
+
+  export type ReactTestRenderer = {
     toJSON(): null | ReactTestRendererJSON,
     toTree(): null | ReactTestRendererTree,
     unmount(nextElement?: React.MixedElement): void,
@@ -65,6 +67,8 @@ declare module "react-test-renderer" {
 }
 
 declare module "react-test-renderer/shallow" {
+  import type {ReactTestInstance} from 'react-test-renderer';
+
   declare export default class ShallowRenderer {
     static createRenderer(): ShallowRenderer;
     getMountedInstance(): ReactTestInstance;

packages/react-native/Libraries/ReactNative/AppRegistry.js

@@ -30,11 +30,11 @@ export type TaskProvider = () => Task;
 type TaskCanceller = () => void;
 type TaskCancelProvider = () => TaskCanceller;
 
-export type ComponentProvider = () => React$ComponentType<any>;
+export type ComponentProvider = () => React.ComponentType<any>;
 export type ComponentProviderInstrumentationHook = (
   component_: ComponentProvider,
   scopedPerformanceLogger: IPerformanceLogger,
-) => React$ComponentType<any>;
+) => React.ComponentType<any>;
 export type AppConfig = {
   appKey: string,
   component?: ComponentProvider,
@@ -59,7 +59,7 @@ export type Registry = {
 };
 export type WrapperComponentProvider = (
   appParameters: Object,
-) => React$ComponentType<any>;
+) => React.ComponentType<any>;
 export type RootViewStyleProvider = (appParameters: Object) => ViewStyleProp;
 
 const runnables: Runnables = {};

packages/react-native/Libraries/ReactNative/RootTag.js

@@ -12,7 +12,7 @@ import * as React from 'react';
 
 export opaque type RootTag = number;
 
-export const RootTagContext: React$Context<RootTag> =
+export const RootTagContext: React.Context<RootTag> =
   React.createContext<RootTag>(0);
 
 if (__DEV__) {

packages/react-native/Libraries/Text/TextAncestor.js

@@ -15,7 +15,7 @@ const React = require('react');
 /**
  * Whether the current element is the descendant of a <Text> element.
  */
-const TextAncestorContext: React$Context<boolean> = React.createContext(false);
+const TextAncestorContext: React.Context<boolean> = React.createContext(false);
 if (__DEV__) {
   TextAncestorContext.displayName = 'TextAncestorContext';
 }

packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap

@@ -6533,11 +6533,11 @@ exports[`public API should not change unintentionally Libraries/ReactNative/AppR
 export type TaskProvider = () => Task;
 type TaskCanceller = () => void;
 type TaskCancelProvider = () => TaskCanceller;
-export type ComponentProvider = () => React$ComponentType<any>;
+export type ComponentProvider = () => React.ComponentType<any>;
 export type ComponentProviderInstrumentationHook = (
   component_: ComponentProvider,
   scopedPerformanceLogger: IPerformanceLogger
-) => React$ComponentType<any>;
+) => React.ComponentType<any>;
 export type AppConfig = {
   appKey: string,
   component?: ComponentProvider,
@@ -6562,7 +6562,7 @@ export type Registry = {
 };
 export type WrapperComponentProvider = (
   appParameters: Object
-) => React$ComponentType<any>;
+) => React.ComponentType<any>;
 export type RootViewStyleProvider = (appParameters: Object) => ViewStyleProp;
 declare const AppRegistry: {
   setWrapperComponentProvider(provider: WrapperComponentProvider): void,
@@ -6878,7 +6878,7 @@ exports[`public API should not change unintentionally Libraries/ReactNative/Rend
 
 exports[`public API should not change unintentionally Libraries/ReactNative/RootTag.js 1`] = `
 "declare export opaque type RootTag;
-declare export const RootTagContext: React$Context<RootTag>;
+declare export const RootTagContext: React.Context<RootTag>;
 declare export function createRootTag(rootTag: number | RootTag): RootTag;
 "
 `;
@@ -7679,7 +7679,8 @@ declare export default typeof Text;
 `;
 
 exports[`public API should not change unintentionally Libraries/Text/TextAncestor.js 1`] = `
-"declare const TextAncestorContext: React$Context<boolean>;
+"declare const React: $FlowFixMe;
+declare const TextAncestorContext: React.Context<boolean>;
 declare export default typeof TextAncestorContext;
 "
 `;

packages/react-native/flow/react.js

@@ -1,15 +0,0 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * @flow strict
- * @nolint
- * @format
- */
-
-declare opaque type React$Element<
-  +ElementType: React$ElementType,
-  +P = React$ElementProps<ElementType>,
->: {...};

packages/react-native/src/private/renderer/errorhandling/ErrorHandlers.js

@@ -9,6 +9,7 @@
  */
 
 import type {ExtendedError} from '../../../../Libraries/Core/ExtendedError';
+import type {Component as ReactComponent} from 'react';
 
 import ExceptionsManager, {
   SyntheticError,
@@ -17,7 +18,7 @@ import ExceptionsManager, {
 type ErrorInfo = {
   +componentStack?: ?string,
   // $FlowFixMe[unclear-type] unknown props and state.
-  +errorBoundary?: ?React$Component<any, any>,
+  +errorBoundary?: ?ReactComponent<any, any>,
 };
 
 function getExtendedError(

packages/rn-tester/js/examples/TurboModule/NativeCxxModuleExampleExample.js

@@ -72,7 +72,7 @@ type ErrorExamples =
   | 'promiseAssert';
 
 class NativeCxxModuleExampleExample extends React.Component<{}, State> {
-  static contextType: React$Context<RootTag> = RootTagContext;
+  static contextType: React.Context<RootTag> = RootTagContext;
   eventSubscriptions: EventSubscription[] = [];
 
   state: State = {

packages/rn-tester/js/examples/TurboModule/SampleLegacyModuleExample.js

@@ -68,7 +68,7 @@ function stringify(obj: mixed): string {
 }
 
 class SampleLegacyModuleExample extends React.Component<{}, State> {
-  static contextType: React$Context<RootTag> = RootTagContext;
+  static contextType: React.Context<RootTag> = RootTagContext;
 
   state: State = {
     testResults: {},

packages/rn-tester/js/examples/TurboModule/SampleTurboModuleExample.js

@@ -63,7 +63,7 @@ type ErrorExamples =
   | 'promiseAssert';
 
 class SampleTurboModuleExample extends React.Component<{}, State> {
-  static contextType: React$Context<RootTag> = RootTagContext;
+  static contextType: React.Context<RootTag> = RootTagContext;
   eventSubscriptions: EventSubscription[] = [];
 
   state: State = {