@bearmenu/ui 0.8.8 → 0.8.9

package/dist/components/venue-signature-block.d.ts

@@ -0,0 +1,39 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MenuItemLabels, MenuItemLinkProps } from './menu-item.js';
+import { MenuItemPreview } from './menu-types.js';
+import 'react';
+import './place-types.js';
+
+/**
+ * VenueSignatureBlock — "what it is known for": the one dish or drink a venue's
+ * reviews single out, on a tinted band.
+ *
+ * ## It is a `<MenuItem>` with a kicker
+ *
+ * It used to be its own layout — swatch, label, name, price, all hand-placed —
+ * and it drifted from the row every other surface renders. It is now the
+ * production row on an accent ground, so a dish looks like itself here, in the
+ * "known for" list, and on the venue's own menu.
+ *
+ * The kicker sits ABOVE the row rather than inside it. Inline at 9.5px it
+ * competed with the dish name for the same line, which is how it ended up
+ * stacked one word per line.
+ */
+type VenueSignatureBlockProps = {
+    item: MenuItemPreview;
+    labels: MenuItemLabels;
+    formatPrice: (amount: number) => string;
+    formatCount?: (value: number) => string;
+    /** Small caps kicker, e.g. "WHAT IT IS KNOWN FOR". */
+    kicker: string;
+    /** The row's category mark, as a CSS `background-image` value. */
+    markGradient?: string;
+    /** Reviewers' reason, in place of the item description. */
+    subtitle?: string;
+    href?: string;
+    linkComponent?: React.ComponentType<MenuItemLinkProps>;
+    className?: string;
+};
+declare function VenueSignatureBlock({ item, labels, formatPrice, formatCount, kicker, markGradient, subtitle, href, linkComponent, className, }: VenueSignatureBlockProps): react_jsx_runtime.JSX.Element;
+
+export { VenueSignatureBlock, type VenueSignatureBlockProps };

package/dist/components/venue-signature-block.js

@@ -0,0 +1,6 @@
+export { VenueSignatureBlock } from '../chunk-THOVPZNN.js';
+import '../chunk-TH6W2PWG.js';
+import '../chunk-Q6QH52LJ.js';
+import '../chunk-UKBNQO6Q.js';
+import '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';

package/dist/components/venue-spotlight.d.ts

