// Afer marketing — primitives shared across all pages
const { useState, useEffect, useRef } = React;
function Logo({ light = false }) {
// Detect base by looking for the loaded primitives.jsx script tag
const scripts = document.querySelectorAll('script[src*="primitives.jsx"]');
let base = '';
if (scripts.length) {
const src = scripts[0].getAttribute('src') || '';
base = src.replace(/shared\/primitives\.jsx.*$/, '');
}
const file = light ? 'afer-logo-white.svg?v=2' : 'afer-logo-color.png';
return
;
}
function Icon({ name, size = 20, color = 'currentColor', strokeWidth = 1.75, style }) {
const props = { width: size, height: size, viewBox: '0 0 24 24', fill: 'none', stroke: color, strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', style };
const paths = {
file: <>>,
clock: <>>,
chart: <>>,
scan: <>>,
bank: <>>,
shield: <>>,
trend: <>>,
portal: <>>,
bell: <>>,
chevron: ,
chevronDown: ,
check: ,
checkCircle: <>>,
menu: <>>,
arrow: <>>,
arrowUp: <>>,
sparkle: <>>,
bot: <>>,
zap: ,
users: <>>,
user: <>>,
briefcase: <>>,
building: <>>,
package: <>>,
calendar: <>>,
play: ,
pause: <>>,
plus: <>>,
minus: ,
x: <>>,
star: ,
quote: <>>,
receipt: <>>,
timer: <>>,
workflow: <>>,
lock: <>>,
lightning: ,
eye: <>>,
cloud: ,
rocket: <>>,
refresh: <>>,
coins: <>>,
whatsapp: ,
pencil: <>>,
download: <>>,
send: <>>,
globe: <>>,
message: <>>,
alert: <>>,
help: <>>,
};
return ;
}
// Opens the Calendly popup widget. Loads the script lazily on first call.
function openCalendly(e) {
if (e && e.preventDefault) e.preventDefault();
const url = 'https://calendly.com/m-capo/demo';
const launch = () => {
if (window.Calendly && window.Calendly.initPopupWidget) {
window.Calendly.initPopupWidget({ url });
} else {
window.open(url, '_blank', 'noopener');
}
};
if (window.Calendly) return launch();
// Inject CSS + JS once
if (!document.getElementById('calendly-css')) {
const css = document.createElement('link');
css.id = 'calendly-css'; css.rel = 'stylesheet';
css.href = 'https://assets.calendly.com/assets/external/widget.css';
document.head.appendChild(css);
}
if (!document.getElementById('calendly-js')) {
const js = document.createElement('script');
js.id = 'calendly-js'; js.async = true;
js.src = 'https://assets.calendly.com/assets/external/widget.js';
js.onload = launch;
document.body.appendChild(js);
} else {
// Script tag exists but Calendly not ready yet — poll briefly
const start = Date.now();
const poll = setInterval(() => {
if (window.Calendly || Date.now() - start > 5000) {
clearInterval(poll); launch();
}
}, 100);
}
}
function Button({ variant = 'primary', size = 'md', href, children, ...rest }) {
const cls = `afer-btn afer-btn--${variant}${size === 'lg' ? ' afer-btn--lg' : ''}`;
if (href) return {children};
return ;
}
function Eyebrow({ children, color = 'var(--brand-accent)' }) {
return
{children}
;
}
function Container({ children, style, ...rest }) {
return {children}
;
}
function Section({ children, bg, pad = '96px 0', label, style, ...rest }) {
return (
);
}
// On-scroll reveal — adds .reveal-in class when visible
function Reveal({ children, delay = 0, as: As = 'div', style }) {
const ref = useRef();
const [shown, setShown] = useState(false);
useEffect(() => {
const el = ref.current; if (!el) return;
const io = new IntersectionObserver(([e]) => {
if (e.isIntersecting) { setTimeout(() => setShown(true), delay); io.disconnect(); }
}, { threshold: 0.1, rootMargin: '0px 0px -60px 0px' });
io.observe(el);
return () => io.disconnect();
}, [delay]);
return (
{children}
);
}
Object.assign(window, { Logo, Icon, Button, Eyebrow, Container, Section, Reveal, openCalendly });