@legendapp/list 3.0.0-beta.5 → 3.0.0-beta.51
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/.DS_Store +0 -0
- package/CHANGELOG.md +19 -0
- package/README.md +9 -2
- package/animated.d.ts +657 -5
- package/animated.js +2 -2
- package/animated.mjs +1 -1
- package/index.d.ts +1316 -11
- package/index.js +4023 -1277
- package/index.mjs +4022 -1278
- package/index.native.js +3784 -1333
- package/index.native.mjs +3772 -1323
- package/keyboard-chat.d.ts +228 -0
- package/keyboard-chat.js +105 -0
- package/keyboard-chat.mjs +84 -0
- package/keyboard-test.d.ts +216 -0
- package/keyboard-test.js +52 -0
- package/keyboard-test.mjs +31 -0
- package/keyboard.d.ts +216 -8
- package/keyboard.js +355 -64
- package/keyboard.mjs +358 -66
- package/package.json +68 -1
- package/{types-YNdphn_A.d.mts → react-native.d.ts} +306 -263
- package/react-native.js +6019 -0
- package/react-native.mjs +5990 -0
- package/{types-YNdphn_A.d.ts → react-native.web.d.ts} +367 -261
- package/react-native.web.js +6553 -0
- package/react-native.web.mjs +6524 -0
- package/react.d.ts +776 -0
- package/react.js +6553 -0
- package/react.mjs +6524 -0
- package/reanimated.d.ts +679 -8
- package/reanimated.js +226 -29
- package/reanimated.mjs +228 -31
- package/section-list.d.ts +661 -5
- package/section-list.js +50 -3675
- package/section-list.mjs +48 -3674
- package/animated.d.mts +0 -9
- package/index.d.mts +0 -23
- package/index.native.d.mts +0 -23
- package/index.native.d.ts +0 -23
- package/keyboard-controller.d.mts +0 -12
- package/keyboard-controller.d.ts +0 -12
- package/keyboard-controller.js +0 -69
- package/keyboard-controller.mjs +0 -48
- package/keyboard.d.mts +0 -13
- package/reanimated.d.mts +0 -18
- package/section-list.d.mts +0 -113
- package/section-list.native.d.mts +0 -113
- package/section-list.native.d.ts +0 -113
- package/section-list.native.js +0 -3711
- package/section-list.native.mjs +0 -3690
package/reanimated.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
|
+
var reactNative$1 = require('react-native');
|
|
4
5
|
var Reanimated = require('react-native-reanimated');
|
|
5
|
-
var
|
|
6
|
+
var reactNative = require('@legendapp/list/react-native');
|
|
6
7
|
|
|
7
8
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
9
|
|
|
@@ -28,50 +29,246 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
|
28
29
|
var Reanimated__default = /*#__PURE__*/_interopDefault(Reanimated);
|
|
29
30
|
|
|
30
31
|
// src/integrations/reanimated.tsx
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
32
|
+
var {
|
|
33
|
+
POSITION_OUT_OF_VIEW,
|
|
34
|
+
IsNewArchitecture,
|
|
35
|
+
getStickyPushLimit,
|
|
36
|
+
typedMemo,
|
|
37
|
+
useArr$,
|
|
38
|
+
useCombinedRef,
|
|
39
|
+
getComponent
|
|
40
|
+
} = reactNative.internal;
|
|
41
|
+
var { peek$, useStateContext } = reactNative.internal;
|
|
42
|
+
var ReanimatedScrollBridge = typedMemo(function ReanimatedScrollBridgeComponent({
|
|
43
|
+
forwardedRef,
|
|
44
|
+
scrollOffset,
|
|
45
|
+
renderScrollComponent,
|
|
46
|
+
...props
|
|
47
|
+
}) {
|
|
48
|
+
const animatedScrollRef = Reanimated.useAnimatedRef();
|
|
49
|
+
Reanimated.useScrollViewOffset(animatedScrollRef, scrollOffset);
|
|
50
|
+
const combinedRef = useCombinedRef(animatedScrollRef, forwardedRef);
|
|
51
|
+
const ScrollComponent = React__namespace.useMemo(
|
|
52
|
+
() => renderScrollComponent ? React__namespace.forwardRef(
|
|
53
|
+
(scrollViewProps, ref) => renderScrollComponent({ ...scrollViewProps, ref })
|
|
54
|
+
) : Reanimated__default.default.ScrollView,
|
|
55
|
+
[renderScrollComponent]
|
|
56
|
+
);
|
|
57
|
+
return /* @__PURE__ */ React__namespace.createElement(ScrollComponent, { ...props, ref: combinedRef });
|
|
58
|
+
});
|
|
59
|
+
var StickyOverlay = typedMemo(function StickyOverlayComponent({ stickyHeaderConfig }) {
|
|
60
|
+
if (!(stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent)) {
|
|
61
|
+
return null;
|
|
62
|
+
}
|
|
63
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
64
|
+
reactNative$1.View,
|
|
65
|
+
{
|
|
66
|
+
style: {
|
|
67
|
+
inset: 0,
|
|
68
|
+
pointerEvents: "none",
|
|
69
|
+
position: "absolute"
|
|
48
70
|
}
|
|
71
|
+
},
|
|
72
|
+
getComponent(stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent)
|
|
73
|
+
);
|
|
74
|
+
});
|
|
75
|
+
var ReanimatedPositionViewSticky = typedMemo(function ReanimatedPositionViewStickyComponent(props) {
|
|
76
|
+
var _a;
|
|
77
|
+
const ctx = useStateContext();
|
|
78
|
+
const { id, horizontal, style, refView, stickyScrollOffset, stickyHeaderConfig, index, children, ...rest } = props;
|
|
79
|
+
const [position = POSITION_OUT_OF_VIEW, headerSize = 0, stylePaddingTop = 0, itemKey, _totalSize = 0] = useArr$([
|
|
80
|
+
`containerPosition${id}`,
|
|
81
|
+
"headerSize",
|
|
82
|
+
"stylePaddingTop",
|
|
83
|
+
`containerItemKey${id}`,
|
|
84
|
+
"totalSize"
|
|
85
|
+
]);
|
|
86
|
+
const pushLimit = React__namespace.useMemo(
|
|
87
|
+
() => getStickyPushLimit(ctx.state, index, itemKey),
|
|
88
|
+
[ctx.state, index, itemKey, _totalSize]
|
|
89
|
+
);
|
|
90
|
+
const stickyOffset = (_a = stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset) != null ? _a : 0;
|
|
91
|
+
const stickyStart = position + headerSize + stylePaddingTop - stickyOffset;
|
|
92
|
+
const stickyPositionStyle = Reanimated.useAnimatedStyle(() => {
|
|
93
|
+
const delta = Math.max(0, stickyScrollOffset.value - stickyStart);
|
|
94
|
+
const stickyPosition = position + delta;
|
|
95
|
+
const resolvedPosition = pushLimit !== void 0 ? Math.min(stickyPosition, pushLimit) : stickyPosition;
|
|
96
|
+
return horizontal ? { transform: [{ translateX: resolvedPosition }] } : { transform: [{ translateY: resolvedPosition }] };
|
|
97
|
+
}, [horizontal, position, pushLimit, stickyStart]);
|
|
98
|
+
const viewStyle = React__namespace.useMemo(
|
|
99
|
+
() => [style, { zIndex: index + 1e3 }, stickyPositionStyle],
|
|
100
|
+
[index, stickyPositionStyle, style]
|
|
101
|
+
);
|
|
102
|
+
return /* @__PURE__ */ React__namespace.createElement(Reanimated__default.default.View, { ref: refView, style: viewStyle, ...rest }, /* @__PURE__ */ React__namespace.createElement(StickyOverlay, { stickyHeaderConfig }), children);
|
|
103
|
+
});
|
|
104
|
+
var ReanimatedPositionView = typedMemo(function ReanimatedPositionViewComponent(props) {
|
|
105
|
+
const ctx = useStateContext();
|
|
106
|
+
const { id, horizontal, style, refView, children, recycleItems, layoutTransition, ...rest } = props;
|
|
107
|
+
const [positionValue = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
|
|
108
|
+
const prevItemKeyRef = React__namespace.useRef(void 0);
|
|
109
|
+
let shouldSkipTransitionForRecycleReuse = false;
|
|
110
|
+
if (recycleItems && layoutTransition) {
|
|
111
|
+
const itemKeySignal = `containerItemKey${id}`;
|
|
112
|
+
const itemKey = peek$(ctx, itemKeySignal);
|
|
113
|
+
shouldSkipTransitionForRecycleReuse = itemKey !== void 0 && prevItemKeyRef.current !== void 0 && prevItemKeyRef.current !== itemKey;
|
|
114
|
+
if (itemKey !== void 0) {
|
|
115
|
+
prevItemKeyRef.current = itemKey;
|
|
49
116
|
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
117
|
+
} else {
|
|
118
|
+
prevItemKeyRef.current = void 0;
|
|
119
|
+
}
|
|
120
|
+
const viewStyle = React__namespace.useMemo(
|
|
121
|
+
() => [style, horizontal ? { left: positionValue } : { top: positionValue }],
|
|
122
|
+
[horizontal, positionValue, style]
|
|
123
|
+
);
|
|
124
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
125
|
+
Reanimated__default.default.View,
|
|
126
|
+
{
|
|
127
|
+
layout: shouldSkipTransitionForRecycleReuse ? void 0 : layoutTransition,
|
|
128
|
+
ref: refView,
|
|
129
|
+
style: viewStyle,
|
|
130
|
+
...rest
|
|
131
|
+
},
|
|
132
|
+
children
|
|
133
|
+
);
|
|
134
|
+
});
|
|
135
|
+
function setSharedValueValue(sharedValue, value) {
|
|
136
|
+
if (!sharedValue) {
|
|
137
|
+
return;
|
|
138
|
+
}
|
|
139
|
+
const sharedValueWithMethods = sharedValue;
|
|
140
|
+
if (typeof sharedValueWithMethods.set === "function") {
|
|
141
|
+
sharedValueWithMethods.set(value);
|
|
142
|
+
} else {
|
|
143
|
+
sharedValueWithMethods.value = value;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
function useAnimatedLegendListSharedValuesSync(legendList, sharedValues) {
|
|
147
|
+
React__namespace.useEffect(() => {
|
|
148
|
+
if (!legendList || !sharedValues) {
|
|
149
|
+
return;
|
|
150
|
+
}
|
|
151
|
+
const state = legendList.getState();
|
|
152
|
+
setSharedValueValue(sharedValues.activeStickyIndex, state.activeStickyIndex);
|
|
153
|
+
setSharedValueValue(sharedValues.isAtEnd, state.isAtEnd);
|
|
154
|
+
setSharedValueValue(sharedValues.isAtStart, state.isAtStart);
|
|
155
|
+
setSharedValueValue(sharedValues.isNearEnd, state.isNearEnd);
|
|
156
|
+
setSharedValueValue(sharedValues.isNearStart, state.isNearStart);
|
|
157
|
+
setSharedValueValue(
|
|
158
|
+
sharedValues.isWithinMaintainScrollAtEndThreshold,
|
|
159
|
+
state.isWithinMaintainScrollAtEndThreshold
|
|
160
|
+
);
|
|
161
|
+
setSharedValueValue(sharedValues.scrollOffset, state.scroll);
|
|
162
|
+
const unsubscribers = [
|
|
163
|
+
sharedValues.activeStickyIndex ? state.listen(
|
|
164
|
+
"activeStickyIndex",
|
|
165
|
+
(value) => setSharedValueValue(sharedValues.activeStickyIndex, value)
|
|
166
|
+
) : void 0,
|
|
167
|
+
sharedValues.isAtEnd ? state.listen("isAtEnd", (value) => setSharedValueValue(sharedValues.isAtEnd, value)) : void 0,
|
|
168
|
+
sharedValues.isAtStart ? state.listen("isAtStart", (value) => setSharedValueValue(sharedValues.isAtStart, value)) : void 0,
|
|
169
|
+
sharedValues.isNearEnd ? state.listen("isNearEnd", (value) => setSharedValueValue(sharedValues.isNearEnd, value)) : void 0,
|
|
170
|
+
sharedValues.isNearStart ? state.listen("isNearStart", (value) => setSharedValueValue(sharedValues.isNearStart, value)) : void 0,
|
|
171
|
+
sharedValues.isWithinMaintainScrollAtEndThreshold ? state.listen(
|
|
172
|
+
"isWithinMaintainScrollAtEndThreshold",
|
|
173
|
+
(value) => setSharedValueValue(sharedValues.isWithinMaintainScrollAtEndThreshold, value)
|
|
174
|
+
) : void 0
|
|
175
|
+
];
|
|
176
|
+
return () => {
|
|
177
|
+
for (const unsubscribe of unsubscribers) {
|
|
178
|
+
unsubscribe == null ? void 0 : unsubscribe();
|
|
179
|
+
}
|
|
180
|
+
};
|
|
181
|
+
}, [legendList, sharedValues]);
|
|
182
|
+
}
|
|
56
183
|
var LegendListForwardedRef = typedMemo(
|
|
184
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
57
185
|
React__namespace.forwardRef(function LegendListForwardedRef2(props, ref) {
|
|
58
|
-
|
|
186
|
+
var _a;
|
|
187
|
+
const { itemLayoutAnimation, recycleItems, refLegendList, renderScrollComponent, sharedValues, ...rest } = props;
|
|
59
188
|
const refFn = React.useCallback(
|
|
60
189
|
(r) => {
|
|
61
190
|
refLegendList(r);
|
|
62
191
|
},
|
|
63
192
|
[refLegendList]
|
|
64
193
|
);
|
|
65
|
-
|
|
194
|
+
const internalScrollOffset = Reanimated.useSharedValue(0);
|
|
195
|
+
const scrollOffset = (_a = sharedValues == null ? void 0 : sharedValues.scrollOffset) != null ? _a : internalScrollOffset;
|
|
196
|
+
const renderScrollComponentForBridge = React__namespace.useMemo(
|
|
197
|
+
() => renderScrollComponent ? (scrollViewProps) => renderScrollComponent(scrollViewProps) : void 0,
|
|
198
|
+
[renderScrollComponent]
|
|
199
|
+
);
|
|
200
|
+
const renderReanimatedScrollComponent = React.useCallback(
|
|
201
|
+
(scrollViewProps) => {
|
|
202
|
+
const { ref: forwardedRef, ...restScrollViewProps } = scrollViewProps;
|
|
203
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
204
|
+
ReanimatedScrollBridge,
|
|
205
|
+
{
|
|
206
|
+
...restScrollViewProps,
|
|
207
|
+
forwardedRef,
|
|
208
|
+
renderScrollComponent: renderScrollComponentForBridge,
|
|
209
|
+
scrollOffset
|
|
210
|
+
}
|
|
211
|
+
);
|
|
212
|
+
},
|
|
213
|
+
[renderScrollComponentForBridge, scrollOffset]
|
|
214
|
+
);
|
|
215
|
+
const stickyPositionComponentInternal = React__namespace.useMemo(
|
|
216
|
+
() => function StickyPositionComponent(stickyProps) {
|
|
217
|
+
return /* @__PURE__ */ React__namespace.createElement(ReanimatedPositionViewSticky, { ...stickyProps, stickyScrollOffset: scrollOffset });
|
|
218
|
+
},
|
|
219
|
+
[scrollOffset]
|
|
220
|
+
);
|
|
221
|
+
const itemLayoutAnimationRef = React__namespace.useRef(itemLayoutAnimation);
|
|
222
|
+
itemLayoutAnimationRef.current = itemLayoutAnimation;
|
|
223
|
+
const hasItemLayoutAnimation = !!itemLayoutAnimation;
|
|
224
|
+
const positionComponentInternal = React__namespace.useMemo(() => {
|
|
225
|
+
if (!hasItemLayoutAnimation) {
|
|
226
|
+
return void 0;
|
|
227
|
+
}
|
|
228
|
+
return function PositionComponent(positionProps) {
|
|
229
|
+
return /* @__PURE__ */ React__namespace.createElement(
|
|
230
|
+
ReanimatedPositionView,
|
|
231
|
+
{
|
|
232
|
+
...positionProps,
|
|
233
|
+
layoutTransition: itemLayoutAnimationRef.current,
|
|
234
|
+
recycleItems
|
|
235
|
+
}
|
|
236
|
+
);
|
|
237
|
+
};
|
|
238
|
+
}, [hasItemLayoutAnimation, recycleItems]);
|
|
239
|
+
const legendListProps = {
|
|
240
|
+
...rest,
|
|
241
|
+
positionComponentInternal,
|
|
242
|
+
recycleItems,
|
|
243
|
+
...{
|
|
244
|
+
renderScrollComponent: renderReanimatedScrollComponent,
|
|
245
|
+
...IsNewArchitecture ? { stickyPositionComponentInternal } : {}
|
|
246
|
+
}
|
|
247
|
+
};
|
|
248
|
+
return /* @__PURE__ */ React__namespace.createElement(reactNative.LegendList, { ref: refFn, refScrollView: ref, ...legendListProps });
|
|
66
249
|
})
|
|
67
250
|
);
|
|
68
251
|
var AnimatedLegendListComponent = Reanimated__default.default.createAnimatedComponent(LegendListForwardedRef);
|
|
252
|
+
var AnimatedLegendListComponentTyped = AnimatedLegendListComponent;
|
|
69
253
|
var AnimatedLegendList = typedMemo(
|
|
254
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
70
255
|
React__namespace.forwardRef(function AnimatedLegendList2(props, ref) {
|
|
71
256
|
const { refScrollView, ...rest } = props;
|
|
72
|
-
const
|
|
73
|
-
const
|
|
74
|
-
|
|
257
|
+
const { animatedProps, sharedValues } = props;
|
|
258
|
+
const [legendList, setLegendList] = React__namespace.useState(null);
|
|
259
|
+
const combinedRef = useCombinedRef(
|
|
260
|
+
React__namespace.useCallback((instance) => {
|
|
261
|
+
setLegendList((prev) => prev === instance ? prev : instance);
|
|
262
|
+
}, []),
|
|
263
|
+
ref
|
|
264
|
+
);
|
|
265
|
+
useAnimatedLegendListSharedValuesSync(legendList, sharedValues);
|
|
266
|
+
const forwardedProps = {
|
|
267
|
+
...rest,
|
|
268
|
+
animatedPropsInternal: animatedProps,
|
|
269
|
+
refLegendList: combinedRef
|
|
270
|
+
};
|
|
271
|
+
return /* @__PURE__ */ React__namespace.createElement(AnimatedLegendListComponentTyped, { ...forwardedProps, ref: refScrollView });
|
|
75
272
|
})
|
|
76
273
|
);
|
|
77
274
|
|
package/reanimated.mjs
CHANGED
|
@@ -1,53 +1,250 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { useCallback
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
2
|
+
import { useCallback } from 'react';
|
|
3
|
+
import { View } from 'react-native';
|
|
4
|
+
import Reanimated, { useAnimatedRef, useScrollViewOffset, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
|
|
5
|
+
import { internal, LegendList } from '@legendapp/list/react-native';
|
|
5
6
|
|
|
6
7
|
// src/integrations/reanimated.tsx
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
8
|
+
var {
|
|
9
|
+
POSITION_OUT_OF_VIEW,
|
|
10
|
+
IsNewArchitecture,
|
|
11
|
+
getStickyPushLimit,
|
|
12
|
+
typedMemo,
|
|
13
|
+
useArr$,
|
|
14
|
+
useCombinedRef,
|
|
15
|
+
getComponent
|
|
16
|
+
} = internal;
|
|
17
|
+
var { peek$, useStateContext } = internal;
|
|
18
|
+
var ReanimatedScrollBridge = typedMemo(function ReanimatedScrollBridgeComponent({
|
|
19
|
+
forwardedRef,
|
|
20
|
+
scrollOffset,
|
|
21
|
+
renderScrollComponent,
|
|
22
|
+
...props
|
|
23
|
+
}) {
|
|
24
|
+
const animatedScrollRef = useAnimatedRef();
|
|
25
|
+
useScrollViewOffset(animatedScrollRef, scrollOffset);
|
|
26
|
+
const combinedRef = useCombinedRef(animatedScrollRef, forwardedRef);
|
|
27
|
+
const ScrollComponent = React.useMemo(
|
|
28
|
+
() => renderScrollComponent ? React.forwardRef(
|
|
29
|
+
(scrollViewProps, ref) => renderScrollComponent({ ...scrollViewProps, ref })
|
|
30
|
+
) : Reanimated.ScrollView,
|
|
31
|
+
[renderScrollComponent]
|
|
32
|
+
);
|
|
33
|
+
return /* @__PURE__ */ React.createElement(ScrollComponent, { ...props, ref: combinedRef });
|
|
34
|
+
});
|
|
35
|
+
var StickyOverlay = typedMemo(function StickyOverlayComponent({ stickyHeaderConfig }) {
|
|
36
|
+
if (!(stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent)) {
|
|
37
|
+
return null;
|
|
38
|
+
}
|
|
39
|
+
return /* @__PURE__ */ React.createElement(
|
|
40
|
+
View,
|
|
41
|
+
{
|
|
42
|
+
style: {
|
|
43
|
+
inset: 0,
|
|
44
|
+
pointerEvents: "none",
|
|
45
|
+
position: "absolute"
|
|
24
46
|
}
|
|
47
|
+
},
|
|
48
|
+
getComponent(stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.backdropComponent)
|
|
49
|
+
);
|
|
50
|
+
});
|
|
51
|
+
var ReanimatedPositionViewSticky = typedMemo(function ReanimatedPositionViewStickyComponent(props) {
|
|
52
|
+
var _a;
|
|
53
|
+
const ctx = useStateContext();
|
|
54
|
+
const { id, horizontal, style, refView, stickyScrollOffset, stickyHeaderConfig, index, children, ...rest } = props;
|
|
55
|
+
const [position = POSITION_OUT_OF_VIEW, headerSize = 0, stylePaddingTop = 0, itemKey, _totalSize = 0] = useArr$([
|
|
56
|
+
`containerPosition${id}`,
|
|
57
|
+
"headerSize",
|
|
58
|
+
"stylePaddingTop",
|
|
59
|
+
`containerItemKey${id}`,
|
|
60
|
+
"totalSize"
|
|
61
|
+
]);
|
|
62
|
+
const pushLimit = React.useMemo(
|
|
63
|
+
() => getStickyPushLimit(ctx.state, index, itemKey),
|
|
64
|
+
[ctx.state, index, itemKey, _totalSize]
|
|
65
|
+
);
|
|
66
|
+
const stickyOffset = (_a = stickyHeaderConfig == null ? void 0 : stickyHeaderConfig.offset) != null ? _a : 0;
|
|
67
|
+
const stickyStart = position + headerSize + stylePaddingTop - stickyOffset;
|
|
68
|
+
const stickyPositionStyle = useAnimatedStyle(() => {
|
|
69
|
+
const delta = Math.max(0, stickyScrollOffset.value - stickyStart);
|
|
70
|
+
const stickyPosition = position + delta;
|
|
71
|
+
const resolvedPosition = pushLimit !== void 0 ? Math.min(stickyPosition, pushLimit) : stickyPosition;
|
|
72
|
+
return horizontal ? { transform: [{ translateX: resolvedPosition }] } : { transform: [{ translateY: resolvedPosition }] };
|
|
73
|
+
}, [horizontal, position, pushLimit, stickyStart]);
|
|
74
|
+
const viewStyle = React.useMemo(
|
|
75
|
+
() => [style, { zIndex: index + 1e3 }, stickyPositionStyle],
|
|
76
|
+
[index, stickyPositionStyle, style]
|
|
77
|
+
);
|
|
78
|
+
return /* @__PURE__ */ React.createElement(Reanimated.View, { ref: refView, style: viewStyle, ...rest }, /* @__PURE__ */ React.createElement(StickyOverlay, { stickyHeaderConfig }), children);
|
|
79
|
+
});
|
|
80
|
+
var ReanimatedPositionView = typedMemo(function ReanimatedPositionViewComponent(props) {
|
|
81
|
+
const ctx = useStateContext();
|
|
82
|
+
const { id, horizontal, style, refView, children, recycleItems, layoutTransition, ...rest } = props;
|
|
83
|
+
const [positionValue = POSITION_OUT_OF_VIEW] = useArr$([`containerPosition${id}`]);
|
|
84
|
+
const prevItemKeyRef = React.useRef(void 0);
|
|
85
|
+
let shouldSkipTransitionForRecycleReuse = false;
|
|
86
|
+
if (recycleItems && layoutTransition) {
|
|
87
|
+
const itemKeySignal = `containerItemKey${id}`;
|
|
88
|
+
const itemKey = peek$(ctx, itemKeySignal);
|
|
89
|
+
shouldSkipTransitionForRecycleReuse = itemKey !== void 0 && prevItemKeyRef.current !== void 0 && prevItemKeyRef.current !== itemKey;
|
|
90
|
+
if (itemKey !== void 0) {
|
|
91
|
+
prevItemKeyRef.current = itemKey;
|
|
25
92
|
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
93
|
+
} else {
|
|
94
|
+
prevItemKeyRef.current = void 0;
|
|
95
|
+
}
|
|
96
|
+
const viewStyle = React.useMemo(
|
|
97
|
+
() => [style, horizontal ? { left: positionValue } : { top: positionValue }],
|
|
98
|
+
[horizontal, positionValue, style]
|
|
99
|
+
);
|
|
100
|
+
return /* @__PURE__ */ React.createElement(
|
|
101
|
+
Reanimated.View,
|
|
102
|
+
{
|
|
103
|
+
layout: shouldSkipTransitionForRecycleReuse ? void 0 : layoutTransition,
|
|
104
|
+
ref: refView,
|
|
105
|
+
style: viewStyle,
|
|
106
|
+
...rest
|
|
107
|
+
},
|
|
108
|
+
children
|
|
109
|
+
);
|
|
110
|
+
});
|
|
111
|
+
function setSharedValueValue(sharedValue, value) {
|
|
112
|
+
if (!sharedValue) {
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
const sharedValueWithMethods = sharedValue;
|
|
116
|
+
if (typeof sharedValueWithMethods.set === "function") {
|
|
117
|
+
sharedValueWithMethods.set(value);
|
|
118
|
+
} else {
|
|
119
|
+
sharedValueWithMethods.value = value;
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
function useAnimatedLegendListSharedValuesSync(legendList, sharedValues) {
|
|
123
|
+
React.useEffect(() => {
|
|
124
|
+
if (!legendList || !sharedValues) {
|
|
125
|
+
return;
|
|
126
|
+
}
|
|
127
|
+
const state = legendList.getState();
|
|
128
|
+
setSharedValueValue(sharedValues.activeStickyIndex, state.activeStickyIndex);
|
|
129
|
+
setSharedValueValue(sharedValues.isAtEnd, state.isAtEnd);
|
|
130
|
+
setSharedValueValue(sharedValues.isAtStart, state.isAtStart);
|
|
131
|
+
setSharedValueValue(sharedValues.isNearEnd, state.isNearEnd);
|
|
132
|
+
setSharedValueValue(sharedValues.isNearStart, state.isNearStart);
|
|
133
|
+
setSharedValueValue(
|
|
134
|
+
sharedValues.isWithinMaintainScrollAtEndThreshold,
|
|
135
|
+
state.isWithinMaintainScrollAtEndThreshold
|
|
136
|
+
);
|
|
137
|
+
setSharedValueValue(sharedValues.scrollOffset, state.scroll);
|
|
138
|
+
const unsubscribers = [
|
|
139
|
+
sharedValues.activeStickyIndex ? state.listen(
|
|
140
|
+
"activeStickyIndex",
|
|
141
|
+
(value) => setSharedValueValue(sharedValues.activeStickyIndex, value)
|
|
142
|
+
) : void 0,
|
|
143
|
+
sharedValues.isAtEnd ? state.listen("isAtEnd", (value) => setSharedValueValue(sharedValues.isAtEnd, value)) : void 0,
|
|
144
|
+
sharedValues.isAtStart ? state.listen("isAtStart", (value) => setSharedValueValue(sharedValues.isAtStart, value)) : void 0,
|
|
145
|
+
sharedValues.isNearEnd ? state.listen("isNearEnd", (value) => setSharedValueValue(sharedValues.isNearEnd, value)) : void 0,
|
|
146
|
+
sharedValues.isNearStart ? state.listen("isNearStart", (value) => setSharedValueValue(sharedValues.isNearStart, value)) : void 0,
|
|
147
|
+
sharedValues.isWithinMaintainScrollAtEndThreshold ? state.listen(
|
|
148
|
+
"isWithinMaintainScrollAtEndThreshold",
|
|
149
|
+
(value) => setSharedValueValue(sharedValues.isWithinMaintainScrollAtEndThreshold, value)
|
|
150
|
+
) : void 0
|
|
151
|
+
];
|
|
152
|
+
return () => {
|
|
153
|
+
for (const unsubscribe of unsubscribers) {
|
|
154
|
+
unsubscribe == null ? void 0 : unsubscribe();
|
|
155
|
+
}
|
|
156
|
+
};
|
|
157
|
+
}, [legendList, sharedValues]);
|
|
158
|
+
}
|
|
32
159
|
var LegendListForwardedRef = typedMemo(
|
|
160
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
33
161
|
React.forwardRef(function LegendListForwardedRef2(props, ref) {
|
|
34
|
-
|
|
162
|
+
var _a;
|
|
163
|
+
const { itemLayoutAnimation, recycleItems, refLegendList, renderScrollComponent, sharedValues, ...rest } = props;
|
|
35
164
|
const refFn = useCallback(
|
|
36
165
|
(r) => {
|
|
37
166
|
refLegendList(r);
|
|
38
167
|
},
|
|
39
168
|
[refLegendList]
|
|
40
169
|
);
|
|
41
|
-
|
|
170
|
+
const internalScrollOffset = useSharedValue(0);
|
|
171
|
+
const scrollOffset = (_a = sharedValues == null ? void 0 : sharedValues.scrollOffset) != null ? _a : internalScrollOffset;
|
|
172
|
+
const renderScrollComponentForBridge = React.useMemo(
|
|
173
|
+
() => renderScrollComponent ? (scrollViewProps) => renderScrollComponent(scrollViewProps) : void 0,
|
|
174
|
+
[renderScrollComponent]
|
|
175
|
+
);
|
|
176
|
+
const renderReanimatedScrollComponent = useCallback(
|
|
177
|
+
(scrollViewProps) => {
|
|
178
|
+
const { ref: forwardedRef, ...restScrollViewProps } = scrollViewProps;
|
|
179
|
+
return /* @__PURE__ */ React.createElement(
|
|
180
|
+
ReanimatedScrollBridge,
|
|
181
|
+
{
|
|
182
|
+
...restScrollViewProps,
|
|
183
|
+
forwardedRef,
|
|
184
|
+
renderScrollComponent: renderScrollComponentForBridge,
|
|
185
|
+
scrollOffset
|
|
186
|
+
}
|
|
187
|
+
);
|
|
188
|
+
},
|
|
189
|
+
[renderScrollComponentForBridge, scrollOffset]
|
|
190
|
+
);
|
|
191
|
+
const stickyPositionComponentInternal = React.useMemo(
|
|
192
|
+
() => function StickyPositionComponent(stickyProps) {
|
|
193
|
+
return /* @__PURE__ */ React.createElement(ReanimatedPositionViewSticky, { ...stickyProps, stickyScrollOffset: scrollOffset });
|
|
194
|
+
},
|
|
195
|
+
[scrollOffset]
|
|
196
|
+
);
|
|
197
|
+
const itemLayoutAnimationRef = React.useRef(itemLayoutAnimation);
|
|
198
|
+
itemLayoutAnimationRef.current = itemLayoutAnimation;
|
|
199
|
+
const hasItemLayoutAnimation = !!itemLayoutAnimation;
|
|
200
|
+
const positionComponentInternal = React.useMemo(() => {
|
|
201
|
+
if (!hasItemLayoutAnimation) {
|
|
202
|
+
return void 0;
|
|
203
|
+
}
|
|
204
|
+
return function PositionComponent(positionProps) {
|
|
205
|
+
return /* @__PURE__ */ React.createElement(
|
|
206
|
+
ReanimatedPositionView,
|
|
207
|
+
{
|
|
208
|
+
...positionProps,
|
|
209
|
+
layoutTransition: itemLayoutAnimationRef.current,
|
|
210
|
+
recycleItems
|
|
211
|
+
}
|
|
212
|
+
);
|
|
213
|
+
};
|
|
214
|
+
}, [hasItemLayoutAnimation, recycleItems]);
|
|
215
|
+
const legendListProps = {
|
|
216
|
+
...rest,
|
|
217
|
+
positionComponentInternal,
|
|
218
|
+
recycleItems,
|
|
219
|
+
...{
|
|
220
|
+
renderScrollComponent: renderReanimatedScrollComponent,
|
|
221
|
+
...IsNewArchitecture ? { stickyPositionComponentInternal } : {}
|
|
222
|
+
}
|
|
223
|
+
};
|
|
224
|
+
return /* @__PURE__ */ React.createElement(LegendList, { ref: refFn, refScrollView: ref, ...legendListProps });
|
|
42
225
|
})
|
|
43
226
|
);
|
|
44
227
|
var AnimatedLegendListComponent = Reanimated.createAnimatedComponent(LegendListForwardedRef);
|
|
228
|
+
var AnimatedLegendListComponentTyped = AnimatedLegendListComponent;
|
|
45
229
|
var AnimatedLegendList = typedMemo(
|
|
230
|
+
// biome-ignore lint/nursery/noShadow: const function name shadowing is intentional
|
|
46
231
|
React.forwardRef(function AnimatedLegendList2(props, ref) {
|
|
47
232
|
const { refScrollView, ...rest } = props;
|
|
48
|
-
const
|
|
49
|
-
const
|
|
50
|
-
|
|
233
|
+
const { animatedProps, sharedValues } = props;
|
|
234
|
+
const [legendList, setLegendList] = React.useState(null);
|
|
235
|
+
const combinedRef = useCombinedRef(
|
|
236
|
+
React.useCallback((instance) => {
|
|
237
|
+
setLegendList((prev) => prev === instance ? prev : instance);
|
|
238
|
+
}, []),
|
|
239
|
+
ref
|
|
240
|
+
);
|
|
241
|
+
useAnimatedLegendListSharedValuesSync(legendList, sharedValues);
|
|
242
|
+
const forwardedProps = {
|
|
243
|
+
...rest,
|
|
244
|
+
animatedPropsInternal: animatedProps,
|
|
245
|
+
refLegendList: combinedRef
|
|
246
|
+
};
|
|
247
|
+
return /* @__PURE__ */ React.createElement(AnimatedLegendListComponentTyped, { ...forwardedProps, ref: refScrollView });
|
|
51
248
|
})
|
|
52
249
|
);
|
|
53
250
|
|