From e8198aed8d094087d5da898a325916dd44b86d5a Mon Sep 17 00:00:00 2001
From: Tim Yung <yungsters@fb.com>
Date: Fri, 14 Oct 2016 08:53:57 -0700
Subject: [PATCH] Cleanup: Prefer `React.Element` over `React$?Element`

Reviewed By: vjeux

Differential Revision: D4013049

fbshipit-source-id: 18a447fdbc584418d6a51770363bcd221e7fb7dc
---
 .../UIExplorer/js/AccessibilityIOSExample.js  |  2 +-
 .../UIExplorer/js/ActionSheetIOSExample.js    | 10 ++++-----
 Examples/UIExplorer/js/AdSupportIOSExample.js |  2 +-
 Examples/UIExplorer/js/AlertIOSExample.js     |  2 +-
 .../js/AnimatedGratuitousApp/AnExApp.js       |  4 ++--
 .../js/AnimatedGratuitousApp/AnExBobble.js    |  2 +-
 .../js/AnimatedGratuitousApp/AnExSet.js       |  2 +-
 .../js/AnimatedGratuitousApp/AnExTilt.js      |  2 +-
 Examples/UIExplorer/js/AppStateExample.js     |  6 ++---
 Examples/UIExplorer/js/AsyncStorageExample.js |  2 +-
 Examples/UIExplorer/js/CameraRollExample.js   |  2 +-
 .../UIExplorer/js/DatePickerIOSExample.js     |  2 +-
 Examples/UIExplorer/js/ExampleTypes.js        |  2 +-
 Examples/UIExplorer/js/GeolocationExample.js  |  2 +-
 .../UIExplorer/js/LayoutAnimationExample.js   |  4 ++--
 Examples/UIExplorer/js/LayoutEventsExample.js |  2 +-
 .../UIExplorer/js/ListViewPagingExample.js    |  2 +-
 ...CardStack-NavigationHeader-Tabs-example.js | 22 +++++++++----------
 .../NavigationCardStack-NoGesture-example.js  |  6 ++---
 .../NavigationCardStack-example.js            |  6 ++---
 ...gationTransitioner-AnimatedView-example.js | 10 ++++-----
 ...Transitioner-AnimatedView-pager-example.js | 10 ++++-----
 Examples/UIExplorer/js/NetInfoExample.js      |  8 +++----
 Examples/UIExplorer/js/PickerIOSExample.js    |  4 ++--
 .../js/PushNotificationIOSExample.js          |  6 ++---
 .../UIExplorer/js/RCTRootViewIOSExample.js    |  4 ++--
 .../js/SegmentedControlIOSExample.js          | 12 +++++-----
 Examples/UIExplorer/js/SliderExample.js       | 18 +++++++--------
 Examples/UIExplorer/js/SnapshotExample.js     |  2 +-
 Examples/UIExplorer/js/SwitchExample.js       | 10 ++++-----
 Examples/UIExplorer/js/TextExample.ios.js     |  4 ++--
 .../UIExplorer/js/TextInputExample.android.js |  6 ++---
 .../UIExplorer/js/TextInputExample.ios.js     |  4 ++--
 Examples/UIExplorer/js/TimerExample.js        |  2 +-
 Examples/UIExplorer/js/TouchableExample.js    | 12 +++++-----
 Examples/UIExplorer/js/TransformExample.js    |  2 +-
 .../js/TransparentHitTestExample.js           |  2 +-
 Examples/UIExplorer/js/UIExplorerApp.ios.js   |  6 ++---
 .../js/UIExplorerExampleContainer.js          |  2 +-
 .../UIExplorer/js/UIExplorerExampleList.js    | 12 +++++-----
 Examples/UIExplorer/js/WebSocketExample.js    |  6 ++---
 Examples/UIExplorer/js/WebViewExample.js      | 10 ++++-----
 IntegrationTests/PromiseTest.js               |  2 +-
 .../Keyboard/KeyboardAvoidingView.js          |  2 +-
 Libraries/Components/LazyRenderer.js          |  2 +-
 Libraries/Components/StaticRenderer.js        |  2 +-
 Libraries/Components/StatusBar/StatusBar.js   |  2 +-
 .../Components/Touchable/TouchableBounce.js   |  2 +-
 .../Touchable/TouchableWithoutFeedback.js     |  2 +-
 .../NavigationExperimental/NavigationCard.js  |  2 +-
 .../NavigationCardStack.js                    |  6 ++---
 .../NavigationHeader.js                       | 12 +++++-----
 .../NavigationHeaderTitle.js                  |  2 +-
 .../NavigationPointerEventsContainer.js       |  2 +-
 Libraries/Experimental/Incremental.js         |  2 +-
 Libraries/Experimental/IncrementalExample.js  |  2 +-
 Libraries/Experimental/IncrementalGroup.js    |  2 +-
 .../SwipeableRow/SwipeableListView.js         |  6 ++---
 .../SwipeableQuickActionButton.js             |  2 +-
 .../SwipeableRow/SwipeableQuickActions.js     |  2 +-
 .../Experimental/SwipeableRow/SwipeableRow.js |  2 +-
 Libraries/Experimental/WindowedListView.js    | 12 +++++-----
 Libraries/Inspector/NetworkOverlay.js         | 12 +++++-----
 Libraries/Modal/Modal.js                      |  2 +-
 .../NavigationTransitioner.js                 |  2 +-
 Libraries/Text/Text.js                        |  2 +-
 66 files changed, 161 insertions(+), 161 deletions(-)

diff --git a/Examples/UIExplorer/js/AccessibilityIOSExample.js b/Examples/UIExplorer/js/AccessibilityIOSExample.js
index 2536b3037ef..59e5039a8b5 100644
--- a/Examples/UIExplorer/js/AccessibilityIOSExample.js
+++ b/Examples/UIExplorer/js/AccessibilityIOSExample.js
@@ -68,6 +68,6 @@ exports.description = 'Interface to show iOS\' accessibility samples';
 exports.examples = [
   {
     title: 'Accessibility elements',
-    render(): ReactElement<any> { return <AccessibilityIOSExample />; }
+    render(): React.Element<any> { return <AccessibilityIOSExample />; }
   },
 ];
diff --git a/Examples/UIExplorer/js/ActionSheetIOSExample.js b/Examples/UIExplorer/js/ActionSheetIOSExample.js
index aded7ffe34e..a65af457cb8 100644
--- a/Examples/UIExplorer/js/ActionSheetIOSExample.js
+++ b/Examples/UIExplorer/js/ActionSheetIOSExample.js
@@ -197,27 +197,27 @@ exports.description = 'Interface to show iOS\' action sheets';
 exports.examples = [
   {
     title: 'Show Action Sheet',
-    render(): ReactElement<any> { return <ActionSheetExample />; }
+    render(): React.Element<any> { return <ActionSheetExample />; }
   },
   {
     title: 'Show Action Sheet with tinted buttons',
-    render(): ReactElement<any> { return <ActionSheetTintExample />; }
+    render(): React.Element<any> { return <ActionSheetTintExample />; }
   },
   {
     title: 'Show Share Action Sheet',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <ShareActionSheetExample url="https://code.facebook.com" />;
     }
   },
   {
     title: 'Share Local Image',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <ShareActionSheetExample url="bunny.png" />;
     }
   },
   {
     title: 'Share Screenshot',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <ShareScreenshotExample />;
     }
   }
