@legendapp/list 0.6.3 → 0.6.4
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/index.d.mts +8 -4
- package/index.d.ts +8 -4
- package/index.js +64 -55
- package/index.mjs +65 -56
- package/package.json +1 -1
- package/reanimated.d.mts +1 -1
- package/reanimated.d.ts +1 -1
package/index.d.mts
CHANGED
|
@@ -29,6 +29,7 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
|
|
|
29
29
|
maintainVisibleContentPosition?: boolean;
|
|
30
30
|
numColumns?: number;
|
|
31
31
|
refScrollView?: React.Ref<ScrollView>;
|
|
32
|
+
waitForInitialLayout?: boolean;
|
|
32
33
|
estimatedItemSize?: number;
|
|
33
34
|
getEstimatedItemSize?: (index: number, item: ItemT) => number;
|
|
34
35
|
onStartReached?: ((info: {
|
|
@@ -49,6 +50,13 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
|
|
|
49
50
|
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
50
51
|
viewabilityConfig?: ViewabilityConfig;
|
|
51
52
|
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
53
|
+
onItemSizeChanged?: (info: {
|
|
54
|
+
size: number;
|
|
55
|
+
previous: number;
|
|
56
|
+
index: number;
|
|
57
|
+
itemKey: string;
|
|
58
|
+
itemData: ItemT;
|
|
59
|
+
}) => void;
|
|
52
60
|
};
|
|
53
61
|
type LegendListProps<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof ScrollView>>;
|
|
54
62
|
interface InternalState {
|
|
@@ -89,10 +97,6 @@ interface InternalState {
|
|
|
89
97
|
timeoutSizeMessage: any;
|
|
90
98
|
nativeMarginTop: number;
|
|
91
99
|
indexByKey: Map<string, number>;
|
|
92
|
-
contentSize: {
|
|
93
|
-
width: number;
|
|
94
|
-
height: number;
|
|
95
|
-
};
|
|
96
100
|
viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
|
|
97
101
|
renderItem: (props: LegendListRenderItemProps<any>) => ReactNode;
|
|
98
102
|
scrollHistory: Array<{
|
package/index.d.ts
CHANGED
|
@@ -29,6 +29,7 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
|
|
|
29
29
|
maintainVisibleContentPosition?: boolean;
|
|
30
30
|
numColumns?: number;
|
|
31
31
|
refScrollView?: React.Ref<ScrollView>;
|
|
32
|
+
waitForInitialLayout?: boolean;
|
|
32
33
|
estimatedItemSize?: number;
|
|
33
34
|
getEstimatedItemSize?: (index: number, item: ItemT) => number;
|
|
34
35
|
onStartReached?: ((info: {
|
|
@@ -49,6 +50,13 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
|
|
|
49
50
|
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
50
51
|
viewabilityConfig?: ViewabilityConfig;
|
|
51
52
|
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
53
|
+
onItemSizeChanged?: (info: {
|
|
54
|
+
size: number;
|
|
55
|
+
previous: number;
|
|
56
|
+
index: number;
|
|
57
|
+
itemKey: string;
|
|
58
|
+
itemData: ItemT;
|
|
59
|
+
}) => void;
|
|
52
60
|
};
|
|
53
61
|
type LegendListProps<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof ScrollView>>;
|
|
54
62
|
interface InternalState {
|
|
@@ -89,10 +97,6 @@ interface InternalState {
|
|
|
89
97
|
timeoutSizeMessage: any;
|
|
90
98
|
nativeMarginTop: number;
|
|
91
99
|
indexByKey: Map<string, number>;
|
|
92
|
-
contentSize: {
|
|
93
|
-
width: number;
|
|
94
|
-
height: number;
|
|
95
|
-
};
|
|
96
100
|
viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs | undefined;
|
|
97
101
|
renderItem: (props: LegendListRenderItemProps<any>) => ReactNode;
|
|
98
102
|
scrollHistory: Array<{
|
package/index.js
CHANGED
|
@@ -77,10 +77,13 @@ function set$(ctx, signalName, value) {
|
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
+
|
|
81
|
+
// src/Container.tsx
|
|
80
82
|
var Container = ({
|
|
81
83
|
id,
|
|
82
84
|
recycleItems,
|
|
83
85
|
horizontal,
|
|
86
|
+
waitForInitialLayout,
|
|
84
87
|
getRenderedItem,
|
|
85
88
|
updateItemSize,
|
|
86
89
|
ItemSeparatorComponent
|
|
@@ -88,11 +91,10 @@ var Container = ({
|
|
|
88
91
|
const ctx = useStateContext();
|
|
89
92
|
const position = use$(`containerPosition${id}`);
|
|
90
93
|
const column = use$(`containerColumn${id}`) || 0;
|
|
91
|
-
const visible = use$(`containerDidLayout${id}`);
|
|
92
94
|
const numColumns = use$("numColumns");
|
|
93
95
|
const otherAxisPos = numColumns > 1 ? `${(column - 1) / numColumns * 100}%` : 0;
|
|
94
96
|
const otherAxisSize = numColumns > 1 ? `${1 / numColumns * 100}%` : void 0;
|
|
95
|
-
|
|
97
|
+
const style = horizontal ? {
|
|
96
98
|
flexDirection: "row",
|
|
97
99
|
position: "absolute",
|
|
98
100
|
top: otherAxisPos,
|
|
@@ -106,7 +108,8 @@ var Container = ({
|
|
|
106
108
|
width: otherAxisSize,
|
|
107
109
|
top: position
|
|
108
110
|
};
|
|
109
|
-
{
|
|
111
|
+
if (waitForInitialLayout) {
|
|
112
|
+
const visible = use$(`containerDidLayout${id}`);
|
|
110
113
|
style.opacity = visible ? 1 : 0;
|
|
111
114
|
}
|
|
112
115
|
const lastItemKey = use$("lastItemKey");
|
|
@@ -146,6 +149,7 @@ var Containers = React4__namespace.memo(function Containers2({
|
|
|
146
149
|
horizontal,
|
|
147
150
|
recycleItems,
|
|
148
151
|
ItemSeparatorComponent,
|
|
152
|
+
waitForInitialLayout,
|
|
149
153
|
updateItemSize,
|
|
150
154
|
getRenderedItem
|
|
151
155
|
}) {
|
|
@@ -161,6 +165,7 @@ var Containers = React4__namespace.memo(function Containers2({
|
|
|
161
165
|
key: i,
|
|
162
166
|
recycleItems,
|
|
163
167
|
horizontal,
|
|
168
|
+
waitForInitialLayout,
|
|
164
169
|
getRenderedItem,
|
|
165
170
|
updateItemSize,
|
|
166
171
|
ItemSeparatorComponent
|
|
@@ -190,6 +195,7 @@ var ListComponent = React4__namespace.memo(function ListComponent2({
|
|
|
190
195
|
recycleItems,
|
|
191
196
|
ItemSeparatorComponent,
|
|
192
197
|
alignItemsAtEnd,
|
|
198
|
+
waitForInitialLayout,
|
|
193
199
|
handleScroll,
|
|
194
200
|
onLayout,
|
|
195
201
|
ListHeaderComponent,
|
|
@@ -247,6 +253,7 @@ var ListComponent = React4__namespace.memo(function ListComponent2({
|
|
|
247
253
|
{
|
|
248
254
|
horizontal,
|
|
249
255
|
recycleItems,
|
|
256
|
+
waitForInitialLayout,
|
|
250
257
|
getRenderedItem,
|
|
251
258
|
ItemSeparatorComponent: ItemSeparatorComponent && getComponent(ItemSeparatorComponent),
|
|
252
259
|
updateItemSize
|
|
@@ -480,6 +487,8 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
480
487
|
onEndReached,
|
|
481
488
|
onStartReached,
|
|
482
489
|
ListEmptyComponent,
|
|
490
|
+
onItemSizeChanged,
|
|
491
|
+
scrollEventThrottle,
|
|
483
492
|
refScrollView,
|
|
484
493
|
...rest
|
|
485
494
|
} = props;
|
|
@@ -557,7 +566,6 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
557
566
|
indexByKey: /* @__PURE__ */ new Map(),
|
|
558
567
|
scrollHistory: [],
|
|
559
568
|
scrollVelocity: 0,
|
|
560
|
-
contentSize: { width: 0, height: 0 },
|
|
561
569
|
sizesLaidOut: __DEV__ ? /* @__PURE__ */ new Map() : void 0,
|
|
562
570
|
timeoutSizeMessage: 0,
|
|
563
571
|
scrollTimer: void 0,
|
|
@@ -619,21 +627,18 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
619
627
|
state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
|
|
620
628
|
state.rowHeights.clear();
|
|
621
629
|
}
|
|
622
|
-
const
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
}
|
|
635
|
-
};
|
|
636
|
-
doAdd();
|
|
630
|
+
const totalSize = state.totalSize;
|
|
631
|
+
let resultSize = totalSize;
|
|
632
|
+
if (applyAdjustValue !== void 0) {
|
|
633
|
+
resultSize -= applyAdjustValue;
|
|
634
|
+
refState.current.scrollAdjustHandler.requestAdjust(applyAdjustValue, (diff) => {
|
|
635
|
+
state.scroll -= diff;
|
|
636
|
+
});
|
|
637
|
+
}
|
|
638
|
+
set$(ctx, "totalSize", resultSize);
|
|
639
|
+
if (alignItemsAtEnd) {
|
|
640
|
+
doUpdatePaddingTop();
|
|
641
|
+
}
|
|
637
642
|
}, []);
|
|
638
643
|
const getRowHeight = (n) => {
|
|
639
644
|
const { rowHeights } = refState.current;
|
|
@@ -936,25 +941,25 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
936
941
|
}
|
|
937
942
|
};
|
|
938
943
|
const doMaintainScrollAtEnd = (animated) => {
|
|
939
|
-
|
|
940
|
-
if ((
|
|
941
|
-
|
|
944
|
+
const state = refState.current;
|
|
945
|
+
if ((state == null ? void 0 : state.isAtBottom) && maintainScrollAtEnd) {
|
|
946
|
+
state.scroll = state.totalSize - state.scrollLength + peek$(ctx, "paddingTop");
|
|
942
947
|
requestAnimationFrame(() => {
|
|
943
|
-
var
|
|
944
|
-
(
|
|
948
|
+
var _a2;
|
|
949
|
+
(_a2 = refScroller.current) == null ? void 0 : _a2.scrollToEnd({
|
|
945
950
|
animated
|
|
946
951
|
});
|
|
947
952
|
});
|
|
953
|
+
return true;
|
|
948
954
|
}
|
|
949
955
|
};
|
|
950
956
|
const checkAtBottom = () => {
|
|
951
957
|
if (!refState.current) {
|
|
952
958
|
return;
|
|
953
959
|
}
|
|
954
|
-
const { scrollLength, scroll,
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
const distanceFromEnd = contentLength - scroll - scrollLength;
|
|
960
|
+
const { scrollLength, scroll, totalSize } = refState.current;
|
|
961
|
+
if (totalSize > 0) {
|
|
962
|
+
const distanceFromEnd = totalSize - scroll - scrollLength;
|
|
958
963
|
if (refState.current) {
|
|
959
964
|
refState.current.isAtBottom = distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
|
|
960
965
|
}
|
|
@@ -996,29 +1001,31 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
996
1001
|
}
|
|
997
1002
|
}
|
|
998
1003
|
};
|
|
999
|
-
const
|
|
1004
|
+
const checkResetContainers = (reset) => {
|
|
1000
1005
|
const state = refState.current;
|
|
1001
1006
|
if (state) {
|
|
1002
|
-
if (data.length > state.data.length) {
|
|
1003
|
-
state.isEndReached = false;
|
|
1004
|
-
}
|
|
1005
|
-
refState.current.scrollForNextCalculateItemsInView = void 0;
|
|
1006
1007
|
state.data = data;
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
const
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1008
|
+
if (reset) {
|
|
1009
|
+
refState.current.scrollForNextCalculateItemsInView = void 0;
|
|
1010
|
+
const numContainers = peek$(ctx, "numContainers");
|
|
1011
|
+
for (let i = 0; i < numContainers; i++) {
|
|
1012
|
+
const itemKey = peek$(ctx, `containerItemKey${i}`);
|
|
1013
|
+
if (!keyExtractorProp || itemKey && state.indexByKey.get(itemKey) === void 0) {
|
|
1014
|
+
set$(ctx, `containerItemKey${i}`, void 0);
|
|
1015
|
+
set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
|
|
1016
|
+
set$(ctx, `containerColumn${i}`, -1);
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
if (!keyExtractorProp) {
|
|
1020
|
+
state.sizes.clear();
|
|
1021
|
+
state.positions;
|
|
1014
1022
|
}
|
|
1023
|
+
calculateItemsInView(state.scrollVelocity);
|
|
1015
1024
|
}
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
state.
|
|
1025
|
+
const didMaintainScrollAtEnd = doMaintainScrollAtEnd(false);
|
|
1026
|
+
if (!didMaintainScrollAtEnd && data.length > state.data.length) {
|
|
1027
|
+
state.isEndReached = false;
|
|
1019
1028
|
}
|
|
1020
|
-
calculateItemsInView(state.scrollVelocity);
|
|
1021
|
-
doMaintainScrollAtEnd(false);
|
|
1022
1029
|
checkAtTop();
|
|
1023
1030
|
checkAtBottom();
|
|
1024
1031
|
}
|
|
@@ -1058,9 +1065,10 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
1058
1065
|
addTotalSize(null, totalSize, totalSizeBelowIndex);
|
|
1059
1066
|
}
|
|
1060
1067
|
React4.useEffect(() => {
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1068
|
+
checkResetContainers(
|
|
1069
|
+
/*reset*/
|
|
1070
|
+
!isFirst
|
|
1071
|
+
);
|
|
1064
1072
|
}, [isFirst, data, numColumnsProp]);
|
|
1065
1073
|
refState.current.renderItem = renderItem;
|
|
1066
1074
|
const lastItemKey = getId(data[data.length - 1]);
|
|
@@ -1250,6 +1258,9 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
1250
1258
|
calculateItemsInView(state.scrollVelocity);
|
|
1251
1259
|
}
|
|
1252
1260
|
}
|
|
1261
|
+
if (onItemSizeChanged) {
|
|
1262
|
+
onItemSizeChanged({ size, previous: prevSize, index, itemKey, itemData: data2[index] });
|
|
1263
|
+
}
|
|
1253
1264
|
} else {
|
|
1254
1265
|
set$(ctx, `containerDidLayout${containerId}`, true);
|
|
1255
1266
|
}
|
|
@@ -1262,12 +1273,10 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
1262
1273
|
const onLayout = React4.useCallback((event) => {
|
|
1263
1274
|
const scrollLength = event.nativeEvent.layout[horizontal ? "width" : "height"];
|
|
1264
1275
|
refState.current.scrollLength = scrollLength;
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
checkAtTop();
|
|
1270
|
-
}
|
|
1276
|
+
doMaintainScrollAtEnd(false);
|
|
1277
|
+
doUpdatePaddingTop();
|
|
1278
|
+
checkAtBottom();
|
|
1279
|
+
checkAtTop();
|
|
1271
1280
|
if (__DEV__) {
|
|
1272
1281
|
const isWidthZero = event.nativeEvent.layout.width === 0;
|
|
1273
1282
|
const isHeightZero = event.nativeEvent.layout.height === 0;
|
|
@@ -1286,7 +1295,6 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
1286
1295
|
}
|
|
1287
1296
|
const state = refState.current;
|
|
1288
1297
|
state.hasScrolled = true;
|
|
1289
|
-
state.contentSize = event.nativeEvent.contentSize;
|
|
1290
1298
|
const currentTime = performance.now();
|
|
1291
1299
|
const newScroll = event.nativeEvent.contentOffset[horizontal ? "x" : "y"];
|
|
1292
1300
|
if (!(state.scrollHistory.length === 0 && newScroll === initialContentOffset)) {
|
|
@@ -1374,6 +1382,7 @@ var LegendListInner = React4.forwardRef(function LegendListInner2(props, forward
|
|
|
1374
1382
|
alignItemsAtEnd,
|
|
1375
1383
|
ListEmptyComponent: data.length === 0 ? ListEmptyComponent : void 0,
|
|
1376
1384
|
maintainVisibleContentPosition,
|
|
1385
|
+
scrollEventThrottle: scrollEventThrottle != null ? scrollEventThrottle : reactNative.Platform.OS === "web" ? 16 : void 0,
|
|
1377
1386
|
style
|
|
1378
1387
|
}
|
|
1379
1388
|
);
|
package/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React4 from 'react';
|
|
2
2
|
import React4__default, { forwardRef, useRef, useMemo, useCallback, useEffect, useImperativeHandle, useSyncExternalStore, useState } from 'react';
|
|
3
|
-
import { Animated, ScrollView, View, Dimensions, StyleSheet, useAnimatedValue as useAnimatedValue$1 } from 'react-native';
|
|
3
|
+
import { Animated, ScrollView, View, Dimensions, StyleSheet, Platform, useAnimatedValue as useAnimatedValue$1 } from 'react-native';
|
|
4
4
|
|
|
5
5
|
// src/LegendList.tsx
|
|
6
6
|
var ContextState = React4.createContext(null);
|
|
@@ -56,10 +56,13 @@ function set$(ctx, signalName, value) {
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
|
+
|
|
60
|
+
// src/Container.tsx
|
|
59
61
|
var Container = ({
|
|
60
62
|
id,
|
|
61
63
|
recycleItems,
|
|
62
64
|
horizontal,
|
|
65
|
+
waitForInitialLayout,
|
|
63
66
|
getRenderedItem,
|
|
64
67
|
updateItemSize,
|
|
65
68
|
ItemSeparatorComponent
|
|
@@ -67,11 +70,10 @@ var Container = ({
|
|
|
67
70
|
const ctx = useStateContext();
|
|
68
71
|
const position = use$(`containerPosition${id}`);
|
|
69
72
|
const column = use$(`containerColumn${id}`) || 0;
|
|
70
|
-
const visible = use$(`containerDidLayout${id}`);
|
|
71
73
|
const numColumns = use$("numColumns");
|
|
72
74
|
const otherAxisPos = numColumns > 1 ? `${(column - 1) / numColumns * 100}%` : 0;
|
|
73
75
|
const otherAxisSize = numColumns > 1 ? `${1 / numColumns * 100}%` : void 0;
|
|
74
|
-
|
|
76
|
+
const style = horizontal ? {
|
|
75
77
|
flexDirection: "row",
|
|
76
78
|
position: "absolute",
|
|
77
79
|
top: otherAxisPos,
|
|
@@ -85,7 +87,8 @@ var Container = ({
|
|
|
85
87
|
width: otherAxisSize,
|
|
86
88
|
top: position
|
|
87
89
|
};
|
|
88
|
-
{
|
|
90
|
+
if (waitForInitialLayout) {
|
|
91
|
+
const visible = use$(`containerDidLayout${id}`);
|
|
89
92
|
style.opacity = visible ? 1 : 0;
|
|
90
93
|
}
|
|
91
94
|
const lastItemKey = use$("lastItemKey");
|
|
@@ -125,6 +128,7 @@ var Containers = React4.memo(function Containers2({
|
|
|
125
128
|
horizontal,
|
|
126
129
|
recycleItems,
|
|
127
130
|
ItemSeparatorComponent,
|
|
131
|
+
waitForInitialLayout,
|
|
128
132
|
updateItemSize,
|
|
129
133
|
getRenderedItem
|
|
130
134
|
}) {
|
|
@@ -140,6 +144,7 @@ var Containers = React4.memo(function Containers2({
|
|
|
140
144
|
key: i,
|
|
141
145
|
recycleItems,
|
|
142
146
|
horizontal,
|
|
147
|
+
waitForInitialLayout,
|
|
143
148
|
getRenderedItem,
|
|
144
149
|
updateItemSize,
|
|
145
150
|
ItemSeparatorComponent
|
|
@@ -169,6 +174,7 @@ var ListComponent = React4.memo(function ListComponent2({
|
|
|
169
174
|
recycleItems,
|
|
170
175
|
ItemSeparatorComponent,
|
|
171
176
|
alignItemsAtEnd,
|
|
177
|
+
waitForInitialLayout,
|
|
172
178
|
handleScroll,
|
|
173
179
|
onLayout,
|
|
174
180
|
ListHeaderComponent,
|
|
@@ -226,6 +232,7 @@ var ListComponent = React4.memo(function ListComponent2({
|
|
|
226
232
|
{
|
|
227
233
|
horizontal,
|
|
228
234
|
recycleItems,
|
|
235
|
+
waitForInitialLayout,
|
|
229
236
|
getRenderedItem,
|
|
230
237
|
ItemSeparatorComponent: ItemSeparatorComponent && getComponent(ItemSeparatorComponent),
|
|
231
238
|
updateItemSize
|
|
@@ -459,6 +466,8 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
459
466
|
onEndReached,
|
|
460
467
|
onStartReached,
|
|
461
468
|
ListEmptyComponent,
|
|
469
|
+
onItemSizeChanged,
|
|
470
|
+
scrollEventThrottle,
|
|
462
471
|
refScrollView,
|
|
463
472
|
...rest
|
|
464
473
|
} = props;
|
|
@@ -536,7 +545,6 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
536
545
|
indexByKey: /* @__PURE__ */ new Map(),
|
|
537
546
|
scrollHistory: [],
|
|
538
547
|
scrollVelocity: 0,
|
|
539
|
-
contentSize: { width: 0, height: 0 },
|
|
540
548
|
sizesLaidOut: __DEV__ ? /* @__PURE__ */ new Map() : void 0,
|
|
541
549
|
timeoutSizeMessage: 0,
|
|
542
550
|
scrollTimer: void 0,
|
|
@@ -598,21 +606,18 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
598
606
|
state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
|
|
599
607
|
state.rowHeights.clear();
|
|
600
608
|
}
|
|
601
|
-
const
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
}
|
|
614
|
-
};
|
|
615
|
-
doAdd();
|
|
609
|
+
const totalSize = state.totalSize;
|
|
610
|
+
let resultSize = totalSize;
|
|
611
|
+
if (applyAdjustValue !== void 0) {
|
|
612
|
+
resultSize -= applyAdjustValue;
|
|
613
|
+
refState.current.scrollAdjustHandler.requestAdjust(applyAdjustValue, (diff) => {
|
|
614
|
+
state.scroll -= diff;
|
|
615
|
+
});
|
|
616
|
+
}
|
|
617
|
+
set$(ctx, "totalSize", resultSize);
|
|
618
|
+
if (alignItemsAtEnd) {
|
|
619
|
+
doUpdatePaddingTop();
|
|
620
|
+
}
|
|
616
621
|
}, []);
|
|
617
622
|
const getRowHeight = (n) => {
|
|
618
623
|
const { rowHeights } = refState.current;
|
|
@@ -915,25 +920,25 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
915
920
|
}
|
|
916
921
|
};
|
|
917
922
|
const doMaintainScrollAtEnd = (animated) => {
|
|
918
|
-
|
|
919
|
-
if ((
|
|
920
|
-
|
|
923
|
+
const state = refState.current;
|
|
924
|
+
if ((state == null ? void 0 : state.isAtBottom) && maintainScrollAtEnd) {
|
|
925
|
+
state.scroll = state.totalSize - state.scrollLength + peek$(ctx, "paddingTop");
|
|
921
926
|
requestAnimationFrame(() => {
|
|
922
|
-
var
|
|
923
|
-
(
|
|
927
|
+
var _a2;
|
|
928
|
+
(_a2 = refScroller.current) == null ? void 0 : _a2.scrollToEnd({
|
|
924
929
|
animated
|
|
925
930
|
});
|
|
926
931
|
});
|
|
932
|
+
return true;
|
|
927
933
|
}
|
|
928
934
|
};
|
|
929
935
|
const checkAtBottom = () => {
|
|
930
936
|
if (!refState.current) {
|
|
931
937
|
return;
|
|
932
938
|
}
|
|
933
|
-
const { scrollLength, scroll,
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
const distanceFromEnd = contentLength - scroll - scrollLength;
|
|
939
|
+
const { scrollLength, scroll, totalSize } = refState.current;
|
|
940
|
+
if (totalSize > 0) {
|
|
941
|
+
const distanceFromEnd = totalSize - scroll - scrollLength;
|
|
937
942
|
if (refState.current) {
|
|
938
943
|
refState.current.isAtBottom = distanceFromEnd < scrollLength * maintainScrollAtEndThreshold;
|
|
939
944
|
}
|
|
@@ -975,29 +980,31 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
975
980
|
}
|
|
976
981
|
}
|
|
977
982
|
};
|
|
978
|
-
const
|
|
983
|
+
const checkResetContainers = (reset) => {
|
|
979
984
|
const state = refState.current;
|
|
980
985
|
if (state) {
|
|
981
|
-
if (data.length > state.data.length) {
|
|
982
|
-
state.isEndReached = false;
|
|
983
|
-
}
|
|
984
|
-
refState.current.scrollForNextCalculateItemsInView = void 0;
|
|
985
986
|
state.data = data;
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
const
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
987
|
+
if (reset) {
|
|
988
|
+
refState.current.scrollForNextCalculateItemsInView = void 0;
|
|
989
|
+
const numContainers = peek$(ctx, "numContainers");
|
|
990
|
+
for (let i = 0; i < numContainers; i++) {
|
|
991
|
+
const itemKey = peek$(ctx, `containerItemKey${i}`);
|
|
992
|
+
if (!keyExtractorProp || itemKey && state.indexByKey.get(itemKey) === void 0) {
|
|
993
|
+
set$(ctx, `containerItemKey${i}`, void 0);
|
|
994
|
+
set$(ctx, `containerPosition${i}`, POSITION_OUT_OF_VIEW);
|
|
995
|
+
set$(ctx, `containerColumn${i}`, -1);
|
|
996
|
+
}
|
|
997
|
+
}
|
|
998
|
+
if (!keyExtractorProp) {
|
|
999
|
+
state.sizes.clear();
|
|
1000
|
+
state.positions;
|
|
993
1001
|
}
|
|
1002
|
+
calculateItemsInView(state.scrollVelocity);
|
|
994
1003
|
}
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
state.
|
|
1004
|
+
const didMaintainScrollAtEnd = doMaintainScrollAtEnd(false);
|
|
1005
|
+
if (!didMaintainScrollAtEnd && data.length > state.data.length) {
|
|
1006
|
+
state.isEndReached = false;
|
|
998
1007
|
}
|
|
999
|
-
calculateItemsInView(state.scrollVelocity);
|
|
1000
|
-
doMaintainScrollAtEnd(false);
|
|
1001
1008
|
checkAtTop();
|
|
1002
1009
|
checkAtBottom();
|
|
1003
1010
|
}
|
|
@@ -1037,9 +1044,10 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
1037
1044
|
addTotalSize(null, totalSize, totalSizeBelowIndex);
|
|
1038
1045
|
}
|
|
1039
1046
|
useEffect(() => {
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1047
|
+
checkResetContainers(
|
|
1048
|
+
/*reset*/
|
|
1049
|
+
!isFirst
|
|
1050
|
+
);
|
|
1043
1051
|
}, [isFirst, data, numColumnsProp]);
|
|
1044
1052
|
refState.current.renderItem = renderItem;
|
|
1045
1053
|
const lastItemKey = getId(data[data.length - 1]);
|
|
@@ -1229,6 +1237,9 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
1229
1237
|
calculateItemsInView(state.scrollVelocity);
|
|
1230
1238
|
}
|
|
1231
1239
|
}
|
|
1240
|
+
if (onItemSizeChanged) {
|
|
1241
|
+
onItemSizeChanged({ size, previous: prevSize, index, itemKey, itemData: data2[index] });
|
|
1242
|
+
}
|
|
1232
1243
|
} else {
|
|
1233
1244
|
set$(ctx, `containerDidLayout${containerId}`, true);
|
|
1234
1245
|
}
|
|
@@ -1241,12 +1252,10 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
1241
1252
|
const onLayout = useCallback((event) => {
|
|
1242
1253
|
const scrollLength = event.nativeEvent.layout[horizontal ? "width" : "height"];
|
|
1243
1254
|
refState.current.scrollLength = scrollLength;
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
checkAtTop();
|
|
1249
|
-
}
|
|
1255
|
+
doMaintainScrollAtEnd(false);
|
|
1256
|
+
doUpdatePaddingTop();
|
|
1257
|
+
checkAtBottom();
|
|
1258
|
+
checkAtTop();
|
|
1250
1259
|
if (__DEV__) {
|
|
1251
1260
|
const isWidthZero = event.nativeEvent.layout.width === 0;
|
|
1252
1261
|
const isHeightZero = event.nativeEvent.layout.height === 0;
|
|
@@ -1265,7 +1274,6 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
1265
1274
|
}
|
|
1266
1275
|
const state = refState.current;
|
|
1267
1276
|
state.hasScrolled = true;
|
|
1268
|
-
state.contentSize = event.nativeEvent.contentSize;
|
|
1269
1277
|
const currentTime = performance.now();
|
|
1270
1278
|
const newScroll = event.nativeEvent.contentOffset[horizontal ? "x" : "y"];
|
|
1271
1279
|
if (!(state.scrollHistory.length === 0 && newScroll === initialContentOffset)) {
|
|
@@ -1353,6 +1361,7 @@ var LegendListInner = forwardRef(function LegendListInner2(props, forwardedRef)
|
|
|
1353
1361
|
alignItemsAtEnd,
|
|
1354
1362
|
ListEmptyComponent: data.length === 0 ? ListEmptyComponent : void 0,
|
|
1355
1363
|
maintainVisibleContentPosition,
|
|
1364
|
+
scrollEventThrottle: scrollEventThrottle != null ? scrollEventThrottle : Platform.OS === "web" ? 16 : void 0,
|
|
1356
1365
|
style
|
|
1357
1366
|
}
|
|
1358
1367
|
);
|
package/package.json
CHANGED
package/reanimated.d.mts
CHANGED
|
@@ -2,7 +2,7 @@ import { LegendListRef, LegendListPropsBase } from '@legendapp/list';
|
|
|
2
2
|
import React__default, { ComponentProps } from 'react';
|
|
3
3
|
import Animated from 'react-native-reanimated';
|
|
4
4
|
|
|
5
|
-
type KeysToOmit = "getEstimatedItemSize" | "keyExtractor" | "animatedProps" | "renderItem";
|
|
5
|
+
type KeysToOmit = "getEstimatedItemSize" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged";
|
|
6
6
|
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Animated.ScrollView>>;
|
|
7
7
|
interface AnimatedLegendListProps<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
8
8
|
refScrollView?: React__default.Ref<Animated.ScrollView>;
|
package/reanimated.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { LegendListRef, LegendListPropsBase } from '@legendapp/list';
|
|
|
2
2
|
import React__default, { ComponentProps } from 'react';
|
|
3
3
|
import Animated from 'react-native-reanimated';
|
|
4
4
|
|
|
5
|
-
type KeysToOmit = "getEstimatedItemSize" | "keyExtractor" | "animatedProps" | "renderItem";
|
|
5
|
+
type KeysToOmit = "getEstimatedItemSize" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged";
|
|
6
6
|
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Animated.ScrollView>>;
|
|
7
7
|
interface AnimatedLegendListProps<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
8
8
|
refScrollView?: React__default.Ref<Animated.ScrollView>;
|