@r0b0t3d/react-native-collapsible 1.3.4 → 1.3.5-beta.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.
Files changed (27) hide show
  1. package/lib/commonjs/components/header/AnimatedTopView.js +1 -2
  2. package/lib/commonjs/components/header/AnimatedTopView.js.map +1 -1
  3. package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js +1 -2
  4. package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js.map +1 -1
  5. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js +36 -25
  6. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js.map +1 -1
  7. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js +28 -2
  8. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js.map +1 -1
  9. package/lib/commonjs/withCollapsibleContext.js +1 -3
  10. package/lib/commonjs/withCollapsibleContext.js.map +1 -1
  11. package/lib/module/components/header/AnimatedTopView.js +1 -2
  12. package/lib/module/components/header/AnimatedTopView.js.map +1 -1
  13. package/lib/module/components/header/CollapsibleHeaderConsumer.js +1 -2
  14. package/lib/module/components/header/CollapsibleHeaderConsumer.js.map +1 -1
  15. package/lib/module/components/scrollable/CollapsibleFlatList.js +35 -23
  16. package/lib/module/components/scrollable/CollapsibleFlatList.js.map +1 -1
  17. package/lib/module/components/scrollable/CollapsibleScrollView.js +31 -5
  18. package/lib/module/components/scrollable/CollapsibleScrollView.js.map +1 -1
  19. package/lib/module/withCollapsibleContext.js +1 -2
  20. package/lib/module/withCollapsibleContext.js.map +1 -1
  21. package/lib/typescript/components/scrollable/CollapsibleScrollView.d.ts +3 -1
  22. package/package.json +1 -1
  23. package/src/components/header/AnimatedTopView.tsx +0 -1
  24. package/src/components/header/CollapsibleHeaderConsumer.tsx +2 -3
  25. package/src/components/scrollable/CollapsibleFlatList.tsx +59 -42
  26. package/src/components/scrollable/CollapsibleScrollView.tsx +55 -5
  27. package/src/withCollapsibleContext.tsx +2 -5
@@ -19,8 +19,7 @@ function AnimatedTopView({
19
19
  height
20
20
  }) {
21
21
  const contentStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
22
- paddingTop: height.value,
23
- backgroundColor: 'white'
22
+ paddingTop: height.value
24
23
  }), []);
25
24
  return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
26
25
  style: contentStyle
