// Shared primitives & icons for Michelle's landing page.
const Eyebrow = ({ children, light, className = "" }) => (
{children}
);
const SectionLabel = ({ num, label, light = false }) => (
§ {num}
{label}
);
const PrimaryCTA = ({ children, href = "#contato", className = "", size = "md" }) => {
const sizes = {
sm: "px-5 py-2.5 text-sm",
md: "px-7 py-4 text-[15px]",
lg: "px-10 py-6 text-lg md:text-xl",
xl: "px-12 py-7 text-xl md:text-2xl",
};
return (
{children}
→
);
};
const GhostCTA = ({ children, href = "#contato", className = "" }) => (
{children}
);
// Icons (minimal, line-based)
const Icon = ({ name, className = "w-6 h-6" }) => {
const stroke = "currentColor";
const sw = 1.4;
const icons = {
target: (
),
filter: (
),
broadcast: (
),
map: (
),
network: (
),
cloud: (
),
method: (
),
precision: (
),
result: (
),
check: (
),
x: (
),
whatsapp: (
),
linkedin: (
),
arrow: (
),
quote: (
),
plus: (
),
sparkle: (
),
};
return icons[name] || null;
};
// Photo block
const PhotoPlaceholder = ({ label = "FOTO DA MICHELLE", className = "", shape = "circle" }) => {
const rounded = shape === "circle" ? "rounded-full" : "rounded-[18px]";
return (
{/* corner ticks */}
);
};
// Reveal-on-scroll wrapper
const Reveal = ({ children, delay = 0, className = "" }) => {
const ref = React.useRef(null);
React.useEffect(() => {
const el = ref.current;
if (!el) return;
let revealed = false;
const reveal = () => {
if (revealed) return;
revealed = true;
setTimeout(() => el.classList.add('in'), delay);
};
// If already in view at mount, reveal immediately (don't rely on IO's initial callback).
const rect = el.getBoundingClientRect();
const vh = window.innerHeight || document.documentElement.clientHeight;
if (rect.top < vh * 0.95 && rect.bottom > 0) {
reveal();
return;
}
// Fallback timer in case the observer never fires in this environment.
const fallback = setTimeout(reveal, 1800);
let io;
try {
io = new IntersectionObserver((entries) => {
entries.forEach(e => { if (e.isIntersecting) reveal(); });
}, { threshold: 0, rootMargin: '0px 0px -8% 0px' });
io.observe(el);
} catch (err) {
reveal();
}
return () => { clearTimeout(fallback); if (io) io.disconnect(); };
}, [delay]);
return {children}
;
};
// Section wrapper with consistent vertical padding
const Section = ({ id, dark = false, children, className = "" }) => (
);
Object.assign(window, {
Eyebrow, SectionLabel, PrimaryCTA, GhostCTA, Icon,
PhotoPlaceholder, Reveal, Section,
});