@bearmenu/ui 0.8.41 → 0.8.42

package/dist/{chunk-TB2K5JN3.js → chunk-BFS4M7KD.js}

@@ -1,5 +1,5 @@
 import { cn } from './chunk-FEK5XGZW.js';
-import { __objRest, __spreadValues } from './chunk-MMUBH76A.js';
+import { __objRest, __spreadProps, __spreadValues } from './chunk-MMUBH76A.js';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
 import { cva } from 'class-variance-authority';
 import { jsx } from 'react/jsx-runtime';
@@ -13,11 +13,17 @@ var toggleVariants = cva(
         outline: "border border-border bg-transparent hover:bg-accent-subtle hover:text-foreground data-[state=on]:border-primary",
         /**
          * One cell of a segmented control: a raised card on the group's
-         * muted capsule when on, quiet type when off. The group
+         * muted capsule when on, quiet type when off. This class owns only
+         * the cell's layout and text colour — the button itself is the full
+         * 44px hit target the accessibility floor asks for. The raised card
+         * it draws is smaller (36px, measured off the booking frames'
+         * calendar toolbar and the closures scope control), so
+         * `SegmentedToggleContent` below carries the paint in an inner span,
+         * the same split `MenuPickRow` uses for its add disc. The group
          * (`ToggleGroup variant="segmented"`) supplies the capsule; the cell
          * never fills with the accent, which would read as a primary button.
          */
-        segmented: "h-10 w-11 rounded-full text-muted-foreground hover:bg-transparent hover:text-foreground data-[state=on]:bg-card data-[state=on]:text-foreground data-[state=on]:shadow-[var(--shadow-card)]",
+        segmented: "group/segment relative rounded-full text-muted-foreground hover:bg-transparent hover:text-foreground data-[state=on]:bg-transparent data-[state=on]:text-foreground",
         /**
          * A choice among a few named options that sit in a wrapping row —
          * the booking flow's seating preference ("No preference", "Terrace",
@@ -47,7 +53,11 @@ var toggleVariants = cva(
     // call on another element alike.
     compoundVariants: [
       { variant: "chip", class: "h-auto min-w-0 px-[13px]" },
-      { variant: "tab", class: "h-auto min-w-0 px-3" }
+      { variant: "tab", class: "h-auto min-w-0 px-3" },
+      // The segmented cell's hit target is fixed at the 44px floor
+      // regardless of `size` — restated here for the same reason as chip and
+      // tab above, so the size variants' `h-*` never wins the merge.
+      { variant: "segmented", class: "h-11 px-0" }
     ],
     defaultVariants: {
       variant: "default",
@@ -55,23 +65,30 @@ var toggleVariants = cva(
     }
   }
 );
+function SegmentedToggleContent({ children }) {
+  return /* @__PURE__ */ jsx("span", { className: "flex h-9 w-full items-center justify-center gap-2 rounded-full text-inherit transition-[background-color,box-shadow] group-data-[state=on]/segment:bg-card group-data-[state=on]/segment:shadow-[var(--shadow-card)]", children });
+}
 function Toggle(_a) {
   var _b = _a, {
     className,
     variant,
-    size
+    size,
+    children
   } = _b, props = __objRest(_b, [
     "className",
     "variant",
-    "size"
+    "size",
+    "children"
   ]);
   return /* @__PURE__ */ jsx(
     TogglePrimitive.Root,
-    __spreadValues({
+    __spreadProps(__spreadValues({
       "data-slot": "toggle",
       className: cn(toggleVariants({ variant, size, className }))
-    }, props)
+    }, props), {
+      children: variant === "segmented" ? /* @__PURE__ */ jsx(SegmentedToggleContent, { children }) : children
+    })
   );
 }
 
-export { Toggle, toggleVariants };
+export { SegmentedToggleContent, Toggle, toggleVariants };

package/dist/{chunk-KGXTBTCJ.js → chunk-CLFE4U5T.js}

@@ -1,4 +1,4 @@
-import { Badge } from './chunk-FQAIYKAS.js';
+import { Badge } from './chunk-WHUG6QEI.js';
 import { cn } from './chunk-FEK5XGZW.js';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-NF5UMLSL.js → chunk-FVFAOW36.js}

@@ -47,46 +47,52 @@ var DrawerOverlay = React.forwardRef((_a, ref) => {
   );
 });
 DrawerOverlay.displayName = Drawer$1.Overlay.displayName;
