@legendapp/list 2.1.0-beta.1 → 2.1.0-beta.10

package/index.js

@@ -54,7 +54,10 @@ function StateProvider({ children }) {
       ["stylePaddingTop", 0],
       ["headerSize", 0],
       ["numContainers", 0],
-      ["totalSize", 0]
+      ["activeStickyIndex", void 0],
+      ["totalSize", 0],
+      ["scrollAdjustPending", 0],
+      ["scrollingTo", void 0]
     ]),
     viewRefs: /* @__PURE__ */ new Map()
   }));
@@ -208,6 +211,47 @@ var ENABLE_DEBUG_VIEW = IS_DEV && false;
 var typedForwardRef = React3.forwardRef;
 var typedMemo = React3.memo;
 
+// src/utils/helpers.ts
+function isFunction(obj) {
+  return typeof obj === "function";
+}
+function isArray(obj) {
+  return Array.isArray(obj);
+}
+var warned = /* @__PURE__ */ new Set();
+function warnDevOnce(id, text) {
+  if (IS_DEV && !warned.has(id)) {
+    warned.add(id);
+    console.warn(`[legend-list] ${text}`);
+  }
+}
+function roundSize(size) {
+  return Math.floor(size * 8) / 8;
+}
+function isNullOrUndefined(value) {
+  return value === null || value === void 0;
+}
+function comparatorDefault(a, b) {
+  return a - b;
+}
+function getPadding(s, type) {
+  var _a3, _b, _c;
+  return (_c = (_b = (_a3 = s[`padding${type}`]) != null ? _a3 : s.paddingVertical) != null ? _b : s.padding) != null ? _c : 0;
+}
+function extractPadding(style, contentContainerStyle, type) {
+  return getPadding(style, type) + getPadding(contentContainerStyle, type);
+}
+function findContainerId(ctx, key) {
+  const numContainers = peek$(ctx, "numContainers");
+  for (let i = 0; i < numContainers; i++) {
+    const itemKey = peek$(ctx, `containerItemKey${i}`);
+    if (itemKey === key) {
+      return i;
+    }
+  }
+  return -1;
+}
+
 // src/components/PositionView.tsx
 var PositionViewState = typedMemo(function PositionView({
   id,
@@ -217,8 +261,11 @@ var PositionViewState = typedMemo(function PositionView({
   ...rest
 }) {
   const [position = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
-  const base = Array.isArray(style) ? Object.assign({}, ...style) : style;
-  const combinedStyle = horizontal ? { ...base, left: position } : { ...base, top: position };
+  const base = {
+    contain: "paint layout style"
+  };
+  const composed = isArray(style) ? Object.assign({}, ...style) : style;
+  const combinedStyle = horizontal ? { ...base, ...composed, left: position } : { ...base, ...composed, top: position };
   return /* @__PURE__ */ React3__namespace.createElement("div", { ref: refView, style: combinedStyle, ...rest });
 });
 var PositionViewSticky = typedMemo(function PositionViewSticky2({
@@ -227,19 +274,42 @@ var PositionViewSticky = typedMemo(function PositionViewSticky2({
   style,
   refView,
   index,
+  stickyOffset,
+  animatedScrollY: _animatedScrollY,
+  children,
   ...rest
 }) {
-  const [position = POSITION_OUT_OF_VIEW, _headerSize] = useArr$([`containerPosition${id}`, "headerSize"]);
+  const [position = POSITION_OUT_OF_VIEW, headerSize = 0, activeStickyIndex] = useArr$([
+    `containerPosition${id}`,
+    "headerSize",
+    "activeStickyIndex"
+  ]);
+  const base = {
+    contain: "paint layout style"
+  };
+  const composed = React3__namespace.useMemo(
+    () => {
+      var _a3;
+      return (_a3 = isArray(style) ? Object.assign({}, ...style) : style) != null ? _a3 : {};
+    },
+    [style]
+  );
   const viewStyle = React3__namespace.useMemo(() => {
-    const base = Array.isArray(style) ? Object.assign({}, ...style) : style;
-    const axisStyle = horizontal ? { transform: `translateX(${position}px)` } : { top: position };
-    return {
-      ...base,
-      zIndex: index + 1e3,
-      ...axisStyle
-    };
-  }, [style, position, horizontal, index]);
-  return /* @__PURE__ */ React3__namespace.createElement("div", { ref: refView, style: viewStyle, ...rest });
+    var _a3;
+    const styleBase = { ...base, ...composed };
+    delete styleBase.transform;
+    const offset = (_a3 = stickyOffset != null ? stickyOffset : headerSize) != null ? _a3 : 0;
+    const isActive = activeStickyIndex === index;
+    styleBase.position = isActive ? "sticky" : "absolute";
+    styleBase.zIndex = index + 1e3;
+    if (horizontal) {
+      styleBase.left = isActive ? offset : position;
+    } else {
+      styleBase.top = isActive ? offset : position;
+    }
+    return styleBase;
+  }, [composed, horizontal, position, index, stickyOffset, headerSize, activeStickyIndex]);
+  return /* @__PURE__ */ React3__namespace.createElement("div", { ref: refView, style: viewStyle, ...rest }, children);
 });
 var PositionView2 = PositionViewState;
 
@@ -254,37 +324,6 @@ function useInit(cb) {
   return refValue.current;
 }
 
-// src/utils/helpers.ts
-function isFunction(obj) {
-  return typeof obj === "function";
-}
-function isArray(obj) {
-  return Array.isArray(obj);
-}
-var warned = /* @__PURE__ */ new Set();
-function warnDevOnce(id, text) {
-  if (IS_DEV && !warned.has(id)) {
-    warned.add(id);
-    console.warn(`[legend-list] ${text}`);
-  }
-}
-function roundSize(size) {
-  return Math.floor(size * 8) / 8;
-}
-function isNullOrUndefined(value) {
-  return value === null || value === void 0;
-}
-function comparatorDefault(a, b) {
-  return a - b;
-}
-function getPadding(s, type) {
-  var _a3, _b, _c;
-  return (_c = (_b = (_a3 = s[`padding${type}`]) != null ? _a3 : s.paddingVertical) != null ? _b : s.padding) != null ? _c : 0;
-}
-function extractPadding(style, contentContainerStyle, type) {
-  return getPadding(style, type) + getPadding(contentContainerStyle, type);
-}
-
 // src/state/ContextContainer.ts
 var ContextContainer = React3.createContext(null);
 function useViewability(callback, configId) {
@@ -413,6 +452,10 @@ function getGlobalResizeObserver() {
 }
 var callbackMap = /* @__PURE__ */ new WeakMap();
 function createResizeObserver(element, callback) {
+  if (typeof ResizeObserver === "undefined") {
+    return () => {
+    };
+  }
   if (!element) {
     return () => {
     };
@@ -448,7 +491,7 @@ function useOnLayoutSync({
     const current = ref.current;
     const scrollableNode = (_b = (_a3 = current == null ? void 0 : current.getScrollableNode) == null ? void 0 : _a3.call(current)) != null ? _b : null;
     const element = scrollableNode || current;
-    if (!element || !(element instanceof HTMLElement)) {
+    if (!element) {
       return;
     }
     const emit = (layout, fromLayoutEffect) => {
@@ -470,6 +513,9 @@ function useOnLayoutSync({
   return {};
 }
 function toLayout(rect) {
+  if (!rect) {
+    return { height: 0, width: 0, x: 0, y: 0 };
+  }
   return {
     height: rect.height,
     width: rect.width,
@@ -571,7 +617,7 @@ var Container = typedMemo(function Container2({
     }
     didLayoutRef.current = true;
     let layout = rectangle;
-    Math.floor(rectangle[currentHorizontal ? "width" : "height"] * 8) / 8;
+    roundSize(rectangle[currentHorizontal ? "width" : "height"]);
     const doUpdate = () => {
       itemLayoutRef.current.lastSize = { height: layout.height, width: layout.width };
       updateItemSizeFn(currentItemKey, layout);
@@ -729,7 +775,7 @@ var ContainersInner = typedMemo(function ContainersInner2({ horizontal, numColum
   const columnWrapperStyle = ctx.columnWrapperStyle;
   const [totalSize, otherAxisSize] = useArr$(["totalSize", "otherAxisSize"]);
   useDOMOrder(ref);
-  const style = horizontal ? { minHeight: otherAxisSize, width: totalSize } : { height: totalSize, minWidth: otherAxisSize };
+  const style = horizontal ? { minHeight: otherAxisSize, position: "relative", width: totalSize } : { height: totalSize, minWidth: otherAxisSize, position: "relative" };
   if (columnWrapperStyle && numColumns > 1) {
     const { columnGap, rowGap, gap } = columnWrapperStyle;
     const gapX = columnGap || gap || 0;
@@ -801,7 +847,7 @@ function DevNumbers() {
 
 // src/platform/StyleSheet.tsx
 function flattenStyles(styles) {
-  if (Array.isArray(styles)) {
+  if (isArray(styles)) {
     return Object.assign({}, ...styles.filter(Boolean));
   }
   return styles;
@@ -991,10 +1037,11 @@ function PaddingDevMode() {
 function useValueListener$(key, callback) {
   const ctx = useStateContext();
   React3.useLayoutEffect(() => {
-    listen$(ctx, key, (value) => {
+    const unsubscribe = listen$(ctx, key, (value) => {
       callback(value);
     });
-  }, []);
+    return unsubscribe;
+  }, [callback, ctx, key]);
 }
 
 // src/components/ScrollAdjust.tsx
@@ -1159,13 +1206,100 @@ function calculateOffsetForIndex(ctx, state, index) {
   return position;
 }
 
+// src/utils/setPaddingTop.ts
+function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
+  if (stylePaddingTop !== void 0) {
+    const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
+    if (stylePaddingTop < prevStylePaddingTop) {
+      let prevTotalSize = peek$(ctx, "totalSize") || 0;
+      set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
+      state.timeoutSetPaddingTop = setTimeout(() => {
+        prevTotalSize = peek$(ctx, "totalSize") || 0;
+        set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
+      }, 16);
+    }
+    set$(ctx, "stylePaddingTop", stylePaddingTop);
+  }
+  if (alignItemsPaddingTop !== void 0) {
+    set$(ctx, "alignItemsPaddingTop", alignItemsPaddingTop);
+  }
+}
+
+// src/utils/updateAlignItemsPaddingTop.ts
+function updateAlignItemsPaddingTop(ctx, state) {
+  const {
+    scrollLength,
+    props: { alignItemsAtEnd, data }
+  } = state;
+  if (alignItemsAtEnd) {
+    let alignItemsPaddingTop = 0;
+    if ((data == null ? void 0 : data.length) > 0) {
+      const contentSize = getContentSize(ctx);
+      alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
+    }
+    setPaddingTop(ctx, state, { alignItemsPaddingTop });
+  }
+}
+
+// src/core/updateTotalSize.ts
+function updateTotalSize(ctx, state) {
+  const {
+    positions,
+    props: { data }
+  } = state;
+  if (data.length === 0) {
+    addTotalSize(ctx, state, null, 0);
+  } else {
+    const lastId = getId(state, data.length - 1);
+    if (lastId !== void 0) {
+      const lastPosition = positions.get(lastId);
+      if (lastPosition !== void 0) {
+        const lastSize = getItemSize(ctx, state, lastId, data.length - 1, data[data.length - 1]);
+        if (lastSize !== void 0) {
+          const totalSize = lastPosition + lastSize;
+          addTotalSize(ctx, state, null, totalSize);
+        }
+      }
+    }
+  }
+}
+function addTotalSize(ctx, state, key, add) {
+  const { alignItemsAtEnd } = state.props;
+  const prevTotalSize = state.totalSize;
+  if (key === null) {
+    state.totalSize = add;
+    if (state.timeoutSetPaddingTop) {
+      clearTimeout(state.timeoutSetPaddingTop);
+      state.timeoutSetPaddingTop = void 0;
+    }
+  } else {
+    state.totalSize += add;
+  }
+  if (prevTotalSize !== state.totalSize) {
+    set$(ctx, "totalSize", state.totalSize);
+    if (alignItemsAtEnd) {
+      updateAlignItemsPaddingTop(ctx, state);
+    }
+  }
+}
+
+// src/core/setSize.ts
+function setSize(ctx, state, itemKey, size) {
+  const { sizes } = state;
+  const previousSize = sizes.get(itemKey);
+  const diff = previousSize !== void 0 ? size - previousSize : size;
+  if (diff !== 0) {
+    addTotalSize(ctx, state, itemKey, diff);
+  }
+  sizes.set(itemKey, size);
+}
+
 // src/utils/getItemSize.ts
-function getItemSize(state, key, index, data, useAverageSize) {
+function getItemSize(ctx, state, key, index, data, useAverageSize, preferCachedSize) {
   var _a3, _b;
   const {
     sizesKnown,
     sizes,
-    scrollingTo,
     averageSizes,
     props: { estimatedItemSize, getEstimatedItemSize, getFixedItemSize, getItemType }
   } = state;
@@ -1175,6 +1309,13 @@ function getItemSize(state, key, index, data, useAverageSize) {
   }
   let size;
   const itemType = getItemType ? (_a3 = getItemType(data, index)) != null ? _a3 : "" : "";
+  const scrollingTo = peek$(ctx, "scrollingTo");
+  if (preferCachedSize) {
+    const cachedSize = sizes.get(key);
+    if (cachedSize !== void 0) {
+      return cachedSize;
+    }
+  }
   if (getFixedItemSize) {
     size = getFixedItemSize(index, data, itemType);
     if (size !== void 0) {
@@ -1196,56 +1337,235 @@ function getItemSize(state, key, index, data, useAverageSize) {
   if (size === void 0) {
     size = getEstimatedItemSize ? getEstimatedItemSize(index, data, itemType) : estimatedItemSize;
   }
-  sizes.set(key, size);
+  setSize(ctx, state, key, size);
   return size;
 }
 
 // src/core/calculateOffsetWithOffsetPosition.ts
-function calculateOffsetWithOffsetPosition(state, offsetParam, params) {
+function calculateOffsetWithOffsetPosition(ctx, state, offsetParam, params) {
   const { index, viewOffset, viewPosition } = params;
   let offset = offsetParam;
   if (viewOffset) {
     offset -= viewOffset;
   }
   if (viewPosition !== void 0 && index !== void 0) {
-    offset -= viewPosition * (state.scrollLength - getItemSize(state, getId(state, index), index, state.props.data[index]));
+    offset -= viewPosition * (state.scrollLength - getItemSize(ctx, state, getId(state, index), index, state.props.data[index]));
   }
   return offset;
 }
 
-// src/core/finishScrollTo.ts
-var finishScrollTo = (state) => {
-  if (state) {
-    state.scrollingTo = void 0;
-    state.scrollHistory.length = 0;
+// src/utils/checkThreshold.ts
+var HYSTERESIS_MULTIPLIER = 1.3;
+var checkThreshold = (distance, atThreshold, threshold, wasReached, snapshot, context, onReached, setSnapshot) => {
+  const absDistance = Math.abs(distance);
+  const within = atThreshold || threshold > 0 && absDistance <= threshold;
+  const updateSnapshot = () => {
+    setSnapshot == null ? void 0 : setSnapshot({
+      atThreshold,
+      contentSize: context.contentSize,
+      dataLength: context.dataLength,
+      scrollPosition: context.scrollPosition
+    });
+  };
+  if (!wasReached) {
+    if (!within) {
+      return false;
+    }
+    onReached == null ? void 0 : onReached(distance);
+    updateSnapshot();
+    return true;
+  }
+  const reset = !atThreshold && threshold > 0 && absDistance >= threshold * HYSTERESIS_MULTIPLIER || !atThreshold && threshold <= 0 && absDistance > 0;
+  if (reset) {
+    setSnapshot == null ? void 0 : setSnapshot(void 0);
+    return false;
+  }
+  if (within) {
+    const changed = !snapshot || snapshot.atThreshold !== atThreshold || snapshot.contentSize !== context.contentSize || snapshot.dataLength !== context.dataLength;
+    if (changed) {
+      onReached == null ? void 0 : onReached(distance);
+      updateSnapshot();
+    }
   }
+  return true;
 };
 
-// src/core/scrollTo.ts
-function scrollTo(state, params = {}) {
+// src/utils/checkAtBottom.ts
+function checkAtBottom(ctx, state) {
   var _a3;
-  const { animated, noScrollingTo, isInitialScroll } = params;
+  if (!state) {
+    return;
+  }
   const {
-    refScroller,
-    props: { horizontal }
+    queuedInitialLayout,
+    scrollLength,
+    scroll,
+    maintainingScrollAtEnd,
+    props: { maintainScrollAtEndThreshold, onEndReachedThreshold }
   } = state;
-  const offset = calculateOffsetWithOffsetPosition(state, params.offset, params);
-  state.scrollHistory.length = 0;
-  if (!noScrollingTo) {
-    state.scrollingTo = params;
-  }
-  state.scrollPending = offset;
-  if (!params.isInitialScroll || Platform.OS === "android") {
-    (_a3 = refScroller.current) == null ? void 0 : _a3.scrollTo({
-      animated: !!animated,
-      x: horizontal ? offset : 0,
-      y: horizontal ? 0 : offset
-    });
+  const contentSize = getContentSize(ctx);
+  if (contentSize > 0 && queuedInitialLayout && !maintainingScrollAtEnd) {
+    const distanceFromEnd = contentSize - scroll - scrollLength;
+    const isContentLess = contentSize < scrollLength;
+    state.isAtEnd = isContentLess || distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
+    state.isEndReached = checkThreshold(
+      distanceFromEnd,
+      isContentLess,
+      onEndReachedThreshold * scrollLength,
+      state.isEndReached,
+      state.endReachedSnapshot,
+      {
+        contentSize,
+        dataLength: (_a3 = state.props.data) == null ? void 0 : _a3.length,
+        scrollPosition: scroll
+      },
+      (distance) => {
+        var _a4, _b;
+        return (_b = (_a4 = state.props).onEndReached) == null ? void 0 : _b.call(_a4, { distanceFromEnd: distance });
+      },
+      (snapshot) => {
+        state.endReachedSnapshot = snapshot;
+      }
+    );
   }
-  if (!animated) {
-    state.scroll = offset;
-    setTimeout(() => finishScrollTo(state), 100);
-    if (isInitialScroll) {
+}
+
+// src/utils/checkAtTop.ts
+function checkAtTop(state) {
+  var _a3;
+  if (!state) {
+    return;
+  }
+  const {
+    scrollLength,
+    scroll,
+    props: { onStartReachedThreshold }
+  } = state;
+  const distanceFromTop = scroll;
+  state.isAtStart = distanceFromTop <= 0;
+  state.isStartReached = checkThreshold(
+    distanceFromTop,
+    false,
+    onStartReachedThreshold * scrollLength,
+    state.isStartReached,
+    state.startReachedSnapshot,
+    {
+      contentSize: state.totalSize,
+      dataLength: (_a3 = state.props.data) == null ? void 0 : _a3.length,
+      scrollPosition: scroll
+    },
+    (distance) => {
+      var _a4, _b;
+      return (_b = (_a4 = state.props).onStartReached) == null ? void 0 : _b.call(_a4, { distanceFromStart: distance });
+    },
+    (snapshot) => {
+      state.startReachedSnapshot = snapshot;
+    }
+  );
+}
+
+// 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);
+}
+function updateScroll(ctx, state, newScroll, forceUpdate) {
+  const scrollingTo = peek$(ctx, "scrollingTo");
+  state.hasScrolled = true;
+  state.lastBatchingAction = Date.now();
+  const currentTime = Date.now();
+  const adjust = state.scrollAdjustHandler.getAdjust();
+  const lastHistoryAdjust = state.lastScrollAdjustForHistory;
+  const adjustChanged = lastHistoryAdjust !== void 0 && Math.abs(adjust - lastHistoryAdjust) > 0.1;
+  if (adjustChanged) {
+    state.scrollHistory.length = 0;
+  }
+  state.lastScrollAdjustForHistory = adjust;
+  if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === state.scroll)) {
+    if (!adjustChanged) {
+      state.scrollHistory.push({ scroll: newScroll, time: currentTime });
+    }
+  }
+  if (state.scrollHistory.length > 5) {
+    state.scrollHistory.shift();
+  }
+  state.scrollPrev = state.scroll;
+  state.scrollPrevTime = state.scrollTime;
+  state.scroll = newScroll;
+  state.scrollTime = currentTime;
+  const ignoreScrollFromMVCP = state.ignoreScrollFromMVCP;
+  if (ignoreScrollFromMVCP && !scrollingTo) {
+    const { lt, gt } = ignoreScrollFromMVCP;
+    if (lt && newScroll < lt || gt && newScroll > gt) {
+      state.ignoreScrollFromMVCPIgnored = true;
+      return;
+    }
+  }
+  if (state.dataChangeNeedsScrollUpdate || Math.abs(state.scroll - state.scrollPrev) > 2) {
+    state.ignoreScrollFromMVCPIgnored = false;
+    calculateItemsInView(ctx, state, { doMVCP: scrollingTo !== void 0 });
+    checkAtBottom(ctx, state);
+    checkAtTop(state);
+    state.dataChangeNeedsScrollUpdate = false;
+  }
+}
+
+// src/core/finishScrollTo.ts
+function finishScrollTo(ctx, state) {
+  var _a3, _b;
+  if (state) {
+    state.scrollHistory.length = 0;
+    state.initialScroll = void 0;
+    set$(ctx, "scrollingTo", void 0);
+    if ((_a3 = state.props) == null ? void 0 : _a3.data) {
+      (_b = state.triggerCalculateItemsInView) == null ? void 0 : _b.call(state, { forceFullItemPositions: true });
+    }
+  }
+}
+
+// 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 || Platform.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);
@@ -1266,24 +1586,6 @@ function requestAdjust(ctx, state, positionDiff, dataChanged) {
     const didLayout = peek$(ctx, "containersDidLayout");
     if (didLayout) {
       doit();
-      const threshold = state.scroll - positionDiff / 2;
-      if (!state.ignoreScrollFromMVCP) {
-        state.ignoreScrollFromMVCP = {};
-      }
-      if (positionDiff > 0) {
-        state.ignoreScrollFromMVCP.lt = threshold;
-      } else {
-        state.ignoreScrollFromMVCP.gt = threshold;
-      }
-      if (state.ignoreScrollFromMVCPTimeout) {
-        clearTimeout(state.ignoreScrollFromMVCPTimeout);
-      }
-      state.ignoreScrollFromMVCPTimeout = setTimeout(
-        () => {
-          state.ignoreScrollFromMVCP = void 0;
-        },
-        100
-      );
     } else {
       requestAnimationFrame(doit);
     }
@@ -1295,9 +1597,9 @@ function prepareMVCP(ctx, state, dataChanged) {
   const {
     idsInView,
     positions,
-    scrollingTo,
     props: { maintainVisibleContentPosition }
   } = state;
+  const scrollingTo = peek$(ctx, "scrollingTo");
   let prevPosition;
   let targetId;
   const idsInViewWithPositions = [];
@@ -1373,7 +1675,7 @@ function prepareColumnStartState(ctx, state, startIndex, useAverageSize) {
     const prevId = state.idCache[prevIndex];
     const prevPosition = (_a3 = state.positions.get(prevId)) != null ? _a3 : 0;
     const prevRowStart = findRowStartIndex(state, numColumns, prevIndex);
-    const prevRowHeight = calculateRowMaxSize(state, prevRowStart, prevIndex, useAverageSize);
+    const prevRowHeight = calculateRowMaxSize(ctx, state, prevRowStart, prevIndex, useAverageSize);
     currentRowTop = prevPosition + prevRowHeight;
   }
   return {
@@ -1396,7 +1698,7 @@ function findRowStartIndex(state, numColumns, index) {
   }
   return rowStart;
 }
-function calculateRowMaxSize(state, startIndex, endIndex, useAverageSize) {
+function calculateRowMaxSize(ctx, state, startIndex, endIndex, useAverageSize) {
   if (endIndex < startIndex) {
     return 0;
   }
@@ -1410,7 +1712,7 @@ function calculateRowMaxSize(state, startIndex, endIndex, useAverageSize) {
       continue;
     }
     const id = state.idCache[i];
-    const size = getItemSize(state, id, i, data[i], useAverageSize);
+    const size = getItemSize(ctx, state, id, i, data[i], useAverageSize);
     if (size > maxSize) {
       maxSize = size;
     }
@@ -1418,82 +1720,43 @@ function calculateRowMaxSize(state, startIndex, endIndex, useAverageSize) {
   return maxSize;
 }
 
-// src/utils/setPaddingTop.ts
-function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
-  if (stylePaddingTop !== void 0) {
-    const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
-    if (stylePaddingTop < prevStylePaddingTop) {
-      let prevTotalSize = peek$(ctx, "totalSize") || 0;
-      set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
-      state.timeoutSetPaddingTop = setTimeout(() => {
-        prevTotalSize = peek$(ctx, "totalSize") || 0;
-        set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
-      }, 16);
-    }
-    set$(ctx, "stylePaddingTop", stylePaddingTop);
-  }
-  if (alignItemsPaddingTop !== void 0) {
-    set$(ctx, "alignItemsPaddingTop", alignItemsPaddingTop);
-  }
-}
-
-// src/utils/updateAlignItemsPaddingTop.ts
-function updateAlignItemsPaddingTop(ctx, state) {
-  const {
-    scrollLength,
-    props: { alignItemsAtEnd, data }
-  } = state;
-  if (alignItemsAtEnd) {
-    let alignItemsPaddingTop = 0;
-    if ((data == null ? void 0 : data.length) > 0) {
-      const contentSize = getContentSize(ctx);
-      alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
-    }
-    setPaddingTop(ctx, state, { alignItemsPaddingTop });
-  }
-}
-
-// src/core/updateTotalSize.ts
-function updateTotalSize(ctx, state) {
-  const {
-    positions,
-    props: { data }
-  } = state;
-  if (data.length === 0) {
-    addTotalSize(ctx, state, null, 0);
-  } else {
-    const lastId = getId(state, data.length - 1);
-    if (lastId !== void 0) {
-      const lastPosition = positions.get(lastId);
-      if (lastPosition !== void 0) {
-        const lastSize = getItemSize(state, lastId, data.length - 1, data[data.length - 1]);
-        if (lastSize !== void 0) {
-          const totalSize = lastPosition + lastSize;
-          addTotalSize(ctx, state, null, totalSize);
+// src/utils/getScrollVelocity.ts
+var getScrollVelocity = (state) => {
+  const { scrollHistory } = state;
+  let velocity = 0;
+  if (scrollHistory.length >= 1) {
+    const newest = scrollHistory[scrollHistory.length - 1];
+    let oldest;
+    let start = 0;
+    const now = Date.now();
+    for (let i = 0; i < scrollHistory.length - 1; i++) {
+      const entry = scrollHistory[i];
+      const nextEntry = scrollHistory[i + 1];
+      if (i > 0) {
+        const prevEntry = scrollHistory[i - 1];
+        const prevDirection = entry.scroll - prevEntry.scroll;
+        const currentDirection = nextEntry.scroll - entry.scroll;
+        if (prevDirection > 0 && currentDirection < 0 || prevDirection < 0 && currentDirection > 0) {
+          start = i;
+          break;
         }
       }
     }
-  }
-}
-function addTotalSize(ctx, state, key, add) {
-  const { alignItemsAtEnd } = state.props;
-  const prevTotalSize = state.totalSize;
-  if (key === null) {
-    state.totalSize = add;
-    if (state.timeoutSetPaddingTop) {
-      clearTimeout(state.timeoutSetPaddingTop);
-      state.timeoutSetPaddingTop = void 0;
+    for (let i = start; i < scrollHistory.length - 1; i++) {
+      const entry = scrollHistory[i];
+      if (now - entry.time <= 1e3) {
+        oldest = entry;
+        break;
+      }
     }
-  } else {
-    state.totalSize += add;
-  }
-  if (prevTotalSize !== state.totalSize) {
-    set$(ctx, "totalSize", state.totalSize);
-    if (alignItemsAtEnd) {
-      updateAlignItemsPaddingTop(ctx, state);
+    if (oldest && oldest !== newest) {
+      const scrollDiff = newest.scroll - oldest.scroll;
+      const timeDiff = newest.time - oldest.time;
+      velocity = timeDiff > 0 ? scrollDiff / timeDiff : 0;
     }
   }
-}
+  return velocity;
+};
 
 // src/utils/updateSnapToOffsets.ts
 function updateSnapToOffsets(ctx, state) {
@@ -1511,23 +1774,30 @@ function updateSnapToOffsets(ctx, state) {
 }
 
 // src/core/updateItemPositions.ts
-function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottomBuffered } = { scrollBottomBuffered: -1, startIndex: 0 }) {
-  var _a3, _b, _c, _d;
+function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottomBuffered, forceFullUpdate = false } = {
+  forceFullUpdate: false,
+  scrollBottomBuffered: -1,
+  startIndex: 0
+}) {
+  var _a3, _b, _c, _d, _e;
   const {
     columns,
     indexByKey,
     positions,
     idCache,
     sizesKnown,
-    props: { getEstimatedItemSize, snapToIndices, enableAverages }
+    props: { getEstimatedItemSize, snapToIndices, enableAverages, maintainVisibleContentPosition }
   } = state;
   const data = state.props.data;
   const dataLength = data.length;
   const numColumns = peek$(ctx, "numColumns");
+  const scrollingTo = peek$(ctx, "scrollingTo");
   const hasColumns = numColumns > 1;
   const indexByKeyForChecking = IS_DEV ? /* @__PURE__ */ new Map() : void 0;
+  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);
   let currentRowTop = 0;
   let column = 1;
   let maxSizeInRow = 0;
@@ -1544,8 +1814,8 @@ function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottom
     } else if (startIndex < dataLength) {
       const prevIndex = startIndex - 1;
       const prevId = getId(state, prevIndex);
-      const prevPosition = (_a3 = positions.get(prevId)) != null ? _a3 : 0;
-      const prevSize = (_b = sizesKnown.get(prevId)) != null ? _b : getItemSize(state, prevId, prevIndex, data[prevIndex], useAverageSize);
+      const prevPosition = (_b = positions.get(prevId)) != null ? _b : 0;
+      const prevSize = (_c = sizesKnown.get(prevId)) != null ? _c : getItemSize(ctx, state, prevId, prevIndex, data[prevIndex], useAverageSize, preferCachedSize);
       currentRowTop = prevPosition + prevSize;
     }
   }
@@ -1553,16 +1823,16 @@ function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottom
   let didBreakEarly = false;
   let breakAt;
   for (let i = startIndex; i < dataLength; i++) {
-    if (breakAt && i > breakAt) {
+    if (shouldOptimize && breakAt !== void 0 && i > breakAt) {
       didBreakEarly = true;
       break;
     }
-    if (breakAt === void 0 && !dataChanged && currentRowTop > maxVisibleArea) {
+    if (shouldOptimize && breakAt === void 0 && !scrollingTo && !dataChanged && currentRowTop > maxVisibleArea) {
       const itemsPerRow = hasColumns ? numColumns : 1;
       breakAt = i + itemsPerRow + 10;
     }
-    const id = (_c = idCache[i]) != null ? _c : getId(state, i);
-    const size = (_d = sizesKnown.get(id)) != null ? _d : getItemSize(state, id, i, data[i], useAverageSize);
+    const id = (_d = idCache[i]) != null ? _d : getId(state, i);
+    const size = (_e = sizesKnown.get(id)) != null ? _e : getItemSize(ctx, state, id, i, data[i], useAverageSize, preferCachedSize);
     if (IS_DEV && needsIndexByKey) {
       if (indexByKeyForChecking.has(id)) {
         console.error(
@@ -1780,16 +2050,6 @@ function isViewable(state, ctx, viewabilityConfig, containerId, key, scrollSize,
   const value = ctx.mapViewabilityAmountValues.get(containerId) || computeViewability(state, ctx, viewabilityConfig, containerId, key, scrollSize, item, index);
   return value.isViewable;
 }
-function findContainerId(ctx, key) {
-  const numContainers = peek$(ctx, "numContainers");
-  for (let i = 0; i < numContainers; i++) {
-    const itemKey = peek$(ctx, `containerItemKey${i}`);
-    if (itemKey === key) {
-      return i;
-    }
-  }
-  return -1;
-}
 function maybeUpdateViewabilityCallback(ctx, configId, containerId, viewToken) {
   const key = containerId + configId;
   ctx.mapViewabilityValues.set(key, viewToken);
@@ -1838,7 +2098,7 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
     for (const containerIndex of stickyContainerPool) {
       const key = peek$(ctx, `containerItemKey${containerIndex}`);
       const isPendingRemoval = pendingRemovalSet.has(containerIndex);
-      if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, requiredType)) {
+      if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, requiredType) && !result.includes(containerIndex)) {
         result.push(containerIndex);
         if (isPendingRemoval && pendingRemovalSet.delete(containerIndex)) {
           pendingRemovalChanged = true;
@@ -1926,149 +2186,35 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
   if (pendingRemovalChanged) {
     pendingRemoval.length = 0;
     for (const value of pendingRemovalSet) {
-      pendingRemoval.push(value);
-    }
-  }
-  return result.sort(comparatorDefault);
-}
-function comparatorByDistance(a, b) {
-  return b.distance - a.distance;
-}
-
-// src/utils/getScrollVelocity.ts
-var getScrollVelocity = (state) => {
-  const { scrollHistory } = state;
-  let velocity = 0;
-  if (scrollHistory.length >= 1) {
-    const newest = scrollHistory[scrollHistory.length - 1];
-    let oldest;
-    let start = 0;
-    const now = Date.now();
-    for (let i = 0; i < scrollHistory.length - 1; i++) {
-      const entry = scrollHistory[i];
-      const nextEntry = scrollHistory[i + 1];
-      if (i > 0) {
-        const prevEntry = scrollHistory[i - 1];
-        const prevDirection = entry.scroll - prevEntry.scroll;
-        const currentDirection = nextEntry.scroll - entry.scroll;
-        if (prevDirection > 0 && currentDirection < 0 || prevDirection < 0 && currentDirection > 0) {
-          start = i;
-          break;
-        }
-      }
-    }
-    for (let i = start; i < scrollHistory.length - 1; i++) {
-      const entry = scrollHistory[i];
-      if (now - entry.time <= 1e3) {
-        oldest = entry;
-        break;
-      }
-    }
-    if (oldest && oldest !== newest) {
-      const scrollDiff = newest.scroll - oldest.scroll;
-      const timeDiff = newest.time - oldest.time;
-      velocity = timeDiff > 0 ? scrollDiff / timeDiff : 0;
-    }
-  }
-  return velocity;
-};
-
-// src/core/scrollToIndex.ts
-function scrollToIndex(ctx, state, { index, viewOffset = 0, animated = true, viewPosition }) {
-  if (index >= state.props.data.length) {
-    index = state.props.data.length - 1;
-  } else if (index < 0) {
-    index = 0;
-  }
-  const firstIndexOffset = calculateOffsetForIndex(ctx, state, index);
-  const isLast = index === state.props.data.length - 1;
-  if (isLast && viewPosition === void 0) {
-    viewPosition = 1;
-  }
-  state.scrollForNextCalculateItemsInView = void 0;
-  scrollTo(state, {
-    animated,
-    index,
-    offset: firstIndexOffset,
-    viewOffset,
-    viewPosition: viewPosition != null ? viewPosition : 0
-  });
-}
-
-// src/utils/checkThreshold.ts
-var HYSTERESIS_MULTIPLIER = 1.3;
-var checkThreshold = (distance, atThreshold, threshold, wasReached, snapshot, context, onReached, setSnapshot) => {
-  const absDistance = Math.abs(distance);
-  const within = atThreshold || threshold > 0 && absDistance <= threshold;
-  const updateSnapshot = () => {
-    setSnapshot == null ? void 0 : setSnapshot({
-      atThreshold,
-      contentSize: context.contentSize,
-      dataLength: context.dataLength,
-      scrollPosition: context.scrollPosition
-    });
-  };
-  if (!wasReached) {
-    if (!within) {
-      return false;
-    }
-    onReached == null ? void 0 : onReached(distance);
-    updateSnapshot();
-    return true;
-  }
-  const reset = !atThreshold && threshold > 0 && absDistance >= threshold * HYSTERESIS_MULTIPLIER || !atThreshold && threshold <= 0 && absDistance > 0;
-  if (reset) {
-    setSnapshot == null ? void 0 : setSnapshot(void 0);
-    return false;
-  }
-  if (within) {
-    const changed = !snapshot || snapshot.atThreshold !== atThreshold || snapshot.contentSize !== context.contentSize || snapshot.dataLength !== context.dataLength;
-    if (changed) {
-      onReached == null ? void 0 : onReached(distance);
-      updateSnapshot();
+      pendingRemoval.push(value);
     }
   }
-  return true;
-};
+  return result.sort(comparatorDefault);
+}
+function comparatorByDistance(a, b) {
+  return b.distance - a.distance;
+}
 
-// src/utils/checkAtBottom.ts
-function checkAtBottom(ctx, state) {
-  var _a3;
-  if (!state) {
-    return;
+// src/core/scrollToIndex.ts
+function scrollToIndex(ctx, state, { index, viewOffset = 0, animated = true, viewPosition }) {
+  if (index >= state.props.data.length) {
+    index = state.props.data.length - 1;
+  } else if (index < 0) {
+    index = 0;
   }
-  const {
-    queuedInitialLayout,
-    scrollLength,
-    scroll,
-    maintainingScrollAtEnd,
-    props: { maintainScrollAtEndThreshold, onEndReachedThreshold }
-  } = state;
-  const contentSize = getContentSize(ctx);
-  if (contentSize > 0 && queuedInitialLayout && !maintainingScrollAtEnd) {
-    const distanceFromEnd = contentSize - scroll - scrollLength;
-    const isContentLess = contentSize < scrollLength;
-    state.isAtEnd = isContentLess || distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
-    state.isEndReached = checkThreshold(
-      distanceFromEnd,
-      isContentLess,
-      onEndReachedThreshold * scrollLength,
-      state.isEndReached,
-      state.endReachedSnapshot,
-      {
-        scrollPosition: scroll,
-        contentSize,
-        dataLength: (_a3 = state.props.data) == null ? void 0 : _a3.length
-      },
-      (distance) => {
-        var _a4, _b;
-        return (_b = (_a4 = state.props).onEndReached) == null ? void 0 : _b.call(_a4, { distanceFromEnd: distance });
-      },
-      (snapshot) => {
-        state.endReachedSnapshot = snapshot;
-      }
-    );
+  const firstIndexOffset = calculateOffsetForIndex(ctx, state, index);
+  const isLast = index === state.props.data.length - 1;
+  if (isLast && viewPosition === void 0) {
+    viewPosition = 1;
   }
+  state.scrollForNextCalculateItemsInView = void 0;
+  scrollTo(ctx, state, {
+    animated,
+    index,
+    offset: firstIndexOffset,
+    viewOffset,
+    viewPosition: viewPosition != null ? viewPosition : 0
+  });
 }
 
 // src/utils/setDidLayout.ts
@@ -2150,7 +2296,7 @@ function handleStickyRecycling(ctx, state, stickyArray, scroll, scrollBuffer, cu
       const currentId = (_b = state.idCache[itemIndex]) != null ? _b : getId(state, itemIndex);
       if (currentId) {
         const currentPos = state.positions.get(currentId);
-        const currentSize = (_c = state.sizes.get(currentId)) != null ? _c : getItemSize(state, currentId, itemIndex, state.props.data[itemIndex]);
+        const currentSize = (_c = state.sizes.get(currentId)) != null ? _c : getItemSize(ctx, state, currentId, itemIndex, state.props.data[itemIndex]);
         shouldRecycle = currentPos !== void 0 && scroll > currentPos + currentSize + scrollBuffer * 3;
       }
     }
@@ -2161,21 +2307,22 @@ function handleStickyRecycling(ctx, state, stickyArray, scroll, scrollBuffer, cu
 }
 function calculateItemsInView(ctx, state, params = {}) {
   reactDom.unstable_batchedUpdates(() => {
-    var _a3, _b, _c, _d, _e, _f, _g, _h, _i;
+    var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j;
     const {
       columns,
       containerItemKeys,
       enableScrollForNextCalculateItemsInView,
       idCache,
       indexByKey,
+      initialScroll,
       minIndexSizeChanged,
       positions,
+      props: { getItemType, itemsAreEqual, keyExtractor, onStickyHeaderChange, scrollBuffer },
       scrollForNextCalculateItemsInView,
       scrollLength,
       sizes,
       startBufferedId: startBufferedIdOrig,
-      viewabilityConfigCallbackPairs,
-      props: { getItemType, initialScroll, itemsAreEqual, keyExtractor, onStickyHeaderChange, scrollBuffer }
+      viewabilityConfigCallbackPairs
     } = state;
     const { data } = state.props;
     const stickyIndicesArr = state.props.stickyIndicesArr || [];
@@ -2187,20 +2334,22 @@ function calculateItemsInView(ctx, state, params = {}) {
     const totalSize = peek$(ctx, "totalSize");
     const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
     const numColumns = peek$(ctx, "numColumns");
-    const { dataChanged, doMVCP } = params;
+    const { dataChanged, doMVCP, forceFullItemPositions } = params;
     const speed = getScrollVelocity(state);
     const scrollExtra = 0;
     const { queuedInitialLayout } = state;
     let { scroll: scrollState } = state;
     if (!queuedInitialLayout && initialScroll) {
       const updatedOffset = calculateOffsetWithOffsetPosition(
+        ctx,
         state,
         calculateOffsetForIndex(ctx, state, initialScroll.index),
         initialScroll
       );
       scrollState = updatedOffset;
     }
-    const scrollAdjustPad = -topPad;
+    const scrollAdjustPending = (_a3 = peek$(ctx, "scrollAdjustPending")) != null ? _a3 : 0;
+    const scrollAdjustPad = scrollAdjustPending - topPad;
     let scroll = scrollState + scrollExtra + scrollAdjustPad;
     if (scroll + scrollLength > totalSize) {
       scroll = Math.max(0, totalSize - scrollLength);
@@ -2213,6 +2362,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     const currentStickyIdx = stickyIndicesArr.length > 0 ? findCurrentStickyIndex(stickyIndicesArr, scroll, state) : -1;
     const nextActiveStickyIndex = currentStickyIdx >= 0 ? stickyIndicesArr[currentStickyIdx] : void 0;
     state.activeStickyIndex = nextActiveStickyIndex;
+    set$(ctx, "activeStickyIndex", nextActiveStickyIndex);
     let scrollBufferTop = scrollBuffer;
     let scrollBufferBottom = scrollBuffer;
     if (speed > 0 || speed === 0 && scroll < Math.max(50, scrollBuffer)) {
@@ -2237,8 +2387,12 @@ function calculateItemsInView(ctx, state, params = {}) {
       idCache.length = 0;
       positions.clear();
     }
-    const startIndex = dataChanged ? 0 : (_a3 = minIndexSizeChanged != null ? minIndexSizeChanged : state.startBuffered) != null ? _a3 : 0;
-    updateItemPositions(ctx, state, dataChanged, { scrollBottomBuffered, startIndex });
+    const startIndex = dataChanged ? 0 : (_b = minIndexSizeChanged != null ? minIndexSizeChanged : state.startBuffered) != null ? _b : 0;
+    updateItemPositions(ctx, state, dataChanged, {
+      forceFullUpdate: !!forceFullItemPositions,
+      scrollBottomBuffered,
+      startIndex
+    });
     if (minIndexSizeChanged !== void 0) {
       state.minIndexSizeChanged = void 0;
     }
@@ -2250,9 +2404,9 @@ function calculateItemsInView(ctx, state, params = {}) {
     let endBuffered = null;
     let loopStart = !dataChanged && startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
     for (let i = loopStart; i >= 0; i--) {
-      const id = (_b = idCache[i]) != null ? _b : getId(state, i);
+      const id = (_c = idCache[i]) != null ? _c : getId(state, i);
       const top = positions.get(id);
-      const size = (_c = sizes.get(id)) != null ? _c : getItemSize(state, id, i, data[i]);
+      const size = (_d = sizes.get(id)) != null ? _d : getItemSize(ctx, state, id, i, data[i]);
       const bottom = top + size;
       if (bottom > scroll - scrollBuffer) {
         loopStart = i;
@@ -2278,8 +2432,8 @@ function calculateItemsInView(ctx, state, params = {}) {
     let firstFullyOnScreenIndex;
     const dataLength = data.length;
     for (let i = Math.max(0, loopStart); i < dataLength && (!foundEnd || i <= maxIndexRendered); i++) {
-      const id = (_d = idCache[i]) != null ? _d : getId(state, i);
-      const size = (_e = sizes.get(id)) != null ? _e : getItemSize(state, id, i, data[i]);
+      const id = (_e = idCache[i]) != null ? _e : getId(state, i);
+      const size = (_f = sizes.get(id)) != null ? _f : getItemSize(ctx, state, id, i, data[i]);
       const top = positions.get(id);
       if (!foundEnd) {
         if (startNoBuffer === null && top + size > scroll) {
@@ -2308,7 +2462,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     }
     const idsInView = [];
     for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
-      const id = (_f = idCache[i]) != null ? _f : getId(state, i);
+      const id = (_g = idCache[i]) != null ? _g : getId(state, i);
       idsInView.push(id);
     }
     Object.assign(state, {
@@ -2340,7 +2494,7 @@ function calculateItemsInView(ctx, state, params = {}) {
       let numContainers2 = prevNumContainers;
       const needNewContainers = [];
       for (let i = startBuffered; i <= endBuffered; i++) {
-        const id = (_g = idCache[i]) != null ? _g : getId(state, i);
+        const id = (_h = idCache[i]) != null ? _h : getId(state, i);
         if (!containerItemKeys.has(id)) {
           needNewContainers.push(i);
         }
@@ -2358,6 +2512,7 @@ function calculateItemsInView(ctx, state, params = {}) {
         );
       } else {
         state.activeStickyIndex = void 0;
+        set$(ctx, "activeStickyIndex", void 0);
       }
       if (needNewContainers.length > 0) {
         const requiredItemTypes = getItemType ? needNewContainers.map((i) => {
@@ -2377,7 +2532,7 @@ function calculateItemsInView(ctx, state, params = {}) {
         for (let idx = 0; idx < needNewContainers.length; idx++) {
           const i = needNewContainers[idx];
           const containerIndex = availableContainers[idx];
-          const id = (_h = idCache[i]) != null ? _h : getId(state, i);
+          const id = (_i = idCache[i]) != null ? _i : getId(state, i);
           const oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
           if (oldKey && oldKey !== id) {
             containerItemKeys.delete(oldKey);
@@ -2416,7 +2571,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     for (let i = 0; i < numContainers; i++) {
       const itemKey = peek$(ctx, `containerItemKey${i}`);
       if (pendingRemoval.includes(i)) {
-        if (itemKey) {
+        if (itemKey !== void 0) {
           containerItemKeys.delete(itemKey);
         }
         state.containerItemTypes.delete(i);
@@ -2433,11 +2588,12 @@ function calculateItemsInView(ctx, state, params = {}) {
         const itemIndex = indexByKey.get(itemKey);
         const item = data[itemIndex];
         if (item !== void 0) {
-          const id = (_i = idCache[itemIndex]) != null ? _i : getId(state, itemIndex);
-          const position = positions.get(id);
-          if (position === void 0) {
+          const id = (_j = idCache[itemIndex]) != null ? _j : getId(state, itemIndex);
+          const positionValue = positions.get(id);
+          if (positionValue === void 0) {
             set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
           } else {
+            const position = (positionValue || 0) - scrollAdjustPending;
             const column = columns.get(id) || 1;
             const prevPos = peek$(ctx, `containerPosition${i}`);
             const prevColumn = peek$(ctx, `containerColumn${i}`);
@@ -2476,6 +2632,26 @@ function calculateItemsInView(ctx, state, params = {}) {
   });
 }
 
+// src/core/checkActualChange.ts
+function checkActualChange(state, dataProp, previousData) {
+  if (!previousData || !dataProp || dataProp.length !== previousData.length) {
+    return true;
+  }
+  const {
+    idCache,
+    props: { keyExtractor }
+  } = state;
+  for (let i = 0; i < dataProp.length; i++) {
+    if (dataProp[i] !== previousData[i]) {
+      return true;
+    }
+    if (keyExtractor ? idCache[i] !== keyExtractor(previousData[i], i) : dataProp[i] !== previousData[i]) {
+      return true;
+    }
+  }
+  return false;
+}
+
 // src/core/doMaintainScrollAtEnd.ts
 function doMaintainScrollAtEnd(ctx, state, animated) {
   const {
@@ -2506,40 +2682,6 @@ function doMaintainScrollAtEnd(ctx, state, animated) {
   }
 }
 
-// src/utils/checkAtTop.ts
-function checkAtTop(state) {
-  var _a3;
-  if (!state) {
-    return;
-  }
-  const {
-    scrollLength,
-    scroll,
-    props: { onStartReachedThreshold }
-  } = state;
-  const distanceFromTop = scroll;
-  state.isAtStart = distanceFromTop <= 0;
-  state.isStartReached = checkThreshold(
-    distanceFromTop,
-    false,
-    onStartReachedThreshold * scrollLength,
-    state.isStartReached,
-    state.startReachedSnapshot,
-    {
-      scrollPosition: scroll,
-      contentSize: state.totalSize,
-      dataLength: (_a3 = state.props.data) == null ? void 0 : _a3.length
-    },
-    (distance) => {
-      var _a4, _b;
-      return (_b = (_a4 = state.props).onStartReached) == null ? void 0 : _b.call(_a4, { distanceFromStart: distance });
-    },
-    (snapshot) => {
-      state.startReachedSnapshot = snapshot;
-    }
-  );
-}
-
 // src/utils/updateAveragesOnDataChange.ts
 function updateAveragesOnDataChange(state, oldData, newData) {
   var _a3;
@@ -2593,25 +2735,23 @@ function updateAveragesOnDataChange(state, oldData, newData) {
 }
 
 // src/core/checkResetContainers.ts
-function checkResetContainers(ctx, state, isFirst, dataProp) {
-  if (state) {
-    if (!isFirst && state.props.data !== dataProp) {
-      updateAveragesOnDataChange(state, state.props.data, dataProp);
-    }
-    const { maintainScrollAtEnd } = state.props;
-    if (!isFirst) {
-      calculateItemsInView(ctx, state, { dataChanged: true, doMVCP: true });
-      const shouldMaintainScrollAtEnd = maintainScrollAtEnd === true || maintainScrollAtEnd.onDataChange;
-      const didMaintainScrollAtEnd = shouldMaintainScrollAtEnd && doMaintainScrollAtEnd(ctx, state, false);
-      if (!didMaintainScrollAtEnd && dataProp.length > state.props.data.length) {
-        state.isEndReached = false;
-      }
-      if (!didMaintainScrollAtEnd) {
-        checkAtTop(state);
-        checkAtBottom(ctx, state);
-      }
-    }
+function checkResetContainers(ctx, state, dataProp) {
+  const { previousData } = state;
+  if (previousData) {
+    updateAveragesOnDataChange(state, previousData, dataProp);
+  }
+  const { maintainScrollAtEnd } = state.props;
+  calculateItemsInView(ctx, state, { dataChanged: true, doMVCP: true });
+  const shouldMaintainScrollAtEnd = maintainScrollAtEnd === true || maintainScrollAtEnd.onDataChange;
+  const didMaintainScrollAtEnd = shouldMaintainScrollAtEnd && doMaintainScrollAtEnd(ctx, state, false);
+  if (!didMaintainScrollAtEnd && previousData && dataProp.length > previousData.length) {
+    state.isEndReached = false;
   }
+  if (!didMaintainScrollAtEnd) {
+    checkAtTop(state);
+    checkAtBottom(ctx, state);
+  }
+  delete state.previousData;
 }
 
 // src/core/doInitialAllocateContainers.ts
@@ -2652,7 +2792,7 @@ function doInitialAllocateContainers(ctx, state) {
     set$(ctx, "numContainers", numContainers);
     set$(ctx, "numContainersPooled", numContainers * state.props.initialContainerPoolRatio);
     if (state.lastLayout) {
-      if (state.props.initialScroll) {
+      if (state.initialScroll) {
         requestAnimationFrame(() => {
           calculateItemsInView(ctx, state, { dataChanged: true, doMVCP: true });
         });
@@ -2708,78 +2848,47 @@ 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);
-}
-function updateScroll(ctx, state, newScroll) {
-  const scrollingTo = state.scrollingTo;
-  state.hasScrolled = true;
-  state.lastBatchingAction = Date.now();
-  const currentTime = Date.now();
-  const adjust = state.scrollAdjustHandler.getAdjust();
-  const lastHistoryAdjust = state.lastScrollAdjustForHistory;
-  const adjustChanged = lastHistoryAdjust !== void 0 && Math.abs(adjust - lastHistoryAdjust) > 0.1;
-  if (adjustChanged) {
-    state.scrollHistory.length = 0;
-  }
-  state.lastScrollAdjustForHistory = adjust;
-  if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === state.scroll)) {
-    if (!adjustChanged) {
-      state.scrollHistory.push({ scroll: newScroll, time: currentTime });
-    }
-  }
-  if (state.scrollHistory.length > 5) {
-    state.scrollHistory.shift();
-  }
-  state.scrollPrev = state.scroll;
-  state.scrollPrevTime = state.scrollTime;
-  state.scroll = newScroll;
-  state.scrollTime = currentTime;
-  const ignoreScrollFromMVCP = state.ignoreScrollFromMVCP;
-  if (ignoreScrollFromMVCP && !state.scrollingTo) {
-    const { lt, gt } = ignoreScrollFromMVCP;
-    if (lt && newScroll < lt || gt && newScroll > gt) {
-      return;
-    }
-  }
-  if (state.dataChangeNeedsScrollUpdate || Math.abs(state.scroll - state.scrollPrev) > 2) {
-    calculateItemsInView(ctx, state, { doMVCP: state.scrollingTo !== void 0 });
-    checkAtBottom(ctx, state);
-    checkAtTop(state);
-    state.dataChangeNeedsScrollUpdate = false;
-  }
-}
-
 // src/core/ScrollAdjustHandler.ts
 var ScrollAdjustHandler = class {
   constructor(ctx) {
     this.appliedAdjust = 0;
+    this.pendingAdjust = 0;
     this.mounted = false;
     this.context = ctx;
+    {
+      const commitPendingAdjust = () => {
+        const state = this.context.internalState;
+        const pending = this.pendingAdjust;
+        if (pending !== 0) {
+          this.pendingAdjust = 0;
+          this.appliedAdjust += pending;
+          state.scroll += pending;
+          state.scrollForNextCalculateItemsInView = void 0;
+          set$(this.context, "scrollAdjustPending", 0);
+          set$(this.context, "scrollAdjust", this.appliedAdjust);
+          calculateItemsInView(this.context, this.context.internalState);
+        }
+      };
+      listen$(this.context, "scrollingTo", (value) => {
+        if (value === void 0) {
+          commitPendingAdjust();
+        }
+      });
+    }
   }
   requestAdjust(add) {
-    const oldAdjustTop = this.appliedAdjust;
-    this.appliedAdjust = add + oldAdjustTop;
-    const set = () => set$(this.context, "scrollAdjust", this.appliedAdjust);
-    if (this.mounted) {
-      set();
+    const scrollingTo = peek$(this.context, "scrollingTo");
+    if ((scrollingTo == null ? void 0 : scrollingTo.animated) && !scrollingTo.isInitialScroll) {
+      this.pendingAdjust += add;
+      set$(this.context, "scrollAdjustPending", this.pendingAdjust);
     } else {
-      requestAnimationFrame(set);
+      this.appliedAdjust += add;
+      const setter = () => set$(this.context, "scrollAdjust", this.appliedAdjust);
+      if (this.mounted) {
+        setter();
+      } else {
+        requestAnimationFrame(setter);
+      }
     }
   }
   setMounted() {
@@ -2827,8 +2936,8 @@ function updateItemSize(ctx, state, itemKey, sizeObj) {
   let minIndexSizeChanged;
   let maxOtherAxisSize = peek$(ctx, "otherAxisSize") || 0;
   const prevSizeKnown = state.sizesKnown.get(itemKey);
-  const diff = updateOneItemSize(state, itemKey, sizeObj);
-  const size = Math.floor((horizontal ? sizeObj.width : sizeObj.height) * 8) / 8;
+  const diff = updateOneItemSize(ctx, state, itemKey, sizeObj);
+  const size = roundSize(horizontal ? sizeObj.width : sizeObj.height);
   if (diff !== 0) {
     minIndexSizeChanged = minIndexSizeChanged !== void 0 ? Math.min(minIndexSizeChanged, index) : index;
     const { startBuffered, endBuffered } = state;
@@ -2849,7 +2958,6 @@ function updateItemSize(ctx, state, itemKey, sizeObj) {
     if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
       shouldMaintainScrollAtEnd = true;
     }
-    addTotalSize(ctx, state, itemKey, diff);
     onItemSizeChanged == null ? void 0 : onItemSizeChanged({
       index,
       itemData: state.props.data[index],
@@ -2889,7 +2997,7 @@ function updateItemSize(ctx, state, itemKey, sizeObj) {
     }
   }
 }
-function updateOneItemSize(state, itemKey, sizeObj) {
+function updateOneItemSize(ctx, state, itemKey, sizeObj) {
   var _a3;
   const {
     sizes,
@@ -2900,7 +3008,7 @@ function updateOneItemSize(state, itemKey, sizeObj) {
   } = state;
   if (!data) return 0;
   const index = indexByKey.get(itemKey);
-  const prevSize = getItemSize(state, itemKey, index, data[index]);
+  const prevSize = getItemSize(ctx, state, itemKey, index, data[index]);
   const rawSize = horizontal ? sizeObj.width : sizeObj.height;
   const size = Math.round(rawSize) ;
   sizesKnown.set(itemKey, size);
@@ -2914,7 +3022,7 @@ function updateOneItemSize(state, itemKey, sizeObj) {
     averages.num++;
   }
   if (!prevSize || Math.abs(prevSize - size) > 0.1) {
-    sizes.set(itemKey, size);
+    setSize(ctx, state, itemKey, size);
     return size - prevSize;
   }
   return 0;
@@ -2959,6 +3067,91 @@ function createColumnWrapperStyle(contentContainerStyle) {
     };
   }
 }
+
+// src/utils/createImperativeHandle.ts
+function createImperativeHandle(ctx, state) {
+  const scrollIndexIntoView = (options) => {
+    if (state) {
+      const { index, ...rest } = options;
+      const { startNoBuffer, endNoBuffer } = state;
+      if (index < startNoBuffer || index > endNoBuffer) {
+        const viewPosition = index < startNoBuffer ? 0 : 1;
+        scrollToIndex(ctx, state, {
+          ...rest,
+          index,
+          viewPosition
+        });
+      }
+    }
+  };
+  const refScroller = state.refScroller;
+  return {
+    flashScrollIndicators: () => refScroller.current.flashScrollIndicators(),
+    getNativeScrollRef: () => refScroller.current,
+    getScrollableNode: () => refScroller.current.getScrollableNode(),
+    getScrollResponder: () => refScroller.current.getScrollResponder(),
+    getState: () => ({
+      activeStickyIndex: state.activeStickyIndex,
+      contentLength: state.totalSize,
+      data: state.props.data,
+      elementAtIndex: (index) => {
+        var _a3;
+        return (_a3 = ctx.viewRefs.get(findContainerId(ctx, getId(state, index)))) == null ? void 0 : _a3.current;
+      },
+      end: state.endNoBuffer,
+      endBuffered: state.endBuffered,
+      isAtEnd: state.isAtEnd,
+      isAtStart: state.isAtStart,
+      positionAtIndex: (index) => state.positions.get(getId(state, index)),
+      positions: state.positions,
+      scroll: state.scroll,
+      scrollLength: state.scrollLength,
+      sizeAtIndex: (index) => state.sizesKnown.get(getId(state, index)),
+      sizes: state.sizesKnown,
+      start: state.startNoBuffer,
+      startBuffered: state.startBuffered
+    }),
+    scrollIndexIntoView,
+    scrollItemIntoView: ({ item, ...props }) => {
+      const data = state.props.data;
+      const index = data.indexOf(item);
+      if (index !== -1) {
+        scrollIndexIntoView({ index, ...props });
+      }
+    },
+    scrollToEnd: (options) => {
+      const data = state.props.data;
+      const stylePaddingBottom = state.props.stylePaddingBottom;
+      const index = data.length - 1;
+      if (index !== -1) {
+        const paddingBottom = stylePaddingBottom || 0;
+        const footerSize = peek$(ctx, "footerSize") || 0;
+        scrollToIndex(ctx, state, {
+          index,
+          viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
+          viewPosition: 1,
+          ...options
+        });
+      }
+    },
+    scrollToIndex: (params) => scrollToIndex(ctx, state, params),
+    scrollToItem: ({ item, ...props }) => {
+      const data = state.props.data;
+      const index = data.indexOf(item);
+      if (index !== -1) {
+        scrollToIndex(ctx, state, { index, ...props });
+      }
+    },
+    scrollToOffset: (params) => scrollTo(ctx, state, params),
+    setScrollProcessingEnabled: (enabled) => {
+      state.scrollProcessingEnabled = enabled;
+    },
+    setVisibleContentAnchorOffset: (value) => {
+      const val = isFunction(value) ? value(peek$(ctx, "scrollAdjustUserOffset") || 0) : value;
+      set$(ctx, "scrollAdjustUserOffset", val);
+    }
+  };
+}
 function getRenderedItem(ctx, state, key) {
   var _a3;
   if (!state) {
@@ -3059,6 +3252,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     columnWrapperStyle,
     contentContainerStyle: contentContainerStyleProp,
     data: dataProp = [],
+    dataVersion,
     drawDistance = 250,
     enableAverages = true,
     estimatedItemSize: estimatedItemSizeProp,
@@ -3069,6 +3263,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     getItemType,
     horizontal,
     initialContainerPoolRatio = 2,
+    initialScrollAtEnd = false,
     initialScrollIndex: initialScrollIndexProp,
     initialScrollOffset: initialScrollOffsetProp,
     itemsAreEqual,
@@ -3107,13 +3302,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     waitForInitialLayout = true,
     ...rest
   } = props;
-  const [renderNum, setRenderNum] = React3.useState(0);
-  const initialScroll = initialScrollIndexProp || initialScrollOffsetProp ? typeof initialScrollIndexProp === "object" ? { index: initialScrollIndexProp.index || 0, viewOffset: initialScrollIndexProp.viewOffset || 0 } : { index: initialScrollIndexProp || 0, viewOffset: initialScrollOffsetProp || 0 } : void 0;
-  const [canRender, setCanRender] = React3__namespace.useState(!IsNewArchitecture);
   const contentContainerStyle = { ...StyleSheet.flatten(contentContainerStyleProp) };
   const style = { ...StyleSheet.flatten(styleProp) };
   const stylePaddingTopState = extractPadding(style, contentContainerStyle, "Top");
   const stylePaddingBottomState = extractPadding(style, contentContainerStyle, "Bottom");
+  const [renderNum, setRenderNum] = React3.useState(0);
+  const initialScrollProp = initialScrollAtEnd ? { index: Math.max(0, dataProp.length - 1), viewOffset: -stylePaddingBottomState } : initialScrollIndexProp || initialScrollOffsetProp ? typeof initialScrollIndexProp === "object" ? { index: initialScrollIndexProp.index || 0, viewOffset: initialScrollIndexProp.viewOffset || 0 } : { index: initialScrollIndexProp || 0, viewOffset: initialScrollOffsetProp || 0 } : void 0;
+  const [canRender, setCanRender] = React3__namespace.useState(!IsNewArchitecture);
   const ctx = useStateContext();
   ctx.columnWrapperStyle = columnWrapperStyle || (contentContainerStyle ? createColumnWrapperStyle(contentContainerStyle) : void 0);
   const refScroller = React3.useRef(null);
@@ -3132,6 +3327,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         containerItemKeys: /* @__PURE__ */ new Set(),
         containerItemTypes: /* @__PURE__ */ new Map(),
         dataChangeNeedsScrollUpdate: false,
+        didColumnsChange: false,
+        didDataChange: false,
         enableScrollForNextCalculateItemsInView: true,
         endBuffered: -1,
         endNoBuffer: -1,
@@ -3140,10 +3337,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         idCache: [],
         idsInView: [],
         indexByKey: /* @__PURE__ */ new Map(),
-        initialScroll,
+        initialScroll: initialScrollProp,
         isAtEnd: false,
         isAtStart: false,
         isEndReached: false,
+        isFirst: true,
         isStartReached: false,
         lastBatchingAction: Date.now(),
         lastLayout: void 0,
@@ -3176,21 +3374,27 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         totalSize: 0,
         viewabilityConfigCallbackPairs: void 0
       };
+      const internalState = ctx.internalState;
+      internalState.triggerCalculateItemsInView = (params) => calculateItemsInView(ctx, internalState, params);
       set$(ctx, "maintainVisibleContentPosition", maintainVisibleContentPosition);
       set$(ctx, "extraData", extraData);
     }
     refState.current = ctx.internalState;
   }
   const state = refState.current;
-  const isFirst = !state.props.renderItem;
-  const didDataChange = state.props.data !== dataProp;
-  if (didDataChange) {
+  const isFirstLocal = state.isFirst;
+  state.didColumnsChange = numColumnsProp !== state.props.numColumns;
+  const didDataChangeLocal = state.props.dataVersion !== dataVersion || state.props.data !== dataProp && checkActualChange(state, dataProp, state.props.data);
+  if (didDataChangeLocal) {
     state.dataChangeNeedsScrollUpdate = true;
+    state.didDataChange = true;
+    state.previousData = state.props.data;
   }
   const throttleScrollFn = scrollEventThrottle && onScrollProp ? useThrottledOnScroll(onScrollProp, scrollEventThrottle) : onScrollProp;
   state.props = {
     alignItemsAtEnd,
     data: dataProp,
+    dataVersion,
     enableAverages,
     estimatedItemSize,
     getEstimatedItemSize,
@@ -3198,7 +3402,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     getItemType,
     horizontal: !!horizontal,
     initialContainerPoolRatio,
-    initialScroll,
     itemsAreEqual,
     keyExtractor,
     maintainScrollAtEnd,
@@ -3230,7 +3433,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       { length: Math.min(numColumnsProp, dataProp.length) },
       (_, i) => getId(state, dataProp.length - 1 - i)
     );
-  }, [dataProp, numColumnsProp]);
+  }, [dataProp, dataVersion, numColumnsProp]);
   const initializeStateVars = () => {
     set$(ctx, "lastItemKeys", memoizedLastItemKeys);
     set$(ctx, "numColumns", numColumnsProp);
@@ -3245,7 +3448,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       requestAdjust(ctx, state, paddingDiff);
     }
   };
-  if (isFirst) {
+  if (isFirstLocal) {
     initializeStateVars();
     updateItemPositions(
       ctx,
@@ -3255,38 +3458,42 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     );
   }
   const initialContentOffset = React3.useMemo(() => {
-    if (initialScroll) {
-      const { index, viewOffset } = initialScroll;
-      let initialContentOffset2 = viewOffset || 0;
-      if (index !== void 0) {
-        initialContentOffset2 += calculateOffsetForIndex(ctx, state, index);
-      }
-      refState.current.isStartReached = initialContentOffset2 < refState.current.scrollLength * onStartReachedThreshold;
-      if (initialContentOffset2 > 0) {
-        scrollTo(state, {
-          animated: false,
-          index,
-          isInitialScroll: true,
-          offset: initialContentOffset2,
-          viewPosition: index === dataProp.length - 1 ? 1 : 0
-        });
-      }
-      return initialContentOffset2;
-    }
-    return 0;
-  }, [renderNum]);
-  if (isFirst || didDataChange || numColumnsProp !== peek$(ctx, "numColumns")) {
+    const { initialScroll } = refState.current;
+    if (!initialScroll) {
+      return 0;
+    }
+    if (initialScroll.contentOffset !== void 0) {
+      return initialScroll.contentOffset;
+    }
+    const baseOffset = initialScroll.index !== void 0 ? calculateOffsetForIndex(ctx, state, initialScroll.index) : 0;
+    const resolvedOffset = calculateOffsetWithOffsetPosition(ctx, state, baseOffset, initialScroll);
+    let clampedOffset = resolvedOffset;
+    if (Number.isFinite(state.scrollLength) && Number.isFinite(state.totalSize)) {
+      const maxOffset = Math.max(0, state.totalSize - state.scrollLength);
+      clampedOffset = Math.min(clampedOffset, maxOffset);
+    }
+    clampedOffset = Math.max(0, clampedOffset);
+    const updatedInitialScroll = { ...initialScroll, contentOffset: clampedOffset };
+    refState.current.initialScroll = updatedInitialScroll;
+    state.initialScroll = updatedInitialScroll;
+    refState.current.isStartReached = clampedOffset < refState.current.scrollLength * onStartReachedThreshold;
+    return clampedOffset;
+  }, [renderNum, state.initialScroll]);
+  if (isFirstLocal || didDataChangeLocal || numColumnsProp !== peek$(ctx, "numColumns")) {
     refState.current.lastBatchingAction = Date.now();
-    if (!keyExtractorProp && !isFirst && didDataChange) {
+    if (!keyExtractorProp && !isFirstLocal && didDataChangeLocal) {
       IS_DEV && warnDevOnce(
         "keyExtractor",
         "Changing data without a keyExtractor can cause slow performance and resetting scroll. If your list data can change you should use a keyExtractor with a unique id for best performance and behavior."
       );
       refState.current.sizes.clear();
       refState.current.positions.clear();
+      refState.current.totalSize = 0;
+      set$(ctx, "totalSize", 0);
     }
   }
   const onLayoutHeader = React3.useCallback((rect, fromLayoutEffect) => {
+    const { initialScroll } = refState.current;
     const size = rect[horizontal ? "width" : "height"];
     set$(ctx, "headerSize", size);
     if ((initialScroll == null ? void 0 : initialScroll.index) !== void 0) {
@@ -3297,31 +3504,57 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       }
     }
   }, []);
+  const doInitialScroll = React3.useCallback(() => {
+    var _a4;
+    const initialScroll = state.initialScroll;
+    if (initialScroll) {
+      scrollTo(ctx, state, {
+        animated: false,
+        index: (_a4 = state.initialScroll) == null ? void 0 : _a4.index,
+        offset: initialContentOffset,
+        precomputedWithViewOffset: true
+      });
+    }
+  }, [initialContentOffset, state.initialScroll]);
+  const onLayoutChange = React3.useCallback((layout) => {
+    doInitialScroll();
+    handleLayout(ctx, state, layout, setCanRender);
+  }, []);
+  const { onLayout } = useOnLayoutSync({
+    onLayoutChange,
+    onLayoutProp,
+    ref: refScroller
+    // the type of ScrollView doesn't include measure?
+  });
   React3.useLayoutEffect(() => {
     if (snapToIndices) {
       updateSnapToOffsets(ctx, state);
     }
   }, [snapToIndices]);
   React3.useLayoutEffect(() => {
-    const didAllocateContainers = dataProp.length > 0 && doInitialAllocateContainers(ctx, state);
-    if (!didAllocateContainers) {
-      checkResetContainers(
-        ctx,
-        state,
-        /*isFirst*/
-        isFirst,
-        dataProp
-      );
-    }
-  }, [dataProp, numColumnsProp]);
+    const {
+      didColumnsChange,
+      didDataChange,
+      isFirst,
+      props: { data }
+    } = state;
+    const didAllocateContainers = data.length > 0 && doInitialAllocateContainers(ctx, state);
+    if (!didAllocateContainers && !isFirst && (didDataChange || didColumnsChange)) {
+      checkResetContainers(ctx, state, data);
+    }
+    state.didColumnsChange = false;
+    state.didDataChange = false;
+    state.isFirst = false;
+  }, [dataProp, dataVersion, numColumnsProp]);
   React3.useLayoutEffect(() => {
     set$(ctx, "extraData", extraData);
   }, [extraData]);
   React3.useLayoutEffect(initializeStateVars, [
+    dataVersion,
     memoizedLastItemKeys.join(","),
     numColumnsProp,
-    stylePaddingTopState,
-    stylePaddingBottomState
+    stylePaddingBottomState,
+    stylePaddingTopState
   ]);
   React3.useEffect(() => {
     const viewability = setupViewability({
@@ -3332,103 +3565,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     state.viewabilityConfigCallbackPairs = viewability;
     state.enableScrollForNextCalculateItemsInView = !viewability;
   }, [viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged]);
-  const onLayoutChange = React3.useCallback((layout) => {
-    handleLayout(ctx, state, layout, setCanRender);
-  }, []);
-  const { onLayout } = useOnLayoutSync({
-    onLayoutChange,
-    onLayoutProp,
-    ref: refScroller
-    // the type of ScrollView doesn't include measure?
-  });
-  React3.useImperativeHandle(forwardedRef, () => {
-    const scrollIndexIntoView = (options) => {
-      const state2 = refState.current;
-      if (state2) {
-        const { index, ...rest2 } = options;
-        const { startNoBuffer, endNoBuffer } = state2;
-        if (index < startNoBuffer || index > endNoBuffer) {
-          const viewPosition = index < startNoBuffer ? 0 : 1;
-          scrollToIndex(ctx, state2, {
-            ...rest2,
-            index,
-            viewPosition
-          });
-        }
-      }
-    };
-    return {
-      flashScrollIndicators: () => refScroller.current.flashScrollIndicators(),
-      getNativeScrollRef: () => refScroller.current,
-      getScrollableNode: () => refScroller.current.getScrollableNode(),
-      getScrollResponder: () => refScroller.current.getScrollResponder(),
-      getState: () => {
-        const state2 = refState.current;
-        return state2 ? {
-          activeStickyIndex: state2.activeStickyIndex,
-          contentLength: state2.totalSize,
-          data: state2.props.data,
-          end: state2.endNoBuffer,
-          endBuffered: state2.endBuffered,
-          isAtEnd: state2.isAtEnd,
-          isAtStart: state2.isAtStart,
-          positionAtIndex: (index) => state2.positions.get(getId(state2, index)),
-          positions: state2.positions,
-          scroll: state2.scroll,
-          scrollLength: state2.scrollLength,
-          sizeAtIndex: (index) => state2.sizesKnown.get(getId(state2, index)),
-          sizes: state2.sizesKnown,
-          start: state2.startNoBuffer,
-          startBuffered: state2.startBuffered
-        } : {};
-      },
-      scrollIndexIntoView,
-      scrollItemIntoView: ({ item, ...props2 }) => {
-        const data = refState.current.props.data;
-        const index = data.indexOf(item);
-        if (index !== -1) {
-          scrollIndexIntoView({ index, ...props2 });
-        }
-      },
-      scrollToEnd: (options) => {
-        const data = refState.current.props.data;
-        const stylePaddingBottom = refState.current.props.stylePaddingBottom;
-        const index = data.length - 1;
-        if (index !== -1) {
-          const paddingBottom = stylePaddingBottom || 0;
-          const footerSize = peek$(ctx, "footerSize") || 0;
-          scrollToIndex(ctx, state, {
-            index,
-            viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
-            viewPosition: 1,
-            ...options
-          });
-        }
-      },
-      scrollToIndex: (params) => scrollToIndex(ctx, state, params),
-      scrollToItem: ({ item, ...props2 }) => {
-        const data = refState.current.props.data;
-        const index = data.indexOf(item);
-        if (index !== -1) {
-          scrollToIndex(ctx, state, { index, ...props2 });
-        }
-      },
-      scrollToOffset: (params) => scrollTo(state, params),
-      setScrollProcessingEnabled: (enabled) => {
-        refState.current.scrollProcessingEnabled = enabled;
-      },
-      setVisibleContentAnchorOffset: (value) => {
-        const val = typeof value === "function" ? value(peek$(ctx, "scrollAdjustUserOffset") || 0) : value;
-        set$(ctx, "scrollAdjustUserOffset", val);
-      }
-    };
-  }, []);
+  React3.useImperativeHandle(forwardedRef, () => createImperativeHandle(ctx, state), []);
   {
-    React3.useEffect(() => {
-      if (initialContentOffset) {
-        scrollTo(state, { animated: false, offset: initialContentOffset, ...initialScroll || {} });
-      }
-    }, []);
+    React3.useEffect(doInitialScroll, []);
   }
   const fns = React3.useMemo(
     () => ({
@@ -3457,7 +3596,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       onMomentumScrollEnd: (event) => {
         {
           requestAnimationFrame(() => {
-            finishScrollTo(refState.current);
+            finishScrollTo(ctx, refState.current);
           });
         }
         if (onMomentumScrollEnd) {