@@ -0,0 +1,74 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { VenueGradeDimensionKey } from './venue-grade-dimensions.js';
+import { MenuItemLabels } from './menu-item.js';
+import { MenuVenueSignature, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
+import { PlacePreview, CitedText } from './place-types.js';
+import 'react';
+
+/**
+ * VenueSpotlight — one venue given real space: photograph, what it is known
+ * for, what reviewers say, how it grades, and when it fills up.
+ *
+ * The photograph IS the point of this surface. It is the one module on a menu
+ * hub that shows an image, and it can, because venue photography is real and
+ * licensed where item photography is generated. Absent a photo it degrades to
+ * the same diagonal texture the hero uses, never to a bare icon.
+ *
+ * ## Composed from exported parts
+ *
+ * `VenueSignatureBlock`, `VenueQuotes`, `VenueGradeDimensions` and
+ * `VenueBusynessStrip` are each exported on their own. This composite is the
+ * arrangement the hub wants; a consumer filming a single panel, or building a
+ * narrower variant, takes the parts instead. Everything here is layout — no
+ * part is reachable only through the composite.
+ *
+ * No directive: it renders on the server unless `onCite` is passed through to
+ * the quotes.
+ */
+/** @deprecated Alias of `MenuLinkProps`; kept so existing imports keep working. */
+type VenueSpotlightLinkProps = MenuLinkProps;
+type VenueSpotlightLabels = {
+    /** Overlay on the photograph, e.g. "venue photograph". */
+    photoCredit?: string;
+    /** Composed open state, e.g. "Kitchen open until 23:00". Absent when closed or unknown. */
+    openUntil?: string;
+    /** Kicker over the signature, e.g. "WHAT IT IS KNOWN FOR". */
+    signatureKicker: string;
+    /** Composed review count, e.g. "318 reviews". */
+    reviewCount?: string;
+    /** Dimension key → translated label. */
+    dimensions: Partial<Record<VenueGradeDimensionKey, string>>;
+    /** Tag code → translated label. Missing codes render the raw code. */
+    tags?: Record<string, string>;
+    /** Composed value verdict, e.g. "Good value". */
+    valueVerdict?: string;
+    /** Composed busyness sentence. */
+    busyness?: string;
+    /** Accessible name for a quote's cite action. */
+    cite?: (reviewCount: number) => string;
+};
+type VenueSpotlightProps = {
+    place: PlacePreview;
+    href: string;
+    labels: VenueSpotlightLabels;
+    /** Composed meta line, e.g. "pub · Centru". Clause order is locale-dependent. */
+    meta?: string;
+    signature?: MenuVenueSignature;
+    /** CSS gradient for the signature swatch. */
+    signatureGradient?: string;
+    /** Passed through to the signature `<MenuItem>`. */
+    itemLabels: MenuItemLabels;
+    formatPrice: (amount: number) => string;
+    formatCount?: (value: number) => string;
+    /** 0–100 → display numeral for the dimension bars. */
+    formatScore: (value: number) => string;
+    /** Opens the reviews behind a quote. */
+    onCite?: (quote: CitedText) => void;
+    /** The action in the footer — pass a rendered link or button. */
+    action?: React.ReactNode;
+    linkComponent?: MenuLinkComponent;
+    className?: string;
+};
+declare function VenueSpotlight({ place, href, labels, meta, signature, signatureGradient, itemLabels, formatPrice, formatCount, formatScore, onCite, action, linkComponent: LinkComponent, className, }: VenueSpotlightProps): react_jsx_runtime.JSX.Element;
+
+export { VenueSpotlight, type VenueSpotlightLabels, type VenueSpotlightLinkProps, type VenueSpotlightProps };

package/dist/components/venue-spotlight.js

@@ -0,0 +1,138 @@
+import { VenueGradeDimensions } from '../chunk-AXV5O2IZ.js';
+import { VenueQuotes } from '../chunk-62ES6N32.js';
+import { VenueSignatureBlock } from '../chunk-THOVPZNN.js';
+import { Separator } from '../chunk-WSRWFA6K.js';
+import '../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 { Camera, Star } 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 QUOTE_LIMIT = 2;
+function VenueSpotlight({
+  place,
+  href,
+  labels,
+  meta,
+  signature,
+  signatureGradient,
+  itemLabels,
+  formatPrice,
+  formatCount,
+  formatScore,
+  onCite,
+  action,
+  linkComponent: LinkComponent = DefaultLink,
+  className
+}) {
+  var _a, _b, _c;
+  const digest = place.reviews_digest;
+  const tags = (_a = digest == null ? void 0 : digest.tags) != null ? _a : [];
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "grid overflow-hidden rounded-[18px] border border-border bg-card lg:grid-cols-[404px_1fr]",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "relative min-h-[220px] bg-[repeating-linear-gradient(135deg,oklch(0.76_0.02_55)_0_10px,oklch(0.83_0.013_58)_10px_20px)] lg:min-h-[340px]", children: [
+          place.thumbnail_url && // eslint-disable-next-line @next/next/no-img-element
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: place.thumbnail_url,
+              alt: place.name,
+              className: "absolute inset-0 h-full w-full object-cover"
+            }
+          ),
+          labels.photoCredit && /* @__PURE__ */ jsxs("span", { className: "absolute left-3.5 top-3.5 inline-flex h-7 items-center gap-1.5 rounded-full bg-black/60 px-2.5 text-[11px] font-bold text-white", children: [
+            /* @__PURE__ */ jsx(Camera, { className: "h-2.5 w-2.5", "aria-hidden": true }),
+            labels.photoCredit
+          ] }),
+          labels.openUntil && /* @__PURE__ */ jsxs("span", { className: "absolute bottom-3.5 left-3.5 inline-flex h-[30px] items-center gap-[7px] rounded-full bg-background px-3 text-[11.5px] font-bold text-[var(--free,currentColor)]", children: [
+            /* @__PURE__ */ jsx("i", { className: "h-[7px] w-[7px] rounded-full bg-current", "aria-hidden": true }),
+            labels.openUntil
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3.5 p-4 lg:p-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("h3", { className: "min-w-0 flex-1 basis-0 font-serif text-xl font-semibold leading-tight tracking-[-0.02em] lg:text-[28px]", children: /* @__PURE__ */ jsx(
+              LinkComponent,
+              {
+                href,
+                className: "rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: place.name
+              }
+            ) }),
+            place.rating && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-baseline gap-1.5", children: [
+              /* @__PURE__ */ jsx("b", { className: "text-xl font-extrabold tabular-nums lg:text-2xl", children: place.rating.rating }),
+              /* @__PURE__ */ jsx(Star, { className: "h-3 w-3 self-center text-muted-foreground", "aria-hidden": true })
+            ] })
+          ] }),
+          (meta || labels.reviewCount) && /* @__PURE__ */ jsxs("div", { className: "-mt-2 flex flex-wrap items-center gap-x-2 gap-y-0.5 text-[12.5px] text-muted-foreground", children: [
+            meta && /* @__PURE__ */ jsx("span", { children: meta }),
+            meta && labels.reviewCount && /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\xB7" }),
+            labels.reviewCount && /* @__PURE__ */ jsx("span", { children: labels.reviewCount })
+          ] }),
+          signature && /* @__PURE__ */ jsx(
+            VenueSignatureBlock,
+            {
+              item: signature.item,
+              labels: itemLabels,
+              formatPrice,
+              formatCount,
+              kicker: labels.signatureKicker,
+              markGradient: signatureGradient,
+              subtitle: signature.why,
+              href: signature.href,
+              linkComponent: LinkComponent
+            }
+          ),
+          (digest == null ? void 0 : digest.highlights) && /* @__PURE__ */ jsx(
+            VenueQuotes,
+            {
+              quotes: digest.highlights,
+              limit: QUOTE_LIMIT,
+              onCite,
+              citeLabel: labels.cite
+            }
+          ),
+          ((_b = digest == null ? void 0 : digest.grade) == null ? void 0 : _b.dimensions) && /* @__PURE__ */ jsx(Separator, {}),
+          ((_c = digest == null ? void 0 : digest.grade) == null ? void 0 : _c.dimensions) && /* @__PURE__ */ jsx(
+            VenueGradeDimensions,
+            {
+              dimensions: digest.grade.dimensions,
+              labels: labels.dimensions,
+              formatScore,
+              className: "mt-1"
+            }
+          ),
+          (labels.valueVerdict || tags.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+            labels.valueVerdict && /* @__PURE__ */ jsx("span", { className: "inline-flex h-[26px] items-center gap-1.5 rounded-full bg-accent-subtle px-2.5 text-[11.5px] font-bold text-accent", children: labels.valueVerdict }),
+            tags.map((tag) => {
+              var _a2, _b2;
+              return /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "inline-flex h-[26px] items-center rounded-full border border-border px-2.5 text-[11.5px] text-muted-foreground",
+                  children: (_b2 = (_a2 = labels.tags) == null ? void 0 : _a2[tag.value]) != null ? _b2 : tag.value
+                },
+                tag.value
+              );
+            })
+          ] }),
+          action && /* @__PURE__ */ jsx("div", { className: "mt-auto flex justify-end pt-1", children: action })
+        ] })
+      ]
+    }
+  );
+}
+
+export { VenueSpotlight };

