@r0b0t3d/react-native-collapsible 1.3.5-alpha.0 → 1.3.5-beta.0

package/lib/commonjs/components/CollapsibleContainer.js

@@ -15,6 +15,8 @@ var _useInternalCollapsibleContext = _interopRequireDefault(require("../hooks/us
 
 var _useCollapsibleContext = _interopRequireDefault(require("../hooks/useCollapsibleContext"));
 
+var _CollapsibleHeaderConsumer = _interopRequireDefault(require("./header/CollapsibleHeaderConsumer"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 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); }
@@ -71,7 +73,7 @@ function CollapsibleContainer({
     style: [styles.container, props.style],
     onLayout: handleContainerLayout,
     collapsable: false
-  }), children));
+  }), children, /*#__PURE__*/_react.default.createElement(_CollapsibleHeaderConsumer.default, null)));
 }
 
 const styles = _reactNative.StyleSheet.create({

package/lib/commonjs/components/CollapsibleContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CollapsibleContainer.tsx"],"names":["CollapsibleContainer","children","keyboardAvoidingViewProps","textInputRefs","props","containerRef","handleContainerHeight","scrollY","scrollTo","containerHeight","some","ref","isFocusedFunc","current","isFocused","measureLayout","_left","top","_width","height","value","extraOffset","keyboardVerticalOffset","handleContainerLayout","layout","nativeEvent","styles","container","style","StyleSheet","create","flex","overflow"],"mappings":";;;;;;;AACA;;AACA;;AAQA;;AACA;;AACA;;;;;;;;;;AAQe,SAASA,oBAAT,CAA8B;AAC3CC,EAAAA,QAD2C;AAE3CC,EAAAA,yBAF2C;AAG3CC,EAAAA,aAAa,GAAG,EAH2B;AAI3C,KAAGC;AAJwC,CAA9B,EAKL;AACR,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MACJ,6CADF;AAEA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAwB,qCAA9B;AAEA,QAAMC,eAAe,GAAG,mBAAO,CAAP,CAAxB;AAEA,qCAAqB,MAAM;AACzBN,IAAAA,aAAa,CAACO,IAAd,CAAoBC,GAAD,IAAS;AAC1B,YAAMC,aAAa,GAAGD,GAAG,CAACE,OAAJ,CAAYC,SAAlC;AACA,YAAMA,SAAS,GACbF,aAAa,IAAI,OAAOA,aAAP,KAAyB,UAA1C,GACIA,aAAa,EADjB,GAEIA,aAHN;;AAIA,UAAIE,SAAJ,EAAe;AACbH,QAAAA,GAAG,CAACE,OAAJ,CAAYE,aAAZ,EACE;AACAV,QAAAA,YAAY,CAACQ,OAFf,EAGE,CAACG,KAAD,EAAgBC,GAAhB,EAA6BC,MAA7B,EAA6CC,MAA7C,KAAgE;AAC9D,cAAIF,GAAG,GAAGE,MAAN,GAAeZ,OAAO,CAACa,KAAvB,GAA+BX,eAAe,CAACI,OAAnD,EAA4D;AAAA;;AAC1D,kBAAMQ,WAAW,4BACfnB,yBADe,aACfA,yBADe,uBACfA,yBAAyB,CAAEoB,sBADZ,yEACsC,EADvD;AAEAd,YAAAA,QAAQ,CAACS,GAAG,GAAGE,MAAN,GAAeE,WAAf,GAA6BZ,eAAe,CAACI,OAA9C,CAAR;AACD;AACF,SATH,EAUE,MAAM,CAAE,CAVV;AAYD;;AACD,aAAOC,SAAP;AACD,KArBD;AAsBD,GAvBD;AAyBA,QAAMS,qBAAqB,GAAG,wBAAaC,MAAD,IAA+B;AACvE,UAAML,MAAM,GAAGK,MAAM,CAACC,WAAP,CAAmBD,MAAnB,CAA0BL,MAAzC;AACAV,IAAAA,eAAe,CAACI,OAAhB,GAA0BM,MAA1B;AACAb,IAAAA,qBAAqB,CAACa,MAAD,CAArB;AACD,GAJ6B,EAI3B,EAJ2B,CAA9B;AAMA,sBACE,6BAAC,iCAAD;AACE,IAAA,KAAK,EAAEO,MAAM,CAACC,SADhB;AAEE,IAAA,QAAQ,EAAC;AAFX,KAGMzB,yBAHN,gBAKE,6BAAC,iBAAD,eACME,KADN;AAEE,IAAA,GAAG,EAAEC,YAFP;AAGE,IAAA,KAAK,EAAE,CAACqB,MAAM,CAACC,SAAR,EAAmBvB,KAAK,CAACwB,KAAzB,CAHT;AAIE,IAAA,QAAQ,EAAEL,qBAJZ;AAKE,IAAA,WAAW,EAAE;AALf,MAOGtB,QAPH,CALF,CADF;AAiBD;;AAED,MAAMyB,MAAM,GAAGG,wBAAWC,MAAX,CAAkB;AAC/BH,EAAAA,SAAS,EAAE;AACTI,IAAAA,IAAI,EAAE,CADG;AAETC,IAAAA,QAAQ,EAAE;AAFD;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useCallback, useRef } from 'react';\nimport {\n  KeyboardAvoidingView,\n  KeyboardAvoidingViewProps,\n  LayoutChangeEvent,\n  StyleSheet,\n  View,\n  ViewProps,\n} from 'react-native';\nimport useKeyboardShowEvent from '../hooks/useKeyboardShowEvent';\nimport useInternalCollapsibleContext from '../hooks/useInternalCollapsibleContext';\nimport useCollapsibleContext from '../hooks/useCollapsibleContext';\n\ntype Props = Omit<ViewProps, 'ref' | 'onLayout'> & {\n  children: Element;\n  keyboardAvoidingViewProps?: KeyboardAvoidingViewProps;\n  textInputRefs?: any[];\n};\n\nexport default function CollapsibleContainer({\n  children,\n  keyboardAvoidingViewProps,\n  textInputRefs = [],\n  ...props\n}: Props) {\n  const { containerRef, handleContainerHeight } =\n    useInternalCollapsibleContext();\n  const { scrollY, scrollTo } = useCollapsibleContext();\n\n  const containerHeight = useRef(0);\n\n  useKeyboardShowEvent(() => {\n    textInputRefs.some((ref) => {\n      const isFocusedFunc = ref.current.isFocused;\n      const isFocused =\n        isFocusedFunc && typeof isFocusedFunc === 'function'\n          ? isFocusedFunc()\n          : isFocusedFunc;\n      if (isFocused) {\n        ref.current.measureLayout(\n          // @ts-ignore\n          containerRef.current,\n          (_left: number, top: number, _width: number, height: number) => {\n            if (top + height - scrollY.value > containerHeight.current) {\n              const extraOffset =\n                keyboardAvoidingViewProps?.keyboardVerticalOffset ?? 20;\n              scrollTo(top + height + extraOffset - containerHeight.current);\n            }\n          },\n          () => {}\n        );\n      }\n      return isFocused;\n    });\n  });\n\n  const handleContainerLayout = useCallback((layout: LayoutChangeEvent) => {\n    const height = layout.nativeEvent.layout.height;\n    containerHeight.current = height;\n    handleContainerHeight(height);\n  }, []);\n\n  return (\n    <KeyboardAvoidingView\n      style={styles.container}\n      behavior=\"padding\"\n      {...keyboardAvoidingViewProps}\n    >\n      <View\n        {...props}\n        ref={containerRef}\n        style={[styles.container, props.style]}\n        onLayout={handleContainerLayout}\n        collapsable={false}\n      >\n        {children}\n      </View>\n    </KeyboardAvoidingView>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    overflow: 'hidden',\n  },\n});\n"]}
+{"version":3,"sources":["CollapsibleContainer.tsx"],"names":["CollapsibleContainer","children","keyboardAvoidingViewProps","textInputRefs","props","containerRef","handleContainerHeight","scrollY","scrollTo","containerHeight","some","ref","isFocusedFunc","current","isFocused","measureLayout","_left","top","_width","height","value","extraOffset","keyboardVerticalOffset","handleContainerLayout","layout","nativeEvent","styles","container","style","StyleSheet","create","flex","overflow"],"mappings":";;;;;;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;;;;;;;;;AAQe,SAASA,oBAAT,CAA8B;AAC3CC,EAAAA,QAD2C;AAE3CC,EAAAA,yBAF2C;AAG3CC,EAAAA,aAAa,GAAG,EAH2B;AAI3C,KAAGC;AAJwC,CAA9B,EAKL;AACR,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MACJ,6CADF;AAEA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAwB,qCAA9B;AAEA,QAAMC,eAAe,GAAG,mBAAO,CAAP,CAAxB;AAEA,qCAAqB,MAAM;AACzBN,IAAAA,aAAa,CAACO,IAAd,CAAoBC,GAAD,IAAS;AAC1B,YAAMC,aAAa,GAAGD,GAAG,CAACE,OAAJ,CAAYC,SAAlC;AACA,YAAMA,SAAS,GACbF,aAAa,IAAI,OAAOA,aAAP,KAAyB,UAA1C,GACIA,aAAa,EADjB,GAEIA,aAHN;;AAIA,UAAIE,SAAJ,EAAe;AACbH,QAAAA,GAAG,CAACE,OAAJ,CAAYE,aAAZ,EACE;AACAV,QAAAA,YAAY,CAACQ,OAFf,EAGE,CAACG,KAAD,EAAgBC,GAAhB,EAA6BC,MAA7B,EAA6CC,MAA7C,KAAgE;AAC9D,cAAIF,GAAG,GAAGE,MAAN,GAAeZ,OAAO,CAACa,KAAvB,GAA+BX,eAAe,CAACI,OAAnD,EAA4D;AAAA;;AAC1D,kBAAMQ,WAAW,4BACfnB,yBADe,aACfA,yBADe,uBACfA,yBAAyB,CAAEoB,sBADZ,yEACsC,EADvD;AAEAd,YAAAA,QAAQ,CAACS,GAAG,GAAGE,MAAN,GAAeE,WAAf,GAA6BZ,eAAe,CAACI,OAA9C,CAAR;AACD;AACF,SATH,EAUE,MAAM,CAAE,CAVV;AAYD;;AACD,aAAOC,SAAP;AACD,KArBD;AAsBD,GAvBD;AAyBA,QAAMS,qBAAqB,GAAG,wBAAaC,MAAD,IAA+B;AACvE,UAAML,MAAM,GAAGK,MAAM,CAACC,WAAP,CAAmBD,MAAnB,CAA0BL,MAAzC;AACAV,IAAAA,eAAe,CAACI,OAAhB,GAA0BM,MAA1B;AACAb,IAAAA,qBAAqB,CAACa,MAAD,CAArB;AACD,GAJ6B,EAI3B,EAJ2B,CAA9B;AAMA,sBACE,6BAAC,iCAAD;AACE,IAAA,KAAK,EAAEO,MAAM,CAACC,SADhB;AAEE,IAAA,QAAQ,EAAC;AAFX,KAGMzB,yBAHN,gBAKE,6BAAC,iBAAD,eACME,KADN;AAEE,IAAA,GAAG,EAAEC,YAFP;AAGE,IAAA,KAAK,EAAE,CAACqB,MAAM,CAACC,SAAR,EAAmBvB,KAAK,CAACwB,KAAzB,CAHT;AAIE,IAAA,QAAQ,EAAEL,qBAJZ;AAKE,IAAA,WAAW,EAAE;AALf,MAOGtB,QAPH,eAQE,6BAAC,kCAAD,OARF,CALF,CADF;AAkBD;;AAED,MAAMyB,MAAM,GAAGG,wBAAWC,MAAX,CAAkB;AAC/BH,EAAAA,SAAS,EAAE;AACTI,IAAAA,IAAI,EAAE,CADG;AAETC,IAAAA,QAAQ,EAAE;AAFD;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useCallback, useRef } from 'react';\nimport {\n  KeyboardAvoidingView,\n  KeyboardAvoidingViewProps,\n  LayoutChangeEvent,\n  StyleSheet,\n  View,\n  ViewProps,\n} from 'react-native';\nimport useKeyboardShowEvent from '../hooks/useKeyboardShowEvent';\nimport useInternalCollapsibleContext from '../hooks/useInternalCollapsibleContext';\nimport useCollapsibleContext from '../hooks/useCollapsibleContext';\nimport CollapsibleHeaderConsumer from './header/CollapsibleHeaderConsumer';\n\ntype Props = Omit<ViewProps, 'ref' | 'onLayout'> & {\n  children: Element;\n  keyboardAvoidingViewProps?: KeyboardAvoidingViewProps;\n  textInputRefs?: any[];\n};\n\nexport default function CollapsibleContainer({\n  children,\n  keyboardAvoidingViewProps,\n  textInputRefs = [],\n  ...props\n}: Props) {\n  const { containerRef, handleContainerHeight } =\n    useInternalCollapsibleContext();\n  const { scrollY, scrollTo } = useCollapsibleContext();\n\n  const containerHeight = useRef(0);\n\n  useKeyboardShowEvent(() => {\n    textInputRefs.some((ref) => {\n      const isFocusedFunc = ref.current.isFocused;\n      const isFocused =\n        isFocusedFunc && typeof isFocusedFunc === 'function'\n          ? isFocusedFunc()\n          : isFocusedFunc;\n      if (isFocused) {\n        ref.current.measureLayout(\n          // @ts-ignore\n          containerRef.current,\n          (_left: number, top: number, _width: number, height: number) => {\n            if (top + height - scrollY.value > containerHeight.current) {\n              const extraOffset =\n                keyboardAvoidingViewProps?.keyboardVerticalOffset ?? 20;\n              scrollTo(top + height + extraOffset - containerHeight.current);\n            }\n          },\n          () => {}\n        );\n      }\n      return isFocused;\n    });\n  });\n\n  const handleContainerLayout = useCallback((layout: LayoutChangeEvent) => {\n    const height = layout.nativeEvent.layout.height;\n    containerHeight.current = height;\n    handleContainerHeight(height);\n  }, []);\n\n  return (\n    <KeyboardAvoidingView\n      style={styles.container}\n      behavior=\"padding\"\n      {...keyboardAvoidingViewProps}\n    >\n      <View\n        {...props}\n        ref={containerRef}\n        style={[styles.container, props.style]}\n        onLayout={handleContainerLayout}\n        collapsable={false}\n      >\n        {children}\n        <CollapsibleHeaderConsumer />\n      </View>\n    </KeyboardAvoidingView>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    overflow: 'hidden',\n  },\n});\n"]}

package/lib/commonjs/components/header/AnimatedTopView.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = AnimatedTopView;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+
+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); }
+
+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; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function AnimatedTopView({
+  height
+}) {
+  const contentStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
+    paddingTop: height.value
+  }), []);
+  return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
+    style: contentStyle
+  });
+}
+//# sourceMappingURL=AnimatedTopView.js.map

