@legendapp/list 1.0.14 → 1.0.16

package/index.js

@@ -120,6 +120,12 @@ function useArr$(signalNames) {
   const value = shim.useSyncExternalStore(subscribe, get);
   return value;
 }
+function useSelector$(signalName, selector) {
+  const ctx = React2__namespace.useContext(ContextState);
+  const { subscribe, get } = React2__namespace.useMemo(() => createSelectorFunctionsArr(ctx, [signalName]), [ctx, signalName]);
+  const value = shim.useSyncExternalStore(subscribe, () => selector(get()[0]));
+  return value;
+}
 
 // src/DebugView.tsx
 var DebugRow = ({ children }) => {
@@ -167,7 +173,7 @@ var DebugView = React2__namespace.memo(function DebugView2({ state }) {
     },
     /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "TotalSize:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, totalSize.toFixed(2))),
     /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "ContentSize:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, contentSize.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "At end:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, String(state.isAtBottom))),
+    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "At end:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, String(state.isAtEnd))),
     /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null),
     /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "ScrollAdjust:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, scrollAdjust.toFixed(2))),
     /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "TotalSizeReal: "), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, totalSizeWithScrollAdjust.toFixed(2))),
@@ -194,9 +200,6 @@ function warnDevOnce(id, text) {
     console.warn(`[legend-list] ${text}`);
   }
 }
-function roundSize(size) {
-  return Math.floor(size * 8) / 8;
-}
 function isNullOrUndefined(value) {
   return value === null || value === void 0;
 }
@@ -308,6 +311,11 @@ function useRecyclingState(valueOrFun) {
   );
   return [refState.current.value, setState];
 }
+function useIsLastItem() {
+  const { itemKey } = React2.useContext(ContextContainer);
+  const isLast = useSelector$("lastItemKeys", (lastItemKeys) => (lastItemKeys == null ? void 0 : lastItemKeys.includes(itemKey)) || false);
+  return isLast;
+}
 var LeanViewComponent = React2__namespace.forwardRef((props, ref) => {
   return React2__namespace.createElement("RCTView", { ...props, ref });
 });
