feat(windows): support react-native-windows new architecture

NuGet.config

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<configuration>
+  <packageSources>
+    <clear />
+    <add key="react-native" value="https://pkgs.dev.azure.com/ms/react-native/_packaging/react-native-public/nuget/v3/index.json" />
+    <add key="Nuget.org" value="https://api.nuget.org/v3/index.json" />
+  </packageSources>
+  <disabledPackageSources>
+    <clear />
+  </disabledPackageSources>  
+</configuration>

README.md

@@ -102,7 +102,7 @@ buildscript {
 
 ### Windows
 
-Installation on Windows should be completely handled with auto-linking when using React Native Windows 0.63+. For earlier versions, you must [manually link](https://microsoft.github.io/react-native-windows/docs/native-modules-using) the native module.
+Installation on Windows is handled with auto-linking. The Windows implementation targets the [New Architecture](https://reactnative.dev/architecture/landing-page) (Fabric) only and requires React Native Windows 0.81 or higher.
 
 ## How can I take advantage of that?
 

apps/Example.tsx

@@ -9,7 +9,6 @@ import {
 import { NavigationContainer, useTheme } from '@react-navigation/native';
 import { StackNavigationProp } from '@react-navigation/stack';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import RNRestart from 'react-native-restart';
 
 import { ListItem, SettingsSwitch, ThemedText } from './src/shared';
 
@@ -28,8 +27,6 @@ import Events from './src/screens/Events';
 import Gestures from './src/screens/Gestures';
 import BarButtonItems from './src/screens/BarButtonItems';
 
-import { GestureDetectorProvider } from 'react-native-screens/gesture-handler';
-import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import {
   ScreensDarkTheme,
   ScreensLightTheme,
@@ -40,6 +37,12 @@ import SingleFeatureTests from './src/tests/single-feature-tests';
 import ComponentIntegrationTests from './src/tests/component-integration-tests';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
+import {
+  GestureHandlerRootView,
+  GestureDetectorProvider,
+} from './gesture-handler-interop';
+import RNRestart from './react-native-restart-interop';
+
 function isPlatformReady(name: keyof typeof SCREENS) {
   if (Platform.isTV) {
     return !!SCREENS[name].isTVOSReady;

apps/gesture-handler-interop.ts

@@ -0,0 +1,2 @@
+export { GestureHandlerRootView } from 'react-native-gesture-handler';
+export { GestureDetectorProvider } from 'react-native-screens/gesture-handler';

apps/gesture-handler-interop.windows.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+
+// react-native-gesture-handler is not supported on Windows.
+// See https://github.com/software-mansion/react-native-gesture-handler/issues/3723
+// Metro resolves this file instead of gesture-handler-interop.ts when bundling for Windows,
+// so neither gesture-handler package is included in the Windows bundle.
+
+const GestureHandlerRootView = ({
+  children,
+}: Readonly<{
+  style?: StyleProp<ViewStyle>;
+  children: React.ReactNode;
+}>): React.JSX.Element => <>{children}</>;
+
+const GestureDetectorProvider = ({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>): React.JSX.Element => <>{children}</>;
+
+export { GestureHandlerRootView, GestureDetectorProvider };

apps/react-native-restart-interop.ts

@@ -0,0 +1 @@
+export { default } from 'react-native-restart';

apps/react-native-restart-interop.windows.ts

@@ -0,0 +1,7 @@
+// react-native-restart is not supported on Windows.
+const RNRestart = {
+  restart: () => {},
+  Restart: () => {},
+};
+
+export default RNRestart;

apps/src/screens/Gestures.tsx

@@ -13,9 +13,10 @@ import {
   NativeStackNavigationProp,
 } from '@react-navigation/native-stack';
 import { useHeaderHeight } from '@react-navigation/elements';
-import RNRestart from 'react-native-restart';
+
 import { Button, SettingsSwitch } from '@apps/shared';
 import { SettingsMultiInput } from '@apps/shared/SettingsMultiInput';
+import RNRestart from '../../react-native-restart-interop.windows';
 
 type StackParamList = {
   Main: undefined;

package.json

@@ -115,7 +115,7 @@
     "react-native-gesture-handler": "^2.28.0",
     "react-native-reanimated": "^3.19.0",
     "react-native-safe-area-context": "5.6.0",
-    "react-native-windows": "^0.64.8",
+    "react-native-windows": "^0.82.3",
     "react-test-renderer": "19.2.3",
     "release-it": "^15.6.0",
     "shelljs": "^0.9.2",
@@ -222,7 +222,19 @@
           "className": "RNSScrollViewMarkerComponentView"
         }
       }
+    },
+    "windows": {
+      "namespace": "ReactNativeScreensCodegen",
+      "outputDirectory": "windows/RNScreens/codegen",
+      "separateDataTypes": true
     }
   },
-  "packageManager": "yarn@4.1.1"
+  "packageManager": "yarn@4.1.1",
+  "react-native-windows": {
+    "init-windows": {
+      "name": "ReactNativeScreens",
+      "namespace": "ReactNativeScreens",
+      "template": "cpp-lib"
+    }
+  }
 }

react-native.config.js

@@ -20,6 +20,15 @@ module.exports = {
         ],
         cmakeListsPath: "../android/src/main/jni/CMakeLists.txt"
       },
+      windows: {
+        sourceDir: 'windows',
+        projects: [
+          {
+            projectFile: 'RNScreens\\RNScreens.vcxproj',
+            directDependency: true,
+          },
+        ],
+      },
     },
   },
 };