package/lib/commonjs/components/header/AnimatedTopView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["AnimatedTopView.tsx"],"names":["AnimatedTopView","height","contentStyle","paddingTop","value"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;AAMe,SAASA,eAAT,CAAyB;AAAEC,EAAAA;AAAF,CAAzB,EAA4C;AACzD,QAAMC,YAAY,GAAG,6CACnB,OAAO;AACLC,IAAAA,UAAU,EAAEF,MAAM,CAACG;AADd,GAAP,CADmB,EAInB,EAJmB,CAArB;AAOA,sBAAO,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEF;AAAtB,IAAP;AACD","sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\ntype Props = {\n  height: Animated.SharedValue<number>;\n};\n\nexport default function AnimatedTopView({ height }: Props) {\n  const contentStyle = useAnimatedStyle(\n    () => ({\n      paddingTop: height.value,\n    }),\n    []\n  );\n\n  return <Animated.View style={contentStyle} />;\n}\n"]}

package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js

@@ -35,7 +35,7 @@ function CollapsibleHeaderConsumer() {
     headerHeight
   } = (0, _useCollapsibleContext.default)();
   const headerTranslate = (0, _reactNativeReanimated.useDerivedValue)(() => (0, _reactNativeReanimated.interpolate)(scrollY.value, // FIXME: can improve by geting maxY value of header and sticky views
-  [-1000, 0, 100000], [-1000, 0, -100000], _reactNativeReanimated.default.Extrapolate.CLAMP), []);
+  [-1000, 0, 100000], [0, 0, -100000], _reactNativeReanimated.default.Extrapolate.CLAMP), []);
   const headerStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
     return {
       transform: [{
@@ -61,7 +61,6 @@ function CollapsibleHeaderConsumer() {
 
 const styles = _reactNative.StyleSheet.create({
   container: {
-    backgroundColor: 'white',
     zIndex: 10
   }
 });

package/lib/commonjs/components/header/CollapsibleHeaderConsumer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Animated","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","StyleSheet","create","backgroundColor","zIndex"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAEe,SAASA,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAc,2CAApB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAkC,6CAAxC;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4B,qCAAlC;AAEA,QAAMC,eAAe,GAAG,4CACtB,MACE,wCACEF,OAAO,CAACG,KADV,EAEE;AACA,GAAC,CAAC,IAAF,EAAQ,CAAR,EAAW,MAAX,CAHF,EAIE,CAAC,CAAC,IAAF,EAAQ,CAAR,EAAW,CAAC,MAAZ,CAJF,EAKEC,+BAASC,WAAT,CAAqBC,KALvB,CAFoB,EAStB,EATsB,CAAxB;AAYA,QAAMC,WAAW,GAAG,6CAAiB,MAAM;AACzC,WAAO;AACLC,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEP,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmB,EAIjB,CAACF,YAAD,EAAeC,eAAf,CAJiB,CAApB;AAMA,QAAMQ,kBAAkB,GAAG,wBACzB,CAAC;AACCC,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBd,IAAAA,2BAA2B,CAACc,MAAD,CAA3B;AACD,GAPwB,EAQzB,CAACd,2BAAD,CARyB,CAA3B;AAWA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEW,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGT,OAAO,CAACkB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;;AAED,MAAMJ,MAAM,GAAGK,wBAAWC,MAAX,CAAkB;AAC/BL,EAAAA,SAAS,EAAE;AACTM,IAAAA,eAAe,EAAE,OADR;AAETC,IAAAA,MAAM,EAAE;AAFC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n  interpolate,\n  useAnimatedStyle,\n  useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n  const { headers } = useCollapsibleHeaderContext();\n  const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n  const { scrollY, headerHeight } = useCollapsibleContext();\n\n  const headerTranslate = useDerivedValue(\n    () =>\n      interpolate(\n        scrollY.value,\n        // FIXME: can improve by geting maxY value of header and sticky views\n        [-1000, 0, 100000],\n        [-1000, 0, -100000],\n        Animated.Extrapolate.CLAMP\n      ),\n    []\n  );\n\n  const headerStyle = useAnimatedStyle(() => {\n    return {\n      transform: [{ translateY: headerTranslate.value }],\n    };\n  }, [headerHeight, headerTranslate]);\n\n  const handleHeaderLayout = useCallback(\n    ({\n      nativeEvent: {\n        layout: { height },\n      },\n    }: LayoutChangeEvent) => {\n      handleHeaderContainerLayout(height);\n    },\n    [handleHeaderContainerLayout]\n  );\n\n  return (\n    <Animated.View\n      onLayout={handleHeaderLayout}\n      style={[styles.container, headerStyle]}\n      pointerEvents=\"box-none\"\n    >\n      {headers.map((item) => item.children)}\n    </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    backgroundColor: 'white',\n    zIndex: 10,\n  },\n});\n"]}
+{"version":3,"sources":["CollapsibleHeaderConsumer.tsx"],"names":["CollapsibleHeaderConsumer","headers","handleHeaderContainerLayout","scrollY","headerHeight","headerTranslate","value","Animated","Extrapolate","CLAMP","headerStyle","transform","translateY","handleHeaderLayout","nativeEvent","layout","height","styles","container","map","item","children","StyleSheet","create","zIndex"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAEe,SAASA,yBAAT,GAAqC;AAClD,QAAM;AAAEC,IAAAA;AAAF,MAAc,2CAApB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAkC,6CAAxC;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAA4B,qCAAlC;AAEA,QAAMC,eAAe,GAAG,4CACtB,MACE,wCACEF,OAAO,CAACG,KADV,EAEE;AACA,GAAC,CAAC,IAAF,EAAQ,CAAR,EAAW,MAAX,CAHF,EAIE,CAAC,CAAD,EAAI,CAAJ,EAAO,CAAC,MAAR,CAJF,EAKEC,+BAASC,WAAT,CAAqBC,KALvB,CAFoB,EAStB,EATsB,CAAxB;AAYA,QAAMC,WAAW,GAAG,6CAAiB,MAAM;AACzC,WAAO;AACLC,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAEP,eAAe,CAACC;AAA9B,OAAD;AADN,KAAP;AAGD,GAJmB,EAIjB,CAACF,YAAD,EAAeC,eAAf,CAJiB,CAApB;AAMA,QAAMQ,kBAAkB,GAAG,wBACzB,CAAC;AACCC,IAAAA,WAAW,EAAE;AACXC,MAAAA,MAAM,EAAE;AAAEC,QAAAA;AAAF;AADG;AADd,GAAD,KAIyB;AACvBd,IAAAA,2BAA2B,CAACc,MAAD,CAA3B;AACD,GAPwB,EAQzB,CAACd,2BAAD,CARyB,CAA3B;AAWA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEW,kBADZ;AAEE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBR,WAAnB,CAFT;AAGE,IAAA,aAAa,EAAC;AAHhB,KAKGT,OAAO,CAACkB,GAAR,CAAaC,IAAD,IAAUA,IAAI,CAACC,QAA3B,CALH,CADF;AASD;;AAED,MAAMJ,MAAM,GAAGK,wBAAWC,MAAX,CAAkB;AAC/BL,EAAAA,SAAS,EAAE;AACTM,IAAAA,MAAM,EAAE;AADC;AADoB,CAAlB,CAAf","sourcesContent":["import React, { useCallback } from 'react';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\nimport Animated, {\n  interpolate,\n  useAnimatedStyle,\n  useDerivedValue,\n} from 'react-native-reanimated';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\nimport { LayoutChangeEvent, StyleSheet } from 'react-native';\n\nexport default function CollapsibleHeaderConsumer() {\n  const { headers } = useCollapsibleHeaderContext();\n  const { handleHeaderContainerLayout } = useInternalCollapsibleContext();\n  const { scrollY, headerHeight } = useCollapsibleContext();\n\n  const headerTranslate = useDerivedValue(\n    () =>\n      interpolate(\n        scrollY.value,\n        // FIXME: can improve by geting maxY value of header and sticky views\n        [-1000, 0, 100000],\n        [0, 0, -100000],\n        Animated.Extrapolate.CLAMP\n      ),\n    []\n  );\n\n  const headerStyle = useAnimatedStyle(() => {\n    return {\n      transform: [{ translateY: headerTranslate.value }],\n    };\n  }, [headerHeight, headerTranslate]);\n\n  const handleHeaderLayout = useCallback(\n    ({\n      nativeEvent: {\n        layout: { height },\n      },\n    }: LayoutChangeEvent) => {\n      handleHeaderContainerLayout(height);\n    },\n    [handleHeaderContainerLayout]\n  );\n\n  return (\n    <Animated.View\n      onLayout={handleHeaderLayout}\n      style={[styles.container, headerStyle]}\n      pointerEvents=\"box-none\"\n    >\n      {headers.map((item) => item.children)}\n    </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    zIndex: 10,\n  },\n});\n"]}

package/lib/commonjs/components/header/CollapsibleHeaderContainer.js

@@ -7,6 +7,8 @@ exports.default = CollapsibleHeaderContainer;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactNative = require("react-native");
+
 var _useCollapsibleHeaderContext = _interopRequireDefault(require("../../hooks/useCollapsibleHeaderContext"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -28,9 +30,16 @@ function CollapsibleHeaderContainer({
     unmount,
     update
   } = (0, _useCollapsibleHeaderContext.default)();
+  const internalStyle = (0, _react.useMemo)(() => {
+    return {
+      zIndex: 100000 - key
+    };
+  }, []);
   const content = (0, _react.useMemo)(() => {
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-      key: contentKey
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+      key: contentKey,
+      style: [containerStyle, internalStyle],
+      pointerEvents: "box-none"
     }, children);
   }, [children, containerStyle]);
   (0, _react.useEffect)(() => {

package/lib/commonjs/components/header/CollapsibleHeaderContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CollapsibleHeaderContainer.tsx"],"names":["key","CollapsibleHeaderContainer","children","containerStyle","contentKey","mount","unmount","update","content"],"mappings":";;;;;;;AAEA;;AACA;;;;;;;;AAHA;AAUA,IAAIA,GAAG,GAAG,CAAV;;AAEe,SAASC,0BAAT,CAAoC;AACjDC,EAAAA,QADiD;AAEjDC,EAAAA;AAFiD,CAApC,EAGL;AACR,QAAMC,UAAU,GAAG,oBAAQ,MAAO,sBAAqBJ,GAAG,EAAG,EAA1C,EAA6C,EAA7C,CAAnB;AACA,QAAM;AAAEK,IAAAA,KAAF;AAASC,IAAAA,OAAT;AAAkBC,IAAAA;AAAlB,MAA6B,2CAAnC;AAEA,QAAMC,OAAO,GAAG,oBAAQ,MAAM;AAC5B,wBAAO,6BAAC,eAAD;AAAU,MAAA,GAAG,EAAEJ;AAAf,OAA4BF,QAA5B,CAAP;AACD,GAFe,EAEb,CAACA,QAAD,EAAWC,cAAX,CAFa,CAAhB;AAIA,wBAAU,MAAM;AACdE,IAAAA,KAAK,CAACD,UAAD,EAAaI,OAAb,CAAL;AAEA,WAAO,MAAM;AACXF,MAAAA,OAAO,CAACF,UAAD,CAAP;AACD,KAFD;AAGD,GAND,EAMG,CAACA,UAAD,CANH;AAQA,wBAAU,MAAM;AACdG,IAAAA,MAAM,CAACH,UAAD,EAAaI,OAAb,CAAN;AACD,GAFD,EAEG,CAACA,OAAD,CAFH;AAIA,SAAO,IAAP;AACD","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport React, { Fragment, ReactNode, useEffect, useMemo } from 'react';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\n\ntype Props = {\n  children: ReactNode;\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nlet key = 0;\n\nexport default function CollapsibleHeaderContainer({\n  children,\n  containerStyle,\n}: Props) {\n  const contentKey = useMemo(() => `collapsible-header-${key++}`, []);\n  const { mount, unmount, update } = useCollapsibleHeaderContext();\n\n  const content = useMemo(() => {\n    return <Fragment key={contentKey}>{children}</Fragment>;\n  }, [children, containerStyle]);\n\n  useEffect(() => {\n    mount(contentKey, content);\n\n    return () => {\n      unmount(contentKey);\n    };\n  }, [contentKey]);\n\n  useEffect(() => {\n    update(contentKey, content);\n  }, [content]);\n\n  return null;\n}\n"]}
+{"version":3,"sources":["CollapsibleHeaderContainer.tsx"],"names":["key","CollapsibleHeaderContainer","children","containerStyle","contentKey","mount","unmount","update","internalStyle","zIndex","content"],"mappings":";;;;;;;AACA;;AACA;;AACA;;;;;;;;AAHA;AAUA,IAAIA,GAAG,GAAG,CAAV;;AAEe,SAASC,0BAAT,CAAoC;AACjDC,EAAAA,QADiD;AAEjDC,EAAAA;AAFiD,CAApC,EAGL;AACR,QAAMC,UAAU,GAAG,oBAAQ,MAAO,sBAAqBJ,GAAG,EAAG,EAA1C,EAA6C,EAA7C,CAAnB;AACA,QAAM;AAAEK,IAAAA,KAAF;AAASC,IAAAA,OAAT;AAAkBC,IAAAA;AAAlB,MAA6B,2CAAnC;AAEA,QAAMC,aAAa,GAAG,oBAAQ,MAAM;AAClC,WAAO;AACLC,MAAAA,MAAM,EAAE,SAAST;AADZ,KAAP;AAGD,GAJqB,EAInB,EAJmB,CAAtB;AAMA,QAAMU,OAAO,GAAG,oBAAQ,MAAM;AAC5B,wBACE,6BAAC,iBAAD;AACE,MAAA,GAAG,EAAEN,UADP;AAEE,MAAA,KAAK,EAAE,CAACD,cAAD,EAAiBK,aAAjB,CAFT;AAGE,MAAA,aAAa,EAAC;AAHhB,OAKGN,QALH,CADF;AASD,GAVe,EAUb,CAACA,QAAD,EAAWC,cAAX,CAVa,CAAhB;AAYA,wBAAU,MAAM;AACdE,IAAAA,KAAK,CAACD,UAAD,EAAaM,OAAb,CAAL;AAEA,WAAO,MAAM;AACXJ,MAAAA,OAAO,CAACF,UAAD,CAAP;AACD,KAFD;AAGD,GAND,EAMG,CAACA,UAAD,CANH;AAQA,wBAAU,MAAM;AACdG,IAAAA,MAAM,CAACH,UAAD,EAAaM,OAAb,CAAN;AACD,GAFD,EAEG,CAACA,OAAD,CAFH;AAIA,SAAO,IAAP;AACD","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { ReactNode, useEffect, useMemo } from 'react';\nimport { View, StyleProp, ViewStyle } from 'react-native';\nimport useCollapsibleHeaderContext from '../../hooks/useCollapsibleHeaderContext';\n\ntype Props = {\n  children: ReactNode;\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nlet key = 0;\n\nexport default function CollapsibleHeaderContainer({\n  children,\n  containerStyle,\n}: Props) {\n  const contentKey = useMemo(() => `collapsible-header-${key++}`, []);\n  const { mount, unmount, update } = useCollapsibleHeaderContext();\n\n  const internalStyle = useMemo(() => {\n    return {\n      zIndex: 100000 - key,\n    };\n  }, []);\n\n  const content = useMemo(() => {\n    return (\n      <View\n        key={contentKey}\n        style={[containerStyle, internalStyle]}\n        pointerEvents=\"box-none\"\n      >\n        {children}\n      </View>\n    );\n  }, [children, containerStyle]);\n\n  useEffect(() => {\n    mount(contentKey, content);\n\n    return () => {\n      unmount(contentKey);\n    };\n  }, [contentKey]);\n\n  useEffect(() => {\n    update(contentKey, content);\n  }, [content]);\n\n  return null;\n}\n"]}

package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PullToRefreshContainer;
+
+var _reactNativeGestureHandler = require("react-native-gesture-handler");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+
+var _usePullToRefreshContext = _interopRequireDefault(require("./usePullToRefreshContext"));
+
+var _reactNative = require("react-native");
+
+var _utils = require("./utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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); }
+
+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; }
+
+function PullToRefreshContainer({
+  children,
+  scrollY
+}) {
+  const scrollRef = (0, _react.useRef)();
+  const panRef = (0, _react.useRef)();
+  const {
+    refreshValue,
+    internalRefreshing,
+    internalHeight
+  } = (0, _usePullToRefreshContext.default)();
+  const gestureHandler = (0, _reactNativeReanimated.useAnimatedGestureHandler)({
+    onStart: (_, ctx) => {
+      ctx.startY = (internalRefreshing.value ? refreshValue.value : 0) - scrollY.value;
+    },
+    onActive: (event, ctx) => {
+      if (scrollY.value <= 1) {
+        const tranY = event.translationY + ctx.startY;
+        const clampedValue = (0, _utils.rubberClamp)(tranY, 0, internalHeight.value);
+        refreshValue.value = clampedValue;
+
+        if (clampedValue > internalHeight.value) {
+          internalRefreshing.value = true;
+        }
+      } else if (!internalRefreshing.value) {
+        refreshValue.value = 0;
+      }
+    },
+    onEnd: () => {
+      if (refreshValue.value > 0) {
+        const value = internalRefreshing.value ? internalHeight.value : 0;
+        refreshValue.value = (0, _reactNativeReanimated.withTiming)(value);
+      }
+    }
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.PanGestureHandler, {
+    ref: panRef,
+    simultaneousHandlers: scrollRef,
+    onGestureEvent: gestureHandler,
+    shouldCancelWhenOutside: false,
+    enableTrackpadTwoFingerGesture: true,
+    maxPointers: 1
+  }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
+    style: _reactNative.StyleSheet.absoluteFill
+  }, /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.NativeViewGestureHandler, {
+    ref: scrollRef,
+    simultaneousHandlers: panRef
+  }, children)));
+}
+//# sourceMappingURL=PullToRefreshContainer.js.map

package/lib/commonjs/components/pullToRefresh/PullToRefreshContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PullToRefreshContainer.tsx"],"names":["PullToRefreshContainer","children","scrollY","scrollRef","panRef","refreshValue","internalRefreshing","internalHeight","gestureHandler","onStart","_","ctx","startY","value","onActive","event","tranY","translationY","clampedValue","onEnd","StyleSheet","absoluteFill"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AAIA;;AACA;;AACA;;;;;;;;AAOe,SAASA,sBAAT,CAAgC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAhC,EAA8D;AAC3E,QAAMC,SAAS,GAAG,oBAAlB;AACA,QAAMC,MAAM,GAAG,oBAAf;AACA,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,kBAAhB;AAAoCC,IAAAA;AAApC,MACJ,uCADF;AAGA,QAAMC,cAAc,GAAG,sDAA0B;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,GAAG,wBAAYF,KAAZ,EAAmB,CAAnB,EAAsBT,cAAc,CAACM,KAArC,CAArB;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,GAAqB,uCAAWA,KAAX,CAArB;AACD;AACF;AAtB8C,GAA1B,CAAvB;AAyBA,sBACE,6BAAC,4CAAD;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,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEY,wBAAWC;AAAjC,kBACE,6BAAC,mDAAD;AAA0B,IAAA,GAAG,EAAElB,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"]}

package/lib/commonjs/components/pullToRefresh/PullToRefreshProvider.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PullToRefreshProvider;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNativeReanimated = require("react-native-reanimated");
+
+var _usePullToRefreshContext = require("./usePullToRefreshContext");
+
+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); }
+
+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; }
+
+function PullToRefreshProvider({
+  children
+}) {
+  const refreshValue = (0, _reactNativeReanimated.useSharedValue)(0);
+  const internalRefreshing = (0, _reactNativeReanimated.useSharedValue)(false);
+  const internalHeight = (0, _reactNativeReanimated.useSharedValue)(0);
+  const context = (0, _react.useMemo)(() => {
+    return {
+      refreshValue: refreshValue,
+      internalRefreshing,
+      internalHeight
+    };
+  }, [refreshValue, internalRefreshing, internalHeight]);
+  return /*#__PURE__*/_react.default.createElement(_usePullToRefreshContext.PullToRefreshContext.Provider, {
+    value: context
+  }, children);
+}
+//# sourceMappingURL=PullToRefreshProvider.js.map

package/lib/commonjs/components/pullToRefresh/PullToRefreshProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PullToRefreshProvider.tsx"],"names":["PullToRefreshProvider","children","refreshValue","internalRefreshing","internalHeight","context"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;AAMe,SAASA,qBAAT,CAA+B;AAAEC,EAAAA;AAAF,CAA/B,EAAoD;AACjE,QAAMC,YAAY,GAAG,2CAAe,CAAf,CAArB;AACA,QAAMC,kBAAkB,GAAG,2CAAe,KAAf,CAA3B;AACA,QAAMC,cAAc,GAAG,2CAAe,CAAf,CAAvB;AAEA,QAAMC,OAAO,GAAG,oBAAQ,MAAM;AAC5B,WAAO;AACLH,MAAAA,YAAY,EAAEA,YADT;AAELC,MAAAA,kBAFK;AAGLC,MAAAA;AAHK,KAAP;AAKD,GANe,EAMb,CAACF,YAAD,EAAeC,kBAAf,EAAmCC,cAAnC,CANa,CAAhB;AAQA,sBACE,6BAAC,6CAAD,CAAsB,QAAtB;AAA+B,IAAA,KAAK,EAAEC;AAAtC,KACGJ,QADH,CADF;AAKD","sourcesContent":["import React, { useMemo } from 'react';\nimport { useSharedValue } from 'react-native-reanimated';\nimport { PullToRefreshContext } from './usePullToRefreshContext';\n\ntype Props = {\n  children: React.ReactNode;\n};\n\nexport default function PullToRefreshProvider({ children }: Props) {\n  const refreshValue = useSharedValue(0);\n  const internalRefreshing = useSharedValue(false);\n  const internalHeight = useSharedValue(0);\n\n  const context = useMemo(() => {\n    return {\n      refreshValue: refreshValue,\n      internalRefreshing,\n      internalHeight,\n    };\n  }, [refreshValue, internalRefreshing, internalHeight]);\n\n  return (\n    <PullToRefreshContext.Provider value={context}>\n      {children}\n    </PullToRefreshContext.Provider>\n  );\n}\n"]}

package/lib/commonjs/components/pullToRefresh/RefreshControl.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = RefreshControl;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+
+var _usePullToRefreshContext = _interopRequireDefault(require("./usePullToRefreshContext"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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); }
+
+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; }
+
+/* eslint-disable react-hooks/exhaustive-deps */
+function RefreshControl({
+  height = 100,
+  refreshing,
+  onRefresh,
+  renderAnimation
+}) {
+  const {
+    refreshValue,
+    internalRefreshing,
+    internalHeight
+  } = (0, _usePullToRefreshContext.default)();
+  const manualTriggered = (0, _react.useRef)(false);
+  (0, _react.useEffect)(() => {
+    internalHeight.value = height;
+  }, [height]);
+  (0, _react.useEffect)(() => {
+    if (!internalRefreshing.value && refreshing) {
+      manualTriggered.current = true;
+    }
+
+    internalRefreshing.value = refreshing;
+  }, [refreshing]);
+  (0, _reactNativeReanimated.useAnimatedReaction)(() => {
+    return internalRefreshing.value;
+  }, (result, prev) => {
+    if (result !== prev) {
+      if (result && refreshValue.value === 0) {
+        refreshValue.value = height;
+      }
+    }
+  });
+  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    return {
+      height: refreshValue.value
+    };
+  }, []);
+  const handleRefresh = (0, _react.useCallback)(() => {
+    if (manualTriggered.current) {
+      manualTriggered.current = false;
+      return;
+    }
+
+    onRefresh();
+  }, [onRefresh]);
+  (0, _reactNativeReanimated.useAnimatedReaction)(() => internalRefreshing.value, (result, prev) => {
+    if (result !== prev) {
+      if (result) {
+        (0, _reactNativeReanimated.runOnJS)(handleRefresh)();
+      } else {
+        refreshValue.value = (0, _reactNativeReanimated.withTiming)(0);
+      }
+    }
+  });
+  const animatedProps = (0, _reactNativeReanimated.useAnimatedProps)(() => {
+    return {
+      progress: internalRefreshing.value ? undefined : Math.min(refreshValue.value / height, 1)
+    };
+  }, [height]);
+  return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
+    style: [styles.container, animatedStyle]
+  }, renderAnimation(animatedProps));
+}
+
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    overflow: 'hidden'
+  }
+});
+//# sourceMappingURL=RefreshControl.js.map

