@mohasinac/appkit 4.26.0 → 4.28.0

package/dist/features/layout/MainNavbar.js

@@ -12,6 +12,6 @@ export function MainNavbar({ navItems, hiddenNavItems = [], inline = false, hasD
         icon: item.icon,
         highlighted: item.highlighted,
     }));
-    const dashboardToggle = hasDashboardNav && onToggleDashboardNav ? (_jsx("button", { type: "button", onClick: onToggleDashboardNav, "aria-label": "Toggle dashboard navigation", className: "flex items-center justify-center w-8 h-8 rounded-lg text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-surface)] hover:bg-[var(--appkit-color-surface-elevated)] hover:text-zinc-800 dark:hover:text-zinc-100 transition-colors", children: _jsxs("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 5a2 2 0 012-2h14a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 3v18" })] }) })) : undefined;
+    const dashboardToggle = hasDashboardNav && onToggleDashboardNav ? (_jsx("button", { type: "button", onClick: onToggleDashboardNav, "aria-label": "Toggle dashboard navigation", className: "flex items-center justify-center w-8 h-8 rounded-lg text-[var(--appkit-color-text-muted)] hover:bg-surface-hover hover:text-zinc-800 dark:hover:text-zinc-100 transition-colors", children: _jsxs("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 5a2 2 0 012-2h14a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 3v18" })] }) })) : undefined;
     return (_jsx(NavbarLayout, { items: items, activeHref: pathname, inline: inline, rightSlot: dashboardToggle }));
 }

package/dist/features/layout/NavbarLayout.js

@@ -12,7 +12,7 @@ function DefaultNavItem({ item, isActive, }) {
         ? "border border-primary-400/40 dark:border-secondary-400/30 text-primary-700 dark:text-secondary-400 bg-primary-50/80 dark:bg-secondary-900/30 px-[var(--appkit-space-3)] transition-colors duration-150"
         : isActive
             ? "bg-primary-50 dark:bg-[var(--appkit-color-surface-elevated)] text-primary-800 dark:text-white font-semibold px-[var(--appkit-space-3)] border-b-2 border-primary-500 dark:border-secondary-400 rounded-none pb-[6px] transition-colors duration-150"
-            : "text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-surface)] hover:bg-[var(--appkit-color-surface-elevated)] hover:text-zinc-950 dark:hover:text-white transition-colors duration-150 px-[var(--appkit-space-3)]";
+            : "text-[var(--appkit-color-text-muted)] hover:bg-surface-hover hover:text-zinc-950 dark:hover:text-white transition-colors duration-150 px-[var(--appkit-space-3)]";
     return (_jsxs(Link, { href: item.href, "aria-current": isActive ? "page" : undefined, className: `flex items-center gap-[var(--appkit-space-1-5)] py-[var(--appkit-space-2)] text-[length:var(--appkit-text-sm)] rounded-lg font-medium transition-colors duration-150 whitespace-nowrap ${activeClasses}`, children: [item.icon, _jsx(Span, { children: item.label })] }));
 }
 /**

package/dist/features/layout/TitleBarLayout.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Link from "next/link";
 import { Avatar, BlockHeader, Button, Div, Row, Section, SiteLogo, SiteMark, Span } from "../../ui";
 /** Shared icon-button class for all action buttons in the title bar. */
