@rific/scroll-view 1.1.0 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -61,7 +61,7 @@ module.exports = __toCommonJS(index_exports);
61
61
  var import_react6 = require("react");
62
62
  var import_react_native6 = require("react-native");
63
63
  var import_react_native_gesture_handler = require("react-native-gesture-handler");
64
- var import_react_native_reanimated6 = require("react-native-reanimated");
64
+ var import_react_native_reanimated5 = require("react-native-reanimated");
65
65
 
66
66
  // src/internal/RefreshControl.tsx
67
67
  var import_react_native = require("react-native");
@@ -93,6 +93,7 @@ var styles = import_react_native2.StyleSheet.create({
93
93
  var import_core = require("@rific/core");
94
94
  var import_react3 = require("react");
95
95
  var import_react_native_reanimated3 = require("react-native-reanimated");
96
+ var import_react_native_worklets = require("react-native-worklets");
96
97
 
97
98
  // src/ScrollViewContext.ts
98
99
  var import_react = require("react");
@@ -349,9 +350,9 @@ function useScrollHandler({ capturedGeneration, chipHidden, chipThreshold = 100,
349
350
  const target = remountSyncTarget.value;
350
351
  if (Math.abs(y - target) < REMOUNT_SYNC_TOLERANCE) {
351
352
  remountSyncTarget.value = null;
352
- if (onRemountSynced) (0, import_react_native_reanimated3.runOnJS)(import_core.callWorkletCallback)(remountSyncedKey, y);
353
+ if (onRemountSynced) (0, import_react_native_worklets.scheduleOnRN)(import_core.callWorkletCallback, remountSyncedKey, y);
353
354
  } else if (onRemountSyncRetry) {
354
- (0, import_react_native_reanimated3.runOnJS)(import_core.callWorkletCallback)(remountSyncRetryKey, y);
355
+ (0, import_react_native_worklets.scheduleOnRN)(import_core.callWorkletCallback, remountSyncRetryKey, y);
355
356
  }
356
357
  return;
357
358
  }
@@ -431,7 +432,7 @@ function useScrollHandler({ capturedGeneration, chipHidden, chipThreshold = 100,
431
432
  // src/internal/useScrollList.ts
432
433
  var import_react5 = require("react");
433
434
  var import_react_native5 = require("react-native");
434
- var import_react_native_reanimated5 = require("react-native-reanimated");
435
+ var import_react_native_reanimated4 = require("react-native-reanimated");
435
436
  var import_react_native_safe_area_context = require("react-native-safe-area-context");
436
437
 
437
438
  // src/useKeyboardInset.ts
@@ -439,7 +440,7 @@ var import_core2 = require("@rific/core");
439
440
  var import_react4 = require("react");
440
441
  var import_react_native4 = require("react-native");
441
442
  var import_react_native_keyboard_controller = require("react-native-keyboard-controller");
442
- var import_react_native_reanimated4 = require("react-native-reanimated");
443
+ var import_react_native_worklets2 = require("react-native-worklets");
443
444
  var useKeyboardInsetNative = () => {
444
445
  const [keyboardHeight, setKeyboardHeight] = (0, import_react4.useState)(0);
445
446
  const keyboardHeightKey = (0, import_core2.useWorkletCallback)(setKeyboardHeight);
@@ -447,11 +448,11 @@ var useKeyboardInsetNative = () => {
447
448
  {
448
449
  onMove: (e) => {
449
450
  "worklet";
450
- (0, import_react_native_reanimated4.runOnJS)(import_core2.callWorkletCallback)(keyboardHeightKey, e.height);
451
+ (0, import_react_native_worklets2.scheduleOnRN)(import_core2.callWorkletCallback, keyboardHeightKey, e.height);
451
452
  },
452
453
  onEnd: (e) => {
453
454
  "worklet";
454
- (0, import_react_native_reanimated4.runOnJS)(import_core2.callWorkletCallback)(keyboardHeightKey, e.height);
455
+ (0, import_react_native_worklets2.scheduleOnRN)(import_core2.callWorkletCallback, keyboardHeightKey, e.height);
455
456
  }
456
457
  },
457
458
  []
@@ -487,25 +488,25 @@ function useScrollList({ footerFixed: footerFixedProp, headerFixed: headerFixedP
487
488
  const [startedWithHeader] = (0, import_react5.useState)(headerHeight !== null);
488
489
  const insetContentOffset = (0, import_react5.useMemo)(() => ({ x: 0, y: headerHeight !== null ? -headerHeight + (startedWithHeader && !isHorizontal && pullSearchHeight ? pullSearchHeight : 0) : 0 }), [headerHeight, isHorizontal, pullSearchHeight, startedWithHeader]);
489
490
  const contentOffset = usesContentInset ? insetContentOffset : ZERO_OFFSET;
490
- const chipHidden = (0, import_react_native_reanimated5.useSharedValue)(1);
491
- const chipStyle = (0, import_react_native_reanimated5.useAnimatedStyle)(() => {
491
+ const chipHidden = (0, import_react_native_reanimated4.useSharedValue)(1);
492
+ const chipStyle = (0, import_react_native_reanimated4.useAnimatedStyle)(() => {
492
493
  const pointerEvents = chipHidden.value ? "none" : "box-none";
493
494
  if (isHorizontal) {
494
495
  return {
495
- opacity: chipHidden.value ? (0, import_react_native_reanimated5.withTiming)(0) : (0, import_react_native_reanimated5.withTiming)(1),
496
+ opacity: chipHidden.value ? (0, import_react_native_reanimated4.withTiming)(0) : (0, import_react_native_reanimated4.withTiming)(1),
496
497
  pointerEvents,
497
498
  top: Math.max(headerHeightShared.value, insets.top) + 4,
498
- transform: [{ translateX: chipHidden.value ? (0, import_react_native_reanimated5.withTiming)(-CHIP_SLIDE) : (0, import_react_native_reanimated5.withTiming)(0) }]
499
+ transform: [{ translateX: chipHidden.value ? (0, import_react_native_reanimated4.withTiming)(-CHIP_SLIDE) : (0, import_react_native_reanimated4.withTiming)(0) }]
499
500
  };
500
501
  }
501
502
  const h = headerHeightShared.value;
502
503
  const slide = headerFixed ? 0 : snapBackHeaderShared.value ? -headerOffset.value : Math.max(0, scrollPosition.value + h - pullSearchHeightShared.value);
503
504
  const top = Math.max(h - slide, insets.top) + 4;
504
505
  return {
505
- opacity: chipHidden.value ? (0, import_react_native_reanimated5.withTiming)(0) : (0, import_react_native_reanimated5.withTiming)(1),
506
+ opacity: chipHidden.value ? (0, import_react_native_reanimated4.withTiming)(0) : (0, import_react_native_reanimated4.withTiming)(1),
506
507
  pointerEvents,
507
508
  top,
508
- transform: [{ translateY: chipHidden.value ? (0, import_react_native_reanimated5.withTiming)(-CHIP_SLIDE) : (0, import_react_native_reanimated5.withTiming)(0) }]
509
+ transform: [{ translateY: chipHidden.value ? (0, import_react_native_reanimated4.withTiming)(-CHIP_SLIDE) : (0, import_react_native_reanimated4.withTiming)(0) }]
509
510
  };
510
511
  }, [isHorizontal, headerFixed, headerHeightShared, insets.top, chipHidden, snapBackHeaderShared, headerOffset, scrollPosition, pullSearchHeightShared]);
511
512
  return { chipHidden, chipStyle, containerStyle, contentInset, contentOffset, contentPadding, footerFixed, headerFixed, headerHeight, insets, isHorizontal: isHorizontal ?? false };
@@ -517,14 +518,14 @@ var CustomListInner = ({ chipProps, chipThreshold, component: List, renderFilter
517
518
  const { ListHeaderComponent: listHeaderComponent, contentContainerStyle: externalContentContainerStyle, ...restProps } = props;
518
519
  const { chipHidden, chipStyle, containerStyle, contentInset, contentOffset, contentPadding, footerFixed, headerFixed } = useScrollList({ footerFixed: footerFixedProp, headerFixed: headerFixedProp, keyboardAware, pullSearchHeight, style });
519
520
  const { listGeneration, onListUnmount } = (0, import_react6.useContext)(ScrollViewContext);
520
- const capturedGeneration = (0, import_react_native_reanimated6.useSharedValue)(-1);
521
+ const capturedGeneration = (0, import_react_native_reanimated5.useSharedValue)(-1);
521
522
  (0, import_react6.useLayoutEffect)(() => {
522
523
  const generation = listGeneration.value;
523
524
  if (import_react_native6.Platform.OS === "web") {
524
525
  capturedGeneration.value = generation;
525
526
  return;
526
527
  }
527
- (0, import_react_native_reanimated6.runOnUI)((gen) => {
528
+ (0, import_react_native_reanimated5.runOnUI)((gen) => {
528
529
  "worklet";
529
530
  capturedGeneration.value = gen;
530
531
  })(generation);
@@ -599,7 +600,7 @@ var import_auto_paper2 = require("@rific/auto-paper");
599
600
  var import_react7 = require("react");
600
601
  var import_react_native7 = require("react-native");
601
602
  var import_react_native_paper2 = require("react-native-paper");
602
- var import_react_native_reanimated7 = __toESM(require("react-native-reanimated"));
603
+ var import_react_native_reanimated6 = __toESM(require("react-native-reanimated"));
603
604
  var import_react_native_safe_area_context2 = require("react-native-safe-area-context");
604
605
  var import_jsx_runtime4 = require("react/jsx-runtime");
605
606
  var DOT_FULL = 8;
@@ -614,15 +615,15 @@ var PILL_HEIGHT = DOT_FULL + PILL_PAD_V * 2;
614
615
  var PILL_RADIUS = PILL_HEIGHT / 2;
615
616
  var PILL_WIDTH = CLIP_WIDTH + PILL_PAD_H * 2;
616
617
  var Dot = ({ activeColor, index, inactiveColor, pageWidth, scrollPosition }) => {
617
- const circleStyle = (0, import_react_native_reanimated7.useAnimatedStyle)(() => {
618
+ const circleStyle = (0, import_react_native_reanimated6.useAnimatedStyle)(() => {
618
619
  const page = scrollPosition.value / pageWidth;
619
620
  const distance = Math.abs(index - page);
620
621
  const t = Math.max(0, Math.min((distance - 0.5) / 2, 1));
621
622
  const size = DOT_FULL + (DOT_SMALL - DOT_FULL) * t;
622
- const backgroundColor = (0, import_react_native_reanimated7.interpolateColor)(t, [0, 1], [activeColor, inactiveColor]);
623
+ const backgroundColor = (0, import_react_native_reanimated6.interpolateColor)(t, [0, 1], [activeColor, inactiveColor]);
623
624
  return { backgroundColor, borderRadius: size / 2, height: size, width: size };
624
625
  }, [scrollPosition, pageWidth, index, activeColor, inactiveColor]);
625
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native7.View, { style: styles3.dotContainer, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated7.default.View, { style: circleStyle }) });
626
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native7.View, { style: styles3.dotContainer, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated6.default.View, { style: circleStyle }) });
626
627
  };
627
628
  var HorizontalDots = ({ total }) => {
628
629
  const { blur, footerHeightShared, scrollPosition } = (0, import_react7.useContext)(ScrollViewContext);
@@ -632,21 +633,21 @@ var HorizontalDots = ({ total }) => {
632
633
  const insetsBottom = insets.bottom;
633
634
  const activeColor = theme.colors.primary;
634
635
  const inactiveColor = theme.colors.outlineVariant;
635
- const pillContainerStyle = (0, import_react_native_reanimated7.useAnimatedStyle)(
636
+ const pillContainerStyle = (0, import_react_native_reanimated6.useAnimatedStyle)(
636
637
  () => ({
637
638
  bottom: Math.max(footerHeightShared.value, insetsBottom) + 8
638
639
  }),
639
640
  [footerHeightShared, insetsBottom]
640
641
  );
641
- const rowStyle = (0, import_react_native_reanimated7.useAnimatedStyle)(() => {
642
+ const rowStyle = (0, import_react_native_reanimated6.useAnimatedStyle)(() => {
642
643
  const page = scrollPosition.value / width;
643
644
  const maxOffset = Math.max(0, (total - CLIP_COUNT) * DOT_STEP);
644
645
  const offset = Math.max(0, Math.min((page - (CLIP_COUNT - 1) / 2) * DOT_STEP, maxOffset));
645
646
  return { transform: [{ translateX: -offset }] };
646
647
  }, [scrollPosition, width, total]);
647
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated7.default.View, { pointerEvents: "none", style: [styles3.pillContainer, pillContainerStyle], children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react_native7.View, { style: styles3.pill, children: [
648
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated6.default.View, { pointerEvents: "none", style: [styles3.pillContainer, pillContainerStyle], children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react_native7.View, { style: styles3.pill, children: [
648
649
  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_auto_paper2.BlurView, { blur, style: import_react_native7.StyleSheet.absoluteFill }),
649
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native7.View, { style: styles3.dotsClip, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated7.default.View, { style: [styles3.dotsRow, rowStyle], children: Array.from({ length: total }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dot, { activeColor, index: i, inactiveColor, pageWidth: width, scrollPosition }, i)) }) })
650
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native7.View, { style: styles3.dotsClip, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_reanimated6.default.View, { style: [styles3.dotsRow, rowStyle], children: Array.from({ length: total }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dot, { activeColor, index: i, inactiveColor, pageWidth: width, scrollPosition }, i)) }) })
650
651
  ] }) });
651
652
  };
652
653
  var styles3 = import_react_native7.StyleSheet.create({
@@ -666,7 +667,7 @@ var styles3 = import_react_native7.StyleSheet.create({
666
667
 
667
668
  // src/internal/useScrollHandlerJS.ts
668
669
  var import_react8 = require("react");
669
- var import_react_native_reanimated8 = require("react-native-reanimated");
670
+ var import_react_native_reanimated7 = require("react-native-reanimated");
670
671
  var REMOUNT_RETRY_TOLERANCE = 1;
671
672
  var REMOUNT_RETRY_MAX_ATTEMPTS = 8;
672
673
  function useScrollHandlerJS({ capturedGeneration, chipHidden, chipThreshold = 100, footerFixed, headerFixed, isHorizontal, jsListGeneration, remountTarget = null, scrollTo }) {
@@ -732,8 +733,8 @@ function useScrollHandlerJS({ capturedGeneration, chipHidden, chipThreshold = 10
732
733
  if (yn >= -headerHeightShared.value + pullSearchHeightShared.value) snapUpAccum.current -= delta;
733
734
  if (snapUpAccum.current >= 10) {
734
735
  snapUpAccum.current = 999;
735
- if (snapHeader) headerOffset.value = (0, import_react_native_reanimated8.withTiming)(0, { duration: 200 });
736
- if (snapFooter) footerOffset.value = (0, import_react_native_reanimated8.withTiming)(0, { duration: 200 });
736
+ if (snapHeader) headerOffset.value = (0, import_react_native_reanimated7.withTiming)(0, { duration: 200 });
737
+ if (snapFooter) footerOffset.value = (0, import_react_native_reanimated7.withTiming)(0, { duration: 200 });
737
738
  }
738
739
  }
739
740
  }
@@ -749,7 +750,7 @@ function useScrollHandlerJS({ capturedGeneration, chipHidden, chipThreshold = 10
749
750
  const settle = (0, import_react8.useCallback)(
750
751
  (revealing) => {
751
752
  if (!chromeHosted || footerFixed || !chromeWritable.value) return;
752
- footerOffset.value = (0, import_react_native_reanimated8.withTiming)(revealing ? 0 : chromeSettleTarget(footerOffset.value, stackHeightShared.value), { duration: 200 });
753
+ footerOffset.value = (0, import_react_native_reanimated7.withTiming)(revealing ? 0 : chromeSettleTarget(footerOffset.value, stackHeightShared.value), { duration: 200 });
753
754
  },
754
755
  [chromeHosted, chromeWritable, footerFixed, footerOffset, stackHeightShared]
755
756
  );
@@ -938,7 +939,8 @@ var import_core3 = require("@rific/core");
938
939
  var import_react10 = require("react");
939
940
  var import_react_native9 = require("react-native");
940
941
  var import_react_native_paper3 = require("react-native-paper");
941
- var import_react_native_reanimated9 = __toESM(require("react-native-reanimated"));
942
+ var import_react_native_reanimated8 = __toESM(require("react-native-reanimated"));
943
+ var import_react_native_worklets3 = require("react-native-worklets");
942
944
  var import_jsx_runtime6 = require("react/jsx-runtime");
943
945
  var PullSearch = (0, import_react10.forwardRef)(function PullSearch2({ debounce, onChangeText, onHeightChange, placeholder, value: propValue }, ref) {
944
946
  const { headerHeight, scrollPosition } = (0, import_react10.useContext)(ScrollViewContext);
@@ -958,13 +960,13 @@ var PullSearch = (0, import_react10.forwardRef)(function PullSearch2({ debounce,
958
960
  }));
959
961
  const blurInput = (0, import_react10.useCallback)(() => inputRef.current?.blur(), []);
960
962
  const blurKey = (0, import_core3.useWorkletCallback)(blurInput);
961
- (0, import_react_native_reanimated9.useAnimatedReaction)(
963
+ (0, import_react_native_reanimated8.useAnimatedReaction)(
962
964
  () => {
963
965
  if (barHeight === 0) return false;
964
966
  return scrollPosition.value >= -(headerHeight ?? 0) + barHeight;
965
967
  },
966
968
  (isHidden, wasHidden) => {
967
- if (isHidden && !wasHidden) (0, import_react_native_reanimated9.runOnJS)(import_core3.callWorkletCallback)(blurKey);
969
+ if (isHidden && !wasHidden) (0, import_react_native_worklets3.scheduleOnRN)(import_core3.callWorkletCallback, blurKey);
968
970
  },
969
971
  // scrollPosition has to be listed too, not just read - see useStickyHeaders' useAnimatedReaction
970
972
  // for why: on web, without reanimated's Babel plugin active, an unlisted SharedValue mutation
@@ -995,14 +997,14 @@ var PullSearch = (0, import_react10.forwardRef)(function PullSearch2({ debounce,
995
997
  onChangeText(normalizedValue);
996
998
  return void 0;
997
999
  }, [debounce, onChangeText, value]);
998
- const animatedStyle = (0, import_react_native_reanimated9.useAnimatedStyle)(() => {
1000
+ const animatedStyle = (0, import_react_native_reanimated8.useAnimatedStyle)(() => {
999
1001
  if (barHeight === 0) return { opacity: 0 };
1000
1002
  const h = headerHeight ?? 0;
1001
1003
  const showY = -h;
1002
1004
  const hideY = -h + barHeight;
1003
- return { opacity: (0, import_react_native_reanimated9.interpolate)(scrollPosition.value, [showY, hideY], [1, 0], import_react_native_reanimated9.Extrapolation.CLAMP) };
1005
+ return { opacity: (0, import_react_native_reanimated8.interpolate)(scrollPosition.value, [showY, hideY], [1, 0], import_react_native_reanimated8.Extrapolation.CLAMP) };
1004
1006
  }, [barHeight, headerHeight, scrollPosition]);
1005
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native_reanimated9.default.View, { onLayout: handleLayout, style: [styles5.container, animatedStyle], children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native_paper3.Searchbar, { autoCorrect: false, onChangeText: (text) => setValue((text || "").trimStart()), onClearIconPress: handleClear, placeholder, placeholderTextColor: theme.colors.onSurfaceVariant, ref: inputRef, spellCheck: false, style: styles5.input, value }) });
1007
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native_reanimated8.default.View, { onLayout: handleLayout, style: [styles5.container, animatedStyle], children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native_paper3.Searchbar, { autoCorrect: false, onChangeText: (text) => setValue((text || "").trimStart()), onClearIconPress: handleClear, placeholder, placeholderTextColor: theme.colors.onSurfaceVariant, ref: inputRef, spellCheck: false, style: styles5.input, value }) });
1006
1008
  });
1007
1009
  var styles5 = import_react_native9.StyleSheet.create({
1008
1010
  container: { paddingVertical: 8 },
@@ -1037,21 +1039,21 @@ var scrollViewReducer = scrollViewSlice.reducer;
1037
1039
  var import_react11 = require("react");
1038
1040
  var import_react_native10 = require("react-native");
1039
1041
  var import_react_native_gesture_handler3 = require("react-native-gesture-handler");
1040
- var import_react_native_reanimated10 = __toESM(require("react-native-reanimated"));
1042
+ var import_react_native_reanimated9 = __toESM(require("react-native-reanimated"));
1041
1043
  var import_jsx_runtime7 = require("react/jsx-runtime");
1042
1044
  var ScrollViewInner = ({ chipProps, chipThreshold, children, contentContainerStyle: externalContentContainerStyle, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, style, ...props }) => {
1043
1045
  const scrollView = (0, import_react11.useRef)(null);
1044
1046
  const isHorizontal = horizontal === true;
1045
1047
  const { chipHidden, chipStyle, containerStyle, contentInset, contentOffset, contentPadding, footerFixed, headerFixed } = useScrollList({ footerFixed: footerFixedProp, headerFixed: headerFixedProp, isHorizontal, keyboardAware, pullSearchHeight, style });
1046
1048
  const { listGeneration, onListUnmount } = (0, import_react11.useContext)(ScrollViewContext);
1047
- const capturedGeneration = (0, import_react_native_reanimated10.useSharedValue)(-1);
1049
+ const capturedGeneration = (0, import_react_native_reanimated9.useSharedValue)(-1);
1048
1050
  (0, import_react11.useLayoutEffect)(() => {
1049
1051
  const generation = listGeneration.value;
1050
1052
  if (import_react_native10.Platform.OS === "web") {
1051
1053
  capturedGeneration.value = generation;
1052
1054
  return;
1053
1055
  }
1054
- (0, import_react_native_reanimated10.runOnUI)((gen) => {
1056
+ (0, import_react_native_reanimated9.runOnUI)((gen) => {
1055
1057
  "worklet";
1056
1058
  capturedGeneration.value = gen;
1057
1059
  })(generation);
@@ -1082,7 +1084,7 @@ var ScrollViewInner = ({ chipProps, chipThreshold, children, contentContainerSty
1082
1084
  const detectorGesture = gesture !== void 0 ? combinedGesture : void 0;
1083
1085
  const content = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react_native10.View, { style: containerStyle, children: [
1084
1086
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1085
- import_react_native_reanimated10.default.ScrollView,
1087
+ import_react_native_reanimated9.default.ScrollView,
1086
1088
  {
1087
1089
  ...props,
1088
1090
  contentContainerStyle: contentPadding ? [externalContentContainerStyle, contentPadding] : externalContentContainerStyle,
@@ -1109,7 +1111,7 @@ var ScrollView = (0, import_react11.memo)(ScrollViewInner);
1109
1111
 
1110
1112
  // src/ScrollViewChromeProvider.tsx
1111
1113
  var import_react13 = require("react");
1112
- var import_react_native_reanimated11 = require("react-native-reanimated");
1114
+ var import_react_native_reanimated10 = require("react-native-reanimated");
1113
1115
 
1114
1116
  // src/ScrollViewChromeContext.ts
1115
1117
  var import_react12 = require("react");
@@ -1121,7 +1123,7 @@ var import_jsx_runtime8 = require("react/jsx-runtime");
1121
1123
  var REVEAL_DURATION = 200;
1122
1124
  var alwaysActive = () => true;
1123
1125
  var ScrollViewChromeProvider = ({ children, footprint, overhang = 0, snapBack = true, useIsActive = alwaysActive }) => {
1124
- const offset = (0, import_react_native_reanimated11.useSharedValue)(0);
1126
+ const offset = (0, import_react_native_reanimated10.useSharedValue)(0);
1125
1127
  const [claims, setClaims] = (0, import_react13.useState)([]);
1126
1128
  const [pins, setPins] = (0, import_react13.useState)(0);
1127
1129
  const activeId = claims.length > 0 ? claims[claims.length - 1] : null;
@@ -1131,7 +1133,7 @@ var ScrollViewChromeProvider = ({ children, footprint, overhang = 0, snapBack =
1131
1133
  const addPin = (0, import_react13.useCallback)(() => setPins((current) => current + 1), []);
1132
1134
  const removePin = (0, import_react13.useCallback)(() => setPins((current) => Math.max(0, current - 1)), []);
1133
1135
  const reveal = (0, import_react13.useCallback)(() => {
1134
- offset.value = (0, import_react_native_reanimated11.withTiming)(0, { duration: REVEAL_DURATION });
1136
+ offset.value = (0, import_react_native_reanimated10.withTiming)(0, { duration: REVEAL_DURATION });
1135
1137
  }, [offset]);
1136
1138
  (0, import_react13.useEffect)(() => {
1137
1139
  reveal();
@@ -1152,7 +1154,7 @@ var ScrollViewConfigProvider = scrollViewConfig.Provider;
1152
1154
  var import_auto_paper3 = require("@rific/auto-paper");
1153
1155
  var import_react14 = require("react");
1154
1156
  var import_react_native11 = require("react-native");
1155
- var import_react_native_reanimated12 = __toESM(require("react-native-reanimated"));
1157
+ var import_react_native_reanimated11 = __toESM(require("react-native-reanimated"));
1156
1158
  var import_react_native_safe_area_context3 = require("react-native-safe-area-context");
1157
1159
  var import_jsx_runtime9 = (
1158
1160
  // bottom: tabBarHeight (not the styles.footer default of 0) - a consuming app's own persistent
@@ -1182,7 +1184,7 @@ var ScrollViewFooter = ({ children, style }) => {
1182
1184
  }) => {
1183
1185
  if (footerHeight !== height) setFooterHeight(height);
1184
1186
  };
1185
- const footerStyle = (0, import_react_native_reanimated12.useAnimatedStyle)(() => {
1187
+ const footerStyle = (0, import_react_native_reanimated11.useAnimatedStyle)(() => {
1186
1188
  if (chromeHosted) return { transform: [{ translateY: Math.min(Math.max(footerOffset.value, 0), stackHeightShared.value) }] };
1187
1189
  if (footerFixed) return { transform: [{ translateY: 0 }] };
1188
1190
  if (snapBackFooterShared.value) return { transform: [{ translateY: footerOffset.value }] };
@@ -1202,7 +1204,7 @@ var ScrollViewFooter = ({ children, style }) => {
1202
1204
  const rowPaddingBottom = footerFixed && footerAboveKeyboard ? Math.max(bottomPadding - keyboardHeight, 0) : bottomPadding;
1203
1205
  const footerBottom = chromeHosted && footerFixed && footerAboveKeyboard ? Math.max(tabBarHeight - keyboardHeight, 0) : tabBarHeight;
1204
1206
  const { paddingBottom: consumerPaddingBottom, ...restStyle } = style ?? {};
1205
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native_reanimated12.default.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [styles6.footer, { bottom: footerBottom, paddingBottom: containerPaddingBottom }, footerStyle], children: [
1207
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native_reanimated11.default.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [styles6.footer, { bottom: footerBottom, paddingBottom: containerPaddingBottom }, footerStyle], children: [
1206
1208
  (footerHeight ?? 0) > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_auto_paper3.BlurView, { blur, style: import_react_native11.StyleSheet.absoluteFill }),
1207
1209
  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native11.View, { ref: rowRef, style: [styles6.row, restStyle, { paddingBottom: rowPaddingBottom + (typeof consumerPaddingBottom === "number" ? consumerPaddingBottom : 0) }], children })
1208
1210
  ] });
@@ -1217,7 +1219,7 @@ var import_auto_paper4 = require("@rific/auto-paper");
1217
1219
  var import_react15 = require("react");
1218
1220
  var import_react_native12 = require("react-native");
1219
1221
  var import_react_native_paper4 = require("react-native-paper");
1220
- var import_react_native_reanimated13 = __toESM(require("react-native-reanimated"));
1222
+ var import_react_native_reanimated12 = __toESM(require("react-native-reanimated"));
1221
1223
  var import_react_native_safe_area_context4 = require("react-native-safe-area-context");
1222
1224
  var import_jsx_runtime10 = require("react/jsx-runtime");
1223
1225
  var ActionBg = ({ blur, style }) => blur ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { style: [import_react_native12.StyleSheet.absoluteFill, styles7.actionBg, style], children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_auto_paper4.BlurView, { blur: true, style: import_react_native12.StyleSheet.absoluteFill }) }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { style: [import_react_native12.StyleSheet.absoluteFill, styles7.actionBg, style], pointerEvents: "none", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_paper4.Surface, { style: import_react_native12.StyleSheet.absoluteFill, elevation: 1, children: null }) });
@@ -1228,7 +1230,7 @@ var ScrollViewHeader = ({ actionSize = 48, actionStyle, backAction, backActionAc
1228
1230
  const insets = (0, import_react_native_safe_area_context4.useSafeAreaInsets)();
1229
1231
  const theme = (0, import_react_native_paper4.useTheme)();
1230
1232
  const top = topInset ? insets.top : 0;
1231
- const measuredShared = (0, import_react_native_reanimated13.useSharedValue)(false);
1233
+ const measuredShared = (0, import_react_native_reanimated12.useSharedValue)(false);
1232
1234
  const handleLayout = ({
1233
1235
  nativeEvent: {
1234
1236
  layout: { height }
@@ -1248,21 +1250,21 @@ var ScrollViewHeader = ({ actionSize = 48, actionStyle, backAction, backActionAc
1248
1250
  const actionMargin = 4;
1249
1251
  const contentMinHeight = actionSize + 2 * actionMargin;
1250
1252
  const unmeasuredHeight = top + contentMinHeight;
1251
- const translateStyle = (0, import_react_native_reanimated13.useAnimatedStyle)(() => {
1253
+ const translateStyle = (0, import_react_native_reanimated12.useAnimatedStyle)(() => {
1252
1254
  if (headerFixed) return { transform: [{ translateY: 0 }] };
1253
1255
  if (snapBackHeaderShared.value) return { transform: [{ translateY: headerOffset.value }] };
1254
1256
  const effective = scrollPosition.value + headerHeightShared.value - pullSearchHeightShared.value;
1255
1257
  if (effective <= 0) return { transform: [{ translateY: 0 }] };
1256
1258
  return { transform: [{ translateY: -effective }] };
1257
1259
  }, [headerFixed, headerHeightShared, headerOffset, pullSearchHeightShared, scrollPosition, snapBackHeaderShared]);
1258
- const blurStyle = (0, import_react_native_reanimated13.useAnimatedStyle)(() => {
1260
+ const blurStyle = (0, import_react_native_reanimated12.useAnimatedStyle)(() => {
1259
1261
  if (!measuredShared.value) return { height: unmeasuredHeight };
1260
1262
  if (!headerHeightShared.value) return { height: 0 };
1261
1263
  if (headerFixed) return { height: headerHeightShared.value };
1262
1264
  const translateY = snapBackHeaderShared.value ? headerOffset.value : -Math.max(0, scrollPosition.value + headerHeightShared.value - pullSearchHeightShared.value);
1263
1265
  return { height: Math.max(headerHeightShared.value + translateY, top) };
1264
1266
  }, [headerFixed, top, unmeasuredHeight, measuredShared, headerHeightShared, headerOffset, pullSearchHeightShared, scrollPosition, snapBackHeaderShared]);
1265
- const progressStyle = (0, import_react_native_reanimated13.useAnimatedStyle)(() => {
1267
+ const progressStyle = (0, import_react_native_reanimated12.useAnimatedStyle)(() => {
1266
1268
  const h = headerHeightShared.value;
1267
1269
  if (headerFixed) return { top: h };
1268
1270
  const slide = snapBackHeaderShared.value ? -headerOffset.value : Math.max(0, scrollPosition.value + h - pullSearchHeightShared.value);
@@ -1276,8 +1278,8 @@ var ScrollViewHeader = ({ actionSize = 48, actionStyle, backAction, backActionAc
1276
1278
  const leadingStyle = { alignItems: "center", height: actionSize, justifyContent: "center", left: actionMargin, position: "absolute", top: actionTop, width: actionSize, zIndex: 3, ...actionShadow };
1277
1279
  const trailingStyle = { alignItems: "center", height: actionSize, justifyContent: "center", position: "absolute", right: actionMargin, top: actionTop, width: actionSize, zIndex: 3, ...actionShadow };
1278
1280
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
1279
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_reanimated13.default.View, { pointerEvents: "none", style: [styles7.blur, blurStyle], children: headerHeight !== 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_auto_paper4.BlurView, { blur, style: [styles7.blurInner, { height: headerHeight ?? unmeasuredHeight }] }) }),
1280
- /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated13.default.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [headerHeight === null ? styles7.headerInit : styles7.header, translateStyle], children: [
1281
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_reanimated12.default.View, { pointerEvents: "none", style: [styles7.blur, blurStyle], children: headerHeight !== 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_auto_paper4.BlurView, { blur, style: [styles7.blurInner, { height: headerHeight ?? unmeasuredHeight }] }) }),
1282
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated12.default.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [headerHeight === null ? styles7.headerInit : styles7.header, translateStyle], children: [
1281
1283
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { ref: contentRef, style: [{ paddingTop: top }, style], children: children ?? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native12.View, { style: [styles7.content, { minHeight: contentMinHeight }], children: [
1282
1284
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { style: styles7.side }),
1283
1285
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { style: styles7.spacer }),
@@ -1288,18 +1290,18 @@ var ScrollViewHeader = ({ actionSize = 48, actionStyle, backAction, backActionAc
1288
1290
  ] }) }),
1289
1291
  !blur && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native12.View, { style: [styles7.divider, { backgroundColor: theme.colors.outlineVariant }] })
1290
1292
  ] }),
1291
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_reanimated13.default.View, { pointerEvents: "none", style: [styles7.progress, progressStyle], children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_paper4.ProgressBar, { indeterminate: progress === null, visible: progressing, progress: progress ?? void 0 }) }),
1292
- backAction && (effectiveBackActionFixed ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated13.default.View, { style: leadingStyle, children: [
1293
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_reanimated12.default.View, { pointerEvents: "none", style: [styles7.progress, progressStyle], children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native_paper4.ProgressBar, { indeterminate: progress === null, visible: progressing, progress: progress ?? void 0 }) }),
1294
+ backAction && (effectiveBackActionFixed ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated12.default.View, { style: leadingStyle, children: [
1293
1295
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ActionBg, { blur, style: actionStyle }),
1294
1296
  backActionElement
1295
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated13.default.View, { style: [leadingStyle, translateStyle], children: [
1297
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated12.default.View, { style: [leadingStyle, translateStyle], children: [
1296
1298
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ActionBg, { blur, style: actionStyle }),
1297
1299
  backActionElement
1298
1300
  ] })),
1299
1301
  trailingAction && (trailingActionFixed ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native12.View, { style: trailingStyle, children: [
1300
1302
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ActionBg, { blur, style: actionStyle }),
1301
1303
  trailingAction
1302
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated13.default.View, { style: [trailingStyle, translateStyle], children: [
1304
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native_reanimated12.default.View, { style: [trailingStyle, translateStyle], children: [
1303
1305
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ActionBg, { blur, style: actionStyle }),
1304
1306
  trailingAction
1305
1307
  ] }))
@@ -1325,7 +1327,7 @@ var styles7 = import_react_native12.StyleSheet.create({
1325
1327
  var import_auto_paper5 = require("@rific/auto-paper");
1326
1328
  var import_react17 = require("react");
1327
1329
  var import_react_native13 = require("react-native");
1328
- var import_react_native_reanimated14 = require("react-native-reanimated");
1330
+ var import_react_native_reanimated13 = require("react-native-reanimated");
1329
1331
 
1330
1332
  // src/internal/ChromeRegistrar.tsx
1331
1333
  var import_react16 = require("react");
@@ -1366,24 +1368,24 @@ var ScrollViewProvider = ({ blur, chrome, children, fixed = false, footerAboveKe
1366
1368
  const [footerHeight, setFooterHeightState] = (0, import_react17.useState)(null);
1367
1369
  const [progress, setProgress] = (0, import_react17.useState)(null);
1368
1370
  const [progressing, setProgressing] = (0, import_react17.useState)(false);
1369
- const scrollPosition = (0, import_react_native_reanimated14.useSharedValue)(0);
1370
- const listGeneration = (0, import_react_native_reanimated14.useSharedValue)(0);
1371
+ const scrollPosition = (0, import_react_native_reanimated13.useSharedValue)(0);
1372
+ const listGeneration = (0, import_react_native_reanimated13.useSharedValue)(0);
1371
1373
  const jsListGeneration = (0, import_react17.useRef)(0);
1372
- const headerHeightShared = (0, import_react_native_reanimated14.useSharedValue)(0);
1373
- const footerHeightShared = (0, import_react_native_reanimated14.useSharedValue)(0);
1374
- const headerOffset = (0, import_react_native_reanimated14.useSharedValue)(0);
1375
- const ownFooterOffset = (0, import_react_native_reanimated14.useSharedValue)(0);
1376
- const ownStackHeight = (0, import_react_native_reanimated14.useSharedValue)(0);
1374
+ const headerHeightShared = (0, import_react_native_reanimated13.useSharedValue)(0);
1375
+ const footerHeightShared = (0, import_react_native_reanimated13.useSharedValue)(0);
1376
+ const headerOffset = (0, import_react_native_reanimated13.useSharedValue)(0);
1377
+ const ownFooterOffset = (0, import_react_native_reanimated13.useSharedValue)(0);
1378
+ const ownStackHeight = (0, import_react_native_reanimated13.useSharedValue)(0);
1377
1379
  const footerOffset = chromeHost ? chromeHost.offset : ownFooterOffset;
1378
- const chromeWritable = (0, import_react_native_reanimated14.useSharedValue)(!chromeHosted);
1380
+ const chromeWritable = (0, import_react_native_reanimated13.useSharedValue)(!chromeHosted);
1379
1381
  (0, import_react17.useEffect)(() => {
1380
1382
  if (!chromeHosted) chromeWritable.value = true;
1381
1383
  }, [chromeHosted, chromeWritable]);
1382
1384
  const revealChrome = chromeHost?.reveal;
1383
1385
  const stackHeightShared = chromeHosted ? ownStackHeight : footerHeightShared;
1384
- const pullSearchHeightShared = (0, import_react_native_reanimated14.useSharedValue)(0);
1385
- const snapBackHeaderShared = (0, import_react_native_reanimated14.useSharedValue)(false);
1386
- const snapBackFooterShared = (0, import_react_native_reanimated14.useSharedValue)(false);
1386
+ const pullSearchHeightShared = (0, import_react_native_reanimated13.useSharedValue)(0);
1387
+ const snapBackHeaderShared = (0, import_react_native_reanimated13.useSharedValue)(false);
1388
+ const snapBackFooterShared = (0, import_react_native_reanimated13.useSharedValue)(false);
1387
1389
  (0, import_react17.useEffect)(() => {
1388
1390
  snapBackHeaderShared.value = effectiveSnapBackHeader ?? effectiveSnapBack;
1389
1391
  snapBackFooterShared.value = chromeHosted ? chromeSnapBack : effectiveSnapBackFooter ?? effectiveSnapBack;
@@ -1457,27 +1459,28 @@ var ScrollViewSettingsProvider = scrollViewSettingsProvider;
1457
1459
  var import_react19 = require("react");
1458
1460
  var import_react_native14 = require("react-native");
1459
1461
  var import_react_native_gesture_handler4 = require("react-native-gesture-handler");
1460
- var import_react_native_reanimated16 = __toESM(require("react-native-reanimated"));
1462
+ var import_react_native_reanimated15 = __toESM(require("react-native-reanimated"));
1461
1463
 
1462
1464
  // src/internal/useStickyHeaders.ts
1463
1465
  var import_core7 = require("@rific/core");
1464
1466
  var import_react18 = require("react");
1465
- var import_react_native_reanimated15 = require("react-native-reanimated");
1467
+ var import_react_native_reanimated14 = require("react-native-reanimated");
1466
1468
  var import_react_native_safe_area_context5 = require("react-native-safe-area-context");
1469
+ var import_react_native_worklets4 = require("react-native-worklets");
1467
1470
  function useStickyHeaders(headerFixed, enabled) {
1468
1471
  const { headerHeightShared, headerOffset, pullSearchHeightShared, scrollPosition, snapBackHeaderShared } = (0, import_react18.useContext)(ScrollViewContext);
1469
1472
  const insetsTop = (0, import_react_native_safe_area_context5.useSafeAreaInsets)().top;
1470
- const sectionYPositions = (0, import_react_native_reanimated15.useSharedValue)([]);
1471
- const sectionHeights = (0, import_react_native_reanimated15.useSharedValue)([]);
1473
+ const sectionYPositions = (0, import_react_native_reanimated14.useSharedValue)([]);
1474
+ const sectionHeights = (0, import_react_native_reanimated14.useSharedValue)([]);
1472
1475
  const [activeIndex, setActiveIndex] = (0, import_react18.useState)(-1);
1473
1476
  const activeIndexKey = (0, import_core7.useWorkletCallback)(setActiveIndex);
1474
- const contentIndexShared = (0, import_react_native_reanimated15.useSharedValue)(-1);
1477
+ const contentIndexShared = (0, import_react_native_reanimated14.useSharedValue)(-1);
1475
1478
  (0, import_react18.useLayoutEffect)(() => {
1476
1479
  contentIndexShared.value = activeIndex;
1477
1480
  }, [activeIndex, contentIndexShared]);
1478
1481
  const positionsCache = (0, import_react18.useRef)([]);
1479
1482
  const heightsCache = (0, import_react18.useRef)([]);
1480
- (0, import_react_native_reanimated15.useAnimatedReaction)(
1483
+ (0, import_react_native_reanimated14.useAnimatedReaction)(
1481
1484
  () => {
1482
1485
  if (!enabled) return -1;
1483
1486
  const positions = sectionYPositions.value;
@@ -1502,7 +1505,7 @@ function useStickyHeaders(headerFixed, enabled) {
1502
1505
  return active;
1503
1506
  },
1504
1507
  (curr, prev) => {
1505
- if (curr !== prev) (0, import_react_native_reanimated15.runOnJS)(import_core7.callWorkletCallback)(activeIndexKey, curr);
1508
+ if (curr !== prev) (0, import_react_native_worklets4.scheduleOnRN)(import_core7.callWorkletCallback, activeIndexKey, curr);
1506
1509
  },
1507
1510
  // Same web-only reanimated gap as useAnimatedStyle elsewhere in this file: this "prepare"
1508
1511
  // function's own SharedValue reads (sectionYPositions, headerHeightShared, scrollPosition,
@@ -1511,7 +1514,7 @@ function useStickyHeaders(headerFixed, enabled) {
1511
1514
  // then never again on web, permanently freezing activeIndex/the active sticky section.
1512
1515
  [enabled, headerFixed, insetsTop, sectionYPositions, headerHeightShared, scrollPosition, snapBackHeaderShared, headerOffset, pullSearchHeightShared]
1513
1516
  );
1514
- const clipStyle = (0, import_react_native_reanimated15.useAnimatedStyle)(() => {
1517
+ const clipStyle = (0, import_react_native_reanimated14.useAnimatedStyle)(() => {
1515
1518
  const hHeight = headerHeightShared.value;
1516
1519
  const scrollPos = scrollPosition.value;
1517
1520
  let stickyTop;
@@ -1525,7 +1528,7 @@ function useStickyHeaders(headerFixed, enabled) {
1525
1528
  }
1526
1529
  return { top: stickyTop };
1527
1530
  }, [enabled, headerFixed, insetsTop, headerHeightShared, scrollPosition, snapBackHeaderShared, headerOffset, pullSearchHeightShared]);
1528
- const overlayStyle = (0, import_react_native_reanimated15.useAnimatedStyle)(() => {
1531
+ const overlayStyle = (0, import_react_native_reanimated14.useAnimatedStyle)(() => {
1529
1532
  const hidden = { opacity: 0, top: 0, transform: [{ translateY: 0 }] };
1530
1533
  if (!enabled) return hidden;
1531
1534
  const index = contentIndexShared.value;
@@ -1577,20 +1580,20 @@ function useStickyHeaders(headerFixed, enabled) {
1577
1580
 
1578
1581
  // src/SectionList.tsx
1579
1582
  var import_jsx_runtime12 = require("react/jsx-runtime");
1580
- var AnimatedSectionList = import_react_native_reanimated16.default.createAnimatedComponent(import_react_native14.SectionList);
1583
+ var AnimatedSectionList = import_react_native_reanimated15.default.createAnimatedComponent(import_react_native14.SectionList);
1581
1584
  var SectionListInner = ({ chipProps, chipThreshold, contentContainerStyle: externalContentContainerStyle, initialNumToRender = 20, maxToRenderPerBatch = 50, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onContentSizeChange, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, removeClippedSubviews = false, sections, showsVerticalScrollIndicator, style, ref: externalRef, windowSize = 100, ...props }) => {
1582
1585
  const scrollView = (0, import_react19.useRef)(null);
1583
1586
  const { stickySectionHeadersEnabled = true, renderSectionHeader, ...passThroughProps } = props;
1584
1587
  const { chipHidden, chipStyle, containerStyle, contentInset, contentOffset, contentPadding, footerFixed, headerFixed, headerHeight } = useScrollList({ footerFixed: footerFixedProp, headerFixed: headerFixedProp, hideUntilMeasured: true, keyboardAware, pullSearchHeight, style });
1585
1588
  const { listGeneration, onListUnmount } = (0, import_react19.useContext)(ScrollViewContext);
1586
- const capturedGeneration = (0, import_react_native_reanimated16.useSharedValue)(-1);
1589
+ const capturedGeneration = (0, import_react_native_reanimated15.useSharedValue)(-1);
1587
1590
  (0, import_react19.useLayoutEffect)(() => {
1588
1591
  const generation = listGeneration.value;
1589
1592
  if (import_react_native14.Platform.OS === "web") {
1590
1593
  capturedGeneration.value = generation;
1591
1594
  return;
1592
1595
  }
1593
- (0, import_react_native_reanimated16.runOnUI)((gen) => {
1596
+ (0, import_react_native_reanimated15.runOnUI)((gen) => {
1594
1597
  "worklet";
1595
1598
  capturedGeneration.value = gen;
1596
1599
  })(generation);
@@ -1711,7 +1714,7 @@ var SectionListInner = ({ chipProps, chipThreshold, contentContainerStyle: exter
1711
1714
  ),
1712
1715
  hiddenHeader && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native14.View, { pointerEvents: "none", style: styles8.measureContainer, children: hiddenHeader }),
1713
1716
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ScrollViewChip, { chipProps, onChipPress, onPress: handleScrollToTop, style: chipStyle }),
1714
- usesCustomSticky && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_reanimated16.default.View, { pointerEvents: "none", style: [styles8.stickyClip, clipStyle], children: activeIndex >= 0 && activeIndex < sections.length && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_reanimated16.default.View, { style: [styles8.stickyOverlay, overlayStyle], children: renderSectionHeader({ section: sections[activeIndex] }) }) })
1717
+ usesCustomSticky && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_reanimated15.default.View, { pointerEvents: "none", style: [styles8.stickyClip, clipStyle], children: activeIndex >= 0 && activeIndex < sections.length && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_reanimated15.default.View, { style: [styles8.stickyOverlay, overlayStyle], children: renderSectionHeader({ section: sections[activeIndex] }) }) })
1715
1718
  ] });
1716
1719
  return detectorGesture ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_gesture_handler4.GestureDetector, { gesture: detectorGesture, children: content }) : content;
1717
1720
  };
@@ -1731,14 +1734,14 @@ var useScrollView = () => {
1731
1734
 
1732
1735
  // src/useScrollViewChrome.ts
1733
1736
  var import_react21 = require("react");
1734
- var import_react_native_reanimated17 = require("react-native-reanimated");
1737
+ var import_react_native_reanimated16 = require("react-native-reanimated");
1735
1738
  var noop = () => {
1736
1739
  };
1737
1740
  var useScrollViewChromeStyle = () => {
1738
1741
  const chrome = (0, import_react21.useContext)(ScrollViewChromeContext);
1739
- const fallback = (0, import_react_native_reanimated17.useSharedValue)(0);
1742
+ const fallback = (0, import_react_native_reanimated16.useSharedValue)(0);
1740
1743
  const offset = chrome?.offset ?? fallback;
1741
- return (0, import_react_native_reanimated17.useAnimatedStyle)(() => ({ transform: [{ translateY: offset.value }] }), [offset]);
1744
+ return (0, import_react_native_reanimated16.useAnimatedStyle)(() => ({ transform: [{ translateY: offset.value }] }), [offset]);
1742
1745
  };
1743
1746
  var useScrollViewChromePin = (active) => {
1744
1747
  const chrome = (0, import_react21.useContext)(ScrollViewChromeContext);
package/dist/index.mjs CHANGED
@@ -33,7 +33,8 @@ var styles = StyleSheet.create({
33
33
  // src/internal/useScrollHandler.ts
34
34
  import { callWorkletCallback, useWorkletCallback } from "@rific/core";
35
35
  import { useContext as useContext2 } from "react";
36
- import { runOnJS, useAnimatedScrollHandler, useSharedValue as useSharedValue2, withTiming } from "react-native-reanimated";
36
+ import { useAnimatedScrollHandler, useSharedValue as useSharedValue2, withTiming } from "react-native-reanimated";
37
+ import { scheduleOnRN } from "react-native-worklets";
37
38
 
38
39
  // src/ScrollViewContext.ts
39
40
  import { createContext } from "react";
@@ -290,9 +291,9 @@ function useScrollHandler({ capturedGeneration, chipHidden, chipThreshold = 100,
290
291
  const target = remountSyncTarget.value;
291
292
  if (Math.abs(y - target) < REMOUNT_SYNC_TOLERANCE) {
292
293
  remountSyncTarget.value = null;
293
- if (onRemountSynced) runOnJS(callWorkletCallback)(remountSyncedKey, y);
294
+ if (onRemountSynced) scheduleOnRN(callWorkletCallback, remountSyncedKey, y);
294
295
  } else if (onRemountSyncRetry) {
295
- runOnJS(callWorkletCallback)(remountSyncRetryKey, y);
296
+ scheduleOnRN(callWorkletCallback, remountSyncRetryKey, y);
296
297
  }
297
298
  return;
298
299
  }
@@ -380,7 +381,7 @@ import { callWorkletCallback as callWorkletCallback2, useWorkletCallback as useW
380
381
  import { useState as useState2 } from "react";
381
382
  import { Platform as Platform2 } from "react-native";
382
383
  import { useKeyboardHandler } from "react-native-keyboard-controller";
383
- import { runOnJS as runOnJS2 } from "react-native-reanimated";
384
+ import { scheduleOnRN as scheduleOnRN2 } from "react-native-worklets";
384
385
  var useKeyboardInsetNative = () => {
385
386
  const [keyboardHeight, setKeyboardHeight] = useState2(0);
386
387
  const keyboardHeightKey = useWorkletCallback2(setKeyboardHeight);
@@ -388,11 +389,11 @@ var useKeyboardInsetNative = () => {
388
389
  {
389
390
  onMove: (e) => {
390
391
  "worklet";
391
- runOnJS2(callWorkletCallback2)(keyboardHeightKey, e.height);
392
+ scheduleOnRN2(callWorkletCallback2, keyboardHeightKey, e.height);
392
393
  },
393
394
  onEnd: (e) => {
394
395
  "worklet";
395
- runOnJS2(callWorkletCallback2)(keyboardHeightKey, e.height);
396
+ scheduleOnRN2(callWorkletCallback2, keyboardHeightKey, e.height);
396
397
  }
397
398
  },
398
399
  []
@@ -879,7 +880,8 @@ import { callWorkletCallback as callWorkletCallback3, useWorkletCallback as useW
879
880
  import { forwardRef, useCallback as useCallback5, useContext as useContext8, useEffect as useEffect3, useImperativeHandle, useRef as useRef5, useState as useState4 } from "react";
880
881
  import { StyleSheet as StyleSheet4 } from "react-native";
881
882
  import { Searchbar, useTheme as useTheme3 } from "react-native-paper";
882
- import Animated3, { Extrapolation, interpolate, runOnJS as runOnJS3, useAnimatedReaction, useAnimatedStyle as useAnimatedStyle3 } from "react-native-reanimated";
883
+ import Animated3, { Extrapolation, interpolate, useAnimatedReaction, useAnimatedStyle as useAnimatedStyle3 } from "react-native-reanimated";
884
+ import { scheduleOnRN as scheduleOnRN3 } from "react-native-worklets";
883
885
  import { jsx as jsx6 } from "react/jsx-runtime";
884
886
  var PullSearch = forwardRef(function PullSearch2({ debounce, onChangeText, onHeightChange, placeholder, value: propValue }, ref) {
885
887
  const { headerHeight, scrollPosition } = useContext8(ScrollViewContext);
@@ -905,7 +907,7 @@ var PullSearch = forwardRef(function PullSearch2({ debounce, onChangeText, onHei
905
907
  return scrollPosition.value >= -(headerHeight ?? 0) + barHeight;
906
908
  },
907
909
  (isHidden, wasHidden) => {
908
- if (isHidden && !wasHidden) runOnJS3(callWorkletCallback3)(blurKey);
910
+ if (isHidden && !wasHidden) scheduleOnRN3(callWorkletCallback3, blurKey);
909
911
  },
910
912
  // scrollPosition has to be listed too, not just read - see useStickyHeaders' useAnimatedReaction
911
913
  // for why: on web, without reanimated's Babel plugin active, an unlisted SharedValue mutation
@@ -1403,8 +1405,9 @@ import Animated7, { runOnUI as runOnUI3, useSharedValue as useSharedValue10 } fr
1403
1405
  // src/internal/useStickyHeaders.ts
1404
1406
  import { callWorkletCallback as callWorkletCallback4, useWorkletCallback as useWorkletCallback4 } from "@rific/core";
1405
1407
  import { useCallback as useCallback9, useContext as useContext13, useLayoutEffect as useLayoutEffect8, useRef as useRef10, useState as useState7 } from "react";
1406
- import { runOnJS as runOnJS4, useAnimatedReaction as useAnimatedReaction2, useAnimatedStyle as useAnimatedStyle6, useSharedValue as useSharedValue9 } from "react-native-reanimated";
1408
+ import { useAnimatedReaction as useAnimatedReaction2, useAnimatedStyle as useAnimatedStyle6, useSharedValue as useSharedValue9 } from "react-native-reanimated";
1407
1409
  import { useSafeAreaInsets as useSafeAreaInsets5 } from "react-native-safe-area-context";
1410
+ import { scheduleOnRN as scheduleOnRN4 } from "react-native-worklets";
1408
1411
  function useStickyHeaders(headerFixed, enabled) {
1409
1412
  const { headerHeightShared, headerOffset, pullSearchHeightShared, scrollPosition, snapBackHeaderShared } = useContext13(ScrollViewContext);
1410
1413
  const insetsTop = useSafeAreaInsets5().top;
@@ -1443,7 +1446,7 @@ function useStickyHeaders(headerFixed, enabled) {
1443
1446
  return active;
1444
1447
  },
1445
1448
  (curr, prev) => {
1446
- if (curr !== prev) runOnJS4(callWorkletCallback4)(activeIndexKey, curr);
1449
+ if (curr !== prev) scheduleOnRN4(callWorkletCallback4, activeIndexKey, curr);
1447
1450
  },
1448
1451
  // Same web-only reanimated gap as useAnimatedStyle elsewhere in this file: this "prepare"
1449
1452
  // function's own SharedValue reads (sectionYPositions, headerHeightShared, scrollPosition,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rific/scroll-view",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "Blur styled scroll system for React Native. Floating headers/footers, keyboard awareness, and scroll-away chrome",
5
5
  "keywords": [
6
6
  "react-native",
@@ -99,7 +99,8 @@
99
99
  "react-native-keyboard-controller": ">=1.0.0",
100
100
  "react-native-paper": ">=5.0.0",
101
101
  "react-native-reanimated": ">=4.0.0",
102
- "react-native-safe-area-context": ">=5.0.0"
102
+ "react-native-safe-area-context": ">=5.0.0",
103
+ "react-native-worklets": ">=0.5.0"
103
104
  },
104
105
  "publishConfig": {
105
106
  "access": "public"
@@ -2,7 +2,8 @@ import { callWorkletCallback, useWorkletCallback } from '@rific/core'
2
2
  import { forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useRef, useState } from 'react'
3
3
  import { type LayoutChangeEvent, StyleSheet, type TextInput } from 'react-native'
4
4
  import { Searchbar, useTheme } from 'react-native-paper'
5
- import Animated, { Extrapolation, interpolate, runOnJS, useAnimatedReaction, useAnimatedStyle } from 'react-native-reanimated'
5
+ import Animated, { Extrapolation, interpolate, useAnimatedReaction, useAnimatedStyle } from 'react-native-reanimated'
6
+ import { scheduleOnRN } from 'react-native-worklets'
6
7
 
7
8
  import { ScrollViewContext } from './ScrollViewContext'
8
9
 
@@ -47,7 +48,7 @@ export const PullSearch = forwardRef<PullSearchHandle, PullSearchProps>(function
47
48
  return scrollPosition.value >= -(headerHeight ?? 0) + barHeight
48
49
  },
49
50
  (isHidden, wasHidden) => {
50
- if (isHidden && !wasHidden) runOnJS(callWorkletCallback)(blurKey)
51
+ if (isHidden && !wasHidden) scheduleOnRN(callWorkletCallback, blurKey)
51
52
  },
52
53
  // scrollPosition has to be listed too, not just read - see useStickyHeaders' useAnimatedReaction
53
54
  // for why: on web, without reanimated's Babel plugin active, an unlisted SharedValue mutation
@@ -1,7 +1,8 @@
1
1
  import { callWorkletCallback, useWorkletCallback } from '@rific/core'
2
2
  import { useContext } from 'react'
3
3
  import type { SharedValue } from 'react-native-reanimated'
4
- import { runOnJS, useAnimatedScrollHandler, useSharedValue, withTiming } from 'react-native-reanimated'
4
+ import { useAnimatedScrollHandler, useSharedValue, withTiming } from 'react-native-reanimated'
5
+ import { scheduleOnRN } from 'react-native-worklets'
5
6
 
6
7
  import { ScrollViewContext } from '../ScrollViewContext'
7
8
  import { REMOUNT_SYNC_TOLERANCE } from '../useScrollInit'
@@ -38,9 +39,9 @@ export function useScrollHandler({ capturedGeneration, chipHidden, chipThreshold
38
39
  const target = remountSyncTarget.value
39
40
  if (Math.abs(y - target) < REMOUNT_SYNC_TOLERANCE) {
40
41
  remountSyncTarget.value = null
41
- if (onRemountSynced) runOnJS(callWorkletCallback)(remountSyncedKey, y)
42
+ if (onRemountSynced) scheduleOnRN(callWorkletCallback, remountSyncedKey, y)
42
43
  } else if (onRemountSyncRetry) {
43
- runOnJS(callWorkletCallback)(remountSyncRetryKey, y)
44
+ scheduleOnRN(callWorkletCallback, remountSyncRetryKey, y)
44
45
  }
45
46
  return
46
47
  }
@@ -1,7 +1,8 @@
1
1
  import { callWorkletCallback, useWorkletCallback } from '@rific/core'
2
2
  import { useCallback, useContext, useLayoutEffect, useRef, useState } from 'react'
3
- import { runOnJS, useAnimatedReaction, useAnimatedStyle, useSharedValue } from 'react-native-reanimated'
3
+ import { useAnimatedReaction, useAnimatedStyle, useSharedValue } from 'react-native-reanimated'
4
4
  import { useSafeAreaInsets } from 'react-native-safe-area-context'
5
+ import { scheduleOnRN } from 'react-native-worklets'
5
6
 
6
7
  import { ScrollViewContext } from '../ScrollViewContext'
7
8
 
@@ -62,7 +63,7 @@ export function useStickyHeaders(headerFixed: boolean, enabled: boolean): Sticky
62
63
  return active
63
64
  },
64
65
  (curr, prev) => {
65
- if (curr !== prev) runOnJS(callWorkletCallback)(activeIndexKey, curr)
66
+ if (curr !== prev) scheduleOnRN(callWorkletCallback, activeIndexKey, curr)
66
67
  },
67
68
  // Same web-only reanimated gap as useAnimatedStyle elsewhere in this file: this "prepare"
68
69
  // function's own SharedValue reads (sectionYPositions, headerHeightShared, scrollPosition,
@@ -2,7 +2,7 @@ import { callWorkletCallback, useWorkletCallback } from '@rific/core'
2
2
  import { useState } from 'react'
3
3
  import { Platform } from 'react-native'
4
4
  import { useKeyboardHandler } from 'react-native-keyboard-controller'
5
- import { runOnJS } from 'react-native-reanimated'
5
+ import { scheduleOnRN } from 'react-native-worklets'
6
6
 
7
7
  const useKeyboardInsetNative = () => {
8
8
  const [keyboardHeight, setKeyboardHeight] = useState(0)
@@ -11,11 +11,11 @@ const useKeyboardInsetNative = () => {
11
11
  {
12
12
  onMove: (e) => {
13
13
  'worklet'
14
- runOnJS(callWorkletCallback)(keyboardHeightKey, e.height)
14
+ scheduleOnRN(callWorkletCallback, keyboardHeightKey, e.height)
15
15
  },
16
16
  onEnd: (e) => {
17
17
  'worklet'
18
- runOnJS(callWorkletCallback)(keyboardHeightKey, e.height)
18
+ scheduleOnRN(callWorkletCallback, keyboardHeightKey, e.height)
19
19
  }
20
20
  },
21
21
  []