@legendapp/list 3.0.5 → 3.0.6

package/react.js

@@ -164,6 +164,7 @@ function StateProvider({ children }) {
     positionListeners: /* @__PURE__ */ new Map(),
     state: void 0,
     values: /* @__PURE__ */ new Map([
+      ["alignItemsAtEndPadding", 0],
       ["stylePaddingTop", 0],
       ["headerSize", 0],
       ["numContainers", 0],
@@ -306,15 +307,16 @@ function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
 
 // src/state/getContentSize.ts
 function getContentSize(ctx) {
-  var _a3;
+  var _a3, _b;
   const { values, state } = ctx;
   const stylePaddingTop = values.get("stylePaddingTop") || 0;
   const stylePaddingBottom = 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 totalSize = (_a3 = state.pendingTotalSize) != null ? _a3 : values.get("totalSize");
-  return headerSize + footerSize + totalSize + stylePaddingTop + stylePaddingBottom + (contentInsetBottom || 0);
+  const totalSize = (_b = (_a3 = state.pendingTotalSize) != null ? _a3 : state.totalSize) != null ? _b : values.get("totalSize");
+  return headerSize + footerSize + totalSize + stylePaddingTop + alignItemsAtEndPadding + stylePaddingBottom + (contentInsetBottom || 0);
 }
 
 // src/components/DebugView.tsx
@@ -1814,6 +1816,51 @@ function WebAnchoredEndSpace({ horizontal }) {
   const style = horizontal ? { height: "100%", width: anchoredEndSpaceSize || 0 } : { height: anchoredEndSpaceSize || 0 };
   return /* @__PURE__ */ React3__namespace.createElement("div", { style }, null);
 }
+
+// src/core/updateContentMetrics.ts
+function getRawContentLength(ctx) {
+  var _a3, _b, _c;
+  const { state, values } = ctx;
+  return (values.get("headerSize") || 0) + (values.get("footerSize") || 0) + ((_c = (_b = (_a3 = state.pendingTotalSize) != null ? _a3 : state.totalSize) != null ? _b : values.get("totalSize")) != null ? _c : 0) + (state.props.stylePaddingTop || 0) + (state.props.stylePaddingBottom || 0);
+}
+function getAlignItemsAtEndPadding(ctx) {
+  const { state } = ctx;
+  const shouldPad = !!state.props.alignItemsAtEndPaddingEnabled && !state.props.horizontal && state.props.data.length > 0 && state.scrollLength > 0;
+  return shouldPad ? Math.max(0, state.scrollLength - getRawContentLength(ctx) - getContentInsetEnd(ctx)) : 0;
+}
+function updateContentMetrics(ctx) {
+  const nextPadding = getAlignItemsAtEndPadding(ctx);
+  if (peek$(ctx, "alignItemsAtEndPadding") !== nextPadding) {
+    set$(ctx, "alignItemsAtEndPadding", nextPadding);
+  }
+}
+function setContentLengthSignal(ctx, signalName, size) {
+  if (peek$(ctx, signalName) !== size) {
+    set$(ctx, signalName, size);
+    updateContentMetrics(ctx);
+  }
+}
+function setHeaderSize(ctx, size) {
+  setContentLengthSignal(ctx, "headerSize", size);
+}
+function setFooterSize(ctx, size) {
+  setContentLengthSignal(ctx, "footerSize", size);
+}
+function areInsetsEqual(left, right) {
+  var _a3, _b, _c, _d, _e, _f, _g, _h;
+  return ((_a3 = left == null ? void 0 : left.top) != null ? _a3 : 0) === ((_b = right == null ? void 0 : right.top) != null ? _b : 0) && ((_c = left == null ? void 0 : left.bottom) != null ? _c : 0) === ((_d = right == null ? void 0 : right.bottom) != null ? _d : 0) && ((_e = left == null ? void 0 : left.left) != null ? _e : 0) === ((_f = right == null ? void 0 : right.left) != null ? _f : 0) && ((_g = left == null ? void 0 : left.right) != null ? _g : 0) === ((_h = right == null ? void 0 : right.right) != null ? _h : 0);
+}
+function setContentInsetOverride(ctx, inset) {
+  const { state } = ctx;
+  const previousInset = state.contentInsetOverride;
+  const nextInset = inset != null ? inset : void 0;
+  const didChange = !areInsetsEqual(previousInset, nextInset);
+  state.contentInsetOverride = nextInset;
+  if (didChange) {
+    updateContentMetrics(ctx);
+  }
+  return didChange;
+}
 function useStableRenderComponent(renderComponent, mapProps) {
   const renderComponentRef = useLatestRef(renderComponent);
   const mapPropsRef = useLatestRef(mapProps);
@@ -1865,7 +1912,7 @@ var ListComponent = typedMemo(function ListComponent2({
 }) {
   const ctx = useStateContext();
   const maintainVisibleContentPosition = ctx.state.props.maintainVisibleContentPosition;
-  const [otherAxisSize = 0] = useArr$(["otherAxisSize"]);
+  const [alignItemsAtEndPadding = 0, otherAxisSize = 0] = useArr$(["alignItemsAtEndPadding", "otherAxisSize"]);
   const autoOtherAxisStyle = getAutoOtherAxisStyle({
     horizontal,
     needsOtherAxisSize: ctx.state.needsOtherAxisSize,
@@ -1879,23 +1926,23 @@ var ListComponent = typedMemo(function ListComponent2({
   const SnapOrScroll = snapToIndices ? SnapWrapper : ScrollComponent;
   React3.useLayoutEffect(() => {
     if (!ListHeaderComponent) {
-      set$(ctx, "headerSize", 0);
+      setHeaderSize(ctx, 0);
     }
     if (!ListFooterComponent) {
-      set$(ctx, "footerSize", 0);
+      setFooterSize(ctx, 0);
     }
   }, [ListHeaderComponent, ListFooterComponent, ctx]);
   const onLayoutHeader = React3.useCallback(
     (rect) => {
       const size = rect[horizontal ? "width" : "height"];
-      set$(ctx, "headerSize", size);
+      setHeaderSize(ctx, size);
     },
     [ctx, horizontal]
   );
   const onLayoutFooterInternal = React3.useCallback(
     (rect, fromLayoutEffect) => {
       const size = rect[horizontal ? "width" : "height"];
-      set$(ctx, "footerSize", size);
+      setFooterSize(ctx, size);
       onLayoutFooter == null ? void 0 : onLayoutFooter(rect, fromLayoutEffect);
     },
     [ctx, horizontal, onLayoutFooter]
@@ -1923,6 +1970,13 @@ var ListComponent = typedMemo(function ListComponent2({
     /* @__PURE__ */ React3__namespace.createElement(ScrollAdjust, null),
     ListHeaderComponent && /* @__PURE__ */ React3__namespace.createElement(LayoutView, { onLayoutChange: onLayoutHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
     ListEmptyComponent && getComponent(ListEmptyComponent),
+    alignItemsAtEndPadding > 0 && /* @__PURE__ */ React3__namespace.createElement(
+      View,
+      {
+        style: horizontal ? { flexShrink: 0, width: alignItemsAtEndPadding } : { flexShrink: 0, height: alignItemsAtEndPadding }
+      },
+      null
+    ),
     canRender && !ListEmptyComponent && /* @__PURE__ */ React3__namespace.createElement(
       Containers,
       {
@@ -2414,7 +2468,7 @@ function calculateOffsetForIndex(ctx, index) {
 
 // src/core/getTopOffsetAdjustment.ts
 function getTopOffsetAdjustment(ctx) {
-  return (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
+  return (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
 }
 
 // src/utils/getId.ts
@@ -2450,6 +2504,7 @@ function addTotalSize(ctx, key, add, notifyTotalSize = true) {
       if (notifyTotalSize) {
         set$(ctx, "totalSize", totalSize);
       }
+      updateContentMetrics(ctx);
     }
   } else if (notifyTotalSize && ctx.values.get("totalSize") !== totalSize) {
     set$(ctx, "totalSize", totalSize);
@@ -4796,7 +4851,7 @@ function areViewabilityAmountTokensEqual(prev, next) {
 }
 function computeViewability(state, ctx, viewabilityConfig, containerId, key, scrollSize, item, index) {
   const { sizes, scroll: scrollState } = state;
-  const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
+  const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
   const { itemVisiblePercentThreshold, viewAreaCoveragePercentThreshold } = viewabilityConfig;
   const viewAreaMode = viewAreaCoveragePercentThreshold != null;
   const viewablePercentThreshold = viewAreaMode ? viewAreaCoveragePercentThreshold : itemVisiblePercentThreshold;
@@ -5247,7 +5302,7 @@ function calculateItemsInView(ctx, params = {}) {
       return;
     }
     let totalSize = getContentSize(ctx);
-    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
+    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "alignItemsAtEndPadding") + peek$(ctx, "headerSize");
     const numColumns = peek$(ctx, "numColumns");
     const speed = getScrollVelocity(state);
     const scrollExtra = 0;
@@ -5791,6 +5846,7 @@ function handleLayout(ctx, layoutParam, setCanRender) {
   if (didChange) {
     state.scrollLength = scrollLength;
     state.otherAxisSize = otherAxisSize;
+    updateContentMetrics(ctx);
     state.lastBatchingAction = Date.now();
     state.scrollForNextCalculateItemsInView = void 0;
     if (scrollLength > 0) {
@@ -6456,10 +6512,7 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
       startBuffered: state.startBuffered
     }),
     reportContentInset: (inset) => {
-      var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
-      const previousInset = state.contentInsetOverride;
-      state.contentInsetOverride = inset != null ? inset : void 0;
-      const didChange = ((_a3 = previousInset == null ? void 0 : previousInset.top) != null ? _a3 : 0) !== ((_c = (_b = state.contentInsetOverride) == null ? void 0 : _b.top) != null ? _c : 0) || ((_d = previousInset == null ? void 0 : previousInset.bottom) != null ? _d : 0) !== ((_f = (_e = state.contentInsetOverride) == null ? void 0 : _e.bottom) != null ? _f : 0) || ((_g = previousInset == null ? void 0 : previousInset.left) != null ? _g : 0) !== ((_i = (_h = state.contentInsetOverride) == null ? void 0 : _h.left) != null ? _i : 0) || ((_j = previousInset == null ? void 0 : previousInset.right) != null ? _j : 0) !== ((_l = (_k = state.contentInsetOverride) == null ? void 0 : _k.right) != null ? _l : 0);
+      const didChange = setContentInsetOverride(ctx, inset);
       updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
       if (didChange) {
         retargetActiveInitialScrollAtEnd(ctx);
@@ -6815,10 +6868,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     ...restProps
   } = rest;
   const contentContainerStyleBase = StyleSheet.flatten(contentContainerStyleProp);
-  const shouldFlexGrow = alignItemsAtEnd && (horizontal ? (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minWidth) == null : (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null);
+  const useAlignItemsAtEndPadding = alignItemsAtEnd && !horizontal && (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null && dataProp.length > 0;
+  const shouldFlexGrow = alignItemsAtEnd && !useAlignItemsAtEndPadding && (horizontal ? (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minWidth) == null : (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null);
   const contentContainerStyle = {
     ...contentContainerStyleBase,
-    ...alignItemsAtEnd ? {
+    ...alignItemsAtEnd && !useAlignItemsAtEndPadding ? {
       display: "flex",
       flexDirection: horizontal ? "row" : "column",
       ...shouldFlexGrow ? { flexGrow: 1 } : {},
@@ -6982,6 +7036,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const didAnchoredEndSpaceAnchorIndexChange = !isFirstLocal && !didDataChangeLocal && ((_g = state.props.anchoredEndSpace) == null ? void 0 : _g.anchorIndex) !== (anchoredEndSpaceResolved == null ? void 0 : anchoredEndSpaceResolved.anchorIndex);
   state.props = {
     alignItemsAtEnd,
+    alignItemsAtEndPaddingEnabled: useAlignItemsAtEndPadding,
     alwaysRender,
     alwaysRenderIndicesArr: alwaysRenderIndices.arr,
     alwaysRenderIndicesSet: alwaysRenderIndices.set,
@@ -7039,6 +7094,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     const prevPaddingTop = peek$(ctx, "stylePaddingTop");
     setPaddingTop(ctx, { stylePaddingTop: stylePaddingTopState });
     refState.current.props.stylePaddingBottom = stylePaddingBottomState;
+    updateContentMetrics(ctx);
     let paddingDiff = stylePaddingTopState - prevPaddingTop;
     if (shouldAdjustPadding && maintainVisibleContentPositionConfig.size && paddingDiff && prevPaddingTop !== void 0 && Platform.OS === "ios") ;
   };
@@ -7157,7 +7213,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   }, [snapToIndices]);
   React3.useLayoutEffect(
     () => initializeStateVars(true),
-    [dataVersion, memoizedLastItemKeys.join(","), numColumnsProp, stylePaddingBottomState, stylePaddingTopState]
+    [
+      dataVersion,
+      memoizedLastItemKeys.join(","),
+      numColumnsProp,
+      stylePaddingBottomState,
+      stylePaddingTopState,
+      useAlignItemsAtEndPadding
+    ]
   );
   React3.useLayoutEffect(() => {
     const {

package/react.mjs

@@ -143,6 +143,7 @@ function StateProvider({ children }) {
     positionListeners: /* @__PURE__ */ new Map(),
     state: void 0,
     values: /* @__PURE__ */ new Map([
+      ["alignItemsAtEndPadding", 0],
       ["stylePaddingTop", 0],
       ["headerSize", 0],
       ["numContainers", 0],
@@ -285,15 +286,16 @@ function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
 
 // src/state/getContentSize.ts
 function getContentSize(ctx) {
-  var _a3;
+  var _a3, _b;
   const { values, state } = ctx;
   const stylePaddingTop = values.get("stylePaddingTop") || 0;
   const stylePaddingBottom = 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 totalSize = (_a3 = state.pendingTotalSize) != null ? _a3 : values.get("totalSize");
-  return headerSize + footerSize + totalSize + stylePaddingTop + stylePaddingBottom + (contentInsetBottom || 0);
+  const totalSize = (_b = (_a3 = state.pendingTotalSize) != null ? _a3 : state.totalSize) != null ? _b : values.get("totalSize");
+  return headerSize + footerSize + totalSize + stylePaddingTop + alignItemsAtEndPadding + stylePaddingBottom + (contentInsetBottom || 0);
 }
 
 // src/components/DebugView.tsx
@@ -1793,6 +1795,51 @@ function WebAnchoredEndSpace({ horizontal }) {
   const style = horizontal ? { height: "100%", width: anchoredEndSpaceSize || 0 } : { height: anchoredEndSpaceSize || 0 };
   return /* @__PURE__ */ React3.createElement("div", { style }, null);
 }
+
+// src/core/updateContentMetrics.ts
+function getRawContentLength(ctx) {
+  var _a3, _b, _c;
+  const { state, values } = ctx;
+  return (values.get("headerSize") || 0) + (values.get("footerSize") || 0) + ((_c = (_b = (_a3 = state.pendingTotalSize) != null ? _a3 : state.totalSize) != null ? _b : values.get("totalSize")) != null ? _c : 0) + (state.props.stylePaddingTop || 0) + (state.props.stylePaddingBottom || 0);
+}
+function getAlignItemsAtEndPadding(ctx) {
+  const { state } = ctx;
+  const shouldPad = !!state.props.alignItemsAtEndPaddingEnabled && !state.props.horizontal && state.props.data.length > 0 && state.scrollLength > 0;
+  return shouldPad ? Math.max(0, state.scrollLength - getRawContentLength(ctx) - getContentInsetEnd(ctx)) : 0;
+}
+function updateContentMetrics(ctx) {
+  const nextPadding = getAlignItemsAtEndPadding(ctx);
+  if (peek$(ctx, "alignItemsAtEndPadding") !== nextPadding) {
+    set$(ctx, "alignItemsAtEndPadding", nextPadding);
+  }
+}
+function setContentLengthSignal(ctx, signalName, size) {
+  if (peek$(ctx, signalName) !== size) {
+    set$(ctx, signalName, size);
+    updateContentMetrics(ctx);
+  }
+}
+function setHeaderSize(ctx, size) {
+  setContentLengthSignal(ctx, "headerSize", size);
+}
+function setFooterSize(ctx, size) {
+  setContentLengthSignal(ctx, "footerSize", size);
+}
+function areInsetsEqual(left, right) {
+  var _a3, _b, _c, _d, _e, _f, _g, _h;
+  return ((_a3 = left == null ? void 0 : left.top) != null ? _a3 : 0) === ((_b = right == null ? void 0 : right.top) != null ? _b : 0) && ((_c = left == null ? void 0 : left.bottom) != null ? _c : 0) === ((_d = right == null ? void 0 : right.bottom) != null ? _d : 0) && ((_e = left == null ? void 0 : left.left) != null ? _e : 0) === ((_f = right == null ? void 0 : right.left) != null ? _f : 0) && ((_g = left == null ? void 0 : left.right) != null ? _g : 0) === ((_h = right == null ? void 0 : right.right) != null ? _h : 0);
+}
+function setContentInsetOverride(ctx, inset) {
+  const { state } = ctx;
+  const previousInset = state.contentInsetOverride;
+  const nextInset = inset != null ? inset : void 0;
+  const didChange = !areInsetsEqual(previousInset, nextInset);
+  state.contentInsetOverride = nextInset;
+  if (didChange) {
+    updateContentMetrics(ctx);
+  }
+  return didChange;
+}
 function useStableRenderComponent(renderComponent, mapProps) {
   const renderComponentRef = useLatestRef(renderComponent);
   const mapPropsRef = useLatestRef(mapProps);
@@ -1844,7 +1891,7 @@ var ListComponent = typedMemo(function ListComponent2({
 }) {
   const ctx = useStateContext();
   const maintainVisibleContentPosition = ctx.state.props.maintainVisibleContentPosition;
-  const [otherAxisSize = 0] = useArr$(["otherAxisSize"]);
+  const [alignItemsAtEndPadding = 0, otherAxisSize = 0] = useArr$(["alignItemsAtEndPadding", "otherAxisSize"]);
   const autoOtherAxisStyle = getAutoOtherAxisStyle({
     horizontal,
     needsOtherAxisSize: ctx.state.needsOtherAxisSize,
@@ -1858,23 +1905,23 @@ var ListComponent = typedMemo(function ListComponent2({
   const SnapOrScroll = snapToIndices ? SnapWrapper : ScrollComponent;
   useLayoutEffect(() => {
     if (!ListHeaderComponent) {
-      set$(ctx, "headerSize", 0);
+      setHeaderSize(ctx, 0);
     }
     if (!ListFooterComponent) {
-      set$(ctx, "footerSize", 0);
+      setFooterSize(ctx, 0);
     }
   }, [ListHeaderComponent, ListFooterComponent, ctx]);
   const onLayoutHeader = useCallback(
     (rect) => {
       const size = rect[horizontal ? "width" : "height"];
-      set$(ctx, "headerSize", size);
+      setHeaderSize(ctx, size);
     },
     [ctx, horizontal]
   );
   const onLayoutFooterInternal = useCallback(
     (rect, fromLayoutEffect) => {
       const size = rect[horizontal ? "width" : "height"];
-      set$(ctx, "footerSize", size);
+      setFooterSize(ctx, size);
       onLayoutFooter == null ? void 0 : onLayoutFooter(rect, fromLayoutEffect);
     },
     [ctx, horizontal, onLayoutFooter]
@@ -1902,6 +1949,13 @@ var ListComponent = typedMemo(function ListComponent2({
     /* @__PURE__ */ React3.createElement(ScrollAdjust, null),
     ListHeaderComponent && /* @__PURE__ */ React3.createElement(LayoutView, { onLayoutChange: onLayoutHeader, style: ListHeaderComponentStyle }, getComponent(ListHeaderComponent)),
     ListEmptyComponent && getComponent(ListEmptyComponent),
+    alignItemsAtEndPadding > 0 && /* @__PURE__ */ React3.createElement(
+      View,
+      {
+        style: horizontal ? { flexShrink: 0, width: alignItemsAtEndPadding } : { flexShrink: 0, height: alignItemsAtEndPadding }
+      },
+      null
+    ),
     canRender && !ListEmptyComponent && /* @__PURE__ */ React3.createElement(
       Containers,
       {
@@ -2393,7 +2447,7 @@ function calculateOffsetForIndex(ctx, index) {
 
 // src/core/getTopOffsetAdjustment.ts
 function getTopOffsetAdjustment(ctx) {
-  return (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
+  return (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
 }
 
 // src/utils/getId.ts
@@ -2429,6 +2483,7 @@ function addTotalSize(ctx, key, add, notifyTotalSize = true) {
       if (notifyTotalSize) {
         set$(ctx, "totalSize", totalSize);
       }
+      updateContentMetrics(ctx);
     }
   } else if (notifyTotalSize && ctx.values.get("totalSize") !== totalSize) {
     set$(ctx, "totalSize", totalSize);
@@ -4775,7 +4830,7 @@ function areViewabilityAmountTokensEqual(prev, next) {
 }
 function computeViewability(state, ctx, viewabilityConfig, containerId, key, scrollSize, item, index) {
   const { sizes, scroll: scrollState } = state;
-  const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "headerSize") || 0);
+  const topPad = (peek$(ctx, "stylePaddingTop") || 0) + (peek$(ctx, "alignItemsAtEndPadding") || 0) + (peek$(ctx, "headerSize") || 0);
   const { itemVisiblePercentThreshold, viewAreaCoveragePercentThreshold } = viewabilityConfig;
   const viewAreaMode = viewAreaCoveragePercentThreshold != null;
   const viewablePercentThreshold = viewAreaMode ? viewAreaCoveragePercentThreshold : itemVisiblePercentThreshold;
@@ -5226,7 +5281,7 @@ function calculateItemsInView(ctx, params = {}) {
       return;
     }
     let totalSize = getContentSize(ctx);
-    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "headerSize");
+    const topPad = peek$(ctx, "stylePaddingTop") + peek$(ctx, "alignItemsAtEndPadding") + peek$(ctx, "headerSize");
     const numColumns = peek$(ctx, "numColumns");
     const speed = getScrollVelocity(state);
     const scrollExtra = 0;
@@ -5770,6 +5825,7 @@ function handleLayout(ctx, layoutParam, setCanRender) {
   if (didChange) {
     state.scrollLength = scrollLength;
     state.otherAxisSize = otherAxisSize;
+    updateContentMetrics(ctx);
     state.lastBatchingAction = Date.now();
     state.scrollForNextCalculateItemsInView = void 0;
     if (scrollLength > 0) {
@@ -6435,10 +6491,7 @@ function createImperativeHandle(ctx, scheduleImperativeScrollCommit) {
       startBuffered: state.startBuffered
     }),
     reportContentInset: (inset) => {
-      var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
-      const previousInset = state.contentInsetOverride;
-      state.contentInsetOverride = inset != null ? inset : void 0;
-      const didChange = ((_a3 = previousInset == null ? void 0 : previousInset.top) != null ? _a3 : 0) !== ((_c = (_b = state.contentInsetOverride) == null ? void 0 : _b.top) != null ? _c : 0) || ((_d = previousInset == null ? void 0 : previousInset.bottom) != null ? _d : 0) !== ((_f = (_e = state.contentInsetOverride) == null ? void 0 : _e.bottom) != null ? _f : 0) || ((_g = previousInset == null ? void 0 : previousInset.left) != null ? _g : 0) !== ((_i = (_h = state.contentInsetOverride) == null ? void 0 : _h.left) != null ? _i : 0) || ((_j = previousInset == null ? void 0 : previousInset.right) != null ? _j : 0) !== ((_l = (_k = state.contentInsetOverride) == null ? void 0 : _k.right) != null ? _l : 0);
+      const didChange = setContentInsetOverride(ctx, inset);
       updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
       if (didChange) {
         retargetActiveInitialScrollAtEnd(ctx);
@@ -6794,10 +6847,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     ...restProps
   } = rest;
   const contentContainerStyleBase = StyleSheet.flatten(contentContainerStyleProp);
-  const shouldFlexGrow = alignItemsAtEnd && (horizontal ? (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minWidth) == null : (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null);
+  const useAlignItemsAtEndPadding = alignItemsAtEnd && !horizontal && (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null && dataProp.length > 0;
+  const shouldFlexGrow = alignItemsAtEnd && !useAlignItemsAtEndPadding && (horizontal ? (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minWidth) == null : (contentContainerStyleBase == null ? void 0 : contentContainerStyleBase.minHeight) == null);
   const contentContainerStyle = {
     ...contentContainerStyleBase,
-    ...alignItemsAtEnd ? {
+    ...alignItemsAtEnd && !useAlignItemsAtEndPadding ? {
       display: "flex",
       flexDirection: horizontal ? "row" : "column",
       ...shouldFlexGrow ? { flexGrow: 1 } : {},
@@ -6961,6 +7015,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   const didAnchoredEndSpaceAnchorIndexChange = !isFirstLocal && !didDataChangeLocal && ((_g = state.props.anchoredEndSpace) == null ? void 0 : _g.anchorIndex) !== (anchoredEndSpaceResolved == null ? void 0 : anchoredEndSpaceResolved.anchorIndex);
   state.props = {
     alignItemsAtEnd,
+    alignItemsAtEndPaddingEnabled: useAlignItemsAtEndPadding,
     alwaysRender,
     alwaysRenderIndicesArr: alwaysRenderIndices.arr,
     alwaysRenderIndicesSet: alwaysRenderIndices.set,
@@ -7018,6 +7073,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
     const prevPaddingTop = peek$(ctx, "stylePaddingTop");
     setPaddingTop(ctx, { stylePaddingTop: stylePaddingTopState });
     refState.current.props.stylePaddingBottom = stylePaddingBottomState;
+    updateContentMetrics(ctx);
     let paddingDiff = stylePaddingTopState - prevPaddingTop;
     if (shouldAdjustPadding && maintainVisibleContentPositionConfig.size && paddingDiff && prevPaddingTop !== void 0 && Platform.OS === "ios") ;
   };
@@ -7136,7 +7192,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
   }, [snapToIndices]);
   useLayoutEffect(
     () => initializeStateVars(true),
-    [dataVersion, memoizedLastItemKeys.join(","), numColumnsProp, stylePaddingBottomState, stylePaddingTopState]
+    [
+      dataVersion,
+      memoizedLastItemKeys.join(","),
+      numColumnsProp,
+      stylePaddingBottomState,
+      stylePaddingTopState,
+      useAlignItemsAtEndPadding
+    ]
   );
   useLayoutEffect(() => {
     const {

package/reanimated.d.ts

@@ -9,10 +9,11 @@ interface MaintainVisibleContentPositionNormalized<ItemT = any> {
     shouldRestorePosition?: (item: ItemT, index: number, data: readonly ItemT[]) => boolean;
 }
 
-type ListenerType = "activeStickyIndex" | "anchoredEndSpaceSize" | "debugComputedScroll" | "debugRawScroll" | "extraData" | "footerSize" | "headerSize" | "lastItemKeys" | "lastPositionUpdate" | "maintainVisibleContentPosition" | "numColumns" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "scrollAdjust" | "scrollAdjustPending" | "scrollAdjustUserOffset" | "scrollSize" | "snapToOffsets" | "stylePaddingTop" | "totalSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | `containerColumn${number}` | `containerSpan${number}` | `containerItemData${number}` | `containerItemKey${number}` | `containerPosition${number}` | `containerSticky${number}`;
+type ListenerType = "activeStickyIndex" | "alignItemsAtEndPadding" | "anchoredEndSpaceSize" | "debugComputedScroll" | "debugRawScroll" | "extraData" | "footerSize" | "headerSize" | "lastItemKeys" | "lastPositionUpdate" | "maintainVisibleContentPosition" | "numColumns" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "scrollAdjust" | "scrollAdjustPending" | "scrollAdjustUserOffset" | "scrollSize" | "snapToOffsets" | "stylePaddingTop" | "totalSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | `containerColumn${number}` | `containerSpan${number}` | `containerItemData${number}` | `containerItemKey${number}` | `containerPosition${number}` | `containerSticky${number}`;
 type LegendListListenerType = Extract<ListenerType, "activeStickyIndex" | "anchoredEndSpaceSize" | "footerSize" | "headerSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | "lastItemKeys" | "lastPositionUpdate" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "snapToOffsets" | "totalSize">;
 type ListenerTypeValueMap = {
     activeStickyIndex: number;
+    alignItemsAtEndPadding: number;
     anchoredEndSpaceSize: number;
     animatedScrollY: any;
     debugComputedScroll: number;

package/section-list.d.ts

@@ -65,10 +65,11 @@ interface MaintainVisibleContentPositionNormalized<ItemT = any> {
     shouldRestorePosition?: (item: ItemT, index: number, data: readonly ItemT[]) => boolean;
 }
 
-type ListenerType = "activeStickyIndex" | "anchoredEndSpaceSize" | "debugComputedScroll" | "debugRawScroll" | "extraData" | "footerSize" | "headerSize" | "lastItemKeys" | "lastPositionUpdate" | "maintainVisibleContentPosition" | "numColumns" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "scrollAdjust" | "scrollAdjustPending" | "scrollAdjustUserOffset" | "scrollSize" | "snapToOffsets" | "stylePaddingTop" | "totalSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | `containerColumn${number}` | `containerSpan${number}` | `containerItemData${number}` | `containerItemKey${number}` | `containerPosition${number}` | `containerSticky${number}`;
+type ListenerType = "activeStickyIndex" | "alignItemsAtEndPadding" | "anchoredEndSpaceSize" | "debugComputedScroll" | "debugRawScroll" | "extraData" | "footerSize" | "headerSize" | "lastItemKeys" | "lastPositionUpdate" | "maintainVisibleContentPosition" | "numColumns" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "scrollAdjust" | "scrollAdjustPending" | "scrollAdjustUserOffset" | "scrollSize" | "snapToOffsets" | "stylePaddingTop" | "totalSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | `containerColumn${number}` | `containerSpan${number}` | `containerItemData${number}` | `containerItemKey${number}` | `containerPosition${number}` | `containerSticky${number}`;
 type LegendListListenerType = Extract<ListenerType, "activeStickyIndex" | "anchoredEndSpaceSize" | "footerSize" | "headerSize" | "isAtEnd" | "isAtStart" | "isNearEnd" | "isNearStart" | "isWithinMaintainScrollAtEndThreshold" | "lastItemKeys" | "lastPositionUpdate" | "numContainers" | "numContainersPooled" | "otherAxisSize" | "readyToRender" | "snapToOffsets" | "totalSize">;
 type ListenerTypeValueMap = {
     activeStickyIndex: number;
+    alignItemsAtEndPadding: number;
     anchoredEndSpaceSize: number;
     animatedScrollY: any;
     debugComputedScroll: number;