@r0b0t3d/react-native-collapsible 1.2.0-alpha.1 → 1.2.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 (44) hide show
  1. package/lib/commonjs/components/CollapsibleContainer.js +1 -9
  2. package/lib/commonjs/components/CollapsibleContainer.js.map +1 -1
  3. package/lib/commonjs/components/header/CollapsibleHeaderContainer.js +1 -3
  4. package/lib/commonjs/components/header/CollapsibleHeaderContainer.js.map +1 -1
  5. package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js +2 -2
  6. package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js.map +1 -1
  7. package/lib/commonjs/components/pullToRefresh/RefreshControl.js +9 -1
  8. package/lib/commonjs/components/pullToRefresh/RefreshControl.js.map +1 -1
  9. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js +10 -2
  10. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js.map +1 -1
  11. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js +5 -1
  12. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js.map +1 -1
  13. package/lib/commonjs/components/scrollable/useAnimatedScroll.js +5 -3
  14. package/lib/commonjs/components/scrollable/useAnimatedScroll.js.map +1 -1
  15. package/lib/commonjs/withCollapsibleContext.js +9 -1
  16. package/lib/commonjs/withCollapsibleContext.js.map +1 -1
  17. package/lib/module/components/CollapsibleContainer.js +1 -9
  18. package/lib/module/components/CollapsibleContainer.js.map +1 -1
  19. package/lib/module/components/header/CollapsibleHeaderContainer.js +2 -4
  20. package/lib/module/components/header/CollapsibleHeaderContainer.js.map +1 -1
  21. package/lib/module/components/pullToRefresh/PullToRefreshContainer.js +2 -2
  22. package/lib/module/components/pullToRefresh/PullToRefreshContainer.js.map +1 -1
  23. package/lib/module/components/pullToRefresh/RefreshControl.js +9 -1
  24. package/lib/module/components/pullToRefresh/RefreshControl.js.map +1 -1
  25. package/lib/module/components/scrollable/CollapsibleFlatList.js +10 -2
  26. package/lib/module/components/scrollable/CollapsibleFlatList.js.map +1 -1
  27. package/lib/module/components/scrollable/CollapsibleScrollView.js +5 -1
  28. package/lib/module/components/scrollable/CollapsibleScrollView.js.map +1 -1
  29. package/lib/module/components/scrollable/useAnimatedScroll.js +5 -3
  30. package/lib/module/components/scrollable/useAnimatedScroll.js.map +1 -1
  31. package/lib/module/withCollapsibleContext.js +9 -1
  32. package/lib/module/withCollapsibleContext.js.map +1 -1
  33. package/lib/typescript/components/scrollable/useAnimatedScroll.d.ts +3 -1
  34. package/lib/typescript/types.d.ts +7 -0
  35. package/package.json +1 -1
  36. package/src/components/CollapsibleContainer.tsx +1 -3
  37. package/src/components/header/CollapsibleHeaderContainer.tsx +1 -4
  38. package/src/components/pullToRefresh/PullToRefreshContainer.tsx +3 -2
  39. package/src/components/pullToRefresh/RefreshControl.tsx +13 -1
  40. package/src/components/scrollable/CollapsibleFlatList.tsx +8 -0
  41. package/src/components/scrollable/CollapsibleScrollView.tsx +5 -0
  42. package/src/components/scrollable/useAnimatedScroll.ts +5 -1
  43. package/src/types.ts +8 -0
  44. package/src/withCollapsibleContext.tsx +5 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["PullToRefreshContainer.tsx"],"names":["NativeViewGestureHandler","PanGestureHandler","React","useRef","Animated","useAnimatedGestureHandler","withTiming","usePullToRefreshContext","StyleSheet","rubberClamp","PullToRefreshContainer","children","scrollY","scrollRef","panRef","refreshValue","internalRefreshing","internalHeight","gestureHandler","onStart","_","ctx","startY","value","onActive","event","tranY","translationY","clampedValue","onEnd","absoluteFill"],"mappings":"AAAA,SACEA,wBADF,EAEEC,iBAFF,QAGO,8BAHP;AAIA,OAAOC,KAAP,IAAgBC,MAAhB,QAA8B,OAA9B;AACA,OAAOC,QAAP,IACEC,yBADF,EAEEC,UAFF,QAGO,yBAHP;AAIA,OAAOC,uBAAP,MAAoC,2BAApC;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAASC,WAAT,QAA4B,SAA5B;AAOA,eAAe,SAASC,sBAAT,CAAgC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAhC,EAA8D;AAC3E,QAAMC,SAAS,GAAGV,MAAM,EAAxB;AACA,QAAMW,MAAM,GAAGX,MAAM,EAArB;AACA,QAAM;AAAEY,IAAAA,YAAF;AAAgBC,IAAAA,kBAAhB;AAAoCC,IAAAA;AAApC,MACJV,uBAAuB,EADzB;AAGA,QAAMW,cAAc,GAAGb,yBAAyB,CAAC;AAC/Cc,IAAAA,OAAO,EAAE,CAACC,CAAD,EAAIC,GAAJ,KAAiB;AACxBA,MAAAA,GAAG,CAACC,MAAJ,GAAaN,kBAAkB,CAACO,KAAnB,GAA2BR,YAAY,CAACQ,KAAxC,GAAgD,CAA7D;AACD,KAH8C;AAI/CC,IAAAA,QAAQ,EAAE,CAACC,KAAD,EAAQJ,GAAR,KAAqB;AAC7B,UAAIT,OAAO,CAACW,KAAR,IAAiB,CAArB,EAAwB;AACtB,cAAMG,KAAK,GAAGD,KAAK,CAACE,YAAN,GAAqBN,GAAG,CAACC,MAAvC;AACA,cAAMM,YAAY,GAAGnB,WAAW,CAACiB,KAAD,EAAQ,CAAR,EAAWT,cAAc,CAACM,KAA1B,CAAhC;AACAR,QAAAA,YAAY,CAACQ,KAAb,GAAqBK,YAArB;;AACA,YAAIA,YAAY,GAAGX,cAAc,CAACM,KAAlC,EAAyC;AACvCP,UAAAA,kBAAkB,CAACO,KAAnB,GAA2B,IAA3B;AACD;AACF,OAPD,MAOO;AACLR,QAAAA,YAAY,CAACQ,KAAb,GAAqB,CAArB;AACD;AACF,KAf8C;AAgB/CM,IAAAA,KAAK,EAAE,MAAM;AACX,UAAId,YAAY,CAACQ,KAAb,GAAqB,CAAzB,EAA4B;AAC1B,cAAMA,KAAK,GAAGP,kBAAkB,CAACO,KAAnB,GAA2BN,cAAc,CAACM,KAA1C,GAAkD,CAAhE;AACAR,QAAAA,YAAY,CAACQ,KAAb,GAAqBjB,UAAU,CAACiB,KAAD,CAA/B;AACD;AACF;AArB8C,GAAD,CAAhD;AAwBA,sBACE,oBAAC,iBAAD;AACE,IAAA,GAAG,EAAET,MADP;AAEE,IAAA,oBAAoB,EAAED,SAFxB;AAGE,IAAA,cAAc,EAAEK,cAHlB;AAIE,IAAA,uBAAuB,EAAE,KAJ3B;AAKE,IAAA,8BAA8B,MALhC;AAME,IAAA,WAAW,EAAE;AANf,kBAQE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEV,UAAU,CAACsB;AAAjC,kBACE,oBAAC,wBAAD;AAA0B,IAAA,GAAG,EAAEjB,SAA/B;AAA0C,IAAA,oBAAoB,EAAEC;AAAhE,KACGH,QADH,CADF,CARF,CADF;AAgBD","sourcesContent":["import {\n NativeViewGestureHandler,\n PanGestureHandler,\n} from 'react-native-gesture-handler';\nimport React, { useRef } from 'react';\nimport Animated, {\n useAnimatedGestureHandler,\n withTiming,\n} from 'react-native-reanimated';\nimport usePullToRefreshContext from './usePullToRefreshContext';\nimport { StyleSheet } from 'react-native';\nimport { rubberClamp } from './utils';\n\ntype Props = {\n children: React.ReactNode;\n scrollY: Animated.SharedValue<number>;\n};\n\nexport default function PullToRefreshContainer({ children, scrollY }: Props) {\n const scrollRef = useRef();\n const panRef = useRef();\n const { refreshValue, internalRefreshing, internalHeight } =\n usePullToRefreshContext();\n\n const gestureHandler = useAnimatedGestureHandler({\n onStart: (_, ctx: any) => {\n ctx.startY = internalRefreshing.value ? refreshValue.value : 0;\n },\n onActive: (event, ctx: any) => {\n if (scrollY.value <= 1) {\n const tranY = event.translationY + ctx.startY;\n const clampedValue = rubberClamp(tranY, 0, internalHeight.value);\n refreshValue.value = clampedValue;\n if (clampedValue > internalHeight.value) {\n internalRefreshing.value = true;\n }\n } else {\n refreshValue.value = 0;\n }\n },\n onEnd: () => {\n if (refreshValue.value > 0) {\n const value = internalRefreshing.value ? internalHeight.value : 0;\n refreshValue.value = withTiming(value);\n }\n },\n });\n\n return (\n <PanGestureHandler\n ref={panRef}\n simultaneousHandlers={scrollRef}\n onGestureEvent={gestureHandler}\n shouldCancelWhenOutside={false}\n enableTrackpadTwoFingerGesture\n maxPointers={1}\n >\n <Animated.View style={StyleSheet.absoluteFill}>\n <NativeViewGestureHandler ref={scrollRef} simultaneousHandlers={panRef}>\n {children}\n </NativeViewGestureHandler>\n </Animated.View>\n </PanGestureHandler>\n );\n}\n"]}
