// Shared primitives used across LUCE pages const { useState, useEffect, useRef, useMemo, useCallback, Fragment } = React; // ------- Intersection reveal hook ------- function useReveal(threshold = 0.15) { const ref = useRef(null); const [shown, setShown] = useState(false); useEffect(() => { if (!ref.current) return; const io = new IntersectionObserver((entries) => { entries.forEach((e) => { if (e.isIntersecting) { setShown(true); io.disconnect(); } }); }, { threshold }); io.observe(ref.current); return () => io.disconnect(); }, [threshold]); return [ref, shown]; } // ------- Reveal wrapper ------- function Reveal({ children, delay = 0, slow = false, as: Tag = 'div', className = '', ...rest }) { const [ref, shown] = useReveal(); return ( {children} ); } // ------- Character split reveal ------- function CharSplit({ text, delay = 0, className = '', italic = false }) { const [ref, shown] = useReveal(); const chars = useMemo(() => Array.from(text), [text]); return ( {chars.map((c, i) => ( {c === ' ' ? '\u00A0' : c} ))} ); } // ------- Particle Canvas (React wrapper) ------- function ParticleCanvas({ opts = {}, className = '', style = {} }) { const ref = useRef(null); useEffect(() => { if (!ref.current || !window.LuceParticles) return; const pf = new window.LuceParticles(ref.current, opts); return () => pf.destroy(); }, [JSON.stringify(opts)]); return