@legendapp/list 0.5.9 → 0.6.1

package/README.md

@@ -67,12 +67,7 @@ There's not a lot of code here so hopefully it's easy to contribute. If you want
 
 ## TODO list
 
--   onViewableItemsChanged
--   Adjust scroll when item heights change above the viewable area so they don't jump
--   A prop to start with items at the bottom like a chat interface, just needs to pad the top with screen height - items height
--   Other important missing features from FlatList or other lists libraries
--   Optimizations:
-    -   Loop over only potentially changed items when adjusting heights rather than data array
+See [Road to v1](https://github.com/LegendApp/legend-list/issues/28)
 
 ## Community
 

package/animated.d.mts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import * as _legendapp_list from '@legendapp/list';
+import { Animated } from 'react-native';
+
+declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: _legendapp_list.LegendListProps<T> & {
+    ref?: React.ForwardedRef<_legendapp_list.LegendListRef>;
+}) => React.ReactElement)>;
+
+export { AnimatedLegendList };

package/animated.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import * as _legendapp_list from '@legendapp/list';
+import { Animated } from 'react-native';
+
+declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: _legendapp_list.LegendListProps<T> & {
+    ref?: React.ForwardedRef<_legendapp_list.LegendListRef>;
+}) => React.ReactElement)>;
+
+export { AnimatedLegendList };

package/animated.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var list = require('@legendapp/list');
+var reactNative = require('react-native');
+
+// src/animated.tsx
+var AnimatedLegendList = reactNative.Animated.createAnimatedComponent(list.LegendList);
+
+exports.AnimatedLegendList = AnimatedLegendList;

package/animated.mjs

@@ -0,0 +1,7 @@
+import { LegendList } from '@legendapp/list';
+import { Animated } from 'react-native';
+
+// src/animated.tsx
+var AnimatedLegendList = Animated.createAnimatedComponent(LegendList);
+
+export { AnimatedLegendList };

package/index.d.mts

@@ -1,7 +1,20 @@
 import { ComponentProps, ReactNode, ForwardedRef, ReactElement } from 'react';
 import { ScrollView, StyleProp, ViewStyle, ScrollViewComponent, ScrollResponderMixin } from 'react-native';
+import Animated from 'react-native-reanimated';
 