@@ -1 +1 @@
1
- {"version":3,"sources":["AnimatedTopView.tsx"],"names":["AnimatedTopView","height","contentStyle","paddingTop","value","backgroundColor"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;AAMe,SAASA,eAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAA4C;AACzD,QAAMC,YAAY,GAAG,6CACnB,OAAO;AACLC,IAAAA,UAAU,EAAEF,MAAM,CAACG,KADd;AAELC,IAAAA,eAAe,EAAE;AAFZ,GAAP,CADmB,EAKnB,EALmB,CAArB;AAQA,sBAAO,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEH;AAAtB,IAAP;AACD","sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\ntype Props = {\n height: Animated.SharedValue<number>;\n};\n\nexport default function AnimatedTopView({ height }: Props) {\n const contentStyle = useAnimatedStyle(\n () => ({\n paddingTop: height.value,\n backgroundColor: 'white',\n }),\n []\n );\n\n return <Animated.View style={contentStyle} />;\n}\n"]}
1
+ {"version":3,"sources":["AnimatedTopView.tsx"],"names":["AnimatedTopView","height","contentStyle","paddingTop","value"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;AAMe,SAASA,eAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAA4C;AACzD,QAAMC,YAAY,GAAG,6CACnB,OAAO;AACLC,IAAAA,UAAU,EAAEF,MAAM,CAACG;AADd,GAAP,CADmB,EAInB,EAJmB,CAArB;AAOA,sBAAO,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEF;AAAtB,IAAP;AACD","sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\ntype Props = {\n height: Animated.SharedValue<number>;\n};\n\nexport default function AnimatedTopView({ height }: Props) {\n const contentStyle = useAnimatedStyle(\n () => ({\n paddingTop: height.value,\n }),\n []\n );\n\n return <Animated.View style={contentStyle} />;\n}\n"]}
@@ -35,7 +35,7 @@ function CollapsibleHeaderConsumer() {
35
35
  headerHeight
36
36
  } = (0, _useCollapsibleContext.default)();
37
37
  const headerTranslate = (0, _reactNativeReanimated.useDerivedValue)(() => (0, _reactNativeReanimated.interpolate)(scrollY.value, // FIXME: can improve by geting maxY value of header and sticky views
38
- [-250, 0, 100000], [250, 0, -100000], _reactNativeReanimated.default.Extrapolate.CLAMP), []);
38
+ [-1000, 0, 100000], [0, 0, -100000], _reactNativeReanimated.default.Extrapolate.CLAMP), []);
39
39
  const headerStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
40
40
  return {
41
41
  transform: [{
@@ -61,7 +61,6 @@ function CollapsibleHeaderConsumer() {
61
61
 
62
62
  const styles = _reactNative.StyleSheet.create({
63
63
  container: {
64
- backgroundColor: 'white',
65
64
  zIndex: 10
66
65
  }
67
66
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Animated","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","StyleSheet","create","backgroundColor","zIndex"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAEe,SAASA,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAc,2CAApB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAkC,6CAAxC;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4B,qCAAlC;AAEA,QAAMC,eAAe,GAAG,4CACtB,MACE,wCACEF,OAAO,CAACG,KADV,EAEE;AACA,GAAC,CAAC,GAAF,EAAO,CAAP,EAAU,MAAV,CAHF,EAIE,CAAC,GAAD,EAAM,CAAN,EAAS,CAAC,MAAV,CAJF,EAKEC,+BAASC,WAAT,CAAqBC,KALvB,CAFoB,EAStB,EATsB,CAAxB;AAYA,QAAMC,WAAW,GAAG,6CAAiB,MAAM;AACzC,WAAO;AACLC,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEP,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmB,EAIjB,CAACF,YAAD,EAAeC,eAAf,CAJiB,CAApB;AAMA,QAAMQ,kBAAkB,GAAG,wBACzB,CAAC;AACCC,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBd,IAAAA,2BAA2B,CAACc,MAAD,CAA3B;AACD,GAPwB,EAQzB,CAACd,2BAAD,CARyB,CAA3B;AAWA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEW,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGT,OAAO,CAACkB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;;AAED,MAAMJ,MAAM,GAAGK,wBAAWC,MAAX,CAAkB;AAC/BL,EAAAA,SAAS,EAAE;AACTM,IAAAA,eAAe,EAAE,OADR;AAETC,IAAAA,MAAM,EAAE;AAFC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n const { headers } = useCollapsibleHeaderContext();\n const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n const { scrollY, headerHeight } = useCollapsibleContext();\n\n const headerTranslate = useDerivedValue(\n () =>\n interpolate(\n scrollY.value,\n // FIXME: can improve by geting maxY value of header and sticky views\n [-250, 0, 100000],\n [250, 0, -100000],\n Animated.Extrapolate.CLAMP\n ),\n []\n );\n\n const headerStyle = useAnimatedStyle(() => {\n return {\n transform: [{ translateY: headerTranslate.value }],\n };\n }, [headerHeight, headerTranslate]);\n\n const handleHeaderLayout = useCallback(\n ({\n nativeEvent: {\n layout: { height },\n },\n }: LayoutChangeEvent) => {\n handleHeaderContainerLayout(height);\n },\n [handleHeaderContainerLayout]\n );\n\n return (\n <Animated.View\n onLayout={handleHeaderLayout}\n style={[styles.container, headerStyle]}\n pointerEvents=\"box-none\"\n >\n {headers.map((item) => item.children)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: 'white',\n zIndex: 10,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Animated","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","StyleSheet","create","zIndex"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAEe,SAASA,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAc,2CAApB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAkC,6CAAxC;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4B,qCAAlC;AAEA,QAAMC,eAAe,GAAG,4CACtB,MACE,wCACEF,OAAO,CAACG,KADV,EAEE;AACA,GAAC,CAAC,IAAF,EAAQ,CAAR,EAAW,MAAX,CAHF,EAIE,CAAC,CAAD,EAAI,CAAJ,EAAO,CAAC,MAAR,CAJF,EAKEC,+BAASC,WAAT,CAAqBC,KALvB,CAFoB,EAStB,EATsB,CAAxB;AAYA,QAAMC,WAAW,GAAG,6CAAiB,MAAM;AACzC,WAAO;AACLC,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEP,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmB,EAIjB,CAACF,YAAD,EAAeC,eAAf,CAJiB,CAApB;AAMA,QAAMQ,kBAAkB,GAAG,wBACzB,CAAC;AACCC,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBd,IAAAA,2BAA2B,CAACc,MAAD,CAA3B;AACD,GAPwB,EAQzB,CAACd,2BAAD,CARyB,CAA3B;AAWA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEW,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGT,OAAO,CAACkB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;;AAED,MAAMJ,MAAM,GAAGK,wBAAWC,MAAX,CAAkB;AAC/BL,EAAAA,SAAS,EAAE;AACTM,IAAAA,MAAM,EAAE;AADC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n const { headers } = useCollapsibleHeaderContext();\n const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n const { scrollY, headerHeight } = useCollapsibleContext();\n\n const headerTranslate = useDerivedValue(\n () =>\n interpolate(\n scrollY.value,\n // FIXME: can improve by geting maxY value of header and sticky views\n [-1000, 0, 100000],\n [0, 0, -100000],\n Animated.Extrapolate.CLAMP\n ),\n []\n );\n\n const headerStyle = useAnimatedStyle(() => {\n return {\n transform: [{ translateY: headerTranslate.value }],\n };\n }, [headerHeight, headerTranslate]);\n\n const handleHeaderLayout = useCallback(\n ({\n nativeEvent: {\n layout: { height },\n },\n }: LayoutChangeEvent) => {\n handleHeaderContainerLayout(height);\n },\n [handleHeaderContainerLayout]\n );\n\n return (\n <Animated.View\n onLayout={handleHeaderLayout}\n style={[styles.container, headerStyle]}\n pointerEvents=\"box-none\"\n >\n {headers.map((item) => item.children)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n zIndex: 10,\n },\n});\n"]}
@@ -11,15 +11,13 @@ var _reactNative = require("react-native");
11
11
 
12
12
  var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
13
13
 
14
- var _AnimatedTopView = _interopRequireDefault(require("../header/AnimatedTopView"));
15
-
16
14
  var _useAnimatedScroll = _interopRequireDefault(require("./useAnimatedScroll"));
17
15
 
18
- var _useCollapsibleContext = _interopRequireDefault(require("../../hooks/useCollapsibleContext"));
19
-
20
16
  var _useInternalCollapsibleContext = _interopRequireDefault(require("../../hooks/useInternalCollapsibleContext"));
21
17
 
22
- var _PullToRefreshContainer = _interopRequireDefault(require("../pullToRefresh/PullToRefreshContainer"));
18
+ var _AnimatedTopView = _interopRequireDefault(require("../header/AnimatedTopView"));
19
+
20
+ var _useCollapsibleContext = _interopRequireDefault(require("../../hooks/useCollapsibleContext"));
23
21
 
24
22
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
23
 
@@ -36,15 +34,17 @@ function CollapsibleFlatList({
36
34
  ...props
37
35
  }) {
38
36
  const {
39
- headerHeight,
40
- scrollY
37
+ headerHeight
41
38
  } = (0, _useCollapsibleContext.default)();
42
39
  const {
43
40
  contentMinHeight,
44
- scrollViewRef
41
+ scrollViewRef,
42
+ fixedHeaderHeight
45
43
  } = (0, _useInternalCollapsibleContext.default)();
46
44
  const mounted = (0, _react.useRef)(true);
47
45
  const contentHeight = (0, _react.useRef)(0);
46
+ const [internalContentMinHeight, setInternalContentMinHeight] = (0, _react.useState)(contentMinHeight.value);
47
+ const [internalProgressViewOffset, setInternalProgressViewOffset] = (0, _react.useState)(0);
48
48
  (0, _react.useEffect)(() => {
49
49
  return () => {
50
50
  mounted.current = false;
@@ -63,11 +63,6 @@ function CollapsibleFlatList({
63
63
 
64
64
  (_scrollViewRef$curren2 = scrollViewRef.current) === null || _scrollViewRef$curren2 === void 0 ? void 0 : _scrollViewRef$curren2.scrollToIndex(params);
65
65
  }, []);
66
- const handleInternalContentHeight = (0, _react.useCallback)(value => {
67
- if (mounted.current) {
68
- setInternalContentMinHeight(value);
69
- }
70
- }, []);
71
66
  const {
72
67
  scrollHandler
73
68
  } = (0, _useAnimatedScroll.default)({
@@ -75,16 +70,32 @@ function CollapsibleFlatList({
75
70
  scrollTo,
76
71
  scrollToIndex
77
72
  });
78
- const [internalContentMinHeight, setInternalContentMinHeight] = (0, _react.useState)(contentMinHeight.value);
73
+ const handleInternalContentHeight = (0, _react.useCallback)(value => {
74
+ if (mounted.current) {
75
+ setInternalContentMinHeight(value);
76
+ }
77
+ }, []);
78
+ const handleInternalProgressViewOffset = (0, _react.useCallback)(value => {
79
+ if (mounted.current) {
80
+ setInternalProgressViewOffset(value);
81
+ }
82
+ }, []);
79
83
  (0, _reactNativeReanimated.useAnimatedReaction)(() => {
80
84
  return contentMinHeight.value;
81
85
  }, (result, previous) => {
82
86
  if (result !== previous) {
83
- if (contentHeight.current < contentMinHeight.value && internalContentMinHeight !== contentMinHeight.value) {
84
- (0, _reactNativeReanimated.runOnJS)(handleInternalContentHeight)(contentMinHeight.value);
87
+ if (contentHeight.current < result && internalContentMinHeight !== result) {
88
+ (0, _reactNativeReanimated.runOnJS)(handleInternalContentHeight)(result);
85
89
  }
86
90
  }
87
91
  });
92
+ (0, _reactNativeReanimated.useAnimatedReaction)(() => {
93
+ return fixedHeaderHeight.value;
94
+ }, (result, previous) => {
95
+ if (result !== previous) {
96
+ (0, _reactNativeReanimated.runOnJS)(handleInternalProgressViewOffset)(result);
97
+ }
98
+ });
88
99
  const contentContainerStyle = (0, _react.useMemo)(() => [styles.contentContainer, {
89
100
  minHeight: internalContentMinHeight
90
101
  }, props.contentContainerStyle], [props.contentContainerStyle, internalContentMinHeight]);
@@ -93,15 +104,14 @@ function CollapsibleFlatList({
93
104
  }, []);
94
105
  const handleScrollToIndexFailed = (0, _react.useCallback)(() => {}, []);
95
106
 
96
- const renderListHeader = () => /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_AnimatedTopView.default, {
97
- height: headerHeight
98
- }), props.ListHeaderComponent);
107
+ function renderListHeader() {
108
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_AnimatedTopView.default, {
109
+ height: headerHeight
110
+ }), props.ListHeaderComponent);
111
+ }
99
112
 
100
- return /*#__PURE__*/_react.default.createElement(_PullToRefreshContainer.default, {
101
- scrollY: scrollY
102
- }, /*#__PURE__*/_react.default.createElement(AnimatedFlatList, _extends({
113
+ return /*#__PURE__*/_react.default.createElement(AnimatedFlatList, _extends({
103
114
  ref: scrollViewRef,
104
- bounces: false,
105
115
  keyboardDismissMode: "on-drag",
106
116
  keyboardShouldPersistTaps: "handled",
107
117
  scrollEventThrottle: 1,
@@ -113,8 +123,9 @@ function CollapsibleFlatList({
113
123
  ListHeaderComponent: renderListHeader(),
114
124
  onContentSizeChange: handleContentSizeChange //@ts-ignore
115
125
  ,
116
- simultaneousHandlers: []
117
- })));
126
+ simultaneousHandlers: [],
127
+ progressViewOffset: internalProgressViewOffset
128
+ }));
118
129
  }
119
130
 
120
131
  const styles = _reactNative.StyleSheet.create({
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","CollapsibleFlatList","headerSnappable","props","headerHeight","scrollY","contentMinHeight","scrollViewRef","mounted","contentHeight","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","handleInternalContentHeight","value","setInternalContentMinHeight","scrollHandler","internalContentMinHeight","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","StyleSheet","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n} from 'react-native-reanimated';\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport PullToRefreshContainer from '../pullToRefresh/PullToRefreshContainer';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent(FlatList);\n\ntype Props<Data> = Omit<FlatListProps<Data>, 'scrollEnabled'> &\n CollapsibleProps;\n\nexport default function CollapsibleFlatList<Data>({\n headerSnappable = true,\n ...props\n}: Props<Data>) {\n const { headerHeight, scrollY } = useCollapsibleContext();\n const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();\n const mounted = useRef(true);\n const contentHeight = useRef(0);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollToOffset({\n offset: yValue,\n animated,\n });\n }, []);\n\n const scrollToIndex = useCallback((params) => {\n scrollViewRef.current?.scrollToIndex(params);\n }, []);\n\n const handleInternalContentHeight = useCallback((value: number) => {\n if (mounted.current) {\n setInternalContentMinHeight(value);\n }\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n contentMinHeight.value\n );\n\n useAnimatedReaction(\n () => {\n return contentMinHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n if (\n contentHeight.current < contentMinHeight.value &&\n internalContentMinHeight !== contentMinHeight.value\n ) {\n runOnJS(handleInternalContentHeight)(contentMinHeight.value);\n }\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [\n styles.contentContainer,\n { minHeight: internalContentMinHeight },\n props.contentContainerStyle,\n ],\n [props.contentContainerStyle, internalContentMinHeight]\n );\n\n const handleContentSizeChange = useCallback((_, height) => {\n contentHeight.current = height;\n }, []);\n\n const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n const renderListHeader = () => (\n <View>\n <AnimatedTopView height={headerHeight} />\n {props.ListHeaderComponent}\n </View>\n );\n\n return (\n <PullToRefreshContainer scrollY={scrollY}>\n {/* @ts-ignore */}\n <AnimatedFlatList\n ref={scrollViewRef}\n bounces={false}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n onScrollToIndexFailed={handleScrollToIndexFailed}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n ListHeaderComponent={renderListHeader()}\n onContentSizeChange={handleContentSizeChange}\n //@ts-ignore\n simultaneousHandlers={[]}\n />\n </PullToRefreshContainer>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","CollapsibleFlatList","headerSnappable","props","headerHeight","contentMinHeight","scrollViewRef","fixedHeaderHeight","mounted","contentHeight","internalContentMinHeight","setInternalContentMinHeight","value","internalProgressViewOffset","setInternalProgressViewOffset","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","scrollHandler","handleInternalContentHeight","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","StyleSheet","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n} from 'react-native-reanimated';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent(FlatList);\n\ntype Props<Data> = Omit<FlatListProps<Data>, 'scrollEnabled'> &\n CollapsibleProps;\n\nexport default function CollapsibleFlatList<Data>({\n headerSnappable = true,\n ...props\n}: Props<Data>) {\n const { headerHeight } = useCollapsibleContext();\n const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n const mounted = useRef(true);\n const contentHeight = useRef(0);\n const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n contentMinHeight.value\n );\n const [internalProgressViewOffset, setInternalProgressViewOffset] =\n useState(0);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollToOffset({\n offset: yValue,\n animated,\n });\n }, []);\n\n const scrollToIndex = useCallback((params) => {\n scrollViewRef.current?.scrollToIndex(params);\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const handleInternalContentHeight = useCallback((value: number) => {\n if (mounted.current) {\n setInternalContentMinHeight(value);\n }\n }, []);\n\n const handleInternalProgressViewOffset = useCallback((value: number) => {\n if (mounted.current) {\n setInternalProgressViewOffset(value);\n }\n }, []);\n\n useAnimatedReaction(\n () => {\n return contentMinHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n if (\n contentHeight.current < result &&\n internalContentMinHeight !== result\n ) {\n runOnJS(handleInternalContentHeight)(result);\n }\n }\n }\n );\n\n useAnimatedReaction(\n () => {\n return fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n runOnJS(handleInternalProgressViewOffset)(result);\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [\n styles.contentContainer,\n { minHeight: internalContentMinHeight },\n props.contentContainerStyle,\n ],\n [props.contentContainerStyle, internalContentMinHeight]\n );\n\n const handleContentSizeChange = useCallback((_, height) => {\n contentHeight.current = height;\n }, []);\n\n const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n function renderListHeader() {\n return (\n <View>\n <AnimatedTopView height={headerHeight} />\n {props.ListHeaderComponent}\n </View>\n );\n }\n\n return (\n <AnimatedFlatList\n ref={scrollViewRef}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n onScrollToIndexFailed={handleScrollToIndexFailed}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n ListHeaderComponent={renderListHeader()}\n onContentSizeChange={handleContentSizeChange}\n //@ts-ignore\n simultaneousHandlers={[]}\n progressViewOffset={internalProgressViewOffset}\n />\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
@@ -30,15 +30,25 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
30
30
  function CollapsibleScrollView({
31
31
  headerSnappable = true,
32
32
  children,
33
+ refreshing = false,
34
+ onRefresh,
33
35
  ...props
34
36
  }) {
35
37
  const {
36
38
  contentMinHeight,
37
- scrollViewRef
39
+ scrollViewRef,
40
+ fixedHeaderHeight
38
41
  } = (0, _useInternalCollapsibleContext.default)();
39
42
  const {
40
43
  headerHeight
41
44
  } = (0, _useCollapsibleContext.default)();
45
+ const [internalProgressViewOffset, setInternalProgressViewOffset] = (0, _react.useState)(0);
46
+ const mounted = (0, _react.useRef)(true);
47
+ (0, _react.useEffect)(() => {
48
+ return () => {
49
+ mounted.current = false;
50
+ };
51
+ }, []);
42
52
  const scrollTo = (0, _react.useCallback)((yValue, animated = true) => {
43
53
  var _scrollViewRef$curren;
44
54
 
@@ -62,10 +72,26 @@ function CollapsibleScrollView({
62
72
  minHeight: contentMinHeight.value
63
73
  };
64
74
  }, []);
75
+ const handleInternalProgressViewOffset = (0, _react.useCallback)(value => {
76
+ if (mounted.current) {
77
+ setInternalProgressViewOffset(value);
78
+ }
79
+ }, []);
80
+ (0, _reactNativeReanimated.useAnimatedReaction)(() => {
81
+ return fixedHeaderHeight.value;
82
+ }, (result, previous) => {
83
+ if (result !== previous) {
84
+ (0, _reactNativeReanimated.runOnJS)(handleInternalProgressViewOffset)(result);
85
+ }
86
+ });
65
87
  const contentContainerStyle = (0, _react.useMemo)(() => [styles.contentContainer, props.contentContainerStyle], [props.contentContainerStyle]);
66
88
  return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.ScrollView, _extends({
67
89
  ref: scrollViewRef,
68
- bounces: false
90
+ refreshControl: onRefresh ? /*#__PURE__*/_react.default.createElement(_reactNative.RefreshControl, {
91
+ progressViewOffset: internalProgressViewOffset,
92
+ refreshing: refreshing,
93
+ onRefresh: onRefresh
94
+ }) : undefined
69
95
  }, props, {
70
96
  style: [styles.container, props.style],
71
97
  contentContainerStyle: contentContainerStyle,
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleScrollView.tsx"],"names":["CollapsibleScrollView","headerSnappable","children","props","contentMinHeight","scrollViewRef","headerHeight","scrollTo","yValue","animated","current","y","scrollToIndex","console","warn","scrollHandler","animatedStyle","minHeight","value","contentContainerStyle","styles","contentContainer","container","style","StyleSheet","create","absoluteFillObject","flexGrow"],"mappings":";;;;;;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;;;;;AAOe,SAASA,qBAAT,CAA+B;AAC5CC,EAAAA,eAAe,GAAG,IAD0B;AAE5CC,EAAAA,QAF4C;AAG5C,KAAGC;AAHyC,CAA/B,EAIL;AACR,QAAM;AAAEC,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAAsC,6CAA5C;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAmB,qCAAzB;AAEA,QAAMC,QAAQ,GAAG,wBAAY,CAACC,MAAD,EAAiBC,QAAQ,GAAG,IAA5B,KAAqC;AAAA;;AAChE,6BAAAJ,aAAa,CAACK,OAAd,gFAAuBH,QAAvB,CAAgC;AAAEI,MAAAA,CAAC,EAAEH,MAAL;AAAaC,MAAAA;AAAb,KAAhC;AACD,GAFgB,EAEd,EAFc,CAAjB;AAIA,QAAMG,aAAa,GAAG,wBAAY,MAAM;AACtCC,IAAAA,OAAO,CAACC,IAAR,CAAa,qDAAb;AACD,GAFqB,EAEnB,EAFmB,CAAtB;AAIA,QAAM;AAAEC,IAAAA;AAAF,MAAoB,gCAAkB;AAC1Cd,IAAAA,eAD0C;AAE1CM,IAAAA,QAF0C;AAG1CK,IAAAA;AAH0C,GAAlB,CAA1B;AAMA,QAAMI,aAAa,GAAG,6CAAiB,MAAM;AAC3C,WAAO;AACLC,MAAAA,SAAS,EAAEb,gBAAgB,CAACc;AADvB,KAAP;AAGD,GAJqB,EAInB,EAJmB,CAAtB;AAMA,QAAMC,qBAAqB,GAAG,oBAC5B,MAAM,CAACC,MAAM,CAACC,gBAAR,EAA0BlB,KAAK,CAACgB,qBAAhC,CADsB,EAE5B,CAAChB,KAAK,CAACgB,qBAAP,CAF4B,CAA9B;AAKA,sBACE,6BAAC,8BAAD,CAAU,UAAV;AACE,IAAA,GAAG,EAAEd,aADP;AAEE,IAAA,OAAO,EAAE;AAFX,KAGMF,KAHN;AAIE,IAAA,KAAK,EAAE,CAACiB,MAAM,CAACE,SAAR,EAAmBnB,KAAK,CAACoB,KAAzB,CAJT;AAKE,IAAA,qBAAqB,EAAEJ,qBALzB;AAME,IAAA,QAAQ,EAAEJ,aANZ;AAOE,IAAA,mBAAmB,EAAC,SAPtB;AAQE,IAAA,yBAAyB,EAAC,SAR5B;AASE,IAAA,mBAAmB,EAAE;AATvB,mBAWE,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEC;AAAtB,kBACE,6BAAC,wBAAD;AAAiB,IAAA,MAAM,EAAEV;AAAzB,IADF,EAEGJ,QAFH,CAXF,CADF;AAkBD;;AAED,MAAMkB,MAAM,GAAGI,wBAAWC,MAAX,CAAkB;AAC/BH,EAAAA,SAAS,EAAE,EACT,GAAGE,wBAAWE;AADL,GADoB;AAI/BL,EAAAA,gBAAgB,EAAE;AAChBM,IAAAA,QAAQ,EAAE;AADM;AAJa,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport React, { ReactNode, useCallback, useMemo } from 'react';\nimport { ScrollViewProps, StyleSheet } from 'react-native';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\nimport type { CollapsibleProps } from '../../types';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\ntype Props = ScrollViewProps &\n CollapsibleProps & {\n children?: ReactNode;\n };\n\nexport default function CollapsibleScrollView({\n headerSnappable = true,\n children,\n ...props\n}: Props) {\n const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();\n const { headerHeight } = useCollapsibleContext();\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollTo({ y: yValue, animated });\n }, []);\n\n const scrollToIndex = useCallback(() => {\n console.warn(\"CollapsibleScrollView doesn't support scrollToIndex\");\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n minHeight: contentMinHeight.value,\n };\n }, []);\n\n const contentContainerStyle = useMemo(\n () => [styles.contentContainer, props.contentContainerStyle],\n [props.contentContainerStyle]\n );\n\n return (\n <Animated.ScrollView\n ref={scrollViewRef}\n bounces={false}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n >\n <Animated.View style={animatedStyle}>\n <AnimatedTopView height={headerHeight} />\n {children}\n </Animated.View>\n </Animated.ScrollView>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleScrollView.tsx"],"names":["CollapsibleScrollView","headerSnappable","children","refreshing","onRefresh","props","contentMinHeight","scrollViewRef","fixedHeaderHeight","headerHeight","internalProgressViewOffset","setInternalProgressViewOffset","mounted","current","scrollTo","yValue","animated","y","scrollToIndex","console","warn","scrollHandler","animatedStyle","minHeight","value","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","undefined","container","style","StyleSheet","create","absoluteFillObject","flexGrow"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { RefreshControl, ScrollViewProps, StyleSheet } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n useAnimatedStyle,\n} from 'react-native-reanimated';\nimport type { CollapsibleProps } from '../../types';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\ntype Props = ScrollViewProps &\n CollapsibleProps & {\n children?: ReactNode;\n refreshing?: boolean;\n onRefresh?: () => void;\n };\n\nexport default function CollapsibleScrollView({\n headerSnappable = true,\n children,\n refreshing = false,\n onRefresh,\n ...props\n}: Props) {\n const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n const { headerHeight } = useCollapsibleContext();\n const [internalProgressViewOffset, setInternalProgressViewOffset] =\n useState(0);\n const mounted = useRef(true);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollTo({ y: yValue, animated });\n }, []);\n\n const scrollToIndex = useCallback(() => {\n console.warn(\"CollapsibleScrollView doesn't support scrollToIndex\");\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n minHeight: contentMinHeight.value,\n };\n }, []);\n\n const handleInternalProgressViewOffset = useCallback((value: number) => {\n if (mounted.current) {\n setInternalProgressViewOffset(value);\n }\n }, []);\n\n useAnimatedReaction(\n () => {\n return fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n runOnJS(handleInternalProgressViewOffset)(result);\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [styles.contentContainer, props.contentContainerStyle],\n [props.contentContainerStyle]\n );\n\n return (\n <Animated.ScrollView\n ref={scrollViewRef}\n refreshControl={\n onRefresh ? (\n <RefreshControl\n progressViewOffset={internalProgressViewOffset}\n refreshing={refreshing}\n onRefresh={onRefresh}\n />\n ) : undefined\n }\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n >\n <Animated.View style={animatedStyle}>\n <AnimatedTopView height={headerHeight} />\n {children}\n </Animated.View>\n </Animated.ScrollView>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n});\n"]}
@@ -15,8 +15,6 @@ var _reactNativeReanimated = require("react-native-reanimated");
15
15
 
16
16
  var _debounce = require("./utils/debounce");
17
17
 
18
- var _PullToRefreshProvider = _interopRequireDefault(require("./components/pullToRefresh/PullToRefreshProvider"));
19
-
20
18
  var _CollapsibleHeaderProvider = _interopRequireDefault(require("./components/header/CollapsibleHeaderProvider"));
21
19
 
22
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -177,7 +175,7 @@ function withCollapsibleContext(Component) {
177
175
  value: context
178
176
  }, /*#__PURE__*/_react.default.createElement(_useInternalCollapsibleContext.InternalCollapsibleContext.Provider, {
179
177
  value: internalContext
180
- }, /*#__PURE__*/_react.default.createElement(_CollapsibleHeaderProvider.default, null, /*#__PURE__*/_react.default.createElement(_PullToRefreshProvider.default, null, /*#__PURE__*/_react.default.createElement(Component, props)))));
178
+ }, /*#__PURE__*/_react.default.createElement(_CollapsibleHeaderProvider.default, null, /*#__PURE__*/_react.default.createElement(Component, props))));
181
179
  };
182
180
  }
183
181
  //# sourceMappingURL=withCollapsibleContext.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["withCollapsibleContext.tsx"],"names":["withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","containerRef","scrollViewRef","setCollapsibleHandlers","handlers","current","headerCollapsed","maxY","value","contentMinHeight","totalHeight","Object","keys","reduce","acc","item","top","result","previous","viewPositions","sortedKeys","sort","a","b","totalTop","values","i","length","height","stickyHeader","key","data","isInsideHeader","handleStickyViewLayout","viewKey","viewRef","measureLayout","left","width","debounceRefreshStickyPositions","forEach","handleHeaderContainerLayout","duration","handleContainerHeight","context","collapse","animated","expand","scrollTo","offset","animate","scrollToIndex","params","internalContext"],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { FC, useCallback, useMemo, useRef } from 'react';\nimport type { CollapsibleHandles, LayoutParams } from './types';\nimport { CollapsibleContext } from './hooks/useCollapsibleContext';\nimport { InternalCollapsibleContext } from './hooks/useInternalCollapsibleContext';\nimport {\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport type { View } from 'react-native';\nimport { debounce } from './utils/debounce';\nimport PullToRefreshProvider from './components/pullToRefresh/PullToRefreshProvider';\nimport CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';\n\nexport default function withCollapsibleContext<T>(Component: FC<T>) {\n return (props: T) => {\n const collapsibleHandlers = useRef<CollapsibleHandles>();\n const headerHeight = useSharedValue(0);\n const scrollY = useSharedValue(0);\n const stickyViewRefs = useRef<Record<string, React.RefObject<View>>>({});\n const stickyViewTops = useSharedValue<Record<string, number>>({});\n const stickyViewPositionsRef = useRef<Record<string, LayoutParams>>({});\n const stickyViewPositions = useSharedValue<Record<string, LayoutParams>>(\n {}\n );\n const fixedHeaderHeight = useSharedValue(0);\n const stickyHeaderHeight = useSharedValue(0);\n const containerHeight = useSharedValue(0);\n const firstStickyViewY = useSharedValue(1000000);\n const containerRef = useRef<View>(null);\n const scrollViewRef = useRef<View>(null);\n\n const setCollapsibleHandlers = useCallback((handlers) => {\n collapsibleHandlers.current = handlers;\n }, []);\n\n const headerCollapsed = useDerivedValue(() => {\n const maxY = fixedHeaderHeight.value - firstStickyViewY.value;\n return scrollY.value >= maxY;\n }, []);\n\n const contentMinHeight = useDerivedValue(() => {\n return (\n containerHeight.value +\n fixedHeaderHeight.value -\n stickyHeaderHeight.value\n );\n }, []);\n\n useAnimatedReaction(\n () => {\n const totalHeight = Object.keys(stickyViewPositions.value).reduce(\n (acc, item) => {\n return acc + stickyViewPositions.value[item].top;\n },\n 0\n );\n return totalHeight - fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n const viewPositions = stickyViewPositions.value;\n const headerHeight = fixedHeaderHeight.value;\n const sortedKeys = Object.keys(viewPositions).sort(\n (a, b) => viewPositions[a].top - viewPositions[b].top\n );\n let totalTop = 0;\n const values: any = {};\n for (let i = 0; i < sortedKeys.length; i++) {\n values[sortedKeys[i]] = totalTop;\n // Try minus 1 make it filled when scrolling up.\n // Otherwise, we can see a small space between the persits views\n totalTop += viewPositions[sortedKeys[i]].height - 1;\n }\n stickyViewTops.value = values;\n firstStickyViewY.value = viewPositions[sortedKeys[0]]?.top || 0;\n const stickyHeader = sortedKeys.reduce((acc, key) => {\n const data = viewPositions[key];\n const isInsideHeader = data.top < headerHeight;\n if (isInsideHeader) {\n return acc + data.height;\n }\n return acc;\n }, 0);\n stickyHeaderHeight.value = stickyHeader;\n }\n }\n );\n\n const handleStickyViewLayout = useCallback(\n (viewKey: string, viewRef?: React.RefObject<View>) => {\n if (viewRef && viewRef.current && containerRef.current) {\n stickyViewRefs.current[viewKey] = viewRef;\n viewRef.current.measureLayout(\n // @ts-ignore\n containerRef.current,\n (left, top, width, height) => {\n stickyViewPositionsRef.current = {\n ...stickyViewPositionsRef.current,\n [viewKey]: { left, top, width, height },\n };\n stickyViewPositions.value = stickyViewPositionsRef.current;\n },\n () => {}\n );\n } else {\n delete stickyViewRefs.current[viewKey];\n delete stickyViewPositionsRef.current[viewKey];\n stickyViewPositions.value = stickyViewPositionsRef.current;\n }\n },\n []\n );\n\n const debounceRefreshStickyPositions = useMemo(() => {\n return debounce(() => {\n Object.keys(stickyViewRefs.current).forEach((key) => {\n const viewRef = stickyViewRefs.current[key];\n if (viewRef) {\n handleStickyViewLayout(key, viewRef);\n }\n });\n }, 200);\n }, []);\n\n const handleHeaderContainerLayout = useCallback((height: number) => {\n headerHeight.value = withTiming(height, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 10,\n });\n fixedHeaderHeight.value = height;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n }, []);\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: (animated?: boolean) =>\n collapsibleHandlers.current?.collapse(animated),\n expand: () => collapsibleHandlers.current?.expand(),\n scrollTo: (offset: number, animate?: boolean) =>\n collapsibleHandlers.current?.scrollTo(offset, animate),\n scrollToIndex: (params: any) =>\n collapsibleHandlers.current?.scrollToIndex(params),\n headerHeight,\n scrollY,\n headerCollapsed,\n };\n }, [scrollY, headerHeight, headerCollapsed]);\n\n const internalContext = useMemo(\n () => ({\n scrollViewRef,\n containerRef,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n setCollapsibleHandlers,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n }),\n [\n setCollapsibleHandlers,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n ]\n );\n\n return (\n <CollapsibleContext.Provider value={context}>\n <InternalCollapsibleContext.Provider value={internalContext}>\n <CollapsibleHeaderProvider>\n <PullToRefreshProvider>\n {/** @ts-ignore */}\n <Component {...props} />\n </PullToRefreshProvider>\n </CollapsibleHeaderProvider>\n </InternalCollapsibleContext.Provider>\n </CollapsibleContext.Provider>\n );\n };\n}\n"]}
1
+ {"version":3,"sources":["withCollapsibleContext.tsx"],"names":["withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","containerRef","scrollViewRef","setCollapsibleHandlers","handlers","current","headerCollapsed","maxY","value","contentMinHeight","totalHeight","Object","keys","reduce","acc","item","top","result","previous","viewPositions","sortedKeys","sort","a","b","totalTop","values","i","length","height","stickyHeader","key","data","isInsideHeader","handleStickyViewLayout","viewKey","viewRef","measureLayout","left","width","debounceRefreshStickyPositions","forEach","handleHeaderContainerLayout","duration","handleContainerHeight","context","collapse","animated","expand","scrollTo","offset","animate","scrollToIndex","params","internalContext"],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { FC, useCallback, useMemo, useRef } from 'react';\nimport type { CollapsibleHandles, LayoutParams } from './types';\nimport { CollapsibleContext } from './hooks/useCollapsibleContext';\nimport { InternalCollapsibleContext } from './hooks/useInternalCollapsibleContext';\nimport {\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport type { View } from 'react-native';\nimport { debounce } from './utils/debounce';\nimport CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';\n\nexport default function withCollapsibleContext<T>(Component: FC<T>) {\n return (props: T) => {\n const collapsibleHandlers = useRef<CollapsibleHandles>();\n const headerHeight = useSharedValue(0);\n const scrollY = useSharedValue(0);\n const stickyViewRefs = useRef<Record<string, React.RefObject<View>>>({});\n const stickyViewTops = useSharedValue<Record<string, number>>({});\n const stickyViewPositionsRef = useRef<Record<string, LayoutParams>>({});\n const stickyViewPositions = useSharedValue<Record<string, LayoutParams>>(\n {}\n );\n const fixedHeaderHeight = useSharedValue(0);\n const stickyHeaderHeight = useSharedValue(0);\n const containerHeight = useSharedValue(0);\n const firstStickyViewY = useSharedValue(1000000);\n const containerRef = useRef<View>(null);\n const scrollViewRef = useRef<View>(null);\n\n const setCollapsibleHandlers = useCallback((handlers) => {\n collapsibleHandlers.current = handlers;\n }, []);\n\n const headerCollapsed = useDerivedValue(() => {\n const maxY = fixedHeaderHeight.value - firstStickyViewY.value;\n return scrollY.value >= maxY;\n }, []);\n\n const contentMinHeight = useDerivedValue(() => {\n return (\n containerHeight.value +\n fixedHeaderHeight.value -\n stickyHeaderHeight.value\n );\n }, []);\n\n useAnimatedReaction(\n () => {\n const totalHeight = Object.keys(stickyViewPositions.value).reduce(\n (acc, item) => {\n return acc + stickyViewPositions.value[item].top;\n },\n 0\n );\n return totalHeight - fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n const viewPositions = stickyViewPositions.value;\n const headerHeight = fixedHeaderHeight.value;\n const sortedKeys = Object.keys(viewPositions).sort(\n (a, b) => viewPositions[a].top - viewPositions[b].top\n );\n let totalTop = 0;\n const values: any = {};\n for (let i = 0; i < sortedKeys.length; i++) {\n values[sortedKeys[i]] = totalTop;\n // Try minus 1 make it filled when scrolling up.\n // Otherwise, we can see a small space between the persits views\n totalTop += viewPositions[sortedKeys[i]].height - 1;\n }\n stickyViewTops.value = values;\n firstStickyViewY.value = viewPositions[sortedKeys[0]]?.top || 0;\n const stickyHeader = sortedKeys.reduce((acc, key) => {\n const data = viewPositions[key];\n const isInsideHeader = data.top < headerHeight;\n if (isInsideHeader) {\n return acc + data.height;\n }\n return acc;\n }, 0);\n stickyHeaderHeight.value = stickyHeader;\n }\n }\n );\n\n const handleStickyViewLayout = useCallback(\n (viewKey: string, viewRef?: React.RefObject<View>) => {\n if (viewRef && viewRef.current && containerRef.current) {\n stickyViewRefs.current[viewKey] = viewRef;\n viewRef.current.measureLayout(\n // @ts-ignore\n containerRef.current,\n (left, top, width, height) => {\n stickyViewPositionsRef.current = {\n ...stickyViewPositionsRef.current,\n [viewKey]: { left, top, width, height },\n };\n stickyViewPositions.value = stickyViewPositionsRef.current;\n },\n () => {}\n );\n } else {\n delete stickyViewRefs.current[viewKey];\n delete stickyViewPositionsRef.current[viewKey];\n stickyViewPositions.value = stickyViewPositionsRef.current;\n }\n },\n []\n );\n\n const debounceRefreshStickyPositions = useMemo(() => {\n return debounce(() => {\n Object.keys(stickyViewRefs.current).forEach((key) => {\n const viewRef = stickyViewRefs.current[key];\n if (viewRef) {\n handleStickyViewLayout(key, viewRef);\n }\n });\n }, 200);\n }, []);\n\n const handleHeaderContainerLayout = useCallback((height: number) => {\n headerHeight.value = withTiming(height, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 10,\n });\n fixedHeaderHeight.value = height;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n }, []);\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: (animated?: boolean) =>\n collapsibleHandlers.current?.collapse(animated),\n expand: () => collapsibleHandlers.current?.expand(),\n scrollTo: (offset: number, animate?: boolean) =>\n collapsibleHandlers.current?.scrollTo(offset, animate),\n scrollToIndex: (params: any) =>\n collapsibleHandlers.current?.scrollToIndex(params),\n headerHeight,\n scrollY,\n headerCollapsed,\n };\n }, [scrollY, headerHeight, headerCollapsed]);\n\n const internalContext = useMemo(\n () => ({\n scrollViewRef,\n containerRef,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n setCollapsibleHandlers,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n }),\n [\n setCollapsibleHandlers,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n ]\n );\n\n return (\n <CollapsibleContext.Provider value={context}>\n <InternalCollapsibleContext.Provider value={internalContext}>\n <CollapsibleHeaderProvider>\n {/** @ts-ignore */}\n <Component {...props} />\n </CollapsibleHeaderProvider>\n </InternalCollapsibleContext.Provider>\n </CollapsibleContext.Provider>\n );\n };\n}\n"]}
@@ -4,8 +4,7 @@ export default function AnimatedTopView({
4
4
  height
5
5
  }) {
6
6
  const contentStyle = useAnimatedStyle(() => ({
7
- paddingTop: height.value,
8
- backgroundColor: 'white'
7
+ paddingTop: height.value
9
8
  }), []);
10
9
  return /*#__PURE__*/React.createElement(Animated.View, {
11
10
  style: contentStyle
@@ -1 +1 @@
1
- {"version":3,"sources":["AnimatedTopView.tsx"],"names":["React","Animated","useAnimatedStyle","AnimatedTopView","height","contentStyle","paddingTop","value","backgroundColor"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IAAmBC,gBAAnB,QAA2C,yBAA3C;AAMA,eAAe,SAASC,eAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAA4C;AACzD,QAAMC,YAAY,GAAGH,gBAAgB,CACnC,OAAO;AACLI,IAAAA,UAAU,EAAEF,MAAM,CAACG,KADd;AAELC,IAAAA,eAAe,EAAE;AAFZ,GAAP,CADmC,EAKnC,EALmC,CAArC;AAQA,sBAAO,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEH;AAAtB,IAAP;AACD","sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\ntype Props = {\n height: Animated.SharedValue<number>;\n};\n\nexport default function AnimatedTopView({ height }: Props) {\n const contentStyle = useAnimatedStyle(\n () => ({\n paddingTop: height.value,\n backgroundColor: 'white',\n }),\n []\n );\n\n return <Animated.View style={contentStyle} />;\n}\n"]}
1
+ {"version":3,"sources":["AnimatedTopView.tsx"],"names":["React","Animated","useAnimatedStyle","AnimatedTopView","height","contentStyle","paddingTop","value"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IAAmBC,gBAAnB,QAA2C,yBAA3C;AAMA,eAAe,SAASC,eAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAA4C;AACzD,QAAMC,YAAY,GAAGH,gBAAgB,CACnC,OAAO;AACLI,IAAAA,UAAU,EAAEF,MAAM,CAACG;AADd,GAAP,CADmC,EAInC,EAJmC,CAArC;AAOA,sBAAO,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEF;AAAtB,IAAP;AACD","sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\ntype Props = {\n height: Animated.SharedValue<number>;\n};\n\nexport default function AnimatedTopView({ height }: Props) {\n const contentStyle = useAnimatedStyle(\n () => ({\n paddingTop: height.value,\n }),\n []\n );\n\n return <Animated.View style={contentStyle} />;\n}\n"]}
@@ -16,7 +16,7 @@ export default function CollapsibleHeaderConsumer() {
16
16
  headerHeight
17
17
  } = useCollapsibleContext();
18
18
  const headerTranslate = useDerivedValue(() => interpolate(scrollY.value, // FIXME: can improve by geting maxY value of header and sticky views
19
- [-250, 0, 100000], [250, 0, -100000], Animated.Extrapolate.CLAMP), []);
19
+ [-1000, 0, 100000], [0, 0, -100000], Animated.Extrapolate.CLAMP), []);
20
20
  const headerStyle = useAnimatedStyle(() => {
21
21
  return {
22
22
  transform: [{
@@ -41,7 +41,6 @@ export default function CollapsibleHeaderConsumer() {
41
41
  }
42
42
  const styles = StyleSheet.create({
43
43
  container: {
44
- backgroundColor: 'white',
45
44
  zIndex: 10
46
45
  }
47
46
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["React","useCallback","useInternalCollapsibleContext","useCollapsibleHeaderContext","Animated","interpolate","useAnimatedStyle","useDerivedValue","useCollapsibleContext","StyleSheet","CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","create","backgroundColor","zIndex"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,WAAhB,QAAmC,OAAnC;AACA,OAAOC,6BAAP,MAA0C,2CAA1C;AACA,OAAOC,2BAAP,MAAwC,yCAAxC;AACA,OAAOC,QAAP,IACEC,WADF,EAEEC,gBAFF,EAGEC,eAHF,QAIO,yBAJP;AAKA,OAAOC,qBAAP,MAAkC,mCAAlC;AACA,SAA4BC,UAA5B,QAA8C,cAA9C;AAEA,eAAe,SAASC,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAcR,2BAA2B,EAA/C;AACA,QAAM;AAAES,IAAAA;AAAF,MAAkCV,6BAA6B,EAArE;AACA,QAAM;AAAEW,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4BN,qBAAqB,EAAvD;AAEA,QAAMO,eAAe,GAAGR,eAAe,CACrC,MACEF,WAAW,CACTQ,OAAO,CAACG,KADC,EAET;AACA,GAAC,CAAC,GAAF,EAAO,CAAP,EAAU,MAAV,CAHS,EAIT,CAAC,GAAD,EAAM,CAAN,EAAS,CAAC,MAAV,CAJS,EAKTZ,QAAQ,CAACa,WAAT,CAAqBC,KALZ,CAFwB,EASrC,EATqC,CAAvC;AAYA,QAAMC,WAAW,GAAGb,gBAAgB,CAAC,MAAM;AACzC,WAAO;AACLc,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEN,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmC,EAIjC,CAACF,YAAD,EAAeC,eAAf,CAJiC,CAApC;AAMA,QAAMO,kBAAkB,GAAGrB,WAAW,CACpC,CAAC;AACCsB,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBb,IAAAA,2BAA2B,CAACa,MAAD,CAA3B;AACD,GAPmC,EAQpC,CAACb,2BAAD,CARoC,CAAtC;AAWA,sBACE,oBAAC,QAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEU,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGR,OAAO,CAACiB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;AAED,MAAMJ,MAAM,GAAGjB,UAAU,CAACsB,MAAX,CAAkB;AAC/BJ,EAAAA,SAAS,EAAE;AACTK,IAAAA,eAAe,EAAE,OADR;AAETC,IAAAA,MAAM,EAAE;AAFC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n const { headers } = useCollapsibleHeaderContext();\n const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n const { scrollY, headerHeight } = useCollapsibleContext();\n\n const headerTranslate = useDerivedValue(\n () =>\n interpolate(\n scrollY.value,\n // FIXME: can improve by geting maxY value of header and sticky views\n [-250, 0, 100000],\n [250, 0, -100000],\n Animated.Extrapolate.CLAMP\n ),\n []\n );\n\n const headerStyle = useAnimatedStyle(() => {\n return {\n transform: [{ translateY: headerTranslate.value }],\n };\n }, [headerHeight, headerTranslate]);\n\n const handleHeaderLayout = useCallback(\n ({\n nativeEvent: {\n layout: { height },\n },\n }: LayoutChangeEvent) => {\n handleHeaderContainerLayout(height);\n },\n [handleHeaderContainerLayout]\n );\n\n return (\n <Animated.View\n onLayout={handleHeaderLayout}\n style={[styles.container, headerStyle]}\n pointerEvents=\"box-none\"\n >\n {headers.map((item) => item.children)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: 'white',\n zIndex: 10,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["React","useCallback","useInternalCollapsibleContext","useCollapsibleHeaderContext","Animated","interpolate","useAnimatedStyle","useDerivedValue","useCollapsibleContext","StyleSheet","CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","create","zIndex"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,WAAhB,QAAmC,OAAnC;AACA,OAAOC,6BAAP,MAA0C,2CAA1C;AACA,OAAOC,2BAAP,MAAwC,yCAAxC;AACA,OAAOC,QAAP,IACEC,WADF,EAEEC,gBAFF,EAGEC,eAHF,QAIO,yBAJP;AAKA,OAAOC,qBAAP,MAAkC,mCAAlC;AACA,SAA4BC,UAA5B,QAA8C,cAA9C;AAEA,eAAe,SAASC,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAcR,2BAA2B,EAA/C;AACA,QAAM;AAAES,IAAAA;AAAF,MAAkCV,6BAA6B,EAArE;AACA,QAAM;AAAEW,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4BN,qBAAqB,EAAvD;AAEA,QAAMO,eAAe,GAAGR,eAAe,CACrC,MACEF,WAAW,CACTQ,OAAO,CAACG,KADC,EAET;AACA,GAAC,CAAC,IAAF,EAAQ,CAAR,EAAW,MAAX,CAHS,EAIT,CAAC,CAAD,EAAI,CAAJ,EAAO,CAAC,MAAR,CAJS,EAKTZ,QAAQ,CAACa,WAAT,CAAqBC,KALZ,CAFwB,EASrC,EATqC,CAAvC;AAYA,QAAMC,WAAW,GAAGb,gBAAgB,CAAC,MAAM;AACzC,WAAO;AACLc,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEN,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmC,EAIjC,CAACF,YAAD,EAAeC,eAAf,CAJiC,CAApC;AAMA,QAAMO,kBAAkB,GAAGrB,WAAW,CACpC,CAAC;AACCsB,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBb,IAAAA,2BAA2B,CAACa,MAAD,CAA3B;AACD,GAPmC,EAQpC,CAACb,2BAAD,CARoC,CAAtC;AAWA,sBACE,oBAAC,QAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEU,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGR,OAAO,CAACiB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;AAED,MAAMJ,MAAM,GAAGjB,UAAU,CAACsB,MAAX,CAAkB;AAC/BJ,EAAAA,SAAS,EAAE;AACTK,IAAAA,MAAM,EAAE;AADC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n const { headers } = useCollapsibleHeaderContext();\n const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n const { scrollY, headerHeight } = useCollapsibleContext();\n\n const headerTranslate = useDerivedValue(\n () =>\n interpolate(\n scrollY.value,\n // FIXME: can improve by geting maxY value of header and sticky views\n [-1000, 0, 100000],\n [0, 0, -100000],\n Animated.Extrapolate.CLAMP\n ),\n []\n );\n\n const headerStyle = useAnimatedStyle(() => {\n return {\n transform: [{ translateY: headerTranslate.value }],\n };\n }, [headerHeight, headerTranslate]);\n\n const handleHeaderLayout = useCallback(\n ({\n nativeEvent: {\n layout: { height },\n },\n }: LayoutChangeEvent) => {\n handleHeaderContainerLayout(height);\n },\n [handleHeaderContainerLayout]\n );\n\n return (\n <Animated.View\n onLayout={handleHeaderLayout}\n style={[styles.container, headerStyle]}\n pointerEvents=\"box-none\"\n >\n {headers.map((item) => item.children)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n zIndex: 10,\n },\n});\n"]}
@@ -4,26 +4,27 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
4
4
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
5
5
  import { View, StyleSheet, FlatList } from 'react-native';
6
6
  import Animated, { runOnJS, useAnimatedReaction } from 'react-native-reanimated';
7
- import AnimatedTopView from '../header/AnimatedTopView';
8
7
  import useAnimatedScroll from './useAnimatedScroll';
9
- import useCollapsibleContext from '../../hooks/useCollapsibleContext';
10
8
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
11
- import PullToRefreshContainer from '../pullToRefresh/PullToRefreshContainer';
9
+ import AnimatedTopView from '../header/AnimatedTopView';
10
+ import useCollapsibleContext from '../../hooks/useCollapsibleContext';
12
11
  const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
13
12
  export default function CollapsibleFlatList({
14
13
  headerSnappable = true,
15
14
  ...props
16
15
  }) {
17
16
  const {
18
- headerHeight,
19
- scrollY
17
+ headerHeight
20
18
  } = useCollapsibleContext();
21
19
  const {
22
20
  contentMinHeight,
23
- scrollViewRef
21
+ scrollViewRef,
22
+ fixedHeaderHeight
24
23
  } = useInternalCollapsibleContext();
25
24
  const mounted = useRef(true);
26
25
  const contentHeight = useRef(0);
26
+ const [internalContentMinHeight, setInternalContentMinHeight] = useState(contentMinHeight.value);
27
+ const [internalProgressViewOffset, setInternalProgressViewOffset] = useState(0);
27
28
  useEffect(() => {
28
29
  return () => {
29
30
  mounted.current = false;
@@ -42,11 +43,6 @@ export default function CollapsibleFlatList({
42
43
 
43
44
  (_scrollViewRef$curren2 = scrollViewRef.current) === null || _scrollViewRef$curren2 === void 0 ? void 0 : _scrollViewRef$curren2.scrollToIndex(params);
44
45
  }, []);
45
- const handleInternalContentHeight = useCallback(value => {
46
- if (mounted.current) {
47
- setInternalContentMinHeight(value);
48
- }
49
- }, []);
50
46
  const {
51
47
  scrollHandler
52
48
  } = useAnimatedScroll({
@@ -54,16 +50,32 @@ export default function CollapsibleFlatList({
54
50
  scrollTo,
55
51
  scrollToIndex
56
52
  });
57
- const [internalContentMinHeight, setInternalContentMinHeight] = useState(contentMinHeight.value);
53
+ const handleInternalContentHeight = useCallback(value => {
54
+ if (mounted.current) {
55
+ setInternalContentMinHeight(value);
56
+ }
57
+ }, []);
58
+ const handleInternalProgressViewOffset = useCallback(value => {
59
+ if (mounted.current) {
60
+ setInternalProgressViewOffset(value);
61
+ }
62
+ }, []);
58
63
  useAnimatedReaction(() => {
59
64
  return contentMinHeight.value;
60
65
  }, (result, previous) => {
61
66
  if (result !== previous) {
62
- if (contentHeight.current < contentMinHeight.value && internalContentMinHeight !== contentMinHeight.value) {
63
- runOnJS(handleInternalContentHeight)(contentMinHeight.value);
67
+ if (contentHeight.current < result && internalContentMinHeight !== result) {
68
+ runOnJS(handleInternalContentHeight)(result);
64
69
  }
65
70
  }
66
71
  });
72
+ useAnimatedReaction(() => {
73
+ return fixedHeaderHeight.value;
74
+ }, (result, previous) => {
75
+ if (result !== previous) {
76
+ runOnJS(handleInternalProgressViewOffset)(result);
77
+ }
78
+ });
67
79
  const contentContainerStyle = useMemo(() => [styles.contentContainer, {
68
80
  minHeight: internalContentMinHeight
69
81
  }, props.contentContainerStyle], [props.contentContainerStyle, internalContentMinHeight]);
@@ -72,15 +84,14 @@ export default function CollapsibleFlatList({
72
84
  }, []);
73
85
  const handleScrollToIndexFailed = useCallback(() => {}, []);
74
86
 
75
- const renderListHeader = () => /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(AnimatedTopView, {
76
- height: headerHeight
77
- }), props.ListHeaderComponent);
87
+ function renderListHeader() {
88
+ return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(AnimatedTopView, {
89
+ height: headerHeight
90
+ }), props.ListHeaderComponent);
91
+ }
78
92
 
79
- return /*#__PURE__*/React.createElement(PullToRefreshContainer, {
80
- scrollY: scrollY
81
- }, /*#__PURE__*/React.createElement(AnimatedFlatList, _extends({
93
+ return /*#__PURE__*/React.createElement(AnimatedFlatList, _extends({
82
94
  ref: scrollViewRef,
83
- bounces: false,
84
95
  keyboardDismissMode: "on-drag",
85
96
  keyboardShouldPersistTaps: "handled",
86
97
  scrollEventThrottle: 1,
@@ -92,8 +103,9 @@ export default function CollapsibleFlatList({
92
103
  ListHeaderComponent: renderListHeader(),
93
104
  onContentSizeChange: handleContentSizeChange //@ts-ignore
94
105
  ,
95
- simultaneousHandlers: []
96
- })));
106
+ simultaneousHandlers: [],
107
+ progressViewOffset: internalProgressViewOffset
108
+ }));
97
109
  }
98
110
  const styles = StyleSheet.create({
99
111
  container: { ...StyleSheet.absoluteFillObject
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["React","useCallback","useEffect","useMemo","useRef","useState","View","StyleSheet","FlatList","Animated","runOnJS","useAnimatedReaction","AnimatedTopView","useAnimatedScroll","useCollapsibleContext","useInternalCollapsibleContext","PullToRefreshContainer","AnimatedFlatList","createAnimatedComponent","CollapsibleFlatList","headerSnappable","props","headerHeight","scrollY","contentMinHeight","scrollViewRef","mounted","contentHeight","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","handleInternalContentHeight","value","setInternalContentMinHeight","scrollHandler","internalContentMinHeight","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n} from 'react-native-reanimated';\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport PullToRefreshContainer from '../pullToRefresh/PullToRefreshContainer';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent(FlatList);\n\ntype Props<Data> = Omit<FlatListProps<Data>, 'scrollEnabled'> &\n CollapsibleProps;\n\nexport default function CollapsibleFlatList<Data>({\n headerSnappable = true,\n ...props\n}: Props<Data>) {\n const { headerHeight, scrollY } = useCollapsibleContext();\n const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();\n const mounted = useRef(true);\n const contentHeight = useRef(0);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollToOffset({\n offset: yValue,\n animated,\n });\n }, []);\n\n const scrollToIndex = useCallback((params) => {\n scrollViewRef.current?.scrollToIndex(params);\n }, []);\n\n const handleInternalContentHeight = useCallback((value: number) => {\n if (mounted.current) {\n setInternalContentMinHeight(value);\n }\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n contentMinHeight.value\n );\n\n useAnimatedReaction(\n () => {\n return contentMinHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n if (\n contentHeight.current < contentMinHeight.value &&\n internalContentMinHeight !== contentMinHeight.value\n ) {\n runOnJS(handleInternalContentHeight)(contentMinHeight.value);\n }\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [\n styles.contentContainer,\n { minHeight: internalContentMinHeight },\n props.contentContainerStyle,\n ],\n [props.contentContainerStyle, internalContentMinHeight]\n );\n\n const handleContentSizeChange = useCallback((_, height) => {\n contentHeight.current = height;\n }, []);\n\n const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n const renderListHeader = () => (\n <View>\n <AnimatedTopView height={headerHeight} />\n {props.ListHeaderComponent}\n </View>\n );\n\n return (\n <PullToRefreshContainer scrollY={scrollY}>\n {/* @ts-ignore */}\n <AnimatedFlatList\n ref={scrollViewRef}\n bounces={false}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n onScrollToIndexFailed={handleScrollToIndexFailed}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n ListHeaderComponent={renderListHeader()}\n onContentSizeChange={handleContentSizeChange}\n //@ts-ignore\n simultaneousHandlers={[]}\n />\n </PullToRefreshContainer>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["React","useCallback","useEffect","useMemo","useRef","useState","View","StyleSheet","FlatList","Animated","runOnJS","useAnimatedReaction","useAnimatedScroll","useInternalCollapsibleContext","AnimatedTopView","useCollapsibleContext","AnimatedFlatList","createAnimatedComponent","CollapsibleFlatList","headerSnappable","props","headerHeight","contentMinHeight","scrollViewRef","fixedHeaderHeight","mounted","contentHeight","internalContentMinHeight","setInternalContentMinHeight","value","internalProgressViewOffset","setInternalProgressViewOffset","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","scrollHandler","handleInternalContentHeight","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n} from 'react-native-reanimated';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent(FlatList);\n\ntype Props<Data> = Omit<FlatListProps<Data>, 'scrollEnabled'> &\n CollapsibleProps;\n\nexport default function CollapsibleFlatList<Data>({\n headerSnappable = true,\n ...props\n}: Props<Data>) {\n const { headerHeight } = useCollapsibleContext();\n const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n const mounted = useRef(true);\n const contentHeight = useRef(0);\n const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n contentMinHeight.value\n );\n const [internalProgressViewOffset, setInternalProgressViewOffset] =\n useState(0);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollToOffset({\n offset: yValue,\n animated,\n });\n }, []);\n\n const scrollToIndex = useCallback((params) => {\n scrollViewRef.current?.scrollToIndex(params);\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const handleInternalContentHeight = useCallback((value: number) => {\n if (mounted.current) {\n setInternalContentMinHeight(value);\n }\n }, []);\n\n const handleInternalProgressViewOffset = useCallback((value: number) => {\n if (mounted.current) {\n setInternalProgressViewOffset(value);\n }\n }, []);\n\n useAnimatedReaction(\n () => {\n return contentMinHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n if (\n contentHeight.current < result &&\n internalContentMinHeight !== result\n ) {\n runOnJS(handleInternalContentHeight)(result);\n }\n }\n }\n );\n\n useAnimatedReaction(\n () => {\n return fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n runOnJS(handleInternalProgressViewOffset)(result);\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [\n styles.contentContainer,\n { minHeight: internalContentMinHeight },\n props.contentContainerStyle,\n ],\n [props.contentContainerStyle, internalContentMinHeight]\n );\n\n const handleContentSizeChange = useCallback((_, height) => {\n contentHeight.current = height;\n }, []);\n\n const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n function renderListHeader() {\n return (\n <View>\n <AnimatedTopView height={headerHeight} />\n {props.ListHeaderComponent}\n </View>\n );\n }\n\n return (\n <AnimatedFlatList\n ref={scrollViewRef}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n onScrollToIndexFailed={handleScrollToIndexFailed}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n ListHeaderComponent={renderListHeader()}\n onContentSizeChange={handleContentSizeChange}\n //@ts-ignore\n simultaneousHandlers={[]}\n progressViewOffset={internalProgressViewOffset}\n />\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
@@ -3,23 +3,33 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
3
3
  /* eslint-disable react-hooks/exhaustive-deps */
4
4
  import AnimatedTopView from '../header/AnimatedTopView';
5
5
  import useAnimatedScroll from './useAnimatedScroll';
6
- import React, { useCallback, useMemo } from 'react';
7
- import { StyleSheet } from 'react-native';
8
- import Animated, { useAnimatedStyle } from 'react-native-reanimated';
6
+ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
7
+ import { RefreshControl, StyleSheet } from 'react-native';
8
+ import Animated, { runOnJS, useAnimatedReaction, useAnimatedStyle } from 'react-native-reanimated';
9
9
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
10
10
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
11
11
  export default function CollapsibleScrollView({
12
12
  headerSnappable = true,
13
13
  children,
14
+ refreshing = false,
15
+ onRefresh,
14
16
  ...props
15
17
  }) {
16
18
  const {
17
19
  contentMinHeight,
18
- scrollViewRef
20
+ scrollViewRef,
21
+ fixedHeaderHeight
19
22
  } = useInternalCollapsibleContext();
20
23
  const {
21
24
  headerHeight
22
25
  } = useCollapsibleContext();
26
+ const [internalProgressViewOffset, setInternalProgressViewOffset] = useState(0);
27
+ const mounted = useRef(true);
28
+ useEffect(() => {
29
+ return () => {
30
+ mounted.current = false;
31
+ };
32
+ }, []);
23
33
  const scrollTo = useCallback((yValue, animated = true) => {
24
34
  var _scrollViewRef$curren;
25
35
 
@@ -43,10 +53,26 @@ export default function CollapsibleScrollView({
43
53
  minHeight: contentMinHeight.value
44
54
  };
45
55
  }, []);
56
+ const handleInternalProgressViewOffset = useCallback(value => {
57
+ if (mounted.current) {
58
+ setInternalProgressViewOffset(value);
59
+ }
60
+ }, []);
61
+ useAnimatedReaction(() => {
62
+ return fixedHeaderHeight.value;
63
+ }, (result, previous) => {
64
+ if (result !== previous) {
65
+ runOnJS(handleInternalProgressViewOffset)(result);
66
+ }
67
+ });
46
68
  const contentContainerStyle = useMemo(() => [styles.contentContainer, props.contentContainerStyle], [props.contentContainerStyle]);
47
69
  return /*#__PURE__*/React.createElement(Animated.ScrollView, _extends({
48
70
  ref: scrollViewRef,
49
- bounces: false
71
+ refreshControl: onRefresh ? /*#__PURE__*/React.createElement(RefreshControl, {
72
+ progressViewOffset: internalProgressViewOffset,
73
+ refreshing: refreshing,
74
+ onRefresh: onRefresh
75
+ }) : undefined
50
76
  }, props, {
51
77
  style: [styles.container, props.style],
52
78
  contentContainerStyle: contentContainerStyle,
@@ -1 +1 @@
1
- {"version":3,"sources":["CollapsibleScrollView.tsx"],"names":["AnimatedTopView","useAnimatedScroll","React","useCallback","useMemo","StyleSheet","Animated","useAnimatedStyle","useCollapsibleContext","useInternalCollapsibleContext","CollapsibleScrollView","headerSnappable","children","props","contentMinHeight","scrollViewRef","headerHeight","scrollTo","yValue","animated","current","y","scrollToIndex","console","warn","scrollHandler","animatedStyle","minHeight","value","contentContainerStyle","styles","contentContainer","container","style","create","absoluteFillObject","flexGrow"],"mappings":";;AAAA;AACA,OAAOA,eAAP,MAA4B,2BAA5B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,KAAP,IAA2BC,WAA3B,EAAwCC,OAAxC,QAAuD,OAAvD;AACA,SAA0BC,UAA1B,QAA4C,cAA5C;AACA,OAAOC,QAAP,IAAmBC,gBAAnB,QAA2C,yBAA3C;AAEA,OAAOC,qBAAP,MAAkC,mCAAlC;AACA,OAAOC,6BAAP,MAA0C,2CAA1C;AAOA,eAAe,SAASC,qBAAT,CAA+B;AAC5CC,EAAAA,eAAe,GAAG,IAD0B;AAE5CC,EAAAA,QAF4C;AAG5C,KAAGC;AAHyC,CAA/B,EAIL;AACR,QAAM;AAAEC,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAAsCN,6BAA6B,EAAzE;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAmBR,qBAAqB,EAA9C;AAEA,QAAMS,QAAQ,GAAGd,WAAW,CAAC,CAACe,MAAD,EAAiBC,QAAQ,GAAG,IAA5B,KAAqC;AAAA;;AAChE,6BAAAJ,aAAa,CAACK,OAAd,gFAAuBH,QAAvB,CAAgC;AAAEI,MAAAA,CAAC,EAAEH,MAAL;AAAaC,MAAAA;AAAb,KAAhC;AACD,GAF2B,EAEzB,EAFyB,CAA5B;AAIA,QAAMG,aAAa,GAAGnB,WAAW,CAAC,MAAM;AACtCoB,IAAAA,OAAO,CAACC,IAAR,CAAa,qDAAb;AACD,GAFgC,EAE9B,EAF8B,CAAjC;AAIA,QAAM;AAAEC,IAAAA;AAAF,MAAoBxB,iBAAiB,CAAC;AAC1CU,IAAAA,eAD0C;AAE1CM,IAAAA,QAF0C;AAG1CK,IAAAA;AAH0C,GAAD,CAA3C;AAMA,QAAMI,aAAa,GAAGnB,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLoB,MAAAA,SAAS,EAAEb,gBAAgB,CAACc;AADvB,KAAP;AAGD,GAJqC,EAInC,EAJmC,CAAtC;AAMA,QAAMC,qBAAqB,GAAGzB,OAAO,CACnC,MAAM,CAAC0B,MAAM,CAACC,gBAAR,EAA0BlB,KAAK,CAACgB,qBAAhC,CAD6B,EAEnC,CAAChB,KAAK,CAACgB,qBAAP,CAFmC,CAArC;AAKA,sBACE,oBAAC,QAAD,CAAU,UAAV;AACE,IAAA,GAAG,EAAEd,aADP;AAEE,IAAA,OAAO,EAAE;AAFX,KAGMF,KAHN;AAIE,IAAA,KAAK,EAAE,CAACiB,MAAM,CAACE,SAAR,EAAmBnB,KAAK,CAACoB,KAAzB,CAJT;AAKE,IAAA,qBAAqB,EAAEJ,qBALzB;AAME,IAAA,QAAQ,EAAEJ,aANZ;AAOE,IAAA,mBAAmB,EAAC,SAPtB;AAQE,IAAA,yBAAyB,EAAC,SAR5B;AASE,IAAA,mBAAmB,EAAE;AATvB,mBAWE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEC;AAAtB,kBACE,oBAAC,eAAD;AAAiB,IAAA,MAAM,EAAEV;AAAzB,IADF,EAEGJ,QAFH,CAXF,CADF;AAkBD;AAED,MAAMkB,MAAM,GAAGzB,UAAU,CAAC6B,MAAX,CAAkB;AAC/BF,EAAAA,SAAS,EAAE,EACT,GAAG3B,UAAU,CAAC8B;AADL,GADoB;AAI/BJ,EAAAA,gBAAgB,EAAE;AAChBK,IAAAA,QAAQ,EAAE;AADM;AAJa,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport React, { ReactNode, useCallback, useMemo } from 'react';\nimport { ScrollViewProps, StyleSheet } from 'react-native';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\nimport type { CollapsibleProps } from '../../types';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\ntype Props = ScrollViewProps &\n CollapsibleProps & {\n children?: ReactNode;\n };\n\nexport default function CollapsibleScrollView({\n headerSnappable = true,\n children,\n ...props\n}: Props) {\n const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();\n const { headerHeight } = useCollapsibleContext();\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollTo({ y: yValue, animated });\n }, []);\n\n const scrollToIndex = useCallback(() => {\n console.warn(\"CollapsibleScrollView doesn't support scrollToIndex\");\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n minHeight: contentMinHeight.value,\n };\n }, []);\n\n const contentContainerStyle = useMemo(\n () => [styles.contentContainer, props.contentContainerStyle],\n [props.contentContainerStyle]\n );\n\n return (\n <Animated.ScrollView\n ref={scrollViewRef}\n bounces={false}\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n >\n <Animated.View style={animatedStyle}>\n <AnimatedTopView height={headerHeight} />\n {children}\n </Animated.View>\n </Animated.ScrollView>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n});\n"]}
1
+ {"version":3,"sources":["CollapsibleScrollView.tsx"],"names":["AnimatedTopView","useAnimatedScroll","React","useCallback","useEffect","useMemo","useRef","useState","RefreshControl","StyleSheet","Animated","runOnJS","useAnimatedReaction","useAnimatedStyle","useCollapsibleContext","useInternalCollapsibleContext","CollapsibleScrollView","headerSnappable","children","refreshing","onRefresh","props","contentMinHeight","scrollViewRef","fixedHeaderHeight","headerHeight","internalProgressViewOffset","setInternalProgressViewOffset","mounted","current","scrollTo","yValue","animated","y","scrollToIndex","console","warn","scrollHandler","animatedStyle","minHeight","value","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","undefined","container","style","create","absoluteFillObject","flexGrow"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { RefreshControl, ScrollViewProps, StyleSheet } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedReaction,\n useAnimatedStyle,\n} from 'react-native-reanimated';\nimport type { CollapsibleProps } from '../../types';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\ntype Props = ScrollViewProps &\n CollapsibleProps & {\n children?: ReactNode;\n refreshing?: boolean;\n onRefresh?: () => void;\n };\n\nexport default function CollapsibleScrollView({\n headerSnappable = true,\n children,\n refreshing = false,\n onRefresh,\n ...props\n}: Props) {\n const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n const { headerHeight } = useCollapsibleContext();\n const [internalProgressViewOffset, setInternalProgressViewOffset] =\n useState(0);\n const mounted = useRef(true);\n\n useEffect(() => {\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const scrollTo = useCallback((yValue: number, animated = true) => {\n scrollViewRef.current?.scrollTo({ y: yValue, animated });\n }, []);\n\n const scrollToIndex = useCallback(() => {\n console.warn(\"CollapsibleScrollView doesn't support scrollToIndex\");\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n });\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n minHeight: contentMinHeight.value,\n };\n }, []);\n\n const handleInternalProgressViewOffset = useCallback((value: number) => {\n if (mounted.current) {\n setInternalProgressViewOffset(value);\n }\n }, []);\n\n useAnimatedReaction(\n () => {\n return fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n runOnJS(handleInternalProgressViewOffset)(result);\n }\n }\n );\n\n const contentContainerStyle = useMemo(\n () => [styles.contentContainer, props.contentContainerStyle],\n [props.contentContainerStyle]\n );\n\n return (\n <Animated.ScrollView\n ref={scrollViewRef}\n refreshControl={\n onRefresh ? (\n <RefreshControl\n progressViewOffset={internalProgressViewOffset}\n refreshing={refreshing}\n onRefresh={onRefresh}\n />\n ) : undefined\n }\n {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n keyboardDismissMode=\"on-drag\"\n keyboardShouldPersistTaps=\"handled\"\n scrollEventThrottle={1}\n >\n <Animated.View style={animatedStyle}>\n <AnimatedTopView height={headerHeight} />\n {children}\n </Animated.View>\n </Animated.ScrollView>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n ...StyleSheet.absoluteFillObject,\n },\n contentContainer: {\n flexGrow: 1,\n },\n});\n"]}
@@ -6,7 +6,6 @@ import { CollapsibleContext } from './hooks/useCollapsibleContext';
6
6
  import { InternalCollapsibleContext } from './hooks/useInternalCollapsibleContext';
7
7
  import { useAnimatedReaction, useDerivedValue, useSharedValue, withTiming } from 'react-native-reanimated';
8
8
  import { debounce } from './utils/debounce';
9
- import PullToRefreshProvider from './components/pullToRefresh/PullToRefreshProvider';
10
9
  import CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';
11
10
  export default function withCollapsibleContext(Component) {
12
11
  return props => {
@@ -157,7 +156,7 @@ export default function withCollapsibleContext(Component) {
157
156
  value: context
158
157
  }, /*#__PURE__*/React.createElement(InternalCollapsibleContext.Provider, {
159
158
  value: internalContext
160
- }, /*#__PURE__*/React.createElement(CollapsibleHeaderProvider, null, /*#__PURE__*/React.createElement(PullToRefreshProvider, null, /*#__PURE__*/React.createElement(Component, props)))));
159
+ }, /*#__PURE__*/React.createElement(CollapsibleHeaderProvider, null, /*#__PURE__*/React.createElement(Component, props))));
161
160
  };
162
161
  }
163
162
  //# sourceMappingURL=withCollapsibleContext.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["withCollapsibleContext.tsx"],"names":["React","useCallback","useMemo","useRef","CollapsibleContext","InternalCollapsibleContext","useAnimatedReaction","useDerivedValue","useSharedValue","withTiming","debounce","PullToRefreshProvider","CollapsibleHeaderProvider","withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","containerRef","scrollViewRef","setCollapsibleHandlers","handlers","current","headerCollapsed","maxY","value","contentMinHeight","totalHeight","Object","keys","reduce","acc","item","top","result","previous","viewPositions","sortedKeys","sort","a","b","totalTop","values","i","length","height","stickyHeader","key","data","isInsideHeader","handleStickyViewLayout","viewKey","viewRef","measureLayout","left","width","debounceRefreshStickyPositions","forEach","handleHeaderContainerLayout","duration","handleContainerHeight","context","collapse","animated","expand","scrollTo","offset","animate","scrollToIndex","params","internalContext"],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { FC, useCallback, useMemo, useRef } from 'react';\nimport type { CollapsibleHandles, LayoutParams } from './types';\nimport { CollapsibleContext } from './hooks/useCollapsibleContext';\nimport { InternalCollapsibleContext } from './hooks/useInternalCollapsibleContext';\nimport {\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport type { View } from 'react-native';\nimport { debounce } from './utils/debounce';\nimport PullToRefreshProvider from './components/pullToRefresh/PullToRefreshProvider';\nimport CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';\n\nexport default function withCollapsibleContext<T>(Component: FC<T>) {\n return (props: T) => {\n const collapsibleHandlers = useRef<CollapsibleHandles>();\n const headerHeight = useSharedValue(0);\n const scrollY = useSharedValue(0);\n const stickyViewRefs = useRef<Record<string, React.RefObject<View>>>({});\n const stickyViewTops = useSharedValue<Record<string, number>>({});\n const stickyViewPositionsRef = useRef<Record<string, LayoutParams>>({});\n const stickyViewPositions = useSharedValue<Record<string, LayoutParams>>(\n {}\n );\n const fixedHeaderHeight = useSharedValue(0);\n const stickyHeaderHeight = useSharedValue(0);\n const containerHeight = useSharedValue(0);\n const firstStickyViewY = useSharedValue(1000000);\n const containerRef = useRef<View>(null);\n const scrollViewRef = useRef<View>(null);\n\n const setCollapsibleHandlers = useCallback((handlers) => {\n collapsibleHandlers.current = handlers;\n }, []);\n\n const headerCollapsed = useDerivedValue(() => {\n const maxY = fixedHeaderHeight.value - firstStickyViewY.value;\n return scrollY.value >= maxY;\n }, []);\n\n const contentMinHeight = useDerivedValue(() => {\n return (\n containerHeight.value +\n fixedHeaderHeight.value -\n stickyHeaderHeight.value\n );\n }, []);\n\n useAnimatedReaction(\n () => {\n const totalHeight = Object.keys(stickyViewPositions.value).reduce(\n (acc, item) => {\n return acc + stickyViewPositions.value[item].top;\n },\n 0\n );\n return totalHeight - fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n const viewPositions = stickyViewPositions.value;\n const headerHeight = fixedHeaderHeight.value;\n const sortedKeys = Object.keys(viewPositions).sort(\n (a, b) => viewPositions[a].top - viewPositions[b].top\n );\n let totalTop = 0;\n const values: any = {};\n for (let i = 0; i < sortedKeys.length; i++) {\n values[sortedKeys[i]] = totalTop;\n // Try minus 1 make it filled when scrolling up.\n // Otherwise, we can see a small space between the persits views\n totalTop += viewPositions[sortedKeys[i]].height - 1;\n }\n stickyViewTops.value = values;\n firstStickyViewY.value = viewPositions[sortedKeys[0]]?.top || 0;\n const stickyHeader = sortedKeys.reduce((acc, key) => {\n const data = viewPositions[key];\n const isInsideHeader = data.top < headerHeight;\n if (isInsideHeader) {\n return acc + data.height;\n }\n return acc;\n }, 0);\n stickyHeaderHeight.value = stickyHeader;\n }\n }\n );\n\n const handleStickyViewLayout = useCallback(\n (viewKey: string, viewRef?: React.RefObject<View>) => {\n if (viewRef && viewRef.current && containerRef.current) {\n stickyViewRefs.current[viewKey] = viewRef;\n viewRef.current.measureLayout(\n // @ts-ignore\n containerRef.current,\n (left, top, width, height) => {\n stickyViewPositionsRef.current = {\n ...stickyViewPositionsRef.current,\n [viewKey]: { left, top, width, height },\n };\n stickyViewPositions.value = stickyViewPositionsRef.current;\n },\n () => {}\n );\n } else {\n delete stickyViewRefs.current[viewKey];\n delete stickyViewPositionsRef.current[viewKey];\n stickyViewPositions.value = stickyViewPositionsRef.current;\n }\n },\n []\n );\n\n const debounceRefreshStickyPositions = useMemo(() => {\n return debounce(() => {\n Object.keys(stickyViewRefs.current).forEach((key) => {\n const viewRef = stickyViewRefs.current[key];\n if (viewRef) {\n handleStickyViewLayout(key, viewRef);\n }\n });\n }, 200);\n }, []);\n\n const handleHeaderContainerLayout = useCallback((height: number) => {\n headerHeight.value = withTiming(height, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 10,\n });\n fixedHeaderHeight.value = height;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n }, []);\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: (animated?: boolean) =>\n collapsibleHandlers.current?.collapse(animated),\n expand: () => collapsibleHandlers.current?.expand(),\n scrollTo: (offset: number, animate?: boolean) =>\n collapsibleHandlers.current?.scrollTo(offset, animate),\n scrollToIndex: (params: any) =>\n collapsibleHandlers.current?.scrollToIndex(params),\n headerHeight,\n scrollY,\n headerCollapsed,\n };\n }, [scrollY, headerHeight, headerCollapsed]);\n\n const internalContext = useMemo(\n () => ({\n scrollViewRef,\n containerRef,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n setCollapsibleHandlers,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n }),\n [\n setCollapsibleHandlers,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n ]\n );\n\n return (\n <CollapsibleContext.Provider value={context}>\n <InternalCollapsibleContext.Provider value={internalContext}>\n <CollapsibleHeaderProvider>\n <PullToRefreshProvider>\n {/** @ts-ignore */}\n <Component {...props} />\n </PullToRefreshProvider>\n </CollapsibleHeaderProvider>\n </InternalCollapsibleContext.Provider>\n </CollapsibleContext.Provider>\n );\n };\n}\n"]}
1
+ {"version":3,"sources":["withCollapsibleContext.tsx"],"names":["React","useCallback","useMemo","useRef","CollapsibleContext","InternalCollapsibleContext","useAnimatedReaction","useDerivedValue","useSharedValue","withTiming","debounce","CollapsibleHeaderProvider","withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","containerRef","scrollViewRef","setCollapsibleHandlers","handlers","current","headerCollapsed","maxY","value","contentMinHeight","totalHeight","Object","keys","reduce","acc","item","top","result","previous","viewPositions","sortedKeys","sort","a","b","totalTop","values","i","length","height","stickyHeader","key","data","isInsideHeader","handleStickyViewLayout","viewKey","viewRef","measureLayout","left","width","debounceRefreshStickyPositions","forEach","handleHeaderContainerLayout","duration","handleContainerHeight","context","collapse","animated","expand","scrollTo","offset","animate","scrollToIndex","params","internalContext"],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { FC, useCallback, useMemo, useRef } from 'react';\nimport type { CollapsibleHandles, LayoutParams } from './types';\nimport { CollapsibleContext } from './hooks/useCollapsibleContext';\nimport { InternalCollapsibleContext } from './hooks/useInternalCollapsibleContext';\nimport {\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport type { View } from 'react-native';\nimport { debounce } from './utils/debounce';\nimport CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';\n\nexport default function withCollapsibleContext<T>(Component: FC<T>) {\n return (props: T) => {\n const collapsibleHandlers = useRef<CollapsibleHandles>();\n const headerHeight = useSharedValue(0);\n const scrollY = useSharedValue(0);\n const stickyViewRefs = useRef<Record<string, React.RefObject<View>>>({});\n const stickyViewTops = useSharedValue<Record<string, number>>({});\n const stickyViewPositionsRef = useRef<Record<string, LayoutParams>>({});\n const stickyViewPositions = useSharedValue<Record<string, LayoutParams>>(\n {}\n );\n const fixedHeaderHeight = useSharedValue(0);\n const stickyHeaderHeight = useSharedValue(0);\n const containerHeight = useSharedValue(0);\n const firstStickyViewY = useSharedValue(1000000);\n const containerRef = useRef<View>(null);\n const scrollViewRef = useRef<View>(null);\n\n const setCollapsibleHandlers = useCallback((handlers) => {\n collapsibleHandlers.current = handlers;\n }, []);\n\n const headerCollapsed = useDerivedValue(() => {\n const maxY = fixedHeaderHeight.value - firstStickyViewY.value;\n return scrollY.value >= maxY;\n }, []);\n\n const contentMinHeight = useDerivedValue(() => {\n return (\n containerHeight.value +\n fixedHeaderHeight.value -\n stickyHeaderHeight.value\n );\n }, []);\n\n useAnimatedReaction(\n () => {\n const totalHeight = Object.keys(stickyViewPositions.value).reduce(\n (acc, item) => {\n return acc + stickyViewPositions.value[item].top;\n },\n 0\n );\n return totalHeight - fixedHeaderHeight.value;\n },\n (result, previous) => {\n if (result !== previous) {\n const viewPositions = stickyViewPositions.value;\n const headerHeight = fixedHeaderHeight.value;\n const sortedKeys = Object.keys(viewPositions).sort(\n (a, b) => viewPositions[a].top - viewPositions[b].top\n );\n let totalTop = 0;\n const values: any = {};\n for (let i = 0; i < sortedKeys.length; i++) {\n values[sortedKeys[i]] = totalTop;\n // Try minus 1 make it filled when scrolling up.\n // Otherwise, we can see a small space between the persits views\n totalTop += viewPositions[sortedKeys[i]].height - 1;\n }\n stickyViewTops.value = values;\n firstStickyViewY.value = viewPositions[sortedKeys[0]]?.top || 0;\n const stickyHeader = sortedKeys.reduce((acc, key) => {\n const data = viewPositions[key];\n const isInsideHeader = data.top < headerHeight;\n if (isInsideHeader) {\n return acc + data.height;\n }\n return acc;\n }, 0);\n stickyHeaderHeight.value = stickyHeader;\n }\n }\n );\n\n const handleStickyViewLayout = useCallback(\n (viewKey: string, viewRef?: React.RefObject<View>) => {\n if (viewRef && viewRef.current && containerRef.current) {\n stickyViewRefs.current[viewKey] = viewRef;\n viewRef.current.measureLayout(\n // @ts-ignore\n containerRef.current,\n (left, top, width, height) => {\n stickyViewPositionsRef.current = {\n ...stickyViewPositionsRef.current,\n [viewKey]: { left, top, width, height },\n };\n stickyViewPositions.value = stickyViewPositionsRef.current;\n },\n () => {}\n );\n } else {\n delete stickyViewRefs.current[viewKey];\n delete stickyViewPositionsRef.current[viewKey];\n stickyViewPositions.value = stickyViewPositionsRef.current;\n }\n },\n []\n );\n\n const debounceRefreshStickyPositions = useMemo(() => {\n return debounce(() => {\n Object.keys(stickyViewRefs.current).forEach((key) => {\n const viewRef = stickyViewRefs.current[key];\n if (viewRef) {\n handleStickyViewLayout(key, viewRef);\n }\n });\n }, 200);\n }, []);\n\n const handleHeaderContainerLayout = useCallback((height: number) => {\n headerHeight.value = withTiming(height, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 10,\n });\n fixedHeaderHeight.value = height;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n }, []);\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: (animated?: boolean) =>\n collapsibleHandlers.current?.collapse(animated),\n expand: () => collapsibleHandlers.current?.expand(),\n scrollTo: (offset: number, animate?: boolean) =>\n collapsibleHandlers.current?.scrollTo(offset, animate),\n scrollToIndex: (params: any) =>\n collapsibleHandlers.current?.scrollToIndex(params),\n headerHeight,\n scrollY,\n headerCollapsed,\n };\n }, [scrollY, headerHeight, headerCollapsed]);\n\n const internalContext = useMemo(\n () => ({\n scrollViewRef,\n containerRef,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n setCollapsibleHandlers,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n }),\n [\n setCollapsibleHandlers,\n handleStickyViewLayout,\n handleHeaderContainerLayout,\n handleContainerHeight,\n firstStickyViewY,\n stickyViewTops,\n stickyViewPositions,\n fixedHeaderHeight,\n contentMinHeight,\n ]\n );\n\n return (\n <CollapsibleContext.Provider value={context}>\n <InternalCollapsibleContext.Provider value={internalContext}>\n <CollapsibleHeaderProvider>\n {/** @ts-ignore */}\n <Component {...props} />\n </CollapsibleHeaderProvider>\n </InternalCollapsibleContext.Provider>\n </CollapsibleContext.Provider>\n );\n };\n}\n"]}
@@ -3,6 +3,8 @@ import { ScrollViewProps } from 'react-native';
3
3
  import type { CollapsibleProps } from '../../types';
4
4
  declare type Props = ScrollViewProps & CollapsibleProps & {
5
5
  children?: ReactNode;
6
+ refreshing?: boolean;
7
+ onRefresh?: () => void;
6
8
  };
7
- export default function CollapsibleScrollView({ headerSnappable, children, ...props }: Props): JSX.Element;
9
+ export default function CollapsibleScrollView({ headerSnappable, children, refreshing, onRefresh, ...props }: Props): JSX.Element;
8
10
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@r0b0t3d/react-native-collapsible",
3
- "version": "1.3.4",
3
+ "version": "1.3.5-beta.0",
4
4
  "description": "Fully customizable collapsible views",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
@@ -9,7 +9,6 @@ export default function AnimatedTopView({ height }: Props) {
9
9
  const contentStyle = useAnimatedStyle(
10
10
  () => ({
11
11
  paddingTop: height.value,
12
- backgroundColor: 'white',
13
12
  }),
14
13
  []
15
14
  );
@@ -19,8 +19,8 @@ export default function CollapsibleHeaderConsumer() {
19
19
  interpolate(
20
20
  scrollY.value,
21
21
  // FIXME: can improve by geting maxY value of header and sticky views
22
- [-250, 0, 100000],
23
- [250, 0, -100000],
22
+ [-1000, 0, 100000],
23
+ [0, 0, -100000],
24
24
  Animated.Extrapolate.CLAMP
25
25
  ),
26
26
  []
@@ -56,7 +56,6 @@ export default function CollapsibleHeaderConsumer() {
56
56
 
57
57
  const styles = StyleSheet.create({
58
58
  container: {
59
- backgroundColor: 'white',
60
59
  zIndex: 10,
61
60
  },
62
61
  });
@@ -11,12 +11,11 @@ import Animated, {
11
11
  runOnJS,
12
12
  useAnimatedReaction,
13
13
  } from 'react-native-reanimated';
14
- import AnimatedTopView from '../header/AnimatedTopView';
15
14
  import useAnimatedScroll from './useAnimatedScroll';
16
- import useCollapsibleContext from '../../hooks/useCollapsibleContext';
17
15
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
18
16
  import type { CollapsibleProps } from '../../types';
19
- import PullToRefreshContainer from '../pullToRefresh/PullToRefreshContainer';
17
+ import AnimatedTopView from '../header/AnimatedTopView';
18
+ import useCollapsibleContext from '../../hooks/useCollapsibleContext';
20
19
 
21
20
  const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
22
21
 
@@ -27,10 +26,16 @@ export default function CollapsibleFlatList<Data>({
27
26
  headerSnappable = true,
28
27
  ...props
29
28
  }: Props<Data>) {
30
- const { headerHeight, scrollY } = useCollapsibleContext();
31
- const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();
29
+ const { headerHeight } = useCollapsibleContext();
30
+ const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =
31
+ useInternalCollapsibleContext();
32
32
  const mounted = useRef(true);
33
33
  const contentHeight = useRef(0);
34
+ const [internalContentMinHeight, setInternalContentMinHeight] = useState(
35
+ contentMinHeight.value
36
+ );
37
+ const [internalProgressViewOffset, setInternalProgressViewOffset] =
38
+ useState(0);
34
39
 
35
40
  useEffect(() => {
36
41
  return () => {
@@ -49,21 +54,23 @@ export default function CollapsibleFlatList<Data>({
49
54
  scrollViewRef.current?.scrollToIndex(params);
50
55
  }, []);
51
56
 
52
- const handleInternalContentHeight = useCallback((value: number) => {
53
- if (mounted.current) {
54
- setInternalContentMinHeight(value);
55
- }
56
- }, []);
57
-
58
57
  const { scrollHandler } = useAnimatedScroll({
59
58
  headerSnappable,
60
59
  scrollTo,
61
60
  scrollToIndex,
62
61
  });
63
62
 
64
- const [internalContentMinHeight, setInternalContentMinHeight] = useState(
65
- contentMinHeight.value
66
- );
63
+ const handleInternalContentHeight = useCallback((value: number) => {
64
+ if (mounted.current) {
65
+ setInternalContentMinHeight(value);
66
+ }
67
+ }, []);
68
+
69
+ const handleInternalProgressViewOffset = useCallback((value: number) => {
70
+ if (mounted.current) {
71
+ setInternalProgressViewOffset(value);
72
+ }
73
+ }, []);
67
74
 
68
75
  useAnimatedReaction(
69
76
  () => {
@@ -72,15 +79,26 @@ export default function CollapsibleFlatList<Data>({
72
79
  (result, previous) => {
73
80
  if (result !== previous) {
74
81
  if (
75
- contentHeight.current < contentMinHeight.value &&
76
- internalContentMinHeight !== contentMinHeight.value
82
+ contentHeight.current < result &&
83
+ internalContentMinHeight !== result
77
84
  ) {
78
- runOnJS(handleInternalContentHeight)(contentMinHeight.value);
85
+ runOnJS(handleInternalContentHeight)(result);
79
86
  }
80
87
  }
81
88
  }
82
89
  );
83
90
 
91
+ useAnimatedReaction(
92
+ () => {
93
+ return fixedHeaderHeight.value;
94
+ },
95
+ (result, previous) => {
96
+ if (result !== previous) {
97
+ runOnJS(handleInternalProgressViewOffset)(result);
98
+ }
99
+ }
100
+ );
101
+
84
102
  const contentContainerStyle = useMemo(
85
103
  () => [
86
104
  styles.contentContainer,
@@ -96,33 +114,32 @@ export default function CollapsibleFlatList<Data>({
96
114
 
97
115
  const handleScrollToIndexFailed = useCallback(() => {}, []);
98
116
 
99
- const renderListHeader = () => (
100
- <View>
101
- <AnimatedTopView height={headerHeight} />
102
- {props.ListHeaderComponent}
103
- </View>
104
- );
117
+ function renderListHeader() {
118
+ return (
119
+ <View>
120
+ <AnimatedTopView height={headerHeight} />
121
+ {props.ListHeaderComponent}
122
+ </View>
123
+ );
124
+ }
105
125
 
106
126
  return (
107
- <PullToRefreshContainer scrollY={scrollY}>
108
- {/* @ts-ignore */}
109
- <AnimatedFlatList
110
- ref={scrollViewRef}
111
- bounces={false}
112
- keyboardDismissMode="on-drag"
113
- keyboardShouldPersistTaps="handled"
114
- scrollEventThrottle={1}
115
- onScrollToIndexFailed={handleScrollToIndexFailed}
116
- {...props}
117
- style={[styles.container, props.style]}
118
- contentContainerStyle={contentContainerStyle}
119
- onScroll={scrollHandler}
120
- ListHeaderComponent={renderListHeader()}
121
- onContentSizeChange={handleContentSizeChange}
122
- //@ts-ignore
123
- simultaneousHandlers={[]}
124
- />
125
- </PullToRefreshContainer>
127
+ <AnimatedFlatList
128
+ ref={scrollViewRef}
129
+ keyboardDismissMode="on-drag"
130
+ keyboardShouldPersistTaps="handled"
131
+ scrollEventThrottle={1}
132
+ onScrollToIndexFailed={handleScrollToIndexFailed}
133
+ {...props}
134
+ style={[styles.container, props.style]}
135
+ contentContainerStyle={contentContainerStyle}
136
+ onScroll={scrollHandler}
137
+ ListHeaderComponent={renderListHeader()}
138
+ onContentSizeChange={handleContentSizeChange}
139
+ //@ts-ignore
140
+ simultaneousHandlers={[]}
141
+ progressViewOffset={internalProgressViewOffset}
142
+ />
126
143
  );
127
144
  }
128
145
 
@@ -1,9 +1,20 @@
1
1
  /* eslint-disable react-hooks/exhaustive-deps */
2
2
  import AnimatedTopView from '../header/AnimatedTopView';
3
3
  import useAnimatedScroll from './useAnimatedScroll';
4
- import React, { ReactNode, useCallback, useMemo } from 'react';
5
- import { ScrollViewProps, StyleSheet } from 'react-native';
6
- import Animated, { useAnimatedStyle } from 'react-native-reanimated';
4
+ import React, {
5
+ ReactNode,
6
+ useCallback,
7
+ useEffect,
8
+ useMemo,
9
+ useRef,
10
+ useState,
11
+ } from 'react';
12
+ import { RefreshControl, ScrollViewProps, StyleSheet } from 'react-native';
13
+ import Animated, {
14
+ runOnJS,
15
+ useAnimatedReaction,
16
+ useAnimatedStyle,
17
+ } from 'react-native-reanimated';
7
18
  import type { CollapsibleProps } from '../../types';
8
19
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
9
20
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
@@ -11,15 +22,29 @@ import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleCon
11
22
  type Props = ScrollViewProps &
12
23
  CollapsibleProps & {
13
24
  children?: ReactNode;
25
+ refreshing?: boolean;
26
+ onRefresh?: () => void;
14
27
  };
15
28
 
16
29
  export default function CollapsibleScrollView({
17
30
  headerSnappable = true,
18
31
  children,
32
+ refreshing = false,
33
+ onRefresh,
19
34
  ...props
20
35
  }: Props) {
21
- const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();
36
+ const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =
37
+ useInternalCollapsibleContext();
22
38
  const { headerHeight } = useCollapsibleContext();
39
+ const [internalProgressViewOffset, setInternalProgressViewOffset] =
40
+ useState(0);
41
+ const mounted = useRef(true);
42
+
43
+ useEffect(() => {
44
+ return () => {
45
+ mounted.current = false;
46
+ };
47
+ }, []);
23
48
 
24
49
  const scrollTo = useCallback((yValue: number, animated = true) => {
25
50
  scrollViewRef.current?.scrollTo({ y: yValue, animated });
@@ -41,6 +66,23 @@ export default function CollapsibleScrollView({
41
66
  };
42
67
  }, []);
43
68
 
69
+ const handleInternalProgressViewOffset = useCallback((value: number) => {
70
+ if (mounted.current) {
71
+ setInternalProgressViewOffset(value);
72
+ }
73
+ }, []);
74
+
75
+ useAnimatedReaction(
76
+ () => {
77
+ return fixedHeaderHeight.value;
78
+ },
79
+ (result, previous) => {
80
+ if (result !== previous) {
81
+ runOnJS(handleInternalProgressViewOffset)(result);
82
+ }
83
+ }
84
+ );
85
+
44
86
  const contentContainerStyle = useMemo(
45
87
  () => [styles.contentContainer, props.contentContainerStyle],
46
88
  [props.contentContainerStyle]
@@ -49,7 +91,15 @@ export default function CollapsibleScrollView({
49
91
  return (
50
92
  <Animated.ScrollView
51
93
  ref={scrollViewRef}
52
- bounces={false}
94
+ refreshControl={
95
+ onRefresh ? (
96
+ <RefreshControl
97
+ progressViewOffset={internalProgressViewOffset}
98
+ refreshing={refreshing}
99
+ onRefresh={onRefresh}
100
+ />
101
+ ) : undefined
102
+ }
53
103
  {...props}
54
104
  style={[styles.container, props.style]}
55
105
  contentContainerStyle={contentContainerStyle}
@@ -12,7 +12,6 @@ import {
12
12
  } from 'react-native-reanimated';
13
13
  import type { View } from 'react-native';
14
14
  import { debounce } from './utils/debounce';
15
- import PullToRefreshProvider from './components/pullToRefresh/PullToRefreshProvider';
16
15
  import CollapsibleHeaderProvider from './components/header/CollapsibleHeaderProvider';
17
16
 
18
17
  export default function withCollapsibleContext<T>(Component: FC<T>) {
@@ -185,10 +184,8 @@ export default function withCollapsibleContext<T>(Component: FC<T>) {
185
184
  <CollapsibleContext.Provider value={context}>
186
185
  <InternalCollapsibleContext.Provider value={internalContext}>
187
186
  <CollapsibleHeaderProvider>
188
- <PullToRefreshProvider>
189
- {/** @ts-ignore */}
190
- <Component {...props} />
191
- </PullToRefreshProvider>
187
+ {/** @ts-ignore */}
188
+ <Component {...props} />
192
189
  </CollapsibleHeaderProvider>
193
190
  </InternalCollapsibleContext.Provider>
194
191
  </CollapsibleContext.Provider>