@r0b0t3d/react-native-collapsible 1.3.3 → 1.3.5-alpha.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 (89) hide show
  1. package/lib/commonjs/components/CollapsibleContainer.js +1 -3
  2. package/lib/commonjs/components/CollapsibleContainer.js.map +1 -1
  3. package/lib/commonjs/components/CollapsibleView.js +15 -5
  4. package/lib/commonjs/components/CollapsibleView.js.map +1 -1
  5. package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js +1 -1
  6. package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js.map +1 -1
  7. package/lib/commonjs/components/header/CollapsibleHeaderContainer.js +5 -13
  8. package/lib/commonjs/components/header/CollapsibleHeaderContainer.js.map +1 -1
  9. package/lib/commonjs/components/header/StickyView.js +2 -1
  10. package/lib/commonjs/components/header/StickyView.js.map +1 -1
  11. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js +36 -28
  12. package/lib/commonjs/components/scrollable/CollapsibleFlatList.js.map +1 -1
  13. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js +7 -14
  14. package/lib/commonjs/components/scrollable/CollapsibleScrollView.js.map +1 -1
  15. package/lib/commonjs/components/scrollable/useAnimatedScroll.js.map +1 -1
  16. package/lib/commonjs/index.js +0 -9
  17. package/lib/commonjs/index.js.map +1 -1
  18. package/lib/commonjs/withCollapsibleContext.js +1 -3
  19. package/lib/commonjs/withCollapsibleContext.js.map +1 -1
  20. package/lib/module/components/CollapsibleContainer.js +1 -2
  21. package/lib/module/components/CollapsibleContainer.js.map +1 -1
  22. package/lib/module/components/CollapsibleView.js +16 -6
  23. package/lib/module/components/CollapsibleView.js.map +1 -1
  24. package/lib/module/components/header/CollapsibleHeaderConsumer.js +1 -1
  25. package/lib/module/components/header/CollapsibleHeaderConsumer.js.map +1 -1
  26. package/lib/module/components/header/CollapsibleHeaderContainer.js +6 -13
  27. package/lib/module/components/header/CollapsibleHeaderContainer.js.map +1 -1
  28. package/lib/module/components/header/StickyView.js +3 -2
  29. package/lib/module/components/header/StickyView.js.map +1 -1
  30. package/lib/module/components/scrollable/CollapsibleFlatList.js +36 -26
  31. package/lib/module/components/scrollable/CollapsibleFlatList.js.map +1 -1
  32. package/lib/module/components/scrollable/CollapsibleScrollView.js +6 -12
  33. package/lib/module/components/scrollable/CollapsibleScrollView.js.map +1 -1
  34. package/lib/module/components/scrollable/useAnimatedScroll.js.map +1 -1
  35. package/lib/module/index.js +0 -1
  36. package/lib/module/index.js.map +1 -1
  37. package/lib/module/withCollapsibleContext.js +1 -2
  38. package/lib/module/withCollapsibleContext.js.map +1 -1
  39. package/lib/typescript/components/CollapsibleView.d.ts +2 -1
  40. package/lib/typescript/components/header/CollapsibleHeaderContainer.d.ts +2 -2
  41. package/lib/typescript/components/scrollable/useAnimatedScroll.d.ts +1 -1
  42. package/lib/typescript/index.d.ts +0 -1
  43. package/package.json +1 -1
  44. package/src/components/CollapsibleContainer.tsx +0 -2
  45. package/src/components/CollapsibleView.tsx +19 -3
  46. package/src/components/header/CollapsibleHeaderConsumer.tsx +2 -2
  47. package/src/components/header/CollapsibleHeaderContainer.tsx +8 -15
  48. package/src/components/header/StickyView.tsx +2 -1
  49. package/src/components/scrollable/CollapsibleFlatList.tsx +59 -40
  50. package/src/components/scrollable/CollapsibleScrollView.tsx +4 -8
  51. package/src/components/scrollable/useAnimatedScroll.ts +1 -1
  52. package/src/index.tsx +0 -1
  53. package/src/withCollapsibleContext.tsx +2 -5
  54. package/lib/commonjs/components/header/AnimatedTopView.js +0 -29
  55. package/lib/commonjs/components/header/AnimatedTopView.js.map +0 -1
  56. package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js +0 -75
  57. package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js.map +0 -1
  58. package/lib/commonjs/components/pullToRefresh/PullToRefreshProvider.js +0 -35
  59. package/lib/commonjs/components/pullToRefresh/PullToRefreshProvider.js.map +0 -1
  60. package/lib/commonjs/components/pullToRefresh/RefreshControl.js +0 -91
  61. package/lib/commonjs/components/pullToRefresh/RefreshControl.js.map +0 -1
  62. package/lib/commonjs/components/pullToRefresh/usePullToRefreshContext.js +0 -24
  63. package/lib/commonjs/components/pullToRefresh/usePullToRefreshContext.js.map +0 -1
  64. package/lib/commonjs/components/pullToRefresh/utils.js +0 -59
  65. package/lib/commonjs/components/pullToRefresh/utils.js.map +0 -1
  66. package/lib/module/components/header/AnimatedTopView.js +0 -14
  67. package/lib/module/components/header/AnimatedTopView.js.map +0 -1
  68. package/lib/module/components/pullToRefresh/PullToRefreshContainer.js +0 -56
  69. package/lib/module/components/pullToRefresh/PullToRefreshContainer.js.map +0 -1
  70. package/lib/module/components/pullToRefresh/PullToRefreshProvider.js +0 -21
  71. package/lib/module/components/pullToRefresh/PullToRefreshProvider.js.map +0 -1
  72. package/lib/module/components/pullToRefresh/RefreshControl.js +0 -73
  73. package/lib/module/components/pullToRefresh/RefreshControl.js.map +0 -1
  74. package/lib/module/components/pullToRefresh/usePullToRefreshContext.js +0 -13
  75. package/lib/module/components/pullToRefresh/usePullToRefreshContext.js.map +0 -1
  76. package/lib/module/components/pullToRefresh/utils.js +0 -42
  77. package/lib/module/components/pullToRefresh/utils.js.map +0 -1
  78. package/lib/typescript/components/header/AnimatedTopView.d.ts +0 -6
  79. package/lib/typescript/components/pullToRefresh/PullToRefreshContainer.d.ts +0 -8
  80. package/lib/typescript/components/pullToRefresh/PullToRefreshProvider.d.ts +0 -6
  81. package/lib/typescript/components/pullToRefresh/RefreshControl.d.ts +0 -9
  82. package/lib/typescript/components/pullToRefresh/usePullToRefreshContext.d.ts +0 -4
  83. package/lib/typescript/components/pullToRefresh/utils.d.ts +0 -20
  84. package/src/components/header/AnimatedTopView.tsx +0 -18
  85. package/src/components/pullToRefresh/PullToRefreshContainer.tsx +0 -66
  86. package/src/components/pullToRefresh/PullToRefreshProvider.tsx +0 -27
  87. package/src/components/pullToRefresh/RefreshControl.tsx +0 -100
  88. package/src/components/pullToRefresh/usePullToRefreshContext.ts +0 -13
  89. package/src/components/pullToRefresh/utils.ts +0 -49
