/* eslint-disable */
/* Samuk Lab — Refined components */
const { useState, useEffect, useRef, useMemo } = React;
// ----------------------------------------------------------------
// HEADER
// ----------------------------------------------------------------
function Header({ active = "home", onNavigate }) {
const [scrolled, setScrolled] = useState(false);
const [mobileOpen, setMobileOpen] = useState(false);
useEffect(() => {
const root = document.scrollingElement || document.documentElement;
const onScroll = () => setScrolled(root.scrollTop > 60);
onScroll();
document.addEventListener('scroll', onScroll, { passive: true });
return () => document.removeEventListener('scroll', onScroll);
}, []);
useEffect(() => {setMobileOpen(false);}, [active]);
const items = [
{ id: 'home', label: 'Home' },
{ id: 'research', label: 'Research' },
{ id: 'people', label: 'People' },
{ id: 'publications', label: 'Publications' },
{ id: 'software', label: 'Software' },
{ id: 'join', label: 'Join' },
{ id: 'contact', label: 'Contact' }];
const go = (id) => (e) => {e.preventDefault();onNavigate && onNavigate(id);};
return (
<>
setMobileOpen(false)}>
);
}
// ----------------------------------------------------------------
// HERO — supports retype, kicker, inner variant
// ----------------------------------------------------------------
function useRetype(words, enabled) {
const [text, setText] = useState(words && words.length ? words[0] : '');
const idxRef = useRef(0);
const timerRef = useRef(null);
useEffect(() => {
if (!enabled || !words || words.length < 2) return;
const clear = () => {if (timerRef.current) clearTimeout(timerRef.current);};
let alive = true;
let current = words[0];
let i = current.length;
setText(current);
idxRef.current = 0;
const tick = (fn, ms) => {timerRef.current = setTimeout(() => {if (alive) fn();}, ms);};
const pauseThenDelete = () => tick(deleteOne, 2200);
const deleteOne = () => {
if (i > 0) {i--;setText(current.slice(0, i));tick(deleteOne, 60);} else
{idxRef.current = (idxRef.current + 1) % words.length;
current = words[idxRef.current];typeOne();}
};
const typeOne = () => {
if (i < current.length) {i++;setText(current.slice(0, i));
tick(typeOne, 90 + Math.round(Math.random() * 80));} else
{pauseThenDelete();}
};
pauseThenDelete();
return () => {alive = false;clear();};
}, [enabled, words ? words.join('|') : '']);
return text;
}
function Hero({ image, kicker, title, retypeWords, inner = false, innerSub }) {
const hasRetype = !!(retypeWords && retypeWords.length);
const word = useRetype(retypeWords, hasRetype);
return (
);
}
// ----------------------------------------------------------------
// FEATURE TRIO
// ----------------------------------------------------------------
function FeatureTrio({ items, onAction }) {
return (
);
}
// ----------------------------------------------------------------
// NEWS CAROUSEL
// ----------------------------------------------------------------
function NewsCarousel({ items, autoMs = 7000 }) {
const [i, setI] = useState(0);
useEffect(() => {
if (!autoMs) return;
const t = setInterval(() => setI((x) => (x + 1) % items.length), autoMs);
return () => clearInterval(t);
}, [autoMs, items.length]);
const it = items[i];
const prev = () => setI((i - 1 + items.length) % items.length);
const next = () => setI((i + 1) % items.length);
return (
{it.tag || 'News'}
{items.map((_, idx) =>
);
}
// ----------------------------------------------------------------
// RESEARCH CARD
// ----------------------------------------------------------------
function ResearchCard({ image, caption, title, intro, bullets, imageRight = false, number }) {
const fig =
{caption}
;
const body =
{number &&
{number}}
We have several active projects aimed at understanding this:
{bullets.map((b, i) => - {b}
)}
{imageRight ? <>{body}{fig} : <>{fig}{body}}
);
}
// ----------------------------------------------------------------
// SOCIAL ICON & PROFILE CARD
// ----------------------------------------------------------------
function SocialIcon({ kind, href, title }) {
const ICONS = {
email: 'fas fa-envelope',
cv: 'ai ai-cv',
scholar: 'ai ai-google-scholar',
orcid: 'ai ai-orcid',
twitter: 'fab fa-twitter',
github: 'fab fa-github',
linkedin: 'fab fa-linkedin',
website: 'fas fa-globe'
};
const cls = ICONS[kind] || 'fas fa-link';
return (
);
}
function ProfileCard({ portrait, name, title, bioHtml, socials = [], past = false }) {
return (
{name}
{title}
{!past && bioHtml ?
: null}
{!past && socials.length > 0 ?
{socials.map((s, i) => )}
:
null}
);
}
function PiCard({ portrait, name, title, bioHtml, socials = [] }) {
return (
{name}
{title}
{socials.map((s, i) => )}
);
}
// ----------------------------------------------------------------
// JOB CARD
// ----------------------------------------------------------------
function JobCard({ icon, name, subtitle, tabs }) {
const [active, setActive] = useState(0);
return (
{name}
{subtitle}
{tabs.map((t, i) =>
setActive(i)}>{t.label}
)}
{tabs[active].sections.map((s, i) =>
{s.heading}
{s.body &&
}
{s.bullets &&
{s.bullets.map((b, j) => - {b}
)}
}
)}
);
}
// ----------------------------------------------------------------
// SOFTWARE CARD
// ----------------------------------------------------------------
function SoftwareCard({ logo, name, tagline, children }) {
return (
{name}
{tagline}
{children}
);
}
// ----------------------------------------------------------------
// PUBLICATIONS
// ----------------------------------------------------------------
function PublicationCard({ pub }) {
const [copied, setCopied] = useState(null);
const copy = (text, which) => {
const done = () => {
setCopied(which);
setTimeout(() => setCopied(null), 1400);
};
// Try modern API first
if (navigator.clipboard && window.isSecureContext) {
navigator.clipboard.writeText(text).then(done).catch(() => fallback(text, done));
} else {
fallback(text, done);
}
};
const fallback = (text, done) => {
try {
const ta = document.createElement('textarea');
ta.value = text;
ta.setAttribute('readonly', '');
ta.style.cssText = 'position:fixed;top:0;left:0;opacity:0;pointer-events:none;';
document.body.appendChild(ta);
ta.select();
ta.setSelectionRange(0, text.length);
const ok = document.execCommand('copy');
document.body.removeChild(ta);
if (ok) done();
} catch (e) {
console.warn('Copy failed', e);
}
};
return (
{pub.year}
{pub.title}
{pub.authors} · {pub.venue}
PDF
DOI
);
}
function Publications() {
const [pubs, setPubs] = useState(null);
const [filter, setFilter] = useState('all');
useEffect(() => {
fetch('data/publications.json').
then((r) => r.json()).
then(setPubs).
catch(() => setPubs([]));
}, []);
if (!pubs) return Loading publications…
;
const years = Array.from(new Set(pubs.map((p) => p.year))).sort((a, b) => b - a);
const filtered = filter === 'all' ? pubs : pubs.filter((p) => p.year === filter);
return (
Filter by year
{years.map((y) =>
)}
{filtered.length === 0 &&
No publications for {filter}.
}
);
}
// ----------------------------------------------------------------
// FOOTER
// ----------------------------------------------------------------
function Footer({ onNavigate }) {
const go = (id) => (e) => {e.preventDefault();onNavigate && onNavigate(id);};
return (
);
}
// Export to window
Object.assign(window, {
Header, Hero, FeatureTrio, NewsCarousel,
ResearchCard, ProfileCard, PiCard, JobCard,
SoftwareCard, Publications, Footer, SocialIcon
});