UNPKG

@mui/material

Version:

Quickly build beautiful React apps. MUI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

70 lines (54 loc) 3.08 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = useScrollTrigger; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose")); var React = _interopRequireWildcard(require("react")); const _excluded = ["getTrigger", "target"]; 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 defaultTrigger(store, options) { const { disableHysteresis = false, threshold = 100, target } = options; const previous = store.current; if (target) { // Get vertical scroll store.current = target.pageYOffset !== undefined ? target.pageYOffset : target.scrollTop; } if (!disableHysteresis && previous !== undefined) { if (store.current < previous) { return false; } } return store.current > threshold; } const defaultTarget = typeof window !== 'undefined' ? window : null; function useScrollTrigger(options = {}) { const { getTrigger = defaultTrigger, target = defaultTarget } = options, other = (0, _objectWithoutPropertiesLoose2.default)(options, _excluded); const store = React.useRef(); const [trigger, setTrigger] = React.useState(() => getTrigger(store, other)); React.useEffect(() => { const handleScroll = () => { setTrigger(getTrigger(store, (0, _extends2.default)({ target }, other))); }; handleScroll(); // Re-evaluate trigger when dependencies change target.addEventListener('scroll', handleScroll); return () => { target.removeEventListener('scroll', handleScroll); }; // See Option 3. https://github.com/facebook/react/issues/14476#issuecomment-471199055 // eslint-disable-next-line react-hooks/exhaustive-deps }, [target, getTrigger, JSON.stringify(other)]); return trigger; }