Codemod to import * as React from "react"; (#18102)

* import * as React from "react";

This is the correct way to import React from an ES module since the ES
module will not have a default export. Only named exports.

* import * as ReactDOM from "react-dom"

Author: sebmarkbage

packages/create-subscription/src/createSubscription.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import React from 'react';
+import * as React from 'react';
 import invariant from 'shared/invariant';
 
 type Unsubscribe = () => void;

packages/react-art/src/ReactART.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React from 'react';
+import * as React from 'react';
 import ReactVersion from 'shared/ReactVersion';
 import {LegacyRoot} from 'shared/ReactRootTags';
 import {

packages/react-cache/src/ReactCache.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import React from 'react';
+import * as React from 'react';
 
 import {createLRU} from './LRU';
 

packages/react-devtools-inline/src/frontend.js

@@ -1,6 +1,7 @@
 /** @flow */
 
-import React, {forwardRef} from 'react';
+import * as React from 'react';
+import {forwardRef} from 'react';
 import Bridge from 'react-devtools-shared/src/bridge';
 import Store from 'react-devtools-shared/src/devtools/store';
 import DevTools from 'react-devtools-shared/src/devtools/views/DevTools';

packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js

@@ -7,13 +7,8 @@
  * @flow
  */
 
-import React, {
-  useContext,
-  useEffect,
-  useLayoutEffect,
-  useRef,
-  useState,
-} from 'react';
+import * as React from 'react';
+import {useContext, useEffect, useLayoutEffect, useRef, useState} from 'react';
 import {createPortal} from 'react-dom';
 import {RegistryContext} from './Contexts';
 

packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js

@@ -7,7 +7,8 @@
  * @flow
  */
 
-import React, {useContext} from 'react';
+import * as React from 'react';
+import {useContext} from 'react';
 import {RegistryContext} from './Contexts';
 
 import styles from './ContextMenuItem.css';

packages/react-devtools-shared/src/devtools/cache.js

@@ -7,7 +7,8 @@
  * @flow
  */
 
-import React, {createContext} from 'react';
+import * as React from 'react';
+import {createContext} from 'react';
 
 // Cache implementation was forked from the React repo:
 // https://github.com/facebook/react/blob/master/packages/react-cache/src/ReactCache.js

packages/react-devtools-shared/src/devtools/views/Button.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import React from 'react';
+import * as React from 'react';
 import Tooltip from '@reach/tooltip';
 
 import styles from './Button.css';

packages/react-devtools-shared/src/devtools/views/ButtonIcon.js

@@ -7,7 +7,7 @@
  * @flow
  */
 
-import React from 'react';
+import * as React from 'react';
 import styles from './ButtonIcon.css';
 
 export type IconType =

packages/react-devtools-shared/src/devtools/views/Components/Badge.js

@@ -7,7 +7,8 @@
  * @flow
  */
 
-import React, {Fragment} from 'react';
+import * as React from 'react';
+import {Fragment} from 'react';
 import {
   ElementTypeMemo,
   ElementTypeForwardRef,