@legendapp/list 1.0.13 → 1.0.15

package/animated.d.mts

@@ -3,7 +3,7 @@ import * as _legendapp_list from '@legendapp/list';
 import * as react_native from 'react-native';
 import { Animated } from 'react-native';
 
-declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
+declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "maintainVisibleContentPosition" | "removeClippedSubviews" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
     data: readonly T[];
@@ -54,6 +54,9 @@ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Om
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React$1.RefAttributes<_legendapp_list.LegendListRef>) => React.ReactNode)>;
 
 export { AnimatedLegendList };

package/animated.d.ts

@@ -3,7 +3,7 @@ import * as _legendapp_list from '@legendapp/list';
 import * as react_native from 'react-native';
 import { Animated } from 'react-native';
 
-declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
+declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "maintainVisibleContentPosition" | "removeClippedSubviews" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
     data: readonly T[];
@@ -54,6 +54,9 @@ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<Om
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React$1.RefAttributes<_legendapp_list.LegendListRef>) => React.ReactNode)>;
 
 export { AnimatedLegendList };

package/index.d.mts

@@ -208,6 +208,9 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
      * @default false
      */
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 };
 interface ColumnWrapperStyle {
     rowGap?: number;
@@ -280,6 +283,7 @@ interface InternalState {
     disableScrollJumpsFrom?: number;
     scrollingToOffset?: number | undefined;
     previousTotalSize?: number;
+    needsOtherAxisSize?: boolean;
     averageSizes: Record<string, {
         num: number;
         avg: number;
@@ -464,7 +468,7 @@ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqua
 };
 declare const typedMemo: TypedMemo;
 
-declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
+declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "maintainVisibleContentPosition" | "removeClippedSubviews" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: ColumnWrapperStyle;
     data: readonly T[];
@@ -515,11 +519,15 @@ declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "sc
     viewabilityConfig?: ViewabilityConfig;
     viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React$1.RefAttributes<LegendListRef>) => React$1.ReactNode;
 
 declare function useViewability(callback: ViewabilityCallback, configId?: string): void;
 declare function useViewabilityAmount(callback: ViewabilityAmountCallback): void;
 declare function useRecyclingEffect(effect: (info: LegendListRecyclingState<unknown>) => void | (() => void)): void;
 declare function useRecyclingState<ItemT>(valueOrFun: ((info: LegendListRecyclingState<ItemT>) => ItemT) | ItemT): readonly [ItemT | null, Dispatch<SetStateAction<ItemT>>];
+declare function useIsLastItem(): any;
 
-export { type AnchoredPosition, type ColumnWrapperStyle, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ScrollState, type TypedForwardRef, type TypedMemo, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, typedForwardRef, typedMemo, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };
+export { type AnchoredPosition, type ColumnWrapperStyle, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ScrollState, type TypedForwardRef, type TypedMemo, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, typedForwardRef, typedMemo, useIsLastItem, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };

package/index.d.ts

@@ -208,6 +208,9 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
      * @default false
      */
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 };
 interface ColumnWrapperStyle {
     rowGap?: number;
@@ -280,6 +283,7 @@ interface InternalState {
     disableScrollJumpsFrom?: number;
     scrollingToOffset?: number | undefined;
     previousTotalSize?: number;
+    needsOtherAxisSize?: boolean;
     averageSizes: Record<string, {
         num: number;
         avg: number;
@@ -464,7 +468,7 @@ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqua
 };
 declare const typedMemo: TypedMemo;
 
-declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
+declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "maintainVisibleContentPosition" | "removeClippedSubviews" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: ColumnWrapperStyle;
     data: readonly T[];
@@ -515,11 +519,15 @@ declare const LegendList: <T>(props: Omit<Omit<react_native.ScrollViewProps, "sc
     viewabilityConfig?: ViewabilityConfig;
     viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React$1.RefAttributes<LegendListRef>) => React$1.ReactNode;
 
 declare function useViewability(callback: ViewabilityCallback, configId?: string): void;
 declare function useViewabilityAmount(callback: ViewabilityAmountCallback): void;
 declare function useRecyclingEffect(effect: (info: LegendListRecyclingState<unknown>) => void | (() => void)): void;
 declare function useRecyclingState<ItemT>(valueOrFun: ((info: LegendListRecyclingState<ItemT>) => ItemT) | ItemT): readonly [ItemT | null, Dispatch<SetStateAction<ItemT>>];
+declare function useIsLastItem(): any;
 
-export { type AnchoredPosition, type ColumnWrapperStyle, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ScrollState, type TypedForwardRef, type TypedMemo, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, typedForwardRef, typedMemo, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };
+export { type AnchoredPosition, type ColumnWrapperStyle, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ScrollState, type TypedForwardRef, type TypedMemo, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, typedForwardRef, typedMemo, useIsLastItem, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };

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 }) => {
@@ -308,6 +314,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 +377,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 +390,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 +412,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 +436,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 +461,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 +510,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 +518,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 +541,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;
@@ -1026,6 +1042,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
@@ -1230,6 +1247,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   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 +1260,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) => {
@@ -1375,10 +1396,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 +1496,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 +1584,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 +1593,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 {
@@ -1860,8 +1882,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);
           }