-var DrawerContent = React.forwardRef((_a, ref) => {
-  var _b = _a, { className, variant = "flush", showHandle, overlayClassName, children } = _b, props = __objRest(_b, ["className", "variant", "showHandle", "overlayClassName", "children"]);
-  const { direction, modal } = React.useContext(DrawerContext);
-  const isVertical = direction === "top" || direction === "bottom";
-  const handleEnabled = showHandle != null ? showHandle : direction === "bottom";
-  const positionClasses = direction === "bottom" ? "inset-x-0 bottom-0 flex-col rounded-t-2xl border-t [padding-bottom:max(env(safe-area-inset-bottom),0px)]" : direction === "top" ? "inset-x-0 top-0 flex-col rounded-b-2xl border-b [padding-top:max(env(safe-area-inset-top),0px)]" : direction === "left" ? "inset-y-0 left-0 h-full w-3/4 max-w-sm flex-col rounded-r-2xl border-r [padding-left:max(env(safe-area-inset-left),0px)]" : "inset-y-0 right-0 h-full w-3/4 max-w-sm flex-col rounded-l-2xl border-l [padding-right:max(env(safe-area-inset-right),0px)]";
-  return /* @__PURE__ */ jsxs(DrawerPortal, { children: [
-    /* @__PURE__ */ jsx(DrawerOverlay, { className: overlayClassName }),
-    /* @__PURE__ */ jsxs(
-      Drawer$1.Content,
-      __spreadProps(__spreadValues({
-        ref,
-        "data-slot": "drawer-content",
-        "aria-modal": modal ? true : void 0,
-        className: cn(
-          "fixed z-[1000] flex border-border bg-card shadow-[var(--shadow-overlay)]",
-          positionClasses,
-          // The single height cap for every vertical drawer. Consumers should
-          // NOT restate it: six app call sites carried an identical
-          // `!max-h-[90vh]`, so this default governed nothing and changing it
-          // here would have reached none of them.
-          isVertical ? "max-h-[85vh]" : "",
-          variant === "floating" && "m-3 rounded-2xl border",
-          className
-        )
-      }, props), {
-        children: [
-          handleEnabled && /* @__PURE__ */ jsx(
-            "div",
-            {
-              "aria-hidden": true,
-              className: "mx-auto mt-2 h-1.5 w-[60px] shrink-0 rounded-full bg-muted-foreground/30"
-            }
-          ),
-          children
-        ]
-      })
-    )
-  ] });
-});
+var DrawerContent = React.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { className, variant = "flush", showHandle, overlayClassName, snapHeight, style, children } = _b, props = __objRest(_b, ["className", "variant", "showHandle", "overlayClassName", "snapHeight", "style", "children"]);
+    const { direction, modal } = React.useContext(DrawerContext);
+    const isVertical = direction === "top" || direction === "bottom";
+    const handleEnabled = showHandle != null ? showHandle : direction === "bottom";
+    const fixedHeight = isVertical && snapHeight !== void 0 ? typeof snapHeight === "number" ? `${snapHeight}px` : snapHeight : void 0;
+    const positionClasses = direction === "bottom" ? "inset-x-0 bottom-0 flex-col rounded-t-2xl border-t [padding-bottom:max(env(safe-area-inset-bottom),0px)]" : direction === "top" ? "inset-x-0 top-0 flex-col rounded-b-2xl border-b [padding-top:max(env(safe-area-inset-top),0px)]" : direction === "left" ? "inset-y-0 left-0 h-full w-3/4 max-w-sm flex-col rounded-r-2xl border-r [padding-left:max(env(safe-area-inset-left),0px)]" : "inset-y-0 right-0 h-full w-3/4 max-w-sm flex-col rounded-l-2xl border-l [padding-right:max(env(safe-area-inset-right),0px)]";
+    return /* @__PURE__ */ jsxs(DrawerPortal, { children: [
+      /* @__PURE__ */ jsx(DrawerOverlay, { className: overlayClassName }),
+      /* @__PURE__ */ jsxs(
+        Drawer$1.Content,
+        __spreadProps(__spreadValues({
+          ref,
+          "data-slot": "drawer-content",
+          "aria-modal": modal ? true : void 0,
+          style: fixedHeight !== void 0 ? __spreadProps(__spreadValues({}, style), { height: fixedHeight }) : style,
+          className: cn(
+            "fixed z-[1000] flex border-border bg-card shadow-[var(--shadow-overlay)]",
+            positionClasses,
+            // The single height cap for every vertical drawer, fixed height or
+            // not (a `snapHeight` taller than the viewport still backs off to
+            // this on a short phone). Consumers should NOT restate it: six app
+            // call sites carried an identical `!max-h-[90vh]`, so this default
+            // governed nothing and changing it here would have reached none of
+            // them.
+            isVertical ? "max-h-[85vh]" : "",
+            variant === "floating" && "m-3 rounded-2xl border",
+            className
+          )
+        }, props), {
+          children: [
+            handleEnabled && /* @__PURE__ */ jsx(
+              "div",
+              {
+                "aria-hidden": true,
+                className: "mx-auto mt-2 h-1 w-10 shrink-0 rounded-full bg-muted-foreground/30"
+              }
+            ),
+            children
+          ]
+        })
+      )
+    ] });
+  }
+);
 DrawerContent.displayName = "DrawerContent";
 var DrawerHeader = (_a) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);

