@onekeyfe/react-native-pager-view 6.7.0-15 → 6.7.0-17

package/ios/RNCNativeScrollerComponentView.h

@@ -13,6 +13,8 @@ NS_ASSUME_NONNULL_BEGIN
 - (void)nativeScrollerWillReceiveScrollCommand:(RNCNativeScrollerComponentView *)scroller;
 - (void)nativeScroller:(RNCNativeScrollerComponentView *)scroller
     callerInsetChangedFrom:(UIEdgeInsets)previous to:(UIEdgeInsets)next;
+@optional
+- (void)nativeScrollViewDidBecomeReady:(UIScrollView *)scrollView;
 @end
 
 NS_ASSUME_NONNULL_END

package/ios/RNCNativeScrollerComponentView.mm

@@ -298,10 +298,23 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
   }
 }
 
+- (void)notifyCoordinatorScrollViewReadyIfNeeded
+{
+  if (_recycled || self.window == nil ||
+      CGRectGetWidth(_scrollView.bounds) <= 0 || CGRectGetHeight(_scrollView.bounds) <= 0) return;
+  for (UIView *owner = self.superview; owner != nil; owner = owner.superview) {
+    if ([owner conformsToProtocol:@protocol(RNCNativeScrollerInsetCoordinator)] &&
+        [owner respondsToSelector:@selector(nativeScrollViewDidBecomeReady:)]) {
+      [(id<RNCNativeScrollerInsetCoordinator>)owner nativeScrollViewDidBecomeReady:_scrollView];
+    }
+  }
+}
+
 - (void)didMoveToSuperview
 {
   [super didMoveToSuperview];
   [self updateTopScrollEdge];
+  [self notifyCoordinatorScrollViewReadyIfNeeded];
 }
 
 - (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
@@ -314,6 +327,10 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
   if (!CGSizeEqualToSize(previous, _scrollView.bounds.size)) {
     _needsContentClamp = YES;
     [self scheduleContentClamp];
+    if ((previous.width <= 0 || previous.height <= 0) &&
+        _scrollView.bounds.size.width > 0 && _scrollView.bounds.size.height > 0) {
+      [self notifyCoordinatorScrollViewReadyIfNeeded];
+    }
   }
 }
 
@@ -574,6 +591,7 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
     const auto &props = *std::static_pointer_cast<const RNCNativeScrollerProps>(_props);
     if (props.refreshing) [_refreshControl beginRefreshing];
     [self scheduleContentClamp];
+    [self notifyCoordinatorScrollViewReadyIfNeeded];
   }
 }
 

package/ios/tests/RNCCollapsiblePagerFirstFrameTests.mm

@@ -459,6 +459,138 @@ using namespace facebook::react;
   XCTAssertTrue([[pager valueForKey:@"pendingPageRestoreKeys"] containsObject:@"page-1"]);
 }
 
