react-native-windows 0.84.0-preview.6 → 0.84.0-preview.9

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

@@ -1092,12 +1092,26 @@ void CompositionEventHandler::onPointerCaptureLost(
   if (SurfaceId() == -1)
     return;
 
-  if (m_pointerCapturingComponentTag) {
+  if (m_pointerCapturingComponentTag != -1) {
     // copy array to avoid iterator being invalidated during deletion
     std::unordered_set<PointerId> capturedPointers = m_capturedPointers;
 
     for (auto pointerId : capturedPointers) {
       releasePointerCapture(pointerId, m_pointerCapturingComponentTag);
+
+      // Cancel any active touch for this pointer so React Native is notified that
+      // the touch ended. Without this, m_activeTouches retains a zombie entry and
+      // RN JS is never told the touch is gone — leaving Pressables stuck in a
+      // pressed state after a system-interrupted gesture (e.g. system back swipe,
+      // Alt+Tab, another window coming foreground).
+      auto activeTouch = m_activeTouches.find(pointerId);
+      if (activeTouch != m_activeTouches.end()) {
+        ActiveTouch cancelledTouchCopy = std::move(activeTouch->second);
+        m_activeTouches.erase(activeTouch);
+        if (cancelledTouchCopy.eventEmitter) {
+          DispatchSynthesizedTouchCancelForActiveTouch(cancelledTouchCopy, pointerPoint, keyModifiers);
+        }
+      }
     }
 
     m_pointerCapturingComponentTag = -1;
@@ -1214,6 +1228,37 @@ void CompositionEventHandler::onPointerExited(
   }
 }
 
+// Windows touch pointer IDs can be arbitrarily large (e.g. 2233). React Native's JS
+// touch handler uses identifiers as array indices and warns/misbehaves for values > 20.
+// This function maps each live Windows pointer to a small identifier in [0, 19] by
+// scanning m_activeTouches for in-use slots and cycling from the last assigned index.
+// Identifier MOUSE_POINTER_ID (1) is permanently reserved for mouse and never returned here.
+int CompositionEventHandler::AllocateTouchIdentifier() noexcept {
+  constexpr int kMaxTouchIdentifier = 20;
+  for (int i = 0; i < kMaxTouchIdentifier; i++) {
+    int candidate = (m_touchId + i) % kMaxTouchIdentifier;
+    if (candidate == static_cast<int>(MOUSE_POINTER_ID)) {
+      continue; // reserved for mouse
+    }
+    bool inUse = std::any_of(m_activeTouches.begin(), m_activeTouches.end(), [candidate](const auto &pair) {
+      return pair.second.touch.identifier == candidate;
+    });
+    if (!inUse) {
+      m_touchId = (candidate + 1) % kMaxTouchIdentifier;
+      return candidate;
+    }
+  }
+  // All non-mouse slots occupied (> 19 simultaneous touch/pen points) — wrap anyway,
+  // skipping the mouse-reserved slot.
+  int fallback = m_touchId;
+  m_touchId = (m_touchId + 1) % kMaxTouchIdentifier;
+  if (fallback == static_cast<int>(MOUSE_POINTER_ID)) {
+    fallback = m_touchId;
+    m_touchId = (m_touchId + 1) % kMaxTouchIdentifier;
+  }
+  return fallback;
+}
+
 void CompositionEventHandler::onPointerPressed(
     const winrt::Microsoft::ReactNative::Composition::Input::PointerPoint &pointerPoint,
     winrt::Windows::System::VirtualKeyModifiers keyModifiers) noexcept {
@@ -1322,11 +1367,18 @@ void CompositionEventHandler::onPointerPressed(
     UpdateActiveTouch(activeTouch, ptScaled, ptLocal);
 
     activeTouch.isPrimary = pointerId == 1;
-    activeTouch.touch.identifier = pointerId;
+    // Map the Windows pointer ID to a small identifier (0–19) safe for use as a JS array index.
+    // Windows touch IDs can be arbitrarily large (e.g. 2233), which causes React Native to warn
+    // and corrupts touch state, leaving Pressables stuck after a scroll.
+    // Mouse pointer ID is always 1 (MOUSE_POINTER_ID), which is already within the safe range —
+    // use it directly to preserve stable, predictable identifier assignment for mouse input.
+    activeTouch.touch.identifier = (pointerPoint.PointerDeviceType() == Composition::Input::PointerDeviceType::Mouse)
+        ? static_cast<int>(MOUSE_POINTER_ID)
+        : AllocateTouchIdentifier();
 
     // If the pointer has not been marked as hovering over views before the touch started, we register
     // that the activeTouch should not maintain its hovered state once the pointer has been lifted.
-    auto currentlyHoveredTags = m_currentlyHoveredViewsPerPointer.find(activeTouch.touch.identifier);
+    auto currentlyHoveredTags = m_currentlyHoveredViewsPerPointer.find(pointerId);
     if (currentlyHoveredTags == m_currentlyHoveredViewsPerPointer.end() || currentlyHoveredTags->second.empty()) {
       activeTouch.shouldLeaveWhenReleased = true;
     }
@@ -1641,7 +1693,7 @@ void CompositionEventHandler::DispatchTouchEvent(
       continue;
     }
 
-    if (activeTouch.touch.identifier == pointerId) {
+    if (pair.first == pointerId) {
       event.changedTouches.insert(activeTouch.touch);
     }
     uniqueEventEmitters.insert(activeTouch.eventEmitter);

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

@@ -162,8 +162,13 @@ class CompositionEventHandler : public std::enable_shared_from_this<CompositionE
   void UpdateCursor() noexcept;
   void SetCursor(facebook::react::Cursor cursor, HCURSOR hcur) noexcept;
 
+  // Allocates a small touch identifier (0–19) that is safe to use as a JS array index.
+  // Windows pointer IDs can be arbitrarily large, which causes React Native to warn and
+  // back-fill huge arrays, corrupting touch state after scrolling.
+  int AllocateTouchIdentifier() noexcept;
+
   std::map<PointerId, ActiveTouch> m_activeTouches; // iOS is map of touch event args to ActiveTouch..?
-  PointerId m_touchId = 0;
+  int m_touchId = 0; // cycling base used by AllocateTouchIdentifier
 
   std::map<PointerId, std::vector<ReactTaggedView>> m_currentlyHoveredViewsPerPointer;
   winrt::weak_ref<winrt::Microsoft::ReactNative::ReactNativeIsland> m_wkRootView;

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

@@ -130,6 +130,7 @@ void ImageComponentView::didReceiveImage(const std::shared_ptr<ImageResponseImag
 #endif
 
   m_imageResponseImage = imageResponseImage;
+  m_requiresImageRedraw = true;
   ensureDrawingSurface();
 }
 
@@ -310,6 +311,9 @@ void ImageComponentView::ensureDrawingSurface() noexcept {
   } else if (m_imageResponseImage->m_brushFactory) {
     Visual().as<Experimental::ISpriteVisual>().Brush(
         m_imageResponseImage->m_brushFactory(m_reactContext.Handle(), m_compContext));
+  } else if (m_requiresImageRedraw) {
+    m_requiresImageRedraw = false;
+    DrawImage();
   }
 }
 

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

@@ -96,6 +96,7 @@ struct ImageComponentView : ImageComponentViewT<ImageComponentView, ViewComponen
   winrt::Microsoft::ReactNative::Composition::Experimental::IDrawingSurfaceBrush m_drawingSurface;
   std::shared_ptr<ImageResponseImage> m_imageResponseImage;
   std::shared_ptr<WindowsImageResponseObserver> m_imageResponseObserver;
+  bool m_requiresImageRedraw{true};
   facebook::react::ImageShadowNode::ConcreteState::Shared m_state;
 };
 

package/PropertySheets/Generated/PackageVersion.g.props

@@ -10,11 +10,11 @@
 -->
 <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
   <PropertyGroup>
-    <ReactNativeWindowsVersion>0.84.0-preview.6</ReactNativeWindowsVersion>
+    <ReactNativeWindowsVersion>0.84.0-preview.9</ReactNativeWindowsVersion>
     <ReactNativeWindowsMajor>0</ReactNativeWindowsMajor>
     <ReactNativeWindowsMinor>84</ReactNativeWindowsMinor>
     <ReactNativeWindowsPatch>0</ReactNativeWindowsPatch>
     <ReactNativeWindowsCanary>false</ReactNativeWindowsCanary>
-    <ReactNativeWindowsCommitId>91ceaa8418a39db986927aaaff0cdd07dbf9ba2e</ReactNativeWindowsCommitId>
+    <ReactNativeWindowsCommitId>724a8ddbf9f6996e42bbab42ae4e642efaffe27f</ReactNativeWindowsCommitId>
   </PropertyGroup>
 </Project>

package/PropertySheets/JSEngine.props

@@ -6,7 +6,7 @@
     <!-- Enabling this will (1) Include hermes glues in the Microsoft.ReactNative binaries AND (2) Make hermes the default engine -->
     <UseHermes Condition="'$(UseHermes)' == ''">true</UseHermes>
     <!-- This will be true if (1) the client want to use hermes by setting UseHermes to true OR (2) We are building for UWP where dynamic switching is enabled -->
-    <HermesVersion Condition="'$(HermesVersion)' == ''">0.0.0-2512.22001-bc3d0ed7</HermesVersion>
+    <HermesVersion Condition="'$(HermesVersion)' == ''">0.0.0-2604.21001-94aa5e1d</HermesVersion>
     <HermesPackageName Condition="'$(HermesPackageName)' == ''">Microsoft.JavaScript.Hermes</HermesPackageName>
     <HermesPackage Condition="'$(HermesPackage)' == '' And Exists('$(PkgMicrosoft_JavaScript_Hermes)')">$(PkgMicrosoft_JavaScript_Hermes)</HermesPackage>
     <HermesPackage Condition="'$(HermesPackage)' == ''">$(NuGetPackageRoot)\$(HermesPackageName)\$(HermesVersion)</HermesPackage>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-windows",
-  "version": "0.84.0-preview.6",
+  "version": "0.84.0-preview.9",
   "license": "MIT",
   "repository": {
     "type": "git",