@legendapp/list 2.0.4 → 2.0.6

package/index.mjs

@@ -1,12 +1,12 @@
-import * as React3 from 'react';
-import React3__default, { useReducer, useEffect, createContext, useRef, useState, useMemo, useLayoutEffect, useCallback, useImperativeHandle, forwardRef, memo, useContext } from 'react';
+import * as React2 from 'react';
+import React2__default, { useReducer, useEffect, createContext, useRef, useState, useMemo, useLayoutEffect, useCallback, useImperativeHandle, forwardRef, memo, useContext } from 'react';
 import { View, Text, Platform, Animated, StyleSheet, Dimensions, RefreshControl, unstable_batchedUpdates } from 'react-native';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 
 // src/components/LegendList.tsx
-var ContextState = React3.createContext(null);
+var ContextState = React2.createContext(null);
 function StateProvider({ children }) {
-  const [value] = React3.useState(() => ({
+  const [value] = React2.useState(() => ({
     animatedScrollY: new Animated.Value(0),
     columnWrapperStyle: void 0,
     listeners: /* @__PURE__ */ new Map(),
@@ -24,10 +24,10 @@ function StateProvider({ children }) {
     ]),
     viewRefs: /* @__PURE__ */ new Map()
   }));
-  return /* @__PURE__ */ React3.createElement(ContextState.Provider, { value }, children);
+  return /* @__PURE__ */ React2.createElement(ContextState.Provider, { value }, children);
 }
 function useStateContext() {
-  return React3.useContext(ContextState);
+  return React2.useContext(ContextState);
 }
 function createSelectorFunctionsArr(ctx, signalNames) {
   let lastValues = [];
@@ -97,23 +97,23 @@ function getContentSize(ctx) {
   return headerSize + footerSize + totalSize + stylePaddingTop;
 }
 function useArr$(signalNames) {
-  const ctx = React3.useContext(ContextState);
-  const { subscribe, get } = React3.useMemo(() => createSelectorFunctionsArr(ctx, signalNames), [ctx, signalNames]);
+  const ctx = React2.useContext(ContextState);
+  const { subscribe, get } = React2.useMemo(() => createSelectorFunctionsArr(ctx, signalNames), [ctx, signalNames]);
   const value = useSyncExternalStore(subscribe, get);
   return value;
 }
 function useSelector$(signalName, selector) {
-  const ctx = React3.useContext(ContextState);
-  const { subscribe, get } = React3.useMemo(() => createSelectorFunctionsArr(ctx, [signalName]), [ctx, signalName]);
+  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/components/DebugView.tsx
 var DebugRow = ({ children }) => {
-  return /* @__PURE__ */ React3.createElement(View, { style: { alignItems: "center", flexDirection: "row", justifyContent: "space-between" } }, children);
+  return /* @__PURE__ */ React2.createElement(View, { style: { alignItems: "center", flexDirection: "row", justifyContent: "space-between" } }, children);
 };
-var DebugView = React3.memo(function DebugView2({ state }) {
+var DebugView = React2.memo(function DebugView2({ state }) {
   const ctx = useStateContext();
   const [totalSize = 0, scrollAdjust = 0, rawScroll = 0, scroll = 0, _numContainers = 0, _numContainersPooled = 0] = useArr$([
     "totalSize",
@@ -128,7 +128,7 @@ var DebugView = React3.memo(function DebugView2({ state }) {
   useInterval(() => {
     forceUpdate();
   }, 100);
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     View,
     {
       pointerEvents: "none",
@@ -144,14 +144,14 @@ var DebugView = React3.memo(function DebugView2({ state }) {
         top: 0
       }
     },
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "TotalSize:"), /* @__PURE__ */ React3.createElement(Text, null, totalSize.toFixed(2))),
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "ContentSize:"), /* @__PURE__ */ React3.createElement(Text, null, contentSize.toFixed(2))),
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "At end:"), /* @__PURE__ */ React3.createElement(Text, null, String(state.isAtEnd))),
-    /* @__PURE__ */ React3.createElement(Text, null),
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "ScrollAdjust:"), /* @__PURE__ */ React3.createElement(Text, null, scrollAdjust.toFixed(2))),
-    /* @__PURE__ */ React3.createElement(Text, null),
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "RawScroll: "), /* @__PURE__ */ React3.createElement(Text, null, rawScroll.toFixed(2))),
-    /* @__PURE__ */ React3.createElement(DebugRow, null, /* @__PURE__ */ React3.createElement(Text, null, "ComputedScroll: "), /* @__PURE__ */ React3.createElement(Text, null, scroll.toFixed(2)))
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "TotalSize:"), /* @__PURE__ */ React2.createElement(Text, null, totalSize.toFixed(2))),
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "ContentSize:"), /* @__PURE__ */ React2.createElement(Text, null, contentSize.toFixed(2))),
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "At end:"), /* @__PURE__ */ React2.createElement(Text, null, String(state.isAtEnd))),
+    /* @__PURE__ */ React2.createElement(Text, null),
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "ScrollAdjust:"), /* @__PURE__ */ React2.createElement(Text, null, scrollAdjust.toFixed(2))),
+    /* @__PURE__ */ React2.createElement(Text, null),
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "RawScroll: "), /* @__PURE__ */ React2.createElement(Text, null, rawScroll.toFixed(2))),
+    /* @__PURE__ */ React2.createElement(DebugRow, null, /* @__PURE__ */ React2.createElement(Text, null, "ComputedScroll: "), /* @__PURE__ */ React2.createElement(Text, null, scroll.toFixed(2)))
   );
 });
 function useInterval(callback, delay) {
@@ -160,8 +160,8 @@ function useInterval(callback, delay) {
     return () => clearInterval(interval);
   }, [delay]);
 }
