react-native-windows 0.77.7 → 0.77.9

package/Shared/Networking/WinRTWebSocketResource.cpp

@@ -89,7 +89,6 @@ DispatchQueue GetCurrentOrSerialQueue() noexcept {
 
   return queue;
 }
-
 } // namespace
 
 namespace Microsoft::React::Networking {
@@ -104,7 +103,6 @@ WinRTWebSocketResource2::WinRTWebSocketResource2(
     : m_socket{std::move(socket)},
       m_writer(std::move(writer)),
       m_readyState{ReadyState::Connecting},
-      m_connectPerformed{CreateEvent(/*attributes*/ nullptr, /*manual reset*/ true, /*state*/ false, /*name*/ nullptr)},
       m_callingQueue{callingQueue} {
   for (const auto &certException : certExceptions) {
     m_socket.Control().IgnorableServerCertificateErrors().Append(certException);
@@ -221,120 +219,112 @@ void WinRTWebSocketResource2::OnClosed(IWebSocket const &sender, IWebSocketClose
 
 fire_and_forget WinRTWebSocketResource2::PerformConnect(Uri &&uri) noexcept {
   auto self = shared_from_this();
-  auto coUri = std::move(uri);
+  auto movedUri = std::move(uri);
 
   co_await resume_in_queue(self->m_backgroundQueue);
 
-  auto async = self->m_socket.ConnectAsync(coUri);
-  co_await lessthrow_await_adapter<IAsyncAction>{async};
-
-  co_await resume_in_queue(self->m_callingQueue);
-
-  auto result = async.ErrorCode();
-
-  try {
-    if (result >= 0) { // Non-failing HRESULT
-      co_await resume_in_queue(self->m_backgroundQueue);
-      self->m_readyState = ReadyState::Open;
-
-      co_await resume_in_queue(self->m_callingQueue);
-      if (self->m_connectHandler) {
-        self->m_connectHandler();
-      }
-    } else {
-      self->Fail(std::move(result), ErrorType::Connection);
-    }
-  } catch (hresult_error const &e) {
-    self->Fail(e, ErrorType::Connection);
-  } catch (std::exception const &e) {
-    self->Fail(e.what(), ErrorType::Connection);
-  }
-
-  SetEvent(self->m_connectPerformed.get());
+  co_await self->m_sequencer.QueueTaskAsync(
+      [self = self->shared_from_this(), coUri = std::move(movedUri)]() -> IAsyncAction {
+        auto coSelf = self->shared_from_this();
+
+        auto async = coSelf->m_socket.ConnectAsync(coUri);
+        co_await lessthrow_await_adapter<IAsyncAction>{async};
+
+        auto result = async.ErrorCode();
+        try {
+          if (result >= 0) { // Non-failing HRESULT
+            coSelf->m_readyState = ReadyState::Open;
+
+            co_await resume_in_queue(coSelf->m_callingQueue);
+            if (coSelf->m_connectHandler) {
+              coSelf->m_connectHandler();
+            }
+          } else {
+            coSelf->Fail(std::move(result), ErrorType::Connection);
+          }
+        } catch (hresult_error const &e) {
+          coSelf->Fail(e, ErrorType::Connection);
+        } catch (std::exception const &e) {
+          coSelf->Fail(e.what(), ErrorType::Connection);
+        }
+      });
 }
 
 fire_and_forget WinRTWebSocketResource2::PerformClose() noexcept {
   auto self = shared_from_this();
 
-  co_await resume_on_signal(self->m_connectPerformed.get());
-
   co_await resume_in_queue(self->m_backgroundQueue);
 
-  // See https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/close
-  co_await self->SendPendingMessages();
+  co_await self->m_sequencer.QueueTaskAsync([self = self->shared_from_this()]() -> IAsyncAction {
+    auto coSelf = self->shared_from_this();
 
-  try {
-    self->m_socket.Close(static_cast<uint16_t>(m_closeCode), winrt::to_hstring(m_closeReason));
-    self->m_readyState = ReadyState::Closing;
-  } catch (winrt::hresult_invalid_argument const &e) {
-    Fail(e, ErrorType::Close);
-  } catch (hresult_error const &e) {
-    Fail(e, ErrorType::Close);
-  } catch (const std::exception &e) {
-    Fail(e.what(), ErrorType::Close);
-  }
+    try {
+      coSelf->m_socket.Close(static_cast<uint16_t>(coSelf->m_closeCode), winrt::to_hstring(coSelf->m_closeReason));
+      coSelf->m_readyState = ReadyState::Closing;
+    } catch (winrt::hresult_invalid_argument const &e) {
+      coSelf->Fail(e, ErrorType::Close);
+    } catch (hresult_error const &e) {
+      coSelf->Fail(e, ErrorType::Close);
+    } catch (const std::exception &e) {
+      coSelf->Fail(e.what(), ErrorType::Close);
+    }
+
+    co_return;
+  });
 }
 
-fire_and_forget WinRTWebSocketResource2::PerformWrite(string &&message, bool isBinary) noexcept {
+fire_and_forget WinRTWebSocketResource2::EnqueueWrite(string &&message, bool isBinary) noexcept {
   auto self = shared_from_this();
   string coMessage = std::move(message);
 
-  co_await resume_in_queue(self->m_backgroundQueue); // Ensure writes happen sequentially
-  self->m_outgoingMessages.emplace(std::move(coMessage), isBinary);
-
-  co_await resume_on_signal(self->m_connectPerformed.get());
-
   co_await resume_in_queue(self->m_backgroundQueue);
 
-  co_await self->SendPendingMessages();
+  co_await self->m_sequencer.QueueTaskAsync(
+      [self = self->shared_from_this(), message = std::move(coMessage), isBinary]() -> IAsyncAction {
+        auto coSelf = self->shared_from_this();
+        auto coMessage = std::move(message);
+
+        co_await coSelf->PerformWrite(std::move(coMessage), isBinary);
+      });
 }
 
-IAsyncAction WinRTWebSocketResource2::SendPendingMessages() noexcept {
+IAsyncAction WinRTWebSocketResource2::PerformWrite(string &&message, bool isBinary) noexcept {
   auto self = shared_from_this();
 
-  while (!self->m_outgoingMessages.empty()) {
-    if (self->m_readyState != ReadyState::Open) {
-      co_return;
-    }
-
-    size_t length = 0;
-    string messageLocal;
-    bool isBinaryLocal;
-    try {
-      std::tie(messageLocal, isBinaryLocal) = self->m_outgoingMessages.front();
-      self->m_outgoingMessages.pop();
-      if (isBinaryLocal) {
-        self->m_socket.Control().MessageType(SocketMessageType::Binary);
-
-        auto buffer = CryptographicBuffer::DecodeFromBase64String(winrt::to_hstring(messageLocal));
-        if (buffer) {
-          length = buffer.Length();
-          self->m_writer.WriteBuffer(buffer);
-        }
-      } else {
-        self->m_socket.Control().MessageType(SocketMessageType::Utf8);
+  try {
+    if (isBinary) {
+      self->m_socket.Control().MessageType(SocketMessageType::Binary);
 
-        length = messageLocal.size();
-        winrt::array_view<const uint8_t> view(
-            CheckedReinterpretCast<const uint8_t *>(messageLocal.c_str()),
-            CheckedReinterpretCast<const uint8_t *>(messageLocal.c_str()) + messageLocal.length());
-        self->m_writer.WriteBytes(view);
+      auto buffer = CryptographicBuffer::DecodeFromBase64String(winrt::to_hstring(message));
+      if (buffer) {
+        self->m_writer.WriteBuffer(buffer);
       }
-    } catch (hresult_error const &e) { // TODO: Remove after fixing unit tests exceptions.
-      self->Fail(e, ErrorType::Send);
-      co_return;
-    } catch (const std::exception &e) {
-      self->Fail(e.what(), ErrorType::Send);
-      co_return;
+    } else {
+      self->m_socket.Control().MessageType(SocketMessageType::Utf8);
+
+      winrt::array_view<const uint8_t> view(
+          CheckedReinterpretCast<const uint8_t *>(message.c_str()),
+          CheckedReinterpretCast<const uint8_t *>(message.c_str()) + message.length());
+      self->m_writer.WriteBytes(view);
     }
+  } catch (hresult_error const &e) { // TODO: Remove after fixing unit tests exceptions.
+    self->Fail(e, ErrorType::Send);
+  } catch (const std::exception &e) {
+    self->Fail(e.what(), ErrorType::Send);
+  }
 
-    auto async = self->m_writer.StoreAsync();
-    co_await lessthrow_await_adapter<DataWriterStoreOperation>{async};
+  co_await resume_in_queue(self->m_backgroundQueue);
+  // If an exception occurred, abort write process.
+  if (self->m_readyState != ReadyState::Open) {
+    co_return;
+  }
 
-    auto result = async.ErrorCode();
-    if (result < 0) {
-      Fail(std::move(result), ErrorType::Send);
-    }
+  auto async = self->m_writer.StoreAsync();
+  co_await lessthrow_await_adapter<DataWriterStoreOperation>{async};
+
+  auto result = async.ErrorCode();
+  if (result < 0) {
+    self->Fail(std::move(result), ErrorType::Send);
   }
 }
 
@@ -388,11 +378,7 @@ void WinRTWebSocketResource2::Connect(string &&url, const Protocols &protocols,
       m_socket.SetRequestHeader(L"Origin", std::move(origin));
     }
   } catch (hresult_error const &e) {
-    Fail(e, ErrorType::Connection);
-
-    SetEvent(m_connectPerformed.get());
-
-    return;
+    return Fail(e, ErrorType::Connection);
   }
 
   PerformConnect(std::move(uri));
@@ -401,11 +387,11 @@ void WinRTWebSocketResource2::Connect(string &&url, const Protocols &protocols,
 void WinRTWebSocketResource2::Ping() noexcept {}
 
 void WinRTWebSocketResource2::Send(string &&message) noexcept {
-  PerformWrite(std::move(message), false);
+  EnqueueWrite(std::move(message), false);
 }
 
 void WinRTWebSocketResource2::SendBinary(string &&base64String) noexcept {
-  PerformWrite(std::move(base64String), true);
+  EnqueueWrite(std::move(base64String), true);
 }
 
 void WinRTWebSocketResource2::Close(CloseCode code, const string &reason) noexcept {

package/Shared/Networking/WinRTWebSocketResource.h

@@ -18,17 +18,101 @@ namespace Microsoft::React::Networking {
 
 class WinRTWebSocketResource2 : public IWebSocketResource,
                                 public std::enable_shared_from_this<WinRTWebSocketResource2> {
-  winrt::Windows::Networking::Sockets::IMessageWebSocket m_socket;
-
   ///
-  // Connection attempt performed, either succeeding or failing
+  // See https://devblogs.microsoft.com/oldnewthing/20250328-00/?p=111016
   ///
-  winrt::handle m_connectPerformed;
+  struct TaskSequencer {
+    TaskSequencer() = default;
+    TaskSequencer(const TaskSequencer &) = delete;
+    void operator=(const TaskSequencer &) = delete;
+
+   private:
+    using CoroHandle = std::experimental::coroutine_handle<>;
+
+    struct Suspender {
+      CoroHandle m_handle;
+
+      bool await_ready() const noexcept {
+        return false;
+      }
+
+      void await_suspend(CoroHandle h) noexcept {
+        m_handle = h;
+      }
+
+      void await_resume() const noexcept {}
+    };
+
+    static void *Completed() {
+      return reinterpret_cast<void *>(1);
+    }
+
+    struct ChainedTask {
+     private:
+      std::atomic<void *> m_next;
+
+     public:
+      ChainedTask(void *state = nullptr) : m_next(state) {}
+
+      void ContinueWith(CoroHandle h) {
+        if (m_next.exchange(h.address(), std::memory_order_acquire) != nullptr) {
+          h();
+        }
+      }
+
+      void Complete() {
+        auto resumeAddress = m_next.exchange(Completed());
+        if (resumeAddress) {
+          CoroHandle::from_address(resumeAddress).resume();
+        }
+      }
+    };
 
+    struct Completer {
+      std::shared_ptr<ChainedTask> m_chain;
+
+      ~Completer() {
+        m_chain->Complete();
+      }
+    };
+
+    winrt::slim_mutex m_mutex;
+    std::shared_ptr<ChainedTask> m_latest = std::make_shared<ChainedTask>(Completed());
+
+   public:
+    template <typename Maker>
+    auto QueueTaskAsync(Maker &&maker) -> decltype(maker()) {
+      auto node = std::make_shared<ChainedTask>();
+      Suspender suspend;
+
+      using Async = decltype(maker());
+      auto task = [&node, &suspend, &maker]() -> Async {
+        Completer completer{node};
+        auto localMaker = std::forward<Maker>(maker);
+        auto context = winrt::apartment_context();
+
+        co_await suspend;
+        co_await context;
+
+        co_return co_await localMaker();
+      }();
+
+      {
+        winrt::slim_lock_guard guard(m_mutex);
+        m_latest.swap(node);
+      }
+
+      node->ContinueWith(suspend.m_handle);
+
+      return task;
+    }
+  };
+
+  winrt::Windows::Networking::Sockets::IMessageWebSocket m_socket;
   ReadyState m_readyState;
+  TaskSequencer m_sequencer;
   Mso::DispatchQueue m_callingQueue;
   Mso::DispatchQueue m_backgroundQueue;
-  std::queue<std::pair<std::string, bool>> m_outgoingMessages;
   CloseCode m_closeCode{CloseCode::Normal};
   std::string m_closeReason;
 
@@ -52,9 +136,9 @@ class WinRTWebSocketResource2 : public IWebSocketResource,
       winrt::Windows::Networking::Sockets::IWebSocketClosedEventArgs const &args);
 
   winrt::fire_and_forget PerformConnect(winrt::Windows::Foundation::Uri &&uri) noexcept;
-  winrt::fire_and_forget PerformWrite(std::string &&message, bool isBinary) noexcept;
+  winrt::fire_and_forget EnqueueWrite(std::string &&message, bool isBinary) noexcept;
+  winrt::Windows::Foundation::IAsyncAction PerformWrite(std::string &&message, bool isBinary) noexcept;
   winrt::fire_and_forget PerformClose() noexcept;
-  winrt::Windows::Foundation::IAsyncAction SendPendingMessages() noexcept;
 
   WinRTWebSocketResource2(
       winrt::Windows::Networking::Sockets::IMessageWebSocket &&socket,

package/Shared/Shared.vcxitems

@@ -117,10 +117,10 @@
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewComponentView.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
-    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewShadowNode.cpp">
+    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\ParagraphComponentView.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
-    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\ParagraphComponentView.cpp">
+    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\PortalComponentView.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\RootComponentView.cpp">
@@ -171,9 +171,6 @@
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiComponentDescriptor.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
-    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewComponentDescriptor.cpp">
-      <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
-    </ClCompile>
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiEventEmitter.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
@@ -183,6 +180,9 @@
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiShadowNode.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
+    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiPortalShadowNode.cpp">
+      <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
+    </ClCompile>
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewShadowNode.cpp">
       <ExcludedFromBuild Condition="'$(UseFabric)' != 'true'">true</ExcludedFromBuild>
     </ClCompile>
@@ -323,6 +323,7 @@
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewSate.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\ParagraphComponentView.h" />
+    <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\PortalComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\RootComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\ScrollViewComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\SwitchComponentView.h" />

package/Shared/Shared.vcxitems.filters

@@ -179,9 +179,6 @@
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewComponentView.cpp">
       <Filter>Source Files\Fabric\Composition</Filter>
     </ClCompile>
-    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\Modal\WindowsModalHostViewShadowNode.cpp">
-      <Filter>Source Files\Fabric\Composition</Filter>
-    </ClCompile>
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\ParagraphComponentView.cpp">
       <Filter>Source Files\Fabric\Composition</Filter>
     </ClCompile>
@@ -245,9 +242,9 @@
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\platform\react\renderer\textlayoutmanager\TextLayoutManager.cpp">
       <Filter>Source Files\Fabric\platform\react\renderer\textlayoutmanager</Filter>
     </ClCompile>
+    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\PortalComponentView.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\RootComponentView.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\UnimplementedNativeViewComponentView.cpp" />
-    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewComponentDescriptor.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewProps.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\WindowsComponentDescriptorRegistry.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\UiaHelpers.cpp" />
@@ -301,6 +298,7 @@
     <ClCompile Include="$(ReactNativeDir)\ReactCommon\react\renderer\runtimescheduler\Task.cpp" />
     <ClCompile Include="$(ReactNativeDir)\ReactCommon\react\renderer\components\scrollview\ScrollEvent.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\platform\react\renderer\graphics\PlatformColorUtils.cpp" />
+    <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiPortalShadowNode.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewShadowNode.cpp" />
     <ClCompile Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiState.cpp" />
     <ClCompile Include="$(ReactNativeWindowsDir)Microsoft.ReactNative\Utils\ThemeUtils.cpp" />
@@ -794,6 +792,7 @@
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\platform\react\renderer\textlayoutmanager\TextLayoutManager.h">
       <Filter>Header Files\Fabric\platform\react\renderer\textlayoutmanager</Filter>
     </ClInclude>
+    <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\PortalComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\Composition\RootComponentView.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewProps.h" />
     <ClInclude Include="$(MSBuildThisFileDirectory)..\Microsoft.ReactNative\Fabric\AbiViewComponentDescriptor.h" />

package/codegen/react/components/rnwcore/ActivityIndicatorView.g.h

@@ -0,0 +1,212 @@
+
+/*
+ * This file is auto-generated from ActivityIndicatorViewNativeComponent 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(ActivityIndicatorViewProps)
+struct ActivityIndicatorViewProps : winrt::implements<ActivityIndicatorViewProps, winrt::Microsoft::ReactNative::IComponentProps> {
+  ActivityIndicatorViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom)
+    : ViewProps(props)
+  {
+     if (cloneFrom) {
+       auto cloneFromProps = cloneFrom.as<ActivityIndicatorViewProps>();
+       hidesWhenStopped = cloneFromProps->hidesWhenStopped;
+       animating = cloneFromProps->animating;
+       color = cloneFromProps->color;
+       size = cloneFromProps->size;  
+     }
+  }
+
+  void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept {
+    winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this);
+  }
+
+  REACT_FIELD(hidesWhenStopped)
+  bool hidesWhenStopped{true};
+
+  REACT_FIELD(animating)
+  bool animating{true};
+
+  REACT_FIELD(color)
+  winrt::Microsoft::ReactNative::Color color{nullptr};
+
+  REACT_FIELD(size)
+  std::optional<std::string> size;
+
+  const winrt::Microsoft::ReactNative::ViewProps ViewProps;
+};
+
+struct ActivityIndicatorViewEventEmitter {
+  ActivityIndicatorViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter)
+      : m_eventEmitter(eventEmitter) {}
+
+ private:
+  winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr};
+};
+
+template<typename TUserData>
+struct BaseActivityIndicatorView {
+
+  virtual void UpdateProps(
+    const winrt::Microsoft::ReactNative::ComponentView &/*view*/,
+    const winrt::com_ptr<ActivityIndicatorViewProps> &newProps,
+    const winrt::com_ptr<ActivityIndicatorViewProps> &/*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<ActivityIndicatorViewEventEmitter> &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<ActivityIndicatorViewEventEmitter>& EventEmitter() const { return m_eventEmitter; }
+  const winrt::com_ptr<ActivityIndicatorViewProps>& Props() const { return m_props; }
+
+private:
+  winrt::com_ptr<ActivityIndicatorViewProps> m_props;
+  std::shared_ptr<ActivityIndicatorViewEventEmitter> m_eventEmitter;
+};
+
+template <typename TUserData>
+void RegisterActivityIndicatorViewNativeComponent(
+    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"ActivityIndicatorView", [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<ActivityIndicatorViewProps>(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<ActivityIndicatorViewProps>() : nullptr, oldProps ? oldProps.as<ActivityIndicatorViewProps>() : 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<ActivityIndicatorViewEventEmitter>(eventEmitter));
+        });
+
+        if constexpr (&TUserData::FinalizeUpdate != &BaseActivityIndicatorView<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 != &BaseActivityIndicatorView<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 != &BaseActivityIndicatorView<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 != &BaseActivityIndicatorView<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 (&TUserData::Initialize != &BaseActivityIndicatorView<TUserData>::Initialize) {
+            userData->Initialize(view);
+          }
+          view.UserData(*userData);
+        });
+
+        if constexpr (&TUserData::CreateVisual != &BaseActivityIndicatorView<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