@wordpress/components
Version:
UI components for WordPress.
93 lines (87 loc) • 2.85 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useScroll;
var _reactNative = require("react-native");
var _reactNativeReanimated = require("react-native-reanimated");
var _element = require("@wordpress/element");
var _useKeyboardOffset = _interopRequireDefault(require("./use-keyboard-offset"));
var _useScrollToSection = _interopRequireDefault(require("./use-scroll-to-section"));
var _useScrollToElement = _interopRequireDefault(require("./use-scroll-to-element"));
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useScroll({
scrollEnabled,
shouldPreventAutomaticScroll,
onScroll,
onSizeChange,
extraScrollHeight
}) {
const scrollViewRef = (0, _element.useRef)();
const scrollViewMeasurements = (0, _element.useRef)();
const scrollViewYOffset = (0, _reactNativeReanimated.useSharedValue)(-1);
const lastScrollTo = (0, _element.useRef)({
clientId: null
});
const {
height: windowHeight,
width: windowWidth
} = (0, _reactNative.useWindowDimensions)();
const isLandscape = windowWidth >= windowHeight;
const [keyboardOffset] = (0, _useKeyboardOffset.default)(scrollEnabled, shouldPreventAutomaticScroll);
const scrollHandler = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
onScroll: event => {
const {
contentOffset
} = event;
scrollViewYOffset.value = contentOffset.y;
onScroll(event);
}
});
// When the orientation changes, the ScrollView measurements
// need to be re-calculated.
(0, _element.useEffect)(() => {
scrollViewMeasurements.current = null;
}, [isLandscape]);
const [scrollToSection] = (0, _useScrollToSection.default)(extraScrollHeight, keyboardOffset, scrollEnabled, scrollViewMeasurements, scrollViewRef, scrollViewYOffset);
const [scrollToElement] = (0, _useScrollToElement.default)(scrollViewRef, scrollToSection);
const measureScrollView = (0, _element.useCallback)(() => {
if (scrollViewRef.current) {
scrollViewRef.current.measureInWindow((_x, y, width, height) => {
scrollViewMeasurements.current = {
y,
width,
height
};
});
}
}, [scrollViewRef]);
const onContentSizeChange = (0, _element.useCallback)(() => {
if (onSizeChange) {
onSizeChange();
}
// Sets the first values when the content size changes.
if (!scrollViewMeasurements.current) {
measureScrollView();
}
}, [measureScrollView, onSizeChange]);
return {
scrollViewRef,
scrollHandler,
keyboardOffset,
scrollToSection,
scrollToElement,
onContentSizeChange,
lastScrollTo
};
}
//# sourceMappingURL=use-scroll.native.js.map