package/dist/{chunk-ZUBBMLBD.js → chunk-RQPUBKFU.js}

@@ -1,4 +1,4 @@
-import { SignatureChip } from './chunk-KGXTBTCJ.js';
+import { SignatureChip } from './chunk-CLFE4U5T.js';
 import { cn } from './chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from './chunk-MMUBH76A.js';
 import { memo } from 'react';

package/dist/{chunk-FQAIYKAS.js → chunk-WHUG6QEI.js}

@@ -70,11 +70,17 @@ var badgeVariants = cva(
       /**
        * `status` is the taller pill the booking design draws beside a
        * summary — the same ink and radius, more air. `chip` (the default) is
-       * the inline one that sits in a row of text.
+       * the inline one that sits in a row of text. Measured off the booking
+       * details panel (Bookings Calendar 09, the header status badge): a 24px
+       * pill, not the 38px `py-[11px]` previously drew. Resets text size and
+       * weight too, because the colour variants (`confirmed`/`pending`/…)
+       * tune those for their compact, inline-with-a-row scale (10.5px bold);
+       * `status` is a different scale (12px semibold) and wins the merge by
+       * coming after the variant classes.
        */
       size: {
         chip: "",
-        status: "py-[11px]"
+        status: "gap-1 px-2 py-[3px] text-xs leading-[18px] font-semibold"
       },
       // v1.0 motion: "live" surface signal — applies `live-pulse` archetype.
       // Pair with a colored variant (e.g. variant="destructive" live).

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" | "default" | "success" | "warning" | "destructive" | "outline" | "glass" | "overlay" | "brown" | "code" | "onPrimary" | "confirmed" | "pending" | "completed" | "assignee" | "softSuccess" | "softWarning" | "softDestructive" | "softNeutral" | null | undefined;
+    variant?: "default" | "secondary" | "success" | "warning" | "destructive" | "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/badge.js

@@ -1,3 +1,3 @@
-export { Badge, badgeVariants } from '../chunk-FQAIYKAS.js';
+export { Badge, badgeVariants } from '../chunk-WHUG6QEI.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';

package/dist/components/booking-row.js

@@ -1,4 +1,4 @@
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
 import * as React from 'react';

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?: "secondary" | "default" | "link" | "warning" | "destructive" | "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;
+    variant?: "default" | "link" | "secondary" | "warning" | "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;
     fullWidth?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

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>>, "onChange" | "value" | "type"> & {
+}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "onChange" | "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">, "heading" | "value"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "value" | "heading"> & {
     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">, "onSelect" | "value" | "disabled"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "value" | "onSelect" | "disabled"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;

package/dist/components/concept-convergence.js

@@ -1,7 +1,7 @@
 import { PhotoGround } from '../chunk-SWD6CJ35.js';
 import { Convergence } from '../chunk-4XDJXMLF.js';
 import '../chunk-OIV7B44M.js';
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/dist/components/drawer.d.ts

@@ -28,6 +28,15 @@ declare const DrawerContent: React.ForwardRefExoticComponent<Omit<Omit<DialogPri
      * `--scrim-overlay` in globals.css, and why it is not `--scrim`).
      */
     overlayClassName?: string;
+    /**
+     * A fixed sheet height instead of sizing to content — the booking frames'
+     * ~640px table sheet (floor/14-w1) draws one instead of growing with its
+     * content. A number is px; a string is passed through (`"70vh"`). Only
+     * meaningful on a vertical (`top`/`bottom`) drawer, and always capped by the
+     * shared `max-h-[85vh]` on short viewports. Omit it to keep every existing
+     * caller's content-sized sheet — this is opt-in, not a new default.
+     */
+    snapHeight?: number | string;
 } & React.RefAttributes<HTMLDivElement>>;
 declare const DrawerHeader: {
     ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;

package/dist/components/drawer.js

@@ -1,3 +1,3 @@
-export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger } from '../chunk-NF5UMLSL.js';
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger } from '../chunk-FVFAOW36.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';

