@bearmenu/ui 0.8.49 → 0.8.50

package/dist/{chunk-QY66ME5B.js → chunk-CZ2HC7WY.js}

@@ -1,8 +1,10 @@
+import { GradeAtom } from './chunk-YE4ZQUTI.js';
+import { showsGradeAtom } from './chunk-I5V446BX.js';
 import { Separator } from './chunk-NWZGSLPU.js';
 import { Skeleton } from './chunk-XBBEX4SF.js';
 import { cn } from './chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from './chunk-MMUBH76A.js';
-import { Star, Clock, Check, MessageSquare, ChevronRight } from 'lucide-react';
+import { Clock, Check, MessageSquare, ChevronRight, Star } from 'lucide-react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 function DefaultLink(_a) {
@@ -41,6 +43,25 @@ function MenuKitchenList({
     )
   ] });
 }
+function gradeShown(place, labels) {
+  var _a;
+  return labels.grade !== void 0 && showsGradeAtom((_a = place.reviews_digest) == null ? void 0 : _a.grade, "xs");
+}
+function KitchenRating({
+  place,
+  labels
+}) {
+  var _a;
+  const grade = (_a = place.reviews_digest) == null ? void 0 : _a.grade;
+  if (labels.grade && showsGradeAtom(grade, "xs")) {
+    return /* @__PURE__ */ jsx(GradeAtom, { grade, labels: labels.grade, size: "xs", className: "shrink-0" });
+  }
+  if (!place.rating) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Star, { className: "h-[11px] w-[11px] shrink-0", "aria-hidden": true }),
+    place.rating.rating
+  ] });
+}
 function KitchenRow({
   kitchen,
   labels,
@@ -99,11 +120,8 @@ function KitchenRow({
             children: [
               /* @__PURE__ */ jsx("span", { className: "truncate text-[14.5px] font-bold tracking-[-0.01em] lg:line-clamp-2 lg:whitespace-normal lg:text-[15.5px] lg:leading-tight", children: place.name }),
               /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 truncate text-xs text-muted-foreground", children: [
-                place.rating && /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Star, { className: "h-[11px] w-[11px] shrink-0", "aria-hidden": true }),
-                  place.rating.rating,
-                  kitchen.metaLabel && " \xB7 "
-                ] }),
+                /* @__PURE__ */ jsx(KitchenRating, { place, labels }),
+                kitchen.metaLabel && (gradeShown(place, labels) || place.rating) && " \xB7 ",
                 kitchen.metaLabel
               ] }),
               kitchen.hoursLabel && /* @__PURE__ */ jsxs(

package/dist/components/alert.d.ts

@@ -3,10 +3,10 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const alertVariants: (props?: ({
-    variant?: "success" | "warning" | "default" | "destructive" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
-    variant?: "success" | "warning" | "default" | "destructive" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
 declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;

package/dist/components/avatar.d.ts

@@ -5,13 +5,13 @@ import { VariantProps } from 'class-variance-authority';
 
 declare const avatarVariants: (props?: ({
     size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
-    tone?: "brown" | "muted" | "teal" | "green" | "blue" | "violet" | "rose" | null | undefined;
+    tone?: "muted" | "brown" | "teal" | "green" | "blue" | "violet" | "rose" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type AvatarSize = NonNullable<VariantProps<typeof avatarVariants>["size"]>;
 type AvatarTone = NonNullable<VariantProps<typeof avatarVariants>["tone"]>;
 declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & VariantProps<(props?: ({
     size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
-    tone?: "brown" | "muted" | "teal" | "green" | "blue" | "violet" | "rose" | null | undefined;
+    tone?: "muted" | "brown" | "teal" | "green" | "blue" | "violet" | "rose" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLSpanElement>>;
 declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
 declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/badge.d.ts

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const badgeVariants: (props?: ({
-    variant?: "secondary" | "success" | "warning" | "default" | "destructive" | "outline" | "glass" | "overlay" | "brown" | "code" | "onPrimary" | "confirmed" | "pending" | "completed" | "assignee" | "softSuccess" | "softWarning" | "softDestructive" | "softNeutral" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | "secondary" | "outline" | "glass" | "overlay" | "brown" | "code" | "onPrimary" | "confirmed" | "pending" | "completed" | "assignee" | "softSuccess" | "softWarning" | "softDestructive" | "softNeutral" | null | undefined;
     size?: "status" | "chip" | null | undefined;
     live?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;

package/dist/components/banner.d.ts

@@ -31,7 +31,7 @@ import { VariantProps } from 'class-variance-authority';
  * right edge, centred on the text, and never wraps under it.
  */
 declare const bannerVariants: (props?: ({
-    tone?: "warning" | "destructive" | "info" | null | undefined;
+    tone?: "destructive" | "warning" | "info" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type BannerProps = Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & VariantProps<typeof bannerVariants> & {
     /**

package/dist/components/button.d.ts

@@ -3,8 +3,8 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "secondary" | "warning" | "default" | "destructive" | "outline" | "ghost" | "glass" | "overlay" | "ink" | "brown" | "cta" | null | undefined;
-    size?: "icon" | "default" | "cta" | "xs" | "sm" | "lg" | "pill" | "cta-sm" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "link" | "secondary" | "outline" | "ghost" | "glass" | "overlay" | "ink" | "brown" | "cta" | null | undefined;
+    size?: "default" | "icon" | "cta" | "xs" | "sm" | "lg" | "pill" | "cta-sm" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
     fullWidth?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/card.d.ts

@@ -3,12 +3,12 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const cardVariants: (props?: ({
-    variant?: "outline" | "glass" | "section" | "muted" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
+    variant?: "muted" | "outline" | "glass" | "section" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
     interactive?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
-    variant?: "outline" | "glass" | "section" | "muted" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
+    variant?: "muted" | "outline" | "glass" | "section" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
     interactive?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/command.d.ts

@@ -28,7 +28,7 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "onChange" | "type"> & {
+}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "value" | "type"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
@@ -64,7 +64,7 @@ declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "value" | "heading"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "heading" | "value"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
@@ -82,7 +82,7 @@ declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "value" | "onSelect" | "disabled"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "onSelect" | "value" | "disabled"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;

package/dist/components/concept-compare.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuConceptPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/doorway-tiles.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/empty-state.d.ts

@@ -53,7 +53,7 @@ interface EmptyStateProps {
  * louder than a load failure the user can retry.
  */
 declare const EmptyState: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<HTMLDivElement>>;
-declare const SearchEmptyState: React.ForwardRefExoticComponent<Omit<EmptyStateProps, "icon" | "variant"> & React.RefAttributes<HTMLDivElement>>;
-declare const ErrorEmptyState: React.ForwardRefExoticComponent<Omit<EmptyStateProps, "icon" | "variant"> & React.RefAttributes<HTMLDivElement>>;
+declare const SearchEmptyState: React.ForwardRefExoticComponent<Omit<EmptyStateProps, "variant" | "icon"> & React.RefAttributes<HTMLDivElement>>;
+declare const ErrorEmptyState: React.ForwardRefExoticComponent<Omit<EmptyStateProps, "variant" | "icon"> & React.RefAttributes<HTMLDivElement>>;
 
 export { EmptyState, ErrorEmptyState, SearchEmptyState };

package/dist/components/event-detail-panel.d.ts

@@ -1,6 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { G as GradeAtomLabels, a as PlaceGrade } from '../place-types-Dzy6FH67.js';
 import { EventPreview, EventFormatters } from './event-types.js';
+import '../lib/grade.js';
 
 /**
  * EventDetailPanel — the BODY of the event detail sheet, and the body the
@@ -51,7 +53,13 @@ type EventDetailVenue = {
     name: string;
     /** Address line, e.g. "Str. Iuliu Maniu 5". */
     address?: string;
-    /** e.g. "4.7" — rendered with a star. */
+    /**
+     * The venue's BearMenu grade. Shown as the grade pill in the rating's place
+     * when `labels.grade` is given; the star `ratingLabel` then stays only for a
+     * venue without a grade.
+     */
+    grade?: PlaceGrade;
+    /** e.g. "4.7" — Google's rating, rendered with a star. The fallback for an ungraded venue. */
     ratingLabel?: string;
     /** e.g. "open until 20:00" — appended to the meta row when given. */
     openLabel?: string;
@@ -66,6 +74,8 @@ type EventDetailVenue = {
     href?: string;
 };
 type EventDetailPanelLabels = {
+    /** The venue's grade pill. Optional: without it the venue shows the star, as before. */
+    grade?: GradeAtomLabels;
     free: string;
     liveNow: string;
     /** The ended chip, e.g. "Ended". */
@@ -208,7 +218,7 @@ type EventDetailChipRowProps = Pick<EventDetailPanelProps, "event" | "formatters
 declare function EventDetailChipRow({ event, labels, formatters, status, soonLabel, hype, tags, className, }: EventDetailChipRowProps): react_jsx_runtime.JSX.Element;
 type EventDetailVenueCardProps = {
     venue: EventDetailVenue;
-    labels: Pick<EventDetailPanelLabels, "venueNoPage">;
+    labels: Pick<EventDetailPanelLabels, "venueNoPage" | "grade">;
     linkComponent?: React.ComponentType<EventDetailPanelLinkProps>;
     /** Thumbnail size in px: 52 in the sheet, 64 on the page. */
     thumbnailSize?: 52 | 64;

package/dist/components/event-detail-panel.js

@@ -1,3 +1,5 @@
+import { GradeAtom } from '../chunk-YE4ZQUTI.js';
+import { showsGradeAtom } from '../chunk-I5V446BX.js';
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
 import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
@@ -463,7 +465,9 @@ function EventDetailVenueCard({
   action,
   className
 }) {
-  const meta = venue.href && (venue.address || venue.ratingLabel || venue.openLabel);
+  const showGrade = labels.grade !== void 0 && showsGradeAtom(venue.grade, "xs");
+  const hasRating = showGrade || Boolean(venue.ratingLabel);
+  const meta = venue.href && (venue.address || hasRating || venue.openLabel);
   const main = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(
       "div",
@@ -501,8 +505,16 @@ function EventDetailVenueCard({
       /* @__PURE__ */ jsx("div", { className: "truncate text-sm font-bold", children: venue.name }),
       venue.href ? meta && /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex flex-wrap items-center gap-x-1.5 text-xs text-muted-foreground", children: [
         venue.address && /* @__PURE__ */ jsx("span", { className: "truncate", children: venue.address }),
-        venue.address && venue.ratingLabel && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-border", children: "\xB7" }),
-        venue.ratingLabel && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1", children: [
+        venue.address && hasRating && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-border", children: "\xB7" }),
+        showGrade && labels.grade && venue.grade ? /* @__PURE__ */ jsx(
+          GradeAtom,
+          {
+            grade: venue.grade,
+            labels: labels.grade,
+            size: "xs",
+            className: "shrink-0"
+          }
+        ) : venue.ratingLabel && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1", children: [
           /* @__PURE__ */ jsx(Star, { className: "h-[11px] w-[11px]", "aria-hidden": true }),
           venue.ratingLabel
         ] }),

package/dist/components/grade-atom.d.ts

@@ -1,3 +1,3 @@
 import 'react/jsx-runtime';
 import '../lib/grade.js';
-export { G as GradeAtom, h as GradeAtomLabels, i as GradeAtomProps, j as GradeAtomSize } from '../place-types-DCVqWmk_.js';
+export { i as GradeAtom, G as GradeAtomLabels, j as GradeAtomProps, k as GradeAtomSize } from '../place-types-Dzy6FH67.js';

package/dist/components/item.d.ts

@@ -3,12 +3,12 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const itemVariants: (props?: ({
-    variant?: "default" | "outline" | "muted" | null | undefined;
+    variant?: "default" | "muted" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
     interactive?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Item: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
-    variant?: "default" | "outline" | "muted" | null | undefined;
+    variant?: "default" | "muted" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
     interactive?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & {

package/dist/components/kitchen-dossier.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 import { MenuVenueSignature, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
-import { P as PlacePreview, C as CitedText, a as PlaceGradeDimensions } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview, C as CitedText, b as PlaceGradeDimensions } from '../place-types-Dzy6FH67.js';
 import { VenueGradeDimensionKey } from './venue-grade-dimensions.js';
 import '../lib/grade.js';
 

package/dist/components/menu-dead-end.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent, MenuLoosenOption } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

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

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuKitchenListLabels } from './menu-kitchen-list.js';
 import { MenuFamilyBlockPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
-import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
+import 'react';
 
 /**
  * MenuFamilyBlock — the cuisines index's family card. One photograph is the ground.

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

@@ -1,5 +1,7 @@
-import { MenuKitchenList } from '../chunk-QY66ME5B.js';
+import { MenuKitchenList } from '../chunk-CZ2HC7WY.js';
 import { HueChip } from '../chunk-6VOWT4YR.js';
+import '../chunk-YE4ZQUTI.js';
+import '../chunk-I5V446BX.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
 import { PhotoGround, PHOTO_GROUND } from '../chunk-SWD6CJ35.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';

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

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuFamilyPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/menu-filter-chips.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuFilterChip } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/menu-group-rows.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/menu-index-header.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuIndexEntry, MenuLinkComponent } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 type MenuIndexHeaderProps = {

package/dist/components/menu-index-list.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuIndexEntry, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

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

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuIntentFigure, MenuLinkComponent } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuItemPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/menu-kitchen-list.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { G as GradeAtomLabels } from '../place-types-Dzy6FH67.js';
 import { MenuKitchenPreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
-import 'react';
-import '../place-types-DCVqWmk_.js';
 import '../lib/grade.js';
+import 'react';
 
 /**
  * MenuKitchenList — the intent page's spine.
@@ -53,6 +53,13 @@ type MenuKitchenListLabels = {
     openNow: string;
     /** Reveals the next page of rows, e.g. "Show 10 more". */
     showMore?: string;
+    /**
+     * The grade pill's labels. With them, a graded venue shows its BearMenu
+     * grade where the Google star was; the star stays only for a venue with no
+     * grade. Optional so existing callers keep compiling — without it every row
+     * shows the star, as before.
+     */
+    grade?: GradeAtomLabels;
 };
 /**
  * `wide` (default): the intent page's full-width list — from `lg` the venue

package/dist/components/menu-kitchen-list.js

@@ -1,4 +1,6 @@
-export { MenuKitchenList, MenuKitchenListSkeleton } from '../chunk-QY66ME5B.js';
+export { MenuKitchenList, MenuKitchenListSkeleton } from '../chunk-CZ2HC7WY.js';
+import '../chunk-YE4ZQUTI.js';
+import '../chunk-I5V446BX.js';
 import '../chunk-NWZGSLPU.js';
 import '../chunk-XBBEX4SF.js';
 import '../chunk-FEK5XGZW.js';

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

@@ -1,6 +1,6 @@
 import { MenuFamilyBlockPreview, MenuConceptPreview, MenuFamilyPreview, MenuFilterChip, MenuIndexEntry, MenuIntentFigure, MenuItemPreview, MenuKitchenPreview, MenuLoosenOption, QaItem, MenuVenuePreview } from './menu-types.js';
 import { DoorwayTile } from './doorway-tiles.js';
-import { P as PlacePreview } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview } from '../place-types-Dzy6FH67.js';
 import 'react';
 import 'react/jsx-runtime';
 import '../lib/grade.js';

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

@@ -1,5 +1,5 @@
 import { ComponentType, CSSProperties, ReactNode } from 'react';
-import { M as MenuSizeAndPrice, P as PlacePreview } from '../place-types-DCVqWmk_.js';
+import { M as MenuSizeAndPrice, P as PlacePreview } from '../place-types-Dzy6FH67.js';
 import 'react/jsx-runtime';
 import '../lib/grade.js';
 

package/dist/components/open-now-list.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuVenuePreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/place-about-tab.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { P as PlacePreview, b as PlaceAboutTabLabels, c as PlaceLinkKind } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview, c as PlaceAboutTabLabels, d as PlaceLinkKind } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 interface PlaceAboutTabProps {

package/dist/components/place-card.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import { ReactNode, MouseEvent } from 'react';
-import { P as PlacePreview, d as PlaceCardLabels } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview, e as PlaceCardLabels } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/place-details-mobile.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { P as PlacePreview, e as PlaceDetailsMobileLabels } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview, f as PlaceDetailsMobileLabels } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 interface PlaceDetailsMobileProps {

package/dist/components/place-schedule-week.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { f as PlaceSchedule, g as PlaceScheduleWeekLabels } from '../place-types-DCVqWmk_.js';
+import { g as PlaceSchedule, h as PlaceScheduleWeekLabels } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 interface PlaceScheduleWeekProps {

package/dist/components/place-types.d.ts

@@ -1,3 +1,3 @@
-export { C as CitedText, k as CitedValue, M as MenuSizeAndPrice, b as PlaceAboutTabLabels, d as PlaceCardLabels, e as PlaceDetailsMobileLabels, l as PlaceGrade, a as PlaceGradeDimensions, m as PlaceHourBlock, c as PlaceLinkKind, n as PlaceMustTry, P as PlacePreview, o as PlacePriceRange, p as PlaceReviewsDigest, f as PlaceSchedule, g as PlaceScheduleWeekLabels, W as WeekdayKey } from '../place-types-DCVqWmk_.js';
+export { C as CitedText, l as CitedValue, M as MenuSizeAndPrice, c as PlaceAboutTabLabels, e as PlaceCardLabels, f as PlaceDetailsMobileLabels, a as PlaceGrade, b as PlaceGradeDimensions, m as PlaceHourBlock, d as PlaceLinkKind, n as PlaceMustTry, P as PlacePreview, o as PlacePriceRange, p as PlaceReviewsDigest, g as PlaceSchedule, h as PlaceScheduleWeekLabels, W as WeekdayKey } from '../place-types-Dzy6FH67.js';
 import 'react/jsx-runtime';
 import '../lib/grade.js';

package/dist/components/qa-block.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { QaItem } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

package/dist/components/spinner.d.ts

@@ -4,11 +4,11 @@ import { VariantProps } from 'class-variance-authority';
 
 declare const spinnerVariants: (props?: ({
     size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
-    tone?: "inherit" | "primary" | "default" | "destructive" | null | undefined;
+    tone?: "default" | "destructive" | "inherit" | "primary" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Spinner: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & VariantProps<(props?: ({
     size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
-    tone?: "inherit" | "primary" | "default" | "destructive" | null | undefined;
+    tone?: "default" | "destructive" | "inherit" | "primary" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & {
     /** Visually-hidden label for screen readers. Defaults to "Loading". */
     label?: string;

package/dist/components/tag.d.ts

@@ -3,11 +3,11 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const tagVariants: (props?: ({
-    variant?: "primary" | "success" | "warning" | "default" | "destructive" | "outline" | "quiet" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | "primary" | "outline" | "quiet" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Tag: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & VariantProps<(props?: ({
-    variant?: "primary" | "success" | "warning" | "default" | "destructive" | "outline" | "quiet" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | "primary" | "outline" | "quiet" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & {
     onRemove?: () => void;

package/dist/components/text.d.ts

@@ -22,9 +22,9 @@ import { VariantProps } from 'class-variance-authority';
  * Weights are 400 / 600 / 700. 500 is not in the system.
  */
 declare const textVariants: (props?: ({
-    variant?: "body" | "small" | "display" | "h2" | "h3" | "label" | "caption" | "h1" | "h4" | "body-lg" | "body-sm" | "overline" | null | undefined;
-    color?: "inherit" | "primary" | "default" | "destructive" | "muted" | "primary-foreground" | null | undefined;
-    weight?: "bold" | "medium" | "normal" | "semibold" | null | undefined;
+    variant?: "small" | "display" | "h1" | "h2" | "h3" | "h4" | "body-lg" | "body" | "body-sm" | "caption" | "label" | "overline" | null | undefined;
+    color?: "default" | "destructive" | "inherit" | "muted" | "primary" | "primary-foreground" | null | undefined;
+    weight?: "bold" | "normal" | "medium" | "semibold" | null | undefined;
     leading?: "none" | "normal" | "tight" | "snug" | "relaxed" | "loose" | null | undefined;
     tracking?: "normal" | "tight" | "wide" | "wider" | null | undefined;
     wrap?: "balance" | "pretty" | "nowrap" | null | undefined;

package/dist/components/toggle.d.ts

@@ -11,7 +11,7 @@ import { VariantProps } from 'class-variance-authority';
  * `data-[state=on]:` utilities sort after `hover:` and still win while on.
  */
 declare const toggleVariants: (props?: ({
-    variant?: "tab" | "default" | "outline" | "chip" | "segmented" | null | undefined;
+    variant?: "default" | "tab" | "outline" | "chip" | "segmented" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 /**

package/dist/components/top-comparison.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent } from './menu-types.js';
 import { TopComparisonRow } from './top-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 type TopComparisonLabels = {

package/dist/components/top-cross-link.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent } from './menu-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 type TopCrossLinkProps = {

package/dist/components/top-ranking-entry.d.ts

@@ -3,7 +3,7 @@ import { MenuItemLabels } from './menu-item.js';
 import { MenuItemPreview, MenuLinkComponent } from './menu-types.js';
 import { TopRankEntry } from './top-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 type TopRankingEntryLabels = {

package/dist/components/top-ranking-hero.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent } from './menu-types.js';
 import { TopExit } from './top-types.js';
 import 'react';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 type TopRankingHeroProps = {

package/dist/components/top-types.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { MenuItemPreview } from './menu-types.js';
-import '../place-types-DCVqWmk_.js';
+import '../place-types-Dzy6FH67.js';
 import 'react/jsx-runtime';
 import '../lib/grade.js';
 

package/dist/components/venue-grade-dimensions.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as PlaceGradeDimensions } from '../place-types-DCVqWmk_.js';
+import { b as PlaceGradeDimensions } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

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

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as CitedText } from '../place-types-DCVqWmk_.js';
+import { C as CitedText } from '../place-types-Dzy6FH67.js';
 import '../lib/grade.js';
 
 /**

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

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuLinkComponent, MenuLinkProps } from './menu-types.js';
-import { P as PlacePreview } from '../place-types-DCVqWmk_.js';
+import { P as PlacePreview } from '../place-types-Dzy6FH67.js';
 import 'react';
 import '../lib/grade.js';
 

package/dist/{place-types-DCVqWmk_.d.ts → place-types-Dzy6FH67.d.ts}

@@ -332,4 +332,4 @@ type PlaceDetailsMobileLabels = PlaceAboutTabLabels & {
     noImageAvailable: string;
 };
 
-export { type CitedText as C, GradeAtom as G, type MenuSizeAndPrice as M, type PlacePreview as P, type WeekdayKey as W, type PlaceGradeDimensions as a, type PlaceAboutTabLabels as b, type PlaceLinkKind as c, type PlaceCardLabels as d, type PlaceDetailsMobileLabels as e, type PlaceSchedule as f, type PlaceScheduleWeekLabels as g, type GradeAtomLabels as h, type GradeAtomProps as i, type GradeAtomSize as j, type CitedValue as k, type PlaceGrade as l, type PlaceHourBlock as m, type PlaceMustTry as n, type PlacePriceRange as o, type PlaceReviewsDigest as p };
+export { type CitedText as C, type GradeAtomLabels as G, type MenuSizeAndPrice as M, type PlacePreview as P, type WeekdayKey as W, type PlaceGrade as a, type PlaceGradeDimensions as b, type PlaceAboutTabLabels as c, type PlaceLinkKind as d, type PlaceCardLabels as e, type PlaceDetailsMobileLabels as f, type PlaceSchedule as g, type PlaceScheduleWeekLabels as h, GradeAtom as i, type GradeAtomProps as j, type GradeAtomSize as k, type CitedValue as l, type PlaceHourBlock as m, type PlaceMustTry as n, type PlacePriceRange as o, type PlaceReviewsDigest as p };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bearmenu/ui",
-  "version": "0.8.49",
+  "version": "0.8.50",
   "packageManager": "pnpm@10.28.1",
   "description": "BearMenu design system — shared UI tokens, primitives, and components",
   "license": "UNLICENSED",

package/src/components/event-detail-panel.test.tsx

@@ -84,6 +84,41 @@ describe("EventDetailPanel", () => {
     expect(screen.getByText(labels.venueNoPage)).toBeInTheDocument();
   });
 
+  it("shows the venue's BearMenu grade instead of the Google star when given", () => {
+    const venue = {
+      name: "Sophie",
+      address: "Str. 5",
+      ratingLabel: "4.7",
+      href: "/places/sophie",
+      grade: { overall: 8.7, show_number: true },
+    };
+    const gradeLabels = {
+      soft: "Few reviews",
+      bands: {
+        exceptional: "Exceptional",
+        great: "Great",
+        good: "Good",
+        decent: "Decent",
+        weak: "Weak",
+      },
+      aria: (value: string) => `Grade ${value}`,
+      capped: "Capped",
+    };
+    const { container, rerender } = render(
+      <EventDetailPanel
+        {...base}
+        labels={{ ...labels, grade: gradeLabels }}
+        venue={venue}
+      />,
+    );
+    expect(container.textContent).toMatch(/8[.,]7/);
+    expect(container.textContent).not.toContain("4.7");
+
+    // No grade labels: exactly the old card.
+    rerender(<EventDetailPanel {...base} venue={venue} />);
+    expect(container.textContent).toContain("4.7");
+  });
+
   it("previews five performers and reveals the rest on request", () => {
     const performers = ["A", "B", "C", "D", "E", "F", "G"];
     render(

package/src/components/event-detail-panel.tsx

@@ -14,7 +14,10 @@ import {
   Unplug,
   User,
 } from "lucide-react";
+import { showsGradeAtom } from "../lib/grade";
 import { cn } from "../lib/utils";
+import { GradeAtom, type GradeAtomLabels } from "./grade-atom";
+import type { PlaceGrade } from "./place-types";
 import { Button } from "./button";
 import { EventPosterFallback } from "./event-poster-fallback";
 import { Separator } from "./separator";
@@ -81,7 +84,13 @@ export type EventDetailVenue = {
   name: string;
   /** Address line, e.g. "Str. Iuliu Maniu 5". */
   address?: string;
-  /** e.g. "4.7" — rendered with a star. */
+  /**
+   * The venue's BearMenu grade. Shown as the grade pill in the rating's place
+   * when `labels.grade` is given; the star `ratingLabel` then stays only for a
+   * venue without a grade.
+   */
+  grade?: PlaceGrade;
+  /** e.g. "4.7" — Google's rating, rendered with a star. The fallback for an ungraded venue. */
   ratingLabel?: string;
   /** e.g. "open until 20:00" — appended to the meta row when given. */
   openLabel?: string;
@@ -97,6 +106,8 @@ export type EventDetailVenue = {
 };
 
 export type EventDetailPanelLabels = {
+  /** The venue's grade pill. Optional: without it the venue shows the star, as before. */
+  grade?: GradeAtomLabels;
   free: string;
   liveNow: string;
   /** The ended chip, e.g. "Ended". */
@@ -752,7 +763,7 @@ export function EventDetailChipRow({
 
 export type EventDetailVenueCardProps = {
   venue: EventDetailVenue;
-  labels: Pick<EventDetailPanelLabels, "venueNoPage">;
+  labels: Pick<EventDetailPanelLabels, "venueNoPage" | "grade">;
   linkComponent?: React.ComponentType<EventDetailPanelLinkProps>;
   /** Thumbnail size in px: 52 in the sheet, 64 on the page. */
   thumbnailSize?: 52 | 64;
@@ -774,8 +785,10 @@ export function EventDetailVenueCard({
   action,
   className,
 }: EventDetailVenueCardProps) {
-  const meta =
-    venue.href && (venue.address || venue.ratingLabel || venue.openLabel);
+  const showGrade =
+    labels.grade !== undefined && showsGradeAtom(venue.grade, "xs");
+  const hasRating = showGrade || Boolean(venue.ratingLabel);
+  const meta = venue.href && (venue.address || hasRating || venue.openLabel);
   // The main area (thumb, name, meta, chevron) is the link; `action` sits
   // BESIDE it, never inside — an anchor cannot contain another control, and a
   // page's "Open in Maps" must not navigate to the venue instead.
@@ -816,16 +829,25 @@ export function EventDetailVenueCard({
               {venue.address && (
                 <span className="truncate">{venue.address}</span>
               )}
-              {venue.address && venue.ratingLabel && (
+              {venue.address && hasRating && (
                 <span aria-hidden className="text-border">
                   ·
                 </span>
               )}
-              {venue.ratingLabel && (
-                <span className="inline-flex shrink-0 items-center gap-1">
-                  <Star className="h-[11px] w-[11px]" aria-hidden />
-                  {venue.ratingLabel}
-                </span>
+              {showGrade && labels.grade && venue.grade ? (
+                <GradeAtom
+                  grade={venue.grade}
+                  labels={labels.grade}
+                  size="xs"
+                  className="shrink-0"
+                />
+              ) : (
+                venue.ratingLabel && (
+                  <span className="inline-flex shrink-0 items-center gap-1">
+                    <Star className="h-[11px] w-[11px]" aria-hidden />
+                    {venue.ratingLabel}
+                  </span>
+                )
               )}
               {venue.openLabel && (
                 <>

package/src/components/menu-kitchen-list.test.tsx

@@ -24,6 +24,45 @@ const kitchen: MenuKitchenPreview = {
   },
 };
 
+const gradeLabels = {
+  soft: "Few reviews",
+  bands: { exceptional: "Exceptional", great: "Great", good: "Good", decent: "Decent", weak: "Weak" },
+  aria: (value: string) => `Grade ${value}`,
+  capped: "Capped",
+};
+
+describe("MenuKitchenList rating", () => {
+  const graded = {
+    ...kitchen,
+    place: {
+      ...kitchen.place,
+      rating: { rating: 4.8, count: 900 },
+      reviews_digest: { grade: { overall: 8.7, show_number: true } },
+    },
+  } as MenuKitchenPreview;
+
+  it("shows the BearMenu grade instead of the Google star when the venue has one", () => {
+    const { container } = render(
+      <MenuKitchenList kitchens={[graded]} labels={{ ...labels, grade: gradeLabels }} />
+    );
+    expect(container.textContent).toMatch(/8[.,]7/);
+    expect(container.textContent).not.toContain("4.8");
+  });
+
+  it("keeps the star for a venue with no grade", () => {
+    const ungraded = { ...graded, place: { ...graded.place, reviews_digest: undefined } };
+    const { container } = render(
+      <MenuKitchenList kitchens={[ungraded]} labels={{ ...labels, grade: gradeLabels }} />
+    );
+    expect(container.textContent).toContain("4.8");
+  });
+
+  it("keeps the star for callers that pass no grade labels", () => {
+    const { container } = render(<MenuKitchenList kitchens={[graded]} labels={labels} />);
+    expect(container.textContent).toContain("4.8");
+  });
+});
+
 describe("MenuKitchenList", () => {
   /**
    * The reason this component exists rather than a flag on `RankedVenueList`.

package/src/components/menu-kitchen-list.tsx

@@ -1,5 +1,7 @@
 import { Check, ChevronRight, Clock, MessageSquare, Star } from "lucide-react";
+import { showsGradeAtom } from "../lib/grade";
 import { cn } from "../lib/utils";
+import { GradeAtom, type GradeAtomLabels } from "./grade-atom";
 import { Separator } from "./separator";
 import { Skeleton } from "./skeleton";
 import type { MenuKitchenPreview, MenuLinkComponent, MenuLinkProps } from "./menu-types";
@@ -59,6 +61,13 @@ export type MenuKitchenListLabels = {
   openNow: string;
   /** Reveals the next page of rows, e.g. "Show 10 more". */
   showMore?: string;
+  /**
+   * The grade pill's labels. With them, a graded venue shows its BearMenu
+   * grade where the Google star was; the star stays only for a venue with no
+   * grade. Optional so existing callers keep compiling — without it every row
+   * shows the star, as before.
+   */
+  grade?: GradeAtomLabels;
 };
 
 /**
@@ -127,6 +136,31 @@ export function MenuKitchenList({
   );
 }
 
+function gradeShown(place: MenuKitchenPreview["place"], labels: MenuKitchenListLabels) {
+  return labels.grade !== undefined && showsGradeAtom(place.reviews_digest?.grade, "xs");
+}
+
+/** BearMenu's grade when the venue has one; Google's star only without it. */
+function KitchenRating({
+  place,
+  labels,
+}: {
+  place: MenuKitchenPreview["place"];
+  labels: MenuKitchenListLabels;
+}) {
+  const grade = place.reviews_digest?.grade;
+  if (labels.grade && showsGradeAtom(grade, "xs")) {
+    return <GradeAtom grade={grade} labels={labels.grade} size="xs" className="shrink-0" />;
+  }
+  if (!place.rating) return null;
+  return (
+    <>
+      <Star className="h-[11px] w-[11px] shrink-0" aria-hidden />
+      {place.rating.rating}
+    </>
+  );
+}
+
 function KitchenRow({
   kitchen,
   labels,
@@ -189,13 +223,8 @@ function KitchenRow({
           {place.name}
         </span>
         <span className="flex items-center gap-1 truncate text-xs text-muted-foreground">
-          {place.rating && (
-            <>
-              <Star className="h-[11px] w-[11px] shrink-0" aria-hidden />
-              {place.rating.rating}
-              {kitchen.metaLabel && " · "}
-            </>
-          )}
+          <KitchenRating place={place} labels={labels} />
+          {kitchen.metaLabel && (gradeShown(place, labels) || place.rating) && " · "}
           {kitchen.metaLabel}
         </span>
         {kitchen.hoursLabel && (