@mohasinac/appkit 4.26.0 → 4.28.0

package/dist/features/admin/components/AdminBidsView.js

@@ -15,6 +15,8 @@ import { toRecordArray, toRelativeDate, toCurrency, toStringValue, } from "../ho
 import { DataListingView } from "./DataListingView";
 import { apiClient } from "../../../http";
 import { RecordStatusTimeline } from "../../status-history/components/RecordStatusTimeline";
+import { TextLink } from "../../../ui";
+import { ROUTES } from "../../../constants/index";
 export function AdminBidsView({ children, ...props }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
@@ -99,7 +101,10 @@ export function AdminBidsView({ children, ...props }) {
     const detailBadge = detail ? bidStatusBadge(detail.status) : null;
     return (_jsxs(_Fragment, { children: [_jsx(DataListingView, { config: config }), _jsx(RecordDetailModal, { isOpen: detail !== null, onClose: () => setDetail(null), title: toStringValue(detail?.detail?.productTitle, "Bid"), badges: detailBadge ? [{ label: detailBadge.label }] : undefined, fields: detail
                     ? buildBidDetailFields(detail.detail, "admin")
-                    : undefined, extra: 
+                    : undefined, footer: detail ? (
+                // The full page — a modal cannot be linked, bookmarked or reloaded
+                // into, which is the whole reason the page exists.
+                _jsx(TextLink, { href: String(ROUTES.ADMIN.BID_DETAIL(detail.id)), children: "Open full page \u2192" })) : undefined, extra: 
                 // A bid moves through more states than any record a buyer owns, and
                 // every one of them happened inside a settlement batch with nothing
                 // recording it until W18. Absent history renders the empty label,

package/dist/features/admin/components/AdminCarouselGroupEditorView.d.ts

@@ -2,5 +2,13 @@ import React from "react";
 import type { StackedViewShellProps } from "../../../ui";
 export interface AdminCarouselGroupEditorViewProps extends Omit<StackedViewShellProps, "sections"> {
     onCreated?: (id: string) => void;
+    /**
+     * Present → edit that carousel; absent → create a new one.
+     *
+     * This component was create-only, which is why `/admin/carousels/[id]/edit`
+     * did not exist. Same `featureId?`-style seam `AdminFeatureEditorView` uses.
+     */
+    carouselId?: string;
+    onSaved?: (id: string) => void;
 }
-export declare function AdminCarouselGroupEditorView({ onCreated, ...rest }: AdminCarouselGroupEditorViewProps): React.JSX.Element;
+export declare function AdminCarouselGroupEditorView({ onCreated, carouselId, onSaved, ...rest }: AdminCarouselGroupEditorViewProps): React.JSX.Element;

package/dist/features/admin/components/AdminCarouselGroupEditorView.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import React from "react";
 import { z } from "zod";
 import { useRouter } from "next/navigation";
+import { useQuery } from "@tanstack/react-query";
 import { Button, Form, Row, StackedViewShell, useToast } from "../../../ui";
 import { FieldInput, FieldSelect, FormErrorSummary } from "../../../ui/forms";
 import { useApiMutation } from "@mohasinac/appkit/client";
@@ -13,28 +14,59 @@ const carouselGroupFormSchema = z.object({
     name: z.string().min(1, "Name is required").max(200),
     status: z.enum(["active", "draft"]),
 });
-export function AdminCarouselGroupEditorView({ onCreated, ...rest }) {
+export function AdminCarouselGroupEditorView({ onCreated, carouselId, onSaved, ...rest }) {
     const { showToast } = useToast();
     const router = useRouter();
+    const isEdit = Boolean(carouselId);
     const [name, setName] = React.useState("");
     const [status, setStatus] = React.useState("draft");
+    // Seed from the single-item GET, never from a cached list row — a list
+    // projection is narrower than the document, and saving would write the
+    // missing fields back as their defaults (Root Cause #38).
+    const existing = useQuery({
+        queryKey: ["admin", "carousel", carouselId],
+        queryFn: () => apiClient.get(ADMIN_ENDPOINTS.CAROUSELS_BY_ID(carouselId)),
+        enabled: isEdit,
+    });
+    React.useEffect(() => {
+        const doc = existing.data?.data;
+        if (!doc)
+            return;
+        setName(doc.name ?? "");
+        setStatus(doc.status === "active" ? "active" : "draft");
+    }, [existing.data]);
     const createMutation = useApiMutation({
-        mutationFn: () => apiClient.post(ADMIN_ENDPOINTS.CAROUSELS, { name, status }),
+        /*
+         * PATCH on the edit path, not PUT. `/api/admin/carousels/[id]` exports
+         * GET/PATCH/DELETE — copying `AdminFeatureEditorView`'s `apiClient.put`
+         * here would have been a 405, which is exactly what
+         * `audit-client-verb-match` exists to catch.
+         */
+        mutationFn: () => isEdit
+            ? apiClient.patch(ADMIN_ENDPOINTS.CAROUSELS_BY_ID(carouselId), { name, status })
+            : apiClient.post(ADMIN_ENDPOINTS.CAROUSELS, { name, status }),
         onSuccess: (res) => {
-            const id = res?.data?.id;
-            showToast("Carousel created.", "success");
-            if (id) {
-                if (onCreated)
-                    onCreated(id);
+            const id = res?.data?.id ?? carouselId;
+            showToast(isEdit ? "Carousel updated." : "Carousel created.", "success");
+            if (!id)
+                return;
+            if (isEdit) {
+                if (onSaved)
+                    onSaved(id);
                 else
                     router.push(String(ROUTES.ADMIN.CAROUSEL_DETAIL(id)));
+                return;
             }
+            if (onCreated)
+                onCreated(id);
+            else
+                router.push(String(ROUTES.ADMIN.CAROUSEL_DETAIL(id)));
         },
         onError: (err) => {
-            showToast(err?.message ?? "Failed to create carousel.", "error");
+            showToast(err?.message ?? `Failed to ${isEdit ? "update" : "create"} carousel.`, "error");
         },
     });
-    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: "New Named Carousel", sections: [
+    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: isEdit ? "Edit Carousel" : "New Named Carousel", sections: [
             _jsx(Form, { schema: carouselGroupFormSchema, onSubmit: (e) => e.preventDefault(), spacing: "md", children: ({ setFieldError, clearErrors }) => (_jsxs(_Fragment, { children: [_jsx(FieldInput, { name: "name", label: "Carousel name", value: name, onChange: (v) => setName(v), required: true, placeholder: "e.g. Homepage Hero" }), _jsx(FieldSelect, { name: "status", label: "Status", value: status, onChange: (v) => setStatus(v), options: [
                                 { value: "draft", label: "Draft" },
                                 { value: "active", label: "Active" },
@@ -45,6 +77,6 @@ export function AdminCarouselGroupEditorView({ onCreated, ...rest }) {
                                         return;
                                     }
                                     createMutation.mutate();
-                                }, children: "Create carousel" }) })] })) }, "carousel-group-form"),
+                                }, children: isEdit ? "Save changes" : "Create carousel" }) })] })) }, "carousel-group-form"),
         ] }));
 }