+- (void)testReleasedOwnerRecoversReplacementWithoutAnotherFabricInsertion
+{
+  RNCCollapsiblePagerViewComponentView *pager = [self pagerWithPageCount:1];
+  // The fixture mounts page 0 directly; UIKit must not select it again.
+  [pager setValue:@YES forKey:@"hasAppliedInitialPage"];
+  RNCNativeScrollerComponentView *source = [self addScrollerToPager:pager atIndex:0];
+  source.tag = 91001;
+  [pager.window layoutIfNeeded];
+  [pager layoutIfNeeded];
+  [[NSRunLoop mainRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.15]];
+  [pager setValue:@120 forKey:@"headerOffset"];
+  [pager attachScrollObserverForCurrentPage];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], source.scrollView);
+
+  // Finish the old owner's removal before the replacement becomes available.
+  ShadowView removedView;
+  removedView.tag = (Tag)source.tag;
+  MountingTransaction removal(1, 1, {ShadowViewMutation::RemoveMutation(1, removedView, 0)}, {});
+  SurfaceTelemetry telemetry;
+  [pager mountingTransactionWillMount:removal withSurfaceTelemetry:telemetry];
+  [source removeFromSuperview];
+  [self finishMount:pager];
+  XCTAssertNil([pager valueForKey:@"observedScrollView"]);
+
+  RNCNativeScrollerComponentView *replacement = [self addScrollerToPager:pager atIndex:0];
+  [[NSRunLoop mainRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.3]];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], replacement.scrollView);
+  XCTAssertEqual([pager valueForKey:@"sharedHeaderScrollView"], replacement.scrollView);
+  XCTAssertEqualWithAccuracy(replacement.scrollView.contentOffset.y + replacement.scrollView.contentInset.top,
+                            120, 0.01);
+  XCTAssertEqualWithAccuracy([[pager valueForKey:@"headerOffset"] doubleValue], 120, 0.01);
+}
+
+- (void)testCurrentPageInsertionRestartsExhaustedReplacementRecovery
+{
+  [self assertReplacementRecoveryWithCancelledDrag:NO finalRetryPending:NO];
+}
+
+- (void)testCancelledDragRetainsReplacementRecoveryFromInsertion
+{
+  [self assertReplacementRecoveryWithCancelledDrag:YES finalRetryPending:NO];
+}
+
+- (void)testInsertionInvalidatesPendingFinalReplacementRetry
+{
+  [self assertReplacementRecoveryWithCancelledDrag:NO finalRetryPending:YES];
+}
+
+- (void)assertReplacementRecoveryWithCancelledDrag:(BOOL)cancelDrag
+                                finalRetryPending:(BOOL)finalRetryPending
+{
+  RNCCollapsiblePagerViewComponentView *pager = [self pagerWithPageCount:2];
+  [pager setValue:@YES forKey:@"hasAppliedInitialPage"];
+  RNCNativeScrollerComponentView *source = [self addScrollerToPager:pager atIndex:0];
+  source.tag = 91001;
+  UIView *page = source.superview;
+  page.tag = 92001;
+  UIViewController *otherPage = [pager valueForKey:@"pageControllers"][1];
+  otherPage.view.tag = 92002;
+  [pager.window layoutIfNeeded];
+  [pager layoutIfNeeded];
+  [[NSRunLoop mainRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.15]];
+  [pager setValue:@120 forKey:@"headerOffset"];
+  [pager attachScrollObserverForCurrentPage];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], source.scrollView);
+
+  ShadowView removedView;
+  removedView.tag = (Tag)source.tag;
+  MountingTransaction removal(1, 1, {ShadowViewMutation::RemoveMutation((Tag)page.tag, removedView, 0)}, {});
+  SurfaceTelemetry telemetry;
+  [pager mountingTransactionWillMount:removal withSurfaceTelemetry:telemetry];
+  [source removeFromSuperview];
+  [self finishMount:pager];
+  NSDate *deadline = [NSDate dateWithTimeIntervalSinceNow:3];
+  while (([[pager valueForKey:@"scrollResolveRetryAttempt"] integerValue] < 12 ||
+          (!finalRetryPending && [[pager valueForKey:@"scrollResolveRetryScheduled"] boolValue])) &&
+         deadline.timeIntervalSinceNow > 0) {
+    [[NSRunLoop mainRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.01]];
+  }
+  XCTAssertEqualObjects([pager valueForKey:@"scrollResolveRetryAttempt"], @12);
+  XCTAssertEqualObjects([pager valueForKey:@"scrollResolveRetryScheduled"], @(finalRetryPending));
+  XCTAssertNotNil([pager valueForKey:@"releasedPageScrollStates"][@"page-0"]);
+
+  // Only a new insertion in the current page can reopen the exhausted budget.
+  [self finishMount:pager];
+  [pager mountingTransactionDidMount:removal withSurfaceTelemetry:telemetry];
+  UIView *replacementHost = [UIView new];
+  replacementHost.tag = 93001;
+  [otherPage.view addSubview:replacementHost];
+  ShadowView insertedView;
+  insertedView.tag = (Tag)replacementHost.tag;
+  MountingTransaction unrelated(1, 2, {ShadowViewMutation::InsertMutation((Tag)otherPage.view.tag, insertedView, 0)}, {});
+  [pager mountingTransactionDidMount:unrelated withSurfaceTelemetry:telemetry];
+  XCTAssertEqualObjects([pager valueForKey:@"scrollResolveRetryAttempt"], @12);
+  XCTAssertEqualObjects([pager valueForKey:@"scrollResolveRetryScheduled"], @(finalRetryPending));
+
+  if (cancelDrag) {
+    [pager beginPageStateTransition];
+    [pager setValue:@YES forKey:@"transitioning"];
+    [pager setValue:@YES forKey:@"isPagerDragging"];
+  }
+  [page addSubview:replacementHost];
+  MountingTransaction insertion(1, 3, {ShadowViewMutation::InsertMutation((Tag)page.tag, insertedView, 0)}, {});
+  [pager mountingTransactionDidMount:insertion withSurfaceTelemetry:telemetry];
+  XCTAssertNil([pager valueForKey:@"observedScrollView"]);
+  NSNumber *retryToken = [pager valueForKey:@"scrollResolveRetryToken"];
+  [pager mountingTransactionDidMount:insertion withSurfaceTelemetry:telemetry];
+  XCTAssertEqualObjects([pager valueForKey:@"scrollResolveRetryToken"], retryToken);
+  if (cancelDrag) {
+    XCTAssertNil([pager valueForKey:@"sharedHeaderScrollView"]);
+    XCTAssertFalse([[pager valueForKey:@"scrollResolveRetryScheduled"] boolValue]);
+    // Settle on the source page while the replacement is still unavailable.
+    [pager attachScrollObserverForCurrentPageAfterTransition:YES];
+    [pager setValue:@NO forKey:@"isPagerDragging"];
+    [pager setValue:@NO forKey:@"transitioning"];
+    [pager attachScrollObserverForCurrentPage];
+    XCTAssertEqualObjects([pager valueForKey:@"currentIndex"], @0);
+  }
+  __block RNCNativeScrollerComponentView *replacement;
+  int64_t replacementDelay = finalRetryPending ? 150 : 50;
+  dispatch_after(dispatch_time(DISPATCH_TIME_NOW, replacementDelay * NSEC_PER_MSEC), dispatch_get_main_queue(), ^{
+    replacement = [self addScrollerToPager:pager atIndex:0];
+    [replacementHost addSubview:replacement];
+  });
+  [[NSRunLoop mainRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.3]];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], replacement.scrollView);
+  XCTAssertEqual([pager valueForKey:@"sharedHeaderScrollView"], replacement.scrollView);
+  XCTAssertEqualWithAccuracy(replacement.scrollView.contentOffset.y + replacement.scrollView.contentInset.top,
+                            120, 0.01);
+  XCTAssertEqualWithAccuracy([[pager valueForKey:@"headerOffset"] doubleValue], 120, 0.01);
+}
+
 - (void)testRenamedPageDoesNotResurrectPrunedObserverCache
 {
   RNCCollapsiblePagerViewComponentView *pager = [self pagerWithPageCount:1];
@@ -603,4 +735,58 @@ using namespace facebook::react;
   XCTAssertEqual(removed.count, 0u);
 }
 
