diff --git a/example/ios/CollapsibleExample.xcodeproj/project.pbxproj b/example/ios/CollapsibleExample.xcodeproj/project.pbxproj index 2eda43b..84c8eb6 100644 --- a/example/ios/CollapsibleExample.xcodeproj/project.pbxproj +++ b/example/ios/CollapsibleExample.xcodeproj/project.pbxproj @@ -15,8 +15,8 @@ 2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; }; 2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; }; 2DCD954D1E0B4F2C00145EB5 /* CollapsibleExampleTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* CollapsibleExampleTests.m */; }; - 4C39C56BAD484C67AA576FFA /* libPods-CollapsibleExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = CA3E69C5B9553B26FBA2DF04 /* libPods-CollapsibleExample.a */; }; 81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; }; + CF949926C9B2FB5E622E1B03 /* libPods-CollapsibleExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = F5EF525A5B84B47D5151D95B /* libPods-CollapsibleExample.a */; }; /* End PBXBuildFile section */ /* Begin PBXContainerItemProxy section */ @@ -49,12 +49,12 @@ 13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = CollapsibleExample/main.m; sourceTree = ""; }; 2D02E47B1E0B4A5D006451C7 /* CollapsibleExample-tvOS.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "CollapsibleExample-tvOS.app"; sourceTree = BUILT_PRODUCTS_DIR; }; 2D02E4901E0B4A5D006451C7 /* CollapsibleExample-tvOSTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = "CollapsibleExample-tvOSTests.xctest"; sourceTree = BUILT_PRODUCTS_DIR; }; - 47F7ED3B7971BE374F7B8635 /* Pods-CollapsibleExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-CollapsibleExample.debug.xcconfig"; path = "Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample.debug.xcconfig"; sourceTree = ""; }; 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = CollapsibleExample/LaunchScreen.storyboard; sourceTree = ""; }; - CA3E69C5B9553B26FBA2DF04 /* libPods-CollapsibleExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-CollapsibleExample.a"; sourceTree = BUILT_PRODUCTS_DIR; }; - E00ACF0FDA8BF921659E2F9A /* Pods-CollapsibleExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-CollapsibleExample.release.xcconfig"; path = "Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample.release.xcconfig"; sourceTree = ""; }; + CA9C5E93DDB2948D402C739A /* Pods-CollapsibleExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-CollapsibleExample.debug.xcconfig"; path = "Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample.debug.xcconfig"; sourceTree = ""; }; + DE9B08DEBE20374F878341C7 /* Pods-CollapsibleExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-CollapsibleExample.release.xcconfig"; path = "Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample.release.xcconfig"; sourceTree = ""; }; ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; }; ED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; }; + F5EF525A5B84B47D5151D95B /* libPods-CollapsibleExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-CollapsibleExample.a"; sourceTree = BUILT_PRODUCTS_DIR; }; /* End PBXFileReference section */ /* Begin PBXFrameworksBuildPhase section */ @@ -69,7 +69,7 @@ isa = PBXFrameworksBuildPhase; buildActionMask = 2147483647; files = ( - 4C39C56BAD484C67AA576FFA /* libPods-CollapsibleExample.a in Frameworks */, + CF949926C9B2FB5E622E1B03 /* libPods-CollapsibleExample.a in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -126,7 +126,7 @@ children = ( ED297162215061F000B7C4FE /* JavaScriptCore.framework */, ED2971642150620600B7C4FE /* JavaScriptCore.framework */, - CA3E69C5B9553B26FBA2DF04 /* libPods-CollapsibleExample.a */, + F5EF525A5B84B47D5151D95B /* libPods-CollapsibleExample.a */, ); name = Frameworks; sourceTree = ""; @@ -134,8 +134,8 @@ 6B9684456A2045ADE5A6E47E /* Pods */ = { isa = PBXGroup; children = ( - 47F7ED3B7971BE374F7B8635 /* Pods-CollapsibleExample.debug.xcconfig */, - E00ACF0FDA8BF921659E2F9A /* Pods-CollapsibleExample.release.xcconfig */, + CA9C5E93DDB2948D402C739A /* Pods-CollapsibleExample.debug.xcconfig */, + DE9B08DEBE20374F878341C7 /* Pods-CollapsibleExample.release.xcconfig */, ); path = Pods; sourceTree = ""; @@ -198,14 +198,14 @@ isa = PBXNativeTarget; buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "CollapsibleExample" */; buildPhases = ( - 4F0A6FC082772762E3E4C96C /* [CP] Check Pods Manifest.lock */, + 3220FEC3544BA5FA60FEEEB7 /* [CP] Check Pods Manifest.lock */, FD10A7F022414F080027D42C /* Start Packager */, 13B07F871A680F5B00A75B9A /* Sources */, 13B07F8C1A680F5B00A75B9A /* Frameworks */, 13B07F8E1A680F5B00A75B9A /* Resources */, 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */, - C1D60D28B925C94BD88E79D7 /* [CP] Copy Pods Resources */, - 98038AC17C0DA41A0E475048 /* [CP] Embed Pods Frameworks */, + 6B71F767E1D2123EDCA46D95 /* [CP] Embed Pods Frameworks */, + 1B5862C159B9205B90BDE2E3 /* [CP] Copy Pods Resources */, ); buildRules = ( ); @@ -349,6 +349,24 @@ shellPath = /bin/sh; shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh"; }; + 1B5862C159B9205B90BDE2E3 /* [CP] Copy Pods Resources */ = { + isa = PBXShellScriptBuildPhase; + buildActionMask = 2147483647; + files = ( + ); + inputPaths = ( + "${PODS_ROOT}/Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample-resources.sh", + "${PODS_CONFIGURATION_BUILD_DIR}/React-Core/AccessibilityResources.bundle", + ); + name = "[CP] Copy Pods Resources"; + outputPaths = ( + "${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/AccessibilityResources.bundle", + ); + runOnlyForDeploymentPostprocessing = 0; + shellPath = /bin/sh; + shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample-resources.sh\"\n"; + showEnvVarsInLog = 0; + }; 2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = { isa = PBXShellScriptBuildPhase; buildActionMask = 2147483647; @@ -363,7 +381,7 @@ shellPath = /bin/sh; shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh"; }; - 4F0A6FC082772762E3E4C96C /* [CP] Check Pods Manifest.lock */ = { + 3220FEC3544BA5FA60FEEEB7 /* [CP] Check Pods Manifest.lock */ = { isa = PBXShellScriptBuildPhase; buildActionMask = 2147483647; files = ( @@ -385,7 +403,7 @@ shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n"; showEnvVarsInLog = 0; }; - 98038AC17C0DA41A0E475048 /* [CP] Embed Pods Frameworks */ = { + 6B71F767E1D2123EDCA46D95 /* [CP] Embed Pods Frameworks */ = { isa = PBXShellScriptBuildPhase; buildActionMask = 2147483647; files = ( @@ -403,24 +421,6 @@ shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample-frameworks.sh\"\n"; showEnvVarsInLog = 0; }; - C1D60D28B925C94BD88E79D7 /* [CP] Copy Pods Resources */ = { - isa = PBXShellScriptBuildPhase; - buildActionMask = 2147483647; - files = ( - ); - inputPaths = ( - "${PODS_ROOT}/Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample-resources.sh", - "${PODS_CONFIGURATION_BUILD_DIR}/React-Core/AccessibilityResources.bundle", - ); - name = "[CP] Copy Pods Resources"; - outputPaths = ( - "${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/AccessibilityResources.bundle", - ); - runOnlyForDeploymentPostprocessing = 0; - shellPath = /bin/sh; - shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-CollapsibleExample/Pods-CollapsibleExample-resources.sh\"\n"; - showEnvVarsInLog = 0; - }; FD10A7F022414F080027D42C /* Start Packager */ = { isa = PBXShellScriptBuildPhase; buildActionMask = 2147483647; @@ -555,12 +555,13 @@ }; 13B07F941A680F5B00A75B9A /* Debug */ = { isa = XCBuildConfiguration; - baseConfigurationReference = 47F7ED3B7971BE374F7B8635 /* Pods-CollapsibleExample.debug.xcconfig */; + baseConfigurationReference = CA9C5E93DDB2948D402C739A /* Pods-CollapsibleExample.debug.xcconfig */; buildSettings = { ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; CLANG_ENABLE_MODULES = YES; CURRENT_PROJECT_VERSION = 1; ENABLE_BITCODE = NO; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "i386 arm64"; INFOPLIST_FILE = CollapsibleExample/Info.plist; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; OTHER_LDFLAGS = ( @@ -578,11 +579,12 @@ }; 13B07F951A680F5B00A75B9A /* Release */ = { isa = XCBuildConfiguration; - baseConfigurationReference = E00ACF0FDA8BF921659E2F9A /* Pods-CollapsibleExample.release.xcconfig */; + baseConfigurationReference = DE9B08DEBE20374F878341C7 /* Pods-CollapsibleExample.release.xcconfig */; buildSettings = { ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; CLANG_ENABLE_MODULES = YES; CURRENT_PROJECT_VERSION = 1; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "i386 arm64"; INFOPLIST_FILE = CollapsibleExample/Info.plist; LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; OTHER_LDFLAGS = ( @@ -735,7 +737,7 @@ COPY_PHASE_STRIP = NO; ENABLE_STRICT_OBJC_MSGSEND = YES; ENABLE_TESTABILITY = YES; - "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 i386"; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386; GCC_C_LANGUAGE_STANDARD = gnu99; GCC_DYNAMIC_NO_PIC = NO; GCC_NO_COMMON_BLOCKS = YES; @@ -796,7 +798,7 @@ COPY_PHASE_STRIP = YES; ENABLE_NS_ASSERTIONS = NO; ENABLE_STRICT_OBJC_MSGSEND = YES; - "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 i386"; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386; GCC_C_LANGUAGE_STANDARD = gnu99; GCC_NO_COMMON_BLOCKS = YES; GCC_WARN_64_TO_32_BIT_CONVERSION = YES; diff --git a/example/ios/CollapsibleExample/Images.xcassets/AppIcon.appiconset/Contents.json b/example/ios/CollapsibleExample/Images.xcassets/AppIcon.appiconset/Contents.json index 118c98f..8121323 100644 --- a/example/ios/CollapsibleExample/Images.xcassets/AppIcon.appiconset/Contents.json +++ b/example/ios/CollapsibleExample/Images.xcassets/AppIcon.appiconset/Contents.json @@ -2,37 +2,52 @@ "images" : [ { "idiom" : "iphone", - "size" : "29x29", - "scale" : "2x" + "scale" : "2x", + "size" : "20x20" }, { "idiom" : "iphone", - "size" : "29x29", - "scale" : "3x" + "scale" : "3x", + "size" : "20x20" }, { "idiom" : "iphone", - "size" : "40x40", - "scale" : "2x" + "scale" : "2x", + "size" : "29x29" }, { "idiom" : "iphone", - "size" : "40x40", - "scale" : "3x" + "scale" : "3x", + "size" : "29x29" }, { "idiom" : "iphone", - "size" : "60x60", - "scale" : "2x" + "scale" : "2x", + "size" : "40x40" }, { "idiom" : "iphone", - "size" : "60x60", - "scale" : "3x" + "scale" : "3x", + "size" : "40x40" + }, + { + "idiom" : "iphone", + "scale" : "2x", + "size" : "60x60" + }, + { + "idiom" : "iphone", + "scale" : "3x", + "size" : "60x60" + }, + { + "idiom" : "ios-marketing", + "scale" : "1x", + "size" : "1024x1024" } ], "info" : { - "version" : 1, - "author" : "xcode" + "author" : "xcode", + "version" : 1 } -} \ No newline at end of file +} diff --git a/example/ios/Podfile b/example/ios/Podfile index 80469a8..176c716 100644 --- a/example/ios/Podfile +++ b/example/ios/Podfile @@ -19,5 +19,9 @@ target 'CollapsibleExample' do # use_flipper!() post_install do |installer| react_native_post_install(installer) + + installer.pods_project.build_configurations.each do |config| + config.build_settings["EXCLUDED_ARCHS[sdk=iphonesimulator*]"] = "arm64 i386" + end end end diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock index d43352d..a54a6e3 100644 --- a/example/ios/Podfile.lock +++ b/example/ios/Podfile.lock @@ -498,6 +498,6 @@ SPEC CHECKSUMS: RNScreens: 21b73c94c9117e1110a79ee0ee80c93ccefed8ce Yoga: c36762154e856af6b7e3605e40b66a1f84044d12 -PODFILE CHECKSUM: 69701926c43adba0d37cec23a6672f27d660945b +PODFILE CHECKSUM: 4f9ac1f7798cd4790a3cc8d1c0660a1bf1f4e044 COCOAPODS: 1.11.2 diff --git a/example/src/screens/CollapsibleList/index.tsx b/example/src/screens/CollapsibleList/index.tsx index 84e04ad..b223a40 100644 --- a/example/src/screens/CollapsibleList/index.tsx +++ b/example/src/screens/CollapsibleList/index.tsx @@ -1,5 +1,12 @@ -import React, { useState } from 'react'; -import { Image, StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import React, { useRef, useState } from 'react'; +import { + Image, + StyleSheet, + Text, + TextInput, + TouchableOpacity, + View, +} from 'react-native'; import { CollapsibleContainer, CollapsibleHeaderContainer, @@ -15,6 +22,7 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context'; function CollapsibleList() { const [currentTab, setCurrentTab] = useState(0); const { top } = useSafeAreaInsets(); + const textInput = useRef(null); function renderHeder(props: any) { return ; @@ -22,7 +30,10 @@ function CollapsibleList() { return ( - + @@ -37,7 +48,12 @@ function CollapsibleList() { Alan Walker - + + + @@ -150,7 +166,8 @@ const styles = StyleSheet.create({ color: '#7339B3', }, collapsibleView: { - height: 100, + height: 500, backgroundColor: 'yellow', + justifyContent: 'flex-end', }, }); diff --git a/src/components/CollapsibleContainer.tsx b/src/components/CollapsibleContainer.tsx index 773660a..0ab8e19 100644 --- a/src/components/CollapsibleContainer.tsx +++ b/src/components/CollapsibleContainer.tsx @@ -1,32 +1,85 @@ -import React, { useCallback } from 'react'; -import { LayoutChangeEvent, StyleSheet, View, ViewProps } from 'react-native'; +import React, { useCallback, useRef } from 'react'; +import { + KeyboardAvoidingView, + KeyboardAvoidingViewProps, + LayoutChangeEvent, + StyleSheet, + View, + ViewProps, +} from 'react-native'; +import useKeyboardShowEvent from '../hooks/useKeyboardShowEvent'; import useInternalCollapsibleContext from '../hooks/useInternalCollapsibleContext'; +import useCollapsibleContext from '../hooks/useCollapsibleContext'; type Props = Omit & { children: Element; + keyboardAvoidingViewProps?: KeyboardAvoidingViewProps; + textInputRefs?: any[]; }; -export default function CollapsibleContainer({ children, ...props }: Props) { +export default function CollapsibleContainer({ + children, + keyboardAvoidingViewProps, + textInputRefs = [], + ...props +}: Props) { const { containerRef, handleContainerHeight } = useInternalCollapsibleContext(); + const { scrollY, scrollTo } = useCollapsibleContext(); + + const containerHeight = useRef(0); + + useKeyboardShowEvent(() => { + textInputRefs.some((ref) => { + const isFocusedFunc = ref.current.isFocused; + const isFocused = + isFocusedFunc && typeof isFocusedFunc === 'function' + ? isFocusedFunc() + : isFocusedFunc; + if (isFocused) { + ref.current.measureLayout( + // @ts-ignore + containerRef.current, + (left: number, top: number, width: number, height: number) => { + console.log({ left, top, width, height }); + if (top + height - scrollY.value > containerHeight.current) { + console.log('need to scroll'); + const extraOffset = + keyboardAvoidingViewProps?.keyboardVerticalOffset ?? 20; + scrollTo(top + height + extraOffset - containerHeight.current); + } + }, + () => {} + ); + } + return isFocused; + }); + }); const handleContainerLayout = useCallback( (layout: LayoutChangeEvent) => { const height = layout.nativeEvent.layout.height; + containerHeight.current = height; handleContainerHeight(height); }, [handleContainerHeight] ); return ( - - {children} - + + {children} + + ); } diff --git a/src/components/scrollable/CollapsibleFlatList.tsx b/src/components/scrollable/CollapsibleFlatList.tsx index 5d8746c..5b62949 100644 --- a/src/components/scrollable/CollapsibleFlatList.tsx +++ b/src/components/scrollable/CollapsibleFlatList.tsx @@ -1,3 +1,4 @@ +/* eslint-disable react-hooks/exhaustive-deps */ import React, { useCallback, useEffect, @@ -27,8 +28,7 @@ export default function CollapsibleFlatList({ ...props }: Props) { const { headerHeight, scrollY } = useCollapsibleContext(); - const { contentMinHeight } = useInternalCollapsibleContext(); - const scrollRef = useRef(null); + const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext(); const mounted = useRef(true); const contentHeight = useRef(0); @@ -38,15 +38,12 @@ export default function CollapsibleFlatList({ }; }, []); - const scrollTo = useCallback( - (yValue: number, animated = true) => { - scrollRef.current?.scrollToOffset({ - offset: yValue, - animated, - }); - }, - [scrollRef] - ); + const scrollTo = useCallback((yValue: number, animated = true) => { + scrollViewRef.current?.scrollToOffset({ + offset: yValue, + animated, + }); + }, []); const handleInternalContentHeight = useCallback((value: number) => { if (mounted.current) { @@ -103,7 +100,7 @@ export default function CollapsibleFlatList({ {/* @ts-ignore */} (null); - const { contentMinHeight } = useInternalCollapsibleContext(); + const { contentMinHeight, scrollViewRef } = useInternalCollapsibleContext(); const { headerHeight } = useCollapsibleContext(); const scrollTo = useCallback((yValue: number, animated = true) => { - // @ts-ignore - scrollView.current?.scrollTo({ y: yValue, animated }); + scrollViewRef.current?.scrollTo({ y: yValue, animated }); }, []); const { scrollHandler } = useAnimatedScroll({ @@ -44,7 +43,7 @@ export default function CollapsibleScrollView({ return ( void) { + const savedCallback = useRef(callback); + + useEffect(() => { + savedCallback.current = callback; + }, [callback]); + + useEffect(() => { + const subscription = Keyboard.addListener('keyboardDidShow', () => { + if (savedCallback.current) { + savedCallback.current(); + } + }); + + return () => { + subscription.remove(); + }; + }, []); +} diff --git a/src/types.d.ts b/src/types.ts similarity index 97% rename from src/types.d.ts rename to src/types.ts index 231918c..7532e23 100644 --- a/src/types.d.ts +++ b/src/types.ts @@ -1,4 +1,3 @@ -import type { RefObject } from 'react'; import type React from 'react'; import type { View } from 'react-native'; import type Animated from 'react-native-reanimated'; @@ -23,6 +22,7 @@ export type LayoutParams = { }; export type CollapsibleContextInternalType = { + scrollViewRef: React.RefObject; containerRef: React.RefObject; contentMinHeight: Animated.SharedValue; firstStickyViewY: Animated.SharedValue; diff --git a/src/withCollapsibleContext.tsx b/src/withCollapsibleContext.tsx index b2548fb..baef165 100644 --- a/src/withCollapsibleContext.tsx +++ b/src/withCollapsibleContext.tsx @@ -31,6 +31,7 @@ export default function withCollapsibleContext(Component: FC) { const firstStickyViewY = useSharedValue(1000000); const headerContainersHeight = useRef>({}); const containerRef = useRef(null); + const scrollViewRef = useRef(null); const setCollapsibleHandlers = useCallback((handlers) => { collapsibleHandlers.current = handlers; @@ -164,6 +165,7 @@ export default function withCollapsibleContext(Component: FC) { const internalContext = useMemo( () => ({ + scrollViewRef, containerRef, handleStickyViewLayout, handleHeaderContainerLayout,