package/dist/features/admin/components/AdminCarouselView.js

@@ -145,5 +145,5 @@ export function AdminCarouselView({ children, onBulkDelete, ...props }) {
                 ] })),
         },
     ];
-    return (_jsxs(Div, { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search slide titles", onSearchChange: setSearchInput, onSearchCommit: commitSearch, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx(StickyToolbar, { offset: "header+pagination", tone: "translucent", border: true, padding: "toolbar", children: _jsx(Row, { justify: "center", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) }) })), selection.selectedCount > 0 && bulkActions.length > 0 && (_jsx(BulkActionBar, { selectedCount: selection.selectedCount, actions: bulkActions, onClearSelection: selection.clearSelection })), _jsxs(Div, { paddingX: "x-sm-md", padding: "y-md", children: [errorMessage && (_jsx(Div, { textSize: "sm", className: "mb-4 border border-error/20", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: errorMessage })), _jsx(DataTable, { rows: displayRows, columns: columns, isLoading: isLoading, emptyLabel: "No carousel slides \u2014 use 'New slide' to add one", rowHrefTemplate: "/admin/carousel/{id}/edit" })] }), _jsx(ListingFilterDrawer, { open: filterOpen, onClose: () => setFilterOpen(false), onApply: applyFilters, onClear: clearFilters, activeCount: activeFilterCount, children: _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { className: "tracking-widest", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Status" }), _jsx(Row, { wrap: true, gap: "sm", children: [{ label: "All", value: "" }, { label: "Active", value: "true" }, { label: "Inactive", value: "false" }].map((opt) => (_jsx(Button, { variant: "ghost", type: "button", onClick: () => setPendingFilters((p) => ({ ...p, active: opt.value })), className: `rounded-full px-[var(--appkit-space-3)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium border transition-colors min-h-0 h-auto ${(pendingFilters.active || "") === opt.value ? "bg-primary text-white border-primary" : "border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:bg-zinc-50 hover:bg-[var(--appkit-color-surface-elevated)]"}`, children: opt.label }, opt.label))) })] }) }), deleteTargetId && (_jsx(ConfirmDeleteModal, { isOpen: true, title: "Delete Carousel Slide", message: "Delete this carousel slide? This cannot be undone.", onConfirm: () => { deleteMutation.mutate(deleteTargetId); setDeleteTargetId(null); }, onClose: () => setDeleteTargetId(null), isDeleting: deleteMutation.isPending }))] }));
+    return (_jsxs(Div, { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search slide titles", onSearchChange: setSearchInput, onSearchCommit: commitSearch, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx(StickyToolbar, { offset: "header+pagination", tone: "translucent", border: true, padding: "toolbar", children: _jsx(Row, { justify: "center", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) }) })), selection.selectedCount > 0 && bulkActions.length > 0 && (_jsx(BulkActionBar, { selectedCount: selection.selectedCount, actions: bulkActions, onClearSelection: selection.clearSelection })), _jsxs(Div, { paddingX: "x-sm-md", padding: "y-md", children: [errorMessage && (_jsx(Div, { textSize: "sm", className: "mb-4 border border-error/20", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: errorMessage })), _jsx(DataTable, { rows: displayRows, columns: columns, isLoading: isLoading, emptyLabel: "No carousel slides \u2014 use 'New slide' to add one", rowHrefTemplate: "/admin/carousel/{id}/edit" })] }), _jsx(ListingFilterDrawer, { open: filterOpen, onClose: () => setFilterOpen(false), onApply: applyFilters, onClear: clearFilters, activeCount: activeFilterCount, children: _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { className: "tracking-widest", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Status" }), _jsx(Row, { wrap: true, gap: "sm", children: [{ label: "All", value: "" }, { label: "Active", value: "true" }, { label: "Inactive", value: "false" }].map((opt) => (_jsx(Button, { variant: "ghost", type: "button", onClick: () => setPendingFilters((p) => ({ ...p, active: opt.value })), className: `rounded-full px-[var(--appkit-space-3)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium border transition-colors min-h-0 h-auto ${(pendingFilters.active || "") === opt.value ? "bg-primary text-white border-primary" : "border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:bg-surface-hover"}`, children: opt.label }, opt.label))) })] }) }), deleteTargetId && (_jsx(ConfirmDeleteModal, { isOpen: true, title: "Delete Carousel Slide", message: "Delete this carousel slide? This cannot be undone.", onConfirm: () => { deleteMutation.mutate(deleteTargetId); setDeleteTargetId(null); }, onClose: () => setDeleteTargetId(null), isDeleting: deleteMutation.isPending }))] }));
 }

