@mohasinac/appkit 4.37.1 → 4.38.0

package/dist/client/observability/reportClientError.js

@@ -2,7 +2,17 @@
 import { normalizeError } from "../../errors/normalize";
 import { CLIENT_ERROR_ENDPOINTS } from "../../constants/api-endpoints";
 const SEEN = new Map();
-const DEDUPE_WINDOW_MS = 5000;
+/**
+ * How long an identical error is suppressed before it is reported again.
+ *
+ * This is a rate limit on a beacon that costs a function invocation per send,
+ * so the window has to be sized against the worst case rather than the typical
+ * one: a component stuck in a render loop re-throws the SAME error forever, and
+ * at the original 5s that was 12 invocations/minute/tab, indefinitely, from a
+ * single broken page. The first occurrence is still reported immediately —
+ * widening this loses no distinct error, only repeats of one already recorded.
+ */
+const DEDUPE_WINDOW_MS = 60000;
 const MAX_SEEN = 32;
 function topFrame(stack) {
     if (!stack)

package/dist/client.d.ts

@@ -61,6 +61,10 @@ export { SideModal } from "./ui/components/SideModal";
 export { UnsavedChangesModal } from "./ui/components/UnsavedChangesModal";
 export { LoginRequiredModal } from "./ui/components/LoginRequiredModal";
 export type { LoginRequiredModalProps } from "./ui/components/LoginRequiredModal";
+export { GatedPrice, PricesOnly, GATED_PRICE_CLASS } from "./ui/components/GatedPrice";
+export type { GatedPriceProps } from "./ui/components/GatedPrice";
+export { useCanSeePrices } from "./react/hooks/useCanSeePrices";
+export type { CanSeePricesState } from "./react/hooks/useCanSeePrices";
 export { isAuthError } from "./utils/auth-error";
 export { useToast } from "./ui/components/Toast";
 export { StickyToolbar } from "./ui/components/StickyToolbar";

package/dist/client.js

@@ -89,6 +89,10 @@ export { UnsavedChangesModal } from "./ui/components/UnsavedChangesModal";
 // [CLIENT-ONLY]-Cannot run in SSR mode — uses browser-only APIs (window.location).
 // LoginRequiredModal - Modal prompting unauthenticated users to log in.
 export { LoginRequiredModal } from "./ui/components/LoginRequiredModal";
+// GatedPrice - a money amount only signed-in visitors may read. GATED_PRICE_CLASS
+// is a contract with the JSON-LD paywall markup; see the component.
+export { GatedPrice, PricesOnly, GATED_PRICE_CLASS } from "./ui/components/GatedPrice";
+export { useCanSeePrices } from "./react/hooks/useCanSeePrices";
 // isAuthError - Detects auth/authorization errors from server actions or fetch responses.
 export { isAuthError } from "./utils/auth-error";
 // [CLIENT-ONLY]-Cannot run in SSR mode â€" uses browser-only APIs (window, navigator, localStorage, matchMedia, DOM events) that do not exist in Node.js.

package/dist/core/hooks/useSyncManager.js

@@ -18,7 +18,17 @@ import { useQueryClient } from "@tanstack/react-query";
 import { apiClient } from "../../http";
 import { CART_ENDPOINTS, ACCOUNT_ENDPOINTS } from "../../constants/api-endpoints";
 import { getCartOps, clearCartOps, getWishlistOps, clearWishlistOps, } from "../../features/cart/utils/pending-ops";
-const SYNC_INTERVAL_MS = 30000;
+/**
+ * Cadence for replaying queued cart/wishlist ops.
+ *
+ * A tick with no pending ops is nearly free, but a tick WITH ops also
+ * invalidates the cart and wishlist queries, so each one can cascade into
+ * refetches. At 30s that ran for every signed-in tab for as long as it stayed
+ * open. 2 minutes is ample for an offline-replay backstop — the queue is also
+ * flushed eagerly on `visibilitychange` and `pagehide` (see below), which is
+ * what actually catches the tab-closing case that matters.
+ */
+const SYNC_INTERVAL_MS = 120000;
 async function replayCartOps() {
     const ops = getCartOps();
     if (ops.length === 0)

package/dist/features/account/hooks/useNotifications.js

@@ -1,6 +1,11 @@
 import { useMutation, useQuery } from "@tanstack/react-query";
 import { apiClient } from "../../../http";
 import { NOTIFICATIONS_ENDPOINTS } from "../../../constants/api-endpoints";
+/**
+ * Poll cadence for the notification badge. See the comment at the
+ * `refetchInterval` below for why this is minutes rather than seconds.
+ */
+const NOTIFICATIONS_POLL_MS = 5 * 60000;
 export function useNotifications(limit = 10, options) {
     const notificationsEndpoint = options?.notificationsEndpoint ?? NOTIFICATIONS_ENDPOINTS.LIST;
     const readAllEndpoint = options?.readAllEndpoint ?? NOTIFICATIONS_ENDPOINTS.READ_ALL;
@@ -8,12 +13,27 @@ export function useNotifications(limit = 10, options) {
     const { data, isLoading, refetch } = useQuery({
         queryKey: ["notifications", "list", String(limit)],
         queryFn: () => apiClient.get(`${notificationsEndpoint}?limit=${limit}`),
-        staleTime: 30000,
+        staleTime: NOTIFICATIONS_POLL_MS,
         // Notifications originate server-side (order/bid/moderation events) with
-        // no client-driven local-first path to short-circuit, unlike cart/
-        // wishlist. Poll on the same ~30s cadence as useSyncManager so the bell
-        // badge picks up new notifications without requiring a window refocus.
-        refetchInterval: 30000,
+        // no client-driven local-first path to short-circuit, unlike cart/wishlist,
+        // so the badge does need a poll rather than a local-first read.
+        //
+        // 🛑 This hook is mounted in TitleBar, i.e. on EVERY page of the site, so
+        // its interval is multiplied by every open tab of every signed-in user for
+        // as long as those tabs exist — it is wall-clock, not activity-gated, so a
+        // tab left open overnight keeps firing. At the original 30s that was 120
+        // invocations/hour/tab for an unread COUNT, and it was a material share of
+        // the Vercel function-invocation spend that paused the account (2026-09-14).
+        //
+        // 5 minutes + refetch-on-focus is the trade: a user who is actually looking
+        // at the tab gets a fresh badge the moment they return to it, and an
+        // abandoned tab costs 12 invocations/hour instead of 120.
+        refetchInterval: NOTIFICATIONS_POLL_MS,
+        // The global QueryClient default is `refetchOnWindowFocus: false`
+        // (src/app/[locale]/QueryProvider.tsx). Opt back in HERE specifically,
+        // because it is what makes the longer interval acceptable rather than
+        // simply slower.
+        refetchOnWindowFocus: true,
     });
     const { mutate: markRead } = useMutation({
         mutationFn: (id) => apiClient.patch(readEndpoint(id), {}),

package/dist/features/auctions/components/AuctionBottomActions.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useState } from "react";
 import { useBottomActions } from "../../layout/hooks/useBottomActions";
+import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices";
 import { formatCurrency } from "../../../utils/number.formatter";
 import { ACTION_ID, ACTION_META } from "../../products/constants/action-defs";
 import { useCountdown } from "../../../react";
@@ -40,6 +41,7 @@ export function AuctionBottomActions(props) {
     const { currentBid, currency, bidCount, isEnded, auctionEndDate, buyNowPrice } = props;
     const [open, setOpen] = useState(false);
     const remaining = useCountdown(auctionEndDate ?? undefined);
+    const { canSeePrices } = useCanSeePrices();
     const placeBidMeta = ACTION_META[ACTION_ID.PLACE_BID];
     const buyNowMeta = ACTION_META[ACTION_ID.BUY_NOW_AUCTION];
     // Same single predicate the form and the card use. `!!props.onBuyNow` matters
@@ -54,14 +56,20 @@ export function AuctionBottomActions(props) {
                     ? [
                         {
                             ...buyNowMeta,
-                            label: `Buy Now — ${formatCurrency(buyNowPrice, currency)}`,
+                            // Both of these are plain strings on the bottom bar rather
+                            // than slots, so the gate happens as they are built.
+                            label: canSeePrices
+                                ? `Buy Now — ${formatCurrency(buyNowPrice, currency)}`
+                                : "Buy Now",
                             onClick: () => setOpen(true),
                         },
                     ]
                     : []),
             ],
             secondaryLabel: formatCountdownLabel(remaining),
-            infoLabel: `${formatCurrency(currentBid, currency)} · ${bidCount} bid${bidCount !== 1 ? "s" : ""}`,
+            infoLabel: canSeePrices
+                ? `${formatCurrency(currentBid, currency)} · ${bidCount} bid${bidCount !== 1 ? "s" : ""}`
+                : `Sign in to see the bid · ${bidCount} bid${bidCount !== 1 ? "s" : ""}`,
             desktop: "after-scroll",
         });
     return (_jsx(Modal, { isOpen: open, onClose: () => setOpen(false), size: "md", title: "Place your bid", children: _jsx(PlaceBidFormClient, { ...props }) }));

package/dist/features/auctions/components/AuctionDetailPageView.js

@@ -17,7 +17,7 @@ import { normalizeRichTextHtml } from "../../../utils/string.formatter";
 import { safeDisplayName } from "../../../security";
 import { getSiteSettingsGlobal } from "../../admin/utils/getSiteSettingsGlobal";
 import { isBuyNowAvailable, resolveMinBid, resolveMinBidIncrement, } from "../../../_internal/shared/features/auctions/config";
-import { Button, Container, CountdownDisplay, Div, Heading, Input, Main, Nav, RichText, Row, Section, Span, Stack, Text, Ul, Li, Dl, Dt, Dd, } from "../../../ui";
+import { Button, Container, CountdownDisplay, Div, GatedPrice, PricesOnly, Heading, Input, Main, Nav, RichText, Row, Section, Span, Stack, Text, Ul, Li, Dl, Dt, Dd, } from "../../../ui";
 import { AuctionDetailView } from "../../products/components/AuctionDetailView";
 import { ProductTabsShell } from "../../products/components/ProductTabsShell";
 import { CustomSectionTabContent } from "../../products/components/CustomSectionTabContent";
@@ -48,7 +48,7 @@ function toDescriptionHtml(raw) {
 }
 function renderAuctionInfoPanel(props) {
     const { productId, title, currentBid, currency, bidCount, isEnded, endDate, buyNowPrice, buyNowAvailable, featured, freeShipping, condition, finalSale, category, categoryName, brand, brandSlug, productFeatures, features, descriptionHtml, safeSeller, storeHref } = props;
-    return (_jsxs(Stack, { gap: "md", children: [_jsxs(Div, { children: [_jsxs(Row, { gap: "xs", wrap: true, className: "mb-2", children: [_jsx(Span, { size: "xs", weight: "semibold", className: CLS_LIVE_BADGE, children: "\uD83C\uDFF7\uFE0F Live Auction" }), isEnded ? (_jsx(Span, { color: "error", surface: "danger-surface", size: "xs", weight: "medium", className: "inline-block", padding: "pill-sm", rounded: "full", children: "Ended" })) : (_jsx(Span, { color: "success", surface: "success-surface", size: "xs", weight: "medium", className: "inline-block", padding: "pill-sm", rounded: "full", children: "Active" }))] }), _jsx(Heading, { level: 1, className: "leading-snug", smSize: "2xl", color: "primary", size: "xl", weight: "bold", children: title })] }), _jsxs(Div, { children: [_jsx(Text, { className: "mb-0.5", color: "muted", size: "xs", children: "Current bid" }), _jsx(LiveBidPrice, { productId: productId, currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, priceSize: "2xl", badgeSize: "sm" }), endDate && !isEnded && (_jsxs(Text, { className: "mt-1.5", color: "muted", size: "sm", children: ["Ends in ", _jsx(Span, { weight: "medium", color: "muted", children: _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" }) })] })), endDate && _jsxs(Text, { className: "mt-0.5", color: "faint", size: "xs", children: [isEnded ? "Ended" : "Ends", " ", endDate.toLocaleString()] })] }), buyNowAvailable && buyNowPrice !== null && (_jsxs(Row, { align: "center", gap: "sm", className: "border border-[var(--appkit-color-primary-200)] dark:border-[var(--appkit-color-primary-800)] bg-primary-50 dark:bg-primary-900/20", padding: "inlineSm", rounded: "lg", children: [_jsx(Span, { size: "xs", color: "muted", children: "Buy Now:" }), _jsx(Span, { size: "base", weight: "bold", className: "text-primary-700 dark:text-primary-300", children: formatCurrency(buyNowPrice, currency) }), _jsx(Span, { size: "xs", color: "faint", children: "\u2014 in \u201CPlace a bid\u201D" })] })), _jsx(ProductFeatureBadges, { featured: featured, freeShipping: freeShipping, condition: condition ?? undefined, finalSale: finalSale, labels: { featured: "Featured", fasterDelivery: "Faster Delivery", ratedSeller: "Rated Seller", condition: "Condition", conditionNew: "New", conditionUsed: "Used", conditionBroken: "For Parts", conditionRefurbished: "Refurbished", returnable: "Returnable", finalSale: "Final Sale", freeShipping: "Free Shipping", codAvailable: "Cash on Delivery", emiAvailable: "EMI Available", wishlistCount: (n) => `${n} wishlisted`, categoryProductCount: (n, cat) => `${n} in ${cat}` } }), (categoryName || category || brand) && (_jsxs(Row, { gap: "sm", wrap: true, children: [category && _jsx(Link, { href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category)), className: "inline-flex items-center rounded-full border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] px-[var(--appkit-space-2-5)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium text-[var(--appkit-color-text-muted)] transition-colors hover:border-primary-300 hover:bg-primary-surface hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:text-primary-400", children: categoryName || category }), !category && categoryName && _jsx(Span, { layout: "inline-flex", size: "xs", weight: "medium", border: "subtle", rounded: "full", padding: "pill-sm-tall", surface: "muted", color: "muted", children: categoryName }), brand && brandSlug && _jsx(Link, { href: String(ROUTES.PUBLIC.BRAND_DETAIL(brandSlug)), className: "inline-flex items-center rounded-full border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] px-[var(--appkit-space-2-5)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium text-[var(--appkit-color-text-muted)] transition-colors hover:border-primary-300 hover:bg-primary-surface hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:text-primary-400", children: brand }), brand && !brandSlug && _jsx(Span, { layout: "inline-flex", size: "xs", weight: "medium", border: "subtle", rounded: "full", padding: "pill-sm-tall", surface: "muted", color: "muted", children: brand })] })), productFeatures && features.length > 0 && _jsx(FeatureBadgeList, { productFeatureIds: features, features: productFeatures }), !productFeatures && features.length > 0 && (_jsxs(Div, { border: "subtle", surface: "muted", padding: "inline", rounded: "xl", children: [_jsx(Text, { className: "mb-2 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "About this item" }), _jsx(Ul, { spacing: "comfortable", size: "sm", color: "primary", children: features.map((f, i) => _jsxs(Li, { layout: "flex-start", gap: "2", children: [_jsx(Span, { className: "mt-0.5 flex-shrink-0 text-primary-500", children: "\u2022" }), f] }, i)) })] })), descriptionHtml && _jsx(RichText, { html: descriptionHtml, proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: "text-[length:var(--appkit-text-sm)] leading-relaxed text-[var(--appkit-color-text-muted)] line-clamp-4" }), safeSeller && (_jsx(Div, { className: `${__P.p3}`, border: "subtle", rounded: "xl", surface: "muted", children: _jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-[10px] tracking-wide mb-0.5", color: "faint", transform: "uppercase", children: "Listed by" }), _jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: safeSeller })] }), storeHref && _jsx(Link, { href: storeHref, className: "shrink-0 rounded-lg bg-primary/10 dark:bg-primary/20 px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-xs)] font-semibold text-primary-700 dark:text-primary-300 hover:bg-primary/20 dark:hover:bg-primary/30 transition-colors", children: "Visit Store \u2192" })] }) }))] }));
+    return (_jsxs(Stack, { gap: "md", children: [_jsxs(Div, { children: [_jsxs(Row, { gap: "xs", wrap: true, className: "mb-2", children: [_jsx(Span, { size: "xs", weight: "semibold", className: CLS_LIVE_BADGE, children: "\uD83C\uDFF7\uFE0F Live Auction" }), isEnded ? (_jsx(Span, { color: "error", surface: "danger-surface", size: "xs", weight: "medium", className: "inline-block", padding: "pill-sm", rounded: "full", children: "Ended" })) : (_jsx(Span, { color: "success", surface: "success-surface", size: "xs", weight: "medium", className: "inline-block", padding: "pill-sm", rounded: "full", children: "Active" }))] }), _jsx(Heading, { level: 1, className: "leading-snug", smSize: "2xl", color: "primary", size: "xl", weight: "bold", children: title })] }), _jsxs(Div, { children: [_jsx(Text, { className: "mb-0.5", color: "muted", size: "xs", children: "Current bid" }), _jsx(LiveBidPrice, { productId: productId, currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, priceSize: "2xl", badgeSize: "sm" }), endDate && !isEnded && (_jsxs(Text, { className: "mt-1.5", color: "muted", size: "sm", children: ["Ends in ", _jsx(Span, { weight: "medium", color: "muted", children: _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" }) })] })), endDate && _jsxs(Text, { className: "mt-0.5", color: "faint", size: "xs", children: [isEnded ? "Ended" : "Ends", " ", endDate.toLocaleString()] })] }), buyNowAvailable && buyNowPrice !== null && (_jsxs(Row, { align: "center", gap: "sm", className: "border border-[var(--appkit-color-primary-200)] dark:border-[var(--appkit-color-primary-800)] bg-primary-50 dark:bg-primary-900/20", padding: "inlineSm", rounded: "lg", children: [_jsx(Span, { size: "xs", color: "muted", children: "Buy Now:" }), _jsx(Span, { size: "base", weight: "bold", className: "text-primary-700 dark:text-primary-300", children: _jsx(GatedPrice, { label: "Sign in to see the Buy Now price", children: formatCurrency(buyNowPrice, currency) }) }), _jsx(Span, { size: "xs", color: "faint", children: "\u2014 in \u201CPlace a bid\u201D" })] })), _jsx(ProductFeatureBadges, { featured: featured, freeShipping: freeShipping, condition: condition ?? undefined, finalSale: finalSale, labels: { featured: "Featured", fasterDelivery: "Faster Delivery", ratedSeller: "Rated Seller", condition: "Condition", conditionNew: "New", conditionUsed: "Used", conditionBroken: "For Parts", conditionRefurbished: "Refurbished", returnable: "Returnable", finalSale: "Final Sale", freeShipping: "Free Shipping", codAvailable: "Cash on Delivery", emiAvailable: "EMI Available", wishlistCount: (n) => `${n} wishlisted`, categoryProductCount: (n, cat) => `${n} in ${cat}` } }), (categoryName || category || brand) && (_jsxs(Row, { gap: "sm", wrap: true, children: [category && _jsx(Link, { href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category)), className: "inline-flex items-center rounded-full border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] px-[var(--appkit-space-2-5)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium text-[var(--appkit-color-text-muted)] transition-colors hover:border-primary-300 hover:bg-primary-surface hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:text-primary-400", children: categoryName || category }), !category && categoryName && _jsx(Span, { layout: "inline-flex", size: "xs", weight: "medium", border: "subtle", rounded: "full", padding: "pill-sm-tall", surface: "muted", color: "muted", children: categoryName }), brand && brandSlug && _jsx(Link, { href: String(ROUTES.PUBLIC.BRAND_DETAIL(brandSlug)), className: "inline-flex items-center rounded-full border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] px-[var(--appkit-space-2-5)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium text-[var(--appkit-color-text-muted)] transition-colors hover:border-primary-300 hover:bg-primary-surface hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:text-primary-400", children: brand }), brand && !brandSlug && _jsx(Span, { layout: "inline-flex", size: "xs", weight: "medium", border: "subtle", rounded: "full", padding: "pill-sm-tall", surface: "muted", color: "muted", children: brand })] })), productFeatures && features.length > 0 && _jsx(FeatureBadgeList, { productFeatureIds: features, features: productFeatures }), !productFeatures && features.length > 0 && (_jsxs(Div, { border: "subtle", surface: "muted", padding: "inline", rounded: "xl", children: [_jsx(Text, { className: "mb-2 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "About this item" }), _jsx(Ul, { spacing: "comfortable", size: "sm", color: "primary", children: features.map((f, i) => _jsxs(Li, { layout: "flex-start", gap: "2", children: [_jsx(Span, { className: "mt-0.5 flex-shrink-0 text-primary-500", children: "\u2022" }), f] }, i)) })] })), descriptionHtml && _jsx(RichText, { html: descriptionHtml, proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: "text-[length:var(--appkit-text-sm)] leading-relaxed text-[var(--appkit-color-text-muted)] line-clamp-4" }), safeSeller && (_jsx(Div, { className: `${__P.p3}`, border: "subtle", rounded: "xl", surface: "muted", children: _jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-[10px] tracking-wide mb-0.5", color: "faint", transform: "uppercase", children: "Listed by" }), _jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: safeSeller })] }), storeHref && _jsx(Link, { href: storeHref, className: "shrink-0 rounded-lg bg-primary/10 dark:bg-primary/20 px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-xs)] font-semibold text-primary-700 dark:text-primary-300 hover:bg-primary/20 dark:hover:bg-primary/30 transition-colors", children: "Visit Store \u2192" })] }) }))] }));
 }
 /**
  * Store reviews for the auction's seller.
@@ -218,7 +218,16 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, on
                     storeName: typeof p.storeName === "string" ? p.storeName : undefined,
                 } }), _jsxs(Container, { size: "xl", padding: "y-lg", children: [_jsxs(Row, { className: "mb-4", align: "center", justify: "between", gap: "sm", wrap: true, children: [_jsxs(Nav, { "aria-label": "Breadcrumb", layout: "flex-wrap", gap: "2xs", textSize: "xs", color: "muted", children: [_jsx(Link, { href: String(ROUTES.HOME), className: CLS_BREADCRUMB_LINK, children: "Home" }), _jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.AUCTIONS), className: CLS_BREADCRUMB_LINK, children: "Auctions" }), category && (_jsxs(_Fragment, { children: [_jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category)), className: CLS_BREADCRUMB_LINK, children: categoryName || category })] })), _jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Span, { className: "truncate max-w-[200px]", color: "muted", children: title })] }), _jsx(ShareButton, { title: title })] }), _jsx(AuctionDetailView, { renderGallery: () => (_jsx(ProductGalleryClient, { images: images, video: productVideo, productName: title })), renderInfo: () => renderAuctionInfoPanel({ productId: String(product.id), title, currentBid, currency, bidCount, isEnded, endDate, buyNowPrice, buyNowAvailable, featured, freeShipping, condition, finalSale: isFinalSale(p), category, categoryName, brand, brandSlug, productFeatures, features, descriptionHtml, safeSeller, storeHref }), renderBidForm: () => onPlaceBid ? (_jsx(Stack, { id: "auction-bid-form", gap: "3", children: _jsxs(Stack, { className: `${__P.p5}`, border: "subtle", gap: "3", rounded: "xl", surface: "muted", children: [_jsxs(Row, { justify: "between", align: "baseline", children: [_jsx(LiveBidPrice, { productId: String(product.id), currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, priceSize: "xl", badgeSize: "xs" }), !isEnded && (_jsx(LiveMinIncrement, { productId: String(product.id), currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, tiers: bidIncrementTiers, minBidIncrementOverride: minBidIncrementOverride }))] }), !isEnded && endDate && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(PlaceBidModalButton, { productId: String(product.id), currentBid: currentBid, startingBid: startingBid, tiers: bidIncrementTiers, minBidIncrementOverride: minBidIncrementOverride, currency: currency, isEnded: isEnded, auctionEndDate: endDate, buyNowPrice: buyNowPrice, bidCount: bidCount, tags: tags, onPlaceBid: onPlaceBid, onBuyNow: onBuyNow, triggerClassName: "w-full" })] }) })) : (
                         /* Read-only bid panel — shown when no bid action is wired (preview/demo) */
-                        _jsxs(Stack, { className: `${__P.p5}`, border: "subtle", gap: "md", rounded: "xl", surface: "muted", children: [_jsx(Stack, { gap: "xs", children: _jsxs(Text, { size: "xs", color: "muted", children: ["Starting bid: ", formatCurrency(startingBid, currency), !isEnded && _jsxs(_Fragment, { children: [" \u00B7 min increment ", formatCurrency(initialMinBidIncrement, currency)] })] }) }), _jsxs(Stack, { gap: "sm", children: [_jsx(Input, { type: "number", placeholder: `At least ${formatCurrency(initialMinBid, currency)}`, min: initialMinBid, "aria-label": "Your bid amount", disabled: isEnded }), !isEnded && endDate && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded, children: isEnded ? "Auction Ended" : "Place Bid" }), buyNowAvailable && buyNowPrice !== null && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Buy Now available at ", formatCurrency(buyNowPrice, currency)] }))] }), tags.length > 0 && (_jsx(Div, { border: "default", className: "border-t", padding: "t-md", children: _jsx(Row, { wrap: true, gap: "xs", children: tags.map((tag) => (_jsx(Span, { size: "xs", rounded: "full", padding: "pill-sm-tall", surface: "subtle", color: "muted", children: tag }, tag))) }) }))] })), renderMobileBidForm: () => !isEnded && onPlaceBid ? (_jsxs(Stack, { className: `lg:hidden ${__P.p4}`, border: "subtle", gap: "3", rounded: "xl", surface: "muted", children: [_jsx(LiveBidPrice, { productId: String(product.id), currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, priceSize: "base", badgeSize: "xs" }), endDate && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(PlaceBidModalButton, { productId: String(product.id), currentBid: currentBid, startingBid: startingBid, tiers: bidIncrementTiers, minBidIncrementOverride: minBidIncrementOverride, currency: currency, isEnded: isEnded, auctionEndDate: endDate, buyNowPrice: buyNowPrice, bidCount: bidCount, tags: tags, onPlaceBid: onPlaceBid, onBuyNow: onBuyNow, triggerClassName: "w-full" })] })) : !isEnded ? (_jsxs(Div, { className: `${__P.p4} lg:hidden`, border: "subtle", rounded: "xl", surface: "muted", children: [_jsxs(Row, { align: "center", gap: "sm", className: "mb-3", children: [_jsx(Span, { size: "base", weight: "bold", className: "text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsxs(Span, { size: "xs", color: "muted", children: [bidCount, " bids"] })] }), endDate && (_jsxs(Text, { align: "center", className: "mb-3", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Place Bid" })] })) : null, renderSublistingSection: sublistingCategoryId
+                        _jsxs(Stack, { className: `${__P.p5}`, border: "subtle", gap: "md", rounded: "xl", surface: "muted", children: [_jsx(Stack, { gap: "xs", children: _jsx(Text, { size: "xs", color: "muted", children: _jsxs(GatedPrice, { label: "Sign in to see the starting bid", children: ["Starting bid: ", formatCurrency(startingBid, currency), !isEnded && _jsxs(_Fragment, { children: [" \u00B7 min increment ", formatCurrency(initialMinBidIncrement, currency)] })] }) }) }), _jsxs(Stack, { gap: "sm", children: [_jsx(Input, { type: "number", 
+                                            // The minimum is stated in the gated line above rather than
+                                            // in the placeholder: a placeholder is a plain string prop,
+                                            // so it cannot be gated in place and would print the bid
+                                            // floor to signed-out visitors.
+                                            placeholder: "Enter your bid", min: initialMinBid, "aria-label": "Your bid amount", disabled: isEnded }), !isEnded && endDate && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded, children: isEnded ? "Auction Ended" : "Place Bid" }), buyNowAvailable && buyNowPrice !== null && (
+                                        // Hidden rather than prompted: the Buy Now chip at the top
+                                        // of the panel already carries the gate, so repeating the
+                                        // prompt here would be the same affordance twice.
+                                        _jsx(PricesOnly, { children: _jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Buy Now available at ", formatCurrency(buyNowPrice, currency)] }) }))] }), tags.length > 0 && (_jsx(Div, { border: "default", className: "border-t", padding: "t-md", children: _jsx(Row, { wrap: true, gap: "xs", children: tags.map((tag) => (_jsx(Span, { size: "xs", rounded: "full", padding: "pill-sm-tall", surface: "subtle", color: "muted", children: tag }, tag))) }) }))] })), renderMobileBidForm: () => !isEnded && onPlaceBid ? (_jsxs(Stack, { className: `lg:hidden ${__P.p4}`, border: "subtle", gap: "3", rounded: "xl", surface: "muted", children: [_jsx(LiveBidPrice, { productId: String(product.id), currentBid: currentBid, bidCount: bidCount, currency: currency, isEnded: isEnded, priceSize: "base", badgeSize: "xs" }), endDate && (_jsxs(Text, { align: "center", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(PlaceBidModalButton, { productId: String(product.id), currentBid: currentBid, startingBid: startingBid, tiers: bidIncrementTiers, minBidIncrementOverride: minBidIncrementOverride, currency: currency, isEnded: isEnded, auctionEndDate: endDate, buyNowPrice: buyNowPrice, bidCount: bidCount, tags: tags, onPlaceBid: onPlaceBid, onBuyNow: onBuyNow, triggerClassName: "w-full" })] })) : !isEnded ? (_jsxs(Div, { className: `${__P.p4} lg:hidden`, border: "subtle", rounded: "xl", surface: "muted", children: [_jsxs(Row, { align: "center", gap: "sm", className: "mb-3", children: [_jsx(Span, { size: "base", weight: "bold", className: "text-primary-600 dark:text-primary-400", children: _jsx(GatedPrice, { label: "Sign in to see the current bid", children: formatCurrency(currentBid, currency) }) }), _jsxs(Span, { size: "xs", color: "muted", children: [bidCount, " bids"] })] }), endDate && (_jsxs(Text, { align: "center", className: "mb-3", size: "xs", color: "muted", children: ["Ends in ", _jsx(CountdownDisplay, { targetDate: endDate, format: "auto", expiredLabel: "Ended" })] })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Place Bid" })] })) : null, renderSublistingSection: sublistingCategoryId
                             ? () => (_jsx(SublistingCarouselSection, { sublistingCategoryId: sublistingCategoryId, currentListingId: String(product.id) }))
                             : undefined, renderTabs: () => (_jsx(ProductTabsShell, { descriptionContent: descriptionHtml ? (_jsx(RichText, { html: descriptionHtml, proseClass: "prose prose-sm sm:prose max-w-none dark:prose-invert", className: "text-[var(--appkit-color-text-muted)]" })) : undefined, specsContent: specs.length > 0 ? (_jsx(Dl, { divide: "subtle", rounded: "xl", border: "subtle", className: "overflow-hidden", children: specs.map((s, i) => (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-36 flex-shrink-0", color: "primary", weight: "medium", children: s.name }), _jsxs(Dd, { className: "flex-1", color: "muted", children: [s.value, s.unit ? ` ${s.unit}` : ""] })] }, i))) })) : undefined, customTabs: customSections.map((s) => ({
                                 id: s.id,

package/dist/features/auctions/components/LiveBidPrice.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Row, Span } from "../../../ui";
+import { GatedPrice, Row, Span } from "../../../ui";
 import { formatCurrency } from "../../../utils/number.formatter";
 import { useLiveAuctionBid } from "../hooks/useLiveAuctionBid";
 /**
@@ -13,5 +13,5 @@ import { useLiveAuctionBid } from "../hooks/useLiveAuctionBid";
  */
 export function LiveBidPrice({ productId, currentBid, bidCount, currency, isEnded, priceSize = "xl", badgeSize = "xs", }) {
     const live = useLiveAuctionBid(productId, currentBid, bidCount, { enabled: !isEnded });
-    return (_jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Span, { weight: "bold", className: "text-primary-600 dark:text-primary-400", size: priceSize, children: formatCurrency(live.currentBid, currency) }), _jsxs(Span, { size: badgeSize, weight: "medium", rounded: "full", padding: "pill-md", surface: "subtle", color: "muted", children: [live.bidCount, " ", live.bidCount === 1 ? "bid" : "bids"] })] }));
+    return (_jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Span, { weight: "bold", className: "text-primary-600 dark:text-primary-400", size: priceSize, children: _jsx(GatedPrice, { label: "Sign in to see the current bid", children: formatCurrency(live.currentBid, currency) }) }), _jsxs(Span, { size: badgeSize, weight: "medium", rounded: "full", padding: "pill-md", surface: "subtle", color: "muted", children: [live.bidCount, " ", live.bidCount === 1 ? "bid" : "bids"] })] }));
 }

package/dist/features/auctions/components/LiveMinIncrement.d.ts

@@ -15,4 +15,4 @@ export interface LiveMinIncrementProps {
  * increment depends on the current bid amount (tiered), so it must keep
  * resolving against the live current bid, not just the SSR snapshot.
  */
-export declare function LiveMinIncrement({ productId, currentBid, bidCount, currency, isEnded, tiers, minBidIncrementOverride, size, }: LiveMinIncrementProps): import("react").JSX.Element;
+export declare function LiveMinIncrement({ productId, currentBid, bidCount, currency, isEnded, tiers, minBidIncrementOverride, size, }: LiveMinIncrementProps): import("react").JSX.Element | null;

package/dist/features/auctions/components/LiveMinIncrement.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Span } from "../../../ui";
+import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices";
 import { formatCurrency } from "../../../utils/number.formatter";
 import { useLiveAuctionBid } from "../hooks/useLiveAuctionBid";
 import { resolveMinBidIncrement, } from "../../../_internal/shared/features/auctions/config";
@@ -13,5 +14,12 @@ import { resolveMinBidIncrement, } from "../../../_internal/shared/features/auct
 export function LiveMinIncrement({ productId, currentBid, bidCount, currency, isEnded, tiers, minBidIncrementOverride, size = "xs", }) {
     const live = useLiveAuctionBid(productId, currentBid, bidCount, { enabled: !isEnded });
     const increment = resolveMinBidIncrement(live.currentBid, tiers, minBidIncrementOverride);
+    const { canSeePrices } = useCanSeePrices();
+    // The increment is derived from the current bid, so it discloses the bid's
+    // magnitude. This is a SECONDARY hint next to the gated bid itself, so it
+    // hides outright — "min increment Sign in to see price" reads as broken copy,
+    // and the prompt is already on the bid one line up.
+    if (!canSeePrices)
+        return null;
     return (_jsxs(Span, { size: size, color: "muted", children: ["min increment ", formatCurrency(increment, currency)] }));
 }

package/dist/features/auctions/components/MarketplaceAuctionCard.js

@@ -12,7 +12,7 @@ import { useCountdown } from "../../../react";
 import { ROUTES } from "../../../next";
 import { formatCurrency } from "../../../utils";
 import { getDefaultCurrency } from "../../../core/baseline-resolver";
-import { BaseListingCard, Button, Caption, Div, Row, Span, Stack, Text, TextLink } from "../../../ui";
+import { BaseListingCard, Button, Caption, Div, GatedPrice, Row, Span, Stack, Text, TextLink } from "../../../ui";
 import { isBuyNowAvailable } from "../../../_internal/shared/features/auctions/config";
 import { CardStoreLine } from "../../products/components/CardStoreLine";
 const CLS_STAR_ICON = "h-5 w-5 fill-warning text-warning";
@@ -25,11 +25,11 @@ function renderAuctionCardHero(props) {
 }
 function renderAuctionCardInfoList(props) {
     const { product, auctionHref, displayBid, bidCount, isEnded, remaining, inWishlist, wishlistLoading, wishlistActions, countdownClass, mergedLabels, handleWishlist, handleNavigate } = props;
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: `flex-1 leading-snug transition-colors hover:text-primary`, color: "primary", truncate: 2, size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), _jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", className: `items-[center] py-[0.125rem] text-[11px] ${countdownClass}`, padding: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-2.5 w-2.5" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), bidCount > 0 && _jsx(Caption, { className: "text-[11px]", children: mergedLabels.totalBids(bidCount) })] }), !isEnded && (_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", className: "self-start px-[0.625rem] mt-0.5", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }))] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: `flex-1 leading-snug transition-colors hover:text-primary`, color: "primary", truncate: 2, size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: _jsx(GatedPrice, { label: "Sign in to see the bid", children: formatCurrency(displayBid, getDefaultCurrency()) }) }), _jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", className: `items-[center] py-[0.125rem] text-[11px] ${countdownClass}`, padding: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-2.5 w-2.5" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), bidCount > 0 && _jsx(Caption, { className: "text-[11px]", children: mergedLabels.totalBids(bidCount) })] }), !isEnded && (_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", className: "self-start px-[0.625rem] mt-0.5", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }))] }));
 }
 function renderAuctionCardInfoGrid(props) {
     const { product, auctionHref, displayBid, bidCount, hasCurrentBid, isEnded, remaining, resolvedBuyoutPrice, inWishlist, wishlistLoading, wishlistActions, countdownClass, mergedLabels, handleWishlist, handleNavigate } = props;
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, { align: "start", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: "min-w-0 flex-1 leading-snug transition-colors hover:text-primary", color: "primary", size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Div, { children: [_jsx(Caption, { children: isEnded && hasCurrentBid ? mergedLabels.winningBid : hasCurrentBid ? mergedLabels.currentBid : mergedLabels.startingBid }), _jsx(Text, { className: "leading-none text-primary", size: "base", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), isEnded && product.winnerDisplayName && (_jsxs(Caption, { className: "mt-0.5", color: "muted", children: [mergedLabels.wonBy, ": ", maskDisplayName(product.winnerDisplayName)] }))] }), _jsxs(Row, { wrap: true, justify: "between", gap: "sm", className: "gap-x-2 gap-y-1", children: [_jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", textSize: "xs", className: `items-[center] ${countdownClass}`, paddingY: "y-2xs", paddingX: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-3 w-3" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), _jsx(Caption, { children: mergedLabels.totalBids(bidCount) })] }), _jsx(Row, { wrap: true, gap: "xs", className: "mt-auto", children: isEnded ? (_jsx(Button, { gap: "xs", type: "button", variant: "ghost", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1 cursor-not-allowed opacity-60", disabled: true, children: _jsx(Span, { children: mergedLabels.ended }) })) : (_jsxs(_Fragment, { children: [_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }), resolvedBuyoutPrice ? (
+    return (_jsxs(_Fragment, { children: [_jsxs(Row, { align: "start", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: "min-w-0 flex-1 leading-snug transition-colors hover:text-primary", color: "primary", size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Div, { children: [_jsx(Caption, { children: isEnded && hasCurrentBid ? mergedLabels.winningBid : hasCurrentBid ? mergedLabels.currentBid : mergedLabels.startingBid }), _jsx(Text, { className: "leading-none text-primary", size: "base", weight: "bold", children: _jsx(GatedPrice, { label: "Sign in to see the bid", children: formatCurrency(displayBid, getDefaultCurrency()) }) }), isEnded && product.winnerDisplayName && (_jsxs(Caption, { className: "mt-0.5", color: "muted", children: [mergedLabels.wonBy, ": ", maskDisplayName(product.winnerDisplayName)] }))] }), _jsxs(Row, { wrap: true, justify: "between", gap: "sm", className: "gap-x-2 gap-y-1", children: [_jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", textSize: "xs", className: `items-[center] ${countdownClass}`, paddingY: "y-2xs", paddingX: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-3 w-3" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), _jsx(Caption, { children: mergedLabels.totalBids(bidCount) })] }), _jsx(Row, { wrap: true, gap: "xs", className: "mt-auto", children: isEnded ? (_jsx(Button, { gap: "xs", type: "button", variant: "ghost", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1 cursor-not-allowed opacity-60", disabled: true, children: _jsx(Span, { children: mergedLabels.ended }) })) : (_jsxs(_Fragment, { children: [_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }), resolvedBuyoutPrice ? (
                         /* `secondary`, not `danger` — this button only navigates to the
                            PDP, and `danger` is reserved for destructive actions (Rule #7
                            kinds). ACTIONS.AUCTION["buy-it-now"] is itself `secondary`. */

package/dist/features/auctions/components/PlaceBidFormClient.js

@@ -5,7 +5,9 @@ import { useRouter } from "next/navigation";
 import { useTranslations } from "next-intl";
 import { formatCurrency } from "../../../utils/number.formatter";
 import { isAuthError } from "../../../utils/auth-error";
-import { Button, CountdownDisplay, Div, LoginRequiredModal, Modal, Row, Span, Stack, Text } from "../../../ui";
+import { Button, CountdownDisplay, Div, LoginRequiredModal, Modal, Row, Span, Stack, Text, TextLink } from "../../../ui";
+import { ROUTES } from "../../../next/routing/route-map";
+import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices";
 import { Form } from "../../../ui/components/Form";
 import { FieldInput } from "../../../ui/forms/FieldInput";
 import { applyZodIssues } from "../../../ui/forms/apply-zod-issues";
@@ -36,6 +38,10 @@ const BID_FALLBACK = "Failed to place bid. Please try again.";
 const BUY_NOW_FALLBACK = "Buy Now failed. Please try again.";
 export function PlaceBidFormClient({ productId, currentBid: ssrCurrentBid, startingBid, tiers, minBidIncrementOverride, currency, isEnded, auctionEndDate, buyNowPrice, bidCount: ssrBidCount, tags = [], onPlaceBid, onBuyNow, }) {
     const router = useRouter();
+    // Declared with the other hooks, never inside the early return below — a
+    // conditional hook is a render-order violation, and this component early-
+    // returns for signed-out viewers.
+    const { canSeePrices } = useCanSeePrices();
     // Live-updates while the bid card is open — reflects other bidders'
     // activity on this auction, not just the bidder's own submission.
     const live = useLiveAuctionBid(productId, ssrCurrentBid, ssrBidCount, { enabled: !isEnded });
@@ -219,6 +225,15 @@ export function PlaceBidFormClient({ productId, currentBid: ssrCurrentBid, start
             }
         });
     }
+    // A signed-out visitor cannot place a bid — `useAuthGate` already stops the
+    // submit — and this panel is the single densest money surface on the site:
+    // current bid, starting bid, minimum, increment, the +N preset chips and the
+    // Buy Now price, twelve amounts in all. Replacing the whole panel is both the
+    // honest affordance (the form was never usable) and the only version that
+    // cannot leak one of the twelve through a string prop.
+    if (!canSeePrices) {
+        return (_jsxs(Stack, { className: `${__P.p5}`, border: "subtle", gap: "sm", rounded: "xl", surface: "muted", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Bidding is for members" }), _jsx(Text, { size: "xs", color: "muted", children: "Sign in to see the current bid and place your own." }), _jsx(TextLink, { href: String(ROUTES.AUTH.LOGIN), weight: "semibold", size: "sm", children: "Sign in to bid" })] }));
+    }
     return (_jsxs(Stack, { className: `${__P.p5}`, border: "subtle", gap: "md", rounded: "xl", surface: "muted", children: [_jsxs(Stack, { gap: "xs", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsx(Text, { size: "xs", color: "muted", children: hasBids ? "Current bid" : "Starting bid" }), _jsx(Text, { size: "xs", color: "muted", children: hasBids ? "Starting bid" : "Minimum bid" })] }), _jsxs(Row, { justify: "between", align: "baseline", children: [_jsx(Span, { size: "xl", weight: "bold", className: "text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsx(Span, { size: "sm", color: "muted", children: formatCurrency(hasBids ? startingBid : minBid, currency) })] }), _jsxs(Text, { size: "xs", color: "faint", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids", " \u00B7 min increment", " ", formatCurrency(minBidIncrement, currency)] })] }), _jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to place a bid. Please log in or create an account to continue." }), _jsx(Form, { schema: schema, onSubmit: (e) => {
                     // handler wired through render-prop below — keeps setFieldError in scope
                     e.preventDefault();

package/dist/features/auctions/hooks/useAuctions.js

@@ -57,7 +57,18 @@ export function useAuctionBids(auctionSlug, limit = 10, opts) {
         queryKey: ["auction-bids", auctionSlug, limit],
         queryFn: () => apiClient.get(`${AUCTION_ENDPOINTS.BIDS(auctionSlug)}?limit=${limit}`),
         enabled: (opts?.enabled ?? true) && !!auctionSlug,
-        refetchInterval: 15000, // refresh every 15 s for real-time feel
+        // 🛑 Do NOT restore a ~15s interval here. Live auction state on the detail
+        // page comes from the SSE channel (`useRealtimeBids` -> `useLiveAuctionBid`,
+        // consumed by LiveBidPrice / LiveMinIncrement / PlaceBidFormClient), NOT
+        // from this hook — so a fast poll here buys no freshness the page does not
+        // already have, and duplicates a stream that already costs a held-open
+        // function per viewer.
+        //
+        // Verified 2026-09-14: this hook currently has no call sites at all outside
+        // the appkit barrel re-export, so the old 15s interval was billing nothing
+        // only by accident. Kept deliberately slow so that adopting it cannot
+        // silently reintroduce a per-viewer poll.
+        refetchInterval: 60000,
     });
     return {
         bids: data?.items ?? [],

package/dist/features/auctions/hooks/useRealtimeBids.d.ts

@@ -28,6 +28,9 @@ export interface UseRealtimeBidsReturn {
  * Uses a streaming route that keeps a server-side listener open and pushes
  * updates to the browser via text/event-stream. No Firebase client SDK required.
  *
+ * Multiple instances pointed at the same URL share ONE underlying connection —
+ * see the `channels` map above for why that matters.
+ *
  * @param productId - The auction product ID to subscribe to, or null to disable
  * @param getEndpoint - Optional: override the SSE endpoint URL builder.
  *   Defaults to `/api/realtime/bids/{productId}`.

package/dist/features/auctions/hooks/useRealtimeBids.js

@@ -3,6 +3,126 @@ import { normalizeError } from "../../../errors/normalize";
 import { useEffect, useState } from "react";
 import { logger } from "../../../core/Logger";
 import { BID_ENDPOINTS } from "../../../constants/api-endpoints";
+/**
+ * One EventSource per SSE URL, shared by every hook instance that asks for it.
+ *
+ * 🛑 THIS SHARING IS LOAD-BEARING, NOT AN OPTIMISATION.
+ *
+ * `/api/realtime/bids/[id]` holds a serverless invocation open for its full
+ * 45s TTL per connection (route `maxDuration = 50`, `STREAM_TTL_MS = 45_000`),
+ * then self-closes so the browser reconnects. So a connection is not a cheap
+ * socket — it is a continuously-billed function.
+ *
+ * This hook is consumed by `useLiveAuctionBid`, which `LiveBidPrice`,
+ * `LiveMinIncrement` and `PlaceBidFormClient` each call independently — and
+ * `AuctionDetailPageView` mounts those five times over. Before this map, one
+ * auction page view opened FIVE concurrent EventSources to the same URL and
+ * therefore pinned five held-open functions, all pushing byte-identical data.
+ * That was a material share of the Fluid Active CPU that paused the Vercel
+ * account (2026-09-14).
+ *
+ * Keyed on the resolved URL rather than on productId: `getEndpoint` is an
+ * override, and two callers pointing at different endpoints for the same
+ * product must not be handed each other's stream.
+ */
+const channels = new Map();
+/**
+ * Grace period before a zero-ref channel is actually closed.
+ *
+ * Without it, any remount — a React StrictMode double-invoke in dev, a tab
+ * switch inside the page, a re-render that swaps the subtree — tears the
+ * stream down and immediately builds a new one, which costs a fresh function
+ * invocation each time. The route's own header comment records that an
+ * uncontrolled reconnect loop is exactly the failure this endpoint has already
+ * had once.
+ */
+const CHANNEL_CLOSE_GRACE_MS = 1000;
+function notify(channel) {
+    const snapshot = {
+        data: channel.data,
+        connected: channel.connected,
+    };
+    for (const subscriber of channel.subscribers)
+        subscriber(snapshot);
+}
+function openChannel(url) {
+    const es = new EventSource(url);
+    const channel = {
+        es,
+        refCount: 0,
+        subscribers: new Set(),
+        closeTimer: null,
+        data: null,
+        connected: false,
+    };
+    es.onmessage = (event) => {
+        try {
+            const msg = JSON.parse(event.data);
+            if (msg.type === "connected") {
+                channel.connected = true;
+            }
+            else if (msg.type === "update") {
+                channel.data = msg.data ?? null;
+                channel.connected = true;
+            }
+            else if (msg.type === "error") {
+                channel.connected = false;
+            }
+            else {
+                return;
+            }
+            notify(channel);
+        }
+        catch (_err) {
+            void normalizeError(_err);
+            logger.warn("[useRealtimeBids] Failed to parse SSE message");
+        }
+    };
+    es.onerror = () => {
+        // EventSource reconnects on its own, including after the route's
+        // deliberate 45s self-close. Report disconnected; do NOT close here, or
+        // the built-in reconnect is lost and the stream dies permanently.
+        channel.connected = false;
+        notify(channel);
+        logger.warn("[useRealtimeBids] SSE connection error — will retry");
+    };
+    return channel;
+}
+function subscribe(url, onState) {
+    let channel = channels.get(url);
+    if (!channel) {
+        channel = openChannel(url);
+        channels.set(url, channel);
+    }
+    if (channel.closeTimer) {
+        clearTimeout(channel.closeTimer);
+        channel.closeTimer = null;
+    }
+    channel.refCount += 1;
+    channel.subscribers.add(onState);
+    // Hand the newcomer whatever the channel already knows, so a component that
+    // mounts mid-stream renders the live value immediately instead of showing
+    // its SSR fallback until the next push (which may be a whole bid away).
+    onState({ data: channel.data, connected: channel.connected });
+    return () => {
+        const active = channels.get(url);
+        if (!active)
+            return;
+        active.subscribers.delete(onState);
+        active.refCount -= 1;
+        if (active.refCount > 0)
+            return;
+        active.closeTimer = setTimeout(() => {
+            // Re-read: a new subscriber may have arrived during the grace window,
+            // in which case the entry in the map is live again and must survive.
+            const current = channels.get(url);
+            if (!current || current.refCount > 0)
+                return;
+            current.es.close();
+            channels.delete(url);
+        }, CHANNEL_CLOSE_GRACE_MS);
+    };
+}
 /**
  * useRealtimeBids
  *
@@ -11,6 +131,9 @@ import { BID_ENDPOINTS } from "../../../constants/api-endpoints";
  * Uses a streaming route that keeps a server-side listener open and pushes
  * updates to the browser via text/event-stream. No Firebase client SDK required.
  *
+ * Multiple instances pointed at the same URL share ONE underlying connection —
+ * see the `channels` map above for why that matters.
+ *
  * @param productId - The auction product ID to subscribe to, or null to disable
  * @param getEndpoint - Optional: override the SSE endpoint URL builder.
  *   Defaults to `/api/realtime/bids/{productId}`.
@@ -19,50 +142,29 @@ import { BID_ENDPOINTS } from "../../../constants/api-endpoints";
  * const { currentBid, bidCount, connected } = useRealtimeBids(productId);
  */
 export function useRealtimeBids(productId, getEndpoint = BID_ENDPOINTS.REALTIME) {
-    const [data, setData] = useState(null);
-    const [connected, setConnected] = useState(false);
+    const [state, setState] = useState({
+        data: null,
+        connected: false,
+    });
     useEffect(() => {
         if (!productId || typeof EventSource === "undefined") {
-            setConnected(false);
+            setState({ data: null, connected: false });
             return;
         }
-        const url = getEndpoint(productId);
-        const es = new EventSource(url);
-        es.onmessage = (event) => {
-            try {
-                const msg = JSON.parse(event.data);
-                if (msg.type === "connected") {
-                    setConnected(true);
-                }
-                else if (msg.type === "update") {
-                    setData(msg.data ?? null);
-                    setConnected(true);
-                }
-                else if (msg.type === "error") {
-                    setConnected(false);
-                }
-            }
-            catch (_err) {
-                void normalizeError(_err);
-                logger.warn("[useRealtimeBids] Failed to parse SSE message");
-            }
-        };
-        es.onerror = () => {
-            // EventSource will attempt to reconnect automatically.
-            setConnected(false);
-            logger.warn("[useRealtimeBids] SSE connection error — will retry");
-        };
+        const unsubscribe = subscribe(getEndpoint(productId), setState);
         return () => {
-            es.close();
-            setConnected(false);
+            unsubscribe();
+            setState((prev) => ({ ...prev, connected: false }));
         };
+        // `getEndpoint` is deliberately excluded: callers pass an inline arrow in
+        // several places, so including it would resubscribe on every render.
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [productId]);
     return {
-        currentBid: data?.currentBid ?? null,
-        bidCount: data?.bidCount ?? null,
-        lastBid: data?.lastBid ?? null,
-        connected,
-        updatedAt: data?.updatedAt ?? null,
+        currentBid: state.data?.currentBid ?? null,
+        bidCount: state.data?.bidCount ?? null,
+        lastBid: state.data?.lastBid ?? null,
+        connected: state.connected,
+        updatedAt: state.data?.updatedAt ?? null,
     };
 }