react-native-windows 0.74.20 → 0.74.22

package/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.h

@@ -2,6 +2,9 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
+#include <Fabric/AbiComponentDescriptor.h>
+#include <Fabric/AbiViewComponentDescriptor.h>
+#include <react/renderer/componentregistry/ComponentDescriptorProvider.h>
 #include <react/renderer/core/ReactPrimitives.h>
 #include "winrt/Microsoft.ReactNative.Composition.Experimental.h"
 #include "winrt/Microsoft.ReactNative.Composition.h"
@@ -16,7 +19,7 @@ struct ReactCompositionViewComponentBuilder : winrt::implements<
   ReactCompositionViewComponentBuilder() noexcept;
 
  public: // IReactViewComponentBuilder
-  void SetCreateComponentView(ComponentViewFactory impl) noexcept;
+  void SetComponentViewInitializer(const ComponentViewInitializer &initializer) noexcept;
   void SetCreateProps(ViewPropsFactory impl) noexcept;
 
   // (Object handle, Microsoft.ReactNative.IComponentState state) => void
@@ -28,8 +31,19 @@ struct ReactCompositionViewComponentBuilder : winrt::implements<
   void SetMeasureContentHandler(MeasureContentHandler impl) noexcept;
   void SetLayoutHandler(LayoutHandler impl) noexcept;
 
+  void SetCustomCommandHandler(HandleCommandDelegate impl) noexcept;
+  void SetFinalizeUpdateHandler(UpdateFinalizerDelegate impl) noexcept;
+  void SetUpdatePropsHandler(UpdatePropsDelegate impl) noexcept;
+  void SetUpdateStateHandler(UpdateStateDelegate impl) noexcept;
+  void SetUpdateEventEmitterHandler(UpdateEventEmitterDelegate impl) noexcept;
+  void SetMountChildComponentViewHandler(MountChildComponentViewDelegate impl) noexcept;
+  void SetUnmountChildComponentViewHandler(UnmountChildComponentViewDelegate impl) noexcept;
+
  public: // Composition::IReactCompositionViewComponentBuilder
-  void SetCreateViewComponentView(CompositionViewComponentViewFactory impl) noexcept;
+  void SetViewComponentViewInitializer(const ViewComponentViewInitializer &initializer) noexcept;
+  void SetContentIslandComponentViewInitializer(const ComponentIslandComponentViewInitializer &initializer) noexcept;
+
+  void SetCreateVisualHandler(CreateVisualDelegate impl) noexcept;
 
  public:
   IComponentProps CreateProps(ViewProps props) noexcept;
@@ -39,7 +53,7 @@ struct ReactCompositionViewComponentBuilder : winrt::implements<
       winrt::Microsoft::ReactNative::IComponentProps props) noexcept;
   MeasureContentHandler MeasureContentHandler() const noexcept;
   LayoutHandler LayoutHandler() const noexcept;
-  bool IsViewComponent() const noexcept;
+  facebook::react::ComponentDescriptorConstructor *GetComponentDescriptorProvider() const noexcept;
 
   winrt::Microsoft::ReactNative::ComponentView CreateView(
       const IReactContext &reactContext,
@@ -47,15 +61,29 @@ struct ReactCompositionViewComponentBuilder : winrt::implements<
       const Experimental::ICompositionContext &context) noexcept;
 
  private:
+  void InitializeComponentView(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept;
+
   ViewPropsFactory m_propsFactory;
   ViewShadowNodeFactory m_shadowNodeFactory;
   ViewShadowNodeCloner m_shadowNodeCloner;
   InitialStateDataFactory m_initialStateDataFactory;
   winrt::Microsoft::ReactNative::MeasureContentHandler m_measureContent;
   winrt::Microsoft::ReactNative::LayoutHandler m_layoutHandler;
+  std::function<winrt::Microsoft::ReactNative::ComponentView(
+      const IReactContext &reactContext,
+      int32_t tag,
+      const Experimental::ICompositionContext &context)>
+      m_fnCreateView;
+  std::function<facebook::react::ComponentDescriptorConstructor *()> m_descriptorConstructorFactory;
+  winrt::Microsoft::ReactNative::HandleCommandDelegate m_customCommandHandler;
+  winrt::Microsoft::ReactNative::UpdateFinalizerDelegate m_finalizeUpdateHandler;
+  winrt::Microsoft::ReactNative::UpdatePropsDelegate m_updatePropsHandler;
+  winrt::Microsoft::ReactNative::UpdateStateDelegate m_updateStateHandler;
+  winrt::Microsoft::ReactNative::UpdateEventEmitterDelegate m_updateEventEmitterHandler;
+  winrt::Microsoft::ReactNative::MountChildComponentViewDelegate m_mountChildComponentViewHandler;
+  winrt::Microsoft::ReactNative::UnmountChildComponentViewDelegate m_unmountChildComponentViewHandler;
 
-  ComponentViewFactory m_createComponentView{nullptr};
-  CompositionViewComponentViewFactory m_createView{nullptr};
+  winrt::Microsoft::ReactNative::Composition::CreateVisualDelegate m_createVisualHandler;
 };
 
 } // namespace winrt::Microsoft::ReactNative::Composition

