react-native-windows 0.69.4 → 0.70.0-preview.1

package/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj

@@ -115,7 +115,7 @@
         $(GeneratedFilesDir);
         %(AdditionalIncludeDirectories)
       </AdditionalIncludeDirectories>
-      <PreprocessorDefinitions>FOLLY_NO_CONFIG;NOMINMAX;_HAS_AUTO_PTR_ETC;_USE_MATH_DEFINES;RN_EXPORT=;%(PreprocessorDefinitions)</PreprocessorDefinitions>
+      <PreprocessorDefinitions>DISABLE_XAML_GENERATED_MAIN;FOLLY_NO_CONFIG;NOMINMAX;_HAS_AUTO_PTR_ETC;_USE_MATH_DEFINES;RN_EXPORT=;%(PreprocessorDefinitions)</PreprocessorDefinitions>
       <!--
         REACTWINDOWS_BUILD - building with REACTWINDOWS_API as dll exports
         OLD_CPPWINRT is a workaround to make target version to 19H1
@@ -184,6 +184,10 @@
     <ClInclude Include="Base\CoreNativeModules.h" />
     <ClInclude Include="Base\CxxReactIncludes.h" />
     <ClInclude Include="Base\FollyIncludes.h" />
+    <ClInclude Include="CoreAppPage.h">
+      <DependentUpon>CoreAppPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
     <ClInclude Include="ReactHost\JSCallInvokerScheduler.h" />
     <ClInclude Include="Utils\ShadowNodeTypeUtils.h" />
     <ClInclude Include="Utils\BatchingEventEmitter.h" />
@@ -427,6 +431,11 @@
     <ClCompile Include="ABIViewManager.cpp" />
     <ClCompile Include="Base\CoreNativeModules.cpp" />
     <ClCompile Include="Base\CoreUIManagers.cpp" />
+    <ClCompile Include="CoreAppPage.cpp">
+      <DependentUpon>CoreAppPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
+    <ClCompile Include="CoreApp.cpp" />
     <ClCompile Include="Utils\BatchingEventEmitter.cpp" />
     <ClCompile Include="CxxReactUWP\JSBigString.cpp" />
     <ClCompile Include="DevMenuControl.cpp">
@@ -630,6 +639,10 @@
     </ClCompile>
   </ItemGroup>
   <ItemGroup>
+    <Midl Include="CoreAppPage.idl">
+      <DependentUpon>CoreAppPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
     <Midl Include="DesktopWindowMessage.idl" />
     <Midl Include="DevMenuControl.idl">
       <DependentUpon>DevMenuControl.xaml</DependentUpon>
@@ -717,6 +730,9 @@
     </ProjectReference>
   </ItemGroup>
   <ItemGroup>
+    <Page Include="CoreAppPage.xaml">
+      <SubType>Designer</SubType>
+    </Page>
     <Page Include="DevMenuControl.xaml">
       <SubType>Designer</SubType>
     </Page>
@@ -772,4 +788,4 @@
       </ClCompile>
     </ItemGroup>
   </Target>
-</Project>
+</Project>

package/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj.filters

@@ -215,9 +215,6 @@
     <ClCompile Include="Views\RawTextViewManager.cpp">
       <Filter>Views</Filter>
     </ClCompile>
-    <ClCompile Include="Views\ReactRootControl.cpp">
-      <Filter>Views</Filter>
-    </ClCompile>
     <ClCompile Include="Views\RefreshControlManager.cpp">
       <Filter>Views</Filter>
     </ClCompile>
@@ -302,7 +299,6 @@
     <ClCompile Include="GlyphViewManager.cpp">
       <Filter>Modules</Filter>
     </ClCompile>
-    <ClCompile Include="Modules\ReactRootViewTagGenerator.cpp" />
     <ClCompile Include="Modules\PaperUIManagerModule.cpp" />
     <ClCompile Include="Views\PaperShadowNode.cpp" />
     <ClCompile Include="Views\ShadowNodeRegistry.cpp" />
@@ -337,6 +333,9 @@
       <Filter>Views\Text</Filter>
     </ClCompile>
     <ClCompile Include="ReactPointerEventArgs.cpp" />
+    <ClCompile Include="Views\FrameworkElementTransferProperties.cpp" />
+    <ClCompile Include="Views\ReactViewInstance.cpp" />
+    <ClCompile Include="CoreApp.cpp" />
   </ItemGroup>
   <ItemGroup>
     <ClInclude Include="ABICxxModule.h" />
