w-lab-app/src/components/ui/FullScreenBlurModal/FullScreenBlurModal.tsx
gofnnp 8d456c5d0a main
integrate meditations
2025-06-24 16:19:03 +04:00

42 lines
855 B
TypeScript

"use client";
import { useEffect } from "react";
import clsx from "clsx";
import styles from "./FullScreenBlurModal.module.scss";
interface FullScreenBlurModalProps {
className?: string;
classNameContent?: string;
style?: React.CSSProperties;
children: React.ReactNode;
isOpen: boolean;
}
export default function FullScreenBlurModal({
className = "",
classNameContent = "",
children,
style,
isOpen,
}: FullScreenBlurModalProps) {
useEffect(() => {
if (isOpen) {
document.body.classList.add("no-scroll");
}
return () => {
document.body.classList.remove("no-scroll");
};
}, [isOpen]);
return (
<div
style={style}
className={clsx(styles.modal, className, isOpen && styles.open)}
>
<div className={clsx(styles.content, classNameContent)}>{children}</div>
</div>
);
}