package/dist/components/venue-wall.d.ts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MenuLinkComponent, MenuLinkProps } from './menu-types.js';
+import { PlacePreview } from './place-types.js';
+import 'react';
+
+/**
+ * VenueWall — the catalogue's scale, stated as a row of the venues in it.
+ *
+ * A closing beat rather than a browse surface: the avatars are named and
+ * linked, but the module's job is to make "we read every menu in the city"
+ * land as something specific. It shows a handful and counts the rest, because
+ * a wall long enough to be exhaustive stops reading as places.
+ *
+ * Server-safe.
+ */
+/** @deprecated Alias of `MenuLinkProps`; kept so existing imports keep working. */
+type VenueWallLinkProps = MenuLinkProps;
+type VenueWallProps = {
+    places: PlacePreview[];
+    /** Destination per place, keyed by slug. Without one an avatar is inert. */
+    hrefs?: Record<string, string>;
+    kicker?: string;
+    kickerIcon?: React.ReactNode;
+    headline?: string;
+    body?: string;
+    /** Composed overflow chip, e.g. "+393 more". */
+    overflowLabel?: string;
+    /**
+     * Tiles for the mosaic ground — the same licensed stills the hero uses.
+     * Without them the wall falls back to the flat diagonal texture, which is
+     * the degraded state rather than the design.
+     */
+    tileUrls?: string[];
+    /** The action — pass a rendered link or button. */
+    action?: React.ReactNode;
+    className?: string;
+    linkComponent?: MenuLinkComponent;
+};
+declare function VenueWall({ places, hrefs, kicker, kickerIcon, headline, body, overflowLabel, tileUrls, action, linkComponent: LinkComponent, className, }: VenueWallProps): react_jsx_runtime.JSX.Element;
+
+export { VenueWall, type VenueWallLinkProps, type VenueWallProps };