windows/.gitignore

@@ -1,10 +1,8 @@
 *AppPackages*
 *BundleArtifacts*
-
 #OS junk files
 [Tt]humbs.db
 *.DS_Store
-
 #Visual Studio files
 *.[Oo]bj
 *.user
@@ -34,59 +32,17 @@ ipch/
 [Dd]ebug*/
 [Rr]elease*/
 Ankh.NoLoad
-
+.vs/
 # Visual C++ cache files
-ipch/
-*.aps
-*.ncb
-*.opendb
-*.opensdf
-*.sdf
-*.cachefile
-*.VC.db
-*.VC.VC.opendb
-
-#MonoDevelop
-*.pidb
-*.userprefs
-
-#Tooling
-_ReSharper*/
-*.resharper
-[Tt]est[Rr]esult*
-*.sass-cache
-
-#Project files
-[Bb]uild/
 
-#Subversion files
-.svn
-
-# Office Temp Files
-~$*
+#Files generated by the VS build
+**/Generated Files/**
 
-# vim Temp Files
-*~
+#Files generated by MS build
+*.binlog
+*.err
+*.wrn
 
 #NuGet
 packages/
 *.nupkg
-
-#ncrunch
-*ncrunch*
-*crunch*.local.xml
-
-# visual studio database projects
-*.dbmdl
-
-#Test files
-*.testsettings
-
-#Other files
-*.DotSettings
-.vs/
-*project.lock.json
-
-#Files generated by the VS build
-**/Generated Files/**
-

windows/ExperimentalFeatures.props

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+
+  <PropertyGroup Label="Microsoft.ReactNative Experimental Features">
+    <!--
+      Required for building a New Architecture project.
+
+      Library projects can change this value to test against Old and New
+      Architectures when building the library project's local sln file.
+
+      Otherwise this value will be decided by the consuming RNW app.
+
+      See https://microsoft.github.io/react-native-windows/docs/new-architecture
+    -->
+    <RnwNewArch>true</RnwNewArch>
+
+    <!--
+      Changes compilation to assume use of Microsoft.ReactNative NuGet packages
+      instead of building the framework from source. Defaults to true.
+
+      This is set during library project creation and is used when building
+      the library project's local sln file.
+
+      Otherwise this value will be decided by the consuming RNW app.
+
+      See https://microsoft.github.io/react-native-windows/docs/nuget
+    -->
+    <UseExperimentalNuget>true</UseExperimentalNuget>
+
+    <ReactExperimentalFeaturesSet>true</ReactExperimentalFeaturesSet>
+  </PropertyGroup>
+
+</Project>

windows/RNScreens.sln

@@ -0,0 +1,43 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 17
+VisualStudioVersion = 17.3.32929.385
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "RNScreens", "RNScreens\RNScreens.vcxproj", "{D638F49E-29D2-4699-AC52-FACD82FA7138}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|x64 = Debug|x64
+		Debug|x86 = Debug|x86
+		Debug|ARM64 = Debug|ARM64
+		Release|x64 = Release|x64
+		Release|x86 = Release|x86
+		Release|ARM64 = Release|ARM64
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x64.ActiveCfg = Debug|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x64.Build.0 = Debug|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x64.Deploy.0 = Debug|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x86.ActiveCfg = Debug|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x86.Build.0 = Debug|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|x86.Deploy.0 = Debug|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|ARM64.Build.0 = Debug|ARM64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Debug|ARM64.Deploy.0 = Debug|ARM64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x64.ActiveCfg = Release|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x64.Build.0 = Release|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x64.Deploy.0 = Release|x64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x86.ActiveCfg = Release|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x86.Build.0 = Release|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|x86.Deploy.0 = Release|Win32
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|ARM64.ActiveCfg = Release|ARM64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|ARM64.Build.0 = Release|ARM64
+		{D638F49E-29D2-4699-AC52-FACD82FA7138}.Release|ARM64.Deploy.0 = Release|ARM64
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {D43FAD39-F619-437D-BB40-04A3982ACB6A}
+	EndGlobalSection
+EndGlobal

windows/RNScreens/BaseProps.h

@@ -0,0 +1,65 @@
+#pragma once
+#include "pch.h"
+
+namespace winrt::RNScreens::implementation {
+// Placeholder IComponentProps for Fabric components that have no custom native
+// props on Windows yet. Satisfies the SetCreateProps contract so the framework
+// can deliver base ViewProps (layout, style) without crashing.
+//
+// REACT_STRUCT is omitted - that macro generates ReadProp dispatch metadata,
+// which is only needed when SetProp delegates to ReadProp. Here SetProp is a
+// deliberate no-op, so the metadata would be dead weight.
+//
+// TODO: replace with a component-specific props struct for each stub as native
+// implementations are developed.
+struct BaseProps
+    : implements<BaseProps, Microsoft::ReactNative::IComponentProps> {
+  BaseProps(
+      Microsoft::ReactNative::ViewProps /*props*/,
+      const Microsoft::ReactNative::IComponentProps & /*cloneFrom*/) noexcept {
+  }
+
+  void SetProp(
+      uint32_t /*hash*/,
+      hstring /*propName*/,
+      Microsoft::ReactNative::IJSValueReader /*value*/) noexcept {
+  }
+};
+
+// Registers a Fabric component that requires no per-instance state, custom
+// props, events, or visual overrides. Satisfies two required registration
+// contracts:
+//
+//   SetCreateProps - required so the framework can construct a props object
+//     when base ViewProps (layout, style) are delivered. Without it, the
+//     framework crashes on the first prop update.
+//
+//   SetViewComponentViewInitializer - required even when no per-instance
+//     initialization is needed; the framework asserts on mount without it.
+//
+// To graduate a component from stub to real implementation, replace the
+// RegisterStubComponent call in its .cpp with a full AddViewComponent block
+// using a concrete props struct and whatever subset of
+// SetUpdatePropsHandler / SetUpdateEventEmitterHandler / SetCreateVisualHandler
+// the component needs. See Screen.cpp for the established pattern.
+inline void RegisterStubComponent(
+    const Microsoft::ReactNative::IReactPackageBuilderFabric &fabricBuilder,
+    const hstring &componentName) noexcept {
+  using namespace Microsoft::ReactNative;
+  fabricBuilder.AddViewComponent(
+      componentName,
+      [](const IReactViewComponentBuilder &builder) noexcept {
+        builder.SetCreateProps(
+            [](
+            ViewProps props,
+            const IComponentProps &cloneFrom) noexcept -> IComponentProps {
+              return winrt::make<BaseProps>(props, cloneFrom);
+            });
+        builder
+            .as<Composition::IReactCompositionViewComponentBuilder>()
+            .SetViewComponentViewInitializer(
+                [](const ComponentView &) noexcept {
+                });
+      });
+}
+} // namespace winrt::RNScreens::implementation

windows/RNScreens/ModalScreen.cpp

@@ -0,0 +1,16 @@
+#include "pch.h"
+#include "ModalScreen.h"
+#include "Screen.h"
+
+namespace winrt::RNScreens::implementation {
+using namespace winrt::Microsoft::ReactNative;
+
+// RNSModalScreen shares identical native behavior with RNSScreen on Windows.
+// Both components are containers whose screen-level semantics (presentation
+// style, animation) are managed by JS; the native side only needs to forward
+// lifecycle events.
+void RegisterModalScreen(
+    const IReactPackageBuilderFabric &fabricBuilder) noexcept {
+  RegisterScreenLike(fabricBuilder, L"RNSModalScreen");
+}
+} // namespace winrt::RNScreens::implementation

windows/RNScreens/ModalScreen.h

@@ -0,0 +1,9 @@
+#pragma once
+#include "pch.h"
+
+namespace winrt::RNScreens::implementation {
+// Delegates to RegisterScreenLike; see Screen.h for the shared behavior.
+void RegisterModalScreen(
+    const Microsoft::ReactNative::IReactPackageBuilderFabric &fabricBuilder)
+  noexcept;
+} // namespace winrt::RNScreens::implementation