+- (void)testEmptyPageWithoutReleasedOwnerOrScrollHostDoesNotScheduleRetry
+{
+  RNCCollapsiblePagerViewComponentView *pager = [self pagerWithPageCount:1];
+  [pager attachScrollObserverForCurrentPage];
+  XCTAssertNil([pager valueForKey:@"observedScrollView"]);
+  XCTAssertFalse([[pager valueForKey:@"scrollResolveRetryScheduled"] boolValue]);
+  XCTAssertEqual([[pager valueForKey:@"scrollResolveRetryAttempt"] integerValue], 0);
+}
+
+- (void)testLateReplacementRecoversImmediatelyOnReadinessEvenAfterRetryBudgetExpires
+{
+  RNCCollapsiblePagerViewComponentView *pager = [self pagerWithPageCount:1];
+  RNCNativeScrollerComponentView *previous = [self addScrollerToPager:pager atIndex:0];
+  previous.tag = 91003;
+  [pager attachScrollObserverForCurrentPage];
+  UIView *sharedHeader = [pager valueForKey:@"sharedHeaderHostView"];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], previous.scrollView);
+
+  ShadowView removedView;
+  removedView.tag = (Tag)previous.tag;
+  MountingTransaction removal(1, 1, {ShadowViewMutation::RemoveMutation(1, removedView, 0)}, {});
+  SurfaceTelemetry telemetry;
+  [pager mountingTransactionWillMount:removal withSurfaceTelemetry:telemetry];
+  [previous removeFromSuperview];
+  [self finishMount:pager];
+  XCTAssertNil([pager valueForKey:@"observedScrollView"]);
+
+  // Simulate retry budget exhaustion before the replacement becomes ready.
+  [pager setValue:@12 forKey:@"scrollResolveRetryAttempt"];
+  [pager setValue:@NO forKey:@"scrollResolveRetryScheduled"];
+  NSUInteger oldToken = [[pager valueForKey:@"scrollResolveRetryToken"] unsignedIntegerValue];
+  [pager setValue:@(oldToken + 1) forKey:@"scrollResolveRetryToken"];
+
+  UIViewController *page = [pager valueForKey:@"pageControllers"][0];
+  UICollectionView *lateList = [[UICollectionView alloc]
+    initWithFrame:CGRectMake(0, 0, 320, 600)
+    collectionViewLayout:[UICollectionViewFlowLayout new]];
+  [page.view addSubview:lateList];
+
+  // Readiness notification triggers immediate reconcile even after retry budget expired.
+  [[NSNotificationCenter defaultCenter]
+    postNotificationName:@"OneKeyNativeScrollViewDidBecomeReady"
+                  object:lateList];
+  XCTAssertEqualObjects([pager valueForKey:@"pendingFallbackScrollView"], lateList);
+
+  // Explicit scroller readiness attaches synchronously with zero debounce delay.
+  [lateList removeFromSuperview];
+  RNCNativeScrollerComponentView *lateScroller = [self addScrollerToPager:pager atIndex:0];
+  XCTAssertEqual([pager valueForKey:@"observedScrollView"], lateScroller.scrollView);
+  XCTAssertEqual(sharedHeader.superview, lateScroller.scrollView);
+  XCTAssertEqualWithAccuracy(lateScroller.scrollView.contentInset.top, 164, 0.01);
+  XCTAssertNil([pager valueForKey:@"releasedPageScrollStates"][@"page-0"]);
+}
+
 @end

package/ios/tests/RNCCollapsiblePagerHitTestTests.mm

@@ -2,13 +2,35 @@
 
 #import "RNCCollapsiblePagerViewComponentView.h"
 #import "RNCPagerViewComponentView.h"
+#import <React/RCTViewComponentView.h>
 #import <react/renderer/components/pagerview/Props.h>
+#import <react/renderer/components/view/ViewProps.h>
 
 using namespace facebook::react;
 
 @interface RNCCollapsiblePagerViewComponentView (ScrollEdgeTesting)
 - (void)updateTopScrollEdgeForScrollView:(UIScrollView *)scrollView;
 - (void)updateScrollEdgeContentMasks;