package/dist/components/filter-category-row.js

@@ -1,5 +1,5 @@
 import { Text } from '../chunk-ZLMRVBD7.js';
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';
 import { ChevronRight } from 'lucide-react';

package/dist/components/menu-item.js

@@ -1,5 +1,5 @@
-export { MentionSignal, MenuItem } from '../chunk-ZUBBMLBD.js';
-import '../chunk-KGXTBTCJ.js';
-import '../chunk-FQAIYKAS.js';
+export { MentionSignal, MenuItem } from '../chunk-RQPUBKFU.js';
+import '../chunk-CLFE4U5T.js';
+import '../chunk-WHUG6QEI.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';

package/dist/components/multi-select-combobox.js

@@ -5,7 +5,7 @@ import '../chunk-IQIJCMG2.js';
 import { Button } from '../chunk-K6ACNU2L.js';
 import '../chunk-RIH2IS7X.js';
 import '../chunk-5YNIQ2BL.js';
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __spreadValues } from '../chunk-MMUBH76A.js';
 import * as React from 'react';

package/dist/components/place-card.js

@@ -6,7 +6,7 @@ import { showsGradeAtom } from '../chunk-I5V446BX.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
 import { springSnappy } from '../chunk-OIV7B44M.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
 import { forwardRef, memo, useState, useMemo } from 'react';

package/dist/components/place-details-mobile.js

@@ -3,7 +3,7 @@ import '../chunk-FMTJGO76.js';
 import '../chunk-MWB7S54O.js';
 import '../chunk-NWZGSLPU.js';
 import { Text } from '../chunk-ZLMRVBD7.js';
-import { Badge } from '../chunk-FQAIYKAS.js';
+import { Badge } from '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';
 import { useState } from 'react';

package/dist/components/responsive-overlay.d.ts

