Added few functions
This commit is contained in:
45
lib/body-scroll-lock.ts
Normal file
45
lib/body-scroll-lock.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
'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]);
|
||||
}
|
||||
Reference in New Issue
Block a user