@@ -575,9 +574,6 @@
     <ClInclude Include="Views\RawTextViewManager.h">
       <Filter>Views</Filter>
     </ClInclude>
-    <ClInclude Include="Views\ReactRootControl.h">
-      <Filter>Views</Filter>
-    </ClInclude>
     <ClInclude Include="Views\RefreshControlManager.h">
       <Filter>Views</Filter>
     </ClInclude>
@@ -734,6 +730,8 @@
       <Filter>Views\Text</Filter>
     </ClInclude>
     <ClInclude Include="ReactPointerEventArgs.h" />
+    <ClInclude Include="Views\FrameworkElementTransferProperties.h" />
+    <ClInclude Include="Views\ReactViewInstance.h" />
   </ItemGroup>
   <ItemGroup>
     <Midl Include="IJSValueReader.idl" />
@@ -772,6 +770,7 @@
     <Midl Include="DocString.idl" />
     <Midl Include="DesktopWindowMessage.idl" />
     <Midl Include="ReactPointerEventArgs.idl" />
+    <Midl Include="ReactCoreInjection.idl" />
   </ItemGroup>
   <ItemGroup>
     <None Include="microsoft.reactnative.def" />
@@ -826,5 +825,6 @@
   </ItemGroup>
   <ItemGroup>
     <Page Include="DevMenuControl.xaml" />
+    <Page Include="CoreAppPage.xaml" />
   </ItemGroup>
 </Project>