@@ -64,6 +64,13 @@ type ResponsiveOverlayProps = {
      * keeps today's default in every mode (dialog, sheet, drawer).
      */
     initialFocusRef?: React.RefObject<HTMLElement | null>;
+    /**
+     * A fixed height for the phone drawer instead of sizing to its content —
+     * `DrawerContent`'s `snapHeight` (the frames' ~640px table sheet). Applies
+     * only when the narrow drawer is showing; the desktop dialog/sheet are
+     * unaffected. Omit to keep today's content-sized drawer.
+     */
+    drawerHeight?: number | string;
 };
 /**
  * ResponsiveOverlay — one overlay authored once: a `Drawer` under md, a

package/dist/components/responsive-overlay.js

@@ -1,12 +1,12 @@
 import { useMediaQuery, DESKTOP_MEDIA_QUERY } from '../chunk-OPVKL4VS.js';
-import { Sheet, SheetContent, SheetTitle, SheetDescription } from '../chunk-LAEVMNJN.js';
-import { Drawer, DrawerContent, DrawerTitle, DrawerDescription } from '../chunk-NF5UMLSL.js';
-import { Dialog, DialogContent, DialogTitle, DialogDescription } from '../chunk-IQIJCMG2.js';
+import { SheetTitle, SheetDescription, Sheet, SheetContent } from '../chunk-LAEVMNJN.js';
+import { DrawerTitle, DrawerDescription, Drawer, DrawerContent } from '../chunk-FVFAOW36.js';
+import { DialogTitle, DialogDescription, Dialog, DialogContent } from '../chunk-IQIJCMG2.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
 import * as React from 'react';
 import { X } from 'lucide-react';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 var MD_MEDIA_QUERY = "(min-width: 768px)";
 var CONTAINER_TITLE = { drawer: DrawerTitle, dialog: DialogTitle, sheet: SheetTitle };
@@ -56,7 +56,8 @@ var ResponsiveOverlay = React.forwardRef(
     wideFrom = "md",
     className,
     bodyClassName,
-    initialFocusRef
+    initialFocusRef,
+    drawerHeight
   }, ref) => {
     const isWide = useMediaQuery(wideFrom === "lg" ? DESKTOP_MEDIA_QUERY : MD_MEDIA_QUERY);
     const container = isWide ? desktop : "drawer";
@@ -72,30 +73,42 @@ var ResponsiveOverlay = React.forwardRef(
     const describedBy = subtitle ? {} : { "aria-describedby": void 0 };
     const Title = CONTAINER_TITLE[container];
     const Description = CONTAINER_DESCRIPTION[container];
-    const header = /* @__PURE__ */ jsxs("div", { "data-slot": "responsive-overlay-header", className: "flex items-start gap-3 px-5 pt-5", children: [
-      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx(Title, { className: "text-[19px] font-bold leading-tight", children: title }),
-        subtitle ? /* @__PURE__ */ jsx(Description, { className: "mt-1 text-[13px] text-muted-foreground", children: subtitle }) : null
-      ] }),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          "data-slot": "responsive-overlay-close",
-          onClick: () => onOpenChange(false),
-          className: "-m-1.5 grid size-11 shrink-0 place-items-center rounded-full text-muted-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "grid size-8 place-items-center rounded-full bg-surface-2 transition-colors hover:bg-muted", children: /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": true }) }),
-            /* @__PURE__ */ jsx("span", { className: "sr-only", children: closeLabel })
-          ]
-        }
-      )
-    ] });
+    const isDrawer = container === "drawer";
+    const header = /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "responsive-overlay-header",
+        className: cn("flex items-start gap-3", isDrawer ? "px-4 pt-4" : "px-5 pt-5"),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx(Title, { className: cn("font-bold leading-tight", isDrawer ? "text-[22px]" : "text-[19px]"), children: title }),
+            subtitle ? /* @__PURE__ */ jsx(Description, { className: "mt-1 text-[13px] text-muted-foreground", children: subtitle }) : null
+          ] }),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              "data-slot": "responsive-overlay-close",
+              onClick: () => onOpenChange(false),
+              className: "-m-1.5 grid size-11 shrink-0 place-items-center rounded-full text-muted-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "grid size-8 place-items-center rounded-full bg-surface-2 transition-colors hover:bg-muted", children: /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": true }) }),
+                /* @__PURE__ */ jsx("span", { className: "sr-only", children: closeLabel })
+              ]
+            }
+          )
+        ]
+      }
+    );
     const body = /* @__PURE__ */ jsx(
       "div",
       {
         "data-slot": "responsive-overlay-body",
-        className: cn("min-h-0 flex-1 overflow-y-auto px-5 py-4", bodyClassName),
+        className: cn(
+          "min-h-0 flex-1 overflow-y-auto py-4",
+          isDrawer ? "px-4" : "px-5",
+          bodyClassName
+        ),
         children
       }
     );
