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]);
|
||
|
|
}
|