/* === Shared UI components ============================================ */ const { useEffect, useRef, useState, useMemo, useCallback } = React; /* ---- Logo mark ---- */ function LogoMark({ size = 38 }) { return ( NMH ); } /* ---- Image placeholder (striped SVG) ---- */ function Placeholder({ label, aspect = '4/3', radius = 0, style }) { return (
{label}
); } /* ---- Photo: real image with subtle reveal + Ken-Burns on hover ---- */ function Photo({ src, alt, aspect = '4/3', radius = 0, kenBurns = false, style, overlay = false, fit = 'cover' }) { if (!src) return ; return (
{alt {overlay && (
)}
); } /* ---- Looping video tile ---- */ function VideoTile({ src, poster, aspect = '16/9', style }) { return (
); } /* ---- Reveal on scroll ---- */ function Reveal({ children, delay = 0, as: Tag = 'div', className = '', style = {}, ...rest }) { const ref = useRef(null); useEffect(() => { const el = ref.current; if (!el) return; const io = new IntersectionObserver( entries => { entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('is-visible'); io.unobserve(e.target); } }); }, { threshold: 0.12 } ); io.observe(el); return () => io.disconnect(); }, []); return ( {children} ); } /* ---- Inline icons ---- */ const Icon = { Sun: (p) => ( ), Moon: (p) => ( ), Menu: (p) => ( ), Close: (p) => ( ), Arrow: (p) => ( ), ArrowLeft: (p) => ( ), Cal: (p) => ( ), User: (p) => ( ), Bed: (p) => ( ), Wifi: (p) => ( ), Snow: (p) => ( ), Fork: (p) => ( ), Drop: (p) => ( ), Car: (p) => ( ), Concierge: (p) => ( ), Mountain: (p) => ( ), Bell: (p) => ( ), Temple: (p) => ( ), Basket: (p) => ( ), Pin: (p) => ( ), Phone: (p) => ( ), Whatsapp: (p) => ( ), Mail: (p) => ( ), Globe: (p) => ( ), Star: (p) => ( ), Check: (p) => ( ), Plus: (p) => ( ), Minus: (p) => ( ), Copy: (p) => ( ), Facebook: (p) => ( ), Instagram: (p) => ( ), TikTok: (p) => ( ), YouTube: (p) => ( ), }; /* ---- Theme toggle ---- */ function ThemeToggle({ theme, onToggle }) { return ( ); } /* ---- Language toggle (EN/नेपाली) ---- */ function LangToggle({ lang, onChange }) { return ( ); } /* ---- Navigation ---- */ function Nav({ page, onNav, theme, onToggleTheme, lang, onChangeLang, onBook }) { const t = useT(); const [mobileOpen, setMobileOpen] = useState(false); const items = [ { id: 'home', label: t('nav_home') }, { id: 'rooms', label: t('nav_rooms') }, { id: 'dining', label: t('nav_dining') }, { id: 'experiences', label: t('nav_experiences') }, { id: 'gallery', label: t('nav_gallery') }, { id: 'contact', label: t('nav_contact') }, ]; return (
{ onNav('home'); setMobileOpen(false); }}>
{t('brand_name')}
{t('brand_sub')}
); } /* ---- Footer ---- */ function Footer({ onNav, onBook }) { const t = useT(); return ( ); } Object.assign(window, { LogoMark, Placeholder, Photo, VideoTile, Reveal, Icon, ThemeToggle, LangToggle, Nav, Footer });