@legendapp/list 3.3.2 → 3.3.4

package/react-native.web.mjs

@@ -1,5 +1,5 @@
 import * as React3 from 'react';
-import { forwardRef, useReducer, useEffect, createContext, useRef, useState, useMemo, useCallback, useLayoutEffect, useImperativeHandle, useContext } from 'react';
+import { forwardRef, useReducer, useEffect, createContext, useRef, useMemo, useCallback, useImperativeHandle, useLayoutEffect, useState, useContext } from 'react';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 import * as ReactDOM from 'react-dom';
 import { flushSync } from 'react-dom';
@@ -49,6 +49,12 @@ function isHorizontalRTL(state) {
 function isHorizontalRTLProps(props) {
   return !!(props == null ? void 0 : props.horizontal) && isRTLProps(props);
 }
+function getStylePaddingEnd(props) {
+  if (!(props == null ? void 0 : props.horizontal)) {
+    return (props == null ? void 0 : props.stylePaddingBottom) || 0;
+  }
+  return (isHorizontalRTLProps(props) ? props.stylePaddingLeft : props.stylePaddingRight) || 0;
+}
 function getLogicalHorizontalMaxOffset(state, contentWidth) {
   var _a3;
   return (_a3 = getHorizontalMaxOffset(state, contentWidth)) != null ? _a3 : 0;
@@ -141,11 +147,13 @@ function StateProvider({ children }) {
     mapViewabilityCallbacks: /* @__PURE__ */ new Map(),
     mapViewabilityConfigStates: /* @__PURE__ */ new Map(),
     mapViewabilityValues: /* @__PURE__ */ new Map(),
+    pendingContainerIds: void 0,
     positionListeners: /* @__PURE__ */ new Map(),
     scrollAxisGap: 0,
     state: void 0,
     values: /* @__PURE__ */ new Map([
       ["alignItemsAtEndPadding", 0],
+      ["containerLayoutEpoch", 0],
       ["stylePaddingTop", 0],
       ["headerSize", 0],
       ["numContainers", 0],
@@ -167,6 +175,14 @@ function useStateContext() {
   return React3.useContext(ContextState);
 }
 function createSelectorFunctionsArr(ctx, signalNames) {
+  if (!ctx) {
+    const emptyValues = [];
+    return {
+      get: () => emptyValues,
+      subscribe: () => () => {
+      }
+    };
+  }
   let lastValues = [];
   let lastSignalValues = [];
   return {
@@ -273,7 +289,7 @@ function getContentInsetEndAdjustmentEnd(adjustment) {
   return Math.max(0, adjustment != null ? adjustment : 0);
 }
 function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
-  var _a3, _b;
+  var _a3;
   const state = ctx.state;
   const { props } = state;
   const horizontal = props.horizontal;
@@ -284,8 +300,8 @@ function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
     contentInsetEndAdjustmentOverride != null ? contentInsetEndAdjustmentOverride : props.contentInsetEndAdjustment
   );
   const anchoredEndSpaceSize = peek$(ctx, "anchoredEndSpaceSize");
-  const anchoredEndInset = ((_a3 = props.anchoredEndSpace) == null ? void 0 : _a3.includeInEndInset) && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
-  const overrideInset = (_b = state.contentInsetOverride) != null ? _b : void 0;
+  const anchoredEndInset = props.anchoredEndSpace && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
+  const overrideInset = (_a3 = state.contentInsetOverride) != null ? _a3 : void 0;
   const adjustedBaseEndInset = baseEndInset + contentInsetEndAdjustment;
   if (overrideInset) {
     const mergedInset = { bottom: 0, left: 0, right: 0, ...baseInset, ...overrideInset };
@@ -301,14 +317,15 @@ function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
 function getContentSize(ctx) {
   var _a3, _b;
   const { values, state } = ctx;
-  const stylePaddingTop = values.get("stylePaddingTop") || 0;
-  const stylePaddingBottom = state.props.stylePaddingBottom || 0;
+  const stylePaddingStart = state.props.horizontal ? state.props.stylePaddingLeft || 0 : values.get("stylePaddingTop") || 0;
+  const stylePaddingEnd = state.props.horizontal ? state.props.stylePaddingRight || 0 : state.props.stylePaddingBottom || 0;
   const alignItemsAtEndPadding = values.get("alignItemsAtEndPadding") || 0;
   const headerSize = values.get("headerSize") || 0;
   const footerSize = values.get("footerSize") || 0;
-  const contentInsetBottom = getContentInsetEnd(ctx);
+  const contentInsetEnd = getContentInsetEnd(ctx);
   const totalSize = (_b = (_a3 = state.pendingTotalSize) != null ? _a3 : state.totalSize) != null ? _b : values.get("totalSize");
-  return headerSize + footerSize + totalSize + stylePaddingTop + alignItemsAtEndPadding + stylePaddingBottom + (contentInsetBottom || 0);
+  const layoutSize = Math.max(0, totalSize - (state.props.data.length > 0 ? ctx.scrollAxisGap : 0));
+  return headerSize + footerSize + layoutSize + stylePaddingStart + alignItemsAtEndPadding + stylePaddingEnd + (contentInsetEnd || 0);
 }
 
 // src/components/DebugView.tsx
@@ -370,6 +387,18 @@ function useInterval(callback, delay) {
   }, [delay]);
 }
 
+// src/constants-platform.ts
+var IsNewArchitecture = true;
+
+// src/core/containerLayoutBaseline.ts
+var containerLayoutBaselines = /* @__PURE__ */ new WeakMap();
+function getContainerLayoutBaseline(element) {
+  return containerLayoutBaselines.get(element);
+}
+function setContainerLayoutBaseline(element, size) {
+  containerLayoutBaselines.set(element, size);
+}
+
 // src/utils/devEnvironment.ts
 var metroDev = typeof __DEV__ !== "undefined" ? __DEV__ : void 0;
 var _a;
@@ -383,520 +412,239 @@ var POSITION_OUT_OF_VIEW = -1e7;
 var EDGE_POSITION_EPSILON = 1;
 var ENABLE_DEVMODE = IS_DEV && false;
 var ENABLE_DEBUG_VIEW = IS_DEV && false;
-var typedForwardRef = React3.forwardRef;
-var typedMemo = React3.memo;
-var getComponent = (Component) => {
-  if (React3.isValidElement(Component)) {
-    return Component;
-  }
-  if (Component) {
-    return /* @__PURE__ */ React3.createElement(Component, null);
-  }
-  return null;
-};
 
-// src/utils/helpers.ts
-function isFunction(obj) {
-  return typeof obj === "function";
-}
-function isArray(obj) {
-  return Array.isArray(obj);
+// src/core/deferredPublicOnScroll.ts
+function withResolvedContentOffset(state, event, resolvedOffset) {
+  return {
+    ...event,
+    nativeEvent: {
+      ...event.nativeEvent,
+      contentOffset: state.props.horizontal ? { x: resolvedOffset, y: 0 } : { x: 0, y: resolvedOffset }
+    }
+  };
 }
-var warned = /* @__PURE__ */ new Set();
-function warnDevOnce(id, text) {
-  if (IS_DEV && !warned.has(id)) {
-    warned.add(id);
-    console.warn(`[legend-list] ${text}`);
+function releaseDeferredPublicOnScroll(ctx, resolvedOffset) {
+  var _a3, _b, _c, _d;
+  const state = ctx.state;
+  const deferredEvent = state.deferredPublicOnScrollEvent;
+  state.deferredPublicOnScrollEvent = void 0;
+  if (deferredEvent) {
+    (_d = (_c = state.props).onScroll) == null ? void 0 : _d.call(
+      _c,
+      withResolvedContentOffset(
+        state,
+        deferredEvent,
+        (_b = (_a3 = resolvedOffset != null ? resolvedOffset : state.scrollPending) != null ? _a3 : state.scroll) != null ? _b : 0
+      )
+    );
   }
 }
-function roundSize(size) {
-  return Math.floor(size * 8) / 8;
+
+// src/core/initialScrollSession.ts
+var INITIAL_SCROLL_MIN_TARGET_OFFSET = 1;
+function hasInitialScrollSessionCompletion(completion) {
+  return !!((completion == null ? void 0 : completion.didDispatchNativeScroll) || (completion == null ? void 0 : completion.didRetrySilentInitialScroll) || (completion == null ? void 0 : completion.watchdog));
 }
-function isNullOrUndefined(value) {
-  return value === null || value === void 0;
+function clearInitialScrollSession(state) {
+  state.initialScrollSession = void 0;
+  return void 0;
 }
-function getPadding(s, type) {
-  var _a3, _b, _c;
-  const axisPadding = type === "Left" || type === "Right" ? s.paddingHorizontal : s.paddingVertical;
-  return (_c = (_b = (_a3 = s[`padding${type}`]) != null ? _a3 : axisPadding) != null ? _b : s.padding) != null ? _c : 0;
+function createInitialScrollSession(options) {
+  const { bootstrap, completion, kind, previousDataLength } = options;
+  return kind === "offset" ? {
+    completion,
+    kind,
+    previousDataLength
+  } : {
+    bootstrap,
+    completion,
+    kind,
+    previousDataLength
+  };
 }
-function extractPadding(style, contentContainerStyle, type) {
-  return getPadding(style, type) + getPadding(contentContainerStyle, type);
+function ensureInitialScrollSessionCompletion(state, kind = ((_b) => (_b = ((_a3) => (_a3 = state.initialScrollSession) == null ? void 0 : _a3.kind)()) != null ? _b : "bootstrap")()) {
+  var _a4, _b2;
+  if (!state.initialScrollSession) {
+    state.initialScrollSession = createInitialScrollSession({
+      completion: {},
+      kind,
+      previousDataLength: 0
+    });
+  } else if (state.initialScrollSession.kind !== kind) {
+    state.initialScrollSession = createInitialScrollSession({
+      bootstrap: state.initialScrollSession.kind === "bootstrap" ? state.initialScrollSession.bootstrap : void 0,
+      completion: state.initialScrollSession.completion,
+      kind,
+      previousDataLength: state.initialScrollSession.previousDataLength
+    });
+  }
+  (_b2 = (_a4 = state.initialScrollSession).completion) != null ? _b2 : _a4.completion = {};
+  return state.initialScrollSession.completion;
 }
-function findContainerId(ctx, key) {
-  var _a3, _b;
-  const directMatch = (_b = (_a3 = ctx.state) == null ? void 0 : _a3.containerItemKeys) == null ? void 0 : _b.get(key);
-  if (directMatch !== void 0) {
-    return directMatch;
+var initialScrollCompletion = {
+  didDispatchNativeScroll(state) {
+    var _a3, _b;
+    return !!((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.didDispatchNativeScroll);
+  },
+  didRetrySilentInitialScroll(state) {
+    var _a3, _b;
+    return !!((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.didRetrySilentInitialScroll);
+  },
+  markInitialScrollNativeDispatch(state) {
+    ensureInitialScrollSessionCompletion(state).didDispatchNativeScroll = true;
+  },
+  markSilentInitialScrollRetry(state) {
+    ensureInitialScrollSessionCompletion(state).didRetrySilentInitialScroll = true;
+  },
+  resetFlags(state) {
+    if (!state.initialScrollSession) {
+      return;
+    }
+    const completion = ensureInitialScrollSessionCompletion(state, state.initialScrollSession.kind);
+    completion.didDispatchNativeScroll = void 0;
+    completion.didRetrySilentInitialScroll = void 0;
   }
-  const numContainers = peek$(ctx, "numContainers");
-  for (let i = 0; i < numContainers; i++) {
-    const itemKey = peek$(ctx, `containerItemKey${i}`);
-    if (itemKey === key) {
-      return i;
+};
+var initialScrollWatchdog = {
+  clear(state) {
+    initialScrollWatchdog.set(state, void 0);
+  },
+  didReachTarget(newScroll, watchdog) {
+    const nextDistance = Math.abs(newScroll - watchdog.targetOffset);
+    return nextDistance <= INITIAL_SCROLL_MIN_TARGET_OFFSET;
+  },
+  get(state) {
+    var _a3, _b;
+    return (_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.watchdog;
+  },
+  hasNonZeroTargetOffset(targetOffset) {
+    return targetOffset !== void 0 && targetOffset > INITIAL_SCROLL_MIN_TARGET_OFFSET;
+  },
+  isAtZeroTargetOffset(targetOffset) {
+    return targetOffset <= INITIAL_SCROLL_MIN_TARGET_OFFSET;
+  },
+  set(state, watchdog) {
+    var _a3, _b;
+    if (!watchdog && !((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.watchdog)) {
+      return;
     }
+    const completion = ensureInitialScrollSessionCompletion(state);
+    completion.watchdog = watchdog ? {
+      startScroll: watchdog.startScroll,
+      targetOffset: watchdog.targetOffset
+    } : void 0;
   }
-  return -1;
+};
+function setInitialScrollSession(state, options = {}) {
+  var _a3, _b, _c, _d;
+  const existingSession = state.initialScrollSession;
+  const kind = (_a3 = options.kind) != null ? _a3 : existingSession == null ? void 0 : existingSession.kind;
+  const completion = existingSession == null ? void 0 : existingSession.completion;
+  const existingBootstrap = (existingSession == null ? void 0 : existingSession.kind) === "bootstrap" ? existingSession.bootstrap : void 0;
+  const bootstrap = kind === "bootstrap" ? options.bootstrap === null ? void 0 : (_b = options.bootstrap) != null ? _b : existingBootstrap : void 0;
+  if (!kind) {
+    return clearInitialScrollSession(state);
+  }
+  if (!state.initialScroll && !bootstrap && !hasInitialScrollSessionCompletion(completion)) {
+    return clearInitialScrollSession(state);
+  }
+  const previousDataLength = (_d = (_c = options.previousDataLength) != null ? _c : existingSession == null ? void 0 : existingSession.previousDataLength) != null ? _d : 0;
+  state.initialScrollSession = createInitialScrollSession({
+    bootstrap,
+    completion,
+    kind,
+    previousDataLength
+  });
+  return state.initialScrollSession;
 }
 
-// src/components/PositionView.tsx
-var isRNWeb = typeof document !== "undefined" && !!document.getElementById("react-native-stylesheet");
-var baseCss = {
-  contain: "paint layout style",
-  ...isRNWeb ? {
-    display: "flex",
-    flexDirection: "column"
-  } : {}
+// src/utils/checkThreshold.ts
+var HYSTERESIS_MULTIPLIER = 1.3;
+function isOutsideThresholdHysteresis(distance, atThreshold, threshold) {
+  const absDistance = Math.abs(distance);
+  return !atThreshold && threshold > 0 && absDistance >= threshold * HYSTERESIS_MULTIPLIER || !atThreshold && threshold <= 0 && absDistance > 0;
+}
+var checkThreshold = (distance, atThreshold, threshold, wasReached, snapshot, context, onReached, setSnapshot) => {
+  const absDistance = Math.abs(distance);
+  const within = atThreshold || threshold > 0 && absDistance <= threshold;
+  const updateSnapshot = () => {
+    setSnapshot({
+      atThreshold,
+      contentSize: context.contentSize,
+      dataLength: context.dataLength,
+      scrollPosition: context.scrollPosition
+    });
+  };
+  if (!wasReached) {
+    if (!within) {
+      return false;
+    }
+    onReached(distance);
+    updateSnapshot();
+    return true;
+  }
+  const reset = isOutsideThresholdHysteresis(distance, atThreshold, threshold);
+  if (reset) {
+    setSnapshot(void 0);
+    return false;
+  }
+  if (within) {
+    const changed = !snapshot || snapshot.atThreshold !== atThreshold || snapshot.contentSize !== context.contentSize || snapshot.dataLength !== context.dataLength;
+    if (changed) {
+      updateSnapshot();
+    }
+  }
+  return true;
 };
-var PositionViewState = typedMemo(function PositionViewState2({
-  id,
-  horizontal,
-  style,
-  refView,
-  ...props
-}) {
-  const [position = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
-  const composed = isArray(style) ? Object.assign({}, ...style) : style;
-  const combinedStyle = horizontal ? { ...baseCss, ...composed, left: position } : { ...baseCss, ...composed, top: position };
-  const {
-    animatedScrollY: _animatedScrollY,
-    index,
-    onLayout: _onLayout,
-    onLayoutChange: _onLayoutChange,
-    stickyHeaderConfig: _stickyHeaderConfig,
-    ...webProps
-  } = props;
-  return /* @__PURE__ */ React3.createElement("div", { "data-index": index, ref: refView, ...webProps, style: combinedStyle });
-});
-var PositionViewSticky = typedMemo(function PositionViewSticky2({
-  id,
-  horizontal,
-  style,
-  refView,
-  index,
-  animatedScrollY: _animatedScrollY,
-  stickyHeaderConfig,
-  onLayout: _onLayout,
-  onLayoutChange: _onLayoutChange,
-  children,
-  ...webProps
-}) {
-  const [position = POSITION_OUT_OF_VIEW, activeStickyIndex] = useArr$([
-    `containerPosition${id}`,
-    "activeStickyIndex"
-  ]);
-  const composed = React3.useMemo(
-    () => {
-      var _a3;
-      return (_a3 = isArray(style) ? Object.assign({}, ...style) : style) != null ? _a3 : {};
-    },
-    [style]
-  );
-  const viewStyle = React3.useMemo(() => {
-    var _a3;
-    const styleBase = { ...baseCss, ...composed };
-    delete styleBase.transform;
-    const offset = (_a3 = stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset) != null ? _a3 : 0;
-    const isActive = activeStickyIndex === index;
-    styleBase.position = isActive ? "sticky" : "absolute";
-    styleBase.zIndex = index + 1e3;
-    if (horizontal) {
-      styleBase.left = isActive ? offset : position;
-    } else {
-      styleBase.top = isActive ? offset : position;
-    }
-    return styleBase;
-  }, [composed, horizontal, position, index, activeStickyIndex, stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset]);
-  const renderStickyHeaderBackdrop = React3.useMemo(
-    () => (stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent) ? /* @__PURE__ */ React3.createElement(
-      "div",
-      {
-        style: {
-          inset: 0,
-          pointerEvents: "none",
-          position: "absolute"
-        }
-      },
-      getComponent(stickyHeaderConfig.backdropComponent)
-    ) : null,
-    [stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent]
-  );
-  return /* @__PURE__ */ React3.createElement(
-    "div",
-    {
-      "data-index": index,
-      ref: refView,
-      style: viewStyle,
-      ...webProps
-    },
-    renderStickyHeaderBackdrop,
-    children
-  );
-});
-var PositionView = PositionViewState;
-
-// src/constants-platform.ts
-var IsNewArchitecture = true;
-function useInit(cb) {
-  useState(() => cb());
-}
-
-// src/state/ContextContainer.ts
-var ContextContainer = createContext(null);
-var NO_CONTAINER_ID = -1;
-function useContextContainer() {
-  return useContext(ContextContainer);
-}
-function useContainerItemInfo(containerContext) {
-  var _a3;
-  const containerId = (_a3 = containerContext == null ? void 0 : containerContext.containerId) != null ? _a3 : NO_CONTAINER_ID;
-  const [itemInfo] = useArr$([`containerItemInfo${containerId}`]);
-  return containerContext ? itemInfo : void 0;
-}
-function useContainerItemKey(containerContext) {
-  var _a3;
-  const containerId = (_a3 = containerContext == null ? void 0 : containerContext.containerId) != null ? _a3 : NO_CONTAINER_ID;
-  const [itemKey] = useArr$([`containerItemKey${containerId}`]);
-  return containerContext ? itemKey : void 0;
-}
-function useAdaptiveRender() {
-  const [mode] = useArr$(["adaptiveRender"]);
-  return mode;
-}
-function useAdaptiveRenderChange(callback) {
-  const ctx = useStateContext();
-  const callbackRef = useRef(callback);
-  callbackRef.current = callback;
-  useLayoutEffect(() => {
-    let mode = peek$(ctx, "adaptiveRender");
-    return listen$(ctx, "adaptiveRender", (nextMode) => {
-      if (mode !== nextMode) {
-        mode = nextMode;
-        callbackRef.current(nextMode);
-      }
-    });
-  }, [ctx]);
-}
-function useViewability(callback, configId) {
-  const ctx = useStateContext();
-  const containerContext = useContextContainer();
-  useInit(() => {
-    if (!containerContext) {
-      return;
-    }
-    const { containerId } = containerContext;
-    const key = containerId + (configId != null ? configId : "");
-    const value = ctx.mapViewabilityValues.get(key);
-    if (value) {
-      callback(value);
-    }
-  });
-  useEffect(() => {
-    if (!containerContext) {
-      return;
-    }
-    const { containerId } = containerContext;
-    const key = containerId + (configId != null ? configId : "");
-    ctx.mapViewabilityCallbacks.set(key, callback);
-    return () => {
-      ctx.mapViewabilityCallbacks.delete(key);
-    };
-  }, [ctx, callback, configId, containerContext]);
-}
-function useViewabilityAmount(callback) {
-  const ctx = useStateContext();
-  const containerContext = useContextContainer();
-  useInit(() => {
-    if (!containerContext) {
-      return;
-    }
-    const { containerId } = containerContext;
-    const value = ctx.mapViewabilityAmountValues.get(containerId);
-    if (value) {
-      callback(value);
-    }
-  });
-  useEffect(() => {
-    if (!containerContext) {
-      return;
-    }
-    const { containerId } = containerContext;
-    ctx.mapViewabilityAmountCallbacks.set(containerId, callback);
-    return () => {
-      ctx.mapViewabilityAmountCallbacks.delete(containerId);
-    };
-  }, [ctx, callback, containerContext]);
-}
-function useRecyclingEffect(effect) {
-  const containerContext = useContextContainer();
-  const itemInfo = useContainerItemInfo(containerContext);
-  const prevInfo = useRef(void 0);
-  useEffect(() => {
-    if (!itemInfo) {
-      return;
-    }
-    let ret;
-    if (prevInfo.current) {
-      ret = effect({
-        index: itemInfo.index,
-        item: itemInfo.value,
-        prevIndex: prevInfo.current.index,
-        prevItem: prevInfo.current.value
-      });
-    }
-    prevInfo.current = itemInfo;
-    return ret;
-  }, [effect, itemInfo]);
-}
-function useRecyclingState(valueOrFun) {
-  var _a3;
-  const containerContext = useContextContainer();
-  const itemInfo = useContainerItemInfo(containerContext);
-  const computeValue = (info) => {
-    if (isFunction(valueOrFun)) {
-      const initializer = valueOrFun;
-      return info ? initializer({
-        index: info.index,
-        item: info.value,
-        prevIndex: void 0,
-        prevItem: void 0
-      }) : initializer();
-    }
-    return valueOrFun;
-  };
-  const [stateValue, setStateValue] = useState(() => {
-    return computeValue(itemInfo);
-  });
-  const prevItemKeyRef = useRef((_a3 = itemInfo == null ? void 0 : itemInfo.itemKey) != null ? _a3 : null);
-  if (itemInfo && prevItemKeyRef.current !== itemInfo.itemKey) {
-    prevItemKeyRef.current = itemInfo.itemKey;
-    setStateValue(computeValue(itemInfo));
-  }
-  const triggerLayout = containerContext == null ? void 0 : containerContext.triggerLayout;
-  const setState = useCallback(
-    (newState) => {
-      if (!triggerLayout) {
-        return;
-      }
-      setStateValue((prevValue) => {
-        return isFunction(newState) ? newState(prevValue) : newState;
-      });
-      triggerLayout();
-    },
-    [triggerLayout]
-  );
-  return [stateValue, setState];
-}
-function useIsLastItem() {
-  const containerContext = useContextContainer();
-  const itemKey = useContainerItemKey(containerContext);
-  const isLast = useSelector$("lastItemKeys", (lastItemKeys) => {
-    if (containerContext && !isNullOrUndefined(itemKey)) {
-      return (lastItemKeys == null ? void 0 : lastItemKeys.includes(itemKey)) || false;
-    }
-    return false;
-  });
-  return isLast;
-}
-function useListScrollSize() {
-  const [scrollSize] = useArr$(["scrollSize"]);
-  return scrollSize;
-}
-var noop = () => {
-};
-function useSyncLayout() {
-  const containerContext = useContextContainer();
-  return containerContext ? containerContext.triggerLayout : noop;
-}
-
-// src/components/Separator.tsx
-function Separator({ ItemSeparatorComponent, leadingItem }) {
-  const isLastItem = useIsLastItem();
-  return isLastItem ? null : /* @__PURE__ */ React3.createElement(ItemSeparatorComponent, { leadingItem });
-}
 
-// src/core/deferredPublicOnScroll.ts
-function withResolvedContentOffset(state, event, resolvedOffset) {
-  return {
-    ...event,
-    nativeEvent: {
-      ...event.nativeEvent,
-      contentOffset: state.props.horizontal ? { x: resolvedOffset, y: 0 } : { x: 0, y: resolvedOffset }
-    }
-  };
-}
-function releaseDeferredPublicOnScroll(ctx, resolvedOffset) {
-  var _a3, _b, _c, _d;
+// src/utils/edgeReachedGate.ts
+function resetEdgeLatch(ctx, edge) {
   const state = ctx.state;
-  const deferredEvent = state.deferredPublicOnScrollEvent;
-  state.deferredPublicOnScrollEvent = void 0;
-  if (deferredEvent) {
-    (_d = (_c = state.props).onScroll) == null ? void 0 : _d.call(
-      _c,
-      withResolvedContentOffset(
-        state,
-        deferredEvent,
-        (_b = (_a3 = resolvedOffset != null ? resolvedOffset : state.scrollPending) != null ? _a3 : state.scroll) != null ? _b : 0
-      )
-    );
-  }
-}
-
-// src/core/initialScrollSession.ts
-var INITIAL_SCROLL_MIN_TARGET_OFFSET = 1;
-function hasInitialScrollSessionCompletion(completion) {
-  return !!((completion == null ? void 0 : completion.didDispatchNativeScroll) || (completion == null ? void 0 : completion.didRetrySilentInitialScroll) || (completion == null ? void 0 : completion.watchdog));
-}
-function clearInitialScrollSession(state) {
-  state.initialScrollSession = void 0;
-  return void 0;
-}
-function createInitialScrollSession(options) {
-  const { bootstrap, completion, kind, previousDataLength } = options;
-  return kind === "offset" ? {
-    completion,
-    kind,
-    previousDataLength
-  } : {
-    bootstrap,
-    completion,
-    kind,
-    previousDataLength
-  };
-}
-function ensureInitialScrollSessionCompletion(state, kind = ((_b) => (_b = ((_a3) => (_a3 = state.initialScrollSession) == null ? void 0 : _a3.kind)()) != null ? _b : "bootstrap")()) {
-  var _a4, _b2;
-  if (!state.initialScrollSession) {
-    state.initialScrollSession = createInitialScrollSession({
-      completion: {},
-      kind,
-      previousDataLength: 0
-    });
-  } else if (state.initialScrollSession.kind !== kind) {
-    state.initialScrollSession = createInitialScrollSession({
-      bootstrap: state.initialScrollSession.kind === "bootstrap" ? state.initialScrollSession.bootstrap : void 0,
-      completion: state.initialScrollSession.completion,
-      kind,
-      previousDataLength: state.initialScrollSession.previousDataLength
-    });
-  }
-  (_b2 = (_a4 = state.initialScrollSession).completion) != null ? _b2 : _a4.completion = {};
-  return state.initialScrollSession.completion;
-}
-var initialScrollCompletion = {
-  didDispatchNativeScroll(state) {
-    var _a3, _b;
-    return !!((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.didDispatchNativeScroll);
-  },
-  didRetrySilentInitialScroll(state) {
-    var _a3, _b;
-    return !!((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.didRetrySilentInitialScroll);
-  },
-  markInitialScrollNativeDispatch(state) {
-    ensureInitialScrollSessionCompletion(state).didDispatchNativeScroll = true;
-  },
-  markSilentInitialScrollRetry(state) {
-    ensureInitialScrollSessionCompletion(state).didRetrySilentInitialScroll = true;
-  },
-  resetFlags(state) {
-    if (!state.initialScrollSession) {
-      return;
-    }
-    const completion = ensureInitialScrollSessionCompletion(state, state.initialScrollSession.kind);
-    completion.didDispatchNativeScroll = void 0;
-    completion.didRetrySilentInitialScroll = void 0;
-  }
-};
-var initialScrollWatchdog = {
-  clear(state) {
-    initialScrollWatchdog.set(state, void 0);
-  },
-  didReachTarget(newScroll, watchdog) {
-    const nextDistance = Math.abs(newScroll - watchdog.targetOffset);
-    return nextDistance <= INITIAL_SCROLL_MIN_TARGET_OFFSET;
-  },
-  get(state) {
-    var _a3, _b;
-    return (_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.watchdog;
-  },
-  hasNonZeroTargetOffset(targetOffset) {
-    return targetOffset !== void 0 && targetOffset > INITIAL_SCROLL_MIN_TARGET_OFFSET;
-  },
-  isAtZeroTargetOffset(targetOffset) {
-    return targetOffset <= INITIAL_SCROLL_MIN_TARGET_OFFSET;
-  },
-  set(state, watchdog) {
-    var _a3, _b;
-    if (!watchdog && !((_b = (_a3 = state.initialScrollSession) == null ? void 0 : _a3.completion) == null ? void 0 : _b.watchdog)) {
-      return;
-    }
-    const completion = ensureInitialScrollSessionCompletion(state);
-    completion.watchdog = watchdog ? {
-      startScroll: watchdog.startScroll,
-      targetOffset: watchdog.targetOffset
-    } : void 0;
-  }
-};
-function setInitialScrollSession(state, options = {}) {
-  var _a3, _b, _c, _d;
-  const existingSession = state.initialScrollSession;
-  const kind = (_a3 = options.kind) != null ? _a3 : existingSession == null ? void 0 : existingSession.kind;
-  const completion = existingSession == null ? void 0 : existingSession.completion;
-  const existingBootstrap = (existingSession == null ? void 0 : existingSession.kind) === "bootstrap" ? existingSession.bootstrap : void 0;
-  const bootstrap = kind === "bootstrap" ? options.bootstrap === null ? void 0 : (_b = options.bootstrap) != null ? _b : existingBootstrap : void 0;
-  if (!kind) {
-    return clearInitialScrollSession(state);
-  }
-  if (!state.initialScroll && !bootstrap && !hasInitialScrollSessionCompletion(completion)) {
-    return clearInitialScrollSession(state);
+  if (edge === "start") {
+    state.isStartReached = false;
+    state.startReachedSnapshot = void 0;
+  } else {
+    state.isEndReached = false;
+    state.endReachedSnapshot = void 0;
   }
-  const previousDataLength = (_d = (_c = options.previousDataLength) != null ? _c : existingSession == null ? void 0 : existingSession.previousDataLength) != null ? _d : 0;
-  state.initialScrollSession = createInitialScrollSession({
-    bootstrap,
-    completion,
-    kind,
-    previousDataLength
-  });
-  return state.initialScrollSession;
 }
-
-// src/utils/checkThreshold.ts
-var HYSTERESIS_MULTIPLIER = 1.3;
-var checkThreshold = (distance, atThreshold, threshold, wasReached, snapshot, context, onReached, setSnapshot, allowReentryOnChange) => {
-  const absDistance = Math.abs(distance);
-  const within = atThreshold || threshold > 0 && absDistance <= threshold;
-  const updateSnapshot = () => {
-    setSnapshot({
-      atThreshold,
-      contentSize: context.contentSize,
-      dataLength: context.dataLength,
-      scrollPosition: context.scrollPosition
-    });
-  };
-  if (!wasReached) {
-    if (!within) {
-      return false;
-    }
-    onReached(distance);
-    updateSnapshot();
-    return true;
-  }
-  const reset = !atThreshold && threshold > 0 && absDistance >= threshold * HYSTERESIS_MULTIPLIER || !atThreshold && threshold <= 0 && absDistance > 0;
-  if (reset) {
-    setSnapshot(void 0);
-    return false;
+function resetSharedEdgeGateIfOutsideHysteresis(ctx) {
+  const state = ctx.state;
+  if (!state.edgeReachedGate) {
+    return;
   }
-  if (within) {
-    const changed = !snapshot || snapshot.atThreshold !== atThreshold || snapshot.contentSize !== context.contentSize || snapshot.dataLength !== context.dataLength;
-    if (changed) {
-      if (allowReentryOnChange) {
-        onReached(distance);
-      }
-      updateSnapshot();
-    }
+  const contentSize = getContentSize(ctx);
+  const endDistance = contentSize - state.scroll - state.scrollLength - getContentInsetEnd(ctx);
+  const isContentLess = contentSize < state.scrollLength;
+  const startThreshold = state.props.onStartReachedThreshold * state.scrollLength;
+  const endThreshold = state.props.onEndReachedThreshold * state.scrollLength;
+  const isOutsideStart = isOutsideThresholdHysteresis(state.scroll, false, startThreshold);
+  const isOutsideEnd = isOutsideThresholdHysteresis(endDistance, isContentLess, endThreshold);
+  if (isOutsideStart && isOutsideEnd) {
+    state.edgeReachedGate = void 0;
   }
-  return true;
-};
+}
+function canDispatchReachedEdge(ctx, edge, allowedEdge, allowGateCreatedInCurrentCheck) {
+  return !ctx.state.edgeReachedGate || allowedEdge === edge || !!allowGateCreatedInCurrentCheck;
+}
+function markReachedEdge(ctx) {
+  ctx.state.edgeReachedGate = "closed";
+}
+function prepareReachedEdgeForNextUserScroll(ctx) {
+  if (ctx.state.edgeReachedGate) {
+    ctx.state.edgeReachedGate = "prepared";
+  }
+}
+function beginReachedEdgeUserScroll(ctx, scrollDelta) {
+  const state = ctx.state;
+  if (state.edgeReachedGate !== "prepared") {
+    return void 0;
+  }
+  const allowedEdge = scrollDelta < 0 ? "start" : "end";
+  state.edgeReachedGate = "closed";
+  resetEdgeLatch(ctx, allowedEdge);
+  return allowedEdge;
+}
 
 // src/utils/hasActiveInitialScroll.ts
 function hasActiveInitialScroll(state) {
@@ -904,7 +652,7 @@ function hasActiveInitialScroll(state) {
 }
 
 // src/utils/checkAtBottom.ts
-function checkAtBottom(ctx) {
+function checkAtBottom(ctx, allowedEdge, allowGateCreatedInCurrentCheck) {
   var _a3;
   const state = ctx.state;
   if (!state) {
@@ -918,6 +666,7 @@ function checkAtBottom(ctx) {
     props: { maintainScrollAtEndThreshold, onEndReachedThreshold }
   } = state;
   const contentSize = getContentSize(ctx);
+  resetSharedEdgeGateIfOutsideHysteresis(ctx);
   if (contentSize > 0 && queuedInitialLayout) {
     const insetEnd = getContentInsetEnd(ctx);
     const distanceFromEnd = contentSize - scroll - scrollLength - insetEnd;
@@ -944,72 +693,50 @@ function checkAtBottom(ctx) {
         },
         (distance) => {
           var _a4, _b;
-          return (_b = (_a4 = state.props).onEndReached) == null ? void 0 : _b.call(_a4, { distanceFromEnd: distance });
+          if (canDispatchReachedEdge(ctx, "end", allowedEdge, allowGateCreatedInCurrentCheck)) {
+            markReachedEdge(ctx);
+            (_b = (_a4 = state.props).onEndReached) == null ? void 0 : _b.call(_a4, { distanceFromEnd: distance });
+          }
         },
         (snapshot) => {
           state.endReachedSnapshot = snapshot;
-        },
-        true
+        }
       );
     }
   }
 }
 
-// src/utils/hasActiveMVCPAnchorLock.ts
-function hasActiveMVCPAnchorLock(state) {
-  const lock = state.mvcpAnchorLock;
-  if (!lock) {
-    return false;
-  }
-  if (Date.now() > lock.expiresAt) {
-    state.mvcpAnchorLock = void 0;
-    return false;
-  }
-  return true;
-}
-
-// src/utils/isInMVCPActiveMode.ts
-function isInMVCPActiveMode(state) {
-  return state.dataChangeNeedsScrollUpdate || hasActiveMVCPAnchorLock(state);
-}
-
 // src/utils/checkAtTop.ts
-function checkAtTop(ctx) {
+function checkAtTop(ctx, allowedEdge, allowGateCreatedInCurrentCheck) {
   const state = ctx == null ? void 0 : ctx.state;
   if (!state) {
     return;
   }
   const {
-    dataChangeEpoch,
     isStartReached,
     props: { data, onStartReachedThreshold },
     scroll,
     scrollLength,
     startReachedSnapshot,
-    startReachedSnapshotDataChangeEpoch,
     totalSize
   } = state;
   const dataLength = data.length;
   const threshold = onStartReachedThreshold * scrollLength;
-  const dataChanged = startReachedSnapshotDataChangeEpoch !== dataChangeEpoch;
-  const withinThreshold = threshold > 0 && Math.abs(scroll) <= threshold;
-  const allowReentryOnDataChange = !!isStartReached && withinThreshold && !!dataChanged && !isInMVCPActiveMode(state);
-  if (isStartReached && threshold > 0 && scroll > threshold && startReachedSnapshot && (dataChanged || startReachedSnapshot.contentSize !== totalSize || startReachedSnapshot.dataLength !== dataLength)) {
+  resetSharedEdgeGateIfOutsideHysteresis(ctx);
+  if (isStartReached && threshold > 0 && scroll > threshold && startReachedSnapshot && (startReachedSnapshot.contentSize !== totalSize || startReachedSnapshot.dataLength !== dataLength)) {
     state.isStartReached = false;
     state.startReachedSnapshot = void 0;
-    state.startReachedSnapshotDataChangeEpoch = void 0;
   }
   set$(ctx, "isAtStart", scroll <= EDGE_POSITION_EPSILON);
   set$(ctx, "isNearStart", scroll <= threshold);
   const shouldSkipThresholdChecks = hasActiveInitialScroll(state) || !!state.scrollingTo;
-  const shouldDeferDataChangeRefire = isStartReached && withinThreshold && dataChanged && !allowReentryOnDataChange;
-  if (!shouldSkipThresholdChecks && !shouldDeferDataChangeRefire) {
+  if (!shouldSkipThresholdChecks) {
     state.isStartReached = checkThreshold(
       scroll,
       false,
       threshold,
       state.isStartReached,
-      allowReentryOnDataChange ? void 0 : startReachedSnapshot,
+      startReachedSnapshot,
       {
         contentSize: totalSize,
         dataLength,
@@ -1017,21 +744,23 @@ function checkAtTop(ctx) {
       },
       (distance) => {
         var _a3, _b;
-        return (_b = (_a3 = state.props).onStartReached) == null ? void 0 : _b.call(_a3, { distanceFromStart: distance });
+        if (canDispatchReachedEdge(ctx, "start", allowedEdge, allowGateCreatedInCurrentCheck)) {
+          markReachedEdge(ctx);
+          (_b = (_a3 = state.props).onStartReached) == null ? void 0 : _b.call(_a3, { distanceFromStart: distance });
+        }
       },
       (snapshot) => {
         state.startReachedSnapshot = snapshot;
-        state.startReachedSnapshotDataChangeEpoch = snapshot ? dataChangeEpoch : void 0;
-      },
-      allowReentryOnDataChange
+      }
     );
   }
 }
 
 // src/utils/checkThresholds.ts
-function checkThresholds(ctx) {
-  checkAtBottom(ctx);
-  checkAtTop(ctx);
+function checkThresholds(ctx, allowedEdge) {
+  const allowGateCreatedInCurrentCheck = !ctx.state.edgeReachedGate;
+  checkAtBottom(ctx, allowedEdge, allowGateCreatedInCurrentCheck);
+  checkAtTop(ctx, allowedEdge, allowGateCreatedInCurrentCheck);
 }
 
 // src/core/recalculateSettledScroll.ts
@@ -1047,13 +776,7 @@ var DEFAULT_WEB_ADAPTIVE_RENDER_ENTER_VELOCITY = 6;
 var DEFAULT_WEB_ADAPTIVE_RENDER_EXIT_VELOCITY = 3;
 var DEFAULT_WEB_ADAPTIVE_RENDER_EXIT_DELAY = 250;
 function clearAdaptiveRenderExitTimeout(ctx) {
-  const state = ctx.state;
-  const previousTimeout = state.timeoutAdaptiveRender;
-  if (previousTimeout !== void 0) {
-    clearTimeout(previousTimeout);
-    state.timeouts.delete(previousTimeout);
-    state.timeoutAdaptiveRender = void 0;
-  }
+  ctx.state.scheduledWork.cancel("adaptiveRender");
 }
 function scheduleAdaptiveRenderExit(ctx, exitDelay) {
   const state = ctx.state;
@@ -1061,13 +784,7 @@ function scheduleAdaptiveRenderExit(ctx, exitDelay) {
   if (exitDelay <= 0) {
     setAdaptiveRender(ctx, "normal", "scroll");
   } else {
-    const timeout = setTimeout(() => {
-      state.timeouts.delete(timeout);
-      state.timeoutAdaptiveRender = void 0;
-      setAdaptiveRender(ctx, "normal", "scroll");
-    }, exitDelay);
-    state.timeoutAdaptiveRender = timeout;
-    state.timeouts.add(timeout);
+    state.scheduledWork.timeout(() => setAdaptiveRender(ctx, "normal", "scroll"), exitDelay, "adaptiveRender");
   }
 }
 function setAdaptiveRender(ctx, mode, reason) {
@@ -1098,7 +815,7 @@ function updateAdaptiveRender(ctx, scrollVelocity, options) {
       const exitDelay = (_c = adaptiveRender.exitDelay) != null ? _c : DEFAULT_WEB_ADAPTIVE_RENDER_EXIT_DELAY ;
       const threshold = currentMode === "light" ? exitVelocity : enterVelocity;
       const nextMode = (options == null ? void 0 : options.forceLight) || Math.abs(scrollVelocity) > threshold ? "light" : "normal";
-      const previousMode = state.timeoutAdaptiveRender !== void 0 ? "normal" : currentMode;
+      const previousMode = state.scheduledWork.has("adaptiveRender") ? "normal" : currentMode;
       if (nextMode !== previousMode) {
         if (nextMode === "light") {
           setAdaptiveRender(ctx, "light", "scroll");
@@ -1125,14 +842,13 @@ function getEffectiveDrawDistance(ctx, mode) {
 }
 function scheduleFullDrawDistancePrewarm(ctx) {
   const { state } = ctx;
-  if (state.props.drawDistance <= INITIAL_DRAW_DISTANCE || state.queuedFullDrawDistancePrewarm !== void 0) {
+  if (state.props.drawDistance <= INITIAL_DRAW_DISTANCE || state.scheduledWork.has("fullDrawDistancePrewarm")) {
     return;
   }
-  state.queuedFullDrawDistancePrewarm = requestAnimationFrame(() => {
+  state.scheduledWork.frame(() => {
     var _a3;
-    state.queuedFullDrawDistancePrewarm = void 0;
-    (_a3 = state.triggerCalculateItemsInView) == null ? void 0 : _a3.call(state);
-  });
+    return (_a3 = state.triggerCalculateItemsInView) == null ? void 0 : _a3.call(state);
+  }, "fullDrawDistancePrewarm");
 }
 
 // src/utils/setInitialRenderState.ts
@@ -1190,10 +906,7 @@ function syncInitialScrollOffset(state, offset) {
   state.scrollPrev = offset;
 }
 function clearPreservedInitialScrollTargetTimeout(state) {
-  if (state.timeoutPreservedInitialScrollClear !== void 0) {
-    clearTimeout(state.timeoutPreservedInitialScrollClear);
-    state.timeoutPreservedInitialScrollClear = void 0;
-  }
+  state.scheduledWork.cancel("preservedInitialScroll");
 }
 function clearPreservedInitialScrollTarget(state) {
   clearPreservedInitialScrollTargetTimeout(state);
@@ -1222,14 +935,17 @@ function finishInitialScroll(ctx, options) {
       setInitialScrollSession(state);
       clearPreservedInitialScrollTargetTimeout(state);
       if (options == null ? void 0 : options.schedulePreservedTargetClear) {
-        state.timeoutPreservedInitialScrollClear = setTimeout(() => {
-          var _a5;
-          state.timeoutPreservedInitialScrollClear = void 0;
-          if (!state.didFinishInitialScroll || ((_a5 = state.scrollingTo) == null ? void 0 : _a5.isInitialScroll) || !state.initialScroll) {
-            return;
-          }
-          clearPreservedInitialScrollTarget(state);
-        }, PRESERVED_INITIAL_SCROLL_FALLBACK_CLEAR_DELAY_MS);
+        state.scheduledWork.timeout(
+          () => {
+            var _a5;
+            if (!state.didFinishInitialScroll || ((_a5 = state.scrollingTo) == null ? void 0 : _a5.isInitialScroll) || !state.initialScroll) {
+              return;
+            }
+            clearPreservedInitialScrollTarget(state);
+          },
+          PRESERVED_INITIAL_SCROLL_FALLBACK_CLEAR_DELAY_MS,
+          "preservedInitialScroll"
+        );
       }
     } else {
       clearPreservedInitialScrollTarget(state);
@@ -1256,9 +972,11 @@ function calculateOffsetForIndex(ctx, index) {
   return index !== void 0 ? state.positions[index] || 0 : 0;
 }
 
-// src/core/getTopOffsetAdjustment.ts
-function getTopOffsetAdjustment(ctx) {
-  return (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
+// src/core/getStartOffsetAdjustment.ts
+function getStartOffsetAdjustment(ctx) {
+  const { state } = ctx;
+  const stylePaddingStart = state.props.horizontal ? (isHorizontalRTL(state) ? state.props.stylePaddingRight : state.props.stylePaddingLeft) || 0 : peek$(ctx, "stylePaddingTop") || 0;
+  return stylePaddingStart + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
 }
 
 // src/utils/getId.ts
@@ -1332,6 +1050,50 @@ function setSize(ctx, itemKey, size, notifyTotalSize = true) {
   sizes.set(itemKey, size);
 }
 
+// src/utils/helpers.ts
+function isFunction(obj) {
+  return typeof obj === "function";
+}
+function isArray(obj) {
+  return Array.isArray(obj);
+}
+var warned = /* @__PURE__ */ new Set();
+function warnDevOnce(id, text) {
+  if (IS_DEV && !warned.has(id)) {
+    warned.add(id);
+    console.warn(`[legend-list] ${text}`);
+  }
+}
+function roundSize(size) {
+  return Math.floor(size * 8) / 8;
+}
+function isNullOrUndefined(value) {
+  return value === null || value === void 0;
+}
+function getPadding(s, type) {
+  var _a3, _b, _c;
+  const axisPadding = type === "Left" || type === "Right" ? s.paddingHorizontal : s.paddingVertical;
+  return (_c = (_b = (_a3 = s[`padding${type}`]) != null ? _a3 : axisPadding) != null ? _b : s.padding) != null ? _c : 0;
+}
+function extractPadding(style, contentContainerStyle, type) {
+  return getPadding(style, type) + getPadding(contentContainerStyle, type);
+}
+function findContainerId(ctx, key) {
+  var _a3, _b;
+  const directMatch = (_b = (_a3 = ctx.state) == null ? void 0 : _a3.containerItemKeys) == null ? void 0 : _b.get(key);
+  if (directMatch !== void 0) {
+    return directMatch;
+  }
+  const numContainers = peek$(ctx, "numContainers");
+  for (let i = 0; i < numContainers; i++) {
+    const itemKey = peek$(ctx, `containerItemKey${i}`);
+    if (itemKey === key) {
+      return i;
+    }
+  }
+  return -1;
+}
+
 // src/utils/getItemSize.ts
 function getKnownOrFixedSize(ctx, key, index, data, resolved) {
   var _a3, _b;
@@ -1425,9 +1187,9 @@ function calculateOffsetWithOffsetPosition(ctx, offsetParam, params) {
     offset -= viewOffset;
   }
   if (index !== void 0) {
-    const topOffsetAdjustment = getTopOffsetAdjustment(ctx);
-    if (topOffsetAdjustment) {
-      offset += topOffsetAdjustment;
+    const startOffsetAdjustment = getStartOffsetAdjustment(ctx);
+    if (startOffsetAdjustment) {
+      offset += startOffsetAdjustment;
     }
   }
   if (viewPosition !== void 0 && index !== void 0) {
@@ -1437,7 +1199,8 @@ function calculateOffsetWithOffsetPosition(ctx, offsetParam, params) {
     }
     const isOutOfBounds = index < 0 || index >= dataLength;
     const fallbackEstimatedSize = (_a3 = state.props.estimatedItemSize) != null ? _a3 : 0;
-    const itemSize = isOutOfBounds ? fallbackEstimatedSize : getItemSize(ctx, getId(state, index), index, state.props.data[index]);
+    const measuredItemSize = isOutOfBounds ? fallbackEstimatedSize : getItemSize(ctx, getId(state, index), index, state.props.data[index]);
+    const itemSize = Math.max(0, measuredItemSize - (isOutOfBounds ? 0 : ctx.scrollAxisGap));
     const trailingInset = getContentInsetEnd(ctx);
     offset -= viewPosition * (state.scrollLength - trailingInset - itemSize);
     if (!isOutOfBounds && index === state.props.data.length - 1) {
@@ -1464,11 +1227,35 @@ function clampScrollOffset(ctx, offset, scrollTarget) {
   return clampedOffset;
 }
 
+// src/core/cancelImperativeScroll.ts
+function cancelScrollCompletionChecks({ scheduledWork }) {
+  scheduledWork.cancel("checkFinishedScrollFrame");
+  scheduledWork.cancel("checkFinishedScrollRetryFrame");
+  scheduledWork.cancel("checkFinishedScrollFallback");
+  scheduledWork.cancel("platformScrollCompletion");
+}
+function settlePendingImperativeScroll(state) {
+  var _a3, _b;
+  const resolvePendingScroll = (_b = state.pendingScrollResolve) != null ? _b : (_a3 = state.pendingScrollToEnd) == null ? void 0 : _a3.resolve;
+  state.pendingScrollResolve = void 0;
+  state.pendingScrollToEnd = void 0;
+  resolvePendingScroll == null ? void 0 : resolvePendingScroll();
+}
+function cancelImperativeScroll(state) {
+  cancelScrollCompletionChecks(state);
+  state.scheduledWork.cancel("imperativeScrollReady");
+  state.runPendingScrollToEnd = void 0;
+  state.scrollingTo = void 0;
+  state.scrollTargetPinnedRange = void 0;
+  settlePendingImperativeScroll(state);
+}
+
 // src/core/finishScrollTo.ts
 function finishScrollTo(ctx) {
   var _a3, _b;
   const state = ctx.state;
   if (state == null ? void 0 : state.scrollingTo) {
+    cancelScrollCompletionChecks(state);
     const resolvePendingScroll = state.pendingScrollResolve;
     state.pendingScrollResolve = void 0;
     const scrollingTo = state.scrollingTo;
@@ -1510,6 +1297,7 @@ function doScrollTo(ctx, params) {
   var _a3, _b;
   const state = ctx.state;
   const { animated, horizontal, offset } = params;
+  state.scheduledWork.cancel("platformScrollCompletion");
   const scroller = state.refScroller.current;
   const node = scroller == null ? void 0 : scroller.getScrollableNode();
   if (!scroller || !node) {
@@ -1530,9 +1318,16 @@ function doScrollTo(ctx, params) {
     });
   } else {
     state.scroll = offset;
-    setTimeout(() => {
-      finishScrollTo(ctx);
-    }, 100);
+    const targetToken = state.scrollingTo;
+    state.scheduledWork.timeout(
+      () => {
+        if (targetToken === state.scrollingTo) {
+          finishScrollTo(ctx);
+        }
+      },
+      100,
+      "platformScrollCompletion"
+    );
   }
 }
 function listenForScrollEnd(ctx, params) {
@@ -1544,23 +1339,28 @@ function listenForScrollEnd(ctx, params) {
   const supportsScrollEnd = "onscrollend" in target;
   let idleTimeout;
   let settled = false;
-  const targetToken = ctx.state.scrollingTo;
+  const { scheduledWork, scrollingTo: targetToken } = ctx.state;
   const maxTimeout = setTimeout(() => finish("max"), SCROLL_END_MAX_MS);
   const cleanup = () => {
     target.removeEventListener("scroll", onScroll2);
     if (supportsScrollEnd) {
       target.removeEventListener("scrollend", onScrollEnd);
     }
-    if (idleTimeout) {
+    if (idleTimeout !== void 0) {
       clearTimeout(idleTimeout);
     }
     clearTimeout(maxTimeout);
   };
+  const cancel = () => {
+    if (!settled) {
+      settled = true;
+      cleanup();
+    }
+  };
   const finish = (reason) => {
     if (settled) return;
     if (targetToken !== ctx.state.scrollingTo) {
-      settled = true;
-      cleanup();
+      scheduledWork.cancel("platformScrollCompletion");
       return;
     }
     const currentOffset = readOffset();
@@ -1568,12 +1368,11 @@ function listenForScrollEnd(ctx, params) {
     if (reason === "scrollend" && !isNearTarget) {
       return;
     }
-    settled = true;
-    cleanup();
+    scheduledWork.cancel("platformScrollCompletion");
     finishScrollTo(ctx);
   };
   const onScroll2 = () => {
-    if (idleTimeout) {
+    if (idleTimeout !== void 0) {
       clearTimeout(idleTimeout);
     }
     idleTimeout = setTimeout(() => finish("idle"), SCROLL_END_IDLE_MS);
@@ -1585,6 +1384,7 @@ function listenForScrollEnd(ctx, params) {
   } else {
     idleTimeout = setTimeout(() => finish("idle"), SMOOTH_SCROLL_DURATION_MS);
   }
+  scheduledWork.register("platformScrollCompletion", cancel);
 }
 
 // src/core/doMaintainScrollAtEnd.ts
@@ -1611,9 +1411,12 @@ function doMaintainScrollAtEnd(ctx) {
     if (!state.maintainingScrollAtEnd) {
       const pendingState = maintainScrollAtEnd.animated ? "pending-animated" : "pending-instant";
       const activeState = maintainScrollAtEnd.animated ? "animated" : "instant";
+      const scrollAtRequest = state.scroll;
       state.maintainingScrollAtEnd = pendingState;
       requestAnimationFrame(() => {
-        if (peek$(ctx, "isWithinMaintainScrollAtEndThreshold")) {
+        const isStillWithinThreshold = peek$(ctx, "isWithinMaintainScrollAtEndThreshold");
+        const didScrollSinceRequest = state.scroll !== scrollAtRequest;
+        if (isStillWithinThreshold || !didScrollSinceRequest) {
           state.maintainingScrollAtEnd = activeState;
           const scroller = refScroller.current;
           if (state.props.horizontal && isHorizontalRTL(state)) {
@@ -1643,6 +1446,7 @@ function doMaintainScrollAtEnd(ctx) {
           );
         } else if (state.maintainingScrollAtEnd === pendingState) {
           state.maintainingScrollAtEnd = void 0;
+          state.pendingMaintainScrollAtEnd = false;
         }
       });
     } else {
@@ -2010,6 +1814,24 @@ var getScrollVelocity = (state) => {
   return totalWeight > 0 ? weightedVelocity / totalWeight : 0;
 };
 
+// src/utils/hasActiveMVCPAnchorLock.ts
+function hasActiveMVCPAnchorLock(state) {
+  const lock = state.mvcpAnchorLock;
+  if (!lock) {
+    return false;
+  }
+  if (Date.now() > lock.expiresAt) {
+    state.mvcpAnchorLock = void 0;
+    return false;
+  }
+  return true;
+}
+
+// src/utils/isInMVCPActiveMode.ts
+function isInMVCPActiveMode(state) {
+  return state.dataChangeNeedsScrollUpdate || hasActiveMVCPAnchorLock(state);
+}
+
 // src/core/updateScroll.ts
 function updateScroll(ctx, newScroll, forceUpdate, options) {
   var _a3;
@@ -2047,6 +1869,8 @@ function updateScroll(ctx, newScroll, forceUpdate, options) {
   state.scroll = newScroll;
   state.scrollTime = currentTime;
   const scrollDelta = Math.abs(newScroll - prevScroll);
+  const isUserScrollEvent = !!(options == null ? void 0 : options.fromNativeScrollEvent) && scrollDelta > 0.1 && !adjustChanged && scrollingTo === void 0 && !state.pendingNativeMVCPAdjust;
+  const allowedEdge = isUserScrollEvent ? beginReachedEdgeUserScroll(ctx, newScroll - prevScroll) : void 0;
   const didResolvePendingNativeMVCPAdjust = resolvePendingNativeMVCPAdjust(ctx, newScroll);
   const scrollLength = state.scrollLength;
   const isLargeUserScrollJump = scrollLength > 0 && scrollingTo === void 0 && scrollDelta > scrollLength && !state.pendingNativeMVCPAdjust;
@@ -2054,7 +1878,7 @@ function updateScroll(ctx, newScroll, forceUpdate, options) {
   updateAdaptiveRender(ctx, scrollVelocity, { forceLight: isLargeUserScrollJump });
   const lastCalculated = state.scrollLastCalculate;
   const useAggressiveItemRecalculation = isInMVCPActiveMode(state);
-  const shouldUpdate = useAggressiveItemRecalculation || didResolvePendingNativeMVCPAdjust || forceUpdate || lastCalculated === void 0 || Math.abs(state.scroll - lastCalculated) > 2;
+  const shouldUpdate = useAggressiveItemRecalculation || didResolvePendingNativeMVCPAdjust || allowedEdge !== void 0 || forceUpdate || lastCalculated === void 0 || Math.abs(state.scroll - lastCalculated) > 2;
   if (shouldUpdate) {
     state.scrollLastCalculate = state.scroll;
     state.ignoreScrollFromMVCPIgnored = false;
@@ -2069,16 +1893,13 @@ function updateScroll(ctx, newScroll, forceUpdate, options) {
         calculateItemsParams.drawDistanceMode = "visible-first";
       }
       (_a4 = state.triggerCalculateItemsInView) == null ? void 0 : _a4.call(state, calculateItemsParams);
-      checkThresholds(ctx);
+      checkThresholds(ctx, allowedEdge);
     };
     if (isLargeUserScrollJump) {
       state.mvcpAnchorLock = void 0;
       state.pendingNativeMVCPAdjust = void 0;
       state.userScrollAnchorReset = { keys: /* @__PURE__ */ new Set() };
-      if (state.queuedMVCPRecalculate !== void 0) {
-        cancelAnimationFrame(state.queuedMVCPRecalculate);
-        state.queuedMVCPRecalculate = void 0;
-      }
+      state.scheduledWork.cancel("mvcpRecalculate");
       flushSync(runCalculateItems);
       scheduleFullDrawDistancePrewarm(ctx);
     } else {
@@ -2223,12 +2044,7 @@ function scrollTo(ctx, params) {
   const {
     props: { horizontal }
   } = state;
-  if (state.animFrameCheckFinishedScroll) {
-    cancelAnimationFrame(ctx.state.animFrameCheckFinishedScroll);
-  }
-  if (state.timeoutCheckFinishedScrollFallback) {
-    clearTimeout(ctx.state.timeoutCheckFinishedScrollFallback);
-  }
+  cancelScrollCompletionChecks(state);
   const requestedOffset = precomputedWithViewOffset ? scrollTargetOffset : calculateOffsetWithOffsetPosition(ctx, scrollTargetOffset, scrollTarget);
   const shouldPreserveRawInitialOffsetRequest = !!isInitialScroll && ((_a3 = state.initialScrollSession) == null ? void 0 : _a3.kind) === "offset";
   const targetOffset = clampScrollOffset(ctx, requestedOffset, scrollTarget);
@@ -2333,10 +2149,7 @@ function setInitialScrollTarget(ctx, target, options) {
   var _a3;
   const { state } = ctx;
   state.clearPreservedInitialScrollOnNextFinish = void 0;
-  if (state.timeoutPreservedInitialScrollClear !== void 0) {
-    clearTimeout(state.timeoutPreservedInitialScrollClear);
-    state.timeoutPreservedInitialScrollClear = void 0;
-  }
+  state.scheduledWork.cancel("preservedInitialScroll");
   state.initialScroll = target;
   if (options == null ? void 0 : options.resetDidFinish) {
     resetInitialRenderState(ctx, { resetInitialScroll: true });
@@ -2629,13 +2442,13 @@ function rearmBootstrapInitialScroll(ctx, options) {
   queueBootstrapInitialScrollReevaluation(ctx.state);
 }
 function createInitialScrollAtEndTarget(options) {
-  const { dataLength, footerSize, preserveForFooterLayout, stylePaddingBottom } = options;
+  const { dataLength, footerSize, preserveForFooterLayout, stylePaddingEnd } = options;
   return {
     contentOffset: void 0,
     index: Math.max(0, dataLength - 1),
     preserveForBottomPadding: true,
     preserveForFooterLayout,
-    viewOffset: -stylePaddingBottom - footerSize,
+    viewOffset: -stylePaddingEnd - footerSize,
     viewPosition: 1
   };
 }
@@ -2649,7 +2462,7 @@ function isRetargetableBottomAlignedInitialScrollTarget(target) {
   return !!(target && target.viewPosition === 1 && (shouldPreserveInitialScrollForBottomPadding(target) || shouldPreserveInitialScrollForFooterLayout(target)));
 }
 function createRetargetedBottomAlignedInitialScroll(options) {
-  const { dataLength, footerSize, initialScrollAtEnd, stylePaddingBottom, target } = options;
+  const { dataLength, footerSize, initialScrollAtEnd, stylePaddingEnd, target } = options;
   const preserveForFooterLayout = shouldPreserveInitialScrollForFooterLayout(target);
   return {
     ...target,
@@ -2657,7 +2470,7 @@ function createRetargetedBottomAlignedInitialScroll(options) {
     index: initialScrollAtEnd ? Math.max(0, dataLength - 1) : target.index,
     preserveForBottomPadding: true,
     preserveForFooterLayout,
-    viewOffset: -stylePaddingBottom - (preserveForFooterLayout ? footerSize : 0),
+    viewOffset: -stylePaddingEnd - (preserveForFooterLayout ? footerSize : 0),
     viewPosition: 1
   };
 }
@@ -2665,7 +2478,7 @@ function areEquivalentBootstrapInitialScrollTargets(current, next) {
   return current.index === next.index && current.preserveForBottomPadding === next.preserveForBottomPadding && current.preserveForFooterLayout === next.preserveForFooterLayout && current.viewOffset === next.viewOffset && current.viewPosition === next.viewPosition;
 }
 function clearPendingInitialScrollFooterLayout(ctx, options) {
-  const { dataLength, stylePaddingBottom, target } = options;
+  const { dataLength, stylePaddingEnd, target } = options;
   if (!shouldPreserveInitialScrollForFooterLayout(target)) {
     return;
   }
@@ -2673,7 +2486,7 @@ function clearPendingInitialScrollFooterLayout(ctx, options) {
     dataLength,
     footerSize: 0,
     preserveForFooterLayout: void 0,
-    stylePaddingBottom
+    stylePaddingEnd
   });
   setInitialScrollTarget(ctx, clearedFooterTarget);
 }
@@ -2734,7 +2547,7 @@ function schedulePreservedEndAnchorCorrectionFrame(ctx, correction) {
   });
 }
 function clearFinishedBootstrapInitialScrollTargetIfMovedAway(ctx) {
-  var _a3, _b;
+  var _a3;
   const state = ctx.state;
   const initialScroll = state.initialScroll;
   if (!state.didFinishInitialScroll || ((_a3 = state.scrollingTo) == null ? void 0 : _a3.isInitialScroll) || (initialScroll == null ? void 0 : initialScroll.viewPosition) !== 1 || state.preservedEndAnchorCorrection) {
@@ -2746,7 +2559,7 @@ function clearFinishedBootstrapInitialScrollTargetIfMovedAway(ctx) {
       if (shouldPreserveInitialScrollForFooterLayout(initialScroll)) {
         clearPendingInitialScrollFooterLayout(ctx, {
           dataLength: state.props.data.length,
-          stylePaddingBottom: (_b = state.props.stylePaddingBottom) != null ? _b : 0,
+          stylePaddingEnd: getStylePaddingEnd(state.props),
           target: initialScroll
         });
       } else {
@@ -2783,7 +2596,7 @@ function startBootstrapInitialScrollOnMount(ctx, options) {
   }
 }
 function handleBootstrapInitialScrollDataChange(ctx, options) {
-  const { dataLength, didDataChange, initialScrollAtEnd, previousDataLength, stylePaddingBottom } = options;
+  const { dataLength, didDataChange, initialScrollAtEnd, previousDataLength, stylePaddingEnd } = options;
   const state = ctx.state;
   const initialScroll = state.initialScroll;
   if (isOffsetInitialScrollSession(state) || !initialScroll) {
@@ -2805,18 +2618,18 @@ function handleBootstrapInitialScrollDataChange(ctx, options) {
       dataLength,
       footerSize: peek$(ctx, "footerSize") || 0,
       preserveForFooterLayout: shouldPreserveInitialScrollForFooterLayout(initialScroll),
-      stylePaddingBottom
+      stylePaddingEnd
     }) : createRetargetedBottomAlignedInitialScroll({
       dataLength,
       footerSize: peek$(ctx, "footerSize") || 0,
       initialScrollAtEnd,
-      stylePaddingBottom,
+      stylePaddingEnd,
       target: initialScroll
     });
     if (!shouldResetDidFinish && didFinishedInitialScrollMoveAwayFromTarget(ctx, initialScroll)) {
       clearPendingInitialScrollFooterLayout(ctx, {
         dataLength,
-        stylePaddingBottom,
+        stylePaddingEnd,
         target: initialScroll
       });
       return;
@@ -2848,7 +2661,7 @@ function handleBootstrapInitialScrollDataChange(ctx, options) {
   }
 }
 function handleBootstrapInitialScrollFooterLayout(ctx, options) {
-  const { dataLength, footerSize, initialScrollAtEnd, stylePaddingBottom } = options;
+  const { dataLength, footerSize, initialScrollAtEnd, stylePaddingEnd } = options;
   const state = ctx.state;
   if (!initialScrollAtEnd) {
     return;
@@ -2864,7 +2677,7 @@ function handleBootstrapInitialScrollFooterLayout(ctx, options) {
   if (didFinishedInitialScrollMoveAwayFromTarget(ctx, initialScroll)) {
     clearPendingInitialScrollFooterLayout(ctx, {
       dataLength,
-      stylePaddingBottom,
+      stylePaddingEnd,
       target: initialScroll
     });
   } else {
@@ -2872,13 +2685,13 @@ function handleBootstrapInitialScrollFooterLayout(ctx, options) {
       dataLength,
       footerSize,
       preserveForFooterLayout: shouldPreserveInitialScrollForFooterLayout(initialScroll),
-      stylePaddingBottom
+      stylePaddingEnd
     });
     const didTargetChange = initialScroll.index !== updatedInitialScroll.index || initialScroll.viewPosition !== updatedInitialScroll.viewPosition || initialScroll.viewOffset !== updatedInitialScroll.viewOffset;
     if (!didTargetChange) {
       clearPendingInitialScrollFooterLayout(ctx, {
         dataLength,
-        stylePaddingBottom,
+        stylePaddingEnd,
         target: initialScroll
       });
     } else {
@@ -3030,6 +2843,47 @@ function abortBootstrapInitialScroll(ctx) {
   }
 }
 
+// src/core/containerItemMetadata.ts
+function createContainerItemMetadata(state, itemIndex, itemData, itemType) {
+  return {
+    dataChangeEpoch: state.dataChangeEpoch,
+    getFixedItemSize: state.props.getFixedItemSize,
+    getItemType: state.props.getItemType,
+    itemData,
+    itemIndex,
+    itemType
+  };
+}
+function resolveContainerItemMetadata(state, containerId, itemIndex, itemData) {
+  var _a3, _b;
+  const { getFixedItemSize, getItemType } = state.props;
+  const previousMetadata = state.containerItemMetadata.get(containerId);
+  let metadata;
+  if ((previousMetadata == null ? void 0 : previousMetadata.dataChangeEpoch) === state.dataChangeEpoch && previousMetadata.getItemType === getItemType && previousMetadata.itemData === itemData && previousMetadata.itemIndex === itemIndex) {
+    metadata = previousMetadata;
+  } else {
+    const itemType = getItemType ? (_a3 = getItemType(itemData, itemIndex)) != null ? _a3 : "" : void 0;
+    metadata = createContainerItemMetadata(state, itemIndex, itemData, itemType);
+    state.containerItemMetadata.set(containerId, metadata);
+  }
+  if (metadata.getFixedItemSize !== getFixedItemSize) {
+    metadata.didResolveFixedItemSize = false;
+    metadata.fixedItemSize = void 0;
+    metadata.getFixedItemSize = getFixedItemSize;
+  }
+  if (getFixedItemSize && !metadata.didResolveFixedItemSize) {
+    metadata.fixedItemSize = getFixedItemSize(itemData, itemIndex, (_b = metadata.itemType) != null ? _b : "");
+    metadata.didResolveFixedItemSize = true;
+  }
+  return metadata;
+}
+function invalidateContainerFixedItemSizes(state) {
+  for (const metadata of state.containerItemMetadata.values()) {
+    metadata.didResolveFixedItemSize = false;
+    metadata.fixedItemSize = void 0;
+  }
+}
+
 // src/core/checkFinishedScroll.ts
 var INITIAL_SCROLL_MAX_FALLBACK_CHECKS = 20;
 var INITIAL_SCROLL_COMPLETION_TARGET_EPSILON = 1;
@@ -3045,7 +2899,7 @@ function checkFinishedScroll(ctx, options) {
       return;
     }
   }
-  ctx.state.animFrameCheckFinishedScroll = requestAnimationFrame(() => checkFinishedScrollFrame(ctx));
+  ctx.state.scheduledWork.frame(() => checkFinishedScrollFrame(ctx), "checkFinishedScrollFrame");
 }
 function hasScrollCompletionOwnership(state, options) {
   const { clampedTargetOffset, scrollingTo } = options;
@@ -3115,7 +2969,6 @@ function checkFinishedScrollFrame(ctx) {
     return;
   }
   const { state } = ctx;
-  state.animFrameCheckFinishedScroll = void 0;
   const completionState = getResolvedScrollCompletionState(ctx, scrollingTo);
   if (completionState.isAtResolvedTarget && hasScrollCompletionOwnership(state, {
     clampedTargetOffset: completionState.clampedTargetOffset,
@@ -3134,47 +2987,47 @@ function scrollToFallbackOffset(ctx, offset) {
 }
 function checkFinishedScrollFallback(ctx) {
   const state = ctx.state;
+  if (state.scheduledWork.has("checkFinishedScrollFallback")) {
+    return;
+  }
   const scrollingTo = state.scrollingTo;
   const shouldFinishInitialZeroTarget = shouldFinishInitialZeroTargetScroll(ctx);
   const silentInitialDispatch = isSilentInitialDispatch(state, scrollingTo);
   const canFinishInitialWithoutNativeProgress = scrollingTo !== void 0 ? shouldFinishInitialScrollWithoutNativeProgress(state, scrollingTo) : false;
   const slowTimeout = (scrollingTo == null ? void 0 : scrollingTo.isInitialScroll) && !shouldFinishInitialZeroTarget && !canFinishInitialWithoutNativeProgress || !state.didContainersLayout;
   const initialDelay = shouldFinishInitialZeroTarget || canFinishInitialWithoutNativeProgress ? 0 : silentInitialDispatch ? SILENT_INITIAL_SCROLL_RETRY_DELAY_MS : slowTimeout ? 500 : 100;
-  state.timeoutCheckFinishedScrollFallback = setTimeout(() => {
-    let numChecks = 0;
-    const scheduleFallbackCheck = (delay) => {
-      state.timeoutCheckFinishedScrollFallback = setTimeout(checkHasScrolled, delay);
-    };
-    const checkHasScrolled = () => {
-      var _c, _d;
-      state.timeoutCheckFinishedScrollFallback = void 0;
-      const isStillScrollingTo = state.scrollingTo;
-      if (isStillScrollingTo) {
-        numChecks++;
-        const isNativeInitialPending = isNativeInitialNonZeroTarget(state) && !state.hasScrolled;
-        const maxChecks = silentInitialDispatch ? 5 : isNativeInitialPending ? INITIAL_SCROLL_MAX_FALLBACK_CHECKS : 5;
-        const shouldFinishZeroTarget = shouldFinishInitialZeroTargetScroll(ctx);
-        const canFinishInitialScrollWithoutNativeProgress = shouldFinishInitialScrollWithoutNativeProgress(
-          state,
-          isStillScrollingTo
-        );
-        const completionState = getResolvedScrollCompletionState(ctx, isStillScrollingTo);
-        const canFinishAfterSilentNativeDispatch = Platform.OS === "android";
-        const shouldFinishAfterObservedScroll = state.hasScrolled && (!isStillScrollingTo.isInitialScroll || completionState.isAtResolvedTarget);
-        const shouldRetryUnalignedInitialScroll = isStillScrollingTo.isInitialScroll && !completionState.isAtResolvedTarget && numChecks <= maxChecks;
-        if (shouldFinishZeroTarget || shouldFinishAfterObservedScroll || canFinishInitialScrollWithoutNativeProgress || canFinishAfterSilentNativeDispatch || numChecks > maxChecks) {
-          finishScrollTo(ctx);
-        } else if ((isNativeInitialPending || shouldRetryUnalignedInitialScroll) && numChecks <= maxChecks) {
-          const targetOffset = (_d = (_c = getInitialScrollWatchdogTargetOffset(state)) != null ? _c : isStillScrollingTo.targetOffset) != null ? _d : state.scrollPending;
-          scrollToFallbackOffset(ctx, targetOffset);
-          scheduleFallbackCheck(silentInitialDispatch ? SILENT_INITIAL_SCROLL_RETRY_DELAY_MS : 100);
-        } else {
-          scheduleFallbackCheck(silentInitialDispatch ? SILENT_INITIAL_SCROLL_RETRY_DELAY_MS : 100);
-        }
+  let numChecks = 0;
+  const scheduleFallbackCheck = (delay) => {
+    state.scheduledWork.timeout(checkHasScrolled, delay, "checkFinishedScrollFallback");
+  };
+  const checkHasScrolled = () => {
+    var _c, _d;
+    const isStillScrollingTo = state.scrollingTo;
+    if (isStillScrollingTo) {
+      numChecks++;
+      const isNativeInitialPending = isNativeInitialNonZeroTarget(state) && !state.hasScrolled;
+      const maxChecks = silentInitialDispatch ? 5 : isNativeInitialPending ? INITIAL_SCROLL_MAX_FALLBACK_CHECKS : 5;
+      const shouldFinishZeroTarget = shouldFinishInitialZeroTargetScroll(ctx);
+      const canFinishInitialScrollWithoutNativeProgress = shouldFinishInitialScrollWithoutNativeProgress(
+        state,
+        isStillScrollingTo
+      );
+      const completionState = getResolvedScrollCompletionState(ctx, isStillScrollingTo);
+      const canFinishAfterSilentNativeDispatch = Platform.OS === "android";
+      const shouldFinishAfterObservedScroll = state.hasScrolled && (!isStillScrollingTo.isInitialScroll || completionState.isAtResolvedTarget);
+      const shouldRetryUnalignedInitialScroll = isStillScrollingTo.isInitialScroll && !completionState.isAtResolvedTarget && numChecks <= maxChecks;
+      if (shouldFinishZeroTarget || shouldFinishAfterObservedScroll || canFinishInitialScrollWithoutNativeProgress || canFinishAfterSilentNativeDispatch || numChecks > maxChecks) {
+        finishScrollTo(ctx);
+      } else if ((isNativeInitialPending || shouldRetryUnalignedInitialScroll) && numChecks <= maxChecks) {
+        const targetOffset = (_d = (_c = getInitialScrollWatchdogTargetOffset(state)) != null ? _c : isStillScrollingTo.targetOffset) != null ? _d : state.scrollPending;
+        scrollToFallbackOffset(ctx, targetOffset);
+        scheduleFallbackCheck(silentInitialDispatch ? SILENT_INITIAL_SCROLL_RETRY_DELAY_MS : 100);
+      } else {
+        scheduleFallbackCheck(silentInitialDispatch ? SILENT_INITIAL_SCROLL_RETRY_DELAY_MS : 100);
       }
-    };
-    checkHasScrolled();
-  }, initialDelay);
+    }
+  };
+  scheduleFallbackCheck(initialDelay);
 }
 
 // src/core/initialScrollLifecycle.ts
@@ -3250,7 +3103,7 @@ function handleInitialScrollDataChange(ctx, options) {
     initialScrollAtEnd,
     latestInitialScroll,
     latestInitialScrollSessionKind,
-    stylePaddingBottom,
+    stylePaddingEnd,
     useBootstrapInitialScroll
   } = options;
   const state = ctx.state;
@@ -3280,7 +3133,7 @@ function handleInitialScrollDataChange(ctx, options) {
       didDataChange,
       initialScrollAtEnd,
       previousDataLength: previousInitialScrollDataLength,
-      stylePaddingBottom
+      stylePaddingEnd
     });
     return;
   }
@@ -3303,6 +3156,52 @@ function resetLayoutCachesForDataChange(state) {
   state.columnSpans.length = 0;
 }
 
+// src/core/scheduleContainerLayout.ts
+function getContainerLayoutEffectScope(ctx) {
+  var _a3;
+  const scheduledIds = ctx.pendingContainerIds;
+  ctx.pendingContainerIds = void 0;
+  if (scheduledIds === void 0) {
+    return void 0;
+  }
+  const state = ctx.state;
+  let targetContainerIds = scheduledIds;
+  if (targetContainerIds && ((_a3 = state.userScrollAnchorReset) == null ? void 0 : _a3.keys.size)) {
+    targetContainerIds = new Set(targetContainerIds);
+    for (const itemKey of state.userScrollAnchorReset.keys) {
+      const containerId = state.containerItemKeys.get(itemKey);
+      if (containerId !== void 0) {
+        targetContainerIds.add(containerId);
+      }
+    }
+  }
+  return targetContainerIds;
+}
+function scheduleContainerLayout(ctx, target) {
+  var _a3;
+  const isAlreadyScheduled = ctx.pendingContainerIds !== void 0;
+  const previousIds = ctx.pendingContainerIds;
+  if (target === void 0) {
+    ctx.pendingContainerIds = null;
+  } else if (previousIds !== null) {
+    let nextIds = previousIds;
+    if (!nextIds) {
+      nextIds = typeof target === "number" ? /* @__PURE__ */ new Set([target]) : new Set(target);
+    } else if (typeof target === "number") {
+      nextIds.add(target);
+    } else {
+      for (const containerId of target) {
+        nextIds.add(containerId);
+      }
+    }
+    ctx.pendingContainerIds = nextIds;
+  }
+  if (!isAlreadyScheduled) {
+    const nextEpoch = ((_a3 = peek$(ctx, "containerLayoutEpoch")) != null ? _a3 : 0) + 1;
+    set$(ctx, "containerLayoutEpoch", nextEpoch);
+  }
+}
+
 // src/core/syncMountedContainer.ts
 function syncMountedContainer(ctx, containerIndex, itemIndex, options) {
   var _a3, _b, _c, _d, _e, _f, _g, _h, _i;
@@ -3346,14 +3245,13 @@ function syncMountedContainer(ctx, containerIndex, itemIndex, options) {
       set$(ctx, `containerSpan${containerIndex}`, span);
     }
   }
-  const prevItemInfo = peek$(ctx, `containerItemInfo${containerIndex}`);
+  const prevIndex = peek$(ctx, `containerItemIndex${containerIndex}`);
+  if (prevIndex !== itemIndex) {
+    set$(ctx, `containerItemIndex${containerIndex}`, itemIndex);
+  }
   const prevData = peek$(ctx, `containerItemData${containerIndex}`);
-  let itemInfoValue = prevData;
-  let didChangeItemInfo = (prevItemInfo == null ? void 0 : prevItemInfo.itemKey) !== itemKey || (prevItemInfo == null ? void 0 : prevItemInfo.index) !== itemIndex || (prevItemInfo == null ? void 0 : prevItemInfo.value) !== prevData;
   const updateData = () => {
     set$(ctx, `containerItemData${containerIndex}`, item);
-    itemInfoValue = item;
-    didChangeItemInfo = true;
     didRefreshData = true;
   };
   if (prevData !== item) {
@@ -3388,13 +3286,6 @@ function syncMountedContainer(ctx, containerIndex, itemIndex, options) {
       }
     }
   }
-  if (didChangeItemInfo) {
-    set$(ctx, `containerItemInfo${containerIndex}`, {
-      index: itemIndex,
-      itemKey,
-      value: itemInfoValue
-    });
-  }
   return { didChangePosition, didRefreshData };
 }
 
@@ -3712,7 +3603,6 @@ function setupViewability(props) {
 }
 function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollSize, start, end, startBuffered = start, endBuffered = end) {
   const {
-    timeouts,
     props: { data }
   } = state;
   for (const viewabilityConfigCallbackPair of viewabilityConfigCallbackPairs) {
@@ -3722,11 +3612,10 @@ function updateViewableItems(state, ctx, viewabilityConfigCallbackPairs, scrollS
     viewabilityState.startBuffered = startBuffered;
     viewabilityState.endBuffered = endBuffered;
     if (viewabilityConfigCallbackPair.viewabilityConfig.minimumViewTime) {
-      const timer = setTimeout(() => {
-        timeouts.delete(timer);
-        updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize);
-      }, viewabilityConfigCallbackPair.viewabilityConfig.minimumViewTime);
-      timeouts.add(timer);
+      state.scheduledWork.timeout(
+        () => updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize),
+        viewabilityConfigCallbackPair.viewabilityConfig.minimumViewTime
+      );
     } else {
       updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, state, ctx, scrollSize);
     }
@@ -3759,19 +3648,29 @@ function updateViewableItemsWithConfig(data, viewabilityConfigCallbackPair, stat
   if (previousViewableItems) {
     for (const viewToken of previousViewableItems) {
       previousViewableKeys.add(viewToken.key);
+      const currentIndex = state.indexByKey.get(viewToken.key);
+      const currentItem = currentIndex !== void 0 ? data[currentIndex] : void 0;
       const containerId = findContainerId(ctx, viewToken.key);
-      if (!checkIsViewable(
-        state,
-        ctx,
-        viewabilityConfig,
-        containerId,
-        viewToken.key,
-        scrollSize,
-        viewToken.item,
-        viewToken.index
-      )) {
-        viewToken.isViewable = false;
-        changed.push(viewToken);
+      let isStillViewable = false;
+      if (currentIndex !== void 0 && currentItem !== void 0) {
+        isStillViewable = checkIsViewable(
+          state,
+          ctx,
+          viewabilityConfig,
+          containerId,
+          viewToken.key,
+          scrollSize,
+          currentItem,
+          currentIndex
+        );
+      }
+      if (!isStillViewable) {
+        changed.push({
+          ...viewToken,
+          index: currentIndex != null ? currentIndex : viewToken.index,
+          isViewable: false,
+          item: currentItem != null ? currentItem : viewToken.item
+        });
       }
     }
   }
@@ -3928,128 +3827,102 @@ function getExpandedContainerPoolSize(dataLength, numContainers) {
 
 // src/utils/findAvailableContainers.ts
 function findAvailableContainers(ctx, needNewContainers, startBuffered, endBuffered, pendingRemoval, getRequiredItemType, protectedKeys) {
+  var _a3;
   const numNeeded = needNewContainers.length;
   if (numNeeded === 0) {
     return [];
   }
   const numContainers = peek$(ctx, "numContainers");
   const state = ctx.state;
-  const { stickyContainerPool, containerItemTypes } = state;
+  const { containerItemMetadata, stickyContainerPool } = state;
   const shouldAvoidAssignedContainerReuse = state.props.recycleItems && !!state.props.positionComponentInternal;
-  const allocations = [];
   const pendingRemovalSet = pendingRemoval.length > 0 ? new Set(pendingRemoval) : void 0;
-  let pendingRemovalChanged = false;
+  const requests = needNewContainers.map((itemIndex, order) => ({
+    isSticky: state.props.stickyHeaderIndicesSet.has(itemIndex),
+    itemIndex,
+    itemType: getRequiredItemType == null ? void 0 : getRequiredItemType(itemIndex),
+    order
+  }));
+  const normalRequests = requests.filter((request) => !request.isSticky);
+  const stickyRequests = requests.filter((request) => request.isSticky);
+  const normalCandidates = [];
+  const stickyCandidates = [];
+  for (let containerIndex = 0; containerIndex < numContainers; containerIndex++) {
+    const key = peek$(ctx, `containerItemKey${containerIndex}`);
+    const isPendingRemoval = !!(pendingRemovalSet == null ? void 0 : pendingRemovalSet.has(containerIndex));
+    const isProtected = !!key && !!(protectedKeys == null ? void 0 : protectedKeys.has(key)) && state.indexByKey.has(key);
+    if (isProtected) {
+      continue;
+    }
+    if (stickyContainerPool.has(containerIndex)) {
+      if (key === void 0 || isPendingRemoval) {
+        stickyCandidates.push({ containerIndex, distance: Number.POSITIVE_INFINITY });
+      }
+    } else if (key === void 0 || isPendingRemoval) {
+      normalCandidates.push({ containerIndex, distance: Number.POSITIVE_INFINITY });
+    } else if (!shouldAvoidAssignedContainerReuse) {
+      const index = state.indexByKey.get(key);
+      if (index !== void 0 && (index < startBuffered || index > endBuffered)) {
+        const distance = index < startBuffered ? startBuffered - index : index - endBuffered;
+        normalCandidates.push({ containerIndex, distance });
+      }
+    }
+  }
+  normalCandidates.sort(comparatorByDistance);
+  const allocations = new Array(numNeeded);
   let nextNewContainerIndex = numContainers;
-  const usedContainers = /* @__PURE__ */ new Set();
-  let availableContainers;
-  const stickyHeaderIndicesSet = state.props.stickyHeaderIndicesSet;
-  const canReuseContainer = (containerIndex, requiredType) => {
-    if (!requiredType) return true;
-    const existingType = containerItemTypes.get(containerIndex);
-    if (!existingType) return true;
-    return existingType === requiredType;
-  };
-  const pushAllocation = (itemIndex, itemType, containerIndex) => {
-    allocations.push({
+  let pendingRemovalChanged = false;
+  const assign = (request, containerIndex) => {
+    allocations[request.order] = {
       containerIndex,
-      itemIndex,
-      itemType
-    });
-    usedContainers.add(containerIndex);
+      itemIndex: request.itemIndex,
+      itemType: request.itemType
+    };
     if (pendingRemovalSet == null ? void 0 : pendingRemovalSet.delete(containerIndex)) {
       pendingRemovalChanged = true;
     }
   };
-  const pushNewContainer = (itemIndex, itemType, isSticky) => {
-    const newContainerIndex = nextNewContainerIndex++;
-    pushAllocation(itemIndex, itemType, newContainerIndex);
-    if (isSticky) {
-      stickyContainerPool.add(newContainerIndex);
-    }
-    return newContainerIndex;
-  };
-  const canUseContainer = (containerIndex, itemType) => {
-    if (usedContainers.has(containerIndex) || stickyContainerPool.has(containerIndex)) {
-      return false;
-    }
-    const key = peek$(ctx, `containerItemKey${containerIndex}`);
-    const isPending = !!(pendingRemovalSet == null ? void 0 : pendingRemovalSet.has(containerIndex));
-    return (key === void 0 || isPending) && canReuseContainer(containerIndex, itemType);
-  };
-  const findStickyContainer = (itemType) => {
-    let foundContainer;
-    for (const containerIndex of stickyContainerPool) {
-      if (!usedContainers.has(containerIndex)) {
-        const key = peek$(ctx, `containerItemKey${containerIndex}`);
-        const isPendingRemoval = !!(pendingRemovalSet == null ? void 0 : pendingRemovalSet.has(containerIndex));
-        if ((key === void 0 || isPendingRemoval) && canReuseContainer(containerIndex, itemType)) {
-          foundContainer = containerIndex;
-          break;
-        }
-      }
-    }
-    return foundContainer;
-  };
-  const findUnassignedOrPendingContainer = (itemType) => {
-    let foundContainer;
-    for (let containerIndex = 0; containerIndex < numContainers && foundContainer === void 0; containerIndex++) {
-      if (canUseContainer(containerIndex, itemType)) {
-        foundContainer = containerIndex;
+  const assignMatching = (pendingRequests, candidates, matches) => {
+    for (const request of pendingRequests) {
+      if (allocations[request.order]) {
+        continue;
       }
-    }
-    return foundContainer;
-  };
-  const getAvailableContainers = () => {
-    if (!availableContainers) {
-      availableContainers = [];
-      if (!shouldAvoidAssignedContainerReuse) {
-        for (let containerIndex = 0; containerIndex < numContainers; containerIndex++) {
-          if (usedContainers.has(containerIndex) || stickyContainerPool.has(containerIndex)) {
-            continue;
-          }
-          const key = peek$(ctx, `containerItemKey${containerIndex}`);
-          if (key === void 0) continue;
-          if ((protectedKeys == null ? void 0 : protectedKeys.has(key)) && state.indexByKey.has(key)) continue;
-          const index = state.indexByKey.get(key);
-          const isOutOfView = index < startBuffered || index > endBuffered;
-          if (isOutOfView) {
-            const distance = index < startBuffered ? startBuffered - index : index - endBuffered;
-            availableContainers.push({ distance, index: containerIndex });
-          }
+      const candidateIndex = candidates.findIndex(
+        (candidate) => {
+          var _a4;
+          return matches((_a4 = containerItemMetadata.get(candidate.containerIndex)) == null ? void 0 : _a4.itemType, request.itemType);
         }
-        availableContainers.sort(comparatorByDistance);
+      );
+      if (candidateIndex !== -1) {
+        const [candidate] = candidates.splice(candidateIndex, 1);
+        assign(request, candidate.containerIndex);
       }
     }
-    return availableContainers;
   };
-  const findAvailableContainer = (itemType) => {
-    const containers = getAvailableContainers();
-    let matchIndex = -1;
-    for (let i = 0; i < containers.length && matchIndex === -1; i++) {
-      const containerIndex = containers[i].index;
-      if (!usedContainers.has(containerIndex) && canReuseContainer(containerIndex, itemType)) {
-        matchIndex = i;
-      }
+  const assignFromPool = (pendingRequests, candidates, allowCrossType) => {
+    if (getRequiredItemType) {
+      assignMatching(
+        pendingRequests,
+        candidates,
+        (containerType, requestType) => requestType !== void 0 && containerType === requestType
+      );
+    }
+    assignMatching(pendingRequests, candidates, (containerType) => containerType === void 0);
+    if (allowCrossType) {
+      assignMatching(pendingRequests, candidates, () => true);
     }
-    return matchIndex === -1 ? void 0 : containers.splice(matchIndex, 1)[0].index;
   };
-  for (const itemIndex of needNewContainers) {
-    const itemType = getRequiredItemType == null ? void 0 : getRequiredItemType(itemIndex);
-    const isSticky = stickyHeaderIndicesSet.has(itemIndex);
-    let containerIndex;
-    if (isSticky) {
-      containerIndex = findStickyContainer(itemType);
-    } else {
-      containerIndex = findUnassignedOrPendingContainer(itemType);
-      if (containerIndex === void 0) {
-        containerIndex = findAvailableContainer(itemType);
-      }
+  assignFromPool(normalRequests, normalCandidates, true);
+  assignFromPool(stickyRequests, stickyCandidates, false);
+  for (const request of requests) {
+    if (allocations[request.order]) {
+      continue;
     }
-    if (containerIndex !== void 0) {
-      pushAllocation(itemIndex, itemType, containerIndex);
-    } else {
-      pushNewContainer(itemIndex, itemType, isSticky);
+    const containerIndex = nextNewContainerIndex++;
+    if (request.isSticky) {
+      stickyContainerPool.add(containerIndex);
     }
+    assign(request, containerIndex);
   }
   if (pendingRemovalChanged) {
     pendingRemoval.length = 0;
@@ -4059,18 +3932,21 @@ function findAvailableContainers(ctx, needNewContainers, startBuffered, endBuffe
       }
     }
   }
-  if (IS_DEV && nextNewContainerIndex > 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.",
-      {
-        debugInfo: {
-          numContainers,
-          numContainersPooled: peek$(ctx, "numContainersPooled"),
-          numNeeded,
-          stillNeeded: nextNewContainerIndex - numContainers
+  if (IS_DEV) {
+    const numContainersPooled = (_a3 = peek$(ctx, "numContainersPooled")) != null ? _a3 : Number.POSITIVE_INFINITY;
+    if (nextNewContainerIndex > 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.",
+        {
+          debugInfo: {
+            numContainers,
+            numContainersPooled,
+            numNeeded,
+            stillNeeded: nextNewContainerIndex - numContainers
+          }
         }
-      }
-    );
+      );
+    }
   }
   return allocations;
 }
@@ -4098,20 +3974,15 @@ function getProjectedBufferAdjustment(scrollVelocity, trailingBuffer) {
 }
 function scheduleRenderRangeProjectionSettle(ctx) {
   const state = ctx.state;
-  const previousTimeout = state.timeoutRenderRangeProjectionSettle;
-  if (previousTimeout !== void 0) {
-    clearTimeout(previousTimeout);
-    state.timeouts.delete(previousTimeout);
-  }
-  const timeout = setTimeout(() => {
-    var _a3;
-    state.timeoutRenderRangeProjectionSettle = void 0;
-    state.timeouts.delete(timeout);
-    state.scrollHistory.length = 0;
-    (_a3 = state.triggerCalculateItemsInView) == null ? void 0 : _a3.call(state);
-  }, RENDER_RANGE_PROJECTION_SETTLE_DELAY);
-  state.timeoutRenderRangeProjectionSettle = timeout;
-  state.timeouts.add(timeout);
+  state.scheduledWork.timeout(
+    () => {
+      var _a3;
+      state.scrollHistory.length = 0;
+      (_a3 = state.triggerCalculateItemsInView) == null ? void 0 : _a3.call(state);
+    },
+    RENDER_RANGE_PROJECTION_SETTLE_DELAY,
+    "renderRangeProjection"
+  );
 }
 function findCurrentStickyIndex(stickyArray, scroll, state) {
   const positions = state.positions;
@@ -4305,7 +4176,7 @@ function updateViewabilityForCachedRange(ctx, viewabilityConfigCallbackPairs, sc
 function calculateItemsInView(ctx, params = {}) {
   const state = ctx.state;
   batchedUpdates(() => {
-    var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t;
+    var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
     const {
       columns,
       containerItemKeys,
@@ -4333,6 +4204,7 @@ function calculateItemsInView(ctx, params = {}) {
       return;
     }
     let totalSize = getContentSize(ctx);
+    let changedContainerIds;
     const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "alignItemsAtEndPadding") + peek$(ctx, "headerSize");
     const numColumns = peek$(ctx, "numColumns");
     const speed = (_b = params.scrollVelocity) != null ? _b : getScrollVelocity(state);
@@ -4458,7 +4330,7 @@ function calculateItemsInView(ctx, params = {}) {
     const scrollAdjustPendingBeforeMVCP = (_f = peek$(ctx, "scrollAdjustPending")) != null ? _f : 0;
     checkMVCP == null ? void 0 : checkMVCP();
     const didMVCPAdjustScroll = !!checkMVCP && (state.scroll !== scrollBeforeMVCP || ((_g = peek$(ctx, "scrollAdjustPending")) != null ? _g : 0) !== scrollAdjustPendingBeforeMVCP);
-    if (didMVCPAdjustScroll && (initialScroll || state.scrollingTo)) {
+    if (didMVCPAdjustScroll) {
       updateScroll2(state.scroll);
       updateScrollRange();
     }
@@ -4638,22 +4510,20 @@ function calculateItemsInView(ctx, params = {}) {
           if (oldKey && oldKey !== id) {
             containerItemKeys.delete(oldKey);
           }
+          if (oldKey !== id) {
+            changedContainerIds != null ? changedContainerIds : changedContainerIds = /* @__PURE__ */ new Set();
+            changedContainerIds.add(containerIndex);
+            state.containerItemGenerations[containerIndex] = ((_p = state.containerItemGenerations[containerIndex]) != null ? _p : 0) + 1;
+          }
           set$(ctx, `containerItemKey${containerIndex}`, id);
+          set$(ctx, `containerItemIndex${containerIndex}`, i);
           set$(ctx, `containerItemData${containerIndex}`, data[i]);
-          set$(ctx, `containerItemInfo${containerIndex}`, {
-            index: i,
-            itemKey: id,
-            value: data[i]
-          });
-          if (allocation.itemType !== void 0) {
-            state.containerItemTypes.set(containerIndex, allocation.itemType);
-          }
+          state.containerItemMetadata.set(
+            containerIndex,
+            createContainerItemMetadata(state, i, data[i], allocation.itemType)
+          );
           containerItemKeys.set(id, containerIndex);
-          (_p = state.userScrollAnchorReset) == null ? void 0 : _p.keys.add(id);
-          {
-            (_q = state.pendingLayoutEffectMeasurements) != null ? _q : state.pendingLayoutEffectMeasurements = /* @__PURE__ */ new Set();
-            state.pendingLayoutEffectMeasurements.add(id);
-          }
+          (_q = state.userScrollAnchorReset) == null ? void 0 : _q.keys.add(id);
           const containerSticky = `containerSticky${containerIndex}`;
           const isSticky = stickyHeaderIndicesSet.has(i);
           const isPinnedRender = isPinnedRenderIndex(i);
@@ -4703,15 +4573,18 @@ function calculateItemsInView(ctx, params = {}) {
       if (pendingRemovalSet == null ? void 0 : pendingRemovalSet.has(i)) {
         if (itemKey !== void 0) {
           containerItemKeys.delete(itemKey);
+          changedContainerIds != null ? changedContainerIds : changedContainerIds = /* @__PURE__ */ new Set();
+          changedContainerIds.add(i);
+          state.containerItemGenerations[i] = ((_t = state.containerItemGenerations[i]) != null ? _t : 0) + 1;
         }
-        state.containerItemTypes.delete(i);
+        state.containerItemMetadata.delete(i);
         if (state.stickyContainerPool.has(i)) {
           set$(ctx, `containerSticky${i}`, false);
           state.stickyContainerPool.delete(i);
         }
         set$(ctx, `containerItemKey${i}`, void 0);
+        set$(ctx, `containerItemIndex${i}`, void 0);
         set$(ctx, `containerItemData${i}`, void 0);
-        set$(ctx, `containerItemInfo${i}`, void 0);
         set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
         set$(ctx, `containerColumn${i}`, -1);
         set$(ctx, `containerSpan${i}`, 1);
@@ -4725,6 +4598,9 @@ function calculateItemsInView(ctx, params = {}) {
         }
       }
     }
+    if (changedContainerIds && (IsNewArchitecture)) {
+      scheduleContainerLayout(ctx, changedContainerIds);
+    }
     if (didChangePositions) {
       set$(ctx, "lastPositionUpdate", Date.now());
     }
@@ -4741,20 +4617,18 @@ function calculateItemsInView(ctx, params = {}) {
       }
     }
     if (viewabilityConfigCallbackPairs && visibleRange.startNoBuffer !== null && visibleRange.endNoBuffer !== null) {
-      if (!didMVCPAdjustScroll) {
-        updateViewableItems(
-          ctx.state,
-          ctx,
-          viewabilityConfigCallbackPairs,
-          scrollLength,
-          visibleRange.startNoBuffer,
-          visibleRange.endNoBuffer,
-          startBuffered != null ? startBuffered : visibleRange.startNoBuffer,
-          endBuffered != null ? endBuffered : visibleRange.endNoBuffer
-        );
-      }
+      updateViewableItems(
+        ctx.state,
+        ctx,
+        viewabilityConfigCallbackPairs,
+        scrollLength,
+        visibleRange.startNoBuffer,
+        visibleRange.endNoBuffer,
+        startBuffered != null ? startBuffered : visibleRange.startNoBuffer,
+        endBuffered != null ? endBuffered : visibleRange.endNoBuffer
+      );
     }
-    (_t = stickyState == null ? void 0 : stickyState.finishCalculateItemsInView) == null ? void 0 : _t.call(stickyState);
+    (_u = stickyState == null ? void 0 : stickyState.finishCalculateItemsInView) == null ? void 0 : _u.call(stickyState);
   });
 }
 
@@ -4776,8 +4650,6 @@ function maybeUpdateAnchoredEndSpace(ctx) {
     if (anchorIndex >= 0 && anchorIndex < data.length && state.scrollLength > 0) {
       nextAnchorKey = getId(state, anchorIndex);
       let contentBelowAnchor = 0;
-      const footerSize = ctx.values.get("footerSize") || 0;
-      const stylePaddingBottom = state.props.stylePaddingBottom || 0;
       let hasUnknownTailSize = false;
       for (let index = anchorIndex; index < data.length; index++) {
         const size = getKnownOrFixedItemSize(ctx, index);
@@ -4789,14 +4661,16 @@ function maybeUpdateAnchoredEndSpace(ctx) {
           contentBelowAnchor += effectiveSize;
         }
       }
-      contentBelowAnchor += footerSize + stylePaddingBottom;
+      contentBelowAnchor = Math.max(0, contentBelowAnchor - ctx.scrollAxisGap);
+      contentBelowAnchor += (ctx.values.get("footerSize") || 0) + getStylePaddingEnd(state.props);
       isReady = !hasUnknownTailSize;
       nextSize = hasUnknownTailSize ? previousSize || 0 : Math.max(0, state.scrollLength - contentBelowAnchor - anchorOffset);
     } else if (anchorIndex >= 0) {
       isReady = false;
     }
   }
-  const didSizeChange = previousSize !== nextSize;
+  const didSizeChange = previousSize !== nextSize && (previousSize !== void 0 || anchoredEndSpace !== void 0);
+  const didEffectiveSizeChange = (previousSize || 0) !== nextSize;
   const didReadyAnchorChange = previousReadyAnchorIndex !== nextAnchorIndex || previousReadyAnchorKey !== nextAnchorKey;
   if (isReady && (didSizeChange || didReadyAnchorChange)) {
     state.anchoredEndSpaceReadyAnchorIndex = nextAnchorIndex;
@@ -4805,8 +4679,9 @@ function maybeUpdateAnchoredEndSpace(ctx) {
       set$(ctx, "anchoredEndSpaceSize", nextSize);
       (_a3 = anchoredEndSpace == null ? void 0 : anchoredEndSpace.onSizeChanged) == null ? void 0 : _a3.call(anchoredEndSpace, nextSize);
     }
-    if (didSizeChange && (anchoredEndSpace == null ? void 0 : anchoredEndSpace.includeInEndInset)) {
-      updateScroll(ctx, state.scroll, true);
+    if (didEffectiveSizeChange) {
+      updateContentMetricsState(ctx);
+      updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
     }
     (_b = anchoredEndSpace == null ? void 0 : anchoredEndSpace.onReady) == null ? void 0 : _b.call(anchoredEndSpace, { anchorIndex: nextAnchorIndex, anchorKey: nextAnchorKey, size: nextSize });
   }
@@ -4824,16 +4699,10 @@ function runOrScheduleMVCPRecalculate(ctx) {
     }
   } else {
     if (!state.mvcpAnchorLock) {
-      if (state.queuedMVCPRecalculate !== void 0) {
-        cancelAnimationFrame(state.queuedMVCPRecalculate);
-        state.queuedMVCPRecalculate = void 0;
-      }
+      state.scheduledWork.cancel("mvcpRecalculate");
       calculateItemsInView(ctx, { doMVCP: true });
-    } else if (state.queuedMVCPRecalculate === void 0) {
-      state.queuedMVCPRecalculate = requestAnimationFrame(() => {
-        state.queuedMVCPRecalculate = void 0;
-        calculateItemsInView(ctx, { doMVCP: true });
-      });
+    } else if (!state.scheduledWork.has("mvcpRecalculate")) {
+      state.scheduledWork.frame(() => calculateItemsInView(ctx, { doMVCP: true }), "mvcpRecalculate");
     }
   }
 }
@@ -4847,42 +4716,28 @@ function updateOtherAxisSizeIfNeeded(ctx, sizeObj, horizontal) {
     }
   }
 }
+var activeItemSizeBatches;
+function batchItemSizeUpdates(runUpdates) {
+  const isOuterBatch = activeItemSizeBatches === void 0;
+  activeItemSizeBatches != null ? activeItemSizeBatches : activeItemSizeBatches = /* @__PURE__ */ new Map();
+  try {
+    runUpdates();
+  } finally {
+    if (isOuterBatch) {
+      const batches = activeItemSizeBatches;
+      activeItemSizeBatches = void 0;
+      for (const [ctx, measurements] of batches) {
+        updateItemSizesBatch(ctx, measurements);
+      }
+    }
+  }
+}
 function mergeItemSizeUpdateResult(result, next) {
   result.didChange || (result.didChange = next.didChange);
   result.didMeasureUserScrollAnchorResetItem || (result.didMeasureUserScrollAnchorResetItem = next.didMeasureUserScrollAnchorResetItem);
   result.needsRecalculate || (result.needsRecalculate = next.needsRecalculate);
   result.shouldMaintainScrollAtEnd || (result.shouldMaintainScrollAtEnd = next.shouldMaintainScrollAtEnd);
 }
-var batchedItemSizeRecalculates = /* @__PURE__ */ new WeakMap();
-function flushBatchedItemSizeRecalculate(ctx, didFallback = false, expectedResult) {
-  const result = batchedItemSizeRecalculates.get(ctx);
-  if (!result || expectedResult && result !== expectedResult) {
-    return;
-  }
-  batchedItemSizeRecalculates.delete(ctx);
-  if (didFallback) {
-    ctx.state.pendingLayoutEffectMeasurements = void 0;
-  }
-  flushItemSizeUpdates(ctx, result);
-}
-function queueItemSizeRecalculate(ctx, result) {
-  var _a3, _b;
-  const batch = batchedItemSizeRecalculates.get(ctx);
-  if (batch) {
-    mergeItemSizeUpdateResult(batch, result);
-  } else {
-    const nextBatch = { ...result };
-    batchedItemSizeRecalculates.set(ctx, nextBatch);
-    if ((_a3 = ctx.state.pendingLayoutEffectMeasurements) == null ? void 0 : _a3.size) {
-      requestAnimationFrame(() => {
-        flushBatchedItemSizeRecalculate(ctx, true, nextBatch);
-      });
-    }
-  }
-  if (!((_b = ctx.state.pendingLayoutEffectMeasurements) == null ? void 0 : _b.size)) {
-    flushBatchedItemSizeRecalculate(ctx);
-  }
-}
 function flushItemSizeUpdates(ctx, result) {
   var _a3;
   const state = ctx.state;
@@ -4892,59 +4747,44 @@ function flushItemSizeUpdates(ctx, result) {
   } else if (result.didMeasureUserScrollAnchorResetItem && ((_a3 = state.userScrollAnchorReset) == null ? void 0 : _a3.keys.size) === 0) {
     state.userScrollAnchorReset = void 0;
   }
+  if (result.didChange) {
+    maybeUpdateAnchoredEndSpace(ctx);
+  }
   if (result.didChange && result.shouldMaintainScrollAtEnd) {
     doMaintainScrollAtEnd(ctx);
   }
 }
 function updateItemSizes(ctx, measurement) {
-  var _a3, _b, _c, _d;
-  const state = ctx.state;
-  let didDrainLayoutEffectMeasurements = false;
-  if (measurement.fromLayoutEffect) {
-    const pendingLayoutEffectMeasurements = state.pendingLayoutEffectMeasurements;
-    if ((pendingLayoutEffectMeasurements == null ? void 0 : pendingLayoutEffectMeasurements.delete(measurement.itemKey)) && pendingLayoutEffectMeasurements.size === 0) {
-      state.pendingLayoutEffectMeasurements = void 0;
-      didDrainLayoutEffectMeasurements = true;
-    }
-  }
-  const pendingKeys = (_a3 = state.userScrollAnchorReset) == null ? void 0 : _a3.keys;
-  const shouldBatchPendingMeasurements = measurement.fromLayoutEffect && !!(pendingKeys == null ? void 0 : pendingKeys.size);
-  const shouldQueueRecalculate = !!measurement.fromLayoutEffect;
-  let result;
-  if (!shouldBatchPendingMeasurements) {
-    result = applyItemSize(ctx, measurement.itemKey, measurement.size);
-  } else {
-    result = {};
-    const updateContainerItemSize = (itemKey, containerId, size) => {
-      if (containerId !== void 0 && peek$(ctx, `containerItemKey${containerId}`) === itemKey) {
-        mergeItemSizeUpdateResult(result, applyItemSize(ctx, itemKey, size));
-      }
-    };
-    updateContainerItemSize(measurement.itemKey, measurement.containerId, measurement.size);
-    const keys = Array.from(pendingKeys);
-    for (const itemKey of keys) {
-      const containerId = state.containerItemKeys.get(itemKey);
-      if (containerId !== void 0) {
-        (_d = (_c = (_b = ctx.viewRefs.get(containerId)) == null ? void 0 : _b.current) == null ? void 0 : _c.measure) == null ? void 0 : _d.call(_c, (_x, _y, width, height) => {
-          if (pendingKeys.has(itemKey)) {
-            updateContainerItemSize(itemKey, containerId, { height, width });
-          }
-        });
-      }
+  if (activeItemSizeBatches) {
+    const measurements = activeItemSizeBatches.get(ctx);
+    if (measurements) {
+      measurements.push(measurement);
+    } else {
+      activeItemSizeBatches.set(ctx, [measurement]);
     }
-  }
-  if (shouldQueueRecalculate && result.needsRecalculate) {
-    queueItemSizeRecalculate(ctx, result);
   } else {
-    flushItemSizeUpdates(ctx, result);
-  }
-  if (didDrainLayoutEffectMeasurements) {
-    flushBatchedItemSizeRecalculate(ctx);
+    updateItemSizesBatch(ctx, [measurement]);
   }
 }
-function applyItemSize(ctx, itemKey, sizeObj) {
+function updateItemSizesBatch(ctx, measurements) {
   var _a3;
   const state = ctx.state;
+  const result = {};
+  for (const measurement of measurements) {
+    const ownsMeasuredItem = measurement.containerId === void 0 || peek$(ctx, `containerItemKey${measurement.containerId}`) === measurement.itemKey;
+    if (ownsMeasuredItem) {
+      const index = state.indexByKey.get(measurement.itemKey);
+      const itemData = index === void 0 ? void 0 : (_a3 = state.props.data) == null ? void 0 : _a3[index];
+      const metadata = measurement.containerId !== void 0 && index !== void 0 && itemData !== void 0 ? resolveContainerItemMetadata(state, measurement.containerId, index, itemData) : void 0;
+      const nextResult = applyItemSize(ctx, measurement.itemKey, measurement.size, metadata);
+      mergeItemSizeUpdateResult(result, nextResult);
+    }
+  }
+  flushItemSizeUpdates(ctx, result);
+}
+function applyItemSize(ctx, itemKey, sizeObj, resolvedMeasurementItem) {
+  var _a3, _b;
+  const state = ctx.state;
   const userScrollAnchorReset = state.userScrollAnchorReset;
   const didMeasureUserScrollAnchorResetItem = !!(userScrollAnchorReset == null ? void 0 : userScrollAnchorReset.keys.delete(itemKey));
   const {
@@ -4954,7 +4794,6 @@ function applyItemSize(ctx, itemKey, sizeObj) {
   } = state;
   if (!data) return { didMeasureUserScrollAnchorResetItem };
   const index = state.indexByKey.get(itemKey);
-  let resolvedMeasurementItem;
   if (getFixedItemSize) {
     if (index === void 0) {
       return { didMeasureUserScrollAnchorResetItem };
@@ -4963,14 +4802,15 @@ function applyItemSize(ctx, itemKey, sizeObj) {
     if (itemData === void 0) {
       return { didMeasureUserScrollAnchorResetItem };
     }
-    const type = getItemType ? (_a3 = getItemType(itemData, index)) != null ? _a3 : "" : "";
-    const size2 = getFixedItemSize(itemData, index, type);
-    resolvedMeasurementItem = {
-      didResolveFixedItemSize: true,
-      fixedItemSize: size2,
-      itemData,
-      itemType: type
-    };
+    if (!(resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.didResolveFixedItemSize)) {
+      const type = (_b = resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.itemType) != null ? _b : getItemType ? (_a3 = getItemType(itemData, index)) != null ? _a3 : "" : "";
+      resolvedMeasurementItem = {
+        didResolveFixedItemSize: true,
+        fixedItemSize: getFixedItemSize(itemData, index, type),
+        itemType: type
+      };
+    }
+    const size2 = resolvedMeasurementItem.fixedItemSize;
     if (size2 !== void 0 && size2 === sizesKnown.get(itemKey)) {
       updateOtherAxisSizeIfNeeded(ctx, sizeObj, horizontal);
       return { didMeasureUserScrollAnchorResetItem };
@@ -4999,7 +4839,6 @@ function applyItemSize(ctx, itemKey, sizeObj) {
       previous: size - diff,
       size
     });
-    maybeUpdateAnchoredEndSpace(ctx);
   }
   if (minIndexSizeChanged !== void 0) {
     state.minIndexSizeChanged = state.minIndexSizeChanged !== void 0 ? Math.min(state.minIndexSizeChanged, minIndexSizeChanged) : minIndexSizeChanged;
@@ -5020,7 +4859,7 @@ function applyItemSize(ctx, itemKey, sizeObj) {
   };
 }
 function updateOneItemSize(ctx, itemKey, sizeObj, resolvedMeasurementItem) {
-  var _a3, _b, _c;
+  var _a3, _b;
   const state = ctx.state;
   const {
     indexByKey,
@@ -5030,11 +4869,11 @@ function updateOneItemSize(ctx, itemKey, sizeObj, resolvedMeasurementItem) {
   } = state;
   if (!data) return 0;
   const index = indexByKey.get(itemKey);
-  const itemData = (_a3 = resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.itemData) != null ? _a3 : data[index];
+  const itemData = data[index];
   let itemType = resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.itemType;
   let fixedItemSize = resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.fixedItemSize;
   if (getFixedItemSize && !(resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.didResolveFixedItemSize)) {
-    itemType = getItemType ? (_b = getItemType(itemData, index)) != null ? _b : "" : "";
+    itemType = getItemType ? (_a3 = getItemType(itemData, index)) != null ? _a3 : "" : "";
     fixedItemSize = getFixedItemSize(itemData, index, itemType);
   }
   const resolvedItemSize = (resolvedMeasurementItem == null ? void 0 : resolvedMeasurementItem.didResolveFixedItemSize) || itemType !== void 0 || fixedItemSize !== void 0 ? {
@@ -5048,26 +4887,346 @@ function updateOneItemSize(ctx, itemKey, sizeObj, resolvedMeasurementItem) {
   const size = Math.round(rawSize) ;
   sizesKnown.set(itemKey, size);
   if (fixedItemSize === void 0 && size > 0) {
-    itemType != null ? itemType : itemType = getItemType ? (_c = getItemType(itemData, index)) != null ? _c : "" : "";
+    itemType != null ? itemType : itemType = getItemType ? (_b = getItemType(itemData, index)) != null ? _b : "" : "";
     let averages = averageSizes[itemType];
     if (!averages) {
       averages = averageSizes[itemType] = { avg: 0, num: 0 };
     }
-    if (averages.num === 0) {
-      averages.avg = size;
-      averages.num++;
-    } else if (prevSizeKnown !== void 0 && prevSizeKnown > 0) {
-      averages.avg += (size - prevSizeKnown) / averages.num;
-    } else {
-      averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
-      averages.num++;
+    if (averages.num === 0) {
+      averages.avg = size;
+      averages.num++;
+    } else if (prevSizeKnown !== void 0 && prevSizeKnown > 0) {
+      averages.avg += (size - prevSizeKnown) / averages.num;
+    } else {
+      averages.avg = (averages.avg * averages.num + size) / (averages.num + 1);
+      averages.num++;
+    }
+  }
+  if (!prevSize || Math.abs(prevSize - size) > 0.1) {
+    setSize(ctx, itemKey, size);
+    return size - prevSize;
+  }
+  return 0;
+}
+
+// src/core/measureContainersInLayoutEffect.ts
+function measureContainersInLayoutEffect(ctx, targetContainerIds = null) {
+  const measurements = [];
+  const containerIds = targetContainerIds != null ? targetContainerIds : ctx.viewRefs.keys();
+  for (const containerId of containerIds) {
+    const viewRef = ctx.viewRefs.get(containerId);
+    const itemKey = peek$(ctx, `containerItemKey${containerId}`);
+    const element = viewRef == null ? void 0 : viewRef.current;
+    if (itemKey !== void 0 && element) {
+      const rect = element.getBoundingClientRect();
+      setContainerLayoutBaseline(element, rect);
+      measurements.push({
+        containerId,
+        itemKey,
+        size: { height: rect.height, width: rect.width }
+      });
+    }
+  }
+  if (measurements.length > 0) {
+    updateItemSizesBatch(ctx, measurements);
+  }
+}
+var typedForwardRef = React3.forwardRef;
+var typedMemo = React3.memo;
+
+// src/components/ContainerLayoutCoordinator.tsx
+var ContainerLayoutCoordinator = typedMemo(function ContainerLayoutCoordinatorComponent({
+  children
+}) {
+  const ctx = useStateContext();
+  const [containerLayoutEpoch] = useArr$(["containerLayoutEpoch"]);
+  React3.useLayoutEffect(() => {
+    {
+      const targetContainerIds = getContainerLayoutEffectScope(ctx);
+      if (targetContainerIds !== void 0) {
+        measureContainersInLayoutEffect(ctx, targetContainerIds);
+      }
+    }
+  }, [ctx, containerLayoutEpoch]);
+  return children;
+});
+var getComponent = (Component) => {
+  if (React3.isValidElement(Component)) {
+    return Component;
+  }
+  if (Component) {
+    return /* @__PURE__ */ React3.createElement(Component, null);
+  }
+  return null;
+};
+
+// src/components/PositionView.tsx
+var isRNWeb = typeof document !== "undefined" && !!document.getElementById("react-native-stylesheet");
+var baseCss = {
+  contain: "paint layout style",
+  ...isRNWeb ? {
+    display: "flex",
+    flexDirection: "column"
+  } : {}
+};
+var PositionViewState = typedMemo(function PositionViewState2({
+  id,
+  horizontal,
+  style,
+  refView,
+  ...props
+}) {
+  const [position = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
+  const composed = isArray(style) ? Object.assign({}, ...style) : style;
+  const combinedStyle = horizontal ? { ...baseCss, ...composed, left: position } : { ...baseCss, ...composed, top: position };
+  const {
+    animatedScrollY: _animatedScrollY,
+    onLayout: _onLayout,
+    onLayoutChange: _onLayoutChange,
+    stickyHeaderConfig: _stickyHeaderConfig,
+    ...webProps
+  } = props;
+  return /* @__PURE__ */ React3.createElement("div", { ref: refView, ...webProps, style: combinedStyle });
+});
+var PositionViewSticky = typedMemo(function PositionViewSticky2({
+  id,
+  horizontal,
+  style,
+  refView,
+  animatedScrollY: _animatedScrollY,
+  stickyHeaderConfig,
+  onLayout: _onLayout,
+  onLayoutChange: _onLayoutChange,
+  children,
+  ...webProps
+}) {
+  const [position = POSITION_OUT_OF_VIEW, activeStickyIndex, itemIndex] = useArr$([
+    `containerPosition${id}`,
+    "activeStickyIndex",
+    `containerItemIndex${id}`
+  ]);
+  const composed = React3.useMemo(
+    () => {
+      var _a3;
+      return (_a3 = isArray(style) ? Object.assign({}, ...style) : style) != null ? _a3 : {};
+    },
+    [style]
+  );
+  const viewStyle = React3.useMemo(() => {
+    var _a3;
+    const styleBase = { ...baseCss, ...composed };
+    delete styleBase.transform;
+    const offset = (_a3 = stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset) != null ? _a3 : 0;
+    const isActive = activeStickyIndex === itemIndex;
+    styleBase.position = isActive ? "sticky" : "absolute";
+    styleBase.zIndex = itemIndex + 1e3;
+    if (horizontal) {
+      styleBase.left = isActive ? offset : position;
+    } else {
+      styleBase.top = isActive ? offset : position;
+    }
+    return styleBase;
+  }, [composed, horizontal, position, itemIndex, activeStickyIndex, stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset]);
+  const renderStickyHeaderBackdrop = React3.useMemo(
+    () => (stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent) ? /* @__PURE__ */ React3.createElement(
+      "div",
+      {
+        style: {
+          inset: 0,
+          pointerEvents: "none",
+          position: "absolute"
+        }
+      },
+      getComponent(stickyHeaderConfig.backdropComponent)
+    ) : null,
+    [stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent]
+  );
+  return /* @__PURE__ */ React3.createElement("div", { ref: refView, style: viewStyle, ...webProps }, renderStickyHeaderBackdrop, children);
+});
+var PositionView = PositionViewState;
+function useInit(cb) {
+  useState(() => cb());
+}
+
+// src/state/ContextContainer.ts
+var ContextContainer = createContext(null);
+var NO_CONTAINER_ID = -1;
+function useContextContainer() {
+  return useContext(ContextContainer);
+}
+function useContainerItemSignals(containerContext) {
+  var _a3;
+  const containerId = (_a3 = containerContext == null ? void 0 : containerContext.containerId) != null ? _a3 : NO_CONTAINER_ID;
+  const [itemKey, itemIndex, item] = useArr$([
+    `containerItemKey${containerId}`,
+    `containerItemIndex${containerId}`,
+    `containerItemData${containerId}`
+  ]);
+  return {
+    hasItemInfo: !!containerContext && itemKey !== void 0 && itemIndex !== void 0,
+    item,
+    itemIndex,
+    itemKey
+  };
+}
+function useAdaptiveRender() {
+  const [mode] = useArr$(["adaptiveRender"]);
+  return mode;
+}
+function useAdaptiveRenderChange(callback) {
+  const ctx = useStateContext();
+  const callbackRef = useRef(callback);
+  callbackRef.current = callback;
+  useLayoutEffect(() => {
+    let mode = peek$(ctx, "adaptiveRender");
+    return listen$(ctx, "adaptiveRender", (nextMode) => {
+      if (mode !== nextMode) {
+        mode = nextMode;
+        callbackRef.current(nextMode);
+      }
+    });
+  }, [ctx]);
+}
+function useViewability(callback, configId) {
+  const ctx = useStateContext();
+  const containerContext = useContextContainer();
+  useInit(() => {
+    if (!containerContext) {
+      return;
+    }
+    const { containerId } = containerContext;
+    const key = containerId + (configId != null ? configId : "");
+    const value = ctx.mapViewabilityValues.get(key);
+    if (value) {
+      callback(value);
+    }
+  });
+  useEffect(() => {
+    if (!containerContext) {
+      return;
+    }
+    const { containerId } = containerContext;
+    const key = containerId + (configId != null ? configId : "");
+    ctx.mapViewabilityCallbacks.set(key, callback);
+    return () => {
+      ctx.mapViewabilityCallbacks.delete(key);
+    };
+  }, [ctx, callback, configId, containerContext]);
+}
+function useViewabilityAmount(callback) {
+  const ctx = useStateContext();
+  const containerContext = useContextContainer();
+  useInit(() => {
+    if (!containerContext) {
+      return;
+    }
+    const { containerId } = containerContext;
+    const value = ctx.mapViewabilityAmountValues.get(containerId);
+    if (value) {
+      callback(value);
+    }
+  });
+  useEffect(() => {
+    if (!containerContext) {
+      return;
+    }
+    const { containerId } = containerContext;
+    ctx.mapViewabilityAmountCallbacks.set(containerId, callback);
+    return () => {
+      ctx.mapViewabilityAmountCallbacks.delete(containerId);
+    };
+  }, [ctx, callback, containerContext]);
+}
+function useRecyclingEffect(effect) {
+  const containerContext = useContextContainer();
+  const { hasItemInfo, item, itemIndex, itemKey } = useContainerItemSignals(containerContext);
+  const prevInfo = useRef(void 0);
+  useEffect(() => {
+    if (!hasItemInfo) {
+      return;
+    }
+    let ret;
+    if (prevInfo.current) {
+      ret = effect({
+        index: itemIndex,
+        item,
+        prevIndex: prevInfo.current.index,
+        prevItem: prevInfo.current.item
+      });
+    }
+    prevInfo.current = {
+      index: itemIndex,
+      item
+    };
+    return ret;
+  }, [effect, hasItemInfo, itemIndex, item, itemKey]);
+}
+function useRecyclingState(valueOrFun) {
+  const containerContext = useContextContainer();
+  const { hasItemInfo, item, itemIndex, itemKey } = useContainerItemSignals(containerContext);
+  const computeValue = () => {
+    if (isFunction(valueOrFun)) {
+      const initializer = valueOrFun;
+      return hasItemInfo ? initializer({
+        index: itemIndex,
+        item,
+        prevIndex: void 0,
+        prevItem: void 0
+      }) : initializer();
     }
+    return valueOrFun;
+  };
+  const [stateValue, setStateValue] = useState(() => {
+    return computeValue();
+  });
+  const prevItemKeyRef = useRef(hasItemInfo ? itemKey : null);
+  if (hasItemInfo && prevItemKeyRef.current !== itemKey) {
+    prevItemKeyRef.current = itemKey;
+    setStateValue(computeValue());
   }
-  if (!prevSize || Math.abs(prevSize - size) > 0.1) {
-    setSize(ctx, itemKey, size);
-    return size - prevSize;
-  }
-  return 0;
+  const triggerLayout = containerContext == null ? void 0 : containerContext.triggerLayout;
+  const setState = useCallback(
+    (newState) => {
+      if (!triggerLayout) {
+        return;
+      }
+      setStateValue((prevValue) => {
+        return isFunction(newState) ? newState(prevValue) : newState;
+      });
+      triggerLayout();
+    },
+    [triggerLayout]
+  );
+  return [stateValue, setState];
+}
+function useIsLastItem() {
+  var _a3;
+  const containerContext = useContextContainer();
+  const containerId = (_a3 = containerContext == null ? void 0 : containerContext.containerId) != null ? _a3 : NO_CONTAINER_ID;
+  const [itemKey] = useArr$([`containerItemKey${containerId}`]);
+  const isLast = useSelector$("lastItemKeys", (lastItemKeys) => {
+    if (containerContext && !isNullOrUndefined(itemKey)) {
+      return (lastItemKeys == null ? void 0 : lastItemKeys.includes(itemKey)) || false;
+    }
+    return false;
+  });
+  return isLast;
+}
+function useListScrollSize() {
+  const [scrollSize] = useArr$(["scrollSize"]);
+  return scrollSize;
+}
+var noop = () => {
+};
+function useSyncLayout() {
+  const containerContext = useContextContainer();
+  return containerContext ? containerContext.triggerLayout : noop;
+}
+
+// src/components/Separator.tsx
+function Separator({ ItemSeparatorComponent, leadingItem }) {
+  const isLastItem = useIsLastItem();
+  return isLastItem ? null : /* @__PURE__ */ React3.createElement(ItemSeparatorComponent, { leadingItem });
 }
 
 // src/hooks/createResizeObserver.ts
@@ -5075,43 +5234,39 @@ var globalResizeObserver = null;
 function getGlobalResizeObserver() {
   if (!globalResizeObserver) {
     globalResizeObserver = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        const callbacks = callbackMap.get(entry.target);
-        if (callbacks) {
-          for (const callback of callbacks) {
-            callback(entry);
+      batchItemSizeUpdates(() => {
+        for (const entry of entries) {
+          const callbacks = callbackMap.get(entry.target);
+          if (callbacks) {
+            for (const callback of callbacks) {
+              callback(entry);
+            }
           }
         }
-      }
+      });
     });
   }
   return globalResizeObserver;
 }
 var callbackMap = /* @__PURE__ */ new WeakMap();
 function createResizeObserver(element, callback) {
-  if (typeof ResizeObserver === "undefined") {
-    return () => {
-    };
-  }
-  if (!element) {
+  var _a3;
+  if (typeof ResizeObserver === "undefined" || !element) {
     return () => {
     };
   }
   const observer = getGlobalResizeObserver();
-  let callbacks = callbackMap.get(element);
-  if (!callbacks) {
-    callbacks = /* @__PURE__ */ new Set();
+  const callbacks = (_a3 = callbackMap.get(element)) != null ? _a3 : /* @__PURE__ */ new Set();
+  if (callbacks.size === 0) {
     callbackMap.set(element, callbacks);
-    observer.observe(element);
+    observer.observe(element, { box: "border-box" });
   }
   callbacks.add(callback);
   return () => {
-    if (callbacks) {
-      callbacks.delete(callback);
-      if (callbacks.size === 0) {
-        callbackMap.delete(element);
-        observer.unobserve(element);
-      }
+    callbacks.delete(callback);
+    if (callbacks.size === 0) {
+      callbackMap.delete(element);
+      observer.unobserve(element);
     }
   };
 }
@@ -5119,6 +5274,7 @@ function createResizeObserver(element, callback) {
 // src/hooks/useOnLayoutSync.tsx
 function useOnLayoutSync({
   ref,
+  measureInLayoutEffect = true,
   onLayoutProp,
   onLayoutChange,
   webLayoutResync
@@ -5138,21 +5294,31 @@ function useOnLayoutSync({
       onLayoutChange(layout, fromLayoutEffect);
       onLayoutProp == null ? void 0 : onLayoutProp({ nativeEvent: { layout } });
     };
-    const rect = element.getBoundingClientRect();
-    emit(toLayout(rect), true);
-    let prevRect = rect;
+    let prevRect;
+    if (measureInLayoutEffect) {
+      const rect = element.getBoundingClientRect();
+      emit(toLayout(rect), true);
+      prevRect = rect;
+    }
     return createResizeObserver(element, (entry) => {
       var _a4;
       const target = entry.target instanceof HTMLElement ? entry.target : void 0;
-      const rectObserved = (_a4 = entry.contentRect) != null ? _a4 : target == null ? void 0 : target.getBoundingClientRect();
-      const didSizeChange = rectObserved.width !== prevRect.width || rectObserved.height !== prevRect.height;
+      const borderBoxSize = Array.isArray(entry.borderBoxSize) ? entry.borderBoxSize[0] : entry.borderBoxSize;
+      const rectObserved = borderBoxSize ? {
+        height: borderBoxSize.blockSize,
+        left: entry.contentRect.left,
+        top: entry.contentRect.top,
+        width: borderBoxSize.inlineSize
+      } : (_a4 = target == null ? void 0 : target.getBoundingClientRect()) != null ? _a4 : entry.contentRect;
+      const previousRect = prevRect != null ? prevRect : getContainerLayoutBaseline(element);
+      const didSizeChange = previousRect === void 0 || rectObserved.width !== previousRect.width || rectObserved.height !== previousRect.height;
+      prevRect = rectObserved;
       const shouldResyncLayout = !!(webLayoutResync == null ? void 0 : webLayoutResync());
       if (didSizeChange || shouldResyncLayout) {
-        prevRect = rectObserved;
         emit(toLayout(rectObserved), false);
       }
     });
-  }, deps || []);
+  }, [measureInLayoutEffect, ...deps || []]);
   return {};
 }
 function toLayout(rect) {
@@ -5167,6 +5333,121 @@ function toLayout(rect) {
   };
 }
 
+// src/hooks/useContainerMeasurement.tsx
+var pendingWebShrinkMeasurements = /* @__PURE__ */ new Map();
+var pendingWebShrinkFrame;
+function cancelWebShrinkMeasurement(state) {
+  pendingWebShrinkMeasurements.delete(state);
+}
+function scheduleWebShrinkMeasurement(state, confirmMeasurement) {
+  pendingWebShrinkMeasurements.set(state, confirmMeasurement);
+  if (pendingWebShrinkFrame === void 0) {
+    pendingWebShrinkFrame = requestAnimationFrame(() => {
+      const callbacks = Array.from(pendingWebShrinkMeasurements.values());
+      pendingWebShrinkMeasurements.clear();
+      pendingWebShrinkFrame = void 0;
+      batchItemSizeUpdates(() => {
+        for (const callback of callbacks) {
+          callback();
+        }
+      });
+    });
+  }
+}
+function processContainerLayout({ containerId, ctx, rectangle, ref, state }) {
+  const listState = ctx.state;
+  const currentItemKey = state.itemKey;
+  state.didLayout = true;
+  let layout = rectangle;
+  const axis = state.horizontal ? "width" : "height";
+  const size = roundSize(rectangle[axis]);
+  state.lastSize ? roundSize(state.lastSize[axis]) : void 0;
+  const coreKnownSize = listState.sizesKnown.get(currentItemKey);
+  const previousSize = coreKnownSize ;
+  const applyLayout = () => {
+    state.lastSize = layout;
+    updateItemSizes(ctx, {
+      containerId,
+      itemKey: currentItemKey,
+      size: layout
+    });
+  };
+  const shouldDeferWebShrinkLayoutUpdate = !isInMVCPActiveMode(listState) && previousSize !== void 0 && size + 1 < previousSize;
+  if (shouldDeferWebShrinkLayoutUpdate) {
+    scheduleWebShrinkMeasurement(state, () => {
+      var _a4;
+      if (state.itemKey === currentItemKey) {
+        const element = ref.current;
+        const rect = (_a4 = element == null ? void 0 : element.getBoundingClientRect) == null ? void 0 : _a4.call(element);
+        if (rect) {
+          layout = { height: rect.height, width: rect.width };
+        }
+        applyLayout();
+      }
+    });
+  } else {
+    {
+      cancelWebShrinkMeasurement(state);
+    }
+    {
+      applyLayout();
+    }
+  }
+}
+function useContainerMeasurement({
+  containerId,
+  ctx,
+  horizontal,
+  itemKey,
+  ref
+}) {
+  const stateRef = useRef({
+    didLayout: false,
+    horizontal,
+    itemKey
+  });
+  stateRef.current.horizontal = horizontal;
+  stateRef.current.itemKey = itemKey;
+  const [layoutRenderCount, forceLayoutRender] = useState(0);
+  const onLayoutChange = useCallback(
+    (rectangle) => {
+      processContainerLayout({ containerId, ctx, rectangle, ref, state: stateRef.current });
+    },
+    [containerId, ctx, ref]
+  );
+  const triggerLayout = useCallback(() => {
+    {
+      scheduleContainerLayout(ctx, containerId);
+    }
+  }, [containerId, ctx]);
+  useLayoutEffect(() => {
+    ctx.containerLayoutTriggers.set(containerId, triggerLayout);
+    return () => {
+      cancelWebShrinkMeasurement(stateRef.current);
+      if (ctx.containerLayoutTriggers.get(containerId) === triggerLayout) {
+        ctx.containerLayoutTriggers.delete(containerId);
+      }
+    };
+  }, [containerId, ctx, triggerLayout]);
+  useLayoutEffect(() => {
+    {
+      scheduleContainerLayout(ctx, containerId);
+    }
+  });
+  const { onLayout } = useOnLayoutSync(
+    {
+      measureInLayoutEffect: !IsNewArchitecture,
+      onLayoutChange,
+      ref,
+      webLayoutResync: () => isInMVCPActiveMode(ctx.state)
+    },
+    [itemKey, layoutRenderCount]
+  );
+  useEffect(() => {
+  }, [containerId, ctx, itemKey]);
+  return { onLayout, triggerLayout };
+}
+
 // src/components/Container.tsx
 function getContainerPositionStyle({
   columnWrapperStyle,
@@ -5237,16 +5518,14 @@ var Container = typedMemo(function Container2({
     "extraData",
     `containerSticky${id}`
   ]);
-  const itemLayoutRef = useRef({
-    didLayout: false,
+  const ref = useRef(null);
+  const { onLayout, triggerLayout } = useContainerMeasurement({
+    containerId: id,
+    ctx,
     horizontal,
     itemKey,
-    pendingShrinkToken: 0
+    ref
   });
-  itemLayoutRef.current.horizontal = horizontal;
-  itemLayoutRef.current.itemKey = itemKey;
-  const ref = useRef(null);
-  const [layoutRenderCount, forceLayoutRender] = useState(0);
   const resolvedColumn = column > 0 ? column : 1;
   const resolvedSpan = Math.min(Math.max(span || 1, 1), numColumns);
   const otherAxisPos = numColumns > 1 ? `${(resolvedColumn - 1) / numColumns * 100}%` : 0;
@@ -5277,57 +5556,7 @@ var Container = typedMemo(function Container2({
     () => itemKey !== void 0 ? getRenderedItem2(itemKey) : null,
     [itemKey, data, extraData]
   );
-  const { index, renderedItem } = renderedItemInfo || {};
-  const onLayoutChange = useCallback((rectangle, fromLayoutEffect) => {
-    const {
-      horizontal: currentHorizontal,
-      itemKey: currentItemKey,
-      lastSize,
-      pendingShrinkToken
-    } = itemLayoutRef.current;
-    if (isNullOrUndefined(currentItemKey)) {
-      return;
-    }
-    itemLayoutRef.current.didLayout = true;
-    let layout = rectangle;
-    const axis = currentHorizontal ? "width" : "height";
-    const size = roundSize(rectangle[axis]);
-    const prevSize = lastSize ? roundSize(lastSize[axis]) : void 0;
-    const doUpdate = () => {
-      itemLayoutRef.current.lastSize = layout;
-      updateItemSizes(ctx, {
-        containerId: id,
-        fromLayoutEffect,
-        itemKey: currentItemKey,
-        size: layout
-      });
-      itemLayoutRef.current.didLayout = true;
-    };
-    const shouldDeferWebShrinkLayoutUpdate = !isInMVCPActiveMode(ctx.state) && prevSize !== void 0 && size + 1 < prevSize;
-    if (shouldDeferWebShrinkLayoutUpdate) {
-      const token = pendingShrinkToken + 1;
-      itemLayoutRef.current.pendingShrinkToken = token;
-      requestAnimationFrame(() => {
-        var _a4;
-        if (itemLayoutRef.current.pendingShrinkToken !== token) {
-          return;
-        }
-        const element = ref.current;
-        const rect = (_a4 = element == null ? void 0 : element.getBoundingClientRect) == null ? void 0 : _a4.call(element);
-        if (rect) {
-          layout = { height: rect.height, width: rect.width };
-        }
-        doUpdate();
-      });
-      return;
-    }
-    {
-      doUpdate();
-    }
-  }, []);
-  const triggerLayout = useCallback(() => {
-    forceLayoutRender((v) => v + 1);
-  }, []);
+  const { renderedItem } = renderedItemInfo || {};
   const contextValue = useMemo(() => {
     ctx.viewRefs.set(id, ref);
     return {
@@ -5335,22 +5564,6 @@ var Container = typedMemo(function Container2({
       triggerLayout
     };
   }, [id, triggerLayout]);
-  useLayoutEffect(() => {
-    ctx.containerLayoutTriggers.set(id, triggerLayout);
-    return () => {
-      if (ctx.containerLayoutTriggers.get(id) === triggerLayout) {
-        ctx.containerLayoutTriggers.delete(id);
-      }
-    };
-  }, [ctx, id, triggerLayout]);
-  const { onLayout } = useOnLayoutSync(
-    {
-      onLayoutChange,
-      ref,
-      webLayoutResync: () => isInMVCPActiveMode(ctx.state)
-    },
-    [itemKey, layoutRenderCount]
-  );
   const PositionComponent = isSticky ? stickyPositionComponentInternal ? stickyPositionComponentInternal : PositionViewSticky : positionComponentInternal ? positionComponentInternal : PositionView;
   return /* @__PURE__ */ React3.createElement(
     PositionComponent,
@@ -5358,7 +5571,6 @@ var Container = typedMemo(function Container2({
       animatedScrollY: isSticky ? animatedScrollY : void 0,
       horizontal,
       id,
-      index,
       key: recycleItems ? void 0 : itemKey,
       onLayout,
       refView: ref,
@@ -5401,18 +5613,13 @@ var ContainerSlot = typedMemo(function ContainerSlot2(props) {
 });
 
 // src/utils/reordering.ts
-var mapFn = (element) => {
-  const indexStr = element.getAttribute("data-index");
-  if (indexStr === null) {
-    return [element, null];
-  }
-  const index = Number.parseInt(indexStr, 10);
-  return [element, Number.isNaN(index) ? null : index];
-};
-function sortDOMElements(container) {
+function sortDOMElements(container, indexByElement) {
   const elements = Array.from(container.children);
   if (elements.length <= 1) return elements;
-  const items = elements.map(mapFn);
+  const items = elements.map((element) => {
+    var _a3;
+    return [element, (_a3 = indexByElement.get(element)) != null ? _a3 : null];
+  });
   items.sort((a, b) => {
     const aKey = a[1];
     const bKey = b[1];
@@ -5500,7 +5707,15 @@ function useDOMOrder(ref) {
       debounceRef.current = setTimeout(() => {
         const parent = ref.current;
         if (parent) {
-          sortDOMElements(parent);
+          const indexByElement = /* @__PURE__ */ new Map();
+          for (const [containerId, viewRef] of ctx.viewRefs) {
+            const element = viewRef.current;
+            const index = peek$(ctx, `containerItemIndex${containerId}`);
+            if (element && index !== void 0) {
+              indexByElement.set(element, index);
+            }
+          }
+          sortDOMElements(parent, indexByElement);
         }
         debounceRef.current = void 0;
       }, 500);
@@ -5513,23 +5728,40 @@ function useDOMOrder(ref) {
     };
   }, [ctx]);
 }
+function useFreshDataTransitionVisibility(readyToRender, transitionEpoch) {
+  const completedTransitionEpoch = useRef(transitionEpoch);
+  const isTransitionPending = completedTransitionEpoch.current !== transitionEpoch;
+  useLayoutEffect(() => {
+    if (!readyToRender) {
+      completedTransitionEpoch.current = transitionEpoch;
+    }
+  }, [readyToRender, transitionEpoch]);
+  return readyToRender && !isTransitionPending;
+}
 
 // src/components/Containers.tsx
-var ContainersInner = typedMemo(function ContainersInner2({ horizontal, numColumns, children }) {
+var ContainersInner = typedMemo(function ContainersInner2({
+  freshDataTransitionEpoch,
+  horizontal,
+  numColumns,
+  children
+}) {
   const ref = useRef(null);
   const ctx = useStateContext();
   const columnWrapperStyle = ctx.columnWrapperStyle;
   const isHorizontalRTLList = isHorizontalRTL(ctx.state);
   const [otherAxisSize, readyToRender, totalSize] = useArr$(["otherAxisSize", "readyToRender", "totalSize"]);
+  const isVisible = useFreshDataTransitionVisibility(!!readyToRender, freshDataTransitionEpoch);
   useDOMOrder(ref);
   const style = horizontal ? {
     direction: isHorizontalRTLList ? "ltr" : void 0,
+    flexShrink: 0,
     minHeight: otherAxisSize,
-    opacity: readyToRender ? 1 : 0,
+    opacity: isVisible ? 1 : 0,
     position: "relative",
     width: totalSize
-  } : { height: totalSize, minWidth: otherAxisSize, opacity: readyToRender ? 1 : 0, position: "relative" };
-  if (!readyToRender) {
+  } : { height: totalSize, minWidth: otherAxisSize, opacity: isVisible ? 1 : 0, position: "relative" };
+  if (!isVisible) {
     style.pointerEvents = "none";
   }
   if (columnWrapperStyle && numColumns > 1) {
@@ -5549,9 +5781,10 @@ var ContainersInner = typedMemo(function ContainersInner2({ horizontal, numColum
       }
     }
   }
-  return /* @__PURE__ */ React3.createElement("div", { ref, style }, children);
+  return /* @__PURE__ */ React3.createElement("div", { ref, style }, /* @__PURE__ */ React3.createElement(ContainerLayoutCoordinator, null, children));
 });
 var Containers = typedMemo(function Containers2({
+  freshDataTransitionEpoch,
   horizontal,
   recycleItems,
   ItemSeparatorComponent,
@@ -5576,7 +5809,15 @@ var Containers = typedMemo(function Containers2({
       )
     );
   }
-  return /* @__PURE__ */ React3.createElement(ContainersInner, { horizontal, numColumns }, containers);
+  return /* @__PURE__ */ React3.createElement(
+    ContainersInner,
+    {
+      freshDataTransitionEpoch,
+      horizontal,
+      numColumns
+    },
+    containers
+  );
 });
 
 // src/platform/StyleSheet.tsx
@@ -5728,6 +5969,7 @@ function resolveWindowScrollTarget({ clampedOffset, horizontal, listPos, scroll
 
 // src/components/ListComponentScrollView.tsx
 var SCROLLBAR_HIDDEN_STYLE_ID = "legend-list-scrollbar-axis-hidden-style";
+var SCROLL_END_FALLBACK_MS = 200;
 var SCROLLBAR_HIDDEN_STYLE = `.${LEGEND_LIST_SCROLLBAR_Y_HIDDEN_CLASS}::-webkit-scrollbar:vertical{width:0;display:none;}.${LEGEND_LIST_SCROLLBAR_X_HIDDEN_CLASS}::-webkit-scrollbar:horizontal{height:0;display:none;}`;
 function ensureScrollbarHiddenStyle() {
   if (typeof document === "undefined" || document.getElementById(SCROLLBAR_HIDDEN_STYLE_ID)) {
@@ -5777,6 +6019,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
   contentOffset,
   maintainVisibleContentPosition,
   onScroll: onScroll2,
+  onInternalScrollEnd,
   onMomentumScrollEnd: _onMomentumScrollEnd,
   showsHorizontalScrollIndicator = true,
   showsVerticalScrollIndicator = true,
@@ -5785,7 +6028,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
   onLayout,
   ...props
 }, ref) {
-  var _a3, _b, _c, _d;
+  var _a3, _b, _c;
   const ctx = useStateContext();
   const [anchoredEndSpaceSize] = useArr$(["anchoredEndSpaceSize"]);
   const scrollRef = useRef(null);
@@ -5906,6 +6149,16 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
     onScroll2(scrollEvent);
   }, [getCurrentScrollOffset, horizontal, isWindowScroll, onScroll2]);
   const scrollEventCoalescer = useRafCoalescer(emitScroll);
+  const scrollEndFallbackRef = useRef(void 0);
+  const emitScrollEnd = useCallback(() => {
+    const timeout = scrollEndFallbackRef.current;
+    if (timeout !== void 0) {
+      clearTimeout(timeout);
+      scrollEndFallbackRef.current = void 0;
+    }
+    scrollEventCoalescer.flush();
+    onInternalScrollEnd == null ? void 0 : onInternalScrollEnd();
+  }, [onInternalScrollEnd, scrollEventCoalescer]);
   const handleScroll = useCallback(
     (_event) => {
       if (!onScroll2) {
@@ -5918,18 +6171,36 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
       } else {
         scrollEventCoalescer.schedule();
       }
+      if (onInternalScrollEnd) {
+        const timeout = scrollEndFallbackRef.current;
+        if (timeout !== void 0) {
+          clearTimeout(timeout);
+        }
+        scrollEndFallbackRef.current = setTimeout(emitScrollEnd, SCROLL_END_FALLBACK_MS);
+      }
     },
-    [ctx.state, onScroll2, scrollEventCoalescer]
+    [ctx.state, emitScrollEnd, onInternalScrollEnd, onScroll2, scrollEventCoalescer]
   );
   useLayoutEffect(() => {
     const target = getScrollTarget();
     if (!target) return;
     target.addEventListener("scroll", handleScroll, { passive: true });
+    if ("onscrollend" in target) {
+      target.addEventListener("scrollend", emitScrollEnd);
+    }
     return () => {
       target.removeEventListener("scroll", handleScroll);
+      if ("onscrollend" in target) {
+        target.removeEventListener("scrollend", emitScrollEnd);
+      }
+      const timeout = scrollEndFallbackRef.current;
+      if (timeout !== void 0) {
+        clearTimeout(timeout);
+        scrollEndFallbackRef.current = void 0;
+      }
       scrollEventCoalescer.cancel();
     };
-  }, [getScrollTarget, handleScroll, scrollEventCoalescer]);
+  }, [emitScrollEnd, getScrollTarget, handleScroll, scrollEventCoalescer]);
   useEffect(() => {
     const doScroll = () => {
       if (contentOffset) {
@@ -5989,7 +6260,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
     } : {}
   };
   const contentInsetEndAdjustment = getContentInsetEndAdjustmentEnd2(ctx);
-  const anchoredEndInset = ((_c = (_b = (_a3 = ctx.state) == null ? void 0 : _a3.props) == null ? void 0 : _b.anchoredEndSpace) == null ? void 0 : _c.includeInEndInset) && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
+  const anchoredEndInset = ((_b = (_a3 = ctx.state) == null ? void 0 : _a3.props) == null ? void 0 : _b.anchoredEndSpace) && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
   const renderedContentInsetEndAdjustment = Math.max(0, contentInsetEndAdjustment - anchoredEndInset);
   const contentInsetEndAdjustmentSpacerStyle = renderedContentInsetEndAdjustment ? horizontal ? { flexShrink: 0, width: renderedContentInsetEndAdjustment } : { height: renderedContentInsetEndAdjustment } : void 0;
   const contentStyle = {
@@ -6016,7 +6287,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
   const snapOffsets = !isWindowScroll ? getFiniteSnapOffsets(snapToOffsets) : [];
   if (snapOffsets.length > 0) {
     scrollViewStyle.scrollSnapType = horizontal ? "x mandatory" : "y mandatory";
-    contentStyle.position = (_d = contentStyle.position) != null ? _d : "relative";
+    contentStyle.position = (_c = contentStyle.position) != null ? _c : "relative";
   }
   const scrollViewClassName = hiddenScrollIndicatorClassName ? scrollViewClassNameProp ? `${scrollViewClassNameProp} ${hiddenScrollIndicatorClassName}` : hiddenScrollIndicatorClassName : scrollViewClassNameProp;
   if (IS_DEV) {
@@ -6165,16 +6436,6 @@ var SnapWrapper = React3.forwardRef(function SnapWrapperInner({ ScrollComponent,
   const [snapToOffsets] = useArr$(["snapToOffsets"]);
   return /* @__PURE__ */ React3.createElement(ScrollComponent, { ...props, ref, snapToOffsets });
 });
-function WebAnchoredEndSpace({ horizontal }) {
-  const ctx = useStateContext();
-  const [anchoredEndSpaceSize] = useArr$(["anchoredEndSpaceSize"]);
-  const shouldRenderAnchoredEndSpace = !!ctx.state.props.anchoredEndSpace && (anchoredEndSpaceSize || 0) > 0;
-  if (!shouldRenderAnchoredEndSpace) {
-    return null;
-  }
-  const style = horizontal ? { height: "100%", width: anchoredEndSpaceSize || 0 } : { height: anchoredEndSpaceSize || 0 };
-  return /* @__PURE__ */ React3.createElement("div", { style }, null);
-}
 
 // src/core/updateContentMetrics.ts
 var SCROLL_ADJUST_EPSILON = 0.1;
@@ -6208,7 +6469,11 @@ function setHeaderSize(ctx, size) {
   state.didMeasureHeader = true;
 }
 function setFooterSize(ctx, size) {
-  return setContentLengthSignal(ctx, "footerSize", size);
+  const didChange = setContentLengthSignal(ctx, "footerSize", size);
+  if (didChange) {
+    maybeUpdateAnchoredEndSpace(ctx);
+  }
+  return didChange;
 }
 function areInsetsEqual(left, right) {
   var _a3, _b, _c, _d, _e, _f, _g, _h;
@@ -6261,6 +6526,7 @@ var AlignItemsAtEndSpacer = typedMemo(function AlignItemsAtEndSpacer2({ horizont
 });
 var ListComponent = typedMemo(function ListComponent2({
   canRender,
+  freshDataTransitionEpoch,
   style,
   contentContainerStyle,
   horizontal,
@@ -6279,6 +6545,8 @@ var ListComponent = typedMemo(function ListComponent2({
   refScrollView,
   renderScrollComponent,
   onLayoutFooter,
+  onInternalScrollBeginDrag,
+  onInternalScrollEnd,
   scrollAdjustHandler,
   snapToIndices,
   stickyHeaderConfig,
@@ -6288,8 +6556,17 @@ var ListComponent = typedMemo(function ListComponent2({
 }) {
   const ctx = useStateContext();
   const maintainVisibleContentPosition = ctx.state.props.maintainVisibleContentPosition;
-  const [otherAxisSize = 0] = useArr$(["otherAxisSize"]);
+  const [anchoredEndSpaceSize = 0, otherAxisSize = 0] = useArr$(["anchoredEndSpaceSize", "otherAxisSize"]);
   const shouldRenderAlignItemsAtEndSpacer = ctx.state.props.alignItemsAtEndPaddingEnabled;
+  const shouldMaterializeAnchoredEndSpace = !!ctx.state.props.anchoredEndSpace && ctx.state.props.anchoredEndSpaceOwner === "list" && anchoredEndSpaceSize > 0;
+  let anchoredEndSpaceStyle;
+  if (shouldMaterializeAnchoredEndSpace) {
+    const paddingEnd = horizontal ? isHorizontalRTL(ctx.state) ? "Left" : "Right" : "Bottom";
+    const flattenedContentContainerStyle = StyleSheet.flatten(contentContainerStyle);
+    anchoredEndSpaceStyle = {
+      [`padding${paddingEnd}`]: extractPadding({}, flattenedContentContainerStyle || {}, paddingEnd) + anchoredEndSpaceSize
+    };
+  }
   const autoOtherAxisStyle = getAutoOtherAxisStyle({
     horizontal,
     needsOtherAxisSize: ctx.state.needsOtherAxisSize,
@@ -6340,12 +6617,12 @@ var ListComponent = typedMemo(function ListComponent2({
     SnapOrScroll,
     {
       ...rest,
-      ...ScrollComponent === ListComponentScrollView ? { useWindowScroll } : {},
+      ...ScrollComponent === ListComponentScrollView ? { onInternalScrollEnd, useWindowScroll } : {} ,
       contentContainerStyle: [
-        horizontal ? {
-          height: "100%"
-        } : {},
-        contentContainerStyle
+        horizontal ? { height: "100%" } : {},
+        contentContainerStyle,
+        anchoredEndSpaceStyle,
+        { boxSizing: "border-box" } 
       ],
       contentOffset: initialContentOffset !== void 0 ? horizontal ? { x: initialContentOffset, y: 0 } : { x: 0, y: initialContentOffset } : void 0,
       horizontal,
@@ -6363,6 +6640,7 @@ var ListComponent = typedMemo(function ListComponent2({
     canRender && !ListEmptyComponent && /* @__PURE__ */ React3.createElement(
       Containers,
       {
+        freshDataTransitionEpoch,
         getRenderedItem: getRenderedItem2,
         horizontal,
         ItemSeparatorComponent,
@@ -6371,7 +6649,6 @@ var ListComponent = typedMemo(function ListComponent2({
       }
     ),
     ListFooterComponent && /* @__PURE__ */ React3.createElement(LayoutView, { onLayoutChange: onLayoutFooterInternal, style: ListFooterComponentStyle }, getComponent(ListFooterComponent)),
-    /* @__PURE__ */ React3.createElement(WebAnchoredEndSpace, { horizontal }),
     IS_DEV && ENABLE_DEVMODE
   );
 });
@@ -6380,7 +6657,16 @@ var WEB_UNBOUNDED_HEIGHT_CONTAINER_RATIO = 0.9;
 var WEB_UNBOUNDED_HEIGHT_VIEWPORT_RATIO = 0.9;
 function useDevChecksImpl(props) {
   const ctx = useStateContext();
-  const { childrenMode, keyExtractor, renderScrollComponent, useWindowScroll } = props;
+  const { anchoredEndSpace, childrenMode, keyExtractor, numColumns, renderScrollComponent, useWindowScroll } = props;
+  const hasAnchoredEndSpace = !!anchoredEndSpace;
+  useEffect(() => {
+    if (hasAnchoredEndSpace && (numColumns != null ? numColumns : 1) > 1) {
+      warnDevOnce(
+        "anchoredEndSpaceNumColumns",
+        "anchoredEndSpace is only supported when numColumns is 1. Using it with multiple columns may produce incorrect anchored spacing."
+      );
+    }
+  }, [hasAnchoredEndSpace, numColumns]);
   useEffect(() => {
     if (useWindowScroll && renderScrollComponent) {
       warnDevOnce(
@@ -6446,6 +6732,7 @@ function checkResetContainers(ctx, dataProp, { didColumnsChange = false } = {})
   if (didColumnsChange) {
     state.sizes.clear();
     state.sizesKnown.clear();
+    invalidateContainerFixedItemSizes(state);
     for (const key in state.averageSizes) {
       delete state.averageSizes[key];
     }
@@ -6692,7 +6979,7 @@ function onScroll(ctx, event) {
     }
   }
   state.scrollPending = newScroll;
-  updateScroll(ctx, newScroll, insetChanged);
+  updateScroll(ctx, newScroll, insetChanged, { fromNativeScrollEvent: true });
   trackInitialScrollNativeProgress(state, newScroll);
   clearFinishedBootstrapInitialScrollTargetIfMovedAway(ctx);
   if (state.scrollingTo) {
@@ -6707,6 +6994,59 @@ function onScroll(ctx, event) {
   }
 }
 
+// src/core/ScheduledWork.ts
+var ScheduledWork = class {
+  constructor() {
+    this.work = /* @__PURE__ */ new Map();
+  }
+  timeout(callback, delay, key) {
+    if (key) {
+      this.cancel(key);
+    }
+    const work = [void 0, clearTimeout];
+    const handle = setTimeout(() => {
+      const workKey = key != null ? key : handle;
+      if (this.work.get(workKey) === work) {
+        this.work.delete(workKey);
+        callback();
+      }
+    }, delay);
+    work[0] = handle;
+    this.work.set(key != null ? key : handle, work);
+  }
+  frame(callback, key) {
+    this.cancel(key);
+    const work = [void 0, cancelAnimationFrame];
+    this.work.set(key, work);
+    work[0] = requestAnimationFrame(() => {
+      if (this.work.get(key) === work) {
+        this.work.delete(key);
+        callback();
+      }
+    });
+  }
+  register(key, cancel) {
+    this.cancel(key);
+    this.work.set(key, [void 0, cancel]);
+  }
+  cancel(key) {
+    const work = this.work.get(key);
+    if (work) {
+      this.work.delete(key);
+      work[1](work[0]);
+    }
+  }
+  has(key) {
+    return this.work.has(key);
+  }
+  dispose() {
+    for (const [handle, cancel] of this.work.values()) {
+      cancel(handle);
+    }
+    this.work.clear();
+  }
+};
+
 // src/core/ScrollAdjustHandler.ts
 var ScrollAdjustHandler = class {
   constructor(ctx) {
@@ -6855,8 +7195,8 @@ function getAverageItemSizes(state) {
   return averageItemSizes;
 }
 function triggerMountedContainerLayouts(ctx) {
-  for (const triggerLayout of ctx.containerLayoutTriggers.values()) {
-    triggerLayout();
+  {
+    scheduleContainerLayout(ctx);
   }
 }
 function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
@@ -6864,7 +7204,7 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
   const IMPERATIVE_SCROLL_SETTLE_MAX_WAIT_MS = 800;
   const IMPERATIVE_SCROLL_SETTLE_STABLE_FRAMES = 2;
   let imperativeScrollToken = 0;
-  const isSettlingAfterDataChange = () => !!state.didDataChange || !!state.didColumnsChange || state.queuedMVCPRecalculate !== void 0 || state.ignoreScrollFromMVCP !== void 0;
+  const isSettlingAfterDataChange = () => !!state.didDataChange || !!state.didColumnsChange || state.scheduledWork.has("mvcpRecalculate") || state.ignoreScrollFromMVCP !== void 0;
   const isScrollToIndexReady = (targetIndex, allowEmpty = false) => {
     var _a3;
     const props = state.props;
@@ -6898,9 +7238,9 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
         run();
         return;
       }
-      requestAnimationFrame(check);
+      state.scheduledWork.frame(check, "imperativeScrollReady");
     };
-    requestAnimationFrame(check);
+    state.scheduledWork.frame(check, "imperativeScrollReady");
   };
   const runScrollRequest = (token, resolve, run, isReady = () => true) => {
     const runNow = () => {
@@ -6922,10 +7262,9 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
     }
   };
   const startImperativeScroll = (resolve) => {
-    var _a3;
+    state.scheduledWork.cancel("imperativeScrollReady");
     const token = ++imperativeScrollToken;
-    state.pendingScrollToEnd = void 0;
-    (_a3 = state.pendingScrollResolve) == null ? void 0 : _a3.call(state);
+    settlePendingImperativeScroll(state);
     state.pendingScrollResolve = resolve;
     return token;
   };
@@ -6969,6 +7308,7 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
     const mode = (_a3 = options == null ? void 0 : options.mode) != null ? _a3 : "sizes";
     state.sizes.clear();
     state.sizesKnown.clear();
+    invalidateContainerFixedItemSizes(state);
     for (const key in state.averageSizes) {
       delete state.averageSizes[key];
     }
@@ -6990,6 +7330,10 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
   return {
     clearCaches,
     flashScrollIndicators: () => refScroller.current.flashScrollIndicators(),
+    getAnimatableRef: () => {
+      var _a3, _b, _c;
+      return (_c = (_b = (_a3 = refScroller.current).getNativeScrollRef) == null ? void 0 : _b.call(_a3)) != null ? _c : refScroller.current;
+    },
     getNativeScrollRef: () => refScroller.current,
     getScrollableNode: () => refScroller.current.getScrollableNode(),
     getScrollResponder: () => refScroller.current.getScrollResponder(),
@@ -7004,6 +7348,7 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
       end: state.endNoBuffer,
       endBuffered: state.endBuffered,
       getAverageItemSizes: () => getAverageItemSizes(state),
+      indexByKey: (key) => state.indexByKey.get(key),
       isAtEnd: peek$(ctx, "isAtEnd"),
       isAtStart: peek$(ctx, "isAtStart"),
       isEndReached: state.isEndReached,
@@ -7307,7 +7652,7 @@ var LegendList = typedMemo(
   })
 );
 var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
-  var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r;
+  var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
   const noopOnScroll = useCallback((_event) => {
   }, []);
   if (props.recycleItems === void 0) {
@@ -7360,6 +7705,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     onMomentumScrollEnd,
     onRefresh,
     onScroll: onScrollProp,
+    onScrollBeginDrag,
     onStartReached,
     onStartReachedThreshold = 0.5,
     onStickyHeaderChange,
@@ -7382,9 +7728,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     ...rest
   } = props;
   const animatedPropsInternal = props.animatedPropsInternal;
+  const anchoredEndSpaceOwner = (_a3 = props.anchoredEndSpaceOwnerInternal) != null ? _a3 : "list";
   const positionComponentInternal = props.positionComponentInternal;
   const stickyPositionComponentInternal = props.stickyPositionComponentInternal;
   const {
+    anchoredEndSpaceOwnerInternal: _anchoredEndSpaceOwnerInternal,
     positionComponentInternal: _positionComponentInternal,
     stickyPositionComponentInternal: _stickyPositionComponentInternal,
     ...restProps
@@ -7406,6 +7754,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const stylePaddingBottomState = extractPadding(style, contentContainerStyle, "Bottom");
   const stylePaddingLeftState = extractPadding(style, contentContainerStyle, "Left");
   const stylePaddingRightState = extractPadding(style, contentContainerStyle, "Right");
+  const stylePaddingEndState = getStylePaddingEnd({
+    horizontal,
+    rtl,
+    stylePaddingBottom: stylePaddingBottomState,
+    stylePaddingLeft: stylePaddingLeftState,
+    stylePaddingRight: stylePaddingRightState
+  });
   const maintainScrollAtEndConfig = normalizeMaintainScrollAtEnd(maintainScrollAtEnd);
   const maintainVisibleContentPositionConfig = normalizeMaintainVisibleContentPosition(
     maintainVisibleContentPositionProp
@@ -7418,13 +7773,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const initialScrollProp = initialScrollAtEnd ? {
     index: Math.max(0, dataProp.length - 1),
     preserveForBottomPadding: true,
-    viewOffset: -stylePaddingBottomState,
+    viewOffset: -stylePaddingEndState,
     viewPosition: 1
   } : hasInitialScrollIndex ? typeof initialScrollIndexProp === "object" ? {
-    index: (_a3 = initialScrollIndexProp.index) != null ? _a3 : 0,
+    index: (_b = initialScrollIndexProp.index) != null ? _b : 0,
     preserveForBottomPadding: initialScrollIndexProp.viewOffset === void 0 && initialScrollIndexProp.viewPosition === 1 ? true : void 0,
-    viewOffset: (_b = initialScrollIndexProp.viewOffset) != null ? _b : initialScrollIndexProp.viewPosition === 1 ? -stylePaddingBottomState : 0,
-    viewPosition: (_c = initialScrollIndexProp.viewPosition) != null ? _c : 0
+    viewOffset: (_c = initialScrollIndexProp.viewOffset) != null ? _c : initialScrollIndexProp.viewPosition === 1 ? -stylePaddingEndState : 0,
+    viewPosition: (_d = initialScrollIndexProp.viewPosition) != null ? _d : 0
   } : {
     index: initialScrollIndexProp != null ? initialScrollIndexProp : 0,
     viewOffset: initialScrollOffsetProp != null ? initialScrollOffsetProp : 0
@@ -7437,7 +7792,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const [, scheduleImperativeScrollCommit] = React3.useReducer((value) => value + 1, 0);
   const ctx = useStateContext();
   ctx.columnWrapperStyle = columnWrapperStyle || (contentContainerStyle ? createColumnWrapperStyle(contentContainerStyle) : void 0);
-  const scrollAxisGap = horizontal ? (_f = (_d = ctx.columnWrapperStyle) == null ? void 0 : _d.columnGap) != null ? _f : (_e = ctx.columnWrapperStyle) == null ? void 0 : _e.gap : (_i = (_g = ctx.columnWrapperStyle) == null ? void 0 : _g.rowGap) != null ? _i : (_h = ctx.columnWrapperStyle) == null ? void 0 : _h.gap;
+  const scrollAxisGap = horizontal ? (_g = (_e = ctx.columnWrapperStyle) == null ? void 0 : _e.columnGap) != null ? _g : (_f = ctx.columnWrapperStyle) == null ? void 0 : _f.gap : (_j = (_h = ctx.columnWrapperStyle) == null ? void 0 : _h.rowGap) != null ? _j : (_i = ctx.columnWrapperStyle) == null ? void 0 : _i.gap;
   const nextScrollAxisGap = typeof scrollAxisGap === "number" && Number.isFinite(scrollAxisGap) ? scrollAxisGap : 0;
   const refScroller = useRef(null);
   const combinedRef = useCombinedRef(refScroller, refScrollView);
@@ -7452,8 +7807,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorIndex,
     alwaysRender == null ? void 0 : alwaysRender.top,
     alwaysRender == null ? void 0 : alwaysRender.bottom,
-    (_j = alwaysRender == null ? void 0 : alwaysRender.indices) == null ? void 0 : _j.join(","),
-    (_k = alwaysRender == null ? void 0 : alwaysRender.keys) == null ? void 0 : _k.join(","),
+    (_k = alwaysRender == null ? void 0 : alwaysRender.indices) == null ? void 0 : _k.join(","),
+    (_l = alwaysRender == null ? void 0 : alwaysRender.keys) == null ? void 0 : _l.join(","),
     dataProp,
     dataKey,
     dataVersion,
@@ -7466,13 +7821,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   if (!refState.current) {
     if (!ctx.state) {
       const initialScrollLength = (estimatedListSize != null ? estimatedListSize : { height: 0, width: 0 } )[horizontal ? "width" : "height"];
-      ctx.values.set("adaptiveRender", (_l = experimental_adaptiveRender == null ? void 0 : experimental_adaptiveRender.initialMode) != null ? _l : "normal");
+      ctx.values.set("adaptiveRender", (_m = experimental_adaptiveRender == null ? void 0 : experimental_adaptiveRender.initialMode) != null ? _m : "normal");
       ctx.state = {
         averageSizes: {},
         columnSpans: [],
         columns: [],
+        containerItemGenerations: [],
         containerItemKeys: /* @__PURE__ */ new Map(),
-        containerItemTypes: /* @__PURE__ */ new Map(),
+        containerItemMetadata: /* @__PURE__ */ new Map(),
         contentInsetOverride: void 0,
         dataChangeEpoch: 0,
         dataChangeNeedsScrollUpdate: false,
@@ -7484,6 +7840,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         endNoBuffer: -1,
         endReachedSnapshot: void 0,
         firstFullyOnScreenIndex: -1,
+        freshDataTransitionEpoch: 0,
         hasHadNonEmptyData: dataProp.length > 0,
         idCache: [],
         idsInView: [],
@@ -7508,8 +7865,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         positions: [],
         props: {},
         queuedCalculateItemsInView: 0,
-        queuedFullDrawDistancePrewarm: void 0,
         refScroller: { current: null },
+        scheduledWork: new ScheduledWork(),
         scroll: 0,
         scrollAdjustHandler: new ScrollAdjustHandler(ctx),
         scrollForNextCalculateItemsInView: void 0,
@@ -7525,11 +7882,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         startBuffered: -1,
         startNoBuffer: -1,
         startReachedSnapshot: void 0,
-        startReachedSnapshotDataChangeEpoch: void 0,
         stickyContainerPool: /* @__PURE__ */ new Set(),
         stickyContainers: /* @__PURE__ */ new Map(),
-        timeoutAdaptiveRender: void 0,
-        timeouts: /* @__PURE__ */ new Set(),
         totalSize: 0,
         viewabilityConfigCallbackPairs: void 0
       };
@@ -7551,13 +7905,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const didScrollAxisGapChange = !isFirstLocal && ctx.scrollAxisGap !== nextScrollAxisGap;
   ctx.scrollAxisGap = nextScrollAxisGap;
   state.didColumnsChange = numColumnsProp !== previousNumColumnsProp || didScrollAxisGapChange;
-  const previousDataLength = (_n = (_m = state.props.data) == null ? void 0 : _m.length) != null ? _n : 0;
+  const previousDataLength = (_o = (_n = state.props.data) == null ? void 0 : _n.length) != null ? _o : 0;
   const didDataReferenceChangeLocal = state.props.data !== dataProp;
   const didDataKeyChangeLocal = state.props.dataKey !== dataKey;
   const didDataVersionChangeLocal = state.props.dataVersion !== dataVersion;
   const didDataChangeLocal = didDataKeyChangeLocal || didDataVersionChangeLocal || didDataReferenceChangeLocal && checkStructuralDataChange(state, dataProp, state.props.data);
   const shouldResetFreshDataLayout = !isFirstLocal && didDataChangeLocal && state.hasHadNonEmptyData && (didDataKeyChangeLocal || previousDataLength === 0) && dataProp.length > 0;
-  if (didDataChangeLocal && !initialScrollAtEnd && state.didFinishInitialScroll && ((_o = state.initialScroll) == null ? void 0 : _o.viewPosition) === 1 && state.props.data.length > 0) {
+  if (didDataChangeLocal && !initialScrollAtEnd && state.didFinishInitialScroll && ((_p = state.initialScroll) == null ? void 0 : _p.viewPosition) === 1 && state.props.data.length > 0) {
     clearPreservedInitialScrollTarget(state);
   }
   if (didDataChangeLocal) {
@@ -7566,10 +7920,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     state.didDataChange = true;
     state.previousData = state.props.data;
   }
+  if (shouldResetFreshDataLayout) {
+    state.freshDataTransitionEpoch += 1;
+  }
   const throttledOnScroll = useThrottledOnScroll(onScrollProp != null ? onScrollProp : noopOnScroll, scrollEventThrottle != null ? scrollEventThrottle : 0);
   const throttleScrollFn = scrollEventThrottle && onScrollProp ? throttledOnScroll : onScrollProp;
-  const anchoredEndSpaceResolved = anchoredEndSpace ? { ...anchoredEndSpace, includeInEndInset: true } : anchoredEndSpace;
-  const didAnchoredEndSpaceAnchorIndexChange = !isFirstLocal && !didDataChangeLocal && ((_p = state.props.anchoredEndSpace) == null ? void 0 : _p.anchorIndex) !== (anchoredEndSpaceResolved == null ? void 0 : anchoredEndSpaceResolved.anchorIndex);
+  const didAnchoredEndSpaceAnchorIndexChange = !isFirstLocal && !didDataChangeLocal && ((_q = state.props.anchoredEndSpace) == null ? void 0 : _q.anchorIndex) !== (anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorIndex);
   state.props = {
     adaptiveRender: experimental_adaptiveRender,
     alignItemsAtEnd,
@@ -7577,7 +7933,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     alwaysRender,
     alwaysRenderIndicesArr: alwaysRenderIndices.arr,
     alwaysRenderIndicesSet: alwaysRenderIndices.set,
-    anchoredEndSpace: anchoredEndSpaceResolved,
+    anchoredEndSpace,
+    anchoredEndSpaceOwner,
     animatedProps: animatedPropsInternal,
     contentContainerAlignItems: contentContainerStyle.alignItems,
     contentInset,
@@ -7601,7 +7958,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     onFirstVisibleItemChanged,
     onItemSizeChanged,
     onLoad,
+    onMomentumScrollEnd,
     onScroll: throttleScrollFn,
+    onScrollBeginDrag,
     onStartReached,
     onStartReachedThreshold,
     onStickyHeaderChange,
@@ -7624,12 +7983,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   if (!isFirstLocal && previousAdaptiveRender && !experimental_adaptiveRender) {
     resetAdaptiveRender(ctx);
   }
-  if (shouldResetFreshDataLayout) {
-    resetInitialRenderState(ctx, {
-      resetInitialScroll: !!initialScrollProp,
-      resetLayout: true
-    });
-  }
   const memoizedLastItemKeys = useMemo(() => {
     if (!dataProp.length) return [];
     return Array.from(
@@ -7688,6 +8041,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     useDevChecks(props);
   }
   useLayoutEffect(() => {
+    if (shouldResetFreshDataLayout) {
+      resetInitialRenderState(ctx, {
+        resetInitialScroll: !!initialScrollProp,
+        resetLayout: true
+      });
+    }
     handleInitialScrollDataChange(ctx, {
       dataLength: dataProp.length,
       didDataChange: didDataChangeLocal,
@@ -7695,7 +8054,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       initialScrollAtEnd,
       latestInitialScroll: initialScrollProp,
       latestInitialScrollSessionKind: initialScrollUsesOffsetOnly ? "offset" : "bootstrap",
-      stylePaddingBottom: stylePaddingBottomState,
+      stylePaddingEnd: stylePaddingEndState,
       useBootstrapInitialScroll: usesBootstrapInitialScroll
     });
   }, [
@@ -7704,7 +8063,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     didDataChangeLocal,
     shouldResetFreshDataLayout,
     initialScrollAtEnd,
-    stylePaddingBottomState,
+    stylePaddingEndState,
     usesBootstrapInitialScroll
   ]);
   useLayoutEffect(() => {
@@ -7722,7 +8081,12 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorMaxSize,
     anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorOffset,
     didAnchoredEndSpaceAnchorIndexChange,
-    numColumnsProp
+    horizontal,
+    numColumnsProp,
+    rtl,
+    stylePaddingBottomState,
+    stylePaddingLeftState,
+    stylePaddingRightState
   ]);
   useLayoutEffect(() => {
     const previousContentInsetEndAdjustment = previousContentInsetEndAdjustmentRef.current;
@@ -7738,10 +8102,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
         dataLength: dataProp.length,
         footerSize: layout[horizontal ? "width" : "height"],
         initialScrollAtEnd,
-        stylePaddingBottom: stylePaddingBottomState
+        stylePaddingEnd: stylePaddingEndState
       });
     },
-    [dataProp.length, initialScrollAtEnd, horizontal, stylePaddingBottomState, usesBootstrapInitialScroll]
+    [dataProp.length, initialScrollAtEnd, horizontal, stylePaddingEndState, usesBootstrapInitialScroll]
   );
   const onLayoutChange = useCallback(
     (layout, fromLayoutEffect) => {
@@ -7758,7 +8122,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       }
       advanceCurrentInitialScrollSession(ctx);
     },
-    [dataProp.length, initialScrollAtEnd, stylePaddingBottomState, usesBootstrapInitialScroll]
+    [dataProp.length, initialScrollAtEnd, stylePaddingEndState, usesBootstrapInitialScroll]
   );
   const { onLayout } = useOnLayoutSync({
     onLayoutChange,
@@ -7851,14 +8215,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   useImperativeHandle(forwardedRef, () => createImperativeHandle(ctx, scheduleImperativeScrollCommit), []);
   useEffect(() => {
     return () => {
-      if (state.queuedFullDrawDistancePrewarm !== void 0) {
-        cancelAnimationFrame(state.queuedFullDrawDistancePrewarm);
-        state.queuedFullDrawDistancePrewarm = void 0;
-      }
-      for (const timeout of state.timeouts) {
-        clearTimeout(timeout);
-      }
-      state.timeouts.clear();
+      cancelImperativeScroll(state);
+      state.scheduledWork.dispose();
     };
   }, [state]);
   useLayoutEffect(() => {
@@ -7876,11 +8234,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       getRenderedItem: (key) => getRenderedItem(ctx, key),
       onMomentumScrollEnd: (event) => {
         checkFinishedScrollFallback(ctx);
-        if (onMomentumScrollEnd) {
-          onMomentumScrollEnd(event);
+        if (state.props.onMomentumScrollEnd) {
+          state.props.onMomentumScrollEnd(event);
         }
       },
-      onScroll: (event) => onScroll(ctx, event)
+      onScroll: (event) => onScroll(ctx, event),
+      onScrollBeginDrag: (event) => {
+        var _a4, _b2;
+        prepareReachedEdgeForNextUserScroll(ctx);
+        (_b2 = (_a4 = state.props).onScrollBeginDrag) == null ? void 0 : _b2.call(_a4, event);
+      },
+      onScrollEnd: () => prepareReachedEdgeForNextUserScroll(ctx)
     }),
     []
   );
@@ -7894,6 +8258,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       canRender,
       contentContainerStyle,
       contentInset,
+      freshDataTransitionEpoch: state.freshDataTransitionEpoch,
       getRenderedItem: fns.getRenderedItem,
       horizontal,
       initialContentOffset,
@@ -7901,13 +8266,15 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       ListFooterComponent,
       ListFooterComponentStyle,
       ListHeaderComponent,
+      onInternalScrollBeginDrag: fns.onScrollBeginDrag,
+      onInternalScrollEnd: fns.onScrollEnd,
       onLayout,
       onLayoutFooter,
       onMomentumScrollEnd: fns.onMomentumScrollEnd,
       onScroll: onScrollHandler,
       recycleItems,
       refreshControl: refreshControlElement ? stylePaddingTopState > 0 ? React3.cloneElement(refreshControlElement, {
-        progressViewOffset: ((_q = refreshControlElement.props.progressViewOffset) != null ? _q : 0) + stylePaddingTopState
+        progressViewOffset: ((_r = refreshControlElement.props.progressViewOffset) != null ? _r : 0) + stylePaddingTopState
       }) : refreshControlElement : onRefresh && /* @__PURE__ */ React3.createElement(
         RefreshControl,
         {
@@ -7918,7 +8285,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
       ),
       refScrollView: combinedRef,
       renderScrollComponent,
-      scrollAdjustHandler: (_r = refState.current) == null ? void 0 : _r.scrollAdjustHandler,
+      scrollAdjustHandler: (_s = refState.current) == null ? void 0 : _s.scrollAdjustHandler,
       scrollEventThrottle: 0,
       snapToIndices,
       stickyHeaderIndices,