/* Nav.jsx — PMT Innovation */ const { useState, useEffect, useRef } = React; const NAV_HEIGHT = 72; function PMTNav({ page, navigate, subPage, setSubPage }) { const [scrolled, setScrolled] = useState(false); const [activeDropdown, setActiveDropdown] = useState(null); const [menuOpen, setMenuOpen] = useState(false); const [mobileW, setMobileW] = useState(window.innerWidth); const dropdownTimer = useRef(null); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 10); window.addEventListener('scroll', onScroll); return () => window.removeEventListener('scroll', onScroll); }, []); useEffect(() => { const h = () => setMobileW(window.innerWidth); window.addEventListener('resize', h); return () => window.removeEventListener('resize', h); }, []); /* 페이지 이동 시 모바일 메뉴 닫기 */ useEffect(() => { setMenuOpen(false); }, [page]); const isMobile = mobileW < 900; const navItems = [ { id: 'solutions', label: '솔루션·업종별 제안', sub: ['성형·비만클리닉', '한의원', '대학교 연구소·연구기관', '의류업체', '에스테틱·필라테스'] }, { id: 'products', label: '제품', sub: ['SHAPENIX', 'PFS-304', 'PFS-N304', 'Shape Care'] }, { id: 'cases', label: '도입사례' }, { id: 'news', label: '뉴스·블로그' }, ]; const handleMouseEnter = (id) => { clearTimeout(dropdownTimer.current); setActiveDropdown(id); }; const handleMouseLeave = () => { dropdownTimer.current = setTimeout(() => setActiveDropdown(null), 120); }; const isActive = (id) => page === id; const isTransparent = !menuOpen; const textColor = 'rgba(255,255,255,0.9)'; const activeColor = '#C8271D'; return ( <> {/* 모바일 드로어 메뉴 */} {isMobile && (
{navItems.map((item, idx) => (
{item.sub && item.sub.map(sub => ( ))}
))}
)} ); } Object.assign(window, { PMTNav, NAV_HEIGHT });