rnw] ReactNativeFlipperExample

Summary:
This change is the direct results of doing the following:

    npx react-native-windows-init --overwrite

Notes: ignore the format warnings below. In this case, the ordering of includes does matter. Missing license is for auto-generated files, so ignore too.

Reviewed By: aigoncharov

Differential Revision: D36775215

fbshipit-source-id: 1cd00ff2bfc258c8505e97dcdbd9cb4365c4acfb

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/.gitignore

@@ -0,0 +1 @@
+/Bundle

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/App.cpp

@@ -0,0 +1,108 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include "pch.h"
+
+#include "App.h"
+
+#include <ReactPackageProvider.h>
+#include "AutolinkedNativeModules.g.h"
+
+#include <winrt/ReactNativeFlipper.h>
+
+using namespace winrt;
+using namespace xaml;
+using namespace xaml::Controls;
+using namespace xaml::Navigation;
+
+using namespace Windows::ApplicationModel;
+namespace winrt::ReactNativeFlipperExample::implementation {
+/// <summary>
+/// Initializes the singleton application object.  This is the first line of
+/// authored code executed, and as such is the logical equivalent of main() or
+/// WinMain().
+/// </summary>
+App::App() noexcept {
+#if BUNDLE
+  JavaScriptBundleFile(L"index.windows");
+  InstanceSettings().UseWebDebugger(false);
+  InstanceSettings().UseFastRefresh(false);
+#else
+  JavaScriptBundleFile(L"index");
+  InstanceSettings().UseWebDebugger(true);
+  InstanceSettings().UseFastRefresh(true);
+#endif
+
+#if _DEBUG
+  InstanceSettings().UseDeveloperSupport(true);
+#else
+  InstanceSettings().UseDeveloperSupport(false);
+#endif
+
+  RegisterAutolinkedNativeModulePackages(
+      PackageProviders()); // Includes any autolinked modules
+
+  PackageProviders().Append(
+      make<ReactPackageProvider>()); // Includes all modules in this project
+
+  PackageProviders().Append(winrt::ReactNativeFlipper::ReactPackageProvider());
+
+  InitializeComponent();
+}
+
+/// <summary>
+/// Invoked when the application is launched normally by the end user.  Other
+/// entry points will be used such as when the application is launched to open a
+/// specific file.
+/// </summary>
+/// <param name="e">Details about the launch request and process.</param>
+void App::OnLaunched(activation::LaunchActivatedEventArgs const& e) {
+  super::OnLaunched(e);
+
+  Frame rootFrame = Window::Current().Content().as<Frame>();
+  rootFrame.Navigate(xaml_typename<MainPage>(), box_value(e.Arguments()));
+}
+
+/// <summary>
+/// Invoked when the application is activated by some means other than normal
+/// launching.
+/// </summary>
+void App::OnActivated(Activation::IActivatedEventArgs const& e) {
+  auto preActivationContent = Window::Current().Content();
+  super::OnActivated(e);
+  if (!preActivationContent && Window::Current()) {
+    Frame rootFrame = Window::Current().Content().as<Frame>();
+    rootFrame.Navigate(xaml_typename<MainPage>(), nullptr);
+  }
+}
+
+/// <summary>
+/// Invoked when application execution is being suspended.  Application state is
+/// saved without knowing whether the application will be terminated or resumed
+/// with the contents of memory still intact.
+/// </summary>
+/// <param name="sender">The source of the suspend request.</param>
+/// <param name="e">Details about the suspend request.</param>
+void App::OnSuspending(
+    [[maybe_unused]] IInspectable const& sender,
+    [[maybe_unused]] SuspendingEventArgs const& e) {
+  // Save application state and stop any background activity
+}
+
+/// <summary>
+/// Invoked when Navigation to a certain page fails
+/// </summary>
+/// <param name="sender">The Frame which failed navigation</param>
+/// <param name="e">Details about the navigation failure</param>
+void App::OnNavigationFailed(
+    IInspectable const&,
+    NavigationFailedEventArgs const& e) {
+  throw hresult_error(
+      E_FAIL, hstring(L"Failed to load Page ") + e.SourcePageType().Name);
+}
+
+} // namespace winrt::ReactNativeFlipperExample::implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/App.h

