// components.jsx — icons, primitives, shared bits
const { motion, AnimatePresence, useScroll, useTransform, useMotionValue, useSpring, useInView } = window.framerMotion || window.Motion || {};
// ─── Minimal line icons ─────────────────────────────────────────────
const IconBase = ({ children, size = 20 }) => (
);
const IconStack = () => ;
const IconChain = () => ;
const IconPhone = () => ;
const IconCloud = () => ;
const IconGrid = () => ;
const IconShield = () => ;
const IconMail = () => ;
const IconPin = () => ;
const IconArrow = () => ;
// ─── Animated brand mark (real logo) ────────────────────────────────
function LogoMark({ size = 28, animate = true }) {
return (
);
}
// ─── Reveal primitive ───────────────────────────────────────────────
function Reveal({ children, delay = 0, y = 24, className = "", as = "div" }) {
const ref = React.useRef(null);
const inView = useInView(ref, { once: true, margin: "-10% 0px" });
const Tag = motion[as] || motion.div;
const motionLevel = window.__motionLevel ?? 7;
const scale = motionLevel / 7;
return (
{children}
);
}
// ─── Split text: animate per-character ──────────────────────────────
function SplitText({ text, className = "", delay = 0, stagger = 0.03, y = 40 }) {
const ref = React.useRef(null);
const inView = useInView(ref, { once: true });
const chars = [...text];
return (
{chars.map((c, i) => (
{c}
))}
);
}
// ─── Button link (formerly magnetic — wiggle removed) ───────────────
function MagneticLink({ children, href, primary = false, onClick }) {
return (
{children}
{primary && }
);
}
// ─── Aurora / gradient mesh for hero variants ───────────────────────
function Aurora({ intensity = 1 }) {
return (
);
}
// ─── Animated compute/mesh visual (hero variant B) ─────────────────
function MeshVisual() {
const nodes = React.useMemo(() => {
const arr = [];
for (let i = 0; i < 5; i++) {
for (let j = 0; j < 5; j++) {
arr.push({ id: `${i}-${j}`, x: 10 + i * 20, y: 10 + j * 20 });
}
}
return arr;
}, []);
const edges = React.useMemo(() => {
const e = [];
nodes.forEach((n, i) => {
nodes.slice(i + 1).forEach((m) => {
const d = Math.hypot(n.x - m.x, n.y - m.y);
if (d < 22) e.push({ from: n, to: m, d });
});
});
return e;
}, [nodes]);
return (
);
}
// ─── Marquee for trust row / stack ─────────────────────────────────
function Marquee({ items, speed = 40 }) {
return (
{[...items, ...items].map((it, i) => (
{it}
))}
);
}
Object.assign(window, {
IconStack, IconChain, IconPhone, IconCloud, IconGrid, IconShield,
IconMail, IconPin, IconArrow,
LogoMark, Reveal, SplitText, MagneticLink, Aurora, MeshVisual, Marquee,
});