package/dist/components/venue-wall.js

@@ -0,0 +1,118 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+function DefaultLink(_a) {
+  var _b = _a, { href } = _b, props = __objRest(_b, ["href"]);
+  return /* @__PURE__ */ jsx("a", __spreadValues({ href }, props));
+}
+function VenueWall({
+  places,
+  hrefs,
+  kicker,
+  kickerIcon,
+  headline,
+  body,
+  overflowLabel,
+  tileUrls,
+  action,
+  linkComponent: LinkComponent = DefaultLink,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "relative flex flex-col gap-4 overflow-hidden rounded-[20px] bg-[oklch(0.21_0.012_55)] p-5 text-white lg:p-8",
+        className
+      ),
+      children: [
+        (tileUrls == null ? void 0 : tileUrls.length) ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 grid auto-rows-fr grid-cols-4 gap-0.5 lg:grid-cols-6", children: Array.from({ length: 18 }, (_, cell) => (
+            // eslint-disable-next-line @next/next/no-img-element
+            /* @__PURE__ */ jsx(
+              "img",
+              {
+                src: tileUrls[cell % tileUrls.length],
+                alt: "",
+                loading: "lazy",
+                decoding: "async",
+                className: "h-full w-full object-cover"
+              },
+              cell
+            )
+          )) }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "aria-hidden": true,
+              className: "absolute inset-0 bg-[oklch(0.16_0.012_55_/_0.9)]"
+            }
+          )
+        ] }) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "absolute inset-0 bg-[repeating-linear-gradient(135deg,oklch(0.6_0.02_55)_0_9px,oklch(0.68_0.016_58)_9px_18px)] opacity-[0.18]"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "relative z-[1] flex flex-col gap-3", children: [
+          kicker && /* @__PURE__ */ jsxs("span", { className: "inline-flex w-max items-center gap-1.5 rounded-full bg-white/15 px-3 py-1.5 text-[11px] font-extrabold tracking-[0.11em]", children: [
+            kickerIcon,
+            kicker
+          ] }),
+          headline && /* @__PURE__ */ jsx("h3", { className: "max-w-[640px] font-serif text-[28px] font-semibold leading-[1.1] tracking-[-0.025em] lg:text-[40px]", children: headline }),
+          body && /* @__PURE__ */ jsx("p", { className: "hidden max-w-[540px] text-sm leading-[1.55] opacity-85 lg:block", children: body })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { "aria-hidden": true, className: "relative z-[1] flex items-center gap-3 lg:hidden", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex", children: places.slice(0, 5).map((place, index) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "h-9 w-9 shrink-0 overflow-hidden rounded-full bg-white/20 ring-2 ring-[oklch(0.21_0.012_55)]",
+                index > 0 && "-ml-2.5"
+              ),
+              children: place.thumbnail_url && // eslint-disable-next-line @next/next/no-img-element
+              /* @__PURE__ */ jsx("img", { src: place.thumbnail_url, alt: "", className: "h-full w-full object-cover", loading: "lazy" })
+            },
+            place.slug
+          )) }),
+          overflowLabel && /* @__PURE__ */ jsx("span", { className: "text-[13px] font-medium opacity-85", children: overflowLabel })
+        ] }),
+        /* @__PURE__ */ jsxs("ul", { className: "relative z-[1] hidden flex-wrap items-center gap-2 lg:flex", children: [
+          places.map((place) => {
+            const avatar = /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: "h-7 w-7 shrink-0 overflow-hidden rounded-full bg-white/20", children: place.thumbnail_url && // eslint-disable-next-line @next/next/no-img-element
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  src: place.thumbnail_url,
+                  alt: "",
+                  className: "h-full w-full object-cover",
+                  loading: "lazy"
+                }
+              ) }),
+              /* @__PURE__ */ jsx("span", { className: "truncate text-[12.5px] font-medium", children: place.name })
+            ] });
+            const chipClasses = "inline-flex max-w-[220px] items-center gap-2 rounded-full bg-white/10 py-1 pl-1 pr-3.5 backdrop-blur-[6px]";
+            return /* @__PURE__ */ jsx("li", { children: (hrefs == null ? void 0 : hrefs[place.slug]) ? /* @__PURE__ */ jsx(
+              LinkComponent,
+              {
+                href: hrefs[place.slug],
+                className: cn(
+                  chipClasses,
+                  "transition-colors hover:bg-white/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/60"
+                ),
+                children: avatar
+              }
+            ) : /* @__PURE__ */ jsx("span", { className: chipClasses, children: avatar }) }, place.slug);
+          }),
+          overflowLabel && /* @__PURE__ */ jsx("li", { className: "inline-flex h-9 items-center rounded-full bg-white/10 px-4 text-[12.5px] opacity-80", children: overflowLabel })
+        ] }),
+        action && /* @__PURE__ */ jsx("div", { className: "relative z-[1] mt-1", children: action })
+      ]
+    }
+  );
+}
+
+export { VenueWall };