@@ -0,0 +1,36 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include "App.xaml.g.h"
+
+#include <CppWinRTIncludes.h>
+
+#ifdef USE_WINUI3
+namespace activation = winrt::Microsoft::UI::Xaml;
+#else
+namespace activation = winrt::Windows::ApplicationModel::Activation;
+#endif
+
+namespace winrt::ReactNativeFlipperExample::implementation {
+struct App : AppT<App> {
+  App() noexcept;
+  void OnLaunched(activation::LaunchActivatedEventArgs const&);
+  void OnActivated(
+      Windows::ApplicationModel::Activation::IActivatedEventArgs const& e);
+  void OnSuspending(
+      IInspectable const&,
+      Windows::ApplicationModel::SuspendingEventArgs const&);
+  void OnNavigationFailed(
+      IInspectable const&,
+      xaml::Navigation::NavigationFailedEventArgs const&);
+
+ private:
+  using super = AppT<App>;
+};
+} // namespace winrt::ReactNativeFlipperExample::implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/App.idl

@@ -0,0 +1,3 @@
+namespace ReactNativeFlipperExample
+{
+}

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/App.xaml

@@ -0,0 +1,10 @@
+<react:ReactApplication
+    x:Class="ReactNativeFlipperExample.App"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:ReactNativeFlipperExample"
+    xmlns:react="using:Microsoft.ReactNative">
+    <Application.Resources>
+        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
+    </Application.Resources>
+</react:ReactApplication>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/AutolinkedNativeModules.g.cpp

@@ -0,0 +1,22 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// clang-format off
+// AutolinkedNativeModules.g.cpp contents generated by "react-native autolink-windows"
+
+#include "pch.h"
+#include "AutolinkedNativeModules.g.h"
+
+namespace winrt::Microsoft::ReactNative
+{
+
+void RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders)
+{ 
+    UNREFERENCED_PARAMETER(packageProviders);
+}
+
+}

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/AutolinkedNativeModules.g.h

@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// clang-format off
+// AutolinkedNativeModules.g.h contents generated by "react-native autolink-windows"
+
+#pragma once
+
+namespace winrt::Microsoft::ReactNative
+{
+
+void RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders);
+
+}

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/AutolinkedNativeModules.g.props

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <!-- AutolinkedNativeModules.g.props contents generated by "react-native autolink-windows" -->
+  <PropertyGroup>
+  </PropertyGroup>
+</Project>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/AutolinkedNativeModules.g.targets

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <!-- AutolinkedNativeModules.g.targets contents generated by "react-native autolink-windows" -->
+  <ItemGroup>
+  </ItemGroup>
+</Project>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/MainPage.cpp

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// clang-format off
+#include "pch.h"
+#include "MainPage.h"
+
+#if __has_include("MainPage.g.cpp")
+#include "MainPage.g.cpp"
+#endif
+
+#include "App.h"
+// clang-format on
+
+using namespace winrt;
+using namespace xaml;
+
+namespace winrt::ReactNativeFlipperExample::implementation {
+MainPage::MainPage() {
+  InitializeComponent();
+  auto app = Application::Current().as<App>();
+  ReactRootView().ReactNativeHost(app->Host());
+}
+} // namespace winrt::ReactNativeFlipperExample::implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/MainPage.h

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+// clang-format off
+#include "MainPage.g.h"
+#include <winrt/Microsoft.ReactNative.h>
+// clang-format on
+
+namespace winrt::ReactNativeFlipperExample::implementation {
+struct MainPage : MainPageT<MainPage> {
+  MainPage();
+};
+} // namespace winrt::ReactNativeFlipperExample::implementation
+
+namespace winrt::ReactNativeFlipperExample::factory_implementation {
+struct MainPage : MainPageT<MainPage, implementation::MainPage> {};
+} // namespace winrt::ReactNativeFlipperExample::factory_implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/MainPage.idl

@@ -0,0 +1,10 @@
+#include "NamespaceRedirect.h"
+
+namespace ReactNativeFlipperExample
+{
+    [default_interface]
+    runtimeclass MainPage : XAML_NAMESPACE.Controls.Page
+    {
+        MainPage();
+    }
+}

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/MainPage.xaml