package/lib/commonjs/components/pullToRefresh/RefreshControl.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["RefreshControl.tsx"],"names":["RefreshControl","height","refreshing","onRefresh","renderAnimation","refreshValue","internalRefreshing","internalHeight","manualTriggered","value","current","result","prev","animatedStyle","handleRefresh","animatedProps","progress","undefined","Math","min","styles","container","StyleSheet","create","overflow"],"mappings":";;;;;;;AACA;;AACA;;AACA;;AAOA;;;;;;;;AAVA;AAmBe,SAASA,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,MACJ,uCADF;AAEA,QAAMC,eAAe,GAAG,mBAAO,KAAP,CAAxB;AAEA,wBAAU,MAAM;AACdD,IAAAA,cAAc,CAACE,KAAf,GAAuBR,MAAvB;AACD,GAFD,EAEG,CAACA,MAAD,CAFH;AAIA,wBAAU,MAAM;AACd,QAAI,CAACK,kBAAkB,CAACG,KAApB,IAA6BP,UAAjC,EAA6C;AAC3CM,MAAAA,eAAe,CAACE,OAAhB,GAA0B,IAA1B;AACD;;AACDJ,IAAAA,kBAAkB,CAACG,KAAnB,GAA2BP,UAA3B;AACD,GALD,EAKG,CAACA,UAAD,CALH;AAOA,kDACE,MAAM;AACJ,WAAOI,kBAAkB,CAACG,KAA1B;AACD,GAHH,EAIE,CAACE,MAAD,EAASC,IAAT,KAAkB;AAChB,QAAID,MAAM,KAAKC,IAAf,EAAqB;AACnB,UAAID,MAAM,IAAIN,YAAY,CAACI,KAAb,KAAuB,CAArC,EAAwC;AACtCJ,QAAAA,YAAY,CAACI,KAAb,GAAqBR,MAArB;AACD;AACF;AACF,GAVH;AAaA,QAAMY,aAAa,GAAG,6CAAiB,MAAM;AAC3C,WAAO;AACLZ,MAAAA,MAAM,EAAEI,YAAY,CAACI;AADhB,KAAP;AAGD,GAJqB,EAInB,EAJmB,CAAtB;AAMA,QAAMK,aAAa,GAAG,wBAAY,MAAM;AACtC,QAAIN,eAAe,CAACE,OAApB,EAA6B;AAC3BF,MAAAA,eAAe,CAACE,OAAhB,GAA0B,KAA1B;AACA;AACD;;AACDP,IAAAA,SAAS;AACV,GANqB,EAMnB,CAACA,SAAD,CANmB,CAAtB;AAQA,kDACE,MAAMG,kBAAkB,CAACG,KAD3B,EAEE,CAACE,MAAD,EAASC,IAAT,KAAkB;AAChB,QAAID,MAAM,KAAKC,IAAf,EAAqB;AACnB,UAAID,MAAJ,EAAY;AACV,4CAAQG,aAAR;AACD,OAFD,MAEO;AACLT,QAAAA,YAAY,CAACI,KAAb,GAAqB,uCAAW,CAAX,CAArB;AACD;AACF;AACF,GAVH;AAaA,QAAMM,aAAa,GAAG,6CAAiB,MAAM;AAC3C,WAAO;AACLC,MAAAA,QAAQ,EAAEV,kBAAkB,CAACG,KAAnB,GACNQ,SADM,GAENC,IAAI,CAACC,GAAL,CAASd,YAAY,CAACI,KAAb,GAAqBR,MAA9B,EAAsC,CAAtC;AAHC,KAAP;AAKD,GANqB,EAMnB,CAACA,MAAD,CANmB,CAAtB;AAQA,sBACE,6BAAC,8BAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAACmB,MAAM,CAACC,SAAR,EAAmBR,aAAnB;AAAtB,KACGT,eAAe,CAACW,aAAD,CADlB,CADF;AAKD;;AAED,MAAMK,MAAM,GAAGE,wBAAWC,MAAX,CAAkB;AAC/BF,EAAAA,SAAS,EAAE;AACTG,IAAAA,QAAQ,EAAE;AADD;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useCallback, useEffect, useRef } 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  const manualTriggered = useRef(false);\n\n  useEffect(() => {\n    internalHeight.value = height;\n  }, [height]);\n\n  useEffect(() => {\n    if (!internalRefreshing.value && refreshing) {\n      manualTriggered.current = true;\n    }\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    if (manualTriggered.current) {\n      manualTriggered.current = false;\n      return;\n    }\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"]}

