@bearmenu/ui 0.8.25 → 0.8.27

package/dist/{chunk-VEGFQSZA.js → chunk-F3XK34DV.js}

@@ -41,6 +41,14 @@ var toggleVariants = cva(
         lg: "h-10 px-2.5 min-w-10"
       }
     },
+    // Chips and tabs size to their type. Restated here, after the size
+    // variants, so the default size's `h-9 px-2 min-w-9` never wins the
+    // merge — for a `Toggle`, a `ToggleGroupItem` or a bare `toggleVariants`
+    // 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" }
+    ],
     defaultVariants: {
       variant: "default",
       size: "default"

package/dist/chunk-L3CDXVEP.js

@@ -0,0 +1,56 @@
+import { cn } from './chunk-FEK5XGZW.js';
+import { __objRest, __spreadProps, __spreadValues } from './chunk-MMUBH76A.js';
+import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { cva } from 'class-variance-authority';
+import { Minus, Check } from 'lucide-react';
+import { jsx } from 'react/jsx-runtime';
+
+var checkboxVariants = cva(
+  "peer size-5 shrink-0 rounded-md border border-border bg-background transition-all duration-150 ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground data-[state=indeterminate]:border-primary hover:border-primary/50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/40",
+  {
+    variants: {
+      /**
+       * The booking flow's opt-in ("Save these details for next time",
+       * booking flow.html): a 17px box with a 5px radius, a hairline on the
+       * soft ground when off, the brand gradient with an 11px white check
+       * when on.
+       */
+      appearance: {
+        default: "",
+        booking: "size-[17px] rounded-[5px] bg-surface-2 data-[state=checked]:border-transparent data-[state=checked]:bg-[image:var(--gradient-primary)] data-[state=checked]:text-white [&_svg]:size-[11px]"
+      }
+    },
+    defaultVariants: { appearance: "default" }
+  }
+);
+var Checkbox = React.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { className, appearance } = _b, props = __objRest(_b, ["className", "appearance"]);
+    return /* @__PURE__ */ jsx(
+      CheckboxPrimitive.Root,
+      __spreadProps(__spreadValues({
+        ref,
+        "data-slot": "checkbox",
+        className: cn(checkboxVariants({ appearance }), className)
+      }, props), {
+        children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { className: cn("flex items-center justify-center text-current"), children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx(
+          Minus,
+          {
+            className: "size-3.5 animate-in fade-in-0 zoom-in-50 duration-200 ease-out",
+            strokeWidth: 3
+          }
+        ) : /* @__PURE__ */ jsx(
+          Check,
+          {
+            className: "size-3.5 animate-in fade-in-0 zoom-in-50 duration-200 ease-out",
+            strokeWidth: 3
+          }
+        ) })
+      })
+    );
+  }
+);
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+export { Checkbox, checkboxVariants };

package/dist/{chunk-CZK2MRS2.js → chunk-VEFKZIK6.js}

@@ -16,23 +16,33 @@ var inputVariants = cva(
       shape: {
         rounded: "rounded-xl focus-visible:ring-ring",
         pill: "rounded-full bg-background shadow-[var(--shadow-card)] focus-visible:ring-accent/30"
+      },
+      /**
+       * The booking flow's field (booking flow.html, `.in`): 46px on the card
+       * ground rather than the input wash, an 11px radius, 13px inset, 14px
+       * type. Last, so it wins over the size and shape it restates.
+       */
+      appearance: {
+        default: "",
+        booking: "h-[46px] rounded-[11px] bg-card px-[13px] py-0 text-[14px] leading-[1.2] focus-visible:bg-card focus-visible:ring-ring aria-invalid:border-[oklch(0.52_0.16_25)] dark:aria-invalid:border-destructive"
       }
     },
     defaultVariants: {
       size: "default",
-      shape: "rounded"
+      shape: "rounded",
+      appearance: "default"
     }
   }
 );
 var Input = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { className, type, size, shape } = _b, props = __objRest(_b, ["className", "type", "size", "shape"]);
