@legendapp/list 2.0.0-next.6 → 2.0.0-next.7

package/index.d.mts

@@ -316,6 +316,14 @@ interface InternalState {
     loadStartTime: number;
     initialScroll: ScrollIndexWithOffsetPosition | undefined;
     lastLayout: LayoutRectangle | undefined;
+    queuedItemSizeUpdates: {
+        itemKey: string;
+        sizeObj: {
+            width: number;
+            height: number;
+        };
+    }[];
+    queuedItemSizeUpdatesWaiting?: boolean;
     props: {
         alignItemsAtEnd: boolean;
         data: readonly any[];
@@ -543,7 +551,7 @@ interface LegendListRecyclingState<T> {
 }
 type TypedForwardRef = <T, P = {}>(render: (props: P, ref: React.Ref<T>) => React.ReactNode) => (props: P & React.RefAttributes<T>) => React.ReactNode;
 declare const typedForwardRef: TypedForwardRef;
-type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<ComponentProps<T>>, nextProps: Readonly<ComponentProps<T>>) => boolean) => T & {
+type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<React.JSXElementConstructor<T>>, nextProps: Readonly<React.JSXElementConstructor<T>>) => boolean) => T & {
     displayName?: string;
 };
 declare const typedMemo: TypedMemo;

package/index.d.ts

@@ -316,6 +316,14 @@ interface InternalState {
     loadStartTime: number;
     initialScroll: ScrollIndexWithOffsetPosition | undefined;
     lastLayout: LayoutRectangle | undefined;
+    queuedItemSizeUpdates: {
+        itemKey: string;
+        sizeObj: {
+            width: number;
+            height: number;
+        };
+    }[];
+    queuedItemSizeUpdatesWaiting?: boolean;
     props: {
         alignItemsAtEnd: boolean;
         data: readonly any[];
@@ -543,7 +551,7 @@ interface LegendListRecyclingState<T> {
 }
 type TypedForwardRef = <T, P = {}>(render: (props: P, ref: React.Ref<T>) => React.ReactNode) => (props: P & React.RefAttributes<T>) => React.ReactNode;
 declare const typedForwardRef: TypedForwardRef;
-type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<ComponentProps<T>>, nextProps: Readonly<ComponentProps<T>>) => boolean) => T & {
+type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<React.JSXElementConstructor<T>>, nextProps: Readonly<React.JSXElementConstructor<T>>) => boolean) => T & {
     displayName?: string;
 };
 declare const typedMemo: TypedMemo;

package/index.js

@@ -595,13 +595,15 @@ function useSyncLayout({
     },
     [onChange]
   );
-  React3.useLayoutEffect(() => {
-    if (ref.current) {
-      ref.current.measure((x, y, width, height) => {
-        onChange({ height, width, x, y }, true);
-      });
-    }
-  }, []);
+  if (IsNewArchitecture) {
+    React3.useLayoutEffect(() => {
+      if (ref.current) {
+        ref.current.measure((x, y, width, height) => {
+          onChange({ height, width, x, y }, true);
+        });
+      }
+    }, []);
+  }
   return { onLayout, ref };
 }
 
@@ -768,7 +770,7 @@ function getItemSize(state, key, index, data, useAverageSize) {
     return sizeKnown;
   }
   let size;