package/lib/commonjs/components/pullToRefresh/usePullToRefreshContext.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = usePullToRefreshContext;
+exports.PullToRefreshContext = void 0;
+
+var _react = require("react");
+
+// @ts-ignore
+const PullToRefreshContext = /*#__PURE__*/(0, _react.createContext)({});
+exports.PullToRefreshContext = PullToRefreshContext;
+
+function usePullToRefreshContext() {
+  const ctx = (0, _react.useContext)(PullToRefreshContext);
+
+  if (!ctx) {
+    throw new Error('Component should be wrapped with withCollapsibleContext');
+  }
+
+  return ctx;
+}
+//# sourceMappingURL=usePullToRefreshContext.js.map

package/lib/commonjs/components/pullToRefresh/usePullToRefreshContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePullToRefreshContext.ts"],"names":["PullToRefreshContext","usePullToRefreshContext","ctx","Error"],"mappings":";;;;;;;;AAAA;;AAGA;AACO,MAAMA,oBAAoB,gBAAG,0BAAwC,EAAxC,CAA7B;;;AAEQ,SAASC,uBAAT,GAAmC;AAChD,QAAMC,GAAG,GAAG,uBAAWF,oBAAX,CAAZ;;AACA,MAAI,CAACE,GAAL,EAAU;AACR,UAAM,IAAIC,KAAJ,CAAU,yDAAV,CAAN;AACD;;AACD,SAAOD,GAAP;AACD","sourcesContent":["import { createContext, useContext } from 'react';\nimport type { PullToRefreshContextType } from '../../types';\n\n// @ts-ignore\nexport const PullToRefreshContext = createContext<PullToRefreshContextType>({});\n\nexport default function usePullToRefreshContext() {\n  const ctx = useContext(PullToRefreshContext);\n  if (!ctx) {\n    throw new Error('Component should be wrapped with withCollapsibleContext');\n  }\n  return ctx;\n}\n"]}

