@onekeyfe/react-native-pager-view 3.0.177 → 3.0.179-alpha.20261015

package/ios/RNCNativeScrollerComponentView.mm

@@ -33,12 +33,15 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 @end
 
 @implementation RNCNativeScrollerComponentView {
-#if DEBUG
-  NSUInteger _offsetDiagSequence;
-#endif
   RNCNativeScrollerShadowNode::ConcreteState::Shared _state;
   RNCNativeVerticalScrollView *_scrollView;
   UIView<RCTComponentViewProtocol> *_reactContent;
+  __weak UIView *_topOverlay;
+  CGFloat _appliedOverlayInset;
+  UIScrollEdgeElementContainerInteraction *_topEdgeInteraction;
+  __weak UIView *_topEdgeInteractionHost;
+  UILabel *_topEdgeMarker;
+  UIScrollEdgeEffectStyle *_originalTopEdgeStyle;
   UIRefreshControl *_refreshControl;
   UIEdgeInsets _callerInset;
   BOOL _dragActive;
@@ -54,24 +57,6 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
   NSNumber *_lastContentViewportHeight;
 }
 
-- (void)offsetDiag:(NSString *)reason
-{
-#if DEBUG
-  Class logClass = NSClassFromString(@"ReactNativeNativeLogger.OneKeyLog") ?: NSClassFromString(@"OneKeyLog");
-  SEL selector = NSSelectorFromString(@"debug::");
-  if (logClass == nil || ![logClass respondsToSelector:selector]) return;
-  NSString *message = [NSString stringWithFormat:
-    @"[HOME-OFFSET-DIAG] scroller phase=%@ seq=%lu wallMs=%.0f mono=%.6f host=%p tag=%ld scroll=%p generation=%lu physicalY=%.4f insetTop=%.4f logicalY=%.4f contentHeight=%.4f boundsHeight=%.4f adjustedBottom=%.4f needsClamp=%d drag=%d decel=%d refresh=%d",
-    reason, (unsigned long)++_offsetDiagSequence, NSDate.date.timeIntervalSince1970 * 1000, CACurrentMediaTime(),
-    (__bridge void *)self, (long)self.tag, (__bridge void *)_scrollView, (unsigned long)_generation,
-    _scrollView.contentOffset.y, _scrollView.contentInset.top, _scrollView.contentOffset.y + _scrollView.contentInset.top,
-    _scrollView.contentSize.height, _scrollView.bounds.size.height, _scrollView.adjustedContentInset.bottom,
-    _needsContentClamp, _scrollView.dragging, _scrollView.decelerating, _refreshControl.refreshing];
-  typedef void (*LogFunction)(id, SEL, NSString *, NSString *);
-  ((LogFunction)[logClass methodForSelector:selector])(logClass, selector, @"NativeScroller", message);
-#endif
-}
-
 + (ComponentDescriptorProvider)componentDescriptorProvider
 {
   return concreteComponentDescriptorProvider<RNCNativeScrollerComponentDescriptor>();
@@ -200,9 +185,7 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
     _needsContentClamp |= size.height < _scrollView.contentSize.height;
     CGPoint offset = _scrollView.contentOffset;
     BOOL wasPulling = offset.y < -_scrollView.adjustedContentInset.top;
-    [self offsetDiag:@"content-size-before"];
     _scrollView.contentSize = size;
-    [self offsetDiag:@"content-size-after"];
     // UIKit can synchronously discard a pull when content becomes empty.
     // Upper-range shrink correction remains owned by the deferred clamp.
     if (wasPulling && _scrollView.contentOffset.y != offset.y) {
@@ -212,20 +195,99 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
   }
   BOOL refreshEnded = previous.refreshing && !next.refreshing;
   [super updateProps:props oldProps:oldProps];
+  [self updateTopScrollEdge];
+  if (next.topScrollEdgeHard && _topOverlay == nil) {
+    __weak __typeof__(self) weakSelf = self;
+    dispatch_async(dispatch_get_main_queue(), ^{ [weakSelf updateTopScrollEdge]; });
+  }
   if (refreshEnded) [self scheduleContentClamp];
   [self updateFabricContentOrigin];
   [self emitContentViewportChangeIfNeeded];
 }
 