-const iconBtn = "flex items-center justify-center w-9 h-9 rounded-lg text-[var(--appkit-color-text-muted)] hover:bg-primary-50 hover:text-primary-700 dark:hover:bg-[var(--appkit-color-surface-elevated)] dark:hover:text-secondary-400 transition-colors";
+const iconBtn = "flex items-center justify-center w-9 h-9 rounded-lg text-[var(--appkit-color-text-muted)] hover:bg-primary-surface hover:text-primary-700 dark:hover:text-secondary-400 transition-colors";
 /** Badge counter class for wishlist/cart counts.
  *
  * The horizontal offset lives in `.appkit-hand-badge` (HandMode.style.css), NOT
@@ -29,7 +29,7 @@ const countBadge = "appkit-hand-badge absolute -top-0.5 flex items-center justif
  */
 export function TitleBarLayout({ onToggleSidebar, sidebarOpen, onSearchToggle, searchOpen, brandName, brandShortName, siteLogoUrl, logoHref, promotionsHref, compareHref, wishlistHref, wishlistCount = 0, cartHref, cartCount = 0, profileHref, unreadNotificationCount = 0, notificationsHref, loginHref, registerHref, user, notificationSlot, devSlot, navSlot, promoStripText, isDark = false, onToggleTheme, onTourStart, hasDashboardNav, onToggleDashboardNav, hideSidebarToggle = false, id = "titlebar", className = "", }) {
     // ── Element builders ────────────────────────────────────────────────────────
-    const promotionsEl = promotionsHref ? (_jsxs(Link, { href: promotionsHref, "aria-label": "Today's deals", className: "flex items-center gap-[var(--appkit-space-1)] px-[var(--appkit-space-3)] py-[var(--appkit-space-1)] rounded-full text-[length:var(--appkit-text-xs)] font-bold bg-primary-100 text-primary-700 dark:bg-secondary-900/40 dark:text-secondary-400 hover:bg-primary-200 dark:hover:bg-secondary-900/60 transition-colors border border-primary-200/60 dark:border-secondary-700/40", children: [_jsx("svg", { className: "w-3 h-3", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: _jsx("path", { d: "M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.37.86.58 1.41.58.55 0 1.05-.21 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z" }) }), _jsx(Span, { className: "hidden sm:inline", children: "Today's Deals" })] })) : null;
+    const promotionsEl = promotionsHref ? (_jsxs(Link, { href: promotionsHref, "aria-label": "Today's deals", className: "flex items-center gap-[var(--appkit-space-1)] px-[var(--appkit-space-3)] py-[var(--appkit-space-1)] rounded-full text-[length:var(--appkit-text-xs)] font-bold bg-primary-100 text-primary-700 dark:bg-secondary-900/40 dark:text-secondary-400 hover:bg-primary-surface transition-colors border border-primary-200/60 dark:border-secondary-700/40", children: [_jsx("svg", { className: "w-3 h-3", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: _jsx("path", { d: "M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.37.86.58 1.41.58.55 0 1.05-.21 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z" }) }), _jsx(Span, { className: "hidden sm:inline", children: "Today's Deals" })] })) : null;
     const themeBtn = onToggleTheme ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", "aria-label": isDark ? "Switch to light mode" : "Switch to dark mode", onClick: onToggleTheme, className: iconBtn, children: isDark ? (_jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 3v1m0 16v1m8.66-9h-1M4.34 12h-1m15.07-6.07-.71.71M6.34 17.66l-.71.71m12.73 0-.71-.71M6.34 6.34l-.71-.71M12 5a7 7 0 1 0 0 14A7 7 0 0 0 12 5z" }) })) : (_jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 12.79A9 9 0 1 1 11.21 3a7 7 0 1 0 9.79 9.79z" }) })) })) : null;
     const tourBtn = onTourStart ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", "aria-label": "Start product tour", onClick: onTourStart, className: iconBtn, children: _jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }) })) : null;
     const hamburgerBtn = !hideSidebarToggle ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", "aria-label": sidebarOpen ? "Close menu" : hasDashboardNav ? "Open dashboard navigation" : "Open menu", "aria-expanded": sidebarOpen, "aria-controls": "secondary-sidebar", onClick: hasDashboardNav && onToggleDashboardNav ? onToggleDashboardNav : onToggleSidebar, className: iconBtn, children: _jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: sidebarOpen ? (_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" })) : (_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 12h16M4 18h16" })) }) })) : null;
@@ -46,7 +46,7 @@ export function TitleBarLayout({ onToggleSidebar, sidebarOpen, onSearchToggle, s
     const authButtonsEl = !user && (loginHref || registerHref) ? (
     // Mirrors with TB1 so Register (the primary CTA) keeps the outer, more
     // reachable edge instead of ending up tucked inside after the flip.
-    _jsxs(Row, { gap: "xs", reverse: "hand", className: "hidden lg:flex", children: [loginHref && (_jsx(Link, { href: loginHref, className: "px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-sm)] font-medium text-[var(--appkit-color-text-muted)] hover:text-primary-700 dark:hover:text-secondary-400 transition-colors rounded-lg hover:bg-primary-50 dark:hover:bg-[var(--appkit-color-surface-elevated)]", children: "Sign in" })), registerHref && (_jsx(Link, { href: registerHref, className: "px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-sm)] font-semibold rounded-lg bg-primary text-white hover:bg-primary/90 transition-colors btn-glow shadow-sm", children: "Register" }))] })) : null;
+    _jsxs(Row, { gap: "xs", reverse: "hand", className: "hidden lg:flex", children: [loginHref && (_jsx(Link, { href: loginHref, className: "px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-sm)] font-medium text-[var(--appkit-color-text-muted)] hover:text-primary-700 dark:hover:text-secondary-400 transition-colors rounded-lg hover:bg-primary-surface", children: "Sign in" })), registerHref && (_jsx(Link, { href: registerHref, className: "px-[var(--appkit-space-3)] py-[var(--appkit-space-1-5)] text-[length:var(--appkit-text-sm)] font-semibold rounded-lg bg-primary text-white hover:bg-primary/90 transition-colors btn-glow shadow-sm", children: "Register" }))] })) : null;
     const hasTb2 = !!(notificationsEl || wishlistEl || cartEl || profileEl);
     // ── Render ───────────────────────────────────────────────────────────────────
     return (_jsxs(BlockHeader, { id: id, className: `sticky top-0 z-50 bg-[var(--appkit-color-bg)]/95 backdrop-blur-md border-b border-[var(--appkit-color-border-subtle)] shadow-sm ${className}`, children: [promoStripText && (_jsx(Section, { color: "inverse", tone: "accent-banner", className: "text-[length:var(--appkit-text-xs)] text-center font-medium", padding: "y-2xs", children: promoStripText })), _jsxs(Div, { paddingX: "x-page", className: "container mx-auto max-w-[1920px]", children: [_jsxs(Row, { justify: "between", gap: "none", reverse: "hand", className: "relative h-14", children: [_jsx(Row, { gap: "3", children: _jsxs(Link, { href: logoHref, "aria-label": brandName, className: "flex items-center gap-[var(--appkit-space-2)] transition-opacity hover:opacity-80", children: [_jsx(Div, { className: "flex md:hidden", children: _jsx(SiteMark, { title: brandShortName ?? brandName, size: "sm" }) }), _jsx(SiteLogo, { title: brandName, size: "md" })] }) }), _jsx(Row, { className: "hidden md:flex absolute inset-y-0 left-1/2 -translate-x-1/2", align: "center", children: _jsx(Link, { href: logoHref, "aria-label": brandName, className: "flex items-center transition-opacity hover:opacity-80", children: _jsx(SiteMark, { src: siteLogoUrl, title: brandName, size: "lg" }) }) }), _jsxs(Row, { gap: "xs", reverse: "hand", children: [devSlot, navSlot, compareEl, notificationSlot, notificationsEl && _jsx(Div, { className: "hidden lg:flex", children: notificationsEl }), wishlistEl && _jsx(Div, { className: "hidden lg:flex", children: wishlistEl }), cartEl && _jsx(Div, { className: "hidden lg:flex", children: cartEl }), user

package/dist/features/layout/hooks/useFormBottomActions.d.ts

@@ -16,6 +16,16 @@ export interface UseFormBottomActionsOptions {
      * `Form` itself renders, so the ambient lookup would find the parent's
      * context or none at all.
      */
+    /**
+     * Destructive action for this record, mirrored from `SectionForm`. Pushed
+     * to the FRONT of the bar so it is furthest from where the thumb rests on
+     * the primary action.
+     */
+    destructiveAction?: {
+        label: string;
+        onClick: () => void;
+        disabled?: boolean;
+    };
     ctx?: FormShellContextValue;
 }
 /**
@@ -53,5 +63,5 @@ export interface UseFormBottomActionsOptions {
  *    overlay tells us, because neither portal leaves a detectable trace in
  *    the DOM at the form's position.
  */
-export declare function useFormBottomActions({ onSubmit, onCancel, submitLabel, cancelLabel, isLoading, disabled, enabled, ctx: ctxProp, }: UseFormBottomActionsOptions): void;
+export declare function useFormBottomActions({ onSubmit, onCancel, submitLabel, cancelLabel, isLoading, disabled, enabled, destructiveAction, ctx: ctxProp, }: UseFormBottomActionsOptions): void;
 export default useFormBottomActions;

package/dist/features/layout/hooks/useFormBottomActions.js

@@ -40,7 +40,7 @@ import { useBottomActions } from "./useBottomActions";
  *    overlay tells us, because neither portal leaves a detectable trace in
  *    the DOM at the form's position.
  */
-export function useFormBottomActions({ onSubmit, onCancel, submitLabel = "Save", cancelLabel = "Cancel", isLoading = false, disabled = false, enabled = true, ctx: ctxProp, }) {
+export function useFormBottomActions({ onSubmit, onCancel, submitLabel = "Save", cancelLabel = "Cancel", isLoading = false, disabled = false, enabled = true, destructiveAction, ctx: ctxProp, }) {
     const ambient = useContext(FormShellContext);
     const ctx = ctxProp ?? ambient;
     const insideOverlay = useIsInsideOverlay();
@@ -51,6 +51,20 @@ export function useFormBottomActions({ onSubmit, onCancel, submitLabel = "Save",
         if (!active)
             return [];
         const list = [];
+        /*
+         * Destructive FIRST, so it is furthest from the thumb's resting position
+         * on the primary action. It never grows, so Save keeps the width.
+         */
+        if (destructiveAction) {
+            list.push({
+                id: "form-destructive",
+                label: destructiveAction.label,
+                variant: "danger",
+                grow: false,
+                onClick: destructiveAction.onClick,
+                disabled: destructiveAction.disabled || isLoading,
+            });
+        }
         if (onCancel) {
             list.push({
                 id: "form-cancel",
@@ -71,7 +85,7 @@ export function useFormBottomActions({ onSubmit, onCancel, submitLabel = "Save",
             onClick: () => void onSubmit(),
         });
         return list;
-    }, [active, onCancel, cancelLabel, submitLabel, isLoading, disabled, onSubmit]);
+    }, [active, onCancel, cancelLabel, submitLabel, isLoading, disabled, onSubmit, destructiveAction]);
     useBottomActions({
         actions,
         // Encodes the count on purpose — see (1) in the header.

package/dist/features/lottery/schemas/config-write.d.ts

@@ -0,0 +1,141 @@
+import { z } from "zod";
+import type { LotteryConfig } from "../types/index";
+/**
+ * What an admin may say about one slot. Booking state is deliberately absent
+ * — see the header. `.strict()`, so `isBooked` is a 400.
+ */
+export declare const lotterySlotWriteSchema: z.ZodObject<{
+    slotNumber: z.ZodNumber;
+    name: z.ZodString;
+    image: z.ZodOptional<z.ZodString>;
+    price: z.ZodNumber;
+}, "strict", z.ZodTypeAny, {
+    name: string;
+    price: number;
+    slotNumber: number;
+    image?: string | undefined;
+}, {
+    name: string;
+    price: number;
+    slotNumber: number;
+    image?: string | undefined;
+}>;
+export declare const lotteryConfigWriteSchema: z.ZodEffects<z.ZodEffects<z.ZodObject<{
+    slots: z.ZodArray<z.ZodObject<{
+        slotNumber: z.ZodNumber;
+        name: z.ZodString;
+        image: z.ZodOptional<z.ZodString>;
+        price: z.ZodNumber;
+    }, "strict", z.ZodTypeAny, {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }, {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }>, "many">;
+    pricingMode: z.ZodEnum<["uniform", "variable"]>;
+    uniformPrice: z.ZodOptional<z.ZodNumber>;
+    drawWindowDurationMinutes: z.ZodNumber;
+    maxPullsPerTransaction: z.ZodNumber;
+    maxPullsPerUser: z.ZodNumber;
+}, "strict", z.ZodTypeAny, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}>, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}>, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}, {
+    slots: {
+        name: string;
+        price: number;
+        slotNumber: number;
+        image?: string | undefined;
+    }[];
+    pricingMode: "uniform" | "variable";
+    drawWindowDurationMinutes: number;
+    maxPullsPerTransaction: number;
+    maxPullsPerUser: number;
+    uniformPrice?: number | undefined;
+}>;
+export type LotteryConfigWriteInput = z.infer<typeof lotteryConfigWriteSchema>;
+/** Why a merge was refused. Distinct from a validation failure. */
+export interface LotteryMergeRejection {
+    ok: false;
+    code: "BOOKED_SLOT_REMOVED";
+    message: string;
+    slotNumbers: number[];
+}
+export type LotteryMergeResult = {
+    ok: true;
+    config: LotteryConfig;
+} | LotteryMergeRejection;
+/**
+ * Apply an admin's edit to the stored config, carrying every booking across.
+ *
+ * `existing` is undefined when the lottery is being created, in which case
+ * there is nothing to preserve and every slot starts unbooked.
+ *
+ * `totalSlots` is DERIVED from `slots.length` and never accepted from input —
+ * a caller-supplied count that disagrees with the array is exactly the
+ * mirror-drift trap (Root Cause #42), and `totalSlots` is what the fullness
+ * check reads.
+ */
+export declare function mergeLotteryConfig(input: LotteryConfigWriteInput, existing?: LotteryConfig): LotteryMergeResult;

package/dist/features/lottery/schemas/config-write.js

@@ -0,0 +1,139 @@
+/*
+ * WHY: `lotteryConfig` had NO write schema. The only authoring UI
+ *      (`LotteryAdminEditView`) was orphaned, and the route it would have
+ *      posted to — `PATCH /api/admin/events/[id]` — is `.passthrough()`, so
+ *      the whole config wrote through completely unvalidated.
+ * WHAT: The write contract, plus `mergeLotteryConfig` — the one function that
+ *       is allowed to turn an admin's edit into a stored config.
+ *
+ * ## 🛑 The author-side slot shape CANNOT carry booking state
+ *
+ * `LotteryAdminEditView.handleSubmit` sent `isBooked: false` and `weight: 0`
+ * for every slot, and dropped `bookedByUserId` / `bookedByDisplayName` /
+ * `bookedByUserLotteryNumber` entirely. Against a `.passthrough()` PATCH that
+ * is not a validation gap — it is a **destructive write**: the first save of
+ * a live lottery marks every purchased slot as available again, and the
+ * buyers who paid for them are simply gone from the record.
+ *
+ * So the input type deliberately has NO booking fields at all. An admin
+ * editing a lottery is describing PRIZES, not attendance, and the schema
+ * refuses to express the latter — a `.strict()` object, so sending
+ * `isBooked` is a 400 rather than something a merge has to defend against.
+ *
+ * `weight` is absent for the same reason: it is derived from price
+ * server-side and is never client input.
+ *
+ * ## Merging is BY `slotNumber`, not by index
+ *
+ * Array position is not identity. An admin who deletes slot 3 shifts every
+ * later slot's index by one, and an index-wise merge would hand slot 7's
+ * buyer the prize that used to be slot 8. `slotNumber` is the stable key
+ * users actually see and pull against.
+ *
+ * A slot that is booked cannot be REMOVED either. Dropping it would erase a
+ * paid entry with no trace; the merge rejects that rather than silently
+ * carrying the slot along, because an admin who thinks they deleted a prize
+ * and did not is a worse outcome than an error.
+ *
+ * EXPORTS: lotteryConfigWriteSchema, lotterySlotWriteSchema,
+ *          mergeLotteryConfig, type LotteryConfigWriteInput
+ *
+ * @tag domain:lottery
+ * @tag layer:schema
+ * @tag pattern:none
+ * @tag access:isomorphic
+ * @tag consumers:/api/admin/events/[id]/lottery-config,LotteryAdminEditView
+ * @tag sideEffects:none
+ */
+import { z } from "zod";
+/** Mirrors `LotteryPricingMode`. */
+const pricingModeSchema = z.enum(["uniform", "variable"]);
+/**
+ * What an admin may say about one slot. Booking state is deliberately absent
+ * — see the header. `.strict()`, so `isBooked` is a 400.
+ */
+export const lotterySlotWriteSchema = z
+    .object({
+    slotNumber: z.coerce.number().int().min(1).max(200),
+    name: z.string().min(1, "Every slot needs a prize name.").max(200),
+    image: z.string().max(2000).optional(),
+    price: z.coerce.number().min(0, "A price cannot be negative."),
+})
+    .strict();
+export const lotteryConfigWriteSchema = z
+    .object({
+    slots: z
+        .array(lotterySlotWriteSchema)
+        .min(1, "A lottery needs at least one slot.")
+        .max(200, "A lottery cannot exceed 200 slots."),
+    pricingMode: pricingModeSchema,
+    uniformPrice: z.coerce.number().min(0).optional(),
+    drawWindowDurationMinutes: z.coerce.number().int().min(1).max(1440),
+    maxPullsPerTransaction: z.coerce.number().int().min(1).max(200),
+    maxPullsPerUser: z.coerce.number().int().min(1).max(200),
+})
+    .strict()
+    .refine((c) => new Set(c.slots.map((s) => s.slotNumber)).size === c.slots.length, { message: "Two slots share a slot number.", path: ["slots"] })
+    .refine((c) => c.pricingMode !== "uniform" || typeof c.uniformPrice === "number", {
+    message: "Uniform pricing needs a price.",
+    path: ["uniformPrice"],
+});
+/**
+ * Apply an admin's edit to the stored config, carrying every booking across.
+ *
+ * `existing` is undefined when the lottery is being created, in which case
+ * there is nothing to preserve and every slot starts unbooked.
+ *
+ * `totalSlots` is DERIVED from `slots.length` and never accepted from input —
+ * a caller-supplied count that disagrees with the array is exactly the
+ * mirror-drift trap (Root Cause #42), and `totalSlots` is what the fullness
+ * check reads.
+ */
+export function mergeLotteryConfig(input, existing) {
+    const priorBySlot = new Map();
+    for (const slot of existing?.slots ?? [])
+        priorBySlot.set(slot.slotNumber, slot);
+    const incoming = new Set(input.slots.map((s) => s.slotNumber));
+    const droppedBooked = [...priorBySlot.values()]
+        .filter((s) => s.isBooked && !incoming.has(s.slotNumber))
+        .map((s) => s.slotNumber);
+    if (droppedBooked.length > 0) {
+        return {
+            ok: false,
+            code: "BOOKED_SLOT_REMOVED",
+            message: `Slot ${droppedBooked.join(", ")} has already been pulled and cannot be ` +
+                `removed. Reopen it first if the pull needs to be undone.`,
+            slotNumbers: droppedBooked,
+        };
+    }
+    const slots = input.slots.map((s) => {
+        const prior = priorBySlot.get(s.slotNumber);
+        return {
+            slotNumber: s.slotNumber,
+            name: s.name,
+            image: s.image?.trim() || undefined,
+            price: input.pricingMode === "uniform" ? (input.uniformPrice ?? 0) : s.price,
+            // Server-derived, never input. Recomputed by the pricing pass; carried
+            // from the prior slot so an edit does not zero a live weighting.
+            weight: prior?.weight ?? 0,
+            // 🛑 THE WHOLE POINT: booking state comes from the STORED slot, never
+            // from the request. A slot the admin renames keeps its buyer.
+            isBooked: prior?.isBooked ?? false,
+            bookedByUserId: prior?.bookedByUserId,
+            bookedByDisplayName: prior?.bookedByDisplayName,
+            bookedByUserLotteryNumber: prior?.bookedByUserLotteryNumber,
+        };
+    });
+    return {
+        ok: true,
+        config: {
+            slots,
+            totalSlots: slots.length,
+            pricingMode: input.pricingMode,
+            uniformPrice: input.pricingMode === "uniform" ? input.uniformPrice : undefined,
+            drawWindowDurationMinutes: input.drawWindowDurationMinutes,
+            maxPullsPerTransaction: input.maxPullsPerTransaction,
+            maxPullsPerUser: input.maxPullsPerUser,
+        },
+    };
+}

package/dist/features/media/MediaPickerModal.js

@@ -57,8 +57,10 @@ export function MediaPickerModal({ isOpen, onClose, onSelect, accept = "image/*"
                 setExistingFiles(data.data.files);
         })
             .catch((err) => {
+            // normalizeError covers Zod/Api/Firebase shapes an `instanceof Error`
+            // check misses, so those stop collapsing to the generic fallback.
             if (!cancelled)
-                setExistingError(err instanceof Error ? err.message : "Failed to load");
+                setExistingError(normalizeError(err).message || "Failed to load");
         })
             .finally(() => {
             if (!cancelled)

package/dist/features/media/MediaVideo.js

@@ -2,12 +2,14 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useEffect } from "react";
 import { Div, Row, Span } from "../../ui";
-import { resolveMediaUrl, getYouTubeVideoId } from "../../utils/media-url";
+import { resolveMediaUrl, resolveVideoUrl, getYouTubeVideoId } from "../../utils/media-url";
 import { useSiteSettings } from "../../core/hooks/useSiteSettings";
 export function MediaVideo({ src, thumbnailUrl, alt = "Video", controls = true, autoPlayMuted = false, loop = false, trimStart, trimEnd, objectFit = "cover", watermark, }) {
     const videoRef = useRef(null);
     const fitClass = objectFit === "contain" ? "object-contain" : "object-cover";
-    const resolvedSrc = resolveMediaUrl(src);
+    // Video src must NOT fall through to /api/media/ext (image-only, 400s on
+    // video/mp4). The poster is an image and stays on the normal image path.
+    const resolvedSrc = resolveVideoUrl(src);
     const resolvedPoster = resolveMediaUrl(thumbnailUrl);
     const youtubeId = getYouTubeVideoId(src);
     // Apply trimStart on load

package/dist/features/media/components/MediaSlider.js

@@ -5,7 +5,7 @@ export function MediaSlider({ value, min = 0, max = 100, step = 1, onChange, onC
         // drag/cancel state; nothing here persists across a cancelled touch.
         onTouchEnd: (e) => onChangeEnd?.(parseFloat(e.target.value)), className: [
             "w-full h-2 appearance-none cursor-pointer rounded-full",
-            "bg-zinc-200 bg-[var(--appkit-color-border)]",
+            " bg-[var(--appkit-color-border)]",
             "accent-primary-600 dark:accent-secondary-400",
             className,
         ]

package/dist/features/orders/components/OrdersList.js

@@ -23,14 +23,14 @@ export function OrderCard({ order, onClick, labels = {}, renderActions }) {
             day: "numeric",
         })
         : "";
-    const statusColor = STATUS_COLORS[order.orderStatus] ?? "bg-[var(--appkit-color-surface)] text-neutral-700 bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]";
+    const statusColor = STATUS_COLORS[order.orderStatus] ?? "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]";
     // SB8-F — count unrevealed prize-draw entries to surface a "reveals pending" badge.
     const unrevealedPrizeDraws = order.items.filter((it) => it.listingType === "prize-draw" &&
         it.prizeRevealStatus !== undefined &&
         it.prizeRevealStatus !== "revealed");
     const revealsRemaining = unrevealedPrizeDraws.length;
     return (_jsxs(Div, { padding: "5", role: onClick ? "button" : undefined, tabIndex: onClick ? 0 : undefined, onKeyDown: onClick
-            ? (e) => (e.key === "Enter" || e.key === " ") && onClick(order)
+            ? (e) => (e.key === "Enter" || e.key === "") && onClick(order)
             : undefined, onClick: onClick ? () => onClick(order) : undefined, className: `border border-neutral-200 ${onClick ? "cursor-pointer transition hover:shadow-md" : ""}`, rounded: "xl", surface: "default", children: [_jsxs(Row, { wrap: true, align: "start", justify: "between", gap: "3", children: [_jsxs(Div, { children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "xs", children: ["Order #", order.id.slice(-8).toUpperCase()] }), date && (_jsx(Text, { className: "mt-0.5", color: "faint", size: "xs", children: date }))] }), _jsx(Span, { size: "xs", weight: "semibold", className: `capitalize ${statusColor}`, rounded: "full", padding: "pill-md", children: labels[order.orderStatus] ?? order.orderStatus.replace(/_/g, " ") })] }), revealsRemaining > 0 && (_jsx(Row, { gap: "sm", className: "mt-2", children: _jsxs(Span, { size: "xs", weight: "semibold", className: CLS_PRIZE_BADGE, children: [revealsRemaining, " ", revealsRemaining === 1 ? "reveal" : "reveals", " pending"] }) })), _jsxs(Row, { wrap: true, gap: "3", className: "mt-4", children: [order.items.slice(0, 3).map((item, i) => (_jsxs(Row, { gap: "sm", children: [item.image && (_jsx(Div, { className: "relative h-10 w-10 flex-shrink-0", rounded: "lg", overflow: "hidden", children: _jsx(MediaImage, { src: item.image, alt: item.title, size: "thumbnail" }) })), _jsxs(Div, { children: [_jsx(Text, { truncate: true, size: "sm", weight: "medium", color: "primary", children: item.title }), _jsxs(Text, { size: "xs", color: "faint", children: ["\u00D7", item.quantity] })] })] }, i))), order.items.length > 3 && (_jsxs(Span, { size: "xs", className: "self-center", color: "faint", children: ["+", order.items.length - 3, " more"] }))] }), _jsxs(Row, { justify: "between", className: "mt-4 border-t border-neutral-100", padding: "t-sm", children: [_jsxs(Span, { size: "sm", className: "text-[var(--appkit-color-text-muted)]", children: [order.currency ?? "", " Total"] }), _jsx(Span, { weight: "semibold", className: "text-[var(--appkit-color-text)]", children: formatCurrency(order.total, order.currency) })] }), renderActions && (_jsx(Row, { justify: "end", gap: "sm", className: "mt-3", onClick: (e) => e.stopPropagation(), children: renderActions(order) }))] }));
 }
 export function OrdersList({ orders, isLoading, onOrderClick, totalPages = 1, currentPage = 1, onPageChange, emptyLabel = "No orders found", renderActions, }) {

package/dist/features/payments/repository/payout.repository.d.ts

@@ -19,7 +19,17 @@ export declare class PayoutRepository extends BaseRepository<PayoutDocument> {
     constructor();
     /** Decrypt PII fields on a payout document after Firestore read */
     private decryptPayout;
-    /** Encrypt PII fields on payout data before Firestore write */
+    /**
+     * Encrypt PII, then attach blind indices derived from the plaintext.
+     *
+     * Previously this reassigned `encrypted = addPiiIndices(data, …)` — which
+     * re-reads the ORIGINAL plaintext and returns `{...data, ...indices}` — and
+     * then spread that over the ciphertext, so plaintext won and `sellerEmail`
+     * and `upiId` were written to Firestore in the clear beside a valid index.
+     * `piiIndicesFor` returns the index fields alone, so the ciphertext cannot be
+     * overwritten. The identical bug was fixed in UserRepository and never
+     * propagated here.
+     */
     private encryptPayoutData;
     /** Override mapDoc to auto-decrypt PII on every Firestore read */
     protected mapDoc<D = PayoutDocument>(snap: import("../../../providers/db-firebase").DocumentSnapshot): D;

package/dist/features/payments/repository/payout.repository.js

@@ -7,7 +7,7 @@
 import { BaseRepository, prepareForFirestore, parseSieveDateValue, } from "../../../providers/db-firebase";
 import { PAYOUT_COLLECTION, PAYOUT_FIELDS, PAYOUT_TRACKED_FIELDS, createPayoutId } from "../schemas";
 import { withHistory } from "../../../_internal/shared/history/index";
-import { encryptPiiFields, decryptPiiFields, addPiiIndices, PAYOUT_PII_FIELDS, PAYOUT_PII_INDEX_MAP, encryptPayoutBankAccount, decryptPayoutBankAccount, } from "../../../security";
+import { encryptPiiFields, decryptPiiFields, piiIndicesFor, PAYOUT_PII_FIELDS, PAYOUT_PII_INDEX_MAP, encryptPayoutBankAccount, decryptPayoutBankAccount, } from "../../../security";
 export class PayoutRepository extends BaseRepository {
     constructor() {
         super(PAYOUT_COLLECTION);
@@ -20,13 +20,21 @@ export class PayoutRepository extends BaseRepository {
         }
         return decrypted;
     }
-    /** Encrypt PII fields on payout data before Firestore write */
+    /**
+     * Encrypt PII, then attach blind indices derived from the plaintext.
+     *
+     * Previously this reassigned `encrypted = addPiiIndices(data, …)` — which
+     * re-reads the ORIGINAL plaintext and returns `{...data, ...indices}` — and
+     * then spread that over the ciphertext, so plaintext won and `sellerEmail`
+     * and `upiId` were written to Firestore in the clear beside a valid index.
+     * `piiIndicesFor` returns the index fields alone, so the ciphertext cannot be
+     * overwritten. The identical bug was fixed in UserRepository and never
+     * propagated here.
+     */
     encryptPayoutData(data) {
-        let encrypted = encryptPiiFields(data, [...PAYOUT_PII_FIELDS]);
-        encrypted = addPiiIndices(data, PAYOUT_PII_INDEX_MAP);
-        encrypted = {
+        const encrypted = {
             ...encryptPiiFields(data, [...PAYOUT_PII_FIELDS]),
-            ...encrypted,
+            ...piiIndicesFor(data, PAYOUT_PII_INDEX_MAP),
         };
         const access = encrypted;
         if (access.bankAccount) {

package/dist/features/pre-orders/components/MarketplacePreorderCard.js

@@ -17,6 +17,7 @@ const CLS_LIMITED_BADGE = "rounded-full bg-info-solid px-[var(--appkit-space-2)]
 import { BaseListingCard, Button, RichText, Row, Span, Stack, Text, TextLink } from "../../../ui";
 import { normalizeRichTextHtml } from "../../../utils/string.formatter";
 import { PreorderBadge } from "./PreorderCard";
+import { WishlistHeartButton } from "../../wishlist/components/WishlistHeartButton";
 const DEFAULT_LABELS = {
     preOrderBadge: "Pre-order",
     featuredBadge: "Featured",
@@ -62,7 +63,7 @@ export function MarketplacePreorderCard({ product, className = "", variant = "gr
                             onSelect(product.id, !isSelected);
                         }, className: selectable || isSelected ? "opacity-100" : "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto transition-opacity" }))] }), _jsx(BaseListingCard.Info, { variant: variant, children: variant === "list" ? (
                 /* ── Compact list layout ── */
-                _jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: detailHref, className: "min-w-0 flex-1", children: _jsx(Text, { size: "sm", weight: "medium", color: "primary", truncate: 2, children: product.title }) }), wishlistActions && (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: `shrink-0 p-[0.25rem] leading-none ${inWishlist ? "text-primary" : "text-[var(--appkit-color-text-faint)]"}`, onClick: handleWishlist, "aria-label": inWishlist ? mergedLabels.removeFromWishlist : mergedLabels.addToWishlist, children: inWishlist ? "♥" : "♡" }))] }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsx(Button, { type: "button", variant: "primary", size: "sm", textSize: "xs", className: "self-start mt-0.5", onClick: handleNavigate, children: mergedLabels.reserveNow })] })) : (
+                _jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: detailHref, className: "min-w-0 flex-1", children: _jsx(Text, { size: "sm", weight: "medium", color: "primary", truncate: 2, children: product.title }) }), wishlistActions && (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist }))] }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsx(Button, { type: "button", variant: "primary", size: "sm", textSize: "xs", className: "self-start mt-0.5", onClick: handleNavigate, children: mergedLabels.reserveNow })] })) : (
                 /* ── Full grid layout ── */
-                _jsxs(_Fragment, { children: [_jsx(TextLink, { href: detailHref, children: _jsx(Text, { size: "sm", weight: "medium", color: "primary", truncate: 2, children: product.title }) }), product.description ? (_jsx(RichText, { html: normalizeRichTextHtml(product.description), proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: "line-clamp-2 text-[length:var(--appkit-text-xs)] text-[var(--appkit-color-text-muted)]" })) : null, _jsxs(Row, { justify: "between", className: "mt-1", gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsxs(Row, { justify: "between", className: "mt-auto pt-[var(--appkit-space-2)]", gap: "sm", children: [_jsx(Button, { type: "button", variant: "primary", size: "sm", textSize: "xs", className: "flex-1", onClick: handleNavigate, children: mergedLabels.reserveNow }), onAddToCart ? (_jsx(Button, { type: "button", variant: "outline", size: "sm", textSize: "xs", className: "flex-1", onClick: (e) => { e.stopPropagation(); onAddToCart(product); }, children: mergedLabels.addToCart })) : null, wishlistActions ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: `${inWishlist ? "text-primary" : "text-[var(--appkit-color-text-muted)]"}`, onClick: handleWishlist, "aria-label": inWishlist ? mergedLabels.removeFromWishlist : mergedLabels.addToWishlist, children: inWishlist ? "♥" : "♡" })) : null] })] })) })] }));
+                _jsxs(_Fragment, { children: [_jsx(TextLink, { href: detailHref, children: _jsx(Text, { size: "sm", weight: "medium", color: "primary", truncate: 2, children: product.title }) }), product.description ? (_jsx(RichText, { html: normalizeRichTextHtml(product.description), proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: "line-clamp-2 text-[length:var(--appkit-text-xs)] text-[var(--appkit-color-text-muted)]" })) : null, _jsxs(Row, { justify: "between", className: "mt-1", gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsxs(Row, { justify: "between", className: "mt-auto pt-[var(--appkit-space-2)]", gap: "sm", children: [_jsx(Button, { type: "button", variant: "primary", size: "sm", textSize: "xs", className: "flex-1", onClick: handleNavigate, children: mergedLabels.reserveNow }), onAddToCart ? (_jsx(Button, { type: "button", variant: "outline", size: "sm", textSize: "xs", className: "flex-1", onClick: (e) => { e.stopPropagation(); onAddToCart(product); }, children: mergedLabels.addToCart })) : null, wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] })] })) })] }));
 }

