From 43646f7bbc29cd0353a1e51cebbcfd31ad38b2c6 Mon Sep 17 00:00:00 2001
From: Jesse Collins <jecollin@gmail.com>
Date: Wed, 7 May 2025 16:30:22 -0700
Subject: [PATCH] Working demo/prototype for some simple Xaml in an RNW app

---
 packages/sample-app-fabric/App.tsx            |  20 +-
 .../packages.lock.json                        |  12 +
 .../windows/SampleAppFabric.sln               |  15 +
 .../SampleAppFabric/SampleAppFabric.cpp       |   6 +
 .../SampleAppFabric/SampleAppFabric.vcxproj   |   6 +
 .../SampleAppFabric/packages.lock.json        |  11 +
 .../windows/SampleAppFabric/pch.h             |   1 +
 vnext/Microsoft.ReactNative.Xaml.sln          |  37 +
 vnext/Microsoft.ReactNative.Xaml/App.idl      |  19 +
 .../FabricXamlControl.cpp                     | 164 +++++
 .../FabricXamlControl.h                       | 259 +++++++
 .../Microsoft.ReactNative.Xaml.def            |   3 +
 .../Microsoft.ReactNative.Xaml.vcxproj        | 181 +++++
 ...Microsoft.ReactNative.Xaml.vcxproj.filters |  31 +
 .../PropertySheet.props                       |  17 +
 .../ReactPackageProvider.cpp                  |  17 +
 .../ReactPackageProvider.h                    |  18 +
 .../ReactPackageProvider.idl                  |   9 +
 .../XamlApplication.cpp                       |  56 ++
 .../XamlApplication.h                         |  53 ++
 vnext/Microsoft.ReactNative.Xaml/XamlHost.cpp |  76 +++
 vnext/Microsoft.ReactNative.Xaml/XamlHost.h   |   9 +
 .../XamlMetaDataProvider.cpp                  |   4 +
 .../XamlMetaDataProvider.g.cpp                |  13 +
 .../XamlMetaDataProvider.g.h                  |  52 ++
 .../XamlMetaDataProvider.h                    |  58 ++
 .../XamlMetaDataProvider.idl                  |   9 +
 .../XamlTypeInfo.Impl.g.cpp                   | 640 ++++++++++++++++++
 .../XamlTypeInfo.g.cpp                        | 538 +++++++++++++++
 .../XamlTypeInfo.xaml.g.h                     | 225 ++++++
 .../packages.newarch.lock.json                |  98 +++
 vnext/Microsoft.ReactNative.Xaml/pch.cpp      |   1 +
 vnext/Microsoft.ReactNative.Xaml/pch.h        |  27 +
 vnext/Microsoft.ReactNative.Xaml/resource.h   |  16 +
 .../ContentIslandComponentView.cpp            |   7 +-
 ...ft.ReactNative.Cpp.ProjectReferences.props |   7 +
 .../components/rnwcore/ComponentDescriptors.h |   1 +
 .../components/rnwcore/EventEmitters.cpp      |   1 +
 .../react/components/rnwcore/EventEmitters.h  |   7 +
 .../react/components/rnwcore/Props.cpp        |   7 +
 .../codegen/react/components/rnwcore/Props.h  |  10 +
 .../react/components/rnwcore/ShadowNodes.cpp  |   1 +
 .../react/components/rnwcore/ShadowNodes.h    |  11 +
 .../codegen/react/components/rnwcore/States.h |  12 +
 .../react/components/rnwcore/XamlHost.g.h     | 200 ++++++
 .../Xaml/FabricXamlControl.windows.js         |  26 +
 .../Components/Xaml/XamlHost.windows.js       |   7 +
 vnext/src-win/Libraries/platform-types.d.ts   |   1 +
 vnext/src-win/index.windows.js                |   4 +
 .../Xaml/XamlHostNativeComponent.js           |  19 +
 50 files changed, 3018 insertions(+), 4 deletions(-)
 create mode 100644 vnext/Microsoft.ReactNative.Xaml.sln
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/App.idl
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.def
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj.filters
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/PropertySheet.props
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.idl
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlApplication.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlApplication.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlHost.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlHost.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.idl
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.Impl.g.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.g.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.xaml.g.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/packages.newarch.lock.json
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/pch.cpp
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/pch.h
 create mode 100644 vnext/Microsoft.ReactNative.Xaml/resource.h
 create mode 100644 vnext/codegen/react/components/rnwcore/XamlHost.g.h
 create mode 100644 vnext/src-win/Libraries/Components/Xaml/FabricXamlControl.windows.js
 create mode 100644 vnext/src-win/Libraries/Components/Xaml/XamlHost.windows.js
 create mode 100644 vnext/src-win/src/private/specs/components/Xaml/XamlHostNativeComponent.js

diff --git a/packages/sample-app-fabric/App.tsx b/packages/sample-app-fabric/App.tsx
index 125fe1b98eb..dbcffad61d3 100644
--- a/packages/sample-app-fabric/App.tsx
+++ b/packages/sample-app-fabric/App.tsx
@@ -25,6 +25,14 @@ import {
   ReloadInstructions,
 } from 'react-native/Libraries/NewAppScreen';
 
+import {XamlHost} from 'react-native-windows';
+
+import {
+  StackPanel,
+  Button,
+  CalendarView,
+} from 'react-native-windows/Libraries/Components/Xaml/FabricXamlControl';
+
 type SectionProps = PropsWithChildren<{
   title: string;
 }>;
@@ -77,9 +85,17 @@ function App(): React.JSX.Element {
             backgroundColor: isDarkMode ? Colors.black : Colors.white,
           }}>
           <Section title="Step One">
-            Edit <Text style={styles.highlight}>App.tsx</Text> to change this
-            screen and then come back to see your edits.
+            Edit <Text style={styles.highlight}>App.tsx</Text> to change this.
+            I'll try showing some Xaml here:
           </Section>
+          <XamlHost style={{width: 400, height: 400}}>
+            <StackPanel>
+              <Button content="Hello, World!" />
+              {/* width and height are for the Xaml layout here, not RN.  Confusing, right?  */}
+              <Button content="1 Wide button" width="400" />
+              <CalendarView width="400" height="300" />
+            </StackPanel>
+          </XamlHost>
           <Section title="See Your Changes">
             <ReloadInstructions />
           </Section>
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric.Package/packages.lock.json b/packages/sample-app-fabric/windows/SampleAppFabric.Package/packages.lock.json
index 7d84a365b4f..0c166aed5fa 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric.Package/packages.lock.json
+++ b/packages/sample-app-fabric/windows/SampleAppFabric.Package/packages.lock.json
@@ -83,6 +83,17 @@
           "boost": "[1.83.0, )"
         }
       },