@@ -0,0 +1,16 @@
+<Page
+    x:Class="ReactNativeFlipperExample.MainPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:ReactNativeFlipperExample"
+    xmlns:react="using:Microsoft.ReactNative"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    <react:ReactRootView 
+        x:Name="ReactRootView"
+        ComponentName="ReactNativeFlipperExample"
+        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
+        MinHeight="400"/>
+</Page>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/Package.appxmanifest

@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<Package
+  xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
+  xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest"
+  xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
+  IgnorableNamespaces="uap mp">
+
+  <Identity
+    Name="dfa31ee3-fd85-49b5-a32c-3912f70b9bed"
+    Publisher="CN=lblasa"
+    Version="1.0.0.0" />
+
+  <mp:PhoneIdentity PhoneProductId="dfa31ee3-fd85-49b5-a32c-3912f70b9bed" PhonePublisherId="00000000-0000-0000-0000-000000000000"/>
+
+  <Properties>
+    <DisplayName>ReactNativeFlipperExample</DisplayName>
+    <PublisherDisplayName>lblasa</PublisherDisplayName>
+    <Logo>Assets\StoreLogo.png</Logo>
+  </Properties>
+
+  <Dependencies>
+    <TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.0.0" MaxVersionTested="10.0.0.0" />
+  </Dependencies>
+
+  <Resources>
+    <Resource Language="x-generate"/>
+  </Resources>
+
+  <Applications>
+    <Application
+      Id="App"
+      Executable="$targetnametoken$.exe"
+      EntryPoint="ReactNativeFlipperExample.App">
+      <uap:VisualElements
+        DisplayName="ReactNativeFlipperExample"
+        Square150x150Logo="Assets\Square150x150Logo.png"
+        Square44x44Logo="Assets\Square44x44Logo.png"
+        Description="ReactNativeFlipperExample"
+        BackgroundColor="transparent">
+        <uap:DefaultTile Wide310x150Logo="Assets\Wide310x150Logo.png"/>
+        <uap:SplashScreen Image="Assets\SplashScreen.png" />
+      </uap:VisualElements>
+    </Application>
+  </Applications>
+
+  <Capabilities>
+    <Capability Name="internetClient" />
+  </Capabilities>
+</Package>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/PropertySheet.props

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="Current" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <ImportGroup Label="PropertySheets" />
+  <PropertyGroup Label="UserMacros" />
+  <!--
+    To customize common C++/WinRT project properties:
+    * right-click the project node
+    * expand the Common Properties item
+    * select the C++/WinRT property page
+
+    For more advanced scenarios, and complete documentation, please see:
+    https://github.com/Microsoft/xlang/tree/master/src/package/cppwinrt/nuget
+    -->
+  <PropertyGroup />
+  <ItemDefinitionGroup />
+</Project>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/ReactNativeFlipperExample.vcxproj