package/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.cpp

@@ -58,10 +58,6 @@ struct CompositionReactViewInstance
   void UpdateRootView() noexcept;
   void UninitRootView() noexcept;
 
- private:
-  template <class TAction>
-  Mso::Future<void> PostInUIQueue(TAction &&action) noexcept;
-
  private:
   winrt::weak_ref<winrt::Microsoft::ReactNative::implementation::ReactNativeIsland> m_weakRootControl;
   IReactDispatcher m_uiDispatcher{nullptr};
@@ -102,50 +98,46 @@ void CompositionReactViewInstance::UninitRootView() noexcept {
   }
 }
 
-//===========================================================================
-// ReactViewInstance inline implementation
-//===========================================================================
-
-template <class TAction>
-inline Mso::Future<void> CompositionReactViewInstance::PostInUIQueue(TAction &&action) noexcept {
-  // ReactViewInstance has shorter lifetime than ReactRootControl. Thus, we capture this WeakPtr.
-  auto promise = Mso::Promise<void>();
-
-  m_uiDispatcher.Post([promise, weakThis{get_weak()}, action{std::forward<TAction>(action)}]() mutable {
-    if (auto strongThis = weakThis.get()) {
-      if (auto rootControl = strongThis->m_weakRootControl.get()) {
-        action(rootControl);
-        promise.SetValue();
-        return;
-      }
-    }
-    promise.TryCancel();
-  });
-
-  return promise.AsFuture();
-}
-
-void ApplyConstraints(
+void ReactNativeIsland::ApplyConstraints(
     const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraintsIn,
-    facebook::react::LayoutConstraints &layoutConstraintsOut) noexcept {
+    facebook::react::LayoutConstraints &layoutConstraintsOut) const noexcept {
   layoutConstraintsOut.minimumSize = {layoutConstraintsIn.MinimumSize.Width, layoutConstraintsIn.MinimumSize.Height};
   layoutConstraintsOut.maximumSize = {layoutConstraintsIn.MaximumSize.Width, layoutConstraintsIn.MaximumSize.Height};
-  layoutConstraintsOut.layoutDirection =
-      static_cast<facebook::react::LayoutDirection>(layoutConstraintsIn.LayoutDirection);
+  if (layoutConstraintsIn.LayoutDirection == winrt::Microsoft::ReactNative::LayoutDirection::Undefined) {
+    if (m_island) {
+      layoutConstraintsOut.layoutDirection =
+          (m_island.LayoutDirection() == winrt::Microsoft::UI::Content::ContentLayoutDirection::LeftToRight)
+          ? facebook::react::LayoutDirection::LeftToRight
+          : facebook::react::LayoutDirection::RightToLeft;
+    } else if (m_hwnd) {
+      auto styles = GetWindowLongPtrW(m_hwnd, GWL_EXSTYLE);
+      layoutConstraintsOut.layoutDirection = ((styles & WS_EX_LAYOUTRTL) == WS_EX_LAYOUTRTL)
+          ? facebook::react::LayoutDirection::RightToLeft
+          : facebook::react::LayoutDirection::LeftToRight;
+    }
+  } else {
+    layoutConstraintsOut.layoutDirection =
+        static_cast<facebook::react::LayoutDirection>(layoutConstraintsIn.LayoutDirection);
+  }
 }
 
-ReactNativeIsland::ReactNativeIsland() noexcept {}
-
-#ifdef USE_WINUI3
 ReactNativeIsland::ReactNativeIsland(const winrt::Microsoft::UI::Composition::Compositor &compositor) noexcept
-    : m_compositor(compositor) {}
-#endif
+    : m_compositor(compositor),
+      m_layoutConstraints({{0, 0}, {0, 0}, winrt::Microsoft::ReactNative::LayoutDirection::Undefined}) {
+  InitTextScaleMultiplier();
+}
+
+ReactNativeIsland::ReactNativeIsland() noexcept : ReactNativeIsland(nullptr) {}
 
 ReactNativeIsland::~ReactNativeIsland() noexcept {
 #ifdef USE_WINUI3
-  if (m_island && m_island.IsConnected()) {
+  if (m_island) {
     m_island.AutomationProviderRequested(m_islandAutomationProviderRequestedToken);
     m_island.StateChanged(m_islandStateChangedToken);
+#ifdef USE_EXPERIMENTAL_WINUI3
+    m_island.Connected(m_islandConnectedToken);
+    m_island.Disconnected(m_islandDisconnectedToken);
+#endif
   }
 #endif
 
@@ -165,6 +157,7 @@ void ReactNativeIsland::ReactViewHost(winrt::Microsoft::ReactNative::IReactViewH
   }
 
   if (m_reactViewHost) {
+    UninitRootView();
     m_reactViewHost.DetachViewInstance();
   }
 
@@ -199,6 +192,12 @@ void ReactNativeIsland::AddRenderedVisual(
   assert(!m_hasRenderedVisual);
   InternalRootVisual().InsertAt(visual, 0);
   m_hasRenderedVisual = true;
+
+  if (m_mounted) {
+    if (auto componentView = GetComponentView()) {
+      componentView->onMounted();
+    }
+  }
 }
 
 void ReactNativeIsland::RemoveRenderedVisual(
@@ -265,6 +264,10 @@ void ReactNativeIsland::ScaleFactor(float value) noexcept {
   }
 }
 
+float ReactNativeIsland::FontSizeMultiplier() const noexcept {
+  return m_textScaleMultiplier;
+}
+
 int64_t ReactNativeIsland::RootTag() const noexcept {
   return m_rootTag;
 }
@@ -330,7 +333,7 @@ winrt::IInspectable ReactNativeIsland::GetUiaProvider() noexcept {
   if (m_uiaProvider == nullptr) {
     m_uiaProvider =
         winrt::make<winrt::Microsoft::ReactNative::implementation::CompositionRootAutomationProvider>(*this);
-    if (m_hwnd) {
+    if (m_hwnd && !m_island) {
       auto pRootProvider =
           static_cast<winrt::Microsoft::ReactNative::implementation::CompositionRootAutomationProvider *>(
               m_uiaProvider.as<IRawElementProviderSimple>().get());
@@ -346,6 +349,10 @@ void ReactNativeIsland::SetWindow(uint64_t hwnd) noexcept {
   m_hwnd = reinterpret_cast<HWND>(hwnd);
 }
 
+HWND ReactNativeIsland::GetHwndForParenting() noexcept {
+  return m_hwnd;
+}
+
 int64_t ReactNativeIsland::SendMessage(uint32_t msg, uint64_t wParam, int64_t lParam) noexcept {
   if (m_rootTag == -1)
     return 0;
@@ -365,7 +372,7 @@ int64_t ReactNativeIsland::SendMessage(uint32_t msg, uint64_t wParam, int64_t lP
 bool ReactNativeIsland::CapturePointer(
     const winrt::Microsoft::ReactNative::Composition::Input::Pointer &pointer,
     facebook::react::Tag tag) noexcept {
-  if (m_hwnd) {
+  if (m_hwnd && !m_island) {
     SetCapture(m_hwnd);
   }
   return m_CompositionEventHandler->CapturePointer(pointer, tag);
@@ -375,7 +382,7 @@ void ReactNativeIsland::ReleasePointerCapture(
     const winrt::Microsoft::ReactNative::Composition::Input::Pointer &pointer,
     facebook::react::Tag tag) noexcept {
   if (m_CompositionEventHandler->ReleasePointerCapture(pointer, tag)) {
-    if (m_hwnd) {
+    if (m_hwnd && !m_island) {
       if (m_hwnd == GetCapture()) {
         ReleaseCapture();
       }
@@ -398,6 +405,7 @@ void ReactNativeIsland::InitRootView(
   m_context = winrt::Microsoft::ReactNative::ReactContext(std::move(context));
   m_reactViewOptions = std::move(viewOptions);
   m_CompositionEventHandler = std::make_shared<::Microsoft::ReactNative::CompositionEventHandler>(m_context, *this);
+  m_CompositionEventHandler->Initialize();
 
   UpdateRootViewInternal();
 
@@ -440,8 +448,9 @@ void ReactNativeIsland::UninitRootView() noexcept {
     uiManager->stopSurface(static_cast<facebook::react::SurfaceId>(RootTag()));
 
     // This is needed to ensure that the unmount JS logic is completed before the the instance is shutdown during
-    // instance destruction. Aligns with similar code in ReactInstanceWin::DetachRootView for paper Future: Instead this
-    // method should return a Promise, which should be resolved when the JS logic is complete.
+    // instance destruction. Aligns with similar code in ReactInstanceWin::DetachRootView for paper Future: Instead
+    // this method should return a Promise, which should be resolved when the JS logic is complete. The task will auto
+    // set the event on destruction to ensure that the event is set if the JS Queue has already been shutdown
     Mso::ManualResetEvent mre;
     m_context.JSDispatcher().Post([&]() { mre.Set(); });
     mre.Wait();
@@ -506,9 +515,8 @@ facebook::react::AttributedStringBox CreateLoadingAttributedString() noexcept {
   return facebook::react::AttributedStringBox{attributedString};
 }
 
-facebook::react::Size MeasureLoading(
-    const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints,
-    float scaleFactor) {
+facebook::react::Size ReactNativeIsland::MeasureLoading(
+    const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints) const noexcept {
   facebook::react::LayoutConstraints fbLayoutConstraints;
   ApplyConstraints(layoutConstraints, fbLayoutConstraints);
 
@@ -521,7 +529,7 @@ facebook::react::Size MeasureLoading(
   textLayout->GetMetrics(&tm);
 
   return fbLayoutConstraints.clamp(
-      {loadingActivityHorizontalOffset * scaleFactor + tm.width, loadingBarHeight * scaleFactor});
+      {loadingActivityHorizontalOffset * m_scaleFactor + tm.width, loadingBarHeight * m_scaleFactor});
 }
 
 winrt::event_token ReactNativeIsland::SizeChanged(
@@ -551,7 +559,7 @@ void ReactNativeIsland::NotifySizeChanged() noexcept {
   if (rootComponentView) {
     size = rootComponentView->layoutMetrics().frame.size;
   } else if (m_loadingVisual) {
-    size = MeasureLoading(m_layoutConstraints, m_scaleFactor);
+    size = MeasureLoading(m_layoutConstraints);
   }
 
   m_size = {size.width, size.height};
@@ -645,11 +653,34 @@ void ReactNativeIsland::ShowInstanceLoading() noexcept {
   InternalRootVisual().InsertAt(m_loadingVisual, m_hasRenderedVisual ? 1 : 0);
 }
 
+void ReactNativeIsland::InitTextScaleMultiplier() noexcept {
+  m_uiSettings = winrt::Windows::UI::ViewManagement::UISettings();
+  m_textScaleMultiplier = static_cast<float>(m_uiSettings.TextScaleFactor());
+  m_textScaleChangedRevoker = m_uiSettings.TextScaleFactorChanged(
+      winrt::auto_revoke,
+      [this](const winrt::Windows::UI::ViewManagement::UISettings &uiSettings, const winrt::IInspectable &) {
+        if (m_context) {
+          m_context.UIDispatcher().Post(
+              [wkThis = get_weak(), textScaleMultiplier = static_cast<float>(uiSettings.TextScaleFactor())]() {
+                if (auto strongThis = wkThis.get()) {
+                  strongThis->m_textScaleMultiplier = textScaleMultiplier;
+                  strongThis->Arrange(strongThis->m_layoutConstraints, strongThis->m_viewportOffset);
+                }
+              });
+        }
+      });
+}
+
 winrt::Windows::Foundation::Size ReactNativeIsland::Measure(
     const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints,
-    const winrt::Windows::Foundation::Point &viewportOffset) const noexcept {
+    const winrt::Windows::Foundation::Point &viewportOffset) const {
   facebook::react::Size size{0, 0};
 
+  if (layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::LeftToRight &&
+      layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::RightToLeft &&
+      layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::Undefined)
+    winrt::throw_hresult(E_INVALIDARG);
+
   facebook::react::LayoutConstraints constraints;
   ApplyConstraints(layoutConstraints, constraints);
 
@@ -657,15 +688,14 @@ winrt::Windows::Foundation::Size ReactNativeIsland::Measure(
     if (auto fabricuiManager = ::Microsoft::ReactNative::FabricUIManager::FromProperties(
             winrt::Microsoft::ReactNative::ReactPropertyBag(m_context.Properties()))) {
       facebook::react::LayoutContext context;
-      // TODO scaling factor
+      context.fontSizeMultiplier = m_textScaleMultiplier;
       context.pointScaleFactor = static_cast<facebook::react::Float>(m_scaleFactor);
-      context.fontSizeMultiplier = static_cast<facebook::react::Float>(m_scaleFactor);
       context.viewportOffset = {viewportOffset.X, viewportOffset.Y};
 
       size = fabricuiManager->measureSurface(static_cast<facebook::react::SurfaceId>(m_rootTag), constraints, context);
     }
   } else if (m_loadingVisual) {
-    size = MeasureLoading(layoutConstraints, m_scaleFactor);
+    size = MeasureLoading(layoutConstraints);
   }
 
   auto clampedSize = constraints.clamp(size);
@@ -674,7 +704,12 @@ winrt::Windows::Foundation::Size ReactNativeIsland::Measure(
 
 void ReactNativeIsland::Arrange(
     const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints,
-    const winrt::Windows::Foundation::Point &viewportOffset) noexcept {
+    const winrt::Windows::Foundation::Point &viewportOffset) {
+  if (layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::LeftToRight &&
+      layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::RightToLeft &&
+      layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::Undefined)
+    winrt::throw_hresult(E_INVALIDARG);
+
   m_layoutConstraints = layoutConstraints;
   m_viewportOffset = viewportOffset;
   facebook::react::LayoutConstraints fbLayoutConstraints;
@@ -684,8 +719,8 @@ void ReactNativeIsland::Arrange(
     if (auto fabricuiManager = ::Microsoft::ReactNative::FabricUIManager::FromProperties(
             winrt::Microsoft::ReactNative::ReactPropertyBag(m_context.Properties()))) {
       facebook::react::LayoutContext context;
+      context.fontSizeMultiplier = m_textScaleMultiplier;
       context.pointScaleFactor = static_cast<facebook::react::Float>(m_scaleFactor);
-      context.fontSizeMultiplier = static_cast<facebook::react::Float>(m_scaleFactor);
       context.viewportOffset = {viewportOffset.X, viewportOffset.Y};
 
       fabricuiManager->constraintSurfaceLayout(
@@ -693,12 +728,11 @@ void ReactNativeIsland::Arrange(
     }
   } else if (m_loadingVisual) {
     // TODO: Resize to align loading
-    auto s = fbLayoutConstraints.clamp(MeasureLoading(layoutConstraints, m_scaleFactor));
+    auto s = fbLayoutConstraints.clamp(MeasureLoading(layoutConstraints));
     NotifySizeChanged();
   }
 }
 
-#ifdef USE_WINUI3
 winrt::Microsoft::UI::Content::ContentIsland ReactNativeIsland::Island() {
   if (!m_compositor) {
     return nullptr;
@@ -752,12 +786,59 @@ winrt::Microsoft::UI::Content::ContentIsland ReactNativeIsland::Island() {
             if (args.DidRasterizationScaleChange()) {
               pThis->ScaleFactor(island.RasterizationScale());
             }
+            if (args.DidLayoutDirectionChange()) {
+              pThis->Arrange(pThis->m_layoutConstraints, pThis->m_viewportOffset);
+            }
+#ifndef USE_EXPERIMENTAL_WINUI3 // Use this in place of Connected/Disconnected events for now. -- Its not quite what we
+                                // want, but it will do for now.
+            if (args.DidSiteVisibleChange()) {
+              if (island.IsSiteVisible()) {
+                pThis->OnMounted();
+              } else {
+                pThis->OnUnmounted();
+              }
+            }
+#endif
+          }
+        });
+#ifdef USE_EXPERIMENTAL_WINUI3
+    m_islandConnectedToken = m_island.Connected(
+        [weakThis = get_weak()](
+            winrt::IInspectable const &, winrt::Microsoft::UI::Content::ContentIsland const &island) {
+          if (auto pThis = weakThis.get()) {
+            pThis->OnMounted();
+          }
+        });
+
+    m_islandDisconnectedToken = m_island.Disconnected(
+        [weakThis = get_weak()](
+            winrt::IInspectable const &, winrt::Microsoft::UI::Content::ContentIsland const &island) {
+          if (auto pThis = weakThis.get()) {
+            pThis->OnUnmounted();
           }
         });
+#endif
   }
   return m_island;
 }
-#endif
+
+void ReactNativeIsland::OnMounted() noexcept {
+  if (m_mounted)
+    return;
+  m_mounted = true;
+  if (auto componentView = GetComponentView()) {
+    componentView->onMounted();
+  }
+}
+
+void ReactNativeIsland::OnUnmounted() noexcept {
+  if (!m_mounted)
+    return;
+  m_mounted = false;
+  if (auto componentView = GetComponentView()) {
+    componentView->onUnmounted();
+  }
+}
 
 winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView *
 ReactNativeIsland::GetComponentView() noexcept {

package/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.h

@@ -10,6 +10,7 @@
 #include <react/renderer/core/LayoutConstraints.h>
 #include <winrt/Microsoft.ReactNative.Composition.Experimental.h>
 #include <winrt/Microsoft.ReactNative.h>
+#include <winrt/Windows.UI.ViewManagement.h>
 #include "CompositionEventHandler.h"
 #include "ReactHost/React.h"
 
@@ -46,10 +47,8 @@ struct ReactNativeIsland
   ReactNativeIsland() noexcept;
   ~ReactNativeIsland() noexcept;
 
-#ifdef USE_WINUI3
   ReactNativeIsland(const winrt::Microsoft::UI::Composition::Compositor &compositor) noexcept;
   winrt::Microsoft::UI::Content::ContentIsland Island();
-#endif
 
   // property ReactViewHost
   ReactNative::IReactViewHost ReactViewHost() noexcept;
@@ -61,6 +60,9 @@ struct ReactNativeIsland
   winrt::Microsoft::ReactNative::Composition::Experimental::IVisual InternalRootVisual() noexcept;
   void InternalRootVisual(winrt::Microsoft::ReactNative::Composition::Experimental::IVisual const &value) noexcept;
 
+  void OnMounted() noexcept;
+  void OnUnmounted() noexcept;
+
   // property Size
   winrt::Windows::Foundation::Size Size() noexcept;
   void Size(winrt::Windows::Foundation::Size value) noexcept;
@@ -69,6 +71,8 @@ struct ReactNativeIsland
   float ScaleFactor() noexcept;
   void ScaleFactor(float value) noexcept;
 
+  float FontSizeMultiplier() const noexcept;
+
   winrt::event_token SizeChanged(
       winrt::Windows::Foundation::EventHandler<winrt::Microsoft::ReactNative::RootViewSizeChangedEventArgs> const
           &handler) noexcept;
@@ -78,6 +82,7 @@ struct ReactNativeIsland
   void AddRenderedVisual(const winrt::Microsoft::ReactNative::Composition::Experimental::IVisual &visual) noexcept;
   void RemoveRenderedVisual(const winrt::Microsoft::ReactNative::Composition::Experimental::IVisual &visual) noexcept;
   bool TrySetFocus() noexcept;
+  HWND GetHwndForParenting() noexcept;
 
   winrt::Microsoft::ReactNative::Composition::ICustomResourceLoader Resources() noexcept;
   void Resources(const winrt::Microsoft::ReactNative::Composition::ICustomResourceLoader &resources) noexcept;
@@ -87,10 +92,10 @@ struct ReactNativeIsland
 
   winrt::Windows::Foundation::Size Measure(
       const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints,
-      const winrt::Windows::Foundation::Point &viewportOffset) const noexcept;
+      const winrt::Windows::Foundation::Point &viewportOffset) const;
   void Arrange(
       const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints,
-      const winrt::Windows::Foundation::Point &viewportOffset) noexcept;
+      const winrt::Windows::Foundation::Point &viewportOffset);
 
   winrt::Microsoft::ReactNative::FocusNavigationResult NavigateFocus(
       const winrt::Microsoft::ReactNative::FocusNavigationRequest &request) noexcept;
@@ -126,6 +131,8 @@ struct ReactNativeIsland
   winrt::event_token m_islandFrameworkClosedToken;
   winrt::event_token m_islandAutomationProviderRequestedToken;
   winrt::event_token m_islandStateChangedToken;
+  winrt::event_token m_islandConnectedToken;
+  winrt::event_token m_islandDisconnectedToken;
 #endif
 
   HWND m_hwnd{0};
@@ -133,10 +140,14 @@ struct ReactNativeIsland
   bool m_isJSViewAttached{false};
   bool m_hasRenderedVisual{false};
   bool m_showingLoadingUI{false};
+  bool m_mounted{false};
   IReactDispatcher m_uiDispatcher{nullptr};
   winrt::IInspectable m_uiaProvider{nullptr};
   int64_t m_rootTag{-1};
   float m_scaleFactor{1.0};
+  float m_textScaleMultiplier{1.0};
+  winrt::Windows::UI::ViewManagement::UISettings::TextScaleFactorChanged_revoker m_textScaleChangedRevoker;
+  winrt::Windows::UI::ViewManagement::UISettings m_uiSettings{nullptr};
   winrt::Windows::Foundation::Size m_size{0, 0};
   winrt::Microsoft::ReactNative::ReactContext m_context;
   winrt::Microsoft::ReactNative::IReactViewHost m_reactViewHost;
@@ -162,6 +173,12 @@ struct ReactNativeIsland
   void UpdateRootVisualSize() noexcept;
   void UpdateLoadingVisualSize() noexcept;
   Composition::Experimental::IDrawingSurfaceBrush CreateLoadingVisualBrush() noexcept;
+  void ApplyConstraints(
+      const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraintsIn,
+      facebook::react::LayoutConstraints &layoutConstraintsOut) const noexcept;
+  facebook::react::Size MeasureLoading(
+      const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints) const noexcept;
+  void InitTextScaleMultiplier() noexcept;
 };
 
 } // namespace winrt::Microsoft::ReactNative::implementation

package/Microsoft.ReactNative/Fabric/Composition/RootComponentView.cpp

@@ -24,8 +24,7 @@ RootComponentView::RootComponentView(
           reactContext,
           ComponentViewFeatures::Default &
               ~(ComponentViewFeatures::Background | ComponentViewFeatures::ShadowProps |
-                ComponentViewFeatures::NativeBorder),
-          false) {}
+                ComponentViewFeatures::NativeBorder)) {}
 
 RootComponentView::~RootComponentView() {
   if (auto rootView = m_wkRootView.get()) {
@@ -41,8 +40,8 @@ winrt::Microsoft::ReactNative::ComponentView RootComponentView::Create(
   return winrt::make<RootComponentView>(compContext, tag, reactContext);
 }
 
-RootComponentView *RootComponentView::rootComponentView() noexcept {
-  return this;
+RootComponentView *RootComponentView::rootComponentView() const noexcept {
+  return const_cast<RootComponentView *>(this);
 }
 
 void RootComponentView::updateLayoutMetrics(
@@ -92,12 +91,18 @@ bool RootComponentView::NavigateFocus(const winrt::Microsoft::ReactNative::Focus
       ? FocusManager::FindFirstFocusableElement(*this)
       : FocusManager::FindLastFocusableElement(*this);
   if (view) {
-    TrySetFocusedComponent(view);
+    TrySetFocusedComponent(
+        view,
+        request.Reason() == winrt::Microsoft::ReactNative::FocusNavigationReason::First
+            ? winrt::Microsoft::ReactNative::FocusNavigationDirection::First
+            : winrt::Microsoft::ReactNative::FocusNavigationDirection::Last);
   }
   return view != nullptr;
 }
 
-bool RootComponentView::TrySetFocusedComponent(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+bool RootComponentView::TrySetFocusedComponent(
+    const winrt::Microsoft::ReactNative::ComponentView &view,
+    winrt::Microsoft::ReactNative::FocusNavigationDirection direction) noexcept {
   auto target = view;
   auto selfView = winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(target);
   if (selfView && !selfView->focusable()) {
@@ -111,7 +116,7 @@ bool RootComponentView::TrySetFocusedComponent(const winrt::Microsoft::ReactNati
     return false;
 
   auto losingFocusArgs = winrt::make<winrt::Microsoft::ReactNative::implementation::LosingFocusEventArgs>(
-      target, m_focusedComponent, target);
+      target, direction, m_focusedComponent, target);
   if (m_focusedComponent) {
     winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(m_focusedComponent)
         ->onLosingFocus(losingFocusArgs);
@@ -119,7 +124,7 @@ bool RootComponentView::TrySetFocusedComponent(const winrt::Microsoft::ReactNati
 
   if (losingFocusArgs.NewFocusedComponent()) {
     auto gettingFocusArgs = winrt::make<winrt::Microsoft::ReactNative::implementation::GettingFocusEventArgs>(
-        target, m_focusedComponent, losingFocusArgs.NewFocusedComponent());
+        target, direction, m_focusedComponent, losingFocusArgs.NewFocusedComponent());
     winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(losingFocusArgs.NewFocusedComponent())
         ->onGettingFocus(gettingFocusArgs);
 
@@ -139,13 +144,16 @@ bool RootComponentView::TryMoveFocus(bool next) noexcept {
   }
 
   Mso::Functor<bool(const winrt::Microsoft::ReactNative::ComponentView &)> fn =
-      [currentlyFocused = m_focusedComponent](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
+      [currentlyFocused = m_focusedComponent, next](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
         if (view == currentlyFocused)
           return false;
 
         return winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(view)
             ->rootComponentView()
-            ->TrySetFocusedComponent(view);
+            ->TrySetFocusedComponent(
+                view,
+                next ? winrt::Microsoft::ReactNative::FocusNavigationDirection::Next
+                     : winrt::Microsoft::ReactNative::FocusNavigationDirection::Previous);
       };
 
   return winrt::Microsoft::ReactNative::implementation::walkTree(m_focusedComponent, next, fn);
@@ -203,8 +211,35 @@ winrt::IInspectable RootComponentView::UiaProviderFromPoint(const POINT &ptPixel
   return winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(view)->EnsureUiaProvider();
 }
 
+float RootComponentView::FontSizeMultiplier() const noexcept {
+  if (auto rootView = m_wkRootView.get()) {
+    return winrt::get_self<winrt::Microsoft::ReactNative::implementation::ReactNativeIsland>(rootView)
+        ->FontSizeMultiplier();
+  }
+  assert(false);
+  return 1.0f;
+}
+
+winrt::Microsoft::UI::Content::ContentIsland RootComponentView::parentContentIsland() noexcept {
+  if (auto rootView = m_wkRootView.get()) {
+    return winrt::get_self<winrt::Microsoft::ReactNative::implementation::ReactNativeIsland>(rootView)->Island();
+  }
+  return nullptr;
+}
+
 winrt::Microsoft::ReactNative::implementation::ClipState RootComponentView::getClipState() noexcept {
   return winrt::Microsoft::ReactNative::implementation::ClipState::NoClip;
 }
 
+HWND RootComponentView::GetHwndForParenting() noexcept {
+  if (auto rootView = m_wkRootView.get()) {
+    auto hwnd = winrt::get_self<winrt::Microsoft::ReactNative::implementation::ReactNativeIsland>(rootView)
+                    ->GetHwndForParenting();
+    if (hwnd)
+      return hwnd;
+  }
+
+  return base_type::GetHwndForParenting();
+}
+
 } // namespace winrt::Microsoft::ReactNative::Composition::implementation

package/Microsoft.ReactNative/Fabric/Composition/RootComponentView.h

@@ -28,13 +28,17 @@ struct RootComponentView : RootComponentViewT<RootComponentView, ViewComponentVi
 
   winrt::Microsoft::ReactNative::ComponentView GetFocusedComponent() noexcept;
   void SetFocusedComponent(const winrt::Microsoft::ReactNative::ComponentView &value) noexcept;
-  bool TrySetFocusedComponent(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept;
+  bool TrySetFocusedComponent(
+      const winrt::Microsoft::ReactNative::ComponentView &view,
+      winrt::Microsoft::ReactNative::FocusNavigationDirection direction) noexcept;
 
   bool NavigateFocus(const winrt::Microsoft::ReactNative::FocusNavigationRequest &request) noexcept;
 
   bool TryMoveFocus(bool next) noexcept;
 
-  RootComponentView *rootComponentView() noexcept override;
+  RootComponentView *rootComponentView() const noexcept override;
+
+  winrt::Microsoft::UI::Content::ContentIsland parentContentIsland() noexcept;
 
   // Index that visuals can be inserted into OuterVisual for debugging UI
   uint32_t overlayIndex() noexcept;
@@ -42,6 +46,7 @@ struct RootComponentView : RootComponentViewT<RootComponentView, ViewComponentVi
 
   HRESULT GetFragmentRoot(IRawElementProviderFragmentRoot **pRetVal) noexcept;
   winrt::Microsoft::ReactNative::implementation::ClipState getClipState() noexcept override;
+  float FontSizeMultiplier() const noexcept;
 
   void updateLayoutMetrics(
       facebook::react::LayoutMetrics const &layoutMetrics,
@@ -59,6 +64,8 @@ struct RootComponentView : RootComponentViewT<RootComponentView, ViewComponentVi
   winrt::Microsoft::ReactNative::ComponentView FindFirstFocusableElement() noexcept;
   winrt::Microsoft::ReactNative::ComponentView FindLastFocusableElement() noexcept;
 
+  HWND GetHwndForParenting() noexcept override;
+
  private:
   // should this be a ReactTaggedView? - It shouldn't actually matter since if the view is going away it should always
   // be clearing its focus But being a reactTaggedView might make it easier to identify cases where that isn't