// landing-bits.jsx
// Atoms used by the landing: icons, logo, header, footer, mock cards.
// Receives `variant: 'desktop' | 'mobile'` and tweak values where relevant.
// ── Icon set (lucide-aligned, currentColor strokes) ───────────────
const Icons = {
arrowRight: (p) => (
),
menu: (p) => (
),
close: (p) => (
),
search: (p) => (
),
compass: (p) => (
),
users: (p) => (
),
zap: (p) => (
),
sparkles: (p) => (
),
check: (p) => (
),
trending: (p) => (
),
clipboard: (p) => (
),
route: (p) => (
),
hand: (p) => (
),
};
// ── Logo ─────────────────────────────────────────────────────────
function Logo({ variant = "color" }) {
const src = variant === "white" ? "assets/logo-white.svg" : "assets/logo-full.svg";
return
;
}
// ── Header ───────────────────────────────────────────────────────
function Header({ variant }) {
if (variant === "mobile") {
return (
);
}
return (
);
}
// ── Pill / eyebrow badge (used in hero) ──────────────────────────
function HeroPill({ children, light }) {
return (
{children}
);
}
// ── Trust microcopy line ─────────────────────────────────────────
function TrustLine() {
return (
5 minutos · Sin registro · Diagnóstico personalizado
);
}
// ── Hero mockup column — three floating cards (Hero variant A) ───
function HeroMockCards() {
return (
<>
{/* Card 1 — Tu nivel de madurez */}
Diagnóstico
Tu nivel de madurez
Tu empresa está en etapa de profesionalización. 4 áreas con oportunidad clara.
Etapa: En crecimiento
62/100
{/* Card 2 — Ruta recomendada */}
Ruta recomendada
3 prioridades para los próximos 6 meses
Procesos administrativos, control financiero y certificación ISO 9001.
{/* Card 3 — Equipo asignado */}
Expertos asignados
Equipo de consultoría
2 consultores senior con experiencia en tu sector, listos para acompañarte.
>
);
}
// Mobile-scaled mock cards (smaller, tighter)
function HeroMockCardsMobile() {
return (
<>
Diagnóstico
Tu nivel de madurez
Etapa de profesionalización. 4 áreas con oportunidad.
En crecimiento
62/100
Ruta recomendada
3 prioridades, 6 meses
Procesos, finanzas y certificación ISO 9001.
>
);
}
// ── Footer ───────────────────────────────────────────────────────
function Footer({ variant }) {
return (
);
}
// Expose to other Babel scripts
Object.assign(window, {
Icons, Logo, Header, HeroPill, TrustLine,
HeroMockCards, HeroMockCardsMobile, Footer
});