@legendapp/list 1.0.0-beta.26 → 1.0.0-beta.27
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/README.md +93 -37
- package/animated.d.mts +30 -30
- package/animated.d.ts +30 -30
- package/index.d.mts +231 -70
- package/index.d.ts +231 -70
- package/index.js +94 -51
- package/index.mjs +94 -51
- package/package.json +1 -1
package/index.d.ts
CHANGED
|
@@ -10,52 +10,132 @@ declare class ScrollAdjustHandler {
|
|
|
10
10
|
private busy;
|
|
11
11
|
private context;
|
|
12
12
|
private isPaused;
|
|
13
|
+
private isDisabled;
|
|
13
14
|
constructor(ctx: any);
|
|
14
15
|
private doAjdust;
|
|
15
16
|
requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
|
|
16
17
|
getAppliedAdjust(): number;
|
|
17
18
|
pauseAdjust(): void;
|
|
19
|
+
setDisableAdjust(disable: boolean): void;
|
|
18
20
|
unPauseAdjust(): boolean;
|
|
19
21
|
}
|
|
20
22
|
|
|
21
23
|
type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
|
|
24
|
+
/**
|
|
25
|
+
* If true, aligns items at the end of the list.
|
|
26
|
+
* @default false
|
|
27
|
+
*/
|
|
28
|
+
alignItemsAtEnd?: boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Style applied to each column's wrapper view.
|
|
31
|
+
*/
|
|
32
|
+
columnWrapperStyle?: ColumnWrapperStyle;
|
|
33
|
+
/**
|
|
34
|
+
* Array of items to render in the list.
|
|
35
|
+
* @required
|
|
36
|
+
*/
|
|
22
37
|
data: ReadonlyArray<ItemT>;
|
|
38
|
+
/**
|
|
39
|
+
* Distance in pixels to pre-render items ahead of the visible area.
|
|
40
|
+
* @default 250
|
|
41
|
+
*/
|
|
42
|
+
drawDistance?: number;
|
|
43
|
+
/**
|
|
44
|
+
* Estimated size of each item in pixels; sufficient for most cases. If
|
|
45
|
+
* you leave this blank, a warning should appear and you will get
|
|
46
|
+
* a suggested size.
|
|
47
|
+
* @required
|
|
48
|
+
* @default undefined
|
|
49
|
+
*/
|
|
50
|
+
estimatedItemSize?: number;
|
|
51
|
+
/**
|
|
52
|
+
* Extra data to trigger re-rendering when changed.
|
|
53
|
+
*/
|
|
54
|
+
extraData?: any;
|
|
55
|
+
/**
|
|
56
|
+
* In case you have distinct item sizes, you can provide a function to get the size of an item.
|
|
57
|
+
* Use instead of FlatList's getItemLayout or FlashList overrideItemLayout if you want to have accurate initialScrollOffset, you should provide this function
|
|
58
|
+
*/
|
|
59
|
+
getEstimatedItemSize?: (index: number, item: ItemT) => number;
|
|
60
|
+
/**
|
|
61
|
+
* Ratio of initial container pool size to data length (e.g., 0.5 for half).
|
|
62
|
+
* @default 1
|
|
63
|
+
*/
|
|
64
|
+
initialContainerPoolRatio?: number | undefined;
|
|
65
|
+
/**
|
|
66
|
+
* Initial scroll position in pixels.
|
|
67
|
+
* @default 0
|
|
68
|
+
*/
|
|
23
69
|
initialScrollOffset?: number;
|
|
70
|
+
/**
|
|
71
|
+
* Index to scroll to initially.
|
|
72
|
+
* @default 0
|
|
73
|
+
*/
|
|
24
74
|
initialScrollIndex?: number;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
75
|
+
/**
|
|
76
|
+
* Component to render between items, receiving the leading item as prop.
|
|
77
|
+
*/
|
|
78
|
+
ItemSeparatorComponent?: React.ComponentType<{
|
|
79
|
+
leadingItem: ItemT;
|
|
80
|
+
}>;
|
|
81
|
+
/**
|
|
82
|
+
* Function to extract a unique key for each item.
|
|
83
|
+
*/
|
|
84
|
+
keyExtractor?: (item: ItemT, index: number) => string;
|
|
85
|
+
/**
|
|
86
|
+
* Component or element to render when the list is empty.
|
|
87
|
+
*/
|
|
88
|
+
ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
89
|
+
/**
|
|
90
|
+
* Component or element to render below the list.
|
|
91
|
+
*/
|
|
92
|
+
ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
93
|
+
/**
|
|
94
|
+
* Style for the footer component.
|
|
95
|
+
*/
|
|
96
|
+
ListFooterComponentStyle?: StyleProp<ViewStyle> | undefined;
|
|
97
|
+
/**
|
|
98
|
+
* Component or element to render above the list.
|
|
99
|
+
*/
|
|
100
|
+
ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
101
|
+
/**
|
|
102
|
+
* Style for the header component.
|
|
103
|
+
*/
|
|
104
|
+
ListHeaderComponentStyle?: StyleProp<ViewStyle> | undefined;
|
|
105
|
+
/**
|
|
106
|
+
* If true, auto-scrolls to end when new items are added.
|
|
107
|
+
* @default false
|
|
108
|
+
*/
|
|
29
109
|
maintainScrollAtEnd?: boolean;
|
|
110
|
+
/**
|
|
111
|
+
* Distance threshold in pixels to trigger maintainScrollAtEnd.
|
|
112
|
+
* @default 100
|
|
113
|
+
*/
|
|
30
114
|
maintainScrollAtEndThreshold?: number;
|
|
31
|
-
|
|
115
|
+
/**
|
|
116
|
+
* If true, maintains visibility of content during scroll (e.g., after insertions).
|
|
117
|
+
* @default false
|
|
118
|
+
*/
|
|
32
119
|
maintainVisibleContentPosition?: boolean;
|
|
120
|
+
/**
|
|
121
|
+
* Number of columns to render items in.
|
|
122
|
+
* @default 1
|
|
123
|
+
*/
|
|
33
124
|
numColumns?: number;
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
initialContainerPoolRatio?: number | undefined;
|
|
38
|
-
estimatedItemSize?: number;
|
|
39
|
-
getEstimatedItemSize?: (index: number, item: ItemT) => number;
|
|
40
|
-
onStartReached?: ((info: {
|
|
41
|
-
distanceFromStart: number;
|
|
42
|
-
}) => void) | null | undefined;
|
|
125
|
+
/**
|
|
126
|
+
* Called when scrolling reaches the end within onEndReachedThreshold.
|
|
127
|
+
*/
|
|
43
128
|
onEndReached?: ((info: {
|
|
44
129
|
distanceFromEnd: number;
|
|
45
130
|
}) => void) | null | undefined;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
leadingItem: ItemT;
|
|
55
|
-
}>;
|
|
56
|
-
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
57
|
-
viewabilityConfig?: ViewabilityConfig;
|
|
58
|
-
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
131
|
+
/**
|
|
132
|
+
* How close to the end (in fractional units of visible length) to trigger onEndReached.
|
|
133
|
+
* @default 0.5
|
|
134
|
+
*/
|
|
135
|
+
onEndReachedThreshold?: number | null | undefined;
|
|
136
|
+
/**
|
|
137
|
+
* Called when an item's size changes.
|
|
138
|
+
*/
|
|
59
139
|
onItemSizeChanged?: (info: {
|
|
60
140
|
size: number;
|
|
61
141
|
previous: number;
|
|
@@ -63,15 +143,67 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
|
|
|
63
143
|
itemKey: string;
|
|
64
144
|
itemData: ItemT;
|
|
65
145
|
}) => void;
|
|
146
|
+
/**
|
|
147
|
+
* Function to call when the user pulls to refresh.
|
|
148
|
+
*/
|
|
149
|
+
onRefresh?: () => void;
|
|
150
|
+
/**
|
|
151
|
+
* Called when scrolling reaches the start within onStartReachedThreshold.
|
|
152
|
+
*/
|
|
153
|
+
onStartReached?: ((info: {
|
|
154
|
+
distanceFromStart: number;
|
|
155
|
+
}) => void) | null | undefined;
|
|
156
|
+
/**
|
|
157
|
+
* How close to the start (in fractional units of visible length) to trigger onStartReached.
|
|
158
|
+
* @default 0.5
|
|
159
|
+
*/
|
|
160
|
+
onStartReachedThreshold?: number | null | undefined;
|
|
161
|
+
/**
|
|
162
|
+
* Called when the viewability of items changes.
|
|
163
|
+
*/
|
|
164
|
+
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
165
|
+
/**
|
|
166
|
+
* Offset in pixels for the refresh indicator.
|
|
167
|
+
* @default 0
|
|
168
|
+
*/
|
|
169
|
+
progressViewOffset?: number;
|
|
170
|
+
/**
|
|
171
|
+
* If true, recycles item views for better performance.
|
|
172
|
+
* @default false
|
|
173
|
+
*/
|
|
174
|
+
recycleItems?: boolean;
|
|
175
|
+
/**
|
|
176
|
+
* Ref to the underlying ScrollView component.
|
|
177
|
+
*/
|
|
178
|
+
refScrollView?: React.Ref<ScrollView>;
|
|
179
|
+
/**
|
|
180
|
+
* If true, shows a refresh indicator.
|
|
181
|
+
* @default false
|
|
182
|
+
*/
|
|
183
|
+
refreshing?: boolean;
|
|
184
|
+
/**
|
|
185
|
+
* Function to render each item in the list.
|
|
186
|
+
* @required
|
|
187
|
+
*/
|
|
188
|
+
renderItem?: (props: LegendListRenderItemProps<ItemT>) => ReactNode;
|
|
66
189
|
/**
|
|
67
190
|
* Render custom ScrollView component.
|
|
68
191
|
* @default (props) => <ScrollView {...props} />
|
|
69
192
|
*/
|
|
70
193
|
renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement<ScrollViewProps>;
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
194
|
+
/**
|
|
195
|
+
* Configuration for determining item viewability.
|
|
196
|
+
*/
|
|
197
|
+
viewabilityConfig?: ViewabilityConfig;
|
|
198
|
+
/**
|
|
199
|
+
* Pairs of viewability configs and their callbacks for tracking visibility.
|
|
200
|
+
*/
|
|
201
|
+
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
202
|
+
/**
|
|
203
|
+
* If true, delays rendering until initial layout is complete.
|
|
204
|
+
* @default false
|
|
205
|
+
*/
|
|
206
|
+
waitForInitialLayout?: boolean;
|
|
75
207
|
};
|
|
76
208
|
interface ColumnWrapperStyle {
|
|
77
209
|
rowGap?: number;
|
|
@@ -151,6 +283,7 @@ interface ViewableRange<T> {
|
|
|
151
283
|
interface LegendListRenderItemProps<ItemT> {
|
|
152
284
|
item: ItemT;
|
|
153
285
|
index: number;
|
|
286
|
+
extraData: any;
|
|
154
287
|
useViewability: (configId: string, callback: ViewabilityCallback) => void;
|
|
155
288
|
useViewabilityAmount: (callback: ViewabilityAmountCallback) => void;
|
|
156
289
|
useRecyclingEffect: (effect: (info: LegendListRecyclingState<ItemT>) => void | (() => void)) => void;
|
|
@@ -158,35 +291,63 @@ interface LegendListRenderItemProps<ItemT> {
|
|
|
158
291
|
}
|
|
159
292
|
type LegendListRef = {
|
|
160
293
|
/**
|
|
161
|
-
|
|
162
|
-
|
|
294
|
+
* Displays the scroll indicators momentarily.
|
|
295
|
+
*/
|
|
163
296
|
flashScrollIndicators(): void;
|
|
297
|
+
/**
|
|
298
|
+
* Returns the native ScrollView component reference.
|
|
299
|
+
*/
|
|
164
300
|
getNativeScrollRef(): React.ElementRef<typeof ScrollViewComponent>;
|
|
165
|
-
|
|
301
|
+
/**
|
|
302
|
+
* Returns the scroll responder instance for handling scroll events.
|
|
303
|
+
*/
|
|
166
304
|
getScrollableNode(): any;
|
|
167
305
|
/**
|
|
168
|
-
*
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
*
|
|
173
|
-
*
|
|
306
|
+
* Returns the ScrollResponderMixin for advanced scroll handling.
|
|
307
|
+
*/
|
|
308
|
+
getScrollResponder(): ScrollResponderMixin;
|
|
309
|
+
/**
|
|
310
|
+
* Scrolls to the end of the list.
|
|
311
|
+
* @param options - Options for scrolling.
|
|
312
|
+
* @param options.animated - If true, animates the scroll. Default: true.
|
|
174
313
|
*/
|
|
175
314
|
scrollToEnd(options?: {
|
|
176
315
|
animated?: boolean | undefined;
|
|
177
316
|
}): void;
|
|
317
|
+
/**
|
|
318
|
+
* Scrolls to a specific index in the list.
|
|
319
|
+
* @param params - Parameters for scrolling.
|
|
320
|
+
* @param params.animated - If true, animates the scroll. Default: true.
|
|
321
|
+
* @param params.index - The index to scroll to.
|
|
322
|
+
* @param params.viewOffset - Offset from the target position.
|
|
323
|
+
* @param params.viewPosition - Position of the item in the viewport (0 to 1).
|
|
324
|
+
*/
|
|
178
325
|
scrollToIndex(params: {
|
|
179
326
|
animated?: boolean | undefined;
|
|
180
327
|
index: number;
|
|
181
328
|
viewOffset?: number | undefined;
|
|
182
329
|
viewPosition?: number | undefined;
|
|
183
330
|
}): void;
|
|
331
|
+
/**
|
|
332
|
+
* Scrolls to a specific item in the list.
|
|
333
|
+
* @param params - Parameters for scrolling.
|
|
334
|
+
* @param params.animated - If true, animates the scroll. Default: true.
|
|
335
|
+
* @param params.item - The item to scroll to.
|
|
336
|
+
* @param params.viewOffset - Offset from the target position.
|
|
337
|
+
* @param params.viewPosition - Position of the item in the viewport (0 to 1).
|
|
338
|
+
*/
|
|
184
339
|
scrollToItem(params: {
|
|
185
340
|
animated?: boolean | undefined;
|
|
186
341
|
item: any;
|
|
187
342
|
viewOffset?: number | undefined;
|
|
188
343
|
viewPosition?: number | undefined;
|
|
189
344
|
}): void;
|
|
345
|
+
/**
|
|
346
|
+
* Scrolls to a specific offset in pixels.
|
|
347
|
+
* @param params - Parameters for scrolling.
|
|
348
|
+
* @param params.offset - The pixel offset to scroll to.
|
|
349
|
+
* @param params.animated - If true, animates the scroll. Default: true.
|
|
350
|
+
*/
|
|
190
351
|
scrollToOffset(params: {
|
|
191
352
|
offset: number;
|
|
192
353
|
animated?: boolean | undefined;
|
|
@@ -260,43 +421,33 @@ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqua
|
|
|
260
421
|
declare const typedMemo: TypedMemo;
|
|
261
422
|
|
|
262
423
|
declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintainVisibleContentPosition" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
|
|
424
|
+
alignItemsAtEnd?: boolean;
|
|
425
|
+
columnWrapperStyle?: ColumnWrapperStyle;
|
|
263
426
|
data: readonly T[];
|
|
427
|
+
drawDistance?: number;
|
|
428
|
+
estimatedItemSize?: number;
|
|
429
|
+
extraData?: any;
|
|
430
|
+
getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
|
|
431
|
+
initialContainerPoolRatio?: number | undefined;
|
|
264
432
|
initialScrollOffset?: number;
|
|
265
433
|
initialScrollIndex?: number;
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
434
|
+
ItemSeparatorComponent?: React$1.ComponentType<{
|
|
435
|
+
leadingItem: T;
|
|
436
|
+
}> | undefined;
|
|
437
|
+
keyExtractor?: ((item: T, index: number) => string) | undefined;
|
|
438
|
+
ListEmptyComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
439
|
+
ListFooterComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
440
|
+
ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
|
|
441
|
+
ListHeaderComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
442
|
+
ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
|
|
270
443
|
maintainScrollAtEnd?: boolean;
|
|
271
444
|
maintainScrollAtEndThreshold?: number;
|
|
272
|
-
alignItemsAtEnd?: boolean;
|
|
273
445
|
maintainVisibleContentPosition?: boolean;
|
|
274
446
|
numColumns?: number;
|
|
275
|
-
columnWrapperStyle?: ColumnWrapperStyle;
|
|
276
|
-
refScrollView?: React$1.Ref<ScrollView>;
|
|
277
|
-
waitForInitialLayout?: boolean;
|
|
278
|
-
initialContainerPoolRatio?: number | undefined;
|
|
279
|
-
estimatedItemSize?: number;
|
|
280
|
-
getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
|
|
281
|
-
onStartReached?: ((info: {
|
|
282
|
-
distanceFromStart: number;
|
|
283
|
-
}) => void) | null | undefined;
|
|
284
447
|
onEndReached?: ((info: {
|
|
285
448
|
distanceFromEnd: number;
|
|
286
449
|
}) => void) | null | undefined;
|
|
287
|
-
|
|
288
|
-
renderItem?: ((props: LegendListRenderItemProps<T>) => React$1.ReactNode) | undefined;
|
|
289
|
-
ListHeaderComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
290
|
-
ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
|
|
291
|
-
ListFooterComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
292
|
-
ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
|
|
293
|
-
ListEmptyComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
|
|
294
|
-
ItemSeparatorComponent?: React$1.ComponentType<{
|
|
295
|
-
leadingItem: T;
|
|
296
|
-
}> | undefined;
|
|
297
|
-
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
298
|
-
viewabilityConfig?: ViewabilityConfig;
|
|
299
|
-
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
450
|
+
onEndReachedThreshold?: number | null | undefined;
|
|
300
451
|
onItemSizeChanged?: ((info: {
|
|
301
452
|
size: number;
|
|
302
453
|
previous: number;
|
|
@@ -304,11 +455,21 @@ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintai
|
|
|
304
455
|
itemKey: string;
|
|
305
456
|
itemData: T;
|
|
306
457
|
}) => void) | undefined;
|
|
307
|
-
renderScrollComponent?: (props: react_native.ScrollViewProps) => React$1.ReactElement<react_native.ScrollViewProps>;
|
|
308
|
-
extraData?: any;
|
|
309
|
-
refreshing?: boolean;
|
|
310
458
|
onRefresh?: () => void;
|
|
459
|
+
onStartReached?: ((info: {
|
|
460
|
+
distanceFromStart: number;
|
|
461
|
+
}) => void) | null | undefined;
|
|
462
|
+
onStartReachedThreshold?: number | null | undefined;
|
|
463
|
+
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
|
|
311
464
|
progressViewOffset?: number;
|
|
465
|
+
recycleItems?: boolean;
|
|
466
|
+
refScrollView?: React$1.Ref<ScrollView>;
|
|
467
|
+
refreshing?: boolean;
|
|
468
|
+
renderItem?: ((props: LegendListRenderItemProps<T>) => React$1.ReactNode) | undefined;
|
|
469
|
+
renderScrollComponent?: (props: react_native.ScrollViewProps) => React$1.ReactElement<react_native.ScrollViewProps>;
|
|
470
|
+
viewabilityConfig?: ViewabilityConfig;
|
|
471
|
+
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
|
|
472
|
+
waitForInitialLayout?: boolean;
|
|
312
473
|
} & React$1.RefAttributes<LegendListRef>) => React$1.ReactNode;
|
|
313
474
|
|
|
314
475
|
declare function useViewability(configId: string, callback: ViewabilityCallback): void;
|
package/index.js
CHANGED
|
@@ -571,6 +571,7 @@ var ScrollAdjustHandler = class {
|
|
|
571
571
|
this.appliedAdjust = 0;
|
|
572
572
|
this.busy = false;
|
|
573
573
|
this.isPaused = false;
|
|
574
|
+
this.isDisabled = false;
|
|
574
575
|
this.context = ctx;
|
|
575
576
|
}
|
|
576
577
|
doAjdust() {
|
|
@@ -578,6 +579,9 @@ var ScrollAdjustHandler = class {
|
|
|
578
579
|
this.busy = false;
|
|
579
580
|
}
|
|
580
581
|
requestAdjust(adjust, onAdjusted) {
|
|
582
|
+
if (this.isDisabled) {
|
|
583
|
+
return;
|
|
584
|
+
}
|
|
581
585
|
const oldAdjustTop = peek$(this.context, "scrollAdjust");
|
|
582
586
|
if (oldAdjustTop === adjust) {
|
|
583
587
|
return;
|
|
@@ -595,6 +599,9 @@ var ScrollAdjustHandler = class {
|
|
|
595
599
|
pauseAdjust() {
|
|
596
600
|
this.isPaused = true;
|
|
597
601
|
}
|
|
602
|
+
setDisableAdjust(disable) {
|
|
603
|
+
this.isDisabled = disable;
|
|
604
|
+
}
|
|
598
605
|
// return true if it was paused
|
|
599
606
|
unPauseAdjust() {
|
|
600
607
|
if (this.isPaused) {
|
|
@@ -869,18 +876,6 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
869
876
|
return 0;
|
|
870
877
|
};
|
|
871
878
|
const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : React6.useMemo(calculateOffsetForIndex, []);
|
|
872
|
-
if (reactNative.Platform.OS === "web") {
|
|
873
|
-
React6.useEffect(() => {
|
|
874
|
-
var _a2;
|
|
875
|
-
if (initialContentOffset) {
|
|
876
|
-
(_a2 = refScroller.current) == null ? void 0 : _a2.scrollTo({
|
|
877
|
-
x: horizontal ? initialContentOffset : 0,
|
|
878
|
-
y: horizontal ? 0 : initialContentOffset,
|
|
879
|
-
animated: false
|
|
880
|
-
});
|
|
881
|
-
}
|
|
882
|
-
}, []);
|
|
883
|
-
}
|
|
884
879
|
if (!refState.current) {
|
|
885
880
|
const initialScrollLength = reactNative.Dimensions.get("window")[horizontal ? "width" : "height"];
|
|
886
881
|
refState.current = {
|
|
@@ -1523,6 +1518,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1523
1518
|
addTotalSize(null, totalSize, totalSizeBelowIndex);
|
|
1524
1519
|
};
|
|
1525
1520
|
const isFirst = !refState.current.renderItem;
|
|
1521
|
+
const memoizedLastItemKeys = React6.useMemo(() => {
|
|
1522
|
+
if (!dataProp.length) return /* @__PURE__ */ new Set();
|
|
1523
|
+
return new Set(
|
|
1524
|
+
Array.from({ length: Math.min(numColumnsProp, dataProp.length) }, (_, i) => getId(dataProp.length - 1 - i))
|
|
1525
|
+
);
|
|
1526
|
+
}, [dataProp.length, numColumnsProp, dataProp.slice(-numColumnsProp).toString()]);
|
|
1527
|
+
const initalizeStateVars = () => {
|
|
1528
|
+
set$(ctx, "lastItemKeys", memoizedLastItemKeys);
|
|
1529
|
+
set$(ctx, "numColumns", numColumnsProp);
|
|
1530
|
+
set$(ctx, "stylePaddingTop", stylePaddingTop);
|
|
1531
|
+
};
|
|
1532
|
+
if (isFirst) {
|
|
1533
|
+
initalizeStateVars();
|
|
1534
|
+
}
|
|
1526
1535
|
if (isFirst || didDataChange || numColumnsProp !== peek$(ctx, "numColumns")) {
|
|
1527
1536
|
refState.current.lastBatchingAction = Date.now();
|
|
1528
1537
|
if (!keyExtractorProp && !isFirst && didDataChange) {
|
|
@@ -1532,30 +1541,19 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1532
1541
|
calcTotalSizesAndPositions({ forgetPositions: false });
|
|
1533
1542
|
}
|
|
1534
1543
|
React6.useEffect(() => {
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1544
|
+
const didAllocateContainers = doInitialAllocateContainers();
|
|
1545
|
+
if (!didAllocateContainers) {
|
|
1546
|
+
checkResetContainers(
|
|
1547
|
+
/*isFirst*/
|
|
1548
|
+
isFirst
|
|
1549
|
+
);
|
|
1550
|
+
}
|
|
1539
1551
|
}, [isFirst, dataProp, numColumnsProp]);
|
|
1540
1552
|
React6.useEffect(() => {
|
|
1541
1553
|
set$(ctx, "extraData", extraData);
|
|
1542
1554
|
}, [extraData]);
|
|
1543
1555
|
refState.current.renderItem = renderItem;
|
|
1544
|
-
const memoizedLastItemKeys = React6.useMemo(() => {
|
|
1545
|
-
if (!dataProp.length) return [];
|
|
1546
|
-
return new Set(
|
|
1547
|
-
Array.from({ length: Math.min(numColumnsProp, dataProp.length) }, (_, i) => getId(dataProp.length - 1 - i))
|
|
1548
|
-
);
|
|
1549
|
-
}, [dataProp.length, numColumnsProp, dataProp.slice(-numColumnsProp).toString()]);
|
|
1550
1556
|
const stylePaddingTop = (_d = (_c = (_a = reactNative.StyleSheet.flatten(style)) == null ? void 0 : _a.paddingTop) != null ? _c : (_b = reactNative.StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _b.paddingTop) != null ? _d : 0;
|
|
1551
|
-
const initalizeStateVars = () => {
|
|
1552
|
-
set$(ctx, "lastItemKeys", memoizedLastItemKeys);
|
|
1553
|
-
set$(ctx, "numColumns", numColumnsProp);
|
|
1554
|
-
set$(ctx, "stylePaddingTop", stylePaddingTop);
|
|
1555
|
-
};
|
|
1556
|
-
if (isFirst) {
|
|
1557
|
-
initalizeStateVars();
|
|
1558
|
-
}
|
|
1559
1557
|
React6.useEffect(initalizeStateVars, [memoizedLastItemKeys, numColumnsProp, stylePaddingTop]);
|
|
1560
1558
|
const getRenderedItem = React6.useCallback((key) => {
|
|
1561
1559
|
var _a2, _b2;
|
|
@@ -1583,6 +1581,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1583
1581
|
const renderedItem = (_b2 = (_a2 = refState.current).renderItem) == null ? void 0 : _b2.call(_a2, {
|
|
1584
1582
|
item: data[index],
|
|
1585
1583
|
index,
|
|
1584
|
+
extraData: peek$(ctx, "extraData"),
|
|
1586
1585
|
useViewability: useViewability2,
|
|
1587
1586
|
useViewabilityAmount: useViewabilityAmount2,
|
|
1588
1587
|
useRecyclingEffect: useRecyclingEffect2,
|
|
@@ -1593,9 +1592,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1593
1592
|
const doInitialAllocateContainers = () => {
|
|
1594
1593
|
var _a2;
|
|
1595
1594
|
const state = refState.current;
|
|
1596
|
-
const scrollLength = state
|
|
1597
|
-
if (scrollLength > 0 && !peek$(ctx, "numContainers")) {
|
|
1598
|
-
const averageItemSize = (_a2 = estimatedItemSize != null ? estimatedItemSize : getEstimatedItemSize == null ? void 0 : getEstimatedItemSize(0,
|
|
1595
|
+
const { scrollLength, data } = state;
|
|
1596
|
+
if (scrollLength > 0 && data.length > 0 && !peek$(ctx, "numContainers")) {
|
|
1597
|
+
const averageItemSize = (_a2 = estimatedItemSize != null ? estimatedItemSize : getEstimatedItemSize == null ? void 0 : getEstimatedItemSize(0, data[0])) != null ? _a2 : DEFAULT_ITEM_SIZE;
|
|
1599
1598
|
const numContainers = Math.ceil((scrollLength + scrollBuffer * 2) / averageItemSize) * numColumnsProp;
|
|
1600
1599
|
for (let i = 0; i < numContainers; i++) {
|
|
1601
1600
|
set$(ctx, `containerPosition${i}`, ANCHORED_POSITION_OUT_OF_VIEW);
|
|
@@ -1610,6 +1609,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1610
1609
|
} else {
|
|
1611
1610
|
calculateItemsInView();
|
|
1612
1611
|
}
|
|
1612
|
+
return true;
|
|
1613
1613
|
}
|
|
1614
1614
|
};
|
|
1615
1615
|
useInit(() => {
|
|
@@ -1688,20 +1688,26 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1688
1688
|
if (needsCalculate) {
|
|
1689
1689
|
const scrollVelocity = state.scrollVelocity;
|
|
1690
1690
|
if ((Number.isNaN(scrollVelocity) || Math.abs(scrollVelocity) < 1) && (!waitForInitialLayout || state.numPendingInitialLayout < 0)) {
|
|
1691
|
+
const setDidLayout = () => {
|
|
1692
|
+
set$(ctx, "containersDidLayout", true);
|
|
1693
|
+
if (reactNative.Platform.OS === "web") {
|
|
1694
|
+
setTimeout(() => {
|
|
1695
|
+
state.scrollAdjustHandler.setDisableAdjust(false);
|
|
1696
|
+
}, 32);
|
|
1697
|
+
}
|
|
1698
|
+
};
|
|
1691
1699
|
if (Date.now() - state.lastBatchingAction < 500) {
|
|
1692
1700
|
state.queuedCalculateItemsInView = requestAnimationFrame(() => {
|
|
1693
1701
|
state.queuedCalculateItemsInView = void 0;
|
|
1694
1702
|
calculateItemsInView();
|
|
1695
1703
|
if (needsUpdateContainersDidLayout) {
|
|
1696
|
-
|
|
1704
|
+
setDidLayout();
|
|
1697
1705
|
}
|
|
1698
1706
|
});
|
|
1699
1707
|
} else {
|
|
1700
1708
|
calculateItemsInView();
|
|
1701
1709
|
if (needsUpdateContainersDidLayout) {
|
|
1702
|
-
queueMicrotask(
|
|
1703
|
-
set$(ctx, "containersDidLayout", true);
|
|
1704
|
-
});
|
|
1710
|
+
queueMicrotask(setDidLayout);
|
|
1705
1711
|
}
|
|
1706
1712
|
}
|
|
1707
1713
|
}
|
|
@@ -1713,6 +1719,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1713
1719
|
const didChange = scrollLength !== state.scrollLength;
|
|
1714
1720
|
state.scrollLength = scrollLength;
|
|
1715
1721
|
state.lastBatchingAction = Date.now();
|
|
1722
|
+
state.scrollForNextCalculateItemsInView = void 0;
|
|
1716
1723
|
doInitialAllocateContainers();
|
|
1717
1724
|
doMaintainScrollAtEnd(false);
|
|
1718
1725
|
doUpdatePaddingTop();
|
|
@@ -1797,39 +1804,39 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1797
1804
|
let firstIndexScrollPostion = firstIndexOffset - viewOffset;
|
|
1798
1805
|
const diff = Math.abs(state.scroll - firstIndexScrollPostion);
|
|
1799
1806
|
const needsReanchoring = maintainVisibleContentPosition && diff > 100;
|
|
1807
|
+
state.scrollForNextCalculateItemsInView = void 0;
|
|
1800
1808
|
if (needsReanchoring) {
|
|
1801
1809
|
const id = getId(index);
|
|
1802
1810
|
state.anchorElement = { id, coordinate: firstIndexOffset };
|
|
1803
1811
|
(_a2 = state.belowAnchorElementPositions) == null ? void 0 : _a2.clear();
|
|
1804
1812
|
state.positions.clear();
|
|
1805
1813
|
calcTotalSizesAndPositions({ forgetPositions: true });
|
|
1806
|
-
state.scrollForNextCalculateItemsInView = void 0;
|
|
1807
1814
|
state.startBufferedId = id;
|
|
1808
1815
|
state.minIndexSizeChanged = index;
|
|
1809
1816
|
firstIndexScrollPostion = firstIndexOffset - viewOffset + state.scrollAdjustHandler.getAppliedAdjust();
|
|
1810
1817
|
}
|
|
1811
|
-
state.scrollAdjustHandler.
|
|
1818
|
+
state.scrollAdjustHandler.setDisableAdjust(true);
|
|
1812
1819
|
setTimeout(
|
|
1813
1820
|
() => {
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
refState.current.scrollVelocity = 0;
|
|
1817
|
-
refState.current.scrollHistory = [];
|
|
1818
|
-
calculateItemsInView();
|
|
1819
|
-
}
|
|
1821
|
+
state.scrollAdjustHandler.setDisableAdjust(false);
|
|
1822
|
+
calculateItemsInView();
|
|
1820
1823
|
},
|
|
1821
|
-
animated ?
|
|
1824
|
+
animated ? 150 : 50
|
|
1822
1825
|
);
|
|
1823
1826
|
if (viewPosition) {
|
|
1824
1827
|
firstIndexScrollPostion -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
|
|
1825
1828
|
}
|
|
1826
1829
|
const offset = horizontal ? { x: firstIndexScrollPostion, y: 0 } : { x: 0, y: firstIndexScrollPostion };
|
|
1827
|
-
|
|
1828
|
-
|
|
1830
|
+
refScroller.current.scrollTo({ ...offset, animated });
|
|
1831
|
+
const totalSizeWithScrollAdjust = peek$(ctx, "totalSizeWithScrollAdjust");
|
|
1832
|
+
if (maintainVisibleContentPosition && totalSizeWithScrollAdjust - firstIndexScrollPostion < state.scrollLength) {
|
|
1833
|
+
const doScrollTo = () => {
|
|
1829
1834
|
refScroller.current.scrollTo({ ...offset, animated });
|
|
1830
|
-
}
|
|
1831
|
-
|
|
1832
|
-
|
|
1835
|
+
};
|
|
1836
|
+
setTimeout(doScrollTo, animated ? 150 : 50);
|
|
1837
|
+
if (animated) {
|
|
1838
|
+
setTimeout(doScrollTo, 350);
|
|
1839
|
+
}
|
|
1833
1840
|
}
|
|
1834
1841
|
};
|
|
1835
1842
|
return {
|
|
@@ -1854,6 +1861,42 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1854
1861
|
},
|
|
1855
1862
|
[]
|
|
1856
1863
|
);
|
|
1864
|
+
if (reactNative.Platform.OS === "web") {
|
|
1865
|
+
React6.useEffect(() => {
|
|
1866
|
+
var _a2, _b2;
|
|
1867
|
+
if (initialContentOffset) {
|
|
1868
|
+
(_a2 = refState.current) == null ? void 0 : _a2.scrollAdjustHandler.setDisableAdjust(true);
|
|
1869
|
+
(_b2 = refScroller.current) == null ? void 0 : _b2.scrollTo({
|
|
1870
|
+
x: horizontal ? initialContentOffset : 0,
|
|
1871
|
+
y: horizontal ? 0 : initialContentOffset,
|
|
1872
|
+
animated: false
|
|
1873
|
+
});
|
|
1874
|
+
setTimeout(() => {
|
|
1875
|
+
var _a3;
|
|
1876
|
+
(_a3 = refState.current) == null ? void 0 : _a3.scrollAdjustHandler.setDisableAdjust(false);
|
|
1877
|
+
}, 0);
|
|
1878
|
+
}
|
|
1879
|
+
}, []);
|
|
1880
|
+
}
|
|
1881
|
+
if (isFirst) {
|
|
1882
|
+
refState.current.scrollAdjustHandler.setDisableAdjust(true);
|
|
1883
|
+
}
|
|
1884
|
+
React6.useEffect(() => {
|
|
1885
|
+
refState.current.scrollAdjustHandler.setDisableAdjust(false);
|
|
1886
|
+
if (initialContentOffset) {
|
|
1887
|
+
const doScrollTo = () => {
|
|
1888
|
+
var _a2;
|
|
1889
|
+
(_a2 = refScroller.current) == null ? void 0 : _a2.scrollTo({
|
|
1890
|
+
x: horizontal ? initialContentOffset : 0,
|
|
1891
|
+
y: horizontal ? 0 : initialContentOffset,
|
|
1892
|
+
animated: false
|
|
1893
|
+
});
|
|
1894
|
+
calculateItemsInView();
|
|
1895
|
+
};
|
|
1896
|
+
setTimeout(doScrollTo, 32);
|
|
1897
|
+
setTimeout(doScrollTo, 300);
|
|
1898
|
+
}
|
|
1899
|
+
}, []);
|
|
1857
1900
|
return /* @__PURE__ */ React6__namespace.createElement(React6__namespace.Fragment, null, /* @__PURE__ */ React6__namespace.createElement(
|
|
1858
1901
|
ListComponent,
|
|
1859
1902
|
{
|