diff --git a/.flowconfig b/.flowconfig
index ec3fa137ebe..ddebead1789 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -48,6 +48,7 @@ packages/react-native/flow/
 [options]
 enums=true
 casting_syntax=both
+component_syntax=true
 
 emoji=true
 
diff --git a/packages/react-native/Libraries/Components/View/View.js b/packages/react-native/Libraries/Components/View/View.js
index cd067b046c1..c6a8f967122 100644
--- a/packages/react-native/Libraries/Components/View/View.js
+++ b/packages/react-native/Libraries/Components/View/View.js
@@ -16,11 +16,6 @@ import ViewNativeComponent from './ViewNativeComponent';
 import * as React from 'react';
 import {use} from 'react';
 
-type PropsWithRef = $ReadOnly<{
-  ref?: React.RefSetter<React.ElementRef<typeof ViewNativeComponent>>,
-  ...ViewProps,
-}>;
-
 /**
  * The most fundamental component for building a UI, View is a container that
  * supports layout with flexbox, style, some touch handling, and accessibility
@@ -28,7 +23,10 @@ type PropsWithRef = $ReadOnly<{
  *
  * @see https://reactnative.dev/docs/view
  */
-function View(props: PropsWithRef): React.Node {
+export default component View(
+  ref?: React.RefSetter<React.ElementRef<typeof ViewNativeComponent>>,
+  ...props: ViewProps
+) {
   const hasTextAncestor = use(TextAncestor);
 
   let actualView;
@@ -55,7 +53,7 @@ function View(props: PropsWithRef): React.Node {
     } = props;
 
     // Since we destructured props, we can now treat it as mutable
-    const processedProps = otherProps as {...PropsWithRef};
+    const processedProps = otherProps as {...ViewProps};
 
     const parsedAriaLabelledBy = ariaLabelledBy?.split(/\s*,\s*/g);
     if (parsedAriaLabelledBy !== undefined) {
@@ -118,7 +116,12 @@ function View(props: PropsWithRef): React.Node {
       };
     }
 
-    actualView = <ViewNativeComponent {...processedProps} />;
+    actualView =
+      ref == null ? (
+        <ViewNativeComponent {...processedProps} />
+      ) : (
+        <ViewNativeComponent {...processedProps} ref={ref} />
+      );
   } else {
     const {
       accessibilityElementsHidden,
@@ -198,6 +201,7 @@ function View(props: PropsWithRef): React.Node {
             : importantForAccessibility
         }
         nativeID={id ?? nativeID}
+        ref={ref}
       />
     );
   }
@@ -207,8 +211,3 @@ function View(props: PropsWithRef): React.Node {
   }
   return actualView;
 }
-
-export default View as component(
-  ref?: React.RefSetter<React.ElementRef<typeof ViewNativeComponent>>,
-  ...props: ViewProps
-);
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 b70bb3cfa63..9ae3b7eced7 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
@@ -3515,7 +3515,7 @@ declare export default typeof ReactNativeViewAttributes;
 `;
 
 exports[`public API should not change unintentionally Libraries/Components/View/View.js 1`] = `
-"declare export default component(
+"declare export default component View(
   ref?: React.RefSetter<React.ElementRef<typeof ViewNativeComponent>>,
   ...props: ViewProps
 );