package/dist/components/weekday-theme-banner.d.ts

@@ -0,0 +1,70 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * WeekdayThemeBanner — the day's editorial theme, with the whole week beside it.
+ *
+ * Showing all seven days is the point: a banner that only says "it is Burger
+ * Thursday" is an assertion, while one that shows Wednesday was salads and
+ * Friday is pizza reads as a standing rhythm the reader can come back for. The
+ * other six days are also the only affordance for browsing to one.
+ *
+ * ## The active day is the caller's, not the component's
+ *
+ * `activeDay` is an index into `days`, resolved by the caller from the READER's
+ * clock. Resolving it here would use the server's, and a server in UTC and a
+ * reader in Bucharest disagree about which day it is for two hours out of every
+ * twenty-four.
+ *
+ * No directive: with `dayHref` the week rail is links and renders on the
+ * server; with `onDayChange` it is buttons and needs a client caller.
+ */
+type WeekdayThemeBannerLinkProps = {
+    href: string;
+    className?: string;
+    children: React.ReactNode;
+};
+type WeekdayThemeDay = {
+    /** Short code, e.g. "THU". Already localised. */
+    code: string;
+    /** Theme name, e.g. "Burger Thursday". */
+    name: string;
+    /** Short form for the rail, e.g. "Burger". Falls back to `name`. */
+    shortName?: string;
+    /** Items under the theme. Omit where there is no count to show. */
+    count?: number;
+};
+type WeekdayThemeBannerProps = {
+    days: WeekdayThemeDay[];
+    /** Index into `days` for the reader's own today. */
+    activeDay: number;
+    /** Kicker over the title, e.g. "TODAY IS THURSDAY". Composed by the caller. */
+    kicker?: string;
+    kickerIcon?: React.ReactNode;
+    /** The banner's body copy for the active day. */
+    body?: string;
+    /** Heading over the week rail, e.g. "THE WEEK". */
+    weekLabel?: string;
+    /** The primary action — pass a rendered button or link. */
+    action?: React.ReactNode;
+    /** Note beside the action, e.g. "Bruno picks nine, ranked on mentions". */
+    actionNote?: string;
+    /** Destination per day index. Renders the rail as links. */
+    dayHref?: (day: WeekdayThemeDay, index: number) => string;
+    /** Selects a day in place. Renders the rail as buttons. */
+    onDayChange?: (index: number) => void;
+    /**
+     * The day's photograph.
+     *
+     * This is the one editorial slot on a menu hub that carries a plated dish,
+     * and it can because these are art-directed assets shipped with the app, not
+     * generated item photos pulled off a menu row. Without one the banner falls
+     * back to its flat ground and still reads — but the flat version is the
+     * degraded state, not the design.
+     */
+    imageUrl?: string;
+    linkComponent?: React.ComponentType<WeekdayThemeBannerLinkProps>;
+    className?: string;
+};
+declare function WeekdayThemeBanner({ days, activeDay, kicker, kickerIcon, body, weekLabel, action, actionNote, dayHref, onDayChange, imageUrl, linkComponent: LinkComponent, className, }: WeekdayThemeBannerProps): react_jsx_runtime.JSX.Element | null;
+
+export { WeekdayThemeBanner, type WeekdayThemeBannerLinkProps, type WeekdayThemeBannerProps, type WeekdayThemeDay };

package/dist/components/weekday-theme-banner.js

