diff --git a/packages/react-native/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js b/packages/react-native/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js index b00d8af9028..fc47c65e354 100644 --- a/packages/react-native/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js +++ b/packages/react-native/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js @@ -105,7 +105,7 @@ type Props = $ReadOnly<{| /** * The navigation view that will be rendered to the side of the screen and can be pulled in. */ - renderNavigationView: () => React.Element, + renderNavigationView: () => React.MixedElement, /** * Make the drawer take the entire screen and draw the background of the diff --git a/packages/react-native/Libraries/Components/RefreshControl/__mocks__/RefreshControlMock.js b/packages/react-native/Libraries/Components/RefreshControl/__mocks__/RefreshControlMock.js index 005c7e42db2..d69f981ea47 100644 --- a/packages/react-native/Libraries/Components/RefreshControl/__mocks__/RefreshControlMock.js +++ b/packages/react-native/Libraries/Components/RefreshControl/__mocks__/RefreshControlMock.js @@ -22,7 +22,7 @@ class RefreshControlMock extends React.Component<{...}> { componentDidMount() { RefreshControlMock.latestRef = this; } - render(): React.Element { + render(): React.MixedElement { return ; } } diff --git a/packages/react-native/Libraries/Inspector/NetworkOverlay.js b/packages/react-native/Libraries/Inspector/NetworkOverlay.js index 1e4d63f27fd..52850897fd1 100644 --- a/packages/react-native/Libraries/Inspector/NetworkOverlay.js +++ b/packages/react-native/Libraries/Inspector/NetworkOverlay.js @@ -335,7 +335,7 @@ class NetworkOverlay extends React.Component { _renderItem = ({ item, index, - }: RenderItemProps): React.Element => { + }: RenderItemProps): React.MixedElement => { const tableRowViewStyle = [ styles.tableRow, index % 2 === 1 ? styles.tableRowOdd : styles.tableRowEven, diff --git a/packages/react-native/Libraries/Lists/FlatList.js b/packages/react-native/Libraries/Lists/FlatList.js index f34fe50f872..6075f6841b4 100644 --- a/packages/react-native/Libraries/Lists/FlatList.js +++ b/packages/react-native/Libraries/Lists/FlatList.js @@ -617,7 +617,7 @@ class FlatList extends React.PureComponent, void> { } _renderer = ( - ListItemComponent: ?(React.ComponentType | React.Element), + ListItemComponent: ?(React.ComponentType | React.MixedElement), renderItem: ?RenderItemType, columnWrapperStyle: ?ViewStyleProp, numColumns: ?number, diff --git a/packages/react-native/Libraries/Utilities/ReactNativeTestTools.js b/packages/react-native/Libraries/Utilities/ReactNativeTestTools.js index ac0bcede36c..1d8b4f1bfba 100644 --- a/packages/react-native/Libraries/Utilities/ReactNativeTestTools.js +++ b/packages/react-native/Libraries/Utilities/ReactNativeTestTools.js @@ -115,7 +115,7 @@ function expectNoConsoleError() { async function expectRendersMatchingSnapshot( name: string, - ComponentProvider: () => React.Element, + ComponentProvider: () => React.MixedElement, unmockComponent: () => mixed, ) { let instance; diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap index dc58d59d1bd..febd1d01ed2 100644 --- a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap +++ b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap @@ -9403,7 +9403,7 @@ declare function expectNoConsoleWarn(): void; declare function expectNoConsoleError(): void; declare function expectRendersMatchingSnapshot( name: string, - ComponentProvider: () => React.Element, + ComponentProvider: () => React.MixedElement, unmockComponent: () => mixed ): void; declare function maximumDepthOfJSON(node: ?ReactTestRendererJSON): number; diff --git a/packages/react-native/jest/mockModal.js b/packages/react-native/jest/mockModal.js index d74eb040c86..2d7f9b5571d 100644 --- a/packages/react-native/jest/mockModal.js +++ b/packages/react-native/jest/mockModal.js @@ -12,13 +12,11 @@ 'use strict'; -import typeof Modal from '../Libraries/Modal/Modal'; - const React = require('react'); function mockModal(BaseComponent: $FlowFixMe) { class ModalMock extends BaseComponent { - render(): React.Element | null { + render(): React.MixedElement | null { if (this.props.visible === false) { return null; } diff --git a/packages/react-native/jest/mockScrollView.js b/packages/react-native/jest/mockScrollView.js index 8a640276385..4d42a206ff7 100644 --- a/packages/react-native/jest/mockScrollView.js +++ b/packages/react-native/jest/mockScrollView.js @@ -20,7 +20,7 @@ const RCTScrollView: $FlowFixMe = requireNativeComponent('RCTScrollView'); function mockScrollView(BaseComponent: $FlowFixMe) { class ScrollViewMock extends BaseComponent { - render(): React.Element { + render(): React.MixedElement { return ( {this.props.refreshControl} diff --git a/packages/react-native/jest/renderer.js b/packages/react-native/jest/renderer.js index db97a3dd089..106b4be7b28 100644 --- a/packages/react-native/jest/renderer.js +++ b/packages/react-native/jest/renderer.js @@ -16,7 +16,7 @@ import * as React from 'react'; import TestRenderer from 'react-test-renderer'; export async function create( - Component: React.Element, + Component: React.MixedElement, ): Promise { let component; await TestRenderer.act(async () => { @@ -33,7 +33,7 @@ export async function unmount(testRenderer: ReactTestRenderer) { export async function update( testRenderer: ReactTestRenderer, - element: React.Element, + element: React.MixedElement, ) { await TestRenderer.act(async () => { testRenderer.update(element); diff --git a/packages/rn-tester/js/components/RNTesterExampleFilter.js b/packages/rn-tester/js/components/RNTesterExampleFilter.js index dc37bd8b22e..7f7ac6891fa 100644 --- a/packages/rn-tester/js/components/RNTesterExampleFilter.js +++ b/packages/rn-tester/js/components/RNTesterExampleFilter.js @@ -100,7 +100,7 @@ class RNTesterExampleFilter extends React.Component, State> { } } - _renderTextInput(): ?React.Element { + _renderTextInput(): ?React.MixedElement { if (this.props.disableSearch) { return null; } diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.js index 6cce3364fcc..08ea74daba6 100644 --- a/packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.js +++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.js @@ -277,7 +277,7 @@ exports.description = 'Android specific Accessibility APIs.'; exports.examples = [ { title: 'Accessibility elements', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js index f7e92706c4a..73b75e81af2 100644 --- a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js +++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js @@ -1809,80 +1809,80 @@ exports.description = 'Examples of using Accessibility APIs.'; exports.examples = [ { title: 'Accessibility expanded', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Accessibility elements', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Automatic Content Grouping', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'New accessibility roles and states', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Accessibility action examples', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Fake Slider Example', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Fake SliderExample For AccessibilityValue', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Check if the display options are enabled', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Check if the screen reader announces', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Check if accessibility is focused', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Check if these properties are enabled', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Testing importantForAccessibility', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Check if accessibilityState disabled is announced when the screenreader focus moves on the image', - render(): React.Element { + render(): React.MixedElement { return ( { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js index a40fb35f7ec..b4d9681cba9 100644 --- a/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js +++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js @@ -79,7 +79,7 @@ exports.description = 'iOS specific Accessibility APIs'; exports.examples = [ { title: 'iOS Accessibility elements', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js b/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js index 53369e0e917..623067a4af0 100644 --- a/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js +++ b/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js @@ -464,61 +464,61 @@ exports.description = "Interface to show iOS' action sheets"; exports.examples = [ { title: 'Show Action Sheet', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Action Sheet with tinted buttons', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Action Sheet with cancel tinted button', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Action Sheet with anchor', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Action Sheet with disabled buttons', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Action Sheet and automatically dismiss it', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Show Share Action Sheet', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Share Local Image', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Share Screenshot', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Share from Anchor', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/Animated/ContinuousInteractionsExample.js b/packages/rn-tester/js/examples/Animated/ContinuousInteractionsExample.js index e176011dca5..8656015bb26 100644 --- a/packages/rn-tester/js/examples/Animated/ContinuousInteractionsExample.js +++ b/packages/rn-tester/js/examples/Animated/ContinuousInteractionsExample.js @@ -29,7 +29,7 @@ export default ({ description: ('Gesture events, chaining, 2D ' + 'values, interrupting and transitioning ' + 'animations, etc.': string), - render(): React.Element { + render() { return ; }, }: RNTesterModuleExample); diff --git a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExApp.js b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExApp.js index e6f7fe7a1c4..217e1647413 100644 --- a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExApp.js +++ b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExApp.js @@ -392,7 +392,7 @@ exports.description = exports.examples = [ { title: 'And example app', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/AppState/AppStateExample.js b/packages/rn-tester/js/examples/AppState/AppStateExample.js index e41932a9c6b..069ceba9641 100644 --- a/packages/rn-tester/js/examples/AppState/AppStateExample.js +++ b/packages/rn-tester/js/examples/AppState/AppStateExample.js @@ -127,13 +127,13 @@ exports.examples = [ title: 'Subscribed AppState:', description: 'This changes according to the current state, so you can only ever see it rendered as "active"', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Previous states:', - render(): React.Element { + render(): React.MixedElement { return ; }, }, @@ -142,7 +142,7 @@ exports.examples = [ title: 'Memory Warnings', description: 'In the IOS simulator, hit Shift+Command+M to simulate a memory warning.', - render(): React.Element { + render(): React.MixedElement { return ; }, }, @@ -151,7 +151,7 @@ exports.examples = [ title: 'Focus/Blur Events', description: 'In the Android simulator, toggle the notification drawer to fire events.', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js index d688e29e03f..08d117d4836 100644 --- a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js +++ b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js @@ -176,13 +176,13 @@ exports.examples = [ }, { title: 'Non-component `getColorScheme` API', - render(): React.Element { + render(): React.MixedElement { return ; }, }, { title: 'Consuming Context', - render(): React.Element { + render(): React.MixedElement { return ( {theme => { @@ -200,7 +200,7 @@ exports.examples = [ }, { title: 'Context forced to light theme', - render(): React.Element { + render(): React.MixedElement { return ( @@ -214,7 +214,7 @@ exports.examples = [ }, { title: 'Context forced to dark theme', - render(): React.Element { + render(): React.MixedElement { return ( @@ -229,7 +229,7 @@ exports.examples = [ { title: 'RNTester App Colors', description: 'A light and a dark theme based on standard iOS 13 colors.', - render(): React.Element { + render(): React.MixedElement { return ( @@ -245,7 +245,7 @@ exports.examples = [ { title: 'Toggle native appearance', description: 'Overwrite application-level appearance mode', - render(): React.Element { + render(): React.MixedElement { return ; }, }, diff --git a/packages/rn-tester/js/examples/DevSettings/DevSettingsExample.js b/packages/rn-tester/js/examples/DevSettings/DevSettingsExample.js index 293ad1527e4..7461fcf86d3 100644 --- a/packages/rn-tester/js/examples/DevSettings/DevSettingsExample.js +++ b/packages/rn-tester/js/examples/DevSettings/DevSettingsExample.js @@ -18,7 +18,7 @@ exports.description = 'Customize the development settings'; exports.examples = [ { title: 'Add dev menu item', - render(): React.Element { + render(): React.MixedElement { return (