@legendapp/list 2.0.0-next.8 → 2.0.0

package/index.mjs

@@ -1,17 +1,19 @@
 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, unstable_batchedUpdates } from 'react-native';
+import React3__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/LazyLegendList.tsx
+// src/components/LegendList.tsx
 var ContextState = React3.createContext(null);
 function StateProvider({ children }) {
   const [value] = React3.useState(() => ({
+    animatedScrollY: new Animated.Value(0),
     columnWrapperStyle: void 0,
     listeners: /* @__PURE__ */ new Map(),
     mapViewabilityAmountCallbacks: /* @__PURE__ */ new Map(),
     mapViewabilityAmountValues: /* @__PURE__ */ new Map(),
     mapViewabilityCallbacks: /* @__PURE__ */ new Map(),
+    mapViewabilityConfigStates: /* @__PURE__ */ new Map(),
     mapViewabilityValues: /* @__PURE__ */ new Map(),
     values: /* @__PURE__ */ new Map([
       ["alignItemsPaddingTop", 0],
@@ -164,18 +166,127 @@ var LeanViewComponent = React3.forwardRef((props, ref) => {
 LeanViewComponent.displayName = "RCTView";
 var LeanView = Platform.OS === "android" || Platform.OS === "ios" ? LeanViewComponent : View;
 
-// src/components/Separator.tsx
-function Separator({ ItemSeparatorComponent, itemKey, leadingItem }) {
-  const [lastItemKeys] = useArr$(["lastItemKeys"]);
-  const isALastItem = lastItemKeys.includes(itemKey);
-  return isALastItem ? null : /* @__PURE__ */ React.createElement(ItemSeparatorComponent, { leadingItem });
-}
-
 // src/constants.ts
 var POSITION_OUT_OF_VIEW = -1e7;
 var ENABLE_DEVMODE = __DEV__ && false;
 var ENABLE_DEBUG_VIEW = __DEV__ && false;
 var IsNewArchitecture = global.nativeFabricUIManager != null;
+var useAnimatedValue = (initialValue) => {
+  return useRef(new Animated.Value(initialValue)).current;
+};
+
+// src/hooks/useValue$.ts
+function useValue$(key, params) {
+  var _a;
+  const { getValue, delay } = params || {};
+  const ctx = useStateContext();
+  const animValue = useAnimatedValue((_a = getValue ? getValue(peek$(ctx, key)) : peek$(ctx, key)) != null ? _a : 0);
+  useMemo(() => {
+    let newValue;
+    let prevValue;
+    let didQueueTask = false;
+    listen$(ctx, key, (v) => {
+      newValue = getValue ? getValue(v) : v;
+      if (delay !== void 0) {
+        const fn = () => {
+          didQueueTask = false;
+          if (newValue !== void 0) {
+            animValue.setValue(newValue);
+          }
+        };
+        const delayValue = typeof delay === "function" ? delay(newValue, prevValue) : delay;
+        prevValue = newValue;
+        if (!didQueueTask) {
+          didQueueTask = true;
+          if (delayValue === 0) {
+            queueMicrotask(fn);
+          } else {
+            setTimeout(fn, delayValue);
+          }
+        }
+      } else {
+        animValue.setValue(newValue);
+      }
+    });
+  }, []);
+  return animValue;
+}
+var typedForwardRef = forwardRef;
+var typedMemo = memo;
+
+// src/components/PositionView.tsx
+var PositionViewState = typedMemo(function PositionView({
+  id,
+  horizontal,
+  style,
+  refView,
+  ...rest
+}) {
+  const [position = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
+  return /* @__PURE__ */ React3.createElement(
+    LeanView,
+    {
+      ref: refView,
+      style: [
+        style,
+        horizontal ? { transform: [{ translateX: position }] } : { transform: [{ translateY: position }] }
+      ],
+      ...rest
+    }
+  );
+});
+var PositionViewAnimated = typedMemo(function PositionView2({
+  id,
+  horizontal,
+  style,
+  refView,
+  ...rest
+}) {
+  const position$ = useValue$(`containerPosition${id}`, {
+    getValue: (v) => v != null ? v : POSITION_OUT_OF_VIEW
+  });
+  return /* @__PURE__ */ React3.createElement(
+    Animated.View,
+    {
+      ref: refView,
+      style: [
+        style,
+        horizontal ? { transform: [{ translateX: position$ }] } : { transform: [{ translateY: position$ }] }
+      ],
+      ...rest
+    }
+  );
+});
+var PositionViewSticky = typedMemo(function PositionViewSticky2({
+  id,
+  horizontal,
+  style,
+  refView,
+  animatedScrollY,
+  stickyOffset,
+  index,
+  ...rest
+}) {
+  const [position = POSITION_OUT_OF_VIEW, headerSize] = useArr$([`containerPosition${id}`, "headerSize"]);
+  const transform = React3.useMemo(() => {
+    if (animatedScrollY && stickyOffset) {
+      const stickyPosition = animatedScrollY.interpolate({
+        extrapolate: "clamp",
+        inputRange: [position + headerSize, position + 5e3 + headerSize],
+        outputRange: [position, position + 5e3]
+      });
+      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 });
+});
+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);
@@ -312,8 +423,16 @@ function useListScrollSize() {
   const [scrollSize] = useArr$(["scrollSize"]);
   return scrollSize;
 }
-var typedForwardRef = forwardRef;
-var typedMemo = memo;
+var noop = () => {
+};
+function useSyncLayout() {
+  if (IsNewArchitecture) {
+    const { triggerLayout: syncLayout } = useContext(ContextContainer);
+    return syncLayout;
+  } else {
+    return noop;
+  }
+}
 
 // src/components/Container.tsx
 var Container = typedMemo(function Container2({
@@ -325,14 +444,15 @@ var Container = typedMemo(function Container2({
   ItemSeparatorComponent
 }) {
   const ctx = useStateContext();
-  const columnWrapperStyle = ctx.columnWrapperStyle;
-  const [column = 0, data, itemKey, position = POSITION_OUT_OF_VIEW, numColumns, extraData] = useArr$([
+  const { columnWrapperStyle, animatedScrollY } = ctx;
+  const [column = 0, data, itemKey, numColumns, extraData, isSticky, stickyOffset] = useArr$([
     `containerColumn${id}`,
     `containerItemData${id}`,
     `containerItemKey${id}`,
-    `containerPosition${id}`,
     "numColumns",
-    "extraData"
+    "extraData",
+    `containerSticky${id}`,
+    `containerStickyOffset${id}`
   ]);
   const refLastSize = useRef();
   const ref = useRef(null);
@@ -340,36 +460,38 @@ var Container = typedMemo(function Container2({
   const otherAxisPos = numColumns > 1 ? `${(column - 1) / numColumns * 100}%` : 0;
   const otherAxisSize = numColumns > 1 ? `${1 / numColumns * 100}%` : void 0;
   let didLayout = false;
-  let paddingStyles;
-  if (columnWrapperStyle) {
-    const { columnGap, rowGap, gap } = columnWrapperStyle;
-    if (horizontal) {
-      paddingStyles = {
-        paddingRight: columnGap || gap || void 0,
-        paddingVertical: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
-      };
-    } else {
-      paddingStyles = {
-        paddingBottom: rowGap || gap || void 0,
-        paddingHorizontal: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
-      };
+  const style = useMemo(() => {
+    let paddingStyles;
+    if (columnWrapperStyle) {
+      const { columnGap, rowGap, gap } = columnWrapperStyle;
+      if (horizontal) {
+        paddingStyles = {
+          paddingRight: columnGap || gap || void 0,
+          paddingVertical: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
+        };
+      } else {
+        paddingStyles = {
+          paddingBottom: rowGap || gap || void 0,
+          paddingHorizontal: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
+        };
+      }
     }
-  }
-  const style = horizontal ? {
-    flexDirection: ItemSeparatorComponent ? "row" : void 0,
-    height: otherAxisSize,
-    left: position,
-    position: "absolute",
-    top: otherAxisPos,
-    ...paddingStyles || {}
-  } : {
-    left: otherAxisPos,
-    position: "absolute",
-    right: numColumns > 1 ? null : 0,
-    top: position,
-    width: otherAxisSize,
-    ...paddingStyles || {}
-  };
+    return horizontal ? {
+      flexDirection: ItemSeparatorComponent ? "row" : void 0,
+      height: otherAxisSize,
+      left: 0,
+      position: "absolute",
+      top: otherAxisPos,
+      ...paddingStyles || {}
+    } : {
+      left: otherAxisPos,
+      position: "absolute",
+      right: numColumns > 1 ? null : 0,
+      top: 0,
+      width: otherAxisSize,
+      ...paddingStyles || {}
+    };
+  }, [horizontal, otherAxisPos, otherAxisSize, columnWrapperStyle, numColumns]);
   const renderedItemInfo = useMemo(
     () => itemKey !== void 0 ? getRenderedItem2(itemKey) : null,
     [itemKey, data, extraData]
@@ -434,55 +556,30 @@ var Container = typedMemo(function Container2({
       }
     }, [itemKey]);
   }
-  return /* @__PURE__ */ React3.createElement(LeanView, { key: recycleItems ? void 0 : itemKey, onLayout, ref, style }, /* @__PURE__ */ React3.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && /* @__PURE__ */ React3.createElement(
-    Separator,
+  const PositionComponent = isSticky ? PositionViewSticky : PositionView3;
+  return /* @__PURE__ */ React3.createElement(
+    PositionComponent,
     {
-      ItemSeparatorComponent,
-      itemKey,
-      leadingItem: renderedItemInfo.item
-    }
-  )));
-});
-var useAnimatedValue = (initialValue) => {
-  return useRef(new Animated.Value(initialValue)).current;
-};
-
-// src/hooks/useValue$.ts
-function useValue$(key, params) {
-  var _a;
-  const { getValue, delay } = params || {};
-  const ctx = useStateContext();
-  const animValue = useAnimatedValue((_a = getValue ? getValue(peek$(ctx, key)) : peek$(ctx, key)) != null ? _a : 0);
-  useMemo(() => {
-    let newValue;
-    let prevValue;
-    let didQueueTask = false;
-    listen$(ctx, key, (v) => {
-      newValue = getValue ? getValue(v) : v;
-      if (delay !== void 0) {
-        const fn = () => {
-          didQueueTask = false;
-          if (newValue !== void 0) {
-            animValue.setValue(newValue);
-          }
-        };
-        const delayValue = typeof delay === "function" ? delay(newValue, prevValue) : delay;
-        prevValue = newValue;
-        if (!didQueueTask) {
-          didQueueTask = true;
-          if (delayValue === 0) {
-            queueMicrotask(fn);
-          } else {
-            setTimeout(fn, delayValue);
-          }
-        }
-      } else {
-        animValue.setValue(newValue);
+      animatedScrollY: isSticky ? animatedScrollY : void 0,
+      horizontal,
+      id,
+      index,
+      key: recycleItems ? void 0 : itemKey,
+      onLayout,
+      refView: ref,
+      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
       }
-    });
-  }, []);
-  return animValue;
-}
+    ))
+  );
+});
 
 // src/components/Containers.tsx
 var Containers = typedMemo(function Containers2({
@@ -565,7 +662,48 @@ function SnapWrapper({ ScrollComponent, ...props }) {
   const [snapToOffsets] = useArr$(["snapToOffsets"]);
   return /* @__PURE__ */ React.createElement(ScrollComponent, { ...props, snapToOffsets });
 }
-function useSyncLayout({
+function useThrottleDebounce(mode) {
+  const timeoutRef = useRef(null);
+  const lastCallTimeRef = useRef(0);
+  const lastArgsRef = useRef(null);
+  const clearTimeoutRef = () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+  };
+  const execute = useCallback(
+    (callback, delay, ...args) => {
+      {
+        const now = Date.now();
+        lastArgsRef.current = args;
+        if (now - lastCallTimeRef.current >= delay) {
+          lastCallTimeRef.current = now;
+          callback(...args);
+          clearTimeoutRef();
+        } else {
+          clearTimeoutRef();
+          timeoutRef.current = setTimeout(
+            () => {
+              if (lastArgsRef.current) {
+                lastCallTimeRef.current = Date.now();
+                callback(...lastArgsRef.current);
+                timeoutRef.current = null;
+                lastArgsRef.current = null;
+              }
+            },
+            delay - (now - lastCallTimeRef.current)
+          );
+        }
+      }
+    },
+    [mode]
+  );
+  return execute;
+}
+
+// src/hooks/useSyncLayout.tsx
+function useSyncLayout2({
   onChange
 }) {
   const ref = useRef(null);
@@ -642,16 +780,17 @@ var ListComponent = typedMemo(function ListComponent2({
   scrollAdjustHandler,
   onLayoutHeader,
   snapToIndices,
+  stickyIndices,
   ...rest
 }) {
   const ctx = useStateContext();
-  const { onLayout: onLayoutHeaderSync, ref: refHeader } = useSyncLayout({
+  const { onLayout: onLayoutHeaderSync, ref: refHeader } = useSyncLayout2({
     onChange: onLayoutHeader
   });
   const ScrollComponent = renderScrollComponent ? useMemo(
     () => React3.forwardRef((props, ref) => renderScrollComponent({ ...props, ref })),
     [renderScrollComponent]
-  ) : ScrollView;
+  ) : Animated.ScrollView;
   React3.useEffect(() => {
     if (canRender) {
       setTimeout(() => {
@@ -704,9 +843,26 @@ var ListComponent = typedMemo(function ListComponent2({
         style: ListFooterComponentStyle
       },
       getComponent(ListFooterComponent)
-    )
+    ),
+    __DEV__ && ENABLE_DEVMODE && /* @__PURE__ */ React3.createElement(DevNumbers, null)
   );
 });
+var DevNumbers = __DEV__ && React3.memo(function DevNumbers2() {
+  return Array.from({ length: 100 }).map((_, index) => /* @__PURE__ */ React3.createElement(
+    View,
+    {
+      key: index,
+      style: {
+        height: 100,
+        pointerEvents: "none",
+        position: "absolute",
+        top: index * 100,
+        width: "100%"
+      }
+    },
+    /* @__PURE__ */ React3.createElement(Text, { style: { color: "red" } }, index * 100)
+  ));
+});
 
 // src/utils/getId.ts
 function getId(state, index) {
@@ -725,33 +881,45 @@ function calculateOffsetForIndex(ctx, state, index) {
   let position = 0;
   if (index !== void 0) {
     position = (state == null ? void 0 : state.positions.get(getId(state, index))) || 0;
-  }
-  const paddingTop = peek$(ctx, "stylePaddingTop");
-  if (paddingTop) {
-    position += paddingTop;
-  }
-  const headerSize = peek$(ctx, "headerSize");
-  if (headerSize) {
-    position += headerSize;
+    const paddingTop = peek$(ctx, "stylePaddingTop");
+    if (paddingTop) {
+      position += paddingTop;
+    }
+    const headerSize = peek$(ctx, "headerSize");
+    if (headerSize) {
+      position += headerSize;
+    }
   }
   return position;
 }
 
 // src/utils/getItemSize.ts
 function getItemSize(state, key, index, data, useAverageSize) {
+  var _a, _b;
   const {
     sizesKnown,
     sizes,
     scrollingTo,
-    props: { estimatedItemSize, getEstimatedItemSize }
+    averageSizes,
+    props: { estimatedItemSize, getEstimatedItemSize, getFixedItemSize, getItemType }
   } = state;
   const sizeKnown = sizesKnown.get(key);
   if (sizeKnown !== void 0) {
     return sizeKnown;
   }
   let size;
-  if (useAverageSize !== void 0 && sizeKnown === void 0 && !getEstimatedItemSize && !scrollingTo) {
-    size = useAverageSize;
+  const itemType = getItemType ? (_a = getItemType(data, index)) != null ? _a : "" : "";
+  if (getFixedItemSize) {
+    size = getFixedItemSize(index, data, itemType);
+    if (size !== void 0) {
+      sizesKnown.set(key, size);
+    }
+  }
+  if (size === void 0 && useAverageSize && sizeKnown === void 0 && !scrollingTo) {
+    const averageSizeForType = (_b = averageSizes[itemType]) == null ? void 0 : _b.avg;
+    if (averageSizeForType !== void 0) {
+      size = roundSize(averageSizeForType);
+    }
   }
   if (size === void 0) {
     size = sizes.get(key);
@@ -760,7 +928,7 @@ function getItemSize(state, key, index, data, useAverageSize) {
     }
   }
   if (size === void 0) {
-    size = getEstimatedItemSize ? getEstimatedItemSize(index, data) : estimatedItemSize;
+    size = getEstimatedItemSize ? getEstimatedItemSize(index, data, itemType) : estimatedItemSize;
   }
   sizes.set(key, size);
   return size;
@@ -779,11 +947,52 @@ function calculateOffsetWithOffsetPosition(state, offsetParam, params) {
   return offset;
 }
 
+// src/core/finishScrollTo.ts
+var finishScrollTo = (state) => {
+  if (state) {
+    state.scrollingTo = void 0;
+    state.scrollHistory.length = 0;
+  }
+};
+
+// src/core/scrollTo.ts
+function scrollTo(state, params = {}) {
+  var _a;
+  const { animated, noScrollingTo } = params;
+  const {
+    refScroller,
+    props: { horizontal }
+  } = state;
+  const offset = calculateOffsetWithOffsetPosition(state, params.offset, params);
+  state.scrollHistory.length = 0;
+  if (!noScrollingTo) {
+    state.scrollingTo = params;
+  }
+  state.scrollPending = offset;
+  (_a = refScroller.current) == null ? void 0 : _a.scrollTo({
+    animated: !!animated,
+    x: horizontal ? offset : 0,
+    y: horizontal ? 0 : offset
+  });
+  if (!animated) {
+    state.scroll = offset;
+    setTimeout(() => finishScrollTo(state), 100);
+  }
+}
+
 // src/utils/requestAdjust.ts
-function requestAdjust(ctx, state, positionDiff) {
+function requestAdjust(ctx, state, positionDiff, dataChanged) {
   if (Math.abs(positionDiff) > 0.1) {
+    const needsScrollWorkaround = Platform.OS === "android" && !IsNewArchitecture && dataChanged && state.scroll <= positionDiff;
     const doit = () => {
-      state.scrollAdjustHandler.requestAdjust(positionDiff);
+      if (needsScrollWorkaround) {
+        scrollTo(state, {
+          noScrollingTo: true,
+          offset: state.scroll
+        });
+      } else {
+        state.scrollAdjustHandler.requestAdjust(positionDiff);
+      }
     };
     state.scroll += positionDiff;
     state.scrollForNextCalculateItemsInView = void 0;
@@ -802,49 +1011,72 @@ function requestAdjust(ctx, state, positionDiff) {
       if (state.ignoreScrollFromMVCPTimeout) {
         clearTimeout(state.ignoreScrollFromMVCPTimeout);
       }
-      state.ignoreScrollFromMVCPTimeout = setTimeout(() => {
-        state.ignoreScrollFromMVCP = void 0;
-      }, 100);
+      state.ignoreScrollFromMVCPTimeout = setTimeout(
+        () => {
+          state.ignoreScrollFromMVCP = void 0;
+        },
+        needsScrollWorkaround ? 250 : 100
+      );
     } else {
       requestAnimationFrame(doit);
     }
   }
 }
 
-// src/core/prepareMVCP.ts
-function prepareMVCP(ctx, state) {
+// src/core/mvcp.ts
+function prepareMVCP(ctx, state, dataChanged) {
   const {
+    idsInView,
     positions,
     scrollingTo,
     props: { maintainVisibleContentPosition }
   } = state;
   let prevPosition;
   let targetId;
-  let targetIndex;
+  const idsInViewWithPositions = [];
   const scrollTarget = scrollingTo == null ? void 0 : scrollingTo.index;
   if (maintainVisibleContentPosition) {
     const indexByKey = state.indexByKey;
     if (scrollTarget !== void 0) {
       targetId = getId(state, scrollTarget);
-      targetIndex = scrollTarget;
-    } else if (state.idsInView.length > 0 && peek$(ctx, "containersDidLayout")) {
-      targetId = state.idsInView.find((id) => indexByKey.get(id) !== void 0);
-      targetIndex = indexByKey.get(targetId);
+    } else if (idsInView.length > 0 && peek$(ctx, "containersDidLayout")) {
+      if (dataChanged) {
+        for (let i = 0; i < idsInView.length; i++) {
+          const id = idsInView[i];
+          const index = indexByKey.get(id);
+          if (index !== void 0) {
+            idsInViewWithPositions.push({ id, position: positions.get(id) });
+          }
+        }
+      } else {
+        targetId = state.idsInView.find((id) => indexByKey.get(id) !== void 0);
+      }
     }
-    if (targetId !== void 0 && targetIndex !== void 0) {
+    if (targetId !== void 0) {
       prevPosition = positions.get(targetId);
     }
   }
   return () => {
+    let positionDiff;
+    if (dataChanged && targetId === void 0) {
+      for (let i = 0; i < idsInViewWithPositions.length; i++) {
+        const { id, position } = idsInViewWithPositions[i];
+        const newPosition = positions.get(id);
+        if (newPosition !== void 0) {
+          positionDiff = newPosition - position;
+          break;
+        }
+      }
+    }
     if (targetId !== void 0 && prevPosition !== void 0) {
       const newPosition = positions.get(targetId);
       if (newPosition !== void 0) {
-        const positionDiff = newPosition - prevPosition;
-        if (Math.abs(positionDiff) > 0.1) {
-          requestAdjust(ctx, state, positionDiff);
-        }
+        positionDiff = newPosition - prevPosition;
       }
     }
+    if (positionDiff !== void 0 && Math.abs(positionDiff) > 0.1) {
+      requestAdjust(ctx, state, positionDiff, dataChanged);
+    }
   };
 }
 
@@ -853,10 +1085,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);
     }
@@ -920,43 +1152,6 @@ function addTotalSize(ctx, state, key, add) {
   }
 }
 
-// src/utils/getScrollVelocity.ts
-var getScrollVelocity = (state) => {
-  const { scrollHistory } = state;
-  let velocity = 0;
-  if (scrollHistory.length >= 1) {
-    const newest = scrollHistory[scrollHistory.length - 1];
-    let oldest;
-    let start = 0;
-    for (let i = 0; i < scrollHistory.length - 1; i++) {
-      const entry = scrollHistory[i];
-      const nextEntry = scrollHistory[i + 1];
-      if (i > 0) {
-        const prevEntry = scrollHistory[i - 1];
-        const prevDirection = entry.scroll - prevEntry.scroll;
-        const currentDirection = nextEntry.scroll - entry.scroll;
-        if (prevDirection > 0 && currentDirection < 0 || prevDirection < 0 && currentDirection > 0) {
-          start = i;
-          break;
-        }
-      }
-    }
-    for (let i = start; i < scrollHistory.length - 1; i++) {
-      const entry = scrollHistory[i];
-      if (newest.time - entry.time <= 1e3) {
-        oldest = entry;
-        break;
-      }
-    }
-    if (oldest) {
-      const scrollDiff = newest.scroll - oldest.scroll;
-      const timeDiff = newest.time - oldest.time;
-      velocity = timeDiff > 0 ? scrollDiff / timeDiff : 0;
-    }
-  }
-  return velocity;
-};
-
 // src/utils/updateSnapToOffsets.ts
 function updateSnapToOffsets(ctx, state) {
   const {
@@ -973,69 +1168,42 @@ function updateSnapToOffsets(ctx, state) {
 }
 
 // src/core/updateAllPositions.ts
-function updateAllPositions(ctx, state, dataChanged) {
-  var _a, _b, _c, _d, _e;
+function updateAllPositions(ctx, state, dataChanged, startIndex = 0) {
+  var _a, _b, _c, _d, _e, _f;
   const {
-    averageSizes,
     columns,
     indexByKey,
     positions,
-    firstFullyOnScreenIndex,
     idCache,
     sizesKnown,
-    props: { snapToIndices }
+    props: { getEstimatedItemSize, snapToIndices, enableAverages }
   } = state;
   const data = state.props.data;
   const numColumns = peek$(ctx, "numColumns");
   const indexByKeyForChecking = __DEV__ ? /* @__PURE__ */ new Map() : void 0;
-  const scrollVelocity = getScrollVelocity(state);
-  if (dataChanged) {
-    indexByKey.clear();
-    idCache.clear();
-  }
-  const itemType = "";
-  let averageSize = (_a = averageSizes[itemType]) == null ? void 0 : _a.avg;
-  if (averageSize !== void 0) {
-    averageSize = roundSize(averageSize);
-  }
-  const shouldUseBackwards = !dataChanged && scrollVelocity < 0 && firstFullyOnScreenIndex > 5 && firstFullyOnScreenIndex < data.length;
-  if (shouldUseBackwards && firstFullyOnScreenIndex !== void 0) {
-    const anchorId = getId(state, firstFullyOnScreenIndex);
-    const anchorPosition = positions.get(anchorId);
-    if (anchorPosition !== void 0) {
-      let currentRowTop2 = anchorPosition;
-      let maxSizeInRow2 = 0;
-      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], averageSize);
-        const itemColumn = columns.get(id);
-        maxSizeInRow2 = Math.max(maxSizeInRow2, size);
-        if (itemColumn === 1) {
-          currentRowTop2 -= maxSizeInRow2;
-          maxSizeInRow2 = 0;
-        }
-        if (currentRowTop2 < -2e3) {
-          bailout = true;
-          break;
-        }
-        positions.set(id, currentRowTop2);
-      }
-      if (!bailout) {
-        updateTotalSize(ctx, state);
-        return;
-      }
-    }
-  }
+  const useAverageSize = enableAverages && !getEstimatedItemSize;
   let currentRowTop = 0;
   let column = 1;
   let maxSizeInRow = 0;
   const hasColumns = numColumns > 1;
+  if (startIndex > 0) {
+    const prevIndex = startIndex - 1;
+    const prevId = (_a = idCache.get(prevIndex)) != null ? _a : getId(state, prevIndex);
+    const prevPosition = (_b = positions.get(prevId)) != null ? _b : 0;
+    if (hasColumns) {
+      const prevColumn = (_c = columns.get(prevId)) != null ? _c : 1;
+      currentRowTop = prevPosition;
+      column = prevColumn % numColumns + 1;
+    } else {
+      const prevSize = (_d = sizesKnown.get(prevId)) != null ? _d : getItemSize(state, prevId, prevIndex, data[prevIndex], useAverageSize);
+      currentRowTop = prevPosition + prevSize;
+    }
+  }
   const needsIndexByKey = dataChanged || indexByKey.size === 0;
   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], averageSize);
+  for (let i = startIndex; i < dataLength; i++) {
+    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) {
       if (indexByKeyForChecking.has(id)) {
         console.error(
@@ -1070,7 +1238,19 @@ function updateAllPositions(ctx, state, dataChanged) {
 }
 
 // src/core/viewability.ts
-var mapViewabilityConfigCallbackPairs = /* @__PURE__ */ new Map();
+function ensureViewabilityState(ctx, configId) {
+  let map = ctx.mapViewabilityConfigStates;
+  if (!map) {
+    map = /* @__PURE__ */ new Map();
+    ctx.mapViewabilityConfigStates = map;
+  }
+  let state = map.get(configId);
+  if (!state) {
+    state = { end: -1, previousEnd: -1, previousStart: -1, start: -1, viewableItems: [] };
+    map.set(configId, state);
+  }
+  return state;
+}
 function setupViewability(props) {
   let { viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged } = props;
   if (viewabilityConfig || onViewableItemsChanged) {
@@ -1084,17 +1264,6 @@ function setupViewability(props) {
       }
     ];
   }
-  if (viewabilityConfigCallbackPairs) {
-    for (const pair of viewabilityConfigCallbackPairs) {
-      mapViewabilityConfigCallbackPairs.set(pair.viewabilityConfig.id, {
-        end: -1,
-        previousEnd: -1,
-        previousStart: -1,
-        start: -1,
-        viewableItems: []
-      });
-    }
-  }
   return viewabilityConfigCallbackPairs;
 }
 function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollSize, start, end) {
@@ -1103,9 +1272,7 @@ function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollS
     props: { data }
   } = state;
   for (const viewabilityConfigCallbackPair of viewabilityConfigCallbackPairs) {
-    const viewabilityState = mapViewabilityConfigCallbackPairs.get(
-      viewabilityConfigCallbackPair.viewabilityConfig.id
-    );
+    const viewabilityState = ensureViewabilityState(ctx, viewabilityConfigCallbackPair.viewabilityConfig.id);
     viewabilityState.start = start;
     viewabilityState.end = end;
     if (viewabilityConfigCallbackPair.viewabilityConfig.minimumViewTime) {
@@ -1122,7 +1289,7 @@ function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollS
 function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize) {
   const { viewabilityConfig, onViewableItemsChanged } = viewabilityConfigCallbackPair;
   const configId = viewabilityConfig.id;
-  const viewabilityState = mapViewabilityConfigCallbackPairs.get(configId);
+  const viewabilityState = ensureViewabilityState(ctx, configId);
   const { viewableItems: previousViewableItems, start, end } = viewabilityState;
   const viewabilityTokens = /* @__PURE__ */ new Map();
   for (const [containerId, value] of ctx.mapViewabilityAmountValues) {
@@ -1201,6 +1368,15 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, stat
     }
   }
 }
+function shallowEqual(prev, next) {
+  if (!prev) return false;
+  const keys = Object.keys(next);
+  for (let i = 0; i < keys.length; i++) {
+    const k = keys[i];
+    if (prev[k] !== next[k]) return false;
+  }
+  return true;
+}
 function computeViewability(state, ctx, viewabilityConfig, containerId, key, scrollSize, item, index) {
   const { sizes, positions, scroll: scrollState } = state;
   const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
@@ -1229,7 +1405,8 @@ function computeViewability(state, ctx, viewabilityConfig, containerId, key, scr
     size,
     sizeVisible
   };
-  if (JSON.stringify(value) !== JSON.stringify(ctx.mapViewabilityAmountValues.get(containerId))) {
+  const prev = ctx.mapViewabilityAmountValues.get(containerId);
+  if (!shallowEqual(prev, value)) {
     ctx.mapViewabilityAmountValues.set(containerId, value);
     const cb = ctx.mapViewabilityAmountCallbacks.get(containerId);
     if (cb) {
@@ -1258,6 +1435,7 @@ function maybeUpdateViewabilityCallback(ctx, configId, containerId, viewToken) {
   const cb = ctx.mapViewabilityCallbacks.get(key);
   cb == null ? void 0 : cb(viewToken);
 }
+var batchedUpdates = unstable_batchedUpdates || ((callback) => callback());
 
 // src/utils/checkAllSizesKnown.ts
 function checkAllSizesKnown(state) {
@@ -1274,35 +1452,79 @@ function checkAllSizesKnown(state) {
 }
 
 // src/utils/findAvailableContainers.ts
-function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffered, pendingRemoval) {
+function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffered, pendingRemoval, requiredItemTypes, needNewContainers) {
   const numContainers = peek$(ctx, "numContainers");
+  const { stickyContainerPool, containerItemTypes } = state;
   const result = [];
   const availableContainers = [];
-  for (let u = 0; u < numContainers; u++) {
+  const stickyIndicesSet = state.props.stickyIndicesSet;
+  const stickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => stickyIndicesSet.has(index))) || [];
+  const canReuseContainer = (containerIndex, requiredType) => {
+    if (!requiredType) return true;
+    const existingType = containerItemTypes.get(containerIndex);
+    if (!existingType) return true;
+    return existingType === requiredType;
+  };
+  const neededTypes = requiredItemTypes ? [...requiredItemTypes] : [];
+  let typeIndex = 0;
+  for (let i = 0; i < stickyItemIndices.length; i++) {
+    const requiredType = neededTypes[typeIndex];
+    let foundContainer = false;
+    for (const containerIndex of stickyContainerPool) {
+      const key = peek$(ctx, `containerItemKey${containerIndex}`);
+      const isPendingRemoval = pendingRemoval.includes(containerIndex);
+      if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, requiredType)) {
+        result.push(containerIndex);
+        if (isPendingRemoval) {
+          const index = pendingRemoval.indexOf(containerIndex);
+          pendingRemoval.splice(index, 1);
+        }
+        foundContainer = true;
+        if (requiredItemTypes) typeIndex++;
+        break;
+      }
+    }
+    if (!foundContainer) {
+      const newContainerIndex = numContainers + result.filter((index) => index >= numContainers).length;
+      result.push(newContainerIndex);
+      stickyContainerPool.add(newContainerIndex);
+      if (requiredItemTypes) typeIndex++;
+    }
+  }
+  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);
-        isOk = true;
+        const requiredType = neededTypes[typeIndex];
+        isOk = canReuseContainer(u, requiredType);
       }
     }
     if (isOk) {
       result.push(u);
-      if (result.length >= numNeeded) {
-        return result;
+      if (requiredItemTypes) {
+        typeIndex++;
       }
     }
   }
-  for (let u = 0; u < numContainers; u++) {
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
+      continue;
+    }
     const key = peek$(ctx, `containerItemKey${u}`);
     if (key === void 0) continue;
     const index = state.indexByKey.get(key);
-    if (index < startBuffered) {
-      availableContainers.push({ distance: startBuffered - index, index: u });
-    } else if (index > endBuffered) {
-      availableContainers.push({ distance: index - endBuffered, index: u });
+    const isOutOfView = index < startBuffered || index > endBuffered;
+    if (isOutOfView) {
+      const distance = index < startBuffered ? startBuffered - index : index - endBuffered;
+      if (!requiredItemTypes || typeIndex < neededTypes.length && canReuseContainer(u, neededTypes[typeIndex])) {
+        availableContainers.push({ distance, index: u });
+      }
     }
   }
   const remaining = numNeeded - result.length;
@@ -1314,6 +1536,9 @@ function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffer
       }
       for (const container of availableContainers) {
         result.push(container.index);
+        if (requiredItemTypes) {
+          typeIndex++;
+        }
       }
     }
     const stillNeeded = numNeeded - result.length;
@@ -1342,37 +1567,44 @@ function comparatorByDistance(a, b) {
   return b.distance - a.distance;
 }
 
-// src/core/finishScrollTo.ts
-var finishScrollTo = (state) => {
-  if (state) {
-    state.scrollingTo = void 0;
-    state.scrollHistory.length = 0;
+// src/utils/getScrollVelocity.ts
+var getScrollVelocity = (state) => {
+  const { scrollHistory } = state;
+  let velocity = 0;
+  if (scrollHistory.length >= 1) {
+    const newest = scrollHistory[scrollHistory.length - 1];
+    let oldest;
+    let start = 0;
+    const now = Date.now();
+    for (let i = 0; i < scrollHistory.length - 1; i++) {
+      const entry = scrollHistory[i];
+      const nextEntry = scrollHistory[i + 1];
+      if (i > 0) {
+        const prevEntry = scrollHistory[i - 1];
+        const prevDirection = entry.scroll - prevEntry.scroll;
+        const currentDirection = nextEntry.scroll - entry.scroll;
+        if (prevDirection > 0 && currentDirection < 0 || prevDirection < 0 && currentDirection > 0) {
+          start = i;
+          break;
+        }
+      }
+    }
+    for (let i = start; i < scrollHistory.length - 1; i++) {
+      const entry = scrollHistory[i];
+      if (now - entry.time <= 1e3) {
+        oldest = entry;
+        break;
+      }
+    }
+    if (oldest && oldest !== newest) {
+      const scrollDiff = newest.scroll - oldest.scroll;
+      const timeDiff = newest.time - oldest.time;
+      velocity = timeDiff > 0 ? scrollDiff / timeDiff : 0;
+    }
   }
+  return velocity;
 };
 
-// src/core/scrollTo.ts
-function scrollTo(state, params = {}) {
-  var _a;
-  const { animated } = params;
-  const {
-    refScroller,
-    props: { horizontal }
-  } = state;
-  const offset = calculateOffsetWithOffsetPosition(state, params.offset, params);
-  state.scrollHistory.length = 0;
-  state.scrollingTo = params;
-  state.scrollPending = offset;
-  (_a = refScroller.current) == null ? void 0 : _a.scrollTo({
-    animated: !!animated,
-    x: horizontal ? offset : 0,
-    y: horizontal ? 0 : offset
-  });
-  if (!animated) {
-    state.scroll = offset;
-    setTimeout(() => finishScrollTo(state), 100);
-  }
-}
-
 // src/core/scrollToIndex.ts
 function scrollToIndex(ctx, state, { index, viewOffset = 0, animated = true, viewPosition }) {
   if (index >= state.props.data.length) {
@@ -1450,43 +1682,123 @@ function checkAtBottom(ctx, state) {
     );
   }
 }
-
-// src/utils/setDidLayout.ts
-function setDidLayout(ctx, state) {
-  const {
-    loadStartTime,
-    initialScroll,
-    props: { onLoad }
-  } = state;
-  state.queuedInitialLayout = true;
-  checkAtBottom(ctx, state);
-  if (!IsNewArchitecture && initialScroll) {
-    scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+
+// src/utils/setDidLayout.ts
+function setDidLayout(ctx, state) {
+  const {
+    loadStartTime,
+    initialScroll,
+    props: { onLoad }
+  } = state;
+  state.queuedInitialLayout = true;
+  checkAtBottom(ctx, state);
+  const setIt = () => {
+    set$(ctx, "containersDidLayout", true);
+    if (onLoad) {
+      onLoad({ elapsedTimeInMs: Date.now() - loadStartTime });
+    }
+  };
+  if (Platform.OS === "android" || !IsNewArchitecture) {
+    if (initialScroll) {
+      queueMicrotask(() => {
+        scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+        requestAnimationFrame(() => {
+          scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+          setIt();
+        });
+      });
+    } else {
+      queueMicrotask(setIt);
+    }
+  } else {
+    setIt();
+  }
+}
+
+// src/core/calculateItemsInView.ts
+function findCurrentStickyIndex(stickyArray, scroll, state) {
+  var _a;
+  const idCache = state.idCache;
+  const positions = state.positions;
+  for (let i = stickyArray.length - 1; i >= 0; i--) {
+    const stickyId = (_a = idCache.get(stickyArray[i])) != null ? _a : getId(state, stickyArray[i]);
+    const stickyPos = stickyId ? positions.get(stickyId) : void 0;
+    if (stickyPos !== void 0 && scroll >= stickyPos) {
+      return i;
+    }
+  }
+  return -1;
+}
+function getActiveStickyIndices(ctx, state, stickyIndices) {
+  return new Set(
+    Array.from(state.stickyContainerPool).map((i) => peek$(ctx, `containerItemKey${i}`)).map((key) => key ? state.indexByKey.get(key) : void 0).filter((idx) => idx !== void 0 && stickyIndices.has(idx))
+  );
+}
+function handleStickyActivation(ctx, state, stickyIndices, stickyArray, scroll, needNewContainers, startBuffered, endBuffered) {
+  var _a;
+  const activeIndices = getActiveStickyIndices(ctx, state, stickyIndices);
+  const currentStickyIdx = findCurrentStickyIndex(stickyArray, scroll, state);
+  for (let offset = 0; offset <= 1; offset++) {
+    const idx = currentStickyIdx - offset;
+    if (idx < 0 || activeIndices.has(stickyArray[idx])) continue;
+    const stickyIndex = stickyArray[idx];
+    const stickyId = (_a = state.idCache.get(stickyIndex)) != null ? _a : getId(state, stickyIndex);
+    if (stickyId && !state.containerItemKeys.has(stickyId) && (stickyIndex < startBuffered || stickyIndex > endBuffered)) {
+      needNewContainers.push(stickyIndex);
+    }
   }
-  set$(ctx, "containersDidLayout", true);
-  if (onLoad) {
-    onLoad({ elapsedTimeInMs: Date.now() - loadStartTime });
+}
+function handleStickyRecycling(ctx, state, stickyArray, scroll, scrollBuffer, pendingRemoval) {
+  var _a, _b, _c;
+  const currentStickyIdx = findCurrentStickyIndex(stickyArray, scroll, state);
+  for (const containerIndex of state.stickyContainerPool) {
+    const itemKey = peek$(ctx, `containerItemKey${containerIndex}`);
+    const itemIndex = itemKey ? state.indexByKey.get(itemKey) : void 0;
+    if (itemIndex === void 0) continue;
+    const arrayIdx = stickyArray.indexOf(itemIndex);
+    if (arrayIdx === -1) continue;
+    const isRecentSticky = arrayIdx >= currentStickyIdx - 1 && arrayIdx <= currentStickyIdx + 1;
+    if (isRecentSticky) continue;
+    const nextIndex = stickyArray[arrayIdx + 1];
+    let shouldRecycle = false;
+    if (nextIndex) {
+      const nextId = (_a = state.idCache.get(nextIndex)) != null ? _a : getId(state, nextIndex);
+      const nextPos = nextId ? state.positions.get(nextId) : void 0;
+      shouldRecycle = nextPos !== void 0 && scroll > nextPos + scrollBuffer * 2;
+    } else {
+      const currentId = (_b = state.idCache.get(itemIndex)) != null ? _b : getId(state, itemIndex);
+      if (currentId) {
+        const currentPos = state.positions.get(currentId);
+        const currentSize = (_c = state.sizes.get(currentId)) != null ? _c : getItemSize(state, currentId, itemIndex, state.props.data[itemIndex]);
+        shouldRecycle = currentPos !== void 0 && scroll > currentPos + currentSize + scrollBuffer * 3;
+      }
+    }
+    if (shouldRecycle) {
+      pendingRemoval.push(containerIndex);
+    }
   }
 }
-
-// src/core/calculateItemsInView.ts
 function calculateItemsInView(ctx, state, params = {}) {
-  unstable_batchedUpdates(() => {
+  batchedUpdates(() => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const {
-      scrollLength,
-      startBufferedId: startBufferedIdOrig,
-      positions,
       columns,
       containerItemKeys,
+      enableScrollForNextCalculateItemsInView,
       idCache,
-      sizes,
       indexByKey,
+      minIndexSizeChanged,
+      positions,
       scrollForNextCalculateItemsInView,
-      enableScrollForNextCalculateItemsInView,
-      minIndexSizeChanged
+      scrollLength,
+      sizes,
+      startBufferedId: startBufferedIdOrig,
+      viewabilityConfigCallbackPairs,
+      props: { getItemType, initialScroll, itemsAreEqual, keyExtractor, scrollBuffer }
     } = state;
-    const data = state.props.data;
+    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;
@@ -1498,14 +1810,22 @@ function calculateItemsInView(ctx, state, params = {}) {
     const { dataChanged, doMVCP } = params;
     const speed = getScrollVelocity(state);
     if (doMVCP || dataChanged) {
-      const checkMVCP = doMVCP ? prepareMVCP(ctx, state) : void 0;
-      updateAllPositions(ctx, state, 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;
-    const initialScroll = state.props.initialScroll;
     if (!queuedInitialLayout && initialScroll) {
       const updatedOffset = calculateOffsetWithOffsetPosition(
         state,
@@ -1517,16 +1837,15 @@ function calculateItemsInView(ctx, state, params = {}) {
     const scrollAdjustPad = -previousScrollAdjust - topPad;
     let scroll = scrollState + scrollExtra + scrollAdjustPad;
     if (scroll + scrollLength > totalSize) {
-      scroll = totalSize - scrollLength;
+      scroll = Math.max(0, 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) {
+    if (speed > 0 || speed === 0 && scroll < Math.max(50, scrollBuffer)) {
       scrollBufferTop = scrollBuffer * 0.5;
       scrollBufferBottom = scrollBuffer * 1.5;
     } else {
@@ -1534,7 +1853,7 @@ function calculateItemsInView(ctx, state, params = {}) {
       scrollBufferBottom = scrollBuffer * 0.5;
     }
     const scrollTopBuffered = scroll - scrollBufferTop;
-    const scrollBottom = scroll + scrollLength;
+    const scrollBottom = scroll + scrollLength + (scroll < 0 ? -scroll : 0);
     const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
     if (scrollForNextCalculateItemsInView) {
       const { top, bottom } = scrollForNextCalculateItemsInView;
@@ -1548,10 +1867,6 @@ function calculateItemsInView(ctx, state, params = {}) {
     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);
@@ -1634,7 +1949,7 @@ function calculateItemsInView(ctx, state, params = {}) {
     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) {
+        if (!keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
           pendingRemoval.push(i);
         }
       }
@@ -1648,14 +1963,32 @@ function calculateItemsInView(ctx, state, params = {}) {
           needNewContainers.push(i);
         }
       }
+      if (stickyIndicesArr.length > 0) {
+        handleStickyActivation(
+          ctx,
+          state,
+          stickyIndicesSet,
+          stickyIndicesArr,
+          scroll,
+          needNewContainers,
+          startBuffered,
+          endBuffered
+        );
+      }
       if (needNewContainers.length > 0) {
+        const requiredItemTypes = getItemType ? needNewContainers.map((i) => {
+          const itemType = getItemType(data[i], i);
+          return itemType ? String(itemType) : "";
+        }) : void 0;
         const availableContainers = findAvailableContainers(
           ctx,
           state,
           needNewContainers.length,
           startBuffered,
           endBuffered,
-          pendingRemoval
+          pendingRemoval,
+          requiredItemTypes,
+          needNewContainers
         );
         for (let idx = 0; idx < needNewContainers.length; idx++) {
           const i = needNewContainers[idx];
@@ -1667,7 +2000,19 @@ function calculateItemsInView(ctx, state, params = {}) {
           }
           set$(ctx, `containerItemKey${containerIndex}`, id);
           set$(ctx, `containerItemData${containerIndex}`, data[i]);
+          if (requiredItemTypes) {
+            state.containerItemTypes.set(containerIndex, requiredItemTypes[idx]);
+          }
           containerItemKeys.add(id);
+          if (stickyIndicesSet.has(i)) {
+            set$(ctx, `containerSticky${containerIndex}`, true);
+            const topPadding = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
+            set$(ctx, `containerStickyOffset${containerIndex}`, new Animated.Value(topPadding));
+            state.stickyContainerPool.add(containerIndex);
+          } else {
+            set$(ctx, `containerSticky${containerIndex}`, false);
+            state.stickyContainerPool.delete(containerIndex);
+          }
           if (containerIndex >= numContainers2) {
             numContainers2 = containerIndex + 1;
           }
@@ -1680,12 +2025,21 @@ function calculateItemsInView(ctx, state, params = {}) {
         }
       }
     }
+    if (stickyIndicesArr.length > 0) {
+      handleStickyRecycling(ctx, state, stickyIndicesArr, scroll, scrollBuffer, pendingRemoval);
+    }
     for (let i = 0; i < numContainers; i++) {
       const itemKey = peek$(ctx, `containerItemKey${i}`);
       if (pendingRemoval.includes(i)) {
         if (itemKey) {
           containerItemKeys.delete(itemKey);
         }
+        state.containerItemTypes.delete(i);
+        if (state.stickyContainerPool.has(i)) {
+          set$(ctx, `containerSticky${i}`, false);
+          set$(ctx, `containerStickyOffset${i}`, void 0);
+          state.stickyContainerPool.delete(i);
+        }
         set$(ctx, `containerItemKey${i}`, void 0);
         set$(ctx, `containerItemData${i}`, void 0);
         set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
@@ -1709,7 +2063,7 @@ function calculateItemsInView(ctx, state, params = {}) {
             if (column >= 0 && column !== prevColumn) {
               set$(ctx, `containerColumn${i}`, column);
             }
-            if (prevData !== item) {
+            if (prevData !== item && (itemsAreEqual ? !itemsAreEqual(prevData, item, itemIndex, data) : true)) {
               set$(ctx, `containerItemData${i}`, data[itemIndex]);
             }
           }
@@ -1721,42 +2075,55 @@ function calculateItemsInView(ctx, state, params = {}) {
         setDidLayout(ctx, state);
       }
     }
-    if (state.props.viewabilityConfigCallbackPairs) {
-      updateViewableItems(
-        state,
-        ctx,
-        state.props.viewabilityConfigCallbackPairs,
-        scrollLength,
-        startNoBuffer,
-        endNoBuffer
-      );
+    if (viewabilityConfigCallbackPairs) {
+      updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollLength, startNoBuffer, endNoBuffer);
     }
   });
 }
 
 // src/core/doInitialAllocateContainers.ts
 function doInitialAllocateContainers(ctx, state) {
-  const { scrollLength } = state;
-  const data = state.props.data;
-  if (scrollLength > 0 && data.length > 0 && !peek$(ctx, "numContainers")) {
-    const averageItemSize = state.props.getEstimatedItemSize ? state.props.getEstimatedItemSize(0, data[0]) : state.props.estimatedItemSize;
-    const Extra = 1.5;
-    const numContainers = Math.ceil(
-      (scrollLength + state.props.scrollBuffer * 2) / averageItemSize * state.props.numColumns * Extra
-    );
+  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) {
+    if (!IsNewArchitecture || state.lastLayout) {
       if (state.props.initialScroll) {
         requestAnimationFrame(() => {
-          calculateItemsInView(ctx, state);
+          calculateItemsInView(ctx, state, { dataChanged: true });
         });
       } else {
-        calculateItemsInView(ctx, state);
+        calculateItemsInView(ctx, state, { dataChanged: true });
       }
     }
     return true;
@@ -1776,16 +2143,18 @@ function doMaintainScrollAtEnd(ctx, state, animated) {
     }
     requestAnimationFrame(() => {
       var _a;
-      state.maintainingScrollAtEnd = true;
-      (_a = refScroller.current) == null ? void 0 : _a.scrollToEnd({
-        animated
-      });
-      setTimeout(
-        () => {
-          state.maintainingScrollAtEnd = false;
-        },
-        0
-      );
+      if (state == null ? void 0 : state.isAtEnd) {
+        state.maintainingScrollAtEnd = true;
+        (_a = refScroller.current) == null ? void 0 : _a.scrollToEnd({
+          animated
+        });
+        setTimeout(
+          () => {
+            state.maintainingScrollAtEnd = false;
+          },
+          0
+        );
+      }
     });
     return true;
   }
@@ -1826,40 +2195,49 @@ function handleLayout(ctx, state, layout, setCanRender) {
   const otherAxisSize = layout[state.props.horizontal ? "height" : "width"];
   const needsCalculate = !state.lastLayout || scrollLength > state.scrollLength || state.lastLayout.x !== layout.x || state.lastLayout.y !== layout.y;
   state.lastLayout = layout;
-  const didChange = scrollLength !== state.scrollLength;
   const prevOtherAxisSize = state.otherAxisSize;
-  state.scrollLength = scrollLength;
-  state.otherAxisSize = otherAxisSize;
-  state.lastBatchingAction = Date.now();
-  state.scrollForNextCalculateItemsInView = void 0;
-  doInitialAllocateContainers(ctx, state);
-  if (needsCalculate) {
-    calculateItemsInView(ctx, state, { doMVCP: true });
-  }
-  if (didChange || otherAxisSize !== prevOtherAxisSize) {
-    set$(ctx, "scrollSize", { height: layout.height, width: layout.width });
-  }
-  if (maintainScrollAtEnd === true || maintainScrollAtEnd.onLayout) {
-    doMaintainScrollAtEnd(ctx, state, false);
-  }
-  updateAlignItemsPaddingTop(ctx, state);
-  checkAtBottom(ctx, state);
-  checkAtTop(state);
-  if (state) {
-    state.needsOtherAxisSize = otherAxisSize - (state.props.stylePaddingTop || 0) < 10;
-  }
-  if (__DEV__ && scrollLength === 0) {
-    warnDevOnce(
-      "height0",
-      `List ${state.props.horizontal ? "width" : "height"} is 0. You may need to set a style or \`flex: \` for the list, because children are absolutely positioned.`
-    );
+  const didChange = scrollLength !== state.scrollLength || otherAxisSize !== prevOtherAxisSize;
+  if (didChange) {
+    state.scrollLength = scrollLength;
+    state.otherAxisSize = otherAxisSize;
+    state.lastBatchingAction = Date.now();
+    state.scrollForNextCalculateItemsInView = void 0;
+    doInitialAllocateContainers(ctx, state);
+    if (needsCalculate) {
+      calculateItemsInView(ctx, state, { doMVCP: true });
+    }
+    if (didChange || otherAxisSize !== prevOtherAxisSize) {
+      set$(ctx, "scrollSize", { height: layout.height, width: layout.width });
+    }
+    if (maintainScrollAtEnd === true || maintainScrollAtEnd.onLayout) {
+      doMaintainScrollAtEnd(ctx, state, false);
+    }
+    updateAlignItemsPaddingTop(ctx, state);
+    checkAtBottom(ctx, state);
+    checkAtTop(state);
+    if (state) {
+      state.needsOtherAxisSize = otherAxisSize - (state.props.stylePaddingTop || 0) < 10;
+    }
+    if (__DEV__ && scrollLength === 0) {
+      warnDevOnce(
+        "height0",
+        `List ${state.props.horizontal ? "width" : "height"} is 0. You may need to set a style or \`flex: \` for the list, because children are absolutely positioned.`
+      );
+    }
+    setCanRender(true);
   }
-  setCanRender(true);
 }
 
 // src/core/onScroll.ts
 function onScroll(ctx, state, event) {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c;
+  const {
+    scrollProcessingEnabled,
+    props: { onScroll: onScrollProp }
+  } = state;
+  if (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) {
     return;
   }
@@ -1873,15 +2251,16 @@ function onScroll(ctx, state, event) {
   }
   state.scrollPending = newScroll;
   updateScroll(ctx, state, newScroll);
-  (_e = (_d = state.props).onScroll) == null ? void 0 : _e.call(_d, event);
+  onScrollProp == null ? void 0 : onScrollProp(event);
 }
 function updateScroll(ctx, state, newScroll) {
   const scrollingTo = state.scrollingTo;
   state.hasScrolled = true;
   state.lastBatchingAction = Date.now();
-  const currentTime = performance.now();
+  const currentTime = Date.now();
   if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === state.scroll)) {
-    state.scrollHistory.push({ scroll: newScroll, time: currentTime });
+    const adjust = state.scrollAdjustHandler.getAdjust();
+    state.scrollHistory.push({ scroll: newScroll - adjust, time: currentTime });
   }
   if (state.scrollHistory.length > 5) {
     state.scrollHistory.shift();
@@ -1890,9 +2269,11 @@ function updateScroll(ctx, state, newScroll) {
   state.scrollPrevTime = state.scrollTime;
   state.scroll = newScroll;
   state.scrollTime = currentTime;
-  calculateItemsInView(ctx, state);
-  checkAtBottom(ctx, state);
-  checkAtTop(state);
+  if (Math.abs(state.scroll - state.scrollPrev) > 2) {
+    calculateItemsInView(ctx, state);
+    checkAtBottom(ctx, state);
+    checkAtTop(state);
+  }
 }
 
 // src/core/ScrollAdjustHandler.ts
@@ -1915,13 +2296,19 @@ var ScrollAdjustHandler = class {
   setMounted() {
     this.mounted = true;
   }
+  getAdjust() {
+    return this.appliedAdjust;
+  }
 };
 
 // src/core/updateItemSize.ts
-function updateItemSizes(ctx, state, itemUpdates) {
-  var _a;
+function updateItemSize(ctx, state, itemKey, sizeObj) {
+  var _a, _b;
   const {
+    sizesKnown,
     props: {
+      getFixedItemSize,
+      getItemType,
       horizontal,
       maintainVisibleContentPosition,
       suggestEstimatedItemSize,
@@ -1931,47 +2318,60 @@ function updateItemSizes(ctx, state, itemUpdates) {
     }
   } = state;
   if (!data) return;
+  if (getFixedItemSize) {
+    const index2 = state.indexByKey.get(itemKey);
+    if (index2 === void 0) {
+      return;
+    }
+    const itemData = state.props.data[index2];
+    if (itemData === void 0) {
+      return;
+    }
+    const type = getItemType ? (_a = getItemType(itemData, index2)) != null ? _a : "" : "";
+    const size2 = getFixedItemSize(index2, itemData, type);
+    if (size2 !== void 0 && size2 === sizesKnown.get(itemKey)) {
+      return;
+    }
+  }
   const containersDidLayout = peek$(ctx, "containersDidLayout");
   let needsRecalculate = !containersDidLayout;
   let shouldMaintainScrollAtEnd = false;
   let minIndexSizeChanged;
   let maxOtherAxisSize = peek$(ctx, "otherAxisSize") || 0;
-  for (const { itemKey, sizeObj } of itemUpdates) {
-    const index = state.indexByKey.get(itemKey);
-    const prevSizeKnown = state.sizesKnown.get(itemKey);
-    const diff = updateOneItemSize(state, itemKey, sizeObj);
-    const size = Math.floor((horizontal ? sizeObj.width : sizeObj.height) * 8) / 8;
-    if (diff !== 0) {
-      minIndexSizeChanged = minIndexSizeChanged !== void 0 ? Math.min(minIndexSizeChanged, index) : index;
-      if (((_a = state.scrollingTo) == null ? void 0 : _a.viewPosition) && maintainVisibleContentPosition && index === state.scrollingTo.index && diff > 0) {
-        requestAdjust(ctx, state, diff * state.scrollingTo.viewPosition);
-      }
-      const { startBuffered, endBuffered } = state;
-      needsRecalculate || (needsRecalculate = index >= startBuffered && index <= endBuffered);
-      if (!needsRecalculate) {
-        const numContainers = ctx.values.get("numContainers");
-        for (let i = 0; i < numContainers; i++) {
-          if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
-            needsRecalculate = true;
-            break;
-          }
+  const index = state.indexByKey.get(itemKey);
+  const prevSizeKnown = state.sizesKnown.get(itemKey);
+  const diff = updateOneItemSize(state, itemKey, sizeObj);
+  const size = Math.floor((horizontal ? sizeObj.width : sizeObj.height) * 8) / 8;
+  if (diff !== 0) {
+    minIndexSizeChanged = minIndexSizeChanged !== void 0 ? Math.min(minIndexSizeChanged, index) : index;
+    if (((_b = state.scrollingTo) == null ? void 0 : _b.viewPosition) && maintainVisibleContentPosition && index === state.scrollingTo.index && diff > 0) {
+      requestAdjust(ctx, state, diff * state.scrollingTo.viewPosition);
+    }
+    const { startBuffered, endBuffered } = state;
+    needsRecalculate || (needsRecalculate = index >= startBuffered && index <= endBuffered);
+    if (!needsRecalculate) {
+      const numContainers = ctx.values.get("numContainers");
+      for (let i = 0; i < numContainers; i++) {
+        if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
+          needsRecalculate = true;
+          break;
         }
       }
-      if (state.needsOtherAxisSize) {
-        const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
-        maxOtherAxisSize = Math.max(maxOtherAxisSize, otherAxisSize);
-      }
-      if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
-        shouldMaintainScrollAtEnd = true;
-      }
-      onItemSizeChanged == null ? void 0 : onItemSizeChanged({
-        index,
-        itemData: state.props.data[index],
-        itemKey,
-        previous: size - diff,
-        size
-      });
     }
+    if (state.needsOtherAxisSize) {
+      const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
+      maxOtherAxisSize = Math.max(maxOtherAxisSize, otherAxisSize);
+    }
+    if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
+      shouldMaintainScrollAtEnd = true;
+    }
+    onItemSizeChanged == null ? void 0 : onItemSizeChanged({
+      index,
+      itemData: state.props.data[index],
+      itemKey,
+      previous: size - diff,
+      size
+    });
   }
   if (minIndexSizeChanged !== void 0) {
     state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, minIndexSizeChanged) : minIndexSizeChanged;
@@ -2004,43 +2404,29 @@ function updateItemSizes(ctx, state, itemUpdates) {
     }
   }
 }
-function updateItemSize(ctx, state, itemKey, sizeObj) {
-  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 {
-    queuedItemSizeUpdates.push({ itemKey, sizeObj });
-  }
-}
 function updateOneItemSize(state, itemKey, sizeObj) {
+  var _a;
   const {
     sizes,
     indexByKey,
     sizesKnown,
     averageSizes,
-    props: { data, horizontal }
+    props: { data, horizontal, getEstimatedItemSize, getItemType, getFixedItemSize }
   } = state;
   if (!data) return 0;
   const index = indexByKey.get(itemKey);
   const prevSize = getItemSize(state, itemKey, index, data);
   const size = Math.floor((horizontal ? sizeObj.width : sizeObj.height) * 8) / 8;
   sizesKnown.set(itemKey, size);
-  const itemType = "";
-  let averages = averageSizes[itemType];
-  if (!averages) {
-    averages = averageSizes[itemType] = { avg: 0, num: 0 };
+  if (!getEstimatedItemSize && !getFixedItemSize && size > 0) {
+    const itemType = getItemType ? (_a = getItemType(data[index], index)) != null ? _a : "" : "";
+    let averages = averageSizes[itemType];
+    if (!averages) {
+      averages = averageSizes[itemType] = { avg: 0, num: 0 };
+    }
+    averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
+    averages.num++;
   }
-  averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
-  averages.num++;
   if (!prevSize || Math.abs(prevSize - size) > 0.1) {
     sizes.set(itemKey, size);
     return size - prevSize;
@@ -2078,86 +2464,165 @@ function createColumnWrapperStyle(contentContainerStyle) {
   }
 }
 function getRenderedItem(ctx, state, key) {
+  var _a;
   if (!state) {
     return null;
   }
   const {
     indexByKey,
-    props: { data, renderItem: renderItem2 }
+    props: { data, getItemType, renderItem }
   } = state;
   const index = indexByKey.get(key);
   if (index === void 0) {
     return null;
   }
   let renderedItem = null;
-  if (renderItem2) {
+  if (renderItem && data[index]) {
     const itemProps = {
+      data,
       extraData: peek$(ctx, "extraData"),
       index,
-      item: data[index]
+      item: data[index],
+      type: getItemType ? (_a = getItemType(data[index], index)) != null ? _a : "" : ""
     };
-    renderedItem = React3__default.createElement(renderItem2, itemProps);
+    renderedItem = isFunction(renderItem) ? renderItem(itemProps) : React3__default.createElement(renderItem, itemProps);
   }
   return { index, item: data[index], renderedItem };
 }
 
+// src/utils/throttledOnScroll.ts
+function useThrottledOnScroll(originalHandler, scrollEventThrottle) {
+  const throttle = useThrottleDebounce("throttle");
+  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;
-var LegendList = typedForwardRef(function LegendList2(props, forwardedRef) {
-  return /* @__PURE__ */ React3.createElement(StateProvider, null, /* @__PURE__ */ React3.createElement(LegendListInner, { ...props, ref: forwardedRef }));
-});
+var LegendList = typedMemo(
+  typedForwardRef(function LegendList2(props, forwardedRef) {
+    const { children, data: dataProp, renderItem: renderItemProp, ...restProps } = props;
+    const isChildrenMode = children !== void 0 && dataProp === void 0;
+    const processedProps = isChildrenMode ? {
+      ...restProps,
+      data: (isArray(children) ? children : React3.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 }));
+  })
+);
 var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
   var _a;
   const {
-    data: dataProp = [],
-    initialScrollIndex: initialScrollIndexProp,
-    initialScrollOffset,
-    horizontal,
-    drawDistance = 250,
-    recycleItems = false,
-    onEndReachedThreshold = 0.5,
-    onStartReachedThreshold = 0.5,
-    maintainScrollAtEnd = false,
-    maintainScrollAtEndThreshold = 0.1,
     alignItemsAtEnd = false,
-    maintainVisibleContentPosition = false,
-    onScroll: onScrollProp,
-    onMomentumScrollEnd,
-    numColumns: numColumnsProp = 1,
     columnWrapperStyle,
-    keyExtractor: keyExtractorProp,
-    renderItem: renderItem2,
-    estimatedListSize,
+    contentContainerStyle: contentContainerStyleProp,
+    data: dataProp = [],
+    drawDistance = 250,
+    enableAverages = true,
     estimatedItemSize: estimatedItemSizeProp,
+    estimatedListSize,
+    extraData,
     getEstimatedItemSize,
-    suggestEstimatedItemSize,
-    ListHeaderComponent,
+    getFixedItemSize,
+    getItemType,
+    horizontal,
+    initialContainerPoolRatio = 2,
+    initialScrollIndex: initialScrollIndexProp,
+    initialScrollOffset: initialScrollOffsetProp,
+    itemsAreEqual,
+    keyExtractor: keyExtractorProp,
     ListEmptyComponent,
+    ListHeaderComponent,
+    maintainScrollAtEnd = false,
+    maintainScrollAtEndThreshold = 0.1,
+    maintainVisibleContentPosition = true,
+    numColumns: numColumnsProp = 1,
+    onEndReached,
+    onEndReachedThreshold = 0.5,
     onItemSizeChanged,
-    refScrollView,
-    waitForInitialLayout = true,
-    extraData,
-    contentContainerStyle: contentContainerStyleProp,
-    style: styleProp,
     onLayout: onLayoutProp,
+    onLoad,
+    onMomentumScrollEnd,
     onRefresh,
-    refreshing,
+    onScroll: onScrollProp,
+    onStartReached,
+    onStartReachedThreshold = 0.5,
+    onViewableItemsChanged,
     progressViewOffset,
+    recycleItems = false,
     refreshControl,
-    initialContainerPoolRatio = 2,
+    refreshing,
+    refScrollView,
+    renderItem,
+    scrollEventThrottle,
+    snapToIndices,
+    stickyIndices,
+    style: styleProp,
+    suggestEstimatedItemSize,
     viewabilityConfig,
     viewabilityConfigCallbackPairs,
-    snapToIndices,
-    onViewableItemsChanged,
-    onStartReached,
-    onEndReached,
-    onLoad,
+    waitForInitialLayout = true,
     ...rest
   } = props;
   const [renderNum, setRenderNum] = useState(0);
-  const initialScroll = typeof initialScrollIndexProp === "number" ? { index: initialScrollIndexProp } : initialScrollIndexProp;
-  const initialScrollIndex = initialScroll == null ? void 0 : initialScroll.index;
+  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 contentContainerStyle = { ...StyleSheet.flatten(contentContainerStyleProp) };
   const style = { ...StyleSheet.flatten(styleProp) };
@@ -2174,9 +2639,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   if (!refState.current) {
     const initialScrollLength = (estimatedListSize != null ? estimatedListSize : IsNewArchitecture ? { height: 0, width: 0 } : Dimensions.get("window"))[horizontal ? "width" : "height"];
     refState.current = {
+      activeStickyIndex: void 0,
       averageSizes: {},
       columns: /* @__PURE__ */ new Map(),
       containerItemKeys: /* @__PURE__ */ new Set(),
+      containerItemTypes: /* @__PURE__ */ new Map(),
       enableScrollForNextCalculateItemsInView: true,
       endBuffered: -1,
       endNoBuffer: -1,
@@ -2195,11 +2662,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       loadStartTime: Date.now(),
       minIndexSizeChanged: 0,
       nativeMarginTop: 0,
-      pendingAdjust: 0,
       positions: /* @__PURE__ */ new Map(),
       props: {},
       queuedCalculateItemsInView: 0,
-      queuedItemSizeUpdates: [],
       refScroller: void 0,
       scroll: 0,
       scrollAdjustHandler: new ScrollAdjustHandler(ctx),
@@ -2209,12 +2674,15 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       scrollPending: 0,
       scrollPrev: 0,
       scrollPrevTime: 0,
+      scrollProcessingEnabled: true,
       scrollTime: 0,
       sizes: /* @__PURE__ */ new Map(),
       sizesKnown: /* @__PURE__ */ new Map(),
       startBuffered: -1,
       startNoBuffer: -1,
       startReachedBlockedByTimer: false,
+      stickyContainerPool: /* @__PURE__ */ new Set(),
+      stickyContainers: /* @__PURE__ */ new Map(),
       timeoutSizeMessage: 0,
       timeouts: /* @__PURE__ */ new Set(),
       totalSize: 0,
@@ -2226,14 +2694,19 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const state = refState.current;
   const isFirst = !state.props.renderItem;
   const didDataChange = state.props.data !== dataProp;
+  const throttleScrollFn = scrollEventThrottle && onScrollProp ? useThrottledOnScroll(onScrollProp, scrollEventThrottle) : onScrollProp;
   state.props = {
     alignItemsAtEnd,
     data: dataProp,
+    enableAverages,
     estimatedItemSize,
     getEstimatedItemSize,
+    getFixedItemSize,
+    getItemType,
     horizontal: !!horizontal,
     initialContainerPoolRatio,
     initialScroll,
+    itemsAreEqual,
     keyExtractor,
     maintainScrollAtEnd,
     maintainScrollAtEndThreshold,
@@ -2243,21 +2716,26 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     onEndReachedThreshold,
     onItemSizeChanged,
     onLoad,
-    onScroll: onScrollProp,
+    onScroll: throttleScrollFn,
     onStartReached,
     onStartReachedThreshold,
-    renderItem: renderItem2,
+    recycleItems: !!recycleItems,
+    renderItem,
     scrollBuffer,
     snapToIndices,
+    stickyIndicesArr: stickyIndices != null ? stickyIndices : [],
+    stickyIndicesSet: useMemo(() => new Set(stickyIndices != null ? stickyIndices : []), [stickyIndices == null ? void 0 : stickyIndices.join(",")]),
     stylePaddingBottom: stylePaddingBottomState,
     stylePaddingTop: stylePaddingTopState,
-    suggestEstimatedItemSize: !!suggestEstimatedItemSize,
-    viewabilityConfigCallbackPairs: void 0
+    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 });
@@ -2299,12 +2777,19 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     updateAllPositions(ctx, state);
   }
   const initialContentOffset = useMemo(() => {
-    const initialContentOffset2 = initialScrollOffset || calculateOffsetForIndex(ctx, state, initialScrollIndex);
-    refState.current.isStartReached = initialContentOffset2 < refState.current.scrollLength * onStartReachedThreshold;
-    if (initialContentOffset2 > 0) {
-      scrollTo(state, { animated: false, index: initialScrollIndex, offset: initialContentOffset2 });
+    if (initialScroll) {
+      const { index, viewOffset } = initialScroll;
+      let initialContentOffset2 = viewOffset || 0;
+      if (index !== void 0) {
+        initialContentOffset2 += calculateOffsetForIndex(ctx, state, index);
+      }
+      refState.current.isStartReached = initialContentOffset2 < refState.current.scrollLength * onStartReachedThreshold;
+      if (initialContentOffset2 > 0) {
+        scrollTo(state, { animated: false, index, offset: initialContentOffset2 });
+      }
+      return initialContentOffset2;
     }
-    return initialContentOffset2;
+    return 0;
   }, [renderNum]);
   if (isFirst || didDataChange || numColumnsProp !== peek$(ctx, "numColumns")) {
     refState.current.lastBatchingAction = Date.now();
@@ -2317,27 +2802,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       refState.current.positions.clear();
     }
   }
-  useLayoutEffect(() => {
-    if (IsNewArchitecture) {
-      let measured;
-      refScroller.current.measure((x, y, width, height) => {
-        measured = { height, width, x, y };
-      });
-      if (measured) {
-        const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
-        if (size) {
-          handleLayout(ctx, state, measured, setCanRender);
-        }
-      }
-    }
-    if (!isFirst) {
-      calculateItemsInView(ctx, state, { doMVCP: true });
-    }
-  }, [dataProp]);
   const onLayoutHeader = useCallback((rect, fromLayoutEffect) => {
     const size = rect[horizontal ? "width" : "height"];
     set$(ctx, "headerSize", size);
-    if (initialScroll) {
+    if ((initialScroll == null ? void 0 : initialScroll.index) !== void 0) {
       if (IsNewArchitecture && Platform.OS !== "android") {
         if (fromLayoutEffect) {
           setRenderNum((v) => v + 1);
@@ -2355,7 +2823,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }
   }, [snapToIndices]);
   useLayoutEffect(() => {
-    const didAllocateContainers = doInitialAllocateContainersCallback();
+    const didAllocateContainers = dataProp.length > 0 && doInitialAllocateContainersCallback();
     if (!didAllocateContainers) {
       checkResetContainers(
         /*isFirst*/
@@ -2366,6 +2834,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   useLayoutEffect(() => {
     set$(ctx, "extraData", extraData);
   }, [extraData]);
+  useLayoutEffect(() => {
+    if (IsNewArchitecture) {
+      let measured;
+      refScroller.current.measure((x, y, width, height) => {
+        measured = { height, width, x, y };
+      });
+      if (measured) {
+        const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
+        if (size) {
+          handleLayout(ctx, state, measured, setCanRender);
+        }
+      }
+    }
+  }, []);
   useLayoutEffect(initializeStateVars, [
     memoizedLastItemKeys.join(","),
     numColumnsProp,
@@ -2382,7 +2864,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       viewabilityConfigCallbackPairs
     });
     state.viewabilityConfigCallbackPairs = viewability;
-    state.props.viewabilityConfigCallbackPairs = viewability;
     state.enableScrollForNextCalculateItemsInView = !viewability;
   }, [viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged]);
   if (!IsNewArchitecture) {
@@ -2422,10 +2903,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         const state2 = refState.current;
         return state2 ? {
           contentLength: state2.totalSize,
+          data: state2.props.data,
           end: state2.endNoBuffer,
           endBuffered: state2.endBuffered,
           isAtEnd: state2.isAtEnd,
           isAtStart: state2.isAtStart,
+          positionAtIndex: (index) => state2.positions.get(getId(state2, index)),
           positions: state2.positions,
           scroll: state2.scroll,
           scrollLength: state2.scrollLength,
@@ -2452,7 +2935,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           const footerSize = peek$(ctx, "footerSize") || 0;
           scrollToIndex(ctx, state, {
             index,
-            viewOffset: -paddingBottom - footerSize,
+            viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
             viewPosition: 1,
             ...options
           });
@@ -2467,6 +2950,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         }
       },
       scrollToOffset: (params) => scrollTo(state, params),
+      setScrollProcessingEnabled: (enabled) => {
+        refState.current.scrollProcessingEnabled = enabled;
+      },
       setVisibleContentAnchorOffset: (value) => {
         const val = typeof value === "function" ? value(peek$(ctx, "scrollAdjustUserOffset") || 0) : value;
         set$(ctx, "scrollAdjustUserOffset", val);
@@ -2488,6 +2974,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }),
     []
   );
+  const onScrollHandler = useMemo(() => {
+    const onScrollFn = fns.onScroll;
+    if (stickyIndices == null ? void 0 : stickyIndices.length) {
+      const { animatedScrollY } = ctx;
+      return Animated.event([{ nativeEvent: { contentOffset: { [horizontal ? "x" : "y"]: animatedScrollY } } }], {
+        listener: onScrollFn,
+        useNativeDriver: true
+      });
+    }
+    return onScrollFn;
+  }, [stickyIndices == null ? void 0 : stickyIndices.length, horizontal, scrollEventThrottle]);
   return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
     ListComponent,
     {
@@ -2504,14 +3001,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       onLayout,
       onLayoutHeader,
       onMomentumScrollEnd: (event) => {
-        requestAnimationFrame(() => {
-          finishScrollTo(refState.current);
-        });
+        if (IsNewArchitecture) {
+          requestAnimationFrame(() => {
+            finishScrollTo(refState.current);
+          });
+        } else {
+          setTimeout(() => {
+            finishScrollTo(refState.current);
+          }, 1e3);
+        }
         if (onMomentumScrollEnd) {
           onMomentumScrollEnd(event);
         }
       },
-      onScroll: fns.onScroll,
+      onScroll: onScrollHandler,
       recycleItems,
       refreshControl: refreshControl ? stylePaddingTopState > 0 ? React3.cloneElement(refreshControl, {
         progressViewOffset: (refreshControl.props.progressViewOffset || 0) + stylePaddingTopState
@@ -2527,6 +3030,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       scrollAdjustHandler: (_a = refState.current) == null ? void 0 : _a.scrollAdjustHandler,
       scrollEventThrottle: Platform.OS === "web" ? 16 : void 0,
       snapToIndices,
+      stickyIndices,
       style,
       updateItemSize: fns.updateItemSize,
       waitForInitialLayout
@@ -2534,17 +3038,4 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React3.createElement(DebugView, { state: refState.current }));
 });
 
-// src/components/LazyLegendList.tsx
-var typedForwardRef2 = forwardRef;
-var renderItem = ({ item }) => item;
-var LazyLegendList = typedForwardRef2(function LazyLegendList2(props, forwardedRef) {
-  const { LegendList: LegendListProp, children, ...rest } = props;
-  const LegendListComponent = LegendListProp != null ? LegendListProp : LegendList;
-  const data = (isArray(children) ? children : React3.Children.toArray(children)).flat(1);
-  return (
-    // @ts-expect-error TODO: Fix this type
-    /* @__PURE__ */ React3.createElement(LegendListComponent, { ...rest, data, ref: forwardedRef, renderItem })
-  );
-});
-
-export { LazyLegendList, LegendList, useIsLastItem, useListScrollSize, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };
+export { LegendList, useIsLastItem, useListScrollSize, useRecyclingEffect, useRecyclingState, useSyncLayout, useViewability, useViewabilityAmount };