diff --git a/Examples/UIExplorer/js/AdSupportIOSExample.js b/Examples/UIExplorer/js/AdSupportIOSExample.js
index f07973d9324..49baf7d7a65 100644
--- a/Examples/UIExplorer/js/AdSupportIOSExample.js
+++ b/Examples/UIExplorer/js/AdSupportIOSExample.js
@@ -38,7 +38,7 @@ exports.description = 'Example of using the ad support API.';
 exports.examples = [
   {
     title: 'Ad Support IOS',
-    render: function(): ReactElement<any> {
+    render: function(): React.Element<any> {
       return <AdSupportIOSExample />;
     },
   }
diff --git a/Examples/UIExplorer/js/AlertIOSExample.js b/Examples/UIExplorer/js/AlertIOSExample.js
index 445824368ba..0bd9ffa75f8 100644
--- a/Examples/UIExplorer/js/AlertIOSExample.js
+++ b/Examples/UIExplorer/js/AlertIOSExample.js
@@ -45,7 +45,7 @@ exports.examples = [{
 },
 {
   title: 'Prompt Options',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <PromptOptions />;
   }
 },
diff --git a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExApp.js b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExApp.js
index d8e3addcf31..c7621b42a5a 100644
--- a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExApp.js
+++ b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExApp.js
@@ -89,7 +89,7 @@ class Circle extends React.Component {
     });
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     if (this.state.panResponder) {
       var handlers = this.state.panResponder.panHandlers;
       var dragStyle = {                 //  Used to position while dragging
@@ -190,7 +190,7 @@ class AnExApp extends React.Component {
     this._onMove = this._onMove.bind(this);
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     var circles = this.state.keys.map((key, idx) => {
       if (key === this.state.activeKey) {
         return <Circle key={key + 'd'} dummy={true} />;
diff --git a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExBobble.js b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExBobble.js
index 94d2ce1a3ef..38452adeca5 100644
--- a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExBobble.js
+++ b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExBobble.js
@@ -96,7 +96,7 @@ class AnExBobble extends React.Component {
     });
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <View style={styles.bobbleContainer}>
         {this.state.bobbles.map((_, i) => {
diff --git a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExSet.js b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExSet.js
index 464cf887a6e..8e6e9a77d83 100644
--- a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExSet.js
+++ b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExSet.js
@@ -52,7 +52,7 @@ class AnExSet extends React.Component {
       openColor: randColor(),
     };
   }
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     var backgroundColor = this.props.openVal ?
       this.props.openVal.interpolate({
         inputRange: [0, 1],
diff --git a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExTilt.js b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExTilt.js
index 5acee72cf1a..35c4e62f250 100644
--- a/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExTilt.js
+++ b/Examples/UIExplorer/js/AnimatedGratuitousApp/AnExTilt.js
@@ -97,7 +97,7 @@ class AnExTilt extends React.Component {
     this._startBurnsZoom();
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <Animated.View
         {...this.state.tiltPanResponder.panHandlers}
diff --git a/Examples/UIExplorer/js/AppStateExample.js b/Examples/UIExplorer/js/AppStateExample.js
index 6be24ca7097..2b3d60f83e7 100644
--- a/Examples/UIExplorer/js/AppStateExample.js
+++ b/Examples/UIExplorer/js/AppStateExample.js
@@ -95,16 +95,16 @@ exports.examples = [
   {
     title: 'Subscribed AppState:',
     description: 'This changes according to the current state, so you can only ever see it rendered as "active"',
-    render(): ReactElement<any> { return <AppStateSubscription showCurrentOnly={true} />; }
+    render(): React.Element<any> { return <AppStateSubscription showCurrentOnly={true} />; }
   },
   {
     title: 'Previous states:',
-    render(): ReactElement<any> { return <AppStateSubscription showCurrentOnly={false} />; }
+    render(): React.Element<any> { return <AppStateSubscription showCurrentOnly={false} />; }
   },
   {
     platform: 'ios',
     title: 'Memory Warnings',
     description: 'In the IOS simulator, hit Shift+Command+M to simulate a memory warning.',
-    render(): ReactElement<any> { return <AppStateSubscription showMemoryWarnings={true} />; }
+    render(): React.Element<any> { return <AppStateSubscription showMemoryWarnings={true} />; }
   },
 ];
diff --git a/Examples/UIExplorer/js/AsyncStorageExample.js b/Examples/UIExplorer/js/AsyncStorageExample.js
index 70108c83e53..38ffc4f118f 100644
--- a/Examples/UIExplorer/js/AsyncStorageExample.js
+++ b/Examples/UIExplorer/js/AsyncStorageExample.js
@@ -120,6 +120,6 @@ exports.description = 'Asynchronous local disk storage.';
 exports.examples = [
   {
     title: 'Basics - getItem, setItem, removeItem',
-    render(): ReactElement<any> { return <BasicStorageExample />; }
+    render(): React.Element<any> { return <BasicStorageExample />; }
   },
 ];
diff --git a/Examples/UIExplorer/js/CameraRollExample.js b/Examples/UIExplorer/js/CameraRollExample.js
index 07d6498dcfb..797986259f2 100644
--- a/Examples/UIExplorer/js/CameraRollExample.js
+++ b/Examples/UIExplorer/js/CameraRollExample.js
@@ -143,6 +143,6 @@ exports.description = 'Example component that uses CameraRoll to list user\'s ph
 exports.examples = [
   {
     title: 'Photos',
-    render(): ReactElement<any> { return <CameraRollExample />; }
+    render(): React.Element<any> { return <CameraRollExample />; }
   }
 ];
diff --git a/Examples/UIExplorer/js/DatePickerIOSExample.js b/Examples/UIExplorer/js/DatePickerIOSExample.js
index 15f0f83aa4e..6daba2e78d5 100644
--- a/Examples/UIExplorer/js/DatePickerIOSExample.js
+++ b/Examples/UIExplorer/js/DatePickerIOSExample.js
@@ -135,7 +135,7 @@ exports.description = 'Select dates and times using the native UIDatePicker.';
 exports.examples = [
 {
   title: '<DatePickerIOS>',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <DatePickerExample />;
   },
 }];
diff --git a/Examples/UIExplorer/js/ExampleTypes.js b/Examples/UIExplorer/js/ExampleTypes.js
index 3863bb5bb6e..7d0363016b2 100644
--- a/Examples/UIExplorer/js/ExampleTypes.js
+++ b/Examples/UIExplorer/js/ExampleTypes.js
@@ -25,7 +25,7 @@
 
 export type Example = {
   title: string,
-  render: () => ?ReactElement<any>,
+  render: () => ?React.Element<any>,
   description?: string,
   platform?: string;
 };
diff --git a/Examples/UIExplorer/js/GeolocationExample.js b/Examples/UIExplorer/js/GeolocationExample.js
index 2b611339e57..559172840a7 100644
--- a/Examples/UIExplorer/js/GeolocationExample.js
+++ b/Examples/UIExplorer/js/GeolocationExample.js
@@ -39,7 +39,7 @@ exports.description = 'Examples of using the Geolocation API.';
 exports.examples = [
   {
     title: 'navigator.geolocation',
-    render: function(): ReactElement<any> {
+    render: function(): React.Element<any> {
       return <GeolocationExample />;
     },
   }
diff --git a/Examples/UIExplorer/js/LayoutAnimationExample.js b/Examples/UIExplorer/js/LayoutAnimationExample.js
index 8cbc6f9939e..d3836b86e70 100644
--- a/Examples/UIExplorer/js/LayoutAnimationExample.js
+++ b/Examples/UIExplorer/js/LayoutAnimationExample.js
@@ -161,12 +161,12 @@ exports.title = 'Layout Animation';
 exports.description = 'Layout animation';
 exports.examples = [{
   title: 'Add and remove views',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <AddRemoveExample />;
   },
 }, {
   title: 'Cross fade views',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <CrossFadeExample />;
   },
 }];
diff --git a/Examples/UIExplorer/js/LayoutEventsExample.js b/Examples/UIExplorer/js/LayoutEventsExample.js
index 1ca5a97b534..2901f6a984b 100644
--- a/Examples/UIExplorer/js/LayoutEventsExample.js
+++ b/Examples/UIExplorer/js/LayoutEventsExample.js
@@ -170,7 +170,7 @@ exports.description = 'Examples that show how Layout events can be used to ' +
 exports.examples = [
 {
   title: 'LayoutEventExample',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <LayoutEventExample />;
   },
 }];
diff --git a/Examples/UIExplorer/js/ListViewPagingExample.js b/Examples/UIExplorer/js/ListViewPagingExample.js
index 76bd37b6a93..4a50d7b25e0 100644
--- a/Examples/UIExplorer/js/ListViewPagingExample.js
+++ b/Examples/UIExplorer/js/ListViewPagingExample.js
@@ -142,7 +142,7 @@ class ListViewPagingExample extends React.Component {
     };
   }
 
-  renderRow = (rowData: string, sectionID: string, rowID: string): ReactElement<any> => {
+  renderRow = (rowData: string, sectionID: string, rowID: string): React.Element<any> => {
     return (<Thumb text={rowData}/>);
   };
 
diff --git a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NavigationHeader-Tabs-example.js b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NavigationHeader-Tabs-example.js
index 88f24d17454..6108219295b 100644
--- a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NavigationHeader-Tabs-example.js
+++ b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NavigationHeader-Tabs-example.js
@@ -166,7 +166,7 @@ function createAppNavigationContainer(ComponentClass) {
       };
     }
 
-    render(): ReactElement {
+    render(): React.Element {
       const navigate = this.context[key] || this.props.navigate;
       return <ComponentClass {...this.props} navigate={navigate} />;
     }
@@ -191,7 +191,7 @@ class YourApplication extends Component {
     this._navigate = this._navigate.bind(this);
   }
 
-  render(): ReactElement {
+  render(): React.Element {
     // User your own navigator (see next step).
     return (
       <YourNavigator
@@ -255,7 +255,7 @@ const YourNavigator = createAppNavigationContainer(class extends Component {
   }
 
   // Now use the `NavigationCardStack` to render the scenes.
-  render(): ReactElement {
+  render(): React.Element {
     const {appNavigationState} = this.props;
     const {tabs} = appNavigationState;
     const tabKey = tabs.routes[tabs.index].key;
@@ -281,7 +281,7 @@ const YourNavigator = createAppNavigationContainer(class extends Component {
   // Render the header.
   // The detailed spec of `sceneProps` is defined at `NavigationTypeDefinition`
   // as type `NavigationSceneRendererProps`.
-  _renderHeader(sceneProps: Object): ReactElement {
+  _renderHeader(sceneProps: Object): React.Element {
     return (
       <YourHeader
         {...sceneProps}
@@ -292,7 +292,7 @@ const YourNavigator = createAppNavigationContainer(class extends Component {
   // Render a scene for route.
   // The detailed spec of `sceneProps` is defined at `NavigationTypeDefinition`
   // as type `NavigationSceneRendererProps`.
-  _renderScene(sceneProps: Object): ReactElement {
+  _renderScene(sceneProps: Object): React.Element {
     return (
       <YourScene
         {...sceneProps}
@@ -319,7 +319,7 @@ const YourHeader = createAppNavigationContainer(class extends Component {
     this._renderTitleComponent = this._renderTitleComponent.bind(this);
   }
 
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <NavigationHeader
         {...this.props}
@@ -333,7 +333,7 @@ const YourHeader = createAppNavigationContainer(class extends Component {
     this.props.navigate({type: 'pop'});
   }
 
-  _renderTitleComponent(props: Object): ReactElement {
+  _renderTitleComponent(props: Object): React.Element {
     return (
       <NavigationHeader.Title>
         {props.scene.route.key}
@@ -357,7 +357,7 @@ const YourScene = createAppNavigationContainer(class extends Component {
     this._pushRoute = this._pushRoute.bind(this);
   }
 
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <ScrollView>
         <NavigationExampleRow
@@ -403,7 +403,7 @@ const YourTabs = createAppNavigationContainer(class extends Component {
     super(props, context);
   }
 
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <View style={styles.tabs}>
         {this.props.navigationState.routes.map(this._renderTab, this)}
@@ -411,7 +411,7 @@ const YourTabs = createAppNavigationContainer(class extends Component {
     );
   }
 
-  _renderTab(route: Object, index: number): ReactElement {
+  _renderTab(route: Object, index: number): React.Element {
     return (
       <YourTab
         key={route.key}
@@ -437,7 +437,7 @@ const YourTab = createAppNavigationContainer(class extends Component {
     this._onPress = this._onPress.bind(this);
   }
 
-  render(): ReactElement {
+  render(): React.Element {
     const style = [styles.tabText];
     if (this.props.selected) {
       style.push(styles.tabSelected);
diff --git a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NoGesture-example.js b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NoGesture-example.js
index 97aa76e05b9..58a75d71dc1 100644
--- a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NoGesture-example.js
+++ b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-NoGesture-example.js
@@ -60,7 +60,7 @@ class YourApplication extends React.Component {
   }
 
   // User your own navigator (see Step 2).
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <YourNavigator
         navigationState={this.state.navigationState}
@@ -134,7 +134,7 @@ class YourNavigator extends React.Component {
   }
 
   // Now use the `NavigationCardStack` to render the scenes.
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <NavigationCardStack
         onNavigateBack={this._onPopRoute}
@@ -149,7 +149,7 @@ class YourNavigator extends React.Component {
   // Render a scene for route.
   // The detailed spec of `sceneProps` is defined at `NavigationTypeDefinition`
   // as type `NavigationSceneRendererProps`.
-  _renderScene(sceneProps: Object): ReactElement {
+  _renderScene(sceneProps: Object): React.Element {
     return (
       <YourScene
         route={sceneProps.scene.route}
diff --git a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-example.js b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-example.js
index 76ea3887689..bf5decac2d8 100644
--- a/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-example.js
+++ b/Examples/UIExplorer/js/NavigationExperimental/NavigationCardStack-example.js
@@ -60,7 +60,7 @@ class YourApplication extends React.Component {
   }
 
   // User your own navigator (see Step 2).
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <YourNavigator
         navigationState={this.state.navigationState}
@@ -134,7 +134,7 @@ class YourNavigator extends React.Component {
   }
 
   // Now use the `NavigationCardStack` to render the scenes.
-  render(): ReactElement {
+  render(): React.Element {
     return (
       <NavigationCardStack
         onNavigateBack={this._onPopRoute}
@@ -148,7 +148,7 @@ class YourNavigator extends React.Component {
   // Render a scene for route.
   // The detailed spec of `sceneProps` is defined at `NavigationTypeDefinition`
   // as type `NavigationSceneRendererProps`.
-  _renderScene(sceneProps: Object): ReactElement {
+  _renderScene(sceneProps: Object): React.Element {
     return (
       <YourScene
         route={sceneProps.scene.route}
diff --git a/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-example.js b/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-example.js
index db1b088f5e4..41d4d78d2ab 100644
--- a/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-example.js
+++ b/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-example.js
@@ -84,7 +84,7 @@ class Example extends Component {
     this.state = reducer();
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <ExampleNavigator
         navigationState={this.state}
@@ -128,7 +128,7 @@ class ExampleNavigator extends Component {
     navigate: PropTypes.func.isRequired,
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <NavigationTransitioner
         navigationState={this.props.navigationState}
@@ -140,7 +140,7 @@ class ExampleNavigator extends Component {
 
   _render(
     transitionProps: NavigationTransitionProps,
-  ): Array<ReactElement<any>> {
+  ): Array<React.Element<any>> {
     return transitionProps.scenes.map((scene) => {
       const sceneProps = {
         ...transitionProps,
@@ -152,7 +152,7 @@ class ExampleNavigator extends Component {
 
   _renderScene(
     sceneProps: NavigationSceneRendererProps,
-  ): ReactElement<any> {
+  ): React.Element<any> {
     return (
       <ExampleScene
         {...sceneProps}
@@ -181,7 +181,7 @@ class ExampleScene extends Component {
     navigate: PropTypes.func.isRequired,
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const {scene, navigate} = this.props;
     return (
       <Animated.View
diff --git a/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-pager-example.js b/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-pager-example.js
index 6f80561f9c1..394efbf5ea0 100644
--- a/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-pager-example.js
+++ b/Examples/UIExplorer/js/NavigationExperimental/NavigationTransitioner-AnimatedView-pager-example.js
@@ -95,7 +95,7 @@ class Example extends Component {
     this.state = reducer();
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <View style={styles.example}>
         <ExampleNavigator
@@ -154,7 +154,7 @@ class ExampleNavigator extends Component {
     this._renderScene = this._renderScene.bind(this);
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <NavigationTransitioner
         navigationState={this.props.navigationState}
@@ -165,7 +165,7 @@ class ExampleNavigator extends Component {
 
   _render(
     transitionProps: NavigationTransitionProps,
-  ): ReactElement<any> {
+  ): React.Element<any> {
     const scenes = transitionProps.scenes.map((scene) => {
       const sceneProps = {
         ...transitionProps,
@@ -182,7 +182,7 @@ class ExampleNavigator extends Component {
 
   _renderScene(
     sceneProps: NavigationSceneRendererProps,
-  ): ReactElement<any> {
+  ): React.Element<any> {
     return (
       <ExampleScene
         {...sceneProps}
@@ -203,7 +203,7 @@ class ExampleScene extends Component {
     navigate: PropTypes.func.isRequired,
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const {scene, navigate} = this.props;
 
     const panHandlers = NavigationPagerPanResponder.forHorizontal({
diff --git a/Examples/UIExplorer/js/NetInfoExample.js b/Examples/UIExplorer/js/NetInfoExample.js
index d2563a67fbc..e86929fc4ce 100644
--- a/Examples/UIExplorer/js/NetInfoExample.js
+++ b/Examples/UIExplorer/js/NetInfoExample.js
@@ -175,22 +175,22 @@ exports.examples = [
   {
     title: 'NetInfo.isConnected',
     description: 'Asynchronously load and observe connectivity',
-    render(): ReactElement<any> { return <IsConnected />; }
+    render(): React.Element<any> { return <IsConnected />; }
   },
   {
     title: 'NetInfo.update',
     description: 'Asynchronously load and observe connectionInfo',
-    render(): ReactElement<any> { return <ConnectionInfoCurrent />; }
+    render(): React.Element<any> { return <ConnectionInfoCurrent />; }
   },
   {
     title: 'NetInfo.updateHistory',
     description: 'Observed updates to connectionInfo',
-    render(): ReactElement<any> { return <ConnectionInfoSubscription />; }
+    render(): React.Element<any> { return <ConnectionInfoSubscription />; }
   },
   {
     platform: 'android',
     title: 'NetInfo.isConnectionExpensive (Android)',
     description: 'Asynchronously check isConnectionExpensive',
-    render(): ReactElement<any> { return <IsConnectionExpensive />; }
+    render(): React.Element<any> { return <IsConnectionExpensive />; }
   },
 ];
diff --git a/Examples/UIExplorer/js/PickerIOSExample.js b/Examples/UIExplorer/js/PickerIOSExample.js
index b6c8b8ba292..9e1b16670d0 100644
--- a/Examples/UIExplorer/js/PickerIOSExample.js
+++ b/Examples/UIExplorer/js/PickerIOSExample.js
@@ -147,13 +147,13 @@ exports.description = 'Render lists of selectable options with UIPickerView.';
 exports.examples = [
 {
   title: '<PickerIOS>',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <PickerExample />;
   },
 },
 {
   title: '<PickerIOS> with custom styling',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <PickerStyleExample />;
   },
 }];
diff --git a/Examples/UIExplorer/js/PushNotificationIOSExample.js b/Examples/UIExplorer/js/PushNotificationIOSExample.js
index b9bafe2a2ad..eed4c7a7042 100644
--- a/Examples/UIExplorer/js/PushNotificationIOSExample.js
+++ b/Examples/UIExplorer/js/PushNotificationIOSExample.js
@@ -193,7 +193,7 @@ exports.description = 'Apple PushNotification and badge value';
 exports.examples = [
 {
   title: 'Badge Number',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <View>
         <Button
@@ -210,13 +210,13 @@ exports.examples = [
 },
 {
   title: 'Push Notifications',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <NotificationExample />;
   }
 },
 {
   title: 'Notifications Permissions',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <NotificationPermissionExample />;
   }
 }];
diff --git a/Examples/UIExplorer/js/RCTRootViewIOSExample.js b/Examples/UIExplorer/js/RCTRootViewIOSExample.js
index 1228f2f299b..fadbb293a9b 100644
--- a/Examples/UIExplorer/js/RCTRootViewIOSExample.js
+++ b/Examples/UIExplorer/js/RCTRootViewIOSExample.js
@@ -90,7 +90,7 @@ exports.description = 'Examples that show useful methods when embedding React Na
 exports.examples = [
 {
   title: 'Updating app properties in runtime',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <AppPropertiesUpdateExample/>
     );
@@ -98,7 +98,7 @@ exports.examples = [
 },
 {
   title: 'RCTRootView\'s size flexibility',
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <RootViewSizeFlexibilityExample/>
     );
diff --git a/Examples/UIExplorer/js/SegmentedControlIOSExample.js b/Examples/UIExplorer/js/SegmentedControlIOSExample.js
index 6ce3920e65d..50dbd93f179 100644
--- a/Examples/UIExplorer/js/SegmentedControlIOSExample.js
+++ b/Examples/UIExplorer/js/SegmentedControlIOSExample.js
@@ -150,26 +150,26 @@ exports.description = 'Native segmented control';
 exports.examples = [
   {
     title: 'Segmented controls can have values',
-    render(): ReactElement<any> { return <BasicSegmentedControlExample />; }
+    render(): React.Element<any> { return <BasicSegmentedControlExample />; }
   },
   {
     title: 'Segmented controls can have a pre-selected value',
-    render(): ReactElement<any> { return <PreSelectedSegmentedControlExample />; }
+    render(): React.Element<any> { return <PreSelectedSegmentedControlExample />; }
   },
   {
     title: 'Segmented controls can be momentary',
-    render(): ReactElement<any> { return <MomentarySegmentedControlExample />; }
+    render(): React.Element<any> { return <MomentarySegmentedControlExample />; }
   },
   {
     title: 'Segmented controls can be disabled',
-    render(): ReactElement<any> { return <DisabledSegmentedControlExample />; }
+    render(): React.Element<any> { return <DisabledSegmentedControlExample />; }
   },
   {
     title: 'Custom colors can be provided',
-    render(): ReactElement<any> { return <ColorSegmentedControlExample />; }
+    render(): React.Element<any> { return <ColorSegmentedControlExample />; }
   },
   {
     title: 'Change events can be detected',
-    render(): ReactElement<any> { return <EventSegmentedControlExample />; }
+    render(): React.Element<any> { return <EventSegmentedControlExample />; }
   }
 ];
diff --git a/Examples/UIExplorer/js/SliderExample.js b/Examples/UIExplorer/js/SliderExample.js
index bd4a3c1fb0e..7fbdb8ac4a3 100644
--- a/Examples/UIExplorer/js/SliderExample.js
+++ b/Examples/UIExplorer/js/SliderExample.js
@@ -95,19 +95,19 @@ exports.description = 'Slider input for numeric values';
 exports.examples = [
   {
     title: 'Default settings',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <SliderExample />;
     }
   },
   {
     title: 'Initial value: 0.5',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <SliderExample value={0.5} />;
     }
   },
   {
     title: 'minimumValue: -1, maximumValue: 2',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <SliderExample
           minimumValue={-1}
@@ -118,13 +118,13 @@ exports.examples = [
   },
   {
     title: 'step: 0.25',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <SliderExample step={0.25} />;
     }
   },
   {
     title: 'onSlidingComplete',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <SlidingCompleteExample />
       );
@@ -133,7 +133,7 @@ exports.examples = [
   {
     title: 'Custom min/max track tint color',
     platform: 'ios',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <SliderExample
           minimumTrackTintColor={'red'}
@@ -145,21 +145,21 @@ exports.examples = [
   {
     title: 'Custom thumb image',
     platform: 'ios',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <SliderExample thumbImage={require('./uie_thumb_big.png')} />;
     }
   },
   {
     title: 'Custom track image',
     platform: 'ios',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return <SliderExample trackImage={require('./slider.png')} />;
     }
   },
   {
     title: 'Custom min/max track image',
     platform: 'ios',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <SliderExample
           minimumTrackImage={require('./slider-left.png')}
diff --git a/Examples/UIExplorer/js/SnapshotExample.js b/Examples/UIExplorer/js/SnapshotExample.js
index 03a8b6ba663..7f614baeaca 100644
--- a/Examples/UIExplorer/js/SnapshotExample.js
+++ b/Examples/UIExplorer/js/SnapshotExample.js
@@ -74,6 +74,6 @@ exports.description = 'API to capture images from the screen.';
 exports.examples = [
   {
     title: 'Take screenshot',
-    render(): ReactElement<any> { return <ScreenshotExample />; }
+    render(): React.Element<any> { return <ScreenshotExample />; }
   },
 ];
diff --git a/Examples/UIExplorer/js/SwitchExample.js b/Examples/UIExplorer/js/SwitchExample.js
index 3c7ddad0e86..13ee1125c2e 100644
--- a/Examples/UIExplorer/js/SwitchExample.js
+++ b/Examples/UIExplorer/js/SwitchExample.js
@@ -134,26 +134,26 @@ class EventSwitchExample extends React.Component {
 var examples = [
   {
     title: 'Switches can be set to true or false',
-    render(): ReactElement<any> { return <BasicSwitchExample />; }
+    render(): React.Element<any> { return <BasicSwitchExample />; }
   },
   {
     title: 'Switches can be disabled',
-    render(): ReactElement<any> { return <DisabledSwitchExample />; }
+    render(): React.Element<any> { return <DisabledSwitchExample />; }
   },
   {
     title: 'Change events can be detected',
-    render(): ReactElement<any> { return <EventSwitchExample />; }
+    render(): React.Element<any> { return <EventSwitchExample />; }
   },
   {
     title: 'Switches are controlled components',
-    render(): ReactElement<any> { return <Switch />; }
+    render(): React.Element<any> { return <Switch />; }
   }
 ];
 
 if (Platform.OS === 'ios') {
   examples.push({
     title: 'Custom colors can be provided',
-    render(): ReactElement<any> { return <ColorSwitchExample />; }
+    render(): React.Element<any> { return <ColorSwitchExample />; }
   });
 }
 
diff --git a/Examples/UIExplorer/js/TextExample.ios.js b/Examples/UIExplorer/js/TextExample.ios.js
index 605ed2b8a90..8676f36debd 100644
--- a/Examples/UIExplorer/js/TextExample.ios.js
+++ b/Examples/UIExplorer/js/TextExample.ios.js
@@ -433,7 +433,7 @@ exports.examples = [
   },
 }, {
   title: 'Toggling Attributes',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <AttributeToggler />;
   },
 }, {
@@ -575,7 +575,7 @@ exports.examples = [
   },
 }, {
   title: 'Dynamic Font Size Adjustment',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <AdjustingFontSize />;
   },
 }];
diff --git a/Examples/UIExplorer/js/TextInputExample.android.js b/Examples/UIExplorer/js/TextInputExample.android.js
index 93ff38f3ea2..660366de5c2 100644
--- a/Examples/UIExplorer/js/TextInputExample.android.js
+++ b/Examples/UIExplorer/js/TextInputExample.android.js
@@ -455,11 +455,11 @@ exports.examples = [
   },
   {
     title: 'Blur on submit',
-    render: function(): ReactElement { return <BlurOnSubmitExample />; },
+    render: function(): React.Element { return <BlurOnSubmitExample />; },
   },
   {
     title: 'Event handling',
-    render: function(): ReactElement { return <TextEventsExample />; },
+    render: function(): React.Element { return <TextEventsExample />; },
   },
   {
     title: 'Colors and text inputs',
@@ -708,7 +708,7 @@ exports.examples = [
   },
   {
     title: 'Toggle Default Padding',
-    render: function(): ReactElement { return <ToggleDefaultPaddingExample />; },
+    render: function(): React.Element { return <ToggleDefaultPaddingExample />; },
   },
   {
     title: 'Text selection & cursor placement',
diff --git a/Examples/UIExplorer/js/TextInputExample.ios.js b/Examples/UIExplorer/js/TextInputExample.ios.js
index 1c6f47bde55..aa548171f22 100644
--- a/Examples/UIExplorer/js/TextInputExample.ios.js
+++ b/Examples/UIExplorer/js/TextInputExample.ios.js
@@ -627,7 +627,7 @@ exports.examples = [
   },
   {
     title: 'Event handling',
-    render: function(): ReactElement<any> { return <TextEventsExample />; },
+    render: function(): React.Element<any> { return <TextEventsExample />; },
   },
   {
     title: 'Colored input text',
@@ -725,7 +725,7 @@ exports.examples = [
   },
   {
     title: 'Blur on submit',
-    render: function(): ReactElement<any> { return <BlurOnSubmitExample />; },
+    render: function(): React.Element<any> { return <BlurOnSubmitExample />; },
   },
   {
     title: 'Multiline blur on submit',
diff --git a/Examples/UIExplorer/js/TimerExample.js b/Examples/UIExplorer/js/TimerExample.js
index a3252285114..bb037bcfc0c 100644
--- a/Examples/UIExplorer/js/TimerExample.js
+++ b/Examples/UIExplorer/js/TimerExample.js
@@ -242,7 +242,7 @@ exports.examples = [
     title: 'this.setInterval(fn, t)',
     description: 'Execute function fn every t milliseconds until cancelled ' +
       'or component is unmounted.',
-    render: function(): ReactElement<any> {
+    render: function(): React.Element<any> {
       class IntervalExample extends React.Component {
         state = {
           showTimer: true,
diff --git a/Examples/UIExplorer/js/TouchableExample.js b/Examples/UIExplorer/js/TouchableExample.js
index ef741b5e652..0de886573b9 100644
--- a/Examples/UIExplorer/js/TouchableExample.js
+++ b/Examples/UIExplorer/js/TouchableExample.js
@@ -78,14 +78,14 @@ exports.examples = [
   },
 }, {
   title: '<Text onPress={fn}> with highlight',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <TextOnPressBox />;
   },
 }, {
   title: 'Touchable feedback events',
   description: '<Touchable*> components accept onPress, onPressIn, ' +
     'onPressOut, and onLongPress as props.',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <TouchableFeedbackEvents />;
   },
 }, {
@@ -93,13 +93,13 @@ exports.examples = [
   description: '<Touchable*> components also accept delayPressIn, ' +
     'delayPressOut, and delayLongPress as props. These props impact the ' +
     'timing of feedback events.',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <TouchableDelayEvents />;
   },
 }, {
   title: '3D Touch / Force Touch',
   description: 'iPhone 6s and 6s plus support 3D touch, which adds a force property to touches',
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return <ForceTouchExample />;
   },
   platform: 'ios',
@@ -107,14 +107,14 @@ exports.examples = [
    title: 'Touchable Hit Slop',
    description: '<Touchable*> components accept hitSlop prop which extends the touch area ' +
      'without changing the view bounds.',
-   render: function(): ReactElement<any> {
+   render: function(): React.Element<any> {
      return <TouchableHitSlop />;
    },
  }, {
    title: 'Disabled Touchable*',
    description: '<Touchable*> components accept disabled prop which prevents ' +
      'any interaction with component',
-   render: function(): ReactElement<any> {
+   render: function(): React.Element<any> {
      return <TouchableDisabled />;
    },
  }];
diff --git a/Examples/UIExplorer/js/TransformExample.js b/Examples/UIExplorer/js/TransformExample.js
index 780bdbea889..ea7ad3d1567 100644
--- a/Examples/UIExplorer/js/TransformExample.js
+++ b/Examples/UIExplorer/js/TransformExample.js
@@ -213,7 +213,7 @@ exports.examples = [
   {
     title: 'Perspective',
     description: 'perspective: 850, rotateX: Animated.timing(0 -> 360)',
-    render(): ReactElement<any> { return <Flip />; }
+    render(): React.Element<any> { return <Flip />; }
   },
   {
     title: 'Translate, Rotate, Scale',
diff --git a/Examples/UIExplorer/js/TransparentHitTestExample.js b/Examples/UIExplorer/js/TransparentHitTestExample.js
index aba90ae645d..6c27477ea26 100644
--- a/Examples/UIExplorer/js/TransparentHitTestExample.js
+++ b/Examples/UIExplorer/js/TransparentHitTestExample.js
@@ -46,6 +46,6 @@ exports.description = 'Transparent view receiving touch events';
 exports.examples = [
   {
     title: 'TransparentHitTestExample',
-    render(): ReactElement<any> { return <TransparentHitTestExample />; }
+    render(): React.Element<any> { return <TransparentHitTestExample />; }
   }
 ];
diff --git a/Examples/UIExplorer/js/UIExplorerApp.ios.js b/Examples/UIExplorer/js/UIExplorerApp.ios.js
index 63ad5a38880..8803f8c5574 100644
--- a/Examples/UIExplorer/js/UIExplorerApp.ios.js
+++ b/Examples/UIExplorer/js/UIExplorerApp.ios.js
@@ -145,7 +145,7 @@ class UIExplorerApp extends React.Component {
     );
   }
 
-  _renderHeader(props: NavigationSceneRendererProps): ReactElement<any> {
+  _renderHeader(props: NavigationSceneRendererProps): React.Element<any> {
     return (
       <NavigationHeader
         {...props}
@@ -155,7 +155,7 @@ class UIExplorerApp extends React.Component {
     );
   }
 
-  _renderTitleComponent(props: NavigationSceneRendererProps): ReactElement<any> {
+  _renderTitleComponent(props: NavigationSceneRendererProps): React.Element<any> {
     return (
       <NavigationHeader.Title>
         {UIExplorerStateTitleMap(props.scene.route)}
@@ -163,7 +163,7 @@ class UIExplorerApp extends React.Component {
     );
   }
 
-  _renderScene(props: NavigationSceneRendererProps): ?ReactElement<any> {
+  _renderScene(props: NavigationSceneRendererProps): ?React.Element<any> {
     const state = props.scene.route;
     if (state.key === 'AppList') {
       return (
diff --git a/Examples/UIExplorer/js/UIExplorerExampleContainer.js b/Examples/UIExplorer/js/UIExplorerExampleContainer.js
index f59a3f110ca..598a31dce37 100644
--- a/Examples/UIExplorer/js/UIExplorerExampleContainer.js
+++ b/Examples/UIExplorer/js/UIExplorerExampleContainer.js
@@ -51,7 +51,7 @@ class UIExplorerExampleContainer extends React.Component {
     );
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     if (!this.props.module.examples) {
       return <this.props.module />;
     }
diff --git a/Examples/UIExplorer/js/UIExplorerExampleList.js b/Examples/UIExplorer/js/UIExplorerExampleList.js
index 633ce7177b6..47772a63f7f 100644
--- a/Examples/UIExplorer/js/UIExplorerExampleList.js
+++ b/Examples/UIExplorer/js/UIExplorerExampleList.js
@@ -63,7 +63,7 @@ type Props = {
 class UIExplorerExampleList extends React.Component {
   props: Props
 
-  render(): ?ReactElement<any> {
+  render(): ?React.Element<any> {
     const filterText = this.props.persister.state.filter;
     const filterRegex = new RegExp(String(filterText), 'i');
     const filter = (example) => filterRegex.test(example.module.title);
@@ -90,7 +90,7 @@ class UIExplorerExampleList extends React.Component {
     );
   }
 
-  _renderTitleRow(): ?ReactElement<any> {
+  _renderTitleRow(): ?React.Element<any> {
     if (!this.props.displayTitleRow) {
       return null;
     }
@@ -106,7 +106,7 @@ class UIExplorerExampleList extends React.Component {
     );
   }
 
-  _renderTextInput(): ?ReactElement<any> {
+  _renderTextInput(): ?React.Element<any> {
     if (this.props.disableSearch) {
       return null;
     }
@@ -129,7 +129,7 @@ class UIExplorerExampleList extends React.Component {
     );
   }
 
-  _renderSectionHeader(data: any, section: string): ?ReactElement<any> {
+  _renderSectionHeader(data: any, section: string): ?React.Element<any> {
     return (
       <Text style={styles.sectionHeader}>
         {section.toUpperCase()}
@@ -137,7 +137,7 @@ class UIExplorerExampleList extends React.Component {
     );
   }
 
-  _renderExampleRow(example: {key: string, module: Object}): ?ReactElement<any> {
+  _renderExampleRow(example: {key: string, module: Object}): ?React.Element<any> {
     return this._renderRow(
       example.module.title,
       example.module.description,
@@ -146,7 +146,7 @@ class UIExplorerExampleList extends React.Component {
     );
   }
 
-  _renderRow(title: string, description: string, key: ?string, handler: ?Function): ?ReactElement<any> {
+  _renderRow(title: string, description: string, key: ?string, handler: ?Function): ?React.Element<any> {
     return (
       <View key={key || title}>
         <TouchableHighlight onPress={handler}>
diff --git a/Examples/UIExplorer/js/WebSocketExample.js b/Examples/UIExplorer/js/WebSocketExample.js
index d3400fdbcd1..79e70a35557 100644
--- a/Examples/UIExplorer/js/WebSocketExample.js
+++ b/Examples/UIExplorer/js/WebSocketExample.js
@@ -50,7 +50,7 @@ const WS_STATES = [
 ];
 
 class Button extends React.Component {
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const label = <Text style={styles.buttonLabel}>{this.props.label}</Text>;
     if (this.props.disabled) {
       return (
@@ -70,7 +70,7 @@ class Button extends React.Component {
 }
 
 class Row extends React.Component {
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <View style={styles.row}>
         <Text>{this.props.label}</Text>
@@ -169,7 +169,7 @@ class WebSocketExample extends React.Component<any, any, State> {
     this.setState({outgoingMessage: ''});
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const socketState = WS_STATES[this.state.socketState || -1];
     const canConnect =
       !this.state.socket ||
diff --git a/Examples/UIExplorer/js/WebViewExample.js b/Examples/UIExplorer/js/WebViewExample.js
index 469c0626203..a27451b90ee 100644
--- a/Examples/UIExplorer/js/WebViewExample.js
+++ b/Examples/UIExplorer/js/WebViewExample.js
@@ -337,15 +337,15 @@ exports.description = 'Base component to display web content';
 exports.examples = [
   {
     title: 'Simple Browser',
-    render(): ReactElement<any> { return <WebViewExample />; }
+    render(): React.Element<any> { return <WebViewExample />; }
   },
   {
     title: 'Scale Page to Fit',
-    render(): ReactElement<any> { return <ScaledWebView/>; }
+    render(): React.Element<any> { return <ScaledWebView/>; }
   },
   {
     title: 'Bundled HTML',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <WebView
           style={{
@@ -360,7 +360,7 @@ exports.examples = [
   },
   {
     title: 'Static HTML',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <WebView
           style={{
@@ -375,7 +375,7 @@ exports.examples = [
   },
   {
     title: 'POST Test',
-    render(): ReactElement<any> {
+    render(): React.Element<any> {
       return (
         <WebView
           style={{
diff --git a/IntegrationTests/PromiseTest.js b/IntegrationTests/PromiseTest.js
index 861983bc292..8ee329ba139 100644
--- a/IntegrationTests/PromiseTest.js
+++ b/IntegrationTests/PromiseTest.js
@@ -65,7 +65,7 @@ class PromiseTest extends React.Component {
     }
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return <View />;
   }
 }
diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index e7d9b3c9670..437c09c0261 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -148,7 +148,7 @@ const KeyboardAvoidingView = React.createClass({
     this.subscriptions.forEach((sub) => sub.remove());
   },
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const {behavior, children, style, ...props} = this.props;
 
     switch (behavior) {
diff --git a/Libraries/Components/LazyRenderer.js b/Libraries/Components/LazyRenderer.js
index bad1ddcd99b..f3bfd6b1baf 100644
--- a/Libraries/Components/LazyRenderer.js
+++ b/Libraries/Components/LazyRenderer.js
@@ -34,7 +34,7 @@ var LazyRenderer = React.createClass({
     });
   },
 
-  render: function(): ?ReactElement {
+  render: function(): ?React.Element {
     return this.state._lazyRender ? null : this.props.render();
   },
 });
diff --git a/Libraries/Components/StaticRenderer.js b/Libraries/Components/StaticRenderer.js
index bbf4eb55f40..f6513185444 100644
--- a/Libraries/Components/StaticRenderer.js
+++ b/Libraries/Components/StaticRenderer.js
@@ -28,7 +28,7 @@ class StaticRenderer extends React.Component {
     return nextProps.shouldUpdate;
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return this.props.render();
   }
 }
diff --git a/Libraries/Components/StatusBar/StatusBar.js b/Libraries/Components/StatusBar/StatusBar.js
index f30bd2b44df..48c70921c44 100644
--- a/Libraries/Components/StatusBar/StatusBar.js
+++ b/Libraries/Components/StatusBar/StatusBar.js
@@ -386,7 +386,7 @@ class StatusBar extends React.Component {
     });
   };
 
-  render(): ?ReactElement<any> {
+  render(): ?React.Element<any> {
     return null;
   }
 }
diff --git a/Libraries/Components/Touchable/TouchableBounce.js b/Libraries/Components/Touchable/TouchableBounce.js
index b7ab733e74d..881713344b6 100644
--- a/Libraries/Components/Touchable/TouchableBounce.js
+++ b/Libraries/Components/Touchable/TouchableBounce.js
@@ -131,7 +131,7 @@ var TouchableBounce = React.createClass({
     return 0;
   },
 
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     return (
       <Animated.View
         style={[{transform: [{scale: this.state.scale}]}, this.props.style]}
diff --git a/Libraries/Components/Touchable/TouchableWithoutFeedback.js b/Libraries/Components/Touchable/TouchableWithoutFeedback.js
index fd5d977bfce..c04e7a49f23 100755
--- a/Libraries/Components/Touchable/TouchableWithoutFeedback.js
+++ b/Libraries/Components/Touchable/TouchableWithoutFeedback.js
@@ -148,7 +148,7 @@ const TouchableWithoutFeedback = React.createClass({
     return this.props.delayPressOut || 0;
   },
 
-  render: function(): ReactElement<any> {
+  render: function(): React.Element<any> {
     // Note(avik): remove dynamic typecast once Flow has been upgraded
     const child = onlyChild(this.props.children);
     let children = child.props.children;
diff --git a/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js b/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js
index 887123fbcc1..6b0fd7999c9 100644
--- a/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js
+++ b/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js
@@ -76,7 +76,7 @@ class NavigationCard extends React.Component<any, Props, any> {
     style: PropTypes.any,
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const {
       panHandlers,
       pointerEvents,
diff --git a/Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js b/Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js
index e4b7c564ad0..a36a0d2e622 100644
--- a/Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js
+++ b/Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js
@@ -202,7 +202,7 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     this._renderScene = this._renderScene.bind(this);
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <NavigationTransitioner
         navigationState={this.props.navigationState}
@@ -212,7 +212,7 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     );
   }
 
-  _render(props: NavigationTransitionProps): ReactElement<any> {
+  _render(props: NavigationTransitionProps): React.Element<any> {
     const {
       renderHeader
     } = this.props;
@@ -237,7 +237,7 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     );
   }
 
-  _renderScene(props: NavigationSceneRendererProps): ReactElement<any> {
+  _renderScene(props: NavigationSceneRendererProps): React.Element<any> {
     const isVertical = this.props.direction === 'vertical';
 
     const style = isVertical ?
diff --git a/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js b/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js
index 84347dc04b0..990a82c0efc 100644
--- a/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js
+++ b/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js
@@ -56,7 +56,7 @@ type SubViewProps = NavigationSceneRendererProps & {
   onNavigateBack: ?Function,
 };
 
-type SubViewRenderer = (subViewProps: SubViewProps) => ?ReactElement<any>;
+type SubViewRenderer = (subViewProps: SubViewProps) => ?React.Element<any>;
 
 type DefaultProps = {
   renderLeftComponent: SubViewRenderer,
@@ -128,7 +128,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     );
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const { scenes, style, viewProps } = this.props;
 
     const scenesProps = scenes.map(scene => {
@@ -156,7 +156,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     );
   }
 
-  _renderLeft(props: NavigationSceneRendererProps): ?ReactElement<any> {
+  _renderLeft(props: NavigationSceneRendererProps): ?React.Element<any> {
     return this._renderSubView(
       props,
       'left',
@@ -165,7 +165,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     );
   }
 
-  _renderTitle(props: NavigationSceneRendererProps): ?ReactElement<any> {
+  _renderTitle(props: NavigationSceneRendererProps): ?React.Element<any> {
     return this._renderSubView(
       props,
       'title',
@@ -174,7 +174,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     );
   }
 
-  _renderRight(props: NavigationSceneRendererProps): ?ReactElement<any> {
+  _renderRight(props: NavigationSceneRendererProps): ?React.Element<any> {
     return this._renderSubView(
       props,
       'right',
@@ -188,7 +188,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     name: SubViewName,
     renderer: SubViewRenderer,
     styleInterpolator: NavigationStyleInterpolator,
-  ): ?ReactElement<any> {
+  ): ?React.Element<any> {
     const {
       scene,
       navigationState,
diff --git a/Libraries/CustomComponents/NavigationExperimental/NavigationHeaderTitle.js b/Libraries/CustomComponents/NavigationExperimental/NavigationHeaderTitle.js
index 9c4b615b579..61d39d4608f 100644
--- a/Libraries/CustomComponents/NavigationExperimental/NavigationHeaderTitle.js
+++ b/Libraries/CustomComponents/NavigationExperimental/NavigationHeaderTitle.js
@@ -43,7 +43,7 @@ const {
 } = ReactNative;
 
 type Props = {
-  children?: ReactElement<any>,
+  children?: React.Element<any>,
   style?: any,
   textStyle?: any,
   viewProps?: any,
diff --git a/Libraries/CustomComponents/NavigationExperimental/NavigationPointerEventsContainer.js b/Libraries/CustomComponents/NavigationExperimental/NavigationPointerEventsContainer.js
index e581b9300cc..a6ef36fc258 100644
--- a/Libraries/CustomComponents/NavigationExperimental/NavigationPointerEventsContainer.js
+++ b/Libraries/CustomComponents/NavigationExperimental/NavigationPointerEventsContainer.js
@@ -86,7 +86,7 @@ function create(
       this._bindPosition(nextProps);
     }
 
-    render(): ReactElement<any>  {
+    render(): React.Element<any>  {
       this._pointerEvents = this._computePointerEvents();
       return (
         <Component
diff --git a/Libraries/Experimental/Incremental.js b/Libraries/Experimental/Incremental.js
index 5cee3993c87..8c5cf10cbc1 100644
--- a/Libraries/Experimental/Incremental.js
+++ b/Libraries/Experimental/Incremental.js
@@ -152,7 +152,7 @@ class Incremental extends React.Component<DefaultProps, Props, State> {
     }).done();
   }
 
-  render(): ?ReactElement<any> {
+  render(): ?React.Element<any> {
     if (this._rendered || // Make sure that once we render once, we stay rendered even if incrementalGroupEnabled gets flipped.
         !this.context.incrementalGroupEnabled ||
         this.state.doIncrementalRender) {
diff --git a/Libraries/Experimental/IncrementalExample.js b/Libraries/Experimental/IncrementalExample.js
index 0e6779d4515..fec399cb07e 100644
--- a/Libraries/Experimental/IncrementalExample.js
+++ b/Libraries/Experimental/IncrementalExample.js
@@ -124,7 +124,7 @@ class IncrementalExample extends React.Component {
       console.log('onDone:', stats);
     }, 0);
   }
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <IncrementalGroup
         disabled={false}
diff --git a/Libraries/Experimental/IncrementalGroup.js b/Libraries/Experimental/IncrementalGroup.js
index 728e3aa3c5c..a3c08ac59c8 100644
--- a/Libraries/Experimental/IncrementalGroup.js
+++ b/Libraries/Experimental/IncrementalGroup.js
@@ -65,7 +65,7 @@ class IncrementalGroup extends React.Component {
     };
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <Incremental
         onDone={this.props.onDone}
diff --git a/Libraries/Experimental/SwipeableRow/SwipeableListView.js b/Libraries/Experimental/SwipeableRow/SwipeableListView.js
index 023db029e56..28a5287afeb 100644
--- a/Libraries/Experimental/SwipeableRow/SwipeableListView.js
+++ b/Libraries/Experimental/SwipeableRow/SwipeableListView.js
@@ -65,7 +65,7 @@ class SwipeableListView extends React.Component {
   props: Props;
   state: State;
 
-  _listViewRef: ?ReactElement<any> = null;
+  _listViewRef: ?React.Element<any> = null;
   _shouldBounceFirstRowOnMount: boolean = false;
 
   static getNewDataSource(): Object {
@@ -118,7 +118,7 @@ class SwipeableListView extends React.Component {
     }
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <ListView
         {...this.props}
@@ -163,7 +163,7 @@ class SwipeableListView extends React.Component {
     }
   }
 
-  _renderRow = (rowData: Object, sectionID: string, rowID: string): ReactElement<any> => {
+  _renderRow = (rowData: Object, sectionID: string, rowID: string): React.Element<any> => {
     const slideoutView = this.props.renderQuickActions(rowData, sectionID, rowID);
 
     // If renderRowSlideout is unspecified or returns falsey, don't allow swipe
diff --git a/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js b/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js
index ab6367e297f..87220aab85e 100644
--- a/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js
+++ b/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js
@@ -59,7 +59,7 @@ class SwipeableQuickActionButton extends React.Component {
     textStyle: Text.propTypes.style,
   };
 
-  render(): ?ReactElement<any> {
+  render(): ?React.Element<any> {
     if (!this.props.imageSource && !this.props.text) {
       return null;
     }
diff --git a/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js b/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js
index 73e171b3299..ff192bf8a01 100644
--- a/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js
+++ b/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js
@@ -46,7 +46,7 @@ class SwipeableQuickActions extends React.Component {
     style: View.propTypes.style,
   };
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     // $FlowFixMe found when converting React.createClass to ES6
     const children = this.props.children;
     let buttons = [];
diff --git a/Libraries/Experimental/SwipeableRow/SwipeableRow.js b/Libraries/Experimental/SwipeableRow/SwipeableRow.js
index 09315ab653e..e76461ed00e 100644
--- a/Libraries/Experimental/SwipeableRow/SwipeableRow.js
+++ b/Libraries/Experimental/SwipeableRow/SwipeableRow.js
@@ -168,7 +168,7 @@ const SwipeableRow = React.createClass({
     return true;
   },
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     // The view hidden behind the main view
     let slideOutView;
     if (this.state.isSwipeableViewRendered) {
diff --git a/Libraries/Experimental/WindowedListView.js b/Libraries/Experimental/WindowedListView.js
index 150d003c782..9d77ca3718f 100644
--- a/Libraries/Experimental/WindowedListView.js
+++ b/Libraries/Experimental/WindowedListView.js
@@ -92,15 +92,15 @@ type Props = {
    */
   renderRow: (
     rowData: any, sectionIdx: number, rowIdx: number, rowKey: string
-  ) => ?ReactElement<any>,
+  ) => ?React.Element<any>,
   /**
    * Rendered when the list is scrolled faster than rows can be rendered.
    */
-  renderWindowBoundaryIndicator?: () => ?ReactElement<any>,
+  renderWindowBoundaryIndicator?: () => ?React.Element<any>,
   /**
    * Always rendered at the bottom of all the rows.
    */
-  renderFooter?: () => ?ReactElement<any>,
+  renderFooter?: () => ?React.Element<any>,
   /**
    * Pipes through normal onScroll events from the underlying `ScrollView`.
    */
@@ -140,7 +140,7 @@ type Props = {
    * A function that returns the scrollable component in which the list rows
    * are rendered. Defaults to returning a ScrollView with the given props.
    */
-  renderScrollComponent: (props: ?Object) => ReactElement<any>,
+  renderScrollComponent: (props: ?Object) => React.Element<any>,
   /**
    * Use to disable incremental rendering when not wanted, e.g. to speed up initial render.
    */
@@ -433,7 +433,7 @@ class WindowedListView extends React.Component {
     this._firstVisible = newFirstVisible;
     this._lastVisible = newLastVisible;
   }
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     const {firstRow} = this.state;
     const lastRow = clamp(0, this.state.lastRow, this.props.data.length - 1);
     const rowFrames = this._rowFrames;
@@ -588,7 +588,7 @@ type CellProps = {
    */
    renderRow: (
       rowData: mixed, sectionIdx: number, rowIdx: number, rowKey: string
-   ) => ?ReactElement<any>,
+   ) => ?React.Element<any>,
   /**
    * Index of the row, passed through to other callbacks.
    */
diff --git a/Libraries/Inspector/NetworkOverlay.js b/Libraries/Inspector/NetworkOverlay.js
index 81ad07c5747..8ca4a64534f 100644
--- a/Libraries/Inspector/NetworkOverlay.js
+++ b/Libraries/Inspector/NetworkOverlay.js
@@ -58,7 +58,7 @@ class NetworkOverlay extends React.Component {
   _listViewHighlighted: bool;
   _listViewHeight: number;
   _scrollView: ?ScrollView;
-  _detailViewItems: Array<Array<ReactElement<any>>>;
+  _detailViewItems: Array<Array<React.Element<any>>>;
   _listViewOnLayout: (event: Event) => void;
   _captureRequestListView: (listRef: ?ListView) => void;
   _captureDetailScrollView: (scrollRef: ?ScrollView) => void;
@@ -67,8 +67,8 @@ class NetworkOverlay extends React.Component {
     sectionID: number,
     rowID: number,
     highlightRow: (sectionID: number, rowID: number) => void,
-  ) => ReactElement<any>;
-  _renderScrollComponent: (props: Object) => ReactElement<any>;
+  ) => React.Element<any>;
+  _renderScrollComponent: (props: Object) => React.Element<any>;
   _closeButtonClicked: () => void;
   // Map of `socketId` -> `index in `_requests``.
   _socketIdMap: Object;
@@ -294,7 +294,7 @@ class NetworkOverlay extends React.Component {
     sectionID: number,
     rowID: number,
     highlightRow: (sectionID: number, rowID: number) => void,
-  ): ReactElement<any> {
+  ): React.Element<any> {
     let urlCellViewStyle = styles.urlEvenCellView;
     let methodCellViewStyle = styles.methodEvenCellView;
     if (rowID % 2 === 1) {
@@ -327,7 +327,7 @@ class NetworkOverlay extends React.Component {
   _renderSeperator(
     sectionID: number,
     rowID: number,
-    adjacentRowHighlighted: bool): ReactElement<any> {
+    adjacentRowHighlighted: bool): React.Element<any> {
     return (
       <View
         key={`${sectionID}-${rowID}`}
@@ -367,7 +367,7 @@ class NetworkOverlay extends React.Component {
     this._listViewHeight = height;
   }
 
-  _renderScrollComponent(props: Object): ReactElement<any> {
+  _renderScrollComponent(props: Object): React.Element<any> {
     return (
       <RecyclerViewBackedScrollView {...props} />
     );
diff --git a/Libraries/Modal/Modal.js b/Libraries/Modal/Modal.js
index 62672bfba32..74b91d89fb1 100644
--- a/Libraries/Modal/Modal.js
+++ b/Libraries/Modal/Modal.js
@@ -128,7 +128,7 @@ class Modal extends React.Component {
     visible: true,
   };
 
-  render(): ?ReactElement<any> {
+  render(): ?React.Element<any> {
     if (this.props.visible === false) {
       return null;
     }
diff --git a/Libraries/NavigationExperimental/NavigationTransitioner.js b/Libraries/NavigationExperimental/NavigationTransitioner.js
index ef8282a0510..f13eeb72868 100644
--- a/Libraries/NavigationExperimental/NavigationTransitioner.js
+++ b/Libraries/NavigationExperimental/NavigationTransitioner.js
@@ -175,7 +175,7 @@ class NavigationTransitioner extends React.Component<any, Props, State> {
     });
   }
 
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     return (
       <View
         onLayout={this._onLayout}
diff --git a/Libraries/Text/Text.js b/Libraries/Text/Text.js
index e9d55ab9e36..fa9a3bd95e9 100644
--- a/Libraries/Text/Text.js
+++ b/Libraries/Text/Text.js
@@ -221,7 +221,7 @@ const Text = React.createClass({
   touchableHandlePress: (null: ?Function),
   touchableHandleLongPress: (null: ?Function),
   touchableGetPressRectOffset: (null: ?Function),
-  render(): ReactElement<any> {
+  render(): React.Element<any> {
     let newProps = this.props;
     if (this.props.onStartShouldSetResponder || this._hasPressHandler()) {
       if (!this._handlers) {