@bearmenu/ui 0.8.8 → 0.8.9

package/dist/components/event-list-row-wide.js

@@ -1,6 +1,6 @@
 import { Separator } from '../chunk-WSRWFA6K.js';
-import { Tag } from '../chunk-ZDAHKI3A.js';
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
+import { Tag } from '../chunk-ZDAHKI3A.js';
 import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Skeleton } from '../chunk-QXHMPJ35.js';
 import { buttonVariants } from '../chunk-H3BV4VAG.js';

package/dist/components/event-list-row.js

@@ -1,7 +1,7 @@
 import { Separator } from '../chunk-WSRWFA6K.js';
 import { TagGroup } from '../chunk-6XMYEZVR.js';
-import { Tag } from '../chunk-ZDAHKI3A.js';
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
+import { Tag } from '../chunk-ZDAHKI3A.js';
 import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Skeleton } from '../chunk-QXHMPJ35.js';
 import { cn } from '../chunk-FEK5XGZW.js';

package/dist/components/hub-surface.d.ts

@@ -0,0 +1,27 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * HubSurface — the surface a hub section sits on BELOW `lg`.
+ *
+ * On a phone a hub is an app screen, not a page: each section is a white card
+ * on the tinted ground, 18px radius, one card shadow and no border, with 14px
+ * of inset. Hairlines live inside a card, never across the page. From `lg` up
+ * the card dissolves — no fill, no radius, no inset — and the sections sit flat
+ * the way the desktop design draws them. One element, two looks; the section
+ * markup inside is identical at every width.
+ *
+ * `flush` drops the inset so a section whose content bleeds to the card edge —
+ * a snap rail, a full-width photograph — can pad its own header and let the
+ * rest run.
+ *
+ * Generalised out of the events hub's `EventsHubCard`, which had the same job
+ * and lived in the app. Nothing here is menu- or event-shaped.
+ */
+type HubSurfaceProps = {
+    flush?: boolean;
+    className?: string;
+    children: React.ReactNode;
+};
+declare function HubSurface({ flush, className, children }: HubSurfaceProps): react_jsx_runtime.JSX.Element;
+
+export { HubSurface, type HubSurfaceProps };

package/dist/components/hub-surface.js

@@ -0,0 +1,20 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';
+import { jsx } from 'react/jsx-runtime';
+
+function HubSurface({ flush, className, children }) {
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      className: cn(
+        "rounded-[18px] border border-border bg-card shadow-none",
+        flush ? "overflow-hidden" : "px-3.5 py-4",
+        "lg:overflow-visible lg:rounded-none lg:bg-transparent lg:p-0 lg:shadow-none",
+        className
+      ),
+      children
+    }
+  );
+}
+
+export { HubSurface };

package/dist/components/menu-family-card.d.ts