1
+ {"version":3,"sources":["PullToRefreshContainer.tsx"],"names":["NativeViewGestureHandler","PanGestureHandler","React","useRef","Animated","useAnimatedGestureHandler","withTiming","usePullToRefreshContext","StyleSheet","rubberClamp","PullToRefreshContainer","children","scrollY","scrollRef","panRef","refreshValue","internalRefreshing","internalHeight","gestureHandler","onStart","_","ctx","startY","value","onActive","event","tranY","translationY","clampedValue","onEnd","absoluteFill"],"mappings":"AAAA,SACEA,wBADF,EAEEC,iBAFF,QAGO,8BAHP;AAIA,OAAOC,KAAP,IAAgBC,MAAhB,QAA8B,OAA9B;AACA,OAAOC,QAAP,IACEC,yBADF,EAEEC,UAFF,QAGO,yBAHP;AAIA,OAAOC,uBAAP,MAAoC,2BAApC;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAASC,WAAT,QAA4B,SAA5B;AAOA,eAAe,SAASC,sBAAT,CAAgC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAhC,EAA8D;AAC3E,QAAMC,SAAS,GAAGV,MAAM,EAAxB;AACA,QAAMW,MAAM,GAAGX,MAAM,EAArB;AACA,QAAM;AAAEY,IAAAA,YAAF;AAAgBC,IAAAA,kBAAhB;AAAoCC,IAAAA;AAApC,MACJV,uBAAuB,EADzB;AAGA,QAAMW,cAAc,GAAGb,yBAAyB,CAAC;AAC/Cc,IAAAA,OAAO,EAAE,CAACC,CAAD,EAAIC,GAAJ,KAAiB;AACxBA,MAAAA,GAAG,CAACC,MAAJ,GACE,CAACN,kBAAkB,CAACO,KAAnB,GAA2BR,YAAY,CAACQ,KAAxC,GAAgD,CAAjD,IAAsDX,OAAO,CAACW,KADhE;AAED,KAJ8C;AAK/CC,IAAAA,QAAQ,EAAE,CAACC,KAAD,EAAQJ,GAAR,KAAqB;AAC7B,UAAIT,OAAO,CAACW,KAAR,IAAiB,CAArB,EAAwB;AACtB,cAAMG,KAAK,GAAGD,KAAK,CAACE,YAAN,GAAqBN,GAAG,CAACC,MAAvC;AACA,cAAMM,YAAY,GAAGnB,WAAW,CAACiB,KAAD,EAAQ,CAAR,EAAWT,cAAc,CAACM,KAA1B,CAAhC;AACAR,QAAAA,YAAY,CAACQ,KAAb,GAAqBK,YAArB;;AACA,YAAIA,YAAY,GAAGX,cAAc,CAACM,KAAlC,EAAyC;AACvCP,UAAAA,kBAAkB,CAACO,KAAnB,GAA2B,IAA3B;AACD;AACF,OAPD,MAOO,IAAI,CAACP,kBAAkB,CAACO,KAAxB,EAA+B;AACpCR,QAAAA,YAAY,CAACQ,KAAb,GAAqB,CAArB;AACD;AACF,KAhB8C;AAiB/CM,IAAAA,KAAK,EAAE,MAAM;AACX,UAAId,YAAY,CAACQ,KAAb,GAAqB,CAAzB,EAA4B;AAC1B,cAAMA,KAAK,GAAGP,kBAAkB,CAACO,KAAnB,GAA2BN,cAAc,CAACM,KAA1C,GAAkD,CAAhE;AACAR,QAAAA,YAAY,CAACQ,KAAb,GAAqBjB,UAAU,CAACiB,KAAD,CAA/B;AACD;AACF;AAtB8C,GAAD,CAAhD;AAyBA,sBACE,oBAAC,iBAAD;AACE,IAAA,GAAG,EAAET,MADP;AAEE,IAAA,oBAAoB,EAAED,SAFxB;AAGE,IAAA,cAAc,EAAEK,cAHlB;AAIE,IAAA,uBAAuB,EAAE,KAJ3B;AAKE,IAAA,8BAA8B,MALhC;AAME,IAAA,WAAW,EAAE;AANf,kBAQE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEV,UAAU,CAACsB;AAAjC,kBACE,oBAAC,wBAAD;AAA0B,IAAA,GAAG,EAAEjB,SAA/B;AAA0C,IAAA,oBAAoB,EAAEC;AAAhE,KACGH,QADH,CADF,CARF,CADF;AAgBD","sourcesContent":["import {\n NativeViewGestureHandler,\n PanGestureHandler,\n} from 'react-native-gesture-handler';\nimport React, { useRef } from 'react';\nimport Animated, {\n useAnimatedGestureHandler,\n withTiming,\n} from 'react-native-reanimated';\nimport usePullToRefreshContext from './usePullToRefreshContext';\nimport { StyleSheet } from 'react-native';\nimport { rubberClamp } from './utils';\n\ntype Props = {\n children: React.ReactNode;\n scrollY: Animated.SharedValue<number>;\n};\n\nexport default function PullToRefreshContainer({ children, scrollY }: Props) {\n const scrollRef = useRef();\n const panRef = useRef();\n const { refreshValue, internalRefreshing, internalHeight } =\n usePullToRefreshContext();\n\n const gestureHandler = useAnimatedGestureHandler({\n onStart: (_, ctx: any) => {\n ctx.startY =\n (internalRefreshing.value ? refreshValue.value : 0) - scrollY.value;\n },\n onActive: (event, ctx: any) => {\n if (scrollY.value <= 1) {\n const tranY = event.translationY + ctx.startY;\n const clampedValue = rubberClamp(tranY, 0, internalHeight.value);\n refreshValue.value = clampedValue;\n if (clampedValue > internalHeight.value) {\n internalRefreshing.value = true;\n }\n } else if (!internalRefreshing.value) {\n refreshValue.value = 0;\n }\n },\n onEnd: () => {\n if (refreshValue.value > 0) {\n const value = internalRefreshing.value ? internalHeight.value : 0;\n refreshValue.value = withTiming(value);\n }\n },\n });\n\n return (\n <PanGestureHandler\n ref={panRef}\n simultaneousHandlers={scrollRef}\n onGestureEvent={gestureHandler}\n shouldCancelWhenOutside={false}\n enableTrackpadTwoFingerGesture\n maxPointers={1}\n >\n <Animated.View style={StyleSheet.absoluteFill}>\n <NativeViewGestureHandler ref={scrollRef} simultaneousHandlers={panRef}>\n {children}\n </NativeViewGestureHandler>\n </Animated.View>\n </PanGestureHandler>\n );\n}\n"]}
@@ -20,13 +20,21 @@ export default function RefreshControl({
20
20
  useEffect(() => {
21
21
  internalRefreshing.value = refreshing;
22
22
  }, [refreshing]);
23
+ useAnimatedReaction(() => {
24
+ return internalRefreshing.value;
25
+ }, (result, prev) => {
26
+ if (result !== prev) {
27
+ if (result && refreshValue.value === 0) {
28
+ refreshValue.value = height;
29
+ }
30
+ }
31
+ });
23
32
  const animatedStyle = useAnimatedStyle(() => {
24
33
  return {
25
34
  height: refreshValue.value
26
35
  };
27
36
  }, []);
28
37
  const handleRefresh = useCallback(() => {
29
- console.log('refresh');
30
38
  onRefresh();
31
39
  }, [onRefresh]);
32
40
  useAnimatedReaction(() => internalRefreshing.value, (result, prev) => {
@@ -1 +1 @@
1
- {"version":3,"sources":["RefreshControl.tsx"],"names":["React","useCallback","useEffect","StyleSheet","Animated","runOnJS","useAnimatedProps","useAnimatedReaction","useAnimatedStyle","withTiming","usePullToRefreshContext","RefreshControl","height","refreshing","onRefresh","renderAnimation","refreshValue","internalRefreshing","internalHeight","value","animatedStyle","handleRefresh","console","log","result","prev","animatedProps","progress","undefined","Math","min","styles","container","create","overflow"],"mappings":"AAAA;AACA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,SAA7B,QAA8C,OAA9C;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,OAAOC,QAAP,IACEC,OADF,EAEEC,gBAFF,EAGEC,mBAHF,EAIEC,gBAJF,EAKEC,UALF,QAMO,yBANP;AAOA,OAAOC,uBAAP,MAAoC,2BAApC;AASA,eAAe,SAASC,cAAT,CAAwB;AACrCC,EAAAA,MAAM,GAAG,GAD4B;AAErCC,EAAAA,UAFqC;AAGrCC,EAAAA,SAHqC;AAIrCC,EAAAA;AAJqC,CAAxB,EAKL;AACR,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,kBAAhB;AAAoCC,IAAAA;AAApC,MACJR,uBAAuB,EADzB;AAGAR,EAAAA,SAAS,CAAC,MAAM;AACdgB,IAAAA,cAAc,CAACC,KAAf,GAAuBP,MAAvB;AACD,GAFQ,EAEN,CAACA,MAAD,CAFM,CAAT;AAIAV,EAAAA,SAAS,CAAC,MAAM;AACde,IAAAA,kBAAkB,CAACE,KAAnB,GAA2BN,UAA3B;AACD,GAFQ,EAEN,CAACA,UAAD,CAFM,CAAT;AAIA,QAAMO,aAAa,GAAGZ,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLI,MAAAA,MAAM,EAAEI,YAAY,CAACG;AADhB,KAAP;AAGD,GAJqC,EAInC,EAJmC,CAAtC;AAMA,QAAME,aAAa,GAAGpB,WAAW,CAAC,MAAM;AACtCqB,IAAAA,OAAO,CAACC,GAAR,CAAY,SAAZ;AACAT,IAAAA,SAAS;AACV,GAHgC,EAG9B,CAACA,SAAD,CAH8B,CAAjC;AAKAP,EAAAA,mBAAmB,CACjB,MAAMU,kBAAkB,CAACE,KADR,EAEjB,CAACK,MAAD,EAASC,IAAT,KAAkB;AAChB,QAAID,MAAM,KAAKC,IAAf,EAAqB;AACnB,UAAID,MAAJ,EAAY;AACVnB,QAAAA,OAAO,CAACgB,aAAD,CAAP;AACD,OAFD,MAEO;AACLL,QAAAA,YAAY,CAACG,KAAb,GAAqBV,UAAU,CAAC,CAAD,CAA/B;AACD;AACF;AACF,GAVgB,CAAnB;AAaA,QAAMiB,aAAa,GAAGpB,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLqB,MAAAA,QAAQ,EAAEV,kBAAkB,CAACE,KAAnB,GACNS,SADM,GAENC,IAAI,CAACC,GAAL,CAASd,YAAY,CAACG,KAAb,GAAqBP,MAA9B,EAAsC,CAAtC;AAHC,KAAP;AAKD,GANqC,EAMnC,CAACA,MAAD,CANmC,CAAtC;AAQA,sBACE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACmB,MAAM,CAACC,SAAR,EAAmBZ,aAAnB;AAAtB,KACGL,eAAe,CAACW,aAAD,CADlB,CADF;AAKD;AAED,MAAMK,MAAM,GAAG5B,UAAU,CAAC8B,MAAX,CAAkB;AAC/BD,EAAAA,SAAS,EAAE;AACTE,IAAAA,QAAQ,EAAE;AADD;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useCallback, useEffect } from 'react';\nimport { StyleSheet } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedProps,\n useAnimatedReaction,\n useAnimatedStyle,\n withTiming,\n} from 'react-native-reanimated';\nimport usePullToRefreshContext from './usePullToRefreshContext';\n\ntype Props = {\n height?: number;\n refreshing: boolean;\n onRefresh: () => void;\n renderAnimation: (animatedProps: any) => React.ReactNode;\n};\n\nexport default function RefreshControl({\n height = 100,\n refreshing,\n onRefresh,\n renderAnimation,\n}: Props) {\n const { refreshValue, internalRefreshing, internalHeight } =\n usePullToRefreshContext();\n\n useEffect(() => {\n internalHeight.value = height;\n }, [height]);\n\n useEffect(() => {\n internalRefreshing.value = refreshing;\n }, [refreshing]);\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n height: refreshValue.value,\n };\n }, []);\n\n const handleRefresh = useCallback(() => {\n console.log('refresh');\n onRefresh();\n }, [onRefresh]);\n\n useAnimatedReaction(\n () => internalRefreshing.value,\n (result, prev) => {\n if (result !== prev) {\n if (result) {\n runOnJS(handleRefresh)();\n } else {\n refreshValue.value = withTiming(0);\n }\n }\n }\n );\n\n const animatedProps = useAnimatedProps(() => {\n return {\n progress: internalRefreshing.value\n ? undefined\n : Math.min(refreshValue.value / height, 1),\n };\n }, [height]);\n\n return (\n <Animated.View style={[styles.container, animatedStyle]}>\n {renderAnimation(animatedProps)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n overflow: 'hidden',\n },\n});\n"]}
1
+ {"version":3,"sources":["RefreshControl.tsx"],"names":["React","useCallback","useEffect","StyleSheet","Animated","runOnJS","useAnimatedProps","useAnimatedReaction","useAnimatedStyle","withTiming","usePullToRefreshContext","RefreshControl","height","refreshing","onRefresh","renderAnimation","refreshValue","internalRefreshing","internalHeight","value","result","prev","animatedStyle","handleRefresh","animatedProps","progress","undefined","Math","min","styles","container","create","overflow"],"mappings":"AAAA;AACA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,SAA7B,QAA8C,OAA9C;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,OAAOC,QAAP,IACEC,OADF,EAEEC,gBAFF,EAGEC,mBAHF,EAIEC,gBAJF,EAKEC,UALF,QAMO,yBANP;AAOA,OAAOC,uBAAP,MAAoC,2BAApC;AASA,eAAe,SAASC,cAAT,CAAwB;AACrCC,EAAAA,MAAM,GAAG,GAD4B;AAErCC,EAAAA,UAFqC;AAGrCC,EAAAA,SAHqC;AAIrCC,EAAAA;AAJqC,CAAxB,EAKL;AACR,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,kBAAhB;AAAoCC,IAAAA;AAApC,MACJR,uBAAuB,EADzB;AAGAR,EAAAA,SAAS,CAAC,MAAM;AACdgB,IAAAA,cAAc,CAACC,KAAf,GAAuBP,MAAvB;AACD,GAFQ,EAEN,CAACA,MAAD,CAFM,CAAT;AAIAV,EAAAA,SAAS,CAAC,MAAM;AACde,IAAAA,kBAAkB,CAACE,KAAnB,GAA2BN,UAA3B;AACD,GAFQ,EAEN,CAACA,UAAD,CAFM,CAAT;AAIAN,EAAAA,mBAAmB,CACjB,MAAM;AACJ,WAAOU,kBAAkB,CAACE,KAA1B;AACD,GAHgB,EAIjB,CAACC,MAAD,EAASC,IAAT,KAAkB;AAChB,QAAID,MAAM,KAAKC,IAAf,EAAqB;AACnB,UAAID,MAAM,IAAIJ,YAAY,CAACG,KAAb,KAAuB,CAArC,EAAwC;AACtCH,QAAAA,YAAY,CAACG,KAAb,GAAqBP,MAArB;AACD;AACF;AACF,GAVgB,CAAnB;AAaA,QAAMU,aAAa,GAAGd,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLI,MAAAA,MAAM,EAAEI,YAAY,CAACG;AADhB,KAAP;AAGD,GAJqC,EAInC,EAJmC,CAAtC;AAMA,QAAMI,aAAa,GAAGtB,WAAW,CAAC,MAAM;AACtCa,IAAAA,SAAS;AACV,GAFgC,EAE9B,CAACA,SAAD,CAF8B,CAAjC;AAIAP,EAAAA,mBAAmB,CACjB,MAAMU,kBAAkB,CAACE,KADR,EAEjB,CAACC,MAAD,EAASC,IAAT,KAAkB;AAChB,QAAID,MAAM,KAAKC,IAAf,EAAqB;AACnB,UAAID,MAAJ,EAAY;AACVf,QAAAA,OAAO,CAACkB,aAAD,CAAP;AACD,OAFD,MAEO;AACLP,QAAAA,YAAY,CAACG,KAAb,GAAqBV,UAAU,CAAC,CAAD,CAA/B;AACD;AACF;AACF,GAVgB,CAAnB;AAaA,QAAMe,aAAa,GAAGlB,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLmB,MAAAA,QAAQ,EAAER,kBAAkB,CAACE,KAAnB,GACNO,SADM,GAENC,IAAI,CAACC,GAAL,CAASZ,YAAY,CAACG,KAAb,GAAqBP,MAA9B,EAAsC,CAAtC;AAHC,KAAP;AAKD,GANqC,EAMnC,CAACA,MAAD,CANmC,CAAtC;AAQA,sBACE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACiB,MAAM,CAACC,SAAR,EAAmBR,aAAnB;AAAtB,KACGP,eAAe,CAACS,aAAD,CADlB,CADF;AAKD;AAED,MAAMK,MAAM,GAAG1B,UAAU,CAAC4B,MAAX,CAAkB;AAC/BD,EAAAA,SAAS,EAAE;AACTE,IAAAA,QAAQ,EAAE;AADD;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useCallback, useEffect } from 'react';\nimport { StyleSheet } from 'react-native';\nimport Animated, {\n runOnJS,\n useAnimatedProps,\n useAnimatedReaction,\n useAnimatedStyle,\n withTiming,\n} from 'react-native-reanimated';\nimport usePullToRefreshContext from './usePullToRefreshContext';\n\ntype Props = {\n height?: number;\n refreshing: boolean;\n onRefresh: () => void;\n renderAnimation: (animatedProps: any) => React.ReactNode;\n};\n\nexport default function RefreshControl({\n height = 100,\n refreshing,\n onRefresh,\n renderAnimation,\n}: Props) {\n const { refreshValue, internalRefreshing, internalHeight } =\n usePullToRefreshContext();\n\n useEffect(() => {\n internalHeight.value = height;\n }, [height]);\n\n useEffect(() => {\n internalRefreshing.value = refreshing;\n }, [refreshing]);\n\n useAnimatedReaction(\n () => {\n return internalRefreshing.value;\n },\n (result, prev) => {\n if (result !== prev) {\n if (result && refreshValue.value === 0) {\n refreshValue.value = height;\n }\n }\n }\n );\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n height: refreshValue.value,\n };\n }, []);\n\n const handleRefresh = useCallback(() => {\n onRefresh();\n }, [onRefresh]);\n\n useAnimatedReaction(\n () => internalRefreshing.value,\n (result, prev) => {\n if (result !== prev) {\n if (result) {\n runOnJS(handleRefresh)();\n } else {\n refreshValue.value = withTiming(0);\n }\n }\n }\n );\n\n const animatedProps = useAnimatedProps(() => {\n return {\n progress: internalRefreshing.value\n ? undefined\n : Math.min(refreshValue.value / height, 1),\n };\n }, [height]);\n\n return (\n <Animated.View style={[styles.container, animatedStyle]}>\n {renderAnimation(animatedProps)}\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n overflow: 'hidden',\n },\n});\n"]}
@@ -37,6 +37,11 @@ export default function CollapsibleFlatList({
37
37
  animated
38
38
  });
39
39
  }, []);
