@medalsocial/meda
Version:
Shared Meda UI shell and runtime package.
6 lines (5 loc) • 1.08 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cx } from './utils.js';
export function MarketingTrustBar({ eyebrow, title, stats, className }) {
return (_jsxs("section", { className: cx('mx-auto w-full max-w-6xl px-6 py-16', className), children: [(eyebrow || title) && (_jsxs("div", { className: "mb-10 flex flex-col items-center gap-2 text-center", children: [eyebrow && _jsx("p", { className: "text-sm font-semibold text-primary", children: eyebrow }), title && _jsx("h2", { className: "text-2xl font-semibold sm:text-3xl", children: title })] })), _jsx("ul", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: stats.map((s, i) => (_jsxs("li", { className: "rounded-2xl border border-border bg-card p-6 text-card-foreground", children: [_jsx("div", { className: "text-3xl font-semibold tracking-tight", children: s.value }), _jsx("div", { className: "mt-1 text-sm text-muted-foreground", children: s.label }), s.caption && _jsx("div", { className: "mt-2 text-xs text-muted-foreground", children: s.caption })] }, i))) })] }));
}