fullpage-scroll-component/dist/lib/StepScroll/Page.js

Stepped Scroll Component Library.

'use strict';

var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
var jsxRuntime = require('react/jsx-runtime');
var react = require('react');
var useDidUpdate = require('./hooks/useDidUpdate.js');
var useStepScroll = require('./hooks/useStepScroll.js');
var styled = require('@emotion/styled');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);

const PageContainer = styled__default["default"].div`
  width: 100vw;
  height: 100vh;
`;
/**
 * @description
 * StepScroll 컴포넌트의 children으로만 사용할 수 있는 컴포넌트 입니다.
 */
function Page(_a) {
  var {
      children
    } = _a,
    args = tslib_es6.__rest(_a, ["children"]);
  const {
    pagesIdArray,
    setPagesIdArray,
    currentPage
  } = useStepScroll.useStepScroll();
  const ref = react.useRef(null);
  const id = react.useId();
  react.useEffect(() => {
    if (!pagesIdArray.includes(id)) {
      setPagesIdArray(prev => [...prev, id]);
    }
  }, []);
  useDidUpdate.useDidUpdate(() => {
    var _a;
    if (ref.current && pagesIdArray[currentPage] === id) {
      (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
        block: "start",
        behavior: "smooth"
      });
    }
  }, [pagesIdArray, currentPage]);
  react.useEffect(() => {
    const scrollIntoViewByResize = () => {
      var _a;
      if (ref.current && pagesIdArray[currentPage] === id) {
        (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
          block: "start"
        });
      }
    };
    window.addEventListener("resize", scrollIntoViewByResize);
    return () => {
      window.removeEventListener("resize", scrollIntoViewByResize);
    };
  }, [ref, currentPage, pagesIdArray, id]);
  return jsxRuntime.jsx(PageContainer, Object.assign({
    id: id,
    ref: ref
  }, args, {
    children: children
  }));
}

module.exports = Page;