package/dist/features/admin/components/AdminFeatureEditorView.js

@@ -19,7 +19,7 @@ const __O = {
 };
 const PILL_BASE_CLASS = "inline-flex items-center gap-[var(--appkit-space-1-5)] rounded-full border px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-xs)] font-medium cursor-pointer transition-colors";
 const PILL_CHECKED_CLASS = "bg-primary text-white border-primary";
-const PILL_UNCHECKED_CLASS = "border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:bg-zinc-50 hover:bg-[var(--appkit-color-surface-elevated)]";
+const PILL_UNCHECKED_CLASS = "border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:bg-surface-hover";
 const FIELD_LABEL_CLASS = "text-[length:var(--appkit-text-sm)] font-medium text-[var(--appkit-color-text-muted)]";
 const DELETE_CONFIRM_TEXT = "Delete this feature? It will fail if any product still references it.";
 const TOAST = {

package/dist/features/admin/components/AdminGroupedListingsView.js

@@ -8,12 +8,13 @@ import { normalizeError } from "../../../errors/normalize";
 import { sortBy } from "@mohasinac/appkit/client";
 import React, { useState } from "react";
 import { ListingLayout } from "../../../ui";
-import { Button, Row, SideDrawer, Stack, Text, useToast, } from "../../../ui";
+import { Button, Row, SideDrawer, Stack, Text, TextLink, useToast, } from "../../../ui";
 import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdminListingData";
 import { DataListingView } from "./DataListingView";
 import { ProductInlineSelect } from "../../seller/components/ProductInlineSelect";
 import { apiClient } from "../../../http";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+import { ROUTES } from "../../../next/routing/route-map";
 function ReassignProductsDrawer({ state, onClose, onSaved, }) {
     const [productIds, setProductIds] = useState(state.currentProductIds);
     const [saving, setSaving] = useState(false);
@@ -75,10 +76,21 @@ export function AdminGroupedListingsView({ children, ...props }) {
         })),
         getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
         buildFilters: () => "",
+        /*
+         * Admin had NO create path at all — there was no POST route either,
+         * so this could not have been wired before now.
+         *
+         * `toolbarExtra` rather than `primaryAction`: the latter takes an
+         * `onClick(panel)` for opening a create DRAWER, and this create is a
+         * page. Same shape `AdminAdsView` uses, and `audit-create-affordance`
+         * counts both — which is exactly why it has to, or four views with a
+         * perfectly good create link would read as having none.
+         */
+        toolbarExtra: (_jsx(TextLink, { variant: "bare", href: String(ROUTES.ADMIN.GROUPED_LISTINGS_NEW), rounded: "md", paddingX: "sm", size: "sm", weight: "medium", layout: "inline-flex", align: "center", className: "h-9 bg-[var(--appkit-color-surface)] text-[var(--appkit-color-text)]", children: "New group" })),
         // Mirrors the row action button's "Reassign products" drawer so the
         // row itself is clickable, not just the button.
         onRowClick: (row) => openReassign(row),
-        renderRowActions: (row) => (_jsx(Button, { size: "sm", variant: "outline", onClick: () => openReassign(row), children: "Reassign products" })),
+        renderRowActions: (row) => (_jsxs(Row, { gap: "xs", children: [_jsx(TextLink, { href: String(ROUTES.ADMIN.GROUPED_LISTINGS_EDIT(row.id)), children: "Edit" }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => openReassign(row), children: "Reassign products" })] })),
     }), [refreshKey, openReassign]);
     if (React.Children.count(children) > 0) {
         return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));

package/dist/features/admin/components/AdminSidebar.js