40
+ const scrollToIndex = useCallback(params => {
41
+ var _scrollViewRef$curren2;
42
+
43
+ (_scrollViewRef$curren2 = scrollViewRef.current) === null || _scrollViewRef$curren2 === void 0 ? void 0 : _scrollViewRef$curren2.scrollToIndex(params);
44
+ }, []);
40
45
  const handleInternalContentHeight = useCallback(value => {
41
46
  if (mounted.current) {
42
47
  setInternalContentMinHeight(value);
@@ -46,7 +51,8 @@ export default function CollapsibleFlatList({
46
51
  scrollHandler
47
52
  } = useAnimatedScroll({
48
53
  headerSnappable,
49
- scrollTo
54
+ scrollTo,
55
+ scrollToIndex
50
56
  });
51
57
  const [internalContentMinHeight, setInternalContentMinHeight] = useState(contentMinHeight.value);
52
58
  useAnimatedReaction(() => {
@@ -64,6 +70,7 @@ export default function CollapsibleFlatList({
64
70
  const handleContentSizeChange = useCallback((_, height) => {
65
71
  contentHeight.current = height;
66
72
  }, []);
73
+ const handleScrollToIndexFailed = useCallback(() => {}, []);
67
74
 
68
75
  const renderListHeader = () => /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(AnimatedTopView, {
69
76
  height: headerHeight
@@ -76,7 +83,8 @@ export default function CollapsibleFlatList({
76
83
  bounces: false,
77
84
  keyboardDismissMode: "on-drag",
78
85
  keyboardShouldPersistTaps: "handled",
79
- scrollEventThrottle: 1
86
+ scrollEventThrottle: 1,
87
+ onScrollToIndexFailed: handleScrollToIndexFailed
80
88
  }, props, {
81
89
  style: [styles.container, props.style],
82
90
  contentContainerStyle: contentContainerStyle,
@@ -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","handleInternalContentHeight","value","setInternalContentMinHeight","scrollHandler","internalContentMinHeight","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","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 handleInternalContentHeight = useCallback((value: number) => {\n if (mounted.current) {\n setInternalContentMinHeight(value);\n }\n }, []);\n\n const { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\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 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 {...props}\n style={[styles.container, props.style]}\n contentContainerStyle={contentContainerStyle}\n onScroll={scrollHandler}\n ListHeaderComponent={renderListHeader()}\n onContentSizeChange={handleContentSizeChange}\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","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 />\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"]}
@@ -28,11 +28,15 @@ export default function CollapsibleScrollView({
28
28
  animated
29
29
  });
30
30
  }, []);
31
+ const scrollToIndex = useCallback(() => {
32
+ console.warn("CollapsibleScrollView doesn't support scrollToIndex");
33
+ }, []);
31
34
  const {
32
35
  scrollHandler
33
36
  } = useAnimatedScroll({
34
37
  headerSnappable,
35
- scrollTo
38
+ scrollTo,
39
+ scrollToIndex
36
40
  });
37
41
  const animatedStyle = useAnimatedStyle(() => {
38
42
  return {
@@ -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","scrollHandler","animatedStyle","minHeight","value","contentContainerStyle","styles","contentContainer","container","style","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"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,QAAM;AAAEG,IAAAA;AAAF,MAAoBrB,iBAAiB,CAAC;AAC1CU,IAAAA,eAD0C;AAE1CM,IAAAA;AAF0C,GAAD,CAA3C;AAKA,QAAMM,aAAa,GAAGhB,gBAAgB,CAAC,MAAM;AAC3C,WAAO;AACLiB,MAAAA,SAAS,EAAEV,gBAAgB,CAACW;AADvB,KAAP;AAGD,GAJqC,EAInC,EAJmC,CAAtC;AAMA,QAAMC,qBAAqB,GAAGtB,OAAO,CACnC,MAAM,CAACuB,MAAM,CAACC,gBAAR,EAA0Bf,KAAK,CAACa,qBAAhC,CAD6B,EAEnC,CAACb,KAAK,CAACa,qBAAP,CAFmC,CAArC;AAKA,sBACE,oBAAC,QAAD,CAAU,UAAV;AACE,IAAA,GAAG,EAAEX,aADP;AAEE,IAAA,OAAO,EAAE;AAFX,KAGMF,KAHN;AAIE,IAAA,KAAK,EAAE,CAACc,MAAM,CAACE,SAAR,EAAmBhB,KAAK,CAACiB,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,EAAEP;AAAzB,IADF,EAEGJ,QAFH,CAXF,CADF;AAkBD;AAED,MAAMe,MAAM,GAAGtB,UAAU,CAAC0B,MAAX,CAAkB;AAC/BF,EAAAA,SAAS,EAAE,EACT,GAAGxB,UAAU,CAAC2B;AADL,GADoB;AAI/BJ,EAAAA,gBAAgB,EAAE;AAChBK,IAAAA,QAAQ,EAAE;AADM,GAJa;AAO/BC,EAAAA,OAAO,EAAE;AACPC,IAAAA,QAAQ,EAAE,UADH;AAEPC,IAAAA,GAAG,EAAE,CAFE;AAGPC,IAAAA,IAAI,EAAE,CAHC;AAIPC,IAAAA,KAAK,EAAE;AAJA;AAPsB,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 { scrollHandler } = useAnimatedScroll({\n headerSnappable,\n scrollTo,\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 topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
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","topView","position","top","left","right"],"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,GAJa;AAO/BC,EAAAA,OAAO,EAAE;AACPC,IAAAA,QAAQ,EAAE,UADH;AAEPC,IAAAA,GAAG,EAAE,CAFE;AAGPC,IAAAA,IAAI,EAAE,CAHC;AAIPC,IAAAA,KAAK,EAAE;AAJA;AAPsB,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 topView: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n },\n});\n"]}
@@ -9,7 +9,8 @@ const {
9
9
  } = Dimensions.get('window');
10
10
  export default function useAnimatedScroll({
11
11
  headerSnappable,
12
- scrollTo
12
+ scrollTo,
13
+ scrollToIndex
13
14
  }) {
14
15
  const scrollDirection = useSharedValue('unknown');
15
16
  const {
@@ -33,9 +34,10 @@ export default function useAnimatedScroll({
33
34
  setCollapsibleHandlers({
34
35
  collapse,
35
36
  expand,
36
- scrollTo
37
+ scrollTo,
38
+ scrollToIndex
37
39
  });
38
- }, [setCollapsibleHandlers, collapse, expand, scrollTo]);
40
+ }, [setCollapsibleHandlers, collapse, expand, scrollTo, scrollToIndex]);
39
41
  const scrollHandler = useAnimatedScrollHandler({
40
42
  onScroll: event => {
41
43
  const offset = event.contentOffset.y;
@@ -1 +1 @@
1
- {"version":3,"sources":["useAnimatedScroll.ts"],"names":["useCallback","useEffect","Dimensions","runOnJS","useAnimatedScrollHandler","useSharedValue","useCollapsibleContext","useInternalCollapsibleContext","height","wHeight","get","useAnimatedScroll","headerSnappable","scrollTo","scrollDirection","scrollY","setCollapsibleHandlers","firstStickyViewY","fixedHeaderHeight","value","requestAnimationFrame","collapse","Math","min","expand","scrollHandler","onScroll","event","offset","contentOffset","y","diff","onEndDrag","maxY","delta","abs","yValue"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport { useCallback, useEffect } from 'react';\nimport { Dimensions } from 'react-native';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useSharedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\nconst { height: wHeight } = Dimensions.get('window');\n\ntype Props = {\n headerSnappable: boolean;\n scrollTo: (yValue: number, animated?: boolean) => void;\n};\n\nexport default function useAnimatedScroll({\n headerSnappable,\n scrollTo,\n}: Props) {\n const scrollDirection = useSharedValue('unknown');\n const { scrollY } = useCollapsibleContext();\n const { setCollapsibleHandlers, firstStickyViewY, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n\n useEffect(() => {\n if (scrollY.value > 0) {\n requestAnimationFrame(() => scrollTo(scrollY.value, false));\n }\n }, []);\n\n const collapse = useCallback(() => {\n scrollTo(\n Math.min(fixedHeaderHeight.value || 0, firstStickyViewY.value || 0)\n );\n }, [scrollTo]);\n\n const expand = useCallback(() => scrollTo(0), [scrollTo]);\n\n useEffect(() => {\n setCollapsibleHandlers({\n collapse,\n expand,\n scrollTo,\n });\n }, [setCollapsibleHandlers, collapse, expand, scrollTo]);\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n const offset = event.contentOffset.y;\n const diff = scrollY.value - offset;\n scrollDirection.value = diff > 0 ? 'down' : diff < 0 ? 'up' : 'unknown';\n scrollY.value = offset;\n },\n onEndDrag: () => {\n if (!headerSnappable) return;\n const maxY =\n firstStickyViewY.value && firstStickyViewY.value > 0\n ? firstStickyViewY.value\n : fixedHeaderHeight.value || 0;\n\n if (scrollY.value < maxY) {\n const delta = Math.abs(scrollY.value - maxY);\n if (delta < wHeight / 2) {\n let yValue = 0;\n if (scrollDirection.value === 'up') {\n yValue = maxY;\n }\n runOnJS(scrollTo)(yValue);\n }\n }\n },\n },\n [scrollTo]\n );\n\n return {\n scrollHandler,\n collapse,\n expand,\n };\n}\n"]}
1
+ {"version":3,"sources":["useAnimatedScroll.ts"],"names":["useCallback","useEffect","Dimensions","runOnJS","useAnimatedScrollHandler","useSharedValue","useCollapsibleContext","useInternalCollapsibleContext","height","wHeight","get","useAnimatedScroll","headerSnappable","scrollTo","scrollToIndex","scrollDirection","scrollY","setCollapsibleHandlers","firstStickyViewY","fixedHeaderHeight","value","requestAnimationFrame","collapse","Math","min","expand","scrollHandler","onScroll","event","offset","contentOffset","y","diff","onEndDrag","maxY","delta","abs","yValue"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport { useCallback, useEffect } from 'react';\nimport { Dimensions } from 'react-native';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useSharedValue,\n} from 'react-native-reanimated';\nimport type { ScrollToIndexParams } from 'src/types';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\n\nconst { height: wHeight } = Dimensions.get('window');\n\ntype Props = {\n headerSnappable: boolean;\n scrollTo: (yValue: number, animated?: boolean) => void;\n scrollToIndex: (params: ScrollToIndexParams) => void;\n};\n\nexport default function useAnimatedScroll({\n headerSnappable,\n scrollTo,\n scrollToIndex,\n}: Props) {\n const scrollDirection = useSharedValue('unknown');\n const { scrollY } = useCollapsibleContext();\n const { setCollapsibleHandlers, firstStickyViewY, fixedHeaderHeight } =\n useInternalCollapsibleContext();\n\n useEffect(() => {\n if (scrollY.value > 0) {\n requestAnimationFrame(() => scrollTo(scrollY.value, false));\n }\n }, []);\n\n const collapse = useCallback(() => {\n scrollTo(\n Math.min(fixedHeaderHeight.value || 0, firstStickyViewY.value || 0)\n );\n }, [scrollTo]);\n\n const expand = useCallback(() => scrollTo(0), [scrollTo]);\n\n useEffect(() => {\n setCollapsibleHandlers({\n collapse,\n expand,\n scrollTo,\n scrollToIndex,\n });\n }, [setCollapsibleHandlers, collapse, expand, scrollTo, scrollToIndex]);\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n const offset = event.contentOffset.y;\n const diff = scrollY.value - offset;\n scrollDirection.value = diff > 0 ? 'down' : diff < 0 ? 'up' : 'unknown';\n scrollY.value = offset;\n },\n onEndDrag: () => {\n if (!headerSnappable) return;\n const maxY =\n firstStickyViewY.value && firstStickyViewY.value > 0\n ? firstStickyViewY.value\n : fixedHeaderHeight.value || 0;\n\n if (scrollY.value < maxY) {\n const delta = Math.abs(scrollY.value - maxY);\n if (delta < wHeight / 2) {\n let yValue = 0;\n if (scrollDirection.value === 'up') {\n yValue = maxY;\n }\n runOnJS(scrollTo)(yValue);\n }\n }\n },\n },\n [scrollTo]\n );\n\n return {\n scrollHandler,\n collapse,\n expand,\n };\n}\n"]}
@@ -24,6 +24,9 @@ export default function withCollapsibleContext(Component) {
24
24
  const containerRef = useRef(null);
25
25
  const scrollViewRef = useRef(null);
26
26
  const setCollapsibleHandlers = useCallback(handlers => {
27
+ console.log({
28
+ handlers
29
+ });
27
30
  collapsibleHandlers.current = handlers;
28
31
  }, []);
29
32
  const headerCollapsed = useDerivedValue(() => {
@@ -111,7 +114,7 @@ export default function withCollapsibleContext(Component) {
111
114
 
112
115
  const totalHeight = Object.keys(headerContainersHeight.current).reduce((acc, key) => headerContainersHeight.current[key] + acc, 0);
113
116
  headerHeight.value = withTiming(totalHeight, {
114
- duration: fixedHeaderHeight.value === 0 ? 0 : 200
117
+ duration: fixedHeaderHeight.value === 0 ? 0 : 10
115
118
  });
116
119
  fixedHeaderHeight.value = totalHeight; // Try refresh sticky positions
117
120
 
@@ -137,6 +140,11 @@ export default function withCollapsibleContext(Component) {
137
140
 
138
141
  return (_collapsibleHandlers$3 = collapsibleHandlers.current) === null || _collapsibleHandlers$3 === void 0 ? void 0 : _collapsibleHandlers$3.scrollTo(offset, animate);
139
142
  },
143
+ scrollToIndex: params => {
144
+ var _collapsibleHandlers$4;
145
+
146
+ return (_collapsibleHandlers$4 = collapsibleHandlers.current) === null || _collapsibleHandlers$4 === void 0 ? void 0 : _collapsibleHandlers$4.scrollToIndex(params);
147
+ },
140
148
  headerHeight,
141
149
  scrollY,
142
150
  headerCollapsed
@@ -1 +1 @@
1
- {"version":3,"sources":["withCollapsibleContext.tsx"],"names":["React","useCallback","useMemo","useRef","CollapsibleContext","InternalCollapsibleContext","useAnimatedReaction","useDerivedValue","useSharedValue","withTiming","debounce","PullToRefreshProvider","withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","headerContainersHeight","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","expand","scrollTo","offset","animate","internalContext"],"mappings":"AAAA;;AACA;AACA,OAAOA,KAAP,IAAoBC,WAApB,EAAiCC,OAAjC,EAA0CC,MAA1C,QAAwD,OAAxD;AAEA,SAASC,kBAAT,QAAmC,+BAAnC;AACA,SAASC,0BAAT,QAA2C,uCAA3C;AACA,SACEC,mBADF,EAEEC,eAFF,EAGEC,cAHF,EAIEC,UAJF,QAKO,yBALP;AAOA,SAASC,QAAT,QAAyB,kBAAzB;AACA,OAAOC,qBAAP,MAAkC,kDAAlC;AAEA,eAAe,SAASC,sBAAT,CAAmCC,SAAnC,EAAqD;AAClE,SAAQC,KAAD,IAAc;AACnB,UAAMC,mBAAmB,GAAGZ,MAAM,EAAlC;AACA,UAAMa,YAAY,GAAGR,cAAc,CAAC,CAAD,CAAnC;AACA,UAAMS,OAAO,GAAGT,cAAc,CAAC,CAAD,CAA9B;AACA,UAAMU,cAAc,GAAGf,MAAM,CAAwC,EAAxC,CAA7B;AACA,UAAMgB,cAAc,GAAGX,cAAc,CAAyB,EAAzB,CAArC;AACA,UAAMY,sBAAsB,GAAGjB,MAAM,CAA+B,EAA/B,CAArC;AACA,UAAMkB,mBAAmB,GAAGb,cAAc,CACxC,EADwC,CAA1C;AAGA,UAAMc,iBAAiB,GAAGd,cAAc,CAAC,CAAD,CAAxC;AACA,UAAMe,kBAAkB,GAAGf,cAAc,CAAC,CAAD,CAAzC;AACA,UAAMgB,eAAe,GAAGhB,cAAc,CAAC,CAAD,CAAtC;AACA,UAAMiB,gBAAgB,GAAGjB,cAAc,CAAC,OAAD,CAAvC;AACA,UAAMkB,sBAAsB,GAAGvB,MAAM,CAAyB,EAAzB,CAArC;AACA,UAAMwB,YAAY,GAAGxB,MAAM,CAAO,IAAP,CAA3B;AACA,UAAMyB,aAAa,GAAGzB,MAAM,CAAO,IAAP,CAA5B;AAEA,UAAM0B,sBAAsB,GAAG5B,WAAW,CAAE6B,QAAD,IAAc;AACvDf,MAAAA,mBAAmB,CAACgB,OAApB,GAA8BD,QAA9B;AACD,KAFyC,EAEvC,EAFuC,CAA1C;AAIA,UAAME,eAAe,GAAGzB,eAAe,CAAC,MAAM;AAC5C,YAAM0B,IAAI,GAAGX,iBAAiB,CAACY,KAAlB,GAA0BT,gBAAgB,CAACS,KAAxD;AACA,aAAOjB,OAAO,CAACiB,KAAR,IAAiBD,IAAxB;AACD,KAHsC,EAGpC,EAHoC,CAAvC;AAKA,UAAME,gBAAgB,GAAG5B,eAAe,CAAC,MAAM;AAC7C,aACEiB,eAAe,CAACU,KAAhB,GACAZ,iBAAiB,CAACY,KADlB,GAEAX,kBAAkB,CAACW,KAHrB;AAKD,KANuC,EAMrC,EANqC,CAAxC;AAQA5B,IAAAA,mBAAmB,CACjB,MAAM;AACJ,YAAM8B,WAAW,GAAGC,MAAM,CAACC,IAAP,CAAYjB,mBAAmB,CAACa,KAAhC,EAAuCK,MAAvC,CAClB,CAACC,GAAD,EAAMC,IAAN,KAAe;AACb,eAAOD,GAAG,GAAGnB,mBAAmB,CAACa,KAApB,CAA0BO,IAA1B,EAAgCC,GAA7C;AACD,OAHiB,EAIlB,CAJkB,CAApB;AAMA,aAAON,WAAW,GAAGd,iBAAiB,CAACY,KAAvC;AACD,KATgB,EAUjB,CAACS,MAAD,EAASC,QAAT,KAAsB;AACpB,UAAID,MAAM,KAAKC,QAAf,EAAyB;AAAA;;AACvB,cAAMC,aAAa,GAAGxB,mBAAmB,CAACa,KAA1C;AACA,cAAMlB,YAAY,GAAGM,iBAAiB,CAACY,KAAvC;AACA,cAAMY,UAAU,GAAGT,MAAM,CAACC,IAAP,CAAYO,aAAZ,EAA2BE,IAA3B,CACjB,CAACC,CAAD,EAAIC,CAAJ,KAAUJ,aAAa,CAACG,CAAD,CAAb,CAAiBN,GAAjB,GAAuBG,aAAa,CAACI,CAAD,CAAb,CAAiBP,GADjC,CAAnB;AAGA,YAAIQ,QAAQ,GAAG,CAAf;AACA,cAAMC,MAAW,GAAG,EAApB;;AACA,aAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGN,UAAU,CAACO,MAA/B,EAAuCD,CAAC,EAAxC,EAA4C;AAC1CD,UAAAA,MAAM,CAACL,UAAU,CAACM,CAAD,CAAX,CAAN,GAAwBF,QAAxB,CAD0C,CAE1C;AACA;;AACAA,UAAAA,QAAQ,IAAIL,aAAa,CAACC,UAAU,CAACM,CAAD,CAAX,CAAb,CAA6BE,MAA7B,GAAsC,CAAlD;AACD;;AACDnC,QAAAA,cAAc,CAACe,KAAf,GAAuBiB,MAAvB;AACA1B,QAAAA,gBAAgB,CAACS,KAAjB,GAAyB,0BAAAW,aAAa,CAACC,UAAU,CAAC,CAAD,CAAX,CAAb,gFAA8BJ,GAA9B,KAAqC,CAA9D;AACA,cAAMa,YAAY,GAAGT,UAAU,CAACP,MAAX,CAAkB,CAACC,GAAD,EAAMgB,GAAN,KAAc;AACnD,gBAAMC,IAAI,GAAGZ,aAAa,CAACW,GAAD,CAA1B;AACA,gBAAME,cAAc,GAAGD,IAAI,CAACf,GAAL,GAAW1B,YAAlC;;AACA,cAAI0C,cAAJ,EAAoB;AAClB,mBAAOlB,GAAG,GAAGiB,IAAI,CAACH,MAAlB;AACD;;AACD,iBAAOd,GAAP;AACD,SAPoB,EAOlB,CAPkB,CAArB;AAQAjB,QAAAA,kBAAkB,CAACW,KAAnB,GAA2BqB,YAA3B;AACD;AACF,KArCgB,CAAnB;AAwCA,UAAMI,sBAAsB,GAAG1D,WAAW,CACxC,CAAC2D,OAAD,EAAkBC,OAAlB,KAAsD;AACpD,UAAIA,OAAO,IAAIA,OAAO,CAAC9B,OAAnB,IAA8BJ,YAAY,CAACI,OAA/C,EAAwD;AACtDb,QAAAA,cAAc,CAACa,OAAf,CAAuB6B,OAAvB,IAAkCC,OAAlC;AACAA,QAAAA,OAAO,CAAC9B,OAAR,CAAgB+B,aAAhB,EACE;AACAnC,QAAAA,YAAY,CAACI,OAFf,EAGE,CAACgC,IAAD,EAAOrB,GAAP,EAAYsB,KAAZ,EAAmBV,MAAnB,KAA8B;AAC5BlC,UAAAA,sBAAsB,CAACW,OAAvB,GAAiC,EAC/B,GAAGX,sBAAsB,CAACW,OADK;AAE/B,aAAC6B,OAAD,GAAW;AAAEG,cAAAA,IAAF;AAAQrB,cAAAA,GAAR;AAAasB,cAAAA,KAAb;AAAoBV,cAAAA;AAApB;AAFoB,WAAjC;AAIAjC,UAAAA,mBAAmB,CAACa,KAApB,GAA4Bd,sBAAsB,CAACW,OAAnD;AACD,SATH,EAUE,MAAM,CAAE,CAVV;AAYD,OAdD,MAcO;AACL,eAAOb,cAAc,CAACa,OAAf,CAAuB6B,OAAvB,CAAP;AACA,eAAOxC,sBAAsB,CAACW,OAAvB,CAA+B6B,OAA/B,CAAP;AACAvC,QAAAA,mBAAmB,CAACa,KAApB,GAA4Bd,sBAAsB,CAACW,OAAnD;AACD;AACF,KArBuC,EAsBxC,EAtBwC,CAA1C;AAyBA,UAAMkC,8BAA8B,GAAG/D,OAAO,CAAC,MAAM;AACnD,aAAOQ,QAAQ,CAAC,MAAM;AACpB2B,QAAAA,MAAM,CAACC,IAAP,CAAYpB,cAAc,CAACa,OAA3B,EAAoCmC,OAApC,CAA6CV,GAAD,IAAS;AACnD,gBAAMK,OAAO,GAAG3C,cAAc,CAACa,OAAf,CAAuByB,GAAvB,CAAhB;;AACA,cAAIK,OAAJ,EAAa;AACXF,YAAAA,sBAAsB,CAACH,GAAD,EAAMK,OAAN,CAAtB;AACD;AACF,SALD;AAMD,OAPc,EAOZ,GAPY,CAAf;AAQD,KAT6C,EAS3C,EAT2C,CAA9C;AAWA,UAAMM,2BAA2B,GAAGlE,WAAW,CAC7C,CAAC2D,OAAD,EAAkBN,MAAlB,KAAsC;AACpC,UAAI,CAACA,MAAL,EAAa;AACX,eAAO5B,sBAAsB,CAACK,OAAvB,CAA+B6B,OAA/B,CAAP;AACD,OAFD,MAEO;AACLlC,QAAAA,sBAAsB,CAACK,OAAvB,CAA+B6B,OAA/B,IAA0CN,MAA1C;AACD;;AACD,YAAMlB,WAAW,GAAGC,MAAM,CAACC,IAAP,CAAYZ,sBAAsB,CAACK,OAAnC,EAA4CQ,MAA5C,CAClB,CAACC,GAAD,EAAMgB,GAAN,KAAc9B,sBAAsB,CAACK,OAAvB,CAA+ByB,GAA/B,IAAsChB,GADlC,EAElB,CAFkB,CAApB;AAIAxB,MAAAA,YAAY,CAACkB,KAAb,GAAqBzB,UAAU,CAAC2B,WAAD,EAAc;AAC3CgC,QAAAA,QAAQ,EAAE9C,iBAAiB,CAACY,KAAlB,KAA4B,CAA5B,GAAgC,CAAhC,GAAoC;AADH,OAAd,CAA/B;AAGAZ,MAAAA,iBAAiB,CAACY,KAAlB,GAA0BE,WAA1B,CAboC,CAcpC;;AACA6B,MAAAA,8BAA8B;AAC/B,KAjB4C,EAkB7C,EAlB6C,CAA/C;AAqBA,UAAMI,qBAAqB,GAAGpE,WAAW,CAAEqD,MAAD,IAAoB;AAC5D9B,MAAAA,eAAe,CAACU,KAAhB,GAAwBoB,MAAxB;AACD,KAFwC,EAEtC,EAFsC,CAAzC;AAIA,UAAMgB,OAAO,GAAGpE,OAAO,CAAC,MAAM;AAC5B,aAAO;AACLqE,QAAAA,QAAQ,EAAE;AAAA;;AAAA,0CAAMxD,mBAAmB,CAACgB,OAA1B,0DAAM,sBAA6BwC,QAA7B,EAAN;AAAA,SADL;AAELC,QAAAA,MAAM,EAAE;AAAA;;AAAA,2CAAMzD,mBAAmB,CAACgB,OAA1B,2DAAM,uBAA6ByC,MAA7B,EAAN;AAAA,SAFH;AAGLC,QAAAA,QAAQ,EAAE,CAACC,MAAD,EAAiBC,OAAjB;AAAA;;AAAA,2CACR5D,mBAAmB,CAACgB,OADZ,2DACR,uBAA6B0C,QAA7B,CAAsCC,MAAtC,EAA8CC,OAA9C,CADQ;AAAA,SAHL;AAKL3D,QAAAA,YALK;AAMLC,QAAAA,OANK;AAOLe,QAAAA;AAPK,OAAP;AASD,KAVsB,EAUpB,CAACf,OAAD,EAAUD,YAAV,EAAwBgB,eAAxB,CAVoB,CAAvB;AAYA,UAAM4C,eAAe,GAAG1E,OAAO,CAC7B,OAAO;AACL0B,MAAAA,aADK;AAELD,MAAAA,YAFK;AAGLgC,MAAAA,sBAHK;AAILQ,MAAAA,2BAJK;AAKLtC,MAAAA,sBALK;AAMLwC,MAAAA,qBANK;AAOL5C,MAAAA,gBAPK;AAQLN,MAAAA,cARK;AASLE,MAAAA,mBATK;AAULC,MAAAA,iBAVK;AAWLa,MAAAA;AAXK,KAAP,CAD6B,EAc7B,CACEN,sBADF,EAEE8B,sBAFF,EAGEQ,2BAHF,EAIEE,qBAJF,EAKE5C,gBALF,EAMEN,cANF,EAOEE,mBAPF,EAQEC,iBARF,EASEa,gBATF,CAd6B,CAA/B;AA2BA,wBACE,oBAAC,kBAAD,CAAoB,QAApB;AAA6B,MAAA,KAAK,EAAEmC;AAApC,oBACE,oBAAC,0BAAD,CAA4B,QAA5B;AAAqC,MAAA,KAAK,EAAEM;AAA5C,oBACE,oBAAC,qBAAD,qBACE,oBAAC,SAAD,EAAe9D,KAAf,CADF,CADF,CADF,CADF;AASD,GAxLD;AAyLD","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';\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 headerContainersHeight = useRef<Record<string, number>>({});\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(\n (viewKey: string, height?: number) => {\n if (!height) {\n delete headerContainersHeight.current[viewKey];\n } else {\n headerContainersHeight.current[viewKey] = height;\n }\n const totalHeight = Object.keys(headerContainersHeight.current).reduce(\n (acc, key) => headerContainersHeight.current[key] + acc,\n 0\n );\n headerHeight.value = withTiming(totalHeight, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 200,\n });\n fixedHeaderHeight.value = totalHeight;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n },\n []\n );\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: () => collapsibleHandlers.current?.collapse(),\n expand: () => collapsibleHandlers.current?.expand(),\n scrollTo: (offset: number, animate?: boolean) =>\n collapsibleHandlers.current?.scrollTo(offset, animate),\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 <PullToRefreshProvider>\n <Component {...props} />\n </PullToRefreshProvider>\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","PullToRefreshProvider","withCollapsibleContext","Component","props","collapsibleHandlers","headerHeight","scrollY","stickyViewRefs","stickyViewTops","stickyViewPositionsRef","stickyViewPositions","fixedHeaderHeight","stickyHeaderHeight","containerHeight","firstStickyViewY","headerContainersHeight","containerRef","scrollViewRef","setCollapsibleHandlers","handlers","console","log","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","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';\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 headerContainersHeight = useRef<Record<string, number>>({});\n const containerRef = useRef<View>(null);\n const scrollViewRef = useRef<View>(null);\n\n const setCollapsibleHandlers = useCallback((handlers) => {\n console.log({ handlers });\n\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(\n (viewKey: string, height?: number) => {\n if (!height) {\n delete headerContainersHeight.current[viewKey];\n } else {\n headerContainersHeight.current[viewKey] = height;\n }\n const totalHeight = Object.keys(headerContainersHeight.current).reduce(\n (acc, key) => headerContainersHeight.current[key] + acc,\n 0\n );\n headerHeight.value = withTiming(totalHeight, {\n duration: fixedHeaderHeight.value === 0 ? 0 : 10,\n });\n fixedHeaderHeight.value = totalHeight;\n // Try refresh sticky positions\n debounceRefreshStickyPositions();\n },\n []\n );\n\n const handleContainerHeight = useCallback((height: number) => {\n containerHeight.value = height;\n }, []);\n\n const context = useMemo(() => {\n return {\n collapse: () => collapsibleHandlers.current?.collapse(),\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 <PullToRefreshProvider>\n <Component {...props} />\n </PullToRefreshProvider>\n </InternalCollapsibleContext.Provider>\n </CollapsibleContext.Provider>\n );\n };\n}\n"]}
@@ -1,8 +1,10 @@
1
+ import type { ScrollToIndexParams } from 'src/types';
1
2
  declare type Props = {
2
3
  headerSnappable: boolean;
3
4
  scrollTo: (yValue: number, animated?: boolean) => void;
5
+ scrollToIndex: (params: ScrollToIndexParams) => void;
4
6
  };
5
- export default function useAnimatedScroll({ headerSnappable, scrollTo, }: Props): {
7
+ export default function useAnimatedScroll({ headerSnappable, scrollTo, scrollToIndex, }: Props): {
6
8
  scrollHandler: (event: import("react-native").NativeSyntheticEvent<import("react-native").NativeScrollEvent>) => void;
7
9
  collapse: () => void;
8
10
  expand: () => void;
@@ -1,10 +1,17 @@
1
1
  import type React from 'react';
2
2
  import type { View } from 'react-native';
3
3
  import type Animated from 'react-native-reanimated';
4
+ export declare type ScrollToIndexParams = {
5
+ animated?: boolean | null;
6
+ index: number;
7
+ viewOffset?: number;
8
+ viewPosition?: number;
9
+ };
4
10
  export declare type CollapsibleHandles = {
5
11
  collapse: () => void;
6
12
  expand: () => void;
7
13
  scrollTo: (offset: number, animate?: boolean) => void;
14
+ scrollToIndex: (params: ScrollToIndexParams) => void;
8
15
  };
9
16
  export declare type CollapsibleContextType = CollapsibleHandles & {
10
17
  scrollY: Animated.SharedValue<number>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@r0b0t3d/react-native-collapsible",
3
- "version": "1.2.0-alpha.1",
3
+ "version": "1.2.0",
4
4
  "description": "Fully customizable collapsible views",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
@@ -40,10 +40,8 @@ export default function CollapsibleContainer({
40
40
  ref.current.measureLayout(
41
41
  // @ts-ignore
42
42
  containerRef.current,
43
- (left: number, top: number, width: number, height: number) => {
44
- console.log({ left, top, width, height });
43
+ (_left: number, top: number, _width: number, height: number) => {
45
44
  if (top + height - scrollY.value > containerHeight.current) {
46
- console.log('need to scroll');
47
45
  const extraOffset =
48
46
  keyboardAvoidingViewProps?.keyboardVerticalOffset ?? 20;
49
47
  scrollTo(top + height + extraOffset - containerHeight.current);
@@ -14,7 +14,6 @@ import Animated, {
14
14
  useAnimatedStyle,
15
15
  useDerivedValue,
16
16
  useSharedValue,
17
- withTiming,
18
17
  } from 'react-native-reanimated';
19
18
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
20
19
 
@@ -44,9 +43,7 @@ export default function CollapsibleHeaderContainer({
44
43
  layout: { height },
45
44
  },
46
45
  }: LayoutChangeEvent) => {
47
- headerHeight.value = withTiming(height, {
48
- duration: 200,
49
- });
46
+ headerHeight.value = height;
50
47
  handleHeaderContainerLayout(contentKey, height);
51
48
  },
52
49
  [contentKey, handleHeaderContainerLayout]
@@ -24,7 +24,8 @@ export default function PullToRefreshContainer({ children, scrollY }: Props) {
24
24
 
25
25
  const gestureHandler = useAnimatedGestureHandler({
26
26
  onStart: (_, ctx: any) => {
27
- ctx.startY = internalRefreshing.value ? refreshValue.value : 0;
27
+ ctx.startY =
28
+ (internalRefreshing.value ? refreshValue.value : 0) - scrollY.value;
28
29
  },
29
30
  onActive: (event, ctx: any) => {
30
31
  if (scrollY.value <= 1) {
@@ -34,7 +35,7 @@ export default function PullToRefreshContainer({ children, scrollY }: Props) {
34
35
  if (clampedValue > internalHeight.value) {
35
36
  internalRefreshing.value = true;
36
37
  }
37
- } else {
38
+ } else if (!internalRefreshing.value) {
38
39
  refreshValue.value = 0;
39
40
  }
40
41
  },
@@ -34,6 +34,19 @@ export default function RefreshControl({
34
34
  internalRefreshing.value = refreshing;
35
35
  }, [refreshing]);
36
36
 
37
+ useAnimatedReaction(
38
+ () => {
39
+ return internalRefreshing.value;
40
+ },
41
+ (result, prev) => {
42
+ if (result !== prev) {
43
+ if (result && refreshValue.value === 0) {
44
+ refreshValue.value = height;
45
+ }
46
+ }
47
+ }
48
+ );
49
+
37
50
  const animatedStyle = useAnimatedStyle(() => {
38
51
  return {
39
52
  height: refreshValue.value,
@@ -41,7 +54,6 @@ export default function RefreshControl({
41
54
  }, []);
42
55
 
43
56
  const handleRefresh = useCallback(() => {
44
- console.log('refresh');
45
57
  onRefresh();
46
58
  }, [onRefresh]);
47
59
 
@@ -45,6 +45,10 @@ export default function CollapsibleFlatList<Data>({
45
45
  });
46
46
  }, []);
47
47
 
48
+ const scrollToIndex = useCallback((params) => {
49
+ scrollViewRef.current?.scrollToIndex(params);
50
+ }, []);
51
+
48
52
  const handleInternalContentHeight = useCallback((value: number) => {
49
53
  if (mounted.current) {
50
54
  setInternalContentMinHeight(value);
@@ -54,6 +58,7 @@ export default function CollapsibleFlatList<Data>({
54
58
  const { scrollHandler } = useAnimatedScroll({
55
59
  headerSnappable,
56
60
  scrollTo,
61
+ scrollToIndex,
57
62
  });
58
63
 
59
64
  const [internalContentMinHeight, setInternalContentMinHeight] = useState(
@@ -89,6 +94,8 @@ export default function CollapsibleFlatList<Data>({
89
94
  contentHeight.current = height;
90
95
  }, []);
91
96
 
97
+ const handleScrollToIndexFailed = useCallback(() => {}, []);
98
+
92
99
  const renderListHeader = () => (
93
100
  <View>
94
101
  <AnimatedTopView height={headerHeight} />
@@ -105,6 +112,7 @@ export default function CollapsibleFlatList<Data>({
105
112
  keyboardDismissMode="on-drag"
106
113
  keyboardShouldPersistTaps="handled"
107
114
  scrollEventThrottle={1}
115
+ onScrollToIndexFailed={handleScrollToIndexFailed}
108
116
  {...props}
109
117
  style={[styles.container, props.style]}
110
118
  contentContainerStyle={contentContainerStyle}
@@ -25,9 +25,14 @@ export default function CollapsibleScrollView({
25
25
  scrollViewRef.current?.scrollTo({ y: yValue, animated });
26
26
  }, []);
27
27
 
28
+ const scrollToIndex = useCallback(() => {
29
+ console.warn("CollapsibleScrollView doesn't support scrollToIndex");
30
+ }, []);
31
+
28
32
  const { scrollHandler } = useAnimatedScroll({
29
33
  headerSnappable,
30
34
  scrollTo,
35
+ scrollToIndex,
31
36
  });
32
37
 
33
38
  const animatedStyle = useAnimatedStyle(() => {
@@ -6,6 +6,7 @@ import {
6
6
  useAnimatedScrollHandler,
7
7
  useSharedValue,
8
8
  } from 'react-native-reanimated';
9
+ import type { ScrollToIndexParams } from 'src/types';
9
10
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
10
11
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
11
12
 
@@ -14,11 +15,13 @@ const { height: wHeight } = Dimensions.get('window');
14
15
  type Props = {
15
16
  headerSnappable: boolean;
16
17
  scrollTo: (yValue: number, animated?: boolean) => void;
18
+ scrollToIndex: (params: ScrollToIndexParams) => void;
17
19
  };
18
20
 
19
21
  export default function useAnimatedScroll({
20
22
  headerSnappable,
21
23
  scrollTo,
24
+ scrollToIndex,
22
25
  }: Props) {
23
26
  const scrollDirection = useSharedValue('unknown');
24
27
  const { scrollY } = useCollapsibleContext();
@@ -44,8 +47,9 @@ export default function useAnimatedScroll({
44
47
  collapse,
45
48
  expand,
46
49
  scrollTo,
50
+ scrollToIndex,
47
51
  });
48
- }, [setCollapsibleHandlers, collapse, expand, scrollTo]);
52
+ }, [setCollapsibleHandlers, collapse, expand, scrollTo, scrollToIndex]);
49
53
 
50
54
  const scrollHandler = useAnimatedScrollHandler(
51
55
  {
package/src/types.ts CHANGED
@@ -2,10 +2,18 @@ import type React from 'react';
2
2
  import type { View } from 'react-native';
3
3
  import type Animated from 'react-native-reanimated';
4
4
 
5
+ export type ScrollToIndexParams = {
6
+ animated?: boolean | null;
7
+ index: number;
8
+ viewOffset?: number;
9
+ viewPosition?: number;
10
+ };
11
+
5
12
  export type CollapsibleHandles = {
6
13
  collapse: () => void;
7
14
  expand: () => void;
8
15
  scrollTo: (offset: number, animate?: boolean) => void;
16
+ scrollToIndex: (params: ScrollToIndexParams) => void;
9
17
  };
10
18
 
11
19
  export type CollapsibleContextType = CollapsibleHandles & {
@@ -34,6 +34,8 @@ export default function withCollapsibleContext<T>(Component: FC<T>) {
34
34
  const scrollViewRef = useRef<View>(null);
35
35
 
36
36
  const setCollapsibleHandlers = useCallback((handlers) => {
37
+ console.log({ handlers });
38
+
37
39
  collapsibleHandlers.current = handlers;
38
40
  }, []);
39
41
 
@@ -138,7 +140,7 @@ export default function withCollapsibleContext<T>(Component: FC<T>) {
138
140
  0
139
141
  );
140
142
  headerHeight.value = withTiming(totalHeight, {
141
- duration: fixedHeaderHeight.value === 0 ? 0 : 200,
143
+ duration: fixedHeaderHeight.value === 0 ? 0 : 10,
142
144
  });
143
145
  fixedHeaderHeight.value = totalHeight;
144
146
  // Try refresh sticky positions
@@ -157,6 +159,8 @@ export default function withCollapsibleContext<T>(Component: FC<T>) {
157
159
  expand: () => collapsibleHandlers.current?.expand(),
158
160
  scrollTo: (offset: number, animate?: boolean) =>
159
161
  collapsibleHandlers.current?.scrollTo(offset, animate),
162
+ scrollToIndex: (params: any) =>
163
+ collapsibleHandlers.current?.scrollToIndex(params),
160
164
  headerHeight,
161
165
  scrollY,
162
166
  headerCollapsed,