-type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOffset' | 'contentInset' | 'maintainVisibleContentPosition' | 'stickyHeaderIndices'> & {
+declare class ScrollAdjustHandler {
+    private ctx;
+    private appliedAdjust;
+    private pendingAdjust;
+    private busy;
+    private context;
+    private firstAdjust;
+    constructor(ctx: any);
+    requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
+    getAppliedAdjust(): number;
+}
+
+type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, 'contentOffset' | 'contentInset' | 'maintainVisibleContentPosition' | 'stickyHeaderIndices'> & {
     data: ArrayLike<any> & ItemT[];
     initialScrollOffset?: number;
     initialScrollIndex?: number;
@@ -15,6 +28,7 @@ type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOf
     alignItemsAtEnd?: boolean;
     maintainVisibleContentPosition?: boolean;
     numColumns?: number;
+    refScrollView?: React.Ref<ScrollView>;
     estimatedItemSize?: number;
     getEstimatedItemSize?: (index: number, item: ItemT) => number;
     onStartReached?: ((info: {
@@ -36,14 +50,20 @@ type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOf
     viewabilityConfig?: ViewabilityConfig;
     onViewableItemsChanged?: OnViewableItemsChanged | undefined;
 };
+type LegendListProps<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof ScrollView>>;
 interface InternalState {
+    anchorElement?: {
+        id: string;
+        coordinate: number;
+    };
+    belowAnchorElementPositions?: Map<string, number>;
+    rowHeights: Map<number, number>;
     positions: Map<string, number>;
     columns: Map<string, number>;
     sizes: Map<string, number>;
     sizesLaidOut: Map<string, number> | undefined;
     pendingAdjust: number;
     animFrameLayout: any;
-    animFrameTotalSize: number | null;
     isStartReached: boolean;
     isEndReached: boolean;
     isAtBottom: boolean;
@@ -53,6 +73,7 @@ interface InternalState {
     hasScrolled: boolean;
     scrollLength: number;
     startBuffered: number;
+    startBufferedId?: string;
     startNoBuffer: number;
     endBuffered: number;
     endNoBuffer: number;
@@ -61,8 +82,9 @@ interface InternalState {
     scrollPrev: number;
     scrollPrevTime: number;
     scrollVelocity: number;
-    scrollAdjustPending: number;
+    scrollAdjustHandler: ScrollAdjustHandler;
     totalSize: number;
+    totalSizeBelowAnchor: number;
     timeouts: Set<number>;
     timeoutSizeMessage: any;
     nativeMarginTop: number;
@@ -78,6 +100,7 @@ interface InternalState {
         time: number;
     }>;
     scrollTimer: Timer | undefined;
+    startReachedBlockedByTimer: boolean;
 }
 interface ViewableRange<T> {
     startBuffered: number;
@@ -194,4 +217,4 @@ declare const LegendList: <T>(props: LegendListProps<T> & {
     ref?: ForwardedRef<LegendListRef>;
 }) => ReactElement;
 
-export { type InternalState, LegendList, type LegendListProps, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange };
+export { 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 };

package/index.d.ts

@@ -1,7 +1,20 @@
 import { ComponentProps, ReactNode, ForwardedRef, ReactElement } from 'react';
 import { ScrollView, StyleProp, ViewStyle, ScrollViewComponent, ScrollResponderMixin } from 'react-native';
+import Animated from 'react-native-reanimated';
 
-type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOffset' | 'contentInset' | 'maintainVisibleContentPosition' | 'stickyHeaderIndices'> & {
+declare class ScrollAdjustHandler {
+    private ctx;
+    private appliedAdjust;
+    private pendingAdjust;
+    private busy;
+    private context;
+    private firstAdjust;
+    constructor(ctx: any);
+    requestAdjust(adjust: number, onAdjusted: (diff: number) => void): void;
+    getAppliedAdjust(): number;
+}
+
+type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof ScrollView> | ComponentProps<typeof Animated.ScrollView>> = Omit<TScrollView, 'contentOffset' | 'contentInset' | 'maintainVisibleContentPosition' | 'stickyHeaderIndices'> & {
     data: ArrayLike<any> & ItemT[];
     initialScrollOffset?: number;
     initialScrollIndex?: number;
@@ -15,6 +28,7 @@ type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOf
     alignItemsAtEnd?: boolean;
     maintainVisibleContentPosition?: boolean;
     numColumns?: number;
+    refScrollView?: React.Ref<ScrollView>;
     estimatedItemSize?: number;
     getEstimatedItemSize?: (index: number, item: ItemT) => number;
     onStartReached?: ((info: {
@@ -36,14 +50,20 @@ type LegendListProps<ItemT> = Omit<ComponentProps<typeof ScrollView>, 'contentOf
     viewabilityConfig?: ViewabilityConfig;
     onViewableItemsChanged?: OnViewableItemsChanged | undefined;
 };
+type LegendListProps<ItemT> = LegendListPropsBase<ItemT, ComponentProps<typeof ScrollView>>;
 interface InternalState {
+    anchorElement?: {
+        id: string;
+        coordinate: number;
+    };
+    belowAnchorElementPositions?: Map<string, number>;
+    rowHeights: Map<number, number>;
     positions: Map<string, number>;
     columns: Map<string, number>;
     sizes: Map<string, number>;
     sizesLaidOut: Map<string, number> | undefined;
     pendingAdjust: number;
     animFrameLayout: any;
-    animFrameTotalSize: number | null;
     isStartReached: boolean;
     isEndReached: boolean;
     isAtBottom: boolean;
@@ -53,6 +73,7 @@ interface InternalState {
     hasScrolled: boolean;
     scrollLength: number;
     startBuffered: number;
+    startBufferedId?: string;
     startNoBuffer: number;
     endBuffered: number;
     endNoBuffer: number;
@@ -61,8 +82,9 @@ interface InternalState {
     scrollPrev: number;
     scrollPrevTime: number;
     scrollVelocity: number;
-    scrollAdjustPending: number;
+    scrollAdjustHandler: ScrollAdjustHandler;
     totalSize: number;
+    totalSizeBelowAnchor: number;
     timeouts: Set<number>;
     timeoutSizeMessage: any;
     nativeMarginTop: number;
@@ -78,6 +100,7 @@ interface InternalState {
         time: number;
     }>;
     scrollTimer: Timer | undefined;
+    startReachedBlockedByTimer: boolean;
 }
 interface ViewableRange<T> {
     startBuffered: number;
@@ -194,4 +217,4 @@ declare const LegendList: <T>(props: LegendListProps<T> & {
     ref?: ForwardedRef<LegendListRef>;
 }) => ReactElement;
 
-export { type InternalState, LegendList, type LegendListProps, type LegendListRecyclingState, type LegendListRef, type LegendListRenderItemProps, type OnViewableItemsChanged, type ViewAmountToken, type ViewToken, type ViewabilityAmountCallback, type ViewabilityCallback, type ViewabilityConfig, type ViewabilityConfigCallbackPair, type ViewabilityConfigCallbackPairs, type ViewableRange };
+export { 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 };