@@ -2142,111 +2164,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;
-    }
-    const isInView = index >= startBuffered && index <= endBuffered;
-    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();
-            });
+      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;
           }
-        } else {
-          calculateItemsInView();
-          didCalculate = true;
         }
       }
-      if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
-        fixGaps();
+      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();
+              });
+            }
+          } else {
+            calculateItemsInView();
+            didCalculate = true;
+          }
+        }
+        if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
+          fixGaps();
+        }
       }
-    }
-  }, []);
-  const onLayout = React2.useCallback((event) => {
+      if (state.needsOtherAxisSize) {
+        const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
+        const cur = peek$(ctx, "otherAxisSize");
+        if (!cur || otherAxisSize > cur) {
+          set$(ctx, "otherAxisSize", otherAxisSize);
+        }
+      }
+    },
+    []
+  );
+  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();
@@ -2259,20 +2300,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;
@@ -2471,6 +2528,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
 });
 
 exports.LegendList = LegendList;
+exports.useIsLastItem = useIsLastItem;
 exports.useRecyclingEffect = useRecyclingEffect;
 exports.useRecyclingState = useRecyclingState;
 exports.useViewability = useViewability;

package/index.mjs

@@ -1,5 +1,5 @@
 import * as React2 from 'react';
-import React2__default, { useReducer, useEffect, createContext, useMemo, useRef, useCallback, useImperativeHandle, useContext, useState, forwardRef, memo, useLayoutEffect } from 'react';
+import React2__default, { useReducer, useEffect, createContext, useMemo, useRef, useCallback, useLayoutEffect, useImperativeHandle, useContext, useState, forwardRef, memo } from 'react';
 import { View, Text, Platform, Animated, ScrollView, StyleSheet, Dimensions, RefreshControl } from 'react-native';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 
@@ -99,6 +99,12 @@ function useArr$(signalNames) {
   const value = useSyncExternalStore(subscribe, get);
   return value;
 }
+function useSelector$(signalName, selector) {
+  const ctx = React2.useContext(ContextState);
+  const { subscribe, get } = React2.useMemo(() => createSelectorFunctionsArr(ctx, [signalName]), [ctx, signalName]);
+  const value = useSyncExternalStore(subscribe, () => selector(get()[0]));
+  return value;
+}
 
 // src/DebugView.tsx
 var DebugRow = ({ children }) => {
@@ -287,6 +293,11 @@ function useRecyclingState(valueOrFun) {
   );
   return [refState.current.value, setState];
 }
+function useIsLastItem() {
+  const { itemKey } = useContext(ContextContainer);
+  const isLast = useSelector$("lastItemKeys", (lastItemKeys) => (lastItemKeys == null ? void 0 : lastItemKeys.includes(itemKey)) || false);
+  return isLast;
+}
 var LeanViewComponent = React2.forwardRef((props, ref) => {
   return React2.createElement("RCTView", { ...props, ref });
 });
@@ -345,12 +356,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
       };
     }
   }
@@ -358,7 +369,6 @@ var Container = ({
     flexDirection: ItemSeparatorComponent ? "row" : void 0,
     position: "absolute",
     top: otherAxisPos,
-    bottom: numColumns > 1 ? null : 0,
     height: otherAxisSize,
     left: position.relativeCoordinate,
     ...paddingStyles || {}
@@ -381,17 +391,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();
         });
       }
