@legendapp/list 3.0.0-beta.52 → 3.0.0-beta.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/animated.d.ts +6 -1
- package/index.d.ts +6 -0
- package/index.js +134 -44
- package/index.mjs +134 -44
- package/index.native.js +107 -39
- package/index.native.mjs +107 -39
- package/keyboard-chat.d.ts +3 -2
- package/keyboard-chat.js +3 -3
- package/keyboard-chat.mjs +3 -3
- package/keyboard-test.d.ts +5 -2
- package/keyboard-test.js +3 -3
- package/keyboard-test.mjs +3 -3
- package/package.json +1 -1
- package/react-native.d.ts +6 -1
- package/react-native.js +107 -39
- package/react-native.mjs +107 -39
- package/react-native.web.d.ts +5 -1
- package/react-native.web.js +134 -44
- package/react-native.web.mjs +134 -44
- package/react.d.ts +5 -1
- package/react.js +134 -44
- package/react.mjs +134 -44
- package/reanimated.d.ts +6 -1
- package/section-list.d.ts +6 -1
package/index.mjs
CHANGED
|
@@ -145,7 +145,10 @@ function useSelector$(signalName, selector) {
|
|
|
145
145
|
}
|
|
146
146
|
|
|
147
147
|
// src/state/getContentInsetEnd.ts
|
|
148
|
-
function
|
|
148
|
+
function getContentInsetEndAdjustmentEnd(adjustment) {
|
|
149
|
+
return Math.max(0, adjustment != null ? adjustment : 0);
|
|
150
|
+
}
|
|
151
|
+
function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
|
|
149
152
|
var _a3, _b;
|
|
150
153
|
const state = ctx.state;
|
|
151
154
|
const { props } = state;
|
|
@@ -153,14 +156,21 @@ function getContentInsetEnd(ctx) {
|
|
|
153
156
|
const contentInset = props.contentInset;
|
|
154
157
|
const baseInset = contentInset != null ? contentInset : state.nativeContentInset;
|
|
155
158
|
const baseEndInset = (horizontal ? baseInset == null ? void 0 : baseInset.right : baseInset == null ? void 0 : baseInset.bottom) || 0;
|
|
159
|
+
const contentInsetEndAdjustment = getContentInsetEndAdjustmentEnd(
|
|
160
|
+
contentInsetEndAdjustmentOverride != null ? contentInsetEndAdjustmentOverride : props.contentInsetEndAdjustment
|
|
161
|
+
);
|
|
156
162
|
const anchoredEndSpaceSize = peek$(ctx, "anchoredEndSpaceSize");
|
|
157
163
|
const anchoredEndInset = ((_a3 = props.anchoredEndSpace) == null ? void 0 : _a3.includeInEndInset) && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
|
|
158
164
|
const overrideInset = (_b = state.contentInsetOverride) != null ? _b : void 0;
|
|
165
|
+
const adjustedBaseEndInset = baseEndInset + contentInsetEndAdjustment;
|
|
159
166
|
if (overrideInset) {
|
|
160
167
|
const mergedInset = { bottom: 0, right: 0, ...baseInset, ...overrideInset };
|
|
161
|
-
return Math.max(
|
|
168
|
+
return Math.max(
|
|
169
|
+
((horizontal ? mergedInset.right : mergedInset.bottom) || 0) + contentInsetEndAdjustment,
|
|
170
|
+
anchoredEndInset
|
|
171
|
+
);
|
|
162
172
|
}
|
|
163
|
-
return Math.max(
|
|
173
|
+
return Math.max(adjustedBaseEndInset, anchoredEndInset);
|
|
164
174
|
}
|
|
165
175
|
|
|
166
176
|
// src/state/getContentSize.ts
|
|
@@ -658,6 +668,49 @@ function isInMVCPActiveMode(state) {
|
|
|
658
668
|
}
|
|
659
669
|
|
|
660
670
|
// src/components/Container.tsx
|
|
671
|
+
function getContainerPositionStyle({
|
|
672
|
+
columnWrapperStyle,
|
|
673
|
+
horizontal,
|
|
674
|
+
hasItemSeparator,
|
|
675
|
+
numColumns,
|
|
676
|
+
otherAxisPos,
|
|
677
|
+
otherAxisSize
|
|
678
|
+
}) {
|
|
679
|
+
let paddingStyles;
|
|
680
|
+
if (columnWrapperStyle) {
|
|
681
|
+
const { columnGap, rowGap, gap } = columnWrapperStyle;
|
|
682
|
+
if (horizontal) {
|
|
683
|
+
paddingStyles = {
|
|
684
|
+
paddingBottom: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0,
|
|
685
|
+
paddingRight: columnGap || gap || void 0,
|
|
686
|
+
paddingTop: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
|
|
687
|
+
};
|
|
688
|
+
} else {
|
|
689
|
+
paddingStyles = {
|
|
690
|
+
paddingBottom: rowGap || gap || void 0,
|
|
691
|
+
paddingLeft: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0,
|
|
692
|
+
paddingRight: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
|
|
693
|
+
};
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
return horizontal ? {
|
|
697
|
+
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
698
|
+
flexDirection: hasItemSeparator ? "row" : void 0,
|
|
699
|
+
height: otherAxisSize,
|
|
700
|
+
left: 0,
|
|
701
|
+
position: "absolute",
|
|
702
|
+
top: otherAxisPos,
|
|
703
|
+
...paddingStyles || {}
|
|
704
|
+
} : {
|
|
705
|
+
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
706
|
+
left: otherAxisPos,
|
|
707
|
+
position: "absolute",
|
|
708
|
+
right: numColumns > 1 ? null : 0,
|
|
709
|
+
top: 0,
|
|
710
|
+
width: otherAxisSize,
|
|
711
|
+
...paddingStyles || {}
|
|
712
|
+
};
|
|
713
|
+
}
|
|
661
714
|
var Container = typedMemo(function Container2({
|
|
662
715
|
id,
|
|
663
716
|
recycleItems,
|
|
@@ -696,42 +749,17 @@ var Container = typedMemo(function Container2({
|
|
|
696
749
|
const resolvedSpan = Math.min(Math.max(span || 1, 1), numColumns);
|
|
697
750
|
const otherAxisPos = numColumns > 1 ? `${(resolvedColumn - 1) / numColumns * 100}%` : 0;
|
|
698
751
|
const otherAxisSize = numColumns > 1 ? `${resolvedSpan / numColumns * 100}%` : void 0;
|
|
699
|
-
const style = useMemo(
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
paddingStyles = {
|
|
711
|
-
paddingBottom: rowGap || gap || void 0,
|
|
712
|
-
paddingLeft: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0,
|
|
713
|
-
paddingRight: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
|
|
714
|
-
};
|
|
715
|
-
}
|
|
716
|
-
}
|
|
717
|
-
return horizontal ? {
|
|
718
|
-
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
719
|
-
flexDirection: ItemSeparatorComponent ? "row" : void 0,
|
|
720
|
-
height: otherAxisSize,
|
|
721
|
-
left: 0,
|
|
722
|
-
position: "absolute",
|
|
723
|
-
top: otherAxisPos,
|
|
724
|
-
...paddingStyles || {}
|
|
725
|
-
} : {
|
|
726
|
-
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
727
|
-
left: otherAxisPos,
|
|
728
|
-
position: "absolute",
|
|
729
|
-
right: numColumns > 1 ? null : 0,
|
|
730
|
-
top: 0,
|
|
731
|
-
width: otherAxisSize,
|
|
732
|
-
...paddingStyles || {}
|
|
733
|
-
};
|
|
734
|
-
}, [horizontal, otherAxisPos, otherAxisSize, columnWrapperStyle, numColumns]);
|
|
752
|
+
const style = useMemo(
|
|
753
|
+
() => getContainerPositionStyle({
|
|
754
|
+
columnWrapperStyle,
|
|
755
|
+
hasItemSeparator: !!ItemSeparatorComponent,
|
|
756
|
+
horizontal,
|
|
757
|
+
numColumns,
|
|
758
|
+
otherAxisPos,
|
|
759
|
+
otherAxisSize
|
|
760
|
+
}),
|
|
761
|
+
[horizontal, otherAxisPos, otherAxisSize, columnWrapperStyle, numColumns, ItemSeparatorComponent]
|
|
762
|
+
);
|
|
735
763
|
const renderedItemInfo = useMemo(
|
|
736
764
|
() => itemKey !== void 0 ? getRenderedItem2(itemKey) : null,
|
|
737
765
|
[itemKey, data, extraData]
|
|
@@ -1042,6 +1070,9 @@ function useRafCoalescer(callback) {
|
|
|
1042
1070
|
return coalescer;
|
|
1043
1071
|
}
|
|
1044
1072
|
|
|
1073
|
+
// src/components/webConstants.ts
|
|
1074
|
+
var LEGEND_LIST_CONTENT_CONTAINER_CLASS = "legend-list-content-container";
|
|
1075
|
+
|
|
1045
1076
|
// src/components/webScrollUtils.ts
|
|
1046
1077
|
function getDocumentScrollerNode() {
|
|
1047
1078
|
if (typeof document === "undefined") {
|
|
@@ -1126,6 +1157,11 @@ function resolveWindowScrollTarget({ clampedOffset, horizontal, listPos, scroll
|
|
|
1126
1157
|
}
|
|
1127
1158
|
|
|
1128
1159
|
// src/components/ListComponentScrollView.tsx
|
|
1160
|
+
function getContentInsetEndAdjustmentEnd2(ctx) {
|
|
1161
|
+
var _a3, _b;
|
|
1162
|
+
const adjustment = (_b = (_a3 = ctx.state) == null ? void 0 : _a3.props) == null ? void 0 : _b.contentInsetEndAdjustment;
|
|
1163
|
+
return Math.max(0, adjustment != null ? adjustment : 0);
|
|
1164
|
+
}
|
|
1129
1165
|
var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
1130
1166
|
children,
|
|
1131
1167
|
style,
|
|
@@ -1143,7 +1179,9 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
|
1143
1179
|
onLayout,
|
|
1144
1180
|
...props
|
|
1145
1181
|
}, ref) {
|
|
1182
|
+
var _a3, _b, _c;
|
|
1146
1183
|
const ctx = useStateContext();
|
|
1184
|
+
const [anchoredEndSpaceSize] = useArr$(["anchoredEndSpaceSize"]);
|
|
1147
1185
|
const scrollRef = useRef(null);
|
|
1148
1186
|
const contentRef = useRef(null);
|
|
1149
1187
|
const isWindowScroll = useWindowScroll;
|
|
@@ -1205,10 +1243,9 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
|
1205
1243
|
useImperativeHandle(ref, () => {
|
|
1206
1244
|
const api = {
|
|
1207
1245
|
getBoundingClientRect: () => {
|
|
1208
|
-
var
|
|
1209
|
-
return (
|
|
1246
|
+
var _a4;
|
|
1247
|
+
return (_a4 = scrollRef.current) == null ? void 0 : _a4.getBoundingClientRect();
|
|
1210
1248
|
},
|
|
1211
|
-
getContentNode: () => contentRef.current,
|
|
1212
1249
|
getCurrentScrollOffset,
|
|
1213
1250
|
getScrollableNode: () => resolveScrollableNode(scrollRef.current, isWindowScroll),
|
|
1214
1251
|
getScrollEventTarget: () => getScrollTarget(),
|
|
@@ -1334,6 +1371,10 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
|
1334
1371
|
},
|
|
1335
1372
|
...StyleSheet.flatten(style)
|
|
1336
1373
|
};
|
|
1374
|
+
const contentInsetEndAdjustment = getContentInsetEndAdjustmentEnd2(ctx);
|
|
1375
|
+
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;
|
|
1376
|
+
const renderedContentInsetEndAdjustment = Math.max(0, contentInsetEndAdjustment - anchoredEndInset);
|
|
1377
|
+
const contentInsetEndAdjustmentSpacerStyle = renderedContentInsetEndAdjustment ? horizontal ? { flexShrink: 0, width: renderedContentInsetEndAdjustment } : { height: renderedContentInsetEndAdjustment } : void 0;
|
|
1337
1378
|
const contentStyle = {
|
|
1338
1379
|
display: horizontal ? "flex" : "block",
|
|
1339
1380
|
flexDirection: horizontal ? "row" : void 0,
|
|
@@ -1341,6 +1382,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
|
1341
1382
|
minWidth: horizontal ? "100%" : void 0,
|
|
1342
1383
|
...StyleSheet.flatten(contentContainerStyle)
|
|
1343
1384
|
};
|
|
1385
|
+
const className = contentContainerClassName ? `${LEGEND_LIST_CONTENT_CONTAINER_CLASS} ${contentContainerClassName}` : LEGEND_LIST_CONTENT_CONTAINER_CLASS;
|
|
1344
1386
|
const {
|
|
1345
1387
|
contentContainerClassName: _contentContainerClassName,
|
|
1346
1388
|
contentInset: _contentInset,
|
|
@@ -1349,7 +1391,7 @@ var ListComponentScrollView = forwardRef(function ListComponentScrollView2({
|
|
|
1349
1391
|
useWindowScroll: _useWindowScroll,
|
|
1350
1392
|
...webProps
|
|
1351
1393
|
} = props;
|
|
1352
|
-
return /* @__PURE__ */ React3.createElement("div", { ref: scrollRef, ...webProps, style: scrollViewStyle }, refreshControl, /* @__PURE__ */ React3.createElement("div", { className
|
|
1394
|
+
return /* @__PURE__ */ React3.createElement("div", { ref: scrollRef, ...webProps, style: scrollViewStyle }, refreshControl, /* @__PURE__ */ React3.createElement("div", { className, ref: contentRef, style: contentStyle }, children, contentInsetEndAdjustmentSpacerStyle ? /* @__PURE__ */ React3.createElement("div", { "aria-hidden": true, style: contentInsetEndAdjustmentSpacerStyle }) : null));
|
|
1353
1395
|
});
|
|
1354
1396
|
function useValueListener$(key, callback) {
|
|
1355
1397
|
const ctx = useStateContext();
|
|
@@ -1377,11 +1419,18 @@ function getScrollAdjustAxis(horizontal) {
|
|
|
1377
1419
|
y: 1
|
|
1378
1420
|
};
|
|
1379
1421
|
}
|
|
1422
|
+
function resolveScrollAdjustContentNode(el, contentNode) {
|
|
1423
|
+
if ((contentNode == null ? void 0 : contentNode.isConnected) && contentNode.parentElement === el) {
|
|
1424
|
+
return contentNode;
|
|
1425
|
+
}
|
|
1426
|
+
return el.querySelector(`:scope > .${LEGEND_LIST_CONTENT_CONTAINER_CLASS}`);
|
|
1427
|
+
}
|
|
1380
1428
|
function ScrollAdjust() {
|
|
1381
1429
|
const ctx = useStateContext();
|
|
1382
1430
|
const lastScrollOffsetRef = React3.useRef(0);
|
|
1383
1431
|
const resetPaddingRafRef = React3.useRef(void 0);
|
|
1384
1432
|
const resetPaddingBaselineRef = React3.useRef(void 0);
|
|
1433
|
+
const contentNodeRef = React3.useRef(null);
|
|
1385
1434
|
const callback = React3.useCallback(() => {
|
|
1386
1435
|
var _a3, _b;
|
|
1387
1436
|
const scrollAdjust = peek$(ctx, "scrollAdjust");
|
|
@@ -1392,9 +1441,10 @@ function ScrollAdjust() {
|
|
|
1392
1441
|
const scrollDelta = scrollOffset - lastScrollOffsetRef.current;
|
|
1393
1442
|
if (scrollDelta !== 0) {
|
|
1394
1443
|
const axis = getScrollAdjustAxis(!!ctx.state.props.horizontal);
|
|
1395
|
-
const contentNode = scrollView.getContentNode();
|
|
1396
1444
|
const prevScroll = scrollView.getCurrentScrollOffset();
|
|
1397
1445
|
const el = scrollView.getScrollableNode();
|
|
1446
|
+
const contentNode = resolveScrollAdjustContentNode(el, contentNodeRef.current);
|
|
1447
|
+
contentNodeRef.current = contentNode;
|
|
1398
1448
|
const scrollBy = () => scrollView.scrollBy(axis.x * scrollDelta, axis.y * scrollDelta);
|
|
1399
1449
|
if (!contentNode) {
|
|
1400
1450
|
scrollBy();
|
|
@@ -3249,6 +3299,15 @@ function checkFinishedScrollFallback(ctx) {
|
|
|
3249
3299
|
}
|
|
3250
3300
|
|
|
3251
3301
|
// src/core/initialScrollLifecycle.ts
|
|
3302
|
+
function retargetActiveInitialScrollAtEnd(ctx) {
|
|
3303
|
+
var _a3;
|
|
3304
|
+
const state = ctx.state;
|
|
3305
|
+
const initialScroll = state.initialScroll;
|
|
3306
|
+
if (!initialScroll || state.didFinishInitialScroll || ((_a3 = state.initialScrollSession) == null ? void 0 : _a3.kind) === "offset" || initialScroll.viewPosition !== 1 || state.props.data.length === 0) {
|
|
3307
|
+
return false;
|
|
3308
|
+
}
|
|
3309
|
+
return advanceCurrentInitialScrollSession(ctx, { forceScroll: true });
|
|
3310
|
+
}
|
|
3252
3311
|
function handleInitialScrollLayoutReady(ctx) {
|
|
3253
3312
|
var _a3;
|
|
3254
3313
|
if (!ctx.state.initialScroll) {
|
|
@@ -5315,6 +5374,22 @@ function maybeUpdateAnchoredEndSpace(ctx) {
|
|
|
5315
5374
|
return nextSize;
|
|
5316
5375
|
}
|
|
5317
5376
|
|
|
5377
|
+
// src/core/updateContentInsetEndAdjustment.ts
|
|
5378
|
+
function updateContentInsetEndAdjustment(ctx, previousContentInsetEndAdjustment) {
|
|
5379
|
+
const state = ctx.state;
|
|
5380
|
+
const previousContentInsetEnd = getContentInsetEnd(ctx, previousContentInsetEndAdjustment);
|
|
5381
|
+
const nextContentInsetEnd = getContentInsetEnd(ctx);
|
|
5382
|
+
const insetDiff = nextContentInsetEnd - previousContentInsetEnd;
|
|
5383
|
+
if (insetDiff !== 0) {
|
|
5384
|
+
const wasWithinEndThreshold = !!peek$(ctx, "isWithinMaintainScrollAtEndThreshold");
|
|
5385
|
+
updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
|
|
5386
|
+
const didRetargetInitialScroll = retargetActiveInitialScrollAtEnd(ctx);
|
|
5387
|
+
if (!didRetargetInitialScroll && wasWithinEndThreshold && (insetDiff > 0)) {
|
|
5388
|
+
requestAdjust(ctx, insetDiff);
|
|
5389
|
+
}
|
|
5390
|
+
}
|
|
5391
|
+
}
|
|
5392
|
+
|
|
5318
5393
|
// src/core/updateItemSize.ts
|
|
5319
5394
|
function runOrScheduleMVCPRecalculate(ctx) {
|
|
5320
5395
|
const state = ctx.state;
|
|
@@ -5662,8 +5737,14 @@ function createImperativeHandle(ctx) {
|
|
|
5662
5737
|
startBuffered: state.startBuffered
|
|
5663
5738
|
}),
|
|
5664
5739
|
reportContentInset: (inset) => {
|
|
5740
|
+
var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
5741
|
+
const previousInset = state.contentInsetOverride;
|
|
5665
5742
|
state.contentInsetOverride = inset != null ? inset : void 0;
|
|
5743
|
+
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);
|
|
5666
5744
|
updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
|
|
5745
|
+
if (didChange) {
|
|
5746
|
+
retargetActiveInitialScrollAtEnd(ctx);
|
|
5747
|
+
}
|
|
5667
5748
|
},
|
|
5668
5749
|
scrollIndexIntoView: (options) => runScrollWithPromise(() => scrollIndexIntoView(options)),
|
|
5669
5750
|
scrollItemIntoView: ({ item, ...props }) => runScrollWithPromise(() => {
|
|
@@ -5964,6 +6045,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
5964
6045
|
data: dataProp = [],
|
|
5965
6046
|
dataVersion,
|
|
5966
6047
|
drawDistance = 250,
|
|
6048
|
+
contentInsetEndAdjustment,
|
|
5967
6049
|
estimatedItemSize = 100,
|
|
5968
6050
|
estimatedListSize,
|
|
5969
6051
|
extraData,
|
|
@@ -6073,6 +6155,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
6073
6155
|
const combinedRef = useCombinedRef(refScroller, refScrollView);
|
|
6074
6156
|
const keyExtractor = keyExtractorProp != null ? keyExtractorProp : ((_item, index) => index.toString());
|
|
6075
6157
|
const stickyHeaderIndices = stickyHeaderIndicesProp != null ? stickyHeaderIndicesProp : stickyIndicesDeprecated;
|
|
6158
|
+
const contentInsetEndAdjustmentResolved = contentInsetEndAdjustment ;
|
|
6159
|
+
const previousContentInsetEndAdjustmentRef = useRef(contentInsetEndAdjustmentResolved);
|
|
6076
6160
|
const alwaysRenderIndices = useMemo(() => {
|
|
6077
6161
|
const indices = getAlwaysRenderIndices(alwaysRender, dataProp, keyExtractor, anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorIndex);
|
|
6078
6162
|
return { arr: indices, set: new Set(indices) };
|
|
@@ -6192,6 +6276,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
6192
6276
|
anchoredEndSpace: anchoredEndSpaceResolved,
|
|
6193
6277
|
animatedProps: animatedPropsInternal,
|
|
6194
6278
|
contentInset,
|
|
6279
|
+
contentInsetEndAdjustment: contentInsetEndAdjustmentResolved,
|
|
6195
6280
|
data: dataProp,
|
|
6196
6281
|
dataVersion,
|
|
6197
6282
|
drawDistance,
|
|
@@ -6309,6 +6394,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
6309
6394
|
didAnchoredEndSpaceAnchorIndexChange,
|
|
6310
6395
|
numColumnsProp
|
|
6311
6396
|
]);
|
|
6397
|
+
useLayoutEffect(() => {
|
|
6398
|
+
const previousContentInsetEndAdjustment = previousContentInsetEndAdjustmentRef.current;
|
|
6399
|
+
previousContentInsetEndAdjustmentRef.current = contentInsetEndAdjustmentResolved;
|
|
6400
|
+
updateContentInsetEndAdjustment(ctx, previousContentInsetEndAdjustment);
|
|
6401
|
+
}, [ctx, contentInsetEndAdjustmentResolved]);
|
|
6312
6402
|
const onLayoutFooter = useCallback(
|
|
6313
6403
|
(layout) => {
|
|
6314
6404
|
if (!usesBootstrapInitialScroll) {
|
package/index.native.js
CHANGED
|
@@ -160,7 +160,10 @@ function useSelector$(signalName, selector) {
|
|
|
160
160
|
}
|
|
161
161
|
|
|
162
162
|
// src/state/getContentInsetEnd.ts
|
|
163
|
-
function
|
|
163
|
+
function getContentInsetEndAdjustmentEnd(adjustment) {
|
|
164
|
+
return Math.max(0, adjustment != null ? adjustment : 0);
|
|
165
|
+
}
|
|
166
|
+
function getContentInsetEnd(ctx, contentInsetEndAdjustmentOverride) {
|
|
164
167
|
var _a3, _b;
|
|
165
168
|
const state = ctx.state;
|
|
166
169
|
const { props } = state;
|
|
@@ -168,14 +171,21 @@ function getContentInsetEnd(ctx) {
|
|
|
168
171
|
const contentInset = props.contentInset;
|
|
169
172
|
const baseInset = contentInset != null ? contentInset : state.nativeContentInset;
|
|
170
173
|
const baseEndInset = (horizontal ? baseInset == null ? void 0 : baseInset.right : baseInset == null ? void 0 : baseInset.bottom) || 0;
|
|
174
|
+
const contentInsetEndAdjustment = getContentInsetEndAdjustmentEnd(
|
|
175
|
+
contentInsetEndAdjustmentOverride != null ? contentInsetEndAdjustmentOverride : props.contentInsetEndAdjustment
|
|
176
|
+
);
|
|
171
177
|
const anchoredEndSpaceSize = peek$(ctx, "anchoredEndSpaceSize");
|
|
172
178
|
const anchoredEndInset = ((_a3 = props.anchoredEndSpace) == null ? void 0 : _a3.includeInEndInset) && anchoredEndSpaceSize ? anchoredEndSpaceSize : 0;
|
|
173
179
|
const overrideInset = (_b = state.contentInsetOverride) != null ? _b : void 0;
|
|
180
|
+
const adjustedBaseEndInset = baseEndInset + contentInsetEndAdjustment;
|
|
174
181
|
if (overrideInset) {
|
|
175
182
|
const mergedInset = { bottom: 0, right: 0, ...baseInset, ...overrideInset };
|
|
176
|
-
return Math.max(
|
|
183
|
+
return Math.max(
|
|
184
|
+
((horizontal ? mergedInset.right : mergedInset.bottom) || 0) + contentInsetEndAdjustment,
|
|
185
|
+
anchoredEndInset
|
|
186
|
+
);
|
|
177
187
|
}
|
|
178
|
-
return Math.max(
|
|
188
|
+
return Math.max(adjustedBaseEndInset, anchoredEndInset);
|
|
179
189
|
}
|
|
180
190
|
|
|
181
191
|
// src/state/getContentSize.ts
|
|
@@ -667,6 +677,49 @@ function isInMVCPActiveMode(state) {
|
|
|
667
677
|
}
|
|
668
678
|
|
|
669
679
|
// src/components/Container.tsx
|
|
680
|
+
function getContainerPositionStyle({
|
|
681
|
+
columnWrapperStyle,
|
|
682
|
+
horizontal,
|
|
683
|
+
hasItemSeparator,
|
|
684
|
+
numColumns,
|
|
685
|
+
otherAxisPos,
|
|
686
|
+
otherAxisSize
|
|
687
|
+
}) {
|
|
688
|
+
let paddingStyles;
|
|
689
|
+
if (columnWrapperStyle) {
|
|
690
|
+
const { columnGap, rowGap, gap } = columnWrapperStyle;
|
|
691
|
+
if (horizontal) {
|
|
692
|
+
paddingStyles = {
|
|
693
|
+
paddingBottom: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0,
|
|
694
|
+
paddingRight: columnGap || gap || void 0,
|
|
695
|
+
paddingTop: numColumns > 1 ? (rowGap || gap || 0) / 2 : void 0
|
|
696
|
+
};
|
|
697
|
+
} else {
|
|
698
|
+
paddingStyles = {
|
|
699
|
+
paddingBottom: rowGap || gap || void 0,
|
|
700
|
+
paddingLeft: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0,
|
|
701
|
+
paddingRight: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
|
|
702
|
+
};
|
|
703
|
+
}
|
|
704
|
+
}
|
|
705
|
+
return horizontal ? {
|
|
706
|
+
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
707
|
+
flexDirection: hasItemSeparator ? "row" : void 0,
|
|
708
|
+
height: otherAxisSize,
|
|
709
|
+
left: 0,
|
|
710
|
+
position: "absolute",
|
|
711
|
+
top: otherAxisPos,
|
|
712
|
+
...paddingStyles || {}
|
|
713
|
+
} : {
|
|
714
|
+
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
715
|
+
left: otherAxisPos,
|
|
716
|
+
position: "absolute",
|
|
717
|
+
right: numColumns > 1 ? null : 0,
|
|
718
|
+
top: 0,
|
|
719
|
+
width: otherAxisSize,
|
|
720
|
+
...paddingStyles || {}
|
|
721
|
+
};
|
|
722
|
+
}
|
|
670
723
|
var Container = typedMemo(function Container2({
|
|
671
724
|
id,
|
|
672
725
|
recycleItems,
|
|
@@ -705,42 +758,17 @@ var Container = typedMemo(function Container2({
|
|
|
705
758
|
const resolvedSpan = Math.min(Math.max(span || 1, 1), numColumns);
|
|
706
759
|
const otherAxisPos = numColumns > 1 ? `${(resolvedColumn - 1) / numColumns * 100}%` : 0;
|
|
707
760
|
const otherAxisSize = numColumns > 1 ? `${resolvedSpan / numColumns * 100}%` : void 0;
|
|
708
|
-
const style = React2.useMemo(
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
paddingStyles = {
|
|
720
|
-
paddingBottom: rowGap || gap || void 0,
|
|
721
|
-
paddingLeft: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0,
|
|
722
|
-
paddingRight: numColumns > 1 ? (columnGap || gap || 0) / 2 : void 0
|
|
723
|
-
};
|
|
724
|
-
}
|
|
725
|
-
}
|
|
726
|
-
return horizontal ? {
|
|
727
|
-
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
728
|
-
flexDirection: ItemSeparatorComponent ? "row" : void 0,
|
|
729
|
-
height: otherAxisSize,
|
|
730
|
-
left: 0,
|
|
731
|
-
position: "absolute",
|
|
732
|
-
top: otherAxisPos,
|
|
733
|
-
...paddingStyles || {}
|
|
734
|
-
} : {
|
|
735
|
-
boxSizing: paddingStyles ? "border-box" : void 0,
|
|
736
|
-
left: otherAxisPos,
|
|
737
|
-
position: "absolute",
|
|
738
|
-
right: numColumns > 1 ? null : 0,
|
|
739
|
-
top: 0,
|
|
740
|
-
width: otherAxisSize,
|
|
741
|
-
...paddingStyles || {}
|
|
742
|
-
};
|
|
743
|
-
}, [horizontal, otherAxisPos, otherAxisSize, columnWrapperStyle, numColumns]);
|
|
761
|
+
const style = React2.useMemo(
|
|
762
|
+
() => getContainerPositionStyle({
|
|
763
|
+
columnWrapperStyle,
|
|
764
|
+
hasItemSeparator: !!ItemSeparatorComponent,
|
|
765
|
+
horizontal,
|
|
766
|
+
numColumns,
|
|
767
|
+
otherAxisPos,
|
|
768
|
+
otherAxisSize
|
|
769
|
+
}),
|
|
770
|
+
[horizontal, otherAxisPos, otherAxisSize, columnWrapperStyle, numColumns, ItemSeparatorComponent]
|
|
771
|
+
);
|
|
744
772
|
const renderedItemInfo = React2.useMemo(
|
|
745
773
|
() => itemKey !== void 0 ? getRenderedItem2(itemKey) : null,
|
|
746
774
|
[itemKey, data, extraData]
|
|
@@ -2698,6 +2726,15 @@ function abortBootstrapInitialScroll(ctx) {
|
|
|
2698
2726
|
}
|
|
2699
2727
|
|
|
2700
2728
|
// src/core/initialScrollLifecycle.ts
|
|
2729
|
+
function retargetActiveInitialScrollAtEnd(ctx) {
|
|
2730
|
+
var _a3;
|
|
2731
|
+
const state = ctx.state;
|
|
2732
|
+
const initialScroll = state.initialScroll;
|
|
2733
|
+
if (!initialScroll || state.didFinishInitialScroll || ((_a3 = state.initialScrollSession) == null ? void 0 : _a3.kind) === "offset" || initialScroll.viewPosition !== 1 || state.props.data.length === 0) {
|
|
2734
|
+
return false;
|
|
2735
|
+
}
|
|
2736
|
+
return advanceCurrentInitialScrollSession(ctx, { forceScroll: true });
|
|
2737
|
+
}
|
|
2701
2738
|
function handleInitialScrollLayoutReady(ctx) {
|
|
2702
2739
|
var _a3;
|
|
2703
2740
|
if (!ctx.state.initialScroll) {
|
|
@@ -4806,6 +4843,22 @@ function maybeUpdateAnchoredEndSpace(ctx) {
|
|
|
4806
4843
|
return nextSize;
|
|
4807
4844
|
}
|
|
4808
4845
|
|
|
4846
|
+
// src/core/updateContentInsetEndAdjustment.ts
|
|
4847
|
+
function updateContentInsetEndAdjustment(ctx, previousContentInsetEndAdjustment) {
|
|
4848
|
+
const state = ctx.state;
|
|
4849
|
+
const previousContentInsetEnd = getContentInsetEnd(ctx, previousContentInsetEndAdjustment);
|
|
4850
|
+
const nextContentInsetEnd = getContentInsetEnd(ctx);
|
|
4851
|
+
const insetDiff = nextContentInsetEnd - previousContentInsetEnd;
|
|
4852
|
+
if (insetDiff !== 0) {
|
|
4853
|
+
const wasWithinEndThreshold = !!peek$(ctx, "isWithinMaintainScrollAtEndThreshold");
|
|
4854
|
+
updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
|
|
4855
|
+
const didRetargetInitialScroll = retargetActiveInitialScrollAtEnd(ctx);
|
|
4856
|
+
if (!didRetargetInitialScroll && wasWithinEndThreshold && (Platform.OS !== "web" || insetDiff > 0)) {
|
|
4857
|
+
requestAdjust(ctx, insetDiff);
|
|
4858
|
+
}
|
|
4859
|
+
}
|
|
4860
|
+
}
|
|
4861
|
+
|
|
4809
4862
|
// src/core/updateItemSize.ts
|
|
4810
4863
|
function runOrScheduleMVCPRecalculate(ctx) {
|
|
4811
4864
|
const state = ctx.state;
|
|
@@ -5168,8 +5221,14 @@ function createImperativeHandle(ctx) {
|
|
|
5168
5221
|
startBuffered: state.startBuffered
|
|
5169
5222
|
}),
|
|
5170
5223
|
reportContentInset: (inset) => {
|
|
5224
|
+
var _a3, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
5225
|
+
const previousInset = state.contentInsetOverride;
|
|
5171
5226
|
state.contentInsetOverride = inset != null ? inset : void 0;
|
|
5227
|
+
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);
|
|
5172
5228
|
updateScroll(ctx, state.scroll, true, { markHasScrolled: false });
|
|
5229
|
+
if (didChange) {
|
|
5230
|
+
retargetActiveInitialScrollAtEnd(ctx);
|
|
5231
|
+
}
|
|
5173
5232
|
},
|
|
5174
5233
|
scrollIndexIntoView: (options) => runScrollWithPromise(() => scrollIndexIntoView(options)),
|
|
5175
5234
|
scrollItemIntoView: ({ item, ...props }) => runScrollWithPromise(() => {
|
|
@@ -5470,6 +5529,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
5470
5529
|
data: dataProp = [],
|
|
5471
5530
|
dataVersion,
|
|
5472
5531
|
drawDistance = 250,
|
|
5532
|
+
contentInsetEndAdjustment,
|
|
5473
5533
|
estimatedItemSize = 100,
|
|
5474
5534
|
estimatedListSize,
|
|
5475
5535
|
extraData,
|
|
@@ -5579,6 +5639,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
5579
5639
|
const combinedRef = useCombinedRef(refScroller, refScrollView);
|
|
5580
5640
|
const keyExtractor = keyExtractorProp != null ? keyExtractorProp : ((_item, index) => index.toString());
|
|
5581
5641
|
const stickyHeaderIndices = stickyHeaderIndicesProp != null ? stickyHeaderIndicesProp : stickyIndicesDeprecated;
|
|
5642
|
+
const contentInsetEndAdjustmentResolved = Platform.OS === "web" ? contentInsetEndAdjustment : void 0;
|
|
5643
|
+
const previousContentInsetEndAdjustmentRef = React2.useRef(contentInsetEndAdjustmentResolved);
|
|
5582
5644
|
const alwaysRenderIndices = React2.useMemo(() => {
|
|
5583
5645
|
const indices = getAlwaysRenderIndices(alwaysRender, dataProp, keyExtractor, anchoredEndSpace == null ? void 0 : anchoredEndSpace.anchorIndex);
|
|
5584
5646
|
return { arr: indices, set: new Set(indices) };
|
|
@@ -5698,6 +5760,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
5698
5760
|
anchoredEndSpace: anchoredEndSpaceResolved,
|
|
5699
5761
|
animatedProps: animatedPropsInternal,
|
|
5700
5762
|
contentInset,
|
|
5763
|
+
contentInsetEndAdjustment: contentInsetEndAdjustmentResolved,
|
|
5701
5764
|
data: dataProp,
|
|
5702
5765
|
dataVersion,
|
|
5703
5766
|
drawDistance,
|
|
@@ -5820,6 +5883,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
5820
5883
|
didAnchoredEndSpaceAnchorIndexChange,
|
|
5821
5884
|
numColumnsProp
|
|
5822
5885
|
]);
|
|
5886
|
+
React2.useLayoutEffect(() => {
|
|
5887
|
+
const previousContentInsetEndAdjustment = previousContentInsetEndAdjustmentRef.current;
|
|
5888
|
+
previousContentInsetEndAdjustmentRef.current = contentInsetEndAdjustmentResolved;
|
|
5889
|
+
updateContentInsetEndAdjustment(ctx, previousContentInsetEndAdjustment);
|
|
5890
|
+
}, [ctx, contentInsetEndAdjustmentResolved]);
|
|
5823
5891
|
const onLayoutFooter = React2.useCallback(
|
|
5824
5892
|
(layout) => {
|
|
5825
5893
|
if (!usesBootstrapInitialScroll) {
|