@legendapp/list 1.1.3 → 2.0.0-beta.0

package/index.js

@@ -1,9 +1,8 @@
 'use strict';
 
-var React2 = require('react');
+var React3 = require('react');
 var reactNative = require('react-native');
 var shim = require('use-sync-external-store/shim');
-var list = require('@legendapp/list');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -23,46 +22,38 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
+var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
 
-// src/LegendList.tsx
-var ContextState = React2__namespace.createContext(null);
+// src/components/LegendList.tsx
+var ContextState = React3__namespace.createContext(null);
 function StateProvider({ children }) {
-  const [value] = React2__namespace.useState(() => ({
+  const [value] = React3__namespace.useState(() => ({
+    animatedScrollY: new reactNative.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([
-      ["paddingTop", 0],
       ["alignItemsPaddingTop", 0],
       ["stylePaddingTop", 0],
-      ["headerSize", 0]
+      ["headerSize", 0],
+      ["numContainers", 0],
+      ["totalSize", 0]
     ]),
-    mapViewabilityCallbacks: /* @__PURE__ */ new Map(),
-    mapViewabilityValues: /* @__PURE__ */ new Map(),
-    mapViewabilityAmountCallbacks: /* @__PURE__ */ new Map(),
-    mapViewabilityAmountValues: /* @__PURE__ */ new Map(),
-    columnWrapperStyle: void 0,
     viewRefs: /* @__PURE__ */ new Map()
   }));
-  return /* @__PURE__ */ React2__namespace.createElement(ContextState.Provider, { value }, children);
+  return /* @__PURE__ */ React3__namespace.createElement(ContextState.Provider, { value }, children);
 }
 function useStateContext() {
-  return React2__namespace.useContext(ContextState);
+  return React3__namespace.useContext(ContextState);
 }
 function createSelectorFunctionsArr(ctx, signalNames) {
   let lastValues = [];
   let lastSignalValues = [];
   return {
-    subscribe: (cb) => {
-      const listeners = [];
-      for (const signalName of signalNames) {
-        listeners.push(listen$(ctx, signalName, cb));
-      }
-      return () => {
-        for (const listener of listeners) {
-          listener();
-        }
-      };
-    },
     get: () => {
       const currentValues = [];
       let hasChanged = false;
@@ -78,6 +69,17 @@ function createSelectorFunctionsArr(ctx, signalNames) {
         lastValues = currentValues;
       }
       return lastValues;
+    },
+    subscribe: (cb) => {
+      const listeners = [];
+      for (const signalName of signalNames) {
+        listeners.push(listen$(ctx, signalName, cb));
+      }
+      return () => {
+        for (const listener of listeners) {
+          listener();
+        }
+      };
     }
   };
 }
@@ -112,39 +114,30 @@ function getContentSize(ctx) {
   const stylePaddingTop = values.get("stylePaddingTop") || 0;
   const headerSize = values.get("headerSize") || 0;
   const footerSize = values.get("footerSize") || 0;
-  const totalSize = values.get("totalSize") || 0;
+  const totalSize = values.get("totalSize");
   return headerSize + footerSize + totalSize + stylePaddingTop;
 }
 function useArr$(signalNames) {
-  const ctx = React2__namespace.useContext(ContextState);
-  const { subscribe, get } = React2__namespace.useMemo(() => createSelectorFunctionsArr(ctx, signalNames), [ctx, signalNames]);
+  const ctx = React3__namespace.useContext(ContextState);
+  const { subscribe, get } = React3__namespace.useMemo(() => createSelectorFunctionsArr(ctx, signalNames), [ctx, signalNames]);
   const value = shim.useSyncExternalStore(subscribe, get);
   return value;
 }
 function useSelector$(signalName, selector) {
-  const ctx = React2__namespace.useContext(ContextState);
-  const { subscribe, get } = React2__namespace.useMemo(() => createSelectorFunctionsArr(ctx, [signalName]), [ctx, signalName]);
+  const ctx = React3__namespace.useContext(ContextState);
+  const { subscribe, get } = React3__namespace.useMemo(() => createSelectorFunctionsArr(ctx, [signalName]), [ctx, signalName]);
   const value = shim.useSyncExternalStore(subscribe, () => selector(get()[0]));
   return value;
 }
 
-// src/DebugView.tsx
+// src/components/DebugView.tsx
 var DebugRow = ({ children }) => {
-  return /* @__PURE__ */ React2__namespace.createElement(reactNative.View, { style: { flexDirection: "row", alignItems: "center", justifyContent: "space-between" } }, children);
+  return /* @__PURE__ */ React3__namespace.createElement(reactNative.View, { style: { alignItems: "center", flexDirection: "row", justifyContent: "space-between" } }, children);
 };
-var DebugView = React2__namespace.memo(function DebugView2({ state }) {
+var DebugView = React3__namespace.memo(function DebugView2({ state }) {
   const ctx = useStateContext();
-  const [
-    totalSize = 0,
-    totalSizeWithScrollAdjust = 0,
-    scrollAdjust = 0,
-    rawScroll = 0,
-    scroll = 0,
-    numContainers = 0,
-    numContainersPooled = 0
-  ] = useArr$([
+  const [totalSize = 0, scrollAdjust = 0, rawScroll = 0, scroll = 0, _numContainers = 0, _numContainersPooled = 0] = useArr$([
     "totalSize",
-    "totalSizeWithScrollAdjust",
     "scrollAdjust",
     "debugRawScroll",
     "debugComputedScroll",
@@ -152,45 +145,179 @@ var DebugView = React2__namespace.memo(function DebugView2({ state }) {
     "numContainersPooled"
   ]);
   const contentSize = getContentSize(ctx);
-  const [, forceUpdate] = React2.useReducer((x) => x + 1, 0);
+  const [, forceUpdate] = React3.useReducer((x) => x + 1, 0);
   useInterval(() => {
     forceUpdate();
   }, 100);
-  return /* @__PURE__ */ React2__namespace.createElement(
+  return /* @__PURE__ */ React3__namespace.createElement(
     reactNative.View,
     {
+      pointerEvents: "none",
       style: {
-        position: "absolute",
-        top: 0,
-        right: 0,
-        paddingLeft: 4,
-        paddingBottom: 4,
         // height: 100,
         backgroundColor: "#FFFFFFCC",
+        borderRadius: 4,
         padding: 4,
-        borderRadius: 4
-      },
-      pointerEvents: "none"
+        paddingBottom: 4,
+        paddingLeft: 4,
+        position: "absolute",
+        right: 0,
+        top: 0
+      }
     },
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "TotalSize:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, totalSize.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "ContentSize:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, contentSize.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "At end:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, String(state.isAtEnd))),
-    /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "ScrollAdjust:"), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, scrollAdjust.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "TotalSizeReal: "), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, totalSizeWithScrollAdjust.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "RawScroll: "), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, rawScroll.toFixed(2))),
-    /* @__PURE__ */ React2__namespace.createElement(DebugRow, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, "ComputedScroll: "), /* @__PURE__ */ React2__namespace.createElement(reactNative.Text, null, scroll.toFixed(2)))
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "TotalSize:"), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, totalSize.toFixed(2))),
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "ContentSize:"), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, contentSize.toFixed(2))),
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "At end:"), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, String(state.isAtEnd))),
+    /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null),
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "ScrollAdjust:"), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, scrollAdjust.toFixed(2))),
+    /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null),
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "RawScroll: "), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, rawScroll.toFixed(2))),
+    /* @__PURE__ */ React3__namespace.createElement(DebugRow, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, "ComputedScroll: "), /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, null, scroll.toFixed(2)))
   );
 });
 function useInterval(callback, delay) {
-  React2.useEffect(() => {
+  React3.useEffect(() => {
     const interval = setInterval(callback, delay);
     return () => clearInterval(interval);
   }, [delay]);
 }
+var LeanViewComponent = React3__namespace.forwardRef((props, ref) => {
+  return React3__namespace.createElement("RCTView", { ...props, ref });
+});
+LeanViewComponent.displayName = "RCTView";
+var LeanView = reactNative.Platform.OS === "android" || reactNative.Platform.OS === "ios" ? LeanViewComponent : reactNative.View;
+
+// 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 React3.useRef(new reactNative.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);
+  React3.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 = React3.forwardRef;
+var typedMemo = React3.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__namespace.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__namespace.createElement(
+    reactNative.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] = useArr$([`containerPosition${id}`]);
+  const transform = React3__namespace.useMemo(() => {
+    if (animatedScrollY && stickyOffset) {
+      const stickyPosition = animatedScrollY.interpolate({
+        extrapolate: "clamp",
+        inputRange: [position, position + 5e3],
+        outputRange: [position, position + 5e3]
+      });
+      return horizontal ? [{ translateX: stickyPosition }] : [{ translateY: stickyPosition }];
+    }
+  }, [position, horizontal, animatedScrollY, stickyOffset]);
+  const viewStyle = React3__namespace.useMemo(() => [style, { zIndex: index + 1e3 }, { transform }], [style, transform]);
+  return /* @__PURE__ */ React3__namespace.createElement(reactNative.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__namespace.createElement(ItemSeparatorComponent, { leadingItem });
+}
+var symbolFirst = Symbol();
+function useInit(cb) {
+  const refValue = React3.useRef(symbolFirst);
+  if (refValue.current === symbolFirst) {
+    refValue.current = cb();
+  }
+  return refValue.current;
+}
 
-// src/helpers.ts
+// src/utils/helpers.ts
 function isFunction(obj) {
   return typeof obj === "function";
 }
@@ -204,12 +331,12 @@ function warnDevOnce(id, text) {
     console.warn(`[legend-list] ${text}`);
   }
 }
+function roundSize(size) {
+  return Math.floor(size * 8) / 8;
+}
 function isNullOrUndefined(value) {
   return value === null || value === void 0;
 }
-function comparatorByDistance(a, b) {
-  return b.distance - a.distance;
-}
 function comparatorDefault(a, b) {
   return a - b;
 }
@@ -220,20 +347,12 @@ function getPadding(s, type) {
 function extractPadding(style, contentContainerStyle, type) {
   return getPadding(style, type) + getPadding(contentContainerStyle, type);
 }
-var symbolFirst = Symbol();
-function useInit(cb) {
-  const refValue = React2.useRef(symbolFirst);
-  if (refValue.current === symbolFirst) {
-    refValue.current = cb();
-  }
-  return refValue.current;
-}
 
-// src/ContextContainer.ts
-var ContextContainer = React2.createContext(null);
+// src/state/ContextContainer.ts
+var ContextContainer = React3.createContext(null);
 function useViewability(callback, configId) {
   const ctx = useStateContext();
-  const { containerId } = React2.useContext(ContextContainer);
+  const { containerId } = React3.useContext(ContextContainer);
   const key = containerId + (configId != null ? configId : "");
   useInit(() => {
     const value = ctx.mapViewabilityValues.get(key);
@@ -242,7 +361,7 @@ function useViewability(callback, configId) {
     }
   });
   ctx.mapViewabilityCallbacks.set(key, callback);
-  React2.useEffect(
+  React3.useEffect(
     () => () => {
       ctx.mapViewabilityCallbacks.delete(key);
     },
@@ -251,7 +370,7 @@ function useViewability(callback, configId) {
 }
 function useViewabilityAmount(callback) {
   const ctx = useStateContext();
-  const { containerId } = React2.useContext(ContextContainer);
+  const { containerId } = React3.useContext(ContextContainer);
   useInit(() => {
     const value = ctx.mapViewabilityAmountValues.get(containerId);
     if (value) {
@@ -259,7 +378,7 @@ function useViewabilityAmount(callback) {
     }
   });
   ctx.mapViewabilityAmountCallbacks.set(containerId, callback);
-  React2.useEffect(
+  React3.useEffect(
     () => () => {
       ctx.mapViewabilityAmountCallbacks.delete(containerId);
     },
@@ -267,13 +386,13 @@ function useViewabilityAmount(callback) {
   );
 }
 function useRecyclingEffect(effect) {
-  const { index, value } = React2.useContext(ContextContainer);
-  const prevValues = React2.useRef({
+  const { index, value } = React3.useContext(ContextContainer);
+  const prevValues = React3.useRef({
     prevIndex: void 0,
     prevItem: void 0
   });
-  React2.useEffect(() => {
-    let ret = void 0;
+  React3.useEffect(() => {
+    let ret;
     if (prevValues.current.prevIndex !== void 0 && prevValues.current.prevItem !== void 0) {
       ret = effect({
         index,
@@ -287,36 +406,37 @@ function useRecyclingEffect(effect) {
       prevItem: value
     };
     return ret;
-  }, [index, value]);
+  }, [index, value, effect]);
 }
 function useRecyclingState(valueOrFun) {
-  const { index, value, itemKey, triggerLayout } = React2.useContext(ContextContainer);
-  const refState = React2.useRef({
+  const { index, value, itemKey, triggerLayout } = React3.useContext(ContextContainer);
+  const refState = React3.useRef({
     itemKey: null,
     value: null
   });
-  const [_, setRenderNum] = React2.useState(0);
-  if (refState.current.itemKey !== itemKey) {
-    refState.current.itemKey = itemKey;
-    refState.current.value = isFunction(valueOrFun) ? valueOrFun({
+  const [_, setRenderNum] = React3.useState(0);
+  const state = refState.current;
+  if (state.itemKey !== itemKey) {
+    state.itemKey = itemKey;
+    state.value = isFunction(valueOrFun) ? valueOrFun({
       index,
       item: value,
       prevIndex: void 0,
       prevItem: void 0
     }) : valueOrFun;
   }
-  const setState = React2.useCallback(
+  const setState = React3.useCallback(
     (newState) => {
-      refState.current.value = isFunction(newState) ? newState(refState.current.value) : newState;
+      state.value = isFunction(newState) ? newState(state.value) : newState;
       setRenderNum((v) => v + 1);
       triggerLayout();
     },
-    [triggerLayout]
+    [triggerLayout, state]
   );
-  return [refState.current.value, setState];
+  return [state.value, setState];
 }
 function useIsLastItem() {
-  const { itemKey } = React2.useContext(ContextContainer);
+  const { itemKey } = React3.useContext(ContextContainer);
   const isLast = useSelector$("lastItemKeys", (lastItemKeys) => (lastItemKeys == null ? void 0 : lastItemKeys.includes(itemKey)) || false);
   return isLast;
 }
@@ -324,135 +444,131 @@ function useListScrollSize() {
   const [scrollSize] = useArr$(["scrollSize"]);
   return scrollSize;
 }
-var LeanViewComponent = React2__namespace.forwardRef((props, ref) => {
-  return React2__namespace.createElement("RCTView", { ...props, ref });
-});
-LeanViewComponent.displayName = "RCTView";
-var LeanView = reactNative.Platform.OS === "android" || reactNative.Platform.OS === "ios" ? LeanViewComponent : reactNative.View;
-
-// src/constants.ts
-var POSITION_OUT_OF_VIEW = -1e7;
-var ANCHORED_POSITION_OUT_OF_VIEW = {
-  type: "top",
-  relativeCoordinate: POSITION_OUT_OF_VIEW,
-  top: POSITION_OUT_OF_VIEW
+var noop = () => {
 };
-var ENABLE_DEVMODE = __DEV__ && false;
-var ENABLE_DEBUG_VIEW = __DEV__ && false;
-var IsNewArchitecture = global.nativeFabricUIManager != null;
+function useSyncLayout() {
+  if (IsNewArchitecture) {
+    const { triggerLayout: syncLayout } = React3.useContext(ContextContainer);
+    return syncLayout;
+  } else {
+    return noop;
+  }
+}
 
-// src/Container.tsx
-var Container = ({
+// src/components/Container.tsx
+var Container = typedMemo(function Container2({
   id,
   recycleItems,
   horizontal,
-  getRenderedItem,
-  updateItemSize,
+  getRenderedItem: getRenderedItem2,
+  updateItemSize: updateItemSize2,
   ItemSeparatorComponent
-}) => {
+}) {
   const ctx = useStateContext();
-  const columnWrapperStyle = ctx.columnWrapperStyle;
-  const [
-    maintainVisibleContentPosition,
-    position = ANCHORED_POSITION_OUT_OF_VIEW,
-    column = 0,
-    numColumns,
-    lastItemKeys,
-    itemKey,
-    data,
-    extraData
-  ] = useArr$([
-    "maintainVisibleContentPosition",
-    `containerPosition${id}`,
+  const { columnWrapperStyle, animatedScrollY } = ctx;
+  const [column = 0, data, itemKey, numColumns, extraData, isSticky, stickyOffset] = useArr$([
     `containerColumn${id}`,
-    "numColumns",
-    "lastItemKeys",
-    `containerItemKey${id}`,
     `containerItemData${id}`,
-    "extraData"
+    `containerItemKey${id}`,
+    "numColumns",
+    "extraData",
+    `containerSticky${id}`,
+    `containerStickyOffset${id}`
   ]);
-  const refLastSize = React2.useRef();
-  const ref = React2.useRef(null);
-  const [layoutRenderCount, forceLayoutRender] = React2.useState(0);
+  const refLastSize = React3.useRef();
+  const ref = React3.useRef(null);
+  const [layoutRenderCount, forceLayoutRender] = React3.useState(0);
   const otherAxisPos = numColumns > 1 ? `${(column - 1) / numColumns * 100}%` : 0;
   const otherAxisSize = numColumns > 1 ? `${1 / numColumns * 100}%` : void 0;
-  const isALastItem = lastItemKeys.includes(itemKey);
-  let paddingStyles;
-  if (columnWrapperStyle) {
-    const { columnGap, rowGap, gap } = columnWrapperStyle;
-    if (horizontal) {
-      paddingStyles = {
-        paddingRight: !isALastItem ? columnGap || gap || void 0 : void 0,
-        paddingVertical: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
-      };
-    } else {
-      paddingStyles = {
-        paddingBottom: !isALastItem ? rowGap || gap || void 0 : void 0,
-        paddingHorizontal: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
-      };
+  let didLayout = false;
+  const style = React3.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,
-    position: "absolute",
-    top: otherAxisPos,
-    height: otherAxisSize,
-    left: position.relativeCoordinate,
-    ...paddingStyles || {}
-  } : {
-    position: "absolute",
-    left: otherAxisPos,
-    right: numColumns > 1 ? null : 0,
-    width: otherAxisSize,
-    top: position.relativeCoordinate,
-    ...paddingStyles || {}
-  };
-  const renderedItemInfo = React2.useMemo(
-    () => itemKey !== void 0 ? getRenderedItem(itemKey) : null,
+    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 = React3.useMemo(
+    () => itemKey !== void 0 ? getRenderedItem2(itemKey) : null,
     [itemKey, data, extraData]
   );
   const { index, renderedItem } = renderedItemInfo || {};
-  const triggerLayout = React2.useCallback(() => {
-    forceLayoutRender((v) => v + 1);
-  }, []);
+  const contextValue = React3.useMemo(() => {
+    ctx.viewRefs.set(id, ref);
+    return {
+      containerId: id,
+      index,
+      itemKey,
+      triggerLayout: () => {
+        forceLayoutRender((v) => v + 1);
+      },
+      value: data
+    };
+  }, [id, itemKey, index, data]);
   const onLayout = (event) => {
     var _a, _b;
     if (!isNullOrUndefined(itemKey)) {
+      didLayout = true;
       let layout = event.nativeEvent.layout;
       const size = layout[horizontal ? "width" : "height"];
       const doUpdate = () => {
-        refLastSize.current = { width: layout.width, height: layout.height };
-        updateItemSize(itemKey, layout);
+        refLastSize.current = { height: layout.height, width: layout.width };
+        updateItemSize2(itemKey, layout);
       };
       if (IsNewArchitecture || size > 0) {
         doUpdate();
       } else {
-        (_b = (_a = ref.current) == null ? void 0 : _a.measure) == null ? void 0 : _b.call(_a, (x, y, width, height) => {
-          layout = { width, height };
+        (_b = (_a = ref.current) == null ? void 0 : _a.measure) == null ? void 0 : _b.call(_a, (_x, _y, width, height) => {
+          layout = { height, width };
           doUpdate();
         });
       }
     }
   };
   if (IsNewArchitecture) {
-    React2.useLayoutEffect(() => {
+    React3.useLayoutEffect(() => {
       var _a, _b;
       if (!isNullOrUndefined(itemKey)) {
         const measured = (_b = (_a = ref.current) == null ? void 0 : _a.unstable_getBoundingClientRect) == null ? void 0 : _b.call(_a);
         if (measured) {
           const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
           if (size) {
-            updateItemSize(itemKey, measured);
+            updateItemSize2(itemKey, measured);
           }
         }
       }
-    }, [itemKey, layoutRenderCount, isALastItem]);
+    }, [itemKey, layoutRenderCount]);
   } else {
-    React2.useEffect(() => {
+    React3.useEffect(() => {
       if (!isNullOrUndefined(itemKey)) {
         const timeout = setTimeout(() => {
-          if (refLastSize.current) {
-            updateItemSize(itemKey, refLastSize.current);
+          if (!didLayout && refLastSize.current) {
+            updateItemSize2(itemKey, refLastSize.current);
           }
         }, 16);
         return () => {
@@ -461,200 +577,204 @@ var Container = ({
       }
     }, [itemKey]);
   }
-  const contextValue = React2.useMemo(() => {
-    ctx.viewRefs.set(id, ref);
-    return { containerId: id, itemKey, index, value: data, triggerLayout };
-  }, [id, itemKey, index, data]);
-  const contentFragment = /* @__PURE__ */ React2__namespace.default.createElement(React2__namespace.default.Fragment, { key: recycleItems ? void 0 : itemKey }, /* @__PURE__ */ React2__namespace.default.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && !isALastItem && /* @__PURE__ */ React2__namespace.default.createElement(ItemSeparatorComponent, { leadingItem: renderedItemInfo.item })));
-  if (maintainVisibleContentPosition) {
-    const anchorStyle = horizontal ? position.type === "top" ? { position: "absolute", left: 0, top: 0, bottom: 0, flexDirection: "row", alignItems: "stretch" } : { position: "absolute", right: 0, top: 0, bottom: 0, flexDirection: "row", alignItems: "stretch" } : position.type === "top" ? { position: "absolute", top: 0, left: 0, right: 0 } : { position: "absolute", bottom: 0, left: 0, right: 0 };
-    if (__DEV__ && ENABLE_DEVMODE) {
-      anchorStyle.borderColor = position.type === "top" ? "red" : "blue";
-      anchorStyle.borderWidth = 1;
-    }
-    return /* @__PURE__ */ React2__namespace.default.createElement(LeanView, { style }, /* @__PURE__ */ React2__namespace.default.createElement(LeanView, { style: [anchorStyle, paddingStyles], onLayout, ref }, contentFragment, __DEV__ && ENABLE_DEVMODE && /* @__PURE__ */ React2__namespace.default.createElement(reactNative.Text, { style: { position: "absolute", top: 0, left: 0, zIndex: 1e3 } }, position.top)));
-  }
-  return /* @__PURE__ */ React2__namespace.default.createElement(LeanView, { style, onLayout, ref }, contentFragment);
-};
-var typedForwardRef = React2.forwardRef;
-var typedMemo = React2.memo;
-var useAnimatedValue = (initialValue) => {
-  return React2.useRef(new reactNative.Animated.Value(initialValue)).current;
-};
-
-// src/useValue$.ts
-function useValue$(key, getValue, useMicrotask) {
-  var _a;
-  const ctx = useStateContext();
-  const animValue = useAnimatedValue((_a = getValue ? getValue(peek$(ctx, key)) : peek$(ctx, key)) != null ? _a : 0);
-  React2.useMemo(() => {
-    let newValue = void 0;
-    listen$(ctx, key, (v) => {
-      if (useMicrotask && newValue === void 0) {
-        queueMicrotask(() => {
-          animValue.setValue(newValue);
-          newValue = void 0;
-        });
-      }
-      newValue = getValue ? getValue(v) : v;
-      if (!useMicrotask) {
-        animValue.setValue(newValue);
+  const PositionComponent = isSticky ? PositionViewSticky : PositionView3;
+  return /* @__PURE__ */ React3__namespace.createElement(
+    PositionComponent,
+    {
+      animatedScrollY: isSticky ? animatedScrollY : void 0,
+      horizontal,
+      id,
+      index,
+      key: recycleItems ? void 0 : itemKey,
+      onLayout,
+      refView: ref,
+      stickyOffset: isSticky ? stickyOffset : void 0,
+      style
+    },
+    /* @__PURE__ */ React3__namespace.createElement(ContextContainer.Provider, { value: contextValue }, renderedItem, renderedItemInfo && ItemSeparatorComponent && /* @__PURE__ */ React3__namespace.createElement(
+      Separator,
+      {
+        ItemSeparatorComponent,
+        itemKey,
+        leadingItem: renderedItemInfo.item
       }
-    });
-  }, []);
-  return animValue;
-}
+    ))
+  );
+});
 
-// src/Containers.tsx
+// src/components/Containers.tsx
 var Containers = typedMemo(function Containers2({
   horizontal,
   recycleItems,
   ItemSeparatorComponent,
   waitForInitialLayout,
-  updateItemSize,
-  getRenderedItem
+  updateItemSize: updateItemSize2,
+  getRenderedItem: getRenderedItem2
 }) {
   const ctx = useStateContext();
   const columnWrapperStyle = ctx.columnWrapperStyle;
   const [numContainers, numColumns] = useArr$(["numContainersPooled", "numColumns"]);
-  const animSize = useValue$(
-    "totalSizeWithScrollAdjust",
-    void 0,
-    /*useMicrotask*/
-    true
-  );
-  const animOpacity = waitForInitialLayout ? useValue$("containersDidLayout", (value) => value ? 1 : 0) : void 0;
-  const otherAxisSize = useValue$(
-    "otherAxisSize",
-    void 0,
-    /*useMicrotask*/
-    true
-  );
+  const animSize = useValue$("totalSize", {
+    // Use a microtask if increasing the size significantly, otherwise use a timeout
+    delay: (value, prevValue) => !prevValue || value - prevValue > 20 ? 0 : 200
+  });
+  const animOpacity = waitForInitialLayout && !IsNewArchitecture ? useValue$("containersDidLayout", { getValue: (value) => value ? 1 : 0 }) : void 0;
+  const otherAxisSize = useValue$("otherAxisSize", { delay: 0 });
   const containers = [];
   for (let i = 0; i < numContainers; i++) {
     containers.push(
-      /* @__PURE__ */ React2__namespace.createElement(
+      /* @__PURE__ */ React3__namespace.createElement(
         Container,
         {
+          getRenderedItem: getRenderedItem2,
+          horizontal,
+          ItemSeparatorComponent,
           id: i,
           key: i,
           recycleItems,
-          horizontal,
-          getRenderedItem,
-          updateItemSize,
-          ItemSeparatorComponent
+          updateItemSize: updateItemSize2
         }
       )
     );
   }
-  const style = horizontal ? { width: animSize, opacity: animOpacity, minHeight: otherAxisSize } : { height: animSize, opacity: animOpacity, minWidth: otherAxisSize };
+  const style = horizontal ? { minHeight: otherAxisSize, opacity: animOpacity, width: animSize } : { height: animSize, minWidth: otherAxisSize, opacity: animOpacity };
   if (columnWrapperStyle && numColumns > 1) {
     const { columnGap, rowGap, gap } = columnWrapperStyle;
+    const gapX = columnGap || gap || 0;
+    const gapY = rowGap || gap || 0;
     if (horizontal) {
-      const my = (rowGap || gap || 0) / 2;
-      if (my) {
-        style.marginVertical = -my;
+      if (gapY) {
+        style.marginVertical = -gapY / 2;
+      }
+      if (gapX) {
+        style.marginRight = -gapX;
       }
     } else {
-      const mx = (columnGap || gap || 0) / 2;
-      if (mx) {
-        style.marginHorizontal = -mx;
+      if (gapX) {
+        style.marginHorizontal = -gapX;
+      }
+      if (gapY) {
+        style.marginBottom = -gapY;
       }
     }
   }
-  return /* @__PURE__ */ React2__namespace.createElement(reactNative.Animated.View, { style }, containers);
+  return /* @__PURE__ */ React3__namespace.createElement(reactNative.Animated.View, { style }, containers);
 });
-function ListHeaderComponentContainer({
-  children,
-  style,
-  ctx,
-  horizontal,
-  waitForInitialLayout
-}) {
-  var _a;
-  const hasData = ((_a = peek$(ctx, "lastItemKeys")) == null ? void 0 : _a.length) > 0;
-  const scrollAdjust = useValue$("scrollAdjust", (v) => v != null ? v : 0, true);
-  const animOpacity = waitForInitialLayout ? useValue$("containersDidLayout", (value) => value ? 1 : 0) : void 0;
-  const additionalSize = {
-    transform: [{ translateY: reactNative.Animated.multiply(scrollAdjust, -1) }],
-    // Header should show if there's no data yet, but containersDidLayout will be false until it has some data
-    opacity: hasData ? animOpacity : 1
+function ScrollAdjust() {
+  const bias = 1e7;
+  const [scrollAdjust, scrollAdjustUserOffset] = useArr$(["scrollAdjust", "scrollAdjustUserOffset"]);
+  const scrollOffset = (scrollAdjust || 0) + (scrollAdjustUserOffset || 0) + bias;
+  return /* @__PURE__ */ React3__namespace.createElement(
+    reactNative.View,
+    {
+      style: {
+        height: 0,
+        left: 0,
+        position: "absolute",
+        top: scrollOffset,
+        width: 0
+      }
+    }
+  );
+}
+
+// src/components/SnapWrapper.tsx
+function SnapWrapper({ ScrollComponent, ...props }) {
+  const [snapToOffsets] = useArr$(["snapToOffsets"]);
+  return /* @__PURE__ */ React.createElement(ScrollComponent, { ...props, snapToOffsets });
+}
+function useThrottleDebounce(mode) {
+  const timeoutRef = React3.useRef(null);
+  const lastCallTimeRef = React3.useRef(0);
+  const lastArgsRef = React3.useRef(null);
+  const clearTimeoutRef = () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
   };
-  return /* @__PURE__ */ React2__namespace.createElement(
-    reactNative.Animated.View,
+  const execute = React3.useCallback((callback, delay, ...args) => {
     {
-      style: [style, additionalSize],
-      onLayout: (event) => {
-        const size = event.nativeEvent.layout[horizontal ? "width" : "height"];
-        set$(ctx, "headerSize", size);
+      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 = React3.useRef(null);
+  const onLayout = React3.useCallback(
+    (event) => {
+      onChange(event.nativeEvent.layout, false);
     },
-    children
+    [onChange]
   );
+  if (IsNewArchitecture) {
+    React3.useLayoutEffect(() => {
+      if (ref.current) {
+        ref.current.measure((x, y, width, height) => {
+          onChange({ height, width, x, y }, true);
+        });
+      }
+    }, []);
+  }
+  return { onLayout, ref };
 }
 
-// src/ListComponent.tsx
+// src/components/ListComponent.tsx
 var getComponent = (Component) => {
-  if (React2__namespace.isValidElement(Component)) {
+  if (React3__namespace.isValidElement(Component)) {
     return Component;
   }
   if (Component) {
-    return /* @__PURE__ */ React2__namespace.createElement(Component, null);
+    return /* @__PURE__ */ React3__namespace.createElement(Component, null);
   }
   return null;
 };
-var PaddingAndAdjust = () => {
-  const animPaddingTop = useValue$("paddingTop", (v) => v, true);
-  const animScrollAdjust = useValue$("scrollAdjust", (v) => v, true);
-  const additionalSize = { marginTop: animScrollAdjust, paddingTop: animPaddingTop };
-  return /* @__PURE__ */ React2__namespace.createElement(reactNative.Animated.View, { style: additionalSize });
+var Padding = () => {
+  const animPaddingTop = useValue$("alignItemsPaddingTop", { delay: 0 });
+  return /* @__PURE__ */ React3__namespace.createElement(reactNative.Animated.View, { style: { paddingTop: animPaddingTop } });
 };
-var PaddingAndAdjustDevMode = () => {
-  const animPaddingTop = useValue$("paddingTop", (v) => v, true);
-  const animScrollAdjust = useValue$("scrollAdjust", (v) => v, true);
-  return /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(reactNative.Animated.View, { style: { marginTop: animScrollAdjust } }), /* @__PURE__ */ React2__namespace.createElement(reactNative.Animated.View, { style: { paddingTop: animPaddingTop } }), /* @__PURE__ */ React2__namespace.createElement(
+var PaddingDevMode = () => {
+  const animPaddingTop = useValue$("alignItemsPaddingTop", { delay: 0 });
+  return /* @__PURE__ */ React3__namespace.createElement(React3__namespace.Fragment, null, /* @__PURE__ */ React3__namespace.createElement(reactNative.Animated.View, { style: { paddingTop: animPaddingTop } }), /* @__PURE__ */ React3__namespace.createElement(
     reactNative.Animated.View,
     {
       style: {
-        position: "absolute",
-        top: reactNative.Animated.add(animScrollAdjust, reactNative.Animated.multiply(animScrollAdjust, -1)),
+        backgroundColor: "green",
         height: animPaddingTop,
         left: 0,
-        right: 0,
-        backgroundColor: "green"
-      }
-    }
-  ), /* @__PURE__ */ React2__namespace.createElement(
-    reactNative.Animated.View,
-    {
-      style: {
-        position: "absolute",
-        top: animPaddingTop,
-        height: animScrollAdjust,
-        left: -16,
-        right: -16,
-        backgroundColor: "lightblue"
-      }
-    }
-  ), /* @__PURE__ */ React2__namespace.createElement(
-    reactNative.Animated.View,
-    {
-      style: {
         position: "absolute",
-        top: animPaddingTop,
-        height: reactNative.Animated.multiply(animScrollAdjust, -1),
-        width: 8,
-        right: 4,
-        borderStyle: "dashed",
-        borderColor: "blue",
-        borderWidth: 1,
-        backgroundColor: "lightblue"
-        //backgroundColor: "blue",
+        right: 0,
+        top: 0
       }
     }
   ));
 };
 var ListComponent = typedMemo(function ListComponent2({
+  canRender,
   style,
   contentContainerStyle,
   horizontal,
@@ -663,194 +783,616 @@ var ListComponent = typedMemo(function ListComponent2({
   ItemSeparatorComponent,
   alignItemsAtEnd,
   waitForInitialLayout,
-  handleScroll,
+  onScroll: onScroll2,
   onLayout,
   ListHeaderComponent,
   ListHeaderComponentStyle,
   ListFooterComponent,
   ListFooterComponentStyle,
   ListEmptyComponent,
-  getRenderedItem,
-  updateItemSize,
+  getRenderedItem: getRenderedItem2,
+  updateItemSize: updateItemSize2,
   refScrollView,
   maintainVisibleContentPosition,
   renderScrollComponent,
+  scrollAdjustHandler,
+  onLayoutHeader,
+  snapToIndices,
+  stickyIndices,
   ...rest
 }) {
   const ctx = useStateContext();
-  const ScrollComponent = renderScrollComponent ? React2.useMemo(
-    () => React2__namespace.forwardRef((props, ref) => renderScrollComponent({ ...props, ref })),
+  const { onLayout: onLayoutHeaderSync, ref: refHeader } = useSyncLayout2({
+    onChange: onLayoutHeader
+  });
+  const ScrollComponent = renderScrollComponent ? React3.useMemo(
+    () => React3__namespace.forwardRef((props, ref) => renderScrollComponent({ ...props, ref })),
     [renderScrollComponent]
-  ) : reactNative.ScrollView;
-  return /* @__PURE__ */ React2__namespace.createElement(
-    ScrollComponent,
+  ) : reactNative.Animated.ScrollView;
+  React3__namespace.useEffect(() => {
+    if (canRender) {
+      setTimeout(() => {
+        scrollAdjustHandler.setMounted();
+      }, 0);
+    }
+  }, [canRender]);
+  const SnapOrScroll = snapToIndices ? SnapWrapper : ScrollComponent;
+  return /* @__PURE__ */ React3__namespace.createElement(
+    SnapOrScroll,
     {
       ...rest,
-      style,
-      maintainVisibleContentPosition: maintainVisibleContentPosition && !ListEmptyComponent ? { minIndexForVisible: 0 } : void 0,
       contentContainerStyle: [
         contentContainerStyle,
         horizontal ? {
           height: "100%"
         } : {}
       ],
-      onScroll: handleScroll,
-      onLayout,
-      horizontal,
       contentOffset: initialContentOffset ? horizontal ? { x: initialContentOffset, y: 0 } : { x: 0, y: initialContentOffset } : void 0,
-      ref: refScrollView
+      horizontal,
+      maintainVisibleContentPosition: maintainVisibleContentPosition && !ListEmptyComponent ? { minIndexForVisible: 0 } : void 0,
+      onLayout,
+      onScroll: onScroll2,
+      ref: refScrollView,
+      ScrollComponent: snapToIndices ? ScrollComponent : void 0,
+      style
     },
-    ENABLE_DEVMODE ? /* @__PURE__ */ React2__namespace.createElement(PaddingAndAdjustDevMode, null) : /* @__PURE__ */ React2__namespace.createElement(PaddingAndAdjust, null),
-    ListHeaderComponent && /* @__PURE__ */ React2__namespace.createElement(
-      ListHeaderComponentContainer,
-      {
-        style: ListHeaderComponentStyle,
-        ctx,
-        horizontal,
-        waitForInitialLayout
-      },
-      getComponent(ListHeaderComponent)
-    ),
+    maintainVisibleContentPosition && /* @__PURE__ */ React3__namespace.createElement(ScrollAdjust, null),
+    ENABLE_DEVMODE ? /* @__PURE__ */ React3__namespace.createElement(PaddingDevMode, null) : /* @__PURE__ */ React3__namespace.createElement(Padding, null),
+    ListHeaderComponent && /* @__PURE__ */ React3__namespace.createElement(reactNative.View, { onLayout: onLayoutHeaderSync, ref: refHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
     ListEmptyComponent && getComponent(ListEmptyComponent),
-    /* @__PURE__ */ React2__namespace.createElement(
+    canRender && /* @__PURE__ */ React3__namespace.createElement(
       Containers,
       {
+        getRenderedItem: getRenderedItem2,
         horizontal,
-        recycleItems,
-        waitForInitialLayout,
-        getRenderedItem,
         ItemSeparatorComponent,
-        updateItemSize
+        recycleItems,
+        updateItemSize: updateItemSize2,
+        waitForInitialLayout
       }
     ),
-    ListFooterComponent && /* @__PURE__ */ React2__namespace.createElement(
+    ListFooterComponent && /* @__PURE__ */ React3__namespace.createElement(
       reactNative.View,
       {
-        style: ListFooterComponentStyle,
         onLayout: (event) => {
           const size = event.nativeEvent.layout[horizontal ? "width" : "height"];
           set$(ctx, "footerSize", size);
-        }
+        },
+        style: ListFooterComponentStyle
       },
       getComponent(ListFooterComponent)
-    )
+    ),
+    __DEV__ && ENABLE_DEVMODE && /* @__PURE__ */ React3__namespace.createElement(DevNumbers, null)
   );
 });
+var DevNumbers = __DEV__ && React3__namespace.memo(function DevNumbers2() {
+  return Array.from({ length: 100 }).map((_, index) => /* @__PURE__ */ React3__namespace.createElement(
+    reactNative.View,
+    {
+      key: index,
+      style: {
+        height: 100,
+        pointerEvents: "none",
+        position: "absolute",
+        top: index * 100,
+        width: "100%"
+      }
+    },
+    /* @__PURE__ */ React3__namespace.createElement(reactNative.Text, { style: { color: "red" } }, index * 100)
+  ));
+});
 
-// src/ScrollAdjustHandler.ts
-var ScrollAdjustHandler = class {
-  constructor(ctx) {
-    this.ctx = ctx;
-    this.appliedAdjust = 0;
-    this.busy = false;
-    this.isPaused = false;
-    this.isDisabled = false;
-    this.context = ctx;
-  }
-  doAjdust() {
-    set$(this.context, "scrollAdjust", this.appliedAdjust);
-    this.busy = false;
+// src/utils/getId.ts
+function getId(state, index) {
+  const { data, keyExtractor } = state.props;
+  if (!data) {
+    return "";
   }
-  requestAdjust(adjust, onAdjusted) {
-    if (this.isDisabled) {
-      return;
+  const ret = index < data.length ? keyExtractor ? keyExtractor(data[index], index) : index : null;
+  const id = ret;
+  state.idCache.set(index, id);
+  return id;
+}
+
+// src/core/calculateOffsetForIndex.ts
+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 oldAdjustTop = peek$(this.context, "scrollAdjust");
-    if (oldAdjustTop === adjust) {
-      return;
+  }
+  return position;
+}
+
+// src/utils/getItemSize.ts
+function getItemSize(state, key, index, data, useAverageSize, defaultAverageSize, preferRenderedCache) {
+  var _a, _b;
+  const {
+    sizesKnown,
+    sizes,
+    scrollingTo,
+    averageSizes,
+    props: { estimatedItemSize, getEstimatedItemSize, getFixedItemSize, getItemType }
+  } = state;
+  const sizeKnown = sizesKnown.get(key);
+  if (sizeKnown !== void 0) {
+    return sizeKnown;
+  }
+  let size;
+  const itemType = getItemType ? (_a = getItemType(data, index)) != null ? _a : "" : "";
+  if (getFixedItemSize) {
+    size = getFixedItemSize(index, data, itemType);
+    if (size !== void 0) {
+      sizesKnown.set(key, size);
     }
-    this.appliedAdjust = adjust;
-    if (!this.busy && !this.isPaused) {
-      this.busy = true;
-      this.doAjdust();
-      onAdjusted(oldAdjustTop - adjust);
+  }
+  const renderedSize = sizes.get(key);
+  if (size === void 0 && preferRenderedCache && renderedSize !== void 0) {
+    return renderedSize;
+  }
+  if (size === void 0 && useAverageSize && !scrollingTo) {
+    if (itemType === "") {
+      size = defaultAverageSize;
+    } else {
+      const averageSizeForType = (_b = averageSizes[itemType]) == null ? void 0 : _b.avg;
+      if (averageSizeForType !== void 0) {
+        size = roundSize(averageSizeForType);
+      }
     }
   }
-  getAppliedAdjust() {
-    return this.appliedAdjust;
+  if (size === void 0 && renderedSize !== void 0) {
+    return renderedSize;
   }
-  pauseAdjust() {
-    this.isPaused = true;
+  if (size === void 0) {
+    size = getEstimatedItemSize ? getEstimatedItemSize(index, data, itemType) : estimatedItemSize;
   }
-  setDisableAdjust(disable) {
-    this.isDisabled = disable;
+  sizes.set(key, size);
+  return size;
+}
+
+// src/core/calculateOffsetWithOffsetPosition.ts
+function calculateOffsetWithOffsetPosition(state, offsetParam, params) {
+  const { index, viewOffset, viewPosition } = params;
+  let offset = offsetParam;
+  if (viewOffset) {
+    offset -= viewOffset;
   }
-  // return true if it was paused
-  unPauseAdjust() {
-    if (this.isPaused) {
-      this.isPaused = false;
-      this.doAjdust();
-      return true;
-    }
-    return false;
+  if (viewPosition !== void 0 && index !== void 0) {
+    offset -= viewPosition * (state.scrollLength - getItemSize(state, getId(state, index), index, state.props.data[index]));
+  }
+  return offset;
+}
+
+// src/core/finishScrollTo.ts
+var finishScrollTo = (state) => {
+  if (state) {
+    state.scrollingTo = void 0;
+    state.scrollHistory.length = 0;
   }
 };
-var useCombinedRef = (...refs) => {
-  const callback = React2.useCallback((element) => {
-    for (const ref of refs) {
-      if (!ref) {
-        continue;
+
+// 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, dataChanged) {
+  if (Math.abs(positionDiff) > 0.1) {
+    const needsScrollWorkaround = reactNative.Platform.OS === "android" && !IsNewArchitecture && dataChanged && state.scroll <= positionDiff;
+    const doit = () => {
+      if (needsScrollWorkaround) {
+        scrollTo(state, {
+          noScrollingTo: true,
+          offset: state.scroll
+        });
+      } else {
+        state.scrollAdjustHandler.requestAdjust(positionDiff);
       }
-      if (isFunction(ref)) {
-        ref(element);
+    };
+    state.scroll += positionDiff;
+    state.scrollForNextCalculateItemsInView = void 0;
+    const didLayout = peek$(ctx, "containersDidLayout");
+    if (didLayout) {
+      doit();
+      const threshold = state.scroll - positionDiff / 2;
+      if (!state.ignoreScrollFromMVCP) {
+        state.ignoreScrollFromMVCP = {};
+      }
+      if (positionDiff > 0) {
+        state.ignoreScrollFromMVCP.lt = threshold;
       } else {
-        ref.current = element;
+        state.ignoreScrollFromMVCP.gt = threshold;
+      }
+      if (state.ignoreScrollFromMVCPTimeout) {
+        clearTimeout(state.ignoreScrollFromMVCPTimeout);
       }
+      state.ignoreScrollFromMVCPTimeout = setTimeout(
+        () => {
+          state.ignoreScrollFromMVCP = void 0;
+        },
+        needsScrollWorkaround ? 250 : 100
+      );
+    } else {
+      requestAnimationFrame(doit);
     }
-  }, refs);
-  return callback;
+  }
+}
+
+// src/core/mvcp.ts
+function prepareMVCP(ctx, state, dataChanged) {
+  const {
+    idsInView,
+    positions,
+    scrollingTo,
+    props: { maintainVisibleContentPosition }
+  } = state;
+  let prevPosition;
+  let targetId;
+  const idsInViewWithPositions = [];
+  const scrollTarget = scrollingTo == null ? void 0 : scrollingTo.index;
+  if (maintainVisibleContentPosition) {
+    const indexByKey = state.indexByKey;
+    if (scrollTarget !== void 0) {
+      targetId = getId(state, scrollTarget);
+    } 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) {
+      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) {
+        positionDiff = newPosition - prevPosition;
+      }
+    }
+    if (positionDiff !== void 0 && Math.abs(positionDiff) > 0.1) {
+      requestAdjust(ctx, state, positionDiff, dataChanged);
+    }
+  };
+}
+
+// src/utils/setPaddingTop.ts
+function setPaddingTop(ctx, state, { stylePaddingTop, alignItemsPaddingTop }) {
+  if (stylePaddingTop !== void 0) {
+    const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
+    if (stylePaddingTop < prevStylePaddingTop) {
+      let prevTotalSize = peek$(ctx, "totalSize") || 0;
+      set$(ctx, "totalSize", prevTotalSize + prevStylePaddingTop);
+      state.timeoutSetPaddingTop = setTimeout(() => {
+        prevTotalSize = peek$(ctx, "totalSize") || 0;
+        set$(ctx, "totalSize", prevTotalSize - prevStylePaddingTop);
+      }, 16);
+    }
+    set$(ctx, "stylePaddingTop", stylePaddingTop);
+  }
+  if (alignItemsPaddingTop !== void 0) {
+    set$(ctx, "alignItemsPaddingTop", alignItemsPaddingTop);
+  }
+}
+
+// src/utils/updateAlignItemsPaddingTop.ts
+function updateAlignItemsPaddingTop(ctx, state) {
+  const {
+    scrollLength,
+    props: { alignItemsAtEnd, data }
+  } = state;
+  if (alignItemsAtEnd) {
+    let alignItemsPaddingTop = 0;
+    if ((data == null ? void 0 : data.length) > 0) {
+      const contentSize = getContentSize(ctx);
+      alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
+    }
+    setPaddingTop(ctx, state, { alignItemsPaddingTop });
+  }
+}
+
+// src/core/updateTotalSize.ts
+function updateTotalSize(ctx, state) {
+  const {
+    positions,
+    props: { data }
+  } = state;
+  if (data.length === 0) {
+    addTotalSize(ctx, state, null, 0);
+  } else {
+    const lastId = getId(state, data.length - 1);
+    if (lastId !== void 0) {
+      const lastPosition = positions.get(lastId);
+      if (lastPosition !== void 0) {
+        const lastSize = getItemSize(state, lastId, data.length - 1, data[data.length - 1]);
+        if (lastSize !== void 0) {
+          const totalSize = lastPosition + lastSize;
+          addTotalSize(ctx, state, null, totalSize);
+        }
+      }
+    }
+  }
+}
+function addTotalSize(ctx, state, key, add) {
+  const { alignItemsAtEnd } = state.props;
+  {
+    state.totalSize = add;
+    if (state.timeoutSetPaddingTop) {
+      clearTimeout(state.timeoutSetPaddingTop);
+      state.timeoutSetPaddingTop = void 0;
+    }
+  }
+  set$(ctx, "totalSize", state.totalSize);
+  if (alignItemsAtEnd) {
+    updateAlignItemsPaddingTop(ctx, state);
+  }
+}
+
+// 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/viewability.ts
-var mapViewabilityConfigCallbackPairs = /* @__PURE__ */ new Map();
+// src/utils/updateSnapToOffsets.ts
+function updateSnapToOffsets(ctx, state) {
+  const {
+    positions,
+    props: { snapToIndices }
+  } = state;
+  const snapToOffsets = Array(snapToIndices.length);
+  for (let i = 0; i < snapToIndices.length; i++) {
+    const idx = snapToIndices[i];
+    const key = getId(state, idx);
+    snapToOffsets[i] = positions.get(key);
+  }
+  set$(ctx, "snapToOffsets", snapToOffsets);
+}
+
+// src/core/updateAllPositions.ts
+function updateAllPositions(ctx, state, dataChanged) {
+  var _a, _b, _c, _d, _e;
+  const {
+    averageSizes,
+    columns,
+    indexByKey,
+    positions,
+    firstFullyOnScreenIndex,
+    idCache,
+    sizesKnown,
+    props: { getEstimatedItemSize, snapToIndices }
+  } = state;
+  const data = state.props.data;
+  const numColumns = peek$(ctx, "numColumns");
+  const indexByKeyForChecking = __DEV__ ? /* @__PURE__ */ new Map() : void 0;
+  const scrollVelocity = getScrollVelocity(state);
+  const useAverageSize = !getEstimatedItemSize;
+  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],
+          useAverageSize,
+          averageSize,
+          /*preferRenderedCache*/
+          !!dataChanged
+        );
+        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;
+      }
+    }
+  }
+  let currentRowTop = 0;
+  let column = 1;
+  let maxSizeInRow = 0;
+  const hasColumns = numColumns > 1;
+  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],
+      useAverageSize,
+      averageSize,
+      /*preferRenderedCache*/
+      !!dataChanged
+    );
+    if (__DEV__ && needsIndexByKey) {
+      if (indexByKeyForChecking.has(id)) {
+        console.error(
+          `[legend-list] Error: Detected overlapping key (${id}) which causes missing items and gaps and other terrrible things. Check that keyExtractor returns unique values.`
+        );
+      }
+      indexByKeyForChecking.set(id, i);
+    }
+    positions.set(id, currentRowTop);
+    if (needsIndexByKey) {
+      indexByKey.set(id, i);
+    }
+    columns.set(id, column);
+    if (hasColumns) {
+      if (size > maxSizeInRow) {
+        maxSizeInRow = size;
+      }
+      column++;
+      if (column > numColumns) {
+        currentRowTop += maxSizeInRow;
+        column = 1;
+        maxSizeInRow = 0;
+      }
+    } else {
+      currentRowTop += size;
+    }
+  }
+  updateTotalSize(ctx, state);
+  if (snapToIndices) {
+    updateSnapToOffsets(ctx, state);
+  }
+}
+
+// src/core/viewability.ts
+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) {
     viewabilityConfigCallbackPairs = [
       ...viewabilityConfigCallbackPairs || [],
       {
+        onViewableItemsChanged,
         viewabilityConfig: viewabilityConfig || {
           viewAreaCoveragePercentThreshold: 0
-        },
-        onViewableItemsChanged
+        }
       }
     ];
   }
-  if (viewabilityConfigCallbackPairs) {
-    for (const pair of viewabilityConfigCallbackPairs) {
-      mapViewabilityConfigCallbackPairs.set(pair.viewabilityConfig.id, {
-        viewableItems: [],
-        start: -1,
-        end: -1,
-        previousStart: -1,
-        previousEnd: -1
-      });
-    }
-  }
   return viewabilityConfigCallbackPairs;
 }
-function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, getId, scrollSize, start, end) {
+function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollSize, start, end) {
+  const {
+    timeouts,
+    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) {
       const timer = setTimeout(() => {
-        state.timeouts.delete(timer);
-        updateViewableItemsWithConfig(state.data, viewabilityConfigCallbackPair, getId, state, ctx, scrollSize);
+        timeouts.delete(timer);
+        updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize);
       }, viewabilityConfigCallbackPair.viewabilityConfig.minimumViewTime);
-      state.timeouts.add(timer);
+      timeouts.add(timer);
     } else {
-      updateViewableItemsWithConfig(state.data, viewabilityConfigCallbackPair, getId, state, ctx, scrollSize);
+      updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize);
     }
   }
 }
-function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, getId, state, ctx, scrollSize) {
+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) {
@@ -891,15 +1433,15 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, getI
   for (let i = start; i <= end; i++) {
     const item = data[i];
     if (item) {
-      const key = getId(i);
+      const key = getId(state, i);
       const containerId = findContainerId(ctx, key);
       if (isViewable(state, ctx, viewabilityConfig, containerId, key, scrollSize, item, i)) {
         const viewToken = {
-          item,
-          key,
+          containerId,
           index: i,
           isViewable: true,
-          containerId
+          item,
+          key
         };
         viewableItems.push(viewToken);
         if (!(previousViewableItems == null ? void 0 : previousViewableItems.find((v) => v.key === viewToken.key))) {
@@ -909,9 +1451,9 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, getI
     }
   }
   Object.assign(viewabilityState, {
-    viewableItems,
+    previousEnd: end,
     previousStart: start,
-    previousEnd: end
+    viewableItems
   });
   if (changed.length > 0) {
     viewabilityState.viewableItems = viewableItems;
@@ -920,7 +1462,7 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, getI
       maybeUpdateViewabilityCallback(ctx, configId, change.containerId, change);
     }
     if (onViewableItemsChanged) {
-      onViewableItemsChanged({ viewableItems, changed });
+      onViewableItemsChanged({ changed, viewableItems });
     }
   }
   for (const [containerId, value] of ctx.mapViewabilityAmountValues) {
@@ -929,14 +1471,22 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, getI
     }
   }
 }
+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, scrollAdjustHandler } = state;
+  const { sizes, positions, scroll: scrollState } = state;
   const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
   const { itemVisiblePercentThreshold, viewAreaCoveragePercentThreshold } = viewabilityConfig;
   const viewAreaMode = viewAreaCoveragePercentThreshold != null;
   const viewablePercentThreshold = viewAreaMode ? viewAreaCoveragePercentThreshold : itemVisiblePercentThreshold;
-  const previousScrollAdjust = scrollAdjustHandler.getAppliedAdjust();
-  const scroll = scrollState - previousScrollAdjust - topPad;
+  const scroll = scrollState - topPad;
   const top = positions.get(key) - scroll;
   const size = sizes.get(key) || 0;
   const bottom = top + size;
@@ -947,18 +1497,19 @@ function computeViewability(state, ctx, viewabilityConfig, containerId, key, scr
   const percent = isEntirelyVisible ? 100 : viewAreaMode ? percentOfScroller : percentVisible;
   const isViewable2 = percent >= viewablePercentThreshold;
   const value = {
+    containerId,
     index,
     isViewable: isViewable2,
     item,
     key,
-    percentVisible,
     percentOfScroller,
-    sizeVisible,
-    size,
+    percentVisible,
     scrollSize,
-    containerId
+    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) {
@@ -988,507 +1539,357 @@ function maybeUpdateViewabilityCallback(ctx, configId, containerId, viewToken) {
   cb == null ? void 0 : cb(viewToken);
 }
 
-// src/LegendList.tsx
-var DEFAULT_DRAW_DISTANCE = 250;
-var DEFAULT_ITEM_SIZE = 100;
-function createColumnWrapperStyle(contentContainerStyle) {
-  const { gap, columnGap, rowGap } = contentContainerStyle;
-  if (gap || columnGap || rowGap) {
-    contentContainerStyle.gap = void 0;
-    contentContainerStyle.columnGap = void 0;
-    contentContainerStyle.rowGap = void 0;
-    return {
-      gap,
-      columnGap,
-      rowGap
-    };
+// src/utils/checkAllSizesKnown.ts
+function checkAllSizesKnown(state) {
+  const { startBuffered, endBuffered, sizesKnown } = state;
+  if (endBuffered !== null) {
+    let areAllKnown = true;
+    for (let i = startBuffered; areAllKnown && i <= endBuffered; i++) {
+      const key = getId(state, i);
+      areAllKnown && (areAllKnown = sizesKnown.has(key));
+    }
+    return areAllKnown;
   }
+  return false;
 }
-var LegendList = typedForwardRef(function LegendList2(props, forwardedRef) {
-  return /* @__PURE__ */ React2__namespace.createElement(StateProvider, null, /* @__PURE__ */ React2__namespace.createElement(LegendListInner, { ...props, ref: forwardedRef }));
-});
-var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
-  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,
-    estimatedItemSize: estimatedItemSizeProp,
-    getEstimatedItemSize,
-    suggestEstimatedItemSize,
-    ListHeaderComponent,
-    ListEmptyComponent,
-    onItemSizeChanged,
-    refScrollView,
-    waitForInitialLayout = true,
-    extraData,
-    contentContainerStyle: contentContainerStyleProp,
-    style: styleProp,
-    onLayout: onLayoutProp,
-    onRefresh,
-    refreshing,
-    progressViewOffset,
-    refreshControl,
-    initialContainerPoolRatio = 2,
-    viewabilityConfig,
-    viewabilityConfigCallbackPairs,
-    onViewableItemsChanged,
-    ...rest
-  } = props;
-  const initialScroll = typeof initialScrollIndexProp === "number" ? { index: initialScrollIndexProp } : initialScrollIndexProp;
-  const initialScrollIndex = initialScroll == null ? void 0 : initialScroll.index;
-  const refLoadStartTime = React2.useRef(Date.now());
-  const callbacks = React2.useRef({
-    onStartReached: rest.onStartReached,
-    onEndReached: rest.onEndReached
-  });
-  callbacks.current.onStartReached = rest.onStartReached;
-  callbacks.current.onEndReached = rest.onEndReached;
-  const contentContainerStyle = { ...reactNative.StyleSheet.flatten(contentContainerStyleProp) };
-  const style = { ...reactNative.StyleSheet.flatten(styleProp) };
-  const stylePaddingTopState = extractPadding(style, contentContainerStyle, "Top");
-  const stylePaddingBottomState = extractPadding(style, contentContainerStyle, "Bottom");
-  if (style == null ? void 0 : style.paddingTop) {
-    style.paddingTop = void 0;
-  }
-  if (contentContainerStyle == null ? void 0 : contentContainerStyle.paddingTop) {
-    contentContainerStyle.paddingTop = void 0;
-  }
-  const ctx = useStateContext();
-  ctx.columnWrapperStyle = columnWrapperStyle || (contentContainerStyle ? createColumnWrapperStyle(contentContainerStyle) : void 0);
-  const refScroller = React2.useRef(null);
-  const combinedRef = useCombinedRef(refScroller, refScrollView);
-  const estimatedItemSize = estimatedItemSizeProp != null ? estimatedItemSizeProp : DEFAULT_ITEM_SIZE;
-  const scrollBuffer = (drawDistance != null ? drawDistance : DEFAULT_DRAW_DISTANCE) || 1;
-  const keyExtractor = keyExtractorProp != null ? keyExtractorProp : (item, index) => index.toString();
-  const refState = React2.useRef();
-  const getId = (index) => {
-    var _a;
-    const data = (_a = refState.current) == null ? void 0 : _a.data;
-    if (!data) {
-      return "";
-    }
-    const ret = index < data.length ? keyExtractor ? keyExtractor(data[index], index) : index : null;
-    return `${ret}`;
-  };
-  const getItemSize = (key, index, data, useAverageSize = false) => {
-    const state = refState.current;
-    state.sizesKnown.get(key);
-    const sizePrevious = state.sizes.get(key);
-    let size;
-    peek$(ctx, "numColumns");
-    if (size === void 0 && sizePrevious !== void 0) {
-      return sizePrevious;
-    }
-    if (size === void 0) {
-      size = getEstimatedItemSize ? getEstimatedItemSize(index, data) : estimatedItemSize;
-    }
-    state.sizes.set(key, size);
-    return size;
+
+// src/utils/findAvailableContainers.ts
+function findAvailableContainers(ctx, state, numNeeded, startBuffered, endBuffered, pendingRemoval, requiredItemTypes, needNewContainers) {
+  const numContainers = peek$(ctx, "numContainers");
+  const { stickyContainerPool, containerItemTypes } = state;
+  const result = [];
+  const availableContainers = [];
+  const stickyIndicesSet = state.props.stickyIndicesSet;
+  const stickyItemIndices = (needNewContainers == null ? void 0 : needNewContainers.filter((index) => stickyIndicesSet.has(index))) || [];
+  const canReuseContainer = (containerIndex, requiredType) => {
+    if (!requiredType) return true;
+    const existingType = containerItemTypes.get(containerIndex);
+    if (!existingType) return true;
+    return existingType === requiredType;
   };
-  const calculateOffsetForIndex = (indexParam) => {
-    var _a;
-    const isFromInit = indexParam === void 0;
-    const index = isFromInit ? initialScrollIndex : indexParam;
-    const data = dataProp;
-    if (index !== void 0) {
-      let offset = 0;
-      const canGetSize = !!refState.current;
-      if (canGetSize || getEstimatedItemSize) {
-        const sizeFn = (index2) => {
-          if (canGetSize) {
-            return getItemSize(getId(index2), index2, data[index2], true);
-          }
-          return getEstimatedItemSize(index2, data[index2]);
-        };
-        for (let i = 0; i < index; i++) {
-          offset += sizeFn(i);
+  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);
         }
-      } else {
-        offset = index * estimatedItemSize;
+        foundContainer = true;
+        if (requiredItemTypes) typeIndex++;
+        break;
       }
-      const adjust = peek$(ctx, "containersDidLayout") ? ((_a = refState.current) == null ? void 0 : _a.scrollAdjustHandler.getAppliedAdjust()) || 0 : 0;
-      const stylePaddingTop = isFromInit ? stylePaddingTopState : peek$(ctx, "stylePaddingTop");
-      const topPad = (stylePaddingTop != null ? stylePaddingTop : 0) + peek$(ctx, "headerSize");
-      return offset / numColumnsProp - adjust + topPad;
     }
-    return 0;
-  };
-  const calculateOffsetWithOffsetPosition = (offsetParam, params) => {
-    const { index, viewOffset, viewPosition } = params;
-    let offset = offsetParam;
-    const state = refState.current;
-    if (viewOffset) {
-      offset -= viewOffset;
+    if (!foundContainer) {
+      const newContainerIndex = numContainers + result.filter((index) => index >= numContainers).length;
+      result.push(newContainerIndex);
+      stickyContainerPool.add(newContainerIndex);
+      if (requiredItemTypes) typeIndex++;
     }
-    if (viewPosition !== void 0 && index !== void 0) {
-      offset -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
+  }
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
+      continue;
     }
-    return offset;
-  };
-  const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : React2.useMemo(() => calculateOffsetForIndex(void 0), []);
-  if (!refState.current) {
-    const initialScrollLength = (estimatedListSize != null ? estimatedListSize : reactNative.Dimensions.get("window"))[horizontal ? "width" : "height"];
-    refState.current = {
-      sizes: /* @__PURE__ */ new Map(),
-      positions: /* @__PURE__ */ new Map(),
-      columns: /* @__PURE__ */ new Map(),
-      pendingAdjust: 0,
-      isStartReached: initialContentOffset < initialScrollLength * onStartReachedThreshold,
-      isEndReached: false,
-      isAtEnd: false,
-      isAtStart: false,
-      data: dataProp,
-      scrollLength: initialScrollLength,
-      startBuffered: -1,
-      startNoBuffer: -1,
-      endBuffered: -1,
-      endNoBuffer: -1,
-      scroll: initialContentOffset || 0,
-      totalSize: 0,
-      totalSizeBelowAnchor: 0,
-      timeouts: /* @__PURE__ */ new Set(),
-      viewabilityConfigCallbackPairs: void 0,
-      renderItem: void 0,
-      scrollAdjustHandler: new ScrollAdjustHandler(ctx),
-      nativeMarginTop: 0,
-      scrollPrev: 0,
-      scrollPrevTime: 0,
-      scrollTime: 0,
-      scrollPending: 0,
-      indexByKey: /* @__PURE__ */ new Map(),
-      scrollHistory: [],
-      scrollVelocity: 0,
-      sizesKnown: /* @__PURE__ */ new Map(),
-      timeoutSizeMessage: 0,
-      scrollTimer: void 0,
-      belowAnchorElementPositions: void 0,
-      rowHeights: /* @__PURE__ */ new Map(),
-      startReachedBlockedByTimer: false,
-      endReachedBlockedByTimer: false,
-      scrollForNextCalculateItemsInView: void 0,
-      enableScrollForNextCalculateItemsInView: true,
-      minIndexSizeChanged: 0,
-      queuedCalculateItemsInView: 0,
-      lastBatchingAction: Date.now(),
-      averageSizes: {},
-      onScroll: onScrollProp
-    };
-    const dataLength = dataProp.length;
-    if (maintainVisibleContentPosition && dataLength > 0) {
-      if (initialScrollIndex && initialScrollIndex < dataLength) {
-        refState.current.anchorElement = {
-          coordinate: initialContentOffset,
-          id: getId(initialScrollIndex)
-        };
-      } else if (dataLength > 0) {
-        refState.current.anchorElement = {
-          coordinate: initialContentOffset,
-          id: getId(0)
-        };
-      } else {
-        __DEV__ && warnDevOnce(
-          "maintainVisibleContentPosition",
-          "[legend-list] maintainVisibleContentPosition was not able to find an anchor element"
-        );
+    const key = peek$(ctx, `containerItemKey${u}`);
+    let isOk = key === void 0;
+    if (!isOk) {
+      const index = pendingRemoval.indexOf(u);
+      if (index !== -1) {
+        pendingRemoval.splice(index, 1);
+        const requiredType = neededTypes[typeIndex];
+        isOk = canReuseContainer(u, requiredType);
+      }
+    }
+    if (isOk) {
+      result.push(u);
+      if (requiredItemTypes) {
+        typeIndex++;
       }
     }
-    set$(ctx, "scrollAdjust", 0);
-    set$(ctx, "maintainVisibleContentPosition", maintainVisibleContentPosition);
-    set$(ctx, "extraData", extraData);
   }
-  const didDataChange = refState.current.data !== dataProp;
-  refState.current.data = dataProp;
-  refState.current.onScroll = onScrollProp;
-  const getAnchorElementIndex = () => {
-    const state = refState.current;
-    if (state.anchorElement) {
-      const el = state.indexByKey.get(state.anchorElement.id);
-      return el;
+  for (let u = 0; u < numContainers && result.length < numNeeded; u++) {
+    if (stickyContainerPool.has(u)) {
+      continue;
     }
-    return void 0;
-  };
-  const scrollToIndex = ({
-    index,
-    viewOffset = 0,
-    animated = true,
-    viewPosition
-  }) => {
-    var _a;
-    const state = refState.current;
-    if (index >= state.data.length) {
-      index = state.data.length - 1;
-    } else if (index < 0) {
-      index = 0;
-    }
-    const firstIndexOffset = calculateOffsetForIndex(index);
-    const isLast = index === state.data.length - 1;
-    if (isLast && viewPosition !== void 0) {
-      viewPosition = 1;
-    }
-    let firstIndexScrollPostion = firstIndexOffset - viewOffset;
-    const diff = Math.abs(state.scroll - firstIndexScrollPostion);
-    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
-    const needsReanchoring = maintainVisibleContentPosition && diff > 100;
-    state.scrollForNextCalculateItemsInView = void 0;
-    if (needsReanchoring) {
-      const id = getId(index);
-      state.anchorElement = { id, coordinate: firstIndexOffset - topPad };
-      (_a = state.belowAnchorElementPositions) == null ? void 0 : _a.clear();
-      state.positions.clear();
-      calcTotalSizesAndPositions({ forgetPositions: true });
-      state.startBufferedId = id;
-      state.minIndexSizeChanged = index;
-      firstIndexScrollPostion = firstIndexOffset - viewOffset + state.scrollAdjustHandler.getAppliedAdjust();
-    }
-    scrollTo({ offset: firstIndexScrollPostion, animated, index, viewPosition: viewPosition != null ? viewPosition : 0, viewOffset });
-  };
-  const setDidLayout = () => {
-    refState.current.queuedInitialLayout = true;
-    checkAtBottom();
-    const setIt = () => {
-      set$(ctx, "containersDidLayout", true);
-      if (props.onLoad) {
-        props.onLoad({ elapsedTimeInMs: Date.now() - refLoadStartTime.current });
+    const key = peek$(ctx, `containerItemKey${u}`);
+    if (key === void 0) continue;
+    const index = state.indexByKey.get(key);
+    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 });
       }
-    };
-    if (initialScroll) {
-      queueMicrotask(() => {
-        scrollToIndex({ ...initialScroll, animated: false });
-        requestAnimationFrame(() => {
-          if (!IsNewArchitecture) {
-            scrollToIndex({ ...initialScroll, animated: false });
-          }
-          setIt();
-        });
-      });
-    } else {
-      queueMicrotask(setIt);
     }
-  };
-  const addTotalSize = React2.useCallback((key, add, totalSizeBelowAnchor) => {
-    const state = refState.current;
-    const { indexByKey, anchorElement } = state;
-    const index = key === null ? 0 : indexByKey.get(key);
-    let isAboveAnchor = false;
-    if (maintainVisibleContentPosition) {
-      if (anchorElement && index < getAnchorElementIndex()) {
-        isAboveAnchor = true;
-      }
-    }
-    if (key === null) {
-      state.totalSize = add;
-      state.totalSizeBelowAnchor = totalSizeBelowAnchor;
-    } else {
-      state.totalSize += add;
-      if (isAboveAnchor) {
-        state.totalSizeBelowAnchor += add;
-      }
-    }
-    let applyAdjustValue = 0;
-    let resultSize = state.totalSize;
-    if (maintainVisibleContentPosition && anchorElement !== void 0) {
-      const newAdjust = anchorElement.coordinate - state.totalSizeBelowAnchor;
-      applyAdjustValue = -newAdjust;
-      state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
-      state.rowHeights.clear();
-      if (applyAdjustValue !== void 0) {
-        resultSize -= applyAdjustValue;
-        state.scrollAdjustHandler.requestAdjust(applyAdjustValue, (diff) => {
-          state.scroll -= diff;
-        });
+  }
+  const remaining = numNeeded - result.length;
+  if (remaining > 0) {
+    if (availableContainers.length > 0) {
+      if (availableContainers.length > remaining) {
+        availableContainers.sort(comparatorByDistance);
+        availableContainers.length = remaining;
+      }
+      for (const container of availableContainers) {
+        result.push(container.index);
+        if (requiredItemTypes) {
+          typeIndex++;
+        }
       }
     }
-    set$(ctx, "totalSize", state.totalSize);
-    set$(ctx, "totalSizeWithScrollAdjust", resultSize);
-    if (alignItemsAtEnd) {
-      updateAlignItemsPaddingTop();
+    const stillNeeded = numNeeded - result.length;
+    if (stillNeeded > 0) {
+      for (let i = 0; i < stillNeeded; i++) {
+        result.push(numContainers + i);
+      }
+      if (__DEV__ && numContainers + stillNeeded > peek$(ctx, "numContainersPooled")) {
+        console.warn(
+          "[legend-list] No unused container available, so creating one on demand. This can be a minor performance issue and is likely caused by the estimatedItemSize being too large. Consider decreasing estimatedItemSize or increasing initialContainerPoolRatio.",
+          {
+            debugInfo: {
+              numContainers,
+              numContainersPooled: peek$(ctx, "numContainersPooled"),
+              numNeeded,
+              stillNeeded
+            }
+          }
+        );
+      }
     }
-  }, []);
-  const getRowHeight = (n) => {
-    const { rowHeights, data } = refState.current;
-    const numColumns = peek$(ctx, "numColumns");
-    if (numColumns === 1) {
-      const id = getId(n);
-      return getItemSize(id, n, data[n]);
-    }
-    if (rowHeights.has(n)) {
-      return rowHeights.get(n) || 0;
-    }
-    let rowHeight = 0;
-    const startEl = n * numColumns;
-    for (let i = startEl; i < startEl + numColumns && i < data.length; i++) {
-      const id = getId(i);
-      const size = getItemSize(id, i, data[i]);
-      rowHeight = Math.max(rowHeight, size);
-    }
-    rowHeights.set(n, rowHeight);
-    return rowHeight;
-  };
-  const buildElementPositionsBelowAnchor = () => {
-    const state = refState.current;
-    if (!state.anchorElement) {
-      return /* @__PURE__ */ new Map();
+  }
+  return result.sort(comparatorDefault);
+}
+function comparatorByDistance(a, b) {
+  return b.distance - a.distance;
+}
+
+// src/core/scrollToIndex.ts
+function scrollToIndex(ctx, state, { index, viewOffset = 0, animated = true, viewPosition }) {
+  if (index >= state.props.data.length) {
+    index = state.props.data.length - 1;
+  } else if (index < 0) {
+    index = 0;
+  }
+  const firstIndexOffset = calculateOffsetForIndex(ctx, state, index);
+  const isLast = index === state.props.data.length - 1;
+  if (isLast && viewPosition === void 0) {
+    viewPosition = 1;
+  }
+  const firstIndexScrollPostion = firstIndexOffset - viewOffset;
+  state.scrollForNextCalculateItemsInView = void 0;
+  scrollTo(state, {
+    animated,
+    index,
+    offset: firstIndexScrollPostion,
+    viewOffset,
+    viewPosition: viewPosition != null ? viewPosition : 0
+  });
+}
+
+// src/utils/checkThreshold.ts
+var checkThreshold = (distance, atThreshold, threshold, isReached, isBlockedByTimer, onReached, blockTimer) => {
+  const distanceAbs = Math.abs(distance);
+  const isAtThreshold = atThreshold || distanceAbs < threshold;
+  if (!isReached && !isBlockedByTimer) {
+    if (isAtThreshold) {
+      onReached == null ? void 0 : onReached(distance);
+      blockTimer == null ? void 0 : blockTimer(true);
+      setTimeout(() => {
+        blockTimer == null ? void 0 : blockTimer(false);
+      }, 700);
+      return true;
     }
-    const anchorIndex = state.indexByKey.get(state.anchorElement.id);
-    if (anchorIndex === 0) {
-      return /* @__PURE__ */ new Map();
+  } else {
+    if (distance >= 1.3 * threshold) {
+      return false;
     }
-    const map = state.belowAnchorElementPositions || /* @__PURE__ */ new Map();
-    const numColumns = peek$(ctx, "numColumns");
-    let top = state.anchorElement.coordinate;
-    for (let i = anchorIndex - 1; i >= 0; i--) {
-      const id = getId(i);
-      const rowNumber = Math.floor(i / numColumns);
-      if (i % numColumns === 0) {
-        top -= getRowHeight(rowNumber);
+  }
+  return isReached;
+};
+
+// src/utils/checkAtBottom.ts
+function checkAtBottom(ctx, state) {
+  if (!state) {
+    return;
+  }
+  const {
+    queuedInitialLayout,
+    scrollLength,
+    scroll,
+    maintainingScrollAtEnd,
+    props: { maintainScrollAtEndThreshold, onEndReachedThreshold }
+  } = state;
+  const contentSize = getContentSize(ctx);
+  if (contentSize > 0 && queuedInitialLayout && !maintainingScrollAtEnd) {
+    const distanceFromEnd = contentSize - scroll - scrollLength;
+    const isContentLess = contentSize < scrollLength;
+    state.isAtEnd = isContentLess || distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
+    state.isEndReached = checkThreshold(
+      distanceFromEnd,
+      isContentLess,
+      onEndReachedThreshold * scrollLength,
+      state.isEndReached,
+      state.endReachedBlockedByTimer,
+      (distance) => {
+        var _a, _b;
+        return (_b = (_a = state.props).onEndReached) == null ? void 0 : _b.call(_a, { distanceFromEnd: distance });
+      },
+      (block) => {
+        state.endReachedBlockedByTimer = block;
       }
-      map.set(id, top);
+    );
+  }
+}
+
+// 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 });
     }
-    return map;
   };
-  const disableScrollJumps = (timeout) => {
-    const state = refState.current;
-    if (state.scrollingTo === void 0) {
-      state.disableScrollJumpsFrom = state.scroll - state.scrollAdjustHandler.getAppliedAdjust();
-      state.scrollHistory.length = 0;
-      setTimeout(() => {
-        state.disableScrollJumpsFrom = void 0;
-        if (state.scrollPending !== void 0 && state.scrollPending !== state.scroll) {
-          updateScroll(state.scrollPending);
-        }
-      }, timeout);
+  if (reactNative.Platform.OS === "android" || !IsNewArchitecture) {
+    if (initialScroll) {
+      queueMicrotask(() => {
+        scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+        requestAnimationFrame(() => {
+          scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+          setIt();
+        });
+      });
+    } else {
+      queueMicrotask(setIt);
     }
-  };
-  const getElementPositionBelowAchor = (id) => {
-    var _a;
-    const state = refState.current;
-    if (!refState.current.belowAnchorElementPositions) {
-      state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
-    }
-    const res = state.belowAnchorElementPositions.get(id);
-    if (res === void 0) {
-      console.warn(`Undefined position below anchor ${id} ${(_a = state.anchorElement) == null ? void 0 : _a.id}`);
-      return 0;
-    }
-    return res;
-  };
-  const fixGaps = React2.useCallback(() => {
-    var _a;
-    const state = refState.current;
-    const { data, scrollLength, positions, startBuffered, endBuffered } = state;
-    const numColumns = peek$(ctx, "numColumns");
-    if (!data || scrollLength === 0 || numColumns > 1) {
-      return;
+  } 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;
     }
-    const numContainers = ctx.values.get("numContainers");
-    let numMeasurements = 0;
-    for (let i = 0; i < numContainers; i++) {
-      const itemKey = peek$(ctx, `containerItemKey${i}`);
-      const isSizeKnown = state.sizesKnown.get(itemKey);
-      if (itemKey && !isSizeKnown) {
-        const containerRef = ctx.viewRefs.get(i);
-        if (containerRef) {
-          let measured;
-          (_a = containerRef.current) == null ? void 0 : _a.measure((x, y, width, height) => {
-            measured = { width, height };
-          });
-          numMeasurements++;
-          if (measured) {
-            updateItemSize(
-              itemKey,
-              measured,
-              /*fromFixGaps*/
-              true
-            );
-          }
-        }
-      }
+  }
+  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);
     }
-    if (numMeasurements > 0) {
-      let top;
-      const diffs = /* @__PURE__ */ new Map();
-      for (let i = startBuffered; i <= endBuffered; i++) {
-        const id = getId(i);
-        if (top === void 0) {
-          top = positions.get(id);
-        }
-        if (positions.get(id) !== top) {
-          diffs.set(id, top - positions.get(id));
-          positions.set(id, top);
-        }
-        const size = getItemSize(id, i, data[i]);
-        const bottom = top + size;
-        top = bottom;
-      }
-      for (let i = 0; i < numContainers; i++) {
-        const itemKey = peek$(ctx, `containerItemKey${i}`);
-        const diff = diffs.get(itemKey);
-        if (diff) {
-          const prevPos = peek$(ctx, `containerPosition${i}`);
-          const newPos = prevPos.top + diff;
-          if (prevPos.top !== newPos) {
-            const pos = { ...prevPos };
-            pos.relativeCoordinate += diff;
-            pos.top += diff;
-            set$(ctx, `containerPosition${i}`, pos);
-          }
-        }
+  }
+}
+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;
       }
     }
-  }, []);
-  const checkAllSizesKnown = React2.useCallback(() => {
-    const { startBuffered, endBuffered, sizesKnown } = refState.current;
-    if (endBuffered !== null) {
-      let areAllKnown = true;
-      for (let i = startBuffered; areAllKnown && i <= endBuffered; i++) {
-        const key = getId(i);
-        areAllKnown && (areAllKnown = sizesKnown.has(key));
-      }
-      return areAllKnown;
+    if (shouldRecycle) {
+      pendingRemoval.push(containerIndex);
     }
-    return false;
-  }, []);
-  const calculateItemsInView = React2.useCallback((isReset) => {
-    var _a;
-    const state = refState.current;
+  }
+}
+function calculateItemsInView(ctx, state, params = {}) {
+  reactNative.unstable_batchedUpdates(() => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const {
-      data,
+      columns,
+      containerItemKeys,
+      enableScrollForNextCalculateItemsInView,
+      idCache,
+      indexByKey,
+      minIndexSizeChanged,
+      positions,
+      scrollForNextCalculateItemsInView,
       scrollLength,
+      sizes,
       startBufferedId: startBufferedIdOrig,
-      positions,
-      columns,
-      scrollAdjustHandler,
-      scrollVelocity: speed
+      viewabilityConfigCallbackPairs,
+      props: { getItemType, initialScroll, itemsAreEqual, keyExtractor, scrollBuffer }
     } = state;
-    if (!data || scrollLength === 0) {
+    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;
     }
-    const totalSize = peek$(ctx, "totalSizeWithScrollAdjust");
+    const totalSize = peek$(ctx, "totalSize");
     const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
     const numColumns = peek$(ctx, "numColumns");
-    const previousScrollAdjust = scrollAdjustHandler.getAppliedAdjust();
-    let scrollState = state.scroll;
+    const previousScrollAdjust = 0;
+    const { dataChanged, doMVCP } = params;
+    const speed = getScrollVelocity(state);
+    if (doMVCP || dataChanged) {
+      const checkMVCP = doMVCP ? prepareMVCP(ctx, state, dataChanged) : void 0;
+      if (dataChanged) {
+        indexByKey.clear();
+        idCache.clear();
+        positions.clear();
+      }
+      updateAllPositions(ctx, state, dataChanged);
+      checkMVCP == null ? void 0 : checkMVCP();
+    }
     const scrollExtra = 0;
-    const useAverageSize = !state.disableScrollJumpsFrom && speed >= 0 && peek$(ctx, "containersDidLayout");
-    if (!state.queuedInitialLayout && initialScroll) {
+    const { queuedInitialLayout } = state;
+    let { scroll: scrollState } = state;
+    if (!queuedInitialLayout && initialScroll) {
       const updatedOffset = calculateOffsetWithOffsetPosition(
-        calculateOffsetForIndex(initialScroll.index),
+        state,
+        calculateOffsetForIndex(ctx, state, initialScroll.index),
         initialScroll
       );
       scrollState = updatedOffset;
@@ -1496,7 +1897,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     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);
@@ -1504,21 +1905,19 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     }
     let scrollBufferTop = scrollBuffer;
     let scrollBufferBottom = scrollBuffer;
-    if (Math.abs(speed) > 4) {
-      if (speed > 0) {
-        scrollBufferTop = scrollBuffer * 0.1;
-        scrollBufferBottom = scrollBuffer * 1.9;
-      } else {
-        scrollBufferTop = scrollBuffer * 1.9;
-        scrollBufferBottom = scrollBuffer * 0.1;
-      }
+    if (speed > 0 || speed === 0 && scroll < Math.max(50, scrollBuffer)) {
+      scrollBufferTop = scrollBuffer * 0.5;
+      scrollBufferBottom = scrollBuffer * 1.5;
+    } else {
+      scrollBufferTop = scrollBuffer * 1.5;
+      scrollBufferBottom = scrollBuffer * 0.5;
     }
     const scrollTopBuffered = scroll - scrollBufferTop;
-    const scrollBottom = scroll + scrollLength;
+    const scrollBottom = scroll + scrollLength + (scroll < 0 ? -scroll : 0);
     const scrollBottomBuffered = scrollBottom + scrollBufferBottom;
-    if (state.scrollForNextCalculateItemsInView) {
-      const { top: top2, bottom } = state.scrollForNextCalculateItemsInView;
-      if (scrollTopBuffered > top2 && scrollBottomBuffered < bottom) {
+    if (scrollForNextCalculateItemsInView) {
+      const { top, bottom } = scrollForNextCalculateItemsInView;
+      if (scrollTopBuffered > top && scrollBottomBuffered < bottom) {
         return;
       }
     }
@@ -1527,80 +1926,50 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     let startBufferedId = null;
     let endNoBuffer = null;
     let endBuffered = null;
-    let loopStart = startBufferedIdOrig ? state.indexByKey.get(startBufferedIdOrig) || 0 : 0;
-    if (state.minIndexSizeChanged !== void 0) {
-      loopStart = Math.min(state.minIndexSizeChanged, loopStart);
+    let loopStart = startBufferedIdOrig ? indexByKey.get(startBufferedIdOrig) || 0 : 0;
+    if (minIndexSizeChanged !== void 0) {
+      loopStart = Math.min(minIndexSizeChanged, loopStart);
       state.minIndexSizeChanged = void 0;
     }
-    const anchorElementIndex = getAnchorElementIndex();
     for (let i = loopStart; i >= 0; i--) {
-      const id = getId(i);
-      let newPosition;
-      if (maintainVisibleContentPosition && anchorElementIndex && i < anchorElementIndex) {
-        newPosition = getElementPositionBelowAchor(id);
-        if (newPosition !== void 0) {
-          positions.set(id, newPosition);
-        }
-      }
-      const top2 = newPosition || positions.get(id);
-      if (top2 !== void 0) {
-        const size = getItemSize(id, i, data[i], useAverageSize);
-        const bottom = top2 + size;
-        if (bottom > scroll - scrollBuffer) {
-          loopStart = i;
-        } else {
-          break;
-        }
+      const id = (_a = idCache.get(i)) != null ? _a : getId(state, i);
+      const top = positions.get(id);
+      const size = (_b = sizes.get(id)) != null ? _b : getItemSize(state, id, i, data[i]);
+      const bottom = top + size;
+      if (bottom > scroll - scrollBuffer) {
+        loopStart = i;
+      } else {
+        break;
       }
     }
     const loopStartMod = loopStart % numColumns;
     if (loopStartMod > 0) {
       loopStart -= loopStartMod;
     }
-    let top = void 0;
-    let column = 1;
-    let maxSizeInRow = 0;
-    const getInitialTop = (i) => {
-      var _a2;
-      const id = getId(i);
-      let topOffset = 0;
-      if (positions.get(id)) {
-        topOffset = positions.get(id);
-      }
-      if (id === ((_a2 = state.anchorElement) == null ? void 0 : _a2.id)) {
-        topOffset = state.anchorElement.coordinate;
-      }
-      return topOffset;
-    };
     let foundEnd = false;
     let nextTop;
     let nextBottom;
-    const prevNumContainers = ctx.values.get("numContainers");
     let maxIndexRendered = 0;
     for (let i = 0; i < prevNumContainers; i++) {
       const key = peek$(ctx, `containerItemKey${i}`);
       if (key !== void 0) {
-        const index = state.indexByKey.get(key);
+        const index = indexByKey.get(key);
         maxIndexRendered = Math.max(maxIndexRendered, index);
       }
     }
-    for (let i = Math.max(0, loopStart); i < data.length && (!foundEnd || i <= maxIndexRendered); i++) {
-      const id = getId(i);
-      const size = getItemSize(id, i, data[i], useAverageSize);
-      maxSizeInRow = Math.max(maxSizeInRow, size);
-      if (top === void 0 || id === ((_a = state.anchorElement) == null ? void 0 : _a.id)) {
-        top = getInitialTop(i);
-      }
-      if (positions.get(id) !== top) {
-        positions.set(id, top);
-      }
-      if (columns.get(id) !== column) {
-        columns.set(id, column);
-      }
+    let firstFullyOnScreenIndex;
+    const dataLength = data.length;
+    for (let i = Math.max(0, loopStart); i < dataLength && (!foundEnd || i <= maxIndexRendered); i++) {
+      const id = (_c = idCache.get(i)) != null ? _c : getId(state, i);
+      const size = (_d = sizes.get(id)) != null ? _d : getItemSize(state, id, i, data[i]);
+      const top = positions.get(id);
       if (!foundEnd) {
         if (startNoBuffer === null && top + size > scroll) {
           startNoBuffer = i;
         }
+        if (firstFullyOnScreenIndex === void 0 && top >= scroll - 10) {
+          firstFullyOnScreenIndex = i;
+        }
         if (startBuffered === null && top + size > scrollTopBuffered) {
           startBuffered = i;
           startBufferedId = id;
@@ -1612,201 +1981,212 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           }
           if (top <= scrollBottomBuffered) {
             endBuffered = i;
-            nextBottom = top + maxSizeInRow - scrollLength;
+            nextBottom = top + size;
           } else {
             foundEnd = true;
           }
         }
       }
-      column++;
-      if (column > numColumns) {
-        top += maxSizeInRow;
-        column = 1;
-        maxSizeInRow = 0;
-      }
+    }
+    const idsInView = [];
+    for (let i = firstFullyOnScreenIndex; i <= endNoBuffer; i++) {
+      const id = (_e = idCache.get(i)) != null ? _e : getId(state, i);
+      idsInView.push(id);
     }
     Object.assign(state, {
+      endBuffered,
+      endNoBuffer,
+      firstFullyOnScreenIndex,
+      idsInView,
       startBuffered,
       startBufferedId,
-      startNoBuffer,
-      endBuffered,
-      endNoBuffer
+      startNoBuffer
     });
-    if (state.enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0 && state.disableScrollJumpsFrom === void 0) {
+    if (enableScrollForNextCalculateItemsInView && nextTop !== void 0 && nextBottom !== void 0) {
       state.scrollForNextCalculateItemsInView = nextTop !== void 0 && nextBottom !== void 0 ? {
-        top: nextTop,
-        bottom: nextBottom
+        bottom: nextBottom,
+        top: nextTop
       } : void 0;
     }
+    const numContainers = peek$(ctx, "numContainers");
+    const pendingRemoval = [];
+    if (dataChanged) {
+      for (let i = 0; i < numContainers; i++) {
+        const itemKey = peek$(ctx, `containerItemKey${i}`);
+        if (!keyExtractor || itemKey && indexByKey.get(itemKey) === void 0) {
+          pendingRemoval.push(i);
+        }
+      }
+    }
     if (startBuffered !== null && endBuffered !== null) {
-      let numContainers = prevNumContainers;
+      let numContainers2 = prevNumContainers;
       const needNewContainers = [];
-      const isContained = (i) => {
-        const id = getId(i);
-        for (let j = 0; j < numContainers; j++) {
-          const key = peek$(ctx, `containerItemKey${j}`);
-          if (key === id) {
-            return true;
-          }
-        }
-      };
       for (let i = startBuffered; i <= endBuffered; i++) {
-        if (!isContained(i)) {
+        const id = (_f = idCache.get(i)) != null ? _f : getId(state, i);
+        if (!containerItemKeys.has(id)) {
           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
+          endBuffered,
+          pendingRemoval,
+          requiredItemTypes,
+          needNewContainers
         );
         for (let idx = 0; idx < needNewContainers.length; idx++) {
           const i = needNewContainers[idx];
           const containerIndex = availableContainers[idx];
-          const id = getId(i);
+          const id = (_g = idCache.get(i)) != null ? _g : getId(state, i);
+          const oldKey = peek$(ctx, `containerItemKey${containerIndex}`);
+          if (oldKey && oldKey !== id) {
+            containerItemKeys.delete(oldKey);
+          }
           set$(ctx, `containerItemKey${containerIndex}`, id);
           set$(ctx, `containerItemData${containerIndex}`, data[i]);
-          if (containerIndex >= numContainers) {
-            numContainers = containerIndex + 1;
+          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 reactNative.Animated.Value(topPadding));
+            state.stickyContainerPool.add(containerIndex);
+          } else {
+            state.stickyContainerPool.delete(containerIndex);
+          }
+          if (containerIndex >= numContainers2) {
+            numContainers2 = containerIndex + 1;
           }
         }
-        if (numContainers !== prevNumContainers) {
-          set$(ctx, "numContainers", numContainers);
-          if (numContainers > peek$(ctx, "numContainersPooled")) {
-            set$(ctx, "numContainersPooled", Math.ceil(numContainers * 1.5));
+        if (numContainers2 !== prevNumContainers) {
+          set$(ctx, "numContainers", numContainers2);
+          if (numContainers2 > peek$(ctx, "numContainersPooled")) {
+            set$(ctx, "numContainersPooled", Math.ceil(numContainers2 * 1.5));
           }
         }
       }
-      for (let i = 0; i < numContainers; i++) {
-        const itemKey = peek$(ctx, `containerItemKey${i}`);
-        const itemIndex = state.indexByKey.get(itemKey);
+    }
+    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);
+        set$(ctx, `containerColumn${i}`, -1);
+      } else {
+        const itemIndex = indexByKey.get(itemKey);
         const item = data[itemIndex];
         if (item !== void 0) {
-          const id = getId(itemIndex);
+          const id = (_h = idCache.get(itemIndex)) != null ? _h : getId(state, itemIndex);
           const position = positions.get(id);
           if (position === void 0) {
-            set$(ctx, `containerPosition${i}`, ANCHORED_POSITION_OUT_OF_VIEW);
+            set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
           } else {
-            const pos = {
-              type: "top",
-              relativeCoordinate: positions.get(id),
-              top: positions.get(id)
-            };
-            const column2 = columns.get(id) || 1;
-            if (maintainVisibleContentPosition && itemIndex < anchorElementIndex) {
-              const currentRow = Math.floor(itemIndex / numColumns);
-              const rowHeight = getRowHeight(currentRow);
-              const elementHeight = getItemSize(id, itemIndex, data[i]);
-              const diff = rowHeight - elementHeight;
-              pos.relativeCoordinate = pos.top + getRowHeight(currentRow) - diff;
-              pos.type = "bottom";
-            }
+            const column = columns.get(id) || 1;
             const prevPos = peek$(ctx, `containerPosition${i}`);
             const prevColumn = peek$(ctx, `containerColumn${i}`);
             const prevData = peek$(ctx, `containerItemData${i}`);
-            if (!prevPos || pos.relativeCoordinate > POSITION_OUT_OF_VIEW && pos.top !== prevPos.top) {
-              set$(ctx, `containerPosition${i}`, pos);
+            if (position > POSITION_OUT_OF_VIEW && position !== prevPos) {
+              set$(ctx, `containerPosition${i}`, position);
             }
-            if (column2 >= 0 && column2 !== prevColumn) {
-              set$(ctx, `containerColumn${i}`, column2);
+            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]);
             }
           }
         }
       }
     }
-    if (!state.queuedInitialLayout && endBuffered !== null) {
-      if (checkAllSizesKnown()) {
-        setDidLayout();
+    if (!queuedInitialLayout && endBuffered !== null) {
+      if (checkAllSizesKnown(state)) {
+        setDidLayout(ctx, state);
       }
     }
-    if (state.viewabilityConfigCallbackPairs) {
-      updateViewableItems(
-        state,
-        ctx,
-        state.viewabilityConfigCallbackPairs,
-        getId,
-        scrollLength,
-        startNoBuffer,
-        endNoBuffer
-      );
-    }
-  }, []);
-  const setPaddingTop = ({
-    stylePaddingTop,
-    alignItemsPaddingTop
-  }) => {
-    if (stylePaddingTop !== void 0) {
-      const prevStylePaddingTop = peek$(ctx, "stylePaddingTop") || 0;
-      if (stylePaddingTop < prevStylePaddingTop) {
-        const prevTotalSize = peek$(ctx, "totalSizeWithScrollAdjust") || 0;
-        set$(ctx, "totalSizeWithScrollAdjust", prevTotalSize + prevStylePaddingTop);
-        setTimeout(() => {
-          set$(ctx, "totalSizeWithScrollAdjust", prevTotalSize);
-        }, 16);
-      }
-      set$(ctx, "stylePaddingTop", stylePaddingTop);
+    if (viewabilityConfigCallbackPairs) {
+      updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollLength, startNoBuffer, endNoBuffer);
     }
-    if (alignItemsPaddingTop !== void 0) {
-      set$(ctx, "alignItemsPaddingTop", alignItemsPaddingTop);
+  });
+}
+
+// src/core/doInitialAllocateContainers.ts
+function doInitialAllocateContainers(ctx, state) {
+  var _a;
+  const {
+    scrollLength,
+    props: { data, getEstimatedItemSize, getItemType, scrollBuffer, numColumns, estimatedItemSize }
+  } = state;
+  if (scrollLength > 0 && data.length > 0 && !peek$(ctx, "numContainers")) {
+    const averageItemSize = getEstimatedItemSize ? getEstimatedItemSize(0, data[0], getItemType ? (_a = getItemType(data[0], 0)) != null ? _a : "" : "") : 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,
-      "paddingTop",
-      (stylePaddingTop != null ? stylePaddingTop : peek$(ctx, "stylePaddingTop")) + (alignItemsPaddingTop != null ? alignItemsPaddingTop : peek$(ctx, "alignItemsPaddingTop"))
-    );
-  };
-  const updateAlignItemsPaddingTop = () => {
-    if (alignItemsAtEnd) {
-      const { data, scrollLength } = refState.current;
-      let alignItemsPaddingTop = 0;
-      if ((data == null ? void 0 : data.length) > 0) {
-        const contentSize = getContentSize(ctx);
-        alignItemsPaddingTop = Math.max(0, Math.floor(scrollLength - contentSize));
+    set$(ctx, "numContainers", numContainers);
+    set$(ctx, "numContainersPooled", numContainers * state.props.initialContainerPoolRatio);
+    if (!IsNewArchitecture) {
+      if (state.props.initialScroll) {
+        requestAnimationFrame(() => {
+          calculateItemsInView(ctx, state);
+        });
+      } else {
+        calculateItemsInView(ctx, state);
       }
-      setPaddingTop({ alignItemsPaddingTop });
     }
-  };
-  const finishScrollTo = () => {
-    const state = refState.current;
-    if (state) {
-      state.scrollingTo = void 0;
-      state.scrollAdjustHandler.setDisableAdjust(false);
-      state.scrollHistory.length = 0;
-      calculateItemsInView();
-    }
-  };
-  const scrollTo = (params = {}) => {
-    var _a;
-    const state = refState.current;
-    const { animated } = params;
-    const offset = calculateOffsetWithOffsetPosition(params.offset, params);
-    state.scrollAdjustHandler.setDisableAdjust(true);
-    state.scrollHistory.length = 0;
-    state.scrollingTo = params;
-    state.scrollPending = offset;
-    (_a = refScroller.current) == null ? void 0 : _a.scrollTo({
-      x: horizontal ? offset : 0,
-      y: horizontal ? 0 : offset,
-      animated: !!animated
-    });
-    if (!animated) {
-      requestAnimationFrame(finishScrollTo);
+    return true;
+  }
+}
+
+// src/core/doMaintainScrollAtEnd.ts
+function doMaintainScrollAtEnd(ctx, state, animated) {
+  const {
+    refScroller,
+    props: { maintainScrollAtEnd }
+  } = state;
+  if ((state == null ? void 0 : state.isAtEnd) && maintainScrollAtEnd && peek$(ctx, "containersDidLayout")) {
+    const paddingTop = peek$(ctx, "alignItemsPaddingTop");
+    if (paddingTop > 0) {
+      state.scroll = 0;
     }
-  };
-  const doMaintainScrollAtEnd = (animated) => {
-    const state = refState.current;
-    if ((state == null ? void 0 : state.isAtEnd) && maintainScrollAtEnd && peek$(ctx, "containersDidLayout")) {
-      const paddingTop = peek$(ctx, "alignItemsPaddingTop");
-      if (paddingTop > 0) {
-        state.scroll = 0;
-      }
-      state.disableScrollJumpsFrom = void 0;
-      requestAnimationFrame(() => {
-        var _a;
+    requestAnimationFrame(() => {
+      var _a;
+      if (state == null ? void 0 : state.isAtEnd) {
         state.maintainingScrollAtEnd = true;
         (_a = refScroller.current) == null ? void 0 : _a.scrollToEnd({
           animated
@@ -1817,290 +2197,660 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
           },
           0
         );
-      });
-      return true;
-    }
-  };
-  const checkThreshold = (distance, atThreshold, threshold, isReached, isBlockedByTimer, onReached, blockTimer) => {
-    const distanceAbs = Math.abs(distance);
-    const isAtThreshold = atThreshold || distanceAbs < threshold;
-    if (!isReached && !isBlockedByTimer) {
-      if (isAtThreshold) {
-        onReached == null ? void 0 : onReached(distance);
-        blockTimer == null ? void 0 : blockTimer(true);
-        setTimeout(() => {
-          blockTimer == null ? void 0 : blockTimer(false);
-        }, 700);
-        return true;
-      }
-    } else {
-      if (distance >= 1.3 * threshold) {
-        return false;
       }
+    });
+    return true;
+  }
+}
+
+// src/utils/checkAtTop.ts
+function checkAtTop(state) {
+  if (!state) {
+    return;
+  }
+  const {
+    scrollLength,
+    scroll,
+    props: { onStartReachedThreshold }
+  } = state;
+  const distanceFromTop = scroll;
+  state.isAtStart = distanceFromTop <= 0;
+  state.isStartReached = checkThreshold(
+    distanceFromTop,
+    false,
+    onStartReachedThreshold * scrollLength,
+    state.isStartReached,
+    state.startReachedBlockedByTimer,
+    (distance) => {
+      var _a, _b;
+      return (_b = (_a = state.props).onStartReached) == null ? void 0 : _b.call(_a, { distanceFromStart: distance });
+    },
+    (block) => {
+      state.startReachedBlockedByTimer = block;
     }
-    return isReached;
-  };
-  const checkAtBottom = () => {
-    if (!refState.current) {
-      return;
-    }
-    const { queuedInitialLayout, scrollLength, scroll, maintainingScrollAtEnd } = refState.current;
-    const contentSize = getContentSize(ctx);
-    if (contentSize > 0 && queuedInitialLayout && !maintainingScrollAtEnd) {
-      const distanceFromEnd = contentSize - scroll - scrollLength;
-      const isContentLess = contentSize < scrollLength;
-      refState.current.isAtEnd = isContentLess || distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
-      refState.current.isEndReached = checkThreshold(
-        distanceFromEnd,
-        isContentLess,
-        onEndReachedThreshold * scrollLength,
-        refState.current.isEndReached,
-        refState.current.endReachedBlockedByTimer,
-        (distance) => {
-          var _a, _b;
-          return (_b = (_a = callbacks.current).onEndReached) == null ? void 0 : _b.call(_a, { distanceFromEnd: distance });
-        },
-        (block) => {
-          refState.current.endReachedBlockedByTimer = block;
-        }
-      );
-    }
-  };
-  const checkAtTop = () => {
-    if (!refState.current) {
+  );
+}
+
+// src/core/handleLayout.ts
+function handleLayout(ctx, state, layout, setCanRender) {
+  const { maintainScrollAtEnd } = state.props;
+  const scrollLength = layout[state.props.horizontal ? "width" : "height"];
+  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.`
+    );
+  }
+  setCanRender(true);
+}
+
+// src/core/onScroll.ts
+function onScroll(ctx, state, event) {
+  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;
+  }
+  const newScroll = event.nativeEvent.contentOffset[state.props.horizontal ? "x" : "y"];
+  const ignoreScrollFromMVCP = state.ignoreScrollFromMVCP;
+  if (ignoreScrollFromMVCP && !state.scrollingTo) {
+    const { lt, gt } = ignoreScrollFromMVCP;
+    if (lt && newScroll < lt || gt && newScroll > gt) {
       return;
     }
-    const { scrollLength, scroll } = refState.current;
-    const distanceFromTop = scroll;
-    refState.current.isAtStart = distanceFromTop <= 0;
-    refState.current.isStartReached = checkThreshold(
-      distanceFromTop,
-      false,
-      onStartReachedThreshold * scrollLength,
-      refState.current.isStartReached,
-      refState.current.startReachedBlockedByTimer,
-      (distance) => {
-        var _a, _b;
-        return (_b = (_a = callbacks.current).onStartReached) == null ? void 0 : _b.call(_a, { distanceFromStart: distance });
-      },
-      (block) => {
-        refState.current.startReachedBlockedByTimer = block;
-      }
-    );
-  };
-  const checkResetContainers = (isFirst2) => {
-    const state = refState.current;
-    if (state) {
-      state.data = dataProp;
-      if (!isFirst2) {
-        const totalSizeBefore = state.previousTotalSize;
-        const totalSizeAfter = state.totalSize;
-        const scrollDiff = state.scroll - state.scrollPrev;
-        const sizeDiff = totalSizeAfter - totalSizeBefore;
-        if (Math.abs(scrollDiff - sizeDiff) < 10) {
-          disableScrollJumps(1e3);
-        }
-        const numContainers = peek$(ctx, "numContainers");
+  }
+  state.scrollPending = newScroll;
+  updateScroll(ctx, state, newScroll);
+  onScrollProp == null ? void 0 : onScrollProp(event);
+}
+function updateScroll(ctx, state, newScroll) {
+  const scrollingTo = state.scrollingTo;
+  state.hasScrolled = true;
+  state.lastBatchingAction = Date.now();
+  const currentTime = Date.now();
+  if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === state.scroll)) {
+    state.scrollHistory.push({ scroll: newScroll, time: currentTime });
+  }
+  if (state.scrollHistory.length > 5) {
+    state.scrollHistory.shift();
+  }
+  state.scrollPrev = state.scroll;
+  state.scrollPrevTime = state.scrollTime;
+  state.scroll = newScroll;
+  state.scrollTime = currentTime;
+  if (Math.abs(state.scroll - state.scrollPrev) > 2) {
+    calculateItemsInView(ctx, state);
+    checkAtBottom(ctx, state);
+    checkAtTop(state);
+  }
+}
+
+// src/core/ScrollAdjustHandler.ts
+var ScrollAdjustHandler = class {
+  constructor(ctx) {
+    this.appliedAdjust = 0;
+    this.mounted = false;
+    this.context = ctx;
+  }
+  requestAdjust(add) {
+    const oldAdjustTop = peek$(this.context, "scrollAdjust") || 0;
+    this.appliedAdjust = add + oldAdjustTop;
+    const set = () => set$(this.context, "scrollAdjust", this.appliedAdjust);
+    if (this.mounted) {
+      set();
+    } else {
+      requestAnimationFrame(set);
+    }
+  }
+  setMounted() {
+    this.mounted = true;
+  }
+};
+
+// src/core/updateItemSize.ts
+function updateItemSizes(ctx, state, itemUpdates) {
+  var _a;
+  const {
+    props: {
+      horizontal,
+      maintainVisibleContentPosition,
+      suggestEstimatedItemSize,
+      onItemSizeChanged,
+      data,
+      maintainScrollAtEnd
+    }
+  } = state;
+  if (!data) 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++) {
-          const itemKey = peek$(ctx, `containerItemKey${i}`);
-          if (!keyExtractorProp || itemKey && state.indexByKey.get(itemKey) === void 0) {
-            set$(ctx, `containerItemKey${i}`, void 0);
-            set$(ctx, `containerItemData${i}`, void 0);
-            set$(ctx, `containerPosition${i}`, ANCHORED_POSITION_OUT_OF_VIEW);
-            set$(ctx, `containerColumn${i}`, -1);
+          if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
+            needsRecalculate = true;
+            break;
           }
         }
-        if (!keyExtractorProp) {
-          state.positions.clear();
-        }
-        calculateItemsInView(
-          /*isReset*/
-          true
-        );
-        const didMaintainScrollAtEnd = doMaintainScrollAtEnd(false);
-        if (!didMaintainScrollAtEnd && dataProp.length > state.data.length) {
-          state.isEndReached = false;
-        }
-        if (!didMaintainScrollAtEnd) {
-          checkAtTop();
-          checkAtBottom();
-        }
       }
+      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
+      });
     }
-  };
-  const calcTotalSizesAndPositions = ({ forgetPositions = false }) => {
-    var _a, _b;
-    const state = refState.current;
-    let totalSize = 0;
-    let totalSizeBelowIndex = 0;
-    const indexByKey = /* @__PURE__ */ new Map();
-    const newPositions = /* @__PURE__ */ new Map();
-    let column = 1;
-    let maxSizeInRow = 0;
-    const numColumns = (_a = peek$(ctx, "numColumns")) != null ? _a : numColumnsProp;
-    if (!state) {
+  }
+  if (minIndexSizeChanged !== void 0) {
+    state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, minIndexSizeChanged) : minIndexSizeChanged;
+  }
+  if (__DEV__ && suggestEstimatedItemSize && minIndexSizeChanged !== void 0) {
+    if (state.timeoutSizeMessage) clearTimeout(state.timeoutSizeMessage);
+    state.timeoutSizeMessage = setTimeout(() => {
+      var _a2;
+      state.timeoutSizeMessage = void 0;
+      const num = state.sizesKnown.size;
+      const avg = (_a2 = state.averageSizes[""]) == null ? void 0 : _a2.avg;
+      console.warn(
+        `[legend-list] Based on the ${num} items rendered so far, the optimal estimated size is ${avg}.`
+      );
+    }, 1e3);
+  }
+  const cur = peek$(ctx, "otherAxisSize");
+  if (!cur || maxOtherAxisSize > cur) {
+    set$(ctx, "otherAxisSize", maxOtherAxisSize);
+  }
+  if (containersDidLayout || checkAllSizesKnown(state)) {
+    if (needsRecalculate) {
+      state.scrollForNextCalculateItemsInView = void 0;
+      calculateItemsInView(ctx, state, { doMVCP: true });
+    }
+    if (shouldMaintainScrollAtEnd) {
+      if (maintainScrollAtEnd === true || maintainScrollAtEnd.onItemLayout) {
+        doMaintainScrollAtEnd(ctx, state, false);
+      }
+    }
+  }
+}
+function updateItemSize(ctx, state, itemKey, sizeObj) {
+  var _a;
+  const {
+    queuedItemSizeUpdates,
+    queuedItemSizeUpdatesWaiting,
+    sizesKnown,
+    props: { getFixedItemSize, getItemType }
+  } = state;
+  if (getFixedItemSize) {
+    const index = state.indexByKey.get(itemKey);
+    if (index === void 0) {
       return;
     }
-    for (let i = 0; i < dataProp.length; i++) {
-      const key = getId(i);
-      if (__DEV__) {
-        if (indexByKey.has(key)) {
-          console.error(
-            `[legend-list] Error: Detected overlapping key (${key}) which causes missing items and gaps and other terrrible things. Check that keyExtractor returns unique values.`
-          );
-        }
+    const itemData = state.props.data[index];
+    if (itemData === void 0) {
+      return;
+    }
+    const type = getItemType ? (_a = getItemType(itemData, index)) != null ? _a : "" : "";
+    const size = getFixedItemSize(index, itemData, type);
+    if (size !== void 0 && size === sizesKnown.get(itemKey)) {
+      return;
+    }
+  }
+  const containersDidLayout = peek$(ctx, "containersDidLayout");
+  const speed = getScrollVelocity(state);
+  if (!containersDidLayout || !queuedItemSizeUpdatesWaiting || Math.abs(speed) < 1) {
+    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, 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);
+  if (!getEstimatedItemSize && !getFixedItemSize) {
+    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++;
+  }
+  if (!prevSize || Math.abs(prevSize - size) > 0.1) {
+    sizes.set(itemKey, size);
+    return size - prevSize;
+  }
+  return 0;
+}
+var useCombinedRef = (...refs) => {
+  const callback = React3.useCallback((element) => {
+    for (const ref of refs) {
+      if (!ref) {
+        continue;
       }
-      indexByKey.set(key, i);
-      if (!forgetPositions && state.positions.get(key) != null && state.indexByKey.get(key) === i) {
-        newPositions.set(key, state.positions.get(key));
-      }
-    }
-    state.indexByKey = indexByKey;
-    state.positions = newPositions;
-    if (!forgetPositions && !isFirst) {
-      if (maintainVisibleContentPosition) {
-        if (state.anchorElement == null || indexByKey.get(state.anchorElement.id) == null) {
-          if (dataProp.length) {
-            const newAnchorElement = {
-              coordinate: 0,
-              id: getId(0)
-            };
-            state.anchorElement = newAnchorElement;
-            (_b = state.belowAnchorElementPositions) == null ? void 0 : _b.clear();
-            scrollTo({ offset: 0, animated: false });
-            setTimeout(() => {
-              calculateItemsInView(
-                /*reset*/
-                true
-              );
-            }, 0);
-          } else {
-            state.startBufferedId = void 0;
-          }
-        }
+      if (isFunction(ref)) {
+        ref(element);
       } else {
-        if (state.startBufferedId != null && newPositions.get(state.startBufferedId) == null) {
-          if (dataProp.length) {
-            state.startBufferedId = getId(0);
-          } else {
-            state.startBufferedId = void 0;
-          }
-          scrollTo({ offset: 0, animated: false });
-          setTimeout(() => {
-            calculateItemsInView(
-              /*reset*/
-              true
-            );
-          }, 0);
-        }
-      }
-    }
-    const anchorElementIndex = getAnchorElementIndex();
-    for (let i = 0; i < dataProp.length; i++) {
-      const key = getId(i);
-      const size = getItemSize(key, i, dataProp[i]);
-      maxSizeInRow = Math.max(maxSizeInRow, size);
-      column++;
-      if (column > numColumns) {
-        if (maintainVisibleContentPosition && anchorElementIndex !== void 0 && i < anchorElementIndex) {
-          totalSizeBelowIndex += maxSizeInRow;
-        }
-        totalSize += maxSizeInRow;
-        column = 1;
-        maxSizeInRow = 0;
+        ref.current = element;
       }
     }
-    if (maxSizeInRow > 0) {
-      totalSize += maxSizeInRow;
-    }
-    state.ignoreScrollFromCalcTotal = true;
-    requestAnimationFrame(() => {
-      state.ignoreScrollFromCalcTotal = false;
-    });
-    addTotalSize(null, totalSize, totalSizeBelowIndex);
+  }, refs);
+  return callback;
+};
+
+// src/utils/createColumnWrapperStyle.ts
+function createColumnWrapperStyle(contentContainerStyle) {
+  const { gap, columnGap, rowGap } = contentContainerStyle;
+  if (gap || columnGap || rowGap) {
+    contentContainerStyle.gap = void 0;
+    contentContainerStyle.columnGap = void 0;
+    contentContainerStyle.rowGap = void 0;
+    return {
+      columnGap,
+      gap,
+      rowGap
+    };
+  }
+}
+function getRenderedItem(ctx, state, key) {
+  var _a;
+  if (!state) {
+    return null;
+  }
+  const {
+    indexByKey,
+    props: { data, getItemType, renderItem }
+  } = state;
+  const index = indexByKey.get(key);
+  if (index === void 0) {
+    return null;
+  }
+  let renderedItem = null;
+  if (renderItem && data[index]) {
+    const itemProps = {
+      extraData: peek$(ctx, "extraData"),
+      index,
+      item: data[index],
+      type: getItemType ? (_a = getItemType(data[index], index)) != null ? _a : "" : ""
+    };
+    renderedItem = isFunction(renderItem) ? renderItem(itemProps) : React3__namespace.default.createElement(renderItem, itemProps);
+  }
+  return { index, item: data[index], renderedItem };
+}
+
+// src/utils/throttledOnScroll.ts
+function throttledOnScroll(originalHandler, scrollEventThrottle) {
+  const throttle = useThrottleDebounce("throttle");
+  return (event) => {
+    throttle(originalHandler, scrollEventThrottle, event);
   };
-  const findAvailableContainers = (numNeeded, startBuffered, endBuffered) => {
-    const state = refState.current;
-    const numContainers = peek$(ctx, "numContainers");
-    if (numNeeded === 0) return [];
-    const result = [];
-    const availableContainers = [];
-    for (let u = 0; u < numContainers; u++) {
-      const key = peek$(ctx, `containerItemKey${u}`);
-      if (key === void 0) {
-        result.push(u);
-        if (result.length >= numNeeded) {
-          return result;
+}
+
+// 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 (let u = 0; u < numContainers; u++) {
-      const key = peek$(ctx, `containerItemKey${u}`);
-      if (key === void 0) continue;
-      const index = state.indexByKey.get(key);
-      if (index < startBuffered) {
-        availableContainers.push({ index: u, distance: startBuffered - index });
-      } else if (index > endBuffered) {
-        availableContainers.push({ index: u, distance: index - endBuffered });
-      }
+  }
+  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
+      };
     }
-    const remaining = numNeeded - result.length;
-    if (remaining > 0) {
-      if (availableContainers.length > 0) {
-        if (availableContainers.length > remaining) {
-          availableContainers.sort(comparatorByDistance);
-          availableContainers.length = remaining;
-        }
-        for (const container of availableContainers) {
-          result.push(container.index);
-        }
+  }
+}
+
+// src/components/LegendList.tsx
+var DEFAULT_DRAW_DISTANCE = 250;
+var DEFAULT_ITEM_SIZE = 100;
+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__namespace.Children.toArray(children)).flat(1),
+      renderItem: ({ item }) => item
+    } : {
+      ...restProps,
+      data: dataProp || [],
+      renderItem: renderItemProp
+    };
+    return /* @__PURE__ */ React3__namespace.createElement(StateProvider, null, /* @__PURE__ */ React3__namespace.createElement(LegendListInner, { ...processedProps, ref: forwardedRef }));
+  })
+);
+var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
+  var _a;
+  const {
+    alignItemsAtEnd = false,
+    columnWrapperStyle,
+    contentContainerStyle: contentContainerStyleProp,
+    data: dataProp = [],
+    drawDistance = 250,
+    estimatedItemSize: estimatedItemSizeProp,
+    estimatedListSize,
+    extraData,
+    getEstimatedItemSize,
+    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,
+    onLayout: onLayoutProp,
+    onLoad,
+    onMomentumScrollEnd,
+    onRefresh,
+    onScroll: onScrollProp,
+    onStartReached,
+    onStartReachedThreshold = 0.5,
+    onViewableItemsChanged,
+    progressViewOffset,
+    recycleItems = false,
+    refreshControl,
+    refreshing,
+    refScrollView,
+    renderItem,
+    scrollEventThrottle,
+    snapToIndices,
+    stickyIndices,
+    style: styleProp,
+    suggestEstimatedItemSize,
+    viewabilityConfig,
+    viewabilityConfigCallbackPairs,
+    waitForInitialLayout = true,
+    ...rest
+  } = props;
+  const [renderNum, setRenderNum] = React3.useState(0);
+  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__namespace.useState(!IsNewArchitecture);
+  const contentContainerStyle = { ...reactNative.StyleSheet.flatten(contentContainerStyleProp) };
+  const style = { ...reactNative.StyleSheet.flatten(styleProp) };
+  const stylePaddingTopState = extractPadding(style, contentContainerStyle, "Top");
+  const stylePaddingBottomState = extractPadding(style, contentContainerStyle, "Bottom");
+  const ctx = useStateContext();
+  ctx.columnWrapperStyle = columnWrapperStyle || (contentContainerStyle ? createColumnWrapperStyle(contentContainerStyle) : void 0);
+  const refScroller = React3.useRef(null);
+  const combinedRef = useCombinedRef(refScroller, refScrollView);
+  const estimatedItemSize = estimatedItemSizeProp != null ? estimatedItemSizeProp : DEFAULT_ITEM_SIZE;
+  const scrollBuffer = (drawDistance != null ? drawDistance : DEFAULT_DRAW_DISTANCE) || 1;
+  const keyExtractor = keyExtractorProp != null ? keyExtractorProp : (_item, index) => index.toString();
+  const refState = React3.useRef();
+  if (!refState.current) {
+    const initialScrollLength = (estimatedListSize != null ? estimatedListSize : IsNewArchitecture ? { height: 0, width: 0 } : reactNative.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,
+      endReachedBlockedByTimer: false,
+      firstFullyOnScreenIndex: -1,
+      idCache: /* @__PURE__ */ new Map(),
+      idsInView: [],
+      indexByKey: /* @__PURE__ */ new Map(),
+      initialScroll,
+      isAtEnd: false,
+      isAtStart: false,
+      isEndReached: false,
+      isStartReached: false,
+      lastBatchingAction: Date.now(),
+      lastLayout: void 0,
+      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),
+      scrollForNextCalculateItemsInView: void 0,
+      scrollHistory: [],
+      scrollLength: initialScrollLength,
+      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,
+      viewabilityConfigCallbackPairs: void 0
+    };
+    set$(ctx, "maintainVisibleContentPosition", maintainVisibleContentPosition);
+    set$(ctx, "extraData", extraData);
+  }
+  const state = refState.current;
+  const isFirst = !state.props.renderItem;
+  const didDataChange = state.props.data !== dataProp;
+  state.props = {
+    alignItemsAtEnd,
+    data: dataProp,
+    estimatedItemSize,
+    getEstimatedItemSize,
+    getFixedItemSize,
+    getItemType,
+    horizontal: !!horizontal,
+    initialContainerPoolRatio,
+    initialScroll,
+    itemsAreEqual,
+    keyExtractor,
+    maintainScrollAtEnd,
+    maintainScrollAtEndThreshold,
+    maintainVisibleContentPosition,
+    numColumns: numColumnsProp,
+    onEndReached,
+    onEndReachedThreshold,
+    onItemSizeChanged,
+    onLoad,
+    onScroll: onScrollProp,
+    onStartReached,
+    onStartReachedThreshold,
+    recycleItems: !!recycleItems,
+    renderItem,
+    scrollBuffer,
+    snapToIndices,
+    stickyIndicesArr: stickyIndices != null ? stickyIndices : [],
+    stickyIndicesSet: React3.useMemo(() => new Set(stickyIndices != null ? stickyIndices : []), [stickyIndices == null ? void 0 : stickyIndices.join(",")]),
+    stylePaddingBottom: stylePaddingBottomState,
+    stylePaddingTop: stylePaddingTopState,
+    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);
       }
-      const stillNeeded = numNeeded - result.length;
-      if (stillNeeded > 0) {
-        for (let i = 0; i < stillNeeded; i++) {
-          result.push(numContainers + i);
+      state2.props.data = dataProp;
+      if (!isFirst2) {
+        calculateItemsInView(ctx, state2, { dataChanged: true, doMVCP: true });
+        const shouldMaintainScrollAtEnd = maintainScrollAtEnd === true || maintainScrollAtEnd.onDataChange;
+        const didMaintainScrollAtEnd = shouldMaintainScrollAtEnd && doMaintainScrollAtEnd(ctx, state2, false);
+        if (!didMaintainScrollAtEnd && dataProp.length > state2.props.data.length) {
+          state2.isEndReached = false;
         }
-        if (__DEV__ && numContainers + stillNeeded > peek$(ctx, "numContainersPooled")) {
-          console.warn(
-            "[legend-list] No unused container available, so creating one on demand. This can be a minor performance issue and is likely caused by the estimatedItemSize being too large. Consider decreasing estimatedItemSize or increasing initialContainerPoolRatio.",
-            {
-              debugInfo: {
-                numContainers,
-                numNeeded,
-                stillNeeded,
-                numContainersPooled: peek$(ctx, "numContainersPooled")
-              }
-            }
-          );
+        if (!didMaintainScrollAtEnd) {
+          checkAtTop(state2);
+          checkAtBottom(ctx, state2);
         }
       }
     }
-    return result.sort(comparatorDefault);
   };
-  const isFirst = !refState.current.renderItem;
-  const memoizedLastItemKeys = React2.useMemo(() => {
+  const memoizedLastItemKeys = React3.useMemo(() => {
     if (!dataProp.length) return [];
     return Array.from(
       { length: Math.min(numColumnsProp, dataProp.length) },
-      (_, i) => getId(dataProp.length - 1 - i)
+      (_, i) => getId(state, dataProp.length - 1 - i)
     );
   }, [dataProp, numColumnsProp]);
-  const initalizeStateVars = () => {
+  const initializeStateVars = () => {
     set$(ctx, "lastItemKeys", memoizedLastItemKeys);
     set$(ctx, "numColumns", numColumnsProp);
     const prevPaddingTop = peek$(ctx, "stylePaddingTop");
-    setPaddingTop({ stylePaddingTop: stylePaddingTopState });
-    refState.current.stylePaddingBottom = stylePaddingBottomState;
-    const paddingDiff = stylePaddingTopState - prevPaddingTop;
-    if (paddingDiff && prevPaddingTop !== void 0 && reactNative.Platform.OS === "ios") {
-      queueMicrotask(() => {
-        scrollTo({ offset: refState.current.scrollPending + paddingDiff, animated: false });
-      });
+    setPaddingTop(ctx, state, { stylePaddingTop: stylePaddingTopState });
+    refState.current.props.stylePaddingBottom = stylePaddingBottomState;
+    let paddingDiff = stylePaddingTopState - prevPaddingTop;
+    if (maintainVisibleContentPosition && paddingDiff && prevPaddingTop !== void 0 && reactNative.Platform.OS === "ios") {
+      if (state.scroll < 0) {
+        paddingDiff += state.scroll;
+      }
+      requestAdjust(ctx, state, paddingDiff);
     }
   };
   if (isFirst) {
-    initalizeStateVars();
+    initializeStateVars();
+    updateAllPositions(ctx, state);
   }
+  const initialContentOffset = React3.useMemo(() => {
+    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 0;
+  }, [renderNum]);
   if (isFirst || didDataChange || numColumnsProp !== peek$(ctx, "numColumns")) {
     refState.current.lastBatchingAction = Date.now();
     if (!keyExtractorProp && !isFirst && didDataChange) {
@@ -2111,23 +2861,29 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       refState.current.sizes.clear();
       refState.current.positions.clear();
     }
-    refState.current.previousTotalSize = peek$(ctx, "totalSize");
-    calcTotalSizesAndPositions({ forgetPositions: false });
   }
-  React2.useEffect(() => {
-    if (initialScroll && ListHeaderComponent) {
-      const dispose = listen$(ctx, "headerSize", (size) => {
-        if (size > 0) {
-          scrollToIndex({ ...initialScroll, animated: false });
-          dispose == null ? void 0 : dispose();
+  const onLayoutHeader = React3.useCallback((rect, fromLayoutEffect) => {
+    const size = rect[horizontal ? "width" : "height"];
+    set$(ctx, "headerSize", size);
+    if ((initialScroll == null ? void 0 : initialScroll.index) !== void 0) {
+      if (IsNewArchitecture && reactNative.Platform.OS !== "android") {
+        if (fromLayoutEffect) {
+          setRenderNum((v) => v + 1);
         }
-      });
-      setTimeout(dispose, 0);
-      return dispose;
+      } else {
+        setTimeout(() => {
+          scrollToIndex(ctx, state, { ...initialScroll, animated: false });
+        }, 17);
+      }
     }
   }, []);
-  React2.useEffect(() => {
-    const didAllocateContainers = doInitialAllocateContainers();
+  React3.useLayoutEffect(() => {
+    if (snapToIndices) {
+      updateSnapToOffsets(ctx, state);
+    }
+  }, [snapToIndices]);
+  React3.useLayoutEffect(() => {
+    const didAllocateContainers = doInitialAllocateContainersCallback();
     if (!didAllocateContainers) {
       checkResetContainers(
         /*isFirst*/
@@ -2135,475 +2891,218 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       );
     }
   }, [dataProp, numColumnsProp]);
-  React2.useEffect(() => {
+  React3.useLayoutEffect(() => {
     set$(ctx, "extraData", extraData);
   }, [extraData]);
-  refState.current.renderItem = renderItem2;
-  React2.useEffect(initalizeStateVars, [
+  React3.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);
+        }
+      }
+    }
+  }, []);
+  React3.useLayoutEffect(initializeStateVars, [
     memoizedLastItemKeys.join(","),
     numColumnsProp,
     stylePaddingTopState,
     stylePaddingBottomState
   ]);
-  const getRenderedItem = React2.useCallback((key) => {
-    const state = refState.current;
-    if (!state) {
-      return null;
-    }
-    const { data, indexByKey } = state;
-    const index = indexByKey.get(key);
-    if (index === void 0) {
-      return null;
-    }
-    const renderItemProp = refState.current.renderItem;
-    let renderedItem = null;
-    if (renderItemProp) {
-      const itemProps = {
-        item: data[index],
-        index,
-        extraData: peek$(ctx, "extraData")
-      };
-      renderedItem = React2__namespace.createElement(renderItemProp, itemProps);
-    }
-    return { index, item: data[index], renderedItem };
-  }, []);
-  const doInitialAllocateContainers = () => {
-    const state = refState.current;
-    const { scrollLength, data } = state;
-    if (scrollLength > 0 && data.length > 0 && !peek$(ctx, "numContainers")) {
-      const averageItemSize = getEstimatedItemSize ? getEstimatedItemSize(0, data[0]) : estimatedItemSize;
-      const numContainers = Math.ceil((scrollLength + scrollBuffer * 2) / averageItemSize) * numColumnsProp;
-      for (let i = 0; i < numContainers; i++) {
-        set$(ctx, `containerPosition${i}`, ANCHORED_POSITION_OUT_OF_VIEW);
-        set$(ctx, `containerColumn${i}`, -1);
-      }
-      set$(ctx, "numContainers", numContainers);
-      set$(ctx, "numContainersPooled", numContainers * initialContainerPoolRatio);
-      if (initialScroll) {
-        requestAnimationFrame(() => {
-          calculateItemsInView(
-            /*isReset*/
-            true
-          );
-        });
-      } else {
-        calculateItemsInView(
-          /*isReset*/
-          true
-        );
-      }
-      return true;
-    }
+  const doInitialAllocateContainersCallback = () => {
+    return doInitialAllocateContainers(ctx, state);
   };
-  React2.useEffect(() => {
-    const state = refState.current;
+  React3.useEffect(() => {
     const viewability = setupViewability({
+      onViewableItemsChanged,
       viewabilityConfig,
-      viewabilityConfigCallbackPairs,
-      onViewableItemsChanged
+      viewabilityConfigCallbackPairs
     });
     state.viewabilityConfigCallbackPairs = viewability;
     state.enableScrollForNextCalculateItemsInView = !viewability;
   }, [viewabilityConfig, viewabilityConfigCallbackPairs, onViewableItemsChanged]);
-  useInit(() => {
-    doInitialAllocateContainers();
-  });
-  const updateItemSize = React2.useCallback(
-    (itemKey, sizeObj, fromFixGaps) => {
-      const state = refState.current;
-      const {
-        sizes,
-        indexByKey,
-        sizesKnown,
-        data,
-        rowHeights,
-        startBuffered,
-        endBuffered,
-        averageSizes,
-        queuedInitialLayout
-      } = state;
-      if (!data) {
-        return;
-      }
-      const index = indexByKey.get(itemKey);
-      const numColumns = peek$(ctx, "numColumns");
-      state.scrollForNextCalculateItemsInView = void 0;
-      state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, index) : index;
-      const prevSize = getItemSize(itemKey, index, data);
-      const prevSizeKnown = sizesKnown.get(itemKey);
-      let needsCalculate = false;
-      let needsUpdateContainersDidLayout = false;
-      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] = {
-          num: 0,
-          avg: 0
-        };
-      }
-      averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
-      averages.num++;
-      if (!prevSize || Math.abs(prevSize - size) > 0.1) {
-        let diff;
-        needsCalculate = true;
-        if (numColumns > 1) {
-          const rowNumber = Math.floor(index / numColumnsProp);
-          const prevSizeInRow = getRowHeight(rowNumber);
-          sizes.set(itemKey, size);
-          rowHeights.delete(rowNumber);
-          const sizeInRow = getRowHeight(rowNumber);
-          diff = sizeInRow - prevSizeInRow;
-        } else {
-          sizes.set(itemKey, size);
-          diff = size - prevSize;
-        }
-        if (__DEV__ && suggestEstimatedItemSize) {
-          if (state.timeoutSizeMessage) {
-            clearTimeout(state.timeoutSizeMessage);
-          }
-          state.timeoutSizeMessage = setTimeout(() => {
-            state.timeoutSizeMessage = void 0;
-            const num = sizesKnown.size;
-            const avg = state.averageSizes[""].avg;
-            console.warn(
-              `[legend-list] estimatedItemSize or getEstimatedItemSize are not defined. Based on the ${num} items rendered so far, the optimal estimated size is ${avg}.`
-            );
-          }, 1e3);
-        }
-        state.scrollForNextCalculateItemsInView = void 0;
-        addTotalSize(itemKey, diff, 0);
-        if (prevSizeKnown !== void 0 && Math.abs(prevSizeKnown - size) > 5) {
-          doMaintainScrollAtEnd(false);
-        }
-        if (onItemSizeChanged) {
-          onItemSizeChanged({
-            size,
-            previous: prevSize,
-            index,
-            itemKey,
-            itemData: data[index]
-          });
-        }
-      }
-      if (!queuedInitialLayout && checkAllSizesKnown()) {
-        needsUpdateContainersDidLayout = true;
-      }
-      let isInView = index >= startBuffered && index <= endBuffered;
-      if (!isInView) {
-        const numContainers = ctx.values.get("numContainers");
-        for (let i = 0; i < numContainers; i++) {
-          if (peek$(ctx, `containerItemKey${i}`) === itemKey) {
-            isInView = true;
-            break;
-          }
-        }
-      }
-      if (needsUpdateContainersDidLayout || !fromFixGaps && needsCalculate && (isInView || !queuedInitialLayout)) {
-        const scrollVelocity = state.scrollVelocity;
-        let didCalculate = false;
-        if ((Number.isNaN(scrollVelocity) || Math.abs(scrollVelocity) < 1 || state.scrollingTo !== void 0) && (!waitForInitialLayout || needsUpdateContainersDidLayout || queuedInitialLayout)) {
-          if (Date.now() - state.lastBatchingAction < 500) {
-            if (!state.queuedCalculateItemsInView) {
-              state.queuedCalculateItemsInView = requestAnimationFrame(() => {
-                state.queuedCalculateItemsInView = void 0;
-                calculateItemsInView();
-              });
-            }
-          } else {
-            calculateItemsInView();
-            didCalculate = true;
-          }
-        }
-        if (!didCalculate && !needsUpdateContainersDidLayout && IsNewArchitecture) {
-          fixGaps();
-        }
-      }
-      if (state.needsOtherAxisSize) {
-        const otherAxisSize = horizontal ? sizeObj.height : sizeObj.width;
-        const cur = peek$(ctx, "otherAxisSize");
-        if (!cur || otherAxisSize > cur) {
-          set$(ctx, "otherAxisSize", otherAxisSize);
-        }
-      }
-    },
-    []
-  );
-  const handleLayout = React2.useCallback((size) => {
-    const scrollLength = size[horizontal ? "width" : "height"];
-    const otherAxisSize = size[horizontal ? "height" : "width"];
-    const state = refState.current;
-    const didChange = scrollLength !== state.scrollLength;
-    const prevOtherAxisSize = state.otherAxisSize;
-    state.scrollLength = scrollLength;
-    state.otherAxisSize = otherAxisSize;
-    state.lastBatchingAction = Date.now();
-    state.scrollForNextCalculateItemsInView = void 0;
-    doInitialAllocateContainers();
-    doMaintainScrollAtEnd(false);
-    updateAlignItemsPaddingTop();
-    checkAtBottom();
-    checkAtTop();
-    if (didChange) {
-      calculateItemsInView();
-    }
-    if (didChange || otherAxisSize !== prevOtherAxisSize) {
-      set$(ctx, "scrollSize", { width: size.width, height: size.height });
-    }
-    if (refState.current) {
-      refState.current.needsOtherAxisSize = otherAxisSize - (stylePaddingTopState || 0) < 10;
-    }
-    if (__DEV__ && scrollLength === 0) {
-      warnDevOnce(
-        "height0",
-        `List ${horizontal ? "width" : "height"} is 0. You may need to set a style or \`flex: \` for the list, because children are absolutely positioned.`
-      );
-    }
-  }, []);
-  const onLayout = React2.useCallback((event) => {
+  if (!IsNewArchitecture) {
+    useInit(() => {
+      doInitialAllocateContainersCallback();
+    });
+  }
+  const onLayout = React3.useCallback((event) => {
     const layout = event.nativeEvent.layout;
-    handleLayout(layout);
-    layout[horizontal ? "width" : "height"];
-    layout[horizontal ? "height" : "width"];
+    handleLayout(ctx, state, layout, setCanRender);
     if (onLayoutProp) {
       onLayoutProp(event);
     }
   }, []);
-  if (IsNewArchitecture) {
-    React2.useLayoutEffect(() => {
-      var _a, _b;
-      const measured = (_b = (_a = refScroller.current) == null ? void 0 : _a.unstable_getBoundingClientRect) == null ? void 0 : _b.call(_a);
-      if (measured) {
-        const size = Math.floor(measured[horizontal ? "width" : "height"] * 8) / 8;
-        if (size) {
-          handleLayout(measured);
+  React3.useImperativeHandle(forwardedRef, () => {
+    const scrollIndexIntoView = (options) => {
+      const state2 = refState.current;
+      if (state2) {
+        const { index, ...rest2 } = options;
+        const { startNoBuffer, endNoBuffer } = state2;
+        if (index < startNoBuffer || index > endNoBuffer) {
+          const viewPosition = index < startNoBuffer ? 0 : 1;
+          scrollToIndex(ctx, state2, {
+            ...rest2,
+            index,
+            viewPosition
+          });
         }
       }
-    }, []);
-  }
-  const handleScroll = React2.useCallback(
-    (event) => {
-      var _a, _b, _c, _d;
-      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;
-      }
-      const state = refState.current;
-      const newScroll = event.nativeEvent.contentOffset[horizontal ? "x" : "y"];
-      state.scrollPending = newScroll;
-      if (state.ignoreScrollFromCalcTotal && newScroll !== 0) {
-        return;
-      }
-      updateScroll(newScroll);
-      (_d = state.onScroll) == null ? void 0 : _d.call(state, event);
-    },
-    []
-  );
-  const updateScroll = React2.useCallback((newScroll) => {
-    const state = refState.current;
-    const scrollingTo = state.scrollingTo;
-    if (scrollingTo !== void 0 && Math.abs(newScroll - scrollingTo.offset) < 10) {
-      finishScrollTo();
-    }
-    if (state.disableScrollJumpsFrom !== void 0) {
-      const scrollMinusAdjust = newScroll - state.scrollAdjustHandler.getAppliedAdjust();
-      if (Math.abs(scrollMinusAdjust - state.disableScrollJumpsFrom) > 200) {
-        return;
-      }
-      state.disableScrollJumpsFrom = void 0;
-    }
-    state.hasScrolled = true;
-    state.lastBatchingAction = Date.now();
-    const currentTime = performance.now();
-    if (scrollingTo === void 0 && !(state.scrollHistory.length === 0 && newScroll === initialContentOffset)) {
-      state.scrollHistory.push({ scroll: newScroll, time: currentTime });
-    }
-    if (state.scrollHistory.length > 5) {
-      state.scrollHistory.shift();
-    }
-    if (state.scrollTimer !== void 0) {
-      clearTimeout(state.scrollTimer);
-    }
-    state.scrollTimer = setTimeout(() => {
-      state.scrollVelocity = 0;
-    }, 500);
-    let velocity = 0;
-    if (state.scrollHistory.length >= 2) {
-      const newest = state.scrollHistory[state.scrollHistory.length - 1];
-      let oldest;
-      for (let i = 0; i < state.scrollHistory.length - 1; i++) {
-        const entry = state.scrollHistory[i];
-        if (newest.time - entry.time <= 100) {
-          oldest = entry;
-          break;
+    };
+    return {
+      flashScrollIndicators: () => refScroller.current.flashScrollIndicators(),
+      getNativeScrollRef: () => refScroller.current,
+      getScrollableNode: () => refScroller.current.getScrollableNode(),
+      getScrollResponder: () => refScroller.current.getScrollResponder(),
+      getState: () => {
+        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,
+          sizeAtIndex: (index) => state2.sizesKnown.get(getId(state2, index)),
+          sizes: state2.sizesKnown,
+          start: state2.startNoBuffer,
+          startBuffered: state2.startBuffered
+        } : {};
+      },
+      scrollIndexIntoView,
+      scrollItemIntoView: ({ item, ...props2 }) => {
+        const data = refState.current.props.data;
+        const index = data.indexOf(item);
+        if (index !== -1) {
+          scrollIndexIntoView({ index, ...props2 });
         }
-      }
-      if (oldest) {
-        const scrollDiff = newest.scroll - oldest.scroll;
-        const timeDiff = newest.time - oldest.time;
-        velocity = timeDiff > 0 ? scrollDiff / timeDiff : 0;
-      }
-    }
-    state.scrollPrev = state.scroll;
-    state.scrollPrevTime = state.scrollTime;
-    state.scroll = newScroll;
-    state.scrollTime = currentTime;
-    state.scrollVelocity = velocity;
-    calculateItemsInView();
-    checkAtBottom();
-    checkAtTop();
-  }, []);
-  React2.useImperativeHandle(
-    forwardedRef,
-    () => {
-      const scrollIndexIntoView = (options) => {
-        if (refState.current) {
-          const { index, ...rest2 } = options;
-          const { startNoBuffer, endNoBuffer } = refState.current;
-          if (index < startNoBuffer || index > endNoBuffer) {
-            const viewPosition = index < startNoBuffer ? 0 : 1;
-            scrollToIndex({
-              ...rest2,
-              viewPosition,
-              index
-            });
-          }
+      },
+      scrollToEnd: (options) => {
+        const data = refState.current.props.data;
+        const stylePaddingBottom = refState.current.props.stylePaddingBottom;
+        const index = data.length - 1;
+        if (index !== -1) {
+          const paddingBottom = stylePaddingBottom || 0;
+          const footerSize = peek$(ctx, "footerSize") || 0;
+          scrollToIndex(ctx, state, {
+            index,
+            viewOffset: -paddingBottom - footerSize + ((options == null ? void 0 : options.viewOffset) || 0),
+            viewPosition: 1,
+            ...options
+          });
         }
-      };
-      return {
-        flashScrollIndicators: () => refScroller.current.flashScrollIndicators(),
-        getNativeScrollRef: () => refScroller.current,
-        getScrollableNode: () => refScroller.current.getScrollableNode(),
-        getScrollResponder: () => refScroller.current.getScrollResponder(),
-        getState: () => {
-          const state = refState.current;
-          return state ? {
-            contentLength: state.totalSize,
-            end: state.endNoBuffer,
-            endBuffered: state.endBuffered,
-            isAtEnd: state.isAtEnd,
-            isAtStart: state.isAtStart,
-            scroll: state.scroll,
-            scrollLength: state.scrollLength,
-            start: state.startNoBuffer,
-            startBuffered: state.startBuffered
-          } : {};
-        },
-        scrollIndexIntoView,
-        scrollItemIntoView: ({ item, ...props2 }) => {
-          const { data } = refState.current;
-          const index = data.indexOf(item);
-          if (index !== -1) {
-            scrollIndexIntoView({ index, ...props2 });
-          }
-        },
-        scrollToIndex,
-        scrollToItem: ({ item, ...props2 }) => {
-          const { data } = refState.current;
-          const index = data.indexOf(item);
-          if (index !== -1) {
-            scrollToIndex({ index, ...props2 });
-          }
-        },
-        scrollToOffset: (params) => scrollTo(params),
-        scrollToEnd: (options) => {
-          const { data, stylePaddingBottom } = refState.current;
-          const index = data.length - 1;
-          if (index !== -1) {
-            const paddingBottom = stylePaddingBottom || 0;
-            const footerSize = peek$(ctx, "footerSize") || 0;
-            scrollToIndex({ index, viewPosition: 1, viewOffset: -paddingBottom - footerSize, ...options });
-          }
+      },
+      scrollToIndex: (params) => scrollToIndex(ctx, state, params),
+      scrollToItem: ({ item, ...props2 }) => {
+        const data = refState.current.props.data;
+        const index = data.indexOf(item);
+        if (index !== -1) {
+          scrollToIndex(ctx, state, { index, ...props2 });
         }
-      };
-    },
-    []
-  );
+      },
+      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);
+      }
+    };
+  }, []);
   if (reactNative.Platform.OS === "web") {
-    React2.useEffect(() => {
-      var _a;
+    React3.useEffect(() => {
       if (initialContentOffset) {
-        (_a = refState.current) == null ? void 0 : _a.scrollAdjustHandler.setDisableAdjust(true);
-        scrollTo({ offset: initialContentOffset, animated: false });
-        setTimeout(() => {
-          var _a2;
-          (_a2 = refState.current) == null ? void 0 : _a2.scrollAdjustHandler.setDisableAdjust(false);
-        }, 0);
+        scrollTo(state, { animated: false, offset: initialContentOffset });
       }
     }, []);
   }
-  return /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(
+  const fns = React3.useMemo(
+    () => ({
+      getRenderedItem: (key) => getRenderedItem(ctx, state, key),
+      onScroll: (event) => onScroll(ctx, state, event),
+      updateItemSize: (itemKey, sizeObj) => updateItemSize(ctx, state, itemKey, sizeObj)
+    }),
+    []
+  );
+  const animatedScrollHandler = React3.useMemo(() => {
+    const onScrollFn = scrollEventThrottle && scrollEventThrottle > 0 ? throttledOnScroll(fns.onScroll, scrollEventThrottle) : fns.onScroll;
+    if (stickyIndices == null ? void 0 : stickyIndices.length) {
+      const { animatedScrollY } = ctx;
+      return reactNative.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__namespace.createElement(React3__namespace.Fragment, null, /* @__PURE__ */ React3__namespace.createElement(
     ListComponent,
     {
       ...rest,
+      alignItemsAtEnd,
+      canRender,
+      contentContainerStyle,
+      getRenderedItem: fns.getRenderedItem,
       horizontal,
-      refScrollView: combinedRef,
       initialContentOffset,
-      getRenderedItem,
-      updateItemSize,
-      handleScroll,
+      ListEmptyComponent: dataProp.length === 0 ? ListEmptyComponent : void 0,
+      ListHeaderComponent,
+      maintainVisibleContentPosition,
+      onLayout,
+      onLayoutHeader,
       onMomentumScrollEnd: (event) => {
-        var _a;
-        const scrollingTo = (_a = refState.current) == null ? void 0 : _a.scrollingTo;
-        if (scrollingTo !== void 0) {
+        if (IsNewArchitecture) {
           requestAnimationFrame(() => {
-            scrollTo({ ...scrollingTo, animated: false });
-            refState.current.scrollingTo = void 0;
-            requestAnimationFrame(() => {
-              refState.current.scrollAdjustHandler.setDisableAdjust(false);
-            });
+            finishScrollTo(refState.current);
           });
-        }
-        const wasPaused = refState.current.scrollAdjustHandler.unPauseAdjust();
-        if (wasPaused) {
-          refState.current.scrollVelocity = 0;
-          refState.current.scrollHistory = [];
-          calculateItemsInView();
+        } else {
+          setTimeout(() => {
+            finishScrollTo(refState.current);
+          }, 1e3);
         }
         if (onMomentumScrollEnd) {
           onMomentumScrollEnd(event);
         }
       },
-      onLayout,
+      onScroll: animatedScrollHandler,
       recycleItems,
-      alignItemsAtEnd,
-      ListEmptyComponent: dataProp.length === 0 ? ListEmptyComponent : void 0,
-      ListHeaderComponent,
-      maintainVisibleContentPosition,
-      scrollEventThrottle: reactNative.Platform.OS === "web" ? 16 : void 0,
-      waitForInitialLayout,
-      refreshControl: refreshControl ? stylePaddingTopState > 0 ? React2__namespace.cloneElement(refreshControl, {
+      refreshControl: refreshControl ? stylePaddingTopState > 0 ? React3__namespace.cloneElement(refreshControl, {
         progressViewOffset: (refreshControl.props.progressViewOffset || 0) + stylePaddingTopState
-      }) : refreshControl : onRefresh && /* @__PURE__ */ React2__namespace.createElement(
+      }) : refreshControl : onRefresh && /* @__PURE__ */ React3__namespace.createElement(
         reactNative.RefreshControl,
         {
-          refreshing: !!refreshing,
           onRefresh,
-          progressViewOffset: (progressViewOffset || 0) + stylePaddingTopState
+          progressViewOffset: (progressViewOffset || 0) + stylePaddingTopState,
+          refreshing: !!refreshing
         }
       ),
+      refScrollView: combinedRef,
+      scrollAdjustHandler: (_a = refState.current) == null ? void 0 : _a.scrollAdjustHandler,
+      scrollEventThrottle: reactNative.Platform.OS === "web" ? 16 : void 0,
+      snapToIndices,
+      stickyIndices,
       style,
-      contentContainerStyle
+      updateItemSize: fns.updateItemSize,
+      waitForInitialLayout
     }
-  ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React2__namespace.createElement(DebugView, { state: refState.current }));
-});
-var typedForwardRef2 = React2.forwardRef;
-var renderItem = ({ item }) => item;
-var LazyLegendList = typedForwardRef2(function LazyLegendList2(props, forwardedRef) {
-  const { LegendList: LegendListProp, children, ...rest } = props;
-  const LegendListComponent = LegendListProp != null ? LegendListProp : list.LegendList;
-  const data = (isArray(children) ? children : React2__namespace.Children.toArray(children)).flat(1);
-  return (
-    // @ts-expect-error TODO: Fix this type
-    /* @__PURE__ */ React2__namespace.createElement(LegendListComponent, { ...rest, data, renderItem, ref: forwardedRef })
-  );
+  ), __DEV__ && ENABLE_DEBUG_VIEW && /* @__PURE__ */ React3__namespace.createElement(DebugView, { state: refState.current }));
 });
 
-exports.LazyLegendList = LazyLegendList;
 exports.LegendList = LegendList;
 exports.useIsLastItem = useIsLastItem;
 exports.useListScrollSize = useListScrollSize;
 exports.useRecyclingEffect = useRecyclingEffect;
 exports.useRecyclingState = useRecyclingState;
+exports.useSyncLayout = useSyncLayout;
 exports.useViewability = useViewability;
 exports.useViewabilityAmount = useViewabilityAmount;