@@ -0,0 +1,127 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+function DefaultLink(_a) {
+  var _b = _a, { href } = _b, props = __objRest(_b, ["href"]);
+  return /* @__PURE__ */ jsx("a", __spreadValues({ href }, props));
+}
+function WeekdayThemeBanner({
+  days,
+  activeDay,
+  kicker,
+  kickerIcon,
+  body,
+  weekLabel,
+  action,
+  actionNote,
+  dayHref,
+  onDayChange,
+  imageUrl,
+  linkComponent: LinkComponent = DefaultLink,
+  className
+}) {
+  const active = days[activeDay];
+  if (!active) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "relative grid overflow-hidden rounded-[18px] bg-[linear-gradient(120deg,oklch(0.32_0.06_45),oklch(0.24_0.04_40))] text-white lg:grid-cols-[1fr_auto]",
+        className
+      ),
+      children: [
+        imageUrl && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: imageUrl,
+              alt: "",
+              "aria-hidden": true,
+              className: "absolute inset-0 h-full w-full object-cover"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "aria-hidden": true,
+              className: "absolute inset-0 bg-[linear-gradient(100deg,oklch(0.18_0.03_45_/_0.94)_0%,oklch(0.18_0.03_45_/_0.82)_45%,oklch(0.18_0.03_45_/_0.66)_100%)]"
+            }
+          )
+        ] }),
+        !imageUrl && /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: "pointer-events-none absolute bottom-0 right-[28%] select-none font-serif text-[140px] font-bold leading-none text-white/[0.06]",
+            children: active.code
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "relative z-[1] flex flex-col gap-2.5 p-4 lg:gap-3 lg:p-6", children: [
+          kicker && /* @__PURE__ */ jsxs("span", { className: "inline-flex w-max items-center gap-1.5 rounded-full bg-white/15 px-2.5 py-1 text-[10.5px] font-bold tracking-[0.09em]", children: [
+            kickerIcon,
+            kicker
+          ] }),
+          /* @__PURE__ */ jsx("h3", { className: "font-serif text-[24px] font-semibold tracking-[-0.02em] lg:text-[36px]", children: active.name }),
+          body && /* @__PURE__ */ jsx("p", { className: "max-w-[520px] text-[13.5px] leading-[1.5] opacity-90", children: body }),
+          (action || actionNote) && /* @__PURE__ */ jsxs("div", { className: "mt-1 flex flex-wrap items-center gap-3", children: [
+            action,
+            actionNote && /* @__PURE__ */ jsx("span", { className: "text-xs opacity-75", children: actionNote })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "relative z-[1] hidden border-t border-white/15 p-4 lg:block lg:min-w-[240px] lg:border-l lg:border-t-0 lg:p-5",
+              // Over a photograph the rail needs its own ground, or seven lines of
+              // small type land on whatever the plate happens to be.
+              imageUrl && "bg-black/45 backdrop-blur-[2px]"
+            ),
+            children: [
+              weekLabel && /* @__PURE__ */ jsx("div", { className: "mb-2 text-[10px] font-bold tracking-[0.12em] opacity-70", children: weekLabel }),
+              /* @__PURE__ */ jsx("ul", { className: "grid grid-cols-2 gap-x-4 sm:grid-cols-4 lg:grid-cols-1", children: days.map((day, index) => {
+                var _a;
+                const isActive = index === activeDay;
+                const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("b", { className: "w-8 shrink-0 font-mono text-[11px] font-medium opacity-70", children: day.code }),
+                  /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: (_a = day.shortName) != null ? _a : day.name }),
+                  day.count != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 tabular-nums opacity-70", children: day.count })
+                ] });
+                const rowClasses = cn(
+                  "flex w-full items-center gap-2 rounded transition-opacity",
+                  isActive ? "-mx-1.5 bg-white/10 px-1.5 py-1.5 text-[14.5px] font-extrabold" : "py-[5px] text-[12.5px] opacity-70 hover:opacity-100"
+                );
+                return /* @__PURE__ */ jsx("li", { children: dayHref ? /* @__PURE__ */ jsx(
+                  LinkComponent,
+                  {
+                    href: dayHref(day, index),
+                    className: cn(
+                      rowClasses,
+                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/60"
+                    ),
+                    children: content
+                  }
+                ) : onDayChange ? /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-pressed": isActive,
+                    onClick: () => onDayChange(index),
+                    className: cn(
+                      rowClasses,
+                      "text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/60"
+                    ),
+                    children: content
+                  }
+                ) : /* @__PURE__ */ jsx("span", { className: rowClasses, children: content }) }, day.code);
+              }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { WeekdayThemeBanner };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bearmenu/ui",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "BearMenu design system — shared UI tokens, primitives, and components",
   "license": "UNLICENSED",
   "repository": {