+    var _b = _a, { className, type, size, shape, appearance } = _b, props = __objRest(_b, ["className", "type", "size", "shape", "appearance"]);
     return /* @__PURE__ */ jsx(
       "input",
       __spreadValues({
         type,
         "data-slot": "input",
-        className: cn(inputVariants({ size, shape }), className),
+        className: cn(inputVariants({ size, shape, appearance }), className),
         ref
       }, props)
     );

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?: "code" | "default" | "destructive" | "outline" | "secondary" | "glass" | "overlay" | "brown" | "warning" | "success" | "onPrimary" | "confirmed" | "pending" | null | undefined;
+    variant?: "default" | "destructive" | "warning" | "success" | "outline" | "secondary" | "glass" | "overlay" | "brown" | "code" | "onPrimary" | "confirmed" | "pending" | null | undefined;
     live?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {

package/dist/components/banner.d.ts

@@ -0,0 +1,36 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+/**
+ * Banner — a short inline note inside a flow, not a page-level alert: the
+ * booking flow's "19:30 just went" when a time is taken mid-form, "No table
+ * was booked" when a confirm fails, "This venue does not take bookings"
+ * (booking flow.html, `.bnr`).
+ *
+ * Not `Alert`: that one is a bordered card for page-level status with a
+ * pinned icon column. This is borderless, sits in the flow of a form, and
+ * reads as part of the screen — a soft ground, an optional 16px icon, an
+ * optional bold title over the body.
+ *
+ * Measured from the design: 12px radius, 12px × 14px inset, 10px between
+ * icon and text; the title at 13px bold, the body at 12.5px (90% in the
+ * warning tone), both at 1.5 leading.
+ * - `info`: the soft surface and the secondary ink.
+ * - `warning`: a 16% amber wash with the design's amber ink — darker than
+ *   the solid `--warning`, which falls short of AA on its own wash at this
+ *   size; dark mode uses the lifted token.
+ */
+declare const bannerVariants: (props?: ({
+    tone?: "warning" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type BannerProps = Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & VariantProps<typeof bannerVariants> & {
+    /** A lucide icon, drawn at 16px beside the text. */
+    icon?: React.ReactNode;
+    /** The bold first line — "19:30 just went". */
+    title?: React.ReactNode;
+};
+declare function Banner({ tone, icon, title, className, children, ...props }: BannerProps): react_jsx_runtime.JSX.Element;
+
+export { Banner, type BannerProps, bannerVariants };

package/dist/components/banner.js

@@ -0,0 +1,29 @@
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var bannerVariants = cva(
+  "flex gap-2.5 rounded-xl px-3.5 py-3 text-[12.5px] leading-normal [&>svg]:mt-0.5 [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      tone: {
+        info: "bg-surface-2 text-ink-secondary",
+        warning: "bg-[oklch(0.62_0.15_70/0.16)] text-[oklch(0.42_0.1_70)] dark:bg-warning/15 dark:text-warning"
+      }
+    },
+    defaultVariants: { tone: "info" }
+  }
+);
+function Banner(_a) {
+  var _b = _a, { tone, icon, title, className, children } = _b, props = __objRest(_b, ["tone", "icon", "title", "className", "children"]);
+  return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({ "data-slot": "banner", className: cn(bannerVariants({ tone }), className) }, props), { children: [
+    icon,
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+      title ? /* @__PURE__ */ jsx("b", { className: "mb-[3px] block text-[13px] font-bold", children: title }) : null,
+      /* @__PURE__ */ jsx("div", { className: cn(tone === "warning" && title ? "opacity-90" : void 0), children })
+    ] })
+  ] }));
+}
+
+export { Banner, bannerVariants };