@@ -0,0 +1,183 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- This project was created with react-native-windows 0.68.4 -->
+<Project ToolsVersion="Current" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <Import Project="$(SolutionDir)\ExperimentalFeatures.props" Condition="Exists('$(SolutionDir)\ExperimentalFeatures.props')" />
+  <PropertyGroup Label="Globals">
+    <CppWinRTOptimized>true</CppWinRTOptimized>
+    <CppWinRTRootNamespaceAutoMerge>true</CppWinRTRootNamespaceAutoMerge>
+    <MinimalCoreWin>true</MinimalCoreWin>
+    <ProjectGuid>{ef763f5c-dcec-408e-8362-cef121bfc6c1}</ProjectGuid>
+    <ProjectName>ReactNativeFlipperExample</ProjectName>
+    <RootNamespace>ReactNativeFlipperExample</RootNamespace>
+    <DefaultLanguage>en-US</DefaultLanguage>
+    <MinimumVisualStudioVersion>16.0</MinimumVisualStudioVersion>
+    <AppContainerApplication>true</AppContainerApplication>
+    <ApplicationType>Windows Store</ApplicationType>
+    <ApplicationTypeRevision>10.0</ApplicationTypeRevision>
+  </PropertyGroup>
+  <PropertyGroup Label="NuGet">
+    <ResolveNuGetPackages>false</ResolveNuGetPackages>
+  </PropertyGroup>
+  <PropertyGroup Label="ReactNativeWindowsProps">
+    <ReactNativeWindowsDir Condition="'$(ReactNativeWindowsDir)' == ''">$([MSBuild]::GetDirectoryNameOfFileAbove($(MSBuildThisFileDirectory), 'node_modules\react-native-windows\package.json'))\node_modules\react-native-windows\</ReactNativeWindowsDir>
+  </PropertyGroup>
+  <Import Project="$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.WindowsSdk.Default.props" />
+  <Import Project="$(VCTargetsPath)\Microsoft.Cpp.Default.props" />
+  <ItemGroup Label="ProjectConfigurations">
+    <ProjectConfiguration Include="Debug|ARM64">
+      <Configuration>Debug</Configuration>
+      <Platform>ARM64</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Debug|Win32">
+      <Configuration>Debug</Configuration>
+      <Platform>Win32</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Debug|x64">
+      <Configuration>Debug</Configuration>
+      <Platform>x64</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Release|ARM64">
+      <Configuration>Release</Configuration>
+      <Platform>ARM64</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Release|Win32">
+      <Configuration>Release</Configuration>
+      <Platform>Win32</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Release|x64">
+      <Configuration>Release</Configuration>
+      <Platform>x64</Platform>
+    </ProjectConfiguration>
+  </ItemGroup>
+  <PropertyGroup Label="Configuration">
+    <ConfigurationType>Application</ConfigurationType>
+    <CharacterSet>Unicode</CharacterSet>
+  </PropertyGroup>
+  <PropertyGroup Condition="'$(Configuration)'=='Debug'" Label="Configuration">
+    <UseDebugLibraries>true</UseDebugLibraries>
+    <LinkIncremental>true</LinkIncremental>
+  </PropertyGroup>
+  <PropertyGroup Condition="'$(Configuration)'=='Release'" Label="Configuration">
+    <UseDebugLibraries>false</UseDebugLibraries>
+    <WholeProgramOptimization>true</WholeProgramOptimization>
+    <LinkIncremental>false</LinkIncremental>
+  </PropertyGroup>
+  <Import Project="$(VCTargetsPath)\Microsoft.Cpp.props" />
+  <ImportGroup Label="ExtensionSettings">
+  </ImportGroup>
+  <ImportGroup Label="PropertySheets">
+    <Import Project="$(UserRootDir)\Microsoft.Cpp.$(Platform).user.props" Condition="exists('$(UserRootDir)\Microsoft.Cpp.$(Platform).user.props')" Label="LocalAppDataPlatform" />
+  </ImportGroup>
+  <ImportGroup Label="PropertySheets">
+    <Import Project="PropertySheet.props" />
+  </ImportGroup>
+  <ImportGroup Label="ReactNativeWindowsPropertySheets">
+    <Import Project="$(ReactNativeWindowsDir)\PropertySheets\external\Microsoft.ReactNative.Uwp.CppApp.props" Condition="Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.props')" />
+  </ImportGroup>
+  <PropertyGroup Label="UserMacros" />
+  <ItemDefinitionGroup>
+    <ClCompile>
+      <PrecompiledHeader>Use</PrecompiledHeader>
+      <PrecompiledHeaderFile>pch.h</PrecompiledHeaderFile>
+      <PrecompiledHeaderOutputFile>$(IntDir)pch.pch</PrecompiledHeaderOutputFile>
+      <WarningLevel>Level4</WarningLevel>
+      <AdditionalOptions>%(AdditionalOptions) /bigobj</AdditionalOptions>
+      <DisableSpecificWarnings>4453;28204</DisableSpecificWarnings>
+    </ClCompile>
+  </ItemDefinitionGroup>
+  <ItemDefinitionGroup Condition="'$(Configuration)'=='Debug'">
+    <ClCompile>
+      <PreprocessorDefinitions>_DEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+    </ClCompile>
+  </ItemDefinitionGroup>
+  <ItemDefinitionGroup Condition="'$(Configuration)'=='Release'">
+    <ClCompile>
+      <PreprocessorDefinitions>NDEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+    </ClCompile>
+  </ItemDefinitionGroup>
+  <ItemGroup>
+    <ClInclude Include="MainPage.h">
+      <DependentUpon>MainPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
+    <ClInclude Include="ReactPackageProvider.h" />
+    <ClInclude Include="AutolinkedNativeModules.g.h" />
+    <ClInclude Include="pch.h" />
+    <ClInclude Include="App.h">
+      <DependentUpon>App.xaml</DependentUpon>
+    </ClInclude>
+  </ItemGroup>
+  <ItemGroup>
+    <ApplicationDefinition Include="App.xaml">
+      <SubType>Designer</SubType>
+    </ApplicationDefinition>
+  </ItemGroup>
+  <ItemGroup>
+    <AppxManifest Include="Package.appxmanifest">
+      <SubType>Designer</SubType>
+    </AppxManifest>
+  </ItemGroup>
+  <ItemGroup>
+    <Image Include="Assets\LockScreenLogo.scale-200.png" />
+    <Image Include="Assets\SplashScreen.scale-200.png" />
+    <Image Include="Assets\Square150x150Logo.scale-200.png" />
+    <Image Include="Assets\Square44x44Logo.scale-200.png" />
+    <Image Include="Assets\Square44x44Logo.targetsize-24_altform-unplated.png" />
+    <Image Include="Assets\StoreLogo.png" />
+    <Image Include="Assets\Wide310x150Logo.scale-200.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <ClCompile Include="MainPage.cpp">
+      <DependentUpon>MainPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
+    <ClCompile Include="ReactPackageProvider.cpp" />
+    <ClCompile Include="AutolinkedNativeModules.g.cpp" />
+    <ClCompile Include="pch.cpp">
+      <PrecompiledHeader>Create</PrecompiledHeader>
+    </ClCompile>
+    <ClCompile Include="App.cpp">
+      <DependentUpon>App.xaml</DependentUpon>
+    </ClCompile>
+    <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
+  </ItemGroup>
+  <ItemGroup>
+    <Midl Include="App.idl">
+      <DependentUpon>App.xaml</DependentUpon>
+    </Midl>
+    <Midl Include="MainPage.idl">
+      <DependentUpon>MainPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
+  </ItemGroup>
+  <ItemGroup>
+    <None Include="PropertySheet.props" />
+    <Text Include="readme.txt">
+      <DeploymentContent>false</DeploymentContent>
+    </Text>
+  </ItemGroup>
+  <ItemGroup>
+    <Page Include="MainPage.xaml">
+      <SubType>Designer</SubType>
+    </Page>
+  </ItemGroup>
+  <ItemGroup>
+    <PackageReference Include="Microsoft.Windows.CppWinRT" Version="2.0.211028.7" />
+  </ItemGroup>
+  <ItemGroup>
+    <ProjectReference Include="..\..\..\react-native-flipper\windows\ReactNativeFlipper\ReactNativeFlipper.vcxproj">
+      <Project>{8fcc4245-5f33-4111-b222-09f6b20ffdf4}</Project>
+    </ProjectReference>
+  </ItemGroup>
+  <Import Project="$(VCTargetsPath)\Microsoft.Cpp.targets" />
+  <ImportGroup Label="ReactNativeWindowsTargets">
+    <Import Project="$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.targets" Condition="Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.targets')" />
+  </ImportGroup>
+  <Target Name="EnsureReactNativeWindowsTargets" BeforeTargets="PrepareForBuild">
+    <PropertyGroup>
+      <ErrorText>This project references targets in your node_modules\react-native-windows folder that are missing. The missing file is {0}.</ErrorText>
+    </PropertyGroup>
+    <Error Condition="!Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.props')" Text="$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.props'))" />
+    <Error Condition="!Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.targets')" Text="$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppApp.targets'))" />
+  </Target>
+</Project>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/ReactNativeFlipperExample.vcxproj.filters

