@legendapp/list 3.0.2 → 3.0.4

package/react-native.mjs

@@ -1,7 +1,7 @@
 import * as React2 from 'react';
 import { useReducer, useEffect, createContext, useRef, useState, useMemo, useCallback, useLayoutEffect, useImperativeHandle, useContext } from 'react';
 import * as ReactNative from 'react-native';
-import { Animated, Platform as Platform$1, View as View$1, Text as Text$1, StyleSheet as StyleSheet$1, RefreshControl, Dimensions, I18nManager } from 'react-native';
+import { Animated, Platform as Platform$1, View as View$1, Text as Text$1, PixelRatio as PixelRatio$1, StyleSheet as StyleSheet$1, RefreshControl, Dimensions, I18nManager } from 'react-native';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 
 // src/components/LegendList.tsx
@@ -722,6 +722,22 @@ function Separator({ ItemSeparatorComponent, leadingItem }) {
   const isLastItem = useIsLastItem();
   return isLastItem ? null : /* @__PURE__ */ React2.createElement(ItemSeparatorComponent, { leadingItem });
 }
+var PixelRatio = PixelRatio$1;
+
+// src/utils/layoutMeasurement.ts
+var FLOATING_POINT_SLACK = 0.01;
+var NATIVE_LAYOUT_MEASUREMENT_EPSILON = 1 / PixelRatio.get() + FLOATING_POINT_SLACK;
+function isWithinEpsilon(delta) {
+  return Math.abs(delta) <= NATIVE_LAYOUT_MEASUREMENT_EPSILON;
+}
+function isNativeLayoutNoise(delta) {
+  return isWithinEpsilon(delta);
+}
+function isNativeLayoutSizeNoise(heightDelta, widthDelta) {
+  return isWithinEpsilon(heightDelta) && isWithinEpsilon(widthDelta);
+}
+
+// src/hooks/useOnLayoutSync.native.tsx
 function useOnLayoutSync({
   ref,
   onLayoutProp,
@@ -730,11 +746,21 @@ function useOnLayoutSync({
   const lastLayoutRef = useRef(null);
   const onLayout = useCallback(
     (event) => {
-      var _a3, _b;
       const { layout } = event.nativeEvent;
-      if (layout.height !== ((_a3 = lastLayoutRef.current) == null ? void 0 : _a3.height) || layout.width !== ((_b = lastLayoutRef.current) == null ? void 0 : _b.width)) {
+      const lastLayout = lastLayoutRef.current;
+      const didLayoutSizeChange = lastLayout && (layout.height !== lastLayout.height || layout.width !== lastLayout.width);
+      const isMeasuredLayoutNoise = !!didLayoutSizeChange && !!lastLayout.measuredLayout && isNativeLayoutSizeNoise(
+        layout.height - lastLayout.measuredLayout.height,
+        layout.width - lastLayout.measuredLayout.width
+      );
+      if (!lastLayout || didLayoutSizeChange && !isMeasuredLayoutNoise) {
         onLayoutChange(layout, false);
-        lastLayoutRef.current = layout;
+      }
+      if (!lastLayout || didLayoutSizeChange) {
+        lastLayoutRef.current = {
+          ...layout,
+          measuredLayout: isMeasuredLayoutNoise ? lastLayout == null ? void 0 : lastLayout.measuredLayout : void 0
+        };
       }
       onLayoutProp == null ? void 0 : onLayoutProp(event);
     },
@@ -745,7 +771,7 @@ function useOnLayoutSync({
       if (ref.current) {
         ref.current.measure((x, y, width, height) => {
           const layout = { height, width, x, y };
-          lastLayoutRef.current = layout;
+          lastLayoutRef.current = { ...layout, measuredLayout: layout };
           onLayoutChange(layout, true);
         });
       }
@@ -1784,17 +1810,42 @@ function setSize(ctx, itemKey, size, notifyTotalSize = true) {
 }
 
 // src/utils/getItemSize.ts
+function getKnownOrFixedSize(ctx, key, index, data) {
+  var _a3;
+  const state = ctx.state;
+  const { getFixedItemSize, getItemType } = state.props;
+  let size = key ? state.sizesKnown.get(key) : void 0;
+  if (size === void 0 && key && getFixedItemSize) {
+    const itemType = getItemType ? (_a3 = getItemType(data, index)) != null ? _a3 : "" : "";
+    size = getFixedItemSize(data, index, itemType);
+    if (size !== void 0) {
+      state.sizesKnown.set(key, size);
+    }
+  }
+  return size;
+}
+function getKnownOrFixedItemSize(ctx, index) {
+  const key = getId(ctx.state, index);
+  return getKnownOrFixedSize(ctx, key, index, ctx.state.props.data[index]);
+}
+function areKnownOrFixedItemSizesAvailable(ctx, startIndex, endIndex) {
+  for (let index = startIndex; index <= endIndex; index++) {
+    if (getKnownOrFixedItemSize(ctx, index) === void 0) {
+      return false;
+    }
+  }
+  return true;
+}
 function getItemSize(ctx, key, index, data, useAverageSize, preferCachedSize, notifyTotalSize) {
   var _a3, _b, _c;
   const state = ctx.state;
   const {
-    sizesKnown,
     sizes,
     averageSizes,
-    props: { estimatedItemSize, getFixedItemSize, getItemType },
+    props: { estimatedItemSize, getItemType },
     scrollingTo
   } = state;
-  const sizeKnown = sizesKnown.get(key);
+  const sizeKnown = state.sizesKnown.get(key);
   if (sizeKnown !== void 0) {
     return sizeKnown;
   }
@@ -1805,14 +1856,13 @@ function getItemSize(ctx, key, index, data, useAverageSize, preferCachedSize, no
       return renderedSize;
     }
   }
-  const itemType = getItemType ? (_a3 = getItemType(data, index)) != null ? _a3 : "" : "";
-  if (getFixedItemSize) {
-    size = getFixedItemSize(data, index, itemType);
-    if (size !== void 0) {
-      sizesKnown.set(key, size);
-    }
+  size = getKnownOrFixedSize(ctx, key, index, data);
+  if (size !== void 0) {
+    setSize(ctx, key, size, notifyTotalSize);
+    return size;
   }
-  if (size === void 0 && useAverageSize && sizeKnown === void 0 && !scrollingTo) {
+  const itemType = getItemType ? (_a3 = getItemType(data, index)) != null ? _a3 : "" : "";
+  if (useAverageSize && !scrollingTo) {
     const averageSizeForType = (_b = averageSizes[itemType]) == null ? void 0 : _b.avg;
     if (averageSizeForType !== void 0) {
       size = roundSize(averageSizeForType);
@@ -1821,7 +1871,7 @@ function getItemSize(ctx, key, index, data, useAverageSize, preferCachedSize, no
   if (size === void 0 && renderedSize !== void 0) {
     return renderedSize;
   }
-  if (size === void 0 && useAverageSize && sizeKnown === void 0 && scrollingTo) {
+  if (size === void 0 && useAverageSize && scrollingTo) {
     const averageSizeForType = (_c = scrollingTo.averageSizeSnapshot) == null ? void 0 : _c[itemType];
     if (averageSizeForType !== void 0) {
       size = roundSize(averageSizeForType);
@@ -2574,7 +2624,7 @@ function updateScroll(ctx, newScroll, forceUpdate, options) {
     if (scrollLength > 0 && scrollingTo === void 0 && scrollDelta > scrollLength && !state.pendingNativeMVCPAdjust) {
       state.mvcpAnchorLock = void 0;
       state.pendingNativeMVCPAdjust = void 0;
-      state.userScrollAnchorResetKeys = /* @__PURE__ */ new Set();
+      state.userScrollAnchorReset = { keys: /* @__PURE__ */ new Set() };
       if (state.queuedMVCPRecalculate !== void 0) {
         cancelAnimationFrame(state.queuedMVCPRecalculate);
         state.queuedMVCPRecalculate = void 0;
@@ -4392,7 +4442,7 @@ function handleStickyRecycling(ctx, stickyArray, scroll, drawDistance, currentSt
 function calculateItemsInView(ctx, params = {}) {
   const state = ctx.state;
   batchedUpdates(() => {
-    var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
+    var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
     const {
       columns,
       containerItemKeys,
@@ -4706,7 +4756,7 @@ function calculateItemsInView(ctx, params = {}) {
             state.containerItemTypes.set(containerIndex, requiredItemTypes[idx]);
           }
           containerItemKeys.set(id, containerIndex);
-          (_o = state.userScrollAnchorResetKeys) == null ? void 0 : _o.add(id);
+          (_o = state.userScrollAnchorReset) == null ? void 0 : _o.keys.add(id);
           const containerSticky = `containerSticky${containerIndex}`;
           const isSticky = stickyHeaderIndicesSet.has(i);
           const isAlwaysRender = alwaysRenderSet.has(i);
@@ -4734,13 +4784,17 @@ function calculateItemsInView(ctx, params = {}) {
           }
         }
       }
-      if (((_p = state.userScrollAnchorResetKeys) == null ? void 0 : _p.size) === 0) {
-        state.userScrollAnchorResetKeys = void 0;
+      if (state.userScrollAnchorReset) {
+        if (state.userScrollAnchorReset.keys.size === 0) {
+          state.userScrollAnchorReset = void 0;
+        } else {
+          state.userScrollAnchorReset.batchSize = state.userScrollAnchorReset.keys.size;
+        }
       }
       if (alwaysRenderArr.length > 0) {
         for (const index of alwaysRenderArr) {
           if (index < 0 || index >= dataLength) continue;
-          const id = (_q = idCache[index]) != null ? _q : getId(state, index);
+          const id = (_p = idCache[index]) != null ? _p : getId(state, index);
           const containerIndex = containerItemKeys.get(id);
           if (containerIndex !== void 0) {
             state.stickyContainerPool.add(containerIndex);
@@ -5138,22 +5192,27 @@ var ScrollAdjustHandler = class {
 
 // src/core/updateAnchoredEndSpace.ts
 function maybeUpdateAnchoredEndSpace(ctx) {
-  var _a3;
+  var _a3, _b;
   const state = ctx.state;
   const anchoredEndSpace = state.props.anchoredEndSpace;
   const previousSize = peek$(ctx, "anchoredEndSpaceSize");
+  const previousReadyAnchorIndex = state.anchoredEndSpaceReadyAnchorIndex;
+  const previousReadyAnchorKey = state.anchoredEndSpaceReadyAnchorKey;
+  const nextAnchorIndex = anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorIndex;
+  let nextAnchorKey;
+  let isReady = true;
   let nextSize = 0;
   if (anchoredEndSpace) {
     const { anchorIndex, anchorMaxSize, anchorOffset = 0 } = anchoredEndSpace;
     const { data } = state.props;
     if (anchorIndex >= 0 && anchorIndex < data.length && state.scrollLength > 0) {
+      nextAnchorKey = getId(state, anchorIndex);
       let contentBelowAnchor = 0;
       const footerSize = ctx.values.get("footerSize") || 0;
       const stylePaddingBottom = state.props.stylePaddingBottom || 0;
       let hasUnknownTailSize = false;
       for (let index = anchorIndex; index < data.length; index++) {
-        const itemKey = getId(state, index);
-        const size = itemKey ? state.sizesKnown.get(itemKey) : void 0;
+        const size = getKnownOrFixedItemSize(ctx, index);
         const effectiveSize = index === anchorIndex && anchorMaxSize !== void 0 ? Math.min(size || 0, Math.max(0, anchorMaxSize)) : size;
         if (size === void 0) {
           hasUnknownTailSize = true;
@@ -5163,15 +5222,25 @@ function maybeUpdateAnchoredEndSpace(ctx) {
         }
       }
       contentBelowAnchor += footerSize + stylePaddingBottom;
+      isReady = !hasUnknownTailSize;
       nextSize = hasUnknownTailSize ? previousSize || 0 : Math.max(0, state.scrollLength - contentBelowAnchor - anchorOffset);
+    } else if (anchorIndex >= 0) {
+      isReady = false;
     }
   }
-  if (previousSize !== nextSize) {
-    set$(ctx, "anchoredEndSpaceSize", nextSize);
-    (_a3 = anchoredEndSpace == null ? void 0 : anchoredEndSpace.onSizeChanged) == null ? void 0 : _a3.call(anchoredEndSpace, nextSize);
-    if (anchoredEndSpace == null ? void 0 : anchoredEndSpace.includeInEndInset) {
+  const didSizeChange = previousSize !== nextSize;
+  const didReadyAnchorChange = previousReadyAnchorIndex !== nextAnchorIndex || previousReadyAnchorKey !== nextAnchorKey;
+  if (isReady && (didSizeChange || didReadyAnchorChange)) {
+    state.anchoredEndSpaceReadyAnchorIndex = nextAnchorIndex;
+    state.anchoredEndSpaceReadyAnchorKey = nextAnchorKey;
+    if (didSizeChange) {
+      set$(ctx, "anchoredEndSpaceSize", nextSize);
+      (_a3 = anchoredEndSpace == null ? void 0 : anchoredEndSpace.onSizeChanged) == null ? void 0 : _a3.call(anchoredEndSpace, nextSize);
+    }
+    if (didSizeChange && (anchoredEndSpace == null ? void 0 : anchoredEndSpace.includeInEndInset)) {
       updateScroll(ctx, state.scroll, true);
     }
+    (_b = anchoredEndSpace == null ? void 0 : anchoredEndSpace.onReady) == null ? void 0 : _b.call(anchoredEndSpace, { anchorIndex: nextAnchorIndex, anchorKey: nextAnchorKey, size: nextSize });
   }
   return nextSize;
 }
@@ -5194,37 +5263,42 @@ function updateContentInsetEndAdjustment(ctx, previousContentInsetEndAdjustment)
 
 // src/core/updateItemSize.ts
 function runOrScheduleMVCPRecalculate(ctx) {
+  var _a3, _b;
   const state = ctx.state;
-  if (state.userScrollAnchorResetKeys !== void 0) {
-    if (state.queuedMVCPRecalculate !== void 0) {
-      return;
-    }
-    state.queuedMVCPRecalculate = requestAnimationFrame(() => {
-      var _a3;
-      state.queuedMVCPRecalculate = void 0;
+  if (state.userScrollAnchorReset !== void 0) {
+    const replacementBatchSize = (_a3 = state.userScrollAnchorReset.batchSize) != null ? _a3 : state.userScrollAnchorReset.keys.size;
+    const replacementMeasurementBatchThreshold = 3;
+    const shouldBatchReplacementMeasurements = replacementBatchSize > replacementMeasurementBatchThreshold;
+    if (shouldBatchReplacementMeasurements) {
+      if (state.queuedMVCPRecalculate === void 0) {
+        state.queuedMVCPRecalculate = requestAnimationFrame(() => {
+          var _a4;
+          state.queuedMVCPRecalculate = void 0;
+          calculateItemsInView(ctx);
+          if (((_a4 = state.userScrollAnchorReset) == null ? void 0 : _a4.keys.size) === 0) {
+            state.userScrollAnchorReset = void 0;
+          }
+        });
+      }
+    } else {
       calculateItemsInView(ctx);
-      if (((_a3 = state.userScrollAnchorResetKeys) == null ? void 0 : _a3.size) === 0) {
-        state.userScrollAnchorResetKeys = void 0;
+      if (((_b = state.userScrollAnchorReset) == null ? void 0 : _b.keys.size) === 0) {
+        state.userScrollAnchorReset = void 0;
       }
-    });
-    return;
-  }
-  if (Platform.OS === "web") {
+    }
+  } else if (Platform.OS === "web") {
     if (!state.mvcpAnchorLock) {
       if (state.queuedMVCPRecalculate !== void 0) {
         cancelAnimationFrame(state.queuedMVCPRecalculate);
         state.queuedMVCPRecalculate = void 0;
       }
       calculateItemsInView(ctx, { doMVCP: true });
-      return;
-    }
-    if (state.queuedMVCPRecalculate !== void 0) {
-      return;
+    } else if (state.queuedMVCPRecalculate === void 0) {
+      state.queuedMVCPRecalculate = requestAnimationFrame(() => {
+        state.queuedMVCPRecalculate = void 0;
+        calculateItemsInView(ctx, { doMVCP: true });
+      });
     }
-    state.queuedMVCPRecalculate = requestAnimationFrame(() => {
-      state.queuedMVCPRecalculate = void 0;
-      calculateItemsInView(ctx, { doMVCP: true });
-    });
   } else {
     calculateItemsInView(ctx, { doMVCP: true });
   }
@@ -5242,8 +5316,8 @@ function updateOtherAxisSizeIfNeeded(ctx, sizeObj, horizontal) {
 function updateItemSize(ctx, itemKey, sizeObj) {
   var _a3;
   const state = ctx.state;
-  const userScrollAnchorResetKeys = state.userScrollAnchorResetKeys;
-  const didMeasureUserScrollAnchorResetItem = !!(userScrollAnchorResetKeys == null ? void 0 : userScrollAnchorResetKeys.delete(itemKey));
+  const userScrollAnchorReset = state.userScrollAnchorReset;
+  const didMeasureUserScrollAnchorResetItem = !!(userScrollAnchorReset == null ? void 0 : userScrollAnchorReset.keys.delete(itemKey));
   const {
     didContainersLayout,
     sizesKnown,
@@ -5299,8 +5373,8 @@ function updateItemSize(ctx, itemKey, sizeObj) {
     if (needsRecalculate) {
       state.scrollForNextCalculateItemsInView = void 0;
       runOrScheduleMVCPRecalculate(ctx);
-    } else if (didMeasureUserScrollAnchorResetItem && (userScrollAnchorResetKeys == null ? void 0 : userScrollAnchorResetKeys.size) === 0) {
-      state.userScrollAnchorResetKeys = void 0;
+    } else if (didMeasureUserScrollAnchorResetItem && (userScrollAnchorReset == null ? void 0 : userScrollAnchorReset.keys.size) === 0) {
+      state.userScrollAnchorReset = void 0;
     }
     if (shouldMaintainScrollAtEnd) {
       if (maintainScrollAtEnd == null ? void 0 : maintainScrollAtEnd.onItemLayout) {
@@ -5310,7 +5384,7 @@ function updateItemSize(ctx, itemKey, sizeObj) {
   }
 }
 function updateOneItemSize(ctx, itemKey, sizeObj) {
-  var _a3;
+  var _a3, _b;
   const state = ctx.state;
   const {
     indexByKey,
@@ -5320,13 +5394,23 @@ function updateOneItemSize(ctx, itemKey, sizeObj) {
   } = state;
   if (!data) return 0;
   const index = indexByKey.get(itemKey);
-  const prevSize = getItemSize(ctx, itemKey, index, data[index]);
+  const itemData = data[index];
+  let itemType;
+  let fixedItemSize;
+  if (getFixedItemSize) {
+    itemType = getItemType ? (_a3 = getItemType(itemData, index)) != null ? _a3 : "" : "";
+    fixedItemSize = getFixedItemSize(itemData, index, itemType);
+  }
+  const prevSize = getItemSize(ctx, itemKey, index, itemData);
   const rawSize = horizontal ? sizeObj.width : sizeObj.height;
-  const size = Platform.OS === "web" ? Math.round(rawSize) : roundSize(rawSize);
   const prevSizeKnown = sizesKnown.get(itemKey);
+  if (Platform.OS !== "web" && prevSizeKnown !== void 0 && isNativeLayoutNoise(rawSize - prevSizeKnown)) {
+    return 0;
+  }
+  const size = Platform.OS === "web" ? Math.round(rawSize) : roundSize(rawSize);
   sizesKnown.set(itemKey, size);
-  if (!getFixedItemSize && size > 0) {
-    const itemType = getItemType ? (_a3 = getItemType(data[index], index)) != null ? _a3 : "" : "";
+  if (fixedItemSize === void 0 && size > 0) {
+    itemType != null ? itemType : itemType = getItemType ? (_b = getItemType(itemData, index)) != null ? _b : "" : "";
     let averages = averageSizes[itemType];
     if (!averages) {
       averages = averageSizes[itemType] = { avg: 0, num: 0 };
@@ -5407,6 +5491,25 @@ function createColumnWrapperStyle(contentContainerStyle) {
   }
 }
 
+// src/core/scrollToEnd.ts
+function scrollToEnd(ctx, options) {
+  const state = ctx.state;
+  const data = state.props.data;
+  const index = data.length - 1;
+  if (index === -1) {
+    return false;
+  }
+  const paddingBottom = state.props.stylePaddingBottom || 0;
+  const footerSize = peek$(ctx, "footerSize") || 0;
+  scrollToIndex(ctx, {
+    ...options,
+    index,
+    viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
+    viewPosition: 1
+  });
+  return true;
+}
+
 // src/utils/createImperativeHandle.ts
 var DEFAULT_AVERAGE_ITEM_SIZE_TYPE = "default";
 function getAverageItemSizes(state) {
@@ -5422,7 +5525,7 @@ function getAverageItemSizes(state) {
   }
   return averageItemSizes;
 }
-function createImperativeHandle(ctx) {
+function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
   const state = ctx.state;
   const IMPERATIVE_SCROLL_SETTLE_MAX_WAIT_MS = 800;
   const IMPERATIVE_SCROLL_SETTLE_STABLE_FRAMES = 2;
@@ -5439,15 +5542,10 @@ function createImperativeHandle(ctx) {
     if (targetIndex >= dataLength) {
       return false;
     }
-    if (anchorIndex === void 0 || anchorIndex < 0 || anchorIndex >= dataLength || targetIndex < anchorIndex || props.getFixedItemSize) {
+    if (anchorIndex === void 0 || anchorIndex < 0 || anchorIndex >= dataLength || targetIndex < anchorIndex) {
       return true;
     }
-    for (let index = anchorIndex; index < dataLength; index++) {
-      if (!state.sizesKnown.has(getId(state, index))) {
-        return false;
-      }
-    }
-    return true;
+    return areKnownOrFixedItemSizesAvailable(ctx, anchorIndex, dataLength - 1);
   };
   const runWhenReady = (token, run, isReady) => {
     const startedAt = Date.now();
@@ -5470,11 +5568,7 @@ function createImperativeHandle(ctx) {
     };
     requestAnimationFrame(check);
   };
-  const runScrollWithPromise = (run, isReady = () => true) => new Promise((resolve) => {
-    var _a3;
-    const token = ++imperativeScrollToken;
-    (_a3 = state.pendingScrollResolve) == null ? void 0 : _a3.call(state);
-    state.pendingScrollResolve = resolve;
+  const runScrollRequest = (token, resolve, run, isReady = () => true) => {
     const runNow = () => {
       if (token !== imperativeScrollToken) {
         return;
@@ -5492,7 +5586,33 @@ function createImperativeHandle(ctx) {
     } else {
       runNow();
     }
+  };
+  const startImperativeScroll = (resolve) => {
+    var _a3;
+    const token = ++imperativeScrollToken;
+    state.pendingScrollToEnd = void 0;
+    (_a3 = state.pendingScrollResolve) == null ? void 0 : _a3.call(state);
+    state.pendingScrollResolve = resolve;
+    return token;
+  };
+  const runScrollWithPromise = (run, isReady = () => true) => new Promise((resolve) => {
+    const token = startImperativeScroll(resolve);
+    runScrollRequest(token, resolve, run, isReady);
   });
+  state.runPendingScrollToEnd = () => {
+    const pendingScroll = state.pendingScrollToEnd;
+    if (pendingScroll) {
+      state.pendingScrollToEnd = void 0;
+      if (pendingScroll.token === imperativeScrollToken) {
+        runScrollRequest(
+          pendingScroll.token,
+          pendingScroll.resolve,
+          () => scrollToEnd(ctx, pendingScroll.options),
+          () => isScrollToIndexReady(state.props.data.length - 1, true)
+        );
+      }
+    }
+  };
   const scrollIndexIntoView = (options) => {
     if (state) {
       const { index, ...rest } = options;
@@ -5591,26 +5711,20 @@ function createImperativeHandle(ctx) {
       }
       return false;
     }),
-    scrollToEnd: (options) => runScrollWithPromise(
-      () => {
-        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, {
-            ...options,
-            index,
-            viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
-            viewPosition: 1
-          });
-          return true;
-        }
-        return false;
-      },
-      () => isScrollToIndexReady(state.props.data.length - 1, true)
-    ),
+    scrollToEnd: (options) => new Promise((resolve) => {
+      var _a3;
+      const token = startImperativeScroll(resolve);
+      state.pendingScrollToEnd = {
+        options,
+        resolve,
+        token
+      };
+      if (scheduleImperativeScrollCommit) {
+        scheduleImperativeScrollCommit();
+      } else {
+        (_a3 = state.runPendingScrollToEnd) == null ? void 0 : _a3.call(state);
+      }
+    }),
     scrollToIndex: (params) => {
       return runScrollWithPromise(
         () => {
@@ -5980,6 +6094,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     viewOffset: 0
   } : void 0;
   const [canRender, setCanRender] = React2.useState(!IsNewArchitecture);
+  const [, scheduleImperativeScrollCommit] = React2.useReducer((value) => value + 1, 0);
   const ctx = useStateContext();
   ctx.columnWrapperStyle = columnWrapperStyle || (contentContainerStyle ? createColumnWrapperStyle(contentContainerStyle) : void 0);
   const refScroller = useRef(null);
@@ -6352,7 +6467,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       doInitialAllocateContainers(ctx);
     }
   });
-  useImperativeHandle(forwardedRef, () => createImperativeHandle(ctx), []);
+  useImperativeHandle(forwardedRef, () => createImperativeHandle(ctx, scheduleImperativeScrollCommit), []);
+  useLayoutEffect(() => {
+    var _a4;
+    (_a4 = state.runPendingScrollToEnd) == null ? void 0 : _a4.call(state);
+  });
   useEffect(() => {
     if (Platform.OS !== "web" || usesBootstrapInitialScroll) {
       return;

package/react-native.web.d.ts

@@ -417,12 +417,22 @@ interface MaintainVisibleContentPositionConfig<ItemT = any> {
     size?: boolean;
     shouldRestorePosition?: (item: ItemT, index: number, data: readonly ItemT[]) => boolean;
 }
+interface AnchoredEndSpaceReadyInfo {
+    anchorIndex: number | undefined;
+    anchorKey: string | undefined;
+    size: number;
+}
+interface ScrollToEndOptions {
+    animated?: boolean;
+    viewOffset?: number;
+}
 interface AnchoredEndSpaceConfig$1 {
     anchorIndex: number;
     anchorOffset?: number;
     anchorMaxSize?: number;
     includeInEndInset?: boolean;
     onSizeChanged?: (size: number) => void;
+    onReady?: (info: AnchoredEndSpaceReadyInfo) => void;
 }
 interface StickyHeaderConfig {
     /**
@@ -554,10 +564,7 @@ type LegendListRef$1 = {
      * @param options.animated - If true, animates the scroll. Default: true.
      * @param options.viewOffset - Offset from the target position.
      */
-    scrollToEnd(options?: {
-        animated?: boolean | undefined;
-        viewOffset?: number | undefined;
-    }): Promise<void>;
+    scrollToEnd(options?: ScrollToEndOptions): Promise<void>;
     /**
      * Scrolls to a specific index in the list.
      * @param params - Parameters for scrolling.