@bearmenu/ui 0.8.9 → 0.8.10

package/src/components/venue-busyness-strip.tsx

@@ -1,64 +0,0 @@
-import { cn } from "../lib/utils";
-
-/**
- * VenueBusynessStrip — when a venue actually fills up, as a bar per hour.
- *
- * The API serves one score per hour of the venue's own trading day, so the
- * strip has no fixed length: a bakery closing at three and a club open until
- * four draw different numbers of bars, and padding either to 24 would put empty
- * columns under hours the venue is not open.
- *
- * The rush is derived rather than passed: bars at or above `peakRatio` of the
- * day's own maximum take the accent. A fixed score threshold would mark every
- * hour at a busy venue and none at a quiet one — busyness is only meaningful
- * relative to that venue's own day.
- *
- * `caption` is composed by the caller ("Usually not busy until 18:00 — the rush
- * is nine to eleven"), because the sentence needs the venue's clock, its locale
- * and a plural rule the DS does not own.
- *
- * Server-safe.
- */
-
-export type VenueBusynessStripProps = {
-  busyness: Array<{ hour: number; score: number }>;
-  /** Composed sentence beside the bars. */
-  caption?: string;
-  /** Share of the day's own peak at which an hour counts as the rush. */
-  peakRatio?: number;
-  className?: string;
-};
-
-const BAR_MAX_HEIGHT = 22;
-
-export function VenueBusynessStrip({
-  busyness,
-  caption,
-  peakRatio = 0.8,
-  className,
-}: VenueBusynessStripProps) {
-  if (busyness.length === 0) return null;
-
-  const peak = Math.max(...busyness.map((entry) => entry.score));
-  if (peak <= 0) return null;
-
-  return (
-    <div
-      className={cn("flex items-center gap-2.5 text-[12.5px] text-muted-foreground", className)}
-    >
-      <span aria-hidden className="flex h-[22px] items-end gap-[3px]">
-        {busyness.map(({ hour, score }) => (
-          <i
-            key={hour}
-            className={cn(
-              "w-[7px] rounded-t-sm bg-[oklch(0.88_0.02_45)]",
-              score >= peak * peakRatio && "bg-[var(--accent,currentColor)]"
-            )}
-            style={{ height: Math.max(2, Math.round((score / peak) * BAR_MAX_HEIGHT)) }}
-          />
-        ))}
-      </span>
-      {caption}
-    </div>
-  );
-}

package/src/components/venue-signature-block.stories.tsx