+- (void)updateTopScrollEdge
+{
+  if (@available(iOS 26.0, *)) {
+    const auto &props = *std::static_pointer_cast<const RNCNativeScrollerProps>(_props);
+    UIView *overlay = nil;
+    if (props.topScrollEdgeHard && !_recycled) {
+      NSUInteger fabricSiblings = 0;
+      for (UIView *candidate in self.superview.subviews) {
+        if (![candidate conformsToProtocol:@protocol(RCTComponentViewProtocol)]) continue;
+        fabricSiblings++;
+        if (candidate != self) overlay = candidate;
+      }
+      if (fabricSiblings != 2) overlay = nil;
+    }
+    _topOverlay = overlay;
+    CGFloat requestedOverlayInset = props.topScrollEdgeHard && !_recycled && overlay != nil &&
+      isfinite(props.topOverlayHeight) ? MAX(0, props.topOverlayHeight) : 0;
+    if (_appliedOverlayInset != requestedOverlayInset) {
+      // Keep UIKit's refresh rebound animation in control while it is overscrolled.
+      BOOL wasReturningFromPull = _scrollView.contentOffset.y < -_scrollView.adjustedContentInset.top - 0.5;
+      CGFloat logicalOffset = _scrollView.contentOffset.y + _scrollView.contentInset.top;
+      UIEdgeInsets current = _scrollView.contentInset;
+      current.top += requestedOverlayInset - _appliedOverlayInset;
+      _scrollView.contentInset = current;
+      _appliedOverlayInset = requestedOverlayInset;
+      if (!wasReturningFromPull) {
+        [_scrollView setContentOffset:CGPointMake(_scrollView.contentOffset.x,
+          logicalOffset - current.top) animated:NO];
+      }
+      [self emitContentViewportChangeIfNeeded];
+    }
+    BOOL enabled = props.topScrollEdgeHard && !_recycled && overlay != nil && self.window != nil;
+    if (!enabled || _topEdgeInteractionHost != overlay) {
+      if (_topEdgeInteraction != nil) {
+        [_topEdgeInteractionHost removeInteraction:_topEdgeInteraction];
+        _topEdgeInteraction.scrollView = nil;
+        _topEdgeInteraction = nil;
+        _topEdgeInteractionHost = nil;
+      }
+      [_topEdgeMarker removeFromSuperview];
+      _topEdgeMarker = nil;
+      if (_originalTopEdgeStyle != nil) {
+        _scrollView.topEdgeEffect.style = _originalTopEdgeStyle;
+        _originalTopEdgeStyle = nil;
+      }
+      if (!enabled) return;
+    }
+    if (_topEdgeInteraction == nil) {
+      _originalTopEdgeStyle = _scrollView.topEdgeEffect.style;
+      // UIKit needs a native element to shape the edge effect around React-drawn content.
+      _topEdgeMarker = [UILabel new];
+      _topEdgeMarker.frame = overlay.bounds;
+      _topEdgeMarker.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
+      _topEdgeMarker.text = @" ";
+      _topEdgeMarker.textColor = UIColor.clearColor;
+      _topEdgeMarker.backgroundColor = UIColor.clearColor;
+      _topEdgeMarker.userInteractionEnabled = NO;
+      _topEdgeMarker.isAccessibilityElement = NO;
+      _topEdgeMarker.accessibilityElementsHidden = YES;
+      [overlay addSubview:_topEdgeMarker];
+      _topEdgeInteraction = [UIScrollEdgeElementContainerInteraction new];
+      _topEdgeInteraction.edge = UIRectEdgeTop;
+      _topEdgeInteraction.scrollView = _scrollView;
+      [overlay addInteraction:_topEdgeInteraction];
+      _topEdgeInteractionHost = overlay;
+    }
+    _scrollView.topEdgeEffect.style = UIScrollEdgeEffectStyle.hardStyle;
+  }
+}
+
+- (void)didMoveToSuperview
+{
+  [super didMoveToSuperview];
+  [self updateTopScrollEdge];
+}
+
 - (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
            oldLayoutMetrics:(const LayoutMetrics &)oldLayoutMetrics
 {
-  [self offsetDiag:@"layout-before"];
   CGSize previous = _scrollView.bounds.size;
   [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
   [self updateFabricContentOrigin];
   [self emitContentViewportChangeIfNeeded];
-  [self offsetDiag:@"layout-after"];
   if (!CGSizeEqualToSize(previous, _scrollView.bounds.size)) {
     _needsContentClamp = YES;
     [self scheduleContentClamp];
@@ -236,7 +298,8 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 {
   CGFloat stickyHeight = 0;
   for (NSNumber *height in _pagerStickyHeights.objectEnumerator) stickyHeight += height.doubleValue;
-  return MAX(0, _scrollView.bounds.size.height - _callerInset.top - _callerInset.bottom - stickyHeight);
+  return MAX(0, _scrollView.bounds.size.height - _callerInset.top - _callerInset.bottom
+    - _appliedOverlayInset - stickyHeight);
 }
 
 - (void)setPagerStickyHeight:(CGFloat)height forOwner:(id)owner
@@ -288,7 +351,6 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 - (void)scheduleContentClamp
 {
   if (!_needsContentClamp) return;
-  [self offsetDiag:@"clamp-scheduled"];
   NSUInteger generation = _generation;
   __weak __typeof__(self) weakSelf = self;
   dispatch_async(dispatch_get_main_queue(), ^{
@@ -300,19 +362,13 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 
 - (void)clampContentOffsetIfNeeded
 {
-  [self offsetDiag:@"clamp-enter-or-deferred"];
   if (!_needsContentClamp || _scrollView.dragging || _scrollView.decelerating ||
       _refreshControl.refreshing || _scrollView.bounds.size.height <= 0) return;
   _needsContentClamp = NO;
   CGFloat maximum = MAX(-_scrollView.adjustedContentInset.top,
     _scrollView.contentSize.height - _scrollView.bounds.size.height + _scrollView.adjustedContentInset.bottom);
-#if DEBUG
-  [self offsetDiag:[NSString stringWithFormat:@"clamp-candidate-max=%.4f", maximum]];
-#endif
   if (_scrollView.contentOffset.y > maximum) {
-    [self offsetDiag:@"clamp-applied-before"];
     [_scrollView setContentOffset:CGPointMake(_scrollView.contentOffset.x, maximum) animated:NO];
-    [self offsetDiag:@"clamp-applied-after"];
   }
 }
 
@@ -353,7 +409,6 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 - (void)stopScrolling
 {
   if (_stopping) return;
-  [self offsetDiag:@"stop-before"];
   _stopping = YES;
   [_scrollView setContentOffset:_scrollView.contentOffset animated:NO];
   if (_dragActive) {
@@ -365,7 +420,6 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
   }
   [self finishMomentum];
   _stopping = NO;
-  [self offsetDiag:@"stop-after"];
 }
 
 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
@@ -435,9 +489,6 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
       [(id<RNCNativeScrollerInsetCoordinator>)owner nativeScrollerWillReceiveScrollCommand:self];
     }
   }
-#if DEBUG
-  [self offsetDiag:[NSString stringWithFormat:@"command-scrollTo-enter-x=%.4f-y=%.4f-animated=%d", x, y, animated]];
-#endif
   [self stopScrolling];
   UIEdgeInsets inset = _scrollView.adjustedContentInset;
   CGPoint target = CGPointMake(MAX(-inset.left, MIN(x,
@@ -489,6 +540,7 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 - (void)didMoveToWindow
 {
   [super didMoveToWindow];
+  [self updateTopScrollEdge];
   if (self.window == nil) {
     [self stopScrolling];
     [_pagerStickyHeights removeAllObjects];
@@ -504,6 +556,9 @@ static Event RNCScrollerMetrics(UIScrollView *scroll, CGPoint velocity, CGPoint
 {
   [self stopScrolling];
   _recycled = YES;
+  [self updateTopScrollEdge];
+  _topOverlay = nil;
+  _appliedOverlayInset = 0;
   _scrollView.delegate = nil;
   ++_generation;
   _state.reset();

package/ios/RNCPagerViewComponentView.h

@@ -4,8 +4,15 @@
 
 NS_ASSUME_NONNULL_BEGIN
 
+@protocol RNCPagerViewNestedOverlayObserver <NSObject>
+- (void)outerPagerDidUpdateOverlayOwner:(BOOL)active transitioning:(BOOL)transitioning;
+@end
+
 @interface RNCPagerViewComponentView : RCTViewComponentView
 
+- (void)addNestedOverlayObserver:(id<RNCPagerViewNestedOverlayObserver>)observer;
+- (void)removeNestedOverlayObserver:(id<RNCPagerViewNestedOverlayObserver>)observer;
+
 @end
 
 NS_ASSUME_NONNULL_END

package/ios/RNCPagerViewComponentView.mm

@@ -12,6 +12,7 @@
 
 using namespace facebook::react;
 
+
 @interface RNCPagerViewComponentView () <RCTRNCViewPagerViewProtocol, UIPageViewControllerDataSource, UIPageViewControllerDelegate, UIScrollViewDelegate, UIGestureRecognizerDelegate>
 
 @property(nonatomic, strong) UIPageViewController *nativePageViewController;
@@ -39,10 +40,32 @@ using namespace facebook::react;
     NSInteger _pendingGoToIndex;
     // _nestedScrollEnabled: when YES, this inner PagerView coordinates gestures with an outer PagerView
     BOOL _nestedScrollEnabled;
+    NSHashTable<id<RNCPagerViewNestedOverlayObserver>> *_nestedOverlayObservers;
     // _blockerGesture: gate gesture that blocks inner scroll at page boundaries when nested
     UIPanGestureRecognizer *_blockerGesture;
 }
 
+- (void)notifyNestedOverlayObservers {
+    UIView *activePage = _currentIndex >= 0 &&
+        _currentIndex < _nativeChildrenViewControllers.count
+        ? _nativeChildrenViewControllers[_currentIndex].view : nil;
+    for (id<RNCPagerViewNestedOverlayObserver> observer in _nestedOverlayObservers) {
+        BOOL active = activePage != nil &&
+            [(UIView *)observer isDescendantOfView:activePage];
+        [observer outerPagerDidUpdateOverlayOwner:active transitioning:transitioning || scrollView.dragging || scrollView.decelerating];
+    }
+}
+
+- (void)addNestedOverlayObserver:(id<RNCPagerViewNestedOverlayObserver>)observer {
+    if (_nestedOverlayObservers == nil) _nestedOverlayObservers = [NSHashTable weakObjectsHashTable];
+    [_nestedOverlayObservers addObject:observer];
+    [self notifyNestedOverlayObservers];
+}
+
+- (void)removeNestedOverlayObserver:(id<RNCPagerViewNestedOverlayObserver>)observer {
+    [_nestedOverlayObservers removeObject:observer];
+}
+
 // Needed because of this: https://github.com/facebook/react-native/pull/37274
 + (void)load
 {
@@ -158,6 +181,7 @@ using namespace facebook::react;
 -(void)prepareForRecycle {
     _isBeingRecycled = YES;
     _generation++;
+    [_nestedOverlayObservers removeAllObjects];
 
     // Cancel any ongoing transitions
     if (_nativePageViewController != nil && transitioning) {
@@ -339,6 +363,7 @@ using namespace facebook::react;
     _pendingGoToIndex = -1;
 
     transitioning = YES;
+    [self notifyNestedOverlayObservers];
 
     __weak RNCPagerViewComponentView *weakSelf = self;
     NSUInteger capturedGeneration = _generation;
@@ -370,6 +395,7 @@ using namespace facebook::react;
 
         [strongSelf enableSwipe];
         strongSelf->_currentIndex = index;
+        [strongSelf notifyNestedOverlayObservers];
         if (strongSelf->_eventEmitter != nullptr ) {
             const auto eventEmitter = [strongSelf pagerEventEmitter];
             if (eventEmitter) {
@@ -422,6 +448,7 @@ using namespace facebook::react;
     if (_isBeingRecycled) {
         return;
     }
+    [self notifyNestedOverlayObservers];
     const auto eventEmitter = [self pagerEventEmitter];
     if (!eventEmitter) {
         return;
@@ -455,7 +482,12 @@ using namespace facebook::react;
     }
 }
 
+- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
+    if (!decelerate) [self notifyNestedOverlayObservers];
+}
+
 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
+    [self notifyNestedOverlayObservers];
     if (_isBeingRecycled) {
         return;
     }
@@ -529,12 +561,14 @@ using namespace facebook::react;
         UIViewController* currentVC = [self currentlyDisplayed];
         NSUInteger currentIndex = [_nativeChildrenViewControllers indexOfObject:currentVC];
         _currentIndex = currentIndex;
+        [self notifyNestedOverlayObservers];
         int position = (int) currentIndex;
         const auto eventEmitter = [self pagerEventEmitter];
         if (eventEmitter) {
             eventEmitter->onPageSelected(RNCViewPagerEventEmitter::OnPageSelected{.position =  static_cast<double>(position)});
         }
     }
+    if (!completed) [self notifyNestedOverlayObservers];
 }
 
 #pragma mark - UIPageViewControllerDataSource

package/lib/module/CollapsiblePagerView.js

@@ -23,6 +23,7 @@ const pageKey = (child, index) => {
  */
 export class CollapsiblePagerView extends React.PureComponent {
   state = {
+    topOverlayHeight: 0,
     selectedPage: clampedPageIndex(this.props.initialPage ?? 0, React.Children.toArray(this.props.children).length),
     transientRetainedPages: []
   };
@@ -195,6 +196,10 @@ export class CollapsiblePagerView extends React.PureComponent {
       stickyHeader,
       headerHeight,
       stickyHeaderHeight,
+      topOverlay,
+      externalTopOverlayTag,
+      topScrollEdgeEffect,
+      topOverlayColorScheme,
       nativeSmoothHeaderScrollEnabled,
       pageRetentionDistance: _pageRetentionDistance,
       onMountedPagesChanged: _onMountedPagesChanged,
@@ -211,6 +216,9 @@ export class CollapsiblePagerView extends React.PureComponent {
       ...nativeProps
     } = this.props;
     const pages = this.pages();
+    const supportsTopScrollEdge = Platform.OS === "ios" && Number(Platform.Version) >= 26;
+    const hardScrollEdge = supportsTopScrollEdge && topScrollEdgeEffect === "hard";
+    const hasTopOverlay = hardScrollEdge && topOverlay != null;
     const pageKeys = pages.map(pageKey);
     const retained = new Set(this.mountedPages(pages.length));
     const deducedLayoutDirection = !layoutDirection || layoutDirection === "locale" ? I18nManager.isRTL ? "rtl" : "ltr" : layoutDirection;
@@ -235,6 +243,10 @@ export class CollapsiblePagerView extends React.PureComponent {
       offscreenPageLimit: Math.max(1, offscreenPageLimit ?? 1),
       headerHeight: Math.max(0, Math.round(headerHeight)),
       stickyHeaderHeight: Math.max(0, Math.round(stickyHeaderHeight)),
+      topScrollEdgeHard: hardScrollEdge,
+      topOverlayColorScheme: hardScrollEdge ? topOverlayColorScheme : undefined,
+      topOverlayHeight: hasTopOverlay ? this.state.topOverlayHeight : 0,
+      externalTopOverlayTag: supportsTopScrollEdge && !hasTopOverlay ? externalTopOverlayTag ?? 0 : 0,
       nativeSmoothHeaderScrollEnabled: nativeSmoothHeaderScrollEnabled,
       pageKeys: JSON.stringify(pageKeys),
       retainedPages: JSON.stringify([...retained]),
@@ -273,7 +285,21 @@ export class CollapsiblePagerView extends React.PureComponent {
           height: Math.max(0, Math.round(stickyHeaderHeight))
         }],
         children: stickyHeader
-      }, "sticky-header"), pages.map((page, index) => /*#__PURE__*/_jsx(View, {
+      }, "sticky-header"), hasTopOverlay ? /*#__PURE__*/_jsx(View, {
+        collapsable: false,
+        style: [styles.slot, {
+          bottom: undefined
+        }],
+        onLayout: event => {
+          const height = Math.ceil(event.nativeEvent.layout.height);
+          if (this.state.topOverlayHeight !== height) {
+            this.setState({
+              topOverlayHeight: height
+            });
+          }
+        },
+        children: topOverlay
+      }, "top-overlay") : null, pages.map((page, index) => /*#__PURE__*/_jsx(View, {
         collapsable: false,
         style: [styles.slot,
         // Android translates the expanded pager while consuming header scroll.

package/lib/module/CollapsiblePagerView.web.js

@@ -483,6 +483,10 @@ export class CollapsiblePagerView extends React.PureComponent {
       children: _children,
       header,
       stickyHeader,
+      topOverlay: _topOverlay,
+      topScrollEdgeEffect: _topScrollEdgeEffect,
+      topOverlayColorScheme: _topOverlayColorScheme,
+      externalTopOverlayTag: _externalTopOverlayTag,
       headerHeight: _headerHeight,
       stickyHeaderHeight: _stickyHeaderHeight,
       pageRetentionDistance: _pageRetentionDistance,

package/lib/module/CollapsiblePagerViewNativeComponent.ts

@@ -43,6 +43,7 @@ export type OnNativeTabPressEventData = Readonly<{
   position: Int32;
   key: string;
 }>;
+export type OnScrollEdgeCapabilityEventData = Readonly<{ available: boolean }>;
 
 /**
  * Internal native props. Consumers should use CollapsiblePagerViewProps from
@@ -58,6 +59,10 @@ export interface NativeProps extends ViewProps {
   nativeSmoothHeaderScrollEnabled?: WithDefault<boolean, false>;
   headerHeight?: Int32;
   stickyHeaderHeight?: Int32;
+  topScrollEdgeHard?: WithDefault<boolean, false>;
+  topOverlayColorScheme?: string;
+  topOverlayHeight?: WithDefault<Double, 0>;
+  externalTopOverlayTag?: WithDefault<Int32, 0>;
   pageKeys?: string;
   retainedPages?: string;
   nativeTabBarItems?: string;
@@ -80,6 +85,7 @@ export interface NativeProps extends ViewProps {
   onCollapsibleStateChanged?: DirectEventHandler<OnCollapsibleStateChangedEventData>;
   onNativeTabPress?: DirectEventHandler<OnNativeTabPressEventData>;
   onNativeSubHeaderPress?: DirectEventHandler<OnNativeTabPressEventData>;
+  onScrollEdgeCapability?: DirectEventHandler<OnScrollEdgeCapabilityEventData>;
 }
 
 type CollapsiblePagerViewNativeType = HostComponent<NativeProps>;

package/lib/module/NativeScroller.js

@@ -3,7 +3,7 @@
 import * as React from "react";
 import { findNodeHandle, Keyboard, Platform, StyleSheet, TextInput, View } from "react-native";
 import NativeScrollerHost, { Commands } from "./NativeScrollerNativeComponent";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const NATIVE_SCROLLER_NATIVE_ID_PREFIX = "rnc-collapsible-pager-native-scroller";
 
 /** Supported vertical subset; horizontal, snapping, zoom and sticky rows are not supported. */
@@ -27,6 +27,8 @@ const styles = StyleSheet.create({
 });
 export const NativeScroller = /*#__PURE__*/React.forwardRef(function NativeScroller({
   children,
+  topOverlay,
+  topScrollEdgeEffect,
   nativeID,
   pagerScrollKey,
   style,
@@ -56,6 +58,8 @@ export const NativeScroller = /*#__PURE__*/React.forwardRef(function NativeScrol
     width: 0,
     height: 0
   });
+  const [topOverlayHeight, setTopOverlayHeight] = React.useState(0);
+  const hasTopOverlay = Platform.OS === "ios" && Number(Platform.Version) >= 26 && topScrollEdgeEffect === "hard" && topOverlay != null;
   const [refreshEpoch, requestRefreshSync] = React.useReducer(value => value + 1, 0);
   const contentSizeRef = React.useRef(contentSize);
   const scrolledSinceGrant = React.useRef(false);
@@ -94,92 +98,111 @@ export const NativeScroller = /*#__PURE__*/React.forwardRef(function NativeScrol
     blur: () => hostRef.current?.blur()
   }), []);
   const keyboardIsDismissible = () => Boolean(TextInput.State.currentlyFocusedInput() && (Keyboard.isVisible() || Platform.OS === "android" && Number(Platform.Version) < 30) && Keyboard.metrics()?.height !== 0);
-  return /*#__PURE__*/_jsx(NativeScrollerHost, {
-    ...props,
-    ref: hostRef,
-    nativeID: `${NATIVE_SCROLLER_NATIVE_ID_PREFIX}:${pagerScrollKey ?? nativeID ?? generatedId}`,
+  return /*#__PURE__*/_jsxs(View, {
+    collapsable: false,
     style: [styles.viewport, style],
-    nestedScrollEnabled: nestedScrollEnabled,
-    contentWidth: contentSize.width,
-    contentHeight: contentSize.height,
-    contentInsetTop: contentInset?.top ?? 0,
-    contentInsetRight: contentInset?.right ?? 0,
-    contentInsetBottom: contentInset?.bottom ?? 0,
-    contentInsetLeft: contentInset?.left ?? 0,
-    decelerationRate: rate,
-    keyboardShouldPersistTaps: persistTaps,
-    refreshEnabled: Boolean(refresh) && refresh?.enabled !== false,
-    refreshing: refresh?.refreshing ?? false,
-    refreshTintColor: refresh?.tintColor,
-    refreshColors: refresh?.colors,
-    refreshProgressBackgroundColor: refresh?.progressBackgroundColor,
-    refreshProgressViewOffset: refresh?.progressViewOffset ?? 0,
-    refreshTitle: refresh?.title,
-    refreshTitleColor: refresh?.titleColor,
-    refreshSize: refresh?.size === "large" ? "large" : "default",
-    onRefresh: () => {
-      try {
-        refresh?.onRefresh?.();
-      } finally {
-        requestRefreshSync();
-      }
-    },
     onLayout: onLayout,
-    onContentViewportChange: event => {
-      const height = event.nativeEvent.height;
-      if (!Number.isFinite(height) || height < 0) return;
-      setContentViewportHeight(previous => previous === height ? previous : height);
-    },
-    onScroll: event => {
-      scrolledSinceGrant.current = true;
-      onScroll?.(event);
-    },
-    onScrollBeginDrag: event => {
-      scrolledSinceGrant.current = true;
-      onScrollBeginDrag?.(event);
-    },
-    onMomentumScrollBegin: event => {
-      momentum.current = true;
-      onMomentumScrollBegin?.(event);
-    },
-    onMomentumScrollEnd: event => {
-      momentum.current = false;
-      onMomentumScrollEnd?.(event);
-    },
-    onStartShouldSetResponder: event => onStartShouldSetResponder?.(event) ?? (persistTaps === "handled" && keyboardIsDismissible() && event.target !== TextInput.State.currentlyFocusedInput()),
-    onStartShouldSetResponderCapture: event => onStartShouldSetResponderCapture?.(event) ?? (momentum.current || persistTaps === "never" && keyboardIsDismissible() && typeof event.target !== "number" && !textInputState.isTextInput(event.target)),
-    onResponderGrant: event => {
-      scrolledSinceGrant.current = false;
-      grantedDuringMomentum.current = momentum.current;
-      onResponderGrant?.(event);
-    },
-    onResponderRelease: event => {
-      onResponderRelease?.(event);
-      if (persistTaps !== "always" && keyboardIsDismissible() && event.target !== TextInput.State.currentlyFocusedInput() && !scrolledSinceGrant.current && !grantedDuringMomentum.current) Keyboard.dismiss();
-    },
-    onResponderTerminationRequest: event => onResponderTerminationRequest?.(event) ?? true,
-    children: /*#__PURE__*/_jsx(View, {
+    children: [/*#__PURE__*/_jsx(NativeScrollerHost, {
+      ...props,
+      ref: hostRef,
+      nativeID: `${NATIVE_SCROLLER_NATIVE_ID_PREFIX}:${pagerScrollKey ?? nativeID ?? generatedId}`,
+      style: StyleSheet.absoluteFill,
+      nestedScrollEnabled: nestedScrollEnabled,
+      contentWidth: contentSize.width,
+      contentHeight: contentSize.height,
+      contentInsetTop: contentInset?.top ?? 0,
+      contentInsetRight: contentInset?.right ?? 0,
+      contentInsetBottom: contentInset?.bottom ?? 0,
+      contentInsetLeft: contentInset?.left ?? 0,
+      topScrollEdgeHard: hasTopOverlay,
+      topOverlayHeight: hasTopOverlay ? topOverlayHeight : 0,
+      decelerationRate: rate,
+      keyboardShouldPersistTaps: persistTaps,
+      refreshEnabled: Boolean(refresh) && refresh?.enabled !== false,
+      refreshing: refresh?.refreshing ?? false,
+      refreshTintColor: refresh?.tintColor,
+      refreshColors: refresh?.colors,
+      refreshProgressBackgroundColor: refresh?.progressBackgroundColor,
+      refreshProgressViewOffset: refresh?.progressViewOffset ?? 0,
+      refreshTitle: refresh?.title,
+      refreshTitleColor: refresh?.titleColor,
+      refreshSize: refresh?.size === "large" ? "large" : "default",
+      onRefresh: () => {
+        try {
+          refresh?.onRefresh?.();
+        } finally {
+          requestRefreshSync();
+        }
+      },
+      onContentViewportChange: event => {
+        const height = event.nativeEvent.height;
+        if (!Number.isFinite(height) || height < 0) return;
+        setContentViewportHeight(previous => previous === height ? previous : height);
+      },
+      onScroll: event => {
+        scrolledSinceGrant.current = true;
+        onScroll?.(event);
+      },
+      onScrollBeginDrag: event => {
+        scrolledSinceGrant.current = true;
+        onScrollBeginDrag?.(event);
+      },
+      onMomentumScrollBegin: event => {
+        momentum.current = true;
+        onMomentumScrollBegin?.(event);
+      },
+      onMomentumScrollEnd: event => {
+        momentum.current = false;
+        onMomentumScrollEnd?.(event);
+      },
+      onStartShouldSetResponder: event => onStartShouldSetResponder?.(event) ?? (persistTaps === "handled" && keyboardIsDismissible() && event.target !== TextInput.State.currentlyFocusedInput()),
+      onStartShouldSetResponderCapture: event => onStartShouldSetResponderCapture?.(event) ?? (momentum.current || persistTaps === "never" && keyboardIsDismissible() && typeof event.target !== "number" && !textInputState.isTextInput(event.target)),
+      onResponderGrant: event => {
+        scrolledSinceGrant.current = false;
+        grantedDuringMomentum.current = momentum.current;
+        onResponderGrant?.(event);
+      },
+      onResponderRelease: event => {
+        onResponderRelease?.(event);
+        if (persistTaps !== "always" && keyboardIsDismissible() && event.target !== TextInput.State.currentlyFocusedInput() && !scrolledSinceGrant.current && !grantedDuringMomentum.current) Keyboard.dismiss();
+      },
+      onResponderTerminationRequest: event => onResponderTerminationRequest?.(event) ?? true,
+      children: /*#__PURE__*/_jsx(View, {
+        collapsable: false,
+        style: [contentContainerStyle, (contentStyle?.flexGrow ?? 0) > 0 && (contentStyle?.minHeight === undefined || typeof contentStyle.minHeight === "number") ? {
+          minHeight: Math.max(contentViewportHeight, contentStyle?.minHeight ?? 0)
+        } : undefined, styles.content],
+        onLayout: event => {
+          const {
+            width,
+            height
+          } = event.nativeEvent.layout;
+          const previous = contentSizeRef.current;
+          if (previous.width === width && previous.height === height) return;
+          const next = {
+            width,
+            height
+          };
+          contentSizeRef.current = next;
+          setContentSize(next);
+          onContentSizeChange?.(width, height);
+        },
+        children: children
+      })
+    }), hasTopOverlay ? /*#__PURE__*/_jsx(View, {
       collapsable: false,
-      style: [contentContainerStyle, (contentStyle?.flexGrow ?? 0) > 0 && (contentStyle?.minHeight === undefined || typeof contentStyle.minHeight === "number") ? {
-        minHeight: Math.max(contentViewportHeight, contentStyle?.minHeight ?? 0)
-      } : undefined, styles.content],
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0
+      },
       onLayout: event => {
-        const {
-          width,
-          height
-        } = event.nativeEvent.layout;
-        const previous = contentSizeRef.current;
-        if (previous.width === width && previous.height === height) return;
-        const next = {
-          width,
-          height
-        };
-        contentSizeRef.current = next;
-        setContentSize(next);
-        onContentSizeChange?.(width, height);
+        const height = Math.ceil(event.nativeEvent.layout.height);
+        setTopOverlayHeight(previous => previous === height ? previous : height);
       },
-      children: children
-    })
+      children: topOverlay
+    }) : null]
   });
 });
 NativeScroller.displayName = "NativeScroller";