package/lib/commonjs/components/pullToRefresh/utils.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.clamp = clamp;
+exports.rubberClamp = exports.rubberBandClamp = exports.springConfig = void 0;
+
+const springConfig = velocity => {
+  'worklet';
+
+  return {
+    stiffness: 1000,
+    damping: 500,
+    mass: 3,
+    overshootClamping: true,
+    restDisplacementThreshold: 0.01,
+    restSpeedThreshold: 0.01,
+    velocity
+  };
+};
+
+exports.springConfig = springConfig;
+
+function clamp(value, lowerbound, upperbound) {
+  'worklet';
+
+  return Math.min(Math.max(value, lowerbound), upperbound);
+}
+/**
+ * calculates rubber value
+ *
+ * @param x distance from the edge
+ * @param dim dimension, either width or height
+ * @param coeff constant value, UIScrollView uses 0.55
+ * @returns rubber = (1.0 – (1.0 / ((x * coeff / dim) + 1.0))) * dim
+ */
+
+
+const rubberBandClamp = (x, dim, coeff) => {
+  'worklet';
+
+  return (1.0 - 1.0 / (x * coeff / dim + 1.0)) * dim;
+};
+
+exports.rubberBandClamp = rubberBandClamp;
+
+const rubberClamp = (y, topBound, bottomBound, coeff = 0.55) => {
+  'worklet';
+
+  const clampedY = clamp(y, topBound, bottomBound);
+  const diff = Math.abs(y - clampedY);
+  const sign = clampedY > y ? -1 : 1;
+  const dimension = bottomBound - topBound;
+  return clampedY + sign * rubberBandClamp(diff, dimension, coeff);
+};
+
+exports.rubberClamp = rubberClamp;
+//# sourceMappingURL=utils.js.map