@@ -1,68 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { mockGradients, mockVenues } from "./menu-mocks";
-import { VenueSignatureBlock } from "./venue-signature-block";
-
-const labels = {
-  currency: "lei",
-  mentions: (count: number) => `${count} mentions`,
-  signature: "SIGNATURE",
-  mentioned: "MENTIONED",
-};
-
-const meta: Meta<typeof VenueSignatureBlock> = {
-  title: "Menu/VenueSignatureBlock",
-  component: VenueSignatureBlock,
-  tags: ["autodocs"],
-  decorators: [
-    (Story) => (
-      <div className="w-[520px] bg-background p-4">
-        <Story />
-      </div>
-    ),
-  ],
-  parameters: {
-    docs: {
-      description: {
-        component:
-          "\"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 — the same row the venue's own menu renders, so the item does not look like a different object here. The kicker sits above the row rather than inside it; inline at 9.5px it competed with the dish name for the same line.",
-      },
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof VenueSignatureBlock>;
-
-export const Default: Story = {
-  args: {
-    item: mockVenues[0].signature!.item,
-    labels,
-    formatPrice: (amount: number) => String(amount),
-    kicker: "WHAT IT IS KNOWN FOR",
-    markGradient: mockGradients.meat,
-    subtitle: mockVenues[0].signature!.why,
-    href: "/menu/dishes/chicken-wings",
-  },
-};
-
-/** A drink signature — same block, different scope. */
-export const Drink: Story = {
-  args: {
-    item: mockVenues[2].signature!.item,
-    labels,
-    formatPrice: (amount: number) => String(amount),
-    kicker: "WHAT THEY POUR",
-    markGradient: mockGradients.cocktail,
-  },
-};
-
-/** Inert: no `href`. Used inside a surface that is itself a link. */
-export const Static: Story = {
-  args: {
-    item: mockVenues[1].signature!.item,
-    labels,
-    formatPrice: (amount: number) => String(amount),
-    kicker: "WHAT IT IS KNOWN FOR",
-    markGradient: mockGradients.pasta,
-  },
-};

package/src/components/venue-signature-block.tsx

@@ -1,71 +0,0 @@
-import { cn } from "../lib/utils";
-import { MenuItem, type MenuItemLabels, type MenuItemLinkProps } from "./menu-item";
-import type { MenuItemPreview } from "./menu-types";
-
-/**
- * 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.
- */
-
-export 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;
-};
-
-export function VenueSignatureBlock({
-  item,
-  labels,
-  formatPrice,
-  formatCount,
-  kicker,
-  markGradient,
-  subtitle,
-  href,
-  linkComponent,
-  className,
-}: VenueSignatureBlockProps) {
-  return (
-    <div className={cn("overflow-hidden rounded-xl bg-accent-subtle py-1", className)}>
-      <span className="block px-4 pt-2 text-[9.5px] font-bold uppercase tracking-[0.09em] text-muted-foreground">
-        {kicker}
-      </span>
-
-      <MenuItem
-        item={item}
-        labels={labels}
-        formatPrice={formatPrice}
-        formatCount={formatCount}
-        markGradient={markGradient}
-        subtitle={subtitle}
-        showSignatureBadge={false}
-        href={href}
-        linkComponent={linkComponent}
-        // The band is already the emphasis; the row must not also take a hover
-        // fill inside it.
-        className="min-h-0 md:rounded-none md:hover:bg-transparent md:hover:shadow-none"
-      />
-    </div>
-  );
-}

package/src/components/venue-spotlight.stories.tsx

@@ -1,141 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { Button } from "./button";
-import { mockFormatters, mockGradients, mockPlaces, mockVenues } from "./menu-mocks";
-import { VenueSpotlight } from "./venue-spotlight";
-
-
-const itemLabels = {
-  currency: "lei",
-  mentions: (count: number) => `${count} mentions`,
-  signature: "SIGNATURE",
-  mentioned: "MENTIONED",
-};
-const formatPrice = (amount: number) => String(amount);
-
-const labels = {
-  photoCredit: "venue photograph",
-  openUntil: "Kitchen open until 23:00",
-  signatureKicker: "WHAT IT IS KNOWN FOR",
-  reviewCount: "318 reviews",
-  dimensions: {
-    food: "Food",
-    coffee_quality: "Coffee",
-    drinks_quality: "Drinks",
-    service: "Service",
-    value: "Value",
-    ambiance: "Ambiance",
-    portion: "Portion",
-    consistency: "Consistency",
-  },
-  tags: { casual: "casual", cozy: "cozy", family_friendly: "family friendly" },
-  valueVerdict: "Good value",
-  busyness: "Usually not busy until 18:00 — the rush is seven to eight.",
-  cite: (count: number) => `Read ${count} reviews`,
-};
-
-const meta: Meta<typeof VenueSpotlight> = {
-  title: "Menu/VenueSpotlight",
-  component: VenueSpotlight,
-  tags: ["autodocs"],
-  decorators: [
-    (Story) => (
-      <div className="w-[1100px] bg-background p-4">
-        <Story />
-      </div>
-    ),
-  ],
-  parameters: {
-    docs: {
-      description: {
-        component:
-          "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 — this 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. Composed from `VenueSignatureBlock`, `VenueQuotes`, `VenueGradeDimensions` and `VenueBusynessStrip`, each exported on its own for consumers building a narrower variant.",
-      },
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof VenueSpotlight>;
-
-export const Default: Story = {
-  args: {
-    place: mockPlaces[0],
-    href: mockVenues[0].href,
-    labels,
-    meta: "pub · Centru · 318 reviews read",
-    signature: mockVenues[0].signature,
-    signatureGradient: mockGradients.meat,
-    formatScore: mockFormatters.score,
-    itemLabels,
-    formatPrice,
-    action: <Button size="sm">Open the menu</Button>,
-  },
-};
-
-/** A coffee bar: no food dimension, and a `frequent` signature rather than a signature one. */
-export const CoffeeBar: Story = {
-  args: {
-    place: mockPlaces[2],
-    href: mockVenues[2].href,
-    labels: { ...labels, openUntil: "Open until 20:00", reviewCount: "96 reviews" },
-    meta: "coffee · Centru",
-    signature: mockVenues[2].signature,
-    signatureGradient: mockGradients.sweet,
-    formatScore: mockFormatters.score,
-    itemLabels,
-    formatPrice,
-  },
-};
-
-/**
- * A venue the review census has not reached: no digest at all. Every block that
- * depends on one drops out and the card still reads as a venue.
- */
-export const WithoutDigest: Story = {
-  args: {
-    place: mockPlaces[3],
-    href: mockVenues[3].href,
-    labels: { ...labels, openUntil: undefined, reviewCount: "141 reviews" },
-    meta: "restaurant · Mărăști",
-    formatScore: mockFormatters.score,
-    itemLabels,
-    formatPrice,
-  },
-};
-
-/** Quotes wired to their evidence. Needs a client caller. */
-export const CitableQuotes: Story = {
-  args: {
-    place: mockPlaces[0],
-    href: mockVenues[0].href,
-    labels,
-    meta: "pub · Centru",
-    signature: mockVenues[0].signature,
-    signatureGradient: mockGradients.meat,
-    formatScore: mockFormatters.score,
-    itemLabels,
-    formatPrice,
-    onCite: () => {},
-  },
-};
-
-export const Mobile: Story = {
-  args: {
-    place: mockPlaces[0],
-    href: mockVenues[0].href,
-    labels,
-    meta: "pub · Centru",
-    signature: mockVenues[0].signature,
-    signatureGradient: mockGradients.meat,
-    formatScore: mockFormatters.score,
-    itemLabels,
-    formatPrice,
-  },
-  decorators: [
-    (Story) => (
-      <div className="w-[390px] bg-background p-3">
-        <Story />
-      </div>
-    ),
-  ],
-};

package/src/components/venue-spotlight.tsx

@@ -1,236 +0,0 @@
-import { Camera, Star } from "lucide-react";
-import { cn } from "../lib/utils";
-import { Separator } from "./separator";
-import { VenueGradeDimensions, type VenueGradeDimensionKey } from "./venue-grade-dimensions";
-import { VenueQuotes } from "./venue-quotes";
-import { VenueSignatureBlock } from "./venue-signature-block";
-import type { MenuItemLabels } from "./menu-item";
-import type { MenuVenueSignature, MenuLinkProps, MenuLinkComponent } from "./menu-types";
-import type { CitedText, PlacePreview } from "./place-types";
-
-/**
- * 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. */
-export type VenueSpotlightLinkProps = MenuLinkProps;
-
-function DefaultLink({ href, ...props }: VenueSpotlightLinkProps) {
-  return <a href={href} {...props} />;
-}
-
-export 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;
-};
-
-export 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;
-};
-
-/** Quotes are capped at two: a third pushes the grade row below the fold on a phone. */
-const QUOTE_LIMIT = 2;
-
-export function VenueSpotlight({
-  place,
-  href,
-  labels,
-  meta,
-  signature,
-  signatureGradient,
-  itemLabels,
-  formatPrice,
-  formatCount,
-  formatScore,
-  onCite,
-  action,
-  linkComponent: LinkComponent = DefaultLink,
-  className,
-}: VenueSpotlightProps) {
-  const digest = place.reviews_digest;
-  const tags = digest?.tags ?? [];
-
-  return (
-    <div
-      className={cn(
-        "grid overflow-hidden rounded-[18px] border border-border bg-card lg:grid-cols-[404px_1fr]",
-        className
-      )}
-    >
-      <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]">
-        {place.thumbnail_url && (
-          // eslint-disable-next-line @next/next/no-img-element
-          <img
-            src={place.thumbnail_url}
-            alt={place.name}
-            className="absolute inset-0 h-full w-full object-cover"
-          />
-        )}
-
-        {labels.photoCredit && (
-          <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">
-            <Camera className="h-2.5 w-2.5" aria-hidden />
-            {labels.photoCredit}
-          </span>
-        )}
-
-        {labels.openUntil && (
-          <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)]">
-            <i className="h-[7px] w-[7px] rounded-full bg-current" aria-hidden />
-            {labels.openUntil}
-          </span>
-        )}
-      </div>
-
-      <div className="flex flex-col gap-3.5 p-4 lg:p-6">
-        {/*
-          `items-baseline` and a hard `shrink-0` on the rating: the venue name
-          is a long serif line that wraps, and with `items-start` the numeral
-          floated beside its second line instead of sitting on the first. The
-          name column also needs `min-w-0` AND `basis-0` — without the basis a
-          long unbroken word (a venue called "Tortelli Pasta Bar") refuses to
-          wrap and pushes the rating off the card.
-        */}
-        <div className="flex items-baseline justify-between gap-3">
-          <h3 className="min-w-0 flex-1 basis-0 font-serif text-xl font-semibold leading-tight tracking-[-0.02em] lg:text-[28px]">
-            <LinkComponent
-              href={href}
-              className="rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-            >
-              {place.name}
-            </LinkComponent>
-          </h3>
-
-          {place.rating && (
-            <div className="flex shrink-0 items-baseline gap-1.5">
-              <b className="text-xl font-extrabold tabular-nums lg:text-2xl">
-                {place.rating.rating}
-              </b>
-              <Star className="h-3 w-3 self-center text-muted-foreground" aria-hidden />
-            </div>
-          )}
-        </div>
-
-        {(meta || labels.reviewCount) && (
-          <div className="-mt-2 flex flex-wrap items-center gap-x-2 gap-y-0.5 text-[12.5px] text-muted-foreground">
-            {meta && <span>{meta}</span>}
-            {meta && labels.reviewCount && <span aria-hidden>·</span>}
-            {labels.reviewCount && <span>{labels.reviewCount}</span>}
-          </div>
-        )}
-
-        {signature && (
-          <VenueSignatureBlock
-            item={signature.item}
-            labels={itemLabels}
-            formatPrice={formatPrice}
-            formatCount={formatCount}
-            kicker={labels.signatureKicker}
-            markGradient={signatureGradient}
-            subtitle={signature.why}
-            href={signature.href}
-            linkComponent={LinkComponent}
-          />
-        )}
-
-        {digest?.highlights && (
-          <VenueQuotes
-            quotes={digest.highlights}
-            limit={QUOTE_LIMIT}
-            onCite={onCite}
-            citeLabel={labels.cite}
-          />
-        )}
-
-        {digest?.grade?.dimensions && <Separator />}
-
-        {digest?.grade?.dimensions && (
-          <VenueGradeDimensions
-            dimensions={digest.grade.dimensions}
-            labels={labels.dimensions}
-            formatScore={formatScore}
-            className="mt-1"
-          />
-        )}
-
-        {(labels.valueVerdict || tags.length > 0) && (
-          <div className="flex flex-wrap items-center gap-2">
-            {labels.valueVerdict && (
-              <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">
-                {labels.valueVerdict}
-              </span>
-            )}
-            {tags.map((tag) => (
-              <span
-                key={tag.value}
-                className="inline-flex h-[26px] items-center rounded-full border border-border px-2.5 text-[11.5px] text-muted-foreground"
-              >
-                {labels.tags?.[tag.value] ?? tag.value}
-              </span>
-            ))}
-          </div>
-        )}
-
-        {/* No busyness strip here. Twelve unlabelled bars under a grade row
-            read as a second, unexplained chart — nobody could tell what they
-            measured without the sentence beside them, and the sentence does not
-            fit on this card. `<VenueBusynessStrip>` still exists and belongs on
-            the venue's own page, where it has room to be captioned. */}
-
-        {action && <div className="mt-auto flex justify-end pt-1">{action}</div>}
-      </div>
-    </div>
-  );
-}

package/dist/{chunk-XWMRABZW.js → chunk-HSIYYA2E.js}

@@ -1,6 +1,6 @@
 import { PlaceScheduleWeek } from './chunk-VG3PND3D.js';
-import { Separator } from './chunk-WSRWFA6K.js';
 import { Tag } from './chunk-ZDAHKI3A.js';
+import { Separator } from './chunk-WSRWFA6K.js';
 import { Text } from './chunk-7BWTYWM3.js';
 import { cn } from './chunk-FEK5XGZW.js';
 import { __spreadProps, __spreadValues } from './chunk-3GWWZKX7.js';