@mohasinac/appkit 3.0.3 → 3.0.4

package/dist/features/account/components/NotificationBell.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { normalizeError } from "../../../errors/normalize";
 import { useCallback, useRef, useState } from "react";
-import { Button, Div, Heading, Li, Row, Span, Spinner, Stack, Text, TextLink, Ul } from "../../../ui";
+import { Button, Div, Heading, Li, Row, Span, Spinner, Stack, Text, TextLink, Ul, useToast } from "../../../ui";
 import { useClickOutside, useMessage } from "../../../react";
 import { formatRelativeTime } from "../../../utils";
 import { useNotifications } from "../hooks/useNotifications";
@@ -32,6 +33,7 @@ export function NotificationBell({ limit = 10, viewAllHref, labels, icons, rende
     const [isOpen, setIsOpen] = useState(false);
     const dropdownRef = useRef(null);
     const { showSuccess, showError } = useMessage();
+    const { showToast } = useToast();
     const { notifications, unreadCount, isLoading, refetch, markRead, markAllRead, isMarkingAll, } = useNotifications(limit);
     const notificationIcons = { ...DEFAULT_ICONS, ...icons };
     useClickOutside(dropdownRef, () => setIsOpen(false), { enabled: isOpen });
@@ -43,9 +45,15 @@ export function NotificationBell({ limit = 10, viewAllHref, labels, icons, rende
         });
     }, [refetch]);
     const handleMarkRead = useCallback(async (id) => {
-        await markRead(id);
-        refetch();
-    }, [markRead, refetch]);
+        try {
+            await markRead(id);
+            refetch();
+        }
+        catch (err) {
+            void normalizeError(err);
+            showToast(err instanceof Error ? err.message : "Failed to mark notification as read", "error");
+        }
+    }, [markRead, refetch, showToast]);
     const emitSuccess = onMarkAllReadSuccess ?? showSuccess;
     const emitError = onMarkAllReadError ?? showError;
     const handleMarkAllRead = useCallback(async () => {
@@ -54,16 +62,23 @@ export function NotificationBell({ limit = 10, viewAllHref, labels, icons, rende
             refetch();
             emitSuccess(labels.markAllRead);
         }
-        catch {
-            emitError(labels.error);
+        catch (err) {
+            void normalizeError(err);
+            if (onMarkAllReadError) {
+                onMarkAllReadError(labels.error);
+            }
+            else {
+                showToast(err instanceof Error ? err.message : labels.error, "error");
+            }
         }
     }, [
-        emitError,
+        onMarkAllReadError,
         emitSuccess,
         labels.error,
         labels.markAllRead,
         markAllRead,
         refetch,
+        showToast,
     ]);
     const handleMarkReadAndClose = useCallback((notification) => {
         if (!notification.isRead)
@@ -81,11 +96,11 @@ export function NotificationBell({ limit = 10, viewAllHref, labels, icons, rende
 }
 function renderBellButton(props) {
     const { hideOnMobile, buttonClassName, labels, unreadCount, handleToggle, isOpen } = props;
-    return (_jsxs(Button, { onClick: handleToggle, className: `${hideOnMobile ? "hidden md:flex" : "flex"} p-2.5 md:p-3 rounded-xl transition-colors relative text-zinc-600 hover:bg-zinc-100 hover:text-zinc-900 dark:text-zinc-300 dark:hover:bg-slate-800 dark:hover:text-white ${buttonClassName}`, "aria-label": labels.title, "aria-expanded": isOpen, children: [_jsx("svg", { className: "w-6 h-6 md:w-7 md:h-7", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" }) }), unreadCount > 0 && (_jsx(Span, { size: "xs", weight: "semibold", className: CLS_UNREAD_BADGE, children: unreadCount > 99 ? "99+" : unreadCount }))] }));
+    return (_jsxs(Button, { onClick: handleToggle, rounded: "xl", className: `${hideOnMobile ? "hidden md:flex" : "flex"} p-[0.625rem] md:p-[0.75rem] transition-colors relative text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-bg)] hover:text-[var(--appkit-color-text)] ${buttonClassName}`, "aria-label": labels.title, "aria-expanded": isOpen, children: [_jsx("svg", { className: "w-6 h-6 md:w-7 md:h-7", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" }) }), unreadCount > 0 && (_jsx(Span, { size: "xs", weight: "semibold", className: CLS_UNREAD_BADGE, children: unreadCount > 99 ? "99+" : unreadCount }))] }));
 }
 function renderNotificationDropdown(props) {
     const { dropdownClassName, labels, unreadCount, isMarkingAll, handleMarkAllRead, isLoading, notifications, notificationIcons, handleMarkRead, handleMarkReadAndClose, renderActionLink, viewAllHref, setIsOpen } = props;
-    return (_jsxs(Div, { className: `absolute right-0 top-full mt-2 w-80 sm:w-96 shadow-2xl z-50 ${__O.hidden} ${dropdownClassName}`, rounded: "xl", surface: "default", border: "default", children: [_jsxs(Row, { border: "default", justify: "between", gap: "none", className: "border-b dark:border-slate-800", padding: "inline", children: [_jsxs(Heading, { level: 3, weight: "semibold", color: "primary", children: [labels.title, unreadCount > 0 && _jsxs(Span, { size: "xs", weight: "medium", className: CLS_UNREAD_PILL, children: [unreadCount, " ", labels.unread] })] }), unreadCount > 0 && (_jsx(Button, { onClick: handleMarkAllRead, disabled: isMarkingAll, className: "text-xs text-primary hover:underline font-medium disabled:opacity-50", children: isMarkingAll ? labels.loading : labels.markAllRead }))] }), _jsx(Div, { className: `max-h-96 ${__O.yAuto}`, children: renderNotificationListContent({ isLoading, notifications, notificationIcons, labels, handleMarkRead, handleMarkReadAndClose, renderActionLink }) }), viewAllHref && (_jsx(Div, { border: "default", className: "border-t dark:border-slate-800 text-center", padding: "inline", children: renderActionLink({ href: viewAllHref, onClick: () => setIsOpen(false), className: "text-sm text-primary hover:underline font-medium", children: labels.viewAll }) }))] }));
+    return (_jsxs(Div, { className: `absolute right-0 top-full mt-2 w-80 sm:w-96 z-50 ${__O.hidden} ${dropdownClassName}`, rounded: "xl", surface: "default", border: "default", shadow: "2xl", children: [_jsxs(Row, { border: "default", justify: "between", gap: "none", className: "border-b border-[var(--appkit-color-border)]", padding: "inline", children: [_jsxs(Heading, { level: 3, weight: "semibold", color: "primary", children: [labels.title, unreadCount > 0 && _jsxs(Span, { size: "xs", weight: "medium", className: CLS_UNREAD_PILL, children: [unreadCount, " ", labels.unread] })] }), unreadCount > 0 && (_jsx(Button, { onClick: handleMarkAllRead, disabled: isMarkingAll, textSize: "xs", weight: "medium", className: "text-primary hover:underline disabled:opacity-50", children: isMarkingAll ? labels.loading : labels.markAllRead }))] }), _jsx(Div, { className: `max-h-96 ${__O.yAuto}`, children: renderNotificationListContent({ isLoading, notifications, notificationIcons, labels, handleMarkRead, handleMarkReadAndClose, renderActionLink }) }), viewAllHref && (_jsx(Div, { border: "default", className: "border-t border-[var(--appkit-color-border)] text-center", padding: "inline", children: renderActionLink({ href: viewAllHref, onClick: () => setIsOpen(false), className: "text-sm text-primary hover:underline font-medium", children: labels.viewAll }) }))] }));
 }
 function renderNotificationListContent(props) {
     const { isLoading, notifications, notificationIcons, labels, handleMarkRead, handleMarkReadAndClose, renderActionLink } = props;
@@ -93,5 +108,5 @@ function renderNotificationListContent(props) {
         return _jsx(Row, { align: "center", justify: "center", padding: "y-2xl", children: _jsx(Spinner, { size: "md" }) });
     if (notifications.length === 0)
         return (_jsxs(Stack, { justify: "center", className: "text-center", paddingY: "y-2xl", paddingX: "x-md", align: "center", children: [_jsx("svg", { className: "w-12 h-12 text-zinc-300 dark:text-zinc-600 mb-3", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" }) }), _jsx(Text, { weight: "medium", color: "primary", children: labels.empty }), _jsx(Text, { size: "sm", className: "mt-1", color: "muted", children: labels.emptyDesc })] }));
-    return (_jsx(Ul, { children: notifications.map((notification) => (_jsxs(Li, { className: `group flex items-start gap-3 px-4 py-3 border-b border-zinc-200 dark:border-slate-800 last:border-0 transition-colors hover:bg-zinc-50 dark:hover:bg-slate-900 ${!notification.isRead ? "bg-primary/5 dark:bg-primary/10" : ""}`, children: [_jsx(Span, { size: "xl", className: "flex-shrink-0 mt-0.5", children: notificationIcons[notification.type] ?? "🔔" }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Row, { align: "start", justify: "between", gap: "xs", children: [_jsxs(Text, { size: "sm", className: "leading-tight", color: "primary", weight: "medium", children: [notification.title, !notification.isRead && _jsx(Span, { className: "ml-1.5 inline-block w-2 h-2 bg-primary flex-shrink-0 align-middle", rounded: "full" })] }), _jsx(Span, { size: "xs", className: "flex-shrink-0", color: "muted", children: formatRelativeTime(notification.createdAt) })] }), _jsx(Text, { size: "sm", className: `mt-0.5`, truncate: 2, color: "muted", children: notification.message }), _jsxs(Row, { gap: "3", className: "mt-1.5", children: [notification.actionUrl && renderActionLink({ href: notification.actionUrl, onClick: () => { void handleMarkReadAndClose(notification); }, className: "text-xs text-primary hover:underline font-medium", children: notification.actionLabel ?? labels.viewAction }), !notification.isRead && _jsx(Button, { variant: "ghost", onClick: () => void handleMarkRead(notification.id), className: "text-xs text-zinc-500 dark:text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 hover:underline p-0 h-auto", children: labels.markRead })] })] })] }, notification.id))) }));
+    return (_jsx(Ul, { children: notifications.map((notification) => (_jsxs(Li, { layout: "flex-start", gap: "3", padding: "inline", className: `group border-b border-[var(--appkit-color-border)] last:border-0 transition-colors hover:bg-[var(--appkit-color-bg)] dark:hover:bg-[var(--appkit-color-surface-elevated)] ${!notification.isRead ? "bg-primary/5 dark:bg-primary/10" : ""}`, children: [_jsx(Span, { size: "xl", className: "flex-shrink-0 mt-0.5", children: notificationIcons[notification.type] ?? "🔔" }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Row, { align: "start", justify: "between", gap: "xs", children: [_jsxs(Text, { size: "sm", className: "leading-tight", color: "primary", weight: "medium", children: [notification.title, !notification.isRead && _jsx(Span, { className: "ml-1.5 inline-block w-2 h-2 bg-primary flex-shrink-0 align-middle", rounded: "full" })] }), _jsx(Span, { size: "xs", className: "flex-shrink-0", color: "muted", children: formatRelativeTime(notification.createdAt) })] }), _jsx(Text, { size: "sm", className: `mt-0.5`, truncate: 2, color: "muted", children: notification.message }), _jsxs(Row, { gap: "3", className: "mt-1.5", children: [notification.actionUrl && renderActionLink({ href: notification.actionUrl, onClick: () => { void handleMarkReadAndClose(notification); }, className: "text-xs text-primary hover:underline font-medium", children: notification.actionLabel ?? labels.viewAction }), !notification.isRead && _jsx(Button, { variant: "ghost", onClick: () => void handleMarkRead(notification.id), className: "text-xs text-zinc-500 dark:text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 hover:underline p-0 h-auto", children: labels.markRead })] })] })] }, notification.id))) }));
 }

package/dist/features/account/components/NotificationPreferencesPanel.js

@@ -56,7 +56,7 @@ export function NotificationPreferencesPanel({ fetchUrl = "/api/user/notificatio
             if (prefs?.types)
                 setTypes((prev) => ({ ...prev, ...prefs.types }));
         })
-            .catch(() => { })
+            .catch(console.error)
             .finally(() => setLoading(false));
     }, [fetchUrl]);
     const setChannel = useCallback((key, val) => {
@@ -101,5 +101,5 @@ export function NotificationPreferencesPanel({ fetchUrl = "/api/user/notificatio
     const whatsappAdminEnabled = adminChannels?.whatsapp?.enabled ?? false;
     const smsAdminEnabled = adminChannels?.sms?.enabled ?? false;
     const anyChannelEnabled = emailAdminEnabled || whatsappAdminEnabled || smsAdminEnabled;
-    return (_jsxs(Stack, { gap: "lg", children: [_jsx(SectionCard, { title: "In-app notifications", children: _jsxs(Row, { align: "center", justify: "between", gap: "md", padding: "y-sm", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text)]", size: "sm", weight: "medium", children: "In-app notifications" }), _jsx(Text, { variant: "secondary", className: "mt-0.5", size: "xs", children: "Always on \u2014 displayed in the notification bell and inbox" })] }), _jsx(Row, { className: "h-5 w-9 bg-[var(--appkit-color-primary)] px-0.5", align: "center", justify: "end", rounded: "full", "aria-label": "Always on", children: _jsx(Span, { className: "h-4 w-4 shadow", rounded: "full", surface: "default" }) })] }) }), anyChannelEnabled && (_jsxs(SectionCard, { title: "Notification channels", children: [emailAdminEnabled && (_jsx(ToggleRow, { label: "Email", description: "Receive notifications by email", checked: channels.email !== false, onChange: (v) => setChannel("email", v) })), whatsappAdminEnabled && (_jsx(ToggleRow, { label: "WhatsApp", description: "Receive notifications on WhatsApp", checked: channels.whatsapp !== false, onChange: (v) => setChannel("whatsapp", v) })), smsAdminEnabled && (_jsx(ToggleRow, { label: "SMS", description: "Receive SMS text notifications", checked: channels.sms !== false, onChange: (v) => setChannel("sms", v) }))] })), _jsx(SectionCard, { title: "Notification types", children: TYPE_ROWS.map((row) => (_jsx(ToggleRow, { label: row.label, description: row.description, checked: types[row.key] !== false, onChange: (v) => setType(row.key, v) }, row.key))) }), _jsxs(Row, { justify: "end", gap: "sm", children: [saved && (_jsx(Text, { className: "text-[var(--appkit-color-success)] self-center", size: "sm", children: "Preferences saved \u2713" })), _jsx(Button, { onClick: handleSave, isLoading: saving, size: "sm", children: "Save preferences" })] })] }));
+    return (_jsxs(Stack, { gap: "lg", children: [_jsx(SectionCard, { title: "In-app notifications", children: _jsxs(Row, { align: "center", justify: "between", gap: "md", padding: "y-sm", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text)]", size: "sm", weight: "medium", children: "In-app notifications" }), _jsx(Text, { variant: "secondary", className: "mt-0.5", size: "xs", children: "Always on \u2014 displayed in the notification bell and inbox" })] }), _jsx(Row, { className: "h-5 w-9 bg-[var(--appkit-color-primary)] px-[0.125rem]", align: "center", justify: "end", rounded: "full", "aria-label": "Always on", children: _jsx(Span, { className: "h-4 w-4", rounded: "full", surface: "default", shadow: "default" }) })] }) }), anyChannelEnabled && (_jsxs(SectionCard, { title: "Notification channels", children: [emailAdminEnabled && (_jsx(ToggleRow, { label: "Email", description: "Receive notifications by email", checked: channels.email !== false, onChange: (v) => setChannel("email", v) })), whatsappAdminEnabled && (_jsx(ToggleRow, { label: "WhatsApp", description: "Receive notifications on WhatsApp", checked: channels.whatsapp !== false, onChange: (v) => setChannel("whatsapp", v) })), smsAdminEnabled && (_jsx(ToggleRow, { label: "SMS", description: "Receive SMS text notifications", checked: channels.sms !== false, onChange: (v) => setChannel("sms", v) }))] })), _jsx(SectionCard, { title: "Notification types", children: TYPE_ROWS.map((row) => (_jsx(ToggleRow, { label: row.label, description: row.description, checked: types[row.key] !== false, onChange: (v) => setType(row.key, v) }, row.key))) }), _jsxs(Row, { justify: "end", gap: "sm", children: [saved && (_jsx(Text, { className: "text-[var(--appkit-color-success)] self-center", size: "sm", children: "Preferences saved \u2713" })), _jsx(Button, { onClick: handleSave, isLoading: saving, size: "sm", children: "Save preferences" })] })] }));
 }

package/dist/features/account/components/UserOffersPanel.js

@@ -83,6 +83,7 @@ export function UserOffersPanel({ fetchEndpoint = "/api/user/offers", onAcceptCo
             setOffers(items);
         }
         catch (err) {
+            // toast-intentionally-silent: data load, error surfaced via fetchError state
             void normalizeError(err);
             setFetchError(err instanceof Error ? err.message : "Failed to load offers.");
         }

package/dist/features/account/components/UserSidebar.js

@@ -77,12 +77,7 @@ export function UserSidebar({ items, groups, mobileOpen = false, onCloseMobile,
     // ── Persistent sidebar variant (desktop left slide-over, mobile bottom-sheet) ──────
     if (variant === "sidebar") {
         const handleToggle = onToggle ?? close;
-        return (_jsxs(_Fragment, { children: [desktopOpen && (_jsx(Div, { surface: "overlay-xs", className: "hidden md:block fixed inset-0 backdrop-blur-[2px] z-30", onClick: handleToggle, "aria-hidden": "true" })), _jsxs(Div, { className: "hidden md:flex fixed left-0 z-40 transition-transform duration-300", style: {
-                        top: "var(--header-height, 3.5rem)",
-                        height: "calc(100vh - var(--header-height, 3.5rem))",
-                        width: "13rem",
-                        transform: desktopOpen ? "translateX(0)" : "translateX(calc(-100% + 1.25rem))",
-                    }, children: [_jsxs(Stack, { border: "default", surface: "default", className: `flex-1 border-r dark:border-slate-800 ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "My Account" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: _jsx(DrawerContent, { groups: groups, items: items, activeHref: pathname }) })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle })] }), _jsx(Div, { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "My Account", children: _jsx(DrawerContent, { groups: groups, items: items, activeHref: pathname, onItemClick: close }) }) })] }));
+        return (_jsxs(_Fragment, { children: [desktopOpen && (_jsx(Div, { surface: "overlay-xs", className: "hidden md:block fixed inset-0 backdrop-blur-[2px] z-30", onClick: handleToggle, "aria-hidden": "true" })), _jsxs(Div, { className: `hidden md:flex fixed left-0 z-40 transition-transform duration-300 top-[var(--header-height,3.5rem)] h-[calc(100vh-var(--header-height,3.5rem))] w-[13rem] ${desktopOpen ? "translate-x-0" : "-translate-x-[calc(100%-1.25rem)]"}`, children: [_jsxs(Stack, { border: "default", surface: "default", className: `flex-1 border-r dark:border-[var(--appkit-color-border)] ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "My Account" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: _jsx(DrawerContent, { groups: groups, items: items, activeHref: pathname }) })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle })] }), _jsx(Div, { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "My Account", children: _jsx(DrawerContent, { groups: groups, items: items, activeHref: pathname, onItemClick: close }) }) })] }));
     }
     // ── Overlay variant (default) — portal on desktop, bottom-sheet on mobile ─
     const content = (_jsx(DrawerContent, { groups: groups, items: items, activeHref: pathname, onItemClick: close }));

package/dist/features/account/components/UserSupportView.js

@@ -106,7 +106,7 @@ export function UserSupportView(_props) {
 }
 function renderTicketListArea(props) {
     const { isLoading, error, tickets, setSelectedTicket, setDetailOpen } = props;
-    return (_jsxs(_Fragment, { children: [isLoading && (_jsx(Stack, { gap: "3", children: [1, 2, 3].map((i) => _jsx(Div, { className: "h-16 animate-pulse", surface: "subtle", rounded: "lg" }, i)) })), error && (_jsx(Div, { textSize: "sm", className: "border border-error/20", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: "Failed to load support tickets." })), !isLoading && tickets.length === 0 && (_jsx(Div, { className: "text-center", surface: "muted", paddingY: "y-2xl", paddingX: "x-lg", rounded: "xl", border: "default", children: _jsx(Text, { size: "sm", color: "muted", children: "You haven't opened any support tickets yet." }) })), _jsx(Ul, { spacing: "loose", children: tickets.map((ticket) => (_jsx(Li, { children: _jsx(Button, { rounded: "xl", variant: "ghost", type: "button", className: "w-full border border-zinc-200 bg-white p-4 text-left shadow-sm hover:border-primary-300 transition-colors dark:border-zinc-700 dark:bg-zinc-900", onClick: () => { setSelectedTicket(ticket); setDetailOpen(true); }, children: _jsxs(Row, { align: "start", justify: "between", gap: "sm", children: [_jsxs(Div, { className: "min-w-0 flex-1", children: [_jsx(Text, { className: "truncate", color: "primary", weight: "medium", children: ticket.subject }), _jsxs(Text, { size: "xs", color: "muted", children: [ticket.category.replace(/_/g, " "), ticket.orderId ? ` · Order: ${ticket.orderId}` : ""] })] }), _jsx(Span, { size: "xs", weight: "medium", className: `shrink-0 inline-flex ${STATUS_BADGE[ticket.status] ?? STATUS_BADGE.open}`, padding: "pill-sm", rounded: "full", children: ticket.status.replace(/_/g, " ") })] }) }) }, ticket.id))) })] }));
+    return (_jsxs(_Fragment, { children: [isLoading && (_jsx(Stack, { gap: "3", children: [1, 2, 3].map((i) => _jsx(Div, { className: "h-16 animate-pulse", surface: "subtle", rounded: "lg" }, i)) })), error && (_jsx(Div, { textSize: "sm", className: "border border-error/20", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: "Failed to load support tickets." })), !isLoading && tickets.length === 0 && (_jsx(Div, { className: "text-center", surface: "muted", paddingY: "y-2xl", paddingX: "x-lg", rounded: "xl", border: "default", children: _jsx(Text, { size: "sm", color: "muted", children: "You haven't opened any support tickets yet." }) })), _jsx(Ul, { spacing: "loose", children: tickets.map((ticket) => (_jsx(Li, { children: _jsx(Button, { rounded: "xl", variant: "ghost", type: "button", shadow: "sm", border: "default", paddingX: "md", paddingY: "md", className: "w-full bg-[var(--appkit-color-surface)] text-left hover:border-[var(--appkit-color-primary-300)] transition-colors", onClick: () => { setSelectedTicket(ticket); setDetailOpen(true); }, children: _jsxs(Row, { align: "start", justify: "between", gap: "sm", children: [_jsxs(Div, { className: "min-w-0 flex-1", children: [_jsx(Text, { className: "truncate", color: "primary", weight: "medium", children: ticket.subject }), _jsxs(Text, { size: "xs", color: "muted", children: [ticket.category.replace(/_/g, " "), ticket.orderId ? ` · Order: ${ticket.orderId}` : ""] })] }), _jsx(Span, { size: "xs", weight: "medium", className: `shrink-0 inline-flex ${STATUS_BADGE[ticket.status] ?? STATUS_BADGE.open}`, padding: "pill-sm", rounded: "full", children: ticket.status.replace(/_/g, " ") })] }) }) }, ticket.id))) })] }));
 }
 function renderNewTicketDrawer(props) {
     const { newTicketOpen, setNewTicketOpen, newCategory, setNewCategory, newSubject, setNewSubject, newOrderId, setNewOrderId, newDescription, setNewDescription, createMutation } = props;

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

@@ -3,7 +3,7 @@ import { BarChart2 } from "lucide-react";
 import { Alert, Div, Heading, Li, Row, Section, Span, Stack, Text, Ul } from "../../../ui";
 import { GC } from "../../_guide-cls";
 export function AdminAnalyticsGuideView() {
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", align: "center", justify: "center", rounded: "xl", style: { background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)" }, children: _jsx(BarChart2, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Analytics" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Revenue, order funnel, product performance, and store metrics on LetItRip." })] }), [
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(BarChart2, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Analytics" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Revenue, order funnel, product performance, and store metrics on LetItRip." })] }), [
                 {
                     title: "Revenue Dashboard",
                     content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "GMV (Gross Merchandise Value)" }), ": Total order subtotals across all stores. Does not deduct platform commission or refunds."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Net Revenue" }), ": GMV \u00D7 platformFee \u2014 refunded orders excluded."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Period filter" }), ": Last 7 / 30 / 90 days, or custom date range. All monetary values shown in INR."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Payout total" }), ": Total disbursed to sellers in the same period. Revenue - Payout = Platform earnings."] })] })),
@@ -20,5 +20,5 @@ export function AdminAnalyticsGuideView() {
                     title: "Store-Level Metrics",
                     content: (_jsxs(_Fragment, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] mb-3", size: "sm", children: "Filter analytics by store to see individual seller performance. Available metrics:" }), _jsxs(Ul, { className: "list-inside text-[var(--appkit-color-text-muted)]", marker: "disc", spacing: "tight", size: "sm", children: [_jsx(Li, { children: "Total orders and completion rate" }), _jsx(Li, { children: "Average order value" }), _jsx(Li, { children: "Return and refund rate" }), _jsx(Li, { children: "Average seller rating" }), _jsx(Li, { children: "Payout history" })] }), _jsx(Alert, { variant: "info", className: "mt-4", children: "Store analytics are visible to the store owner in their seller dashboard. Admin sees the full platform view. Do not share a specific store's metrics with other stores." })] })),
                 },
-            ].map(({ title, content }) => (_jsxs(Section, { className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(BarChart2, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
+            ].map(({ title, content }) => (_jsxs(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(BarChart2, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
 }

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

@@ -200,6 +200,6 @@ export function AdminBlogEditorView({ postId, onSaved, onDeleted, embedded, ...r
     }
     const previewSection = (_jsxs("div", { className: "rounded-lg border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-raised)] p-5 max-h-[calc(100vh-12rem)] overflow-y-auto", children: [_jsx(Row, { textSize: "xs", textWeight: "semibold", color: "muted", className: "mb-3 uppercase tracking-wide", align: "center", gap: "sm", children: _jsx(Span, { children: "Live preview" }) }), draft.coverImage ? (_jsx("img", { src: draft.coverImage, alt: "", className: "w-full rounded-md mb-4 object-cover max-h-64" })) : null, _jsx(Heading, { level: 1, className: "mb-1", size: "2xl", weight: "bold", children: draft.title || "Untitled post" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)] mb-4", size: "xs", children: [draft.authorName || "Anonymous", draft.category ? ` · ${draft.category}` : ""] }), draft.excerpt ? (_jsx(Text, { className: "italic text-[var(--appkit-color-text-secondary)] mb-4", children: draft.excerpt })) : null, _jsx(RichTextRenderer, { html: draft.content || "<em>No content yet…</em>" }), draft.tags.length > 0 ? (_jsx(Row, { wrap: true, gap: "xs", className: "mt-6", children: draft.tags.map((t) => (_jsxs(Span, { size: "xs", className: "bg-[var(--appkit-color-surface)] border border-[var(--appkit-color-border)]", rounded: "full", padding: "pill-xs", children: ["#", t] }, t))) })) : null] }, "preview"));
     return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: isEdit ? "Edit Post" : "New Blog Post", sections: [
-            _jsxs(Div, { className: "lg:grid lg:grid-cols-[3fr_2fr] lg:gap-6", children: [_jsx(Div, { children: formContent }), _jsx(Div, { className: "mt-6 lg:mt-0 lg:sticky lg:top-4 lg:self-start", children: previewSection })] }, "split"),
+            _jsxs(Div, { className: "lg:grid lg:grid-cols-[3fr_2fr] lg:gap-[1.5rem]", children: [_jsx(Div, { children: formContent }), _jsx(Div, { className: "mt-6 lg:mt-0 lg:sticky lg:top-4 lg:self-start", children: previewSection })] }, "split"),
         ] }));
 }

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

@@ -98,7 +98,7 @@ export function AdminBundlesView({ getEditHref, newHref }) {
             return parts.join(",") || undefined;
         },
         getRowHref: getEditHref,
-        toolbarExtra: (_jsx(Button, { asChild: true, size: "sm", variant: "primary", children: _jsxs(TextLink, { href: newHref, className: "flex items-center gap-1.5", children: ["+ ", BUNDLE_COPY.adminList.newButton] }) })),
+        toolbarExtra: (_jsx(Button, { asChild: true, size: "sm", variant: "primary", children: _jsxs(TextLink, { href: newHref, layout: "flex", align: "center", gap: "xs", children: ["+ ", BUNDLE_COPY.adminList.newButton] }) })),
         buildBulkActions: (selection) => [
             buildBulkAction(ACTIONS.ADMIN["activate-bundle"], async () => {
                 await Promise.all(selection.selectedIds.map((id) => fetch(ADMIN_ENDPOINTS.BUNDLE_BY_ID(id), {

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

@@ -67,7 +67,7 @@ const TEXT_ALIGN_OPTIONS = [
 // ── Zone Picker ──────────────────────────────────────────────────────────────
 function ZonePicker({ selected, onChange, disabled, }) {
     const zones = [1, 2, 3, 4, 5, 6];
-    return (_jsxs(Div, { children: [_jsx(Text, { className: "mb-1", color: "muted", size: "xs", children: "Zone (row \u00D7 col grid)" }), _jsx("div", { className: "grid gap-1", style: { gridTemplateRows: "repeat(2, 1fr)", gridTemplateColumns: "repeat(3, 1fr)", width: 150 }, children: zones.map((z) => {
+    return (_jsxs(Div, { children: [_jsx(Text, { className: "mb-1", color: "muted", size: "xs", children: "Zone (row \u00D7 col grid)" }), _jsx(Div, { layout: "grid", gap: "1", className: "grid-rows-2 grid-cols-3 w-[150px]", children: zones.map((z) => {
                     const isDisabled = disabled?.(z) ?? false;
                     return (_jsx("button", { type: "button", disabled: isDisabled, onClick: () => !isDisabled && onChange(z), className: `rounded text-xs font-mono py-2 border transition-colors ${selected === z
                             ? "bg-primary text-white border-primary"

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

@@ -4,7 +4,7 @@ import { Alert, Code, Div, Heading, Li, Row, Section, Span, Stack, Text, Ul } fr
 import { GC } from "../../_guide-cls";
 const CLS_CODE = "text-xs bg-amber-100 dark:bg-amber-900/30 px-1 rounded";
 export function AdminCatalogGuideView() {
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", align: "center", justify: "center", rounded: "xl", style: { background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)" }, children: _jsx(Package, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Catalog" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Products, categories, brands, and reviews \u2014 how the LetItRip catalog is structured and managed." })] }), [
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(Package, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Catalog" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Products, categories, brands, and reviews \u2014 how the LetItRip catalog is structured and managed." })] }), [
                 {
                     Icon: Package, title: "Product Management",
                     content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Listing types" }), ": ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "standard" }), " (prefix ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "product-" }), "), ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "auction" }), " (prefix ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "auction-" }), "), ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "pre-order" }), " (prefix ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "preorder-" }), ")."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Admin vs store creation" }), ": Admins can create products on behalf of any store via the store picker in AdminProductEditorView."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Status lifecycle" }), ": DRAFT \u2192 PUBLISHED \u2192 ARCHIVED. Published products appear in search. Archived products are hidden but not deleted."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "J13 rule" }), ": Always use ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "listingType" }), " field \u2014 the legacy ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "isAuction" }), "/", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "isPreOrder" }), " booleans have been removed. All queries use ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "where(\"listingType\", \"==\", x)" }), "."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Media URLs" }), ": Never write raw Firebase Storage URLs to Firestore. All product image URLs must use the ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "/api/media/[slug]" }), " proxy format."] })] })),
@@ -25,5 +25,5 @@ export function AdminCatalogGuideView() {
                     Icon: AlertTriangle, title: "Common Admin Mistakes",
                     content: (_jsx(Alert, { variant: "warning", children: _jsxs(Ul, { spacing: "tight", size: "sm", children: [_jsx(Li, { children: "\u2717 Publishing a product with no images \u2014 buyers cannot evaluate it." }), _jsxs(Li, { children: ["\u2717 Creating a subcategory without setting ", _jsx(Code, { className: CLS_CODE, children: "rootId" }), " \u2014 category tree breaks."] }), _jsxs(Li, { children: ["\u2717 Setting ", _jsx(Code, { className: CLS_CODE, children: "parentId" }), " of a root category to anything other than ", _jsx(Code, { className: CLS_CODE, children: "null" }), " \u2014 creates circular hierarchy."] }), _jsx(Li, { children: "\u2717 Duplicating brand slugs \u2014 Firestore document ID collision, second write silently overwrites the first." }), _jsx(Li, { children: "\u2717 Writing raw Firebase Storage URLs to Firestore \u2014 breaks the media watermark proxy and CDN caching." })] }) })),
                 },
-            ].map(({ Icon, title, content }) => (_jsxs(Section, { className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
+            ].map(({ Icon, title, content }) => (_jsxs(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
 }

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

@@ -3,7 +3,7 @@ import { FileText, Calendar, BookOpen, Layout, Grid, Megaphone, Mail } from "luc
 import { Alert, Code, Div, Heading, Li, Row, Section, Span, Stack, Text, Ul } from "../../../ui";
 import { GC } from "../../_guide-cls";
 export function AdminContentGuideView() {
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", align: "center", justify: "center", rounded: "xl", style: { background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)" }, children: _jsx(FileText, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Content & Marketing" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Blog posts, events, FAQs, carousel, homepage sections, ads, and newsletter on LetItRip." })] }), [
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(FileText, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Content & Marketing" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Blog posts, events, FAQs, carousel, homepage sections, ads, and newsletter on LetItRip." })] }), [
                 {
                     Icon: FileText, title: "Blog Posts",
                     content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Statuses" }), ": ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "draft" }), " (not public), ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "published" }), " (live, indexed)."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "readTimeMinutes" }), ": Auto-calculated from content word count (200 wpm). Override manually if the post has heavy media."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "youtubeId" }), ": Optional embedded YouTube video. Use only the video ID (e.g. ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "dQw4w9WgXcQ" }), "), not the full URL."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Media in body" }), ": All images in rich text must use the ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "/api/media/" }), " proxy URL, not raw Firebase Storage links."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "isFeatured" }), ": Sets the post as featured in the blog listing. Different from the homepage featured section \u2014 that is driven by a separate ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "homepageSections" }), " config."] })] })),
@@ -32,5 +32,5 @@ export function AdminContentGuideView() {
                     Icon: Mail, title: "Newsletter",
                     content: (_jsxs(_Fragment, { children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)] mb-3", size: "sm", children: ["Subscribers are stored in the ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "newsletter" }), " collection. The admin panel supports subscriber export and campaign send."] }), _jsx(Alert, { variant: "warning", children: "Legal obligation: every email sent must include a working unsubscribe link. Under the Indian IT Act and CAN-SPAM, unsubscribe requests must be honoured within 10 business days. Never send to unsubscribed addresses. All newsletter exports are de-identified by default." })] })),
                 },
-            ].map(({ Icon, title, content }) => (_jsxs(Section, { className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
+            ].map(({ Icon, title, content }) => (_jsxs(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
 }

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

@@ -79,7 +79,7 @@ function PermissionDomainsPanel({ permissions, togglePerm }) {
                     if (domainPerms.length === 0)
                         return null;
                     const checked = domainPerms.filter((p) => permissions.has(p)).length;
-                    return (_jsxs(Details, { className: "group", children: [_jsxs(Summary, { className: "flex cursor-pointer items-center justify-between px-3 py-2 font-semibold uppercase tracking-wide text-zinc-600 dark:text-zinc-400 select-none hover:bg-zinc-50 dark:hover:bg-slate-800 transition-colors", children: [_jsx(Span, { size: "xs", children: domain.label }), _jsxs(Span, { size: "xs", weight: "normal", className: "normal-case", color: "faint", children: [checked, "/", domainPerms.length] })] }), _jsx(Div, { layout: "grid", paddingY: "y-xs-tall", className: "grid-cols-2 gap-x-2 gap-y-1.5", surface: "muted", padding: "x-sm", children: domainPerms.map((perm) => (_jsxs("label", { className: "flex items-center gap-2 cursor-pointer text-xs text-zinc-700 dark:text-zinc-300", children: [_jsx("input", { type: "checkbox", checked: permissions.has(perm), onChange: () => togglePerm(perm), className: "h-3.5 w-3.5 rounded border-zinc-300 dark:border-slate-600 accent-primary" }), formatPermLabel(perm)] }, perm))) })] }, domain.prefix));
+                    return (_jsxs(Details, { className: "group", children: [_jsxs(Summary, { paddingX: "x-sm", paddingY: "y-xs", weight: "semibold", color: "muted", layout: "flex", align: "center", justify: "between", className: "uppercase tracking-wide hover:bg-[var(--appkit-color-bg)] transition-colors", children: [_jsx(Span, { size: "xs", children: domain.label }), _jsxs(Span, { size: "xs", weight: "normal", className: "normal-case", color: "faint", children: [checked, "/", domainPerms.length] })] }), _jsx(Div, { layout: "grid", paddingY: "y-xs-tall", className: "grid-cols-2 gap-x-2 gap-y-1.5", surface: "muted", padding: "x-sm", children: domainPerms.map((perm) => (_jsxs("label", { className: "flex items-center gap-2 cursor-pointer text-xs text-zinc-700 dark:text-zinc-300", children: [_jsx("input", { type: "checkbox", checked: permissions.has(perm), onChange: () => togglePerm(perm), className: "h-3.5 w-3.5 rounded border-zinc-300 dark:border-slate-600 accent-primary" }), formatPermLabel(perm)] }, perm))) })] }, domain.prefix));
                 }) })] }));
 }
 // --- Component ---------------------------------------------------------------
@@ -171,5 +171,5 @@ export function AdminEmployeeEditorView({ open, onClose, mode, userId, displayNa
         else
             updateMutation.mutate();
     };
-    return (_jsxs(_Fragment, { children: [_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: mode === "invite" ? "Invite Employee" : `Edit — ${displayName ?? "Employee"}`, children: _jsxs(Form, { onSubmit: handleSubmit, className: "flex flex-col gap-5", padding: "md", children: [mode === "invite" && (_jsxs(Stack, { gap: "xs", className: "", children: [_jsx(Label, { size: "sm", weight: "medium", color: "primary", children: "Email address" }), _jsx("input", { type: "email", required: true, value: email, onChange: (e) => setEmail(e.target.value), placeholder: "employee@example.com", className: "rounded-lg border border-zinc-300 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary/60 transition" })] })), _jsxs(Stack, { gap: "xs", className: "", children: [_jsx(Label, { size: "sm", weight: "medium", color: "primary", children: "Permission group" }), _jsx(Select, { value: group, onChange: (e) => applyGroupPreset(e.target.value), options: GROUP_OPTIONS }), _jsx(Text, { size: "xs", color: "muted", children: "Selecting a group auto-fills the permissions below. You can still customise individual permissions." })] }), _jsx(PermissionDomainsPanel, { permissions: permissions, togglePerm: togglePerm }), _jsxs(FormActions, { children: [_jsx(Button, { type: "submit", variant: "primary", disabled: isBusy, isLoading: isBusy, children: mode === "invite" ? "Send Invite" : "Save" }), mode === "edit" && userId && (_jsx(Button, { type: "button", variant: "danger", disabled: isBusy, onClick: () => setRevokeOpen(true), children: "Revoke Access" }))] })] }) }), mode === "edit" && (_jsx(ConfirmDeleteModal, { isOpen: revokeOpen, onClose: () => setRevokeOpen(false), onConfirm: () => revokeMutation.mutate(), isDeleting: revokeMutation.isPending, title: "Revoke employee access?", message: `${displayName ?? "This employee"} will lose admin panel access immediately. Their user account remains active — only their role is reset to user.`, confirmText: "Revoke Access", variant: "danger" }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: mode === "invite" ? "Invite Employee" : `Edit — ${displayName ?? "Employee"}`, children: _jsxs(Form, { onSubmit: handleSubmit, spacing: "lg", padding: "md", children: [mode === "invite" && (_jsxs(Stack, { gap: "xs", className: "", children: [_jsx(Label, { size: "sm", weight: "medium", color: "primary", children: "Email address" }), _jsx("input", { type: "email", required: true, value: email, onChange: (e) => setEmail(e.target.value), placeholder: "employee@example.com", className: "rounded-lg border border-zinc-300 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary/60 transition" })] })), _jsxs(Stack, { gap: "xs", className: "", children: [_jsx(Label, { size: "sm", weight: "medium", color: "primary", children: "Permission group" }), _jsx(Select, { value: group, onChange: (e) => applyGroupPreset(e.target.value), options: GROUP_OPTIONS }), _jsx(Text, { size: "xs", color: "muted", children: "Selecting a group auto-fills the permissions below. You can still customise individual permissions." })] }), _jsx(PermissionDomainsPanel, { permissions: permissions, togglePerm: togglePerm }), _jsxs(FormActions, { children: [_jsx(Button, { type: "submit", variant: "primary", disabled: isBusy, isLoading: isBusy, children: mode === "invite" ? "Send Invite" : "Save" }), mode === "edit" && userId && (_jsx(Button, { type: "button", variant: "danger", disabled: isBusy, onClick: () => setRevokeOpen(true), children: "Revoke Access" }))] })] }) }), mode === "edit" && (_jsx(ConfirmDeleteModal, { isOpen: revokeOpen, onClose: () => setRevokeOpen(false), onConfirm: () => revokeMutation.mutate(), isDeleting: revokeMutation.isPending, title: "Revoke employee access?", message: `${displayName ?? "This employee"} will lose admin panel access immediately. Their user account remains active — only their role is reset to user.`, confirmText: "Revoke Access", variant: "danger" }))] }));
 }

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

@@ -74,9 +74,5 @@ export function AdminGuideHubView({ permissions = [], isFullAdmin = false }) {
     const hasPermission = (perm) => isFullAdmin || permissions.includes(perm);
     const visibleCards = GUIDE_CARDS.filter((c) => hasPermission(c.permission));
     const hasAny = visibleCards.length > 0;
-    return (_jsxs(Stack, { gap: "xl", padding: "b-2xl", children: [_jsx(Section, { className: "overflow-hidden border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", shadow: "sm", children: _jsxs(Div, { paddingX: "x-md-xl", paddingY: "y-xl", style: {
-                        background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 60%,var(--appkit-color-secondary-400) 100%)",
-                    }, children: [_jsxs(Row, { className: "mb-3", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", surface: "default", align: "center", justify: "center", rounded: "xl", children: _jsx(BookOpen, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { color: "inverse", className: "/80 tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin & Employee Guide" })] }), _jsx(Heading, { color: "inverse", level: 1, className: "mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "LetItRip Internal Guide" }), _jsx(Text, { color: "inverse", className: "/80", size: "base", children: "Everything you need to operate and manage LetItRip \u2014 India's largest collectibles marketplace." })] }) }), _jsx(Alert, { variant: "info", compact: true, children: "These guides describe expected platform behaviour. Real access to each section is enforced independently by the permission system \u2014 this page is reference only." }), !hasAny && (_jsx(Alert, { variant: "info", title: "Limited access", children: "Your permission set doesn't include read access to any admin sections yet. Contact your admin to request the permissions you need." })), hasAny && (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)] mb-4", size: "lg", weight: "semibold", children: "Guides" }), _jsx(Div, { layout: "grid", gap: "4", className: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", children: visibleCards.map(({ Icon, title, description, href }) => (_jsxs("a", { href: href, className: "group flex flex-col gap-3 rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] p-5 hover:border-[var(--appkit-color-primary)] hover:shadow-md transition-all", children: [_jsxs(Row, { align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-9 h-9", align: "center", justify: "center", rounded: "lg", style: {
-                                                background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)",
-                                            }, children: _jsx(Icon, { className: "w-4 h-4 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text)] group-hover:text-[var(--appkit-color-primary)] transition-colors", weight: "semibold", children: title })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] leading-relaxed", size: "sm", children: description }), _jsx(Text, { className: "text-[var(--appkit-color-primary)] mt-auto", size: "xs", weight: "medium", children: "Read guide \u2192" })] }, title))) })] })), _jsx(Section, { className: CLS_WARN_PANEL, children: _jsxs(Row, { align: "start", gap: "3", children: [_jsx(AlertTriangle, { className: "w-5 h-5 text-warning flex-shrink-0 mt-0.5" }), _jsxs(Div, { children: [_jsx(Text, { className: CLS_WARN_HEAD, children: "Remember: with great access comes responsibility" }), _jsx(Text, { className: CLS_WARN_BODY, children: "Admin actions are logged. Never access user PII (email, phone) without a legitimate support reason. Never grant capabilities or permissions without documented approval. When in doubt, escalate to a senior admin." })] })] }) })] }));
+    return (_jsxs(Stack, { gap: "xl", padding: "b-2xl", children: [_jsx(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", shadow: "sm", children: _jsxs(Div, { paddingX: "x-md-xl", paddingY: "y-xl", className: "[background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_60%,var(--appkit-color-secondary-400)_100%)]", children: [_jsxs(Row, { className: "mb-3", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", surface: "default", align: "center", justify: "center", rounded: "xl", children: _jsx(BookOpen, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { color: "inverse", className: "/80 tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin & Employee Guide" })] }), _jsx(Heading, { color: "inverse", level: 1, className: "mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "LetItRip Internal Guide" }), _jsx(Text, { color: "inverse", className: "/80", size: "base", children: "Everything you need to operate and manage LetItRip \u2014 India's largest collectibles marketplace." })] }) }), _jsx(Alert, { variant: "info", compact: true, children: "These guides describe expected platform behaviour. Real access to each section is enforced independently by the permission system \u2014 this page is reference only." }), !hasAny && (_jsx(Alert, { variant: "info", title: "Limited access", children: "Your permission set doesn't include read access to any admin sections yet. Contact your admin to request the permissions you need." })), hasAny && (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)] mb-4", size: "lg", weight: "semibold", children: "Guides" }), _jsx(Div, { layout: "grid", gap: "4", className: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", children: visibleCards.map(({ Icon, title, description, href }) => (_jsxs("a", { href: href, className: "group flex flex-col gap-3 rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] p-5 hover:border-[var(--appkit-color-primary)] hover:shadow-md transition-all", children: [_jsxs(Row, { align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-9 h-9 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "lg", children: _jsx(Icon, { className: "w-4 h-4 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text)] group-hover:text-[var(--appkit-color-primary)] transition-colors", weight: "semibold", children: title })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] leading-relaxed", size: "sm", children: description }), _jsx(Text, { className: "text-[var(--appkit-color-primary)] mt-auto", size: "xs", weight: "medium", children: "Read guide \u2192" })] }, title))) })] })), _jsx(Section, { className: CLS_WARN_PANEL, children: _jsxs(Row, { align: "start", gap: "3", children: [_jsx(AlertTriangle, { className: "w-5 h-5 text-warning flex-shrink-0 mt-0.5" }), _jsxs(Div, { children: [_jsx(Text, { className: CLS_WARN_HEAD, children: "Remember: with great access comes responsibility" }), _jsx(Text, { className: CLS_WARN_BODY, children: "Admin actions are logged. Never access user PII (email, phone) without a legitimate support reason. Never grant capabilities or permissions without documented approval. When in doubt, escalate to a senior admin." })] })] }) })] }));
 }

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

@@ -67,7 +67,7 @@ function MediaBrowser({ onCopy }) {
                         const isImage = (f.contentType ?? "").startsWith("image/");
                         return (_jsxs(Div, { className: "group overflow-hidden", surface: "muted", rounded: "lg", border: "default", children: [_jsx(Row, { color: "muted", textSize: "xs", className: "aspect-square", surface: "subtle", align: "center", justify: "center", children: isImage ? (
                                     // eslint-disable-next-line @next/next/no-img-element
-                                    _jsx("img", { src: f.downloadURL, alt: f.name, className: "h-full w-full object-cover", loading: "lazy" })) : (_jsx(Text, { align: "center", className: "px-2 break-all", children: f.contentType ?? "file" })) }), _jsxs(Div, { className: "p-1.5", children: [_jsx(Text, { className: "truncate text-[10px] font-mono", color: "muted", children: f.name.split("/").pop() }), _jsx(Button, { type: "button", variant: "ghost", textSize: "xs", className: "mt-1 w-full", onClick: () => onCopy(f.downloadURL), children: ACTIONS.MEDIA["copy-url"].label })] })] }, f.name));
+                                    _jsx("img", { src: f.downloadURL, alt: f.name, className: "h-full w-full object-cover", loading: "lazy" })) : (_jsx(Text, { align: "center", paddingX: "x-xs", className: "break-all", children: f.contentType ?? "file" })) }), _jsxs(Div, { className: "p-[0.375rem]", children: [_jsx(Text, { className: "truncate text-[10px] font-mono", color: "muted", children: f.name.split("/").pop() }), _jsx(Button, { type: "button", variant: "ghost", textSize: "xs", className: "mt-1 w-full", onClick: () => onCopy(f.downloadURL), children: ACTIONS.MEDIA["copy-url"].label })] })] }, f.name));
                     }), filtered.length === 0 && !isLoading && (_jsx(Text, { paddingY: "lg", className: "col-span-full", color: "muted", size: "sm", align: "center", children: "No files found." }))] }), _jsxs(Row, { align: "center", justify: "between", children: [_jsxs(Text, { size: "xs", color: "muted", children: [filtered.length, " file(s)", nextPageToken ? " · more available" : ""] }), nextPageToken && (_jsx(Button, { type: "button", variant: "outline", onClick: () => void load(nextPageToken), disabled: isLoading, children: isLoading ? "Loading…" : "Load more" }))] })] }));
 }
 function MediaUploaderPanel({ onUpload, isUploadPending, isCleanupPending, heroAssetUrl, setHeroAssetUrl, galleryAssets, setGalleryAssets, stagedUrls, setHeroStagedUrls, setGalleryStagedUrls, handleAbort, copiedUrl, onCopy, onClearPreviews, onDiscardStaged, }) {

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

@@ -12,7 +12,7 @@ const __O = {
     hidden: "overflow-hidden",
 };
 function NavItemRow({ item, idx, total, reorderPending, onMoveUp, onMoveDown, onVisibilityChange, onEdit, onDelete, }) {
-    return (_jsxs(Row, { surface: "default", padding: "inline", align: "center", gap: "3", children: [_jsxs(Stack, { className: "gap-0.5 shrink-0", children: [_jsx(Button, { variant: "ghost", type: "button", onClick: () => onMoveUp(idx), disabled: idx === 0 || reorderPending, className: "text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 disabled:opacity-30 leading-none text-xs p-0 min-h-0 h-auto rounded-none", "aria-label": "Move up", children: "\u25B2" }), _jsx(Button, { variant: "ghost", type: "button", onClick: () => onMoveDown(idx), disabled: idx >= total - 1 || reorderPending, className: "text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 disabled:opacity-30 leading-none text-xs p-0 min-h-0 h-auto rounded-none", "aria-label": "Move down", children: "\u25BC" })] }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Text, { className: "truncate", color: "primary", size: "sm", weight: "medium", children: [item.parentId ? _jsx(Span, { className: "mr-1", color: "faint", children: "\u21B3" }) : null, item.label] }), _jsx(Text, { className: "truncate", color: "muted", size: "xs", children: item.href })] }), _jsx(Toggle, { checked: item.isVisible ?? true, onChange: (val) => onVisibilityChange(item.id, val), label: "" }), _jsx(RowActionMenu, { actions: [
+    return (_jsxs(Row, { surface: "default", padding: "inline", align: "center", gap: "3", children: [_jsxs(Stack, { className: "shrink-0 gap-[0.125rem]", children: [_jsx(Button, { variant: "ghost", type: "button", onClick: () => onMoveUp(idx), disabled: idx === 0 || reorderPending, className: "text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 disabled:opacity-30 leading-none text-xs p-0 min-h-0 h-auto rounded-none", "aria-label": "Move up", children: "\u25B2" }), _jsx(Button, { variant: "ghost", type: "button", onClick: () => onMoveDown(idx), disabled: idx >= total - 1 || reorderPending, className: "text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200 disabled:opacity-30 leading-none text-xs p-0 min-h-0 h-auto rounded-none", "aria-label": "Move down", children: "\u25BC" })] }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Text, { className: "truncate", color: "primary", size: "sm", weight: "medium", children: [item.parentId ? _jsx(Span, { className: "mr-1", color: "faint", children: "\u21B3" }) : null, item.label] }), _jsx(Text, { className: "truncate", color: "muted", size: "xs", children: item.href })] }), _jsx(Toggle, { checked: item.isVisible ?? true, onChange: (val) => onVisibilityChange(item.id, val), label: "" }), _jsx(RowActionMenu, { actions: [
                     { label: ROW_ACTION_META[ROW_ACTION_ID.EDIT].label, onClick: () => onEdit(item) },
                     { label: ROW_ACTION_META[ROW_ACTION_ID.DELETE].label, destructive: true, onClick: () => onDelete(item) },
                 ] })] }));

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

@@ -3,7 +3,7 @@ import { ShoppingBag, Hash, Scale, Wallet, RotateCcw, DollarSign, Gavel } from "
 import { Code, Div, Heading, Li, Row, Section, Span, Stack, Text, Ul } from "../../../ui";
 import { GC } from "../../_guide-cls";
 export function AdminOrdersGuideView() {
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", align: "center", justify: "center", rounded: "xl", style: { background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)" }, children: _jsx(ShoppingBag, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Orders & Finance" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Order statuses, payouts, disputes, returns, and commission math on LetItRip." })] }), [
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(ShoppingBag, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Orders & Finance" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Order statuses, payouts, disputes, returns, and commission math on LetItRip." })] }), [
                 {
                     Icon: ShoppingBag, title: "Order Statuses",
                     content: (_jsxs(Stack, { textSize: "sm", gap: "sm", children: [[
@@ -14,7 +14,7 @@ export function AdminOrdersGuideView() {
                                 ["RETURN_REQUESTED", "Buyer opened a return. Seller has 3 days to respond."],
                                 ["REFUNDED", "Return accepted and refund issued via Razorpay."],
                                 ["CANCELLED", "Cancelled before shipping. Payment returned."],
-                            ].map(([status, note]) => (_jsxs(Row, { gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: status }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: note })] }, status))), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] pt-2", size: "sm", children: "Admin-only transitions: force-cancel (any status before DELIVERED), force-refund (post-DELIVERED dispute)." })] })),
+                            ].map(([status, note]) => (_jsxs(Row, { gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: status }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: note })] }, status))), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] pt-[0.5rem]", size: "sm", children: "Admin-only transitions: force-cancel (any status before DELIVERED), force-refund (post-DELIVERED dispute)." })] })),
                 },
                 {
                     Icon: Hash, title: "Order ID Format",
@@ -40,5 +40,5 @@ export function AdminOrdersGuideView() {
                     Icon: Gavel, title: "Auction Settlement",
                     content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsx(Li, { children: "When an auction ends and the winner does not pay within 48 hours: the order auto-cancels and the system notifies the next-highest bidder." }), _jsx(Li, { children: "If the auto-cancel system fails (rare), admin can manually cancel from the order detail page and trigger the next-bidder flow via a support action." }), _jsxs(Li, { children: ["Repeat non-paying winners can receive a ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "place_bids" }), " soft ban from the Trust & Safety section."] })] })),
                 },
-            ].map(({ Icon, title, content }) => (_jsxs(Section, { className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
+            ].map(({ Icon, title, content }) => (_jsxs(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", children: [_jsxs(Row, { className: "border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-2,var(--appkit-color-border))]/20", padding: "inlineLg", align: "center", gap: "3", children: [_jsx(Icon, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, size: "base", weight: "semibold", children: title })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: content })] }, title)))] }));
 }

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

@@ -40,10 +40,7 @@ export function AdminPayoutsView({ children, ...props }) {
     });
     const handleExportCsv = async () => {
         try {
-            const res = await fetch(ADMIN_ENDPOINTS.PAYOUTS_EXPORT);
-            if (!res.ok)
-                throw new Error("Export failed");
-            const blob = await res.blob();
+            const blob = await apiClient.blob(ADMIN_ENDPOINTS.PAYOUTS_EXPORT);
             const url = URL.createObjectURL(blob);
             const a = document.createElement("a");
             a.href = url;

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

@@ -47,12 +47,7 @@ export function AdminSidebar({ renderNavItems, renderHeader, renderFooter, activ
     const mobileNavContent = groups ? (_jsx(GroupsContent, { groups: groups, activePath: activePath, onItemClick: close })) : (_jsxs(Nav, { "aria-label": "Admin sidebar", padding: "y-sm", children: [renderHeader?.(), renderNavItems?.(activePath), renderFooter?.()] }));
     if (variant === "sidebar") {
         const handleToggle = onToggle ?? close;
-        return (_jsxs(_Fragment, { children: [desktopOpen && (_jsx(Div, { surface: "overlay-xs", className: "hidden md:block fixed inset-0 backdrop-blur-[2px] z-30", onClick: handleToggle, "aria-hidden": "true" })), _jsxs(Div, { className: "hidden md:flex fixed left-0 z-40 transition-transform duration-300", style: {
-                        top: "var(--header-height, 3.5rem)",
-                        height: "calc(100vh - var(--header-height, 3.5rem))",
-                        width: "18rem",
-                        transform: desktopOpen ? "translateX(0)" : "translateX(calc(-100% + 1.25rem))",
-                    }, children: [_jsxs(Stack, { border: "default", surface: "sidePanel", className: `flex-1 border-r dark:border-slate-800 ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: renderHeader ? renderHeader() : _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "Admin Panel" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: navContent }), renderFooter && _jsx(Div, { border: "top", padding: "inline", children: renderFooter() })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle })] }), _jsx(Div, { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));
+        return (_jsxs(_Fragment, { children: [desktopOpen && (_jsx(Div, { surface: "overlay-xs", className: "hidden md:block fixed inset-0 backdrop-blur-[2px] z-30", onClick: handleToggle, "aria-hidden": "true" })), _jsxs(Div, { className: `hidden md:flex fixed left-0 z-40 transition-transform duration-300 top-[var(--header-height,3.5rem)] h-[calc(100vh-var(--header-height,3.5rem))] w-[18rem] ${desktopOpen ? "translate-x-0" : "-translate-x-[calc(100%-1.25rem)]"}`, children: [_jsxs(Stack, { border: "default", surface: "sidePanel", className: `flex-1 border-r dark:border-[var(--appkit-color-border)] ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: renderHeader ? renderHeader() : _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "Admin Panel" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: navContent }), renderFooter && _jsx(Div, { border: "top", padding: "inline", children: renderFooter() })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle })] }), _jsx(Div, { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));
     }
     return (_jsxs(_Fragment, { children: [mounted && mobileOpen &&
                 createPortal(_jsx(DrawerPanel, { title: "Admin Panel", onClose: close, children: navContent }), document.body), _jsx(Div, { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));

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

@@ -18,5 +18,5 @@ export function AdminSiteConfigGuideView() {
         { name: "platformLimits", desc: "Cart item cap (50), wishlist cap (20), history cap (50), support ticket limits (2 general + 1 per order)." },
         { name: "legalPages", desc: "Body HTML for Terms of Service, Privacy Policy, Refund Policy, and Shipping Policy. Rendered on their respective static pages." },
     ];
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", align: "center", justify: "center", rounded: "xl", style: { background: "linear-gradient(135deg,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 100%)" }, children: _jsx(Settings, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Site Configuration" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", children: ["All site settings are stored in a single Firestore document at ", _jsx(Code, { size: "xs", children: "site_settings/global" }), ". Changes take effect on the next page render (ISR or cache revalidation)."] })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Settings Groups" })] }), _jsx(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "md", children: SETTING_GROUPS.map(({ name, desc }) => (_jsxs(Row, { textSize: "sm", gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: name }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: desc })] }, name))) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: CLS_HEADER_ICON }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "API Keys & Integrations" })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: _jsxs(Alert, { variant: "warning", children: ["API keys in ", _jsx(Code, { size: "xs", children: "integrations" }), " are stored encrypted. They are masked in the admin UI \u2014 you see ", _jsx(Code, { size: "xs", children: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), " by design. To rotate a key: paste the new value into the field and save. The old key is immediately invalidated on your payment/shipping provider's side \u2014 test in staging first. Never paste API keys into Slack, email, or any external service."] }) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Feature Flags" })] }), _jsxs(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "3", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: ["Feature flags are boolean toggles under ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "siteSettings" }), ". They control platform-wide features without a code deploy:"] }), _jsxs(Ul, { className: "list-inside text-[var(--appkit-color-text-muted)]", marker: "disc", spacing: "tight", size: "sm", children: [_jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enableAuctions" }), " \u2014 globally enable/disable all auction listings."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enablePreOrders" }), " \u2014 globally enable/disable pre-order creation."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "maintenanceMode" }), " \u2014 shows a maintenance banner and blocks non-admin access."] })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "Flags are evaluated per-request via ISR cache \u2014 a change may take up to the revalidation interval (3600s default) to propagate to all pages." })] })] })] }));
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(Settings, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Site Configuration" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", children: ["All site settings are stored in a single Firestore document at ", _jsx(Code, { size: "xs", children: "site_settings/global" }), ". Changes take effect on the next page render (ISR or cache revalidation)."] })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Settings Groups" })] }), _jsx(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "md", children: SETTING_GROUPS.map(({ name, desc }) => (_jsxs(Row, { textSize: "sm", gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: name }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: desc })] }, name))) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: CLS_HEADER_ICON }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "API Keys & Integrations" })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: _jsxs(Alert, { variant: "warning", children: ["API keys in ", _jsx(Code, { size: "xs", children: "integrations" }), " are stored encrypted. They are masked in the admin UI \u2014 you see ", _jsx(Code, { size: "xs", children: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), " by design. To rotate a key: paste the new value into the field and save. The old key is immediately invalidated on your payment/shipping provider's side \u2014 test in staging first. Never paste API keys into Slack, email, or any external service."] }) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Feature Flags" })] }), _jsxs(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "3", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: ["Feature flags are boolean toggles under ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "siteSettings" }), ". They control platform-wide features without a code deploy:"] }), _jsxs(Ul, { className: "list-inside text-[var(--appkit-color-text-muted)]", marker: "disc", spacing: "tight", size: "sm", children: [_jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enableAuctions" }), " \u2014 globally enable/disable all auction listings."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enablePreOrders" }), " \u2014 globally enable/disable pre-order creation."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "maintenanceMode" }), " \u2014 shows a maintenance banner and blocks non-admin access."] })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "Flags are evaluated per-request via ISR cache \u2014 a change may take up to the revalidation interval (3600s default) to propagate to all pages." })] })] })] }));
 }