@medalsocial/meda
Version:
Shared Meda UI shell and runtime package.
9 lines (8 loc) • 1.2 kB
JavaScript
'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cx } from './utils.js';
export function MarketingMegaMenu({ triggerId, open, onOpenChange, features, children, className, }) {
if (!open)
return null;
return (_jsx("div", { role: "dialog", "aria-labelledby": triggerId, onMouseLeave: () => onOpenChange(false), className: cx('absolute left-1/2 top-full mt-3 w-[min(960px,calc(100vw-32px))] -translate-x-1/2 rounded-3xl border border-border bg-card p-6 shadow-2xl backdrop-blur', className), children: children ?? (_jsx("ul", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: features?.map((f) => (_jsx("li", { children: _jsxs("a", { href: f.href, className: "flex items-start gap-3 rounded-xl p-3 hover:bg-muted/40", children: [f.icon && (_jsx("span", { className: "mt-0.5 inline-flex h-8 w-8 items-center justify-center rounded-lg bg-primary/10 text-primary", children: f.icon })), _jsxs("span", { children: [_jsx("span", { className: "block text-sm font-semibold", children: f.title }), f.description && (_jsx("span", { className: "mt-1 block text-xs text-muted-foreground", children: f.description }))] })] }) }, f.id))) })) }));
}