add basic support for React Server Components

Author: EvanBacon

packages/react-native-web/src/exports/ActivityIndicator/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { ViewProps } from '../View';
 

packages/react-native-web/src/exports/CheckBox/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { ColorValue } from '../../types';
 import type { ViewProps } from '../View';

packages/react-native-web/src/exports/FlatList/index.js

@@ -8,5 +8,7 @@
  * @flow
  */
 
+'use client';
+
 import FlatList from '../../vendor/react-native/FlatList';
 export default FlatList;

packages/react-native-web/src/exports/Image/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { ImageProps } from './types';
 

packages/react-native-web/src/exports/KeyboardAvoidingView/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { LayoutEvent, LayoutValue } from '../../types';
 import type { ViewProps } from '../View';

packages/react-native-web/src/exports/Modal/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { ViewProps } from '../View';
 

packages/react-native-web/src/exports/Picker/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { PlatformMethods } from '../../types';
 import type { ViewProps } from '../View';

packages/react-native-web/src/exports/Pressable/index.js

@@ -6,7 +6,7 @@
  *
  * @flow strict-local
  */
-
+'use client';
 'use strict';
 
 import type { HoverEventsConfig } from '../../modules/useHover';

packages/react-native-web/src/exports/ScrollView/index.js

@@ -7,6 +7,7 @@
  *
  * @noflow
  */
+'use client';
 
 import type { ViewProps, ViewStyle } from '../View/types';
 

packages/react-native-web/src/exports/Switch/index.js

@@ -6,6 +6,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { ColorValue } from '../../types';
 import type { ViewProps } from '../View';

packages/react-native-web/src/exports/Text/TextAncestorContext.js

@@ -6,6 +6,7 @@
  *
  * @flow strict
  */
+'use client';
 
 import type { Context } from 'react';
 

packages/react-native-web/src/exports/Text/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { PlatformMethods } from '../../types';
 import type { TextProps } from './types';

packages/react-native-web/src/exports/TextInput/index.js

@@ -7,6 +7,7 @@
  *
  * @flow
  */
+'use client';
 
 import type { PlatformMethods } from '../../types';
 import type { TextInputProps } from './types';

packages/react-native-web/src/exports/TouchableHighlight/index.js

@@ -7,7 +7,7 @@
  * @flow strict-local
  * @format
  */
-
+'use client';
 'use strict';
 
 import type { ColorValue } from '../../types';

packages/react-native-web/src/exports/TouchableOpacity/index.js

@@ -8,6 +8,7 @@
  * @format
  */
 
+'use client';
 'use strict';
 
 import type { Props as TouchableWithoutFeedbackProps } from '../TouchableWithoutFeedback';

packages/react-native-web/src/exports/TouchableWithoutFeedback/index.js

@@ -8,6 +8,7 @@
  * @format
  */
 
+'use client';
 'use strict';
 
 import type { PressResponderConfig } from '../../modules/usePressEvents/PressResponder';

packages/react-native-web/src/exports/View/index.js

@@ -8,6 +8,8 @@
  * @flow
  */
 
+'use client';
+
 import type { PlatformMethods } from '../../types';
 import type { ViewProps } from './types';
 
@@ -69,13 +71,16 @@ const View: React.AbstractComponent<ViewProps, HTMLElement & PlatformMethods> =
     } = props;
 
     if (process.env.NODE_ENV !== 'production') {
-      React.Children.toArray(props.children).forEach((item) => {
-        if (typeof item === 'string') {
-          console.error(
-            `Unexpected text node: ${item}. A text node cannot be a child of a <View>.`
-          );
-        }
-      });
+      // Skip parsing RSC objects as this will prevent errors from surfacing in the renderer.
+      if (!props.children || !('$$typeof' in props.children)) {
+        React.Children.toArray(props.children).forEach((item) => {
+          if (typeof item === 'string') {
+            console.error(
+              `Unexpected text node: ${item}. A text node cannot be a child of a <View>.`
+            );
+          }
+        });
+      }
     }
 
     const hasTextAncestor = React.useContext(TextAncestorContext);

packages/react-native-web/src/modules/UnimplementedView/index.js

@@ -7,22 +7,16 @@
  * @flow
  */
 
-import type { Node } from 'React';
-
 import View from '../../exports/View';
 import React from 'react';
 
 /**
  * Common implementation for a simple stubbed view.
  */
-class UnimplementedView extends React.Component<*, *> {
-  render(): Node {
-    return (
-      <View style={[unimplementedViewStyles, this.props.style]}>
-        {this.props.children}
-      </View>
-    );
-  }
+function UnimplementedView({ style, ...props }) {
+  return (
+    <View style={[unimplementedViewStyles, style]} {...props} />
+  );
 }
 
 const unimplementedViewStyles =

packages/react-native-web/src/modules/useLocale/index.js

@@ -7,6 +7,8 @@
  * @flow strict
  */
 
+'use client';
+
 import type { Node } from 'react';
 
 import React, { createContext, useContext } from 'react';

packages/react-native-web/src/modules/useResponderEvents/index.js

@@ -7,6 +7,8 @@
  * @flow
  */
 
+'use client';
+
 /**
  * Hook for integrating the Responder System into React
  *

packages/react-native-web/src/vendor/react-native/FlatList/index.js

@@ -7,6 +7,7 @@
  * @flow
  * @format
  */
+'use client';
 
 import View, { type ViewProps } from '../../../exports/View';
 import StyleSheet from '../../../exports/StyleSheet';

packages/react-native-web/src/vendor/react-native/SectionList/index.js

@@ -8,6 +8,7 @@
  * @format
  */
 
+'use client';
 'use strict';
 
 import Platform from '../../../exports/Platform';

packages/react-native-web/src/vendor/react-native/VirtualizedList/StateSafePureComponent.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+'use client';
+
 import invariant from 'fbjs/lib/invariant';
 import * as React from 'react';
 

packages/react-native-web/src/vendor/react-native/VirtualizedList/VirtualizedListCellRenderer.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+'use client';
+
 import type { LayoutEvent } from '../../../types';
 import type {
   FocusEvent,

packages/react-native-web/src/vendor/react-native/VirtualizedList/VirtualizedListContext.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+'use client';
+
 import typeof VirtualizedList from '../VirtualizedList';
 
 import * as React from 'react';

packages/react-native-web/src/vendor/react-native/VirtualizedSectionList/index.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+'use client';
+
 import type {ViewToken} from '../ViewabilityHelper';
 import View from '../../../exports/View';
 import VirtualizedList from '../VirtualizedList';