react-native 0.77.2 → 0.77.3

package/Libraries/Core/ReactNativeVersion.js

@@ -16,7 +16,7 @@ const version: $ReadOnly<{
 }> = {
   major: 0,
   minor: 77,
-  patch: 2,
+  patch: 3,
   prerelease: null,
 };
 

package/Libraries/Network/RCTDataRequestHandler.mm

@@ -8,6 +8,8 @@
 #import <React/RCTDataRequestHandler.h>
 #import <ReactCommon/RCTTurboModule.h>
 
+#import <mutex>
+
 #import "RCTNetworkPlugins.h"
 
 @interface RCTDataRequestHandler () <RCTTurboModule>
@@ -15,14 +17,22 @@
 
 @implementation RCTDataRequestHandler {
   NSOperationQueue *_queue;
+  std::mutex _operationHandlerMutexLock;
 }
 
 RCT_EXPORT_MODULE()
 
 - (void)invalidate
 {
-  [_queue cancelAllOperations];
-  _queue = nil;
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
+  if (_queue) {
+    for (NSOperation *operation in _queue.operations) {
+      if (!operation.isCancelled && !operation.isFinished) {
+        [operation cancel];
+      }
+    }
+    _queue = nil;
+  }
 }
 
 - (BOOL)canHandleRequest:(NSURLRequest *)request
