fix: allow for scrollIndicatorInsets to be supplied to scroll containers (#18)

Author: e-younan

src/components/containers/FlashList.tsx

@@ -41,6 +41,7 @@ const FlashListWithHeadersInputComp = <ItemT extends any = any>(
     automaticallyAdjustsScrollIndicatorInsets,
     headerFadeInThreshold = 1,
     disableLargeHeaderFadeAnim = false,
+    scrollIndicatorInsets = {},
     ...rest
   }: AnimatedFlashListType<ItemT>,
   ref: React.Ref<FlashList<ItemT>>
@@ -112,7 +113,10 @@ const FlashListWithHeadersInputComp = <ItemT extends any = any>(
             ? automaticallyAdjustsScrollIndicatorInsets
             : !absoluteHeader
         }
-        scrollIndicatorInsets={{ top: absoluteHeader ? absoluteHeaderHeight : 0 }}
+        scrollIndicatorInsets={{
+          top: absoluteHeader ? absoluteHeaderHeight : 0,
+          ...scrollIndicatorInsets,
+        }}
         ListHeaderComponent={
           LargeHeaderComponent ? (
             <View

src/components/containers/FlatList.tsx

@@ -37,6 +37,7 @@ const FlatListWithHeadersInputComp = <ItemT extends unknown>(
     automaticallyAdjustsScrollIndicatorInsets,
     headerFadeInThreshold = 1,
     disableLargeHeaderFadeAnim = false,
+    scrollIndicatorInsets = {},
     ...rest
   }: AnimatedFlatListProps<ItemT> & SharedScrollContainerProps,
   ref: React.Ref<Animated.FlatList<ItemT> | null>
@@ -107,7 +108,10 @@ const FlatListWithHeadersInputComp = <ItemT extends unknown>(
             ? automaticallyAdjustsScrollIndicatorInsets
             : !absoluteHeader
         }
-        scrollIndicatorInsets={{ top: absoluteHeader ? absoluteHeaderHeight : 0 }}
+        scrollIndicatorInsets={{
+          top: absoluteHeader ? absoluteHeaderHeight : 0,
+          ...scrollIndicatorInsets,
+        }}
         ListHeaderComponent={
           LargeHeaderComponent ? (
             <View

src/components/containers/ScrollView.tsx

@@ -9,7 +9,7 @@ import type { SharedScrollContainerProps } from './types';
 
 const AnimatedScrollView = Animated.createAnimatedComponent(ScrollView);
 
-type AnimatedScrollViewProps = React.ComponentProps<typeof Animated.ScrollView> & {
+type AnimatedScrollViewProps = React.ComponentProps<typeof AnimatedScrollView> & {
   children?: React.ReactNode;
 };
 
@@ -36,6 +36,7 @@ const ScrollViewWithHeadersInputComp = (
     contentContainerStyle,
     automaticallyAdjustsScrollIndicatorInsets,
     headerFadeInThreshold = 1,
+    scrollIndicatorInsets = {},
     disableLargeHeaderFadeAnim = false,
     ...rest
   }: AnimatedScrollViewProps & SharedScrollContainerProps,
@@ -97,6 +98,8 @@ const ScrollViewWithHeadersInputComp = (
           if (onMomentumScrollEnd) onMomentumScrollEnd(e);
         }}
         contentContainerStyle={[
+          // @ts-ignore
+          // Reanimated typings are causing this error - will fix in the future.
           contentContainerStyle,
           absoluteHeader ? { paddingTop: absoluteHeaderHeight } : undefined,
         ]}
@@ -105,7 +108,10 @@ const ScrollViewWithHeadersInputComp = (
             ? automaticallyAdjustsScrollIndicatorInsets
             : !absoluteHeader
         }
-        scrollIndicatorInsets={{ top: absoluteHeader ? absoluteHeaderHeight : 0 }}
+        scrollIndicatorInsets={{
+          top: absoluteHeader ? absoluteHeaderHeight : 0,
+          ...scrollIndicatorInsets,
+        }}
         {...rest}
       >
         {LargeHeaderComponent ? (

src/components/containers/SectionList.tsx

@@ -41,6 +41,7 @@ const SectionListWithHeadersInputComp = <ItemT extends any = any, SectionT = Def
     automaticallyAdjustsScrollIndicatorInsets,
     headerFadeInThreshold = 1,
     disableLargeHeaderFadeAnim = false,
+    scrollIndicatorInsets = {},
     ...rest
   }: AnimatedSectionListType<ItemT, SectionT>,
   ref: React.Ref<Animated.ScrollView>
@@ -111,7 +112,10 @@ const SectionListWithHeadersInputComp = <ItemT extends any = any, SectionT = Def
             ? automaticallyAdjustsScrollIndicatorInsets
             : !absoluteHeader
         }
-        scrollIndicatorInsets={{ top: absoluteHeader ? absoluteHeaderHeight : 0 }}
+        scrollIndicatorInsets={{
+          top: absoluteHeader ? absoluteHeaderHeight : 0,
+          ...scrollIndicatorInsets,
+        }}
         ListHeaderComponent={
           LargeHeaderComponent ? (
             <View