@@ -1 +1 @@
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","animated","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 (animated = true) => {\n scrollTo(\n Math.min(fixedHeaderHeight.value || 0, firstStickyViewY.value || 0),\n animated\n );\n },\n [scrollTo]\n );\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"]}
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","animated","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 '../../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 (animated = true) => {\n scrollTo(\n Math.min(fixedHeaderHeight.value || 0, firstStickyViewY.value || 0),\n animated\n );\n },\n [scrollTo]\n );\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"]}
@@ -5,7 +5,6 @@ export { default as CollapsibleFlatList } from './components/scrollable/Collapsi
5
5
  export { default as CollapsibleScrollView } from './components/scrollable/CollapsibleScrollView';
6
6
  export { default as CollapsibleHeaderContainer } from './components/header/CollapsibleHeaderContainer';
7
7
  export { default as StickyView } from './components/header/StickyView';
8
- export { default as RefreshControl } from './components/pullToRefresh/RefreshControl';
9
8
  export { default as CollapsibleView } from './components/CollapsibleView';
10
9
  export * from './components/CollapsibleView';
11
10
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["index.tsx"],"names":["default","withCollapsibleContext","useCollapsibleContext","CollapsibleContainer","CollapsibleFlatList","CollapsibleScrollView","CollapsibleHeaderContainer","StickyView","RefreshControl","CollapsibleView"],"mappings":"AAAA,SAASA,OAAO,IAAIC,sBAApB,QAAkD,0BAAlD;AACA,SAASD,OAAO,IAAIE,qBAApB,QAAiD,+BAAjD;AAEA,SAASF,OAAO,IAAIG,oBAApB,QAAgD,mCAAhD;AACA,SAASH,OAAO,IAAII,mBAApB,QAA+C,6CAA/C;AACA,SAASJ,OAAO,IAAIK,qBAApB,QAAiD,+CAAjD;AACA,SAASL,OAAO,IAAIM,0BAApB,QAAsD,gDAAtD;AACA,SAASN,OAAO,IAAIO,UAApB,QAAsC,gCAAtC;AACA,SAASP,OAAO,IAAIQ,cAApB,QAA0C,2CAA1C;AACA,SAASR,OAAO,IAAIS,eAApB,QAA2C,8BAA3C;AACA,cAAc,8BAAd","sourcesContent":["export { default as withCollapsibleContext } from './withCollapsibleContext';\nexport { default as useCollapsibleContext } from './hooks/useCollapsibleContext';\n\nexport { default as CollapsibleContainer } from './components/CollapsibleContainer';\nexport { default as CollapsibleFlatList } from './components/scrollable/CollapsibleFlatList';\nexport { default as CollapsibleScrollView } from './components/scrollable/CollapsibleScrollView';\nexport { default as CollapsibleHeaderContainer } from './components/header/CollapsibleHeaderContainer';\nexport { default as StickyView } from './components/header/StickyView';\nexport { default as RefreshControl } from './components/pullToRefresh/RefreshControl';\nexport { default as CollapsibleView } from './components/CollapsibleView';\nexport * from './components/CollapsibleView';\n"]}
1
+ {"version":3,"sources":["index.tsx"],"names":["default","withCollapsibleContext","useCollapsibleContext","CollapsibleContainer","CollapsibleFlatList","CollapsibleScrollView","CollapsibleHeaderContainer","StickyView","CollapsibleView"],"mappings":"AAAA,SAASA,OAAO,IAAIC,sBAApB,QAAkD,0BAAlD;AACA,SAASD,OAAO,IAAIE,qBAApB,QAAiD,+BAAjD;AAEA,SAASF,OAAO,IAAIG,oBAApB,QAAgD,mCAAhD;AACA,SAASH,OAAO,IAAII,mBAApB,QAA+C,6CAA/C;AACA,SAASJ,OAAO,IAAIK,qBAApB,QAAiD,+CAAjD;AACA,SAASL,OAAO,IAAIM,0BAApB,QAAsD,gDAAtD;AACA,SAASN,OAAO,IAAIO,UAApB,QAAsC,gCAAtC;AACA,SAASP,OAAO,IAAIQ,eAApB,QAA2C,8BAA3C;AACA,cAAc,8BAAd","sourcesContent":["export { default as withCollapsibleContext } from './withCollapsibleContext';\nexport { default as useCollapsibleContext } from './hooks/useCollapsibleContext';\n\nexport { default as CollapsibleContainer } from './components/CollapsibleContainer';\nexport { default as CollapsibleFlatList } from './components/scrollable/CollapsibleFlatList';\nexport { default as CollapsibleScrollView } from './components/scrollable/CollapsibleScrollView';\nexport { default as CollapsibleHeaderContainer } from './components/header/CollapsibleHeaderContainer';\nexport { default as StickyView } from './components/header/StickyView';\nexport { default as CollapsibleView } from './components/CollapsibleView';\nexport * from './components/CollapsibleView';\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":"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;AACA,OAAOC,yBAAP,MAAsC,+CAAtC;AAEA,eAAe,SAASC,sBAAT,CAAmCC,SAAnC,EAAqD;AAClE,SAAQC,KAAD,IAAc;AACnB,UAAMC,mBAAmB,GAAGb,MAAM,EAAlC;AACA,UAAMc,YAAY,GAAGT,cAAc,CAAC,CAAD,CAAnC;AACA,UAAMU,OAAO,GAAGV,cAAc,CAAC,CAAD,CAA9B;AACA,UAAMW,cAAc,GAAGhB,MAAM,CAAwC,EAAxC,CAA7B;AACA,UAAMiB,cAAc,GAAGZ,cAAc,CAAyB,EAAzB,CAArC;AACA,UAAMa,sBAAsB,GAAGlB,MAAM,CAA+B,EAA/B,CAArC;AACA,UAAMmB,mBAAmB,GAAGd,cAAc,CACxC,EADwC,CAA1C;AAGA,UAAMe,iBAAiB,GAAGf,cAAc,CAAC,CAAD,CAAxC;AACA,UAAMgB,kBAAkB,GAAGhB,cAAc,CAAC,CAAD,CAAzC;AACA,UAAMiB,eAAe,GAAGjB,cAAc,CAAC,CAAD,CAAtC;AACA,UAAMkB,gBAAgB,GAAGlB,cAAc,CAAC,OAAD,CAAvC;AACA,UAAMmB,YAAY,GAAGxB,MAAM,CAAO,IAAP,CAA3B;AACA,UAAMyB,aAAa,GAAGzB,MAAM,CAAO,IAAP,CAA5B;AAEA,UAAM0B,sBAAsB,GAAG5B,WAAW,CAAE6B,QAAD,IAAc;AACvDd,MAAAA,mBAAmB,CAACe,OAApB,GAA8BD,QAA9B;AACD,KAFyC,EAEvC,EAFuC,CAA1C;AAIA,UAAME,eAAe,GAAGzB,eAAe,CAAC,MAAM;AAC5C,YAAM0B,IAAI,GAAGV,iBAAiB,CAACW,KAAlB,GAA0BR,gBAAgB,CAACQ,KAAxD;AACA,aAAOhB,OAAO,CAACgB,KAAR,IAAiBD,IAAxB;AACD,KAHsC,EAGpC,EAHoC,CAAvC;AAKA,UAAME,gBAAgB,GAAG5B,eAAe,CAAC,MAAM;AAC7C,aACEkB,eAAe,CAACS,KAAhB,GACAX,iBAAiB,CAACW,KADlB,GAEAV,kBAAkB,CAACU,KAHrB;AAKD,KANuC,EAMrC,EANqC,CAAxC;AAQA5B,IAAAA,mBAAmB,CACjB,MAAM;AACJ,YAAM8B,WAAW,GAAGC,MAAM,CAACC,IAAP,CAAYhB,mBAAmB,CAACY,KAAhC,EAAuCK,MAAvC,CAClB,CAACC,GAAD,EAAMC,IAAN,KAAe;AACb,eAAOD,GAAG,GAAGlB,mBAAmB,CAACY,KAApB,CAA0BO,IAA1B,EAAgCC,GAA7C;AACD,OAHiB,EAIlB,CAJkB,CAApB;AAMA,aAAON,WAAW,GAAGb,iBAAiB,CAACW,KAAvC;AACD,KATgB,EAUjB,CAACS,MAAD,EAASC,QAAT,KAAsB;AACpB,UAAID,MAAM,KAAKC,QAAf,EAAyB;AAAA;;AACvB,cAAMC,aAAa,GAAGvB,mBAAmB,CAACY,KAA1C;AACA,cAAMjB,YAAY,GAAGM,iBAAiB,CAACW,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;;AACDlC,QAAAA,cAAc,CAACc,KAAf,GAAuBiB,MAAvB;AACAzB,QAAAA,gBAAgB,CAACQ,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,GAAWzB,YAAlC;;AACA,cAAIyC,cAAJ,EAAoB;AAClB,mBAAOlB,GAAG,GAAGiB,IAAI,CAACH,MAAlB;AACD;;AACD,iBAAOd,GAAP;AACD,SAPoB,EAOlB,CAPkB,CAArB;AAQAhB,QAAAA,kBAAkB,CAACU,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;AACtDZ,QAAAA,cAAc,CAACY,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;AAC5BjC,UAAAA,sBAAsB,CAACU,OAAvB,GAAiC,EAC/B,GAAGV,sBAAsB,CAACU,OADK;AAE/B,aAAC6B,OAAD,GAAW;AAAEG,cAAAA,IAAF;AAAQrB,cAAAA,GAAR;AAAasB,cAAAA,KAAb;AAAoBV,cAAAA;AAApB;AAFoB,WAAjC;AAIAhC,UAAAA,mBAAmB,CAACY,KAApB,GAA4Bb,sBAAsB,CAACU,OAAnD;AACD,SATH,EAUE,MAAM,CAAE,CAVV;AAYD,OAdD,MAcO;AACL,eAAOZ,cAAc,CAACY,OAAf,CAAuB6B,OAAvB,CAAP;AACA,eAAOvC,sBAAsB,CAACU,OAAvB,CAA+B6B,OAA/B,CAAP;AACAtC,QAAAA,mBAAmB,CAACY,KAApB,GAA4Bb,sBAAsB,CAACU,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,CAAYnB,cAAc,CAACY,OAA3B,EAAoCmC,OAApC,CAA6CV,GAAD,IAAS;AACnD,gBAAMK,OAAO,GAAG1C,cAAc,CAACY,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,CAAEqD,MAAD,IAAoB;AAClErC,MAAAA,YAAY,CAACiB,KAAb,GAAqBzB,UAAU,CAAC6C,MAAD,EAAS;AACtCc,QAAAA,QAAQ,EAAE7C,iBAAiB,CAACW,KAAlB,KAA4B,CAA5B,GAAgC,CAAhC,GAAoC;AADR,OAAT,CAA/B;AAGAX,MAAAA,iBAAiB,CAACW,KAAlB,GAA0BoB,MAA1B,CAJkE,CAKlE;;AACAW,MAAAA,8BAA8B;AAC/B,KAP8C,EAO5C,EAP4C,CAA/C;AASA,UAAMI,qBAAqB,GAAGpE,WAAW,CAAEqD,MAAD,IAAoB;AAC5D7B,MAAAA,eAAe,CAACS,KAAhB,GAAwBoB,MAAxB;AACD,KAFwC,EAEtC,EAFsC,CAAzC;AAIA,UAAMgB,OAAO,GAAGpE,OAAO,CAAC,MAAM;AAC5B,aAAO;AACLqE,QAAAA,QAAQ,EAAGC,QAAD;AAAA;;AAAA,0CACRxD,mBAAmB,CAACe,OADZ,0DACR,sBAA6BwC,QAA7B,CAAsCC,QAAtC,CADQ;AAAA,SADL;AAGLC,QAAAA,MAAM,EAAE;AAAA;;AAAA,2CAAMzD,mBAAmB,CAACe,OAA1B,2DAAM,uBAA6B0C,MAA7B,EAAN;AAAA,SAHH;AAILC,QAAAA,QAAQ,EAAE,CAACC,MAAD,EAAiBC,OAAjB;AAAA;;AAAA,2CACR5D,mBAAmB,CAACe,OADZ,2DACR,uBAA6B2C,QAA7B,CAAsCC,MAAtC,EAA8CC,OAA9C,CADQ;AAAA,SAJL;AAMLC,QAAAA,aAAa,EAAGC,MAAD;AAAA;;AAAA,2CACb9D,mBAAmB,CAACe,OADP,2DACb,uBAA6B8C,aAA7B,CAA2CC,MAA3C,CADa;AAAA,SANV;AAQL7D,QAAAA,YARK;AASLC,QAAAA,OATK;AAULc,QAAAA;AAVK,OAAP;AAYD,KAbsB,EAapB,CAACd,OAAD,EAAUD,YAAV,EAAwBe,eAAxB,CAboB,CAAvB;AAeA,UAAM+C,eAAe,GAAG7E,OAAO,CAC7B,OAAO;AACL0B,MAAAA,aADK;AAELD,MAAAA,YAFK;AAGLgC,MAAAA,sBAHK;AAILQ,MAAAA,2BAJK;AAKLtC,MAAAA,sBALK;AAMLwC,MAAAA,qBANK;AAOL3C,MAAAA,gBAPK;AAQLN,MAAAA,cARK;AASLE,MAAAA,mBATK;AAULC,MAAAA,iBAVK;AAWLY,MAAAA;AAXK,KAAP,CAD6B,EAc7B,CACEN,sBADF,EAEE8B,sBAFF,EAGEQ,2BAHF,EAIEE,qBAJF,EAKE3C,gBALF,EAMEN,cANF,EAOEE,mBAPF,EAQEC,iBARF,EASEY,gBATF,CAd6B,CAA/B;AA2BA,wBACE,oBAAC,kBAAD,CAAoB,QAApB;AAA6B,MAAA,KAAK,EAAEmC;AAApC,oBACE,oBAAC,0BAAD,CAA4B,QAA5B;AAAqC,MAAA,KAAK,EAAES;AAA5C,oBACE,oBAAC,yBAAD,qBACE,oBAAC,qBAAD,qBAEE,oBAAC,SAAD,EAAehE,KAAf,CAFF,CADF,CADF,CADF,CADF;AAYD,GAjLD;AAkLD","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"]}
@@ -14,8 +14,9 @@ declare type Props = {
14
14
  collapsedBackgroundColor?: string;
15
15
  expandedBackgroundColor?: string;
16
16
  useDynamicLayout?: boolean;
17
+ onToggle?: (isExpand: boolean) => void;
17
18
  };
