@legendapp/list 3.0.0-beta.3 → 3.0.0-beta.31
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/CHANGELOG.md +19 -0
- package/README.md +1 -0
- package/animated.native.d.mts +9 -0
- package/animated.native.d.ts +9 -0
- package/animated.native.js +9 -0
- package/animated.native.mjs +7 -0
- package/index.d.mts +797 -10
- package/index.d.ts +797 -10
- package/index.js +1193 -685
- package/index.mjs +1193 -687
- package/index.native.d.mts +797 -10
- package/index.native.d.ts +797 -10
- package/index.native.js +1200 -641
- package/index.native.mjs +1199 -642
- package/keyboard-controller.native.d.mts +12 -0
- package/keyboard-controller.native.d.ts +12 -0
- package/keyboard-controller.native.js +69 -0
- package/keyboard-controller.native.mjs +48 -0
- package/keyboard.d.mts +2 -2
- package/keyboard.d.ts +2 -2
- package/keyboard.js +314 -25
- package/keyboard.mjs +317 -28
- package/keyboard.native.d.mts +13 -0
- package/keyboard.native.d.ts +13 -0
- package/keyboard.native.js +399 -0
- package/keyboard.native.mjs +377 -0
- package/package.json +1 -1
- package/reanimated.d.mts +3 -3
- package/reanimated.d.ts +3 -3
- package/reanimated.js +15 -4
- package/reanimated.mjs +14 -3
- package/reanimated.native.d.mts +18 -0
- package/reanimated.native.d.ts +18 -0
- package/reanimated.native.js +89 -0
- package/reanimated.native.mjs +65 -0
- package/section-list.d.mts +1 -2
- package/section-list.d.ts +1 -2
- package/section-list.js +36 -3678
- package/section-list.mjs +34 -3677
- package/section-list.native.d.mts +1 -2
- package/section-list.native.d.ts +1 -2
- package/section-list.native.js +36 -3458
- package/section-list.native.mjs +33 -3456
- package/types-JPHClxiw.d.mts +0 -670
- package/types-JPHClxiw.d.ts +0 -670
- package/types-YNdphn_A.d.mts +0 -670
- package/types-YNdphn_A.d.ts +0 -670
|
@@ -0,0 +1,377 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { forwardRef, useRef, useState, useCallback, useEffect, useMemo } from 'react';
|
|
3
|
+
import { StyleSheet, Platform } from 'react-native';
|
|
4
|
+
import { useKeyboardHandler } from 'react-native-keyboard-controller';
|
|
5
|
+
import { useAnimatedRef, useSharedValue, useAnimatedScrollHandler, runOnJS, useAnimatedProps, useAnimatedStyle } from 'react-native-reanimated';
|
|
6
|
+
import { AnimatedLegendList } from '@legendapp/list/reanimated';
|
|
7
|
+
|
|
8
|
+
// src/integrations/keyboard.tsx
|
|
9
|
+
|
|
10
|
+
// src/utils/helpers.ts
|
|
11
|
+
function isFunction(obj) {
|
|
12
|
+
return typeof obj === "function";
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
// src/hooks/useCombinedRef.ts
|
|
16
|
+
var useCombinedRef = (...refs) => {
|
|
17
|
+
const callback = useCallback((element) => {
|
|
18
|
+
for (const ref of refs) {
|
|
19
|
+
if (!ref) {
|
|
20
|
+
continue;
|
|
21
|
+
}
|
|
22
|
+
if (isFunction(ref)) {
|
|
23
|
+
ref(element);
|
|
24
|
+
} else {
|
|
25
|
+
ref.current = element;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}, refs);
|
|
29
|
+
return callback;
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
// src/integrations/keyboard.tsx
|
|
33
|
+
var clampProgress = (progress) => {
|
|
34
|
+
"worklet";
|
|
35
|
+
return Math.min(1, Math.max(0, progress));
|
|
36
|
+
};
|
|
37
|
+
var calculateKeyboardInset = (height, safeAreaInsetBottom) => {
|
|
38
|
+
"worklet";
|
|
39
|
+
return Math.max(0, height - safeAreaInsetBottom);
|
|
40
|
+
};
|
|
41
|
+
var calculateEffectiveKeyboardHeight = (keyboardHeight, contentLength, scrollLength, alignItemsAtEnd) => {
|
|
42
|
+
"worklet";
|
|
43
|
+
if (alignItemsAtEnd) {
|
|
44
|
+
return keyboardHeight;
|
|
45
|
+
} else {
|
|
46
|
+
const availableSpace = Math.max(0, scrollLength - contentLength);
|
|
47
|
+
return Math.max(0, keyboardHeight - availableSpace);
|
|
48
|
+
}
|
|
49
|
+
};
|
|
50
|
+
var calculateKeyboardTargetOffset = (startOffset, keyboardHeight, isOpening, progress) => {
|
|
51
|
+
"worklet";
|
|
52
|
+
const normalizedProgress = isOpening ? progress : 1 - progress;
|
|
53
|
+
const delta = (isOpening ? keyboardHeight : -keyboardHeight) * normalizedProgress;
|
|
54
|
+
return Math.max(0, startOffset + delta);
|
|
55
|
+
};
|
|
56
|
+
var KeyboardAvoidingLegendList = forwardRef(function KeyboardAvoidingLegendList2(props, forwardedRef) {
|
|
57
|
+
const {
|
|
58
|
+
contentContainerStyle: contentContainerStyleProp,
|
|
59
|
+
contentInset: contentInsetProp,
|
|
60
|
+
horizontal,
|
|
61
|
+
onMetricsChange: onMetricsChangeProp,
|
|
62
|
+
onScroll: onScrollProp,
|
|
63
|
+
safeAreaInsetBottom = 0,
|
|
64
|
+
style: styleProp,
|
|
65
|
+
...rest
|
|
66
|
+
} = props;
|
|
67
|
+
const { alignItemsAtEnd } = props;
|
|
68
|
+
const styleFlattened = StyleSheet.flatten(styleProp);
|
|
69
|
+
const refLegendList = useRef(null);
|
|
70
|
+
const combinedRef = useCombinedRef(forwardedRef, refLegendList);
|
|
71
|
+
const isIos = Platform.OS === "ios";
|
|
72
|
+
const isAndroid = Platform.OS === "android";
|
|
73
|
+
const scrollViewRef = useAnimatedRef();
|
|
74
|
+
const scrollOffsetY = useSharedValue(0);
|
|
75
|
+
const animatedOffsetY = useSharedValue(null);
|
|
76
|
+
const scrollOffsetAtKeyboardStart = useSharedValue(0);
|
|
77
|
+
const mode = useSharedValue("idle");
|
|
78
|
+
const keyboardInset = useSharedValue(0);
|
|
79
|
+
const keyboardHeight = useSharedValue(0);
|
|
80
|
+
const contentLength = useSharedValue(0);
|
|
81
|
+
const scrollLength = useSharedValue(0);
|
|
82
|
+
const isOpening = useSharedValue(false);
|
|
83
|
+
const didInteractive = useSharedValue(false);
|
|
84
|
+
const shouldUpdateAlignItemsAtEndMinSize = useSharedValue(false);
|
|
85
|
+
const isKeyboardOpen = useSharedValue(false);
|
|
86
|
+
const keyboardInsetRef = useRef(0);
|
|
87
|
+
const [alignItemsAtEndMinSize, setAlignItemsAtEndMinSize] = useState(void 0);
|
|
88
|
+
const scrollHandler = useAnimatedScrollHandler(
|
|
89
|
+
(event) => {
|
|
90
|
+
if (mode.get() !== "running" || didInteractive.get()) {
|
|
91
|
+
scrollOffsetY.set(event.contentOffset[horizontal ? "x" : "y"]);
|
|
92
|
+
}
|
|
93
|
+
if (onScrollProp) {
|
|
94
|
+
runOnJS(onScrollProp)(event);
|
|
95
|
+
}
|
|
96
|
+
},
|
|
97
|
+
[onScrollProp, horizontal]
|
|
98
|
+
);
|
|
99
|
+
const setScrollProcessingEnabled = useCallback(
|
|
100
|
+
(enabled) => {
|
|
101
|
+
var _a;
|
|
102
|
+
return (_a = refLegendList.current) == null ? void 0 : _a.setScrollProcessingEnabled(enabled);
|
|
103
|
+
},
|
|
104
|
+
[refLegendList]
|
|
105
|
+
);
|
|
106
|
+
const reportContentInset = useCallback(
|
|
107
|
+
(bottom) => {
|
|
108
|
+
var _a;
|
|
109
|
+
return (_a = refLegendList.current) == null ? void 0 : _a.reportContentInset({ bottom });
|
|
110
|
+
},
|
|
111
|
+
[refLegendList]
|
|
112
|
+
);
|
|
113
|
+
const clearAlignItemsAtEndMinSize = useCallback(() => {
|
|
114
|
+
setAlignItemsAtEndMinSize((prev) => prev === void 0 ? prev : void 0);
|
|
115
|
+
}, []);
|
|
116
|
+
const updateAlignItemsAtEndMinSize = useCallback(
|
|
117
|
+
(nextKeyboardInset) => {
|
|
118
|
+
var _a;
|
|
119
|
+
if (isAndroid) {
|
|
120
|
+
return;
|
|
121
|
+
}
|
|
122
|
+
if (nextKeyboardInset !== void 0) {
|
|
123
|
+
keyboardInsetRef.current = nextKeyboardInset;
|
|
124
|
+
}
|
|
125
|
+
if (!alignItemsAtEnd || horizontal) {
|
|
126
|
+
clearAlignItemsAtEndMinSize();
|
|
127
|
+
return;
|
|
128
|
+
}
|
|
129
|
+
const state = (_a = refLegendList.current) == null ? void 0 : _a.getState();
|
|
130
|
+
if (!state) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
const currentInset = keyboardInsetRef.current;
|
|
134
|
+
if (currentInset <= 0) {
|
|
135
|
+
clearAlignItemsAtEndMinSize();
|
|
136
|
+
return;
|
|
137
|
+
}
|
|
138
|
+
if (state.scrollLength <= 0) {
|
|
139
|
+
return;
|
|
140
|
+
}
|
|
141
|
+
const nextMinSize = Math.max(0, state.scrollLength - currentInset);
|
|
142
|
+
setAlignItemsAtEndMinSize((prev) => prev === nextMinSize ? prev : nextMinSize);
|
|
143
|
+
},
|
|
144
|
+
[alignItemsAtEnd, clearAlignItemsAtEndMinSize, horizontal]
|
|
145
|
+
);
|
|
146
|
+
const updateScrollMetrics = useCallback(() => {
|
|
147
|
+
var _a;
|
|
148
|
+
const state = (_a = refLegendList.current) == null ? void 0 : _a.getState();
|
|
149
|
+
if (!state) {
|
|
150
|
+
return;
|
|
151
|
+
}
|
|
152
|
+
contentLength.set(state.contentLength);
|
|
153
|
+
scrollLength.set(state.scrollLength);
|
|
154
|
+
updateAlignItemsAtEndMinSize();
|
|
155
|
+
}, [contentLength, scrollLength, updateAlignItemsAtEndMinSize]);
|
|
156
|
+
const handleMetricsChange = useCallback(
|
|
157
|
+
(metrics) => {
|
|
158
|
+
updateScrollMetrics();
|
|
159
|
+
onMetricsChangeProp == null ? void 0 : onMetricsChangeProp(metrics);
|
|
160
|
+
},
|
|
161
|
+
[onMetricsChangeProp, updateScrollMetrics]
|
|
162
|
+
);
|
|
163
|
+
useEffect(() => {
|
|
164
|
+
updateAlignItemsAtEndMinSize();
|
|
165
|
+
}, [updateAlignItemsAtEndMinSize]);
|
|
166
|
+
useKeyboardHandler(
|
|
167
|
+
// biome-ignore assist/source/useSortedKeys: prefer start/move/end
|
|
168
|
+
{
|
|
169
|
+
onStart: (event) => {
|
|
170
|
+
"worklet";
|
|
171
|
+
mode.set("running");
|
|
172
|
+
const progress = clampProgress(event.progress);
|
|
173
|
+
if (isKeyboardOpen.get() && progress >= 1 && event.height > 0) {
|
|
174
|
+
return;
|
|
175
|
+
}
|
|
176
|
+
if (!didInteractive.get()) {
|
|
177
|
+
if (event.height > 0) {
|
|
178
|
+
keyboardHeight.set(event.height - safeAreaInsetBottom);
|
|
179
|
+
}
|
|
180
|
+
const vIsOpening = progress > 0;
|
|
181
|
+
isOpening.set(vIsOpening);
|
|
182
|
+
shouldUpdateAlignItemsAtEndMinSize.set(
|
|
183
|
+
!!alignItemsAtEnd && !horizontal && contentLength.get() < scrollLength.get()
|
|
184
|
+
);
|
|
185
|
+
if (!shouldUpdateAlignItemsAtEndMinSize.get()) {
|
|
186
|
+
runOnJS(clearAlignItemsAtEndMinSize)();
|
|
187
|
+
}
|
|
188
|
+
const vScrollOffset = scrollOffsetY.get();
|
|
189
|
+
scrollOffsetAtKeyboardStart.set(vScrollOffset);
|
|
190
|
+
if (isIos) {
|
|
191
|
+
const vContentLength = contentLength.get();
|
|
192
|
+
const vScrollLength = scrollLength.get();
|
|
193
|
+
const vKeyboardHeight = keyboardHeight.get();
|
|
194
|
+
const vEffectiveKeyboardHeight = calculateEffectiveKeyboardHeight(
|
|
195
|
+
vKeyboardHeight,
|
|
196
|
+
vContentLength,
|
|
197
|
+
vScrollLength,
|
|
198
|
+
alignItemsAtEnd
|
|
199
|
+
);
|
|
200
|
+
const targetOffset = Math.max(
|
|
201
|
+
0,
|
|
202
|
+
vIsOpening ? vScrollOffset + vEffectiveKeyboardHeight : vScrollOffset - vEffectiveKeyboardHeight
|
|
203
|
+
);
|
|
204
|
+
scrollOffsetY.set(targetOffset);
|
|
205
|
+
animatedOffsetY.set(targetOffset);
|
|
206
|
+
keyboardInset.set(vEffectiveKeyboardHeight);
|
|
207
|
+
runOnJS(updateAlignItemsAtEndMinSize)(vEffectiveKeyboardHeight);
|
|
208
|
+
} else if (isAndroid) {
|
|
209
|
+
animatedOffsetY.set(vScrollOffset);
|
|
210
|
+
}
|
|
211
|
+
runOnJS(setScrollProcessingEnabled)(false);
|
|
212
|
+
}
|
|
213
|
+
},
|
|
214
|
+
onInteractive: (event) => {
|
|
215
|
+
"worklet";
|
|
216
|
+
if (mode.get() !== "running") {
|
|
217
|
+
runOnJS(setScrollProcessingEnabled)(false);
|
|
218
|
+
}
|
|
219
|
+
mode.set("running");
|
|
220
|
+
if (!didInteractive.get()) {
|
|
221
|
+
didInteractive.set(true);
|
|
222
|
+
}
|
|
223
|
+
if (isAndroid && !horizontal) {
|
|
224
|
+
const newInset = calculateKeyboardInset(event.height, safeAreaInsetBottom);
|
|
225
|
+
keyboardInset.set(newInset);
|
|
226
|
+
}
|
|
227
|
+
if (shouldUpdateAlignItemsAtEndMinSize.get() && !horizontal && alignItemsAtEnd) {
|
|
228
|
+
const vKeyboardHeight = calculateKeyboardInset(event.height, safeAreaInsetBottom);
|
|
229
|
+
const vEffectiveKeyboardHeight = calculateEffectiveKeyboardHeight(
|
|
230
|
+
vKeyboardHeight,
|
|
231
|
+
contentLength.get(),
|
|
232
|
+
scrollLength.get(),
|
|
233
|
+
alignItemsAtEnd
|
|
234
|
+
);
|
|
235
|
+
runOnJS(updateAlignItemsAtEndMinSize)(vEffectiveKeyboardHeight);
|
|
236
|
+
}
|
|
237
|
+
},
|
|
238
|
+
onMove: (event) => {
|
|
239
|
+
"worklet";
|
|
240
|
+
const vIsOpening = isOpening.get();
|
|
241
|
+
if (isAndroid) {
|
|
242
|
+
if (!didInteractive.get()) {
|
|
243
|
+
const progress = clampProgress(event.progress);
|
|
244
|
+
const vKeyboardHeight = keyboardHeight.get();
|
|
245
|
+
const vEffectiveKeyboardHeight = calculateEffectiveKeyboardHeight(
|
|
246
|
+
vKeyboardHeight,
|
|
247
|
+
contentLength.get(),
|
|
248
|
+
scrollLength.get(),
|
|
249
|
+
alignItemsAtEnd
|
|
250
|
+
);
|
|
251
|
+
const targetOffset = calculateKeyboardTargetOffset(
|
|
252
|
+
scrollOffsetAtKeyboardStart.get(),
|
|
253
|
+
vEffectiveKeyboardHeight,
|
|
254
|
+
vIsOpening,
|
|
255
|
+
progress
|
|
256
|
+
);
|
|
257
|
+
scrollOffsetY.set(targetOffset);
|
|
258
|
+
animatedOffsetY.set(targetOffset);
|
|
259
|
+
}
|
|
260
|
+
if (!horizontal) {
|
|
261
|
+
const newInset = calculateKeyboardInset(event.height, safeAreaInsetBottom);
|
|
262
|
+
keyboardInset.set(newInset);
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
if (!horizontal && alignItemsAtEnd && !vIsOpening && shouldUpdateAlignItemsAtEndMinSize.get()) {
|
|
266
|
+
const vKeyboardHeight = calculateKeyboardInset(event.height, safeAreaInsetBottom);
|
|
267
|
+
const vEffectiveKeyboardHeight = calculateEffectiveKeyboardHeight(
|
|
268
|
+
vKeyboardHeight,
|
|
269
|
+
contentLength.get(),
|
|
270
|
+
scrollLength.get(),
|
|
271
|
+
alignItemsAtEnd
|
|
272
|
+
);
|
|
273
|
+
runOnJS(updateAlignItemsAtEndMinSize)(vEffectiveKeyboardHeight);
|
|
274
|
+
}
|
|
275
|
+
},
|
|
276
|
+
onEnd: (event) => {
|
|
277
|
+
"worklet";
|
|
278
|
+
const wasInteractive = didInteractive.get();
|
|
279
|
+
const vMode = mode.get();
|
|
280
|
+
mode.set("idle");
|
|
281
|
+
if (vMode === "running") {
|
|
282
|
+
const progress = clampProgress(event.progress);
|
|
283
|
+
const vKeyboardHeight = keyboardHeight.get();
|
|
284
|
+
const vEffectiveKeyboardHeight = calculateEffectiveKeyboardHeight(
|
|
285
|
+
vKeyboardHeight,
|
|
286
|
+
contentLength.get(),
|
|
287
|
+
scrollLength.get(),
|
|
288
|
+
alignItemsAtEnd
|
|
289
|
+
);
|
|
290
|
+
const vIsOpening = isOpening.get();
|
|
291
|
+
if (!wasInteractive) {
|
|
292
|
+
const targetOffset = calculateKeyboardTargetOffset(
|
|
293
|
+
scrollOffsetAtKeyboardStart.get(),
|
|
294
|
+
vEffectiveKeyboardHeight,
|
|
295
|
+
vIsOpening,
|
|
296
|
+
progress
|
|
297
|
+
);
|
|
298
|
+
scrollOffsetY.set(targetOffset);
|
|
299
|
+
animatedOffsetY.set(targetOffset);
|
|
300
|
+
}
|
|
301
|
+
runOnJS(setScrollProcessingEnabled)(true);
|
|
302
|
+
didInteractive.set(false);
|
|
303
|
+
isKeyboardOpen.set(event.height > 0);
|
|
304
|
+
if (!horizontal) {
|
|
305
|
+
const newInset = calculateKeyboardInset(event.height, safeAreaInsetBottom);
|
|
306
|
+
keyboardInset.set(newInset);
|
|
307
|
+
runOnJS(reportContentInset)(newInset);
|
|
308
|
+
if (!vIsOpening) {
|
|
309
|
+
runOnJS(updateAlignItemsAtEndMinSize)(newInset);
|
|
310
|
+
}
|
|
311
|
+
if (newInset <= 0) {
|
|
312
|
+
animatedOffsetY.set(scrollOffsetY.get());
|
|
313
|
+
}
|
|
314
|
+
}
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
},
|
|
318
|
+
[alignItemsAtEnd, horizontal, safeAreaInsetBottom, scrollViewRef]
|
|
319
|
+
);
|
|
320
|
+
const animatedProps = useAnimatedProps(() => {
|
|
321
|
+
"worklet";
|
|
322
|
+
var _a, _b, _c, _d;
|
|
323
|
+
const vAnimatedOffsetY = animatedOffsetY.get();
|
|
324
|
+
const baseProps = {
|
|
325
|
+
contentOffset: vAnimatedOffsetY === null ? void 0 : {
|
|
326
|
+
x: 0,
|
|
327
|
+
y: vAnimatedOffsetY
|
|
328
|
+
}
|
|
329
|
+
};
|
|
330
|
+
if (isIos) {
|
|
331
|
+
const keyboardInsetBottom = keyboardInset.get();
|
|
332
|
+
const contentInset = {
|
|
333
|
+
bottom: ((_a = contentInsetProp == null ? void 0 : contentInsetProp.bottom) != null ? _a : 0) + (horizontal ? 0 : keyboardInsetBottom),
|
|
334
|
+
left: (_b = contentInsetProp == null ? void 0 : contentInsetProp.left) != null ? _b : 0,
|
|
335
|
+
right: (_c = contentInsetProp == null ? void 0 : contentInsetProp.right) != null ? _c : 0,
|
|
336
|
+
top: (_d = contentInsetProp == null ? void 0 : contentInsetProp.top) != null ? _d : 0
|
|
337
|
+
};
|
|
338
|
+
return Object.assign(baseProps, {
|
|
339
|
+
contentInset
|
|
340
|
+
});
|
|
341
|
+
} else {
|
|
342
|
+
return baseProps;
|
|
343
|
+
}
|
|
344
|
+
});
|
|
345
|
+
const style = isAndroid ? useAnimatedStyle(
|
|
346
|
+
() => ({
|
|
347
|
+
...styleFlattened || {},
|
|
348
|
+
marginBottom: keyboardInset.get()
|
|
349
|
+
}),
|
|
350
|
+
[styleProp, keyboardInset]
|
|
351
|
+
) : void 0;
|
|
352
|
+
const contentContainerStyle = useMemo(() => {
|
|
353
|
+
if (alignItemsAtEndMinSize === void 0) {
|
|
354
|
+
return contentContainerStyleProp;
|
|
355
|
+
}
|
|
356
|
+
const minSizeStyle = horizontal ? { minWidth: alignItemsAtEndMinSize } : { minHeight: alignItemsAtEndMinSize };
|
|
357
|
+
return contentContainerStyleProp ? [contentContainerStyleProp, minSizeStyle] : minSizeStyle;
|
|
358
|
+
}, [alignItemsAtEndMinSize, contentContainerStyleProp, horizontal]);
|
|
359
|
+
return /* @__PURE__ */ React.createElement(
|
|
360
|
+
AnimatedLegendList,
|
|
361
|
+
{
|
|
362
|
+
...rest,
|
|
363
|
+
animatedProps,
|
|
364
|
+
automaticallyAdjustContentInsets: false,
|
|
365
|
+
contentContainerStyle,
|
|
366
|
+
keyboardDismissMode: "interactive",
|
|
367
|
+
onMetricsChange: handleMetricsChange,
|
|
368
|
+
onScroll: scrollHandler,
|
|
369
|
+
ref: combinedRef,
|
|
370
|
+
refScrollView: scrollViewRef,
|
|
371
|
+
scrollIndicatorInsets: { bottom: 0, top: 0 },
|
|
372
|
+
style
|
|
373
|
+
}
|
|
374
|
+
);
|
|
375
|
+
});
|
|
376
|
+
|
|
377
|
+
export { KeyboardAvoidingLegendList, KeyboardAvoidingLegendList as LegendList };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@legendapp/list",
|
|
3
|
-
"version": "3.0.0-beta.
|
|
3
|
+
"version": "3.0.0-beta.31",
|
|
4
4
|
"description": "Legend List is a drop-in replacement for FlatList with much better performance and supporting dynamically sized items.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"private": false,
|
package/reanimated.d.mts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ComponentProps } from 'react';
|
|
3
|
-
import
|
|
3
|
+
import Reanimated from 'react-native-reanimated';
|
|
4
4
|
import { LegendListPropsBase, LegendListRef } from '@legendapp/list';
|
|
5
5
|
|
|
6
6
|
type KeysToOmit = "getEstimatedItemSize" | "getFixedItemSize" | "getItemType" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged" | "itemsAreEqual" | "ItemSeparatorComponent";
|
|
7
|
-
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof
|
|
7
|
+
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Reanimated.ScrollView>>;
|
|
8
8
|
interface AnimatedLegendListPropsBase<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
9
|
-
refScrollView?: React.Ref<
|
|
9
|
+
refScrollView?: React.Ref<Reanimated.ScrollView>;
|
|
10
10
|
}
|
|
11
11
|
type OtherAnimatedLegendListProps<ItemT> = Pick<PropsBase<ItemT>, KeysToOmit>;
|
|
12
12
|
type AnimatedLegendListProps<ItemT> = Omit<AnimatedLegendListPropsBase<ItemT>, "refLegendList" | "ref"> & OtherAnimatedLegendListProps<ItemT>;
|
package/reanimated.d.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ComponentProps } from 'react';
|
|
3
|
-
import
|
|
3
|
+
import Reanimated from 'react-native-reanimated';
|
|
4
4
|
import { LegendListPropsBase, LegendListRef } from '@legendapp/list';
|
|
5
5
|
|
|
6
6
|
type KeysToOmit = "getEstimatedItemSize" | "getFixedItemSize" | "getItemType" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged" | "itemsAreEqual" | "ItemSeparatorComponent";
|
|
7
|
-
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof
|
|
7
|
+
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Reanimated.ScrollView>>;
|
|
8
8
|
interface AnimatedLegendListPropsBase<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
9
|
-
refScrollView?: React.Ref<
|
|
9
|
+
refScrollView?: React.Ref<Reanimated.ScrollView>;
|
|
10
10
|
}
|
|
11
11
|
type OtherAnimatedLegendListProps<ItemT> = Pick<PropsBase<ItemT>, KeysToOmit>;
|
|
12
12
|
type AnimatedLegendListProps<ItemT> = Omit<AnimatedLegendListPropsBase<ItemT>, "refLegendList" | "ref"> & OtherAnimatedLegendListProps<ItemT>;
|
package/reanimated.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
|
-
var
|
|
4
|
+
var Reanimated = require('react-native-reanimated');
|
|
5
5
|
var list = require('@legendapp/list');
|
|
6
6
|
|
|
7
7
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -25,7 +25,7 @@ function _interopNamespace(e) {
|
|
|
25
25
|
}
|
|
26
26
|
|
|
27
27
|
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
28
|
-
var
|
|
28
|
+
var Reanimated__default = /*#__PURE__*/_interopDefault(Reanimated);
|
|
29
29
|
|
|
30
30
|
// src/integrations/reanimated.tsx
|
|
31
31
|
|
|
@@ -54,6 +54,7 @@ var useCombinedRef = (...refs) => {
|
|
|
54
54
|
// src/integrations/reanimated.tsx
|
|
55
55
|
var typedMemo = React.memo;
|
|
56
56
|
var LegendListForwardedRef = typedMemo(
|
|
57
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
57
58
|
React__namespace.forwardRef(function LegendListForwardedRef2(props, ref) {
|
|
58
59
|
const { refLegendList, ...rest } = props;
|
|
59
60
|
const refFn = React.useCallback(
|
|
@@ -65,13 +66,23 @@ var LegendListForwardedRef = typedMemo(
|
|
|
65
66
|
return /* @__PURE__ */ React__namespace.createElement(list.LegendList, { ref: refFn, refScrollView: ref, ...rest });
|
|
66
67
|
})
|
|
67
68
|
);
|
|
68
|
-
var AnimatedLegendListComponent =
|
|
69
|
+
var AnimatedLegendListComponent = Reanimated__default.default.createAnimatedComponent(LegendListForwardedRef);
|
|
69
70
|
var AnimatedLegendList = typedMemo(
|
|
71
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
70
72
|
React__namespace.forwardRef(function AnimatedLegendList2(props, ref) {
|
|
71
73
|
const { refScrollView, ...rest } = props;
|
|
74
|
+
const { animatedProps } = props;
|
|
72
75
|
const refLegendList = React__namespace.useRef(null);
|
|
73
76
|
const combinedRef = useCombinedRef(refLegendList, ref);
|
|
74
|
-
return /* @__PURE__ */ React__namespace.createElement(
|
|
77
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
78
|
+
AnimatedLegendListComponent,
|
|
79
|
+
{
|
|
80
|
+
animatedPropsInternal: animatedProps,
|
|
81
|
+
ref: refScrollView,
|
|
82
|
+
refLegendList: combinedRef,
|
|
83
|
+
...rest
|
|
84
|
+
}
|
|
85
|
+
);
|
|
75
86
|
})
|
|
76
87
|
);
|
|
77
88
|
|
package/reanimated.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useCallback, memo } from 'react';
|
|
3
|
-
import
|
|
3
|
+
import Reanimated from 'react-native-reanimated';
|
|
4
4
|
import { LegendList } from '@legendapp/list';
|
|
5
5
|
|
|
6
6
|
// src/integrations/reanimated.tsx
|
|
@@ -30,6 +30,7 @@ var useCombinedRef = (...refs) => {
|
|
|
30
30
|
// src/integrations/reanimated.tsx
|
|
31
31
|
var typedMemo = memo;
|
|
32
32
|
var LegendListForwardedRef = typedMemo(
|
|
33
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
33
34
|
React.forwardRef(function LegendListForwardedRef2(props, ref) {
|
|
34
35
|
const { refLegendList, ...rest } = props;
|
|
35
36
|
const refFn = useCallback(
|
|
@@ -41,13 +42,23 @@ var LegendListForwardedRef = typedMemo(
|
|
|
41
42
|
return /* @__PURE__ */ React.createElement(LegendList, { ref: refFn, refScrollView: ref, ...rest });
|
|
42
43
|
})
|
|
43
44
|
);
|
|
44
|
-
var AnimatedLegendListComponent =
|
|
45
|
+
var AnimatedLegendListComponent = Reanimated.createAnimatedComponent(LegendListForwardedRef);
|
|
45
46
|
var AnimatedLegendList = typedMemo(
|
|
47
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
46
48
|
React.forwardRef(function AnimatedLegendList2(props, ref) {
|
|
47
49
|
const { refScrollView, ...rest } = props;
|
|
50
|
+
const { animatedProps } = props;
|
|
48
51
|
const refLegendList = React.useRef(null);
|
|
49
52
|
const combinedRef = useCombinedRef(refLegendList, ref);
|
|
50
|
-
return /* @__PURE__ */ React.createElement(
|
|
53
|
+
return /* @__PURE__ */ React.createElement(
|
|
54
|
+
AnimatedLegendListComponent,
|
|
55
|
+
{
|
|
56
|
+
animatedPropsInternal: animatedProps,
|
|
57
|
+
ref: refScrollView,
|
|
58
|
+
refLegendList: combinedRef,
|
|
59
|
+
...rest
|
|
60
|
+
}
|
|
61
|
+
);
|
|
51
62
|
})
|
|
52
63
|
);
|
|
53
64
|
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
import Reanimated from 'react-native-reanimated';
|
|
4
|
+
import { LegendListPropsBase, LegendListRef } from '@legendapp/list';
|
|
5
|
+
|
|
6
|
+
type KeysToOmit = "getEstimatedItemSize" | "getFixedItemSize" | "getItemType" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged" | "itemsAreEqual" | "ItemSeparatorComponent";
|
|
7
|
+
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Reanimated.ScrollView>>;
|
|
8
|
+
interface AnimatedLegendListPropsBase<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
9
|
+
refScrollView?: React.Ref<Reanimated.ScrollView>;
|
|
10
|
+
}
|
|
11
|
+
type OtherAnimatedLegendListProps<ItemT> = Pick<PropsBase<ItemT>, KeysToOmit>;
|
|
12
|
+
type AnimatedLegendListProps<ItemT> = Omit<AnimatedLegendListPropsBase<ItemT>, "refLegendList" | "ref"> & OtherAnimatedLegendListProps<ItemT>;
|
|
13
|
+
type AnimatedLegendListDefinition = <ItemT>(props: AnimatedLegendListProps<ItemT> & {
|
|
14
|
+
ref?: React.Ref<LegendListRef>;
|
|
15
|
+
}) => React.ReactElement | null;
|
|
16
|
+
declare const AnimatedLegendList: AnimatedLegendListDefinition;
|
|
17
|
+
|
|
18
|
+
export { AnimatedLegendList, type AnimatedLegendListProps, type AnimatedLegendListPropsBase };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
import Reanimated from 'react-native-reanimated';
|
|
4
|
+
import { LegendListPropsBase, LegendListRef } from '@legendapp/list';
|
|
5
|
+
|
|
6
|
+
type KeysToOmit = "getEstimatedItemSize" | "getFixedItemSize" | "getItemType" | "keyExtractor" | "animatedProps" | "renderItem" | "onItemSizeChanged" | "itemsAreEqual" | "ItemSeparatorComponent";
|
|
7
|
+
type PropsBase<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof Reanimated.ScrollView>>;
|
|
8
|
+
interface AnimatedLegendListPropsBase<ItemT> extends Omit<PropsBase<ItemT>, KeysToOmit> {
|
|
9
|
+
refScrollView?: React.Ref<Reanimated.ScrollView>;
|
|
10
|
+
}
|
|
11
|
+
type OtherAnimatedLegendListProps<ItemT> = Pick<PropsBase<ItemT>, KeysToOmit>;
|
|
12
|
+
type AnimatedLegendListProps<ItemT> = Omit<AnimatedLegendListPropsBase<ItemT>, "refLegendList" | "ref"> & OtherAnimatedLegendListProps<ItemT>;
|
|
13
|
+
type AnimatedLegendListDefinition = <ItemT>(props: AnimatedLegendListProps<ItemT> & {
|
|
14
|
+
ref?: React.Ref<LegendListRef>;
|
|
15
|
+
}) => React.ReactElement | null;
|
|
16
|
+
declare const AnimatedLegendList: AnimatedLegendListDefinition;
|
|
17
|
+
|
|
18
|
+
export { AnimatedLegendList, type AnimatedLegendListProps, type AnimatedLegendListPropsBase };
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var Reanimated = require('react-native-reanimated');
|
|
5
|
+
var list = require('@legendapp/list');
|
|
6
|
+
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
function _interopNamespace(e) {
|
|
10
|
+
if (e && e.__esModule) return e;
|
|
11
|
+
var n = Object.create(null);
|
|
12
|
+
if (e) {
|
|
13
|
+
Object.keys(e).forEach(function (k) {
|
|
14
|
+
if (k !== 'default') {
|
|
15
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
16
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () { return e[k]; }
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
n.default = e;
|
|
24
|
+
return Object.freeze(n);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
28
|
+
var Reanimated__default = /*#__PURE__*/_interopDefault(Reanimated);
|
|
29
|
+
|
|
30
|
+
// src/integrations/reanimated.tsx
|
|
31
|
+
|
|
32
|
+
// src/utils/helpers.ts
|
|
33
|
+
function isFunction(obj) {
|
|
34
|
+
return typeof obj === "function";
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
// src/hooks/useCombinedRef.ts
|
|
38
|
+
var useCombinedRef = (...refs) => {
|
|
39
|
+
const callback = React.useCallback((element) => {
|
|
40
|
+
for (const ref of refs) {
|
|
41
|
+
if (!ref) {
|
|
42
|
+
continue;
|
|
43
|
+
}
|
|
44
|
+
if (isFunction(ref)) {
|
|
45
|
+
ref(element);
|
|
46
|
+
} else {
|
|
47
|
+
ref.current = element;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}, refs);
|
|
51
|
+
return callback;
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
// src/integrations/reanimated.tsx
|
|
55
|
+
var typedMemo = React.memo;
|
|
56
|
+
var LegendListForwardedRef = typedMemo(
|
|
57
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
58
|
+
React__namespace.forwardRef(function LegendListForwardedRef2(props, ref) {
|
|
59
|
+
const { refLegendList, ...rest } = props;
|
|
60
|
+
const refFn = React.useCallback(
|
|
61
|
+
(r) => {
|
|
62
|
+
refLegendList(r);
|
|
63
|
+
},
|
|
64
|
+
[refLegendList]
|
|
65
|
+
);
|
|
66
|
+
return /* @__PURE__ */ React__namespace.createElement(list.LegendList, { ref: refFn, refScrollView: ref, ...rest });
|
|
67
|
+
})
|
|
68
|
+
);
|
|
69
|
+
var AnimatedLegendListComponent = Reanimated__default.default.createAnimatedComponent(LegendListForwardedRef);
|
|
70
|
+
var AnimatedLegendList = typedMemo(
|
|
71
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
72
|
+
React__namespace.forwardRef(function AnimatedLegendList2(props, ref) {
|
|
73
|
+
const { refScrollView, ...rest } = props;
|
|
74
|
+
const { animatedProps } = props;
|
|
75
|
+
const refLegendList = React__namespace.useRef(null);
|
|
76
|
+
const combinedRef = useCombinedRef(refLegendList, ref);
|
|
77
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
78
|
+
AnimatedLegendListComponent,
|
|
79
|
+
{
|
|
80
|
+
animatedPropsInternal: animatedProps,
|
|
81
|
+
ref: refScrollView,
|
|
82
|
+
refLegendList: combinedRef,
|
|
83
|
+
...rest
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
})
|
|
87
|
+
);
|
|
88
|
+
|
|
89
|
+
exports.AnimatedLegendList = AnimatedLegendList;
|