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

package/index.d.mts

@@ -324,6 +324,7 @@ interface InternalState {
         };
     }[];
     queuedItemSizeUpdatesWaiting?: boolean;
+    timeoutSetPaddingTop?: any;
     props: {
         alignItemsAtEnd: boolean;
         data: readonly any[];
@@ -362,7 +363,6 @@ interface InternalState {
             viewPosition?: number;
         } | undefined;
         scrollBuffer: number;
-        viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
         numColumns: number;
         initialContainerPoolRatio: number;
         stylePaddingTop: number | undefined;

package/index.d.ts

@@ -324,6 +324,7 @@ interface InternalState {
         };
     }[];
     queuedItemSizeUpdatesWaiting?: boolean;
+    timeoutSetPaddingTop?: any;
     props: {
         alignItemsAtEnd: boolean;
         data: readonly any[];
@@ -362,7 +363,6 @@ interface InternalState {
             viewPosition?: number;
         } | undefined;
         scrollBuffer: number;
-        viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
         numColumns: number;
         initialContainerPoolRatio: number;
         stylePaddingTop: number | undefined;

package/index.js

@@ -38,7 +38,8 @@ function StateProvider({ children }) {
       ["alignItemsPaddingTop", 0],
       ["stylePaddingTop", 0],
       ["headerSize", 0],
-      ["numContainers", 0]
+      ["numContainers", 0],
+      ["totalSize", 0]
     ]),
     viewRefs: /* @__PURE__ */ new Map()
   }));
@@ -111,7 +112,7 @@ function getContentSize(ctx) {
   const stylePaddingTop = values.get("stylePaddingTop") || 0;
   const headerSize = values.get("headerSize") || 0;
   const footerSize = values.get("footerSize") || 0;
-  const totalSize = values.get("totalSize") || 0;
+  const totalSize = values.get("totalSize");
   return headerSize + footerSize + totalSize + stylePaddingTop;
 }
 function useArr$(signalNames) {
@@ -869,14 +870,15 @@ function prepareMVCP(ctx, state) {
 }
 
 // src/utils/setPaddingTop.ts
-function setPaddingTop(ctx, { stylePaddingTop, alignItemsPaddingTop }) {
+function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
   if (stylePaddingTop !== void 0) {
     const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
     if (stylePaddingTop < prevStylePaddingTop) {
-      const prevTotalSize = peek$(ctx, "totalSize") || 0;
+      let prevTotalSize = peek$(ctx, "totalSize");
       set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
-      setTimeout(() => {
-        set$(ctx, "totalSize", prevTotalSize);
+      state.timeoutSetPaddingTop = setTimeout(() => {
+        prevTotalSize = peek$(ctx, "totalSize");
+        set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
       }, 16);
     }
     set$(ctx, "stylePaddingTop", stylePaddingTop);
@@ -898,7 +900,7 @@ function updateAlignItemsPaddingTop(ctx, state) {
       const contentSize = getContentSize(ctx);
       alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
     }
-    setPaddingTop(ctx, { alignItemsPaddingTop });
+    setPaddingTop(ctx, state, { alignItemsPaddingTop });
   }
 }
 
@@ -928,6 +930,10 @@ function addTotalSize(ctx, state, key, add) {
   const { alignItemsAtEnd } = state.props;
   {
     state.totalSize = add;
+    if (state.timeoutSetPaddingTop) {
+      clearTimeout(state.timeoutSetPaddingTop);
+      state.timeoutSetPaddingTop = void 0;
+    }
   }
   set$(ctx, "totalSize", state.totalSize);
   if (alignItemsAtEnd) {
@@ -1736,11 +1742,11 @@ function calculateItemsInView(ctx, state, params = {}) {
         setDidLayout(ctx, state);
       }
     }
-    if (state.props.viewabilityConfigCallbackPairs) {
+    if (state.viewabilityConfigCallbackPairs) {
       updateViewableItems(
         state,
         ctx,
-        state.props.viewabilityConfigCallbackPairs,
+        state.viewabilityConfigCallbackPairs,
         scrollLength,
         startNoBuffer,
         endNoBuffer
@@ -2266,8 +2272,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     snapToIndices,
     stylePaddingBottom: stylePaddingBottomState,
     stylePaddingTop: stylePaddingTopState,
-    suggestEstimatedItemSize: !!suggestEstimatedItemSize,
-    viewabilityConfigCallbackPairs: void 0
+    suggestEstimatedItemSize: !!suggestEstimatedItemSize
   };
   state.refScroller = refScroller;
   const checkResetContainers = (isFirst2) => {
@@ -2299,10 +2304,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     set$(ctx, "lastItemKeys", memoizedLastItemKeys);
     set$(ctx, "numColumns", numColumnsProp);
     const prevPaddingTop = peek$(ctx, "stylePaddingTop");
-    setPaddingTop(ctx, { stylePaddingTop: stylePaddingTopState });
+    setPaddingTop(ctx, state, { stylePaddingTop: stylePaddingTopState });
     refState.current.props.stylePaddingBottom = stylePaddingBottomState;
-    const paddingDiff = stylePaddingTopState - prevPaddingTop;
+    let paddingDiff = stylePaddingTopState - prevPaddingTop;
     if (maintainVisibleContentPosition && paddingDiff && prevPaddingTop !== void 0 && reactNative.Platform.OS === "ios") {
+      if (state.scroll < 0) {
+        paddingDiff += state.scroll;
+      }
       requestAdjust(ctx, state, paddingDiff);
     }
   };
@@ -2394,7 +2402,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       viewabilityConfigCallbackPairs
     });
     state.viewabilityConfigCallbackPairs = viewability;
-    state.props.viewabilityConfigCallbackPairs = viewability;
     state.enableScrollForNextCalculateItemsInView = !viewability;
   }, [viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged]);
   if (!IsNewArchitecture) {

package/index.mjs

@@ -17,7 +17,8 @@ function StateProvider({ children }) {
       ["alignItemsPaddingTop", 0],
       ["stylePaddingTop", 0],
       ["headerSize", 0],
-      ["numContainers", 0]
+      ["numContainers", 0],
+      ["totalSize", 0]
     ]),
     viewRefs: /* @__PURE__ */ new Map()
   }));
