@legendapp/list 1.0.0-beta.13 → 1.0.0-beta.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.d.mts +4 -1
- package/index.d.ts +4 -1
- package/index.js +114 -35
- package/index.mjs +114 -35
- package/package.json +1 -1
package/index.d.mts
CHANGED
|
@@ -7,12 +7,15 @@ import Animated from 'react-native-reanimated';
|
|
|
7
7
|
declare class ScrollAdjustHandler {
|
|
8
8
|
private ctx;
|
|
9
9
|
private appliedAdjust;
|
|
10
|
-
private pendingAdjust;
|
|
11
10
|
private busy;
|
|
12
11
|
private context;
|
|
12
|
+
private isPaused;
|
|
13
13
|
constructor(ctx: any);
|
|
14
|
+
private doAjdust;
|
|
14
15
|
requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
|
|
15
16
|
getAppliedAdjust(): number;
|
|
17
|
+
pauseAdjust(): void;
|
|
18
|
+
unPauseAdjust(): boolean;
|
|
16
19
|
}
|
|
17
20
|
|
|
18
21
|
type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
|
package/index.d.ts
CHANGED
|
@@ -7,12 +7,15 @@ import Animated from 'react-native-reanimated';
|
|
|
7
7
|
declare class ScrollAdjustHandler {
|
|
8
8
|
private ctx;
|
|
9
9
|
private appliedAdjust;
|
|
10
|
-
private pendingAdjust;
|
|
11
10
|
private busy;
|
|
12
11
|
private context;
|
|
12
|
+
private isPaused;
|
|
13
13
|
constructor(ctx: any);
|
|
14
|
+
private doAjdust;
|
|
14
15
|
requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
|
|
15
16
|
getAppliedAdjust(): number;
|
|
17
|
+
pauseAdjust(): void;
|
|
18
|
+
unPauseAdjust(): boolean;
|
|
16
19
|
}
|
|
17
20
|
|
|
18
21
|
type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
|
package/index.js
CHANGED
|
@@ -494,30 +494,41 @@ var ScrollAdjustHandler = class {
|
|
|
494
494
|
constructor(ctx) {
|
|
495
495
|
this.ctx = ctx;
|
|
496
496
|
this.appliedAdjust = 0;
|
|
497
|
-
this.pendingAdjust = 0;
|
|
498
497
|
this.busy = false;
|
|
498
|
+
this.isPaused = false;
|
|
499
499
|
this.context = ctx;
|
|
500
500
|
}
|
|
501
|
+
doAjdust() {
|
|
502
|
+
set$(this.context, "scrollAdjust", this.appliedAdjust);
|
|
503
|
+
this.busy = false;
|
|
504
|
+
}
|
|
501
505
|
requestAdjust(adjust, onAdjusted) {
|
|
502
506
|
const oldAdjustTop = peek$(this.context, "scrollAdjust");
|
|
503
507
|
if (oldAdjustTop === adjust) {
|
|
504
508
|
return;
|
|
505
509
|
}
|
|
506
510
|
this.appliedAdjust = adjust;
|
|
507
|
-
this.
|
|
508
|
-
const doAjdust = () => {
|
|
509
|
-
set$(this.context, "scrollAdjust", this.pendingAdjust);
|
|
510
|
-
onAdjusted(oldAdjustTop - this.pendingAdjust);
|
|
511
|
-
this.busy = false;
|
|
512
|
-
};
|
|
513
|
-
if (!this.busy) {
|
|
511
|
+
if (!this.busy && !this.isPaused) {
|
|
514
512
|
this.busy = true;
|
|
515
|
-
doAjdust();
|
|
513
|
+
this.doAjdust();
|
|
514
|
+
onAdjusted(oldAdjustTop - adjust);
|
|
516
515
|
}
|
|
517
516
|
}
|
|
518
517
|
getAppliedAdjust() {
|
|
519
518
|
return this.appliedAdjust;
|
|
520
519
|
}
|
|
520
|
+
pauseAdjust() {
|
|
521
|
+
this.isPaused = true;
|
|
522
|
+
}
|
|
523
|
+
// return true if it was paused
|
|
524
|
+
unPauseAdjust() {
|
|
525
|
+
if (this.isPaused) {
|
|
526
|
+
this.isPaused = false;
|
|
527
|
+
this.doAjdust();
|
|
528
|
+
return true;
|
|
529
|
+
}
|
|
530
|
+
return false;
|
|
531
|
+
}
|
|
521
532
|
};
|
|
522
533
|
var typedForwardRef = React6.forwardRef;
|
|
523
534
|
var useCombinedRef = (...refs) => {
|
|
@@ -690,7 +701,7 @@ var LegendList = typedForwardRef(function LegendList2(props, forwardedRef) {
|
|
|
690
701
|
return /* @__PURE__ */ React6__namespace.createElement(StateProvider, null, /* @__PURE__ */ React6__namespace.createElement(LegendListInner, { ...props, ref: forwardedRef }));
|
|
691
702
|
});
|
|
692
703
|
var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
|
|
693
|
-
var _a, _b, _c, _d
|
|
704
|
+
var _a, _b, _c, _d;
|
|
694
705
|
const {
|
|
695
706
|
data: dataProp,
|
|
696
707
|
initialScrollIndex,
|
|
@@ -705,6 +716,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
705
716
|
alignItemsAtEnd = false,
|
|
706
717
|
maintainVisibleContentPosition = false,
|
|
707
718
|
onScroll: onScrollProp,
|
|
719
|
+
onMomentumScrollEnd,
|
|
708
720
|
numColumns: numColumnsProp = 1,
|
|
709
721
|
keyExtractor: keyExtractorProp,
|
|
710
722
|
renderItem,
|
|
@@ -751,13 +763,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
751
763
|
refState.current.sizes.set(key, size);
|
|
752
764
|
return size;
|
|
753
765
|
};
|
|
754
|
-
const
|
|
766
|
+
const calculateOffsetForIndex = (index = initialScrollIndex) => {
|
|
755
767
|
const data = dataProp;
|
|
756
768
|
if (index) {
|
|
757
769
|
let offset = 0;
|
|
758
|
-
|
|
770
|
+
const canGetSize = !!refState.current;
|
|
771
|
+
if (canGetSize || getEstimatedItemSize) {
|
|
772
|
+
const sizeFn = (index2) => {
|
|
773
|
+
if (canGetSize) {
|
|
774
|
+
return getItemSize(getId(index2), index2, data[index2]);
|
|
775
|
+
}
|
|
776
|
+
return getEstimatedItemSize(index2, data[index2]);
|
|
777
|
+
};
|
|
759
778
|
for (let i = 0; i < index; i++) {
|
|
760
|
-
offset +=
|
|
779
|
+
offset += sizeFn(i);
|
|
761
780
|
}
|
|
762
781
|
} else if (estimatedItemSize) {
|
|
763
782
|
offset = index * estimatedItemSize;
|
|
@@ -766,7 +785,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
766
785
|
}
|
|
767
786
|
return 0;
|
|
768
787
|
};
|
|
769
|
-
const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : React6.useMemo(
|
|
788
|
+
const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : React6.useMemo(calculateOffsetForIndex, []);
|
|
770
789
|
if (!refState.current) {
|
|
771
790
|
const initialScrollLength = reactNative.Dimensions.get("window")[horizontal ? "width" : "height"];
|
|
772
791
|
refState.current = {
|
|
@@ -918,17 +937,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
918
937
|
return map;
|
|
919
938
|
};
|
|
920
939
|
const getElementPositionBelowAchor = (id) => {
|
|
940
|
+
var _a2;
|
|
921
941
|
const state = refState.current;
|
|
922
942
|
if (!refState.current.belowAnchorElementPositions) {
|
|
923
943
|
state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
|
|
924
944
|
}
|
|
925
945
|
const res = state.belowAnchorElementPositions.get(id);
|
|
926
946
|
if (res === void 0) {
|
|
927
|
-
|
|
947
|
+
console.warn(`Undefined position below achor ${id} ${(_a2 = state.anchorElement) == null ? void 0 : _a2.id}`);
|
|
948
|
+
return 0;
|
|
928
949
|
}
|
|
929
950
|
return res;
|
|
930
951
|
};
|
|
931
952
|
const calculateItemsInView = React6.useCallback((speed) => {
|
|
953
|
+
var _a2;
|
|
932
954
|
const state = refState.current;
|
|
933
955
|
const {
|
|
934
956
|
data,
|
|
@@ -1006,14 +1028,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1006
1028
|
let column = 1;
|
|
1007
1029
|
let maxSizeInRow = 0;
|
|
1008
1030
|
const getInitialTop = (i) => {
|
|
1009
|
-
var
|
|
1031
|
+
var _a3;
|
|
1010
1032
|
const id = getId(i);
|
|
1011
1033
|
let topOffset = 0;
|
|
1012
1034
|
if (positions.get(id)) {
|
|
1013
1035
|
topOffset = positions.get(id);
|
|
1014
1036
|
}
|
|
1015
|
-
if (id === ((
|
|
1016
|
-
topOffset =
|
|
1037
|
+
if (id === ((_a3 = state.anchorElement) == null ? void 0 : _a3.id)) {
|
|
1038
|
+
topOffset = state.anchorElement.coordinate;
|
|
1017
1039
|
}
|
|
1018
1040
|
return topOffset;
|
|
1019
1041
|
};
|
|
@@ -1021,7 +1043,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1021
1043
|
const id = getId(i);
|
|
1022
1044
|
const size = getItemSize(id, i, data[i]);
|
|
1023
1045
|
maxSizeInRow = Math.max(maxSizeInRow, size);
|
|
1024
|
-
if (top === void 0) {
|
|
1046
|
+
if (top === void 0 || id === ((_a2 = state.anchorElement) == null ? void 0 : _a2.id)) {
|
|
1025
1047
|
top = getInitialTop(i);
|
|
1026
1048
|
}
|
|
1027
1049
|
if (positions.get(id) !== top) {
|
|
@@ -1287,18 +1309,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1287
1309
|
}
|
|
1288
1310
|
}
|
|
1289
1311
|
};
|
|
1290
|
-
const
|
|
1291
|
-
|
|
1292
|
-
if (!keyExtractorProp && !isFirst && dataProp !== refState.current.data) {
|
|
1293
|
-
refState.current.positions.clear();
|
|
1294
|
-
}
|
|
1295
|
-
refState.current.data = dataProp;
|
|
1312
|
+
const calcTotalSizesAndPositions = ({ forgetPositions = false }) => {
|
|
1313
|
+
var _a2, _b2, _c2;
|
|
1296
1314
|
let totalSize = 0;
|
|
1297
1315
|
let totalSizeBelowIndex = 0;
|
|
1298
1316
|
const indexByKey = /* @__PURE__ */ new Map();
|
|
1299
1317
|
const newPositions = /* @__PURE__ */ new Map();
|
|
1300
1318
|
let column = 1;
|
|
1301
1319
|
let maxSizeInRow = 0;
|
|
1320
|
+
if (!refState.current) {
|
|
1321
|
+
return;
|
|
1322
|
+
}
|
|
1302
1323
|
for (let i = 0; i < dataProp.length; i++) {
|
|
1303
1324
|
const key = getId(i);
|
|
1304
1325
|
if (__DEV__) {
|
|
@@ -1309,13 +1330,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1309
1330
|
}
|
|
1310
1331
|
}
|
|
1311
1332
|
indexByKey.set(key, i);
|
|
1312
|
-
if (refState.current.positions.get(key) != null && refState.current.indexByKey.get(key) === i) {
|
|
1333
|
+
if (!forgetPositions && refState.current.positions.get(key) != null && refState.current.indexByKey.get(key) === i) {
|
|
1313
1334
|
newPositions.set(key, refState.current.positions.get(key));
|
|
1314
1335
|
}
|
|
1315
1336
|
}
|
|
1316
1337
|
refState.current.indexByKey = indexByKey;
|
|
1317
1338
|
refState.current.positions = newPositions;
|
|
1318
|
-
if (!isFirst) {
|
|
1339
|
+
if (!forgetPositions && !isFirst) {
|
|
1319
1340
|
if (maintainVisibleContentPosition) {
|
|
1320
1341
|
if (refState.current.anchorElement == null || indexByKey.get(refState.current.anchorElement.id) == null) {
|
|
1321
1342
|
if (dataProp.length) {
|
|
@@ -1324,8 +1345,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1324
1345
|
id: getId(0)
|
|
1325
1346
|
};
|
|
1326
1347
|
refState.current.anchorElement = newAnchorElement;
|
|
1327
|
-
(
|
|
1328
|
-
(
|
|
1348
|
+
(_a2 = refState.current.belowAnchorElementPositions) == null ? void 0 : _a2.clear();
|
|
1349
|
+
(_b2 = refScroller.current) == null ? void 0 : _b2.scrollTo({ x: 0, y: 0, animated: false });
|
|
1329
1350
|
setTimeout(() => {
|
|
1330
1351
|
calculateItemsInView(0);
|
|
1331
1352
|
}, 0);
|
|
@@ -1340,7 +1361,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1340
1361
|
} else {
|
|
1341
1362
|
refState.current.startBufferedId = void 0;
|
|
1342
1363
|
}
|
|
1343
|
-
(
|
|
1364
|
+
(_c2 = refScroller.current) == null ? void 0 : _c2.scrollTo({ x: 0, y: 0, animated: false });
|
|
1344
1365
|
setTimeout(() => {
|
|
1345
1366
|
calculateItemsInView(0);
|
|
1346
1367
|
}, 0);
|
|
@@ -1366,6 +1387,21 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1366
1387
|
totalSize += maxSizeInRow;
|
|
1367
1388
|
}
|
|
1368
1389
|
addTotalSize(null, totalSize, totalSizeBelowIndex);
|
|
1390
|
+
};
|
|
1391
|
+
const isFirst = !refState.current.renderItem;
|
|
1392
|
+
if (isFirst || dataProp !== refState.current.data || numColumnsProp !== peek$(ctx, "numColumns")) {
|
|
1393
|
+
if (!keyExtractorProp && !isFirst && dataProp !== refState.current.data) {
|
|
1394
|
+
refState.current.sizes.clear();
|
|
1395
|
+
refState.current.positions.clear();
|
|
1396
|
+
}
|
|
1397
|
+
refState.current.data = dataProp;
|
|
1398
|
+
const indexByKey = /* @__PURE__ */ new Map();
|
|
1399
|
+
for (let i = 0; i < dataProp.length; i++) {
|
|
1400
|
+
const key = getId(i);
|
|
1401
|
+
indexByKey.set(key, i);
|
|
1402
|
+
}
|
|
1403
|
+
refState.current.indexByKey = indexByKey;
|
|
1404
|
+
calcTotalSizesAndPositions({ forgetPositions: false });
|
|
1369
1405
|
}
|
|
1370
1406
|
React6.useEffect(() => {
|
|
1371
1407
|
checkResetContainers(
|
|
@@ -1378,7 +1414,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1378
1414
|
}, [extraData]);
|
|
1379
1415
|
refState.current.renderItem = renderItem;
|
|
1380
1416
|
const lastItemKey = dataProp.length > 0 ? getId(dataProp.length - 1) : void 0;
|
|
1381
|
-
const stylePaddingTop = (
|
|
1417
|
+
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;
|
|
1382
1418
|
const initalizeStateVars = () => {
|
|
1383
1419
|
set$(ctx, "lastItemKey", lastItemKey);
|
|
1384
1420
|
set$(ctx, "numColumns", numColumnsProp);
|
|
@@ -1582,10 +1618,42 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1582
1618
|
React6.useImperativeHandle(
|
|
1583
1619
|
forwardedRef,
|
|
1584
1620
|
() => {
|
|
1585
|
-
const scrollToIndex = ({ index, animated }) => {
|
|
1586
|
-
|
|
1587
|
-
const
|
|
1588
|
-
|
|
1621
|
+
const scrollToIndex = ({ index, animated = true }) => {
|
|
1622
|
+
var _a2;
|
|
1623
|
+
const state = refState.current;
|
|
1624
|
+
const firstIndexOffset = calculateOffsetForIndex(index);
|
|
1625
|
+
let firstIndexScrollPostion = firstIndexOffset;
|
|
1626
|
+
if (maintainVisibleContentPosition) {
|
|
1627
|
+
const id = getId(index);
|
|
1628
|
+
state.anchorElement = { id, coordinate: firstIndexOffset };
|
|
1629
|
+
(_a2 = state.belowAnchorElementPositions) == null ? void 0 : _a2.clear();
|
|
1630
|
+
state.positions.clear();
|
|
1631
|
+
calcTotalSizesAndPositions({ forgetPositions: true });
|
|
1632
|
+
state.scrollForNextCalculateItemsInView = void 0;
|
|
1633
|
+
state.startBufferedId = id;
|
|
1634
|
+
state.minIndexSizeChanged = index;
|
|
1635
|
+
firstIndexScrollPostion = firstIndexOffset + state.scrollAdjustHandler.getAppliedAdjust();
|
|
1636
|
+
state.scrollAdjustHandler.pauseAdjust();
|
|
1637
|
+
setTimeout(
|
|
1638
|
+
() => {
|
|
1639
|
+
const wasAdjusted = state.scrollAdjustHandler.unPauseAdjust();
|
|
1640
|
+
if (wasAdjusted) {
|
|
1641
|
+
refState.current.scrollVelocity = 0;
|
|
1642
|
+
refState.current.scrollHistory = [];
|
|
1643
|
+
calculateItemsInView(0);
|
|
1644
|
+
}
|
|
1645
|
+
},
|
|
1646
|
+
animated ? 1e3 : 50
|
|
1647
|
+
);
|
|
1648
|
+
}
|
|
1649
|
+
const offset = horizontal ? { x: firstIndexScrollPostion, y: 0 } : { x: 0, y: firstIndexScrollPostion };
|
|
1650
|
+
if (maintainVisibleContentPosition) {
|
|
1651
|
+
setTimeout(() => {
|
|
1652
|
+
refScroller.current.scrollTo({ ...offset, animated });
|
|
1653
|
+
}, 50);
|
|
1654
|
+
} else {
|
|
1655
|
+
refScroller.current.scrollTo({ ...offset, animated });
|
|
1656
|
+
}
|
|
1589
1657
|
};
|
|
1590
1658
|
return {
|
|
1591
1659
|
getNativeScrollRef: () => refScroller.current,
|
|
@@ -1619,6 +1687,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1619
1687
|
getRenderedItem,
|
|
1620
1688
|
updateItemSize,
|
|
1621
1689
|
handleScroll,
|
|
1690
|
+
onMomentumScrollEnd: (event) => {
|
|
1691
|
+
const wasPaused = refState.current.scrollAdjustHandler.unPauseAdjust();
|
|
1692
|
+
if (wasPaused) {
|
|
1693
|
+
refState.current.scrollVelocity = 0;
|
|
1694
|
+
refState.current.scrollHistory = [];
|
|
1695
|
+
calculateItemsInView(0);
|
|
1696
|
+
}
|
|
1697
|
+
if (onMomentumScrollEnd) {
|
|
1698
|
+
onMomentumScrollEnd(event);
|
|
1699
|
+
}
|
|
1700
|
+
},
|
|
1622
1701
|
onLayout,
|
|
1623
1702
|
recycleItems,
|
|
1624
1703
|
alignItemsAtEnd,
|
package/index.mjs
CHANGED
|
@@ -473,30 +473,41 @@ var ScrollAdjustHandler = class {
|
|
|
473
473
|
constructor(ctx) {
|
|
474
474
|
this.ctx = ctx;
|
|
475
475
|
this.appliedAdjust = 0;
|
|
476
|
-
this.pendingAdjust = 0;
|
|
477
476
|
this.busy = false;
|
|
477
|
+
this.isPaused = false;
|
|
478
478
|
this.context = ctx;
|
|
479
479
|
}
|
|
480
|
+
doAjdust() {
|
|
481
|
+
set$(this.context, "scrollAdjust", this.appliedAdjust);
|
|
482
|
+
this.busy = false;
|
|
483
|
+
}
|
|
480
484
|
requestAdjust(adjust, onAdjusted) {
|
|
481
485
|
const oldAdjustTop = peek$(this.context, "scrollAdjust");
|
|
482
486
|
if (oldAdjustTop === adjust) {
|
|
483
487
|
return;
|
|
484
488
|
}
|
|
485
489
|
this.appliedAdjust = adjust;
|
|
486
|
-
this.
|
|
487
|
-
const doAjdust = () => {
|
|
488
|
-
set$(this.context, "scrollAdjust", this.pendingAdjust);
|
|
489
|
-
onAdjusted(oldAdjustTop - this.pendingAdjust);
|
|
490
|
-
this.busy = false;
|
|
491
|
-
};
|
|
492
|
-
if (!this.busy) {
|
|
490
|
+
if (!this.busy && !this.isPaused) {
|
|
493
491
|
this.busy = true;
|
|
494
|
-
doAjdust();
|
|
492
|
+
this.doAjdust();
|
|
493
|
+
onAdjusted(oldAdjustTop - adjust);
|
|
495
494
|
}
|
|
496
495
|
}
|
|
497
496
|
getAppliedAdjust() {
|
|
498
497
|
return this.appliedAdjust;
|
|
499
498
|
}
|
|
499
|
+
pauseAdjust() {
|
|
500
|
+
this.isPaused = true;
|
|
501
|
+
}
|
|
502
|
+
// return true if it was paused
|
|
503
|
+
unPauseAdjust() {
|
|
504
|
+
if (this.isPaused) {
|
|
505
|
+
this.isPaused = false;
|
|
506
|
+
this.doAjdust();
|
|
507
|
+
return true;
|
|
508
|
+
}
|
|
509
|
+
return false;
|
|
510
|
+
}
|
|
500
511
|
};
|
|
501
512
|
var typedForwardRef = forwardRef;
|
|
502
513
|
var useCombinedRef = (...refs) => {
|
|
@@ -669,7 +680,7 @@ var LegendList = typedForwardRef(function LegendList2(props, forwardedRef) {
|
|
|
669
680
|
return /* @__PURE__ */ React6.createElement(StateProvider, null, /* @__PURE__ */ React6.createElement(LegendListInner, { ...props, ref: forwardedRef }));
|
|
670
681
|
});
|
|
671
682
|
var LegendListInner = typedForwardRef(function LegendListInner2(props, forwardedRef) {
|
|
672
|
-
var _a, _b, _c, _d
|
|
683
|
+
var _a, _b, _c, _d;
|
|
673
684
|
const {
|
|
674
685
|
data: dataProp,
|
|
675
686
|
initialScrollIndex,
|
|
@@ -684,6 +695,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
684
695
|
alignItemsAtEnd = false,
|
|
685
696
|
maintainVisibleContentPosition = false,
|
|
686
697
|
onScroll: onScrollProp,
|
|
698
|
+
onMomentumScrollEnd,
|
|
687
699
|
numColumns: numColumnsProp = 1,
|
|
688
700
|
keyExtractor: keyExtractorProp,
|
|
689
701
|
renderItem,
|
|
@@ -730,13 +742,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
730
742
|
refState.current.sizes.set(key, size);
|
|
731
743
|
return size;
|
|
732
744
|
};
|
|
733
|
-
const
|
|
745
|
+
const calculateOffsetForIndex = (index = initialScrollIndex) => {
|
|
734
746
|
const data = dataProp;
|
|
735
747
|
if (index) {
|
|
736
748
|
let offset = 0;
|
|
737
|
-
|
|
749
|
+
const canGetSize = !!refState.current;
|
|
750
|
+
if (canGetSize || getEstimatedItemSize) {
|
|
751
|
+
const sizeFn = (index2) => {
|
|
752
|
+
if (canGetSize) {
|
|
753
|
+
return getItemSize(getId(index2), index2, data[index2]);
|
|
754
|
+
}
|
|
755
|
+
return getEstimatedItemSize(index2, data[index2]);
|
|
756
|
+
};
|
|
738
757
|
for (let i = 0; i < index; i++) {
|
|
739
|
-
offset +=
|
|
758
|
+
offset += sizeFn(i);
|
|
740
759
|
}
|
|
741
760
|
} else if (estimatedItemSize) {
|
|
742
761
|
offset = index * estimatedItemSize;
|
|
@@ -745,7 +764,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
745
764
|
}
|
|
746
765
|
return 0;
|
|
747
766
|
};
|
|
748
|
-
const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : useMemo(
|
|
767
|
+
const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : useMemo(calculateOffsetForIndex, []);
|
|
749
768
|
if (!refState.current) {
|
|
750
769
|
const initialScrollLength = Dimensions.get("window")[horizontal ? "width" : "height"];
|
|
751
770
|
refState.current = {
|
|
@@ -897,17 +916,20 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
897
916
|
return map;
|
|
898
917
|
};
|
|
899
918
|
const getElementPositionBelowAchor = (id) => {
|
|
919
|
+
var _a2;
|
|
900
920
|
const state = refState.current;
|
|
901
921
|
if (!refState.current.belowAnchorElementPositions) {
|
|
902
922
|
state.belowAnchorElementPositions = buildElementPositionsBelowAnchor();
|
|
903
923
|
}
|
|
904
924
|
const res = state.belowAnchorElementPositions.get(id);
|
|
905
925
|
if (res === void 0) {
|
|
906
|
-
|
|
926
|
+
console.warn(`Undefined position below achor ${id} ${(_a2 = state.anchorElement) == null ? void 0 : _a2.id}`);
|
|
927
|
+
return 0;
|
|
907
928
|
}
|
|
908
929
|
return res;
|
|
909
930
|
};
|
|
910
931
|
const calculateItemsInView = useCallback((speed) => {
|
|
932
|
+
var _a2;
|
|
911
933
|
const state = refState.current;
|
|
912
934
|
const {
|
|
913
935
|
data,
|
|
@@ -985,14 +1007,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
985
1007
|
let column = 1;
|
|
986
1008
|
let maxSizeInRow = 0;
|
|
987
1009
|
const getInitialTop = (i) => {
|
|
988
|
-
var
|
|
1010
|
+
var _a3;
|
|
989
1011
|
const id = getId(i);
|
|
990
1012
|
let topOffset = 0;
|
|
991
1013
|
if (positions.get(id)) {
|
|
992
1014
|
topOffset = positions.get(id);
|
|
993
1015
|
}
|
|
994
|
-
if (id === ((
|
|
995
|
-
topOffset =
|
|
1016
|
+
if (id === ((_a3 = state.anchorElement) == null ? void 0 : _a3.id)) {
|
|
1017
|
+
topOffset = state.anchorElement.coordinate;
|
|
996
1018
|
}
|
|
997
1019
|
return topOffset;
|
|
998
1020
|
};
|
|
@@ -1000,7 +1022,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1000
1022
|
const id = getId(i);
|
|
1001
1023
|
const size = getItemSize(id, i, data[i]);
|
|
1002
1024
|
maxSizeInRow = Math.max(maxSizeInRow, size);
|
|
1003
|
-
if (top === void 0) {
|
|
1025
|
+
if (top === void 0 || id === ((_a2 = state.anchorElement) == null ? void 0 : _a2.id)) {
|
|
1004
1026
|
top = getInitialTop(i);
|
|
1005
1027
|
}
|
|
1006
1028
|
if (positions.get(id) !== top) {
|
|
@@ -1266,18 +1288,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1266
1288
|
}
|
|
1267
1289
|
}
|
|
1268
1290
|
};
|
|
1269
|
-
const
|
|
1270
|
-
|
|
1271
|
-
if (!keyExtractorProp && !isFirst && dataProp !== refState.current.data) {
|
|
1272
|
-
refState.current.positions.clear();
|
|
1273
|
-
}
|
|
1274
|
-
refState.current.data = dataProp;
|
|
1291
|
+
const calcTotalSizesAndPositions = ({ forgetPositions = false }) => {
|
|
1292
|
+
var _a2, _b2, _c2;
|
|
1275
1293
|
let totalSize = 0;
|
|
1276
1294
|
let totalSizeBelowIndex = 0;
|
|
1277
1295
|
const indexByKey = /* @__PURE__ */ new Map();
|
|
1278
1296
|
const newPositions = /* @__PURE__ */ new Map();
|
|
1279
1297
|
let column = 1;
|
|
1280
1298
|
let maxSizeInRow = 0;
|
|
1299
|
+
if (!refState.current) {
|
|
1300
|
+
return;
|
|
1301
|
+
}
|
|
1281
1302
|
for (let i = 0; i < dataProp.length; i++) {
|
|
1282
1303
|
const key = getId(i);
|
|
1283
1304
|
if (__DEV__) {
|
|
@@ -1288,13 +1309,13 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1288
1309
|
}
|
|
1289
1310
|
}
|
|
1290
1311
|
indexByKey.set(key, i);
|
|
1291
|
-
if (refState.current.positions.get(key) != null && refState.current.indexByKey.get(key) === i) {
|
|
1312
|
+
if (!forgetPositions && refState.current.positions.get(key) != null && refState.current.indexByKey.get(key) === i) {
|
|
1292
1313
|
newPositions.set(key, refState.current.positions.get(key));
|
|
1293
1314
|
}
|
|
1294
1315
|
}
|
|
1295
1316
|
refState.current.indexByKey = indexByKey;
|
|
1296
1317
|
refState.current.positions = newPositions;
|
|
1297
|
-
if (!isFirst) {
|
|
1318
|
+
if (!forgetPositions && !isFirst) {
|
|
1298
1319
|
if (maintainVisibleContentPosition) {
|
|
1299
1320
|
if (refState.current.anchorElement == null || indexByKey.get(refState.current.anchorElement.id) == null) {
|
|
1300
1321
|
if (dataProp.length) {
|
|
@@ -1303,8 +1324,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1303
1324
|
id: getId(0)
|
|
1304
1325
|
};
|
|
1305
1326
|
refState.current.anchorElement = newAnchorElement;
|
|
1306
|
-
(
|
|
1307
|
-
(
|
|
1327
|
+
(_a2 = refState.current.belowAnchorElementPositions) == null ? void 0 : _a2.clear();
|
|
1328
|
+
(_b2 = refScroller.current) == null ? void 0 : _b2.scrollTo({ x: 0, y: 0, animated: false });
|
|
1308
1329
|
setTimeout(() => {
|
|
1309
1330
|
calculateItemsInView(0);
|
|
1310
1331
|
}, 0);
|
|
@@ -1319,7 +1340,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1319
1340
|
} else {
|
|
1320
1341
|
refState.current.startBufferedId = void 0;
|
|
1321
1342
|
}
|
|
1322
|
-
(
|
|
1343
|
+
(_c2 = refScroller.current) == null ? void 0 : _c2.scrollTo({ x: 0, y: 0, animated: false });
|
|
1323
1344
|
setTimeout(() => {
|
|
1324
1345
|
calculateItemsInView(0);
|
|
1325
1346
|
}, 0);
|
|
@@ -1345,6 +1366,21 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1345
1366
|
totalSize += maxSizeInRow;
|
|
1346
1367
|
}
|
|
1347
1368
|
addTotalSize(null, totalSize, totalSizeBelowIndex);
|
|
1369
|
+
};
|
|
1370
|
+
const isFirst = !refState.current.renderItem;
|
|
1371
|
+
if (isFirst || dataProp !== refState.current.data || numColumnsProp !== peek$(ctx, "numColumns")) {
|
|
1372
|
+
if (!keyExtractorProp && !isFirst && dataProp !== refState.current.data) {
|
|
1373
|
+
refState.current.sizes.clear();
|
|
1374
|
+
refState.current.positions.clear();
|
|
1375
|
+
}
|
|
1376
|
+
refState.current.data = dataProp;
|
|
1377
|
+
const indexByKey = /* @__PURE__ */ new Map();
|
|
1378
|
+
for (let i = 0; i < dataProp.length; i++) {
|
|
1379
|
+
const key = getId(i);
|
|
1380
|
+
indexByKey.set(key, i);
|
|
1381
|
+
}
|
|
1382
|
+
refState.current.indexByKey = indexByKey;
|
|
1383
|
+
calcTotalSizesAndPositions({ forgetPositions: false });
|
|
1348
1384
|
}
|
|
1349
1385
|
useEffect(() => {
|
|
1350
1386
|
checkResetContainers(
|
|
@@ -1357,7 +1393,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1357
1393
|
}, [extraData]);
|
|
1358
1394
|
refState.current.renderItem = renderItem;
|
|
1359
1395
|
const lastItemKey = dataProp.length > 0 ? getId(dataProp.length - 1) : void 0;
|
|
1360
|
-
const stylePaddingTop = (
|
|
1396
|
+
const stylePaddingTop = (_d = (_c = (_a = StyleSheet.flatten(style)) == null ? void 0 : _a.paddingTop) != null ? _c : (_b = StyleSheet.flatten(contentContainerStyle)) == null ? void 0 : _b.paddingTop) != null ? _d : 0;
|
|
1361
1397
|
const initalizeStateVars = () => {
|
|
1362
1398
|
set$(ctx, "lastItemKey", lastItemKey);
|
|
1363
1399
|
set$(ctx, "numColumns", numColumnsProp);
|
|
@@ -1561,10 +1597,42 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1561
1597
|
useImperativeHandle(
|
|
1562
1598
|
forwardedRef,
|
|
1563
1599
|
() => {
|
|
1564
|
-
const scrollToIndex = ({ index, animated }) => {
|
|
1565
|
-
|
|
1566
|
-
const
|
|
1567
|
-
|
|
1600
|
+
const scrollToIndex = ({ index, animated = true }) => {
|
|
1601
|
+
var _a2;
|
|
1602
|
+
const state = refState.current;
|
|
1603
|
+
const firstIndexOffset = calculateOffsetForIndex(index);
|
|
1604
|
+
let firstIndexScrollPostion = firstIndexOffset;
|
|
1605
|
+
if (maintainVisibleContentPosition) {
|
|
1606
|
+
const id = getId(index);
|
|
1607
|
+
state.anchorElement = { id, coordinate: firstIndexOffset };
|
|
1608
|
+
(_a2 = state.belowAnchorElementPositions) == null ? void 0 : _a2.clear();
|
|
1609
|
+
state.positions.clear();
|
|
1610
|
+
calcTotalSizesAndPositions({ forgetPositions: true });
|
|
1611
|
+
state.scrollForNextCalculateItemsInView = void 0;
|
|
1612
|
+
state.startBufferedId = id;
|
|
1613
|
+
state.minIndexSizeChanged = index;
|
|
1614
|
+
firstIndexScrollPostion = firstIndexOffset + state.scrollAdjustHandler.getAppliedAdjust();
|
|
1615
|
+
state.scrollAdjustHandler.pauseAdjust();
|
|
1616
|
+
setTimeout(
|
|
1617
|
+
() => {
|
|
1618
|
+
const wasAdjusted = state.scrollAdjustHandler.unPauseAdjust();
|
|
1619
|
+
if (wasAdjusted) {
|
|
1620
|
+
refState.current.scrollVelocity = 0;
|
|
1621
|
+
refState.current.scrollHistory = [];
|
|
1622
|
+
calculateItemsInView(0);
|
|
1623
|
+
}
|
|
1624
|
+
},
|
|
1625
|
+
animated ? 1e3 : 50
|
|
1626
|
+
);
|
|
1627
|
+
}
|
|
1628
|
+
const offset = horizontal ? { x: firstIndexScrollPostion, y: 0 } : { x: 0, y: firstIndexScrollPostion };
|
|
1629
|
+
if (maintainVisibleContentPosition) {
|
|
1630
|
+
setTimeout(() => {
|
|
1631
|
+
refScroller.current.scrollTo({ ...offset, animated });
|
|
1632
|
+
}, 50);
|
|
1633
|
+
} else {
|
|
1634
|
+
refScroller.current.scrollTo({ ...offset, animated });
|
|
1635
|
+
}
|
|
1568
1636
|
};
|
|
1569
1637
|
return {
|
|
1570
1638
|
getNativeScrollRef: () => refScroller.current,
|
|
@@ -1598,6 +1666,17 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
|
|
|
1598
1666
|
getRenderedItem,
|
|
1599
1667
|
updateItemSize,
|
|
1600
1668
|
handleScroll,
|
|
1669
|
+
onMomentumScrollEnd: (event) => {
|
|
1670
|
+
const wasPaused = refState.current.scrollAdjustHandler.unPauseAdjust();
|
|
1671
|
+
if (wasPaused) {
|
|
1672
|
+
refState.current.scrollVelocity = 0;
|
|
1673
|
+
refState.current.scrollHistory = [];
|
|
1674
|
+
calculateItemsInView(0);
|
|
1675
|
+
}
|
|
1676
|
+
if (onMomentumScrollEnd) {
|
|
1677
|
+
onMomentumScrollEnd(event);
|
|
1678
|
+
}
|
|
1679
|
+
},
|
|
1601
1680
|
onLayout,
|
|
1602
1681
|
recycleItems,
|
|
1603
1682
|
alignItemsAtEnd,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@legendapp/list",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.14",
|
|
4
4
|
"description": "Legend List aims to be a drop-in replacement for FlatList with much better performance and supporting dynamically sized items.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"private": false,
|