@@ -17,7 +17,7 @@ const __O = {
 function NavLink({ item, isActive, onClick }) {
     return (_jsxs(Link, { href: item.href, onClick: onClick, className: `flex items-center justify-end gap-[var(--appkit-space-2-5)] rounded-lg px-[var(--appkit-space-3)] py-[var(--appkit-space-2)] text-[0.8125rem] font-medium leading-tight transition-colors ${isActive
             ? "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text)]"
-            : "text-[var(--appkit-color-text-muted)] hover:bg-zinc-50 hover:bg-[var(--appkit-color-surface-elevated)]/60 hover:text-zinc-800 hover:text-[var(--appkit-color-text-muted)]"}`, children: [item.icon && _jsx(Span, { size: "base", className: "shrink-0 opacity-60", children: item.icon }), _jsx(Span, { className: "truncate", children: item.label })] }));
+            : "text-[var(--appkit-color-text-muted)] hover:bg-surface-hover hover:text-zinc-800 hover:text-[var(--appkit-color-text-muted)]"}`, children: [item.icon && _jsx(Span, { size: "base", className: "shrink-0 opacity-60", children: item.icon }), _jsx(Span, { className: "truncate", children: item.label })] }));
 }
 function GroupsContent({ groups, activePath, onItemClick, }) {
     // Accordion — only one group open at a time. Initial pick: the group

package/dist/features/admin/components/AdminViewCards.js

@@ -52,7 +52,7 @@ function AdminCardItem({ row, view, selected, onToggleSelect, onRowClick, render
     };
     if (view === "list") {
         return (_jsxs(Row, { gap: "sm", className: [
-                "px-[var(--appkit-space-4)] py-[var(--appkit-space-3)] cursor-pointer transition-colors hover:bg-zinc-50 hover:bg-[var(--appkit-color-surface-elevated)]/50",
+                "px-[var(--appkit-space-4)] py-[var(--appkit-space-3)] cursor-pointer transition-colors hover:bg-surface-hover",
                 selected ? "bg-primary-50/40 dark:bg-primary-900/10" : "",
             ].filter(Boolean).join(" "), onClick: handleClick, role: onRowClick ? "button" : undefined, children: [onToggleSelect && (_jsx(Div, { "data-no-row-click": true, className: "shrink-0", onClick: (e) => { e.stopPropagation(); onToggleSelect(row.id); }, children: _jsx(Checkbox, { bare: true, checked: selected, onChange: () => onToggleSelect(row.id), className: "h-4 w-4 rounded border-zinc-300 text-primary accent-primary cursor-pointer", "aria-label": `Select ${row.primary}` }) })), _jsx(RowAvatar, { image: row.image, alt: row.primary, icon: resourceIcon }), _jsxs(Stack, { gap: "none", className: "flex-1 min-w-0", children: [_jsx(Text, { size: "sm", weight: "semibold", className: "truncate", color: "primary", children: row.primary }), _jsx(Text, { size: "xs", color: "muted", className: "truncate", children: row.secondary }), row.barcodeId && (_jsx(Text, { size: "xs", color: "faint", className: "truncate font-mono", children: row.barcodeId }))] }), flags.length > 0 && (_jsx(Row, { gap: "xs", className: "hidden sm:flex shrink-0", children: flags.map(({ key, label, tone }) => (_jsx(Span, { padding: "pill-2xs", weight: "medium", className: `inline-flex text-[10px] ${STATUS_TONE_CLASSES[tone]}`, rounded: "full", children: label }, key))) })), _jsx(StatusBadge, { status: row.status }), _jsx(Span, { size: "xs", color: "muted", className: "hidden sm:block shrink-0 w-24", align: "end", children: row.updatedAt }), renderRowActions && (_jsx(Div, { "data-no-row-click": true, className: "shrink-0", onClick: (e) => e.stopPropagation(), children: renderRowActions(row) }))] }));
     }
@@ -60,7 +60,7 @@ function AdminCardItem({ row, view, selected, onToggleSelect, onRowClick, render
             "border overflow-hidden cursor-pointer transition-all hover:shadow-md hover:-translate-y-0.5",
             selected
                 ? "border-primary ring-1 ring-primary/20 bg-primary-50/30 dark:bg-primary-900/10"
-                : "border-zinc-100 border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]",
+                : " border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]",
         ].filter(Boolean).join(" "), onClick: handleClick, role: onRowClick ? "button" : undefined, children: [onToggleSelect && (_jsxs(Row, { gap: "xs", "data-no-row-click": true, paddingY: "t-sm", padding: "x-sm", onClick: (e) => { e.stopPropagation(); onToggleSelect(row.id); }, children: [_jsx(Checkbox, { bare: true, checked: selected, onChange: () => onToggleSelect(row.id), className: "h-4 w-4 rounded border-zinc-300 text-primary accent-primary cursor-pointer", "aria-label": `Select ${row.primary}` }), flags.length > 0 && (_jsx(Row, { gap: "xs", wrap: true, children: flags.map(({ key, label, tone }) => (_jsx(Span, { padding: "pill-2xs", weight: "medium", className: `inline-flex text-[10px] ${STATUS_TONE_CLASSES[tone]}`, rounded: "full", children: label }, key))) }))] })), _jsxs(Stack, { gap: "xs", className: `${__P.p3}.5`, children: [_jsxs(Row, { gap: "sm", align: "center", children: [_jsx(RowAvatar, { image: row.image, alt: row.primary, icon: resourceIcon, size: "12" }), _jsxs(Stack, { gap: "none", className: "min-w-0 flex-1", children: [_jsx(Text, { size: "sm", weight: "semibold", className: "line-clamp-2 leading-snug", color: "primary", children: row.primary }), _jsx(Text, { size: "xs", color: "muted", className: "truncate", children: row.secondary })] })] }), row.barcodeId && (_jsx(Text, { size: "xs", color: "faint", className: "truncate font-mono", children: row.barcodeId })), _jsxs(Row, { justify: "between", gap: "xs", children: [_jsx(StatusBadge, { status: row.status }), _jsx(Span, { color: "muted", className: "text-[11px] shrink-0", children: row.updatedAt })] }), renderRowActions && (_jsx(Row, { "data-no-row-click": true, justify: "end", gap: "xs", className: "border-t border-[var(--appkit-color-border)] -mx-[var(--appkit-space-3)] -mb-[var(--appkit-space-3)] mt-[var(--appkit-space-1)] px-[var(--appkit-space-3)] py-[var(--appkit-space-2)]", onClick: (e) => e.stopPropagation(), children: renderRowActions(row) }))] })] }));
 }
 export function AdminViewCards({ rows, view, isLoading, emptyLabel = "No items found", onRowClick, selectedIdSet, onToggleSelect, renderRowActions, resourceIcon, }) {

package/dist/features/admin/components/DataTable.js

@@ -39,7 +39,7 @@ function SelectableRow({ row, columns, isSelected, onToggle, renderRowActions, o
             : undefined;
     const handleKeyDown = handleClick
         ? (event) => {
-            if (event.key === "Enter" || event.key === " ")
+            if (event.key === "Enter" || event.key === "")
                 handleClick();
         }
         : undefined;
@@ -54,5 +54,5 @@ export function DataTable({ columns: columnsProp, rows, isLoading, sortKey, sort
     const allRowsSelected = selectionEnabled && rows.length > 0 && rows.every((r) => selectedIds?.has(r.id));
     return (_jsxs(Div, { surface: "card", className: `${__O.hidden}`, children: [_jsx(Div, { className: `${__O.xAuto}`, children: _jsxs(Table, { "data-testid": "data-table", size: "sm", children: [_jsx(Thead, { children: _jsxs(Tr, { className: "bg-[var(--appkit-color-bg)] dark:bg-[var(--appkit-color-surface-elevated)]", border: "default", children: [selectionEnabled && (_jsx(Th, { padding: "xs-3", scope: "col", className: "w-10", children: onToggleSelectAll && (_jsx(Checkbox, { bare: true, "data-testid": "select-all-checkbox", "aria-label": allRowsSelected ? "Deselect all" : "Select all", checked: allRowsSelected, onChange: () => onToggleSelectAll(!allRowsSelected), className: "h-4 w-4 rounded border-[var(--appkit-color-border)] accent-zinc-900 dark:accent-zinc-100" })) })), columns.map((col) => (_jsxs(Th, { scope: "col", onClick: col.sortable && onSort ? () => onSort(col.key) : undefined, className: `text-left text-[var(--appkit-color-text)] ${col.sortable && onSort ? "cursor-pointer select-none hover:text-primary" : ""} ${COLUMN_PRIORITY_CLASS[resolveColumnPriority(col)]} ${col.className ?? ""}`, padding: "md", weight: "semibold", children: [col.header, col.sortable && sortKey === col.key && (_jsx(Span, { className: "ml-1", children: sortDir === "asc" ? "↑" : "↓" }))] }, col.key))), renderRowActions && _jsx(Th, { padding: "xs-3", scope: "col", className: "w-12" })] }) }), _jsx(Tbody, { children: isLoading ? (Array.from({ length: 5 }).map((_, i) => (_jsxs(Tr, { border: "default", children: [selectionEnabled && _jsx(Td, { padding: "xs-3", className: "w-10" }), columns.map((col) => (_jsx(Td, { padding: "md", className: COLUMN_PRIORITY_CLASS[resolveColumnPriority(col)], children: _jsx(Div, { className: "h-4 w-full animate-pulse bg-neutral-200", rounded: "default" }) }, col.key)))] }, i)))) : rows.length === 0 ? (_jsx(Tr, { children: _jsx(Td, { colSpan: columns.length + (selectionEnabled ? 1 : 0) + (renderRowActions ? 1 : 0), align: "center", color: "faint", paddingX: "md", paddingY: "md", children: emptyLabel }) })) : (rows.map((row) => (_jsx(SelectableRow, { row: row, columns: columns, isSelected: selectedIds?.has(row.id) ?? false, onToggle: onToggleSelect, renderRowActions: renderRowActions, onRowClick: onRowClick, rowHref: typeof rowHrefTemplate === "function"
                                     ? rowHrefTemplate(row)
-                                    : rowHrefTemplate?.replace("{id}", encodeURIComponent(row.id)), selectionEnabled: selectionEnabled }, row.id)))) })] }) }), totalPages > 1 && onPageChange && (_jsx(Row, { className: "border-t border-neutral-200", padding: "inline", align: "center", justify: "end", gap: "sm", children: Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (_jsx(Button, { onClick: () => onPageChange(p), variant: p === currentPage ? "primary" : "ghost", size: "sm", className: `h-8 w-8 rounded text-[length:var(--appkit-text-xs)] font-medium transition ${p === currentPage ? "bg-neutral-900 text-white" : "text-[var(--appkit-color-text-muted)] text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-surface)] hover:bg-[var(--appkit-color-surface-elevated)]"}`, children: p }, p))) }))] }));
+                                    : rowHrefTemplate?.replace("{id}", encodeURIComponent(row.id)), selectionEnabled: selectionEnabled }, row.id)))) })] }) }), totalPages > 1 && onPageChange && (_jsx(Row, { className: "border-t border-neutral-200", padding: "inline", align: "center", justify: "end", gap: "sm", children: Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (_jsx(Button, { onClick: () => onPageChange(p), variant: p === currentPage ? "primary" : "ghost", size: "sm", className: `h-8 w-8 rounded text-[length:var(--appkit-text-xs)] font-medium transition ${p === currentPage ? "bg-neutral-900 text-white" : "text-[var(--appkit-color-text-muted)] text-[var(--appkit-color-text-muted)] hover:bg-surface-hover"}`, children: p }, p))) }))] }));
 }

package/dist/features/admin/schemas/firestore.js

@@ -254,11 +254,17 @@ export const DEFAULT_SITE_SETTINGS_DATA = {
         codDepositPercent: 10,
         codHandlingFeeMin: 200,
         codHandlingFeePercent: 10,
-        whatsappNotifyFeeEnabled: false,
+        // The three buyer add-ons ship ENABLED. They were `false`, which made
+        // StoreAddonsPicker return null on both the cart and checkout, so a fresh
+        // install had no add-ons at all and no indication why. `undefined` still
+        // means disabled everywhere (computeWhatsAppNotifyFee et al. read
+        // `if (!rates.XEnabled) return 0`) — only the DEFAULT changed, so an
+        // existing siteSettings document keeps whatever it already stored.
+        whatsappNotifyFeeEnabled: true,
         whatsappNotifyFee: 10,
-        giftWrapFeeEnabled: false,
+        giftWrapFeeEnabled: true,
         giftWrapFee: 49,
-        shipmentProtectionFeeEnabled: false,
+        shipmentProtectionFeeEnabled: true,
         shipmentProtectionFeePercent: 2,
         shipmentProtectionFeeMin: 30,
         sellerShippingFixed: 0,

package/dist/features/auctions/actions/bid-actions.js

@@ -12,6 +12,7 @@ import { bidRepository } from "../repository/bid.repository";
 import { productRepository } from "../../products/repository/products.repository";
 import { isAuctionListing } from "../../products/utils/listing-type";
 import { userRepository } from "../../auth/repository/user.repository";
+import { isSoftBanned } from "../../auth/server/checkSoftBan";
 import { unitOfWork } from "../../../core/unit-of-work";
 import { storeRepository } from "../../stores/repository/store.repository";
 import { siteSettingsRepository } from "../../../repositories";
@@ -28,6 +29,29 @@ import { cartRepository } from "../../cart/repository/cart.repository";
 import { AUCTION_BUYOUT_WINDOW_MINUTES, AUCTION_BUYOUT_WINDOW_MS, AUCTION_CHECKOUT_URL, } from "../../../_internal/shared/checkout/lanes";
 import { resolveDate } from "../../../utils";
 // --- Domain Functions ----------------------------------------------------------
+/**
+ * Load the bidder's profile and refuse if they carry an active `place_bids`
+ * soft ban. Returns the profile so the caller pays for exactly one read.
+ *
+ * 🛑 This belongs in the DOMAIN function, not in a route.
+ *
+ * Admins can issue a `place_bids` soft ban and `BID_ERROR_CODES.USER_BANNED`
+ * has always existed with a display-map entry and client copy — but nothing
+ * ever threw it. The only `isSoftBanned(user, "place_bids")` call in the
+ * codebase sat in `POST /api/auctions/[id]/buy-now`, a route with zero callers,
+ * while the live path (the `placeBidAction` / `buyNowAction` server actions)
+ * checked nothing. A banned user could bid and buy out freely. Enforcing it
+ * here means every caller — action, route, or job — is covered by
+ * construction.
+ */
+async function assertCanBid(userId) {
+    const profile = await userRepository.findById(userId);
+    if (profile && isSoftBanned(profile, "place_bids")) {
+        const ban = profile.softBans?.find((b) => b.action === "place_bids");
+        throw new AuthorizationError(`Your account is restricted from bidding. Reason: ${ban?.reason ?? "Policy violation"}.`, { code: BID_ERROR_CODES.USER_BANNED });
+    }
+    return profile ?? null;
+}
 export async function placeBid(userId, userEmail, input) {
     const { productId, bidAmount, autoMaxBid } = input;
     const product = await productRepository.findById(productId);
@@ -50,6 +74,9 @@ export async function placeBid(userId, userEmail, input) {
             throw new AuthorizationError(ERROR_MESSAGES.BID.OWN_AUCTION);
         }
     }
+    // Before any write. The profile is reused below for the bid's denormalised
+    // userName/userEmail, so the ban check costs no extra read.
+    const profile = await assertCanBid(userId);
     // An auction with no bids yet prices off its starting bid, and that starting
     // bid is itself acceptable — see ResolveMinBidOptions.hasBids.
     const hasBids = (product.currentBid ?? 0) > 0 || (product.bidCount ?? 0) > 0;
@@ -122,7 +149,6 @@ export async function placeBid(userId, userEmail, input) {
         visibleBid = newCap;
         bumpedPreviousVisible = Math.min(prevCap, target);
     }
-    const profile = await userRepository.findById(userId);
     const bid = await bidRepository.create({
         productId,
         productTitle: product.title,
@@ -229,12 +255,24 @@ export async function placeBid(userId, userEmail, input) {
     return { bid };
 }
 export async function buyNowAuction(userId, userName, userEmail, input) {
-    const { productId } = input;
-    const product = await productRepository.findById(productId);
+    const { productId: productRef } = input;
+    // Auction URLs are slug-based, and this action is reachable from a route
+    // param, so accept either. Deliberately id-FIRST rather than
+    // `findByIdOrSlug`, which queries by slug first and would therefore cost two
+    // reads on the common id path (Rule #6) — here the fallback query only runs
+    // when the id lookup actually misses.
+    //
+    // This was masked because every seeded auction has `slug === id`. Any auction
+    // whose slug differs threw NotFoundError, which the caller then swallowed.
+    const product = (await productRepository.findById(productRef)) ??
+        (await productRepository.findBySlug(productRef));
     if (!product)
         throw new NotFoundError(ERROR_MESSAGES.BID.AUCTION_NOT_FOUND);
     if (!isAuctionListing(product))
         throw new ValidationError(ERROR_MESSAGES.BID.NOT_AN_AUCTION);
+    // 🛑 Every downstream write (the bid, the locked cart line, the notification)
+    // must key on the canonical document id, never on the ref the caller passed.
+    const productId = String(product.id);
     if (product.isSold) {
         throw new ValidationError(ERROR_MESSAGES.BID.AUCTION_ENDED, { code: BID_ERROR_CODES.AUCTION_ENDED });
     }
@@ -250,6 +288,10 @@ export async function buyNowAuction(userId, userName, userEmail, input) {
             throw new AuthorizationError(ERROR_MESSAGES.BID.OWN_AUCTION);
         }
     }
+    // Same guard as `placeBid` — a buyout IS a bid (it writes a real
+    // `BidDocument` with `isBuyout: true`), so a `place_bids` ban must block it.
+    // The profile is reused for the bid's denormalised name/email below.
+    const profile = await assertCanBid(userId);
     const buyNowPrice = typeof product.buyNowPrice === "number" ? product.buyNowPrice : null;
     if (buyNowPrice === null || buyNowPrice <= 0) {
         throw new ValidationError(ERROR_MESSAGES.BID.BUY_NOW_NO_PRICE, { code: BID_ERROR_CODES.BUY_NOW_NO_PRICE });
@@ -286,7 +328,6 @@ export async function buyNowAuction(userId, userName, userEmail, input) {
     // The product's own currency, not the site default — the cart line, the bid
     // and the listing all have to agree, and settlement uses the bid's currency.
     const currency = product.currency || getDefaultCurrency();
-    const profile = await userRepository.findById(userId);
     // A real bid at the buy-now price — this is what "the bid placed is the
     // buyout price by the buyer" means. It starts `active`/`isWinning: false`
     // like any other bid (bidRepository.create forces both) and is promoted to

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

@@ -1,8 +1,23 @@
-export interface AuctionBottomActionsProps {
-    currentBid: number;
-    currency: string;
+import { type PlaceBidFormClientProps } from "./PlaceBidFormClient";
+export interface AuctionBottomActionsProps extends PlaceBidFormClientProps {
     bidCount: number;
-    isEnded: boolean;
-    auctionEndDate: Date | null;
 }
-export declare function AuctionBottomActions({ currentBid, currency, bidCount, isEnded, auctionEndDate, }: AuctionBottomActionsProps): null;
+/**
+ * Mobile/after-scroll CTA bar for an auction.
+ *
+ * 🛑 It owns its own modal rather than pointing at one.
+ *
+ * Two defects lived here. (a) The single Place Bid action ran
+ * `getElementById("auction-bid-form")?.scrollIntoView(...)` — but that id is
+ * set inside `renderBidForm`, which `AuctionDetailView` wraps in
+ * `hidden lg:block`. On mobile the target is `display:none`, so the bar's only
+ * action did nothing on the only viewport the bar exists for. A DOM id is not
+ * a contract; the element it names can be hidden, moved or removed without any
+ * signal here. (b) There was no Buy Now action at all, even though
+ * `MOBILE_PRIMARY_ACTIONS.auction` has declared `[PLACE_BID, BUY_NOW_AUCTION]`
+ * for a long time — a declared CTA nothing rendered (Root Cause #8's shape).
+ *
+ * Both actions now open the real form, which is the only place the Buy Now
+ * button can report an error or route to `/checkout?lane=auction`.
+ */
+export declare function AuctionBottomActions(props: AuctionBottomActionsProps): import("react").JSX.Element;

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

@@ -1,8 +1,13 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from "react";
 import { useBottomActions } from "../../layout/hooks/useBottomActions";
 import { formatCurrency } from "../../../utils/number.formatter";
 import { ACTION_ID, ACTION_META } from "../../products/constants/action-defs";
 import { useCountdown } from "../../../react";
+import { Modal } from "../../../ui";
+import { isBuyNowAvailable } from "../../../_internal/shared/features/auctions/config";
+import { PlaceBidFormClient, } from "./PlaceBidFormClient";
 function formatCountdownLabel(remaining) {
     if (!remaining)
         return undefined;
@@ -13,25 +18,51 @@ function formatCountdownLabel(remaining) {
         return `Ends in ${hours}h ${minutes}m ${seconds}s`;
     return `Ends in ${minutes}m ${seconds}s`;
 }
-export function AuctionBottomActions({ currentBid, currency, bidCount, isEnded, auctionEndDate, }) {
-    const placeBidMeta = ACTION_META[ACTION_ID.PLACE_BID];
+/**
+ * Mobile/after-scroll CTA bar for an auction.
+ *
+ * 🛑 It owns its own modal rather than pointing at one.
+ *
+ * Two defects lived here. (a) The single Place Bid action ran
+ * `getElementById("auction-bid-form")?.scrollIntoView(...)` — but that id is
+ * set inside `renderBidForm`, which `AuctionDetailView` wraps in
+ * `hidden lg:block`. On mobile the target is `display:none`, so the bar's only
+ * action did nothing on the only viewport the bar exists for. A DOM id is not
+ * a contract; the element it names can be hidden, moved or removed without any
+ * signal here. (b) There was no Buy Now action at all, even though
+ * `MOBILE_PRIMARY_ACTIONS.auction` has declared `[PLACE_BID, BUY_NOW_AUCTION]`
+ * for a long time — a declared CTA nothing rendered (Root Cause #8's shape).
+ *
+ * Both actions now open the real form, which is the only place the Buy Now
+ * button can report an error or route to `/checkout?lane=auction`.
+ */
+export function AuctionBottomActions(props) {
+    const { currentBid, currency, bidCount, isEnded, auctionEndDate, buyNowPrice } = props;
+    const [open, setOpen] = useState(false);
     const remaining = useCountdown(auctionEndDate ?? undefined);
+    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
+    // because the preview/demo mount passes no action.
+    const buyNowAvailable = isBuyNowAvailable({ buyNowPrice, currentBid, isEnded }) && !!props.onBuyNow;
     useBottomActions(isEnded
         ? {}
         : {
             actions: [
-                {
-                    ...placeBidMeta,
-                    onClick: () => {
-                        document
-                            .getElementById("auction-bid-form")
-                            ?.scrollIntoView({ behavior: "smooth" });
-                    },
-                },
+                { ...placeBidMeta, onClick: () => setOpen(true) },
+                ...(buyNowAvailable && buyNowPrice !== null
+                    ? [
+                        {
+                            ...buyNowMeta,
+                            label: `Buy Now — ${formatCurrency(buyNowPrice, currency)}`,
+                            onClick: () => setOpen(true),
+                        },
+                    ]
+                    : []),
             ],
             secondaryLabel: formatCountdownLabel(remaining),
             infoLabel: `${formatCurrency(currentBid, currency)} · ${bidCount} bid${bidCount !== 1 ? "s" : ""}`,
             desktop: "after-scroll",
         });
-    return null;
+    return (_jsx(Modal, { isOpen: open, onClose: () => setOpen(false), size: "md", title: "Place your bid", children: _jsx(PlaceBidFormClient, { ...props }) }));
 }

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

@@ -1,5 +1,5 @@
 import type { ProductFeatureDocument } from "../../products/schemas/product-features";
-import type { PlaceBidInput } from "./PlaceBidFormClient";
+import type { PlaceBidInput, BidActionEnvelope, BuyNowSuccess } from "./PlaceBidFormClient";
 export interface AuctionDetailPageViewProps {
     id: string;
     /**
@@ -9,8 +9,13 @@ export interface AuctionDetailPageViewProps {
      * When absent, falls back to fetching by slug/id (backward compat).
      */
     initialAuction?: import("../../products/schemas/firestore").ProductDocument | null;
-    onPlaceBid?: (input: PlaceBidInput) => Promise<unknown>;
-    onBuyNow?: () => Promise<unknown>;
+    /**
+     * Typed against the single `ActionResult` envelope — see the note on
+     * `BidActionEnvelope`. `Promise<unknown>` here is what let a doubly-wrapped
+     * result flow through to a client that read the wrong `ok`.
+     */
+    onPlaceBid?: (input: PlaceBidInput) => Promise<BidActionEnvelope<unknown>>;
+    onBuyNow?: () => Promise<BidActionEnvelope<BuyNowSuccess>>;
     /** SSR-loaded productFeatures (platform + store-scope). See ProductDetailPageView for semantics. */
     productFeatures?: ProductFeatureDocument[];
 }

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

@@ -46,7 +46,7 @@ function toDescriptionHtml(raw) {
 }
 function renderAuctionInfoPanel(props) {
     const { productId, title, currentBid, currency, bidCount, isEnded, endDate, buyNowPrice, buyNowAvailable, featured, freeShipping, condition, 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(ProductFeatureBadges, { featured: featured, freeShipping: freeShipping, condition: condition ?? undefined, labels: { featured: "Featured", fasterDelivery: "Faster Delivery", ratedSeller: "Rated Seller", condition: "Condition", conditionNew: "New", conditionUsed: "Used", conditionBroken: "For Parts", conditionRefurbished: "Refurbished", returnable: "Returnable", 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-50 hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:bg-primary-900/20 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-50 hover:text-primary-700 dark:hover:border-primary-700/60 dark:hover:bg-primary-900/20 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: 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, labels: { featured: "Featured", fasterDelivery: "Faster Delivery", ratedSeller: "Rated Seller", condition: "Condition", conditionNew: "New", conditionUsed: "Used", conditionBroken: "For Parts", conditionRefurbished: "Refurbished", returnable: "Returnable", 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.
@@ -204,5 +204,5 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, on
                                 slug: typeof r.slug === "string" ? r.slug : undefined,
                             }));
                             return (_jsxs(Stack, { gap: "xl", children: [related.length > 0 && (_jsx(RelatedProducts, { labels: { title: "Similar Auctions" }, renderGrid: () => (_jsx(MarketplaceAuctionGrid, { auctions: related, gridClassName: "grid grid-cols-2 gap-[var(--appkit-space-4)] sm:grid-cols-3 lg:grid-cols-4" })) })), _jsx(GroupedListingsCarousel, { groups: groups }), _jsx(RelatedItemsSection, { relatedItems: relatedItems, relatedByBrand: relatedByBrand, relatedByTags: relatedByTags, relatedByStore: relatedByStore, categoryLabel: categoryName || category || undefined, brandLabel: brand || undefined, storeLabel: storeName || undefined })] }));
-                        } }), renderAuctionStoreReviews(storeId), _jsx(AuctionBottomActions, { currentBid: currentBid, currency: currency, bidCount: bidCount, isEnded: isEnded, auctionEndDate: endDate })] })] }));
+                        } }), renderAuctionStoreReviews(storeId), onPlaceBid && (_jsx(AuctionBottomActions, { 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 }))] })] }));
 }