+- (void)layoutSharedHeaders;
+@end
+
+@interface UIView (NativeTabReservationTesting)
+- (void)updateItemsJSON:(NSString *)itemsJSON;
+- (void)updateStyleWithHeight:(CGFloat)height
+                      variant:(NSString *)variant
+     contentPaddingHorizontal:(CGFloat)contentPaddingHorizontal
+       contentPaddingVertical:(CGFloat)contentPaddingVertical
+                  itemSpacing:(CGFloat)itemSpacing
+                     fontSize:(CGFloat)fontSize
+                   fontFamily:(NSString *)fontFamily
+              backgroundColor:(UIColor *)backgroundColor
+              activeTextColor:(UIColor *)activeTextColor
+            inactiveTextColor:(UIColor *)inactiveTextColor
+               indicatorColor:(UIColor *)indicatorColor
+              indicatorHeight:(CGFloat)indicatorHeight
+              indicatorBottom:(CGFloat)indicatorBottom;
+- (void)setProgress:(CGFloat)progress;
+- (void)setLeftToRight:(BOOL)leftToRight;
 @end
 
 @interface RNCCollapsiblePagerHitTestTests : XCTestCase
@@ -56,6 +78,162 @@ using namespace facebook::react;
   XCTAssertEqual([self.root hitTest:CGPointMake(20, 80) withEvent:nil], self.toolbar);
 }
 