package/dist/components/button.d.ts

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

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" | "muted" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
+    variant?: "muted" | "outline" | "glass" | "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" | "muted" | "surface" | "elevated" | "elevatedPanel" | null | undefined;
+    variant?: "muted" | "outline" | "glass" | "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/checkbox.d.ts

@@ -1,6 +1,13 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { VariantProps } from 'class-variance-authority';
 
-declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const checkboxVariants: (props?: ({
+    appearance?: "default" | "booking" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+    appearance?: "default" | "booking" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
 
-export { Checkbox };
+export { Checkbox, checkboxVariants };

package/dist/components/checkbox.js

@@ -1,3 +1,3 @@
-export { Checkbox } from '../chunk-NMEVJT5Q.js';
+export { Checkbox, checkboxVariants } from '../chunk-L3CDXVEP.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';

package/dist/components/command.d.ts

@@ -4,11 +4,11 @@ import { DialogProps } from '@radix-ui/react-dialog';
 
 declare const Command: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
     label?: string;
     shouldFilter?: boolean;
     filter?: (value: string, search: string, keywords?: string[]) => number;
@@ -28,61 +28,61 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
 declare const CommandList: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
     label?: string;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandLoading: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
     progress?: number;
     label?: string;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild">, "heading" | "value"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "heading" | "value"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
     alwaysRender?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild">, "onSelect" | "disabled" | "value"> & {
+}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "onSelect" | "disabled" | "value"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;

package/dist/components/currency-input.js

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

package/dist/components/date-input.js

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

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

@@ -1,6 +1,6 @@
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
-import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
+import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
 import { Button } from '../chunk-5HHRVJOT.js';
 import '../chunk-RIH2IS7X.js';

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

@@ -1,7 +1,7 @@
 import { TagGroup } from '../chunk-PX6RICS5.js';
 import { Tag } from '../chunk-MWB7S54O.js';
-import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
+import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';

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

@@ -1,7 +1,7 @@
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
 import { Tag } from '../chunk-MWB7S54O.js';
-import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
+import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
 import { buttonVariants } from '../chunk-5HHRVJOT.js';
 import '../chunk-RIH2IS7X.js';

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

@@ -1,8 +1,8 @@
 import { TagGroup } from '../chunk-PX6RICS5.js';
 import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
 import { Tag } from '../chunk-MWB7S54O.js';
-import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
+import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';

package/dist/components/field.d.ts

@@ -1,9 +1,17 @@
 import * as _radix_ui_react_slot from '@radix-ui/react-slot';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as class_variance_authority from 'class-variance-authority';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import * as React from 'react';
 
+/**
+ * `booking` — the booking flow's fields (booking flow.html, `.fld`): the
+ * label a 10.5px uppercase caption in the muted ink that stays muted when
+ * the field is invalid (the hairline and the line under it carry the error),
+ * the error at 11.5px, 5px between label, control and error.
+ */
+type FieldAppearance = "default" | "booking";
 declare const Field: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
     /** Field id. Auto-generated if omitted. */
     id?: string;
@@ -11,12 +19,18 @@ declare const Field: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDi
     invalid?: boolean;
     /** Lay out content horizontally instead of stacked. */
     orientation?: "vertical" | "horizontal";
+    appearance?: FieldAppearance;
 } & React.RefAttributes<HTMLDivElement>>;
 declare const FieldLabel: React.ForwardRefExoticComponent<Omit<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & class_variance_authority.VariantProps<(props?: class_variance_authority_types.ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+/**
+ * "(optional)" after a label's text — sentence case, regular weight, a
+ * shade quieter than the label (booking flow.html's EMAIL (optional)).
+ */
+declare function FieldOptional({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
 declare const FieldControl: React.ForwardRefExoticComponent<Omit<_radix_ui_react_slot.SlotProps & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
 declare const FieldDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const FieldSet: React.ForwardRefExoticComponent<React.FieldsetHTMLAttributes<HTMLFieldSetElement> & React.RefAttributes<HTMLFieldSetElement>>;
 declare const FieldLegend: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLLegendElement> & React.RefAttributes<HTMLLegendElement>>;
 
-export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldSet };
+export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldOptional, FieldSet };

package/dist/components/field.js

@@ -5,46 +5,80 @@ import * as React from 'react';
 import { Slot } from '@radix-ui/react-slot';
 import { jsx } from 'react/jsx-runtime';
 
-var FieldContext = React.createContext({ id: "", descriptionId: "", errorId: "", hasError: false });
+var FieldContext = React.createContext({ id: "", descriptionId: "", errorId: "", hasError: false, appearance: "default" });
 var Field = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { id: providedId, invalid, orientation = "vertical", className, children } = _b, props = __objRest(_b, ["id", "invalid", "orientation", "className", "children"]);
+    var _b = _a, {
+      id: providedId,
+      invalid,
+      orientation = "vertical",
+      appearance = "default",
+      className,
+      children
+    } = _b, props = __objRest(_b, [
+      "id",
+      "invalid",
+      "orientation",
+      "appearance",
+      "className",
+      "children"
+    ]);
     const generatedId = React.useId();
     const id = providedId != null ? providedId : generatedId;
     const descriptionId = `${id}-description`;
     const errorId = `${id}-error`;
-    return /* @__PURE__ */ jsx(FieldContext.Provider, { value: { id, descriptionId, errorId, hasError: !!invalid }, children: /* @__PURE__ */ jsx(
-      "div",
-      __spreadProps(__spreadValues({
-        ref,
-        "data-slot": "field",
-        "data-invalid": invalid || void 0,
-        className: cn(
-          "flex gap-2",
-          orientation === "vertical" ? "flex-col" : "flex-row items-center",
-          className
+    return /* @__PURE__ */ jsx(
+      FieldContext.Provider,
+      {
+        value: { id, descriptionId, errorId, hasError: !!invalid, appearance },
+        children: /* @__PURE__ */ jsx(
+          "div",
+          __spreadProps(__spreadValues({
+            ref,
+            "data-slot": "field",
+            "data-invalid": invalid || void 0,
+            className: cn(
+              "flex",
+              appearance === "booking" ? "gap-[5px]" : "gap-2",
+              orientation === "vertical" ? "flex-col" : "flex-row items-center",
+              className
+            )
+          }, props), {
+            children
+          })
         )
-      }, props), {
-        children
-      })
-    ) });
+      }
+    );
   }
 );
 Field.displayName = "Field";
 var FieldLabel = React.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  const { id, hasError } = React.useContext(FieldContext);
+  const { id, hasError, appearance } = React.useContext(FieldContext);
   return /* @__PURE__ */ jsx(
     Label,
     __spreadValues({
       ref,
       "data-slot": "field-label",
       htmlFor: id,
-      className: cn(hasError && "text-destructive", className)
+      className: cn(
+        appearance === "booking" ? "text-[10.5px] leading-[1.2] font-semibold tracking-[0.04em] text-muted-foreground uppercase" : hasError && "text-destructive",
+        className
+      )
     }, props)
   );
 });
 FieldLabel.displayName = "FieldLabel";