@@ -90,7 +91,7 @@ function getContentSize(ctx) {
   const stylePaddingTop = values.get("stylePaddingTop") || 0;
   const headerSize = values.get("headerSize") || 0;
   const footerSize = values.get("footerSize") || 0;
-  const totalSize = values.get("totalSize") || 0;
+  const totalSize = values.get("totalSize");
   return headerSize + footerSize + totalSize + stylePaddingTop;
 }
 function useArr$(signalNames) {
@@ -848,14 +849,15 @@ function prepareMVCP(ctx, state) {
 }
 
 // src/utils/setPaddingTop.ts
-function setPaddingTop(ctx, { stylePaddingTop, alignItemsPaddingTop }) {
+function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
   if (stylePaddingTop !== void 0) {
     const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
     if (stylePaddingTop < prevStylePaddingTop) {
-      const prevTotalSize = peek$(ctx, "totalSize") || 0;
+      let prevTotalSize = peek$(ctx, "totalSize");
       set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
-      setTimeout(() => {
-        set$(ctx, "totalSize", prevTotalSize);
+      state.timeoutSetPaddingTop = setTimeout(() => {
+        prevTotalSize = peek$(ctx, "totalSize");
+        set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
       }, 16);
     }
     set$(ctx, "stylePaddingTop", stylePaddingTop);
@@ -877,7 +879,7 @@ function updateAlignItemsPaddingTop(ctx, state) {
       const contentSize = getContentSize(ctx);
       alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
     }
-    setPaddingTop(ctx, { alignItemsPaddingTop });
+    setPaddingTop(ctx, state, { alignItemsPaddingTop });
   }
 }
 
@@ -907,6 +909,10 @@ function addTotalSize(ctx, state, key, add) {
   const { alignItemsAtEnd } = state.props;
   {
     state.totalSize = add;
+    if (state.timeoutSetPaddingTop) {
+      clearTimeout(state.timeoutSetPaddingTop);
+      state.timeoutSetPaddingTop = void 0;
+    }
   }
   set$(ctx, "totalSize", state.totalSize);
   if (alignItemsAtEnd) {
@@ -1715,11 +1721,11 @@ function calculateItemsInView(ctx, state, params = {}) {
         setDidLayout(ctx, state);
       }
     }
-    if (state.props.viewabilityConfigCallbackPairs) {
+    if (state.viewabilityConfigCallbackPairs) {
       updateViewableItems(
         state,
         ctx,
-        state.props.viewabilityConfigCallbackPairs,
+        state.viewabilityConfigCallbackPairs,
         scrollLength,
         startNoBuffer,
         endNoBuffer
@@ -2245,8 +2251,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     snapToIndices,
     stylePaddingBottom: stylePaddingBottomState,
     stylePaddingTop: stylePaddingTopState,
-    suggestEstimatedItemSize: !!suggestEstimatedItemSize,
-    viewabilityConfigCallbackPairs: void 0
+    suggestEstimatedItemSize: !!suggestEstimatedItemSize
   };
   state.refScroller = refScroller;
   const checkResetContainers = (isFirst2) => {
@@ -2278,10 +2283,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     set$(ctx, "lastItemKeys", memoizedLastItemKeys);
     set$(ctx, "numColumns", numColumnsProp);
     const prevPaddingTop = peek$(ctx, "stylePaddingTop");
-    setPaddingTop(ctx, { stylePaddingTop: stylePaddingTopState });
+    setPaddingTop(ctx, state, { stylePaddingTop: stylePaddingTopState });
     refState.current.props.stylePaddingBottom = stylePaddingBottomState;
-    const paddingDiff = stylePaddingTopState - prevPaddingTop;
+    let paddingDiff = stylePaddingTopState - prevPaddingTop;
     if (maintainVisibleContentPosition && paddingDiff && prevPaddingTop !== void 0 && Platform.OS === "ios") {
+      if (state.scroll < 0) {
+        paddingDiff += state.scroll;
+      }
       requestAdjust(ctx, state, paddingDiff);
     }
   };
@@ -2373,7 +2381,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       viewabilityConfigCallbackPairs
     });
     state.viewabilityConfigCallbackPairs = viewability;
-    state.props.viewabilityConfigCallbackPairs = viewability;
     state.enableScrollForNextCalculateItemsInView = !viewability;
   }, [viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged]);
   if (!IsNewArchitecture) {

package/package.json

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