+      "microsoft.reactnative.xaml": {
+        "type": "Project",
+        "dependencies": {
+          "Common": "[1.0.0, )",
+          "Folly": "[1.0.0, )",
+          "Microsoft.ReactNative": "[1.0.0, )",
+          "Microsoft.WindowsAppSDK": "[1.7.250401001, )",
+          "ReactCommon": "[1.0.0, )",
+          "boost": "[1.83.0, )"
+        }
+      },
       "reactcommon": {
         "type": "Project",
         "dependencies": {
@@ -95,6 +106,7 @@
         "dependencies": {
           "Microsoft.JavaScript.Hermes": "[0.0.0-2505.2001-0e4bc3b9, )",
           "Microsoft.ReactNative": "[1.0.0, )",
+          "Microsoft.ReactNative.Xaml": "[1.0.0, )",
           "Microsoft.VCRTForwarders.140": "[1.0.2-rc, )",
           "Microsoft.WindowsAppSDK": "[1.7.250401001, )",
           "boost": "[1.83.0, )"
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric.sln b/packages/sample-app-fabric/windows/SampleAppFabric.sln
index 1eabd0cabef..75e0f0b858c 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric.sln
+++ b/packages/sample-app-fabric/windows/SampleAppFabric.sln
@@ -35,6 +35,8 @@ Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Mso", "..\..\..\vnext\Mso\M
 EndProject
 Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Include", "..\..\..\vnext\include\Include.vcxitems", "{EF074BA1-2D54-4D49-A28E-5E040B47CD2E}"
 EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Microsoft.ReactNative.Xaml", "..\..\..\vnext\Microsoft.ReactNative.Xaml\Microsoft.ReactNative.Xaml.vcxproj", "{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}"
+EndProject
 Global
 	GlobalSection(SharedMSBuildProjectFiles) = preSolution
 		..\..\..\vnext\Shared\Shared.vcxitems*{2049dbe9-8d13-42c9-ae4b-413ae38fffd0}*SharedItemsImports = 9
@@ -154,6 +156,19 @@ Global
 		{14B93DC8-FD93-4A6D-81CB-8BC96644501C}.Release|x86.ActiveCfg = Release|Win32
 		{14B93DC8-FD93-4A6D-81CB-8BC96644501C}.Release|x86.Build.0 = Release|Win32
 		{14B93DC8-FD93-4A6D-81CB-8BC96644501C}.Release|x86.Deploy.0 = Release|Win32
+
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x64.ActiveCfg = Debug|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x64.Build.0 = Debug|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x86.ActiveCfg = Debug|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x86.Build.0 = Debug|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|ARM64.Build.0 = Debug|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x64.ActiveCfg = Release|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x64.Build.0 = Release|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x86.ActiveCfg = Release|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x86.Build.0 = Release|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|ARM64.ActiveCfg = Release|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|ARM64.Build.0 = Release|ARM64
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.cpp b/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.cpp
index 2aeaae1397e..7affd0feffa 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.cpp
+++ b/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.cpp
@@ -8,6 +8,8 @@
 
 #include "NativeModules.h"
 
+#include <winrt/Microsoft.ReactNative.Xaml.h>
+
 // A PackageProvider containing any turbo modules you define within this app project
 struct CompReactPackageProvider
     : winrt::implements<CompReactPackageProvider, winrt::Microsoft::ReactNative::IReactPackageProvider> {
@@ -39,6 +41,10 @@ _Use_decl_annotations_ int CALLBACK WinMain(HINSTANCE instance, HINSTANCE, PSTR
   RegisterAutolinkedNativeModulePackages(settings.PackageProviders());
   // Register any native modules defined within this app project
   settings.PackageProviders().Append(winrt::make<CompReactPackageProvider>());
+  // TODO: Can we make apps register this automatically?  (e.g. with autolinking)
+  // TODO: But ideally we don't load the M.RN.Xaml.dll at all if we're not using Xaml.
+  settings.PackageProviders().Append(winrt::Microsoft::ReactNative::Xaml::ReactPackageProvider());
+
 
 #if BUNDLE
   // Load the JS bundle from a file (not Metro):
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.vcxproj b/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.vcxproj
index 415ba11b336..5769c51da30 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.vcxproj
+++ b/packages/sample-app-fabric/windows/SampleAppFabric/SampleAppFabric.vcxproj
@@ -124,6 +124,12 @@
     <Import Project="$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Composition.CppApp.targets" Condition="Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Composition.CppApp.targets')" />
   </ImportGroup>
   <ItemGroup>
+    <!-- TODO: Can we make this happen automatically, like with autolinking? -->
+    <ProjectReference Include="$(ReactNativeWindowsDir)Microsoft.ReactNative.Xaml\Microsoft.ReactNative.Xaml.vcxproj">
+      <Project>{e5d1b5d2-0e6a-4011-8bcd-08968256dcbd}</Project>
+      <Name>Microsoft.ReactNative.Xaml</Name>
+      <Private Condition="'$(ConfigurationType)' != 'Application'">false</Private>
+    </ProjectReference>
   </ItemGroup>
   <Target Name="EnsureReactNativeWindowsTargets" BeforeTargets="PrepareForBuild">
     <PropertyGroup>
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric/packages.lock.json b/packages/sample-app-fabric/windows/SampleAppFabric/packages.lock.json
index 48426cb9ce0..08b85b9b401 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric/packages.lock.json
+++ b/packages/sample-app-fabric/windows/SampleAppFabric/packages.lock.json
@@ -93,6 +93,17 @@
           "boost": "[1.83.0, )"
         }
       },
+      "microsoft.reactnative.xaml": {
+        "type": "Project",
+        "dependencies": {
+          "Common": "[1.0.0, )",
+          "Folly": "[1.0.0, )",
+          "Microsoft.ReactNative": "[1.0.0, )",
+          "Microsoft.WindowsAppSDK": "[1.7.250401001, )",
+          "ReactCommon": "[1.0.0, )",
+          "boost": "[1.83.0, )"
+        }
+      },
       "reactcommon": {
         "type": "Project",
         "dependencies": {
diff --git a/packages/sample-app-fabric/windows/SampleAppFabric/pch.h b/packages/sample-app-fabric/windows/SampleAppFabric/pch.h
index 364879013f3..741503c3010 100644
--- a/packages/sample-app-fabric/windows/SampleAppFabric/pch.h
+++ b/packages/sample-app-fabric/windows/SampleAppFabric/pch.h
@@ -23,6 +23,7 @@
 #include <CppWinRTIncludes.h>
 #include <winrt/Microsoft.ReactNative.Composition.h>
 #include <winrt/Microsoft.ReactNative.h>
+#include <winrt/Microsoft.ReactNative.Xaml.h>
 #include <winrt/Microsoft.UI.Composition.h>
 #include <winrt/Microsoft.UI.Content.h>
 #include <winrt/Microsoft.UI.Dispatching.h>
diff --git a/vnext/Microsoft.ReactNative.Xaml.sln b/vnext/Microsoft.ReactNative.Xaml.sln
new file mode 100644
index 00000000000..9e584fbf49c
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml.sln
@@ -0,0 +1,37 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 17
+VisualStudioVersion = 17.13.35913.81 d17.13
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Microsoft.ReactNative.Xaml", "Microsoft.ReactNative.Xaml\Microsoft.ReactNative.Xaml.vcxproj", "{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|ARM64 = Debug|ARM64
+		Debug|x64 = Debug|x64
+		Debug|x86 = Debug|x86
+		Release|ARM64 = Release|ARM64
+		Release|x64 = Release|x64
+		Release|x86 = Release|x86
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|ARM64.Build.0 = Debug|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x64.ActiveCfg = Debug|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x64.Build.0 = Debug|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x86.ActiveCfg = Debug|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Debug|x86.Build.0 = Debug|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|ARM64.ActiveCfg = Release|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|ARM64.Build.0 = Release|ARM64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x64.ActiveCfg = Release|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x64.Build.0 = Release|x64
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x86.ActiveCfg = Release|Win32
+		{E5D1B5D2-0E6A-4011-8BCD-08968256DCBD}.Release|x86.Build.0 = Release|Win32
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {3B36CAF0-BCD9-42C7-B311-05FDDCCEC9D4}
+	EndGlobalSection
+EndGlobal
diff --git a/vnext/Microsoft.ReactNative.Xaml/App.idl b/vnext/Microsoft.ReactNative.Xaml/App.idl
new file mode 100644
index 00000000000..1e889e85a2b
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/App.idl
@@ -0,0 +1,19 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+namespace Microsoft.ReactNative.Xaml
+{
+    [webhosthidden][default_interface] runtimeclass XamlApplication : Microsoft.UI.Xaml.Application,
+      Microsoft.UI.Xaml.Markup.IXamlMetadataProvider
+    {
+        XamlApplication();
+
+        static void EnsureCreated();
+
+        static XamlApplication Current {
+          get;
+        };
+
+        void AddMetadataProvider(Microsoft.UI.Xaml.Markup.IXamlMetadataProvider otherProvider);
+    }
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.cpp b/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.cpp
new file mode 100644
index 00000000000..e5c40a9d171
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.cpp
@@ -0,0 +1,164 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+#include "pch.h"
+
+#if !defined(RNW_NEW_ARCH)
+static_assert(false, "This module requires RNW_NEW_ARCH to be defined.");
+#endif
+
+#include "FabricXamlControl.h"
+
+#include <NativeModules.h>
+
+#include <JSValueComposition.h>
+
+#include <winrt/Microsoft.ReactNative.Composition.h>
+#include <winrt/Microsoft.UI.Composition.h>
+
+#include <winrt/Microsoft.UI.Xaml.Controls.h>
+
+namespace winrt::Microsoft::ReactNative::Xaml {
+
+template <typename TUserData>
+void CustomRegisterXamlControlNativeComponent(
+    winrt::hstring name,
+    winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder,
+    std::function<void(const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &)>
+        builderCallback) noexcept {
+  packageBuilder.as<winrt::Microsoft::ReactNative::IReactPackageBuilderFabric>().AddViewComponent(
+      name, [name, builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept {
+        auto compBuilder =
+            builder.as<winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder>();
+
+        builder.SetCreateProps([name](
+                                   winrt::Microsoft::ReactNative::ViewProps props,
+                                   const winrt::Microsoft::ReactNative::IComponentProps &cloneFrom) noexcept {
+          return winrt::make<FabricXamlControlProps>(name, props, cloneFrom);
+        });
+
+        builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                         const winrt::Microsoft::ReactNative::IComponentProps &newProps,
+                                         const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept {
+          auto userData = view.UserData().as<TUserData>();
+          userData->UpdateProps(
+              view,
+              newProps ? newProps.as<FabricXamlControlProps>() : nullptr,
+              oldProps ? oldProps.as<FabricXamlControlProps>() : nullptr);
+        });
+
+        compBuilder.SetUpdateLayoutMetricsHandler(
+            [](const winrt::Microsoft::ReactNative::ComponentView &view,
+               const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics,
+               const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept {
+              auto userData = view.UserData().as<TUserData>();
+              userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics);
+            });
+
+        builder.SetUpdateEventEmitterHandler(
+            [](const winrt::Microsoft::ReactNative::ComponentView &view,
+               const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept {
+              auto userData = view.UserData().as<TUserData>();
+              userData->UpdateEventEmitter(std::make_shared<FabricXamlControlEventEmitter>(eventEmitter));
+            });
+
+        if constexpr (
+            &TUserData::FinalizeUpdate !=
+            &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::FinalizeUpdate) {
+          builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                              winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->FinalizeUpdate(view, mask);
+          });
+        }
+
+        if constexpr (
+            &TUserData::UpdateState != &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::UpdateState) {
+          builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                           const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->UpdateState(view, newState);
+          });
+        }
+
+        if constexpr (
+            &TUserData::MountChildComponentView !=
+            &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::MountChildComponentView) {
+          builder.SetMountChildComponentViewHandler(
+              [](const winrt::Microsoft::ReactNative::ComponentView &view,
+                 const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept {
+                auto userData = view.UserData().as<TUserData>();
+                return userData->MountChildComponentView(view, args);
+              });
+        }
+
+        if constexpr (
+            &TUserData::UnmountChildComponentView !=
+            &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::UnmountChildComponentView) {
+          builder.SetUnmountChildComponentViewHandler(
+              [](const winrt::Microsoft::ReactNative::ComponentView &view,
+                 const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept {
+                auto userData = view.UserData().as<TUserData>();
+                return userData->UnmountChildComponentView(view, args);
+              });
+        }
+
+        compBuilder.SetViewComponentViewInitializer(
+            [name](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+              auto userData = winrt::make_self<TUserData>(name);
+              if constexpr (
+                  &TUserData::Initialize !=
+                  &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::Initialize) {
+                userData->Initialize(view);
+              }
+              view.UserData(*userData);
+            });
+
+        if constexpr (
+            &TUserData::CreateVisual != &winrt::Microsoft::ReactNative::Xaml::BaseFabricXamlControl<TUserData>::CreateVisual) {
+          compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+            // I suppose we should return null here since we're not backed by a visual?
+            // No, it looks like in CompositionViewComponentView.cpp ViewComponentView::ensureVisual that this will
+            // fail.
+            // TODO: Don't create a dummy visual here.
+            auto userData = view.UserData().as<TUserData>();
+            return userData->CreateVisual(view);
+          });
+        }
+
+        // Allow app to further customize the builder
+        if (builderCallback) {
+          builderCallback(compBuilder);
+        }
+      });
+}
+
+} // namespace winrt::Microsoft::ReactNative::Xaml
+
+void RegisterXamlControl(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) {
+  winrt::Microsoft::ReactNative::Xaml::CustomRegisterXamlControlNativeComponent<
+      winrt::Microsoft::ReactNative::Xaml::XamlControlComponentView>(
+      winrt::hstring{L"FX_StackPanel"},
+      packageBuilder,
+      [](const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &builder) {
+        UNREFERENCED_PARAMETER(builder);
+        // TODO: Do we need to do anything here?
+      });
+
+  winrt::Microsoft::ReactNative::Xaml::CustomRegisterXamlControlNativeComponent<
+      winrt::Microsoft::ReactNative::Xaml::XamlControlComponentView>(
+      winrt::hstring{L"FX_Button"},
+      packageBuilder,
+      [](const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &builder) {
+        UNREFERENCED_PARAMETER(builder);
+        // TODO: Do we need to do anything here?
+      });
+
+  winrt::Microsoft::ReactNative::Xaml::CustomRegisterXamlControlNativeComponent<
+      winrt::Microsoft::ReactNative::Xaml::XamlControlComponentView>(
+      winrt::hstring{L"FX_CalendarView"},
+      packageBuilder,
+      [](const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &builder) {
+        UNREFERENCED_PARAMETER(builder);
+        // TODO: Do we need to do anything here?
+      });
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.h b/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.h
new file mode 100644
index 00000000000..e70a12eb183
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/FabricXamlControl.h
@@ -0,0 +1,259 @@
+#pragma once
+
+#if !defined(RNW_NEW_ARCH)
+static_assert(false, "This module requires RNW_NEW_ARCH to be defined.");
+#endif
+
+#include <NativeModules.h>
+
+#include <JSValueComposition.h>
+
+#include <winrt/Microsoft.ReactNative.Composition.h>
+#include <winrt/Microsoft.UI.Composition.h>
+
+#include <winrt/Microsoft.UI.Xaml.Controls.h>
+
+inline std::wstring ToWideString(const char *str) {
+  int len = MultiByteToWideChar(CP_UTF8, 0, str, -1, nullptr, 0);
+  if (len == 0) {
+    return nullptr; // Conversion error
+  }
+
+  // Allocate a wstring with buffer size of len
+  std::wstring result(len, L'\0');
+
+  // Convert the std::string to BSTR
+  MultiByteToWideChar(CP_UTF8, 0, str, -1, &result[0], len);
+
+  return result;
+}
+
+namespace winrt::Microsoft::ReactNative::Xaml {
+
+
+// A FabricXamlControl is a control that represents a generic Xaml element.
+// The m_xamlTypeName field tells us what kind of Xaml element.
+// A tree of FabricXamlControls must have a XamlHost as a root.
+REACT_STRUCT(FabricXamlControlProps)
+struct FabricXamlControlProps
+    : winrt::implements<FabricXamlControlProps, winrt::Microsoft::ReactNative::IComponentProps> {
+  FabricXamlControlProps(
+      winrt::hstring name,
+      winrt::Microsoft::ReactNative::ViewProps props,
+      const winrt::Microsoft::ReactNative::IComponentProps &cloneFrom)
+      : ViewProps(props), xamlTypeName(name) {
+    if (cloneFrom) {
+      auto cloneFromProps = cloneFrom.as<FabricXamlControlProps>();
+      label = cloneFromProps->label;
+      xamlTypeName = cloneFromProps->xamlTypeName;
+    }
+  }
+
+  void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept {
+    winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this);
+  }
+
+  REACT_FIELD(label)
+  std::string label;
+
+  REACT_FIELD(text)
+  std::string text;
+
+  REACT_FIELD(content)
+  // winrt::IInspectable content;
+  winrt::Microsoft::ReactNative::JSValue content;
+
+  REACT_FIELD(width)
+  std::optional<float> width;
+
+  REACT_FIELD(height)
+  std::optional<float> height;
+
+  const winrt::Microsoft::ReactNative::ViewProps ViewProps;
+
+  winrt::hstring xamlTypeName;
+};
+
+struct FabricXamlControlEventEmitter {
+  FabricXamlControlEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter)
+      : m_eventEmitter(eventEmitter) {}
+
+ private:
+  winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr};
+};
+
+template <typename TUserData>
+struct BaseFabricXamlControl {
+  virtual void UpdateProps(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::com_ptr<FabricXamlControlProps> &newProps,
+      const winrt::com_ptr<FabricXamlControlProps> & /*oldProps*/) noexcept {
+    m_props = newProps;
+  }
+
+  // UpdateLayoutMetrics will only be called if this method is overridden
+  virtual void UpdateLayoutMetrics(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::LayoutMetrics & /*newLayoutMetrics*/,
+      const winrt::Microsoft::ReactNative::LayoutMetrics & /*oldLayoutMetrics*/) noexcept {}
+
+  // UpdateState will only be called if this method is overridden
+  virtual void UpdateState(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::IComponentState & /*newState*/) noexcept {}
+
+  virtual void UpdateEventEmitter(const std::shared_ptr<FabricXamlControlEventEmitter> &eventEmitter) noexcept {
+    m_eventEmitter = eventEmitter;
+  }
+
+  // MountChildComponentView will only be called if this method is overridden
+  virtual void MountChildComponentView(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::MountChildComponentViewArgs & /*args*/) noexcept {}
+
+  // UnmountChildComponentView will only be called if this method is overridden
+  virtual void UnmountChildComponentView(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs & /*args*/) noexcept {}
+
+  // Initialize will only be called if this method is overridden
+  virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView & /*view*/) noexcept {}
+
+  // CreateVisual will only be called if this method is overridden
+  virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(
+      const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+    return view.as<winrt::Microsoft::ReactNative::Composition::ComponentView>().Compositor().CreateSpriteVisual();
+  }
+
+  // FinalizeUpdate will only be called if this method is overridden
+  virtual void FinalizeUpdate(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept {}
+
+  const std::shared_ptr<FabricXamlControlEventEmitter> &EventEmitter() const {
+    return m_eventEmitter;
+  }
+  const winrt::com_ptr<FabricXamlControlProps> &Props() const {
+    return m_props;
+  }
+
+ private:
+  winrt::com_ptr<FabricXamlControlProps> m_props;
+  std::shared_ptr<FabricXamlControlEventEmitter> m_eventEmitter;
+};
+
+struct XamlControlComponentView: public winrt::implements<XamlControlComponentView, winrt::IInspectable>,
+                                  BaseFabricXamlControl<XamlControlComponentView> {
+                                    XamlControlComponentView(winrt::hstring name) : m_xamlTypeName(name) {
+    ::OutputDebugString(L"Microsoft::ReactNative::Xaml constructor\n");
+    ::OutputDebugString(m_xamlTypeName.c_str());
+    ::OutputDebugString(L"\n");
+  }
+
+  // MountChildComponentView will only be called if this method is overridden
+  void MountChildComponentView(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept override {
+    // We're adding a child Xaml element to this Xaml element.
+    auto child = args.Child();
+    auto userData = child.UserData();
+    auto childXamlControl = userData.as<XamlControlComponentView>();
+    if (childXamlControl) {
+      auto childXamlElement = childXamlControl->GetXamlElement();
+      auto thisElement = GetXamlElement();
+      AddXamlChild(thisElement, childXamlElement, args.Index());
+    }
+  }
+
+  void UnmountChildComponentView(
+    const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+    const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept override {
+  // We're adding a child Xaml element to this Xaml element.
+  auto child = args.Child();
+  auto userData = child.UserData();
+  auto childXamlControl = userData.as<XamlControlComponentView>();
+  if (childXamlControl) {
+    auto thisElement = GetXamlElement();
+    RemoveXamlChild(thisElement, args.Index());
+  }
+}
+
+  void UpdateProps(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::com_ptr<FabricXamlControlProps> &newProps,
+      const winrt::com_ptr<FabricXamlControlProps> & /*oldProps*/) noexcept override {
+    auto xamlControl = GetXamlElement();
+
+    if (newProps != nullptr) {
+      if (newProps->content.Type() == winrt::Microsoft::ReactNative::JSValueType::String) {
+        auto content = newProps->content.AsString();
+        // const std::wstring url16 = Microsoft::Common::Unicode::Utf8ToUtf16(content);
+        auto string16 = ToWideString(content.c_str());
+        winrt::hstring contentHString(string16.c_str());
+        xamlControl.SetValue(
+            winrt::Microsoft::UI::Xaml::Controls::ContentControl::ContentProperty(), winrt::box_value(contentHString));
+      } else if (newProps->content.Type() == winrt::Microsoft::ReactNative::JSValueType::Null) {
+        // xamlControl.SetValue(winrt::Microsoft::UI::Xaml::Controls::ContentControl::ContentProperty,
+        // winrt::hstring{L""});
+      } else {
+        // TODO: Better error handling here.
+        ::OutputDebugString(L"UpdateProps: I don't recognize this type.\n");
+      }
+
+      if (newProps->width) {
+        xamlControl.as<winrt::Microsoft::UI::Xaml::FrameworkElement>().Width(newProps->width.value());
+      }
+      if (newProps->height) {
+        xamlControl.as<winrt::Microsoft::UI::Xaml::FrameworkElement>().Height(newProps->height.value());
+      }
+    }
+
+  }
+
+  void FinalizeUpdate(
+      const winrt::Microsoft::ReactNative::ComponentView &view,
+      winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept override {
+    UNREFERENCED_PARAMETER(mask);
+    view.Mounted([](const winrt::IInspectable &, const winrt::Microsoft::ReactNative::ComponentView &view) {
+      UNREFERENCED_PARAMETER(view);
+      // Do mounted things (?)
+    });
+    ::OutputDebugString(L"FinalizeUpdate\n");
+  }
+
+  static void AddXamlChild(winrt::Microsoft::UI::Xaml::UIElement parent, winrt::Microsoft::UI::Xaml::UIElement child, uint32_t index) {
+    // TODO: Support all kinds of Xaml panels and elements that can accept children.
+    auto panel = parent.as<winrt::Microsoft::UI::Xaml::Controls::Panel>();
+    panel.Children().InsertAt(index, child);
+  }
+
+  static void RemoveXamlChild(winrt::Microsoft::UI::Xaml::UIElement parent, uint32_t index) {
+    // TODO: Support all kinds of Xaml panels and elements that can accept children.
+    auto panel = parent.as<winrt::Microsoft::UI::Xaml::Controls::Panel>();
+    auto children = panel.Children();
+    children.RemoveAt(index);
+  }
+
+  winrt::Microsoft::UI::Xaml::UIElement GetXamlElement() {
+    if (!m_xamlElement) {
+      if (wcscmp(m_xamlTypeName.c_str(), L"FX_StackPanel") == 0) {
+        m_xamlElement = winrt::Microsoft::UI::Xaml::Controls::StackPanel();
+      } else if (wcscmp(m_xamlTypeName.c_str(), L"FX_Button") == 0) {
+        m_xamlElement = winrt::Microsoft::UI::Xaml::Controls::Button();
+      } else if (wcscmp(m_xamlTypeName.c_str(), L"FX_CalendarView") == 0) {
+        m_xamlElement = winrt::Microsoft::UI::Xaml::Controls::CalendarView();
+      } else {
+        throw std::exception("Unknown XAML control type");
+      }
+    }
+    return m_xamlElement;
+  }
+
+ private:
+  winrt::Microsoft::UI::Xaml::UIElement m_xamlElement{nullptr};
+  winrt::hstring m_xamlTypeName;
+};
+
+} // namespace winrt::Microsoft::ReactNative::Xaml
+
+// #endif // #if defined(RNW_NEW_ARCH)
\ No newline at end of file
diff --git a/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.def b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.def
new file mode 100644
index 00000000000..24e7c1235c3
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.def
@@ -0,0 +1,3 @@
+EXPORTS
+DllCanUnloadNow = WINRT_CanUnloadNow                    PRIVATE
+DllGetActivationFactory = WINRT_GetActivationFactory    PRIVATE
diff --git a/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj
new file mode 100644
index 00000000000..6486d2ba515
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj
@@ -0,0 +1,181 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project DefaultTargets="Build" ToolsVersion="15.0" 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>{e5d1b5d2-0e6a-4011-8bcd-08968256dcbd}</ProjectGuid>
+    <ProjectName>Microsoft.ReactNative.Xaml</ProjectName>
+    <RootNamespace>Microsoft.ReactNative.Xaml</RootNamespace>
+    <DefaultLanguage>en-US</DefaultLanguage>
+    <MinimumVisualStudioVersion>16.0</MinimumVisualStudioVersion>
+    <AppContainerApplication>false</AppContainerApplication>
+    <ApplicationType>Windows Store</ApplicationType>
+    <ApplicationTypeRevision>10.0</ApplicationTypeRevision>
+    <WindowsTargetPlatformVersion Condition=" '$(WindowsTargetPlatformVersion)' == '' ">10.0.22621.0</WindowsTargetPlatformVersion>
+    <WindowsTargetPlatformMinVersion>10.0.17763.0</WindowsTargetPlatformMinVersion>
+    <DesktopCompatible>true</DesktopCompatible>
+    <UseWinUI>true</UseWinUI>
+  </PropertyGroup>
+  <Import Project="$(VCTargetsPath)\Microsoft.Cpp.Default.props" />
+  <Import Project="$(ReactNativeWindowsDir)PropertySheets\React.Cpp.props" />
+  <Import Project="$(ReactNativeWindowsDir)PropertySheets\Generated\PackageVersion.g.props" />
+  <Import Project="$(ReactNativeWindowsDir)PropertySheets\PackageVersionDefinitions.props" />
+  <ItemGroup Label="ProjectConfigurations">
+    <ProjectConfiguration Include="Debug|Win32">
+      <Configuration>Debug</Configuration>
+      <Platform>Win32</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Debug|x64">
+      <Configuration>Debug</Configuration>
+      <Platform>x64</Platform>
+    </ProjectConfiguration>
+    <ProjectConfiguration Include="Debug|ARM64">
+      <Configuration>Debug</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>
+    <ProjectConfiguration Include="Release|ARM64">
+      <Configuration>Release</Configuration>
+      <Platform>ARM64</Platform>
+    </ProjectConfiguration>
+  </ItemGroup>
+  <PropertyGroup Label="Configuration">
+    <ConfigurationType>DynamicLibrary</ConfigurationType>
+    <PlatformToolset>v143</PlatformToolset>
+    <CharacterSet>Unicode</CharacterSet>
+    <GenerateManifest>false</GenerateManifest>
+    <DesktopCompatible>true</DesktopCompatible>
+  </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="Shared">
+  </ImportGroup>
+  <Import Project="..\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems" Label="Shared" />
+  <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" />
+    <Import Project="..\PropertySheets\WinUI.props" />
+    <!-- Added since we build this project with Paper/Fabric. -->
+    <Import Project="$(ReactNativeWindowsDir)\PropertySheets\NuGet.LockFile.props" />
+  </ImportGroup>
+  <PropertyGroup Label="UserMacros" />
+  <PropertyGroup />
+  <ItemDefinitionGroup>
+    <ClCompile>
+      <PrecompiledHeader>Use</PrecompiledHeader>
+      <PrecompiledHeaderFile>pch.h</PrecompiledHeaderFile>
+      <PrecompiledHeaderOutputFile>$(IntDir)pch.pch</PrecompiledHeaderOutputFile>
+      <WarningLevel>Level4</WarningLevel>
+      <AdditionalOptions>%(AdditionalOptions) /bigobj</AdditionalOptions>
+      <PreprocessorDefinitions>_WINRT_DLL;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+      <AdditionalUsingDirectories>$(WindowsSDK_WindowsMetadata);$(AdditionalUsingDirectories)</AdditionalUsingDirectories>
+    </ClCompile>
+    <Link>
+      <SubSystem>Console</SubSystem>
+      <GenerateWindowsMetadata>true</GenerateWindowsMetadata>
+      <ModuleDefinitionFile>Microsoft.ReactNative.Xaml.def</ModuleDefinitionFile>
+    </Link>
+  </ItemDefinitionGroup>
+  <ItemDefinitionGroup Condition="'$(Configuration)'=='Debug'">
+    <ClCompile>
+      <PreprocessorDefinitions>_DEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+    </ClCompile>
+  </ItemDefinitionGroup>
+  <ItemDefinitionGroup Condition="'$(Configuration)'=='Release'">
+    <ClCompile>
+      <PreprocessorDefinitions>NDEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+    </ClCompile>
+    <Link>
+      <EnableCOMDATFolding>true</EnableCOMDATFolding>
+      <OptimizeReferences>true</OptimizeReferences>
+    </Link>
+  </ItemDefinitionGroup>
+  <ItemGroup>
+    <ClInclude Include="pch.h" />
+    <ClInclude Include="ReactPackageProvider.h">
+      <DependentUpon>ReactPackageProvider.idl</DependentUpon>
+    </ClInclude>
+  </ItemGroup>
+  <ItemGroup>
+    <ClCompile Include="pch.cpp">
+      <PrecompiledHeader>Create</PrecompiledHeader>
+    </ClCompile>
+    <ClCompile Include="ReactPackageProvider.cpp">
+      <DependentUpon>ReactPackageProvider.idl</DependentUpon>
+    </ClCompile>
+    <ClCompile Include="XamlApplication.cpp" />
+    <ClCompile Include="FabricXamlControl.cpp" />
+    <ClCompile Include="XamlHost.cpp" />
+    <ClCompile Include="XamlMetadataProvider.cpp" />
+    <ClCompile Include="XamlTypeInfo.Impl.g.cpp" />
+    <ClCompile Include="XamlTypeInfo.g.cpp" />
+    <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
+  </ItemGroup>
+  <ItemGroup>
+    <Midl Include="ReactPackageProvider.idl" />
+  </ItemGroup>
+  <ItemGroup>
+    <Midl Include="App.idl">
+      <SubType>Code</SubType>
+    </Midl>
+    <Midl Include="XamlMetaDataProvider.idl">
+      <SubType>Code</SubType>
+    </Midl>
+  </ItemGroup>
+  <ItemGroup>
+    <None Include="Microsoft.ReactNative.Xaml.def" />
+    <!--
+    <None Include="packages.config" />
+    <None Include="packages.lock.json" />
+    -->
+  </ItemGroup>
+  <ItemGroup>
+    <ProjectReference Include="..\Common\Common.vcxproj">
+      <Project>{fca38f3c-7c73-4c47-be4e-32f77fa8538d}</Project>
+    </ProjectReference>
+    <ProjectReference Include="..\Folly\Folly.vcxproj">
+      <Project>{a990658c-ce31-4bcc-976f-0fc6b1af693d}</Project>
+    </ProjectReference>
+    <ProjectReference Include="..\ReactCommon\ReactCommon.vcxproj">
+      <Project>{a9d95a91-4db7-4f72-beb6-fe8a5c89bfbd}</Project>
+    </ProjectReference>
+    <ProjectReference Include="..\Microsoft.ReactNative\Microsoft.ReactNative.vcxproj">
+      <Project>{f7d32bd0-2749-483e-9a0d-1635ef7e3136}</Project>
+    </ProjectReference>
+  </ItemGroup>
+  <ItemGroup>
+    <PackageReference Include="boost" Version="1.83.0.0" />
+    <PackageReference Include="Microsoft.Windows.CppWinRT" Version="$(CppWinRTVersion)" PrivateAssets="all" />
+    <PackageReference Include="$(WinUIPackageName)" Version="$(WinUIPackageVersion)" Condition="'$(OverrideWinUIPackage)'!='true'" />
+  </ItemGroup>
+  <Target Name="ValidateRnwNewArch" BeforeTargets="PrepareForBuild">
+    <Error Text="RnwNewArch must be true to use this project" Condition="'$(RnwNewArch)' != 'true'" />
+    <Error Text="UseWinUI3 must be true to use this project" Condition="'$(UseWinUI3)' != 'true'" />
+    <Error Text="UseFabric must be true to use this project" Condition="'$(UseFabric)' != 'true'" />
+    <!--
+    <Error Text="UseExperimentalWinUI3 must be true to use this project" Condition="'$(UseExperimentalWinUI3)' != 'true'" />
+    -->
+  </Target>
+  <Import Project="$(VCTargetsPath)\Microsoft.Cpp.targets" />
+</Project>
\ No newline at end of file
diff --git a/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj.filters b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj.filters
new file mode 100644
index 00000000000..24eec322ed6
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/Microsoft.ReactNative.Xaml.vcxproj.filters
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="15.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <ItemGroup>
+    <Filter Include="Resources">
+      <UniqueIdentifier>accd3aa8-1ba0-4223-9bbe-0c431709210b</UniqueIdentifier>
+      <Extensions>rc;ico;cur;bmp;dlg;rc2;rct;bin;rgs;gif;jpg;jpeg;jpe;resx;tga;tiff;tif;png;wav;mfcribbon-ms</Extensions>
+    </Filter>
+    <Filter Include="Generated Files">
+      <UniqueIdentifier>{926ab91d-31b4-48c3-b9a4-e681349f27f0}</UniqueIdentifier>
+    </Filter>
+  </ItemGroup>
+  <ItemGroup>
+    <ClCompile Include="pch.cpp" />
+    <ClCompile Include="Class.cpp" />
+    <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
+  </ItemGroup>
+  <ItemGroup>
+    <ClInclude Include="pch.h" />
+  </ItemGroup>
+  <ItemGroup>
+    <Midl Include="Class.idl" />
+  </ItemGroup>
+  <ItemGroup>
+    <None Include="Microsoft.ReactNative.Xaml.def" />
+    <None Include="packages.config" />
+    <None Include="packages.lock.json" />
+  </ItemGroup>
+  <ItemGroup>
+    <Text Include="readme.txt" />
+  </ItemGroup>
+</Project>
\ No newline at end of file
diff --git a/vnext/Microsoft.ReactNative.Xaml/PropertySheet.props b/vnext/Microsoft.ReactNative.Xaml/PropertySheet.props
new file mode 100644
index 00000000000..5b718b12519
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/PropertySheet.props
@@ -0,0 +1,17 @@
+<?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 troubleshoot CppWinRT build issues, set CppWinRTVerbosity to 'high'
+    For complete documentation on CppWinRT project customization, please see:
+    https://github.com/Microsoft/xlang/tree/master/src/package/cppwinrt/nuget -->
+    <CppWinRTVerbosity>normal</CppWinRTVerbosity>
+  </PropertyGroup>
+  <PropertyGroup />
+  <ItemDefinitionGroup />
+  <ItemGroup>
+    <BuildMacro Include="CppWinRTVerbosity">
+      <Value>$(CppWinRTVerbosity)</Value>
+    </BuildMacro>
+  </ItemGroup>
+</Project>
\ No newline at end of file
diff --git a/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.cpp b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.cpp
new file mode 100644
index 00000000000..8d9a44337f5
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.cpp
@@ -0,0 +1,17 @@
+#include "pch.h"
+#include "ReactPackageProvider.h"
+#include "ReactPackageProvider.g.cpp"
+#include "ModuleRegistration.h"
+
+#include "XamlHost.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    void ReactPackageProvider::CreatePackage(winrt::Microsoft::ReactNative::IReactPackageBuilder const& packageBuilder)
+    {
+        AddAttributedModules(packageBuilder, true);
+
+        RegisterXamlHostComponentView(packageBuilder);
+        RegisterXamlControl(packageBuilder);
+    }
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.h b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.h
new file mode 100644
index 00000000000..f547c58a1e3
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.h
@@ -0,0 +1,18 @@
+#pragma once
+#include "ReactPackageProvider.g.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    struct ReactPackageProvider : ReactPackageProviderT<ReactPackageProvider>
+    {
+        ReactPackageProvider() = default;
+
+        void CreatePackage(winrt::Microsoft::ReactNative::IReactPackageBuilder const& packageBuilder);
+    };
+}
+namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation
+{
+    struct ReactPackageProvider : ReactPackageProviderT<ReactPackageProvider, implementation::ReactPackageProvider>
+    {
+    };
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.idl b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.idl
new file mode 100644
index 00000000000..f8f7acbe260
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/ReactPackageProvider.idl
@@ -0,0 +1,9 @@
+namespace Microsoft.ReactNative.Xaml
+{
+  [webhosthidden]
+  [default_interface]
+  runtimeclass ReactPackageProvider : Microsoft.ReactNative.IReactPackageProvider
+  {
+    ReactPackageProvider();
+  };
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlApplication.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlApplication.cpp
new file mode 100644
index 00000000000..58a36407238
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlApplication.cpp
@@ -0,0 +1,56 @@
+#include "pch.h"
+
+#include "XamlApplication.h"
+
+#include "XamlApplication.g.cpp"
+
+#include "winrt/Microsoft.UI.Xaml.XamlTypeInfo.h"
+
+
+
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation {
+
+using namespace ::winrt::Microsoft::UI::Xaml;
+using namespace ::winrt::Microsoft::UI::Xaml::Markup;
+using namespace ::winrt::Windows::UI::Xaml::Interop;
+
+XamlApplication::XamlApplication() {
+  s_current = *this;
+
+  // TODO: It's probably not a good idea to only load the controls pri file, there are other ones too.
+  auto resourceManager = winrt::Microsoft::Windows::ApplicationModel::Resources::ResourceManager(L"Microsoft.UI.Xaml.Controls.pri");
+
+  this->ResourceManagerRequested([resourceManager](auto&&, ResourceManagerRequestedEventArgs args) {
+      args.CustomResourceManager(resourceManager);
+      });
+  winrt::Microsoft::UI::Xaml::Hosting::WindowsXamlManager::InitializeForCurrentThread();
+
+  auto winUIResources = winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources();
+  Resources().MergedDictionaries().Append(winUIResources);
+}
+
+XamlApplication::~XamlApplication() {
+  s_current = nullptr;
+}
+
+IXamlType XamlApplication::GetXamlType(TypeName const &type) {
+  return AppProvider()->GetXamlType(type);
+}
+
+IXamlType XamlApplication::GetXamlType(::winrt::hstring const &fullName) {
+  return AppProvider()->GetXamlType(fullName);
+}
+
+::winrt::com_array<::winrt::Microsoft::UI::Xaml::Markup::XmlnsDefinition> XamlApplication::GetXmlnsDefinitions() {
+  return AppProvider()->GetXmlnsDefinitions();
+}
+
+void XamlApplication::AddMetadataProvider(
+    winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider const &otherProvider) {
+  AppProvider()->AddProvider(otherProvider);
+}
+
+winrt::Microsoft::ReactNative::Xaml::XamlApplication XamlApplication::s_current{nullptr};
+
+} // namespace winrt::Microsoft::ReactNative::Xaml::implementation
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlApplication.h b/vnext/Microsoft.ReactNative.Xaml/XamlApplication.h
new file mode 100644
index 00000000000..29f95102de1
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlApplication.h
@@ -0,0 +1,53 @@
+#pragma once
+#include "XamlApplication.g.h"
+
+#include "winrt/Microsoft.UI.Xaml.h"
+#include "winrt/Microsoft.UI.Xaml.Hosting.h"
+#include "winrt/Microsoft.UI.Xaml.Markup.h"
+#include "winrt/Microsoft.UI.Xaml.Interop.h"
+
+#include "winrt/Windows.UI.Xaml.Interop.h"
+
+#include "XamlTypeInfo.xaml.g.h"
+#include "XamlMetaDataProvider.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation {
+struct XamlApplication : XamlApplicationT<XamlApplication> {
+  using IXamlType = ::winrt::Microsoft::UI::Xaml::Markup::IXamlType;
+
+  XamlApplication();
+  ~XamlApplication();
+
+  static void EnsureCreated() {
+    if (Current() == nullptr) {
+      // Create this type
+      winrt::make<winrt::Microsoft::ReactNative::Xaml::implementation::XamlApplication>();
+    }
+  }
+
+  static winrt::Microsoft::ReactNative::Xaml::XamlApplication Current() {
+    return s_current;
+  }
+
+  IXamlType GetXamlType(::winrt::Windows::UI::Xaml::Interop::TypeName const &type);
+
+  IXamlType GetXamlType(::winrt::hstring const &fullName);
+
+  ::winrt::com_array<::winrt::Microsoft::UI::Xaml::Markup::XmlnsDefinition> GetXmlnsDefinitions();
+
+  void AddMetadataProvider(winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider const &otherProvider);
+
+ private:
+  static winrt::Microsoft::ReactNative::Xaml::XamlApplication s_current;
+  winrt::com_ptr<XamlMetaDataProvider> _appProvider;
+  winrt::com_ptr<XamlMetaDataProvider> AppProvider() {
+    if (!_appProvider) {
+      _appProvider = winrt::make_self<XamlMetaDataProvider>();
+    }
+    return _appProvider;
+  }
+};
+} // namespace winrt::Microsoft::ReactNative::Xaml::implementation
+namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation {
+struct XamlApplication : XamlApplicationT<XamlApplication, implementation::XamlApplication> {};
+} // namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlHost.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlHost.cpp
new file mode 100644
index 00000000000..b94a01c027b
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlHost.cpp
@@ -0,0 +1,76 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+#include "pch.h"
+
+#include "FabricXamlControl.h"
+#include "XamlApplication.h"
+#include "XamlHost.h"
+
+#if defined(RNW_NEW_ARCH)
+
+#include "..\codegen\react\components\rnwcore\XamlHost.g.h"
+//#include "codegen/react/components/Microsoft::ReactNative::Xaml/XamlHost.g.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml {
+
+// This is a "toy" implementation of Xaml's XamlHost, just for bringup and testing.
+// When UseExperimentalWinUI3 and UseNewArchitecture are both true, it will host a
+// XamlHost control in a XamlIsland.  But we only expose a few APIs right now.
+// Later, we'll expose this through react-native-xaml.
+
+struct XamlHostComponentView : public winrt::implements<XamlHostComponentView, winrt::IInspectable>,
+    ::Microsoft::ReactNativeSpecs::BaseXamlHost<XamlHostComponentView> {
+  void InitializeContentIsland(
+      const winrt::Microsoft::ReactNative::Composition::ContentIslandComponentView &islandView) noexcept {
+    winrt::Microsoft::ReactNative::Xaml::implementation::XamlApplication::EnsureCreated();
+
+    m_xamlIsland = winrt::Microsoft::UI::Xaml::XamlIsland{};
+
+    auto grid = winrt::Microsoft::UI::Xaml::Controls::Grid{};
+    auto button = winrt::Microsoft::UI::Xaml::Controls::Button{};
+    button.Content(winrt::box_value(L"(This is placeholder content for the XamlHost.)"));
+    grid.Children().Append(button);
+    m_xamlIsland.Content(grid);
+
+    // m_xamlIsland.Content(m_XamlHost);
+    islandView.Connect(m_xamlIsland.ContentIsland());
+  }
+
+  void MountChildComponentView(
+      const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+      const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept override {
+    // Add the xaml child to the m_xamlIsland here.
+    auto xamlControl = args.Child().UserData().as<XamlControlComponentView>();
+    if (xamlControl) {
+      auto xamlElement = xamlControl->GetXamlElement();
+      m_xamlIsland.Content(xamlElement);
+    }
+  }
+
+  void UnmountChildComponentView(
+    const winrt::Microsoft::ReactNative::ComponentView & /*view*/,
+    const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept override {
+    m_xamlIsland.Content(nullptr);
+}
+
+ private:
+  winrt::Microsoft::UI::Xaml::XamlIsland m_xamlIsland{nullptr};
+};
+
+} // namespace winrt::Microsoft::ReactNative::Xaml
+
+void RegisterXamlHostComponentView(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) {
+  ::Microsoft::ReactNativeSpecs::RegisterXamlHostNativeComponent<
+      winrt::Microsoft::ReactNative::Xaml::XamlHostComponentView>(
+      packageBuilder,
+      [](const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &builder) {
+        builder.SetContentIslandComponentViewInitializer(
+            [](const winrt::Microsoft::ReactNative::Composition::ContentIslandComponentView &islandView) noexcept {
+              auto userData = winrt::make_self<winrt::Microsoft::ReactNative::Xaml::XamlHostComponentView>();
+              userData->InitializeContentIsland(islandView);
+              islandView.UserData(*userData);
+            });
+      });
+}
+
+#endif // defined(RNW_NEW_ARCH) && defined(USE_EXPERIMENTAL_WINUI3)
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlHost.h b/vnext/Microsoft.ReactNative.Xaml/XamlHost.h
new file mode 100644
index 00000000000..50717a3f53e
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlHost.h
@@ -0,0 +1,9 @@
+#pragma once
+
+#if defined(RNW_NEW_ARCH)
+
+void RegisterXamlHostComponentView(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder);
+
+void RegisterXamlControl(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder);
+
+#endif // defined(RNW_NEW_ARCH) && defined(USE_EXPERIMENTAL_WINUI3)
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.cpp
new file mode 100644
index 00000000000..16847be721e
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.cpp
@@ -0,0 +1,4 @@
+// This file is generated by the build to support Xaml apps
+#include "pch.h"
+#include "XamlMetaDataProvider.h"
+#include "XamlMetaDataProvider.g.cpp"
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.cpp
new file mode 100644
index 00000000000..c3b6f25bc4d
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.cpp
@@ -0,0 +1,13 @@
+// WARNING: Please don't edit this file. It was generated by C++/WinRT v2.0.240405.15
+
+void* winrt_make_Microsoft_ReactNative_Xaml_XamlMetaDataProvider()
+{
+    return winrt::detach_abi(winrt::make<winrt::Microsoft::ReactNative::Xaml::factory_implementation::XamlMetaDataProvider>());
+}
+WINRT_EXPORT namespace winrt::Microsoft::ReactNative::Xaml
+{
+    XamlMetaDataProvider::XamlMetaDataProvider() :
+        XamlMetaDataProvider(make<Microsoft::ReactNative::Xaml::implementation::XamlMetaDataProvider>())
+    {
+    }
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.h b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.h
new file mode 100644
index 00000000000..aff19e39bb0
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.g.h
@@ -0,0 +1,52 @@
+// WARNING: Please don't edit this file. It was generated by C++/WinRT v2.0.240405.15
+
+#pragma once
+#include "winrt/Microsoft.ReactNative.Xaml.h"
+#include "winrt/Microsoft.UI.Xaml.Markup.h"
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    template <typename D, typename... I>
+    struct WINRT_IMPL_EMPTY_BASES XamlMetaDataProvider_base : implements<D, Microsoft::ReactNative::Xaml::XamlMetaDataProvider, I...>
+    {
+        using base_type = XamlMetaDataProvider_base;
+        using class_type = Microsoft::ReactNative::Xaml::XamlMetaDataProvider;
+        using implements_type = typename XamlMetaDataProvider_base::implements_type;
+        using implements_type::implements_type;
+        
+        hstring GetRuntimeClassName() const
+        {
+            return L"Microsoft.ReactNative.Xaml.XamlMetaDataProvider";
+        }
+    };
+}
+namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation
+{
+    template <typename D, typename T, typename... I>
+    struct WINRT_IMPL_EMPTY_BASES XamlMetaDataProviderT : implements<D, winrt::Windows::Foundation::IActivationFactory, I...>
+    {
+        using instance_type = Microsoft::ReactNative::Xaml::XamlMetaDataProvider;
+
+        hstring GetRuntimeClassName() const
+        {
+            return L"Microsoft.ReactNative.Xaml.XamlMetaDataProvider";
+        }
+        auto ActivateInstance() const
+        {
+            return make<T>();
+        }
+    };
+}
+
+#if defined(WINRT_FORCE_INCLUDE_XAMLMETADATAPROVIDER_XAML_G_H) || __has_include("XamlMetaDataProvider.xaml.g.h")
+
+#include "XamlMetaDataProvider.xaml.g.h"
+
+#else
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    template <typename D, typename... I>
+    using XamlMetaDataProviderT = XamlMetaDataProvider_base<D, I...>;
+}
+
+#endif
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.h b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.h
new file mode 100644
index 00000000000..829f1d4f73c
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.h
@@ -0,0 +1,58 @@
+//------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//
+//     Changes to this file may cause incorrect behavior and will be lost if
+//     the code is regenerated.
+// </auto-generated>
+//------------------------------------------------------------------------------
+#pragma once
+
+#include <unknwn.h>
+#include <functional>
+#include <map>
+#include <vector>
+
+// Undefine GetCurrentTime macro to prevent
+// conflict with Storyboard::GetCurrentTime
+#undef GetCurrentTime
+
+#include "XamlMetaDataProvider.g.h"
+#include "XamlTypeInfo.xaml.g.h"
+
+/*
+    If the file above was not generated, you may be missing a declaration
+    for the XamlMetaDataProvider runtimeclass in your IDL.
+
+    namespace Microsoft.ReactNative.Xaml
+    {
+        runtimeclass XamlMetaDataProvider : Microsoft.UI.Xaml.Markup.IXamlMetadataProvider
+        {
+            XamlMetaDataProvider();
+        };
+    }
+*/
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation {
+using IXamlMember = ::winrt::Microsoft::UI::Xaml::Markup::IXamlMember;
+using IXamlType = ::winrt::Microsoft::UI::Xaml::Markup::IXamlType;
+
+struct XamlMetaDataProvider
+    : public ::winrt::Microsoft::ReactNative::Xaml::implementation::XamlMetaDataProvider_base<XamlMetaDataProvider> {
+  IXamlType GetXamlType(::winrt::Windows::UI::Xaml::Interop::TypeName const &type);
+  IXamlType GetXamlType(::winrt::hstring const &fullName);
+  ::winrt::com_array<::winrt::Microsoft::UI::Xaml::Markup::XmlnsDefinition> GetXmlnsDefinitions();
+
+  void AddProvider(::winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider const &otherProvider) {
+    Provider()->AddProvider(otherProvider);
+  }
+
+ private:
+  std::shared_ptr<XamlTypeInfoProvider> _provider;
+  std::shared_ptr<XamlTypeInfoProvider> Provider();
+};
+} // namespace winrt::Microsoft::ReactNative::Xaml::implementation
+
+namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation {
+struct XamlMetaDataProvider : XamlMetaDataProviderT<XamlMetaDataProvider, implementation::XamlMetaDataProvider> {};
+} // namespace winrt::Microsoft::ReactNative::Xaml::factory_implementation
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.idl b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.idl
new file mode 100644
index 00000000000..4a1fb1a8315
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlMetaDataProvider.idl
@@ -0,0 +1,9 @@
+// This file is generated by the build to support Xaml apps
+
+namespace Microsoft.ReactNative.Xaml
+{
+    runtimeclass XamlMetaDataProvider : [default] Microsoft.UI.Xaml.Markup.IXamlMetadataProvider
+    {
+        XamlMetaDataProvider();
+    }
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.Impl.g.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.Impl.g.cpp
new file mode 100644
index 00000000000..d6c62a09686
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.Impl.g.cpp
@@ -0,0 +1,640 @@
+//------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//
+//     Changes to this file may cause incorrect behavior and will be lost if
+//     the code is regenerated.
+// </auto-generated>
+//------------------------------------------------------------------------------
+#include "pch.h"
+
+#include <memory>
+#include <string>
+#include <regex>
+#include <unknwn.h>
+#include <mutex>
+
+// Undefine GetCurrentTime macro to prevent
+// conflict with Storyboard::GetCurrentTime
+#undef GetCurrentTime
+
+#include "winrt/windows.foundation.h"
+#include "winrt/windows.ui.xaml.interop.h"
+#include "winrt/microsoft.ui.xaml.markup.h"
+#include "XamlTypeInfo.xaml.g.h"
+#include "XamlMetaDataProvider.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    using namespace ::winrt::Microsoft::UI::Xaml::Markup;
+    using namespace ::winrt::Windows::UI::Xaml::Interop;
+
+    // XamlMetaDataProvider
+
+
+    IXamlType XamlMetaDataProvider::GetXamlType(TypeName const& type)
+    {
+        return Provider()->GetXamlTypeByType(type);
+    }
+
+    IXamlType XamlMetaDataProvider::GetXamlType(::winrt::hstring const& fullName)
+    {
+        return Provider()->GetXamlTypeByName(fullName);
+    }
+
+    ::winrt::com_array<XmlnsDefinition> XamlMetaDataProvider::GetXmlnsDefinitions()
+    {
+        return ::winrt::com_array<XmlnsDefinition>(0);
+    }
+
+    std::shared_ptr<XamlTypeInfoProvider> XamlMetaDataProvider::Provider()
+    {
+        if (!_provider)
+        {
+            _provider = std::make_shared<XamlTypeInfoProvider>();
+        }
+        return _provider;
+    }
+
+    // XamlTypeInfoProvider
+
+    IXamlType XamlTypeInfoProvider::GetXamlTypeByType(TypeName const& type)
+    {
+        auto xamlType = GetXamlTypeByName(type.Name);
+        auto userXamlType = xamlType ? xamlType.try_as<IXamlUserType>() : nullptr;
+        if (!xamlType || (userXamlType && userXamlType->IsReturnTypeStub() && !userXamlType->IsLocalType()))
+        {
+            auto libXamlType = CheckOtherMetadataProvidersForType(type);
+            if (libXamlType)
+            {
+                if (libXamlType.IsConstructible() || !xamlType)
+                {
+                    xamlType = libXamlType;
+                }
+            }
+        }
+        return xamlType;
+    }
+
+    IXamlType XamlTypeInfoProvider::GetXamlTypeByName(::winrt::hstring const& typeName)
+    {
+        if (typeName.empty())
+        {
+            return nullptr;
+        }
+
+        std::lock_guard<std::recursive_mutex> lock(_xamlTypesCriticalSection);
+        auto val = _xamlTypes.find(typeName.data());
+        if (val != _xamlTypes.end())
+        {
+            auto xamlType = (val->second).get();
+            if (xamlType)
+            {
+                return xamlType;
+            }
+        }
+
+        auto xamlType = CreateXamlType(typeName);
+        auto userXamlType = xamlType ? xamlType.try_as<IXamlUserType>() : nullptr;
+        if (!xamlType || (userXamlType && userXamlType->IsReturnTypeStub() && !userXamlType->IsLocalType()))
+        {
+            IXamlType libXamlType = CheckOtherMetadataProvidersForName(typeName);
+            if (libXamlType)
+            {
+                if (libXamlType.IsConstructible() || !xamlType)
+                {
+                    xamlType = libXamlType;
+                }
+            }
+        }
+
+        if (xamlType)
+        {
+            _xamlTypes.insert_or_assign(xamlType.FullName().data(), xamlType);
+        }
+        return xamlType;
+    }
+
+    IXamlMember XamlTypeInfoProvider::GetMemberByLongName(::winrt::hstring const& longMemberName)
+    {
+        if (longMemberName.empty())
+        {
+            return nullptr;
+        }
+
+        std::lock_guard<std::recursive_mutex> lock(_xamlMembersCriticalSection);
+        auto val = _xamlMembers.find(longMemberName.data());
+        if (val != _xamlMembers.end())
+        {
+            return val->second;
+        }
+
+        auto xamlMember = CreateXamlMember(longMemberName);
+
+        if (xamlMember)
+        {
+            _xamlMembers.insert_or_assign(longMemberName.data(), xamlMember);
+        }
+        return xamlMember;
+    }
+
+    IXamlType XamlTypeInfoProvider::CheckOtherMetadataProvidersForName(::winrt::hstring const& typeName)
+    {
+        IXamlType foundXamlType;
+        std::lock_guard<std::recursive_mutex> lock(_xamlTypesCriticalSection);
+        for (auto const& provider : OtherProviders())
+        {
+            auto xamlType = provider.GetXamlType(typeName);
+            if (xamlType)
+            {
+                if (xamlType.IsConstructible())
+                {
+                    return xamlType;
+                }
+                foundXamlType = xamlType;
+            }
+        }
+        return foundXamlType;
+    }
+
+    IXamlType XamlTypeInfoProvider::CheckOtherMetadataProvidersForType(TypeName const& t)
+    {
+        IXamlType foundXamlType;
+        std::lock_guard<std::recursive_mutex> lock(_xamlTypesCriticalSection);
+        for (auto const& provider : OtherProviders())
+        {
+            auto xamlType = provider.GetXamlType(t);
+            if (xamlType)
+            {
+                if (xamlType.IsConstructible())
+                {
+                    return xamlType;
+                }
+                foundXamlType = xamlType;
+            }
+        }
+        return foundXamlType;
+    }
+
+    // XamlSystemBaseType
+
+    XamlSystemBaseType::XamlSystemBaseType(::winrt::hstring const& name)
+        : _fullName(name)
+    {
+    }
+
+    IXamlType XamlSystemBaseType::BaseType() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    IXamlMember XamlSystemBaseType::ContentProperty() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    ::winrt::hstring XamlSystemBaseType::FullName() const
+    {
+        return _fullName;
+    }
+
+    ::winrt::hstring XamlSystemBaseType::Name() const
+    {
+        const wchar_t* separator = wcsrchr(_fullName.c_str(), '.');
+        if (!separator)
+        {
+            return _fullName;
+        }
+        return ::winrt::hstring { separator };
+    }
+
+    bool XamlSystemBaseType::IsArray() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsCollection() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsConstructible() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsDictionary() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsMarkupExtension() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsEnum() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsSystemType() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    bool XamlSystemBaseType::IsBindable() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    IXamlType XamlSystemBaseType::ItemType() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    IXamlType XamlSystemBaseType::KeyType() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    IXamlType XamlSystemBaseType::BoxedType() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    TypeName XamlSystemBaseType::UnderlyingType() const
+    {
+        return { _fullName, TypeKind::Primitive };
+    }
+
+    ::winrt::Windows::Foundation::IInspectable XamlSystemBaseType::ActivateInstance() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    IXamlMember XamlSystemBaseType::GetMember(::winrt::hstring const& ) const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    void XamlSystemBaseType::AddToVector(::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&) const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    void XamlSystemBaseType::AddToMap(::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&) const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    void XamlSystemBaseType::RunInitializer() const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    ::winrt::Windows::Foundation::IInspectable XamlSystemBaseType::CreateFromString(::winrt::hstring const& ) const
+    {
+        throw ::winrt::hresult_not_implemented {};
+    }
+
+    // XamlUserType
+
+    XamlUserType::XamlUserType(
+        std::shared_ptr<XamlTypeInfoProvider> const& provider, 
+        ::winrt::hstring const& fullName, 
+        IXamlType baseType)
+            : _provider(provider)
+            , _fullName(fullName)
+            , _baseType(baseType)
+    {
+    }
+
+    ::winrt::hstring XamlUserType::GetRuntimeClassName() const
+    {
+        static ::winrt::hstring name{ ::winrt::name_of<::winrt::Microsoft::UI::Xaml::Markup::IXamlType>() };
+        return name;
+    }
+
+    ::winrt::hstring XamlUserType::FullName() const
+    {
+        return _fullName;
+    }
+
+    ::winrt::hstring XamlUserType::Name() const
+    {
+        const wchar_t* separator = wcsrchr(_fullName.c_str(), '.');
+        if (!separator)
+        {
+            return _fullName;
+        }
+        return separator;
+    }
+
+    TypeName XamlUserType::UnderlyingType() const
+    {
+        return { _fullName, _kindOfType };
+    }
+
+    bool XamlUserType::IsSystemType() const
+    {
+        return true;
+    }
+
+    IXamlType XamlUserType::BaseType() const
+    {
+        return _baseType;
+    }
+
+    bool XamlUserType::IsArray() const
+    {
+        return _isArray;
+    }
+
+    void XamlUserType::IsArray(bool value)
+    {
+        _isArray = value;
+    }
+
+    bool XamlUserType::IsCollection() const
+    {
+        return _collectionAdd;
+    }
+
+    bool XamlUserType::IsConstructible() const
+    {
+        return _activator;
+    }
+
+    bool XamlUserType::IsDictionary() const
+    {
+        return _dictionaryAdd;
+    }
+
+    bool XamlUserType::IsMarkupExtension() const
+    {
+        return _isMarkupExtension;
+    }
+
+    void XamlUserType::IsMarkupExtension(bool value)
+    {
+        _isMarkupExtension = value;
+    }
+
+    bool XamlUserType::IsEnum() const
+    {
+        return _isEnum;
+    }
+
+    void XamlUserType::IsEnum(bool value)
+    {
+        _isEnum = value;
+    }
+
+    bool XamlUserType::IsBindable() const
+    {
+        return _isBindable;
+    }
+
+    void XamlUserType::IsBindable(bool value)
+    {
+        _isBindable = value;
+    }
+
+    bool XamlUserType::IsReturnTypeStub() const
+    {
+        return _isReturnTypeStub;
+    }
+
+    void XamlUserType::IsReturnTypeStub(bool value)
+    {
+        _isReturnTypeStub = value;
+    }
+
+    bool XamlUserType::IsLocalType() const
+    {
+        return _isLocalType;
+    }
+
+    void XamlUserType::IsLocalType(bool value)
+    {
+        _isLocalType = value;
+    }
+
+    IXamlMember XamlUserType::ContentProperty() const
+    {
+        return _provider->GetMemberByLongName(_contentPropertyName);
+    }
+
+    IXamlType XamlUserType::ItemType() const
+    {
+        return _provider->GetXamlTypeByName(_itemTypeName);
+    }
+
+    IXamlType XamlUserType::KeyType() const
+    {
+        return _provider->GetXamlTypeByName(_keyTypeName);
+    }
+
+    IXamlType XamlUserType::BoxedType() const
+    {
+        return _boxedType;
+    }
+
+
+    IXamlMember XamlUserType::GetMember(::winrt::hstring const& name) const
+    {
+        auto val = _memberNames.find(name.data());
+        if (val != _memberNames.end())
+        {
+            return _provider->GetMemberByLongName(val->second);
+        }
+        return nullptr;
+    }
+
+    ::winrt::Windows::Foundation::IInspectable XamlUserType::ActivateInstance() const
+    {
+        return _activator();
+    }
+
+    void XamlUserType::AddToMap(::winrt::Windows::Foundation::IInspectable const& instance, ::winrt::Windows::Foundation::IInspectable const& key, ::winrt::Windows::Foundation::IInspectable const& item) const
+    {
+        _dictionaryAdd(instance, key, item);
+    }
+
+    void XamlUserType::AddToVector(::winrt::Windows::Foundation::IInspectable const& instance, ::winrt::Windows::Foundation::IInspectable const& item) const
+    {
+        _collectionAdd(instance, item);
+    }
+
+    void XamlUserType::RunInitializer() const
+    {
+        // The C++ runtime will have already run all the Static Initializers at start up.
+    }
+
+    ::winrt::Windows::Foundation::IInspectable XamlUserType::CreateFromString(::winrt::hstring const& input) const
+    {
+        // For boxed types, run the boxed type's CreateFromString method and boxing
+        if (BoxedType() != nullptr)
+        {
+            return BoxedType().CreateFromString(input);
+        }
+
+        if (_createFromStringMethod)
+        {
+            return (*_createFromStringMethod)(input);
+        }
+        else
+        {
+            return _fromStringConverter(*this, input);
+        }
+    }
+
+    void XamlUserType::ContentPropertyName(::winrt::hstring const& value) 
+    { 
+        _contentPropertyName = value; 
+    }
+
+    void XamlUserType::ItemTypeName(::winrt::hstring const& value)
+    { 
+        _itemTypeName = value; 
+    }
+
+    void XamlUserType::KeyTypeName(::winrt::hstring const& value)
+    {
+        _keyTypeName = value; 
+    }
+    void XamlUserType::SetBoxedType(IXamlType boxedType)
+    {
+        _boxedType = boxedType;
+    }
+
+
+    void XamlUserType::AddMemberName(::winrt::hstring const& shortName)
+    {
+        std::wstring longName = FullName().data();
+        longName += L".";
+        longName += shortName;
+            _memberNames.insert_or_assign(shortName.data(), longName);
+    }
+
+    void XamlUserType::AddEnumValue(::winrt::hstring const& name, ::winrt::Windows::Foundation::IInspectable value)
+    {
+        _enumValues.insert_or_assign(name.data(), value);
+    }
+
+    uint32_t XamlUserType::CreateEnumUIntFromString(::winrt::hstring const& input) const
+    {
+        bool found = false;
+
+        const std::wregex regularExpression(L"^\\s+|\\s*,\\s*|\\s+$");
+        uint32_t val = 0;
+
+        for (std::wcregex_token_iterator it{ input.begin(), input.end(), regularExpression, -1 }, end; it != end; ++it)
+        {
+            std::wcsub_match const& subMatch = *it;
+            if (subMatch.length() == 0)
+            {
+                continue;
+            }
+
+            auto lookup{ subMatch.str() };
+
+            try
+            {
+                auto entry = _enumValues.find(lookup);
+                if (entry != _enumValues.end())
+                {
+                    val = winrt::unbox_value<int>(entry->second);
+                }
+                else
+                {
+                    val |= std::stoi(subMatch);
+                }
+                found = true;
+            }
+            catch (std::invalid_argument const&)
+            {
+                found = false;
+                break;
+            }
+        }
+
+        if (found)
+        {
+            return val;
+        }
+        throw ::winrt::hresult_invalid_argument {};
+    }
+
+ 
+    XamlMember::XamlMember(
+        std::shared_ptr<XamlTypeInfoProvider> const& provider, 
+        ::winrt::hstring const& name, 
+        ::winrt::hstring const& typeName)
+            : _provider(provider)
+            , _name(name)
+            , _typeName(typeName)
+    {
+    }
+
+    void XamlMember::TargetTypeName(::winrt::hstring const& value)
+    { 
+        _targetTypeName = value; 
+    }
+
+    bool XamlMember::IsAttachable() const
+    {
+        return _isAttachable;
+    }
+
+    void XamlMember::IsAttachable(bool value)
+    {
+        _isAttachable = value;
+    }
+
+    bool XamlMember::IsDependencyProperty() const
+    {
+        return _isDependencyProperty;
+    }
+
+    void XamlMember::IsDependencyProperty(bool value)
+    {
+        _isDependencyProperty = value;
+    }
+
+    bool XamlMember::IsReadOnly() const
+    {
+        return _isReadOnly;
+    }
+
+    void XamlMember::IsReadOnly(bool value)
+    {
+        _isReadOnly = value;
+    }
+
+    ::winrt::hstring XamlMember::Name() const
+    {
+        return _name;
+    }
+
+    IXamlType XamlMember::Type() const
+    {
+        return _provider->GetXamlTypeByName(_typeName);
+    }
+
+    IXamlType XamlMember::TargetType() const
+    {
+        return _provider->GetXamlTypeByName(_targetTypeName);
+    }
+
+    ::winrt::Windows::Foundation::IInspectable XamlMember::GetValue(::winrt::Windows::Foundation::IInspectable const& instance) const
+    {
+        return _getter(instance);
+    }
+
+    void XamlMember::SetValue(::winrt::Windows::Foundation::IInspectable const& instance, ::winrt::Windows::Foundation::IInspectable const& value)
+    {
+        _setter(instance, value);
+    }
+}
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.g.cpp b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.g.cpp
new file mode 100644
index 00000000000..57891ebe717
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.g.cpp
@@ -0,0 +1,538 @@
+//------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//
+//     Changes to this file may cause incorrect behavior and will be lost if
+//     the code is regenerated.
+// </auto-generated>
+//------------------------------------------------------------------------------
+#include "pch.h"
+#include <memory>
+#include <unknwn.h>
+
+// Undefine GetCurrentTime macro to prevent
+// conflict with Storyboard::GetCurrentTime
+#undef GetCurrentTime
+
+#if __has_include(<winrt/Microsoft.UI.Xaml.Controls.h>)
+#include <winrt/Microsoft.UI.Xaml.Controls.h>
+#endif
+#if __has_include(<winrt/Windows.Foundation.Collections.h>)
+#include <winrt/Windows.Foundation.Collections.h>
+#endif
+
+#include "XamlTypeInfo.xaml.g.h"
+
+//#include "App.xaml.h"
+//#include "XamlBindingInfo.xaml.g.hpp"
+//#include "App.xaml.g.hpp"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+using IXamlMember = ::winrt::Microsoft::UI::Xaml::Markup::IXamlMember;
+using IXamlType = ::winrt::Microsoft::UI::Xaml::Markup::IXamlType;
+using TypeKind = ::winrt::Windows::UI::Xaml::Interop::TypeKind;
+
+    namespace XamlTypeInfo_staticasserts
+    {
+        template<typename, typename = void>
+        constexpr bool is_type_complete_v = false;
+
+        template<typename T>
+        constexpr bool is_type_complete_v<T, std::void_t<decltype(sizeof(T))>> = true;
+
+        static_assert( is_type_complete_v<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>, "Please #include the implementation header for '::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode' in your precompiled header 'pch.h'." );
+        static_assert( is_type_complete_v<::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources>, "Please #include the implementation header for '::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources' in your precompiled header 'pch.h'." );
+        static_assert( is_type_complete_v<::winrt::Windows::Foundation::Collections::IVector<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>>, "Please #include the implementation header for '::winrt::Windows::Foundation::Collections::IVector<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>' in your precompiled header 'pch.h'." );
+
+    }
+
+template <typename T>
+::winrt::Windows::Foundation::IInspectable ActivateType()
+{
+    return T();
+}
+
+template <typename T>
+::winrt::Windows::Foundation::IInspectable ActivateLocalType()
+{
+    return ::winrt::make<T>();
+}
+
+template<typename TInstance, typename TItem>
+void CollectionAdd(
+    ::winrt::Windows::Foundation::IInspectable const& instance, 
+    ::winrt::Windows::Foundation::IInspectable const& item)
+{
+    instance.as<TInstance>().Append(::winrt::unbox_value<TItem>(item));
+}
+
+template<typename TInstance, typename TKey, typename TItem>
+void DictionaryAdd(
+    ::winrt::Windows::Foundation::IInspectable const& instance,
+    ::winrt::Windows::Foundation::IInspectable const& key,
+    ::winrt::Windows::Foundation::IInspectable const& item)
+{
+    instance.as<TInstance>().Insert(::winrt::unbox_value<TKey>(key), ::winrt::unbox_value<TItem>(item));
+}
+
+template<typename T>
+::winrt::Windows::Foundation::IInspectable FromStringConverter(
+    XamlUserType const& userType, 
+    ::winrt::hstring const& input)
+{
+    return ::winrt::box_value(static_cast<T>(userType.CreateEnumUIntFromString(input)));
+}
+
+template<typename TDeclaringType, typename TValue>
+::winrt::Windows::Foundation::IInspectable GetValueTypeMember_UseCompactResources(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value<TValue>(instance.as<TDeclaringType>().UseCompactResources());
+}
+
+template<typename TDeclaringType, typename TValue>
+::winrt::Windows::Foundation::IInspectable GetValueTypeMember_IsExpanded(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value<TValue>(instance.as<TDeclaringType>().IsExpanded());
+}
+
+template<typename TDeclaringType, typename TValue>
+::winrt::Windows::Foundation::IInspectable GetValueTypeMember_HasUnrealizedChildren(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value<TValue>(instance.as<TDeclaringType>().HasUnrealizedChildren());
+}
+
+template<typename TDeclaringType, typename TValue>
+::winrt::Windows::Foundation::IInspectable GetValueTypeMember_Depth(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value<TValue>(instance.as<TDeclaringType>().Depth());
+}
+
+template<typename TDeclaringType, typename TValue>
+::winrt::Windows::Foundation::IInspectable GetValueTypeMember_HasChildren(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value<TValue>(instance.as<TDeclaringType>().HasChildren());
+}
+
+template <typename T>
+::winrt::Windows::Foundation::IInspectable GetReferenceTypeMember_Content(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value(instance.as<T>().Content());
+}
+
+template <typename T>
+::winrt::Windows::Foundation::IInspectable GetReferenceTypeMember_Children(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value(instance.as<T>().Children());
+}
+
+template <typename T>
+::winrt::Windows::Foundation::IInspectable GetReferenceTypeMember_Parent(::winrt::Windows::Foundation::IInspectable const& instance)
+{
+    return ::winrt::box_value(instance.as<T>().Parent());
+}
+
+template<typename TDeclaringType, typename TValue>
+void SetValueTypeMember_UseCompactResources(
+    ::winrt::Windows::Foundation::IInspectable const& instance, 
+    ::winrt::Windows::Foundation::IInspectable const& value)
+{
+    instance.as<TDeclaringType>().UseCompactResources(::winrt::unbox_value<TValue>(value));
+}
+
+template<typename TDeclaringType, typename TValue>
+void SetValueTypeMember_IsExpanded(
+    ::winrt::Windows::Foundation::IInspectable const& instance, 
+    ::winrt::Windows::Foundation::IInspectable const& value)
+{
+    instance.as<TDeclaringType>().IsExpanded(::winrt::unbox_value<TValue>(value));
+}
+
+template<typename TDeclaringType, typename TValue>
+void SetValueTypeMember_HasUnrealizedChildren(
+    ::winrt::Windows::Foundation::IInspectable const& instance, 
+    ::winrt::Windows::Foundation::IInspectable const& value)
+{
+    instance.as<TDeclaringType>().HasUnrealizedChildren(::winrt::unbox_value<TValue>(value));
+}
+
+template<typename TDeclaringType, typename TValue>
+void SetReferenceTypeMember_Content(
+    ::winrt::Windows::Foundation::IInspectable const& instance, 
+    ::winrt::Windows::Foundation::IInspectable const& value)
+{
+    instance.as<TDeclaringType>().Content(value.as<TValue>());
+}
+
+enum TypeInfo_Flags
+{
+    TypeInfo_Flags_None                 = 0x00,
+    TypeInfo_Flags_IsLocalType          = 0x01,
+    TypeInfo_Flags_IsSystemType         = 0x02,
+    TypeInfo_Flags_IsReturnTypeStub     = 0x04,
+    TypeInfo_Flags_IsBindable           = 0x08,
+    TypeInfo_Flags_IsMarkupExtension    = 0x10, 
+};
+
+struct TypeInfo
+{
+    const wchar_t* typeName{nullptr};
+    const wchar_t* contentPropertyName{nullptr};
+    ::winrt::Windows::Foundation::IInspectable (*activator)();
+    void (*collectionAdd)(::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&);
+    void (*dictionaryAdd)(::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&);
+    ::winrt::Windows::Foundation::IInspectable (*fromStringConverter)(XamlUserType const&, ::winrt::hstring const& );
+    int     baseTypeIndex;
+    int     firstMemberIndex;
+    int     firstEnumValueIndex;
+    int     createFromStringIndex;
+    TypeKind kindOfType;
+    unsigned int flags;
+    int boxedTypeIndex;
+};
+
+
+const TypeInfo TypeInfos[] = 
+{
+    //   0
+    L"Int32", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1,
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsSystemType | TypeInfo_Flags_None,
+    -1,
+    //   1
+    L"Object", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1,
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsSystemType | TypeInfo_Flags_None,
+    -1,
+    //   2
+    L"Boolean", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1,
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsSystemType | TypeInfo_Flags_None,
+    -1,
+    //   3
+    L"Microsoft.UI.Xaml.DependencyObject", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1,
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsSystemType | TypeInfo_Flags_None,
+    -1,
+    //   4
+    L"Microsoft.UI.Xaml.ResourceDictionary", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1,
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsSystemType | TypeInfo_Flags_None,
+    -1,
+    //   5
+    L"Microsoft.UI.Xaml.Controls.TreeViewNode", L"",
+    &ActivateType<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>, nullptr, nullptr, nullptr,
+    3, // Microsoft.UI.Xaml.DependencyObject
+    0, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsBindable | TypeInfo_Flags_None,
+    -1,
+    //   6
+    L"Microsoft.UI.Xaml.Controls.XamlControlsResources", L"",
+    &ActivateType<::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources>, nullptr, &DictionaryAdd<::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources, ::winrt::Windows::Foundation::IInspectable, ::winrt::Windows::Foundation::IInspectable>, nullptr,
+    4, // Microsoft.UI.Xaml.ResourceDictionary
+    7, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_None,
+    -1,
+    //   7
+    L"Windows.Foundation.Collections.IVector`1<Microsoft.UI.Xaml.Controls.TreeViewNode>", L"",
+    nullptr, &CollectionAdd<::winrt::Windows::Foundation::Collections::IVector<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>, ::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>, nullptr, nullptr,
+    -1,
+    8, 0, -1, TypeKind::Metadata,
+    TypeInfo_Flags_IsReturnTypeStub | TypeInfo_Flags_None,
+    -1,
+    //  Last type here is for padding
+    L"", L"",
+    nullptr, nullptr, nullptr, nullptr,
+    -1, 
+    8, 0, -1, TypeKind::Custom,
+    TypeInfo_Flags_None,
+};
+
+constexpr uint32_t TypeInfoLookup[] = { 
+      0,   //   0
+      0,   //   1
+      0,   //   2
+      0,   //   3
+      0,   //   4
+      0,   //   5
+      1,   //   6
+      2,   //   7
+      3,   //   8
+      3,   //   9
+      3,   //  10
+      3,   //  11
+      3,   //  12
+      3,   //  13
+      3,   //  14
+      3,   //  15
+      3,   //  16
+      3,   //  17
+      3,   //  18
+      3,   //  19
+      3,   //  20
+      3,   //  21
+      3,   //  22
+      3,   //  23
+      3,   //  24
+      3,   //  25
+      3,   //  26
+      3,   //  27
+      3,   //  28
+      3,   //  29
+      3,   //  30
+      3,   //  31
+      3,   //  32
+      3,   //  33
+      3,   //  34
+      4,   //  35
+      4,   //  36
+      5,   //  37
+      5,   //  38
+      5,   //  39
+      6,   //  40
+      6,   //  41
+      6,   //  42
+      6,   //  43
+      6,   //  44
+      6,   //  45
+      6,   //  46
+      6,   //  47
+      6,   //  48
+      7,   //  49
+      7,   //  50
+      7,   //  51
+      7,   //  52
+      7,   //  53
+      7,   //  54
+      7,   //  55
+      7,   //  56
+      7,   //  57
+      7,   //  58
+      7,   //  59
+      7,   //  60
+      7,   //  61
+      7,   //  62
+      7,   //  63
+      7,   //  64
+      7,   //  65
+      7,   //  66
+      7,   //  67
+      7,   //  68
+      7,   //  69
+      7,   //  70
+      7,   //  71
+      7,   //  72
+      7,   //  73
+      7,   //  74
+      7,   //  75
+      7,   //  76
+      7,   //  77
+      7,   //  78
+      7,   //  79
+      7,   //  80
+      7,   //  81
+      8,   //  82
+};
+
+struct MemberInfo 
+{
+    const wchar_t* shortName{nullptr};
+    ::winrt::Windows::Foundation::IInspectable (*getter)(::winrt::Windows::Foundation::IInspectable const&);
+    void (*setter)(::winrt::Windows::Foundation::IInspectable const&, ::winrt::Windows::Foundation::IInspectable const&);
+    int typeIndex;
+    int targetTypeIndex;
+    bool isReadOnly;
+    bool isDependencyProperty;
+    bool isAttachable;
+};
+
+const MemberInfo MemberInfos[] = 
+{
+    //   0 - Microsoft.UI.Xaml.Controls.TreeViewNode.IsExpanded
+    L"IsExpanded",
+    &GetValueTypeMember_IsExpanded<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, bool>,
+    &SetValueTypeMember_IsExpanded<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, bool>,
+    2, // Boolean
+    -1,
+    false, true,  false,
+    //   1 - Microsoft.UI.Xaml.Controls.TreeViewNode.HasUnrealizedChildren
+    L"HasUnrealizedChildren",
+    &GetValueTypeMember_HasUnrealizedChildren<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, bool>,
+    &SetValueTypeMember_HasUnrealizedChildren<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, bool>,
+    2, // Boolean
+    -1,
+    false, false, false,
+    //   2 - Microsoft.UI.Xaml.Controls.TreeViewNode.Content
+    L"Content",
+    &GetReferenceTypeMember_Content<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>,
+    &SetReferenceTypeMember_Content<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, ::winrt::Windows::Foundation::IInspectable>,
+    1, // Object
+    -1,
+    false, true,  false,
+    //   3 - Microsoft.UI.Xaml.Controls.TreeViewNode.Children
+    L"Children",
+    &GetReferenceTypeMember_Children<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>,
+    nullptr,
+    7, // Windows.Foundation.Collections.IVector`1<Microsoft.UI.Xaml.Controls.TreeViewNode>
+    -1,
+    true,  false, false,
+    //   4 - Microsoft.UI.Xaml.Controls.TreeViewNode.Depth
+    L"Depth",
+    &GetValueTypeMember_Depth<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, int32_t>,
+    nullptr,
+    0, // Int32
+    -1,
+    true,  true,  false,
+    //   5 - Microsoft.UI.Xaml.Controls.TreeViewNode.HasChildren
+    L"HasChildren",
+    &GetValueTypeMember_HasChildren<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode, bool>,
+    nullptr,
+    2, // Boolean
+    -1,
+    true,  true,  false,
+    //   6 - Microsoft.UI.Xaml.Controls.TreeViewNode.Parent
+    L"Parent",
+    &GetReferenceTypeMember_Parent<::winrt::Microsoft::UI::Xaml::Controls::TreeViewNode>,
+    nullptr,
+    5, // Microsoft.UI.Xaml.Controls.TreeViewNode
+    -1,
+    true,  false, false,
+    //   7 - Microsoft.UI.Xaml.Controls.XamlControlsResources.UseCompactResources
+    L"UseCompactResources",
+    &GetValueTypeMember_UseCompactResources<::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources, bool>,
+    &SetValueTypeMember_UseCompactResources<::winrt::Microsoft::UI::Xaml::Controls::XamlControlsResources, bool>,
+    2, // Boolean
+    -1,
+    false, true,  false,
+};
+
+const wchar_t* GetShortName(const wchar_t* longName)
+{
+    const auto separator = wcsrchr(longName, '.');
+    return separator ? separator + 1: longName;
+}
+
+const TypeInfo* GetTypeInfo(::winrt::hstring const& typeName)
+{
+    size_t typeNameLength = typeName.size();
+    if (typeNameLength < _countof(TypeInfoLookup) - 1)
+    {
+        const auto begin = TypeInfos + TypeInfoLookup[typeNameLength];
+        const auto end = TypeInfos + TypeInfoLookup[typeNameLength + 1];
+        auto pos = std::find_if(begin, end, [&typeName](TypeInfo const& elem)
+        {
+            return wcscmp(typeName.data(), elem.typeName) == 0;
+        });
+        if (pos != end)
+        {
+            return pos;
+        }
+    }
+    return nullptr;
+}
+
+const MemberInfo* GetMemberInfo(::winrt::hstring const& longMemberName)
+{
+    const auto dotPosition = std::find(longMemberName.crbegin(), longMemberName.crend(), L'.').base();
+    if (dotPosition != longMemberName.end())
+    {
+        const auto sizeBeforeDot = static_cast<::winrt::hstring::size_type>(dotPosition - longMemberName.begin()) - 1;
+        const TypeInfo* pTypeInfo = GetTypeInfo(::winrt::hstring{longMemberName.data(), sizeBeforeDot});
+        if (pTypeInfo)
+        {
+            const TypeInfo* pNextTypeInfo = pTypeInfo + 1;
+            const auto shortMemberName = GetShortName(longMemberName.data());
+            const auto begin = MemberInfos + pTypeInfo->firstMemberIndex;
+            const auto end = MemberInfos + pNextTypeInfo->firstMemberIndex;
+            auto info = std::find_if(begin, end,
+                [shortMemberName](const MemberInfo& elem)
+            {
+                return wcscmp(shortMemberName, elem.shortName) == 0;
+            });
+            if (info != end)
+            {
+                return info;
+            }
+        }
+    }
+    return nullptr;
+}
+
+std::vector<::winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider> const& XamlTypeInfoProvider::OtherProviders()
+{
+    std::lock_guard<std::recursive_mutex> lock(_xamlTypesCriticalSection);
+    if (_otherProviders.empty())
+    {
+        _otherProviders.push_back(::winrt::Microsoft::UI::Xaml::XamlTypeInfo::XamlControlsXamlMetaDataProvider());
+    }
+    return _otherProviders;
+}
+
+IXamlType XamlTypeInfoProvider::CreateXamlType(::winrt::hstring const& typeName)
+{
+    const TypeInfo* pTypeInfo = GetTypeInfo(typeName);
+    const TypeInfo* pNextTypeInfo = pTypeInfo + 1;
+    if (!pTypeInfo || !pNextTypeInfo)
+    {
+        return nullptr;
+    }
+    else if (pTypeInfo->flags & TypeInfo_Flags_IsSystemType)
+    {
+        return ::winrt::make<XamlSystemBaseType>(typeName);
+    }
+    else
+    {
+        ::winrt::hstring baseName { pTypeInfo->baseTypeIndex >= 0 ? TypeInfos[pTypeInfo->baseTypeIndex].typeName : L""};
+        ::winrt::hstring boxedName { pTypeInfo->boxedTypeIndex >= 0 ? TypeInfos[pTypeInfo->boxedTypeIndex].typeName : L""};
+        auto userType = ::winrt::make_self<XamlUserType>(shared_from_this(), pTypeInfo->typeName, GetXamlTypeByName(baseName));
+        userType->_kindOfType = pTypeInfo->kindOfType;
+        userType->_activator = pTypeInfo->activator;
+        userType->_collectionAdd = pTypeInfo->collectionAdd;
+        userType->_dictionaryAdd = pTypeInfo->dictionaryAdd;
+        userType->_fromStringConverter = pTypeInfo->fromStringConverter;
+        userType->ContentPropertyName(pTypeInfo->contentPropertyName);
+        userType->IsLocalType(pTypeInfo->flags & TypeInfo_Flags_IsLocalType);
+        userType->IsReturnTypeStub(pTypeInfo->flags & TypeInfo_Flags_IsReturnTypeStub);
+        userType->IsBindable(pTypeInfo->flags & TypeInfo_Flags_IsBindable);
+        userType->IsMarkupExtension(pTypeInfo->flags & TypeInfo_Flags_IsMarkupExtension);
+        userType->_createFromStringMethod = nullptr;
+        userType->SetBoxedType(GetXamlTypeByName(boxedName));
+        for (int i = pTypeInfo->firstMemberIndex; i < pNextTypeInfo->firstMemberIndex; ++i)
+        {
+            userType->AddMemberName(MemberInfos[i].shortName);
+        }
+        return userType.as<IXamlType>();
+    }
+}
+
+IXamlMember XamlTypeInfoProvider::CreateXamlMember(::winrt::hstring const& longMemberName)
+{
+    const MemberInfo* pMemberInfo = GetMemberInfo(longMemberName);
+    if (!pMemberInfo)
+    {
+        return nullptr;
+    }
+    auto xamlMember = ::winrt::make_self<XamlMember>(shared_from_this(),
+        pMemberInfo->shortName, TypeInfos[pMemberInfo->typeIndex].typeName);
+    xamlMember->_getter = pMemberInfo->getter;
+    xamlMember->_setter = pMemberInfo->setter;
+    xamlMember->TargetTypeName(pMemberInfo->targetTypeIndex >= 0 ? TypeInfos[pMemberInfo->targetTypeIndex].typeName : L"");
+    xamlMember->IsReadOnly(pMemberInfo->isReadOnly);
+    xamlMember->IsDependencyProperty(pMemberInfo->isDependencyProperty);
+    xamlMember->IsAttachable(pMemberInfo->isAttachable);
+
+    return xamlMember.as<IXamlMember>();
+}
+} // namespace
+
+
diff --git a/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.xaml.g.h b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.xaml.g.h
new file mode 100644
index 00000000000..cfac72bd76d
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/XamlTypeInfo.xaml.g.h
@@ -0,0 +1,225 @@
+//------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//
+//     Changes to this file may cause incorrect behavior and will be lost if
+//     the code is regenerated.
+// </auto-generated>
+//------------------------------------------------------------------------------
+#pragma once
+
+#include <functional>
+#include <map>
+#include <vector>
+#include <unknwn.h>
+#include <mutex>
+
+// Undefine GetCurrentTime macro to prevent
+// conflict with Storyboard::GetCurrentTime
+#undef GetCurrentTime
+
+#include <winrt/Windows.Foundation.h>
+#include <winrt/Windows.Foundation.Collections.h>
+#include "winrt/Microsoft.UI.Xaml.h"
+#include "winrt/Microsoft.UI.Xaml.Data.h"
+#include "winrt/Microsoft.UI.Xaml.Markup.h"
+#include "winrt/Microsoft.UI.Xaml.Interop.h"
+#include "winrt/Windows.UI.Xaml.Interop.h"
+#include "winrt/Microsoft.UI.Xaml.XamlTypeInfo.h"
+
+namespace winrt::Microsoft::ReactNative::Xaml::implementation
+{
+    using IInspectable = ::winrt::Windows::Foundation::IInspectable;
+    using IXamlMember = ::winrt::Microsoft::UI::Xaml::Markup::IXamlMember;
+    using IXamlType = ::winrt::Microsoft::UI::Xaml::Markup::IXamlType;
+
+    struct XamlTypeInfoProvider : public std::enable_shared_from_this<XamlTypeInfoProvider>
+    {
+        IXamlType GetXamlTypeByName(::winrt::hstring const& typeName);
+        IXamlType GetXamlTypeByType(::winrt::Windows::UI::Xaml::Interop::TypeName const& t);
+        IXamlMember GetMemberByLongName(::winrt::hstring const& longMemberName);
+
+        void AddProvider(::winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider const& otherProvider)
+        {
+            std::lock_guard<std::recursive_mutex> lock(_xamlTypesCriticalSection);
+            _otherProviders.push_back(otherProvider);
+        }
+
+    private:
+        std::recursive_mutex _xamlTypesCriticalSection;
+        std::recursive_mutex _xamlMembersCriticalSection;
+        std::map<std::wstring, ::winrt::weak_ref<IXamlType>> _xamlTypes;
+        std::map<std::wstring, IXamlMember> _xamlMembers;
+        IXamlType CreateXamlType(::winrt::hstring const& typeName);
+        IXamlMember CreateXamlMember(::winrt::hstring const& longMemberName);
+
+        std::vector<::winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider> _otherProviders;
+        std::vector<::winrt::Microsoft::UI::Xaml::Markup::IXamlMetadataProvider> const& OtherProviders();
+
+        IXamlType CheckOtherMetadataProvidersForName(::winrt::hstring const& typeName);
+        IXamlType CheckOtherMetadataProvidersForType(::winrt::Windows::UI::Xaml::Interop::TypeName const& t);
+    };
+
+    struct XamlSystemBaseType : public ::winrt::implements<XamlSystemBaseType, ::winrt::Microsoft::UI::Xaml::Markup::IXamlType>
+    {
+        explicit XamlSystemBaseType(::winrt::hstring const& name);
+
+        // IXamlType
+        IXamlType BaseType() const;
+        IXamlMember ContentProperty() const;
+        ::winrt::hstring FullName() const;
+        ::winrt::hstring Name() const;
+        bool IsArray() const;
+        bool IsCollection() const;
+        bool IsConstructible() const;
+        bool IsDictionary() const;
+        bool IsMarkupExtension() const;
+        bool IsEnum() const;
+        bool IsSystemType() const;
+        bool IsBindable() const;
+        IXamlType ItemType() const;
+        IXamlType KeyType() const;
+        IXamlType BoxedType() const;
+
+        ::winrt::Windows::UI::Xaml::Interop::TypeName UnderlyingType() const;
+        IInspectable ActivateInstance() const;
+        IInspectable CreateFromString(::winrt::hstring const& value) const;
+        IXamlMember GetMember(::winrt::hstring const& name) const;
+        void AddToVector(IInspectable const& instance, IInspectable const& value) const;
+        void AddToMap(IInspectable const& instance, IInspectable const& key, IInspectable const& value) const;
+        void RunInitializer() const;
+
+    private:
+        ::winrt::hstring _fullName;
+    };
+
+    struct __declspec(uuid("63A5FDC1-874E-4D22-9BC7-A0E3488AD5B2")) IXamlUserType : ::IUnknown
+    {
+        virtual bool IsReturnTypeStub() const = 0;
+        virtual bool IsLocalType() const = 0;
+    };
+
+    struct XamlUserType : public ::winrt::implements<XamlUserType, IXamlUserType, ::winrt::Microsoft::UI::Xaml::Markup::IXamlType>
+    {
+        explicit XamlUserType(
+            std::shared_ptr<XamlTypeInfoProvider> const& provider, 
+            ::winrt::hstring const& fullName, 
+            IXamlType baseType);
+
+        ::winrt::hstring GetRuntimeClassName() const;
+
+        // IXamlType
+        IXamlType BaseType() const;
+        IXamlMember ContentProperty() const;
+        ::winrt::hstring FullName() const;
+        ::winrt::hstring Name() const;
+        bool IsArray() const;
+        bool IsCollection() const;
+        bool IsConstructible() const;
+        bool IsDictionary() const;
+        bool IsMarkupExtension() const;
+        bool IsEnum() const;
+        bool IsSystemType() const;
+        bool IsBindable() const;
+        IXamlType ItemType() const;
+        IXamlType KeyType() const;
+        IXamlType BoxedType() const;
+        ::winrt::Windows::UI::Xaml::Interop::TypeName UnderlyingType() const;
+        IInspectable ActivateInstance() const;
+        IInspectable CreateFromString(::winrt::hstring const& value) const;
+        IXamlMember GetMember(::winrt::hstring const& name) const;
+        void AddToVector(IInspectable const& instance, IInspectable const& value) const;
+        void AddToMap(IInspectable const& instance, IInspectable const& key, IInspectable const& value) const;
+        void RunInitializer() const;
+
+        // Additional Setters
+        void IsArray(bool value);
+        void IsMarkupExtension(bool value);
+        void IsEnum(bool value);
+        void IsBindable(bool value);
+
+        bool IsReturnTypeStub() const;
+        void IsReturnTypeStub(bool value);
+
+        bool IsLocalType() const;
+        void IsLocalType(bool value);
+
+        typedef IInspectable(*ActivatorFn)();
+        typedef void(*AddToCollectionFn)(IInspectable const& instance, IInspectable const& item);
+        typedef void(*AddToDictionaryFn)(IInspectable const& instance, IInspectable const& key, IInspectable const& item);
+        typedef IInspectable (*CreateFromStringFn)(::winrt::hstring const& input);
+        typedef IInspectable(*StringConverterFn)(XamlUserType const& userType, ::winrt::hstring const& input);
+
+        ActivatorFn _activator{};
+        AddToCollectionFn _collectionAdd{};
+        AddToDictionaryFn _dictionaryAdd{};
+        CreateFromStringFn _createFromStringMethod{};
+        ::winrt::Windows::UI::Xaml::Interop::TypeKind _kindOfType{};
+        StringConverterFn _fromStringConverter{};
+
+        void ContentPropertyName(::winrt::hstring const& value);
+        void ItemTypeName(::winrt::hstring const& value);
+        void KeyTypeName(::winrt::hstring const& value);
+        void SetBoxedType(IXamlType boxedType);
+        void AddMemberName(::winrt::hstring const& shortName);
+        void AddEnumValue(::winrt::hstring const& name, IInspectable value);
+        uint32_t CreateEnumUIntFromString(::winrt::hstring const& input) const;
+
+    private:
+        std::shared_ptr<XamlTypeInfoProvider> _provider;
+        IXamlType _baseType;
+        IXamlType _boxedType;
+        ::winrt::hstring _contentPropertyName;
+        ::winrt::hstring _itemTypeName;
+        ::winrt::hstring _keyTypeName;
+        ::winrt::hstring _fullName;
+        std::map<std::wstring, winrt::hstring> _memberNames;
+        std::map<std::wstring, IInspectable> _enumValues;
+        bool _isArray{ false };
+        bool _isMarkupExtension{ false };
+        bool _isEnum{ false };
+        bool _isBindable{ false };
+        bool _isReturnTypeStub{ false };
+        bool _isLocalType{ false };
+    };
+
+    struct XamlMember : public ::winrt::implements<XamlMember, ::winrt::Microsoft::UI::Xaml::Markup::IXamlMember>
+    {
+        explicit XamlMember(
+            std::shared_ptr<XamlTypeInfoProvider> const& provider, 
+            ::winrt::hstring const& name, 
+            ::winrt::hstring const& typeName);
+
+        typedef IInspectable(*PropertyGetterFn)(IInspectable const& instance);
+        typedef void(*PropertySetterFn)(IInspectable const& instance, IInspectable const& value);
+
+        PropertyGetterFn _getter{};
+        PropertySetterFn _setter{};
+
+        // IXamlMember
+        bool IsAttachable() const;
+        bool IsDependencyProperty() const;
+        bool IsReadOnly() const;
+        ::winrt::hstring Name() const;
+        IXamlType TargetType() const;
+        IXamlType Type() const;
+        IInspectable GetValue(IInspectable const& instance) const;
+        void SetValue(IInspectable const& instance, IInspectable const& value);
+
+        // Additional Setters
+        void TargetTypeName(::winrt::hstring const& value);
+        void IsAttachable(bool value);
+        void IsDependencyProperty(bool value);
+        void IsReadOnly(bool value);
+
+    private:
+        bool _isAttachable{ false };
+        bool _isDependencyProperty{ false };
+        bool _isReadOnly{ false };
+        ::winrt::hstring _name;
+        ::winrt::hstring _targetTypeName;
+        ::winrt::hstring _typeName;
+        std::shared_ptr<XamlTypeInfoProvider> _provider;
+    };
+}
+
diff --git a/vnext/Microsoft.ReactNative.Xaml/packages.newarch.lock.json b/vnext/Microsoft.ReactNative.Xaml/packages.newarch.lock.json
new file mode 100644
index 00000000000..5729b8a31dd
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/packages.newarch.lock.json
@@ -0,0 +1,98 @@
+{
+  "version": 1,
+  "dependencies": {
+    "native,Version=v0.0": {
+      "boost": {
+        "type": "Direct",
+        "requested": "[1.83.0, )",
+        "resolved": "1.83.0",
+        "contentHash": "cy53VNMzysEMvhBixDe8ujPk67Fcj3v6FPHQnH91NYJNLHpc6jxa2xq9ruCaaJjE4M3YrGSHDi4uUSTGBWw6EQ=="
+      },
+      "Microsoft.Windows.CppWinRT": {
+        "type": "Direct",
+        "requested": "[2.0.230706.1, )",
+        "resolved": "2.0.230706.1",
+        "contentHash": "l0D7oCw/5X+xIKHqZTi62TtV+1qeSz7KVluNFdrJ9hXsst4ghvqQ/Yhura7JqRdZWBXAuDS0G0KwALptdoxweQ=="
+      },
+      "Microsoft.WindowsAppSDK": {
+        "type": "Direct",
+        "requested": "[1.7.250401001, )",
+        "resolved": "1.7.250401001",
+        "contentHash": "kPsJ2LZoo3Xs/6FtIWMZRGnQ2ZMx9zDa0ZpqRGz1qwZr0gwwlXZJTmngaA1Ym2AHmIa05NtX2jEE2He8CzfhTg==",
+        "dependencies": {
+          "Microsoft.Web.WebView2": "1.0.2903.40",
+          "Microsoft.Windows.SDK.BuildTools": "10.0.22621.756"
+        }
+      },
+      "Microsoft.Build.Tasks.Git": {
+        "type": "Transitive",
+        "resolved": "1.1.1",
+        "contentHash": "AT3HlgTjsqHnWpBHSNeR0KxbLZD7bztlZVj7I8vgeYG9SYqbeFGh0TM/KVtC6fg53nrWHl3VfZFvb5BiQFcY6Q=="
+      },
+      "Microsoft.JavaScript.Hermes": {
+        "type": "Transitive",
+        "resolved": "0.0.0-2505.2001-0e4bc3b9",
+        "contentHash": "VNSUBgaGzJ/KkK3Br0b9FORkCgKqke54hi48vG42xRACIlxN+uLFMz0hRo+KHogz+Fsn+ltXicGwQsDVpmaCMg=="
+      },
+      "Microsoft.SourceLink.Common": {
+        "type": "Transitive",
+        "resolved": "1.1.1",
+        "contentHash": "WMcGpWKrmJmzrNeuaEb23bEMnbtR/vLmvZtkAP5qWu7vQsY59GqfRJd65sFpBszbd2k/bQ8cs8eWawQKAabkVg=="
+      },
+      "Microsoft.SourceLink.GitHub": {
+        "type": "Transitive",
+        "resolved": "1.1.1",
+        "contentHash": "IaJGnOv/M7UQjRJks7B6p7pbPnOwisYGOIzqCz5ilGFTApZ3ktOR+6zJ12ZRPInulBmdAf1SrGdDG2MU8g6XTw==",
+        "dependencies": {
+          "Microsoft.Build.Tasks.Git": "1.1.1",
+          "Microsoft.SourceLink.Common": "1.1.1"
+        }
+      },
+      "Microsoft.Web.WebView2": {
+        "type": "Transitive",
+        "resolved": "1.0.2903.40",
+        "contentHash": "THrzYAnJgE3+cNH+9Epr44XjoZoRELdVpXlWGPs6K9C9G6TqyDfVCeVAR/Er8ljLitIUX5gaSkPsy9wRhD1sgQ=="
+      },
+      "Microsoft.Windows.SDK.BuildTools": {
+        "type": "Transitive",
+        "resolved": "10.0.22621.756",
+        "contentHash": "7ZL2sFSioYm1Ry067Kw1hg0SCcW5kuVezC2SwjGbcPE61Nn+gTbH86T73G3LcEOVj0S3IZzNuE/29gZvOLS7VA=="
+      },
+      "common": {
+        "type": "Project",
+        "dependencies": {
+          "boost": "[1.83.0, )"
+        }
+      },
+      "fmt": {
+        "type": "Project"
+      },
+      "folly": {
+        "type": "Project",
+        "dependencies": {
+          "boost": "[1.83.0, )",
+          "fmt": "[1.0.0, )"
+        }
+      },
+      "microsoft.reactnative": {
+        "type": "Project",
+        "dependencies": {
+          "Common": "[1.0.0, )",
+          "Folly": "[1.0.0, )",
+          "Microsoft.JavaScript.Hermes": "[0.0.0-2505.2001-0e4bc3b9, )",
+          "Microsoft.SourceLink.GitHub": "[1.1.1, )",
+          "Microsoft.WindowsAppSDK": "[1.7.250401001, )",
+          "ReactCommon": "[1.0.0, )",
+          "boost": "[1.83.0, )"
+        }
+      },
+      "reactcommon": {
+        "type": "Project",
+        "dependencies": {
+          "Folly": "[1.0.0, )",
+          "boost": "[1.83.0, )"
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/vnext/Microsoft.ReactNative.Xaml/pch.cpp b/vnext/Microsoft.ReactNative.Xaml/pch.cpp
new file mode 100644
index 00000000000..1d9f38c57d6
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/pch.cpp
@@ -0,0 +1 @@
+#include "pch.h"
diff --git a/vnext/Microsoft.ReactNative.Xaml/pch.h b/vnext/Microsoft.ReactNative.Xaml/pch.h
new file mode 100644
index 00000000000..f986099aac0
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/pch.h
@@ -0,0 +1,27 @@
+#pragma once
+#include <windows.h>
+#include <unknwn.h>
+#include <restrictederrorinfo.h>
+#include <hstring.h>
+
+// Undefine GetCurrentTime macro to prevent
+// conflict with Storyboard::GetCurrentTime
+#undef GetCurrentTime
+
+#include <winrt/Windows.Foundation.h>
+#include <winrt/Windows.Foundation.Collections.h>
+#include <winrt/Windows.ApplicationModel.Activation.h>
+#include <winrt/Windows.UI.Xaml.Interop.h>
+#include <winrt/Microsoft.UI.Composition.h>
+#include <winrt/Microsoft.UI.Xaml.h>
+#include <winrt/Microsoft.UI.Xaml.Controls.h>
+#include <winrt/Microsoft.UI.Xaml.Controls.Primitives.h>
+#include <winrt/Microsoft.UI.Xaml.Data.h>
+#include <winrt/Microsoft.UI.Xaml.Interop.h>
+#include <winrt/Microsoft.UI.Xaml.Markup.h>
+#include <winrt/Microsoft.UI.Xaml.Media.h>
+#include <winrt/Microsoft.UI.Xaml.Navigation.h>
+#include <winrt/Microsoft.UI.Xaml.Shapes.h>
+#include <winrt/Microsoft.UI.Dispatching.h>
+#include <winrt/Microsoft.Windows.ApplicationModel.Resources.h>
+//#include <wil/cppwinrt_helpers.h>
diff --git a/vnext/Microsoft.ReactNative.Xaml/resource.h b/vnext/Microsoft.ReactNative.Xaml/resource.h
new file mode 100644
index 00000000000..103def29f36
--- /dev/null
+++ b/vnext/Microsoft.ReactNative.Xaml/resource.h
@@ -0,0 +1,16 @@
+//{{NO_DEPENDENCIES}}
+// Microsoft Visual C++ generated include file.
+// Used by Resource.rc
+//
+#define IDD_DIALOG1                     101
+
+// Next default values for new objects
+// 
+#ifdef APSTUDIO_INVOKED
+#ifndef APSTUDIO_READONLY_SYMBOLS
+#define _APS_NEXT_RESOURCE_VALUE        103
+#define _APS_NEXT_COMMAND_VALUE         40001
+#define _APS_NEXT_CONTROL_VALUE         1001
+#define _APS_NEXT_SYMED_VALUE           101
+#endif
+#endif
diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ContentIslandComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/ContentIslandComponentView.cpp
index 57aa7d14656..1027096e285 100644
--- a/vnext/Microsoft.ReactNative/Fabric/Composition/ContentIslandComponentView.cpp
+++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ContentIslandComponentView.cpp
@@ -178,14 +178,17 @@ ContentIslandComponentView::~ContentIslandComponentView() noexcept {
 void ContentIslandComponentView::MountChildComponentView(
     const winrt::Microsoft::ReactNative::ComponentView &childComponentView,
     uint32_t index) noexcept {
-  assert(false);
+  // I assume this is here b/c it doesn't make sense for a Island CV to have children.
+  // XamlHost does have children, but the children will represent Xaml elements and 
+  // don't participate direction in RN's rendering.
+  // assert(false);
   base_type::MountChildComponentView(childComponentView, index);
 }
 
 void ContentIslandComponentView::UnmountChildComponentView(
     const winrt::Microsoft::ReactNative::ComponentView &childComponentView,
     uint32_t index) noexcept {
-  assert(false);
+  // assert(false);
   base_type::UnmountChildComponentView(childComponentView, index);
 }
 
diff --git a/vnext/PropertySheets/External/Microsoft.ReactNative.Cpp.ProjectReferences.props b/vnext/PropertySheets/External/Microsoft.ReactNative.Cpp.ProjectReferences.props
index 1f58b7e950a..8fa7c4f9117 100644
--- a/vnext/PropertySheets/External/Microsoft.ReactNative.Cpp.ProjectReferences.props
+++ b/vnext/PropertySheets/External/Microsoft.ReactNative.Cpp.ProjectReferences.props
@@ -18,5 +18,12 @@
       <Name>Microsoft.ReactNative</Name>
       <Private Condition="'$(ConfigurationType)' != 'Application'">false</Private>
     </ProjectReference>
+    <!--
+    <ProjectReference Include="$(ReactNativeWindowsDir)Microsoft.ReactNative.Xaml\Microsoft.ReactNative.Xaml.vcxproj">
+      <Project>{e5d1b5d2-0e6a-4011-8bcd-08968256dcbd}</Project>
+      <Name>Microsoft.ReactNative.Xaml</Name>
+      <Private Condition="'$(ConfigurationType)' != 'Application'">false</Private>
+    </ProjectReference>
+    -->
   </ItemGroup>
 </Project>
diff --git a/vnext/codegen/react/components/rnwcore/ComponentDescriptors.h b/vnext/codegen/react/components/rnwcore/ComponentDescriptors.h
index 45b7b5ea904..f3d7509b0e9 100644
--- a/vnext/codegen/react/components/rnwcore/ComponentDescriptors.h
+++ b/vnext/codegen/react/components/rnwcore/ComponentDescriptors.h
@@ -23,6 +23,7 @@ using DebuggingOverlayComponentDescriptor = ConcreteComponentDescriptor<Debuggin
 using PullToRefreshViewComponentDescriptor = ConcreteComponentDescriptor<PullToRefreshViewShadowNode>;
 using SwitchComponentDescriptor = ConcreteComponentDescriptor<SwitchShadowNode>;
 using UnimplementedNativeViewComponentDescriptor = ConcreteComponentDescriptor<UnimplementedNativeViewShadowNode>;
+using XamlHostComponentDescriptor = ConcreteComponentDescriptor<XamlHostShadowNode>;
 
 void rnwcore_registerComponentDescriptorsFromCodegen(
   std::shared_ptr<const ComponentDescriptorProviderRegistry> registry);
diff --git a/vnext/codegen/react/components/rnwcore/EventEmitters.cpp b/vnext/codegen/react/components/rnwcore/EventEmitters.cpp
index adcd150d680..b78a6087acf 100644
--- a/vnext/codegen/react/components/rnwcore/EventEmitters.cpp
+++ b/vnext/codegen/react/components/rnwcore/EventEmitters.cpp
@@ -129,4 +129,5 @@ void SwitchEventEmitter::onChange(OnChange $event) const {
 }
 
 
+
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/EventEmitters.h b/vnext/codegen/react/components/rnwcore/EventEmitters.h
index 0c3bce4a218..ccac8315736 100644
--- a/vnext/codegen/react/components/rnwcore/EventEmitters.h
+++ b/vnext/codegen/react/components/rnwcore/EventEmitters.h
@@ -165,5 +165,12 @@ class UnimplementedNativeViewEventEmitter : public ViewEventEmitter {
 
   
   
+};
+class XamlHostEventEmitter : public ViewEventEmitter {
+ public:
+  using ViewEventEmitter::ViewEventEmitter;
+
+  
+  
 };
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/Props.cpp b/vnext/codegen/react/components/rnwcore/Props.cpp
index a46bf56b211..9774c9ef982 100644
--- a/vnext/codegen/react/components/rnwcore/Props.cpp
+++ b/vnext/codegen/react/components/rnwcore/Props.cpp
@@ -152,5 +152,12 @@ UnimplementedNativeViewProps::UnimplementedNativeViewProps(
 
     name(convertRawProp(context, rawProps, "name", sourceProps.name, {""}))
       {}
+XamlHostProps::XamlHostProps(
+    const PropsParserContext &context,
+    const XamlHostProps &sourceProps,
+    const RawProps &rawProps): ViewProps(context, sourceProps, rawProps),
+
+    label(convertRawProp(context, rawProps, "label", sourceProps.label, {}))
+      {}
 
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/Props.h b/vnext/codegen/react/components/rnwcore/Props.h
index 82909907d12..de11a2e57b1 100644
--- a/vnext/codegen/react/components/rnwcore/Props.h
+++ b/vnext/codegen/react/components/rnwcore/Props.h
@@ -394,4 +394,14 @@ class UnimplementedNativeViewProps final : public ViewProps {
   std::string name{""};
 };
 
+class XamlHostProps final : public ViewProps {
+ public:
+  XamlHostProps() = default;
+  XamlHostProps(const PropsParserContext& context, const XamlHostProps &sourceProps, const RawProps &rawProps);
+
+#pragma mark - Props
+
+  std::string label{};
+};
+
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/ShadowNodes.cpp b/vnext/codegen/react/components/rnwcore/ShadowNodes.cpp
index dccefb1d478..627e9a2d3fe 100644
--- a/vnext/codegen/react/components/rnwcore/ShadowNodes.cpp
+++ b/vnext/codegen/react/components/rnwcore/ShadowNodes.cpp
@@ -19,5 +19,6 @@ extern const char DebuggingOverlayComponentName[] = "DebuggingOverlay";
 extern const char PullToRefreshViewComponentName[] = "PullToRefreshView";
 extern const char SwitchComponentName[] = "Switch";
 extern const char UnimplementedNativeViewComponentName[] = "UnimplementedNativeView";
+extern const char XamlHostComponentName[] = "XamlHost";
 
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/ShadowNodes.h b/vnext/codegen/react/components/rnwcore/ShadowNodes.h
index 2c7c94720cf..9b45530d5ad 100644
--- a/vnext/codegen/react/components/rnwcore/ShadowNodes.h
+++ b/vnext/codegen/react/components/rnwcore/ShadowNodes.h
@@ -95,4 +95,15 @@ using UnimplementedNativeViewShadowNode = ConcreteViewShadowNode<
     UnimplementedNativeViewEventEmitter,
     UnimplementedNativeViewState>;
 
+JSI_EXPORT extern const char XamlHostComponentName[];
+
+/*
+ * `ShadowNode` for <XamlHost> component.
+ */
+using XamlHostShadowNode = ConcreteViewShadowNode<
+    XamlHostComponentName,
+    XamlHostProps,
+    XamlHostEventEmitter,
+    XamlHostState>;
+
 } // namespace facebook::react
diff --git a/vnext/codegen/react/components/rnwcore/States.h b/vnext/codegen/react/components/rnwcore/States.h
index df8b9e54057..efc143b39cc 100644
--- a/vnext/codegen/react/components/rnwcore/States.h
+++ b/vnext/codegen/react/components/rnwcore/States.h
@@ -98,4 +98,16 @@ class UnimplementedNativeViewState {
 #endif
 };
 
+class XamlHostState {
+public:
+  XamlHostState() = default;
+
+#ifdef ANDROID
+  XamlHostState(XamlHostState const &previousState, folly::dynamic data){};
+  folly::dynamic getDynamic() const {
+    return {};
+  };
+#endif
+};
+
 } // namespace facebook::react
\ No newline at end of file
diff --git a/vnext/codegen/react/components/rnwcore/XamlHost.g.h b/vnext/codegen/react/components/rnwcore/XamlHost.g.h
new file mode 100644
index 00000000000..26bd059c3c3
--- /dev/null
+++ b/vnext/codegen/react/components/rnwcore/XamlHost.g.h
@@ -0,0 +1,200 @@
+
+/*
+ * This file is auto-generated from XamlHostNativeComponent spec file in flow / TypeScript.
+ */
+// clang-format off
+#pragma once
+
+#include <NativeModules.h>
+
+#ifdef RNW_NEW_ARCH
+#include <JSValueComposition.h>
+
+#include <winrt/Microsoft.ReactNative.Composition.h>
+#include <winrt/Microsoft.UI.Composition.h>
+#endif // #ifdef RNW_NEW_ARCH
+
+#ifdef RNW_NEW_ARCH
+
+namespace Microsoft::ReactNativeSpecs {
+
+REACT_STRUCT(XamlHostProps)
+struct XamlHostProps : winrt::implements<XamlHostProps, winrt::Microsoft::ReactNative::IComponentProps> {
+  XamlHostProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom)
+    : ViewProps(props)
+  {
+     if (cloneFrom) {
+       auto cloneFromProps = cloneFrom.as<XamlHostProps>();
+       label = cloneFromProps->label;  
+     }
+  }
+
+  void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept {
+    winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this);
+  }
+
+  REACT_FIELD(label)
+  std::optional<std::string> label;
+
+  const winrt::Microsoft::ReactNative::ViewProps ViewProps;
+};
+
+struct XamlHostEventEmitter {
+  XamlHostEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter)
+      : m_eventEmitter(eventEmitter) {}
+
+ private:
+  winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr};
+};
+
+template<typename TUserData>
+struct BaseXamlHost {
+
+  virtual void UpdateProps(
+    const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+    const winrt::com_ptr<XamlHostProps> &newProps,
+    const winrt::com_ptr<XamlHostProps> &/*oldProps*/) noexcept {
+    m_props = newProps;
+  }
+
+  // UpdateLayoutMetrics will only be called if this method is overridden
+  virtual void UpdateLayoutMetrics(
+    const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+    const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/,
+    const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept {
+  }
+
+  // UpdateState will only be called if this method is overridden
+  virtual void UpdateState(
+    const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+    const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept {
+  }
+
+  virtual void UpdateEventEmitter(const std::shared_ptr<XamlHostEventEmitter> &eventEmitter) noexcept {
+    m_eventEmitter = eventEmitter;
+  }
+
+  // MountChildComponentView will only be called if this method is overridden
+  virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+           const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept {
+  }
+
+  // UnmountChildComponentView will only be called if this method is overridden
+  virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+           const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept {
+  }
+
+  // Initialize will only be called if this method is overridden
+  virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept {
+  }
+
+  // CreateVisual will only be called if this method is overridden
+  virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+    return view.as<winrt::Microsoft::ReactNative::Composition::ComponentView>().Compositor().CreateSpriteVisual();
+  }
+
+  // FinalizeUpdate will only be called if this method is overridden
+  virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+                                        winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept {
+  }
+
+  
+
+  const std::shared_ptr<XamlHostEventEmitter>& EventEmitter() const { return m_eventEmitter; }
+  const winrt::com_ptr<XamlHostProps>& Props() const { return m_props; }
+
+private:
+  winrt::com_ptr<XamlHostProps> m_props;
+  std::shared_ptr<XamlHostEventEmitter> m_eventEmitter;
+};
+
+template <typename TUserData>
+void RegisterXamlHostNativeComponent(
+    winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder,
+    std::function<void(const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder&)> builderCallback) noexcept {
+  packageBuilder.as<winrt::Microsoft::ReactNative::IReactPackageBuilderFabric>().AddViewComponent(
+      L"XamlHost", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept {
+        auto compBuilder = builder.as<winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder>();
+
+        builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props,
+                              const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept {
+            return winrt::make<XamlHostProps>(props, cloneFrom); 
+        });
+
+        builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                     const winrt::Microsoft::ReactNative::IComponentProps &newProps,
+                                     const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->UpdateProps(view, newProps ? newProps.as<XamlHostProps>() : nullptr, oldProps ? oldProps.as<XamlHostProps>() : nullptr);
+        });
+
+        compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                      const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics,
+                                      const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics);
+        });
+
+        builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                     const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept {
+          auto userData = view.UserData().as<TUserData>();
+          userData->UpdateEventEmitter(std::make_shared<XamlHostEventEmitter>(eventEmitter));
+        });
+
+        if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::FinalizeUpdate != &BaseXamlHost<TUserData>::FinalizeUpdate) {
+            builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                     winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->FinalizeUpdate(view, mask);
+          });
+        } 
+
+        if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::UpdateState != &BaseXamlHost<TUserData>::UpdateState) {
+          builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                     const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            userData->UpdateState(view, newState);
+          });
+        }
+
+        if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::MountChildComponentView != &BaseXamlHost<TUserData>::MountChildComponentView) {
+          builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                      const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            return userData->MountChildComponentView(view, args);
+          });
+        }
+
+        if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::UnmountChildComponentView != &BaseXamlHost<TUserData>::UnmountChildComponentView) {
+          builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view,
+                                      const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            return userData->UnmountChildComponentView(view, args);
+          });
+        }
+
+        compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+          auto userData = winrt::make_self<TUserData>();
+          if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::Initialize != &BaseXamlHost<TUserData>::Initialize) {
+            userData->Initialize(view);
+          }
+          view.UserData(*userData);
+        });
+
+        if CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS (&TUserData::CreateVisual != &BaseXamlHost<TUserData>::CreateVisual) {
+          compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+            auto userData = view.UserData().as<TUserData>();
+            return userData->CreateVisual(view);
+          });
+        }
+
+        // Allow app to further customize the builder
+        if (builderCallback) {
+          builderCallback(compBuilder);
+        }
+      });
+}
+
+} // namespace Microsoft::ReactNativeSpecs
+
+#endif // #ifdef RNW_NEW_ARCH
diff --git a/vnext/src-win/Libraries/Components/Xaml/FabricXamlControl.windows.js b/vnext/src-win/Libraries/Components/Xaml/FabricXamlControl.windows.js
new file mode 100644
index 00000000000..92d69a0e855
--- /dev/null
+++ b/vnext/src-win/Libraries/Components/Xaml/FabricXamlControl.windows.js
@@ -0,0 +1,26 @@
+/**
+ * @format
+ * @flow
+ */
+
+const nativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry');
+
+const StackPanel = nativeComponentRegistry.get('StackPanel', () => ({
+  uiViewClassName: 'FX_StackPanel',
+  directEventTypes: {},
+  validAttributes: {label: true, content: true},
+}));
+
+const Button = nativeComponentRegistry.get('Button', () => ({
+  uiViewClassName: 'FX_Button',
+  directEventTypes: {},
+  validAttributes: {label: true, content: true, text: true, davis: true},
+}));
+
+const CalendarView = nativeComponentRegistry.get('CalendarView', () => ({
+  uiViewClassName: 'FX_CalendarView',
+  directEventTypes: {},
+  validAttributes: {width: true, height: true},
+}));
+
+export {StackPanel, Button, CalendarView};
diff --git a/vnext/src-win/Libraries/Components/Xaml/XamlHost.windows.js b/vnext/src-win/Libraries/Components/Xaml/XamlHost.windows.js
new file mode 100644
index 00000000000..f3b49f6bc78
--- /dev/null
+++ b/vnext/src-win/Libraries/Components/Xaml/XamlHost.windows.js
@@ -0,0 +1,7 @@
+/**
+ * @format
+ * @flow
+ */
+
+import XamlHost from '../../../src/private/specs/components/Xaml/XamlHostNativeComponent';
+export default XamlHost;
diff --git a/vnext/src-win/Libraries/platform-types.d.ts b/vnext/src-win/Libraries/platform-types.d.ts
index c201a5c88c1..55ec7cca6f7 100644
--- a/vnext/src-win/Libraries/platform-types.d.ts
+++ b/vnext/src-win/Libraries/platform-types.d.ts
@@ -17,3 +17,4 @@ export const ViewWindows = View;
 import type {View} from './Components/View/View';
 export type ViewWindows = View;
 export * from './AppTheme/AppThemeTypes';