+function FieldOptional(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx(
+    "span",
+    __spreadValues({
+      "data-slot": "field-optional",
+      className: cn("font-normal normal-case opacity-70", className)
+    }, props)
+  );
+}
 var FieldControl = React.forwardRef(
   (_a, ref) => {
     var props = __objRest(_a, []);
@@ -81,7 +115,7 @@ FieldDescription.displayName = "FieldDescription";
 var FieldError = React.forwardRef(
   (_a, ref) => {
     var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-    const { errorId, hasError } = React.useContext(FieldContext);
+    const { errorId, hasError, appearance } = React.useContext(FieldContext);
     if (!hasError || !children) return null;
     return /* @__PURE__ */ jsx(
       "p",
@@ -90,7 +124,16 @@ var FieldError = React.forwardRef(
         id: errorId,
         role: "alert",
         "data-slot": "field-error",
-        className: cn("text-sm text-destructive", className)
+        className: cn(
+          appearance === "booking" ? (
+            // The design's error ink: the solid token is too bright for AA
+            // at 11.5px on white; dark mode's lifted token already clears it.
+            // Light: the design's ink. Dark: lifted further than the solid
+            // token, which lands at ~3.8:1 on the card ground at 11.5px.
+            "m-0 text-[11.5px] leading-[1.2] text-[oklch(0.52_0.16_25)] dark:text-[oklch(0.75_0.13_25)]"
+          ) : "text-sm text-destructive",
+          className
+        )
       }, props), {
         children
       })
@@ -127,4 +170,4 @@ var FieldLegend = React.forwardRef(
 );
 FieldLegend.displayName = "FieldLegend";
 
-export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldSet };
+export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldOptional, FieldSet };

package/dist/components/input.d.ts

@@ -5,6 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 declare const inputVariants: (props?: ({
     size?: "default" | "sm" | "lg" | null | undefined;
     shape?: "pill" | "rounded" | null | undefined;
+    appearance?: "default" | "booking" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">, VariantProps<typeof inputVariants> {
 }

package/dist/components/input.js

@@ -1,3 +1,3 @@
-export { Input, inputVariants } from '../chunk-CZK2MRS2.js';
+export { Input, inputVariants } from '../chunk-VEFKZIK6.js';
 import '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.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.js

@@ -1,5 +1,5 @@
-import { VenueQuotes } from '../chunk-43RC7MHY.js';
 import { DIMENSION_ORDER, VenueGradeDimensions } from '../chunk-ZQ53AGML.js';
+import { VenueQuotes } from '../chunk-43RC7MHY.js';
 import { StoryProvider, StorySegments, StoryPanel } from '../chunk-F6FMZJDG.js';
 import { GlassGround } from '../chunk-ICOU5QHT.js';
 import { Separator } from '../chunk-NWZGSLPU.js';

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

@@ -1,7 +1,7 @@
+import { Checkbox } from '../chunk-L3CDXVEP.js';
 import { Popover, PopoverTrigger, PopoverContent } from '../chunk-2ADCZXZJ.js';
 import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '../chunk-MCOHLWRS.js';
 import '../chunk-PDTPO6NG.js';
-import { Checkbox } from '../chunk-NMEVJT5Q.js';
 import { Button } from '../chunk-5HHRVJOT.js';
 import '../chunk-RIH2IS7X.js';
 import '../chunk-5YNIQ2BL.js';

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

@@ -1,4 +1,4 @@
-import { Checkbox } from '../chunk-NMEVJT5Q.js';
+import { Checkbox } from '../chunk-L3CDXVEP.js';
 import { cn } from '../chunk-FEK5XGZW.js';
 import '../chunk-MMUBH76A.js';
 import * as React from 'react';

package/dist/components/place-card.js

@@ -3,8 +3,8 @@ import { HOVER_IMAGE_MOTION, HOVER_IMAGE_WRAPPER, HOVER_MOTION, HOVER_LIFT_GRID_
 import { NEUTRAL_ICON_FILTER } from '../chunk-LQWGZIYA.js';
 import { GradeAtom } from '../chunk-YE4ZQUTI.js';
 import { showsGradeAtom } from '../chunk-I5V446BX.js';
-import { springSnappy } from '../chunk-OIV7B44M.js';
 import { Separator } from '../chunk-NWZGSLPU.js';
+import { springSnappy } from '../chunk-OIV7B44M.js';
 import { Skeleton } from '../chunk-XBBEX4SF.js';
 import { Badge } from '../chunk-IEIJP73R.js';
 import { cn } from '../chunk-FEK5XGZW.js';