@legendapp/list 1.0.0-beta.4 → 1.0.0-beta.41

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.ts CHANGED
@@ -1,54 +1,141 @@
1
- import * as react from 'react';
2
- import { ComponentProps, ReactNode, ForwardedRef, ReactElement } from 'react';
3
- import { ScrollView, StyleProp, ViewStyle, ScrollViewProps, ScrollViewComponent, ScrollResponderMixin } from 'react-native';
4
- import Animated from 'react-native-reanimated';
1
+ import * as React$1 from 'react';
2
+ import { ComponentProps, ReactNode } from 'react';
3
+ import * as react_native from 'react-native';
4
+ import { ScrollView, StyleProp, ViewStyle, ScrollViewProps, NativeSyntheticEvent, NativeScrollEvent, ScrollViewComponent, ScrollResponderMixin } from 'react-native';
5
+ import react_native_reanimated__default from 'react-native-reanimated';
5
6
 
6
7
  declare class ScrollAdjustHandler {
7
8
  private ctx;
8
9
  private appliedAdjust;
9
- private pendingAdjust;
10
10
  private busy;
11
11
  private context;
12
- private firstAdjust;
12
+ private isPaused;
13
+ private isDisabled;
13
14
  constructor(ctx: any);
15
+ private doAjdust;
14
16
  requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
15
17
  getAppliedAdjust(): number;
18
+ pauseAdjust(): void;
19
+ setDisableAdjust(disable: boolean): void;
20
+ unPauseAdjust(): boolean;
16
21
  }
17
22
 