@@ -32,6 +42,7 @@ RCT_EXPORT_MODULE()
 
 - (NSOperation *)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
 {
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
   // Lazy setup
   if (!_queue) {
     _queue = [NSOperationQueue new];
@@ -69,7 +80,10 @@ RCT_EXPORT_MODULE()
 
 - (void)cancelRequest:(NSOperation *)op
 {
-  [op cancel];
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
+  if (!op.isCancelled && !op.isFinished) {
+    [op cancel];
+  }
 }
 
 - (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:

package/Libraries/Network/RCTFileRequestHandler.mm

@@ -7,6 +7,8 @@
 
 #import <React/RCTFileRequestHandler.h>
 
+#import <mutex>
+
 #import <MobileCoreServices/MobileCoreServices.h>
 
 #import <React/RCTUtils.h>
@@ -19,14 +21,22 @@
 
 @implementation RCTFileRequestHandler {
   NSOperationQueue *_fileQueue;
+  std::mutex _operationHandlerMutexLock;
 }
 
 RCT_EXPORT_MODULE()
 
 - (void)invalidate
 {
-  [_fileQueue cancelAllOperations];
-  _fileQueue = nil;
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
+  if (_fileQueue) {
+    for (NSOperation *operation in _fileQueue.operations) {
+      if (!operation.isCancelled && !operation.isFinished) {
+        [operation cancel];
+      }
+    }
+    _fileQueue = nil;
+  }
 }
 
 - (BOOL)canHandleRequest:(NSURLRequest *)request
@@ -36,6 +46,7 @@ RCT_EXPORT_MODULE()
 
 - (NSOperation *)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
 {
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
   // Lazy setup
   if (!_fileQueue) {
     _fileQueue = [NSOperationQueue new];
@@ -83,7 +94,10 @@ RCT_EXPORT_MODULE()
 
 - (void)cancelRequest:(NSOperation *)op
 {
-  [op cancel];
+  std::lock_guard<std::mutex> lock(_operationHandlerMutexLock);
+  if (!op.isCancelled && !op.isFinished) {
+    [op cancel];
+  }
 }
 
 - (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:

package/React/Base/RCTVersion.m

@@ -23,7 +23,7 @@ NSDictionary* RCTGetReactNativeVersion(void)
     __rnVersion = @{
                   RCTVersionMajor: @(0),
                   RCTVersionMinor: @(77),
-                  RCTVersionPatch: @(2),
+                  RCTVersionPatch: @(3),
                   RCTVersionPrerelease: [NSNull null],
                   };
   });

package/React/DevSupport/RCTPausedInDebuggerOverlayController.mm

@@ -54,13 +54,11 @@
   ]];
 
   UIButton *resumeButton = [UIButton buttonWithType:UIButtonTypeCustom];
-  [resumeButton setImage:[UIImage systemImageNamed:@"forward.frame.fill"] forState:UIControlStateNormal];
+  UIImage *image = [UIImage systemImageNamed:@"forward.frame.fill"];
+  [resumeButton setImage:image forState:UIControlStateNormal];
+  [resumeButton setImage:image forState:UIControlStateDisabled];
   resumeButton.tintColor = [UIColor colorWithRed:0.37 green:0.37 blue:0.37 alpha:1];
 
-  resumeButton.configurationUpdateHandler = ^(UIButton *button) {
-    button.imageView.tintAdjustmentMode = UIViewTintAdjustmentModeNormal;
-  };
-
   resumeButton.enabled = NO;
   [NSLayoutConstraint activateConstraints:@[
     [resumeButton.widthAnchor constraintEqualToConstant:48],

package/React/Fabric/Mounting/ComponentViews/LegacyViewManagerInterop/RCTLegacyViewManagerInteropComponentView.mm

@@ -170,10 +170,24 @@ static NSString *const kRCTLegacyInteropChildIndexKey = @"index";
 
 - (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index
 {
-  [_viewsToBeMounted addObject:@{
-    kRCTLegacyInteropChildIndexKey : [NSNumber numberWithInteger:index],
-    kRCTLegacyInteropChildComponentKey : childComponentView
-  }];
+  if (_adapter && index == _adapter.paperView.reactSubviews.count) {
+    // This is a new child view that is being added to the end of the children array.
+    // After the children is added, we need to call didUpdateReactSubviews to make sure that it is rendered.
+    // Without this change, the new child will not be rendered right away because the didUpdateReactSubviews is not
+    // called and the `finalizeUpdate` is not invoked.
+    if ([childComponentView isKindOfClass:[RCTLegacyViewManagerInteropComponentView class]]) {
+      UIView *target = ((RCTLegacyViewManagerInteropComponentView *)childComponentView).contentView;
+      [_adapter.paperView insertReactSubview:target atIndex:index];
+    } else {
+      [_adapter.paperView insertReactSubview:childComponentView atIndex:index];
+    }
+    [_adapter.paperView didUpdateReactSubviews];
+  } else {
+    [_viewsToBeMounted addObject:@{
+      kRCTLegacyInteropChildIndexKey : [NSNumber numberWithInteger:index],
+      kRCTLegacyInteropChildComponentKey : childComponentView
+    }];
+  }
 }
 
 - (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index

package/React/Fabric/Mounting/ComponentViews/Modal/RCTModalHostViewComponentView.mm

@@ -104,7 +104,6 @@ static ModalHostViewEventEmitter::OnOrientationChange onOrientationChangeStruct(
   BOOL _shouldAnimatePresentation;
   BOOL _shouldPresent;
   BOOL _isPresented;
-  UIView *_modalContentsSnapshot;
 }
 
 - (instancetype)initWithFrame:(CGRect)frame
@@ -141,7 +140,6 @@ static ModalHostViewEventEmitter::OnOrientationChange onOrientationChangeStruct(
                      animated:(BOOL)animated
                    completion:(void (^)(void))completion
 {
-  _modalContentsSnapshot = [self.viewController.view snapshotViewAfterScreenUpdates:NO];
   [modalViewController dismissViewControllerAnimated:animated completion:completion];
 }
 
@@ -167,8 +165,7 @@ static ModalHostViewEventEmitter::OnOrientationChange onOrientationChangeStruct(
     _isPresented = NO;
     // To animate dismissal of view controller, snapshot of
     // view hierarchy needs to be added to the UIViewController.
-    UIView *snapshot = _modalContentsSnapshot;
-
+    UIView *snapshot = [self.viewController.view snapshotViewAfterScreenUpdates:NO];
     if (_shouldPresent) {
       [self.viewController.view addSubview:snapshot];
     }

package/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm

@@ -547,6 +547,17 @@ static inline UIViewAnimationOptions animationOptionsWithCurve(UIViewAnimationCu
   return metrics;
 }
 
+- (ScrollViewEventEmitter::EndDragMetrics)_scrollViewMetricsWithVelocity:(CGPoint)velocity
+                                                  andTargetContentOffset:(CGPoint)targetContentOffset
+{
+  ScrollViewEventEmitter::EndDragMetrics metrics = [self _scrollViewMetrics];
+  metrics.targetContentOffset.x = targetContentOffset.x;
+  metrics.targetContentOffset.y = targetContentOffset.y;
+  metrics.velocity.x = velocity.x;
+  metrics.velocity.y = velocity.y;
+  return metrics;
+}
+
 - (void)_updateStateWithContentOffset
 {
   if (!_state) {
@@ -602,6 +613,14 @@ static inline UIViewAnimationOptions animationOptionsWithCurve(UIViewAnimationCu
       targetContentOffset->y = scrollView.contentOffset.y + travel * _endDraggingSensitivityMultiplier;
     }
   }
+
+  if (!_eventEmitter) {
+    return;
+  }
+
+  auto metrics = [self _scrollViewMetricsWithVelocity:velocity andTargetContentOffset:*targetContentOffset];
+
+  static_cast<const ScrollViewEventEmitter &>(*_eventEmitter).onScrollEndDrag(metrics);
 }
 
 - (BOOL)touchesShouldCancelInContentView:(__unused UIView *)view
@@ -672,8 +691,6 @@ static inline UIViewAnimationOptions animationOptionsWithCurve(UIViewAnimationCu
     return;
   }
 
-  static_cast<const ScrollViewEventEmitter &>(*_eventEmitter).onScrollEndDrag([self _scrollViewMetrics]);
-
   [self _updateStateWithContentOffset];
 
   if (!decelerate) {
@@ -770,7 +787,9 @@ static inline UIViewAnimationOptions animationOptionsWithCurve(UIViewAnimationCu
     return;
   }
 
-  static_cast<const ScrollViewEventEmitter &>(*_eventEmitter).onScrollEndDrag([self _scrollViewMetrics]);
+  auto metrics = [self _scrollViewMetricsWithVelocity:{} andTargetContentOffset:{}];
+  static_cast<const ScrollViewEventEmitter &>(*_eventEmitter).onScrollEndDrag(metrics);
+
   [self _updateStateWithContentOffset];
 }
 

package/React/Fabric/Mounting/ComponentViews/Switch/RCTSwitchComponentView.mm

@@ -60,7 +60,7 @@ using namespace facebook::react;
   const auto &newSwitchProps = static_cast<const SwitchProps &>(*props);
 
   // `value`
-  if (oldSwitchProps.value != newSwitchProps.value) {
+  if (!_isInitialValueSet || oldSwitchProps.value != newSwitchProps.value) {
     BOOL shouldAnimate = _isInitialValueSet == YES;
     [_switchView setOn:newSwitchProps.value animated:shouldAnimate];
   }

package/React/Fabric/Surface/RCTFabricSurface.mm

@@ -143,6 +143,7 @@ using namespace facebook::react;
 
   if (!_view) {
     _view = [[RCTSurfaceView alloc] initWithSurface:(RCTSurface *)self];
+    [self _updateLayoutContext];
     _touchHandler = [RCTSurfaceTouchHandler new];
     [_touchHandler attachToView:_view];
   }

package/ReactAndroid/gradle.properties

@@ -1,4 +1,4 @@
-VERSION_NAME=0.77.2
+VERSION_NAME=0.77.3
 react.internal.publishingGroup=com.facebook.react
 
 android.useAndroidX=true

package/ReactAndroid/src/main/java/com/facebook/react/ReactInstanceManager.java

@@ -1409,14 +1409,14 @@ public class ReactInstanceManager {
             new RuntimeException(
                 "detachRootViewFromInstance called with ReactRootView with invalid id"));
       }
-
-      clearReactRoot(reactRoot);
     } else {
       reactContext
           .getCatalystInstance()
           .getJSModule(AppRegistry.class)
           .unmountApplicationComponentAtRootTag(reactRoot.getRootViewTag());
     }
+
+    clearReactRoot(reactRoot);
   }
 
   @ThreadConfined(UI)

package/ReactAndroid/src/main/java/com/facebook/react/fabric/FabricUIManager.java

@@ -171,7 +171,7 @@ public class FabricUIManager
   private final CopyOnWriteArrayList<UIManagerListener> mListeners = new CopyOnWriteArrayList<>();
 
   private boolean mMountNotificationScheduled = false;
-  private final List<Integer> mMountedSurfaceIds = new ArrayList<>();
+  private List<Integer> mSurfaceIdsWithPendingMountNotification = new ArrayList<>();
 
   @ThreadConfined(UI)
   @NonNull
@@ -1261,12 +1261,15 @@ public class FabricUIManager
 
       // Collect surface IDs for all the mount items
       for (MountItem mountItem : mountItems) {
-        if (mountItem != null && !mMountedSurfaceIds.contains(mountItem.getSurfaceId())) {
-          mMountedSurfaceIds.add(mountItem.getSurfaceId());
+        if (mountItem != null
+            && !mSurfaceIdsWithPendingMountNotification.contains(mountItem.getSurfaceId())) {
+          mSurfaceIdsWithPendingMountNotification.add(mountItem.getSurfaceId());
         }
       }
 
-      if (!mMountNotificationScheduled && !mMountedSurfaceIds.isEmpty()) {
+      if (!mMountNotificationScheduled && !mSurfaceIdsWithPendingMountNotification.isEmpty()) {
+        mMountNotificationScheduled = true;
+
         // Notify mount when the effects are visible and prevent mount hooks to
         // delay paint.
         UiThreadUtil.getUiThreadHandler()
@@ -1276,17 +1279,19 @@ public class FabricUIManager
                   public void run() {
                     mMountNotificationScheduled = false;
 
+                    // Create a copy in case mount hooks trigger more mutations
+                    final List<Integer> surfaceIdsToReportMount =
+                        mSurfaceIdsWithPendingMountNotification;
+                    mSurfaceIdsWithPendingMountNotification = new ArrayList<>();
+
                     final @Nullable FabricUIManagerBinding binding = mBinding;
                     if (binding == null || mDestroyed) {
-                      mMountedSurfaceIds.clear();
                       return;
                     }
 
-                    for (int surfaceId : mMountedSurfaceIds) {
+                    for (int surfaceId : surfaceIdsToReportMount) {
                       binding.reportMount(surfaceId);
                     }
-
-                    mMountedSurfaceIds.clear();
                   }
                 });
       }

package/ReactAndroid/src/main/java/com/facebook/react/modules/statusbar/StatusBarModule.kt

@@ -13,8 +13,6 @@ import android.os.Build
 import android.view.View
 import android.view.WindowInsetsController
 import android.view.WindowManager
-import androidx.core.view.ViewCompat
-import androidx.core.view.WindowInsetsCompat
 import com.facebook.common.logging.FLog
 import com.facebook.fbreact.specs.NativeStatusBarManagerAndroidSpec
 import com.facebook.react.bridge.GuardedRunnable
@@ -23,6 +21,7 @@ import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.bridge.UiThreadUtil
 import com.facebook.react.common.ReactConstants
 import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.DisplayMetricsHolder.getStatusBarHeightPx
 import com.facebook.react.uimanager.PixelUtil
 import com.facebook.react.views.view.setStatusBarTranslucency
 import com.facebook.react.views.view.setStatusBarVisibility
@@ -34,29 +33,17 @@ public class StatusBarModule(reactContext: ReactApplicationContext?) :
 
   @Suppress("DEPRECATION")
   override fun getTypedExportedConstants(): Map<String, Any> {
+    val currentActivity = reactApplicationContext.currentActivity
     val statusBarColor =
         currentActivity?.window?.statusBarColor?.let { color ->
           String.format("#%06X", 0xFFFFFF and color)
         } ?: "black"
     return mapOf(
-        HEIGHT_KEY to PixelUtil.toDIPFromPixel(getStatusBarHeightPx()),
+        HEIGHT_KEY to PixelUtil.toDIPFromPixel(getStatusBarHeightPx(currentActivity).toFloat()),
         DEFAULT_BACKGROUND_COLOR_KEY to statusBarColor,
     )
   }
 
-  @Suppress("DEPRECATION")
-  private fun getStatusBarHeightPx(): Float {
-    val windowInsets =
-        currentActivity?.window?.decorView?.let(ViewCompat::getRootWindowInsets) ?: return 0f
-    return windowInsets
-        .getInsets(
-            WindowInsetsCompat.Type.statusBars() or
-                WindowInsetsCompat.Type.navigationBars() or
-                WindowInsetsCompat.Type.displayCutout())
-        .top
-        .toFloat()
-  }
-
   @Suppress("DEPRECATION")
   override fun setColor(colorDouble: Double, animated: Boolean) {
     val color = colorDouble.toInt()

package/ReactAndroid/src/main/java/com/facebook/react/modules/systeminfo/ReactNativeVersion.java

@@ -17,6 +17,6 @@ public class ReactNativeVersion {
   public static final Map<String, Object> VERSION = MapBuilder.<String, Object>of(
       "major", 0,
       "minor", 77,
-      "patch", 2,
+      "patch", 3,
       "prerelease", null);
 }

package/ReactAndroid/src/main/java/com/facebook/react/uimanager/DisplayMetricsHolder.kt

@@ -7,9 +7,12 @@
 
 package com.facebook.react.uimanager
 
+import android.app.Activity
 import android.content.Context
 import android.util.DisplayMetrics
 import android.view.WindowManager
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowInsetsCompat
 import com.facebook.react.bridge.WritableMap
 import com.facebook.react.bridge.WritableNativeMap
 
@@ -99,4 +102,14 @@ public object DisplayMetricsHolder {
         putDouble("fontScale", fontScale)
         putDouble("densityDpi", displayMetrics.densityDpi.toDouble())
       }
+
+  internal fun getStatusBarHeightPx(activity: Activity?): Int {
+    val windowInsets = activity?.window?.decorView?.let(ViewCompat::getRootWindowInsets) ?: return 0
+    return windowInsets
+        .getInsets(
+            WindowInsetsCompat.Type.statusBars() or
+                WindowInsetsCompat.Type.navigationBars() or
+                WindowInsetsCompat.Type.displayCutout())
+        .top
+  }
 }

package/ReactAndroid/src/main/java/com/facebook/react/uimanager/NativeViewHierarchyManager.java

@@ -671,9 +671,6 @@ public class NativeViewHierarchyManager {
     View rootView = mTagsToViews.get(rootViewTag);
     dropView(rootView);
     mRootTags.delete(rootViewTag);
-    if (rootView != null) {
-      rootView.setId(View.NO_ID);
-    }
   }
 
   /**

package/ReactAndroid/src/main/java/com/facebook/react/uimanager/style/BorderRadiusStyle.kt

@@ -136,10 +136,10 @@ public data class BorderRadiusStyle(
                     (startStart ?: topStart ?: topLeft ?: uniform)?.resolve(width, height)
                         ?: zeroRadii,
                 bottomLeft =
-                    (endEnd ?: bottomStart ?: bottomRight ?: uniform)?.resolve(width, height)
+                    (endEnd ?: bottomEnd ?: bottomRight ?: uniform)?.resolve(width, height)
                         ?: zeroRadii,
                 bottomRight =
-                    (startEnd ?: bottomEnd ?: bottomLeft ?: uniform)?.resolve(width, height)
+                    (startEnd ?: bottomStart ?: bottomLeft ?: uniform)?.resolve(width, height)
                         ?: zeroRadii,
                 width = width,
                 height = height,

package/ReactAndroid/src/main/java/com/facebook/react/views/modal/ReactModalHostView.kt

@@ -37,6 +37,8 @@ import com.facebook.react.bridge.WritableNativeMap
 import com.facebook.react.common.ReactConstants
 import com.facebook.react.common.annotations.VisibleForTesting
 import com.facebook.react.config.ReactFeatureFlags
+import com.facebook.react.uimanager.DisplayMetricsHolder
+import com.facebook.react.uimanager.DisplayMetricsHolder.getStatusBarHeightPx
 import com.facebook.react.uimanager.JSPointerDispatcher
 import com.facebook.react.uimanager.JSTouchDispatcher
 import com.facebook.react.uimanager.PixelUtil.pxToDp
@@ -49,6 +51,7 @@ import com.facebook.react.views.common.ContextUtils
 import com.facebook.react.views.view.ReactViewGroup
 import com.facebook.react.views.view.setStatusBarTranslucency
 import com.facebook.react.views.view.setSystemBarsTranslucency
+import com.facebook.yoga.annotations.DoNotStrip
 import java.util.Objects
 
 /**
@@ -119,6 +122,7 @@ public class ReactModalHostView(context: ThemedReactContext) :
   private var createNewDialog = false
 
   init {
+    initStatusBarHeight(context)
     dialogRootViewGroup = DialogRootViewGroup(context)
   }
 
@@ -220,6 +224,15 @@ public class ReactModalHostView(context: ThemedReactContext) :
 
   private fun getCurrentActivity(): Activity? = (context as ThemedReactContext).currentActivity
 
+  private fun isFlagSecureSet(activity: Activity?): Boolean {
+    if (activity == null) {
+      return false
+    }
+
+    val flags = activity.window.attributes.flags
+    return (flags and WindowManager.LayoutParams.FLAG_SECURE) != 0
+  }
+
   /**
    * showOrUpdate will display the Dialog. It is called by the manager once all properties are set
    * because we need to know all of them before creating the Dialog. It is also smart during updates
@@ -293,6 +306,11 @@ public class ReactModalHostView(context: ThemedReactContext) :
     if (hardwareAccelerated) {
       newDialog.window?.addFlags(WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED)
     }
+    val flagSecureSet = isFlagSecureSet(currentActivity)
+    if (flagSecureSet) {
+      newDialog.window?.setFlags(
+          WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE)
+    }
     if (currentActivity?.isFinishing == false) {
       newDialog.show()
       updateSystemAppearance()
@@ -395,6 +413,26 @@ public class ReactModalHostView(context: ThemedReactContext) :
 
   private companion object {
     private const val TAG = "ReactModalHost"
+
+    // We store the status bar height to be able to properly position
+    // the modal on the first render.
+    private var statusBarHeight = 0
+
+    private fun initStatusBarHeight(reactContext: ReactContext) {
+      statusBarHeight = getStatusBarHeightPx(reactContext.currentActivity)
+    }
+
+    @JvmStatic
+    @DoNotStrip
+    private fun getScreenDisplayMetricsWithoutInsets(): Long {
+      val displayMetrics = DisplayMetricsHolder.getScreenDisplayMetrics()
+      return encodeFloatsToLong(
+          displayMetrics.widthPixels.toFloat().pxToDp(),
+          (displayMetrics.heightPixels - statusBarHeight).toFloat().pxToDp())
+    }
+
+    private fun encodeFloatsToLong(width: Float, height: Float): Long =
+        (width.toRawBits().toLong()) shl 32 or (height.toRawBits().toLong())
   }
 
   /**
@@ -410,6 +448,7 @@ public class ReactModalHostView(context: ThemedReactContext) :
    */
   public class DialogRootViewGroup internal constructor(context: Context) :
       ReactViewGroup(context), RootView {
+
     internal var stateWrapper: StateWrapper? = null
     internal var eventDispatcher: EventDispatcher? = null
 

package/ReactCommon/React-FabricComponents.podspec

@@ -112,7 +112,7 @@ Pod::Spec.new do |s|
     ss.subspec "modal" do |sss|
       sss.dependency             folly_dep_name, folly_version
       sss.compiler_flags       = folly_compiler_flags
-      sss.source_files         = "react/renderer/components/modal/**/*.{m,mm,cpp,h}"
+      sss.source_files         = "react/renderer/components/modal/*.{m,mm,cpp,h}"
       sss.exclude_files        = "react/renderer/components/modal/tests"
       sss.header_dir           = "react/renderer/components/modal"
     end

package/ReactCommon/cxxreact/ReactNativeVersion.h

@@ -17,7 +17,7 @@ namespace facebook::react {
 constexpr struct {
   int32_t Major = 0;
   int32_t Minor = 77;
-  int32_t Patch = 2;
+  int32_t Patch = 3;
   std::string_view Prerelease = "";
 } ReactNativeVersion;
 

package/ReactCommon/react/renderer/components/modal/CMakeLists.txt

@@ -14,7 +14,10 @@ add_compile_options(
         -Wpedantic
         -DLOG_TAG=\"Fabric\")
 
-file(GLOB rrc_modal_SRC CONFIGURE_DEPENDS *.cpp)
+file(GLOB rrc_modal_SRC CONFIGURE_DEPENDS
+        *.cpp
+        platform/android/*.cpp)
+
 add_library(rrc_modal STATIC ${rrc_modal_SRC})
 
 target_include_directories(rrc_modal PUBLIC ${REACT_COMMON_DIR})

package/ReactCommon/react/renderer/components/modal/ModalHostViewComponentDescriptor.h

@@ -30,8 +30,9 @@ class ModalHostViewComponentDescriptor final
             *shadowNode.getState())
             .getData();
 
-    layoutableShadowNode.setSize(
-        Size{stateData.screenSize.width, stateData.screenSize.height});
+    layoutableShadowNode.setSize(Size{
+        .width = stateData.screenSize.width,
+        .height = stateData.screenSize.height});
     layoutableShadowNode.setPositionType(YGPositionTypeAbsolute);
 
     ConcreteComponentDescriptor::adopt(shadowNode);

package/ReactCommon/react/renderer/components/modal/ModalHostViewState.h

@@ -9,15 +9,12 @@
 
 #include <react/renderer/core/graphicsConversions.h>
 #include <react/renderer/graphics/Float.h>
+#include "ModalHostViewUtils.h"
 
 #ifdef ANDROID
 #include <folly/dynamic.h>
 #endif
 
-#if defined(__APPLE__) && TARGET_OS_IOS
-#include "ModalHostViewUtils.h"
-#endif
-
 namespace facebook::react {
 
 /*
@@ -27,12 +24,7 @@ class ModalHostViewState final {
  public:
   using Shared = std::shared_ptr<const ModalHostViewState>;
 
-#if defined(__APPLE__) && TARGET_OS_IOS
-  ModalHostViewState() : screenSize(RCTModalHostViewScreenSize()) {
-#else
-  ModalHostViewState(){
-#endif
-  };
+  ModalHostViewState() : screenSize(ModalHostViewScreenSize()) {}
   ModalHostViewState(Size screenSize_) : screenSize(screenSize_){};
 
 #ifdef ANDROID
@@ -40,8 +32,8 @@ class ModalHostViewState final {
       const ModalHostViewState& previousState,
       folly::dynamic data)
       : screenSize(Size{
-            (Float)data["screenWidth"].getDouble(),
-            (Float)data["screenHeight"].getDouble()}){};
+            .width = (Float)data["screenWidth"].getDouble(),
+            .height = (Float)data["screenHeight"].getDouble()}){};
 #endif
 
   const Size screenSize{};

package/ReactCommon/react/renderer/components/modal/ModalHostViewUtils.h

@@ -7,10 +7,10 @@
 
 #pragma once
 
-#include <react/renderer/core/graphicsConversions.h>
+#include <react/renderer/graphics/Size.h>
 
 namespace facebook::react {
 
-Size RCTModalHostViewScreenSize(void);
+Size ModalHostViewScreenSize(void);
 
 } // namespace facebook::react

package/ReactCommon/react/renderer/components/modal/ModalHostViewUtils.mm

@@ -11,7 +11,7 @@
 
 namespace facebook::react {
 
-Size RCTModalHostViewScreenSize(void)
+Size ModalHostViewScreenSize(void)
 {
   CGSize screenSize = RCTScreenSize();
   return {screenSize.width, screenSize.height};

package/ReactCommon/react/renderer/components/modal/platform/android/JReactModalHostView.h

@@ -0,0 +1,38 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <fbjni/fbjni.h>
+#include <react/renderer/graphics/Size.h>
+
+namespace facebook::react {
+
+class JReactModalHostView
+    : public facebook::jni::JavaClass<JReactModalHostView> {
+ public:
+  static auto constexpr kJavaDescriptor =
+      "Lcom/facebook/react/views/modal/ReactModalHostView;";
+
+  static Size getDisplayMetrics() {
+    static auto method =
+        JReactModalHostView::javaClassStatic()->getStaticMethod<jlong()>(
+            "getScreenDisplayMetricsWithoutInsets");
+    auto result = method(javaClassStatic());
+
+    // Inspired from yogaMeassureToSize from conversions.h
+    int32_t wBits = 0xFFFFFFFF & (result >> 32);
+    int32_t hBits = 0xFFFFFFFF & result;
+
+    auto* measuredWidth = reinterpret_cast<float*>(&wBits);
+    auto* measuredHeight = reinterpret_cast<float*>(&hBits);
+
+    return Size{.width = *measuredWidth, .height = *measuredHeight};
+  }
+};
+
+} // namespace facebook::react

package/ReactCommon/react/renderer/components/modal/platform/android/ModalHostViewUtils.cpp

@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <react/renderer/components/modal/ModalHostViewUtils.h>
+#include <react/renderer/graphics/Size.h>
+#include "JReactModalHostView.h"
+
+namespace facebook::react {
+
+Size ModalHostViewScreenSize() {
+  return JReactModalHostView::getDisplayMetrics();
+}
+
+} // namespace facebook::react

package/ReactCommon/react/renderer/components/modal/platform/cxx/ModalHostViewUtils.cpp

@@ -0,0 +1,17 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <react/renderer/components/modal/ModalHostViewUtils.h>
+#include <react/renderer/graphics/Size.h>
+
+namespace facebook::react {
+
+Size ModalHostViewScreenSize() {
+  return Size{0, 0};
+}
+
+} // namespace facebook::react

package/ReactCommon/react/renderer/components/scrollview/ScrollEvent.cpp

@@ -76,6 +76,39 @@ EventPayloadType ScrollEvent::getType() const {
   return EventPayloadType::ScrollEvent;
 }
 
+jsi::Value ScrollEndDragEvent::asJSIValue(jsi::Runtime& runtime) const {
+  auto payload = ScrollEvent::asJSIValue(runtime).asObject(runtime);
+
+  {
+    auto targetContentOffsetObj = jsi::Object(runtime);
+    targetContentOffsetObj.setProperty(runtime, "x", targetContentOffset.x);
+    targetContentOffsetObj.setProperty(runtime, "y", targetContentOffset.y);
+    payload.setProperty(runtime, "targetContentOffset", targetContentOffsetObj);
+  }
+
+  {
+    auto velocityObj = jsi::Object(runtime);
+    velocityObj.setProperty(runtime, "x", velocity.x);
+    velocityObj.setProperty(runtime, "y", velocity.y);
+    payload.setProperty(runtime, "velocity", velocityObj);
+  }
+
+  return payload;
+}
+
+folly::dynamic ScrollEndDragEvent::asDynamic() const {
+  auto metrics = ScrollEvent::asDynamic();
+
+  auto targetContentOffsetObj = folly::dynamic::object(
+      "x", targetContentOffset.x)("y", targetContentOffset.y);
+  metrics["targetContentOffset"] = std::move(targetContentOffsetObj);
+
+  auto velocityObj = folly::dynamic::object("x", velocity.x)("y", velocity.y);
+  metrics["velocity"] = std::move(velocityObj);
+
+  return metrics;
+};
+
 #if RN_DEBUG_STRING_CONVERTIBLE
 
 std::string getDebugName(const ScrollEvent& /*scrollEvent*/) {

package/ReactCommon/react/renderer/components/scrollview/ScrollEvent.h

@@ -37,6 +37,23 @@ struct ScrollEvent : public EventPayload {
   EventPayloadType getType() const override;
 };
 
+struct ScrollEndDragEvent : public ScrollEvent {
+  Point targetContentOffset;
+  Point velocity;
+
+  ScrollEndDragEvent() = default;
+
+  ScrollEndDragEvent(const ScrollEvent& scrollEvent)
+      : ScrollEvent(scrollEvent), targetContentOffset({}), velocity({}) {}
+
+  folly::dynamic asDynamic() const;
+
+  /*
+   * EventPayload implementations
+   */
+  jsi::Value asJSIValue(jsi::Runtime& runtime) const override;
+};
+
 #if RN_DEBUG_STRING_CONVERTIBLE
 
 std::string getDebugName(const ScrollEvent& scrollEvent);

package/ReactCommon/react/renderer/components/scrollview/ScrollViewEventEmitter.cpp

@@ -25,8 +25,9 @@ void ScrollViewEventEmitter::onScrollBeginDrag(
 }
 
 void ScrollViewEventEmitter::onScrollEndDrag(
-    const ScrollEvent& scrollEvent) const {
-  dispatchScrollViewEvent("scrollEndDrag", scrollEvent);
+    const ScrollEndDragEvent& scrollEvent) const {
+  dispatchEvent(
+      "scrollEndDrag", std::make_shared<ScrollEndDragEvent>(scrollEvent));
 }
 
 void ScrollViewEventEmitter::onMomentumScrollBegin(

package/ReactCommon/react/renderer/components/scrollview/ScrollViewEventEmitter.h

@@ -21,10 +21,11 @@ class ScrollViewEventEmitter : public ViewEventEmitter {
   using ViewEventEmitter::ViewEventEmitter;
 
   using Metrics = ScrollEvent;
+  using EndDragMetrics = ScrollEndDragEvent;
 
   void onScroll(const ScrollEvent& scrollEvent) const;
   void onScrollBeginDrag(const ScrollEvent& scrollEvent) const;
-  void onScrollEndDrag(const ScrollEvent& scrollEvent) const;
+  void onScrollEndDrag(const ScrollEndDragEvent& scrollEvent) const;
   void onMomentumScrollBegin(const ScrollEvent& scrollEvent) const;
   void onMomentumScrollEnd(const ScrollEvent& scrollEvent) const;
   void onScrollToTop(const ScrollEvent& scrollEvent) const;

package/ReactCommon/react/runtime/TimerManager.cpp

@@ -300,8 +300,9 @@ void TimerManager::attachGlobals(jsi::Runtime& runtime) {
             }
 
             if (!args[0].isObject() || !args[0].asObject(rt).isFunction(rt)) {
-              // Do not throw any error to match web spec
-              return timerIndex_++;
+              // Do not throw any error to match web spec; instead return 0, an
+              // invalid timer id
+              return 0;
             }
 
             auto callback = args[0].getObject(rt).getFunction(rt);
@@ -358,8 +359,9 @@ void TimerManager::attachGlobals(jsi::Runtime& runtime) {
             }
 
             if (!args[0].isObject() || !args[0].asObject(rt).isFunction(rt)) {
-              throw jsi::JSError(
-                  rt, "The first argument to setInterval must be a function.");
+              // Do not throw any error to match web spec; instead return 0, an
+              // invalid timer id
+              return 0;
             }
             auto callback = args[0].getObject(rt).getFunction(rt);
             auto delay = count > 1

package/ReactCommon/react/runtime/TimerManager.h

@@ -93,7 +93,9 @@ class TimerManager {
 
   // Each timeout that is registered on this queue gets a sequential id.  This
   // is the global count from which those are assigned.
-  TimerHandle timerIndex_{0};
+  // As per WHATWG HTML 8.6.1 (Timers) ids must be greater than zero, i.e. start
+  // at 1
+  TimerHandle timerIndex_{1};
 
   // The React Native microtask queue is used to back public APIs including
   // `queueMicrotask`, `clearImmediate`, and `setImmediate` (which is used by

package/ReactCommon/react/runtime/tests/cxx/ReactInstanceTest.cpp

@@ -266,7 +266,9 @@ TEST_F(ReactInstanceTest, testSetTimeoutWithoutDelay) {
   EXPECT_CALL(
       *mockRegistry_,
       createTimer(_, 0)); // If delay is not provided, it should use 0
-  eval("setTimeout(() => {});");
+  auto val = eval("setTimeout(() => {});");
+  expectNoError();
+  EXPECT_EQ(val.asNumber(), 1); // First timer id should start at 1
 }
 
 TEST_F(ReactInstanceTest, testSetTimeoutWithPassThroughArgs) {
@@ -298,8 +300,9 @@ TEST_F(ReactInstanceTest, testSetTimeoutWithInvalidArgs) {
       getErrorMessage("setTimeout();"),
       "setTimeout must be called with at least one argument (the function to call).");
 
-  eval("setTimeout('invalid');");
+  auto val = eval("setTimeout('invalid')");
   expectNoError();
+  EXPECT_EQ(val.asNumber(), 0);
 
   eval("setTimeout(() => {}, 'invalid');");
   expectNoError();
@@ -416,9 +419,10 @@ TEST_F(ReactInstanceTest, testSetIntervalWithInvalidArgs) {
   EXPECT_EQ(
       getErrorMessage("setInterval();"),
       "setInterval must be called with at least one argument (the function to call).");
-  EXPECT_EQ(
-      getErrorMessage("setInterval('invalid', 100);"),
-      "The first argument to setInterval must be a function.");
+
+  auto val = eval("setInterval('invalid', 100)");
+  expectNoError();
+  EXPECT_EQ(val.asNumber(), 0);
 }
 
 TEST_F(ReactInstanceTest, testClearInterval) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native",
-  "version": "0.77.2",
+  "version": "0.77.3",
   "description": "A framework for building native apps using React",
   "license": "MIT",
   "repository": {
@@ -108,13 +108,13 @@
   },
   "dependencies": {
     "@jest/create-cache-key-function": "^29.6.3",
-    "@react-native/assets-registry": "0.77.2",
-    "@react-native/codegen": "0.77.2",
-    "@react-native/community-cli-plugin": "0.77.2",
-    "@react-native/gradle-plugin": "0.77.2",
-    "@react-native/js-polyfills": "0.77.2",
-    "@react-native/normalize-colors": "0.77.2",
-    "@react-native/virtualized-lists": "0.77.2",
+    "@react-native/assets-registry": "0.77.3",
+    "@react-native/codegen": "0.77.3",
+    "@react-native/community-cli-plugin": "0.77.3",
+    "@react-native/gradle-plugin": "0.77.3",
+    "@react-native/js-polyfills": "0.77.3",
+    "@react-native/normalize-colors": "0.77.3",
+    "@react-native/virtualized-lists": "0.77.3",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",
@@ -130,8 +130,8 @@
     "jest-environment-node": "^29.6.3",
     "jsc-android": "^250231.0.0",
     "memoize-one": "^5.0.0",
-    "metro-runtime": "^0.81.3",
-    "metro-source-map": "^0.81.3",
+    "metro-runtime": "^0.81.5",
+    "metro-source-map": "^0.81.5",
     "nullthrows": "^1.1.1",
     "pretty-format": "^29.7.0",
     "promise": "^8.3.0",