-var LeanViewComponent = React3.forwardRef((props, ref) => {
-  return React3.createElement("RCTView", { ...props, ref });
+var LeanViewComponent = React2.forwardRef((props, ref) => {
+  return React2.createElement("RCTView", { ...props, ref });
 });
 LeanViewComponent.displayName = "RCTView";
 var LeanView = Platform.OS === "android" || Platform.OS === "ios" ? LeanViewComponent : View;
@@ -223,7 +223,7 @@ var PositionViewState = typedMemo(function PositionView({
   ...rest
 }) {
   const [position = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     LeanView,
     {
       ref: refView,
@@ -245,7 +245,7 @@ var PositionViewAnimated = typedMemo(function PositionView2({
   const position$ = useValue$(`containerPosition${id}`, {
     getValue: (v) => v != null ? v : POSITION_OUT_OF_VIEW
   });
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     Animated.View,
     {
       ref: refView,
@@ -268,7 +268,7 @@ var PositionViewSticky = typedMemo(function PositionViewSticky2({
   ...rest
 }) {
   const [position = POSITION_OUT_OF_VIEW, headerSize] = useArr$([`containerPosition${id}`, "headerSize"]);
-  const transform = React3.useMemo(() => {
+  const transform = React2.useMemo(() => {
     if (animatedScrollY && stickyOffset) {
       const stickyPosition = animatedScrollY.interpolate({
         extrapolate: "clamp",
@@ -278,15 +278,10 @@ var PositionViewSticky = typedMemo(function PositionViewSticky2({
       return horizontal ? [{ translateX: stickyPosition }] : [{ translateY: stickyPosition }];
     }
   }, [animatedScrollY, headerSize, horizontal, stickyOffset, position]);
-  const viewStyle = React3.useMemo(() => [style, { zIndex: index + 1e3 }, { transform }], [style, transform]);
-  return /* @__PURE__ */ React3.createElement(Animated.View, { ref: refView, style: viewStyle, ...rest });
+  const viewStyle = React2.useMemo(() => [style, { zIndex: index + 1e3 }, { transform }], [style, transform]);
+  return /* @__PURE__ */ React2.createElement(Animated.View, { ref: refView, style: viewStyle, ...rest });
 });
 var PositionView3 = IsNewArchitecture ? PositionViewState : PositionViewAnimated;
-function Separator({ ItemSeparatorComponent, itemKey, leadingItem }) {
-  const [lastItemKeys] = useArr$(["lastItemKeys"]);
-  const isALastItem = lastItemKeys.includes(itemKey);
-  return isALastItem ? null : /* @__PURE__ */ React3.createElement(ItemSeparatorComponent, { leadingItem });
-}
 var symbolFirst = Symbol();
 function useInit(cb) {
   const refValue = useRef(symbolFirst);
@@ -434,6 +429,12 @@ function useSyncLayout() {
   }
 }
 
+// src/components/Separator.tsx
+function Separator({ ItemSeparatorComponent, leadingItem }) {
+  const isLastItem = useIsLastItem();
+  return isLastItem ? null : /* @__PURE__ */ React2.createElement(ItemSeparatorComponent, { leadingItem });
+}
+
 // src/components/Container.tsx
 var Container = typedMemo(function Container2({
   id,
@@ -557,7 +558,7 @@ var Container = typedMemo(function Container2({
     }, [itemKey]);
   }
   const PositionComponent = isSticky ? PositionViewSticky : PositionView3;
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     PositionComponent,
     {
       animatedScrollY: isSticky ? animatedScrollY : void 0,
@@ -570,14 +571,7 @@ var Container = typedMemo(function Container2({
       stickyOffset: isSticky ? stickyOffset : void 0,
       style
     },
-    /* @__PURE__ */ React3.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && /* @__PURE__ */ React3.createElement(
-      Separator,
-      {
-        ItemSeparatorComponent,
-        itemKey,
-        leadingItem: renderedItemInfo.item
-      }
-    ))
+    /* @__PURE__ */ React2.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && /* @__PURE__ */ React2.createElement(Separator, { ItemSeparatorComponent, leadingItem: renderedItemInfo.item }))
   );
 });
 
@@ -602,7 +596,7 @@ var Containers = typedMemo(function Containers2({
   const containers = [];
   for (let i = 0; i < numContainers; i++) {
     containers.push(
-      /* @__PURE__ */ React3.createElement(
+      /* @__PURE__ */ React2.createElement(
         Container,
         {
           getRenderedItem: getRenderedItem2,
@@ -637,13 +631,13 @@ var Containers = typedMemo(function Containers2({
       }
     }
   }
-  return /* @__PURE__ */ React3.createElement(Animated.View, { style }, containers);
+  return /* @__PURE__ */ React2.createElement(Animated.View, { style }, containers);
 });
 function ScrollAdjust() {
   const bias = 1e7;
   const [scrollAdjust, scrollAdjustUserOffset] = useArr$(["scrollAdjust", "scrollAdjustUserOffset"]);
   const scrollOffset = (scrollAdjust || 0) + (scrollAdjustUserOffset || 0) + bias;
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     View,
     {
       style: {
@@ -656,11 +650,9 @@ function ScrollAdjust() {
     }
   );
 }
-
-// src/components/SnapWrapper.tsx
 function SnapWrapper({ ScrollComponent, ...props }) {
   const [snapToOffsets] = useArr$(["snapToOffsets"]);
-  return /* @__PURE__ */ React.createElement(ScrollComponent, { ...props, snapToOffsets });
+  return /* @__PURE__ */ React2__default.createElement(ScrollComponent, { ...props, snapToOffsets });
 }
 function useThrottleDebounce(mode) {
   const timeoutRef = useRef(null);
@@ -727,21 +719,21 @@ function useSyncLayout2({
 
 // src/components/ListComponent.tsx
 var getComponent = (Component) => {
-  if (React3.isValidElement(Component)) {
+  if (React2.isValidElement(Component)) {
     return Component;
   }
   if (Component) {
-    return /* @__PURE__ */ React3.createElement(Component, null);
+    return /* @__PURE__ */ React2.createElement(Component, null);
   }
   return null;
 };
 var Padding = () => {
   const animPaddingTop = useValue$("alignItemsPaddingTop", { delay: 0 });
-  return /* @__PURE__ */ React3.createElement(Animated.View, { style: { paddingTop: animPaddingTop } });
+  return /* @__PURE__ */ React2.createElement(Animated.View, { style: { paddingTop: animPaddingTop } });
 };
 var PaddingDevMode = () => {
   const animPaddingTop = useValue$("alignItemsPaddingTop", { delay: 0 });
-  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(Animated.View, { style: { paddingTop: animPaddingTop } }), /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(Animated.View, { style: { paddingTop: animPaddingTop } }), /* @__PURE__ */ React2.createElement(
     Animated.View,
     {
       style: {
@@ -788,10 +780,10 @@ var ListComponent = typedMemo(function ListComponent2({
     onChange: onLayoutHeader
   });
   const ScrollComponent = renderScrollComponent ? useMemo(
-    () => React3.forwardRef((props, ref) => renderScrollComponent({ ...props, ref })),
+    () => React2.forwardRef((props, ref) => renderScrollComponent({ ...props, ref })),
     [renderScrollComponent]
   ) : Animated.ScrollView;
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (canRender) {
       setTimeout(() => {
         scrollAdjustHandler.setMounted();
@@ -799,7 +791,7 @@ var ListComponent = typedMemo(function ListComponent2({
     }
   }, [canRender]);
   const SnapOrScroll = snapToIndices ? SnapWrapper : ScrollComponent;
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(
     SnapOrScroll,
     {
       ...rest,
@@ -818,11 +810,11 @@ var ListComponent = typedMemo(function ListComponent2({
       ScrollComponent: snapToIndices ? ScrollComponent : void 0,
       style
     },
-    maintainVisibleContentPosition && /* @__PURE__ */ React3.createElement(ScrollAdjust, null),
-    ENABLE_DEVMODE ? /* @__PURE__ */ React3.createElement(PaddingDevMode, null) : /* @__PURE__ */ React3.createElement(Padding, null),
-    ListHeaderComponent && /* @__PURE__ */ React3.createElement(View, { onLayout: onLayoutHeaderSync, ref: refHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
+    maintainVisibleContentPosition && /* @__PURE__ */ React2.createElement(ScrollAdjust, null),
+    ENABLE_DEVMODE ? /* @__PURE__ */ React2.createElement(PaddingDevMode, null) : /* @__PURE__ */ React2.createElement(Padding, null),
+    ListHeaderComponent && /* @__PURE__ */ React2.createElement(View, { onLayout: onLayoutHeaderSync, ref: refHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
     ListEmptyComponent && getComponent(ListEmptyComponent),
-    canRender && /* @__PURE__ */ React3.createElement(
+    canRender && /* @__PURE__ */ React2.createElement(
       Containers,
       {
         getRenderedItem: getRenderedItem2,
@@ -833,7 +825,7 @@ var ListComponent = typedMemo(function ListComponent2({
         waitForInitialLayout
       }
     ),
-    ListFooterComponent && /* @__PURE__ */ React3.createElement(
+    ListFooterComponent && /* @__PURE__ */ React2.createElement(
       View,
       {
         onLayout: (event) => {
@@ -844,11 +836,11 @@ var ListComponent = typedMemo(function ListComponent2({
       },
       getComponent(ListFooterComponent)
     ),
-    __DEV__ && ENABLE_DEVMODE && /* @__PURE__ */ React3.createElement(DevNumbers, null)
+    __DEV__ && ENABLE_DEVMODE && /* @__PURE__ */ React2.createElement(DevNumbers, null)
   );
 });
-var DevNumbers = __DEV__ && React3.memo(function DevNumbers2() {
-  return Array.from({ length: 100 }).map((_, index) => /* @__PURE__ */ React3.createElement(
+var DevNumbers = __DEV__ && React2.memo(function DevNumbers2() {
+  return Array.from({ length: 100 }).map((_, index) => /* @__PURE__ */ React2.createElement(
     View,
     {
       key: index,
@@ -860,7 +852,7 @@ var DevNumbers = __DEV__ && React3.memo(function DevNumbers2() {
         width: "100%"
       }
     },
-    /* @__PURE__ */ React3.createElement(Text, { style: { color: "red" } }, index * 100)
+    /* @__PURE__ */ React2.createElement(Text, { style: { color: "red" } }, index * 100)
   ));
 });
 
@@ -1139,12 +1131,14 @@ function updateTotalSize(ctx, state) {
 }
 function addTotalSize(ctx, state, key, add) {
   const { alignItemsAtEnd } = state.props;
-  {
+  if (key === null) {
     state.totalSize = add;
     if (state.timeoutSetPaddingTop) {
       clearTimeout(state.timeoutSetPaddingTop);
       state.timeoutSetPaddingTop = void 0;
     }
+  } else {
+    state.totalSize += add;
   }
   set$(ctx, "totalSize", state.totalSize);
   if (alignItemsAtEnd) {
@@ -1167,8 +1161,8 @@ function updateSnapToOffsets(ctx, state) {
   set$(ctx, "snapToOffsets", snapToOffsets);
 }
 
-// src/core/updateAllPositions.ts
-function updateAllPositions(ctx, state, dataChanged, startIndex = 0) {
+// src/core/updateItemPositions.ts
+function updateItemPositions(ctx, state, dataChanged, { startIndex, scrollBottomBuffered } = { scrollBottomBuffered: -1, startIndex: 0 }) {
   var _a, _b, _c, _d, _e, _f;
   const {
     columns,
@@ -1181,6 +1175,7 @@ function updateAllPositions(ctx, state, dataChanged, startIndex = 0) {
   const data = state.props.data;
   const numColumns = peek$(ctx, "numColumns");
   const indexByKeyForChecking = __DEV__ ? /* @__PURE__ */ new Map() : void 0;
+  const maxVisibleArea = scrollBottomBuffered + 1e3;
   const useAverageSize = enableAverages && !getEstimatedItemSize;
   let currentRowTop = 0;
   let column = 1;
@@ -1200,8 +1195,17 @@ function updateAllPositions(ctx, state, dataChanged, startIndex = 0) {
     }
   }
   const needsIndexByKey = dataChanged || indexByKey.size === 0;
+  let didBreakEarly = false;
+  let breakAt;
   const dataLength = data.length;
   for (let i = startIndex; i < dataLength; i++) {
+    if (breakAt && i > breakAt) {
+      didBreakEarly = true;
+      break;
+    }
+    if (!dataChanged && currentRowTop > maxVisibleArea) {
+      breakAt = i + 10;
+    }
     const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
     const size = (_f = sizesKnown.get(id)) != null ? _f : getItemSize(state, id, i, data[i], useAverageSize);
     if (__DEV__ && needsIndexByKey) {
@@ -1231,7 +1235,9 @@ function updateAllPositions(ctx, state, dataChanged, startIndex = 0) {
       currentRowTop += size;
     }
   }
-  updateTotalSize(ctx, state);
+  if (!didBreakEarly) {
+    updateTotalSize(ctx, state);
+  }
   if (snapToIndices) {
     updateSnapToOffsets(ctx, state);
   }
@@ -1781,7 +1787,7 @@ function handleStickyRecycling(ctx, state, stickyArray, scroll, scrollBuffer, pe
 }
 function calculateItemsInView(ctx, state, params = {}) {
   batchedUpdates(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     const {
       columns,
       containerItemKeys,
@@ -1810,20 +1816,6 @@ function calculateItemsInView(ctx, state, params = {}) {
     const previousScrollAdjust = 0;
     const { dataChanged, doMVCP } = params;
     const speed = getScrollVelocity(state);
-    if (doMVCP || dataChanged) {
-      const checkMVCP = doMVCP ? prepareMVCP(ctx, state, dataChanged) : void 0;
-      if (dataChanged) {
-        indexByKey.clear();
-        idCache.clear();
-        positions.clear();
-      }
-      const startIndex = dataChanged ? 0 : minIndexSizeChanged != null ? minIndexSizeChanged : 0;
-      updateAllPositions(ctx, state, dataChanged, startIndex);
-      if (minIndexSizeChanged !== void 0) {
-        state.minIndexSizeChanged = void 0;
-      }
-      checkMVCP == null ? void 0 : checkMVCP();
-    }
     const scrollExtra = 0;
     const { queuedInitialLayout } = state;
     let { scroll: scrollState } = state;
@@ -1862,6 +1854,18 @@ function calculateItemsInView(ctx, state, params = {}) {
         return;
       }
     }
+    const checkMVCP = doMVCP ? prepareMVCP(ctx, state, dataChanged) : void 0;
+    if (dataChanged) {
+      indexByKey.clear();
+      idCache.clear();
+      positions.clear();
+    }
+    const startIndex = dataChanged ? 0 : (_a = minIndexSizeChanged != null ? minIndexSizeChanged : state.startBuffered) != null ? _a : 0;
+    updateItemPositions(ctx, state, dataChanged, { scrollBottomBuffered, startIndex });
+    if (minIndexSizeChanged !== void 0) {
+      state.minIndexSizeChanged = void 0;
+    }
+    checkMVCP == null ? void 0 : checkMVCP();
     let startNoBuffer = null;
     let startBuffered = null;
     let startBufferedId = null;
@@ -1869,9 +1873,9 @@ function calculateItemsInView(ctx, state, params = {}) {
     let endBuffered = null;
     let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
     for (let i = loopStart; i >= 0; i--) {
-      const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
+      const id = (_b = idCache.get(i)) != null ? _b : getId(state, i);
       const top = positions.get(id);
-      const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
+      const size = (_c = sizes.get(id)) != null ? _c : getItemSize(state, id, i, data[i]);
       const bottom = top + size;
       if (bottom > scroll - scrollBuffer) {
         loopStart = i;
@@ -1897,8 +1901,8 @@ function calculateItemsInView(ctx, state, params = {}) {
     let firstFullyOnScreenIndex;
     const dataLength = data.length;
     for (let i = Math.max(0, loopStart); i < dataLength && (!foundEnd || i <= maxIndexRendered); i++) {
-      const id = (_c = idCache.get(i)) != null ? _c : getId(state, i);
-      const size = (_d = sizes.get(id)) != null ? _d : getItemSize(state, id, i, data[i]);
+      const id = (_d = idCache.get(i)) != null ? _d : getId(state, i);
+      const size = (_e = sizes.get(id)) != null ? _e : getItemSize(state, id, i, data[i]);
       const top = positions.get(id);
       if (!foundEnd) {
         if (startNoBuffer === null && top + size > scroll) {
@@ -1927,7 +1931,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     }
     const idsInView = [];
     for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
-      const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
+      const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
       idsInView.push(id);
     }
     Object.assign(state, {
@@ -1959,7 +1963,7 @@ function calculateItemsInView(ctx, state, params = {}) {
       let numContainers2 = prevNumContainers;
       const needNewContainers = [];
       for (let i = startBuffered; i <= endBuffered; i++) {
-        const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
+        const id = (_g = idCache.get(i)) != null ? _g : getId(state, i);
         if (!containerItemKeys.has(id)) {
           needNewContainers.push(i);
         }
@@ -1996,7 +2000,7 @@ function calculateItemsInView(ctx, state, params = {}) {
         for (let idx = 0; idx < needNewContainers.length; idx++) {
           const i = needNewContainers[idx];
           const containerIndex = availableContainers[idx];
-          const id = (_g = idCache.get(i)) != null ? _g : getId(state, i);
+          const id = (_h = idCache.get(i)) != null ? _h : getId(state, i);
           const oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
           if (oldKey && oldKey !== id) {
             containerItemKeys.delete(oldKey);
@@ -2051,7 +2055,7 @@ function calculateItemsInView(ctx, state, params = {}) {
         const itemIndex = indexByKey.get(itemKey);
         const item = data[itemIndex];
         if (item !== void 0) {
-          const id = (_h = idCache.get(itemIndex)) != null ? _h : getId(state, itemIndex);
+          const id = (_i = idCache.get(itemIndex)) != null ? _i : getId(state, itemIndex);
           const position = positions.get(id);
           if (position === void 0) {
             set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
@@ -2067,7 +2071,7 @@ function calculateItemsInView(ctx, state, params = {}) {
               set$(ctx, `containerColumn${i}`, column);
             }
             if (prevData !== item && (itemsAreEqual ? !itemsAreEqual(prevData, item, itemIndex, data) : true)) {
-              set$(ctx, `containerItemData${i}`, data[itemIndex]);
+              set$(ctx, `containerItemData${i}`, item);
             }
           }
         }
@@ -2084,55 +2088,6 @@ function calculateItemsInView(ctx, state, params = {}) {
   });
 }
 
-// src/core/doInitialAllocateContainers.ts
-function doInitialAllocateContainers(ctx, state) {
-  var _a;
-  const {
-    scrollLength,
-    props: {
-      data,
-      getEstimatedItemSize,
-      getFixedItemSize,
-      getItemType,
-      scrollBuffer,
-      numColumns,
-      estimatedItemSize
-    }
-  } = state;
-  const hasContainers = peek$(ctx, "numContainers");
-  if (scrollLength > 0 && data.length > 0 && !hasContainers) {
-    let averageItemSize;
-    const fn = getFixedItemSize || getEstimatedItemSize;
-    if (fn) {
-      let totalSize = 0;
-      const num = Math.min(20, data.length);
-      for (let i = 0; i < num; i++) {
-        totalSize += fn(0, data[0], getItemType ? (_a = getItemType(data[0], 0)) != null ? _a : "" : "");
-      }
-      averageItemSize = totalSize / num;
-    } else {
-      averageItemSize = estimatedItemSize;
-    }
-    const numContainers = Math.ceil((scrollLength + scrollBuffer * 2) / averageItemSize * numColumns);
-    for (let i = 0; i < numContainers; i++) {
-      set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
-      set$(ctx, `containerColumn${i}`, -1);
-    }
-    set$(ctx, "numContainers", numContainers);
-    set$(ctx, "numContainersPooled", numContainers * state.props.initialContainerPoolRatio);
-    if (!IsNewArchitecture || state.lastLayout) {
-      if (state.props.initialScroll) {
-        requestAnimationFrame(() => {
-          calculateItemsInView(ctx, state, { dataChanged: true });
-        });
-      } else {
-        calculateItemsInView(ctx, state, { dataChanged: true });
-      }
-    }
-    return true;
-  }
-}
-
 // src/core/doMaintainScrollAtEnd.ts
 function doMaintainScrollAtEnd(ctx, state, animated) {
   const {
@@ -2191,6 +2146,129 @@ function checkAtTop(state) {
   );
 }
 
+// src/utils/updateAveragesOnDataChange.ts
+function updateAveragesOnDataChange(state, oldData, newData) {
+  var _a;
+  const {
+    averageSizes,
+    sizesKnown,
+    indexByKey,
+    props: { itemsAreEqual, getItemType, keyExtractor }
+  } = state;
+  if (!itemsAreEqual || !oldData.length || !newData.length) {
+    for (const key in averageSizes) {
+      delete averageSizes[key];
+    }
+    return;
+  }
+  const itemTypesToPreserve = {};
+  const newDataLength = newData.length;
+  const oldDataLength = oldData.length;
+  for (let newIndex = 0; newIndex < newDataLength; newIndex++) {
+    const newItem = newData[newIndex];
+    const id = keyExtractor ? keyExtractor(newItem, newIndex) : String(newIndex);
+    const oldIndex = indexByKey.get(id);
+    if (oldIndex !== void 0 && oldIndex < oldDataLength) {
+      const knownSize = sizesKnown.get(id);
+      if (knownSize === void 0) continue;
+      const oldItem = oldData[oldIndex];
+      const areEqual = itemsAreEqual(oldItem, newItem, newIndex, newData);
+      if (areEqual) {
+        const itemType = getItemType ? (_a = getItemType(newItem, newIndex)) != null ? _a : "" : "";
+        let typeData = itemTypesToPreserve[itemType];
+        if (!typeData) {
+          typeData = itemTypesToPreserve[itemType] = { count: 0, totalSize: 0 };
+        }
+        typeData.totalSize += knownSize;
+        typeData.count++;
+      }
+    }
+  }
+  for (const key in averageSizes) {
+    delete averageSizes[key];
+  }
+  for (const itemType in itemTypesToPreserve) {
+    const { totalSize, count } = itemTypesToPreserve[itemType];
+    if (count > 0) {
+      averageSizes[itemType] = {
+        avg: totalSize / count,
+        num: count
+      };
+    }
+  }
+}
+
+// src/core/checkResetContainers.ts
+function checkResetContainers(ctx, state, isFirst, dataProp) {
+  if (state) {
+    if (!isFirst && state.props.data !== dataProp) {
+      updateAveragesOnDataChange(state, state.props.data, dataProp);
+    }
+    const { maintainScrollAtEnd } = state.props;
+    if (!isFirst) {
+      calculateItemsInView(ctx, state, { dataChanged: true, doMVCP: true });
+      const shouldMaintainScrollAtEnd = maintainScrollAtEnd === true || maintainScrollAtEnd.onDataChange;
+      const didMaintainScrollAtEnd = shouldMaintainScrollAtEnd && doMaintainScrollAtEnd(ctx, state, false);
+      if (!didMaintainScrollAtEnd && dataProp.length > state.props.data.length) {
+        state.isEndReached = false;
+      }
+      if (!didMaintainScrollAtEnd) {
+        checkAtTop(state);
+        checkAtBottom(ctx, state);
+      }
+    }
+  }
+}
+
+// src/core/doInitialAllocateContainers.ts
+function doInitialAllocateContainers(ctx, state) {
+  var _a;
+  const {
+    scrollLength,
+    props: {
+      data,
+      getEstimatedItemSize,
+      getFixedItemSize,
+      getItemType,
+      scrollBuffer,
+      numColumns,
+      estimatedItemSize
+    }
+  } = state;
+  const hasContainers = peek$(ctx, "numContainers");
+  if (scrollLength > 0 && data.length > 0 && !hasContainers) {
+    let averageItemSize;
+    const fn = getFixedItemSize || getEstimatedItemSize;
+    if (fn) {
+      let totalSize = 0;
+      const num = Math.min(20, data.length);
+      for (let i = 0; i < num; i++) {
+        totalSize += fn(0, data[0], getItemType ? (_a = getItemType(data[0], 0)) != null ? _a : "" : "");
+      }
+      averageItemSize = totalSize / num;
+    } else {
+      averageItemSize = estimatedItemSize;
+    }
+    const numContainers = Math.ceil((scrollLength + scrollBuffer * 2) / averageItemSize * numColumns);
+    for (let i = 0; i < numContainers; i++) {
+      set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
+      set$(ctx, `containerColumn${i}`, -1);
+    }
+    set$(ctx, "numContainers", numContainers);
+    set$(ctx, "numContainersPooled", numContainers * state.props.initialContainerPoolRatio);
+    if (!IsNewArchitecture || state.lastLayout) {
+      if (state.props.initialScroll) {
+        requestAnimationFrame(() => {
+          calculateItemsInView(ctx, state, { dataChanged: true });
+        });
+      } else {
+        calculateItemsInView(ctx, state, { dataChanged: true });
+      }
+    }
+    return true;
+  }
+}
+
 // src/core/handleLayout.ts
 function handleLayout(ctx, state, layout, setCanRender) {
   const { maintainScrollAtEnd } = state.props;
@@ -2368,6 +2446,7 @@ function updateItemSize(ctx, state, itemKey, sizeObj) {
     if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
       shouldMaintainScrollAtEnd = true;
     }
+    addTotalSize(ctx, state, itemKey, diff);
     onItemSizeChanged == null ? void 0 : onItemSizeChanged({
       index,
       itemData: state.props.data[index],
@@ -2488,7 +2567,7 @@ function getRenderedItem(ctx, state, key) {
       item: data[index],
       type: getItemType ? (_a = getItemType(data[index], index)) != null ? _a : "" : ""
     };
-    renderedItem = isFunction(renderItem) ? renderItem(itemProps) : React3__default.createElement(renderItem, itemProps);
+    renderedItem = isFunction(renderItem) ? renderItem(itemProps) : React2__default.createElement(renderItem, itemProps);
   }
   return { index, item: data[index], renderedItem };
 }
@@ -2499,58 +2578,6 @@ function useThrottledOnScroll(originalHandler, scrollEventThrottle) {
   return (event) => throttle(originalHandler, scrollEventThrottle, { nativeEvent: event.nativeEvent });
 }
 
-// src/utils/updateAveragesOnDataChange.ts
-function updateAveragesOnDataChange(state, oldData, newData) {
-  var _a;
-  const {
-    averageSizes,
-    sizesKnown,
-    indexByKey,
-    props: { itemsAreEqual, getItemType, keyExtractor }
-  } = state;
-  if (!itemsAreEqual || !oldData.length || !newData.length) {
-    for (const key in averageSizes) {
-      delete averageSizes[key];
-    }
-    return;
-  }
-  const itemTypesToPreserve = {};
-  const newDataLength = newData.length;
-  const oldDataLength = oldData.length;
-  for (let newIndex = 0; newIndex < newDataLength; newIndex++) {
-    const newItem = newData[newIndex];
-    const id = keyExtractor ? keyExtractor(newItem, newIndex) : String(newIndex);
-    const oldIndex = indexByKey.get(id);
-    if (oldIndex !== void 0 && oldIndex < oldDataLength) {
-      const knownSize = sizesKnown.get(id);
-      if (knownSize === void 0) continue;
-      const oldItem = oldData[oldIndex];
-      const areEqual = itemsAreEqual(oldItem, newItem, newIndex, newData);
-      if (areEqual) {
-        const itemType = getItemType ? (_a = getItemType(newItem, newIndex)) != null ? _a : "" : "";
-        let typeData = itemTypesToPreserve[itemType];
-        if (!typeData) {
-          typeData = itemTypesToPreserve[itemType] = { count: 0, totalSize: 0 };
-        }
-        typeData.totalSize += knownSize;
-        typeData.count++;
-      }
-    }
-  }
-  for (const key in averageSizes) {
-    delete averageSizes[key];
-  }
-  for (const itemType in itemTypesToPreserve) {
-    const { totalSize, count } = itemTypesToPreserve[itemType];
-    if (count > 0) {
-      averageSizes[itemType] = {
-        avg: totalSize / count,
-        num: count
-      };
-    }
-  }
-}
-
 // src/components/LegendList.tsx
 var DEFAULT_DRAW_DISTANCE = 250;
 var DEFAULT_ITEM_SIZE = 100;
@@ -2560,14 +2587,14 @@ var LegendList = typedMemo(
     const isChildrenMode = children !== void 0 && dataProp === void 0;
     const processedProps = isChildrenMode ? {
       ...restProps,
-      data: (isArray(children) ? children : React3.Children.toArray(children)).flat(1),
+      data: (isArray(children) ? children : React2.Children.toArray(children)).flat(1),
       renderItem: ({ item }) => item
     } : {
       ...restProps,
       data: dataProp || [],
       renderItem: renderItemProp
     };
-    return /* @__PURE__ */ React3.createElement(StateProvider, null, /* @__PURE__ */ React3.createElement(LegendListInner, { ...processedProps, ref: forwardedRef }));
+    return /* @__PURE__ */ React2.createElement(StateProvider, null, /* @__PURE__ */ React2.createElement(LegendListInner, { ...processedProps, ref: forwardedRef }));
   })
 );
 var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
@@ -2626,7 +2653,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   } = props;
   const [renderNum, setRenderNum] = useState(0);
   const initialScroll = initialScrollIndexProp || initialScrollOffsetProp ? typeof initialScrollIndexProp === "object" ? { index: initialScrollIndexProp.index || 0, viewOffset: initialScrollIndexProp.viewOffset || 0 } : { index: initialScrollIndexProp || 0, viewOffset: initialScrollOffsetProp || 0 } : void 0;
-  const [canRender, setCanRender] = React3.useState(!IsNewArchitecture);
+  const [canRender, setCanRender] = React2.useState(!IsNewArchitecture);
   const contentContainerStyle = { ...StyleSheet.flatten(contentContainerStyleProp) };
   const style = { ...StyleSheet.flatten(styleProp) };
   const stylePaddingTopState = extractPadding(style, contentContainerStyle, "Top");
@@ -2733,27 +2760,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     suggestEstimatedItemSize: !!suggestEstimatedItemSize
   };
   state.refScroller = refScroller;
-  const checkResetContainers = (isFirst2) => {
-    const state2 = refState.current;
-    if (state2) {
-      if (!isFirst2 && state2.props.data !== dataProp) {
-        updateAveragesOnDataChange(state2, state2.props.data, dataProp);
-      }
-      state2.props.data = dataProp;
-      if (!isFirst2) {
-        calculateItemsInView(ctx, state2, { dataChanged: true, doMVCP: true });
-        const shouldMaintainScrollAtEnd = maintainScrollAtEnd === true || maintainScrollAtEnd.onDataChange;
-        const didMaintainScrollAtEnd = shouldMaintainScrollAtEnd && doMaintainScrollAtEnd(ctx, state2, false);
-        if (!didMaintainScrollAtEnd && dataProp.length > state2.props.data.length) {
-          state2.isEndReached = false;
-        }
-        if (!didMaintainScrollAtEnd) {
-          checkAtTop(state2);
-          checkAtBottom(ctx, state2);
-        }
-      }
-    }
-  };
   const memoizedLastItemKeys = useMemo(() => {
     if (!dataProp.length) return [];
     return Array.from(
@@ -2777,7 +2783,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   };
   if (isFirst) {
     initializeStateVars();
-    updateAllPositions(ctx, state);
+    updateItemPositions(
+      ctx,
+      state,
+      /*dataChanged*/
+      true
+    );
   }
   const initialContentOffset = useMemo(() => {
     if (initialScroll) {
@@ -2829,8 +2840,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     const didAllocateContainers = dataProp.length > 0 && doInitialAllocateContainersCallback();
     if (!didAllocateContainers) {
       checkResetContainers(
+        ctx,
+        state,
         /*isFirst*/
-        isFirst
+        isFirst,
+        dataProp
       );
     }
   }, [dataProp, numColumnsProp]);
@@ -2990,7 +3004,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }
     return onScrollFn;
   }, [stickyIndices == null ? void 0 : stickyIndices.length, horizontal, scrollEventThrottle]);
-  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(
     ListComponent,
     {
       ...rest,
@@ -3021,9 +3035,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       },
       onScroll: onScrollHandler,
       recycleItems,
-      refreshControl: refreshControl ? stylePaddingTopState > 0 ? React3.cloneElement(refreshControl, {
+      refreshControl: refreshControl ? stylePaddingTopState > 0 ? React2.cloneElement(refreshControl, {
         progressViewOffset: (refreshControl.props.progressViewOffset || 0) + stylePaddingTopState
-      }) : refreshControl : onRefresh && /* @__PURE__ */ React3.createElement(
+      }) : refreshControl : onRefresh && /* @__PURE__ */ React2.createElement(
         RefreshControl,
         {
           onRefresh,
@@ -3040,7 +3054,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       updateItemSize: fns.updateItemSize,
       waitForInitialLayout
     }
-  ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React3.createElement(DebugView, { state: refState.current }));
+  ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React2.createElement(DebugView, { state: refState.current }));
 });
 
 export { LegendList, useIsLastItem, useListScrollSize, useRecyclingEffect, useRecyclingState, useSyncLayout, useViewability, useViewabilityAmount };