@krowdy-ui/core/es/HideOnScroll/HideOnScroll.js

React components that implement Google's Material Design.

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import React from 'react';
import Slide from '../Slide';
import useScrollTrigger from '../useScrollTrigger';
const AlterDirection = {
  down: 'up',
  left: 'right',
  right: 'left',
  up: 'down'
};
const HideOnScroll = React.forwardRef((_ref, ref) => {
  let {
    direction = 'down'
  } = _ref,
      props = _objectWithoutPropertiesLoose(_ref, ["direction"]);

  const {
    children,
    window
  } = props; // Note that you normally won't need to set the window ref as useScrollTrigger
  // will default to window.
  // This is only being set here because the demo is in an iframe.

  const trigger = useScrollTrigger({
    target: window ? window() : undefined
  });
  return /*#__PURE__*/React.createElement(Slide, {
    appear: false,
    direction: direction ? AlterDirection[direction] : undefined,
    in: !trigger,
    ref: ref
  }, children);
});
export default HideOnScroll;