@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="Current" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <ItemGroup>
+    <ApplicationDefinition Include="App.xaml" />
+  </ItemGroup>
+  <ItemGroup>
+    <Midl Include="App.idl" />
+  </ItemGroup>
+  <ItemGroup>
+    <ClCompile Include="pch.cpp" />
+    <ClCompile Include="App.cpp" />
+    <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
+    <ClCompile Include="ReactPackageProvider.cpp" />
+    <ClCompile Include="AutolinkedNativeModules.g.cpp" />
+  </ItemGroup>
+  <ItemGroup>
+    <ClInclude Include="pch.h" />
+    <ClInclude Include="App.h" />
+    <ClInclude Include="ReactPackageProvider.h" />
+    <ClInclude Include="AutolinkedNativeModules.g.h" />
+  </ItemGroup>
+  <ItemGroup>
+    <Image Include="Assets\Wide310x150Logo.scale-200.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\StoreLogo.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\Square150x150Logo.scale-200.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\Square44x44Logo.targetsize-24_altform-unplated.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\Square44x44Logo.scale-200.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\SplashScreen.scale-200.png">
+      <Filter>Assets</Filter>
+    </Image>
+    <Image Include="Assets\LockScreenLogo.scale-200.png">
+      <Filter>Assets</Filter>
+    </Image>
+  </ItemGroup>
+  <ItemGroup>
+    <AppxManifest Include="Package.appxmanifest" />
+  </ItemGroup>
+  <ItemGroup>
+    <Filter Include="Assets">
+      <UniqueIdentifier>{e48dc53e-40b1-40cb-970a-f89935452892}</UniqueIdentifier>
+    </Filter>
+  </ItemGroup>
+  <ItemGroup>
+    <None Include="PropertySheet.props" />
+  </ItemGroup>
+  <ItemGroup>
+    <Text Include="readme.txt" />
+  </ItemGroup>
+  <ItemGroup>
+    <Page Include="MainPage.xaml" />
+  </ItemGroup>
+</Project>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/ReactPackageProvider.cpp

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// clang-format off
+#include "pch.h"
+#include "ReactPackageProvider.h"
+#include "NativeModules.h"
+// clang-format on
+
+using namespace winrt::Microsoft::ReactNative;
+
+namespace winrt::ReactNativeFlipperExample::implementation {
+
+void ReactPackageProvider::CreatePackage(
+    IReactPackageBuilder const& packageBuilder) noexcept {
+  AddAttributedModules(packageBuilder);
+}
+
+} // namespace winrt::ReactNativeFlipperExample::implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/ReactPackageProvider.h

