@rific/scroll-view 0.1.1 → 0.3.0
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/README.md +46 -7
- package/dist/index.d.mts +31 -10
- package/dist/index.d.ts +31 -10
- package/dist/index.js +663 -335
- package/dist/index.mjs +600 -272
- package/package.json +3 -3
- package/src/CustomList.tsx +38 -11
- package/src/FlatList.tsx +107 -22
- package/src/PullSearch.tsx +4 -3
- package/src/ScrollView.tsx +34 -11
- package/src/ScrollViewContext.ts +17 -4
- package/src/ScrollViewHeader.tsx +34 -31
- package/src/ScrollViewProvider.tsx +22 -6
- package/src/ScrollViewSettingsProvider.tsx +3 -3
- package/src/SectionList.tsx +37 -13
- package/src/__mocks__/auto-paper.ts +1 -0
- package/src/__mocks__/react-native-reanimated.ts +32 -1
- package/src/__tests__/FlatList.test.tsx +83 -0
- package/src/__tests__/ScrollViewProvider.test.tsx +2 -2
- package/src/__tests__/useScrollHandlerJS.test.ts +119 -0
- package/src/__tests__/useScrollInit.test.ts +251 -0
- package/src/index.ts +1 -0
- package/src/internal/ScrollViewChip.tsx +24 -8
- package/src/internal/useScrollHandler.ts +22 -23
- package/src/internal/useScrollHandlerJS.ts +141 -0
- package/src/internal/useScrollList.ts +16 -11
- package/src/useScrollInit.ts +200 -19
- package/src/out.txt +0 -61
package/README.md
CHANGED
|
@@ -38,7 +38,7 @@ import { ScrollViewSettingsProvider } from '@rific/scroll-view'
|
|
|
38
38
|
|
|
39
39
|
export default function RootLayout({ children }) {
|
|
40
40
|
return (
|
|
41
|
-
<ScrollViewSettingsProvider
|
|
41
|
+
<ScrollViewSettingsProvider initialValue={{ snapBack: true }}>
|
|
42
42
|
{children}
|
|
43
43
|
</ScrollViewSettingsProvider>
|
|
44
44
|
)
|
|
@@ -49,6 +49,18 @@ export default function RootLayout({ children }) {
|
|
|
49
49
|
|
|
50
50
|
## Components
|
|
51
51
|
|
|
52
|
+
### `ScrollViewSettingsProvider`
|
|
53
|
+
|
|
54
|
+
App-wide defaults for scroll settings. Wrap your root layout to set global defaults.
|
|
55
|
+
|
|
56
|
+
| Prop | Type | Description |
|
|
57
|
+
|------|------|-------------|
|
|
58
|
+
| `children` | `ReactNode` | — |
|
|
59
|
+
| `initialValue` | `Partial<ScrollViewSettings>` | Initial settings applied once on mount |
|
|
60
|
+
| `onChange` | `(settings: ScrollViewSettings) => void` | Called whenever settings change |
|
|
61
|
+
|
|
62
|
+
---
|
|
63
|
+
|
|
52
64
|
### `ScrollViewProvider`
|
|
53
65
|
|
|
54
66
|
Screen-level provider that owns header/footer state and scroll position. Must wrap `ScrollViewHeader`, `ScrollViewFooter`, and the scroll component.
|
|
@@ -105,14 +117,17 @@ Drop-in for React Native's `ScrollView`. Accepts all `ScrollViewProps` plus:
|
|
|
105
117
|
|
|
106
118
|
| Prop | Type | Description |
|
|
107
119
|
|------|------|-------------|
|
|
120
|
+
| `chipProps` | `ChipProps` | Customize the scroll-to-top chip (label, style, etc.) |
|
|
121
|
+
| `chipThreshold` | `number` | Scroll offset (px) before the chip appears. Default `100` |
|
|
108
122
|
| `footerFixed` | `boolean` | Pin footer for this scroll view; overrides provider |
|
|
109
|
-
| `headerFixed` | `boolean` | Pin header for this scroll view; overrides provider |
|
|
110
123
|
| `gesture` | `GestureType` | Compose with an external RNGH gesture |
|
|
124
|
+
| `headerFixed` | `boolean` | Pin header for this scroll view; overrides provider |
|
|
111
125
|
| `keyboardAware` | `boolean` | Add keyboard height to bottom content inset |
|
|
126
|
+
| `onChipPress` | `() => void` | Additional callback fired when the chip is pressed |
|
|
112
127
|
| `onRefresh` | `() => void` | Enables pull-to-refresh |
|
|
113
|
-
| `refreshing` | `boolean` | Controlled refreshing state |
|
|
114
128
|
| `pullSearchHeight` | `number` | Reserve space above content for `PullSearch` |
|
|
115
129
|
| `ref` | `RefObject<RNScrollView>` | Forward ref to the underlying scroll view |
|
|
130
|
+
| `refreshing` | `boolean` | Controlled refreshing state |
|
|
116
131
|
|
|
117
132
|
---
|
|
118
133
|
|
|
@@ -122,14 +137,17 @@ Drop-in for React Native's `FlatList`. Accepts all `FlatListProps<T>` plus:
|
|
|
122
137
|
|
|
123
138
|
| Prop | Type | Description |
|
|
124
139
|
|------|------|-------------|
|
|
125
|
-
| `
|
|
140
|
+
| `chipProps` | `ChipProps` | Customize the scroll-to-top/start chip (label, style, etc.) |
|
|
141
|
+
| `chipThreshold` | `number` | Scroll offset (px) before the chip appears. Default `100` |
|
|
126
142
|
| `footerFixed` | `boolean` | Pin footer for this list; overrides provider |
|
|
127
|
-
| `headerFixed` | `boolean` | Pin header for this list; overrides provider |
|
|
128
143
|
| `gesture` | `GestureType` | Compose with an external RNGH gesture |
|
|
144
|
+
| `headerFixed` | `boolean` | Pin header for this list; overrides provider |
|
|
129
145
|
| `keyboardAware` | `boolean` | Add keyboard height to bottom content inset |
|
|
146
|
+
| `onChipPress` | `() => void` | Additional callback fired when the chip is pressed |
|
|
130
147
|
| `onRefresh` | `() => Promise<void> \| void` | Enables pull-to-refresh |
|
|
131
148
|
| `pullSearchHeight` | `number` | Reserve space above content for `PullSearch` |
|
|
132
149
|
| `ref` | `RefObject<RNFlatList>` | Forward ref to the underlying list |
|
|
150
|
+
| `renderFilters` | `ReactNode` | Rendered below `ListHeaderComponent`, above list items |
|
|
133
151
|
|
|
134
152
|
Performance props are user-overridable with sensible defaults:
|
|
135
153
|
|
|
@@ -165,20 +183,41 @@ import { CustomList } from '@rific/scroll-view'
|
|
|
165
183
|
|
|
166
184
|
| Prop | Type | Description |
|
|
167
185
|
|------|------|-------------|
|
|
186
|
+
| `chipProps` | `ChipProps` | Customize the scroll-to-top chip (label, style, etc.) |
|
|
168
187
|
| `component` | `ComponentType<P>` | The list component to render |
|
|
169
|
-
| `renderFilters` | `ReactNode` | Rendered below `ListHeaderComponent`, above list items |
|
|
170
188
|
| `footerFixed` | `boolean` | Pin footer; overrides provider |
|
|
171
|
-
| `headerFixed` | `boolean` | Pin header; overrides provider |
|
|
172
189
|
| `gesture` | `GestureType` | Compose with an external RNGH gesture |
|
|
190
|
+
| `headerFixed` | `boolean` | Pin header; overrides provider |
|
|
173
191
|
| `keyboardAware` | `boolean` | Add keyboard height to bottom content inset |
|
|
174
192
|
| `onRefresh` | `() => Promise<void> \| void` | Enables pull-to-refresh |
|
|
175
193
|
| `pullSearchHeight` | `number` | Reserve space above content for `PullSearch` |
|
|
194
|
+
| `renderFilters` | `ReactNode` | Rendered below `ListHeaderComponent`, above list items |
|
|
176
195
|
| `scrollRef` | `RefObject<{ scrollToOffset }>` | Forward ref to the underlying list |
|
|
177
196
|
|
|
178
197
|
The underlying component receives `contentInset`, `contentOffset`, `onScroll`, `refreshControl`, and `scrollEventThrottle` — props it must support for the library to function.
|
|
179
198
|
|
|
180
199
|
---
|
|
181
200
|
|
|
201
|
+
### `ChipProps`
|
|
202
|
+
|
|
203
|
+
Passed via `chipProps` on any scroll component to customise the floating scroll-to-top chip. Accepts all `Chip` props from `@rific/auto-paper` except `compact`, `icon`, and `onPress` (which are managed by the library), plus:
|
|
204
|
+
|
|
205
|
+
| Prop | Type | Description |
|
|
206
|
+
|------|------|-------------|
|
|
207
|
+
| `label` | `ReactNode` | Override the default label ("Top" / "Start") |
|
|
208
|
+
| `style` | `ViewStyle` | Merged with the chip's default style |
|
|
209
|
+
|
|
210
|
+
```tsx
|
|
211
|
+
<FlatList
|
|
212
|
+
chipProps={{ label: 'Back to top', style: { opacity: 0.9 } }}
|
|
213
|
+
data={items}
|
|
214
|
+
renderItem={renderItem}
|
|
215
|
+
keyExtractor={(item) => item.id}
|
|
216
|
+
/>
|
|
217
|
+
```
|
|
218
|
+
|
|
219
|
+
---
|
|
220
|
+
|
|
182
221
|
### `PullSearch`
|
|
183
222
|
|
|
184
223
|
A search bar that lives above the list content and is revealed by pulling down. Use alongside `pullSearchHeight` on the scroll component.
|
package/dist/index.d.mts
CHANGED
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { ReactNode, ComponentType, RefObject } from 'react';
|
|
3
3
|
import { NativeSyntheticEvent, NativeScrollEvent, StyleProp, ViewStyle, FlatListProps as FlatListProps$1, FlatList as FlatList$1, ScrollViewProps as ScrollViewProps$1, ScrollView as ScrollView$1, SectionListProps as SectionListProps$1, SectionList as SectionList$1 } from 'react-native';
|
|
4
4
|
import { GestureType } from 'react-native-gesture-handler';
|
|
5
|
+
import { ChipProps as ChipProps$1 } from '@rific/auto-paper';
|
|
5
6
|
import * as redux from 'redux';
|
|
6
7
|
import * as _reduxjs_toolkit from '@reduxjs/toolkit';
|
|
7
8
|
import { PayloadAction } from '@reduxjs/toolkit';
|
|
8
9
|
import * as react_native_reanimated from 'react-native-reanimated';
|
|
9
10
|
import { SharedValue } from 'react-native-reanimated';
|
|
10
11
|
|
|
12
|
+
type ChipProps = Omit<ChipProps$1, 'compact' | 'icon' | 'onPress'> & {
|
|
13
|
+
label?: ReactNode;
|
|
14
|
+
};
|
|
15
|
+
|
|
11
16
|
type ScrollToOffsetRef = {
|
|
12
17
|
scrollToOffset: (params: {
|
|
13
18
|
animated?: boolean;
|
|
@@ -15,12 +20,15 @@ type ScrollToOffsetRef = {
|
|
|
15
20
|
}) => void;
|
|
16
21
|
};
|
|
17
22
|
type CustomListProps<P extends object> = Omit<P, 'contentInset' | 'contentOffset' | 'onScroll' | 'refreshControl' | 'scrollEventThrottle'> & {
|
|
23
|
+
chipProps?: ChipProps;
|
|
24
|
+
chipThreshold?: number;
|
|
18
25
|
component: ComponentType<P>;
|
|
19
26
|
renderFilters?: ReactNode;
|
|
20
27
|
footerFixed?: boolean;
|
|
21
28
|
gesture?: GestureType;
|
|
22
29
|
headerFixed?: boolean;
|
|
23
30
|
keyboardAware?: boolean;
|
|
31
|
+
onChipPress?: () => void;
|
|
24
32
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
25
33
|
onRefresh?: () => Promise<void> | void;
|
|
26
34
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -29,15 +37,18 @@ type CustomListProps<P extends object> = Omit<P, 'contentInset' | 'contentOffset
|
|
|
29
37
|
scrollRef?: RefObject<ScrollToOffsetRef | null>;
|
|
30
38
|
style?: StyleProp<ViewStyle>;
|
|
31
39
|
};
|
|
32
|
-
declare const CustomListInner: <P extends object>({ component: List, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, scrollRef, style, ...props }: CustomListProps<P>) => react.JSX.Element;
|
|
40
|
+
declare const CustomListInner: <P extends object>({ chipProps, chipThreshold, component: List, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, scrollRef, style, ...props }: CustomListProps<P>) => react.JSX.Element;
|
|
33
41
|
declare const CustomList: typeof CustomListInner;
|
|
34
42
|
|
|
35
43
|
type FlatListProps<T> = Omit<FlatListProps$1<T>, 'onRefresh' | 'refreshing'> & {
|
|
44
|
+
chipProps?: ChipProps;
|
|
45
|
+
chipThreshold?: number;
|
|
36
46
|
renderFilters?: ReactNode;
|
|
37
47
|
footerFixed?: boolean;
|
|
38
48
|
gesture?: GestureType;
|
|
39
49
|
headerFixed?: boolean;
|
|
40
50
|
keyboardAware?: boolean;
|
|
51
|
+
onChipPress?: () => void;
|
|
41
52
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
42
53
|
onRefresh?: () => Promise<void> | void;
|
|
43
54
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -45,7 +56,7 @@ type FlatListProps<T> = Omit<FlatListProps$1<T>, 'onRefresh' | 'refreshing'> & {
|
|
|
45
56
|
pullSearchHeight?: number;
|
|
46
57
|
ref?: RefObject<FlatList$1 | null>;
|
|
47
58
|
};
|
|
48
|
-
declare const FlatListInner: <T>({ contentContainerStyle: externalContentContainerStyle, data, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pagingEnabled, pullSearchHeight, removeClippedSubviews, showsHorizontalScrollIndicator, showsVerticalScrollIndicator, style, onContentSizeChange, ref: externalRef, windowSize, ...props }: FlatListProps<T>) => react.JSX.Element;
|
|
59
|
+
declare const FlatListInner: <T>({ chipProps, chipThreshold, columnWrapperStyle, contentContainerStyle: externalContentContainerStyle, data, initialNumToRender, keyExtractor, maxToRenderPerBatch, numColumns, renderFilters, renderItem, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pagingEnabled, pullSearchHeight, removeClippedSubviews, showsHorizontalScrollIndicator, showsVerticalScrollIndicator, style, onContentSizeChange, ref: externalRef, windowSize, ...props }: FlatListProps<T>) => react.JSX.Element;
|
|
49
60
|
declare const FlatList: typeof FlatListInner;
|
|
50
61
|
|
|
51
62
|
type PullSearchHandle = {
|
|
@@ -89,10 +100,13 @@ declare const scrollViewActions: _reduxjs_toolkit.CaseReducerActions<{
|
|
|
89
100
|
declare const scrollViewReducer: redux.Reducer<ScrollViewSettings>;
|
|
90
101
|
|
|
91
102
|
type ScrollViewProps = ScrollViewProps$1 & {
|
|
103
|
+
chipProps?: ChipProps;
|
|
104
|
+
chipThreshold?: number;
|
|
92
105
|
footerFixed?: boolean;
|
|
93
106
|
gesture?: GestureType;
|
|
94
107
|
headerFixed?: boolean;
|
|
95
108
|
keyboardAware?: boolean;
|
|
109
|
+
onChipPress?: () => void;
|
|
96
110
|
onRefresh?: () => void;
|
|
97
111
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
98
112
|
onScrollEndDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -100,7 +114,7 @@ type ScrollViewProps = ScrollViewProps$1 & {
|
|
|
100
114
|
ref?: RefObject<ScrollView$1 | null>;
|
|
101
115
|
refreshing?: boolean;
|
|
102
116
|
};
|
|
103
|
-
declare const ScrollViewInner: ({ children, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, style, ...props }: ScrollViewProps) => react.JSX.Element;
|
|
117
|
+
declare const ScrollViewInner: ({ chipProps, chipThreshold, children, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, style, ...props }: ScrollViewProps) => react.JSX.Element;
|
|
104
118
|
declare const ScrollView: typeof ScrollViewInner;
|
|
105
119
|
|
|
106
120
|
type ScrollViewContextType = {
|
|
@@ -109,10 +123,14 @@ type ScrollViewContextType = {
|
|
|
109
123
|
footerHeightShared: SharedValue<number>;
|
|
110
124
|
footerFixed: boolean;
|
|
111
125
|
footerOffset: SharedValue<number>;
|
|
112
|
-
headerHeight: number;
|
|
126
|
+
headerHeight: number | null;
|
|
113
127
|
headerHeightShared: SharedValue<number>;
|
|
114
128
|
headerFixed: boolean;
|
|
115
129
|
headerOffset: SharedValue<number>;
|
|
130
|
+
jsListGeneration: RefObject<number>;
|
|
131
|
+
listGeneration: SharedValue<number>;
|
|
132
|
+
onJsListUnmount: () => void;
|
|
133
|
+
onListUnmount: () => void;
|
|
116
134
|
progress: number | null;
|
|
117
135
|
pullSearchHeightShared: SharedValue<number>;
|
|
118
136
|
snapBackFooterShared: SharedValue<boolean>;
|
|
@@ -121,7 +139,7 @@ type ScrollViewContextType = {
|
|
|
121
139
|
scrollHeight: number;
|
|
122
140
|
scrollPosition: SharedValue<number>;
|
|
123
141
|
setFooterHeight: (h: number) => void;
|
|
124
|
-
setHeaderHeight: (h: number) => void;
|
|
142
|
+
setHeaderHeight: (h: number | null) => void;
|
|
125
143
|
setProgress: (p: number | null) => void;
|
|
126
144
|
setProgressing: (b: boolean) => void;
|
|
127
145
|
tabBarHeight: number;
|
|
@@ -167,20 +185,23 @@ declare const ScrollViewProvider: ({ blur, children, fixed, footerFixed, headerF
|
|
|
167
185
|
type ScrollViewSettingsProviderProps = {
|
|
168
186
|
children: ReactNode;
|
|
169
187
|
onChange?: (settings: ScrollViewSettings) => void;
|
|
170
|
-
|
|
188
|
+
initialValue?: Partial<ScrollViewSettings>;
|
|
171
189
|
};
|
|
172
|
-
declare const ScrollViewSettingsProvider: ({ children, onChange,
|
|
190
|
+
declare const ScrollViewSettingsProvider: ({ children, onChange, initialValue }: ScrollViewSettingsProviderProps) => react.JSX.Element;
|
|
173
191
|
|
|
174
192
|
type SectionListProps<ItemT, SectionT extends {
|
|
175
193
|
data: ReadonlyArray<ItemT>;
|
|
176
194
|
} = {
|
|
177
195
|
data: ReadonlyArray<ItemT>;
|
|
178
196
|
}> = Omit<SectionListProps$1<ItemT, SectionT>, 'horizontal'> & {
|
|
197
|
+
chipProps?: ChipProps;
|
|
198
|
+
chipThreshold?: number;
|
|
179
199
|
renderFilters?: ReactNode;
|
|
180
200
|
footerFixed?: boolean;
|
|
181
201
|
gesture?: GestureType;
|
|
182
202
|
headerFixed?: boolean;
|
|
183
203
|
keyboardAware?: boolean;
|
|
204
|
+
onChipPress?: () => void;
|
|
184
205
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
185
206
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
186
207
|
onScrollEndDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -191,7 +212,7 @@ declare const SectionListInner: <ItemT, SectionT extends {
|
|
|
191
212
|
data: ReadonlyArray<ItemT>;
|
|
192
213
|
} = {
|
|
193
214
|
data: ReadonlyArray<ItemT>;
|
|
194
|
-
}>({ contentContainerStyle: externalContentContainerStyle, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onContentSizeChange, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, removeClippedSubviews, sections, showsVerticalScrollIndicator, style, ref: externalRef, windowSize, ...props }: SectionListProps<ItemT, SectionT>) => react.JSX.Element;
|
|
215
|
+
}>({ chipProps, chipThreshold, contentContainerStyle: externalContentContainerStyle, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onContentSizeChange, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, removeClippedSubviews, sections, showsVerticalScrollIndicator, style, ref: externalRef, windowSize, ...props }: SectionListProps<ItemT, SectionT>) => react.JSX.Element;
|
|
195
216
|
declare const SectionList: typeof SectionListInner;
|
|
196
217
|
|
|
197
218
|
declare const useKeyboardInset: () => number;
|
|
@@ -207,4 +228,4 @@ declare const useScrollView: () => {
|
|
|
207
228
|
|
|
208
229
|
declare const useScrollViewSettings: () => ScrollViewSettingsContextType;
|
|
209
230
|
|
|
210
|
-
export { CustomList, type CustomListProps, FlatList, type FlatListProps, PullSearch, type PullSearchHandle, type PullSearchProps, ScrollView, ScrollViewContext, type ScrollViewContextType, ScrollViewFooter, type ScrollViewFooterProps, ScrollViewHeader, type ScrollViewHeaderProps, type ScrollViewProps, ScrollViewProvider, type ScrollViewProviderProps, type ScrollViewSettings, ScrollViewSettingsContext, type ScrollViewSettingsContextType, ScrollViewSettingsProvider, type ScrollViewSettingsProviderProps, SectionList, type SectionListProps, defaultScrollViewSettings, scrollViewActions, scrollViewReducer, useKeyboardInset, useScrollView, useScrollViewSettings };
|
|
231
|
+
export { type ChipProps, CustomList, type CustomListProps, FlatList, type FlatListProps, PullSearch, type PullSearchHandle, type PullSearchProps, ScrollView, ScrollViewContext, type ScrollViewContextType, ScrollViewFooter, type ScrollViewFooterProps, ScrollViewHeader, type ScrollViewHeaderProps, type ScrollViewProps, ScrollViewProvider, type ScrollViewProviderProps, type ScrollViewSettings, ScrollViewSettingsContext, type ScrollViewSettingsContextType, ScrollViewSettingsProvider, type ScrollViewSettingsProviderProps, SectionList, type SectionListProps, defaultScrollViewSettings, scrollViewActions, scrollViewReducer, useKeyboardInset, useScrollView, useScrollViewSettings };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { ReactNode, ComponentType, RefObject } from 'react';
|
|
3
3
|
import { NativeSyntheticEvent, NativeScrollEvent, StyleProp, ViewStyle, FlatListProps as FlatListProps$1, FlatList as FlatList$1, ScrollViewProps as ScrollViewProps$1, ScrollView as ScrollView$1, SectionListProps as SectionListProps$1, SectionList as SectionList$1 } from 'react-native';
|
|
4
4
|
import { GestureType } from 'react-native-gesture-handler';
|
|
5
|
+
import { ChipProps as ChipProps$1 } from '@rific/auto-paper';
|
|
5
6
|
import * as redux from 'redux';
|
|
6
7
|
import * as _reduxjs_toolkit from '@reduxjs/toolkit';
|
|
7
8
|
import { PayloadAction } from '@reduxjs/toolkit';
|
|
8
9
|
import * as react_native_reanimated from 'react-native-reanimated';
|
|
9
10
|
import { SharedValue } from 'react-native-reanimated';
|
|
10
11
|
|
|
12
|
+
type ChipProps = Omit<ChipProps$1, 'compact' | 'icon' | 'onPress'> & {
|
|
13
|
+
label?: ReactNode;
|
|
14
|
+
};
|
|
15
|
+
|
|
11
16
|
type ScrollToOffsetRef = {
|
|
12
17
|
scrollToOffset: (params: {
|
|
13
18
|
animated?: boolean;
|
|
@@ -15,12 +20,15 @@ type ScrollToOffsetRef = {
|
|
|
15
20
|
}) => void;
|
|
16
21
|
};
|
|
17
22
|
type CustomListProps<P extends object> = Omit<P, 'contentInset' | 'contentOffset' | 'onScroll' | 'refreshControl' | 'scrollEventThrottle'> & {
|
|
23
|
+
chipProps?: ChipProps;
|
|
24
|
+
chipThreshold?: number;
|
|
18
25
|
component: ComponentType<P>;
|
|
19
26
|
renderFilters?: ReactNode;
|
|
20
27
|
footerFixed?: boolean;
|
|
21
28
|
gesture?: GestureType;
|
|
22
29
|
headerFixed?: boolean;
|
|
23
30
|
keyboardAware?: boolean;
|
|
31
|
+
onChipPress?: () => void;
|
|
24
32
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
25
33
|
onRefresh?: () => Promise<void> | void;
|
|
26
34
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -29,15 +37,18 @@ type CustomListProps<P extends object> = Omit<P, 'contentInset' | 'contentOffset
|
|
|
29
37
|
scrollRef?: RefObject<ScrollToOffsetRef | null>;
|
|
30
38
|
style?: StyleProp<ViewStyle>;
|
|
31
39
|
};
|
|
32
|
-
declare const CustomListInner: <P extends object>({ component: List, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, scrollRef, style, ...props }: CustomListProps<P>) => react.JSX.Element;
|
|
40
|
+
declare const CustomListInner: <P extends object>({ chipProps, chipThreshold, component: List, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, scrollRef, style, ...props }: CustomListProps<P>) => react.JSX.Element;
|
|
33
41
|
declare const CustomList: typeof CustomListInner;
|
|
34
42
|
|
|
35
43
|
type FlatListProps<T> = Omit<FlatListProps$1<T>, 'onRefresh' | 'refreshing'> & {
|
|
44
|
+
chipProps?: ChipProps;
|
|
45
|
+
chipThreshold?: number;
|
|
36
46
|
renderFilters?: ReactNode;
|
|
37
47
|
footerFixed?: boolean;
|
|
38
48
|
gesture?: GestureType;
|
|
39
49
|
headerFixed?: boolean;
|
|
40
50
|
keyboardAware?: boolean;
|
|
51
|
+
onChipPress?: () => void;
|
|
41
52
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
42
53
|
onRefresh?: () => Promise<void> | void;
|
|
43
54
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -45,7 +56,7 @@ type FlatListProps<T> = Omit<FlatListProps$1<T>, 'onRefresh' | 'refreshing'> & {
|
|
|
45
56
|
pullSearchHeight?: number;
|
|
46
57
|
ref?: RefObject<FlatList$1 | null>;
|
|
47
58
|
};
|
|
48
|
-
declare const FlatListInner: <T>({ contentContainerStyle: externalContentContainerStyle, data, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pagingEnabled, pullSearchHeight, removeClippedSubviews, showsHorizontalScrollIndicator, showsVerticalScrollIndicator, style, onContentSizeChange, ref: externalRef, windowSize, ...props }: FlatListProps<T>) => react.JSX.Element;
|
|
59
|
+
declare const FlatListInner: <T>({ chipProps, chipThreshold, columnWrapperStyle, contentContainerStyle: externalContentContainerStyle, data, initialNumToRender, keyExtractor, maxToRenderPerBatch, numColumns, renderFilters, renderItem, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pagingEnabled, pullSearchHeight, removeClippedSubviews, showsHorizontalScrollIndicator, showsVerticalScrollIndicator, style, onContentSizeChange, ref: externalRef, windowSize, ...props }: FlatListProps<T>) => react.JSX.Element;
|
|
49
60
|
declare const FlatList: typeof FlatListInner;
|
|
50
61
|
|
|
51
62
|
type PullSearchHandle = {
|
|
@@ -89,10 +100,13 @@ declare const scrollViewActions: _reduxjs_toolkit.CaseReducerActions<{
|
|
|
89
100
|
declare const scrollViewReducer: redux.Reducer<ScrollViewSettings>;
|
|
90
101
|
|
|
91
102
|
type ScrollViewProps = ScrollViewProps$1 & {
|
|
103
|
+
chipProps?: ChipProps;
|
|
104
|
+
chipThreshold?: number;
|
|
92
105
|
footerFixed?: boolean;
|
|
93
106
|
gesture?: GestureType;
|
|
94
107
|
headerFixed?: boolean;
|
|
95
108
|
keyboardAware?: boolean;
|
|
109
|
+
onChipPress?: () => void;
|
|
96
110
|
onRefresh?: () => void;
|
|
97
111
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
98
112
|
onScrollEndDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -100,7 +114,7 @@ type ScrollViewProps = ScrollViewProps$1 & {
|
|
|
100
114
|
ref?: RefObject<ScrollView$1 | null>;
|
|
101
115
|
refreshing?: boolean;
|
|
102
116
|
};
|
|
103
|
-
declare const ScrollViewInner: ({ children, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, style, ...props }: ScrollViewProps) => react.JSX.Element;
|
|
117
|
+
declare const ScrollViewInner: ({ chipProps, chipThreshold, children, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, horizontal, keyboardAware, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, style, ...props }: ScrollViewProps) => react.JSX.Element;
|
|
104
118
|
declare const ScrollView: typeof ScrollViewInner;
|
|
105
119
|
|
|
106
120
|
type ScrollViewContextType = {
|
|
@@ -109,10 +123,14 @@ type ScrollViewContextType = {
|
|
|
109
123
|
footerHeightShared: SharedValue<number>;
|
|
110
124
|
footerFixed: boolean;
|
|
111
125
|
footerOffset: SharedValue<number>;
|
|
112
|
-
headerHeight: number;
|
|
126
|
+
headerHeight: number | null;
|
|
113
127
|
headerHeightShared: SharedValue<number>;
|
|
114
128
|
headerFixed: boolean;
|
|
115
129
|
headerOffset: SharedValue<number>;
|
|
130
|
+
jsListGeneration: RefObject<number>;
|
|
131
|
+
listGeneration: SharedValue<number>;
|
|
132
|
+
onJsListUnmount: () => void;
|
|
133
|
+
onListUnmount: () => void;
|
|
116
134
|
progress: number | null;
|
|
117
135
|
pullSearchHeightShared: SharedValue<number>;
|
|
118
136
|
snapBackFooterShared: SharedValue<boolean>;
|
|
@@ -121,7 +139,7 @@ type ScrollViewContextType = {
|
|
|
121
139
|
scrollHeight: number;
|
|
122
140
|
scrollPosition: SharedValue<number>;
|
|
123
141
|
setFooterHeight: (h: number) => void;
|
|
124
|
-
setHeaderHeight: (h: number) => void;
|
|
142
|
+
setHeaderHeight: (h: number | null) => void;
|
|
125
143
|
setProgress: (p: number | null) => void;
|
|
126
144
|
setProgressing: (b: boolean) => void;
|
|
127
145
|
tabBarHeight: number;
|
|
@@ -167,20 +185,23 @@ declare const ScrollViewProvider: ({ blur, children, fixed, footerFixed, headerF
|
|
|
167
185
|
type ScrollViewSettingsProviderProps = {
|
|
168
186
|
children: ReactNode;
|
|
169
187
|
onChange?: (settings: ScrollViewSettings) => void;
|
|
170
|
-
|
|
188
|
+
initialValue?: Partial<ScrollViewSettings>;
|
|
171
189
|
};
|
|
172
|
-
declare const ScrollViewSettingsProvider: ({ children, onChange,
|
|
190
|
+
declare const ScrollViewSettingsProvider: ({ children, onChange, initialValue }: ScrollViewSettingsProviderProps) => react.JSX.Element;
|
|
173
191
|
|
|
174
192
|
type SectionListProps<ItemT, SectionT extends {
|
|
175
193
|
data: ReadonlyArray<ItemT>;
|
|
176
194
|
} = {
|
|
177
195
|
data: ReadonlyArray<ItemT>;
|
|
178
196
|
}> = Omit<SectionListProps$1<ItemT, SectionT>, 'horizontal'> & {
|
|
197
|
+
chipProps?: ChipProps;
|
|
198
|
+
chipThreshold?: number;
|
|
179
199
|
renderFilters?: ReactNode;
|
|
180
200
|
footerFixed?: boolean;
|
|
181
201
|
gesture?: GestureType;
|
|
182
202
|
headerFixed?: boolean;
|
|
183
203
|
keyboardAware?: boolean;
|
|
204
|
+
onChipPress?: () => void;
|
|
184
205
|
onMomentumScrollEnd?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
185
206
|
onScrollBeginDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
186
207
|
onScrollEndDrag?: (e: NativeSyntheticEvent<NativeScrollEvent>) => void;
|
|
@@ -191,7 +212,7 @@ declare const SectionListInner: <ItemT, SectionT extends {
|
|
|
191
212
|
data: ReadonlyArray<ItemT>;
|
|
192
213
|
} = {
|
|
193
214
|
data: ReadonlyArray<ItemT>;
|
|
194
|
-
}>({ contentContainerStyle: externalContentContainerStyle, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onContentSizeChange, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, removeClippedSubviews, sections, showsVerticalScrollIndicator, style, ref: externalRef, windowSize, ...props }: SectionListProps<ItemT, SectionT>) => react.JSX.Element;
|
|
215
|
+
}>({ chipProps, chipThreshold, contentContainerStyle: externalContentContainerStyle, initialNumToRender, maxToRenderPerBatch, renderFilters, footerFixed: footerFixedProp, gesture, headerFixed: headerFixedProp, keyboardAware, ListHeaderComponent: externalListHeaderComponent, onChipPress, onMomentumScrollEnd: externalMomentumScrollEnd, onRefresh, onContentSizeChange, onScrollBeginDrag: externalScrollBeginDrag, onScrollEndDrag: externalScrollEndDrag, pullSearchHeight, refreshing, removeClippedSubviews, sections, showsVerticalScrollIndicator, style, ref: externalRef, windowSize, ...props }: SectionListProps<ItemT, SectionT>) => react.JSX.Element;
|
|
195
216
|
declare const SectionList: typeof SectionListInner;
|
|
196
217
|
|
|
197
218
|
declare const useKeyboardInset: () => number;
|
|
@@ -207,4 +228,4 @@ declare const useScrollView: () => {
|
|
|
207
228
|
|
|
208
229
|
declare const useScrollViewSettings: () => ScrollViewSettingsContextType;
|
|
209
230
|
|
|
210
|
-
export { CustomList, type CustomListProps, FlatList, type FlatListProps, PullSearch, type PullSearchHandle, type PullSearchProps, ScrollView, ScrollViewContext, type ScrollViewContextType, ScrollViewFooter, type ScrollViewFooterProps, ScrollViewHeader, type ScrollViewHeaderProps, type ScrollViewProps, ScrollViewProvider, type ScrollViewProviderProps, type ScrollViewSettings, ScrollViewSettingsContext, type ScrollViewSettingsContextType, ScrollViewSettingsProvider, type ScrollViewSettingsProviderProps, SectionList, type SectionListProps, defaultScrollViewSettings, scrollViewActions, scrollViewReducer, useKeyboardInset, useScrollView, useScrollViewSettings };
|
|
231
|
+
export { type ChipProps, CustomList, type CustomListProps, FlatList, type FlatListProps, PullSearch, type PullSearchHandle, type PullSearchProps, ScrollView, ScrollViewContext, type ScrollViewContextType, ScrollViewFooter, type ScrollViewFooterProps, ScrollViewHeader, type ScrollViewHeaderProps, type ScrollViewProps, ScrollViewProvider, type ScrollViewProviderProps, type ScrollViewSettings, ScrollViewSettingsContext, type ScrollViewSettingsContextType, ScrollViewSettingsProvider, type ScrollViewSettingsProviderProps, SectionList, type SectionListProps, defaultScrollViewSettings, scrollViewActions, scrollViewReducer, useKeyboardInset, useScrollView, useScrollViewSettings };
|