@@ -0,0 +1,59 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MenuItemLabels } from './menu-item.js';
+import { MenuFamilyPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
+import 'react';
+import './place-types.js';
+
+/**
+ * MenuFamilyCard — a browsable grouping of venues: a cuisine on the dishes tab,
+ * a drink family on the drinks tab.
+ *
+ * ## The count does the scanning, the item answers the question
+ *
+ * The card is two halves with two jobs. The dark panel is for scanning a row of
+ * four: one number, one name, and the groups the family consists of, over a
+ * mosaic of its venues. The white half underneath answers what you would
+ * actually order — the production `<MenuItem>`, with its price, portion and
+ * mention count, so the recommendation is the review census rather than an
+ * editorial pick.
+ *
+ * ## Both halves count VENUES
+ *
+ * Cuisine exists on places and nowhere else — no listing endpoint will tell you
+ * how many dishes are Italian — so a card counting dishes cannot be built and
+ * this one does not try. The groups line is a plain list without counts: at
+ * four cards across, four chips each carrying a number turned the panel into a
+ * table, and the numbers were kitchens, which nobody reads a chip as.
+ *
+ * The mosaic holds VENUE photographs, which are real. It dims them hard — this
+ * is a ground for a number, not a gallery, and at this size a legible photo
+ * competes with the count for the same glance.
+ */
+/** @deprecated Alias of `MenuLinkProps`; kept so existing imports keep working. */
+type MenuFamilyCardLinkProps = MenuLinkProps;
+type MenuFamilyCardLabels = {
+    /** Unit under the count, e.g. "KITCHENS". */
+    venueUnit: string;
+    /** Kicker over the featured item, e.g. "MOST NAMED". */
+    mostNamed: string;
+    /** Footer caption, e.g. "kitchen price band". */
+    priceBand: string;
+};
+type MenuFamilyCardProps = {
+    family: MenuFamilyPreview;
+    labels: MenuFamilyCardLabels;
+    /** Passed through to the featured `<MenuItem>`. */
+    itemLabels: MenuItemLabels;
+    formatPrice: (amount: number) => string;
+    formatCount?: (value: number) => string;
+    href: string;
+    /** Finished CSS colour for the featured item's category mark. */
+    hue?: string;
+    /** Composed price band, e.g. "32–84 lei". */
+    priceBandLabel?: string;
+    linkComponent?: MenuLinkComponent;
+    className?: string;
+};
+declare function MenuFamilyCard({ family, labels, itemLabels, formatPrice, formatCount, href, hue, priceBandLabel, linkComponent: LinkComponent, className, }: MenuFamilyCardProps): react_jsx_runtime.JSX.Element;
+
+export { MenuFamilyCard, type MenuFamilyCardLabels, type MenuFamilyCardLinkProps, type MenuFamilyCardProps };

package/dist/components/menu-family-card.js

@@ -0,0 +1,121 @@
+import { MenuItem } from '../chunk-TH6W2PWG.js';
+import '../chunk-Q6QH52LJ.js';
+import '../chunk-UKBNQO6Q.js';
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { Wallet } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function DefaultLink(_a) {
+  var _b = _a, { href } = _b, props = __objRest(_b, ["href"]);
+  return /* @__PURE__ */ jsx("a", __spreadValues({ href }, props));
+}
+var MOSAIC_CELLS = 4;
+function MenuFamilyCard({
+  family,
+  labels,
+  itemLabels,
+  formatPrice,
+  formatCount,
+  href,
+  hue,
+  priceBandLabel,
+  linkComponent: LinkComponent = DefaultLink,
+  className
+}) {
+  var _a, _b, _c;
+  const photos = (_a = family.venue_photo_urls) != null ? _a : [];
+  const groups = ((_b = family.chips) != null ? _b : []).map((chip) => chip.label);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex h-full flex-col overflow-hidden rounded-[14px] border border-border bg-card",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs(
+          LinkComponent,
+          {
+            href,
+            className: "relative block overflow-hidden bg-[oklch(0.21_0.012_55)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+            children: [
+              /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "absolute inset-0 grid grid-cols-2 grid-rows-2 gap-px", children: Array.from(
+                { length: MOSAIC_CELLS },
+                (_, cell) => photos.length ? (
+                  // eslint-disable-next-line @next/next/no-img-element
+                  /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src: photos[cell % photos.length],
+                      alt: "",
+                      loading: "lazy",
+                      decoding: "async",
+                      className: "h-full w-full object-cover"
+                    },
+                    cell
+                  )
+                ) : /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: "bg-[repeating-linear-gradient(135deg,oklch(0.6_0.02_55)_0_9px,oklch(0.68_0.016_58)_9px_18px)] opacity-[0.18]"
+                  },
+                  cell
+                )
+              ) }),
+              hue && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": true,
+                  className: "absolute inset-0 opacity-90 mix-blend-color",
+                  style: { backgroundColor: hue }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": true,
+                  className: "absolute inset-0 bg-[linear-gradient(180deg,oklch(0.16_0.012_55_/_0.9)_0%,oklch(0.16_0.012_55_/_0.62)_45%,oklch(0.16_0.012_55_/_0.94)_100%)]"
+                }
+              ),
+              /* @__PURE__ */ jsxs("span", { className: "relative flex min-h-[260px] flex-col justify-between p-3.5 text-white", children: [
+                /* @__PURE__ */ jsxs("span", { className: "block", children: [
+                  /* @__PURE__ */ jsx("b", { className: "block text-[34px] font-extrabold leading-none tracking-[-0.03em] tabular-nums", children: family.venue_count }),
+                  /* @__PURE__ */ jsx("span", { className: "mt-1 block text-[9.5px] font-bold tracking-[0.12em] opacity-80", children: labels.venueUnit })
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "block", children: [
+                  /* @__PURE__ */ jsx("span", { className: "block text-[17px] font-bold tracking-[-0.01em]", children: family.name }),
+                  groups.length > 0 && /* @__PURE__ */ jsx("span", { className: "mt-0.5 block truncate text-[11.5px] opacity-75", children: groups.join(" \xB7 ") }),
+                  priceBandLabel && /* @__PURE__ */ jsxs("span", { className: "mt-2 inline-flex items-center gap-1.5 rounded-full bg-white/15 px-2.5 py-1 text-[11px] backdrop-blur-[2px]", children: [
+                    /* @__PURE__ */ jsx(Wallet, { className: "h-3 w-3 shrink-0", "aria-hidden": true }),
+                    /* @__PURE__ */ jsx("span", { className: "opacity-80", children: labels.priceBand }),
+                    /* @__PURE__ */ jsx("b", { className: "font-semibold tabular-nums", children: priceBandLabel })
+                  ] })
+                ] })
+              ] })
+            ]
+          }
+        ),
+        family.signature && /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col px-2 pb-2 pt-3", children: [
+          /* @__PURE__ */ jsx("span", { className: "px-2 text-[9.5px] font-bold uppercase tracking-[0.09em] text-muted-foreground", children: labels.mostNamed }),
+          /* @__PURE__ */ jsx(
+            MenuItem,
+            {
+              className: "min-h-0",
+              item: family.signature.item,
+              labels: itemLabels,
+              formatPrice,
+              formatCount,
+              markGradient: hue,
+              subtitle: family.signature.why,
+              href: (_c = family.signature.href) != null ? _c : href,
+              linkComponent: LinkComponent
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+export { MenuFamilyCard };

package/dist/components/menu-field.d.ts

@@ -0,0 +1,57 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * MenuField — the photoless cover surface for a dish or drink.
+ *
+ * Menu-item photography is AI-generated and never shown, so the item's own name
+ * repeats across a shallow diagonal over a gradient. The type IS the cover.
+ *
+ * The rows fade SYMMETRICALLY out from a single strong row at the centre. That
+ * shape is what keeps the type reading as texture in the colour rather than as
+ * a watermark stamped on top of it: the eye lands on one legible line and the
+ * rest falls away in both directions. A uniform wash — or a random per-row
+ * alpha — reads as noise at every alpha high enough to see.
+ *
+ * The alpha curve is IDENTICAL for every hue. Scaling it per hue to even out
+ * how white type reads over different grounds also moves where rows fall below
+ * visibility, so a damped hue lost rows and one card showed five bands where
+ * its neighbour showed three. Correct contrast in the `gradient` you pass, not
+ * in the curve.
+ *
+ * ## Why `gradient` is a prop
+ *
+ * Resolving a category slug to a hue needs the app's category enums, which the
+ * DS does not take. Callers pass a finished CSS gradient — fe from its own
+ * category-colour table, post-generator from whatever it is filming. The DS
+ * owns the typography and the falloff; the consumer owns the palette.
+ *
+ * Server-safe: no state, no effects. The row geometry is a 13-iteration loop
+ * computed on every render, which is cheaper than the hook that would let it be
+ * skipped.
+ */
+type MenuFieldProps = {
+    /** Item name — rendered as the repeating ghost. */
+    name: string;
+    /** CSS `background-image` value. See the note above on why this is injected. */
+    gradient: string;
+    /**
+     * Deterministic stagger seed. Pass the PARENT CONCEPT SLUG so one dish breaks
+     * its lines identically at every venue and across re-sorts. Defaults to
+     * `name`, which is stable but shared by every venue's version of a dish.
+     */
+    seedKey?: string;
+    /**
+     * `repeat` (default) — the name as texture, thirteen fading rows. Right at
+     * swatch and thumbnail sizes, where any single line would be unreadable.
+     *
+     * `display` — the name ONCE, set large and bled off the edges. Right when the
+     * tile is the primary object on its row and the name is the thing being sold;
+     * the repeat treatment at that size reads as wallpaper rather than as a dish.
+     * Long names clip on purpose — the caption underneath carries the full text.
+     */
+    variant?: "repeat" | "display";
+    className?: string;
+};
+declare function MenuField({ name, gradient, seedKey, variant, className, }: MenuFieldProps): react_jsx_runtime.JSX.Element;
+
+export { MenuField, type MenuFieldProps };

package/dist/components/menu-field.js

@@ -0,0 +1,3 @@
+export { MenuField } from '../chunk-YS6BHKZO.js';
+import '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';

package/dist/components/menu-hub-hero.d.ts

@@ -0,0 +1,65 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * MenuHubHero — the claim that opens a menu hub, proven by live figures.
+ *
+ * A statement rather than a count ("Nobody should have to walk in blind"),
+ * over a dark ground, with the catalogue's real numbers under it and one proof
+ * line that demonstrates what the catalogue can do that a single menu cannot.
+ *
+ * ## Why the ground is a texture and not a photograph
+ *
+ * Menu-item photography is AI-generated and never shown, and one venue
+ * photograph behind a claim about every venue in the city argues the wrong
+ * thing. The tile grid reads as "many menus" without being any of them.
+ * Callers that DO have a real, licensed image for the slot can pass
+ * `backgroundUrl` — venue photography, never a plate.
+ *
+ * ## Figures
+ *
+ * `figures` is a list, not four fixed slots: the drinks tab has different ones
+ * and the count changes when a number turns out to have nothing behind it.
+ * Every value is a pre-formatted string because thousands separators are
+ * locale-dependent and the DS owns no locale.
+ *
+ * Server-safe.
+ */
+type MenuHubHeroFigure = {
+    /** Pre-formatted, e.g. "19,062". */
+    value: string;
+    label: string;
+};
+type MenuHubHeroProps = {
+    /** Small caps line above the headline, e.g. "397 MENUS IN CLUJ-NAPOCA, READ IN FULL". */
+    kicker?: string;
+    /** Icon for the kicker, resolved by the caller. */
+    kickerIcon?: React.ReactNode;
+    headline: string;
+    body?: string;
+    figures?: MenuHubHeroFigure[];
+    /**
+     * The proof line — one demonstrated fact, e.g. "A margherita: 87 kitchens
+     * make one, 10 to 120 lei". Composed by the caller; clause order is
+     * locale-dependent.
+     */
+    proof?: React.ReactNode;
+    proofIcon?: React.ReactNode;
+    /** The action beside the proof line. Pass a rendered link or button. */
+    action?: React.ReactNode;
+    /** Real, licensed photograph for the ground. Venue imagery only — see above. */
+    backgroundUrl?: string;
+    /**
+     * Tiles for the mosaic ground — generic, cinematic, licensed stills, served
+     * from the consumer's own origin.
+     *
+     * A mosaic rather than one photograph because the hero's claim is about EVERY
+     * kitchen in the city: a single image makes it about one of them. Given fewer
+     * tiles than cells the list repeats, so a caller can ship six and still fill
+     * a 1440px hero.
+     */
+    tileUrls?: string[];
+    className?: string;
+};
+declare function MenuHubHero({ kicker, kickerIcon, headline, body, figures, proof, proofIcon, action, backgroundUrl, tileUrls, className, }: MenuHubHeroProps): react_jsx_runtime.JSX.Element;
+
+export { MenuHubHero, type MenuHubHeroFigure, type MenuHubHeroProps };

package/dist/components/menu-hub-hero.js

@@ -0,0 +1,103 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var TEXTURE_CELLS = 28;
+function MenuHubHero({
+  kicker,
+  kickerIcon,
+  headline,
+  body,
+  figures,
+  proof,
+  proofIcon,
+  action,
+  backgroundUrl,
+  tileUrls,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "relative flex min-h-[260px] overflow-hidden rounded-[20px] bg-[oklch(0.21_0.012_55)] lg:min-h-[440px]",
+        className
+      ),
+      children: [
+        backgroundUrl ? (
+          // eslint-disable-next-line @next/next/no-img-element
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: backgroundUrl,
+              alt: "",
+              "aria-hidden": true,
+              className: "absolute inset-0 h-full w-full object-cover opacity-[0.42]"
+            }
+          )
+        ) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "absolute inset-0 grid auto-rows-fr grid-cols-4 gap-0.5 lg:grid-cols-7",
+            children: Array.from({ length: TEXTURE_CELLS }, (_, cell) => {
+              const url = (tileUrls == null ? void 0 : tileUrls.length) ? tileUrls[cell % tileUrls.length] : void 0;
+              return url ? (
+                // eslint-disable-next-line @next/next/no-img-element
+                /* @__PURE__ */ jsx(
+                  "img",
+                  {
+                    src: url,
+                    alt: "",
+                    loading: "lazy",
+                    decoding: "async",
+                    className: "h-full w-full object-cover"
+                  },
+                  cell
+                )
+              ) : /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "bg-[repeating-linear-gradient(135deg,oklch(0.6_0.02_55)_0_9px,oklch(0.68_0.016_58)_9px_18px)] opacity-[0.42]"
+                },
+                cell
+              );
+            })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: cn(
+              "absolute inset-0",
+              (tileUrls == null ? void 0 : tileUrls.length) || backgroundUrl ? "bg-[linear-gradient(100deg,oklch(0.16_0.012_55_/_0.96)_0%,oklch(0.16_0.012_55_/_0.88)_52%,oklch(0.16_0.012_55_/_0.72)_100%)]" : "bg-[linear-gradient(100deg,oklch(0.18_0.012_55_/_0.95)_0%,oklch(0.18_0.012_55_/_0.72)_52%,oklch(0.18_0.012_55_/_0.3)_100%)]"
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "relative z-[1] flex w-full flex-col justify-center gap-3 p-5 text-white lg:gap-4 lg:px-12 lg:py-11", children: [
+          kicker && /* @__PURE__ */ jsxs("span", { className: "inline-flex w-max items-center gap-[7px] rounded-full bg-white/15 px-3 py-1.5 text-[11px] font-extrabold tracking-[0.11em]", children: [
+            kickerIcon,
+            kicker
+          ] }),
+          /* @__PURE__ */ jsx("h1", { className: "max-w-[640px] font-serif text-[32px] font-semibold leading-[1.04] tracking-[-0.025em] lg:text-[50px]", children: headline }),
+          body && /* @__PURE__ */ jsx("p", { className: "hidden max-w-[540px] text-sm leading-[1.6] opacity-[0.84] lg:block lg:text-[15.5px]", children: body }),
+          figures && figures.length > 0 && // Two by two on the phone: four figures in one row wrapped to three and an orphan.
+          /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-x-6 gap-y-3 pt-3 lg:flex lg:flex-wrap lg:gap-x-8 lg:gap-y-4 lg:pt-1.5", children: figures.map((figure) => /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { className: "text-2xl font-black leading-none tracking-[-0.03em] tabular-nums lg:text-[32px]", children: figure.value }),
+            /* @__PURE__ */ jsx("div", { className: "mt-[5px] text-xs opacity-[0.72]", children: figure.label })
+          ] }, figure.label)) }),
+          (proof || action) && /* @__PURE__ */ jsxs("div", { className: "mt-auto flex flex-wrap items-center gap-3 pt-5", children: [
+            proof && /* @__PURE__ */ jsxs("span", { className: "inline-flex min-h-11 items-center gap-2.5 rounded-full bg-white/10 px-4 py-2 text-[13px] backdrop-blur-[6px]", children: [
+              proofIcon,
+              proof
+            ] }),
+            action
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+export { MenuHubHero };

package/dist/components/menu-intent-tiles.d.ts

@@ -0,0 +1,31 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MenuIntentTile, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
+import 'react';
+import './place-types.js';
+
+/**
+ * MenuIntentTiles — the sentence people arrive with, as six coloured tiles.
+ *
+ * An intent is a family plus a constraint: Italian *tonight*, burgers, coffee.
+ * Each tile is a destination, so `href` is required on the view model — a
+ * category page that does not exist is filtered out by the caller rather than
+ * rendered as a tile that links nowhere. Roughly thirty-two of thirty-eight
+ * cuisines have a page, so that case is normal, not exceptional.
+ *
+ * The icon is a watermark bleeding off the bottom-right corner at low opacity,
+ * not a badge: it gives the tile a silhouette to be recognised by in a rail
+ * without competing with the label. It is `aria-hidden` — the label already
+ * says what the tile is.
+ *
+ * Server-safe.
+ */
+/** @deprecated Alias of `MenuLinkProps`; kept so existing imports keep working. */
+type MenuIntentTilesLinkProps = MenuLinkProps;
+type MenuIntentTilesProps = {
+    tiles: MenuIntentTile[];
+    linkComponent?: MenuLinkComponent;
+    className?: string;
+};
+declare function MenuIntentTiles({ tiles, linkComponent: LinkComponent, className, }: MenuIntentTilesProps): react_jsx_runtime.JSX.Element;
+
+export { MenuIntentTiles, type MenuIntentTilesLinkProps, type MenuIntentTilesProps };

package/dist/components/menu-intent-tiles.js

@@ -0,0 +1,50 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { ChevronRight } from 'lucide-react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function DefaultLink(_a) {
+  var _b = _a, { href } = _b, props = __objRest(_b, ["href"]);
+  return /* @__PURE__ */ jsx("a", __spreadValues({ href }, props));
+}
+function MenuIntentTiles({
+  tiles,
+  linkComponent: LinkComponent = DefaultLink,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "grid grid-cols-2 gap-3 lg:grid-cols-6 lg:gap-3.5",
+        className
+      ),
+      children: tiles.map((tile) => /* @__PURE__ */ jsxs(
+        LinkComponent,
+        {
+          href: tile.href,
+          className: "relative flex min-h-[110px] flex-col overflow-hidden rounded-2xl bg-muted p-3.5 text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 lg:min-h-[124px] lg:px-3.5 lg:pb-3.5 lg:pt-[15px]",
+          style: tile.gradient ? { backgroundImage: tile.gradient } : void 0,
+          children: [
+            tile.icon && /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": true,
+                className: "pointer-events-none absolute -bottom-2.5 -right-1.5 z-0 opacity-[0.22] [&>svg]:h-[62px] [&>svg]:w-[62px]",
+                children: tile.icon
+              }
+            ),
+            /* @__PURE__ */ jsxs("span", { className: "relative z-[1] flex h-full flex-col", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-[14.5px] font-extrabold leading-[1.2] tracking-[-0.015em]", children: tile.label }),
+              tile.caption && /* @__PURE__ */ jsx("span", { className: "mt-[3px] text-[11.5px] leading-[1.35]", children: tile.caption }),
+              /* @__PURE__ */ jsx(ChevronRight, { className: "mt-auto h-4 w-4 opacity-85", "aria-hidden": true })
+            ] })
+          ]
+        },
+        tile.slug
+      ))
+    }
+  );
+}
+
+export { MenuIntentTiles };