+- (void)testNativeTabReservationKeepsReactToolbarAboveTabsAndResetsInRTL
+{
+  UIView *sharedHost = [self.pager valueForKey:@"sharedHeaderHostView"];
+  UIView *tabBar = [self.pager valueForKey:@"nativeTabBarView"];
+  [tabBar updateItemsJSON:@"[{\"key\":\"a\",\"title\":\"Overview\"},"
+    @"{\"key\":\"b\",\"title\":\"Ethereum\"},"
+    @"{\"key\":\"c\",\"title\":\"BNB Chain\"},"
+    @"{\"key\":\"d\",\"title\":\"Polygon\"}]"];
+  RCTViewComponentView *sticky = [RCTViewComponentView new];
+  auto stickyProps = std::make_shared<ViewProps>();
+  stickyProps->pointerEvents = PointerEventsMode::BoxNone;
+  [sticky updateProps:stickyProps oldProps:nullptr];
+  UIButton *trailingControl = [[UIButton alloc] initWithFrame:CGRectMake(250, 0, 70, 44)];
+  [sticky addSubview:trailingControl];
+  [sharedHost addSubview:sticky];
+  [sharedHost addSubview:tabBar];
+  [self.pager setValue:sticky forKey:@"stickyHeaderView"];
+  [self.pager setValue:@0 forKey:@"headerHeight"];
+  [self.pager setValue:@44 forKey:@"stickyHeaderHeight"];
+  tabBar.hidden = NO;
+
+  [self.pager setValue:@64 forKey:@"nativeTabBarTrailingReservedWidth"];
+  [self.pager layoutSharedHeaders];
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(sticky.frame), 320, 0.001);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(tabBar.frame), 256, 0.001);
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(tabBar.frame), 0, 0.001);
+  XCTAssertEqual(sharedHost.subviews.lastObject, sticky);
+  XCTAssertEqual([sharedHost hitTest:CGPointMake(300, 22) withEvent:nil], trailingControl);
+  XCTAssertTrue([tabBar pointInside:CGPointMake(250, 22) withEvent:nil]);
+  [tabBar layoutIfNeeded];
+  [tabBar setProgress:3];
+  UIScrollView *tabScroll = (UIScrollView *)tabBar.subviews.firstObject;
+  NSArray<UIButton *> *buttons = [tabScroll.subviews filteredArrayUsingPredicate:
+    [NSPredicate predicateWithBlock:^BOOL(UIView *view, NSDictionary *bindings) {
+      return [view isKindOfClass:UIButton.class];
+    }]];
+  UIButton *lastTab = buttons.lastObject;
+  XCTAssertNotNil(lastTab);
+  XCTAssertGreaterThanOrEqual(CGRectGetMinX(lastTab.frame), tabScroll.contentOffset.x - 1);
+  XCTAssertLessThanOrEqual(CGRectGetMaxX(lastTab.frame),
+    tabScroll.contentOffset.x + CGRectGetWidth(tabScroll.bounds) + 1);
+
+  [self.pager setValue:@"rtl" forKey:@"layoutDirection"];
+  [tabBar setLeftToRight:NO];
+  trailingControl.frame = CGRectMake(0, 0, 70, 44);
+  [self.pager layoutSharedHeaders];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(tabBar.frame), 64, 0.001);
+  XCTAssertEqualWithAccuracy(CGRectGetMaxX(tabBar.frame), 320, 0.001);
+  XCTAssertEqual([sharedHost hitTest:CGPointMake(20, 22) withEvent:nil], trailingControl);
+
+  [self.pager setValue:@500 forKey:@"nativeTabBarTrailingReservedWidth"];
+  [self.pager layoutSharedHeaders];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(tabBar.frame), 320, 0.001);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(tabBar.frame), 0, 0.001);
+
+  [self.pager setValue:@0 forKey:@"nativeTabBarTrailingReservedWidth"];
+  [self.pager layoutSharedHeaders];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(tabBar.frame), 0, 0.001);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(tabBar.frame), 320, 0.001);
+  XCTAssertEqual(sharedHost.subviews.lastObject, tabBar);
+}
+
+- (void)testNativeTabReservationPropsRestoreDefaultOnRemoval
+{
+  auto reservedProps = std::make_shared<RNCCollapsiblePagerViewProps>();
+  reservedProps->nativeSmoothHeaderScrollEnabled = true;
+  reservedProps->nativeTabBarTrailingReservedWidth = 64;
+  [self.pager updateProps:reservedProps oldProps:nullptr];
+  XCTAssertEqualWithAccuracy(
+    [[self.pager valueForKey:@"nativeTabBarTrailingReservedWidth"] doubleValue], 64, 0.001);
+
+  auto defaultProps = std::make_shared<RNCCollapsiblePagerViewProps>();
+  defaultProps->nativeSmoothHeaderScrollEnabled = true;
+  [self.pager updateProps:defaultProps oldProps:reservedProps];
+  XCTAssertEqualWithAccuracy(
+    [[self.pager valueForKey:@"nativeTabBarTrailingReservedWidth"] doubleValue], 0, 0.001);
+}
+
+- (void)testSegmentedNativeTabsFollowFractionalProgressAndResetToUnderline
+{
+  UIView *tabBar = [self.pager valueForKey:@"nativeTabBarView"];
+  [tabBar updateItemsJSON:@"[{\"key\":\"recent\",\"title\":\"Recents\"},"
+    @"{\"key\":\"account\",\"title\":\"Accounts\"},"
+    @"{\"key\":\"book\",\"title\":\"Address Book\"}]"];
+  [tabBar updateStyleWithHeight:56 variant:@"segmented"
+    contentPaddingHorizontal:20 contentPaddingVertical:12 itemSpacing:0
+    fontSize:14 fontFamily:nil backgroundColor:UIColor.lightGrayColor
+    activeTextColor:UIColor.blackColor inactiveTextColor:UIColor.grayColor
+    indicatorColor:UIColor.whiteColor indicatorHeight:2 indicatorBottom:0];
+  tabBar.frame = CGRectMake(0, 0, 320, 56);
+  [tabBar layoutIfNeeded];
+  UIScrollView *scroll = (UIScrollView *)tabBar.subviews.firstObject;
+  UIView *track = scroll.subviews.firstObject;
+  UIView *thumb = [tabBar valueForKey:@"indicatorView"];
+  NSArray<UIButton *> *buttons = [scroll.subviews filteredArrayUsingPredicate:
+    [NSPredicate predicateWithBlock:^BOOL(UIView *view, NSDictionary *bindings) {
+      return [view isKindOfClass:UIButton.class];
+    }]];
+  XCTAssertEqual(buttons.count, 3);
+  XCTAssertFalse(scroll.scrollEnabled);
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(track.frame), 20, 0.01);
+  XCTAssertEqualWithAccuracy(CGRectGetHeight(track.frame), 32, 0.01);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(buttons[0].frame),
+    CGRectGetWidth(buttons[1].frame), 0.01);
+  [tabBar setProgress:0];
+  CGFloat firstX = CGRectGetMinX(thumb.frame);
+  [tabBar setProgress:1];
+  CGFloat secondX = CGRectGetMinX(thumb.frame);
+  [tabBar setProgress:0.25];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame), firstX + (secondX - firstX) * 0.25, 0.01);
+  [tabBar setProgress:0.5];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame), (firstX + secondX) / 2, 0.01);
+  [tabBar setProgress:0];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame), firstX, 0.01);
+
+  [tabBar setLeftToRight:NO];
+  [tabBar layoutIfNeeded];
+  XCTAssertGreaterThan(CGRectGetMinX(buttons[0].frame), CGRectGetMinX(buttons[1].frame));
+  [tabBar updateItemsJSON:@"[{\"key\":\"recent\",\"title\":\"Recents (8)\"},"
+    @"{\"key\":\"account\",\"title\":\"Accounts\"}]"];
+  [tabBar layoutIfNeeded];
+  NSArray<UIButton *> *twoButtons = [scroll.subviews filteredArrayUsingPredicate:
+    [NSPredicate predicateWithBlock:^BOOL(UIView *view, NSDictionary *bindings) {
+      return [view isKindOfClass:UIButton.class];
+    }]];
+  XCTAssertEqual(twoButtons.count, 2);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(twoButtons[0].frame),
+    CGRectGetWidth(track.frame) / 2, 0.01);
+  [tabBar updateStyleWithHeight:56 variant:@"segmented"
+    contentPaddingHorizontal:20 contentPaddingVertical:40 itemSpacing:0
+    fontSize:14 fontFamily:nil backgroundColor:UIColor.lightGrayColor
+    activeTextColor:UIColor.blackColor inactiveTextColor:UIColor.grayColor
+    indicatorColor:UIColor.whiteColor indicatorHeight:2 indicatorBottom:0];
+  tabBar.frame = CGRectMake(0, 0, 30, 56);
+  [tabBar layoutIfNeeded];
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(track.frame), 15, 0.01);
+  XCTAssertEqualWithAccuracy(CGRectGetWidth(track.frame), 0, 0.01);
+  XCTAssertEqualWithAccuracy(CGRectGetMinY(track.frame), 28, 0.01);
+  XCTAssertEqualWithAccuracy(CGRectGetHeight(track.frame), 0, 0.01);
+  XCTAssertTrue(thumb.hidden);
+  [tabBar updateItemsJSON:@"[]"];
+  XCTAssertTrue(tabBar.hidden);
+
+  [tabBar updateItemsJSON:@"[{\"key\":\"recent\",\"title\":\"Recents\"}]"];
+  [tabBar updateStyleWithHeight:44 variant:@"underline"
+    contentPaddingHorizontal:20 contentPaddingVertical:0 itemSpacing:8
+    fontSize:16 fontFamily:nil backgroundColor:UIColor.clearColor
+    activeTextColor:UIColor.blackColor inactiveTextColor:UIColor.grayColor
+    indicatorColor:UIColor.blackColor indicatorHeight:2 indicatorBottom:0];
+  tabBar.frame = CGRectMake(0, 0, 320, 44);
+  [tabBar layoutIfNeeded];
+  XCTAssertTrue(scroll.scrollEnabled);
+  XCTAssertTrue(track.hidden);
+  XCTAssertEqualWithAccuracy(CGRectGetHeight(thumb.frame), 2, 0.01);
+}
+
 - (void)testPinnedChildOutsideHeaderHostStillReceivesViewportTouches
 {
   XCTAssertEqual([self.pager hitTest:CGPointMake(20, 90) withEvent:nil], self.sticky);

package/ios/tests/RNCCollapsiblePagerPressCancellationTests.mm

@@ -668,6 +668,7 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
 @property (nonatomic, strong) RNCSynthesizedTouchDriver *driver;
 @property (nonatomic, strong) UIView *firstPage;
 @property (nonatomic) NSUInteger longPressBegins;
+@property (nonatomic, strong) XCTestExpectation *longPressExpectation;
 @property (nonatomic) NSUInteger pagerPanBegins;
 @end
 
@@ -763,6 +764,26 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
   XCTAssertTrue([pager isKindOfClass:NSClassFromString(@"RNCCollapsiblePagerDirectScrollView")]);
 }
 