package/Microsoft.ReactNative/Modules/AccessibilityInfoModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeAccessibilityInfoSpec.g.h"
+#include "codegen/NativeAccessibilityInfoSpec.g.h"
 #include <NativeModules.h>
 
 namespace Microsoft::ReactNative {

package/Microsoft.ReactNative/Modules/AlertModule.cpp

@@ -68,20 +68,23 @@ void Alert::ProcessPendingAlertRequests() noexcept {
         const auto rootSize = xamlRoot.Size();
         const auto popupRoot = xaml::Media::VisualTreeHelper::GetParent(dialog);
         const auto nChildren = xaml::Media::VisualTreeHelper::GetChildrenCount(popupRoot);
-        if (nChildren == 2) {
-          // The first is supposed to be the smoke screen (Rectangle), and the second the content dialog
-          if (const auto smoke =
-                  xaml::Media::VisualTreeHelper::GetChild(popupRoot, 0).try_as<xaml::Shapes::Rectangle>()) {
-            const auto assertDialog =
-                xaml::Media::VisualTreeHelper::GetChild(popupRoot, 1).try_as<xaml::Controls::ContentDialog>();
-            if (assertDialog == dialog) {
-              smoke.Width(rootSize.Width);
-              smoke.Height(rootSize.Height);
-              dialog.Width(rootSize.Width);
-              dialog.Height(rootSize.Height);
-            }
+        xaml::Shapes::Rectangle smoke = nullptr;
+        xaml::Controls::ContentDialog assertDialog = nullptr;
+        for (int32_t i = 0; i < nChildren - 1; ++i) {
+          smoke = xaml::Media::VisualTreeHelper::GetChild(popupRoot, i).try_as<xaml::Shapes::Rectangle>();
+          assertDialog =
+              xaml::Media::VisualTreeHelper::GetChild(popupRoot, i + 1).try_as<xaml::Controls::ContentDialog>();
+          if (smoke && assertDialog == dialog) {
+            break;
           }
         }
+
+        if (smoke && assertDialog == dialog) {
+          smoke.Width(rootSize.Width);
+          smoke.Height(rootSize.Height);
+          dialog.Width(rootSize.Width);
+          dialog.Height(rootSize.Height);
+        }
       });
 
       dialog.Closed([=](auto &&, auto &&) { xamlRoot.Changed(rootChangedToken); });

package/Microsoft.ReactNative/Modules/AlertModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeDialogManagerWindowsSpec.g.h"
+#include "codegen/NativeDialogManagerWindowsSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>

package/Microsoft.ReactNative/Modules/AppStateModule.cpp

@@ -3,16 +3,20 @@
 
 #include "pch.h"
 #include "AppStateModule.h"
+#include <QuirkSettings.h>
 #include <Utils/Helpers.h>
 #include <XamlUtils.h>
 #include <winrt/Windows.ApplicationModel.DataTransfer.h>
 #include "Unicode.h"
 
+using namespace winrt::Windows::UI::Core;
+
 namespace Microsoft::ReactNative {
 
 void AppState::Initialize(winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept {
   m_context = reactContext;
-  m_active = true;
+  m_deactivated = false;
+  m_enteredBackground = false;
 
   // We need to register for notifications from the XAML thread.
   if (auto dispatcher = reactContext.UIDispatcher()) {
@@ -21,13 +25,15 @@ void AppState::Initialize(winrt::Microsoft::ReactNative::ReactContext const &rea
 
       if (!IsWinUI3Island() && currentApp != nullptr) {
 #ifndef USE_WINUI3
+        CoreWindow window = CoreWindow::GetForCurrentThread();
+
         m_enteredBackgroundRevoker = currentApp.EnteredBackground(
             winrt::auto_revoke,
             [weakThis = weak_from_this()](
                 winrt::IInspectable const & /*sender*/,
                 winrt::Windows::ApplicationModel::EnteredBackgroundEventArgs const & /*e*/) noexcept {
               if (auto strongThis = weakThis.lock()) {
-                strongThis->SetActive(false);
+                strongThis->SetEnteredBackground(true);
               }
             });
 
@@ -37,9 +43,27 @@ void AppState::Initialize(winrt::Microsoft::ReactNative::ReactContext const &rea
                 winrt::IInspectable const & /*sender*/,
                 winrt::Windows::ApplicationModel::LeavingBackgroundEventArgs const & /*e*/) noexcept {
               if (auto strongThis = weakThis.lock()) {
-                strongThis->SetActive(true);
+                strongThis->SetEnteredBackground(false);
               }
             });
+        if (window != nullptr &&
+            winrt::Microsoft::ReactNative::implementation::QuirkSettings::GetMapWindowDeactivatedToAppStateInactive(
+                m_context.Properties())) {
+          m_activatedEventRevoker = window.Activated(
+              winrt::auto_revoke,
+              [weakThis = weak_from_this()](
+                  winrt::Windows::UI::Core::CoreWindow /*sender*/,
+                  winrt::Windows::UI::Core::WindowActivatedEventArgs args) {
+                if (auto strongThis = weakThis.lock()) {
+                  if (args.WindowActivationState() ==
+                      winrt::Windows::UI::Core::CoreWindowActivationState::Deactivated) {
+                    strongThis->SetDeactivated(true);
+                  } else {
+                    strongThis->SetDeactivated(false);
+                  }
+                }
+              });
+        }
 #endif
       } else {
         assert(IsXamlIsland());
@@ -52,7 +76,7 @@ void AppState::GetCurrentAppState(
     std::function<void(AppStateChangeArgs const &)> const &success,
     std::function<void(React::JSValue const &)> const &error) noexcept {
   AppStateChangeArgs args;
-  args.app_state = m_active ? "active" : "background";
+  args.app_state = GetAppState();
   success(args);
 }
 
@@ -65,12 +89,24 @@ void AppState::RemoveListeners(double /*count*/) noexcept {
 }
 
 ReactNativeSpecs::AppStateSpec_Constants AppState::GetConstants() noexcept {
-  return {m_active ? "active" : "background"};
+  return {GetAppState()};
+}
+
+void AppState::SetDeactivated(bool deactivated) noexcept {
+  if (winrt::Microsoft::ReactNative::implementation::QuirkSettings::GetMapWindowDeactivatedToAppStateInactive(
+          m_context.Properties())) {
+    m_deactivated = deactivated;
+    m_context.JSDispatcher().Post([this]() { AppStateDidChange({GetAppState()}); });
+  }
+}
+
+void AppState::SetEnteredBackground(bool enteredBackground) noexcept {
+  m_enteredBackground = enteredBackground;
+  m_context.JSDispatcher().Post([this]() { AppStateDidChange({GetAppState()}); });
 }
 
-void AppState::SetActive(bool active) noexcept {
-  m_active = active;
-  m_context.JSDispatcher().Post([this]() { AppStateDidChange({m_active ? "active" : "background"}); });
+std::string AppState::GetAppState() noexcept {
+  return m_enteredBackground ? "background" : (m_deactivated ? "inactive" : "active");
 }
 
-} // namespace Microsoft::ReactNative
+} // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/Modules/AppStateModule.h

@@ -2,11 +2,13 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeAppStateSpec.g.h"
+#include "codegen/NativeAppStateSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>
 
+#include <winrt/Windows.UI.Core.h>
+
 namespace Microsoft::ReactNative {
 
 REACT_MODULE(AppState)
@@ -35,15 +37,19 @@ struct AppState : public std::enable_shared_from_this<AppState> {
   std::function<void(AppStateChangeArgs const &)> AppStateDidChange;
 
  private:
-  void SetActive(bool active) noexcept;
+  void SetDeactivated(bool deactivated) noexcept;
+  void SetEnteredBackground(bool enteredBackground) noexcept;
+  std::string GetAppState() noexcept;
 
   std::mutex m_stateMutex;
-  std::atomic<bool> m_active;
+  std::atomic<bool> m_deactivated;
+  std::atomic<bool> m_enteredBackground;
   char const *m_lastState{nullptr};
   React::ReactContext m_context;
 #ifndef USE_WINUI3
   xaml::Application::EnteredBackground_revoker m_enteredBackgroundRevoker;
   xaml::Application::LeavingBackground_revoker m_leavingBackgroundRevoker;
+  winrt::Windows::UI::Core::CoreWindow::Activated_revoker m_activatedEventRevoker;
 #endif
 };
 

package/Microsoft.ReactNative/Modules/AppThemeModuleUwp.h

@@ -9,7 +9,7 @@
 #include <cxxreact/MessageQueueThread.h>
 #include <winrt/Windows.UI.ViewManagement.h>
 
-#include "../../codegen/NativeAppThemeSpec.g.h"
+#include "codegen/NativeAppThemeSpec.g.h"
 #include <NativeModules.h>
 
 namespace Microsoft::ReactNative {

package/Microsoft.ReactNative/Modules/ClipboardModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeClipboardSpec.g.h"
+#include "codegen/NativeClipboardSpec.g.h"
 #include <NativeModules.h>
 
 namespace Microsoft::ReactNative {

package/Microsoft.ReactNative/Modules/DevSettingsModule.h

@@ -5,7 +5,7 @@
 #include <cxxreact/CxxModule.h>
 #include <functional/functor.h>
 
-#include "../../codegen/NativeDevSettingsSpec.g.h"
+#include "codegen/NativeDevSettingsSpec.g.h"
 #include <NativeModules.h>
 #include <ReactHost/React.h>
 

package/Microsoft.ReactNative/Modules/DeviceInfoModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeDeviceInfoSpec.g.h"
+#include "codegen/NativeDeviceInfoSpec.g.h"
 #include <NativeModules.h>
 #include <React.h>
 #include <ReactNotificationService.h>

package/Microsoft.ReactNative/Modules/I18nManagerModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeI18nManagerSpec.g.h"
+#include "codegen/NativeI18nManagerSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>

package/Microsoft.ReactNative/Modules/ImageViewManagerModule.cpp

@@ -45,7 +45,7 @@ winrt::fire_and_forget GetImageSizeAsync(
     bool needsDownload = (scheme == L"http") || (scheme == L"https");
     bool inlineData = scheme == L"data";
 
-    winrt::InMemoryRandomAccessStream memoryStream;
+    winrt::IRandomAccessStream memoryStream;
     if (needsDownload) {
       memoryStream = co_await GetImageStreamAsync(source);
     } else if (inlineData) {

package/Microsoft.ReactNative/Modules/ImageViewManagerModule.h

@@ -3,7 +3,7 @@
 
 #pragma once
 
-#include "../../codegen/NativeImageLoaderIOSSpec.g.h"
+#include "codegen/NativeImageLoaderIOSSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>

package/Microsoft.ReactNative/Modules/LinkingManagerModule.h

@@ -3,7 +3,7 @@
 
 #pragma once
 
-#include "../../codegen/NativeLinkingManagerSpec.g.h"
+#include "codegen/NativeLinkingManagerSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>

package/Microsoft.ReactNative/Modules/LogBoxModule.h

@@ -2,7 +2,7 @@
 // Licensed under the MIT License.
 #pragma once
 
-#include "../../codegen/NativeLogBoxSpec.g.h"
+#include "codegen/NativeLogBoxSpec.g.h"
 #include <NativeModules.h>
 #include <winrt/Windows.ApplicationModel.h>
 #include <winrt/Windows.Foundation.h>

package/Microsoft.ReactNative/Modules/NativeUIManager.cpp

@@ -7,6 +7,7 @@
 #include <UI.Xaml.Input.h>
 #include <UI.Xaml.Media.h>
 #include <Views/ShadowNodeBase.h>
+#include <cxxreact/SystraceSection.h>
 #include "Modules/I18nManagerModule.h"
 #include "NativeUIManager.h"
 
@@ -24,6 +25,8 @@ using namespace xaml::Controls;
 using namespace xaml::Media;
 } // namespace winrt
 
+using namespace facebook::react;
+
 namespace Microsoft::ReactNative {
 
 static YogaNodePtr make_yoga_node(YGConfigRef config) {
@@ -38,7 +41,7 @@ static int YogaLog(
     YGLogLevel /*level*/,
     const char *format,
     va_list args) {
-  int len = _scprintf(format, args);
+  const int len = _vscprintf(format, args);
   std::string buffer(len + 1, '\0');
   vsnprintf_s(&buffer[0], len + 1, _TRUNCATE, format, args);
   buffer.resize(len);
@@ -222,6 +225,7 @@ int64_t NativeUIManager::AddMeasuredRootView(facebook::react::IReactRootView *ro
 }
 
 void NativeUIManager::AddRootView(ShadowNode &shadowNode, facebook::react::IReactRootView *pReactRootView) {
+  SystraceSection s("NativeUIManager::AddRootView");
   auto xamlRootView = static_cast<IXamlRootView *>(pReactRootView);
   XamlView view = xamlRootView->GetXamlView();
   m_tagsToXamlReactControl.emplace(
@@ -244,11 +248,13 @@ void NativeUIManager::AddRootView(ShadowNode &shadowNode, facebook::react::IReac
 }
 
 void NativeUIManager::removeRootView(Microsoft::ReactNative::ShadowNode &shadow) {
+  SystraceSection s("NativeUIManager::removeRootView");
   m_tagsToXamlReactControl.erase(shadow.m_tag);
   RemoveView(shadow, true);
 }
 
 void NativeUIManager::onBatchComplete() {
+  SystraceSection s("NativeUIManager::onBatchComplete");
   if (m_inBatch) {
     DoLayout();
     m_inBatch = false;
@@ -768,6 +774,7 @@ static void StyleYogaNode(
 }
 
 void NativeUIManager::CreateView(ShadowNode &shadowNode, React::JSValueObject &props) {
+  SystraceSection s("NativeUIManager::CreateView");
   ShadowNodeBase &node = static_cast<ShadowNodeBase &>(shadowNode);
   auto *pViewManager = node.GetViewManager();
 
@@ -859,6 +866,7 @@ void NativeUIManager::ReplaceView(ShadowNode &shadowNode) {
 }
 
 void NativeUIManager::UpdateView(ShadowNode &shadowNode, winrt::Microsoft::ReactNative::JSValueObject &props) {
+  SystraceSection s("NativeUIManager::UpdateView");
   ShadowNodeBase &node = static_cast<ShadowNodeBase &>(shadowNode);
   auto *pViewManager = node.GetViewManager();
 
@@ -889,51 +897,70 @@ void NativeUIManager::UpdateExtraLayout(int64_t tag) {
 }
 
 void NativeUIManager::DoLayout() {
-  // Process vector of RN controls needing extra layout here.
-  const auto extraLayoutNodes = m_extraLayoutNodes;
-  for (const int64_t tag : extraLayoutNodes) {
-    ShadowNodeBase *node = static_cast<ShadowNodeBase *>(m_host->FindShadowNodeForTag(tag));
-    if (node) {
-      auto element = node->GetView().as<xaml::FrameworkElement>();
-      element.UpdateLayout();
+  SystraceSection s("NativeUIManager::DoLayout");
+
+  {
+    SystraceSection s("NativeUIManager::DoLayout::UpdateLayout");
+    // Process vector of RN controls needing extra layout here.
+    const auto extraLayoutNodes = m_extraLayoutNodes;
+    for (const int64_t tag : extraLayoutNodes) {
+      ShadowNodeBase *node = static_cast<ShadowNodeBase *>(m_host->FindShadowNodeForTag(tag));
+      if (node) {
+        auto element = node->GetView().as<xaml::FrameworkElement>();
+        element.UpdateLayout();
+      }
     }
+    // Values need to be cleared from the vector before next call to DoLayout.
+    m_extraLayoutNodes.clear();
   }
-  // Values need to be cleared from the vector before next call to DoLayout.
-  m_extraLayoutNodes.clear();
+
   auto &rootTags = m_host->GetAllRootTags();
   for (int64_t rootTag : rootTags) {
-    UpdateExtraLayout(rootTag);
+    {
+      SystraceSection s("NativeUIManager::DoLayout::UpdateExtraLayout");
+      UpdateExtraLayout(rootTag);
+    }
 
     ShadowNodeBase &rootShadowNode = static_cast<ShadowNodeBase &>(m_host->GetShadowNodeForTag(rootTag));
-    YGNodeRef rootNode = GetYogaNode(rootTag);
-    auto rootElement = rootShadowNode.GetView().as<xaml::FrameworkElement>();
-
-    float actualWidth = static_cast<float>(rootElement.ActualWidth());
-    float actualHeight = static_cast<float>(rootElement.ActualHeight());
-
-    // We must always run layout in LTR mode, which might seem unintuitive.
-    // We will flip the root of the tree into RTL by forcing the root XAML node's FlowDirection to RightToLeft
-    // which will inherit down the XAML tree, allowing all native controls to pick it up.
-    YGNodeCalculateLayout(rootNode, actualWidth, actualHeight, YGDirectionLTR);
+    if (YGNodeRef rootNode = GetYogaNode(rootTag)) {
+      auto rootElement = rootShadowNode.GetView().as<xaml::FrameworkElement>();
+
+      float actualWidth = static_cast<float>(rootElement.ActualWidth());
+      float actualHeight = static_cast<float>(rootElement.ActualHeight());
+
+      {
+        SystraceSection s("NativeUIManager::DoLayout::YGNodeCalculateLayout");
+        // We must always run layout in LTR mode, which might seem unintuitive.
+        // We will flip the root of the tree into RTL by forcing the root XAML node's FlowDirection to RightToLeft
+        // which will inherit down the XAML tree, allowing all native controls to pick it up.
+        YGNodeCalculateLayout(rootNode, actualWidth, actualHeight, YGDirectionLTR);
+      }
+    } else {
+      assert(false);
+      return;
+    }
   }
 
-  for (auto &tagToYogaNode : m_tagsToYogaNodes) {
-    int64_t tag = tagToYogaNode.first;
-    YGNodeRef yogaNode = tagToYogaNode.second.get();
-
-    if (!YGNodeGetHasNewLayout(yogaNode))
-      continue;
-    YGNodeSetHasNewLayout(yogaNode, false);
-
-    float left = YGNodeLayoutGetLeft(yogaNode);
-    float top = YGNodeLayoutGetTop(yogaNode);
-    float width = YGNodeLayoutGetWidth(yogaNode);
-    float height = YGNodeLayoutGetHeight(yogaNode);
-
-    ShadowNodeBase &shadowNode = static_cast<ShadowNodeBase &>(m_host->GetShadowNodeForTag(tag));
-    auto view = shadowNode.GetView();
-    auto pViewManager = shadowNode.GetViewManager();
-    pViewManager->SetLayoutProps(shadowNode, view, left, top, width, height);
+  {
+    SystraceSection s("NativeUIManager::DoLayout::SetLayoutProps");
+    for (auto &tagToYogaNode : m_tagsToYogaNodes) {
+      int64_t tag = tagToYogaNode.first;
+      YGNodeRef yogaNode = tagToYogaNode.second.get();
+
+      if (!YGNodeGetHasNewLayout(yogaNode))
+        continue;
+      YGNodeSetHasNewLayout(yogaNode, false);
+
+      float left = YGNodeLayoutGetLeft(yogaNode);
+      float top = YGNodeLayoutGetTop(yogaNode);
+      float width = YGNodeLayoutGetWidth(yogaNode);
+      float height = YGNodeLayoutGetHeight(yogaNode);
+
+      ShadowNodeBase &shadowNode = static_cast<ShadowNodeBase &>(m_host->GetShadowNodeForTag(tag));
+      auto view = shadowNode.GetView();
+      auto pViewManager = shadowNode.GetViewManager();
+      pViewManager->SetLayoutProps(shadowNode, view, left, top, width, height);
+    }
   }
 }
 
@@ -1115,7 +1142,7 @@ void NativeUIManager::findSubviewIn(
 
 void NativeUIManager::focus(int64_t reactTag) {
   if (auto shadowNode = static_cast<ShadowNodeBase *>(m_host->FindShadowNodeForTag(reactTag))) {
-    xaml::Input::FocusManager::TryFocusAsync(shadowNode->GetView(), winrt::FocusState::Keyboard);
+    xaml::Input::FocusManager::TryFocusAsync(shadowNode->GetView(), winrt::FocusState::Programmatic);
   }
 }