@legendapp/list 2.1.0-beta.11 → 2.1.0-beta.13

package/index.native.js

@@ -832,7 +832,7 @@ var ListComponent = typedMemo(function ListComponent2({
   scrollAdjustHandler,
   onLayoutHeader,
   snapToIndices,
-  stickyIndices,
+  stickyHeaderIndices,
   ...rest
 }) {
   const ctx = useStateContext();
@@ -867,7 +867,7 @@ var ListComponent = typedMemo(function ListComponent2({
       ScrollComponent: snapToIndices ? ScrollComponent : void 0,
       style
     },
-    maintainVisibleContentPosition && /* @__PURE__ */ React2__namespace.createElement(ScrollAdjust, null),
+    /* @__PURE__ */ React2__namespace.createElement(ScrollAdjust, null),
     ENABLE_DEVMODE ? /* @__PURE__ */ React2__namespace.createElement(PaddingDevMode, null) : /* @__PURE__ */ React2__namespace.createElement(Padding, null),
     ListHeaderComponent && /* @__PURE__ */ React2__namespace.createElement(LayoutView, { onLayoutChange: onLayoutHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
     ListEmptyComponent && getComponent(ListEmptyComponent),
@@ -1060,6 +1060,70 @@ function calculateOffsetWithOffsetPosition(ctx, state, offsetParam, params) {
   return offset;
 }
 
+// src/core/finishScrollTo.ts
+function finishScrollTo(ctx, state) {
+  var _a3, _b;
+  if (state) {
+    state.scrollHistory.length = 0;
+    state.initialScroll = void 0;
+    state.initialAnchor = void 0;
+    set$(ctx, "scrollingTo", void 0);
+    if (state.pendingTotalSize !== void 0) {
+      addTotalSize(ctx, state, null, state.pendingTotalSize);
+    }
+    if ((_a3 = state.props) == null ? void 0 : _a3.data) {
+      (_b = state.triggerCalculateItemsInView) == null ? void 0 : _b.call(state, { forceFullItemPositions: true });
+    }
+  }
+}
+var Platform2 = reactNative.Platform;
+
+// src/core/scrollTo.ts
+function scrollTo(ctx, state, params) {
+  var _a3;
+  const { noScrollingTo, ...scrollTarget } = params;
+  const { animated, isInitialScroll, offset: scrollTargetOffset, precomputedWithViewOffset } = scrollTarget;
+  const {
+    refScroller,
+    props: { horizontal }
+  } = state;
+  let offset = precomputedWithViewOffset ? scrollTargetOffset : calculateOffsetWithOffsetPosition(ctx, state, scrollTargetOffset, scrollTarget);
+  if (Number.isFinite(state.scrollLength) && Number.isFinite(state.totalSize)) {
+    const maxOffset = Math.max(0, getContentSize(ctx) - state.scrollLength);
+    offset = Math.min(offset, maxOffset);
+  }
+  state.scrollHistory.length = 0;
+  if (!noScrollingTo) {
+    set$(ctx, "scrollingTo", scrollTarget);
+  }
+  state.scrollPending = offset;
+  if (!isInitialScroll || Platform2.OS === "android") {
+    (_a3 = refScroller.current) == null ? void 0 : _a3.scrollTo({
+      animated: !!animated,
+      x: horizontal ? offset : 0,
+      y: horizontal ? 0 : offset
+    });
+  }
+  if (!animated) {
+    state.scroll = offset;
+    if (Platform2.OS === "web") {
+      const unlisten = listen$(ctx, "containersDidLayout", (value) => {
+        if (value && peek$(ctx, "scrollingTo")) {
+          finishScrollTo(ctx, state);
+          unlisten();
+        }
+      });
+    } else {
+      setTimeout(() => finishScrollTo(ctx, state), 100);
+    }
+    if (isInitialScroll) {
+      setTimeout(() => {
+        state.initialScroll = void 0;
+      }, 500);
+    }
+  }
+}
+
 // src/utils/checkThreshold.ts
 var HYSTERESIS_MULTIPLIER = 1.3;
 var checkThreshold = (distance, atThreshold, threshold, wasReached, snapshot, context, onReached, setSnapshot) => {
@@ -1170,24 +1234,7 @@ function checkAtTop(state) {
   );
 }
 
-// src/core/onScroll.ts
-function onScroll(ctx, state, event) {
-  var _a3, _b, _c;
-  const {
-    scrollProcessingEnabled,
-    props: { onScroll: onScrollProp }
-  } = state;
-  if (scrollProcessingEnabled === false) {
-    return;
-  }
-  if (((_b = (_a3 = event.nativeEvent) == null ? void 0 : _a3.contentSize) == null ? void 0 : _b.height) === 0 && ((_c = event.nativeEvent.contentSize) == null ? void 0 : _c.width) === 0) {
-    return;
-  }
-  const newScroll = event.nativeEvent.contentOffset[state.props.horizontal ? "x" : "y"];
-  state.scrollPending = newScroll;
-  updateScroll(ctx, state, newScroll);
-  onScrollProp == null ? void 0 : onScrollProp(event);
-}
+// src/core/updateScroll.ts
 function updateScroll(ctx, state, newScroll, forceUpdate) {
   var _a3;
   const scrollingTo = peek$(ctx, "scrollingTo");
@@ -1230,61 +1277,6 @@ function updateScroll(ctx, state, newScroll, forceUpdate) {
   }
 }
 
-// src/core/finishScrollTo.ts
-function finishScrollTo(ctx, state) {
-  var _a3, _b;
-  if (state) {
-    state.scrollHistory.length = 0;
-    state.initialScroll = void 0;
-    state.initialAnchor = void 0;
-    set$(ctx, "scrollingTo", void 0);
-    if (state.pendingTotalSize !== void 0) {
-      addTotalSize(ctx, state, null, state.pendingTotalSize);
-    }
-    if ((_a3 = state.props) == null ? void 0 : _a3.data) {
-      (_b = state.triggerCalculateItemsInView) == null ? void 0 : _b.call(state, { forceFullItemPositions: true });
-    }
-  }
-}
-var Platform2 = reactNative.Platform;
-
-// src/core/scrollTo.ts
-function scrollTo(ctx, state, params) {
-  var _a3;
-  const { noScrollingTo, ...scrollTarget } = params;
-  const { animated, isInitialScroll, offset: scrollTargetOffset, precomputedWithViewOffset } = scrollTarget;
-  const {
-    refScroller,
-    props: { horizontal }
-  } = state;
-  let offset = precomputedWithViewOffset ? scrollTargetOffset : calculateOffsetWithOffsetPosition(ctx, state, scrollTargetOffset, scrollTarget);
-  if (Number.isFinite(state.scrollLength) && Number.isFinite(state.totalSize)) {
-    const maxOffset = Math.max(0, getContentSize(ctx) - state.scrollLength);
-    offset = Math.min(offset, maxOffset);
-  }
-  state.scrollHistory.length = 0;
-  if (!noScrollingTo) {
-    set$(ctx, "scrollingTo", scrollTarget);
-  }
-  state.scrollPending = offset;
-  if (!isInitialScroll || Platform2.OS === "android") {
-    (_a3 = refScroller.current) == null ? void 0 : _a3.scrollTo({
-      animated: !!animated,
-      x: horizontal ? offset : 0,
-      y: horizontal ? 0 : offset
-    });
-  }
-  if (!animated) {
-    state.scroll = offset;
-    setTimeout(() => finishScrollTo(ctx, state), 100);
-    if (isInitialScroll) {
-      setTimeout(() => {
-        state.initialScroll = void 0;
-      }, 500);
-    }
-  }
-}
-
 // src/utils/requestAdjust.ts
 function requestAdjust(ctx, state, positionDiff, dataChanged) {
   if (Math.abs(positionDiff) > 0.1) {
@@ -1297,6 +1289,9 @@ function requestAdjust(ctx, state, positionDiff, dataChanged) {
         });
       } else {
         state.scrollAdjustHandler.requestAdjust(positionDiff);
+        if (state.adjustingFromInitialMount) {
+          state.adjustingFromInitialMount--;
+        }
       }
     };
     state.scroll += positionDiff;
@@ -1329,6 +1324,7 @@ function requestAdjust(ctx, state, positionDiff, dataChanged) {
         }, delay);
       }
     } else {
+      state.adjustingFromInitialMount = (state.adjustingFromInitialMount || 0) + 1;
       requestAnimationFrame(doit);
     }
   }
@@ -1388,18 +1384,16 @@ function ensureInitialAnchor(ctx, state) {
 
 // src/core/mvcp.ts
 function prepareMVCP(ctx, state, dataChanged) {
-  const {
-    idsInView,
-    positions,
-    props: { maintainVisibleContentPosition }
-  } = state;
+  const { idsInView, positions, props } = state;
+  const { maintainVisibleContentPosition } = props;
   const scrollingTo = peek$(ctx, "scrollingTo");
   let prevPosition;
   let targetId;
   const idsInViewWithPositions = [];
   const scrollTarget = scrollingTo == null ? void 0 : scrollingTo.index;
-  if (maintainVisibleContentPosition) {
-    const indexByKey = state.indexByKey;
+  const shouldMVCP = !dataChanged || maintainVisibleContentPosition;
+  const indexByKey = state.indexByKey;
+  if (shouldMVCP) {
     if (scrollTarget !== void 0) {
       if (!IsNewArchitecture && (scrollingTo == null ? void 0 : scrollingTo.isInitialScroll)) {
         return void 0;
@@ -1415,44 +1409,44 @@ function prepareMVCP(ctx, state, dataChanged) {
           }
         }
       } else {
-        targetId = state.idsInView.find((id) => indexByKey.get(id) !== void 0);
+        targetId = idsInView.find((id) => indexByKey.get(id) !== void 0);
       }
     }
     if (targetId !== void 0) {
       prevPosition = positions.get(targetId);
     }
-  }
-  return () => {
-    let positionDiff;
-    if (dataChanged && targetId === void 0) {
-      for (let i = 0; i < idsInViewWithPositions.length; i++) {
-        const { id, position } = idsInViewWithPositions[i];
-        const newPosition = positions.get(id);
-        if (newPosition !== void 0) {
-          positionDiff = newPosition - position;
-          break;
+    return () => {
+      let positionDiff;
+      if (dataChanged && targetId === void 0 && maintainVisibleContentPosition) {
+        for (let i = 0; i < idsInViewWithPositions.length; i++) {
+          const { id, position } = idsInViewWithPositions[i];
+          const newPosition = positions.get(id);
+          if (newPosition !== void 0) {
+            positionDiff = newPosition - position;
+            break;
+          }
         }
       }
-    }
-    if (targetId !== void 0 && prevPosition !== void 0) {
-      const newPosition = positions.get(targetId);
-      if (newPosition !== void 0) {
-        const totalSize = getContentSize(ctx);
-        let diff = newPosition - prevPosition;
-        if (diff !== 0 && state.scroll + state.scrollLength > totalSize) {
-          if (diff > 0) {
-            diff = Math.max(0, totalSize - state.scroll - state.scrollLength);
-          } else {
-            diff = 0;
+      if (targetId !== void 0 && prevPosition !== void 0) {
+        const newPosition = positions.get(targetId);
+        if (newPosition !== void 0) {
+          const totalSize = getContentSize(ctx);
+          let diff = newPosition - prevPosition;
+          if (diff !== 0 && state.scroll + state.scrollLength > totalSize) {
+            if (diff > 0) {
+              diff = Math.max(0, totalSize - state.scroll - state.scrollLength);
+            } else {
+              diff = 0;
+            }
           }
+          positionDiff = diff;
         }
-        positionDiff = diff;
       }
-    }
-    if (positionDiff !== void 0 && Math.abs(positionDiff) > 0.1) {
-      requestAdjust(ctx, state, positionDiff, dataChanged);
-    }
-  };
+      if (positionDiff !== void 0 && Math.abs(positionDiff) > 0.1) {
+        requestAdjust(ctx, state, positionDiff, dataChanged && maintainVisibleContentPosition);
+      }
+    };
+  }
 }
 
 // src/core/prepareColumnStartState.ts
@@ -1594,7 +1588,8 @@ function updateSnapToOffsets(ctx, state) {
 }
 
 // src/core/updateItemPositions.ts
-function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottomBuffered, forceFullUpdate = false } = {
+function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottomBuffered, forceFullUpdate = false, doMVCP } = {
+  doMVCP: false,
   forceFullUpdate: false,
   scrollBottomBuffered: -1,
   startIndex: 0
@@ -1606,7 +1601,7 @@ function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottom
     positions,
     idCache,
     sizesKnown,
-    props: { getEstimatedItemSize, snapToIndices, enableAverages, maintainVisibleContentPosition }
+    props: { getEstimatedItemSize, snapToIndices, enableAverages }
   } = state;
   const data = state.props.data;
   const dataLength = data.length;
@@ -1617,7 +1612,7 @@ function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottom
   const shouldOptimize = !forceFullUpdate && !dataChanged && Math.abs(getScrollVelocity(state)) > 0;
   const maxVisibleArea = scrollBottomBuffered + 1e3;
   const useAverageSize = enableAverages && !getEstimatedItemSize;
-  const preferCachedSize = maintainVisibleContentPosition && (dataChanged || state.scrollAdjustHandler.getAdjust() !== 0 || ((_a3 = peek$(ctx, "scrollAdjustPending")) != null ? _a3 : 0) !== 0);
+  const preferCachedSize = !doMVCP || dataChanged || state.scrollAdjustHandler.getAdjust() !== 0 || ((_a3 = peek$(ctx, "scrollAdjustPending")) != null ? _a3 : 0) !== 0;
   let currentRowTop = 0;
   let column = 1;
   let maxSizeInRow = 0;
@@ -2083,14 +2078,14 @@ function findCurrentStickyIndex(stickyArray, scroll, state) {
   }
   return -1;
 }
-function getActiveStickyIndices(ctx, state, stickyIndices) {
+function getActiveStickyIndices(ctx, state, stickyHeaderIndices) {
   return new Set(
-    Array.from(state.stickyContainerPool).map((i) => peek$(ctx, `containerItemKey${i}`)).map((key) => key ? state.indexByKey.get(key) : void 0).filter((idx) => idx !== void 0 && stickyIndices.has(idx))
+    Array.from(state.stickyContainerPool).map((i) => peek$(ctx, `containerItemKey${i}`)).map((key) => key ? state.indexByKey.get(key) : void 0).filter((idx) => idx !== void 0 && stickyHeaderIndices.has(idx))
   );
 }
-function handleStickyActivation(ctx, state, stickyIndices, stickyArray, currentStickyIdx, needNewContainers, startBuffered, endBuffered) {
+function handleStickyActivation(ctx, state, stickyHeaderIndices, stickyArray, currentStickyIdx, needNewContainers, startBuffered, endBuffered) {
   var _a3;
-  const activeIndices = getActiveStickyIndices(ctx, state, stickyIndices);
+  const activeIndices = getActiveStickyIndices(ctx, state, stickyHeaderIndices);
   state.activeStickyIndex = currentStickyIdx >= 0 ? stickyArray[currentStickyIdx] : void 0;
   for (let offset = 0; offset <= 1; offset++) {
     const idx = currentStickyIdx - offset;
@@ -2226,6 +2221,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     }
     const startIndex = dataChanged ? 0 : (_b = minIndexSizeChanged != null ? minIndexSizeChanged : state.startBuffered) != null ? _b : 0;
     updateItemPositions(ctx, state, dataChanged, {
+      doMVCP,
       forceFullUpdate: !!forceFullItemPositions,
       scrollBottomBuffered,
       startIndex
@@ -2520,6 +2516,7 @@ function doMaintainScrollAtEnd(ctx, state, animated) {
     });
     return true;
   }
+  return false;
 }
 
 // src/utils/updateAveragesOnDataChange.ts
@@ -2688,6 +2685,25 @@ function handleLayout(ctx, state, layout, setCanRender) {
   setCanRender(true);
 }
 
+// src/core/onScroll.ts
+function onScroll(ctx, state, event) {
+  var _a3, _b, _c;
+  const {
+    scrollProcessingEnabled,
+    props: { onScroll: onScrollProp }
+  } = state;
+  if (scrollProcessingEnabled === false) {
+    return;
+  }
+  if (((_b = (_a3 = event.nativeEvent) == null ? void 0 : _a3.contentSize) == null ? void 0 : _b.height) === 0 && ((_c = event.nativeEvent.contentSize) == null ? void 0 : _c.width) === 0) {
+    return;
+  }
+  const newScroll = event.nativeEvent.contentOffset[state.props.horizontal ? "x" : "y"];
+  state.scrollPending = newScroll;
+  updateScroll(ctx, state, newScroll);
+  onScrollProp == null ? void 0 : onScrollProp(event);
+}
+
 // src/core/ScrollAdjustHandler.ts
 var ScrollAdjustHandler = class {
   constructor(ctx) {
@@ -2723,12 +2739,7 @@ var ScrollAdjustHandler = class {
       set$(this.context, "scrollAdjustPending", this.pendingAdjust);
     } else {
       this.appliedAdjust += add;
-      const setter = () => set$(this.context, "scrollAdjust", this.appliedAdjust);
-      if (this.mounted) {
-        setter();
-      } else {
-        requestAnimationFrame(setter);
-      }
+      set$(this.context, "scrollAdjust", this.appliedAdjust);
     }
   }
   setMounted() {
@@ -2890,9 +2901,9 @@ function getWindowSize() {
   };
 }
 var StyleSheet = reactNative.StyleSheet;
-function useStickyScrollHandler(stickyIndices, horizontal, ctx, onScroll2) {
+function useStickyScrollHandler(stickyHeaderIndices, horizontal, ctx, onScroll2) {
   return React2.useMemo(() => {
-    if (stickyIndices == null ? void 0 : stickyIndices.length) {
+    if (stickyHeaderIndices == null ? void 0 : stickyHeaderIndices.length) {
       const { animatedScrollY } = ctx;
       return reactNative.Animated.event(
         [
@@ -2909,7 +2920,7 @@ function useStickyScrollHandler(stickyIndices, horizontal, ctx, onScroll2) {
       );
     }
     return onScroll2;
-  }, [stickyIndices == null ? void 0 : stickyIndices.join(","), horizontal]);
+  }, [stickyHeaderIndices == null ? void 0 : stickyHeaderIndices.join(","), horizontal]);
 }
 
 // src/utils/createColumnWrapperStyle.ts
@@ -3131,7 +3142,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     ListHeaderComponent,
     maintainScrollAtEnd = false,
     maintainScrollAtEndThreshold = 0.1,
-    maintainVisibleContentPosition = true,
+    maintainVisibleContentPosition = false,
     numColumns: numColumnsProp = 1,
     onEndReached,
     onEndReachedThreshold = 0.5,
@@ -3153,7 +3164,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     renderItem,
     scrollEventThrottle,
     snapToIndices,
-    stickyIndices,
+    stickyHeaderIndices: stickyHeaderIndicesProp,
+    stickyIndices: stickyIndicesDeprecated,
     style: styleProp,
     suggestEstimatedItemSize,
     viewabilityConfig,
@@ -3175,6 +3187,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const estimatedItemSize = estimatedItemSizeProp != null ? estimatedItemSizeProp : DEFAULT_ITEM_SIZE;
   const scrollBuffer = (drawDistance != null ? drawDistance : DEFAULT_DRAW_DISTANCE) || 1;
   const keyExtractor = keyExtractorProp != null ? keyExtractorProp : (_item, index) => index.toString();
+  const stickyHeaderIndices = stickyHeaderIndicesProp != null ? stickyHeaderIndicesProp : stickyIndicesDeprecated;
+  if (IS_DEV && stickyIndicesDeprecated && !stickyHeaderIndicesProp) {
+    warnDevOnce(
+      "stickyIndices",
+      "stickyIndices has been renamed to stickyHeaderIndices. Please update your props to use stickyHeaderIndices."
+    );
+  }
   const refState = React2.useRef();
   if (!refState.current) {
     if (!ctx.internalState) {
@@ -3286,8 +3305,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     renderItem,
     scrollBuffer,
     snapToIndices,
-    stickyIndicesArr: stickyIndices != null ? stickyIndices : [],
-    stickyIndicesSet: React2.useMemo(() => new Set(stickyIndices != null ? stickyIndices : []), [stickyIndices == null ? void 0 : stickyIndices.join(",")]),
+    stickyIndicesArr: stickyHeaderIndices != null ? stickyHeaderIndices : [],
+    stickyIndicesSet: React2.useMemo(() => new Set(stickyHeaderIndices != null ? stickyHeaderIndices : []), [stickyHeaderIndices == null ? void 0 : stickyHeaderIndices.join(",")]),
     stylePaddingBottom: stylePaddingBottomState,
     stylePaddingTop: stylePaddingTopState,
     suggestEstimatedItemSize: !!suggestEstimatedItemSize
@@ -3307,7 +3326,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     setPaddingTop(ctx, state, { stylePaddingTop: stylePaddingTopState });
     refState.current.props.stylePaddingBottom = stylePaddingBottomState;
     let paddingDiff = stylePaddingTopState - prevPaddingTop;
-    if (maintainVisibleContentPosition && paddingDiff && prevPaddingTop !== void 0 && Platform2.OS === "ios") {
+    if (paddingDiff && prevPaddingTop !== void 0 && Platform2.OS === "ios") {
       if (state.scroll < 0) {
         paddingDiff += state.scroll;
       }
@@ -3355,7 +3374,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     state.initialScroll = updatedInitialScroll;
     refState.current.isStartReached = clampedOffset < refState.current.scrollLength * onStartReachedThreshold;
     return clampedOffset;
-  }, [renderNum, state.initialScroll]);
+  }, [renderNum]);
   if (isFirstLocal || didDataChangeLocal || numColumnsProp !== peek$(ctx, "numColumns")) {
     refState.current.lastBatchingAction = Date.now();
     if (!keyExtractorProp && !isFirstLocal && didDataChangeLocal) {
@@ -3395,7 +3414,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         precomputedWithViewOffset: true
       });
     }
-  }, [initialContentOffset, state.initialScroll]);
+  }, [initialContentOffset]);
   const onLayoutChange = React2.useCallback((layout) => {
     doInitialScroll();
     handleLayout(ctx, state, layout, setCanRender);
@@ -3462,7 +3481,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }),
     []
   );
-  const onScrollHandler = useStickyScrollHandler(stickyIndices, horizontal, ctx, fns.onScroll);
+  const onScrollHandler = useStickyScrollHandler(stickyHeaderIndices, horizontal, ctx, fns.onScroll);
   return /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(
     ListComponent,
     {
@@ -3508,7 +3527,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       scrollAdjustHandler: (_b = refState.current) == null ? void 0 : _b.scrollAdjustHandler,
       scrollEventThrottle: Platform2.OS === "web" ? 16 : void 0,
       snapToIndices,
-      stickyIndices,
+      stickyHeaderIndices,
       style,
       updateItemSize: fns.updateItemSize,
       waitForInitialLayout