46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
/**
|
|
* Gère le verrouillage du scroll du body quand des modales sont ouvertes.
|
|
* Gère plusieurs modales empilées via un compteur.
|
|
*/
|
|
let lockCount = 0;
|
|
let savedScrollY = 0;
|
|
|
|
export function lockBodyScroll() {
|
|
lockCount++;
|
|
if (lockCount === 1) {
|
|
savedScrollY = window.scrollY;
|
|
document.documentElement.style.overflow = 'hidden';
|
|
document.body.style.overflow = 'hidden';
|
|
document.body.style.position = 'fixed';
|
|
document.body.style.top = `-${savedScrollY}px`;
|
|
document.body.style.left = '0';
|
|
document.body.style.right = '0';
|
|
}
|
|
}
|
|
|
|
export function unlockBodyScroll() {
|
|
if (lockCount > 0) lockCount--;
|
|
if (lockCount === 0) {
|
|
document.documentElement.style.overflow = '';
|
|
document.body.style.overflow = '';
|
|
document.body.style.position = '';
|
|
document.body.style.top = '';
|
|
document.body.style.left = '';
|
|
document.body.style.right = '';
|
|
window.scrollTo(0, savedScrollY);
|
|
}
|
|
}
|
|
|
|
import { useEffect } from 'react';
|
|
|
|
export function useBodyScrollLock(isOpen: boolean) {
|
|
useEffect(() => {
|
|
if (isOpen) {
|
|
lockBodyScroll();
|
|
return () => unlockBodyScroll();
|
|
}
|
|
}, [isOpen]);
|
|
}
|