+export * from './Components/Xaml/XamlHost';
diff --git a/vnext/src-win/index.windows.js b/vnext/src-win/index.windows.js
index bde0d3a7725..6474678bb71 100644
--- a/vnext/src-win/index.windows.js
+++ b/vnext/src-win/index.windows.js
@@ -39,6 +39,7 @@ import typeof SafeAreaView from './Libraries/Components/SafeAreaView/SafeAreaVie
 import typeof ScrollView from './Libraries/Components/ScrollView/ScrollView';
 import typeof StatusBar from './Libraries/Components/StatusBar/StatusBar';
 import typeof Switch from './Libraries/Components/Switch/Switch';
+import typeof XamlHost from './Libraries/Components/Xaml/XamlHost';
 import typeof InputAccessoryView from './Libraries/Components/TextInput/InputAccessoryView';
 import typeof TextInput from './Libraries/Components/TextInput/TextInput';
 import typeof ToastAndroid from './Libraries/Components/ToastAndroid/ToastAndroid';
@@ -182,6 +183,9 @@ module.exports = {
   get Switch(): Switch {
     return require('./Libraries/Components/Switch/Switch').default;
   },
+  get XamlHost(): XamlHost {
+    return require('./Libraries/Components/Xaml/XamlHost').default;
+  },
   get Text(): Text {
     return require('./Libraries/Text/Text');
   },
diff --git a/vnext/src-win/src/private/specs/components/Xaml/XamlHostNativeComponent.js b/vnext/src-win/src/private/specs/components/Xaml/XamlHostNativeComponent.js
new file mode 100644
index 00000000000..4cf39730380
--- /dev/null
+++ b/vnext/src-win/src/private/specs/components/Xaml/XamlHostNativeComponent.js
@@ -0,0 +1,19 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ * @flow
+ */
+
+'use strict';
+
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+
+type XamlHostProps = $ReadOnly<{|
+  ...ViewProps,
+
+  // Props
+  label?: string,
+|}>;
+
+export default codegenNativeComponent<XamlHostProps>('XamlHost');