@@ -405,7 +415,7 @@ var Container = ({
         if (measured) {
           const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
           if (size) {
-            updateItemSize(itemKey, size);
+            updateItemSize(itemKey, measured);
           }
         }
       }
@@ -430,7 +440,7 @@ var Container = ({
   }, [id, itemKey, index, data]);
   const contentFragment = /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, { key: recycleItems ? void 0 : itemKey }, /* @__PURE__ */ React2__default.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && !lastItemKeys.includes(itemKey) && /* @__PURE__ */ React2__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;
@@ -479,7 +489,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,
@@ -487,6 +497,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(
@@ -504,8 +520,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;
@@ -1005,6 +1021,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     onViewableItemsChanged,
     ...rest
   } = props;
+  const refLoadStartTime = useRef(Date.now());
   const callbacks = useRef({
     onStartReached: rest.onStartReached,
     onEndReached: rest.onEndReached
@@ -1209,6 +1226,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   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 });
@@ -1216,13 +1239,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 = useCallback((key, add, totalSizeBelowAnchor) => {
@@ -1354,10 +1375,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
             );
@@ -1455,13 +1475,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;
@@ -1541,7 +1563,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;
@@ -1550,7 +1572,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 {
@@ -1839,8 +1861,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);
           }
@@ -2121,111 +2143,130 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   useInit(() => {
     doInitialAllocateContainers();
   });
-  const updateItemSize = 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 = 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;
-    }
-    const isInView = index >= startBuffered && index <= endBuffered;
-    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();
-            });
+      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;
           }
-        } else {
-          calculateItemsInView();
-          didCalculate = true;
         }
       }
-      if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
-        fixGaps();
+      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();
+              });
+            }
+          } else {
+            calculateItemsInView();
+            didCalculate = true;
+          }
+        }
+        if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
+          fixGaps();
+        }
       }
-    }
-  }, []);
-  const onLayout = useCallback((event) => {
+      if (state.needsOtherAxisSize) {
+        const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
+        const cur = peek$(ctx, "otherAxisSize");
+        if (!cur || otherAxisSize > cur) {
+          set$(ctx, "otherAxisSize", otherAxisSize);
+        }
+      }
+    },
+    []
+  );
+  const handleLayout = 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();
@@ -2238,20 +2279,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 = 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) {
+    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 = useCallback(
     (event) => {
       var _a, _b, _c, _d;
@@ -2449,4 +2506,4 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React2.createElement(DebugView, { state: refState.current }));
 });
 
-export { LegendList, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };
+export { LegendList, useIsLastItem, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };

package/keyboard-controller.d.mts

@@ -58,6 +58,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode) | react_native.Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
@@ -109,6 +112,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode)> | (<ItemT_1>(props: Omit<_legendapp_list_reanimated.AnimatedLegendListPropsBase<ItemT_1>, "refLegendList"> & {
     getEstimatedItemSize?: ((index: number, item: ItemT_1) => number) | undefined;
     ItemSeparatorComponent?: React.ComponentType<{
@@ -343,6 +349,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
@@ -394,6 +403,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & {
     LegendList?: ListT;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode;

package/keyboard-controller.d.ts

@@ -58,6 +58,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode) | react_native.Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
@@ -109,6 +112,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode)> | (<ItemT_1>(props: Omit<_legendapp_list_reanimated.AnimatedLegendListPropsBase<ItemT_1>, "refLegendList"> & {
     getEstimatedItemSize?: ((index: number, item: ItemT_1) => number) | undefined;
     ItemSeparatorComponent?: React.ComponentType<{
@@ -343,6 +349,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews"> & {
     alignItemsAtEnd?: boolean;
     columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
@@ -394,6 +403,9 @@ declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_nati
     viewabilityConfig?: _legendapp_list.ViewabilityConfig;
     viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
     waitForInitialLayout?: boolean;
+    onLoad?: (info: {
+        elapsedTimeInMs: number;
+    }) => void;
 } & {
     LegendList?: ListT;
 } & React.RefAttributes<LegendListRef>) => React.ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@legendapp/list",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "Legend List is a drop-in replacement for FlatList with much better performance and supporting dynamically sized items.",
   "sideEffects": false,
   "private": false,