/* global React */
const { useState, useEffect, useRef } = React;
/* ---- lucide-style stroke icon factory ---- */
function mkIcon(paths) {
return function Icon({ size = 22, stroke = 1.8, className = "", style }) {
return (
);
};
}
const IconMenu = mkIcon(<>);
const IconArrowRight = mkIcon(<>);
const IconArrowUpRight= mkIcon(<>);
const IconCheck = mkIcon();
const IconTicket = mkIcon(<>);
const IconCalendar = mkIcon(<>);
const IconMapPin = mkIcon(<>);
const IconUsers = mkIcon(<>);
const IconScan = mkIcon(<>);
const IconDoor = mkIcon(<>);
const IconGrid = mkIcon(<>);
const IconZap = mkIcon();
const IconShield = mkIcon(<>);
const IconGlobe = mkIcon(<>);
const IconWallet = mkIcon(<>);
const IconPhone = mkIcon(<>);
const IconMonitor = mkIcon(<>);
const IconStar = mkIcon();
const IconPlus = mkIcon(<>);
const IconTrending = mkIcon(<>);
const IconClock = mkIcon(<>);
const IconQr = mkIcon(<>);
/* ---- Aperture logomark (reused from brand) ---- */
function Aperture({ size = 26, color = "currentColor", stroke = 8.5, className = "", style }) {
return (
);
}
function Wordmark({ markSize = 24, fontSize = 19, ls = 5, accent = false, className = "" }) {
return (
AXXESS
);
}
/* ---- hooks ---- */
// Intersection-based reveal: add `.reveal` to elements; this flips them to `.in`
function useReveal() {
useEffect(() => {
const els = document.querySelectorAll(".reveal");
if (!("IntersectionObserver" in window)) { els.forEach(e => e.classList.add("in")); return; }
const io = new IntersectionObserver((ents) => {
ents.forEach(e => { if (e.isIntersecting) { e.target.classList.add("in"); io.unobserve(e.target); } });
}, { threshold: 0.16, rootMargin: "0px 0px -8% 0px" });
els.forEach(e => io.observe(e));
return () => io.disconnect();
});
}
// count-up when element scrolls into view
function useCountUp(target, { duration = 1400, decimals = 0 } = {}) {
const ref = useRef(null);
const [val, setVal] = useState(0);
useEffect(() => {
const el = ref.current; if (!el) return;
let started = false;
const reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
const run = () => {
if (reduce) { setVal(target); return; }
const t0 = performance.now();
const tick = (now) => {
const p = Math.min(1, (now - t0) / duration);
const e = 1 - Math.pow(1 - p, 3);
setVal(target * e);
if (p < 1) requestAnimationFrame(tick);
};
requestAnimationFrame(tick);
};
const io = new IntersectionObserver((ents) => {
ents.forEach(en => { if (en.isIntersecting && !started) { started = true; run(); io.unobserve(el); } });
}, { threshold: 0.5 });
io.observe(el);
return () => io.disconnect();
}, [target]);
const display = decimals ? val.toFixed(decimals) : Math.round(val).toLocaleString();
return [ref, display];
}
window.AX = Object.assign(window.AX || {}, {
IconMenu, IconArrowRight, IconArrowUpRight, IconCheck, IconTicket, IconCalendar, IconMapPin,
IconUsers, IconScan, IconDoor, IconGrid, IconZap, IconShield, IconGlobe, IconWallet, IconPhone,
IconMonitor, IconStar, IconPlus, IconTrending, IconClock, IconQr,
Aperture, Wordmark, useReveal, useCountUp,
});