+- (void)configureSegmentedTabsForTwoPages
+{
+  auto baseline = std::make_shared<RNCCollapsiblePagerViewProps>();
+  baseline->nativeSmoothHeaderScrollEnabled = true;
+  baseline->headerHeight = 120;
+  baseline->stickyHeaderHeight = 44;
+  auto segmented = std::make_shared<RNCCollapsiblePagerViewProps>();
+  segmented->nativeSmoothHeaderScrollEnabled = true;
+  segmented->headerHeight = 120;
+  segmented->stickyHeaderHeight = 56;
+  segmented->nativeTabBarItems =
+    R"([{"key":"recent","title":"Recents"},{"key":"account","title":"Accounts"}])";
+  segmented->nativeTabBarVariant = "segmented";
+  segmented->nativeTabBarHeight = 56;
+  segmented->nativeTabBarContentPaddingHorizontal = 20;
+  segmented->nativeTabBarContentPaddingVertical = 12;
+  [self.pager updateProps:segmented oldProps:baseline];
+  [self.window layoutIfNeeded];
+}
+
 - (void)recordPagerPan:(UIPanGestureRecognizer *)pan
 {
   if (pan.state == UIGestureRecognizerStateBegan) self.pagerPanBegins += 1;
@@ -904,6 +925,51 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
   XCTAssertEqual(self.handler.events.count, eventsBeforeLift);
 }
 
