Fix iPad RTL modal centering in RNSScreen

[regnerus]

Description

Right-to-left layouts on iPad expose a UIKit quirk: when a sheet-style modal is presented, UIKit wraps a presented modal inside a UITransitionView, and in RTL that container is mirrored, reporting a negative X origin. Because RNSScreenView reused that mirrored frame, the React view kept the negative origin and the sheet remained shifted.

This PR normalizes the modal’s frame inside RNSScreen::viewDidLayoutSubviews. Whenever the screen is presented natively, we align it with its transition container’s bounds, which keeps the sheet centered from the very first animation frame.

Fixes react-navigation/react-navigation#12800.

Changes

• Recenter the modal screen view to its container’s bounds when presented natively.
• Document why the adjustment is necessary (RTL mirroring of UITransitionView).

Screenshots / GIFs

Before

The modal animates in and remains shifted to the right.

After

The modal animates in centered, with no offset.

Test code and steps to reproduce

1. Clone the reproduction from [iOS][RTL] Modal presentation sheet offset to the left on iPad react-navigation/react-navigation#12800.
2. In package.json, update the dependency to use the fix branch:

"react-native-screens": "github:regnerus/react-native-screens#fix/rtl-modal-centering"

Alternatively, apply the provided patch (see below).

3. Force RTL via I18nManager.forceRTL(true) and 18nManager.allowRTL(true).
4. Run on an iPad simulator and open the modal.
5. Expected: the modal animates in centered with no offset.

Patch

If you prefer using a patch instead of the branch, apply the following:

diff --git a/node_modules/react-native-screens/ios/RNSScreen.mm b/node_modules/react-native-screens/ios/RNSScreen.mm
index b62a2e2..60311bf 100644
--- a/node_modules/react-native-screens/ios/RNSScreen.mm
+++ b/node_modules/react-native-screens/ios/RNSScreen.mm
@@ -1587,6 +1587,20 @@ - (void)viewDidLayoutSubviews
     }
 #endif
   }
+
+  if (self.screenView.isPresentedAsNativeModal) {
+    UIView *superview = self.view.superview;
+    if (superview != nil) {
+      // UIKit presents modals inside a UITransitionView. In RTL that container is mirrored and
+      // ends up with a negative `frame.origin.x`. Mirroring is transparent to UIKit, but copying
+      // that frame to the React view would shift it off-screen. Align the screen with the
+      // container's bounds instead so it starts centered on the first animation frame.
+      CGRect targetFrame = superview.bounds;
+      if (!CGRectEqualToRect(self.view.frame, targetFrame)) {
+        self.view.frame = targetFrame;
+      }
+    }
+  }
 }
 
 - (BOOL)isModalWithHeader

react-native-screens+4.16.0.patch

Checklist

• Included code example that can be used to test this change
• Ensured that CI passes