@legendapp/list 0.5.0 → 0.5.2

package/index.d.mts

@@ -63,6 +63,10 @@ interface InternalState {
     timeouts: Set<number>;
     nativeMarginTop: number;
     indexByKey: Map<string, number>;
+    contentSize: {
+        width: number;
+        height: number;
+    };
     viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
     renderItem: (props: LegendListRenderItemProps<any>) => ReactNode;
     scrollHistory: Array<{

package/index.d.ts

@@ -63,6 +63,10 @@ interface InternalState {
     timeouts: Set<number>;
     nativeMarginTop: number;
     indexByKey: Map<string, number>;
+    contentSize: {
+        width: number;
+        height: number;
+    };
     viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
     renderItem: (props: LegendListRenderItemProps<any>) => ReactNode;
     scrollHistory: Array<{

package/index.js

@@ -470,7 +470,7 @@ var LegendList = React7.forwardRef(function LegendList2(props, forwardedRef) {
   return /* @__PURE__ */ React7__namespace.createElement(StateProvider, null, /* @__PURE__ */ React7__namespace.createElement(LegendListInner, { ...props, ref: forwardedRef }));
 });
 var LegendListInner = React7.forwardRef(function LegendListInner2(props, forwardedRef) {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e;
   const {
     data,
     initialScrollIndex,
@@ -565,7 +565,8 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
       scrollTime: 0,
       indexByKey: /* @__PURE__ */ new Map(),
       scrollHistory: [],
-      scrollVelocity: 0
+      scrollVelocity: 0,
+      contentSize: { width: 0, height: 0 }
     };
     refState.current.idsInFirstRender = new Set(data.map((_, i) => getId(i)));
     set$(ctx, "scrollAdjust", refState.current.scrollAdjustPending);
@@ -775,40 +776,48 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
     }
   };
   const checkAtBottom = () => {
-    var _a2;
-    const { scrollLength, scroll } = refState.current;
-    const totalSize = peek$(ctx, "totalSize");
-    const distanceFromEnd = totalSize - scroll - scrollLength;
+    if (!refState.current) {
+      return;
+    }
+    const { scrollLength, scroll, contentSize } = refState.current;
+    const distanceFromEnd = contentSize[horizontal ? "width" : "height"] - scroll - scrollLength;
     if (refState.current) {
       refState.current.isAtBottom = distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
     }
-    if (onEndReached && !((_a2 = refState.current) == null ? void 0 : _a2.isEndReached)) {
-      if (distanceFromEnd < onEndReachedThreshold * scrollLength) {
-        if (refState.current) {
+    if (onEndReached) {
+      if (!refState.current.isEndReached) {
+        if (distanceFromEnd < onEndReachedThreshold * scrollLength) {
           refState.current.isEndReached = true;
+          onEndReached({ distanceFromEnd });
+        }
+      } else {
+        if (distanceFromEnd >= onEndReachedThreshold * scrollLength) {
+          refState.current.isEndReached = false;
         }
-        onEndReached({ distanceFromEnd });
       }
     }
   };
   const checkAtTop = () => {
-    var _a2;
-    const { scrollLength, scroll } = refState.current;
-    if (refState.current) {
-      refState.current.isAtTop = scroll === 0;
+    if (!refState.current) {
+      return;
     }
-    if (onStartReached && !((_a2 = refState.current) == null ? void 0 : _a2.isStartReached)) {
-      if (scroll < onStartReachedThreshold * scrollLength) {
-        if (refState.current) {
+    const { scrollLength, scroll } = refState.current;
+    refState.current.isAtTop = scroll === 0;
+    if (onStartReached) {
+      if (!refState.current.isStartReached) {
+        if (scroll < onStartReachedThreshold * scrollLength) {
           refState.current.isStartReached = true;
+          onStartReached({ distanceFromStart: scroll });
+        }
+      } else {
+        if (scroll >= onStartReachedThreshold * scrollLength) {
+          refState.current.isStartReached = false;
         }
-        onStartReached({ distanceFromStart: scroll });
       }
     }
   };
   const isFirst = !refState.current.renderItem;
   if (isFirst || data !== refState.current.data) {
-    (data == null ? void 0 : data.length) > ((_a = refState.current.data) == null ? void 0 : _a.length);
     refState.current.data = data;
     let totalSize = 0;
     const indexByKey = /* @__PURE__ */ new Map();
@@ -825,7 +834,7 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
     if (maintainVisibleContentPosition) {
       for (const [key, index] of refState.current.indexByKey) {
         if (index < refState.current.startNoBuffer && !indexByKey.has(key)) {
-          const size = (_b = refState.current.sizes.get(key)) != null ? _b : 0;
+          const size = (_a = refState.current.sizes.get(key)) != null ? _a : 0;
           if (size) {
             adjustScroll(-size);
           }
@@ -842,16 +851,16 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
       }
       calculateItemsInView();
       doMaintainScrollAtEnd(false);
+      checkAtTop();
+      checkAtBottom();
     }
-    checkAtBottom();
-    checkAtTop();
   }
   refState.current.renderItem = renderItem;
   set$(ctx, "lastItemKey", getId(data[data.length - 1]));
   set$(
     ctx,
     "stylePaddingTop",
-    (_f = (_e = (_c = reactNative.StyleSheet.flatten(style)) == null ? void 0 : _c.paddingTop) != null ? _e : (_d = reactNative.StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _d.paddingTop) != null ? _f : 0
+    (_e = (_d = (_b = reactNative.StyleSheet.flatten(style)) == null ? void 0 : _b.paddingTop) != null ? _d : (_c = reactNative.StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _c.paddingTop) != null ? _e : 0
   );
   const getRenderedItem = React7.useCallback((key, containerId) => {
     var _a2, _b2;
@@ -998,10 +1007,12 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
       scrollLength += event.nativeEvent.layout[horizontal ? "x" : "y"];
     }
     refState.current.scrollLength = scrollLength;
-    doMaintainScrollAtEnd(false);
-    doUpdatePaddingTop();
-    checkAtBottom();
-    checkAtTop();
+    if (refState.current.hasScrolled) {
+      doMaintainScrollAtEnd(false);
+      doUpdatePaddingTop();
+      checkAtBottom();
+      checkAtTop();
+    }
     if (__DEV__) {
       const isWidthZero = event.nativeEvent.layout.width === 0;
       const isHeightZero = event.nativeEvent.layout.height === 0;
@@ -1020,6 +1031,7 @@ var LegendListInner = React7.forwardRef(function LegendListInner2(props, forward
       }
       const state = refState.current;
       state.hasScrolled = true;
+      state.contentSize = event.nativeEvent.contentSize;
       const currentTime = performance.now();
       const newScroll = event.nativeEvent.contentOffset[horizontal ? "x" : "y"];
       state.scrollHistory.push({ scroll: newScroll, time: currentTime });

package/index.mjs

@@ -449,7 +449,7 @@ var LegendList = forwardRef(function LegendList2(props, forwardedRef) {
   return /* @__PURE__ */ React7.createElement(StateProvider, null, /* @__PURE__ */ React7.createElement(LegendListInner, { ...props, ref: forwardedRef }));
 });
 var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef) {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e;
   const {
     data,
     initialScrollIndex,
@@ -544,7 +544,8 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
       scrollTime: 0,
       indexByKey: /* @__PURE__ */ new Map(),
       scrollHistory: [],
-      scrollVelocity: 0
+      scrollVelocity: 0,
+      contentSize: { width: 0, height: 0 }
     };
     refState.current.idsInFirstRender = new Set(data.map((_, i) => getId(i)));
     set$(ctx, "scrollAdjust", refState.current.scrollAdjustPending);
@@ -754,40 +755,48 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
     }
   };
   const checkAtBottom = () => {
-    var _a2;
-    const { scrollLength, scroll } = refState.current;
-    const totalSize = peek$(ctx, "totalSize");
-    const distanceFromEnd = totalSize - scroll - scrollLength;
+    if (!refState.current) {
+      return;
+    }
+    const { scrollLength, scroll, contentSize } = refState.current;
+    const distanceFromEnd = contentSize[horizontal ? "width" : "height"] - scroll - scrollLength;
     if (refState.current) {
       refState.current.isAtBottom = distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
     }
-    if (onEndReached && !((_a2 = refState.current) == null ? void 0 : _a2.isEndReached)) {
-      if (distanceFromEnd < onEndReachedThreshold * scrollLength) {
-        if (refState.current) {
+    if (onEndReached) {
+      if (!refState.current.isEndReached) {
+        if (distanceFromEnd < onEndReachedThreshold * scrollLength) {
           refState.current.isEndReached = true;
+          onEndReached({ distanceFromEnd });
+        }
+      } else {
+        if (distanceFromEnd >= onEndReachedThreshold * scrollLength) {
+          refState.current.isEndReached = false;
         }
-        onEndReached({ distanceFromEnd });
       }
     }
   };
   const checkAtTop = () => {
-    var _a2;
-    const { scrollLength, scroll } = refState.current;
-    if (refState.current) {
-      refState.current.isAtTop = scroll === 0;
+    if (!refState.current) {
+      return;
     }
-    if (onStartReached && !((_a2 = refState.current) == null ? void 0 : _a2.isStartReached)) {
-      if (scroll < onStartReachedThreshold * scrollLength) {
-        if (refState.current) {
+    const { scrollLength, scroll } = refState.current;
+    refState.current.isAtTop = scroll === 0;
+    if (onStartReached) {
+      if (!refState.current.isStartReached) {
+        if (scroll < onStartReachedThreshold * scrollLength) {
           refState.current.isStartReached = true;
+          onStartReached({ distanceFromStart: scroll });
+        }
+      } else {
+        if (scroll >= onStartReachedThreshold * scrollLength) {
+          refState.current.isStartReached = false;
         }
-        onStartReached({ distanceFromStart: scroll });
       }
     }
   };
   const isFirst = !refState.current.renderItem;
   if (isFirst || data !== refState.current.data) {
-    (data == null ? void 0 : data.length) > ((_a = refState.current.data) == null ? void 0 : _a.length);
     refState.current.data = data;
     let totalSize = 0;
     const indexByKey = /* @__PURE__ */ new Map();
@@ -804,7 +813,7 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
     if (maintainVisibleContentPosition) {
       for (const [key, index] of refState.current.indexByKey) {
         if (index < refState.current.startNoBuffer && !indexByKey.has(key)) {
-          const size = (_b = refState.current.sizes.get(key)) != null ? _b : 0;
+          const size = (_a = refState.current.sizes.get(key)) != null ? _a : 0;
           if (size) {
             adjustScroll(-size);
           }
@@ -821,16 +830,16 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
       }
       calculateItemsInView();
       doMaintainScrollAtEnd(false);
+      checkAtTop();
+      checkAtBottom();
     }
-    checkAtBottom();
-    checkAtTop();
   }
   refState.current.renderItem = renderItem;
   set$(ctx, "lastItemKey", getId(data[data.length - 1]));
   set$(
     ctx,
     "stylePaddingTop",
-    (_f = (_e = (_c = StyleSheet.flatten(style)) == null ? void 0 : _c.paddingTop) != null ? _e : (_d = StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _d.paddingTop) != null ? _f : 0
+    (_e = (_d = (_b = StyleSheet.flatten(style)) == null ? void 0 : _b.paddingTop) != null ? _d : (_c = StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _c.paddingTop) != null ? _e : 0
   );
   const getRenderedItem = useCallback((key, containerId) => {
     var _a2, _b2;
@@ -977,10 +986,12 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
       scrollLength += event.nativeEvent.layout[horizontal ? "x" : "y"];
     }
     refState.current.scrollLength = scrollLength;
-    doMaintainScrollAtEnd(false);
-    doUpdatePaddingTop();
-    checkAtBottom();
-    checkAtTop();
+    if (refState.current.hasScrolled) {
+      doMaintainScrollAtEnd(false);
+      doUpdatePaddingTop();
+      checkAtBottom();
+      checkAtTop();
+    }
     if (__DEV__) {
       const isWidthZero = event.nativeEvent.layout.width === 0;
       const isHeightZero = event.nativeEvent.layout.height === 0;
@@ -999,6 +1010,7 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
       }
       const state = refState.current;
       state.hasScrolled = true;
+      state.contentSize = event.nativeEvent.contentSize;
       const currentTime = performance.now();
       const newScroll = event.nativeEvent.contentOffset[horizontal ? "x" : "y"];
       state.scrollHistory.push({ scroll: newScroll, time: currentTime });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@legendapp/list",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "legend-list",
   "sideEffects": false,
   "private": false,