[android][ios] Upgrade react-native-pager-view to 6.0.1 (#19528)

CHANGELOG.md

@@ -7,6 +7,7 @@ Package-specific changes not released in any SDK will be added here just before
 
 ### 📚 3rd party library updates
 
+- Updated `react-native-pager-view` from `5.4.245` to `6.0.1`. ([#19528](https://github.com/expo/expo/pull/19528) by [@brentvatne](https://github.com/brentvatne))
 - Updated `react-native-safe-area-context` from `4.3.1` to `4.4.1`. ([#19055](https://github.com/expo/expo/pull/19401) by [@brentvatne](https://github.com/brentvatne))
 - Updated `@stripe/stripe-react-native` from `0.13.1` to `0.19.0`. ([#19055](https://github.com/expo/expo/pull/19055) by [@tsapeta](https://github.com/tsapeta), [#19432](https://github.com/expo/expo/pull/19432) by [@kudo](https://github.com/kudo))
 - Updated `@shopify/flash-list` from `1.1.0` to `1.3.0`. ([#19317](https://github.com/expo/expo/pull/19317) by [@kudo](https://github.com/kudo))

android/expoview/src/main/java/versioned/host/exp/exponent/modules/api/components/pagerview/PagerViewViewManager.kt

@@ -27,6 +27,7 @@ class PagerViewViewManager : ViewGroupManager<NestedScrollableHost>() {
 
   override fun createViewInstance(reactContext: ThemedReactContext): NestedScrollableHost {
     val host = NestedScrollableHost(reactContext)
+    host.id = View.generateViewId()
     host.layoutParams = ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)
     host.isSaveEnabled = false
     val vp = ViewPager2(reactContext)

apps/native-component-list/package.json

@@ -148,7 +148,7 @@
     "react-native-gesture-handler": "~2.7.0",
     "react-native-iphone-x-helper": "^1.3.0",
     "react-native-maps": "1.3.2",
-    "react-native-pager-view": "5.4.24",
+    "react-native-pager-view": "6.0.1",
     "react-native-paper": "^4.0.1",
     "react-native-reanimated": "~2.10.0",
     "react-native-safe-area-context": "4.4.1",

apps/native-component-list/src/screens/PagerViewScreen.tsx

@@ -1,13 +1,12 @@
 import React from 'react';
-import { Platform, StyleSheet, Text, View } from 'react-native';
+import { StyleSheet, Text, View } from 'react-native';
 import PagerView from 'react-native-pager-view';
 
 export default function PagerViewScreen() {
   return (
     <PagerView
       style={styles.container}
       initialPage={0}
-      transitionStyle={Platform.OS === 'ios' ? 'curl' : 'scroll'}
       onPageSelected={(_) => {
         console.log('New page!');
       }}>

ios/ExpoKit.podspec

@@ -39,7 +39,7 @@ Pod::Spec.new do |s|
     ss.dependency 'CocoaLumberjack', '~> 3.5.3'
     ss.dependency 'GoogleMaps', '~> 3.3'
     ss.dependency 'Google-Maps-iOS-Utils', '~> 2.1.0'
-    ss.dependency 'lottie-ios', '~> 3.4.0'
+    ss.dependency 'lottie-ios', '~> 3.2.3'
     ss.dependency 'JKBigInteger', '0.0.6'
     ss.dependency 'MBProgressHUD', '~> 1.2.0'
     ss.dependency 'React-Core' # explicit dependency required for CocoaPods >= 1.5.0

ios/Exponent.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings

@@ -4,5 +4,7 @@
 <dict>
 	<key>IDEWorkspaceSharedSettings_AutocreateContextsIfNeeded</key>
 	<false/>
+	<key>PreviewsEnabled</key>
+	<false/>
 </dict>
 </plist>

ios/Podfile.lock

@@ -1908,7 +1908,7 @@ PODS:
     - glog
   - react-native-netinfo (9.3.3):
     - React-Core
-  - react-native-pager-view (5.4.24):
+  - react-native-pager-view (6.0.1):
     - React-Core
   - react-native-safe-area-context (4.4.1):
     - RCT-Folly
@@ -3504,7 +3504,7 @@ SPEC CHECKSUMS:
   React-jsinspector: 26c42646ab0bb69e29e837e23754fe7121eeaf94
   React-logger: 1bfd109a0ffa4c0989bbfac0c2d8c4abe4637faa
   react-native-netinfo: b514dd6d9cd512b90e178c5b7158df1a1c568d47
-  react-native-pager-view: 95d0418c3c74279840abec6926653d32447bafb6
+  react-native-pager-view: 3051346698a0ba0c4e13e40097cc11b00ee03cca
   react-native-safe-area-context: 99b24a0c5acd0d5dcac2b1a7f18c49ea317be99a
   react-native-segmented-control: 06607462630512ff8eef652ec560e6235a30cc3e
   react-native-skia: 78330615997e720dd07db28f4b8dfff22e9dd031

ios/vendored/unversioned/react-native-pager-view/ios/ReactNativePageView.h

@@ -16,14 +16,12 @@ NS_ASSUME_NONNULL_BEGIN
 @property(nonatomic, readonly) BOOL scrollEnabled;
 @property(nonatomic, readonly) BOOL showPageIndicator;
 @property(nonatomic, readonly) UIScrollViewKeyboardDismissMode dismissKeyboard;
-@property(nonatomic) UIPageViewControllerTransitionStyle transitionStyle;
 @property(nonatomic) UIPageViewControllerNavigationOrientation orientation;
 @property(nonatomic, copy) RCTDirectEventBlock onPageSelected;
 @property(nonatomic, copy) RCTDirectEventBlock onPageScroll;
 @property(nonatomic, copy) RCTDirectEventBlock onPageScrollStateChanged;
 @property(nonatomic) BOOL overdrag;
 @property(nonatomic) NSString* layoutDirection;
-@property(nonatomic) CGRect previousBounds;
 @property(nonatomic, assign) BOOL animating;
 
 - (void)goTo:(NSInteger)index animated:(BOOL)animated;

ios/vendored/unversioned/react-native-pager-view/ios/ReactNativePageView.m

@@ -38,7 +38,6 @@ - (instancetype)initWithEventDispatcher:(RCTEventDispatcher *)eventDispatcher {
         _scrollEnabled = YES;
         _pageMargin = 0;
         _lastReportedIndex = -1;
-        _transitionStyle = UIPageViewControllerTransitionStyleScroll;
         _orientation = UIPageViewControllerNavigationOrientationHorizontal;
         _currentIndex = 0;
         _dismissKeyboard = UIScrollViewKeyboardDismissModeNone;
@@ -47,7 +46,6 @@ - (instancetype)initWithEventDispatcher:(RCTEventDispatcher *)eventDispatcher {
         _cachedControllers = [NSHashTable hashTableWithOptions:NSHashTableStrongMemory];
         _overdrag = NO;
         _layoutDirection = @"ltr";
-        _previousBounds = CGRectMake(0, 0, 0, 0);
     }
     return self;
 }
@@ -56,13 +54,6 @@ - (void)layoutSubviews {
     [super layoutSubviews];
     if (self.reactPageViewController) {
         [self shouldScroll:self.scrollEnabled];
-
-        if (!CGRectEqualToRect(self.previousBounds, CGRectMake(0, 0, 0, 0)) && !CGRectEqualToRect(self.bounds, self.previousBounds)) {
-            // Below line fix bug, where the view does not update after orientation changed.
-            [self updateDataSource];
-        }
-
-        self.previousBounds = CGRectMake(self.bounds.origin.x, self.bounds.origin.y, self.bounds.size.width, self.bounds.size.height);
     }
 }
 
@@ -97,7 +88,7 @@ - (void)didMoveToWindow {
 
 - (void)embed {
     NSDictionary *options = @{ UIPageViewControllerOptionInterPageSpacingKey: @(self.pageMargin) };
-    UIPageViewController *pageViewController = [[UIPageViewController alloc] initWithTransitionStyle:self.transitionStyle
+    UIPageViewController *pageViewController = [[UIPageViewController alloc] initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll
                                                                                navigationOrientation:self.orientation
                                                                                              options:options];
     pageViewController.delegate = self;
@@ -185,13 +176,6 @@ - (void)setReactViewControllers:(NSInteger)index
 
     NSArray *currentVCs = self.reactPageViewController.viewControllers;
     if (currentVCs.count == 1 && [currentVCs.firstObject isEqual:controller]) {
-        // see: 
-        // 1) https://github.com/callstack/react-native-pager-view/pull/462
-        // 2) https://github.com/callstack/react-native-pager-view/issues/566
-        [self.reactPageViewController setViewControllers:@[controller]
-                                               direction:direction
-                                                animated:YES
-                                              completion:nil];
         return;
     }
 
@@ -263,14 +247,20 @@ - (void)goTo:(NSInteger)index animated:(BOOL)animated {
         return;
     }
 
-    BOOL isForward = (index > self.currentIndex && [self isLtrLayout]) || (index < self.currentIndex && ![self isLtrLayout]);
+    BOOL isRTL = ![self isLtrLayout];
+
+    BOOL isForward = (index > self.currentIndex && !isRTL) || (index < self.currentIndex && isRTL);
+
+
     UIPageViewControllerNavigationDirection direction = isForward ? UIPageViewControllerNavigationDirectionForward : UIPageViewControllerNavigationDirectionReverse;
 
     self.reactPageIndicatorView.numberOfPages = numberOfPages;
     self.reactPageIndicatorView.currentPage = index;
     long diff = labs(index - _currentIndex);
 
-    if (isForward && diff > 0) {
+    BOOL shouldGoForward = isRTL ? !isForward : isForward;
+
+    if (shouldGoForward && diff > 0) {
         for (NSInteger i=_currentIndex; i<=index; i++) {
             if (i == _currentIndex) {
                 continue;
@@ -279,7 +269,7 @@ - (void)goTo:(NSInteger)index animated:(BOOL)animated {
         }
     }
 
-    if (!isForward && diff > 0) {
+    if (!shouldGoForward && diff > 0) {
         for (NSInteger i=_currentIndex; i>=index; i--) {
             // Prevent removal of one or many pages at a time
             if (i == _currentIndex || i >= numberOfPages) {

ios/vendored/unversioned/react-native-pager-view/ios/ReactViewPagerManager.m

@@ -10,7 +10,6 @@ @implementation ReactViewPagerManager
 RCT_EXPORT_VIEW_PROPERTY(initialPage, NSInteger)
 RCT_EXPORT_VIEW_PROPERTY(pageMargin, NSInteger)
 
-RCT_EXPORT_VIEW_PROPERTY(transitionStyle, UIPageViewControllerTransitionStyle)
 RCT_EXPORT_VIEW_PROPERTY(orientation, UIPageViewControllerNavigationOrientation)
 RCT_EXPORT_VIEW_PROPERTY(onPageSelected, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onPageScroll, RCTDirectEventBlock)

ios/vendored/unversioned/react-native-pager-view/react-native-pager-view.podspec.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-pager-view",
-  "version": "5.4.24",
+  "version": "6.0.1",
   "summary": "React Native wrapper for Android and iOS ViewPager",
   "homepage": "https://github.com/callstack/react-native-pager-view#readme",
   "license": "MIT",
@@ -10,7 +10,7 @@
   },
   "source": {
     "git": "https://github.com/callstack/react-native-pager-view.git",
-    "tag": "5.4.24"
+    "tag": "6.0.1"
   },
   "source_files": "ios/**/*.{h,m,mm,swift}",
   "dependencies": {

packages/expo/bundledNativeModules.json

@@ -93,7 +93,7 @@
   "react-native-gesture-handler": "~2.7.0",
   "react-native-get-random-values": "~1.8.0",
   "react-native-maps": "1.3.2",
-  "react-native-pager-view": "5.4.24",
+  "react-native-pager-view": "6.0.1",
   "react-native-reanimated": "~2.10.0",
   "react-native-screens": "~3.18.0",
   "react-native-safe-area-context": "4.4.1",

yarn.lock

@@ -17235,10 +17235,10 @@ react-native-maps@1.3.2:
   dependencies:
     "@types/geojson" "^7946.0.8"
 
-react-native-pager-view@5.4.24:
-  version "5.4.24"
-  resolved "https://registry.yarnpkg.com/react-native-pager-view/-/react-native-pager-view-5.4.24.tgz#8626e757ddc55e41eca66d2f8a8a75aec54591ee"
-  integrity sha512-dRMB7i3B+mu4NCeIN6gqbR/kC/rr2wzqO0gisXDdJwJr78G24sWoTNpLEDFo3G8TFHY9nTMutVl5CUvkN2dp6g==
+react-native-pager-view@6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/react-native-pager-view/-/react-native-pager-view-6.0.1.tgz#353abf38d3c2b91ed7c586f10af0f94700f5b1dc"
+  integrity sha512-kOVNu+4JnR3Gpykviy4WbOAnQz8TgP6O2pRvne221oPUDQLYrvEE/FINR0P85TxbMgvKTPlLejGw0ZHQbezK/g==
 
 react-native-paper@^4.0.1:
   version "4.12.0"