+- (void)testSegmentedThumbTracksDeliveredPagerDragAndReverseBeforeLift
+{
+  [self assertFixtureIsReadyForDelivery];
+  [self assertDirectPagerForRegression];
+  [self configureSegmentedTabsForTwoPages];
+
+  UIScrollView *pagerScrollView = [self.pager valueForKey:@"pagerScrollView"];
+  UIView *tabBar = [self.pager valueForKey:@"nativeTabBarView"];
+  UIView *thumb = [tabBar valueForKey:@"indicatorView"];
+  NSArray<UIButton *> *buttons = [tabBar valueForKey:@"buttons"];
+  XCTAssertEqual(buttons.count, 2);
+  XCTAssertFalse(tabBar.hidden);
+  XCTAssertEqualWithAccuracy(CGRectGetHeight(tabBar.bounds), 56, 0.01);
+  CGFloat firstThumbX = CGRectGetMinX(buttons[0].frame) + 2;
+  CGFloat secondThumbX = CGRectGetMinX(buttons[1].frame) + 2;
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame), firstThumbX, 1);
+
+  CGPoint point = CGPointMake(350, 600);
+  UITouch *touch = [self.driver beginAt:point];
+  CGFloat largestOffset = 0;
+  NSUInteger intermediateFrames = 0;
+  for (NSInteger step = 1; step <= 18; ++step) {
+    [self.driver move:touch to:CGPointMake(point.x - 14 * step, point.y)];
+    CGFloat offset = pagerScrollView.contentOffset.x;
+    largestOffset = MAX(largestOffset, offset);
+    if (offset > 1 && offset < CGRectGetWidth(pagerScrollView.bounds) - 1) {
+      CGFloat progress = offset / CGRectGetWidth(pagerScrollView.bounds);
+      XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame),
+        firstThumbX + (secondThumbX - firstThumbX) * progress, 1);
+      intermediateFrames += 1;
+    }
+  }
+  XCTAssertTrue(pagerScrollView.isDragging);
+  XCTAssertGreaterThan(largestOffset, 80);
+  XCTAssertGreaterThan(intermediateFrames, 2);
+
+  for (NSInteger step = 17; step >= 0; --step) {
+    [self.driver move:touch to:CGPointMake(point.x - 14 * step, point.y)];
+  }
+  // UIKit can briefly bounce past the leading edge before the finger lifts.
+  XCTAssertLessThan(fabs(pagerScrollView.contentOffset.x), 10);
+  XCTAssertEqualWithAccuracy(CGRectGetMinX(thumb.frame), firstThumbX, 1);
+  [self.driver end:touch];
+}
+
 - (void)testStationaryTapKeepsReactPress
 {
   [self assertFixtureIsReadyForDelivery];
@@ -1001,7 +1067,10 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
 
 - (void)nestedLongPress:(UILongPressGestureRecognizer *)recognizer
 {
-  if (recognizer.state == UIGestureRecognizerStateBegan) self.longPressBegins += 1;
+  if (recognizer.state == UIGestureRecognizerStateBegan) {
+    self.longPressBegins += 1;
+    [self.longPressExpectation fulfill];
+  }
 }
 
 - (CGPoint)pressPointInNestedScrollView:(UIScrollView *)scroll
@@ -1022,14 +1091,12 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
   [pager addGestureRecognizer:longPress];
   // Exercise production wiring after a root recognizer is attached.
   ((void (*)(id, SEL))objc_msgSend)(self.pager, NSSelectorFromString(@"connectVerticalPagerGuard"));
+  self.longPressExpectation = [self expectationWithDescription:@"root long press recognized before finger-up"];
   UITouch *touch = [self.driver beginAt:[self pressPoint]];
   UIGestureRecognizer *guard = [self.pager valueForKey:@"verticalPagerGesture"];
   XCTAssertEqual(guard.state, UIGestureRecognizerStatePossible);
   XCTAssertEqual(pager.panGestureRecognizer.minimumNumberOfTouches, 2);
-  XCTestExpectation *hold = [self expectationWithDescription:@"root stationary finger held"];
-  dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.25 * NSEC_PER_SEC)),
-                 dispatch_get_main_queue(), ^{ [hold fulfill]; });
-  [self waitForExpectations:@[hold] timeout:2];
+  [self waitForExpectations:@[self.longPressExpectation] timeout:2];
   NSLog(@"[PagerPressDelivery] rootLongPress begins=%lu state=%ld touchPhase=%ld guardState=%ld pagerPanMinTouches=%lu",
         (unsigned long)self.longPressBegins, (long)longPress.state, (long)touch.phase,
         (long)guard.state, (unsigned long)pager.panGestureRecognizer.minimumNumberOfTouches);
@@ -1045,14 +1112,12 @@ typedef struct __IOHIDEvent *RNCTestHIDEventRef;
 - (void)testNestedStationaryNativeLongPressRecognizesBeforeFingerUp
 {
   UIScrollView *scroll = [self mountNestedHorizontalScrollView];
+  self.longPressExpectation = [self expectationWithDescription:@"nested long press recognized before finger-up"];
   UITouch *touch = [self.driver beginAt:[self pressPointInNestedScrollView:scroll]];
   UIGestureRecognizer *guard = [self.pager valueForKey:@"verticalPagerGesture"];
   XCTAssertEqual(guard.state, UIGestureRecognizerStatePossible);
   XCTAssertEqual(scroll.panGestureRecognizer.minimumNumberOfTouches, 2);
-  XCTestExpectation *hold = [self expectationWithDescription:@"stationary finger held"];
-  dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.25 * NSEC_PER_SEC)),
-                 dispatch_get_main_queue(), ^{ [hold fulfill]; });
-  [self waitForExpectations:@[hold] timeout:2];
+  [self waitForExpectations:@[self.longPressExpectation] timeout:2];
   // The real UIKit target action must arrive while the finger is still down.
   XCTAssertEqual(self.longPressBegins, 1);
   XCTAssertEqual(touch.phase, UITouchPhaseBegan);

package/lib/module/CollapsiblePagerView.js

