react-native-windows 0.74.21 → 0.74.22

package/Microsoft.ReactNative/Fabric/platform/react/renderer/textlayoutmanager/TextLayoutManager.cpp

@@ -43,7 +43,10 @@ void TextLayoutManager::GetTextLayout(
           static_cast<facebook::react::FontWeight>(DWRITE_FONT_WEIGHT_REGULAR))),
       style,
       DWRITE_FONT_STRETCH_NORMAL,
-      outerFragment.textAttributes.fontSize,
+      (outerFragment.textAttributes.allowFontScaling.value_or(true) &&
+       !std::isnan(outerFragment.textAttributes.fontSizeMultiplier))
+          ? (outerFragment.textAttributes.fontSizeMultiplier * outerFragment.textAttributes.fontSize)
+          : outerFragment.textAttributes.fontSize,
       L"",
       spTextFormat.put()));
 
@@ -118,7 +121,11 @@ void TextLayoutManager::GetTextLayout(
             attributes.fontWeight.value_or(static_cast<facebook::react::FontWeight>(DWRITE_FONT_WEIGHT_REGULAR))),
         range));
     winrt::check_hresult(spTextLayout->SetFontStyle(fragmentStyle, range));
-    winrt::check_hresult(spTextLayout->SetFontSize(attributes.fontSize, range));
+    winrt::check_hresult(spTextLayout->SetFontSize(
+        (attributes.allowFontScaling.value_or(true) && !std::isnan(attributes.fontSizeMultiplier))
+            ? (attributes.fontSizeMultiplier * attributes.fontSize)
+            : attributes.fontSize,
+        range));
 
     if (!isnan(attributes.letterSpacing)) {
       winrt::check_hresult(

package/Microsoft.ReactNative/IReactViewComponentBuilder.idl

@@ -47,6 +47,13 @@ namespace Microsoft.ReactNative
     UInt32 Index { get; };
   };
 
+  [experimental]
+  runtimeclass HandleCommandArgs {
+    String CommandName { get; };
+    IJSValueReader CommandArgs { get; };
+    Boolean Handled;
+  };
+
   [experimental]
   DOC_STRING("A delegate that creates a @IComponentProps object for an instance of @ViewProps. See @IReactViewComponentBuilder.SetCreateProps")
   delegate IComponentProps ViewPropsFactory(ViewProps props);
@@ -71,7 +78,7 @@ namespace Microsoft.ReactNative
   delegate void ComponentViewInitializer(ComponentView view);
 
   [experimental]
-  delegate void HandleCommandDelegate(ComponentView source, String commandName, IJSValueReader args);
+  delegate void HandleCommandDelegate(ComponentView source, HandleCommandArgs args);
 
   [experimental]
   delegate void UpdateFinalizerDelegate(ComponentView source, ComponentViewUpdateMask updateMask);

package/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj

@@ -142,7 +142,7 @@
       <DebugInformationFormat>ProgramDatabase</DebugInformationFormat>
     </ClCompile>
     <Link>
-      <AdditionalDependencies>winsqlite3.lib;ChakraRT.lib;dxguid.lib;dloadhelper.lib;OneCoreUap_apiset.lib;%(AdditionalDependencies)</AdditionalDependencies>
+      <AdditionalDependencies>winsqlite3.lib;ChakraRT.lib;dxguid.lib;dloadhelper.lib;OneCoreUap_apiset.lib;Dwmapi.lib;%(AdditionalDependencies)</AdditionalDependencies>
       <DelayLoadDLLs>
         api-ms-win-core-file-l1-2-0.dll;
         api-ms-win-core-windowserrorreporting-l1-1-0.dll;

package/Microsoft.ReactNative/Modules/LogBoxModule.cpp

@@ -19,6 +19,15 @@
 
 namespace Microsoft::ReactNative {
 
+LogBox::~LogBox() {
+#ifdef USE_FABRIC
+  if (m_hwnd) {
+    m_context.UIDispatcher().Post([hwnd = m_hwnd]() { DestroyWindow(hwnd); });
+    m_hwnd = nullptr;
+  }
+#endif
+}
+
 #ifdef USE_FABRIC
 constexpr PCWSTR c_logBoxWindowClassName = L"MS_REACTNATIVE_LOGBOX";
 constexpr auto CompHostProperty = L"CompHost";

package/Microsoft.ReactNative/Modules/LogBoxModule.h

@@ -14,6 +14,8 @@ REACT_MODULE(LogBox)
 struct LogBox : public std::enable_shared_from_this<LogBox> {
   using ModuleSpec = ReactNativeSpecs::LogBoxSpec;
 
+  ~LogBox();
+
   REACT_INIT(Initialize)
   void Initialize(winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept;
 

package/Microsoft.ReactNative/Modules/SampleTurboModule.cpp

@@ -0,0 +1,104 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+#include "pch.h"
+#include "SampleTurboModule.h"
+
+namespace Microsoft::ReactNative {
+
+void SampleTurboModule::Initialize(winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept {
+  m_reactContext = reactContext;
+}
+
+ReactNativeSpecs::SampleTurboModuleSpec_Constants SampleTurboModule::GetConstants() noexcept {
+  ReactNativeSpecs::SampleTurboModuleSpec_Constants constants;
+  constants.const1 = true;
+  constants.const2 = 375;
+  constants.const3 = "something";
+  return constants;
+}
+
+void SampleTurboModule::voidFunc() noexcept {}
+
+bool SampleTurboModule::getBool(bool arg) noexcept {
+  return arg;
+}
+
+double SampleTurboModule::getEnum(double arg) noexcept {
+  return arg;
+}
+
+double SampleTurboModule::getNumber(double arg) noexcept {
+  return arg;
+}
+
+std::string SampleTurboModule::getString(std::string arg) noexcept {
+  return std::string(arg);
+}
+
+::React::JSValueArray SampleTurboModule::getArray(::React::JSValueArray &&arg) noexcept {
+  return arg.Copy();
+}
+
+::React::JSValue SampleTurboModule::getObject(::React::JSValue &&arg) noexcept {
+  assert(arg.Type() == ::React::JSValueType::Object);
+  return arg.Copy();
+}
+
+::React::JSValue SampleTurboModule::getUnsafeObject(::React::JSValue &&arg) noexcept {
+  assert(arg.Type() == ::React::JSValueType::Object);
+  return arg.Copy();
+}
+
+double SampleTurboModule::getRootTag(double arg) noexcept {
+  // TODO: Proper impl
+  return arg;
+}
+
+::React::JSValue SampleTurboModule::getValue(double x, std::string y, ::React::JSValue &&z) noexcept {
+  return ::React::JSValueObject{
+      {"x", x},
+      {"y", y},
+      {"z", z.Copy()},
+  };
+}
+
+void SampleTurboModule::getValueWithCallback(std::function<void(std::string)> const &callback) noexcept {
+  callback("value from callback!");
+}
+
+void SampleTurboModule::getValueWithPromise(bool error, ::React::ReactPromise<std::string> &&result) noexcept {
+  if (error) {
+    result.Reject("intentional promise rejection");
+  } else {
+    result.Resolve("result!");
+  }
+}
+
+void SampleTurboModule::voidFuncThrows() noexcept {
+  // TODO: Proper impl
+}
+
+::React::JSValue SampleTurboModule::getObjectThrows(::React::JSValue &&arg) noexcept {
+  // TODO: Proper impl
+  return nullptr;
+}
+
+void SampleTurboModule::promiseThrows(::React::ReactPromise<void> &&result) noexcept {
+  // TODO: Proper impl
+}
+
+void SampleTurboModule::voidFuncAssert() noexcept {
+  // TODO: Proper impl
+}
+
+::React::JSValue SampleTurboModule::getObjectAssert(::React::JSValue &&arg) noexcept {
+  // TODO: Proper impl
+  return nullptr;
+}
+
+void SampleTurboModule::promiseAssert(::React::ReactPromise<void> &&result) noexcept {
+  // TODO: Proper impl
+}
+
+} // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/Modules/SampleTurboModule.h

@@ -0,0 +1,78 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+#pragma once
+
+#include "codegen/NativeSampleTurboModuleSpec.g.h"
+#include <NativeModules.h>
+
+namespace Microsoft::ReactNative {
+
+REACT_MODULE(SampleTurboModule)
+struct SampleTurboModule {
+  using ModuleSpec = ReactNativeSpecs::SampleTurboModuleSpec;
+
+  REACT_INIT(Initialize)
+  void Initialize(winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept;
+
+  REACT_GET_CONSTANTS(GetConstants)
+  ReactNativeSpecs::SampleTurboModuleSpec_Constants GetConstants() noexcept;
+
+  REACT_METHOD(voidFunc)
+  void voidFunc() noexcept;
+
+  REACT_SYNC_METHOD(getBool)
+  bool getBool(bool arg) noexcept;
+
+  REACT_SYNC_METHOD(getEnum)
+  double getEnum(double arg) noexcept;
+
+  REACT_SYNC_METHOD(getNumber)
+  double getNumber(double arg) noexcept;
+
+  REACT_SYNC_METHOD(getString)
+  std::string getString(std::string arg) noexcept;
+
+  REACT_SYNC_METHOD(getArray)
+  ::React::JSValueArray getArray(::React::JSValueArray &&arg) noexcept;
+
+  REACT_SYNC_METHOD(getObject)
+  ::React::JSValue getObject(::React::JSValue &&arg) noexcept;
+
+  REACT_SYNC_METHOD(getUnsafeObject)
+  ::React::JSValue getUnsafeObject(::React::JSValue &&arg) noexcept;
+
+  REACT_SYNC_METHOD(getRootTag)
+  double getRootTag(double arg) noexcept;
+
+  REACT_SYNC_METHOD(getValue)
+  ::React::JSValue getValue(double x, std::string y, ::React::JSValue &&z) noexcept;
+
+  REACT_METHOD(getValueWithCallback)
+  void getValueWithCallback(std::function<void(std::string)> const &callback) noexcept;
+
+  REACT_METHOD(getValueWithPromise)
+  void getValueWithPromise(bool error, ::React::ReactPromise<std::string> &&result) noexcept;
+
+  REACT_METHOD(voidFuncThrows)
+  void voidFuncThrows() noexcept;
+
+  REACT_SYNC_METHOD(getObjectThrows)
+  ::React::JSValue getObjectThrows(::React::JSValue &&arg) noexcept;
+
+  REACT_METHOD(promiseThrows)
+  void promiseThrows(::React::ReactPromise<void> &&result) noexcept;
+
+  REACT_METHOD(voidFuncAssert)
+  void voidFuncAssert() noexcept;
+
+  REACT_SYNC_METHOD(getObjectAssert)
+  ::React::JSValue getObjectAssert(::React::JSValue &&arg) noexcept;
+
+  REACT_METHOD(promiseAssert)
+  void promiseAssert(::React::ReactPromise<void> &&result) noexcept;
+
+ private:
+  winrt::Microsoft::ReactNative::ReactContext m_reactContext;
+};
+
+} // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/ReactCoreInjection.h

@@ -53,7 +53,6 @@ struct ReactCoreInjection : ReactCoreInjectionT<ReactCoreInjection> {
   static uint64_t GetTopLevelWindowId(const IReactPropertyBag &properties) noexcept;
   static void SetTopLevelWindowId(const IReactPropertyBag &properties, uint64_t windowId) noexcept;
 
-  static ITimer CreateTimer(const IReactPropertyBag &properties);
   static TimerFactory GetTimerFactory(const IReactPropertyBag &properties) noexcept;
   static void SetTimerFactory(const IReactPropertyBag &properties, const TimerFactory &timerFactory) noexcept;
 };

package/Microsoft.ReactNative/ReactHost/MsoReactContext.cpp

@@ -170,13 +170,6 @@ ReactContext::ReactContext(
       m_properties{winrt::make<WeakRefPropertyBag>(properties)},
       m_notifications{notifications} {}
 
-void ReactContext::Destroy() noexcept {
-  if (auto notificationService =
-          winrt::get_self<winrt::Microsoft::ReactNative::implementation::ReactNotificationService>(m_notifications)) {
-    notificationService->UnsubscribeAll();
-  }
-}
-
 winrt::Microsoft::ReactNative::IReactPropertyBag ReactContext::Properties() const noexcept {
   return m_properties;
 }

package/Microsoft.ReactNative/ReactHost/MsoReactContext.h

@@ -45,11 +45,6 @@ class ReactContext final : public Mso::UnknownObject<IReactContext> {
       winrt::Microsoft::ReactNative::IReactPropertyBag const &properties,
       winrt::Microsoft::ReactNative::IReactNotificationService const &notifications) noexcept;
 
-  // ReactContext may have longer lifespan than ReactInstance.
-  // The ReactInstance uses the Destroy method to enforce the ReactContext cleanup
-  // when the ReactInstance is destroyed.
-  void Destroy() noexcept;
-
  public: // IReactContext
   winrt::Microsoft::ReactNative::IReactPropertyBag Properties() const noexcept override;
   winrt::Microsoft::ReactNative::IReactNotificationService Notifications() const noexcept override;

package/Microsoft.ReactNative/ReactHost/ReactInstanceWin.cpp

@@ -39,6 +39,7 @@
 #include "Modules/ExceptionsManager.h"
 #include "Modules/PlatformConstantsWinModule.h"
 #include "Modules/ReactRootViewTagGenerator.h"
+#include "Modules/SampleTurboModule.h"
 #include "Modules/SourceCode.h"
 #include "Modules/StatusBarManager.h"
 #include "Modules/Timing.h"
@@ -399,6 +400,13 @@ void ReactInstanceWin::LoadModules(
   }
 #endif
 
+  if (!m_options.UseWebDebugger()) {
+    turboModulesProvider->AddModuleProvider(
+        L"SampleTurboModule",
+        winrt::Microsoft::ReactNative::MakeTurboModuleProvider<::Microsoft::ReactNative::SampleTurboModule>(),
+        false);
+  }
+
   if (devSettings->useTurboModulesOnly) {
     ::Microsoft::ReactNative::ExceptionsManager::SetRedBoxHander(
         winrt::Microsoft::ReactNative::ReactPropertyBag(m_reactContext->Properties()), m_redboxHandler);
@@ -676,8 +684,16 @@ void ReactInstanceWin::InitializeBridgeless() noexcept {
                 return turboModuleManager->getModule(name);
               };
 
+              // Use a legacy native module binding that always returns null
+              // This means that calls to NativeModules.XXX will always return null, rather than crashing on access
+              auto legacyNativeModuleBinding =
+                  [](const std::string & /*name*/) -> std::shared_ptr<facebook::react::TurboModule> { return nullptr; };
+
               facebook::react::TurboModuleBinding::install(
-                  runtime, std::function(binding), nullptr, m_options.TurboModuleProvider->LongLivedObjectCollection());
+                  runtime,
+                  std::function(binding),
+                  std::function(legacyNativeModuleBinding),
+                  m_options.TurboModuleProvider->LongLivedObjectCollection());
 
               auto componentDescriptorRegistry =
                   Microsoft::ReactNative::WindowsComponentDescriptorRegistry::FromProperties(

package/Microsoft.ReactNative/ReactInstanceSettingsBuilder.cpp

@@ -0,0 +1,59 @@
+#include "pch.h"
+#include "ReactInstanceSettingsBuilder.h"
+#include "ReactInstanceSettingsBuilder.g.cpp"
+#include "ReactInstanceSettings.h"
+
+namespace winrt::ReactNative {
+using namespace winrt::Microsoft::ReactNative;
+}
+
+namespace winrt::UI {
+using namespace winrt::Microsoft::UI;
+}
+
+namespace winrt::Microsoft::ReactNative::implementation {
+ReactInstanceSettingsBuilder::ReactInstanceSettingsBuilder() {
+  m_reactInstanceSettings = winrt::make<winrt::ReactNative::implementation::ReactInstanceSettings>();
+}
+
+winrt::ReactNative::ReactInstanceSettings ReactInstanceSettingsBuilder::ReactInstanceSettings() {
+  return m_reactInstanceSettings;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::UseDirectDebugger(bool const &state) {
+  m_reactInstanceSettings.UseDirectDebugger(state);
+
+  return *this;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::UseDeveloperSupport(bool const &state) {
+  m_reactInstanceSettings.UseDeveloperSupport(state);
+
+  return *this;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::BundleRootPath(hstring const &path) {
+  m_reactInstanceSettings.BundleRootPath(std::wstring(L"file://").append(path.c_str()).append(L"\\Bundle\\").c_str());
+
+  return *this;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::DebugBundlePath(hstring const &path) {
+  m_reactInstanceSettings.DebugBundlePath(path.c_str());
+
+  return *this;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::JavaScriptBundleFile(
+    hstring const &file) {
+  m_reactInstanceSettings.JavaScriptBundleFile(file.c_str());
+
+  return *this;
+}
+
+winrt::ReactNative::ReactInstanceSettingsBuilder ReactInstanceSettingsBuilder::UseFastRefresh(bool const &state) {
+  m_reactInstanceSettings.UseFastRefresh(state);
+
+  return *this;
+}
+} // namespace winrt::Microsoft::ReactNative::implementation

package/Microsoft.ReactNative/ReactInstanceSettingsBuilder.h

@@ -0,0 +1,23 @@
+#pragma once
+#include "ReactInstanceSettingsBuilder.g.h"
+
+namespace winrt::Microsoft::ReactNative::implementation {
+struct ReactInstanceSettingsBuilder : ReactInstanceSettingsBuilderT<ReactInstanceSettingsBuilder> {
+  ReactInstanceSettingsBuilder();
+
+  winrt::Microsoft::ReactNative::ReactInstanceSettings ReactInstanceSettings();
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder UseDirectDebugger(bool const &state);
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder UseDeveloperSupport(bool const &state);
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder BundleRootPath(hstring const &path);
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder DebugBundlePath(hstring const &path);
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder JavaScriptBundleFile(hstring const &file);
+  winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder UseFastRefresh(bool const &state);
+
+ private:
+  winrt::Microsoft::ReactNative::ReactInstanceSettings m_reactInstanceSettings{nullptr};
+};
+} // namespace winrt::Microsoft::ReactNative::implementation
+namespace winrt::Microsoft::ReactNative::factory_implementation {
+struct ReactInstanceSettingsBuilder
+    : ReactInstanceSettingsBuilderT<ReactInstanceSettingsBuilder, implementation::ReactInstanceSettingsBuilder> {};
+} // namespace winrt::Microsoft::ReactNative::factory_implementation

package/Microsoft.ReactNative/ReactNativeAppBuilder.cpp

@@ -0,0 +1,179 @@
+#include "pch.h"
+#include "ReactNativeAppBuilder.h"
+#include "ReactNativeAppBuilder.g.cpp"
+#include "IReactDispatcher.h"
+#include "ReactNativeHost.h"
+#include "ReactNativeWin32App.h"
+#include "winrt/Microsoft.UI.Composition.h"
+#include "winrt/Microsoft.UI.Dispatching.h"
+#include "winrt/Microsoft.UI.Windowing.h"
+#include "winrt/microsoft.UI.Interop.h"
+
+// Scaling factor for the window's content based on the DPI of the display where the window is located.
+float ScaleFactor(HWND hwnd) noexcept {
+  return GetDpiForWindow(hwnd) / static_cast<float>(USER_DEFAULT_SCREEN_DPI);
+}
+
+void UpdateRootViewSizeToAppWindow(
+    winrt::Microsoft::ReactNative::ReactNativeIsland const &rootView,
+    winrt::Microsoft::UI::Windowing::AppWindow const &window) {
+  auto hwnd = winrt::Microsoft::UI::GetWindowFromWindowId(window.Id());
+  auto scaleFactor = ScaleFactor(hwnd);
+  winrt::Windows::Foundation::Size size{
+      window.ClientSize().Width / scaleFactor, window.ClientSize().Height / scaleFactor};
+  // Do not relayout when minimized
+  if (window.Presenter().as<winrt::Microsoft::UI::Windowing::OverlappedPresenter>().State() !=
+      winrt::Microsoft::UI::Windowing::OverlappedPresenterState::Minimized) {
+    winrt::Microsoft::ReactNative::LayoutConstraints constraints;
+    constraints.LayoutDirection = winrt::Microsoft::ReactNative::LayoutDirection::Undefined;
+    constraints.MaximumSize = constraints.MinimumSize = size;
+    rootView.Arrange(constraints, {0, 0});
+  }
+}
+
+namespace winrt::ReactNative {
+using namespace winrt::Microsoft::ReactNative;
+}
+
+namespace winrt::UI {
+using namespace winrt::Microsoft::UI;
+}
+
+namespace winrt::Microsoft::ReactNative::implementation {
+ReactNativeAppBuilder::ReactNativeAppBuilder() {
+  m_reactNativeWin32App = winrt::make<implementation::ReactNativeWin32App>();
+}
+
+ReactNativeAppBuilder::~ReactNativeAppBuilder() {}
+
+winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::AddPackageProviders(
+    winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const
+        &packageProviders) {
+  for (auto const &provider : packageProviders) {
+    m_reactNativeWin32App.ReactNativeHost().PackageProviders().Append(provider);
+  }
+
+  return *this;
+}
+
+winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetReactInstanceSettings(
+    winrt::Microsoft::ReactNative::ReactInstanceSettings const &settings) {
+  m_reactNativeWin32App.ReactNativeHost().InstanceSettings(settings);
+
+  return *this;
+}
+
+winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetCompositor(
+    winrt::Microsoft::UI::Composition::Compositor const &compositor) {
+  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor(compositor);
+  return *this;
+}
+
+winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetAppWindow(
+    winrt::Microsoft::UI::Windowing::AppWindow const &appWindow) {
+  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->AppWindow(appWindow);
+
+  return *this;
+}
+
+winrt::Microsoft::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetReactViewOptions(
+    winrt::Microsoft::ReactNative::ReactViewOptions const &reactViewOptions) {
+  m_reactViewOptions = reactViewOptions;
+
+  return *this;
+}
+
+winrt::ReactNative::ReactNativeWin32App ReactNativeAppBuilder::Build() {
+  if (m_reactNativeWin32App.Compositor() == nullptr) {
+    // Create a DispatcherQueue for this thread.  This is needed for Composition, Content, and
+    // Input APIs.
+    auto dispatcherQueueController =
+        winrt::Microsoft::UI::Dispatching::DispatcherQueueController::CreateOnCurrentThread();
+
+    m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DispatchQueueController(
+        dispatcherQueueController);
+
+    // Create the compositor on behalf of the App Developer
+    auto compositor = winrt::Microsoft::UI::Composition::Compositor();
+    m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor(compositor);
+  }
+
+  // Create the AppWindow if the developer doesn't provide one
+  if (m_reactNativeWin32App.AppWindow() == nullptr) {
+    auto appWindow = winrt::Microsoft::UI::Windowing::AppWindow::Create();
+    appWindow.Title(L"SampleApplication");
+    appWindow.Resize({1000, 1000});
+    appWindow.Show();
+
+    m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->AppWindow(appWindow);
+  }
+
+  // Currently set the property to use current thread dispatcher as a default UI dispatcher.
+  // TODO: Provision for setting dispatcher based on the thread dispatcherQueueController is created.
+  m_reactNativeWin32App.ReactNativeHost().InstanceSettings().Properties().Set(
+      ReactDispatcherHelper::UIDispatcherProperty(), ReactDispatcherHelper::UIThreadDispatcher());
+
+  auto hwnd{winrt::UI::GetWindowFromWindowId(m_reactNativeWin32App.AppWindow().Id())};
+
+  winrt::ReactNative::ReactCoreInjection::SetTopLevelWindowId(
+      m_reactNativeWin32App.ReactNativeHost().InstanceSettings().Properties(), reinterpret_cast<uint64_t>(hwnd));
+
+  winrt::ReactNative::Composition::CompositionUIService::SetCompositor(
+      m_reactNativeWin32App.ReactNativeHost().InstanceSettings(), m_reactNativeWin32App.Compositor());
+
+  // Start the react-native instance, which will create a JavaScript runtime and load the applications bundle.
+  m_reactNativeWin32App.ReactNativeHost().ReloadInstance();
+
+  // Create a RootView which will present a react-native component
+  auto reactNativeIsland = winrt::Microsoft::ReactNative::ReactNativeIsland(m_reactNativeWin32App.Compositor());
+  reactNativeIsland.ReactViewHost(winrt::Microsoft::ReactNative::ReactCoreInjection::MakeViewHost(
+      m_reactNativeWin32App.ReactNativeHost(), m_reactViewOptions));
+
+  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->ReactNativeIsland(
+      std::move(reactNativeIsland));
+
+  // Update the size of the RootView when the AppWindow changes size
+  m_reactNativeWin32App.AppWindow().Changed(
+      [wkRootView = winrt::make_weak(m_reactNativeWin32App.ReactNativeIsland())](
+          winrt::Microsoft::UI::Windowing::AppWindow const &window,
+          winrt::Microsoft::UI::Windowing::AppWindowChangedEventArgs const &args) {
+        if (args.DidSizeChange() || args.DidVisibilityChange()) {
+          if (auto rootView = wkRootView.get()) {
+            UpdateRootViewSizeToAppWindow(rootView, window);
+          }
+        }
+      });
+
+  // Quit application when main window is closed
+  m_reactNativeWin32App.AppWindow().Destroying([this](
+                                                   winrt::Microsoft::UI::Windowing::AppWindow const &window,
+                                                   winrt::Windows::Foundation::IInspectable const & /*args*/) {
+    // Before we shutdown the application - unload the ReactNativeHost to give the javascript a chance to save any
+    // state
+    auto async = m_reactNativeWin32App.ReactNativeHost().UnloadInstance();
+    async.Completed([this](auto asyncInfo, winrt::Windows::Foundation::AsyncStatus asyncStatus) {
+      assert(asyncStatus == winrt::Windows::Foundation::AsyncStatus::Completed);
+      m_reactNativeWin32App.ReactNativeHost().InstanceSettings().UIDispatcher().Post([]() { PostQuitMessage(0); });
+    });
+  });
+
+  // DesktopChildSiteBridge create a ContentSite that can host the RootView ContentIsland
+  auto desktopChildSiteBridge = winrt::Microsoft::UI::Content::DesktopChildSiteBridge::Create(
+      m_reactNativeWin32App.Compositor(), m_reactNativeWin32App.AppWindow().Id());
+
+  desktopChildSiteBridge.Connect(m_reactNativeWin32App.ReactNativeIsland().Island());
+
+  desktopChildSiteBridge.ResizePolicy(winrt::Microsoft::UI::Content::ContentSizePolicy::ResizeContentToParentWindow);
+
+  auto scaleFactor = ScaleFactor(hwnd);
+  m_reactNativeWin32App.ReactNativeIsland().ScaleFactor(scaleFactor);
+
+  UpdateRootViewSizeToAppWindow(reactNativeIsland, m_reactNativeWin32App.AppWindow());
+
+  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DesktopChildSiteBridge(
+      std::move(desktopChildSiteBridge));
+
+  return m_reactNativeWin32App;
+}
+
+} // namespace winrt::Microsoft::ReactNative::implementation

package/Microsoft.ReactNative/ReactNativeAppBuilder.h

@@ -0,0 +1,35 @@
+#pragma once
+#include "ReactNativeAppBuilder.g.h"
+#include <winrt/Microsoft.UI.Content.h>
+
+namespace winrt::Microsoft::ReactNative::implementation {
+struct ReactNativeAppBuilder : ReactNativeAppBuilderT<ReactNativeAppBuilder> {
+  ReactNativeAppBuilder();
+
+  ~ReactNativeAppBuilder();
+
+  winrt::Microsoft::ReactNative::ReactNativeAppBuilder AddPackageProviders(
+      winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const
+          &packageProviders);
+  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetReactInstanceSettings(
+      winrt::Microsoft::ReactNative::ReactInstanceSettings const &settings);
+
+  // TODO: Currently, SetCompositor API is not exposed to the developer.
+  // Compositor depends on the DispatcherQueue created by DispatcherQueueController on a current thread
+  // or dedicated thread. So we also have to make a provision for setting DispatcherQueueController.
+  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetCompositor(
+      winrt::Microsoft::UI::Composition::Compositor const &compositor);
+  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetAppWindow(
+      winrt::Microsoft::UI::Windowing::AppWindow const &appWindow);
+  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetReactViewOptions(
+      winrt::Microsoft::ReactNative::ReactViewOptions const &reactViewOptions);
+  winrt::Microsoft::ReactNative::ReactNativeWin32App Build();
+
+ private:
+  winrt::Microsoft::ReactNative::ReactViewOptions m_reactViewOptions{};
+  winrt::Microsoft::ReactNative::ReactNativeWin32App m_reactNativeWin32App{nullptr};
+};
+} // namespace winrt::Microsoft::ReactNative::implementation
+namespace winrt::Microsoft::ReactNative::factory_implementation {
+struct ReactNativeAppBuilder : ReactNativeAppBuilderT<ReactNativeAppBuilder, implementation::ReactNativeAppBuilder> {};
+} // namespace winrt::Microsoft::ReactNative::factory_implementation