18
- type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, 'contentOffset' | 'contentInset' | 'maintainVisibleContentPosition' | 'stickyHeaderIndices'> & {
23
+ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof react_native_reanimated__default.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
+ */
19
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
+ */
20
69
  initialScrollOffset?: number;
70
+ /**
71
+ * Index to scroll to initially.
72
+ * @default 0
73
+ */
21
74
  initialScrollIndex?: number;
22
- drawDistance?: number;
23
- recycleItems?: boolean;
24
- onEndReachedThreshold?: number | null | undefined;
25
- onStartReachedThreshold?: number | null | undefined;
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
+ */
26
109
  maintainScrollAtEnd?: boolean;
110
+ /**
111
+ * Distance threshold in pixels to trigger maintainScrollAtEnd.
112
+ * @default 100
113
+ */
27
114
  maintainScrollAtEndThreshold?: number;
28
- alignItemsAtEnd?: boolean;
115
+ /**
116
+ * If true, maintains visibility of content during scroll (e.g., after insertions).
117
+ * @default false
118
+ */
29
119
  maintainVisibleContentPosition?: boolean;
120
+ /**
121
+ * Number of columns to render items in.
122
+ * @default 1
123
+ */
30
124
  numColumns?: number;
31
- refScrollView?: React.Ref<ScrollView>;
32
- waitForInitialLayout?: boolean;
33
- estimatedItemSize?: number;
34
- getEstimatedItemSize?: (index: number, item: ItemT) => number;
35
- onStartReached?: ((info: {
36
- distanceFromStart: number;
37
- }) => void) | null | undefined;
125
+ /**
126
+ * Called when scrolling reaches the end within onEndReachedThreshold.
127
+ */
38
128
  onEndReached?: ((info: {
39
129
  distanceFromEnd: number;
40
130
  }) => void) | null | undefined;
41
- keyExtractor?: (item: ItemT, index: number) => string;
42
- renderItem?: (props: LegendListRenderItemProps<ItemT>) => ReactNode;
43
- ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
44
- ListHeaderComponentStyle?: StyleProp<ViewStyle> | undefined;
45
- ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
46
- ListFooterComponentStyle?: StyleProp<ViewStyle> | undefined;
47
- ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
48
- ItemSeparatorComponent?: React.ComponentType<any>;
49
- viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
50
- viewabilityConfig?: ViewabilityConfig;
51
- 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
+ */
52
139
  onItemSizeChanged?: (info: {
53
140
  size: number;
54
141
  previous: number;
@@ -56,15 +143,75 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
56
143
  itemKey: string;
57
144
  itemData: ItemT;
58
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;
59
189
  /**
60
190
  * Render custom ScrollView component.
61
191
  * @default (props) => <ScrollView {...props} />
62
192
  */
63
193
  renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement<ScrollViewProps>;
64
- extraData?: any;
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;
65
207
  };
208
+ interface ColumnWrapperStyle {
209
+ rowGap?: number;
210
+ gap?: number;
211
+ columnGap?: number;
212
+ }
66
213
  type AnchoredPosition = {
67
- type: 'top' | 'bottom';
214
+ type: "top" | "bottom";
68
215
  relativeCoordinate: number;
69
216
  top: number;
70
217
  };
@@ -79,16 +226,14 @@ interface InternalState {
79
226
  positions: Map<string, number>;
80
227
  columns: Map<string, number>;
81
228
  sizes: Map<string, number>;
82
- sizesLaidOut: Map<string, number> | undefined;
229
+ sizesKnown: Map<string, number> | undefined;
83
230
  pendingAdjust: number;
84
- waitingForMicrotask: any;
85
231
  isStartReached: boolean;
86
232
  isEndReached: boolean;
87
233
  isAtBottom: boolean;
88
234
  isAtTop: boolean;
89
235
  data: readonly any[];
90
- idsInFirstRender: Set<string>;
91
- hasScrolled: boolean;
236
+ hasScrolled?: boolean;
92
237
  scrollLength: number;
93
238
  startBuffered: number;
94
239
  startBufferedId?: string;
@@ -115,11 +260,20 @@ interface InternalState {
115
260
  }>;
116
261
  scrollTimer: Timer | undefined;
117
262
  startReachedBlockedByTimer: boolean;
263
+ endReachedBlockedByTimer: boolean;
118
264
  scrollForNextCalculateItemsInView: {
119
265
  top: number;
120
266
  bottom: number;
121
267
  } | undefined;
122
268
  enableScrollForNextCalculateItemsInView: boolean;
269
+ minIndexSizeChanged: number | undefined;
270
+ numPendingInitialLayout: number;
271
+ queuedInitialLayout?: boolean | undefined;
272
+ queuedCalculateItemsInView: number | undefined;
273
+ lastBatchingAction: number;
274
+ ignoreScrollFromCalcTotal?: boolean;
275
+ scrollingToOffset?: number | undefined;
276
+ onScroll: ((event: NativeSyntheticEvent<NativeScrollEvent>) => void) | undefined;
123
277
  }
124
278
  interface ViewableRange<T> {
125
279
  startBuffered: number;
@@ -131,44 +285,105 @@ interface ViewableRange<T> {
131
285
  interface LegendListRenderItemProps<ItemT> {
132
286
  item: ItemT;
133
287
  index: number;
134
- useViewability: (configId: string, callback: ViewabilityCallback) => void;
135
- useViewabilityAmount: (callback: ViewabilityAmountCallback) => void;
136
- useRecyclingEffect: (effect: (info: LegendListRecyclingState<ItemT>) => void | (() => void)) => void;
137
- useRecyclingState: <T>(updateState: ((info: LegendListRecyclingState<ItemT>) => T) | T) => [T, React.Dispatch<T>];
288
+ extraData: any;
138
289
  }
290
+ type ScrollState = {
291
+ contentLength: number;
292
+ end: number;
293
+ endBuffered: number;
294
+ isAtEnd: boolean;
295
+ isAtStart: boolean;
296
+ scroll: number;
297
+ scrollLength: number;
298
+ start: number;
299
+ startBuffered: number;
300
+ };
139
301
  type LegendListRef = {
140
302
  /**
141
303
  * Displays the scroll indicators momentarily.
142
304
  */
143
305
  flashScrollIndicators(): void;
306
+ /**
307
+ * Returns the native ScrollView component reference.
308
+ */
144
309
  getNativeScrollRef(): React.ElementRef<typeof ScrollViewComponent>;
145
- getScrollResponder(): ScrollResponderMixin;
310
+ /**
311
+ * Returns the scroll responder instance for handling scroll events.
312
+ */
146
313
  getScrollableNode(): any;
147
314
  /**
148
- * A helper function that scrolls to the end of the scrollview;
149
- * If this is a vertical ScrollView, it scrolls to the bottom.
150
- * If this is a horizontal ScrollView scrolls to the right.
151
- *
152
- * The options object has an animated prop, that enables the scrolling animation or not.
153
- * The animated prop defaults to true
315
+ * Returns the ScrollResponderMixin for advanced scroll handling.
316
+ */
317
+ getScrollResponder(): ScrollResponderMixin;
318
+ /**
319
+ * Returns the internal state of the scroll virtualization.
320
+ */
321
+ getState(): ScrollState;
322
+ /**
323
+ * Scrolls a specific index into view.
324
+ * @param params - Parameters for scrolling.
325
+ * @param params.animated - If true, animates the scroll. Default: true.
326
+ * @param params.index - The index to scroll to.
327
+ */
328
+ scrollIndexIntoView(params: {
329
+ animated?: boolean | undefined;
330
+ index: number;
331
+ }): void;
332
+ /**
333
+ * Scrolls a specific index into view.
334
+ * @param params - Parameters for scrolling.
335
+ * @param params.animated - If true, animates the scroll. Default: true.
336
+ * @param params.item - The item to scroll to.
337
+ */
338
+ scrollItemIntoView(params: {
339
+ animated?: boolean | undefined;
340
+ item: any;
341
+ }): void;
342
+ /**
343
+ * Scrolls to the end of the list.
344
+ * @param options - Options for scrolling.
345
+ * @param options.animated - If true, animates the scroll. Default: true.
154
346
  */
155
347
  scrollToEnd(options?: {
156
348
  animated?: boolean | undefined;
157
349
  }): void;
158
- scrollToIndex: (params: {
350
+ /**
351
+ * Scrolls to a specific index in the list.
352
+ * @param params - Parameters for scrolling.
353
+ * @param params.animated - If true, animates the scroll. Default: true.
354
+ * @param params.index - The index to scroll to.
355
+ * @param params.viewOffset - Offset from the target position.
356
+ * @param params.viewPosition - Position of the item in the viewport (0 to 1).
357
+ */
358
+ scrollToIndex(params: {
359
+ animated?: boolean | undefined;
159
360
  index: number;
160
- animated?: boolean;
161
- viewOffset?: number;
162
- viewPosition?: number;
163
- }) => void;
361
+ viewOffset?: number | undefined;
362
+ viewPosition?: number | undefined;
363
+ }): void;
364
+ /**
365
+ * Scrolls to a specific item in the list.
366
+ * @param params - Parameters for scrolling.
367
+ * @param params.animated - If true, animates the scroll. Default: true.
368
+ * @param params.item - The item to scroll to.
369
+ * @param params.viewOffset - Offset from the target position.
370
+ * @param params.viewPosition - Position of the item in the viewport (0 to 1).
371
+ */
164
372
  scrollToItem(params: {
165
- animated?: boolean;
373
+ animated?: boolean | undefined;
166
374
  item: any;
167
- viewPosition?: number;
375
+ viewOffset?: number | undefined;
376
+ viewPosition?: number | undefined;
168
377
  }): void;
378
+ /**
379
+ * Scrolls to a specific offset in pixels.
380
+ * @param params - Parameters for scrolling.
381
+ * @param params.offset - The pixel offset to scroll to.
382
+ * @param params.animated - If true, animates the scroll. Default: true.
383
+ */
169
384
  scrollToOffset(params: {
170
385
  offset: number;
171
- animated?: boolean;
386
+ animated?: boolean | undefined;
172
387
  }): void;
173
388
  };
174
389
  interface ViewToken<ItemT = any> {
@@ -176,13 +391,13 @@ interface ViewToken<ItemT = any> {
176
391
  key: string;
177
392
  index: number;
178
393
  isViewable: boolean;
394
+ containerId: number;
179
395
  }
180
396
  interface ViewAmountToken<ItemT = any> extends ViewToken<ItemT> {
181
397
  sizeVisible: number;
182
398
  size: number;
183
399
  percentVisible: number;
184
400
  percentOfScroller: number;
185
- position: number;
186
401
  scrollSize: number;
187
402
  }
188
403
  interface ViewabilityConfigCallbackPair {
@@ -231,14 +446,68 @@ interface LegendListRecyclingState<T> {
231
446
  index: number;
232
447
  prevIndex: number | undefined;
233
448
  }
449
+ type TypedForwardRef = <T, P = {}>(render: (props: P, ref: React.Ref<T>) => React.ReactNode) => (props: P & React.RefAttributes<T>) => React.ReactNode;
450
+ declare const typedForwardRef: TypedForwardRef;
451
+ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<ComponentProps<T>>, nextProps: Readonly<ComponentProps<T>>) => boolean) => T & {
452
+ displayName?: string;
453
+ };
454
+ declare const typedMemo: TypedMemo;
234
455
 
235
- declare const LegendList: <T>(props: LegendListProps<T> & {
236
- ref?: ForwardedRef<LegendListRef>;
237
- }) => ReactElement;
456
+ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
457
+ alignItemsAtEnd?: boolean;
458
+ columnWrapperStyle?: ColumnWrapperStyle;
459
+ data: readonly T[];
460
+ drawDistance?: number;
461
+ estimatedItemSize?: number;
462
+ extraData?: any;
463
+ getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
464
+ initialContainerPoolRatio?: number | undefined;
465
+ initialScrollOffset?: number;
466
+ initialScrollIndex?: number;
467
+ ItemSeparatorComponent?: React$1.ComponentType<{
468
+ leadingItem: T;
469
+ }> | undefined;
470
+ keyExtractor?: ((item: T, index: number) => string) | undefined;
471
+ ListEmptyComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
472
+ ListFooterComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
473
+ ListFooterComponentStyle?: react_native.StyleProp<ViewStyle> | undefined;
474
+ ListHeaderComponent?: React$1.ComponentType<any> | React$1.ReactElement | null | undefined;
475
+ ListHeaderComponentStyle?: react_native.StyleProp<ViewStyle> | undefined;
476
+ maintainScrollAtEnd?: boolean;
477
+ maintainScrollAtEndThreshold?: number;
478
+ maintainVisibleContentPosition?: boolean;
479
+ numColumns?: number;
480
+ onEndReached?: ((info: {
481
+ distanceFromEnd: number;
482
+ }) => void) | null | undefined;
483
+ onEndReachedThreshold?: number | null | undefined;
484
+ onItemSizeChanged?: ((info: {
485
+ size: number;
486
+ previous: number;
487
+ index: number;
488
+ itemKey: string;
489
+ itemData: T;
490
+ }) => void) | undefined;
491
+ onRefresh?: () => void;
492
+ onStartReached?: ((info: {
493
+ distanceFromStart: number;
494
+ }) => void) | null | undefined;
495
+ onStartReachedThreshold?: number | null | undefined;
496
+ onViewableItemsChanged?: OnViewableItemsChanged | undefined;
497
+ progressViewOffset?: number;
498
+ recycleItems?: boolean;
499
+ refScrollView?: React$1.Ref<ScrollView>;
500
+ refreshing?: boolean;
501
+ renderItem?: ((props: LegendListRenderItemProps<T>) => React$1.ReactNode) | undefined;
502
+ renderScrollComponent?: (props: react_native.ScrollViewProps) => React$1.ReactElement<react_native.ScrollViewProps>;
503
+ viewabilityConfig?: ViewabilityConfig;
504
+ viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
505
+ waitForInitialLayout?: boolean;
506
+ } & React$1.RefAttributes<LegendListRef>) => React$1.ReactNode;
238
507
 
239
508
  declare function useViewability(configId: string, callback: ViewabilityCallback): void;
240
509
  declare function useViewabilityAmount(callback: ViewabilityAmountCallback): void;
241
510
  declare function useRecyclingEffect(effect: (info: LegendListRecyclingState<unknown>) => void | (() => void)): void;
242
- declare function useRecyclingState(valueOrFun: ((info: LegendListRecyclingState<unknown>) => any) | any): [any, react.Dispatch<any>];
511
+ declare function useRecyclingState(valueOrFun: ((info: LegendListRecyclingState<unknown>) => any) | any): [any, React$1.Dispatch<any>];
243
512
 
244
- export { type AnchoredPosition, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };
513
+ export { type AnchoredPosition, type ColumnWrapperStyle, type InternalState, LegendList, type LegendListProps, type LegendListPropsBase, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ScrollState, type TypedForwardRef, type TypedMemo, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange, typedForwardRef, typedMemo, useRecyclingEffect, useRecyclingState, useViewability, useViewabilityAmount };