package/dist/features/pre-orders/components/PreOrderBadge.js

@@ -5,7 +5,7 @@ const STATUS_MAP = {
     pending: { label: "Pending", color: "bg-warning-surface text-warning" },
     confirmed: { label: "Confirmed", color: "bg-info-surface text-info" },
     ready: { label: "Ready", color: "bg-success-surface text-success" },
-    fulfilled: { label: "Fulfilled", color: "bg-[var(--appkit-color-surface)] text-gray-700 bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]" },
+    fulfilled: { label: "Fulfilled", color: "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]" },
     cancelled: { label: "Cancelled", color: "bg-error-surface text-error" },
 };
 export function PreOrderBadge({ status, className = "" }) {

package/dist/features/pre-orders/components/PreOrderDetailPageView.js

@@ -61,7 +61,7 @@ function PreOrderInfoSection({ title, productionStatus, maxPerUser, deliveryDate
                     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 product" }), _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: "Sold 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" }))] }) }))] }));
+                } }), (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 product" }), _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: "Sold 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" }))] }) }))] }));
 }
 function PreOrderBuyBarPanel({ reserveTarget, reservedCount, progressPct, productId, price, currency, depositAmount, depositPercent, isCancellable, tags, onReserveNow, }) {
     return (_jsxs(Stack, { id: "pre-order-buy-bar", className: `${__P.p5}`, border: "subtle", gap: "md", rounded: "xl", surface: "muted", children: [reserveTarget > 0 && (_jsxs(Stack, { gap: "sm", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { size: "xs", color: "muted", children: [reservedCount, " of ", reserveTarget, " reserved"] }), _jsxs(Span, { size: "xs", weight: "semibold", className: "text-primary-600 dark:text-primary-400", children: [progressPct, "%"] })] }), _jsx(Div, { className: `h-2 w-full ${__O.hidden}`, rounded: "full", surface: "subtle", children: _jsx(ProgressBarFill, { pct: progressPct, className: "h-full bg-primary transition-all rounded-full" }) })] })), onReserveNow ? (_jsx(PreOrderActionsClient, { productId: productId, price: price, currency: currency, depositAmount: depositAmount, depositPercent: depositPercent, isCancellable: isCancellable, tags: tags, onReserveNow: onReserveNow })) : (_jsxs(_Fragment, { children: [price !== null && (_jsxs(Div, { children: [_jsx(Text, { size: "2xl", weight: "bold", color: "primary", children: formatCurrency(price, currency) }), depositAmount !== null && (_jsxs(Text, { className: "mt-0.5", color: "muted", size: "xs", children: ["Reserve with ", formatCurrency(depositAmount, currency), depositPercent !== null ? ` (${depositPercent}% deposit)` : ""] }))] })), _jsxs(Stack, { gap: "sm", children: [_jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Reserve Now" }), isCancellable && (_jsx(Text, { size: "xs", align: "start", color: "muted", children: "\u2713 Free cancellation before production" }))] }), 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))) }) })), _jsx(Div, { border: "default", className: "border-t", padding: "t-md", children: _jsx(Row, { wrap: true, gap: "sm", justify: "center", className: "text-center", children: [

package/dist/features/products/columns/productTableColumns.js

@@ -7,7 +7,7 @@ const __O = {
 };
 const STATUS_STYLES = {
     published: "bg-success-surface text-success dark:bg-success-surface dark:text-success",
-    draft: "bg-[var(--appkit-color-surface)] text-zinc-700 bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
+    draft: "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
     out_of_stock: "bg-warning-surface text-warning dark:bg-warning-surface dark:text-warning",
     discontinued: "bg-error-surface text-error dark:bg-error-surface dark:text-error",
     sold: "bg-primary/10 dark:bg-primary/20 text-primary",
@@ -54,7 +54,7 @@ export function getProductTableColumns({ labels, onEdit, onDelete, currencyCode,
                 return (_jsx(Span, { className: [
                         "rounded px-[var(--appkit-space-2)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium",
                         STATUS_STYLES[status] ??
-                            "bg-[var(--appkit-color-surface)] text-zinc-700 bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
+                            "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
                     ].join(" "), children: status.replace("_", " ") }));
             },
         },
@@ -76,7 +76,7 @@ export function getProductTableColumns({ labels, onEdit, onDelete, currencyCode,
                         "rounded px-[var(--appkit-space-2)] py-[var(--appkit-space-1)] text-[length:var(--appkit-text-xs)] font-medium",
                         featured
                             ? CLS_LOW_STOCK
-                            : "bg-[var(--appkit-color-surface)] text-zinc-700 bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
+                            : "bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]",
                     ].join(" "), children: featured ? labels.yes : labels.no }));
             },
         },