GT2/Ejectable/node_modules/@react-navigation/native/lib/module/useScrollToTop.js

81 lines
3.1 KiB
JavaScript

import * as React from 'react';
import { useNavigation, useRoute } from '@react-navigation/core';
function getScrollableNode(ref) {
if (ref.current == null) {
return null;
}
if ('scrollToTop' in ref.current || 'scrollTo' in ref.current || 'scrollToOffset' in ref.current || 'scrollResponderScrollTo' in ref.current) {
// This is already a scrollable node.
return ref.current;
} else if ('getScrollResponder' in ref.current) {
// If the view is a wrapper like FlatList, SectionList etc.
// We need to use `getScrollResponder` to get access to the scroll responder
return ref.current.getScrollResponder();
} else if ('getNode' in ref.current) {
// When a `ScrollView` is wraped in `Animated.createAnimatedComponent`
// we need to use `getNode` to get the ref to the actual scrollview.
// Note that `getNode` is deprecated in newer versions of react-native
// this is why we check if we already have a scrollable node above.
return ref.current.getNode();
} else {
return ref.current;
}
}
export default function useScrollToTop(ref) {
const navigation = useNavigation();
const route = useRoute();
React.useEffect(() => {
let current = navigation; // The screen might be inside another navigator such as stack nested in tabs
// We need to find the closest tab navigator and add the listener there
while (current && current.dangerouslyGetState().type !== 'tab') {
current = current.dangerouslyGetParent();
}
if (!current) {
return;
}
const unsubscribe = current.addListener( // We don't wanna import tab types here to avoid extra deps
// in addition, there are multiple tab implementations
// @ts-expect-error
'tabPress', e => {
// We should scroll to top only when the screen is focused
const isFocused = navigation.isFocused(); // In a nested stack navigator, tab press resets the stack to first screen
// So we should scroll to top only when we are on first screen
const isFirst = navigation === current || navigation.dangerouslyGetState().routes[0].key === route.key; // Run the operation in the next frame so we're sure all listeners have been run
// This is necessary to know if preventDefault() has been called
requestAnimationFrame(() => {
const scrollable = getScrollableNode(ref);
if (isFocused && isFirst && scrollable && !e.defaultPrevented) {
if ('scrollToTop' in scrollable) {
scrollable.scrollToTop();
} else if ('scrollTo' in scrollable) {
scrollable.scrollTo({
y: 0,
animated: true
});
} else if ('scrollToOffset' in scrollable) {
scrollable.scrollToOffset({
offset: 0,
animated: true
});
} else if ('scrollResponderScrollTo' in scrollable) {
scrollable.scrollResponderScrollTo({
y: 0,
animated: true
});
}
}
});
});
return unsubscribe;
}, [navigation, ref, route.key]);
}
//# sourceMappingURL=useScrollToTop.js.map