-  if (IsNewArchitecture && useAverageSize !== void 0 && sizeKnown === void 0 && !getEstimatedItemSize && !scrollingTo) {
+  if (useAverageSize !== void 0 && sizeKnown === void 0 && !getEstimatedItemSize && !scrollingTo) {
     size = useAverageSize;
   }
   if (size === void 0) {
@@ -1484,265 +1486,267 @@ function setDidLayout(ctx, state) {
 
 // src/core/calculateItemsInView.ts
 function calculateItemsInView(ctx, state, params = {}) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  const {
-    scrollLength,
-    startBufferedId: startBufferedIdOrig,
-    positions,
-    columns,
-    containerItemKeys,
-    idCache,
-    sizes,
-    indexByKey,
-    scrollForNextCalculateItemsInView,
-    enableScrollForNextCalculateItemsInView,
-    minIndexSizeChanged
-  } = state;
-  const data = state.props.data;
-  const prevNumContainers = peek$(ctx, "numContainers");
-  if (!data || scrollLength === 0 || !prevNumContainers) {
-    return;
-  }
-  const totalSize = peek$(ctx, "totalSize");
-  const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
-  const numColumns = peek$(ctx, "numColumns");
-  const previousScrollAdjust = 0;
-  const { dataChanged, doMVCP } = params;
-  const speed = getScrollVelocity(state);
-  if (doMVCP || dataChanged) {
-    const checkMVCP = doMVCP ? prepareMVCP(ctx, state) : void 0;
-    updateAllPositions(ctx, state, dataChanged);
-    checkMVCP == null ? void 0 : checkMVCP();
-  }
-  const scrollExtra = 0;
-  const { queuedInitialLayout } = state;
-  let { scroll: scrollState } = state;
-  const initialScroll = state.props.initialScroll;
-  if (!queuedInitialLayout && initialScroll) {
-    const updatedOffset = calculateOffsetWithOffsetPosition(
-      state,
-      calculateOffsetForIndex(ctx, state, initialScroll.index),
-      initialScroll
-    );
-    scrollState = updatedOffset;
-  }
-  const scrollAdjustPad = -previousScrollAdjust - topPad;
-  let scroll = scrollState + scrollExtra + scrollAdjustPad;
-  if (scroll + scrollLength > totalSize) {
-    scroll = totalSize - scrollLength;
-  }
-  if (ENABLE_DEBUG_VIEW) {
-    set$(ctx, "debugRawScroll", scrollState);
-    set$(ctx, "debugComputedScroll", scroll);
-  }
-  const scrollBuffer = state.props.scrollBuffer;
-  let scrollBufferTop = scrollBuffer;
-  let scrollBufferBottom = scrollBuffer;
-  if (speed > 0) {
-    scrollBufferTop = scrollBuffer * 0.5;
-    scrollBufferBottom = scrollBuffer * 1.5;
-  } else {
-    scrollBufferTop = scrollBuffer * 1.5;
-    scrollBufferBottom = scrollBuffer * 0.5;
-  }
-  const scrollTopBuffered = scroll - scrollBufferTop;
-  const scrollBottom = scroll + scrollLength;
-  const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
-  if (scrollForNextCalculateItemsInView) {
-    const { top, bottom } = scrollForNextCalculateItemsInView;
-    if (scrollTopBuffered > top && scrollBottomBuffered < bottom) {
+  reactNative.unstable_batchedUpdates(() => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    const {
+      scrollLength,
+      startBufferedId: startBufferedIdOrig,
+      positions,
+      columns,
+      containerItemKeys,
+      idCache,
+      sizes,
+      indexByKey,
+      scrollForNextCalculateItemsInView,
+      enableScrollForNextCalculateItemsInView,
+      minIndexSizeChanged
+    } = state;
+    const data = state.props.data;
+    const prevNumContainers = peek$(ctx, "numContainers");
+    if (!data || scrollLength === 0 || !prevNumContainers) {
       return;
     }
-  }
-  let startNoBuffer = null;
-  let startBuffered = null;
-  let startBufferedId = null;
-  let endNoBuffer = null;
-  let endBuffered = null;
-  let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
-  if (minIndexSizeChanged !== void 0) {
-    loopStart = Math.min(minIndexSizeChanged, loopStart);
-    state.minIndexSizeChanged = void 0;
-  }
-  for (let i = loopStart; i >= 0; i--) {
-    const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
-    const top = positions.get(id);
-    const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
-    const bottom = top + size;
-    if (bottom > scroll - scrollBuffer) {
-      loopStart = i;
+    const totalSize = peek$(ctx, "totalSize");
+    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
+    const numColumns = peek$(ctx, "numColumns");
+    const previousScrollAdjust = 0;
+    const { dataChanged, doMVCP } = params;
+    const speed = getScrollVelocity(state);
+    if (doMVCP || dataChanged) {
+      const checkMVCP = doMVCP ? prepareMVCP(ctx, state) : void 0;
+      updateAllPositions(ctx, state, dataChanged);
+      checkMVCP == null ? void 0 : checkMVCP();
+    }
+    const scrollExtra = 0;
+    const { queuedInitialLayout } = state;
+    let { scroll: scrollState } = state;
+    const initialScroll = state.props.initialScroll;
+    if (!queuedInitialLayout && initialScroll) {
+      const updatedOffset = calculateOffsetWithOffsetPosition(
+        state,
+        calculateOffsetForIndex(ctx, state, initialScroll.index),
+        initialScroll
+      );
+      scrollState = updatedOffset;
+    }
+    const scrollAdjustPad = -previousScrollAdjust - topPad;
+    let scroll = scrollState + scrollExtra + scrollAdjustPad;
+    if (scroll + scrollLength > totalSize) {
+      scroll = totalSize - scrollLength;
+    }
+    if (ENABLE_DEBUG_VIEW) {
+      set$(ctx, "debugRawScroll", scrollState);
+      set$(ctx, "debugComputedScroll", scroll);
+    }
+    const scrollBuffer = state.props.scrollBuffer;
+    let scrollBufferTop = scrollBuffer;
+    let scrollBufferBottom = scrollBuffer;
+    if (speed > 0) {
+      scrollBufferTop = scrollBuffer * 0.5;
+      scrollBufferBottom = scrollBuffer * 1.5;
     } else {
-      break;
-    }
-  }
-  const loopStartMod = loopStart % numColumns;
-  if (loopStartMod > 0) {
-    loopStart -= loopStartMod;
-  }
-  let foundEnd = false;
-  let nextTop;
-  let nextBottom;
-  let maxIndexRendered = 0;
-  for (let i = 0; i < prevNumContainers; i++) {
-    const key = peek$(ctx, `containerItemKey${i}`);
-    if (key !== void 0) {
-      const index = indexByKey.get(key);
-      maxIndexRendered = Math.max(maxIndexRendered, index);
-    }
-  }
-  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 top = positions.get(id);
-    if (!foundEnd) {
-      if (startNoBuffer === null && top + size > scroll) {
-        startNoBuffer = i;
-      }
-      if (firstFullyOnScreenIndex === void 0 && top >= scroll - 10) {
-        firstFullyOnScreenIndex = i;
+      scrollBufferTop = scrollBuffer * 1.5;
+      scrollBufferBottom = scrollBuffer * 0.5;
+    }
+    const scrollTopBuffered = scroll - scrollBufferTop;
+    const scrollBottom = scroll + scrollLength;
+    const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
+    if (scrollForNextCalculateItemsInView) {
+      const { top, bottom } = scrollForNextCalculateItemsInView;
+      if (scrollTopBuffered > top && scrollBottomBuffered < bottom) {
+        return;
       }
-      if (startBuffered === null && top + size > scrollTopBuffered) {
-        startBuffered = i;
-        startBufferedId = id;
-        nextTop = top;
+    }
+    let startNoBuffer = null;
+    let startBuffered = null;
+    let startBufferedId = null;
+    let endNoBuffer = null;
+    let endBuffered = null;
+    let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
+    if (minIndexSizeChanged !== void 0) {
+      loopStart = Math.min(minIndexSizeChanged, loopStart);
+      state.minIndexSizeChanged = void 0;
+    }
+    for (let i = loopStart; i >= 0; i--) {
+      const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
+      const top = positions.get(id);
+      const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
+      const bottom = top + size;
+      if (bottom > scroll - scrollBuffer) {
+        loopStart = i;
+      } else {
+        break;
       }
-      if (startNoBuffer !== null) {
-        if (top <= scrollBottom) {
-          endNoBuffer = i;
+    }
+    const loopStartMod = loopStart % numColumns;
+    if (loopStartMod > 0) {
+      loopStart -= loopStartMod;
+    }
+    let foundEnd = false;
+    let nextTop;
+    let nextBottom;
+    let maxIndexRendered = 0;
+    for (let i = 0; i < prevNumContainers; i++) {
+      const key = peek$(ctx, `containerItemKey${i}`);
+      if (key !== void 0) {
+        const index = indexByKey.get(key);
+        maxIndexRendered = Math.max(maxIndexRendered, index);
+      }
+    }
+    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 top = positions.get(id);
+      if (!foundEnd) {
+        if (startNoBuffer === null && top + size > scroll) {
+          startNoBuffer = i;
+        }
+        if (firstFullyOnScreenIndex === void 0 && top >= scroll - 10) {
+          firstFullyOnScreenIndex = i;
         }
-        if (top <= scrollBottomBuffered) {
-          endBuffered = i;
-          nextBottom = top + size;
-        } else {
-          foundEnd = true;
+        if (startBuffered === null && top + size > scrollTopBuffered) {
+          startBuffered = i;
+          startBufferedId = id;
+          nextTop = top;
+        }
+        if (startNoBuffer !== null) {
+          if (top <= scrollBottom) {
+            endNoBuffer = i;
+          }
+          if (top <= scrollBottomBuffered) {
+            endBuffered = i;
+            nextBottom = top + size;
+          } else {
+            foundEnd = true;
+          }
         }
       }
     }
-  }
-  const idsInView = [];
-  for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
-    const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
-    idsInView.push(id);
-  }
-  Object.assign(state, {
-    endBuffered,
-    endNoBuffer,
-    firstFullyOnScreenIndex,
-    idsInView,
-    startBuffered,
-    startBufferedId,
-    startNoBuffer
-  });
-  if (enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0) {
-    state.scrollForNextCalculateItemsInView = nextTop !== void 0 && nextBottom !== void 0 ? {
-      bottom: nextBottom,
-      top: nextTop
-    } : void 0;
-  }
-  const numContainers = peek$(ctx, "numContainers");
-  const pendingRemoval = [];
-  if (dataChanged) {
-    for (let i = 0; i < numContainers; i++) {
-      const itemKey = peek$(ctx, `containerItemKey${i}`);
-      if (!state.props.keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
-        pendingRemoval.push(i);
-      }
+    const idsInView = [];
+    for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
+      const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
+      idsInView.push(id);
     }
-  }
-  if (startBuffered !== null && endBuffered !== null) {
-    let numContainers2 = prevNumContainers;
-    const needNewContainers = [];
-    for (let i = startBuffered; i <= endBuffered; i++) {
-      const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
-      if (!containerItemKeys.has(id)) {
-        needNewContainers.push(i);
-      }
+    Object.assign(state, {
+      endBuffered,
+      endNoBuffer,
+      firstFullyOnScreenIndex,
+      idsInView,
+      startBuffered,
+      startBufferedId,
+      startNoBuffer
+    });
+    if (enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0) {
+      state.scrollForNextCalculateItemsInView = nextTop !== void 0 && nextBottom !== void 0 ? {
+        bottom: nextBottom,
+        top: nextTop
+      } : void 0;
     }
-    if (needNewContainers.length > 0) {
-      const availableContainers = findAvailableContainers(
-        ctx,
-        state,
-        needNewContainers.length,
-        startBuffered,
-        endBuffered,
-        pendingRemoval
-      );
-      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 oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
-        if (oldKey && oldKey !== id) {
-          containerItemKeys.delete(oldKey);
-        }
-        set$(ctx, `containerItemKey${containerIndex}`, id);
-        set$(ctx, `containerItemData${containerIndex}`, data[i]);
-        containerItemKeys.add(id);
-        if (containerIndex >= numContainers2) {
-          numContainers2 = containerIndex + 1;
-        }
-      }
-      if (numContainers2 !== prevNumContainers) {
-        set$(ctx, "numContainers", numContainers2);
-        if (numContainers2 > peek$(ctx, "numContainersPooled")) {
-          set$(ctx, "numContainersPooled", Math.ceil(numContainers2 * 1.5));
+    const numContainers = peek$(ctx, "numContainers");
+    const pendingRemoval = [];
+    if (dataChanged) {
+      for (let i = 0; i < numContainers; i++) {
+        const itemKey = peek$(ctx, `containerItemKey${i}`);
+        if (!state.props.keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
+          pendingRemoval.push(i);
         }
       }
     }
-  }
-  for (let i = 0; i < numContainers; i++) {
-    const itemKey = peek$(ctx, `containerItemKey${i}`);
-    if (pendingRemoval.includes(i)) {
-      if (itemKey) {
-        containerItemKeys.delete(itemKey);
+    if (startBuffered !== null && endBuffered !== null) {
+      let numContainers2 = prevNumContainers;
+      const needNewContainers = [];
+      for (let i = startBuffered; i <= endBuffered; i++) {
+        const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
+        if (!containerItemKeys.has(id)) {
+          needNewContainers.push(i);
+        }
       }
-      set$(ctx, `containerItemKey${i}`, void 0);
-      set$(ctx, `containerItemData${i}`, void 0);
-      set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
-      set$(ctx, `containerColumn${i}`, -1);
-    } else {
-      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 position = positions.get(id);
-        if (position === void 0) {
-          set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
-        } else {
-          const column = columns.get(id) || 1;
-          const prevPos = peek$(ctx, `containerPosition${i}`);
-          const prevColumn = peek$(ctx, `containerColumn${i}`);
-          const prevData = peek$(ctx, `containerItemData${i}`);
-          if (position > POSITION_OUT_OF_VIEW && position !== prevPos) {
-            set$(ctx, `containerPosition${i}`, position);
+      if (needNewContainers.length > 0) {
+        const availableContainers = findAvailableContainers(
+          ctx,
+          state,
+          needNewContainers.length,
+          startBuffered,
+          endBuffered,
+          pendingRemoval
+        );
+        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 oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
+          if (oldKey && oldKey !== id) {
+            containerItemKeys.delete(oldKey);
           }
-          if (column >= 0 && column !== prevColumn) {
-            set$(ctx, `containerColumn${i}`, column);
+          set$(ctx, `containerItemKey${containerIndex}`, id);
+          set$(ctx, `containerItemData${containerIndex}`, data[i]);
+          containerItemKeys.add(id);
+          if (containerIndex >= numContainers2) {
+            numContainers2 = containerIndex + 1;
           }
-          if (prevData !== item) {
-            set$(ctx, `containerItemData${i}`, data[itemIndex]);
+        }
+        if (numContainers2 !== prevNumContainers) {
+          set$(ctx, "numContainers", numContainers2);
+          if (numContainers2 > peek$(ctx, "numContainersPooled")) {
+            set$(ctx, "numContainersPooled", Math.ceil(numContainers2 * 1.5));
           }
         }
       }
     }
-  }
-  if (!queuedInitialLayout && endBuffered !== null) {
-    if (checkAllSizesKnown(state)) {
-      setDidLayout(ctx, state);
+    for (let i = 0; i < numContainers; i++) {
+      const itemKey = peek$(ctx, `containerItemKey${i}`);
+      if (pendingRemoval.includes(i)) {
+        if (itemKey) {
+          containerItemKeys.delete(itemKey);
+        }
+        set$(ctx, `containerItemKey${i}`, void 0);
+        set$(ctx, `containerItemData${i}`, void 0);
+        set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
+        set$(ctx, `containerColumn${i}`, -1);
+      } else {
+        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 position = positions.get(id);
+          if (position === void 0) {
+            set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
+          } else {
+            const column = columns.get(id) || 1;
+            const prevPos = peek$(ctx, `containerPosition${i}`);
+            const prevColumn = peek$(ctx, `containerColumn${i}`);
+            const prevData = peek$(ctx, `containerItemData${i}`);
+            if (position > POSITION_OUT_OF_VIEW && position !== prevPos) {
+              set$(ctx, `containerPosition${i}`, position);
+            }
+            if (column >= 0 && column !== prevColumn) {
+              set$(ctx, `containerColumn${i}`, column);
+            }
+            if (prevData !== item) {
+              set$(ctx, `containerItemData${i}`, data[itemIndex]);
+            }
+          }
+        }
+      }
     }
-  }
-  if (state.props.viewabilityConfigCallbackPairs) {
-    updateViewableItems(
-      state,
-      ctx,
-      state.props.viewabilityConfigCallbackPairs,
-      scrollLength,
-      startNoBuffer,
-      endNoBuffer
-    );
-  }
+    if (!queuedInitialLayout && endBuffered !== null) {
+      if (checkAllSizesKnown(state)) {
+        setDidLayout(ctx, state);
+      }
+    }
+    if (state.props.viewabilityConfigCallbackPairs) {
+      updateViewableItems(
+        state,
+        ctx,
+        state.props.viewabilityConfigCallbackPairs,
+        scrollLength,
+        startNoBuffer,
+        endNoBuffer
+      );
+    }
+  });
 }
 
 // src/core/doInitialAllocateContainers.ts
@@ -2016,32 +2020,20 @@ function updateItemSizes(ctx, state, itemUpdates) {
   }
 }
 function updateItemSize(ctx, state, itemKey, sizeObj) {
-  if (IsNewArchitecture) {
-    const { sizesKnown } = state;
-    const numContainers = peek$(ctx, "numContainers");
-    const changes = [];
-    for (let i = 0; i < numContainers; i++) {
-      const containerItemKey = peek$(ctx, `containerItemKey${i}`);
-      if (itemKey === containerItemKey) {
-        changes.push({ itemKey, sizeObj });
-      } else if (!sizesKnown.has(containerItemKey) && containerItemKey !== void 0) {
-        const containerRef = ctx.viewRefs.get(i);
-        if (containerRef == null ? void 0 : containerRef.current) {
-          let measured;
-          containerRef.current.measure((x, y, width, height) => {
-            measured = { height, width, x, y };
-          });
-          if (measured) {
-            changes.push({ itemKey: containerItemKey, sizeObj: measured });
-          }
-        }
-      }
-    }
-    if (changes.length > 0) {
-      updateItemSizes(ctx, state, changes);
+  const { queuedItemSizeUpdates, queuedItemSizeUpdatesWaiting } = state;
+  const containersDidLayout = peek$(ctx, "containersDidLayout");
+  if (!containersDidLayout || !queuedItemSizeUpdatesWaiting) {
+    updateItemSizes(ctx, state, [{ itemKey, sizeObj }]);
+    if (containersDidLayout) {
+      state.queuedItemSizeUpdatesWaiting = true;
+      requestAnimationFrame(() => {
+        state.queuedItemSizeUpdatesWaiting = false;
+        updateItemSizes(ctx, state, queuedItemSizeUpdates);
+        queuedItemSizeUpdates.length = 0;
+      });
     }
   } else {
-    updateItemSizes(ctx, state, [{ itemKey, sizeObj }]);
+    queuedItemSizeUpdates.push({ itemKey, sizeObj });
   }
 }
 function updateOneItemSize(state, itemKey, sizeObj) {
@@ -2222,6 +2214,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       positions: /* @__PURE__ */ new Map(),
       props: {},
       queuedCalculateItemsInView: 0,
+      queuedItemSizeUpdates: [],
       refScroller: void 0,
       scroll: 0,
       scrollAdjustHandler: new ScrollAdjustHandler(ctx),

package/index.mjs

@@ -1,6 +1,6 @@
 import * as React3 from 'react';
 import React3__default, { useReducer, useEffect, createContext, useRef, useState, useMemo, useLayoutEffect, useCallback, useImperativeHandle, useContext, forwardRef, memo } from 'react';
-import { View, Text, Platform, Animated, ScrollView, StyleSheet, Dimensions, RefreshControl } from 'react-native';
+import { View, Text, Platform, Animated, ScrollView, StyleSheet, Dimensions, RefreshControl, unstable_batchedUpdates } from 'react-native';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 
 // src/components/LazyLegendList.tsx
@@ -574,13 +574,15 @@ function useSyncLayout({
     },
     [onChange]
   );
-  useLayoutEffect(() => {
-    if (ref.current) {
-      ref.current.measure((x, y, width, height) => {
-        onChange({ height, width, x, y }, true);
-      });
-    }
-  }, []);
+  if (IsNewArchitecture) {
+    useLayoutEffect(() => {
+      if (ref.current) {
+        ref.current.measure((x, y, width, height) => {
+          onChange({ height, width, x, y }, true);
+        });
+      }
+    }, []);
+  }
   return { onLayout, ref };
 }
 
@@ -747,7 +749,7 @@ function getItemSize(state, key, index, data, useAverageSize) {
     return sizeKnown;
   }
   let size;
-  if (IsNewArchitecture && useAverageSize !== void 0 && sizeKnown === void 0 && !getEstimatedItemSize && !scrollingTo) {
+  if (useAverageSize !== void 0 && sizeKnown === void 0 && !getEstimatedItemSize && !scrollingTo) {
     size = useAverageSize;
   }
   if (size === void 0) {
@@ -1463,265 +1465,267 @@ function setDidLayout(ctx, state) {
 
 // src/core/calculateItemsInView.ts
 function calculateItemsInView(ctx, state, params = {}) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  const {
-    scrollLength,
-    startBufferedId: startBufferedIdOrig,
-    positions,
-    columns,
-    containerItemKeys,
-    idCache,
-    sizes,
-    indexByKey,
-    scrollForNextCalculateItemsInView,
-    enableScrollForNextCalculateItemsInView,
-    minIndexSizeChanged
-  } = state;
-  const data = state.props.data;
-  const prevNumContainers = peek$(ctx, "numContainers");
-  if (!data || scrollLength === 0 || !prevNumContainers) {
-    return;
-  }
-  const totalSize = peek$(ctx, "totalSize");
-  const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
-  const numColumns = peek$(ctx, "numColumns");
-  const previousScrollAdjust = 0;
-  const { dataChanged, doMVCP } = params;
-  const speed = getScrollVelocity(state);
-  if (doMVCP || dataChanged) {
-    const checkMVCP = doMVCP ? prepareMVCP(ctx, state) : void 0;
-    updateAllPositions(ctx, state, dataChanged);
-    checkMVCP == null ? void 0 : checkMVCP();
-  }
-  const scrollExtra = 0;
-  const { queuedInitialLayout } = state;
-  let { scroll: scrollState } = state;
-  const initialScroll = state.props.initialScroll;
-  if (!queuedInitialLayout && initialScroll) {
-    const updatedOffset = calculateOffsetWithOffsetPosition(
-      state,
-      calculateOffsetForIndex(ctx, state, initialScroll.index),
-      initialScroll
-    );
-    scrollState = updatedOffset;
-  }
-  const scrollAdjustPad = -previousScrollAdjust - topPad;
-  let scroll = scrollState + scrollExtra + scrollAdjustPad;
-  if (scroll + scrollLength > totalSize) {
-    scroll = totalSize - scrollLength;
-  }
-  if (ENABLE_DEBUG_VIEW) {
-    set$(ctx, "debugRawScroll", scrollState);
-    set$(ctx, "debugComputedScroll", scroll);
-  }
-  const scrollBuffer = state.props.scrollBuffer;
-  let scrollBufferTop = scrollBuffer;
-  let scrollBufferBottom = scrollBuffer;
-  if (speed > 0) {
-    scrollBufferTop = scrollBuffer * 0.5;
-    scrollBufferBottom = scrollBuffer * 1.5;
-  } else {
-    scrollBufferTop = scrollBuffer * 1.5;
-    scrollBufferBottom = scrollBuffer * 0.5;
-  }
-  const scrollTopBuffered = scroll - scrollBufferTop;
-  const scrollBottom = scroll + scrollLength;
-  const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
-  if (scrollForNextCalculateItemsInView) {
-    const { top, bottom } = scrollForNextCalculateItemsInView;
-    if (scrollTopBuffered > top && scrollBottomBuffered < bottom) {
+  unstable_batchedUpdates(() => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    const {
+      scrollLength,
+      startBufferedId: startBufferedIdOrig,
+      positions,
+      columns,
+      containerItemKeys,
+      idCache,
+      sizes,
+      indexByKey,
+      scrollForNextCalculateItemsInView,
+      enableScrollForNextCalculateItemsInView,
+      minIndexSizeChanged
+    } = state;
+    const data = state.props.data;
+    const prevNumContainers = peek$(ctx, "numContainers");
+    if (!data || scrollLength === 0 || !prevNumContainers) {
       return;
     }
-  }
-  let startNoBuffer = null;
-  let startBuffered = null;
-  let startBufferedId = null;
-  let endNoBuffer = null;
-  let endBuffered = null;
-  let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
-  if (minIndexSizeChanged !== void 0) {
-    loopStart = Math.min(minIndexSizeChanged, loopStart);
-    state.minIndexSizeChanged = void 0;
-  }
-  for (let i = loopStart; i >= 0; i--) {
-    const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
-    const top = positions.get(id);
-    const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
-    const bottom = top + size;
-    if (bottom > scroll - scrollBuffer) {
-      loopStart = i;
+    const totalSize = peek$(ctx, "totalSize");
+    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
+    const numColumns = peek$(ctx, "numColumns");
+    const previousScrollAdjust = 0;
+    const { dataChanged, doMVCP } = params;
+    const speed = getScrollVelocity(state);
+    if (doMVCP || dataChanged) {
+      const checkMVCP = doMVCP ? prepareMVCP(ctx, state) : void 0;
+      updateAllPositions(ctx, state, dataChanged);
+      checkMVCP == null ? void 0 : checkMVCP();
+    }
+    const scrollExtra = 0;
+    const { queuedInitialLayout } = state;
+    let { scroll: scrollState } = state;
+    const initialScroll = state.props.initialScroll;
+    if (!queuedInitialLayout && initialScroll) {
+      const updatedOffset = calculateOffsetWithOffsetPosition(
+        state,
+        calculateOffsetForIndex(ctx, state, initialScroll.index),
+        initialScroll
+      );
+      scrollState = updatedOffset;
+    }
+    const scrollAdjustPad = -previousScrollAdjust - topPad;
+    let scroll = scrollState + scrollExtra + scrollAdjustPad;
+    if (scroll + scrollLength > totalSize) {
+      scroll = totalSize - scrollLength;
+    }
+    if (ENABLE_DEBUG_VIEW) {
+      set$(ctx, "debugRawScroll", scrollState);
+      set$(ctx, "debugComputedScroll", scroll);
+    }
+    const scrollBuffer = state.props.scrollBuffer;
+    let scrollBufferTop = scrollBuffer;
+    let scrollBufferBottom = scrollBuffer;
+    if (speed > 0) {
+      scrollBufferTop = scrollBuffer * 0.5;
+      scrollBufferBottom = scrollBuffer * 1.5;
     } else {
-      break;
-    }
-  }
-  const loopStartMod = loopStart % numColumns;
-  if (loopStartMod > 0) {
-    loopStart -= loopStartMod;
-  }
-  let foundEnd = false;
-  let nextTop;
-  let nextBottom;
-  let maxIndexRendered = 0;
-  for (let i = 0; i < prevNumContainers; i++) {
-    const key = peek$(ctx, `containerItemKey${i}`);
-    if (key !== void 0) {
-      const index = indexByKey.get(key);
-      maxIndexRendered = Math.max(maxIndexRendered, index);
-    }
-  }
-  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 top = positions.get(id);
-    if (!foundEnd) {
-      if (startNoBuffer === null && top + size > scroll) {
-        startNoBuffer = i;
-      }
-      if (firstFullyOnScreenIndex === void 0 && top >= scroll - 10) {
-        firstFullyOnScreenIndex = i;
-      }
-      if (startBuffered === null && top + size > scrollTopBuffered) {
-        startBuffered = i;
-        startBufferedId = id;
-        nextTop = top;
-      }
-      if (startNoBuffer !== null) {
-        if (top <= scrollBottom) {
-          endNoBuffer = i;
-        }
-        if (top <= scrollBottomBuffered) {
-          endBuffered = i;
-          nextBottom = top + size;
-        } else {
-          foundEnd = true;
-        }
+      scrollBufferTop = scrollBuffer * 1.5;
+      scrollBufferBottom = scrollBuffer * 0.5;
+    }
+    const scrollTopBuffered = scroll - scrollBufferTop;
+    const scrollBottom = scroll + scrollLength;
+    const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
+    if (scrollForNextCalculateItemsInView) {
+      const { top, bottom } = scrollForNextCalculateItemsInView;
+      if (scrollTopBuffered > top && scrollBottomBuffered < bottom) {
+        return;
       }
     }
-  }
-  const idsInView = [];
-  for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
-    const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
-    idsInView.push(id);
-  }
-  Object.assign(state, {
-    endBuffered,
-    endNoBuffer,
-    firstFullyOnScreenIndex,
-    idsInView,
-    startBuffered,
-    startBufferedId,
-    startNoBuffer
-  });
-  if (enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0) {
-    state.scrollForNextCalculateItemsInView = nextTop !== void 0 && nextBottom !== void 0 ? {
-      bottom: nextBottom,
-      top: nextTop
-    } : void 0;
-  }
-  const numContainers = peek$(ctx, "numContainers");
-  const pendingRemoval = [];
-  if (dataChanged) {
-    for (let i = 0; i < numContainers; i++) {
-      const itemKey = peek$(ctx, `containerItemKey${i}`);
-      if (!state.props.keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
-        pendingRemoval.push(i);
+    let startNoBuffer = null;
+    let startBuffered = null;
+    let startBufferedId = null;
+    let endNoBuffer = null;
+    let endBuffered = null;
+    let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
+    if (minIndexSizeChanged !== void 0) {
+      loopStart = Math.min(minIndexSizeChanged, loopStart);
+      state.minIndexSizeChanged = void 0;
+    }
+    for (let i = loopStart; i >= 0; i--) {
+      const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
+      const top = positions.get(id);
+      const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
+      const bottom = top + size;
+      if (bottom > scroll - scrollBuffer) {
+        loopStart = i;
+      } else {
+        break;
       }
     }
-  }
-  if (startBuffered !== null && endBuffered !== null) {
-    let numContainers2 = prevNumContainers;
-    const needNewContainers = [];
-    for (let i = startBuffered; i <= endBuffered; i++) {
-      const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
-      if (!containerItemKeys.has(id)) {
-        needNewContainers.push(i);
+    const loopStartMod = loopStart % numColumns;
+    if (loopStartMod > 0) {
+      loopStart -= loopStartMod;
+    }
+    let foundEnd = false;
+    let nextTop;
+    let nextBottom;
+    let maxIndexRendered = 0;
+    for (let i = 0; i < prevNumContainers; i++) {
+      const key = peek$(ctx, `containerItemKey${i}`);
+      if (key !== void 0) {
+        const index = indexByKey.get(key);
+        maxIndexRendered = Math.max(maxIndexRendered, index);
       }
     }
-    if (needNewContainers.length > 0) {
-      const availableContainers = findAvailableContainers(
-        ctx,
-        state,
-        needNewContainers.length,
-        startBuffered,
-        endBuffered,
-        pendingRemoval
-      );
-      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 oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
-        if (oldKey && oldKey !== id) {
-          containerItemKeys.delete(oldKey);
+    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 top = positions.get(id);
+      if (!foundEnd) {
+        if (startNoBuffer === null && top + size > scroll) {
+          startNoBuffer = i;
+        }
+        if (firstFullyOnScreenIndex === void 0 && top >= scroll - 10) {
+          firstFullyOnScreenIndex = i;
         }
-        set$(ctx, `containerItemKey${containerIndex}`, id);
-        set$(ctx, `containerItemData${containerIndex}`, data[i]);
-        containerItemKeys.add(id);
-        if (containerIndex >= numContainers2) {
-          numContainers2 = containerIndex + 1;
+        if (startBuffered === null && top + size > scrollTopBuffered) {
+          startBuffered = i;
+          startBufferedId = id;
+          nextTop = top;
+        }
+        if (startNoBuffer !== null) {
+          if (top <= scrollBottom) {
+            endNoBuffer = i;
+          }
+          if (top <= scrollBottomBuffered) {
+            endBuffered = i;
+            nextBottom = top + size;
+          } else {
+            foundEnd = true;
+          }
         }
       }
-      if (numContainers2 !== prevNumContainers) {
-        set$(ctx, "numContainers", numContainers2);
-        if (numContainers2 > peek$(ctx, "numContainersPooled")) {
-          set$(ctx, "numContainersPooled", Math.ceil(numContainers2 * 1.5));
+    }
+    const idsInView = [];
+    for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
+      const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
+      idsInView.push(id);
+    }
+    Object.assign(state, {
+      endBuffered,
+      endNoBuffer,
+      firstFullyOnScreenIndex,
+      idsInView,
+      startBuffered,
+      startBufferedId,
+      startNoBuffer
+    });
+    if (enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0) {
+      state.scrollForNextCalculateItemsInView = nextTop !== void 0 && nextBottom !== void 0 ? {
+        bottom: nextBottom,
+        top: nextTop
+      } : void 0;
+    }
+    const numContainers = peek$(ctx, "numContainers");
+    const pendingRemoval = [];
+    if (dataChanged) {
+      for (let i = 0; i < numContainers; i++) {
+        const itemKey = peek$(ctx, `containerItemKey${i}`);
+        if (!state.props.keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
+          pendingRemoval.push(i);
         }
       }
     }
-  }
-  for (let i = 0; i < numContainers; i++) {
-    const itemKey = peek$(ctx, `containerItemKey${i}`);
-    if (pendingRemoval.includes(i)) {
-      if (itemKey) {
-        containerItemKeys.delete(itemKey);
+    if (startBuffered !== null && endBuffered !== null) {
+      let numContainers2 = prevNumContainers;
+      const needNewContainers = [];
+      for (let i = startBuffered; i <= endBuffered; i++) {
+        const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
+        if (!containerItemKeys.has(id)) {
+          needNewContainers.push(i);
+        }
       }
-      set$(ctx, `containerItemKey${i}`, void 0);
-      set$(ctx, `containerItemData${i}`, void 0);
-      set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
-      set$(ctx, `containerColumn${i}`, -1);
-    } else {
-      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 position = positions.get(id);
-        if (position === void 0) {
-          set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
-        } else {
-          const column = columns.get(id) || 1;
-          const prevPos = peek$(ctx, `containerPosition${i}`);
-          const prevColumn = peek$(ctx, `containerColumn${i}`);
-          const prevData = peek$(ctx, `containerItemData${i}`);
-          if (position > POSITION_OUT_OF_VIEW && position !== prevPos) {
-            set$(ctx, `containerPosition${i}`, position);
+      if (needNewContainers.length > 0) {
+        const availableContainers = findAvailableContainers(
+          ctx,
+          state,
+          needNewContainers.length,
+          startBuffered,
+          endBuffered,
+          pendingRemoval
+        );
+        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 oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
+          if (oldKey && oldKey !== id) {
+            containerItemKeys.delete(oldKey);
           }
-          if (column >= 0 && column !== prevColumn) {
-            set$(ctx, `containerColumn${i}`, column);
+          set$(ctx, `containerItemKey${containerIndex}`, id);
+          set$(ctx, `containerItemData${containerIndex}`, data[i]);
+          containerItemKeys.add(id);
+          if (containerIndex >= numContainers2) {
+            numContainers2 = containerIndex + 1;
           }
-          if (prevData !== item) {
-            set$(ctx, `containerItemData${i}`, data[itemIndex]);
+        }
+        if (numContainers2 !== prevNumContainers) {
+          set$(ctx, "numContainers", numContainers2);
+          if (numContainers2 > peek$(ctx, "numContainersPooled")) {
+            set$(ctx, "numContainersPooled", Math.ceil(numContainers2 * 1.5));
           }
         }
       }
     }
-  }
-  if (!queuedInitialLayout && endBuffered !== null) {
-    if (checkAllSizesKnown(state)) {
-      setDidLayout(ctx, state);
+    for (let i = 0; i < numContainers; i++) {
+      const itemKey = peek$(ctx, `containerItemKey${i}`);
+      if (pendingRemoval.includes(i)) {
+        if (itemKey) {
+          containerItemKeys.delete(itemKey);
+        }
+        set$(ctx, `containerItemKey${i}`, void 0);
+        set$(ctx, `containerItemData${i}`, void 0);
+        set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
+        set$(ctx, `containerColumn${i}`, -1);
+      } else {
+        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 position = positions.get(id);
+          if (position === void 0) {
+            set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
+          } else {
+            const column = columns.get(id) || 1;
+            const prevPos = peek$(ctx, `containerPosition${i}`);
+            const prevColumn = peek$(ctx, `containerColumn${i}`);
+            const prevData = peek$(ctx, `containerItemData${i}`);
+            if (position > POSITION_OUT_OF_VIEW && position !== prevPos) {
+              set$(ctx, `containerPosition${i}`, position);
+            }
+            if (column >= 0 && column !== prevColumn) {
+              set$(ctx, `containerColumn${i}`, column);
+            }
+            if (prevData !== item) {
+              set$(ctx, `containerItemData${i}`, data[itemIndex]);
+            }
+          }
+        }
+      }
     }
-  }
-  if (state.props.viewabilityConfigCallbackPairs) {
-    updateViewableItems(
-      state,
-      ctx,
-      state.props.viewabilityConfigCallbackPairs,
-      scrollLength,
-      startNoBuffer,
-      endNoBuffer
-    );
-  }
+    if (!queuedInitialLayout && endBuffered !== null) {
+      if (checkAllSizesKnown(state)) {
+        setDidLayout(ctx, state);
+      }
+    }
+    if (state.props.viewabilityConfigCallbackPairs) {
+      updateViewableItems(
+        state,
+        ctx,
+        state.props.viewabilityConfigCallbackPairs,
+        scrollLength,
+        startNoBuffer,
+        endNoBuffer
+      );
+    }
+  });
 }
 
 // src/core/doInitialAllocateContainers.ts
@@ -1995,32 +1999,20 @@ function updateItemSizes(ctx, state, itemUpdates) {
   }
 }
 function updateItemSize(ctx, state, itemKey, sizeObj) {
-  if (IsNewArchitecture) {
-    const { sizesKnown } = state;
-    const numContainers = peek$(ctx, "numContainers");
-    const changes = [];
-    for (let i = 0; i < numContainers; i++) {
-      const containerItemKey = peek$(ctx, `containerItemKey${i}`);
-      if (itemKey === containerItemKey) {
-        changes.push({ itemKey, sizeObj });
-      } else if (!sizesKnown.has(containerItemKey) && containerItemKey !== void 0) {
-        const containerRef = ctx.viewRefs.get(i);
-        if (containerRef == null ? void 0 : containerRef.current) {
-          let measured;
-          containerRef.current.measure((x, y, width, height) => {
-            measured = { height, width, x, y };
-          });
-          if (measured) {
-            changes.push({ itemKey: containerItemKey, sizeObj: measured });
-          }
-        }
-      }
-    }
-    if (changes.length > 0) {
-      updateItemSizes(ctx, state, changes);
+  const { queuedItemSizeUpdates, queuedItemSizeUpdatesWaiting } = state;
+  const containersDidLayout = peek$(ctx, "containersDidLayout");
+  if (!containersDidLayout || !queuedItemSizeUpdatesWaiting) {
+    updateItemSizes(ctx, state, [{ itemKey, sizeObj }]);
+    if (containersDidLayout) {
+      state.queuedItemSizeUpdatesWaiting = true;
+      requestAnimationFrame(() => {
+        state.queuedItemSizeUpdatesWaiting = false;
+        updateItemSizes(ctx, state, queuedItemSizeUpdates);
+        queuedItemSizeUpdates.length = 0;
+      });
     }
   } else {
-    updateItemSizes(ctx, state, [{ itemKey, sizeObj }]);
+    queuedItemSizeUpdates.push({ itemKey, sizeObj });
   }
 }
 function updateOneItemSize(state, itemKey, sizeObj) {
@@ -2201,6 +2193,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       positions: /* @__PURE__ */ new Map(),
       props: {},
       queuedCalculateItemsInView: 0,
+      queuedItemSizeUpdates: [],
       refScroller: void 0,
       scroll: 0,
       scrollAdjustHandler: new ScrollAdjustHandler(ctx),

package/package.json

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