@@ -159,11 +172,11 @@ var ResponsiveOverlay = React.forwardRef(
     }
     return /* @__PURE__ */ jsx(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
       DrawerContent,
-      __spreadProps(__spreadValues({
+      __spreadProps(__spreadValues(__spreadValues({
         ref,
         overlayClassName: "bg-scrim-overlay",
         onOpenAutoFocus: handleOpenAutoFocus
-      }, describedBy), {
+      }, drawerHeight !== void 0 ? { snapHeight: drawerHeight } : {}), describedBy), {
         className: cn("flex max-h-[85vh] flex-col p-0", className),
         children: [
           header,

package/dist/components/signature-chip.js

@@ -1,4 +1,4 @@
-export { SignatureChip } from '../chunk-KGXTBTCJ.js';
-import '../chunk-FQAIYKAS.js';
+export { SignatureChip } from '../chunk-CLFE4U5T.js';
+import '../chunk-WHUG6QEI.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.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?: "primary" | "default" | "inherit" | "destructive" | null | undefined;
+    tone?: "default" | "inherit" | "primary" | "destructive" | 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?: "primary" | "default" | "inherit" | "destructive" | null | undefined;
+    tone?: "default" | "inherit" | "primary" | "destructive" | 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" | "default" | "success" | "warning" | "destructive" | "outline" | "quiet" | null | undefined;
+    variant?: "default" | "primary" | "success" | "warning" | "destructive" | "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" | "default" | "success" | "warning" | "destructive" | "outline" | "quiet" | null | undefined;
+    variant?: "default" | "primary" | "success" | "warning" | "destructive" | "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,8 +22,8 @@ import { VariantProps } from 'class-variance-authority';
  * Weights are 400 / 600 / 700. 500 is not in the system.
  */
 declare const textVariants: (props?: ({
-    variant?: "small" | "body" | "display" | "h2" | "h3" | "label" | "caption" | "h1" | "h4" | "body-lg" | "body-sm" | "overline" | null | undefined;
-    color?: "primary" | "default" | "inherit" | "destructive" | "muted" | "primary-foreground" | null | undefined;
+    variant?: "body" | "small" | "display" | "h2" | "h3" | "label" | "caption" | "h1" | "h4" | "body-lg" | "body-sm" | "overline" | null | undefined;
+    color?: "default" | "inherit" | "primary" | "destructive" | "muted" | "primary-foreground" | null | undefined;
     weight?: "bold" | "medium" | "normal" | "semibold" | null | undefined;
     leading?: "none" | "normal" | "tight" | "snug" | "relaxed" | "loose" | null | undefined;
     tracking?: "normal" | "tight" | "wide" | "wider" | null | undefined;

package/dist/components/toggle-group.js

@@ -1,4 +1,4 @@
-import { toggleVariants } from '../chunk-TB2K5JN3.js';
+import { toggleVariants, SegmentedToggleContent } from '../chunk-BFS4M7KD.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
 import * as React from 'react';
@@ -30,8 +30,12 @@ function ToggleGroup(_a) {
       className: cn(
         "group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs",
         // The segmented control's capsule: muted ground, the on cell a raised
-        // card inside it (see `toggleVariants.segmented`). 44px tall.
-        "data-[variant=segmented]:gap-0.5 data-[variant=segmented]:rounded-full data-[variant=segmented]:bg-muted data-[variant=segmented]:p-0.5",
+        // card inside it (see `toggleVariants.segmented`). No padding here —
+        // each cell is the full 44px capsule height (the hit target), and
+        // draws its own smaller 36px card centred inside
+        // (`SegmentedToggleContent`), so the capsule stays the 44px the
+        // booking frames draw it at.
+        "data-[variant=segmented]:gap-0.5 data-[variant=segmented]:rounded-full data-[variant=segmented]:bg-muted",
         // Chips wrap onto as many rows as they need, 7px apart.
         "data-[variant=chip]:flex-wrap data-[variant=chip]:gap-[7px] data-[variant=chip]:rounded-none",
         // The tab bar spans its container: a muted capsule, 4px inset.
@@ -71,7 +75,7 @@ function ToggleGroupItem(_a) {
           size: context.size || size
         }),
         "min-w-0 flex-1 shrink-0 shadow-none focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l",
-        resolved === "segmented" ? "rounded-full px-0 data-[state=on]:shadow-[var(--shadow-card)]" : (
+        resolved === "segmented" ? "rounded-full" : (
           // Tabs and chips size themselves (`toggleVariants`' compounds);
           // the item's own rounding must not square them off.
           resolved === "tab" ? "rounded-full" : resolved === "chip" ? (
@@ -82,7 +86,7 @@ function ToggleGroupItem(_a) {
         className
       )
     }, props), {
-      children
+      children: resolved === "segmented" ? /* @__PURE__ */ jsx(SegmentedToggleContent, { children }) : children
     })
   );
 }

package/dist/components/toggle.d.ts

@@ -14,6 +14,15 @@ declare const toggleVariants: (props?: ({
     variant?: "default" | "tab" | "outline" | "chip" | "segmented" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Toggle({ className, variant, size, ...props }: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+/**
+ * The segmented variant's drawn pill — 36px tall, centred in the cell's 44px
+ * hit box. Painted here, on `group-data-[state=on]/segment:`, so the outer
+ * button (`toggleVariants({variant: "segmented"})`) can stay unpainted and
+ * full height. Shared by `Toggle` and `ToggleGroupItem`.
+ */
+declare function SegmentedToggleContent({ children }: {
+    children?: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function Toggle({ className, variant, size, children, ...props }: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
 
-export { Toggle, toggleVariants };
+export { SegmentedToggleContent, Toggle, toggleVariants };

package/dist/components/toggle.js

@@ -1,3 +1,3 @@
-export { Toggle, toggleVariants } from '../chunk-TB2K5JN3.js';
+export { SegmentedToggleContent, Toggle, toggleVariants } from '../chunk-BFS4M7KD.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';

package/dist/components/top-ranking-entry.js

@@ -1,8 +1,8 @@
-import { MenuItem } from '../chunk-ZUBBMLBD.js';
-import '../chunk-KGXTBTCJ.js';
+import { MenuItem } from '../chunk-RQPUBKFU.js';
+import '../chunk-CLFE4U5T.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
-import '../chunk-FQAIYKAS.js';
+import '../chunk-WHUG6QEI.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
 import { MapPin, Star, MessageSquareQuote } from 'lucide-react';

package/package.json

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