@legendapp/list 2.0.0-next.24 → 2.0.0-next.25

package/index.js

@@ -863,7 +863,7 @@ function calculateOffsetForIndex(ctx, state, index) {
 }
 
 // src/utils/getItemSize.ts
-function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize) {
+function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize, preferRenderedCache) {
   var _a, _b;
   const {
     sizesKnown,
@@ -884,7 +884,11 @@ function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize
       sizesKnown.set(key, size);
     }
   }
-  if (size === void 0 && useAverageSize && sizeKnown === void 0 && !scrollingTo) {
+  const renderedSize = sizes.get(key);
+  if (size === void 0 && preferRenderedCache && renderedSize !== void 0) {
+    return renderedSize;
+  }
+  if (size === void 0 && useAverageSize && !scrollingTo) {
     if (itemType === "") {
       size = defaultAverageSize;
     } else {
@@ -894,11 +898,8 @@ function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize
       }
     }
   }
-  if (size === void 0) {
-    size = sizes.get(key);
-    if (size !== void 0) {
-      return size;
-    }
+  if (size === void 0 && renderedSize !== void 0) {
+    return renderedSize;
   }
   if (size === void 0) {
     size = getEstimatedItemSize ? getEstimatedItemSize(index, data, itemType) : estimatedItemSize;
@@ -1058,10 +1059,10 @@ function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
   if (stylePaddingTop !== void 0) {
     const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
     if (stylePaddingTop < prevStylePaddingTop) {
-      let prevTotalSize = peek$(ctx, "totalSize");
+      let prevTotalSize = peek$(ctx, "totalSize") || 0;
       set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
       state.timeoutSetPaddingTop = setTimeout(() => {
-        prevTotalSize = peek$(ctx, "totalSize");
+        prevTotalSize = peek$(ctx, "totalSize") || 0;
         set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
       }, 16);
     }
@@ -1195,7 +1196,7 @@ function updateAllPositions(ctx, state, dataChanged) {
   const numColumns = peek$(ctx, "numColumns");
   const indexByKeyForChecking = __DEV__ ? /* @__PURE__ */ new Map() : void 0;
   const scrollVelocity = getScrollVelocity(state);
-  const useAverageSize = false;
+  const useAverageSize = !getEstimatedItemSize;
   const itemType = "";
   let averageSize = (_a = averageSizes[itemType]) == null ? void 0 : _a.avg;
   if (averageSize !== void 0) {
@@ -1211,7 +1212,16 @@ function updateAllPositions(ctx, state, dataChanged) {
       let bailout = false;
       for (let i = firstFullyOnScreenIndex - 1; i >= 0; i--) {
         const id = (_b = idCache.get(i)) != null ? _b : getId(state, i);
-        const size = (_c = sizesKnown.get(id)) != null ? _c : getItemSize(state, id, i, data[i], useAverageSize, averageSize);
+        const size = (_c = sizesKnown.get(id)) != null ? _c : getItemSize(
+          state,
+          id,
+          i,
+          data[i],
+          useAverageSize,
+          averageSize,
+          /*preferRenderedCache*/
+          !!dataChanged
+        );
         const itemColumn = columns.get(id);
         maxSizeInRow2 = Math.max(maxSizeInRow2, size);
         if (itemColumn === 1) {
@@ -1238,7 +1248,16 @@ function updateAllPositions(ctx, state, dataChanged) {
   const dataLength = data.length;
   for (let i = 0; i < dataLength; i++) {
     const id = (_d = idCache.get(i)) != null ? _d : getId(state, i);
-    const size = (_e = sizesKnown.get(id)) != null ? _e : getItemSize(state, id, i, data[i], useAverageSize, averageSize);
+    const size = (_e = sizesKnown.get(id)) != null ? _e : getItemSize(
+      state,
+      id,
+      i,
+      data[i],
+      useAverageSize,
+      averageSize,
+      /*preferRenderedCache*/
+      !!dataChanged
+    );
     if (__DEV__ && needsIndexByKey) {
       if (indexByKeyForChecking.has(id)) {
         console.error(
@@ -1479,14 +1498,14 @@ function checkAllSizesKnown(state) {
 // src/utils/findAvailableContainers.ts
 function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffered, pendingRemoval, requiredItemTypes, needNewContainers) {
   const numContainers = peek$(ctx, "numContainers");
-  const { stickyIndicesSet } = state.props;
+  const { stickyContainerPool, containerItemTypes } = state;
   const result = [];
   const availableContainers = [];
+  const stickyIndicesSet = state.props.stickyIndicesSet;
   const stickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => stickyIndicesSet.has(index))) || [];
-  const nonStickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => !stickyIndicesSet.has(index))) || [];
   const canReuseContainer = (containerIndex, requiredType) => {
     if (!requiredType) return true;
-    const existingType = state.containerItemTypes.get(containerIndex);
+    const existingType = containerItemTypes.get(containerIndex);
     if (!existingType) return true;
     return existingType === requiredType;
   };
@@ -1495,7 +1514,7 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
   for (let i = 0; i < stickyItemIndices.length; i++) {
     const requiredType = neededTypes[typeIndex];
     let foundContainer = false;
-    for (const containerIndex of state.stickyContainerPool) {
+    for (const containerIndex of stickyContainerPool) {
       const key = peek$(ctx, `containerItemKey${containerIndex}`);
       const isPendingRemoval = pendingRemoval.includes(containerIndex);
       if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, requiredType)) {
@@ -1512,38 +1531,33 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
     if (!foundContainer) {
       const newContainerIndex = numContainers + result.filter((index) => index >= numContainers).length;
       result.push(newContainerIndex);
-      state.stickyContainerPool.add(newContainerIndex);
+      stickyContainerPool.add(newContainerIndex);
       if (requiredItemTypes) typeIndex++;
     }
   }
-  if (nonStickyItemIndices.length > 0) {
-    for (let u = 0; u < numContainers; u++) {
-      if (state.stickyContainerPool.has(u)) {
-        continue;
-      }
-      const key = peek$(ctx, `containerItemKey${u}`);
-      let isOk = key === void 0;
-      if (!isOk) {
-        const index = pendingRemoval.indexOf(u);
-        if (index !== -1) {
-          pendingRemoval.splice(index, 1);
-          const requiredType = neededTypes[typeIndex];
-          isOk = canReuseContainer(u, requiredType);
-        }
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
+      continue;
+    }
+    const key = peek$(ctx, `containerItemKey${u}`);
+    let isOk = key === void 0;
+    if (!isOk) {
+      const index = pendingRemoval.indexOf(u);
+      if (index !== -1) {
+        pendingRemoval.splice(index, 1);
+        const requiredType = neededTypes[typeIndex];
+        isOk = canReuseContainer(u, requiredType);
       }
-      if (isOk) {
-        result.push(u);
-        if (requiredItemTypes) {
-          typeIndex++;
-        }
-        if (result.length >= numNeeded) {
-          return result;
-        }
+    }
+    if (isOk) {
+      result.push(u);
+      if (requiredItemTypes) {
+        typeIndex++;
       }
     }
   }
-  for (let u = 0; u < numContainers; u++) {
-    if (state.stickyContainerPool.has(u)) {
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
       continue;
     }
     const key = peek$(ctx, `containerItemKey${u}`);
@@ -1788,7 +1802,9 @@ function calculateItemsInView(ctx, state, params = {}) {
       viewabilityConfigCallbackPairs,
       props: { getItemType, initialScroll, itemsAreEqual, keyExtractor, scrollBuffer }
     } = state;
-    const { data, stickyIndicesArr, stickyIndicesSet } = state.props;
+    const { data } = state.props;
+    const stickyIndicesArr = state.props.stickyIndicesArr || [];
+    const stickyIndicesSet = state.props.stickyIndicesSet || /* @__PURE__ */ new Set();
     const prevNumContainers = peek$(ctx, "numContainers");
     if (!data || scrollLength === 0 || !prevNumContainers) {
       return;
@@ -2202,7 +2218,7 @@ function handleLayout(ctx, state, layout, setCanRender) {
 // src/core/onScroll.ts
 function onScroll(ctx, state, event) {
   var _a, _b, _c, _d, _e;
-  if (!state.scrollProcessingEnabled) {
+  if (state.scrollProcessingEnabled === false) {
     return;
   }
   if (((_b = (_a = event.nativeEvent) == null ? void 0 : _a.contentSize) == null ? void 0 : _b.height) === 0 && ((_c = event.nativeEvent.contentSize) == null ? void 0 : _c.width) === 0) {

package/index.mjs

@@ -842,7 +842,7 @@ function calculateOffsetForIndex(ctx, state, index) {
 }
 
 // src/utils/getItemSize.ts
-function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize) {
+function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize, preferRenderedCache) {
   var _a, _b;
   const {
     sizesKnown,
@@ -863,7 +863,11 @@ function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize
       sizesKnown.set(key, size);
     }
   }
-  if (size === void 0 && useAverageSize && sizeKnown === void 0 && !scrollingTo) {
+  const renderedSize = sizes.get(key);
+  if (size === void 0 && preferRenderedCache && renderedSize !== void 0) {
+    return renderedSize;
+  }
+  if (size === void 0 && useAverageSize && !scrollingTo) {
     if (itemType === "") {
       size = defaultAverageSize;
     } else {
@@ -873,11 +877,8 @@ function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize
       }
     }
   }
-  if (size === void 0) {
-    size = sizes.get(key);
-    if (size !== void 0) {
-      return size;
-    }
+  if (size === void 0 && renderedSize !== void 0) {
+    return renderedSize;
   }
   if (size === void 0) {
     size = getEstimatedItemSize ? getEstimatedItemSize(index, data, itemType) : estimatedItemSize;
@@ -1037,10 +1038,10 @@ function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
   if (stylePaddingTop !== void 0) {
     const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
     if (stylePaddingTop < prevStylePaddingTop) {
-      let prevTotalSize = peek$(ctx, "totalSize");
+      let prevTotalSize = peek$(ctx, "totalSize") || 0;
       set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
       state.timeoutSetPaddingTop = setTimeout(() => {
-        prevTotalSize = peek$(ctx, "totalSize");
+        prevTotalSize = peek$(ctx, "totalSize") || 0;
         set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
       }, 16);
     }
@@ -1174,7 +1175,7 @@ function updateAllPositions(ctx, state, dataChanged) {
   const numColumns = peek$(ctx, "numColumns");
   const indexByKeyForChecking = __DEV__ ? /* @__PURE__ */ new Map() : void 0;
   const scrollVelocity = getScrollVelocity(state);
-  const useAverageSize = false;
+  const useAverageSize = !getEstimatedItemSize;
   const itemType = "";
   let averageSize = (_a = averageSizes[itemType]) == null ? void 0 : _a.avg;
   if (averageSize !== void 0) {
@@ -1190,7 +1191,16 @@ function updateAllPositions(ctx, state, dataChanged) {
       let bailout = false;
       for (let i = firstFullyOnScreenIndex - 1; i >= 0; i--) {
         const id = (_b = idCache.get(i)) != null ? _b : getId(state, i);
-        const size = (_c = sizesKnown.get(id)) != null ? _c : getItemSize(state, id, i, data[i], useAverageSize, averageSize);
+        const size = (_c = sizesKnown.get(id)) != null ? _c : getItemSize(
+          state,
+          id,
+          i,
+          data[i],
+          useAverageSize,
+          averageSize,
+          /*preferRenderedCache*/
+          !!dataChanged
+        );
         const itemColumn = columns.get(id);
         maxSizeInRow2 = Math.max(maxSizeInRow2, size);
         if (itemColumn === 1) {
@@ -1217,7 +1227,16 @@ function updateAllPositions(ctx, state, dataChanged) {
   const dataLength = data.length;
   for (let i = 0; i < dataLength; i++) {
     const id = (_d = idCache.get(i)) != null ? _d : getId(state, i);
-    const size = (_e = sizesKnown.get(id)) != null ? _e : getItemSize(state, id, i, data[i], useAverageSize, averageSize);
+    const size = (_e = sizesKnown.get(id)) != null ? _e : getItemSize(
+      state,
+      id,
+      i,
+      data[i],
+      useAverageSize,
+      averageSize,
+      /*preferRenderedCache*/
+      !!dataChanged
+    );
     if (__DEV__ && needsIndexByKey) {
       if (indexByKeyForChecking.has(id)) {
         console.error(
@@ -1458,14 +1477,14 @@ function checkAllSizesKnown(state) {
 // src/utils/findAvailableContainers.ts
 function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffered, pendingRemoval, requiredItemTypes, needNewContainers) {
   const numContainers = peek$(ctx, "numContainers");
-  const { stickyIndicesSet } = state.props;
+  const { stickyContainerPool, containerItemTypes } = state;
   const result = [];
   const availableContainers = [];
+  const stickyIndicesSet = state.props.stickyIndicesSet;
   const stickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => stickyIndicesSet.has(index))) || [];
-  const nonStickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => !stickyIndicesSet.has(index))) || [];
   const canReuseContainer = (containerIndex, requiredType) => {
     if (!requiredType) return true;
-    const existingType = state.containerItemTypes.get(containerIndex);
+    const existingType = containerItemTypes.get(containerIndex);
     if (!existingType) return true;
     return existingType === requiredType;
   };
@@ -1474,7 +1493,7 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
   for (let i = 0; i < stickyItemIndices.length; i++) {
     const requiredType = neededTypes[typeIndex];
     let foundContainer = false;
-    for (const containerIndex of state.stickyContainerPool) {
+    for (const containerIndex of stickyContainerPool) {
       const key = peek$(ctx, `containerItemKey${containerIndex}`);
       const isPendingRemoval = pendingRemoval.includes(containerIndex);
       if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, requiredType)) {
@@ -1491,38 +1510,33 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
     if (!foundContainer) {
       const newContainerIndex = numContainers + result.filter((index) => index >= numContainers).length;
       result.push(newContainerIndex);
-      state.stickyContainerPool.add(newContainerIndex);
+      stickyContainerPool.add(newContainerIndex);
       if (requiredItemTypes) typeIndex++;
     }
   }
-  if (nonStickyItemIndices.length > 0) {
-    for (let u = 0; u < numContainers; u++) {
-      if (state.stickyContainerPool.has(u)) {
-        continue;
-      }
-      const key = peek$(ctx, `containerItemKey${u}`);
-      let isOk = key === void 0;
-      if (!isOk) {
-        const index = pendingRemoval.indexOf(u);
-        if (index !== -1) {
-          pendingRemoval.splice(index, 1);
-          const requiredType = neededTypes[typeIndex];
-          isOk = canReuseContainer(u, requiredType);
-        }
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
+      continue;
+    }
+    const key = peek$(ctx, `containerItemKey${u}`);
+    let isOk = key === void 0;
+    if (!isOk) {
+      const index = pendingRemoval.indexOf(u);
+      if (index !== -1) {
+        pendingRemoval.splice(index, 1);
+        const requiredType = neededTypes[typeIndex];
+        isOk = canReuseContainer(u, requiredType);
       }
-      if (isOk) {
-        result.push(u);
-        if (requiredItemTypes) {
-          typeIndex++;
-        }
-        if (result.length >= numNeeded) {
-          return result;
-        }
+    }
+    if (isOk) {
+      result.push(u);
+      if (requiredItemTypes) {
+        typeIndex++;
       }
     }
   }
-  for (let u = 0; u < numContainers; u++) {
-    if (state.stickyContainerPool.has(u)) {
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
       continue;
     }
     const key = peek$(ctx, `containerItemKey${u}`);
@@ -1767,7 +1781,9 @@ function calculateItemsInView(ctx, state, params = {}) {
       viewabilityConfigCallbackPairs,
       props: { getItemType, initialScroll, itemsAreEqual, keyExtractor, scrollBuffer }
     } = state;
-    const { data, stickyIndicesArr, stickyIndicesSet } = state.props;
+    const { data } = state.props;
+    const stickyIndicesArr = state.props.stickyIndicesArr || [];
+    const stickyIndicesSet = state.props.stickyIndicesSet || /* @__PURE__ */ new Set();
     const prevNumContainers = peek$(ctx, "numContainers");
     if (!data || scrollLength === 0 || !prevNumContainers) {
       return;
@@ -2181,7 +2197,7 @@ function handleLayout(ctx, state, layout, setCanRender) {
 // src/core/onScroll.ts
 function onScroll(ctx, state, event) {
   var _a, _b, _c, _d, _e;
-  if (!state.scrollProcessingEnabled) {
+  if (state.scrollProcessingEnabled === false) {
     return;
   }
   if (((_b = (_a = event.nativeEvent) == null ? void 0 : _a.contentSize) == null ? void 0 : _b.height) === 0 && ((_c = event.nativeEvent.contentSize) == null ? void 0 : _c.width) === 0) {

package/package.json

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