@modern-kit/react/dist/hooks/useScrollLock/index.mjs

modern-kit/react

import { useRef, useCallback } from 'react';
import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/index.mjs';
import '@modern-kit/utils';

function useScrollLock({
  autoLock = true
} = {}) {
  const ref = useRef(null);
  const originalOverflow = useRef(null);
  const lock = useCallback(() => {
    const targetElement = ref.current;
    originalOverflow.current = window.getComputedStyle(targetElement).overflow;
    targetElement.style.overflow = "hidden";
  }, []);
  const unlock = useCallback(() => {
    if (!originalOverflow.current) return;
    const targetElement = ref.current;
    targetElement.style.overflow = originalOverflow.current;
  }, []);
  useIsomorphicLayoutEffect(() => {
    if (!ref.current) {
      ref.current = document.body;
    }
    if (autoLock) {
      lock();
    }
    return () => unlock();
  }, [autoLock, lock, unlock]);
  return { ref, lock, unlock };
}

export { useScrollLock };
//# sourceMappingURL=index.mjs.map