package/lib/commonjs/components/pullToRefresh/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["utils.ts"],"names":["springConfig","velocity","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","clamp","value","lowerbound","upperbound","Math","min","max","rubberBandClamp","x","dim","coeff","rubberClamp","y","topBound","bottomBound","clampedY","diff","abs","sign","dimension"],"mappings":";;;;;;;;AAAO,MAAMA,YAAY,GAAIC,QAAD,IAAsB;AAChD;;AAEA,SAAO;AACLC,IAAAA,SAAS,EAAE,IADN;AAELC,IAAAA,OAAO,EAAE,GAFJ;AAGLC,IAAAA,IAAI,EAAE,CAHD;AAILC,IAAAA,iBAAiB,EAAE,IAJd;AAKLC,IAAAA,yBAAyB,EAAE,IALtB;AAMLC,IAAAA,kBAAkB,EAAE,IANf;AAOLN,IAAAA;AAPK,GAAP;AASD,CAZM;;;;AAcA,SAASO,KAAT,CAAeC,KAAf,EAA8BC,UAA9B,EAAkDC,UAAlD,EAAsE;AAC3E;;AAEA,SAAOC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAASL,KAAT,EAAgBC,UAAhB,CAAT,EAAsCC,UAAtC,CAAP;AACD;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMI,eAAe,GAAG,CAACC,CAAD,EAAYC,GAAZ,EAAyBC,KAAzB,KAA2C;AACxE;;AAEA,SAAO,CAAC,MAAM,OAAQF,CAAC,GAAGE,KAAL,GAAcD,GAAd,GAAoB,GAA3B,CAAP,IAA0CA,GAAjD;AACD,CAJM;;;;AAMA,MAAME,WAAW,GAAG,CACzBC,CADyB,EAEzBC,QAFyB,EAGzBC,WAHyB,EAIzBJ,KAAK,GAAG,IAJiB,KAKtB;AACH;;AAEA,QAAMK,QAAQ,GAAGf,KAAK,CAACY,CAAD,EAAIC,QAAJ,EAAcC,WAAd,CAAtB;AACA,QAAME,IAAI,GAAGZ,IAAI,CAACa,GAAL,CAASL,CAAC,GAAGG,QAAb,CAAb;AACA,QAAMG,IAAI,GAAGH,QAAQ,GAAGH,CAAX,GAAe,CAAC,CAAhB,GAAoB,CAAjC;AACA,QAAMO,SAAS,GAAGL,WAAW,GAAGD,QAAhC;AAEA,SAAOE,QAAQ,GAAGG,IAAI,GAAGX,eAAe,CAACS,IAAD,EAAOG,SAAP,EAAkBT,KAAlB,CAAxC;AACD,CAdM","sourcesContent":["export const springConfig = (velocity: number) => {\n  'worklet';\n\n  return {\n    stiffness: 1000,\n    damping: 500,\n    mass: 3,\n    overshootClamping: true,\n    restDisplacementThreshold: 0.01,\n    restSpeedThreshold: 0.01,\n    velocity,\n  };\n};\n\nexport function clamp(value: number, lowerbound: number, upperbound: number) {\n  'worklet';\n\n  return Math.min(Math.max(value, lowerbound), upperbound);\n}\n\n/**\n * calculates rubber value\n *\n * @param x distance from the edge\n * @param dim dimension, either width or height\n * @param coeff constant value, UIScrollView uses 0.55\n * @returns rubber = (1.0 – (1.0 / ((x * coeff / dim) + 1.0))) * dim\n */\nexport const rubberBandClamp = (x: number, dim: number, coeff: number) => {\n  'worklet';\n\n  return (1.0 - 1.0 / ((x * coeff) / dim + 1.0)) * dim;\n};\n\nexport const rubberClamp = (\n  y: number,\n  topBound: number,\n  bottomBound: number,\n  coeff = 0.55\n) => {\n  'worklet';\n\n  const clampedY = clamp(y, topBound, bottomBound);\n  const diff = Math.abs(y - clampedY);\n  const sign = clampedY > y ? -1 : 1;\n  const dimension = bottomBound - topBound;\n\n  return clampedY + sign * rubberBandClamp(diff, dimension, coeff);\n};\n"]}