@@ -0,0 +1,21 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include "winrt/Microsoft.ReactNative.h"
+
+namespace winrt::ReactNativeFlipperExample::implementation {
+struct ReactPackageProvider
+    : winrt::implements<
+          ReactPackageProvider,
+          winrt::Microsoft::ReactNative::IReactPackageProvider> {
+ public: // IReactPackageProvider
+  void CreatePackage(winrt::Microsoft::ReactNative::IReactPackageBuilder const&
+                         packageBuilder) noexcept;
+};
+} // namespace winrt::ReactNativeFlipperExample::implementation

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/packages.config

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<packages>
+  <package id="Microsoft.Windows.CppWinRT" version="2.0.220418.1" targetFramework="native"/>
+  <package id="Microsoft.UI.Xaml" version="2.7.0" targetFramework="native"/>
+</packages>

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/pch.cpp

@@ -0,0 +1,8 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include "pch.h"

react-native/ReactNativeFlipperExample/windows/ReactNativeFlipperExample/pch.h

@@ -0,0 +1,36 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+// clang-format off
+
+#define NOMINMAX
+
+#include <unknwn.h>
+#include <CppWinRTIncludes.h>
+#include <UI.Xaml.Controls.Primitives.h>
+#include <UI.Xaml.Controls.h>
+#include <UI.Xaml.Markup.h>
+#include <UI.Xaml.Navigation.h>
+#include <VersionMacros.h>
+#include <hstring.h>
+#include <restrictederrorinfo.h>
+
+#include <windows.h>
+#include <winrt/Windows.ApplicationModel.Activation.h>
+
+#include <winrt/Microsoft.ReactNative.h>
+
+#include <winrt/Microsoft.UI.Xaml.Automation.Peers.h>
+#include <winrt/Microsoft.UI.Xaml.Controls.Primitives.h>
+#include <winrt/Microsoft.UI.Xaml.Controls.h>
+#include <winrt/Microsoft.UI.Xaml.Media.h>
+#include <winrt/Microsoft.UI.Xaml.XamlTypeInfo.h>
+using namespace winrt::Windows::Foundation;
+
+// clang-format on