@@ -82,6 +82,12 @@ export class CollapsiblePagerView extends React.PureComponent {
   scrollToPageTop = options => {
     if (this.nativeRef) CollapsiblePagerViewNativeCommands.scrollToTop(this.nativeRef, 0, options?.animated ?? true);
   };
+  scrollHeaderBy = delta => {
+    if (this.nativeRef && Number.isFinite(delta)) CollapsiblePagerViewNativeCommands.scrollHeaderBy(this.nativeRef, delta);
+  };
+  scrollHeaderToOffset = offset => {
+    if (this.nativeRef && Number.isFinite(offset)) CollapsiblePagerViewNativeCommands.scrollHeaderToOffset(this.nativeRef, offset);
+  };
   scrollToStickyTop = options => {
     if (this.nativeRef) CollapsiblePagerViewNativeCommands.scrollToTop(this.nativeRef, 1, options?.animated ?? true);
   };
@@ -96,7 +102,7 @@ export class CollapsiblePagerView extends React.PureComponent {
   nativeTabBarEnabled() {
     return (Platform.OS === "ios" || Platform.OS === "android") && !!this.props.nativeTabBar?.items.length;
   }
-  dispatchNativeTabPageCommand(position, animated) {
+  dispatchNativeTabPageCommand(position, animated, expectedKey) {
     const commandId = ++this.nativeTabCommandId;
     this.nativeTabCommandQueuedDuringScroll = this.nativePagerScrollState !== "idle";
     this.latestNativeTabTarget = position;
@@ -104,7 +110,7 @@ export class CollapsiblePagerView extends React.PureComponent {
       transientRetainedPages: state.transientRetainedPages.includes(position) ? state.transientRetainedPages : [...state.transientRetainedPages, position]
     }), () => {
       requestAnimationFrame(() => {
-        if (commandId !== this.nativeTabCommandId || !this.nativeRef) {
+        if (commandId !== this.nativeTabCommandId || !this.nativeRef || expectedKey !== undefined && (!this.nativeTabBarEnabled() || this.props.nativeTabBar?.items[position]?.key !== expectedKey)) {
           return;
         }
         this.dispatchedNativeTabTarget = position;
@@ -186,10 +192,13 @@ export class CollapsiblePagerView extends React.PureComponent {
   };
   onNativeTabPress = event => {
     const position = pageIndex(event.nativeEvent.position);
-    if (position !== null && position >= 0 && position < this.pages().length && (position !== this.state.selectedPage || this.latestNativeTabTarget !== null)) {
+    if (!this.nativeTabBarEnabled() || position === null || this.props.nativeTabBar?.items[position]?.key !== event.nativeEvent.key) {
+      return;
+    }
+    if (position >= 0 && position < this.pages().length && (position !== this.state.selectedPage || this.latestNativeTabTarget !== null)) {
       // Selection state lags an in-flight transition until native reports it.
       const currentPage = this.dispatchedNativeTabTarget ?? this.state.selectedPage;
-      this.dispatchNativeTabPageCommand(position, this.props.nativeTabPressAnimationEnabled ?? Math.abs(position - currentPage) <= 1);
+      this.dispatchNativeTabPageCommand(position, this.props.nativeTabPressAnimationEnabled ?? Math.abs(position - currentPage) <= 1, event.nativeEvent.key);
     }
     this.props.onNativeTabPress?.(event);
   };
@@ -233,6 +242,10 @@ export class CollapsiblePagerView extends React.PureComponent {
     const deducedLayoutDirection = !layoutDirection || layoutDirection === "locale" ? I18nManager.isRTL ? "rtl" : "ltr" : layoutDirection;
     const nativeTabBarEnabled = (Platform.OS === "ios" || Platform.OS === "android") && !!nativeTabBar?.items.length;
     const nativeTabBarStyle = nativeTabBar?.style;
+    const requestedContentPaddingVertical = nativeTabBarStyle?.contentPaddingVertical;
+    const nativeTabBarContentPaddingVertical = typeof requestedContentPaddingVertical === "number" && Number.isFinite(requestedContentPaddingVertical) && requestedContentPaddingVertical >= 0 ? requestedContentPaddingVertical : 0;
+    const requestedTrailingReservedWidth = nativeTabBarStyle?.trailingReservedWidth;
+    const nativeTabBarTrailingReservedWidth = typeof requestedTrailingReservedWidth === "number" && Number.isFinite(requestedTrailingReservedWidth) && requestedTrailingReservedWidth >= 0 ? requestedTrailingReservedWidth : 0;
     const nativeSubHeaderEnabled = (Platform.OS === "ios" || Platform.OS === "android") && !!nativeSubHeader?.items.length;
     const nativeSubHeaderStyle = nativeSubHeader?.style;
     const nativeSubHeaderConfig = nativeSubHeaderEnabled ? JSON.stringify({
@@ -263,7 +276,10 @@ export class CollapsiblePagerView extends React.PureComponent {
       onPageScrollStateChanged: this.onPageScrollStateChanged,
       nativeTabBarItems: nativeTabBarEnabled ? JSON.stringify(nativeTabBar.items) : undefined,
       nativeTabBarHeight: nativeTabBarEnabled ? nativeTabBarStyle?.height ?? 44 : undefined,
+      nativeTabBarVariant: nativeTabBarEnabled ? nativeTabBarStyle?.variant ?? "underline" : undefined,
+      nativeTabBarTrailingReservedWidth: nativeTabBarEnabled ? nativeTabBarTrailingReservedWidth : 0,
       nativeTabBarContentPaddingHorizontal: nativeTabBarEnabled ? nativeTabBarStyle?.contentPaddingHorizontal ?? 20 : undefined,
+      nativeTabBarContentPaddingVertical: nativeTabBarEnabled ? nativeTabBarContentPaddingVertical : undefined,
       nativeTabBarItemSpacing: nativeTabBarEnabled ? nativeTabBarStyle?.itemSpacing ?? 8 : undefined,
       nativeTabBarFontSize: nativeTabBarEnabled ? nativeTabBarStyle?.fontSize ?? 16 : undefined,
       nativeTabBarFontFamily: nativeTabBarEnabled ? nativeTabBarStyle?.fontFamily : undefined,