package/lib/commonjs/components/scrollable/CollapsibleFlatList.js

@@ -15,7 +15,9 @@ var _useAnimatedScroll = _interopRequireDefault(require("./useAnimatedScroll"));
 
 var _useInternalCollapsibleContext = _interopRequireDefault(require("../../hooks/useInternalCollapsibleContext"));
 
-var _CollapsibleHeaderConsumer = _interopRequireDefault(require("../header/CollapsibleHeaderConsumer"));
+var _AnimatedTopView = _interopRequireDefault(require("../header/AnimatedTopView"));
+
+var _useCollapsibleContext = _interopRequireDefault(require("../../hooks/useCollapsibleContext"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -31,6 +33,9 @@ function CollapsibleFlatList({
   headerSnappable = true,
   ...props
 }) {
+  const {
+    headerHeight
+  } = (0, _useCollapsibleContext.default)();
   const {
     contentMinHeight,
     scrollViewRef,
@@ -100,12 +105,13 @@ function CollapsibleFlatList({
   const handleScrollToIndexFailed = (0, _react.useCallback)(() => {}, []);
 
   function renderListHeader() {
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_CollapsibleHeaderConsumer.default, null), props.ListHeaderComponent);
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_AnimatedTopView.default, {
+      height: headerHeight
+    }), props.ListHeaderComponent);
   }
 
   return /*#__PURE__*/_react.default.createElement(AnimatedFlatList, _extends({
-    ref: scrollViewRef // bounces={false}
-    ,
+    ref: scrollViewRef,
     keyboardDismissMode: "on-drag",
     keyboardShouldPersistTaps: "handled",
     scrollEventThrottle: 1,
@@ -118,7 +124,6 @@ function CollapsibleFlatList({
     onContentSizeChange: handleContentSizeChange //@ts-ignore
     ,
     simultaneousHandlers: [],
-    stickyHeaderIndices: [0],
     progressViewOffset: internalProgressViewOffset
   }));
 }

package/lib/commonjs/components/scrollable/CollapsibleFlatList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","CollapsibleFlatList","headerSnappable","props","contentMinHeight","scrollViewRef","fixedHeaderHeight","mounted","contentHeight","internalContentMinHeight","setInternalContentMinHeight","value","internalProgressViewOffset","setInternalProgressViewOffset","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","scrollHandler","handleInternalContentHeight","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","StyleSheet","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n  runOnJS,\n  useAnimatedReaction,\n} from 'react-native-reanimated';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport CollapsibleHeaderConsumer from '../header/CollapsibleHeaderConsumer';\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 { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n    useInternalCollapsibleContext();\n  const mounted = useRef(true);\n  const contentHeight = useRef(0);\n  const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n    contentMinHeight.value\n  );\n  const [internalProgressViewOffset, setInternalProgressViewOffset] =\n    useState(0);\n\n  useEffect(() => {\n    return () => {\n      mounted.current = false;\n    };\n  }, []);\n\n  const scrollTo = useCallback((yValue: number, animated = true) => {\n    scrollViewRef.current?.scrollToOffset({\n      offset: yValue,\n      animated,\n    });\n  }, []);\n\n  const scrollToIndex = useCallback((params) => {\n    scrollViewRef.current?.scrollToIndex(params);\n  }, []);\n\n  const { scrollHandler } = useAnimatedScroll({\n    headerSnappable,\n    scrollTo,\n    scrollToIndex,\n  });\n\n  const handleInternalContentHeight = useCallback((value: number) => {\n    if (mounted.current) {\n      setInternalContentMinHeight(value);\n    }\n  }, []);\n\n  const handleInternalProgressViewOffset = useCallback((value: number) => {\n    if (mounted.current) {\n      setInternalProgressViewOffset(value);\n    }\n  }, []);\n\n  useAnimatedReaction(\n    () => {\n      return contentMinHeight.value;\n    },\n    (result, previous) => {\n      if (result !== previous) {\n        if (\n          contentHeight.current < result &&\n          internalContentMinHeight !== result\n        ) {\n          runOnJS(handleInternalContentHeight)(result);\n        }\n      }\n    }\n  );\n\n  useAnimatedReaction(\n    () => {\n      return fixedHeaderHeight.value;\n    },\n    (result, previous) => {\n      if (result !== previous) {\n        runOnJS(handleInternalProgressViewOffset)(result);\n      }\n    }\n  );\n\n  const contentContainerStyle = useMemo(\n    () => [\n      styles.contentContainer,\n      { minHeight: internalContentMinHeight },\n      props.contentContainerStyle,\n    ],\n    [props.contentContainerStyle, internalContentMinHeight]\n  );\n\n  const handleContentSizeChange = useCallback((_, height) => {\n    contentHeight.current = height;\n  }, []);\n\n  const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n  function renderListHeader() {\n    return (\n      <View>\n        <CollapsibleHeaderConsumer />\n        {props.ListHeaderComponent}\n      </View>\n    );\n  }\n\n  return (\n    <AnimatedFlatList\n      ref={scrollViewRef}\n      // bounces={false}\n      keyboardDismissMode=\"on-drag\"\n      keyboardShouldPersistTaps=\"handled\"\n      scrollEventThrottle={1}\n      onScrollToIndexFailed={handleScrollToIndexFailed}\n      {...props}\n      style={[styles.container, props.style]}\n      contentContainerStyle={contentContainerStyle}\n      onScroll={scrollHandler}\n      ListHeaderComponent={renderListHeader()}\n      onContentSizeChange={handleContentSizeChange}\n      //@ts-ignore\n      simultaneousHandlers={[]}\n      stickyHeaderIndices={[0]}\n      progressViewOffset={internalProgressViewOffset}\n    />\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    ...StyleSheet.absoluteFillObject,\n  },\n  contentContainer: {\n    flexGrow: 1,\n  },\n  topView: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n  },\n});\n"]}
+{"version":3,"sources":["CollapsibleFlatList.tsx"],"names":["AnimatedFlatList","Animated","createAnimatedComponent","FlatList","CollapsibleFlatList","headerSnappable","props","headerHeight","contentMinHeight","scrollViewRef","fixedHeaderHeight","mounted","contentHeight","internalContentMinHeight","setInternalContentMinHeight","value","internalProgressViewOffset","setInternalProgressViewOffset","current","scrollTo","yValue","animated","scrollToOffset","offset","scrollToIndex","params","scrollHandler","handleInternalContentHeight","handleInternalProgressViewOffset","result","previous","contentContainerStyle","styles","contentContainer","minHeight","handleContentSizeChange","_","height","handleScrollToIndexFailed","renderListHeader","ListHeaderComponent","container","style","StyleSheet","create","absoluteFillObject","flexGrow","topView","position","top","left","right"],"mappings":"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","sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FlatListProps, View, StyleSheet, FlatList } from 'react-native';\nimport Animated, {\n  runOnJS,\n  useAnimatedReaction,\n} from 'react-native-reanimated';\nimport useAnimatedScroll from './useAnimatedScroll';\nimport useInternalCollapsibleContext from '../../hooks/useInternalCollapsibleContext';\nimport type { CollapsibleProps } from '../../types';\nimport AnimatedTopView from '../header/AnimatedTopView';\nimport useCollapsibleContext from '../../hooks/useCollapsibleContext';\n\nconst AnimatedFlatList = Animated.createAnimatedComponent(FlatList);\n\ntype Props<Data> = Omit<FlatListProps<Data>, 'scrollEnabled'> &\n  CollapsibleProps;\n\nexport default function CollapsibleFlatList<Data>({\n  headerSnappable = true,\n  ...props\n}: Props<Data>) {\n  const { headerHeight } = useCollapsibleContext();\n  const { contentMinHeight, scrollViewRef, fixedHeaderHeight } =\n    useInternalCollapsibleContext();\n  const mounted = useRef(true);\n  const contentHeight = useRef(0);\n  const [internalContentMinHeight, setInternalContentMinHeight] = useState(\n    contentMinHeight.value\n  );\n  const [internalProgressViewOffset, setInternalProgressViewOffset] =\n    useState(0);\n\n  useEffect(() => {\n    return () => {\n      mounted.current = false;\n    };\n  }, []);\n\n  const scrollTo = useCallback((yValue: number, animated = true) => {\n    scrollViewRef.current?.scrollToOffset({\n      offset: yValue,\n      animated,\n    });\n  }, []);\n\n  const scrollToIndex = useCallback((params) => {\n    scrollViewRef.current?.scrollToIndex(params);\n  }, []);\n\n  const { scrollHandler } = useAnimatedScroll({\n    headerSnappable,\n    scrollTo,\n    scrollToIndex,\n  });\n\n  const handleInternalContentHeight = useCallback((value: number) => {\n    if (mounted.current) {\n      setInternalContentMinHeight(value);\n    }\n  }, []);\n\n  const handleInternalProgressViewOffset = useCallback((value: number) => {\n    if (mounted.current) {\n      setInternalProgressViewOffset(value);\n    }\n  }, []);\n\n  useAnimatedReaction(\n    () => {\n      return contentMinHeight.value;\n    },\n    (result, previous) => {\n      if (result !== previous) {\n        if (\n          contentHeight.current < result &&\n          internalContentMinHeight !== result\n        ) {\n          runOnJS(handleInternalContentHeight)(result);\n        }\n      }\n    }\n  );\n\n  useAnimatedReaction(\n    () => {\n      return fixedHeaderHeight.value;\n    },\n    (result, previous) => {\n      if (result !== previous) {\n        runOnJS(handleInternalProgressViewOffset)(result);\n      }\n    }\n  );\n\n  const contentContainerStyle = useMemo(\n    () => [\n      styles.contentContainer,\n      { minHeight: internalContentMinHeight },\n      props.contentContainerStyle,\n    ],\n    [props.contentContainerStyle, internalContentMinHeight]\n  );\n\n  const handleContentSizeChange = useCallback((_, height) => {\n    contentHeight.current = height;\n  }, []);\n\n  const handleScrollToIndexFailed = useCallback(() => {}, []);\n\n  function renderListHeader() {\n    return (\n      <View>\n        <AnimatedTopView height={headerHeight} />\n        {props.ListHeaderComponent}\n      </View>\n    );\n  }\n\n  return (\n    <AnimatedFlatList\n      ref={scrollViewRef}\n      keyboardDismissMode=\"on-drag\"\n      keyboardShouldPersistTaps=\"handled\"\n      scrollEventThrottle={1}\n      onScrollToIndexFailed={handleScrollToIndexFailed}\n      {...props}\n      style={[styles.container, props.style]}\n      contentContainerStyle={contentContainerStyle}\n      onScroll={scrollHandler}\n      ListHeaderComponent={renderListHeader()}\n      onContentSizeChange={handleContentSizeChange}\n      //@ts-ignore\n      simultaneousHandlers={[]}\n      progressViewOffset={internalProgressViewOffset}\n    />\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    ...StyleSheet.absoluteFillObject,\n  },\n  contentContainer: {\n    flexGrow: 1,\n  },\n  topView: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n  },\n});\n"]}