/* Icons + tiny shared primitives — exported to window */
const I = {
wa: (p)=> ,
ig: (p)=> ,
arrow: (p)=> ,
arrowDown: (p)=> ,
check: (p)=> ,
sail: (p)=> ,
anchor:(p)=> ,
sun:(p)=> ,
compass:(p)=> ,
pin:(p)=> ,
wave:(p)=> ,
};
// reveal-on-scroll wrapper
function Reveal({children, className="", delay=0, as:Tag="div", ...rest}){
const ref = React.useRef(null);
React.useEffect(()=>{
const el=ref.current; if(!el) return;
const io=new IntersectionObserver(([e])=>{
if(e.isIntersecting){ el.classList.add("in"); io.unobserve(el); }
},{threshold:.12});
io.observe(el); return ()=>io.disconnect();
},[]);
return {children};
}
// Real photography mapped per slot. Falls back to generated placeholder; a user drop overrides either.
const PHOTOS = {
"heroA-bg":"IMG_6256", // sunset catamaran silhouette
"exp-0":"IMG_6228", // private charter — deck & cushions
"exp-1":"IMG_6224", // catamaran day — turquoise coast from cockpit
"exp-2":"IMG_6262", // sunset cruise — aperitivo on board
};
// image slot helper — renders the web component
function Slot({id, ph, style, shape="rounded", radius=14, className="", src}){
const finalSrc = src || (PHOTOS[id] ? "assets/photos/"+PHOTOS[id]+".jpg" : "assets/ph/"+id+".png");
return ;
}
const WAIcon = I.wa, IGIcon = I.ig, Arrow = I.arrow;
Object.assign(window, { I, Reveal, Slot });