18
- export default function CollapsibleView({ initialState, collapseState, renderHeader, children, containerStyle, collapsedBackgroundColor, expandedBackgroundColor, }: Props): JSX.Element;
19
+ export default function CollapsibleView({ initialState, collapseState, renderHeader, children, containerStyle, collapsedBackgroundColor, expandedBackgroundColor, onToggle, }: Props): JSX.Element;
19
20
  export declare function CollapsibleHeaderText({ title, collapsed, onToggle, style, titleStyle, icon, iconInitialAngle, children, }: {
20
21
  title: string | Element;
21
22
  style?: StyleProp<ViewStyle>;
@@ -1,8 +1,8 @@
1
+ import type { StyleProp, ViewStyle } from 'react-native';
1
2
  import { ReactNode } from 'react';
2
- import { StyleProp, ViewStyle } from 'react-native';
3
3
  declare type Props = {
4
4
  children: ReactNode;
5
5
  containerStyle?: StyleProp<ViewStyle>;
6
6
  };
7
- export default function CollapsibleHeaderContainer({ children }: Props): null;
7
+ export default function CollapsibleHeaderContainer({ children, containerStyle, }: Props): null;
8
8
  export {};
@@ -1,4 +1,4 @@
1
- import type { ScrollToIndexParams } from 'src/types';
1
+ import type { ScrollToIndexParams } from '../../types';
2
2
  declare type Props = {
3
3
  headerSnappable: boolean;
4
4
  scrollTo: (yValue: number, animated?: boolean) => void;
@@ -5,6 +5,5 @@ export { default as CollapsibleFlatList } from './components/scrollable/Collapsi
5
5
  export { default as CollapsibleScrollView } from './components/scrollable/CollapsibleScrollView';
6
6
  export { default as CollapsibleHeaderContainer } from './components/header/CollapsibleHeaderContainer';
7
7
  export { default as StickyView } from './components/header/StickyView';
8
- export { default as RefreshControl } from './components/pullToRefresh/RefreshControl';
9
8
  export { default as CollapsibleView } from './components/CollapsibleView';
10
9
  export * from './components/CollapsibleView';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@r0b0t3d/react-native-collapsible",
3
- "version": "1.3.3",
3
+ "version": "1.3.5-alpha.0",
4
4
  "description": "Fully customizable collapsible views",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
@@ -11,7 +11,6 @@ import {
11
11
  import useKeyboardShowEvent from '../hooks/useKeyboardShowEvent';
12
12
  import useInternalCollapsibleContext from '../hooks/useInternalCollapsibleContext';
13
13
  import useCollapsibleContext from '../hooks/useCollapsibleContext';
14
- import CollapsibleHeaderConsumer from './header/CollapsibleHeaderConsumer';
15
14
 
16
15
  type Props = Omit<ViewProps, 'ref' | 'onLayout'> & {
17
16
  children: Element;
@@ -76,7 +75,6 @@ export default function CollapsibleContainer({
76
75
  collapsable={false}
77
76
  >
78
77
  {children}
79
- <CollapsibleHeaderConsumer />
80
78
  </View>
81
79
  </KeyboardAvoidingView>
82
80
  );
@@ -17,6 +17,8 @@ import Animated, {
17
17
  withSpring,
18
18
  interpolateColor,
19
19
  interpolate,
20
+ useAnimatedReaction,
21
+ runOnJS,
20
22
  } from 'react-native-reanimated';
21
23
 
22
24
  export type CollapsibleHeaderProps = {
@@ -33,6 +35,7 @@ type Props = {
33
35
  collapsedBackgroundColor?: string;
34
36
  expandedBackgroundColor?: string;
35
37
  useDynamicLayout?: boolean;
38
+ onToggle?: (isExpand: boolean) => void;
36
39
  };
37
40
 
38
41
  let key = 0;
@@ -44,6 +47,7 @@ export default function CollapsibleView({
44
47
  containerStyle,
45
48
  collapsedBackgroundColor,
46
49
  expandedBackgroundColor,
50
+ onToggle,
47
51
  }: Props) {
48
52
  const actualHeight = useSharedValue(11110);
49
53
  const contentKey = useMemo(() => `collapsible-view-${key++}`, []);
@@ -56,7 +60,7 @@ export default function CollapsibleView({
56
60
  collapseState.value = newValue;
57
61
  }, [initialState]);
58
62
 
59
- const onToggle = useCallback(() => {
63
+ const handleToggle = useCallback(() => {
60
64
  collapseState.value = withSpring(collapseState.value === 0 ? 1 : 0, {
61
65
  overshootClamping: true,
62
66
  });
@@ -86,6 +90,18 @@ export default function CollapsibleView({
86
90
  [actualHeight, contentKey]
87
91
  );
88
92
 
93
+ useAnimatedReaction(
94
+ () => (collapseState.value === 0 ? 0 : collapseState.value === 1 ? 1 : 0),
95
+ (result, prev) => {
96
+ if (result === prev) {
97
+ return;
98
+ }
99
+ if (onToggle) {
100
+ runOnJS(onToggle)(result === 1);
101
+ }
102
+ }
103
+ );
104
+
89
105
  // @ts-ignore
90
106
  const containerAnimatedStyle = useAnimatedStyle(() => {
91
107
  if (collapsedBackgroundColor && expandedBackgroundColor) {
@@ -101,8 +117,8 @@ export default function CollapsibleView({
101
117
  }, []);
102
118
 
103
119
  const headerProps = useMemo(
104
- () => ({ onToggle, collapsed: collapseState }),
105
- [onToggle, collapseState]
120
+ () => ({ onToggle: handleToggle, collapsed: collapseState }),
121
+ [handleToggle, collapseState]
106
122
  );
107
123
 
108
124
  return (
@@ -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
+ [-1000, 0, -100000],
24
24
  Animated.Extrapolate.CLAMP
25
25
  ),
26
26
  []
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable react-hooks/exhaustive-deps */
2
- import React, { ReactNode, useEffect, useMemo } from 'react';
3
- import { View, StyleProp, ViewStyle } from 'react-native';
2
+ import type { StyleProp, ViewStyle } from 'react-native';
3
+ import React, { Fragment, ReactNode, useEffect, useMemo } from 'react';
4
4
  import useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';
5
5
 
6
6
  type Props = {
@@ -10,23 +10,16 @@ type Props = {
10
10
 
11
11
  let key = 0;
12
12
 
13
- export default function CollapsibleHeaderContainer({ children }: Props) {
13
+ export default function CollapsibleHeaderContainer({
14
+ children,
15
+ containerStyle,
16
+ }: Props) {
14
17
  const contentKey = useMemo(() => `collapsible-header-${key++}`, []);
15
18
  const { mount, unmount, update } = useCollapsibleHeaderContext();
16
19
 
17
- const internalStyle = useMemo(() => {
18
- return {
19
- zIndex: 100000 - key,
20
- };
21
- }, []);
22
-
23
20
  const content = useMemo(() => {
24
- return (
25
- <View key={contentKey} style={internalStyle} pointerEvents="box-none">
26
- {children}
27
- </View>
28
- );
29
- }, [children]);
21
+ return <Fragment key={contentKey}>{children}</Fragment>;
22
+ }, [children, containerStyle]);
30
23
 
31
24
  useEffect(() => {
32
25
  mount(contentKey, content);
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable react-hooks/exhaustive-deps */
2
2
  import React, { useCallback, useEffect, useMemo, useRef } from 'react';
3
- import { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
3
+ import { Platform, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
4
4
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
5
5
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
6
6
  import Animated, {
@@ -72,5 +72,6 @@ const styles = StyleSheet.create({
72
72
  container: {
73
73
  backgroundColor: 'white',
74
74
  zIndex: 10,
75
+ marginTop: Platform.OS === 'android' ? -1 : 0,
75
76
  },
76
77
  });
@@ -11,12 +11,10 @@ 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 CollapsibleHeaderConsumer from '../header/CollapsibleHeaderConsumer';
20
18
 
21
19
  const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
22
20
 
@@ -27,10 +25,15 @@ export default function CollapsibleFlatList<Data>({
27
25
  headerSnappable = true,
28
26
  ...props
29
27
  }: Props<Data>) {
30
- const { headerHeight, scrollY } = useCollapsibleContext();
31
- const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();
28
+ const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =
29
+ useInternalCollapsibleContext();
32
30
  const mounted = useRef(true);
33
31
  const contentHeight = useRef(0);
32
+ const [internalContentMinHeight, setInternalContentMinHeight] = useState(
33
+ contentMinHeight.value
34
+ );
35
+ const [internalProgressViewOffset, setInternalProgressViewOffset] =
36
+ useState(0);
34
37
 
35
38
  useEffect(() => {
36
39
  return () => {
@@ -49,21 +52,23 @@ export default function CollapsibleFlatList<Data>({
49
52
  scrollViewRef.current?.scrollToIndex(params);
50
53
  }, []);
51
54
 
52
- const handleInternalContentHeight = useCallback((value: number) => {
53
- if (mounted.current) {
54
- setInternalContentMinHeight(value);
55
- }
56
- }, []);
57
-
58
55
  const { scrollHandler } = useAnimatedScroll({
59
56
  headerSnappable,
60
57
  scrollTo,
61
58
  scrollToIndex,
62
59
  });
63
60
 
64
- const [internalContentMinHeight, setInternalContentMinHeight] = useState(
65
- contentMinHeight.value
66
- );
61
+ const handleInternalContentHeight = useCallback((value: number) => {
62
+ if (mounted.current) {
63
+ setInternalContentMinHeight(value);
64
+ }
65
+ }, []);
66
+
67
+ const handleInternalProgressViewOffset = useCallback((value: number) => {
68
+ if (mounted.current) {
69
+ setInternalProgressViewOffset(value);
70
+ }
71
+ }, []);
67
72
 
68
73
  useAnimatedReaction(
69
74
  () => {
@@ -72,15 +77,26 @@ export default function CollapsibleFlatList<Data>({
72
77
  (result, previous) => {
73
78
  if (result !== previous) {
74
79
  if (
75
- contentHeight.current < contentMinHeight.value &&
76
- internalContentMinHeight !== contentMinHeight.value
80
+ contentHeight.current < result &&
81
+ internalContentMinHeight !== result
77
82
  ) {
78
- runOnJS(handleInternalContentHeight)(contentMinHeight.value);
83
+ runOnJS(handleInternalContentHeight)(result);
79
84
  }
80
85
  }
81
86
  }
82
87
  );
83
88
 
89
+ useAnimatedReaction(
90
+ () => {
91
+ return fixedHeaderHeight.value;
92
+ },
93
+ (result, previous) => {
94
+ if (result !== previous) {
95
+ runOnJS(handleInternalProgressViewOffset)(result);
96
+ }
97
+ }
98
+ );
99
+
84
100
  const contentContainerStyle = useMemo(
85
101
  () => [
86
102
  styles.contentContainer,
@@ -96,31 +112,34 @@ export default function CollapsibleFlatList<Data>({
96
112
 
97
113
  const handleScrollToIndexFailed = useCallback(() => {}, []);
98
114
 
99
- const renderListHeader = () => (
100
- <View>
101
- <AnimatedTopView height={headerHeight} />
102
- {props.ListHeaderComponent}
103
- </View>
104
- );
115
+ function renderListHeader() {
116
+ return (
117
+ <View>
118
+ <CollapsibleHeaderConsumer />
119
+ {props.ListHeaderComponent}
120
+ </View>
121
+ );
122
+ }
105
123
 
106
124
  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
- />
123
- </PullToRefreshContainer>
125
+ <AnimatedFlatList
126
+ ref={scrollViewRef}
127
+ // bounces={false}
128
+ keyboardDismissMode="on-drag"
129
+ keyboardShouldPersistTaps="handled"
130
+ scrollEventThrottle={1}
131
+ onScrollToIndexFailed={handleScrollToIndexFailed}
132
+ {...props}
133
+ style={[styles.container, props.style]}
134
+ contentContainerStyle={contentContainerStyle}
135
+ onScroll={scrollHandler}
136
+ ListHeaderComponent={renderListHeader()}
137
+ onContentSizeChange={handleContentSizeChange}
138
+ //@ts-ignore
139
+ simultaneousHandlers={[]}
140
+ stickyHeaderIndices={[0]}
141
+ progressViewOffset={internalProgressViewOffset}
142
+ />
124
143
  );
125
144
  }
126
145
 
@@ -1,12 +1,11 @@
1
1
  /* eslint-disable react-hooks/exhaustive-deps */
2
- import AnimatedTopView from '../header/AnimatedTopView';
3
2
  import useAnimatedScroll from './useAnimatedScroll';
4
3
  import React, { ReactNode, useCallback, useMemo } from 'react';
5
4
  import { ScrollViewProps, StyleSheet } from 'react-native';
6
5
  import Animated, { useAnimatedStyle } from 'react-native-reanimated';
7
6
  import type { CollapsibleProps } from '../../types';
8
- import useCollapsibleContext from '../../hooks/useCollapsibleContext';
9
7
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
8
+ import CollapsibleHeaderConsumer from '../header/CollapsibleHeaderConsumer';
10
9
 
11
10
  type Props = ScrollViewProps &
12
11
  CollapsibleProps & {
@@ -19,7 +18,6 @@ export default function CollapsibleScrollView({
19
18
  ...props
20
19
  }: Props) {
21
20
  const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext();
22
- const { headerHeight } = useCollapsibleContext();
23
21
 
24
22
  const scrollTo = useCallback((yValue: number, animated = true) => {
25
23
  scrollViewRef.current?.scrollTo({ y: yValue, animated });
@@ -49,7 +47,6 @@ export default function CollapsibleScrollView({
49
47
  return (
50
48
  <Animated.ScrollView
51
49
  ref={scrollViewRef}
52
- bounces={false}
53
50
  {...props}
54
51
  style={[styles.container, props.style]}
55
52
  contentContainerStyle={contentContainerStyle}
@@ -57,11 +54,10 @@ export default function CollapsibleScrollView({
57
54
  keyboardDismissMode="on-drag"
58
55
  keyboardShouldPersistTaps="handled"
59
56
  scrollEventThrottle={1}
57
+ stickyHeaderIndices={[0]}
60
58
  >
61
- <Animated.View style={animatedStyle}>
62
- <AnimatedTopView height={headerHeight} />
63
- {children}
64
- </Animated.View>
59
+ <CollapsibleHeaderConsumer />
60
+ <Animated.View style={animatedStyle}>{children}</Animated.View>
65
61
  </Animated.ScrollView>
66
62
  );
67
63
  }
@@ -6,7 +6,7 @@ import {
6
6
  useAnimatedScrollHandler,
7
7
  useSharedValue,
8
8
  } from 'react-native-reanimated';
9
- import type { ScrollToIndexParams } from 'src/types';
9
+ import type { ScrollToIndexParams } from '../../types';
10
10
  import useCollapsibleContext from '../../hooks/useCollapsibleContext';
11
11
  import useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';
12
12
 
package/src/index.tsx CHANGED
@@ -6,6 +6,5 @@ export { default as CollapsibleFlatList } from './components/scrollable/Collapsi
6
6
  export { default as CollapsibleScrollView } from './components/scrollable/CollapsibleScrollView';
7
7
  export { default as CollapsibleHeaderContainer } from './components/header/CollapsibleHeaderContainer';
8
8
  export { default as StickyView } from './components/header/StickyView';
9
- export { default as RefreshControl } from './components/pullToRefresh/RefreshControl';
10
9
  export { default as CollapsibleView } from './components/CollapsibleView';
11
10
  export * from './components/CollapsibleView';
@@ -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>
@@ -1,29 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = AnimatedTopView;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
11
-
12
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
13
-
14
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
- function AnimatedTopView({
19
- height
20
- }) {
21
- const contentStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
22
- paddingTop: height.value,
23
- backgroundColor: 'white'
24
- }), []);
25
- return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
26
- style: contentStyle
27
- });
28
- }
29
- //# sourceMappingURL=AnimatedTopView.js.map
@@ -1 +0,0 @@
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"]}