@@ -366,12 +374,12 @@ var Container = ({
     if (horizontal) {
       paddingStyles = {
         paddingRight: !lastItemKeys.includes(itemKey) ? columnGap || gap || void 0 : void 0,
-        paddingVertical: (rowGap || gap || 0) / 2
+        paddingVertical: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
       };
     } else {
       paddingStyles = {
         paddingBottom: !lastItemKeys.includes(itemKey) ? rowGap || gap || void 0 : void 0,
-        paddingHorizontal: (columnGap || gap || 0) / 2
+        paddingHorizontal: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
       };
     }
   }
@@ -379,7 +387,6 @@ var Container = ({
     flexDirection: ItemSeparatorComponent ? "row" : void 0,
     position: "absolute",
     top: otherAxisPos,
-    bottom: numColumns > 1 ? null : 0,
     height: otherAxisSize,
     left: position.relativeCoordinate,
     ...paddingStyles || {}
@@ -402,17 +409,17 @@ var Container = ({
   const onLayout = (event) => {
     var _a, _b;
     if (!isNullOrUndefined(itemKey)) {
-      const layout = event.nativeEvent.layout;
-      let size = roundSize(layout[horizontal ? "width" : "height"]);
+      let layout = event.nativeEvent.layout;
+      const size = layout[horizontal ? "width" : "height"];
       const doUpdate = () => {
-        refLastSize.current = size;
-        updateItemSize(itemKey, size);
+        refLastSize.current = { width: layout.width, height: layout.height };
+        updateItemSize(itemKey, layout);
       };
       if (IsNewArchitecture || size > 0) {
         doUpdate();
       } else {
         (_b = (_a = ref.current) == null ? void 0 : _a.measure) == null ? void 0 : _b.call(_a, (x, y, width, height) => {
-          size = roundSize(horizontal ? width : height);
+          layout = { width, height };
           doUpdate();
         });
       }
@@ -426,7 +433,7 @@ var Container = ({
         if (measured) {
           const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
           if (size) {
-            updateItemSize(itemKey, size);
+            updateItemSize(itemKey, measured);
           }
         }
       }
@@ -451,7 +458,7 @@ var Container = ({
   }, [id, itemKey, index, data]);
   const contentFragment = /* @__PURE__ */ React2__namespace.default.createElement(React2__namespace.default.Fragment, { key: recycleItems ? void 0 : itemKey }, /* @__PURE__ */ React2__namespace.default.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && !lastItemKeys.includes(itemKey) && /* @__PURE__ */ React2__namespace.default.createElement(ItemSeparatorComponent, { leadingItem: renderedItemInfo.item })));
   if (maintainVisibleContentPosition) {
-    const anchorStyle = position.type === "top" ? { position: "absolute", top: 0, left: 0, right: 0 } : { position: "absolute", bottom: 0, left: 0, right: 0 };
+    const anchorStyle = horizontal ? position.type === "top" ? { position: "absolute", left: 0, top: 0, bottom: 0, flexDirection: "row", alignItems: "stretch" } : { position: "absolute", right: 0, top: 0, bottom: 0, flexDirection: "row", alignItems: "stretch" } : position.type === "top" ? { position: "absolute", top: 0, left: 0, right: 0 } : { position: "absolute", bottom: 0, left: 0, right: 0 };
     if (__DEV__ && ENABLE_DEVMODE) {
       anchorStyle.borderColor = position.type === "top" ? "red" : "blue";
       anchorStyle.borderWidth = 1;
@@ -500,7 +507,7 @@ var Containers = typedMemo(function Containers2({
 }) {
   const ctx = useStateContext();
   const columnWrapperStyle = ctx.columnWrapperStyle;
-  const [numContainers] = useArr$(["numContainersPooled"]);
+  const [numContainers, numColumns] = useArr$(["numContainersPooled", "numColumns"]);
   const animSize = useValue$(
     "totalSizeWithScrollAdjust",
     void 0,
@@ -508,6 +515,12 @@ var Containers = typedMemo(function Containers2({
     true
   );
   const animOpacity = waitForInitialLayout ? useValue$("containersDidLayout", (value) => value ? 1 : 0) : void 0;
+  const otherAxisSize = useValue$(
+    "otherAxisSize",
+    void 0,
+    /*useMicrotask*/
+    true
+  );
   const containers = [];
   for (let i = 0; i < numContainers; i++) {
     containers.push(
@@ -525,8 +538,8 @@ var Containers = typedMemo(function Containers2({
       )
     );
   }
-  const style = horizontal ? { width: animSize, opacity: animOpacity } : { height: animSize, opacity: animOpacity };
-  if (columnWrapperStyle) {
+  const style = horizontal ? { width: animSize, opacity: animOpacity, minHeight: otherAxisSize } : { height: animSize, opacity: animOpacity, minWidth: otherAxisSize };
+  if (columnWrapperStyle && numColumns > 1) {
     const { columnGap, rowGap, gap } = columnWrapperStyle;
     if (horizontal) {
       const my = (rowGap || gap || 0) / 2;
@@ -549,11 +562,14 @@ function ListHeaderComponentContainer({
   horizontal,
   waitForInitialLayout
 }) {
-  const scrollAdjust = useValue$("scrollAdjust", (v) => v, true);
+  var _a;
+  const hasData = ((_a = peek$(ctx, "lastItemKeys")) == null ? void 0 : _a.length) > 0;
+  const scrollAdjust = useValue$("scrollAdjust", (v) => v != null ? v : 0, true);
   const animOpacity = waitForInitialLayout ? useValue$("containersDidLayout", (value) => value ? 1 : 0) : void 0;
   const additionalSize = {
     transform: [{ translateY: reactNative.Animated.multiply(scrollAdjust, -1) }],
-    opacity: animOpacity
+    // Header should show if there's no data yet, but containersDidLayout will be false until it has some data
+    opacity: hasData ? animOpacity : 1
   };
   return /* @__PURE__ */ React2__namespace.createElement(
     reactNative.Animated.View,
@@ -650,9 +666,6 @@ var ListComponent = typedMemo(function ListComponent2({
   refScrollView,
   maintainVisibleContentPosition,
   renderScrollComponent,
-  onRefresh,
-  refreshing,
-  progressViewOffset,
   ...rest
 }) {
   const ctx = useStateContext();
@@ -1026,6 +1039,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     onViewableItemsChanged,
     ...rest
   } = props;
+  const refLoadStartTime = React2.useRef(Date.now());
   const callbacks = React2.useRef({
     onStartReached: rest.onStartReached,
     onEndReached: rest.onEndReached
@@ -1060,20 +1074,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   };
   const getItemSize = (key, index, data, useAverageSize = false) => {
     const state = refState.current;
-    const sizeKnown = state.sizesKnown.get(key);
+    state.sizesKnown.get(key);
     const sizePrevious = state.sizes.get(key);
     let size;
-    const numColumns = peek$(ctx, "numColumns");
-    if (sizeKnown === void 0 && !getEstimatedItemSize && numColumns === 1 && useAverageSize) {
-      const itemType = "";
-      const average = state.averageSizes[itemType];
-      if (average) {
-        size = roundSize(average.avg);
-        if (size !== sizePrevious) {
-          addTotalSize(key, size - sizePrevious, 0);
-        }
-      }
-    }
+    peek$(ctx, "numColumns");
     if (size === void 0 && sizePrevious !== void 0) {
       return sizePrevious;
     }
@@ -1094,7 +1098,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       if (canGetSize || getEstimatedItemSize) {
         const sizeFn = (index2) => {
           if (canGetSize) {
-            return getItemSize(getId(index2), index2, data[index2]);
+            return getItemSize(getId(index2), index2, data[index2], true);
           }
           return getEstimatedItemSize(index2, data[index2]);
         };
@@ -1121,8 +1125,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       pendingAdjust: 0,
       isStartReached: initialContentOffset < initialScrollLength * onStartReachedThreshold,
       isEndReached: false,
-      isAtBottom: false,
-      isAtTop: false,
+      isAtEnd: false,
+      isAtStart: false,
       data: dataProp,
       scrollLength: initialScrollLength,
       startBuffered: -1,
@@ -1207,6 +1211,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       index = 0;
     }
     const firstIndexOffset = calculateOffsetForIndex(index);
+    const isLast = index === state.data.length - 1;
+    if (isLast && viewPosition !== void 0) {
+      viewPosition = 1;
+    }
     let firstIndexScrollPostion = firstIndexOffset - viewOffset;
     const diff = Math.abs(state.scroll - firstIndexScrollPostion);
     const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
@@ -1222,14 +1230,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       state.minIndexSizeChanged = index;
       firstIndexScrollPostion = firstIndexOffset - viewOffset + state.scrollAdjustHandler.getAppliedAdjust();
     }
-    if (viewPosition) {
-      firstIndexScrollPostion -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
-    }
-    scrollTo(firstIndexScrollPostion, animated);
+    scrollTo({ offset: firstIndexScrollPostion, animated, index, viewPosition, viewOffset });
   };
   const setDidLayout = () => {
     refState.current.queuedInitialLayout = true;
     checkAtBottom();
+    const setIt = () => {
+      set$(ctx, "containersDidLayout", true);
+      if (props.onLoad) {
+        props.onLoad({ elapsedTimeInMs: Date.now() - refLoadStartTime.current });
+      }
+    };
     if (initialScrollIndex) {
       queueMicrotask(() => {
         scrollToIndex({ index: initialScrollIndex, animated: false });
@@ -1237,13 +1248,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           if (!IsNewArchitecture) {
             scrollToIndex({ index: initialScrollIndex, animated: false });
           }
-          set$(ctx, "containersDidLayout", true);
+          setIt();
         });
       });
     } else {
-      queueMicrotask(() => {
-        set$(ctx, "containersDidLayout", true);
-      });
+      queueMicrotask(setIt);
     }
   };
   const addTotalSize = React2.useCallback((key, add, totalSizeBelowAnchor) => {
@@ -1329,7 +1338,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   };
   const disableScrollJumps = (timeout) => {
     const state = refState.current;
-    if (state.scrollingToOffset === void 0) {
+    if (state.scrollingTo === void 0) {
       state.disableScrollJumpsFrom = state.scroll - state.scrollAdjustHandler.getAppliedAdjust();
       state.scrollHistory.length = 0;
       setTimeout(() => {
@@ -1375,10 +1384,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           });
           numMeasurements++;
           if (measured) {
-            const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
             updateItemSize(
               itemKey,
-              size,
+              measured,
               /*fromFixGaps*/
               true
             );
@@ -1476,13 +1484,15 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         scrollBufferBottom = scrollBuffer * 0.1;
       }
     }
+    const scrollTopBuffered = scroll - scrollBufferTop;
+    const scrollBottom = scroll + scrollLength;
+    const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
     if (state.scrollForNextCalculateItemsInView) {
       const { top: top2, bottom } = state.scrollForNextCalculateItemsInView;
-      if (scroll > top2 && scroll < bottom) {
+      if (scrollTopBuffered > top2 && scrollBottomBuffered < bottom) {
         return;
       }
     }
-    const scrollBottom = scroll + scrollLength;
     let startNoBuffer = null;
     let startBuffered = null;
     let startBufferedId = null;
@@ -1562,7 +1572,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         if (startNoBuffer === null && top + size > scroll) {
           startNoBuffer = i;
         }
-        if (startBuffered === null && top + size > scroll - scrollBufferTop) {
+        if (startBuffered === null && top + size > scrollTopBuffered) {
           startBuffered = i;
           startBufferedId = id;
           nextTop = top;
@@ -1571,7 +1581,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           if (top <= scrollBottom) {
             endNoBuffer = i;
           }
-          if (top <= scrollBottom + scrollBufferBottom) {
+          if (top <= scrollBottomBuffered) {
             endBuffered = i;
             nextBottom = top + maxSizeInRow - scrollLength;
           } else {
@@ -1731,18 +1741,26 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const finishScrollTo = () => {
     const state = refState.current;
     if (state) {
-      state.scrollingToOffset = void 0;
+      state.scrollingTo = void 0;
       state.scrollAdjustHandler.setDisableAdjust(false);
       state.scrollHistory.length = 0;
       calculateItemsInView();
     }
   };
-  const scrollTo = (offset, animated) => {
+  const scrollTo = (params = {}) => {
     var _a;
     const state = refState.current;
+    const { animated, index, viewPosition, viewOffset } = params;
+    let { offset } = params;
+    if (viewOffset) {
+      offset -= viewOffset;
+    }
+    if (viewPosition !== void 0 && index !== void 0) {
+      offset -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
+    }
     state.scrollAdjustHandler.setDisableAdjust(true);
     state.scrollHistory.length = 0;
-    state.scrollingToOffset = offset;
+    state.scrollingTo = params;
     (_a = refScroller.current) == null ? void 0 : _a.scrollTo({
       x: horizontal ? offset : 0,
       y: horizontal ? 0 : offset,
@@ -1754,7 +1772,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   };
   const doMaintainScrollAtEnd = (animated) => {
     const state = refState.current;
-    if ((state == null ? void 0 : state.isAtBottom) && maintainScrollAtEnd && peek$(ctx, "containersDidLayout")) {
+    if ((state == null ? void 0 : state.isAtEnd) && maintainScrollAtEnd && peek$(ctx, "containersDidLayout")) {
       const paddingTop = peek$(ctx, "alignItemsPaddingTop");
       if (paddingTop > 0) {
         state.scroll = 0;
@@ -1803,9 +1821,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     const contentSize = getContentSize(ctx);
     if (contentSize > 0 && queuedInitialLayout && !maintainingScrollAtEnd) {
       const distanceFromEnd = contentSize - scroll - scrollLength;
-      const distanceFromEndAbs = Math.abs(distanceFromEnd);
       const isContentLess = contentSize < scrollLength;
-      refState.current.isAtBottom = isContentLess || distanceFromEndAbs < scrollLength * maintainScrollAtEndThreshold;
+      refState.current.isAtEnd = isContentLess || distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
       refState.current.isEndReached = checkThreshold(
         distanceFromEnd,
         isContentLess,
@@ -1828,7 +1845,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }
     const { scrollLength, scroll } = refState.current;
     const distanceFromTop = scroll;
-    refState.current.isAtTop = distanceFromTop <= 0;
+    refState.current.isAtStart = distanceFromTop <= 0;
     refState.current.isStartReached = checkThreshold(
       distanceFromTop,
       false,
@@ -1860,8 +1877,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         for (let i = 0; i < numContainers; i++) {
           const itemKey = peek$(ctx, `containerItemKey${i}`);
           if (!keyExtractorProp || itemKey && state.indexByKey.get(itemKey) === void 0) {
-            set$(ctx, `containerItemKey${i}`, null);
-            set$(ctx, `containerItemData${i}`, null);
+            set$(ctx, `containerItemKey${i}`, void 0);
+            set$(ctx, `containerItemData${i}`, void 0);
             set$(ctx, `containerPosition${i}`, ANCHORED_POSITION_OUT_OF_VIEW);
             set$(ctx, `containerColumn${i}`, -1);
           }
@@ -1923,7 +1940,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
             };
             state.anchorElement = newAnchorElement;
             (_b = state.belowAnchorElementPositions) == null ? void 0 : _b.clear();
-            scrollTo(0, false);
+            scrollTo({ offset: 0, animated: false });
             setTimeout(() => {
               calculateItemsInView(
                 /*reset*/
@@ -1941,7 +1958,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           } else {
             state.startBufferedId = void 0;
           }
-          scrollTo(0, false);
+          scrollTo({ offset: 0, animated: false });
           setTimeout(() => {
             calculateItemsInView(
               /*reset*/
@@ -2049,7 +2066,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     const paddingDiff = stylePaddingTopState - prevPaddingTop;
     if (paddingDiff && prevPaddingTop !== void 0 && reactNative.Platform.OS === "ios") {
       queueMicrotask(() => {
-        scrollTo(refState.current.scroll + paddingDiff, false);
+        scrollTo({ offset: refState.current.scroll + paddingDiff, animated: false });
       });
     }
   };
@@ -2084,7 +2101,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   refState.current.renderItem = renderItem;
   React2.useEffect(initalizeStateVars, [memoizedLastItemKeys.join(","), numColumnsProp, stylePaddingTopState]);
   const getRenderedItem = React2.useCallback((key) => {
-    var _a, _b;
     const state = refState.current;
     if (!state) {
       return null;
@@ -2094,11 +2110,16 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     if (index === void 0) {
       return null;
     }
-    const renderedItem = (_b = (_a = refState.current).renderItem) == null ? void 0 : _b.call(_a, {
-      item: data[index],
-      index,
-      extraData: peek$(ctx, "extraData")
-    });
+    const renderItemProp = refState.current.renderItem;
+    let renderedItem = null;
+    if (renderItemProp) {
+      const itemProps = {
+        item: data[index],
+        index,
+        extraData: peek$(ctx, "extraData")
+      };
+      renderedItem = isFunction(renderItemProp) ? renderItemProp(itemProps) : React2__namespace.createElement(renderItemProp, itemProps);
+    }
     return { index, item: data[index], renderedItem };
   }, []);
   const doInitialAllocateContainers = () => {
@@ -2142,120 +2163,130 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   useInit(() => {
     doInitialAllocateContainers();
   });
-  const updateItemSize = React2.useCallback((itemKey, size, fromFixGaps) => {
-    const state = refState.current;
-    const {
-      sizes,
-      indexByKey,
-      sizesKnown,
-      data,
-      rowHeights,
-      startBuffered,
-      endBuffered,
-      averageSizes,
-      queuedInitialLayout
-    } = state;
-    if (!data) {
-      return;
-    }
-    const index = indexByKey.get(itemKey);
-    const numColumns = peek$(ctx, "numColumns");
-    state.scrollForNextCalculateItemsInView = void 0;
-    state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, index) : index;
-    const prevSize = getItemSize(itemKey, index, data);
-    const prevSizeKnown = sizesKnown.get(itemKey);
-    let needsCalculate = false;
-    let needsUpdateContainersDidLayout = false;
-    sizesKnown.set(itemKey, size);
-    const itemType = "";
-    let averages = averageSizes[itemType];
-    if (!averages) {
-      averages = averageSizes[itemType] = {
-        num: 0,
-        avg: 0
-      };
-    }
-    averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
-    averages.num++;
-    if (!prevSize || Math.abs(prevSize - size) > 0.1) {
-      let diff;
-      needsCalculate = true;
-      if (numColumns > 1) {
-        const rowNumber = Math.floor(index / numColumnsProp);
-        const prevSizeInRow = getRowHeight(rowNumber);
-        sizes.set(itemKey, size);
-        rowHeights.delete(rowNumber);
-        const sizeInRow = getRowHeight(rowNumber);
-        diff = sizeInRow - prevSizeInRow;
-      } else {
-        sizes.set(itemKey, size);
-        diff = size - prevSize;
+  const updateItemSize = React2.useCallback(
+    (itemKey, sizeObj, fromFixGaps) => {
+      const state = refState.current;
+      const {
+        sizes,
+        indexByKey,
+        sizesKnown,
+        data,
+        rowHeights,
+        startBuffered,
+        endBuffered,
+        averageSizes,
+        queuedInitialLayout
+      } = state;
+      if (!data) {
+        return;
+      }
+      const index = indexByKey.get(itemKey);
+      const numColumns = peek$(ctx, "numColumns");
+      state.scrollForNextCalculateItemsInView = void 0;
+      state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, index) : index;
+      const prevSize = getItemSize(itemKey, index, data);
+      const prevSizeKnown = sizesKnown.get(itemKey);
+      let needsCalculate = false;
+      let needsUpdateContainersDidLayout = false;
+      const size = Math.floor((horizontal ? sizeObj.width : sizeObj.height) * 8) / 8;
+      sizesKnown.set(itemKey, size);
+      const itemType = "";
+      let averages = averageSizes[itemType];
+      if (!averages) {
+        averages = averageSizes[itemType] = {
+          num: 0,
+          avg: 0
+        };
       }
-      if (__DEV__ && suggestEstimatedItemSize) {
-        if (state.timeoutSizeMessage) {
-          clearTimeout(state.timeoutSizeMessage);
+      averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
+      averages.num++;
+      if (!prevSize || Math.abs(prevSize - size) > 0.1) {
+        let diff;
+        needsCalculate = true;
+        if (numColumns > 1) {
+          const rowNumber = Math.floor(index / numColumnsProp);
+          const prevSizeInRow = getRowHeight(rowNumber);
+          sizes.set(itemKey, size);
+          rowHeights.delete(rowNumber);
+          const sizeInRow = getRowHeight(rowNumber);
+          diff = sizeInRow - prevSizeInRow;
+        } else {
+          sizes.set(itemKey, size);
+          diff = size - prevSize;
+        }
+        if (__DEV__ && suggestEstimatedItemSize) {
+          if (state.timeoutSizeMessage) {
+            clearTimeout(state.timeoutSizeMessage);
+          }
+          state.timeoutSizeMessage = setTimeout(() => {
+            state.timeoutSizeMessage = void 0;
+            const num = sizesKnown.size;
+            const avg = state.averageSizes[""].avg;
+            console.warn(
+              `[legend-list] estimatedItemSize or getEstimatedItemSize are not defined. Based on the ${num} items rendered so far, the optimal estimated size is ${avg}.`
+            );
+          }, 1e3);
+        }
+        state.scrollForNextCalculateItemsInView = void 0;
+        addTotalSize(itemKey, diff, 0);
+        if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
+          doMaintainScrollAtEnd(false);
+        }
+        if (onItemSizeChanged) {
+          onItemSizeChanged({
+            size,
+            previous: prevSize,
+            index,
+            itemKey,
+            itemData: data[index]
+          });
         }
-        state.timeoutSizeMessage = setTimeout(() => {
-          state.timeoutSizeMessage = void 0;
-          const num = sizesKnown.size;
-          const avg = state.averageSizes[""].avg;
-          console.warn(
-            `[legend-list] estimatedItemSize or getEstimatedItemSize are not defined. Based on the ${num} items rendered so far, the optimal estimated size is ${avg}.`
-          );
-        }, 1e3);
       }
-      state.scrollForNextCalculateItemsInView = void 0;
-      addTotalSize(itemKey, diff, 0);
-      if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
-        doMaintainScrollAtEnd(false);
-      }
-      if (onItemSizeChanged) {
-        onItemSizeChanged({
-          size,
-          previous: prevSize,
-          index,
-          itemKey,
-          itemData: data[index]
-        });
+      if (!queuedInitialLayout && checkAllSizesKnown()) {
+        needsUpdateContainersDidLayout = true;
       }
-    }
-    if (!queuedInitialLayout && checkAllSizesKnown()) {
-      needsUpdateContainersDidLayout = true;
-    }
-    let isInView = index >= startBuffered && index <= endBuffered;
-    if (!isInView) {
-      const numContainers = ctx.values.get("numContainers");
-      for (let i = 0; i < numContainers; i++) {
-        if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
-          isInView = true;
-          break;
+      let isInView = index >= startBuffered && index <= endBuffered;
+      if (!isInView) {
+        const numContainers = ctx.values.get("numContainers");
+        for (let i = 0; i < numContainers; i++) {
+          if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
+            isInView = true;
+            break;
+          }
         }
       }
-    }
-    if (needsUpdateContainersDidLayout || !fromFixGaps && needsCalculate && (isInView || !queuedInitialLayout)) {
-      const scrollVelocity = state.scrollVelocity;
-      let didCalculate = false;
-      if ((Number.isNaN(scrollVelocity) || Math.abs(scrollVelocity) < 1 || state.scrollingToOffset !== void 0) && (!waitForInitialLayout || needsUpdateContainersDidLayout || queuedInitialLayout)) {
-        if (Date.now() - state.lastBatchingAction < 500) {
-          if (!state.queuedCalculateItemsInView) {
-            state.queuedCalculateItemsInView = requestAnimationFrame(() => {
-              state.queuedCalculateItemsInView = void 0;
-              calculateItemsInView();
-            });
+      if (needsUpdateContainersDidLayout || !fromFixGaps && needsCalculate && (isInView || !queuedInitialLayout)) {
+        const scrollVelocity = state.scrollVelocity;
+        let didCalculate = false;
+        if ((Number.isNaN(scrollVelocity) || Math.abs(scrollVelocity) < 1 || state.scrollingTo !== void 0) && (!waitForInitialLayout || needsUpdateContainersDidLayout || queuedInitialLayout)) {
+          if (Date.now() - state.lastBatchingAction < 500) {
+            if (!state.queuedCalculateItemsInView) {
+              state.queuedCalculateItemsInView = requestAnimationFrame(() => {
+                state.queuedCalculateItemsInView = void 0;
+                calculateItemsInView();
+              });
+            }
+          } else {
+            calculateItemsInView();
+            didCalculate = true;
           }
-        } else {
-          calculateItemsInView();
-          didCalculate = true;
+        }
+        if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
+          fixGaps();
         }
       }
-      if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
-        fixGaps();
+      if (state.needsOtherAxisSize) {
+        const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
+        const cur = peek$(ctx, "otherAxisSize");
+        if (!cur || otherAxisSize > cur) {
+          set$(ctx, "otherAxisSize", otherAxisSize);
+        }
       }
-    }
-  }, []);
-  const onLayout = React2.useCallback((event) => {
+    },
+    []
+  );
+  const handleLayout = React2.useCallback((scrollLength) => {
     const state = refState.current;
-    const scrollLength = event.nativeEvent.layout[horizontal ? "width" : "height"];
     const didChange = scrollLength !== state.scrollLength;
     state.scrollLength = scrollLength;
     state.lastBatchingAction = Date.now();
@@ -2268,20 +2299,36 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     if (didChange) {
       calculateItemsInView();
     }
-    if (__DEV__) {
-      const isWidthZero = event.nativeEvent.layout.width === 0;
-      const isHeightZero = event.nativeEvent.layout.height === 0;
-      if (isWidthZero || isHeightZero) {
-        warnDevOnce(
-          "height0",
-          `[legend-list] List ${isWidthZero ? "width" : "height"} is 0. You may need to set a style or \`flex: \` for the list, because children are absolutely positioned.`
-        );
-      }
+  }, []);
+  const onLayout = React2.useCallback((event) => {
+    const scrollLength = event.nativeEvent.layout[horizontal ? "width" : "height"];
+    handleLayout(scrollLength);
+    const otherAxisSize = event.nativeEvent.layout[horizontal ? "height" : "width"];
+    if (refState.current) {
+      refState.current.needsOtherAxisSize = otherAxisSize - (stylePaddingTopState || 0) < 10;
+    }
+    if (__DEV__ && scrollLength === 0) {
+      warnDevOnce(
+        "height0",
+        `List ${horizontal ? "width" : "height"} is 0. You may need to set a style or \`flex: \` for the list, because children are absolutely positioned.`
+      );
     }
     if (onLayoutProp) {
       onLayoutProp(event);
     }
   }, []);
+  if (IsNewArchitecture) {
+    React2.useLayoutEffect(() => {
+      var _a, _b;
+      const measured = (_b = (_a = refScroller.current) == null ? void 0 : _a.unstable_getBoundingClientRect) == null ? void 0 : _b.call(_a);
+      if (measured) {
+        const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
+        if (size) {
+          handleLayout(size);
+        }
+      }
+    }, []);
+  }
   const handleScroll = React2.useCallback(
     (event) => {
       var _a, _b, _c, _d;
@@ -2301,8 +2348,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   );
   const updateScroll = React2.useCallback((newScroll) => {
     const state = refState.current;
-    const scrollingToOffset = state.scrollingToOffset;
-    if (scrollingToOffset !== void 0 && Math.abs(newScroll - scrollingToOffset) < 10) {
+    const scrollingTo = state.scrollingTo;
+    if (scrollingTo !== void 0 && Math.abs(newScroll - scrollingTo.offset) < 10) {
       finishScrollTo();
     }
     if (state.disableScrollJumpsFrom !== void 0) {
@@ -2315,7 +2362,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     state.hasScrolled = true;
     state.lastBatchingAction = Date.now();
     const currentTime = performance.now();
-    if (scrollingToOffset === void 0 && !(state.scrollHistory.length === 0 && newScroll === initialContentOffset)) {
+    if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === initialContentOffset)) {
       state.scrollHistory.push({ scroll: newScroll, time: currentTime });
     }
     if (state.scrollHistory.length > 5) {
@@ -2381,8 +2428,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
             contentLength: state.totalSize,
             end: state.endNoBuffer,
             endBuffered: state.endBuffered,
-            isAtEnd: state.isAtBottom,
-            isAtStart: state.isAtTop,
+            isAtEnd: state.isAtEnd,
+            isAtStart: state.isAtStart,
             scroll: state.scroll,
             scrollLength: state.scrollLength,
             start: state.startNoBuffer,
@@ -2405,10 +2452,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
             scrollToIndex({ index, ...props2 });
           }
         },
-        scrollToOffset: ({ offset, animated }) => {
-          scrollTo(offset, animated);
-        },
-        scrollToEnd: (options) => refScroller.current.scrollToEnd(options)
+        scrollToOffset: (params) => scrollTo(params),
+        scrollToEnd: (options) => {
+          const { data } = refState.current;
+          const index = data.length - 1;
+          if (index !== -1) {
+            scrollToIndex({ index, ...options });
+          }
+        }
       };
     },
     []
@@ -2418,7 +2469,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       var _a;
       if (initialContentOffset) {
         (_a = refState.current) == null ? void 0 : _a.scrollAdjustHandler.setDisableAdjust(true);
-        scrollTo(initialContentOffset, false);
+        scrollTo({ offset: initialContentOffset, animated: false });
         setTimeout(() => {
           var _a2;
           (_a2 = refState.current) == null ? void 0 : _a2.scrollAdjustHandler.setDisableAdjust(false);
@@ -2438,11 +2489,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       handleScroll,
       onMomentumScrollEnd: (event) => {
         var _a;
-        const scrollingToOffset = (_a = refState.current) == null ? void 0 : _a.scrollingToOffset;
-        if (scrollingToOffset !== void 0) {
+        const scrollingTo = (_a = refState.current) == null ? void 0 : _a.scrollingTo;
+        if (scrollingTo !== void 0) {
           requestAnimationFrame(() => {
-            scrollTo(scrollingToOffset, false);
-            refState.current.scrollingToOffset = void 0;
+            scrollTo({ ...scrollingTo, animated: false });
+            refState.current.scrollingTo = void 0;
             requestAnimationFrame(() => {
               refState.current.scrollAdjustHandler.setDisableAdjust(false);
             });
@@ -2465,12 +2516,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       maintainVisibleContentPosition,
       scrollEventThrottle: reactNative.Platform.OS === "web" ? 16 : void 0,
       waitForInitialLayout,
-      refreshControl: refreshControl != null ? refreshControl : onRefresh && /* @__PURE__ */ React2__namespace.createElement(
+      refreshControl: refreshControl ? stylePaddingTopState > 0 ? React2__namespace.cloneElement(refreshControl, {
+        progressViewOffset: (refreshControl.props.progressViewOffset || 0) + stylePaddingTopState
+      }) : refreshControl : onRefresh && /* @__PURE__ */ React2__namespace.createElement(
         reactNative.RefreshControl,
         {
           refreshing: !!refreshing,
           onRefresh,
-          progressViewOffset
+          progressViewOffset: (progressViewOffset || 0) + stylePaddingTopState
         }
       ),
       style,
@@ -2480,6 +2533,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
 });
 
 exports.LegendList = LegendList;
+exports.useIsLastItem = useIsLastItem;
 exports.useRecyclingEffect = useRecyclingEffect;
 exports.useRecyclingState = useRecyclingState;
 exports.useViewability = useViewability;