/
kochkatech
/
CorpGame
Обзор
Документация
Войти
/
kochkatech
/
CorpGame
Код
Запросы
1
Задачи
Вики
Пакеты
0
Релизы
1
CI/CD
Аналитика
dev
frontend/src/components/Modal.tsx
49 строк
2 KB
kochkareal
chore: добавлен .gitattributes, нормализованы переносы строк (LF везде, кроме .bat/.cmd)
06 авг 2026, 15:18
06 авг 2026, 15:18
c25ef1b
Код
Авторство
О чём код?
import { PropsWithChildren, useEffect } from 'react'; interface ModalProps { open: boolean; onClose: () => void; title: string; } export function Modal({ open, onClose, title, children }: PropsWithChildren<ModalProps>) { // Закрытие по Esc + блокировка прокрутки фона, пока окно открыто useEffect(() => { if (!open) return; const onKey = (e: KeyboardEvent) => { if (e.key === 'Escape') onClose(); }; document.addEventListener('keydown', onKey); const prevOverflow = document.body.style.overflow; document.body.style.overflow = 'hidden'; return () => { document.removeEventListener('keydown', onKey); document.body.style.overflow = prevOverflow; }; }, [open, onClose]); if (!open) return null; return ( <div className="fixed inset-0 z-50 flex animate-fade-in items-center justify-center bg-black/70 p-4 backdrop-blur-sm" onClick={onClose} > <div className="w-full max-w-lg animate-scale-in rounded-xl border border-line bg-surface p-5 shadow-card" onClick={(e) => e.stopPropagation()} > <div className="mb-4 flex items-center justify-between"> <h2 className="text-xl font-bold text-focus">{title}</h2> <button onClick={onClose} aria-label="Закрыть" className="rounded px-2 py-1 text-lg text-white/70 transition hover:bg-main hover:text-white" > ✕ </button> </div> {children} </div> </div> ); }