@mohasinac/appkit 3.0.3 → 3.0.6

package/dist/features/seller/components/analytics/SellerRevenueChart.js

@@ -13,7 +13,7 @@ const Tooltip = dynamic(() => import("recharts").then((m) => m.Tooltip), { ssr:
 const ResponsiveContainer = dynamic(() => import("recharts").then((m) => m.ResponsiveContainer), { ssr: false });
 export function SellerRevenueChart({ data, labels = {}, formatRevenue = (amount) => String(amount), className = "", }) {
     const hasRevenue = data.some((item) => item.revenue > 0);
-    return (_jsxs(Div, { className: `border border-neutral-200 dark:border-neutral-800 sm:p-6 ${className}`, rounded: "xl", padding: "md", surface: "default", children: [labels.title && (_jsx(Heading, { level: 3, className: "mb-4", size: "base", weight: "semibold", children: labels.title })), hasRevenue ? (_jsx(Div, { className: "h-[300px]", children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(BarChart, { data: data, children: [_jsx(CartesianGrid, { strokeDasharray: "3 3", strokeOpacity: 0.3 }), _jsx(XAxis, { dataKey: "month", tick: { fontSize: 11, fill: "currentColor" }, tickLine: false, axisLine: false }), _jsx(YAxis, { tick: { fontSize: 11, fill: "currentColor" }, tickLine: false, axisLine: false, tickFormatter: (value) => formatRevenue(Number(value)) }), _jsx(Tooltip, { formatter: (value) => [
+    return (_jsxs(Div, { className: `border border-neutral-200 dark:border-neutral-800 sm:p-[1.5rem] ${className}`, rounded: "xl", padding: "md", surface: "default", children: [labels.title && (_jsx(Heading, { level: 3, className: "mb-4", size: "base", weight: "semibold", children: labels.title })), hasRevenue ? (_jsx(Div, { className: "h-[300px]", children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(BarChart, { data: data, children: [_jsx(CartesianGrid, { strokeDasharray: "3 3", strokeOpacity: 0.3 }), _jsx(XAxis, { dataKey: "month", tick: { fontSize: 11, fill: "currentColor" }, tickLine: false, axisLine: false }), _jsx(YAxis, { tick: { fontSize: 11, fill: "currentColor" }, tickLine: false, axisLine: false, tickFormatter: (value) => formatRevenue(Number(value)) }), _jsx(Tooltip, { formatter: (value) => [
                                     formatRevenue(Number(value)),
                                     labels.revenueLabel ?? "Revenue",
                                 ] }), _jsx(Bar, { dataKey: "revenue", fill: "var(--appkit-color-primary)", radius: [4, 4, 0, 0] })] }) }) })) : (_jsx(Text, { paddingY: "xl", color: "muted", size: "sm", align: "center", children: labels.noData ?? "No data available" }))] }));

package/dist/features/seller/components/analytics/SellerTopProducts.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Div, Heading, Row, Span, Text } from "../../../../ui";
 export function SellerTopProducts({ products, labels = {}, formatRevenue = (amount) => String(amount), renderProductLink, renderEmptyAction, className = "", }) {
-    return (_jsxs(Div, { className: `border border-neutral-200 dark:border-neutral-800 sm:p-6 ${className}`, rounded: "xl", padding: "md", surface: "default", children: [labels.title && (_jsx(Heading, { level: 3, className: "mb-4", size: "base", weight: "semibold", children: labels.title })), products.length > 0 ? (_jsx(Div, { className: "divide-y divide-neutral-100 dark:divide-neutral-800", children: products.map((product, index) => (_jsxs(Row, { align: "center", gap: "md", padding: "y-sm", children: [_jsxs(Span, { size: "sm", weight: "bold", className: "w-6", color: "muted", children: [index + 1, "."] }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsx(Text, { className: "truncate", size: "sm", weight: "medium", children: product.title }), _jsxs(Text, { size: "xs", color: "muted", children: [product.orders, " ", labels.ordersLabel ?? "orders"] })] }), _jsxs(Div, { className: "text-right ml-2", children: [_jsx(Span, { size: "sm", weight: "semibold", className: "text-success", children: formatRevenue(product.revenue) }), renderProductLink?.(product)] })] }, product.productId))) })) : (_jsxs(Div, { className: "text-center", padding: "y-xl", children: [_jsx(Text, { size: "sm", weight: "medium", children: labels.noData ?? "No data available" }), labels.noDataDescription && (_jsx(Text, { className: "mt-1", color: "muted", size: "xs", children: labels.noDataDescription })), renderEmptyAction?.()] }))] }));
+    return (_jsxs(Div, { className: `border border-neutral-200 dark:border-neutral-800 sm:p-[1.5rem] ${className}`, rounded: "xl", padding: "md", surface: "default", children: [labels.title && (_jsx(Heading, { level: 3, className: "mb-4", size: "base", weight: "semibold", children: labels.title })), products.length > 0 ? (_jsx(Div, { className: "divide-y divide-neutral-100 dark:divide-neutral-800", children: products.map((product, index) => (_jsxs(Row, { align: "center", gap: "md", padding: "y-sm", children: [_jsxs(Span, { size: "sm", weight: "bold", className: "w-6", color: "muted", children: [index + 1, "."] }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsx(Text, { className: "truncate", size: "sm", weight: "medium", children: product.title }), _jsxs(Text, { size: "xs", color: "muted", children: [product.orders, " ", labels.ordersLabel ?? "orders"] })] }), _jsxs(Div, { className: "text-right ml-2", children: [_jsx(Span, { size: "sm", weight: "semibold", className: "text-success", children: formatRevenue(product.revenue) }), renderProductLink?.(product)] })] }, product.productId))) })) : (_jsxs(Div, { className: "text-center", padding: "y-xl", children: [_jsx(Text, { size: "sm", weight: "medium", children: labels.noData ?? "No data available" }), labels.noDataDescription && (_jsx(Text, { className: "mt-1", color: "muted", size: "xs", children: labels.noDataDescription })), renderEmptyAction?.()] }))] }));
 }

package/dist/features/seller/components/index.d.ts

@@ -128,3 +128,7 @@ export { SellerDigitalCodesView } from "./SellerDigitalCodesView";
 export type { SellerDigitalCodesViewProps } from "./SellerDigitalCodesView";
 export { SellerLiveView } from "./SellerLiveView";
 export type { SellerLiveViewProps } from "./SellerLiveView";
+export { BarcodeField } from "./BarcodeField";
+export type { BarcodeFieldProps } from "./BarcodeField";
+export { FulfillmentView } from "./FulfillmentView";
+export type { FulfillmentViewProps } from "./FulfillmentView";

package/dist/features/seller/components/index.js

@@ -67,3 +67,5 @@ export { SellerBundlesView } from "./SellerBundlesView";
 export { SellerClassifiedView } from "./SellerClassifiedView";
 export { SellerDigitalCodesView } from "./SellerDigitalCodesView";
 export { SellerLiveView } from "./SellerLiveView";
+export { BarcodeField } from "./BarcodeField";
+export { FulfillmentView } from "./FulfillmentView";

package/dist/features/seller/schemas/index.d.ts

@@ -87,8 +87,8 @@ export declare const sellerStoreSchema: z.ZodObject<{
 }, "strip", z.ZodTypeAny, {
     status: "pending" | "active" | "rejected" | "suspended";
     createdAt: string;
-    id: string;
     storeName: string;
+    id: string;
     updatedAt: string;
     isPublic: boolean;
     storeSlug: string;
@@ -119,8 +119,8 @@ export declare const sellerStoreSchema: z.ZodObject<{
 }, {
     status: "pending" | "active" | "rejected" | "suspended";
     createdAt: string;
-    id: string;
     storeName: string;
+    id: string;
     updatedAt: string;
     isPublic: boolean;
     storeSlug: string;
@@ -212,15 +212,15 @@ export declare const sellerListParamsSchema: z.ZodObject<{
     status?: "pending" | "active" | "rejected" | "suspended" | undefined;
     sort?: string | undefined;
     category?: string | undefined;
-    q?: string | undefined;
     page?: number | undefined;
+    q?: string | undefined;
     perPage?: number | undefined;
 }, {
     status?: "pending" | "active" | "rejected" | "suspended" | undefined;
     sort?: string | undefined;
     category?: string | undefined;
-    q?: string | undefined;
     page?: number | undefined;
+    q?: string | undefined;
     perPage?: number | undefined;
 }>;
 export declare const payoutListParamsSchema: z.ZodObject<{

package/dist/features/shell/FormShell.js

@@ -115,8 +115,8 @@ schema: _schema, isDirty = false, isLoading = false, sections, onSaveDraft, onPu
     };
     if (!isOpen)
         return null;
-    return (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-sm", className: "fixed inset-0 backdrop-blur-[2px]", style: { zIndex: "calc(var(--appkit-z-modal) - 1)" }, "aria-hidden": "true", onClick: attemptClose }), _jsxs(Div, { layout: "flex", ref: panelRef, role: "dialog", "aria-modal": "true", "aria-label": title, className: "fixed top-0 bottom-0 left-0 right-0 lg:left-[10%] lg:right-[10%] flex-col bg-[var(--appkit-color-surface)] shadow-2xl", style: { zIndex: "var(--appkit-z-modal)" }, children: [_jsxs(Row, { gap: "sm", paddingX: "x-5", className: "flex-shrink-0 sticky top-0 z-10 border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", padding: "y-sm", children: [previewMode ? (_jsxs("button", { type: "button", onClick: () => setPreviewMode(false), "aria-label": "Back to edit", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors flex-shrink-0 flex items-center gap-1.5 text-sm", children: [_jsx(ArrowLeft, { className: "w-4 h-4" }), _jsx(Span, { className: "hidden sm:inline", children: "Back to Edit" })] })) : (_jsx("button", { type: "button", onClick: attemptClose, "aria-label": "Close", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors flex-shrink-0", children: _jsx(X, { className: "w-5 h-5" }) })), _jsxs(Div, { className: "flex-1 min-w-0", children: [breadcrumb && (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] truncate mb-0.5", size: "xs", children: breadcrumb })), _jsx(Text, { className: "text-[var(--appkit-color-text)] truncate", size: "sm", weight: "semibold", children: previewMode ? `Preview — ${title}` : title })] }), _jsx(Row, { gap: "xs", className: "flex-shrink-0", children: previewMode ? null : (_jsxs(_Fragment, { children: [previewSlot && (_jsxs("button", { type: "button", onClick: () => setPreviewMode(true), className: "flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors border border-[var(--appkit-color-border)]", children: [_jsx(Eye, { className: "w-4 h-4" }), _jsx(Span, { className: "hidden sm:inline", children: "Preview" })] })), onSaveDraft && (_jsx(Button, { variant: "outline", size: "sm", onClick: handleSaveDraft, disabled: isLoading || savingDraft || publishing, isLoading: savingDraft, children: saveLabel })), onPublish && (_jsx(Button, { variant: "primary", size: "sm", onClick: handlePublish, disabled: isLoading || savingDraft || publishing, isLoading: publishing, children: publishLabel }))] })) })] }), _jsxs(Div, { layout: "flex", className: `flex-1 ${__O.hidden}`, children: [sections && sections.length > 0 && !previewMode && (_jsx("nav", { "aria-label": "Form sections", className: "hidden lg:flex flex-col flex-shrink-0 w-48 border-r border-[var(--appkit-color-border)] py-4 px-3 gap-1 overflow-y-auto", children: sections.map((sec) => (_jsx("button", { type: "button", onClick: () => scrollToSection(sec.id), className: "text-left text-sm px-3 py-2 rounded-lg text-[var(--appkit-color-text-muted)] hover:text-[var(--appkit-color-text)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors", children: sec.label }, sec.id))) })), sections && sections.length > 0 && !previewMode && (_jsx(Row, { gap: "px", className: `lg:hidden fixed top-[var(--form-shell-topbar-h,57px)] left-0 right-0 z-10 ${__O.xAuto} px-5 bg-[var(--appkit-color-surface)] border-b border-[var(--appkit-color-border)]`, padding: "y-xs", children: sections.map((sec) => (_jsx("button", { type: "button", onClick: () => scrollToSection(sec.id), className: "flex-shrink-0 text-xs px-3 py-1.5 rounded-full border border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:border-[var(--appkit-color-primary)] hover:text-[var(--appkit-color-primary)] transition-colors whitespace-nowrap", children: sec.label }, sec.id))) })), _jsx(Div, { ref: bodyRef, className: classNames("flex-1 overflow-y-auto", sections && sections.length > 0 && !previewMode ? "pt-0 lg:pt-0" : ""), children: previewMode && previewSlot ? (_jsxs(_Fragment, { children: [_jsxs(Row, { textSize: "sm", gap: "xs", className: "sticky top-0 z-10 bg-[var(--appkit-color-warning-surface)] border-b border-[var(--appkit-color-warning)] text-[var(--appkit-color-warning-text,var(--appkit-color-warning))]", paddingY: "y-xs", paddingX: "x-md", children: [_jsx(Eye, { className: "w-4 h-4 flex-shrink-0" }), _jsx(Span, { children: "Preview \u2014 not visible to buyers until published" })] }), _jsx(Div, { padding: "y-md", children: previewSlot() })] })) : splitPreview && previewSlot ? (
+    return (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-sm", className: "fixed inset-0 backdrop-blur-[2px]", style: { zIndex: "calc(var(--appkit-z-modal) - 1)" }, "aria-hidden": "true", onClick: attemptClose }), _jsxs(Div, { layout: "flex", ref: panelRef, role: "dialog", "aria-modal": "true", "aria-label": title, className: "fixed top-0 bottom-0 left-0 right-0 lg:left-[10%] lg:right-[10%] [flex-direction:column] bg-[var(--appkit-color-surface)]", shadow: "2xl", style: { zIndex: "var(--appkit-z-modal)" }, children: [_jsxs(Row, { gap: "sm", paddingX: "x-5", className: "flex-shrink-0 sticky top-0 z-10 border-b border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", padding: "y-sm", children: [previewMode ? (_jsxs("button", { type: "button", onClick: () => setPreviewMode(false), "aria-label": "Back to edit", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors flex-shrink-0 flex items-center gap-1.5 text-sm", children: [_jsx(ArrowLeft, { className: "w-4 h-4" }), _jsx(Span, { className: "hidden sm:inline", children: "Back to Edit" })] })) : (_jsx("button", { type: "button", onClick: attemptClose, "aria-label": "Close", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors flex-shrink-0", children: _jsx(X, { className: "w-5 h-5" }) })), _jsxs(Div, { className: "flex-1 min-w-0", children: [breadcrumb && (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] truncate mb-0.5", size: "xs", children: breadcrumb })), _jsx(Text, { className: "text-[var(--appkit-color-text)] truncate", size: "sm", weight: "semibold", children: previewMode ? `Preview — ${title}` : title })] }), _jsx(Row, { gap: "xs", className: "flex-shrink-0", children: previewMode ? null : (_jsxs(_Fragment, { children: [previewSlot && (_jsxs("button", { type: "button", onClick: () => setPreviewMode(true), className: "flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors border border-[var(--appkit-color-border)]", children: [_jsx(Eye, { className: "w-4 h-4" }), _jsx(Span, { className: "hidden sm:inline", children: "Preview" })] })), onSaveDraft && (_jsx(Button, { variant: "outline", size: "sm", onClick: handleSaveDraft, disabled: isLoading || savingDraft || publishing, isLoading: savingDraft, children: saveLabel })), onPublish && (_jsx(Button, { variant: "primary", size: "sm", onClick: handlePublish, disabled: isLoading || savingDraft || publishing, isLoading: publishing, children: publishLabel }))] })) })] }), _jsxs(Div, { layout: "flex", className: `flex-1 ${__O.hidden}`, children: [sections && sections.length > 0 && !previewMode && (_jsx("nav", { "aria-label": "Form sections", className: "hidden lg:flex flex-col flex-shrink-0 w-48 border-r border-[var(--appkit-color-border)] py-4 px-3 gap-1 overflow-y-auto", children: sections.map((sec) => (_jsx("button", { type: "button", onClick: () => scrollToSection(sec.id), className: "text-left text-sm px-3 py-2 rounded-lg text-[var(--appkit-color-text-muted)] hover:text-[var(--appkit-color-text)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors", children: sec.label }, sec.id))) })), sections && sections.length > 0 && !previewMode && (_jsx(Row, { gap: "px", className: `lg:hidden fixed top-[var(--form-shell-topbar-h,57px)] left-0 right-0 z-10 ${__O.xAuto} px-[1.25rem] bg-[var(--appkit-color-surface)] border-b border-[var(--appkit-color-border)]`, padding: "y-xs", children: sections.map((sec) => (_jsx("button", { type: "button", onClick: () => scrollToSection(sec.id), className: "flex-shrink-0 text-xs px-3 py-1.5 rounded-full border border-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)] hover:border-[var(--appkit-color-primary)] hover:text-[var(--appkit-color-primary)] transition-colors whitespace-nowrap", children: sec.label }, sec.id))) })), _jsx(Div, { ref: bodyRef, className: classNames("flex-1 overflow-y-auto", sections && sections.length > 0 && !previewMode ? "pt-0 lg:pt-0" : ""), children: previewMode && previewSlot ? (_jsxs(_Fragment, { children: [_jsxs(Row, { textSize: "sm", gap: "xs", className: "sticky top-0 z-10 bg-[var(--appkit-color-warning-surface)] border-b border-[var(--appkit-color-warning)] text-[var(--appkit-color-warning-text,var(--appkit-color-warning))]", paddingY: "y-xs", paddingX: "x-md", children: [_jsx(Eye, { className: "w-4 h-4 flex-shrink-0" }), _jsx(Span, { children: "Preview \u2014 not visible to buyers until published" })] }), _jsx(Div, { padding: "y-md", children: previewSlot() })] })) : splitPreview && previewSlot ? (
                                 // S-STORE-3-D — desktop 60/40 split: form left, preview right.
                                 // Below `lg`, falls back to single-column form (preview-as-modal via existing toggle).
-                                _jsxs(Div, { className: "lg:grid lg:grid-cols-[3fr_2fr] lg:gap-6 lg:px-6 lg:py-6 lg:max-w-[1400px] lg:mx-auto", children: [_jsx(Div, { className: "max-w-3xl mx-auto px-5 sm:px-6 lg:max-w-none lg:px-0 lg:py-0", padding: "y-lg", children: children }), _jsxs(Div, { className: `hidden lg:block sticky lg:top-4 lg:self-start lg:max-h-[calc(100vh-6rem)] ${__O.yAuto} border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-raised)] ${__P.p4}`, rounded: "lg", children: [_jsxs(Row, { textWeight: "semibold", textSize: "xs", gap: "xs", className: "mb-3 uppercase tracking-wide text-[var(--appkit-color-text-muted)]", children: [_jsx(Eye, { className: "w-3.5 h-3.5" }), _jsx(Span, { children: "Live preview" })] }), previewSlot()] })] })) : (_jsx(Div, { className: "max-w-3xl mx-auto px-5 sm:px-6", padding: "y-lg", children: children })) })] }), !previewMode && renderBottomBar ? (renderBottomBar()) : !previewMode && (onSaveDraft || onPublish) ? (_jsxs(Row, { justify: "between", paddingX: "x-5", className: "flex-shrink-0 sticky bottom-0 z-10 border-t border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", padding: "y-sm", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: attemptClose, disabled: isLoading, children: FORM_ACTION_META[FORM_ACTION_ID.DISCARD].label }), _jsxs(Row, { gap: "xs", children: [onSaveDraft && (_jsx(Button, { variant: "outline", size: "sm", onClick: handleSaveDraft, disabled: isLoading || savingDraft || publishing, isLoading: savingDraft, children: saveLabel })), onPublish && (_jsxs(Button, { variant: "primary", size: "sm", onClick: handlePublish, disabled: isLoading || savingDraft || publishing, isLoading: publishing, children: [publishLabel, " \u2192"] }))] })] })) : null] }), showUnsaved && (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-lg", className: "fixed inset-0", style: { zIndex: "calc(var(--appkit-z-modal) + 5)" }, onClick: () => setShowUnsaved(false) }), _jsxs(Div, { className: "fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[90vw] max-w-sm bg-[var(--appkit-color-surface)] shadow-2xl", rounded: "xl", padding: "lg", style: { zIndex: "calc(var(--appkit-z-modal) + 5)" }, children: [_jsxs(Row, { gap: "sm", align: "start", className: "mb-4", children: [_jsx(Span, { layout: "flex-center", className: "flex-shrink-0 w-10 h-10 bg-[var(--appkit-color-warning-surface)]", rounded: "full", children: _jsx(AlertTriangle, { className: "w-5 h-5 text-[var(--appkit-color-warning)]" }) }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { className: "text-[var(--appkit-color-text)]", weight: "semibold", children: "Unsaved changes" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "You have unsaved changes. Leave without saving?" })] })] }), _jsxs(Row, { gap: "xs", justify: "end", children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => setShowUnsaved(false), children: "Stay" }), _jsx(Button, { variant: "danger", size: "sm", onClick: () => { setShowUnsaved(false); onClose(); }, children: "Leave" })] })] })] }))] }));
+                                _jsxs(Div, { className: "lg:grid lg:grid-cols-[3fr_2fr] lg:gap-[1.5rem] lg:px-[1.5rem] lg:py-[1.5rem] lg:max-w-[1400px] lg:mx-auto", children: [_jsx(Div, { className: "max-w-3xl mx-auto px-[1.25rem] sm:px-[1.5rem] lg:max-w-none lg:px-[0] lg:py-[0]", padding: "y-lg", children: children }), _jsxs(Div, { className: `hidden lg:block sticky lg:top-4 lg:self-start lg:max-h-[calc(100vh-6rem)] ${__O.yAuto} border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface-raised)] ${__P.p4}`, rounded: "lg", children: [_jsxs(Row, { textWeight: "semibold", textSize: "xs", gap: "xs", className: "mb-3 uppercase tracking-wide text-[var(--appkit-color-text-muted)]", children: [_jsx(Eye, { className: "w-3.5 h-3.5" }), _jsx(Span, { children: "Live preview" })] }), previewSlot()] })] })) : (_jsx(Div, { className: "max-w-3xl mx-auto px-[1.25rem] sm:px-[1.5rem]", padding: "y-lg", children: children })) })] }), !previewMode && renderBottomBar ? (renderBottomBar()) : !previewMode && (onSaveDraft || onPublish) ? (_jsxs(Row, { justify: "between", paddingX: "x-5", className: "flex-shrink-0 sticky bottom-0 z-10 border-t border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", padding: "y-sm", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: attemptClose, disabled: isLoading, children: FORM_ACTION_META[FORM_ACTION_ID.DISCARD].label }), _jsxs(Row, { gap: "xs", children: [onSaveDraft && (_jsx(Button, { variant: "outline", size: "sm", onClick: handleSaveDraft, disabled: isLoading || savingDraft || publishing, isLoading: savingDraft, children: saveLabel })), onPublish && (_jsxs(Button, { variant: "primary", size: "sm", onClick: handlePublish, disabled: isLoading || savingDraft || publishing, isLoading: publishing, children: [publishLabel, " \u2192"] }))] })] })) : null] }), showUnsaved && (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-lg", className: "fixed inset-0", style: { zIndex: "calc(var(--appkit-z-modal) + 5)" }, onClick: () => setShowUnsaved(false) }), _jsxs(Div, { className: "fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[90vw] max-w-sm bg-[var(--appkit-color-surface)]", shadow: "2xl", rounded: "xl", padding: "lg", style: { zIndex: "calc(var(--appkit-z-modal) + 5)" }, children: [_jsxs(Row, { gap: "sm", align: "start", className: "mb-4", children: [_jsx(Span, { layout: "flex-center", className: "flex-shrink-0 w-10 h-10 bg-[var(--appkit-color-warning-surface)]", rounded: "full", children: _jsx(AlertTriangle, { className: "w-5 h-5 text-[var(--appkit-color-warning)]" }) }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { className: "text-[var(--appkit-color-text)]", weight: "semibold", children: "Unsaved changes" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "You have unsaved changes. Leave without saving?" })] })] }), _jsxs(Row, { gap: "xs", justify: "end", children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => setShowUnsaved(false), children: "Stay" }), _jsx(Button, { variant: "danger", size: "sm", onClick: () => { setShowUnsaved(false); onClose(); }, children: "Leave" })] })] })] }))] }));
 }

package/dist/features/shell/QuickFormDrawer.js

@@ -121,7 +121,7 @@ export function QuickFormDrawer({ isOpen, onClose, title, fields, defaultValues,
     if (!isOpen)
         return null;
     const busy = submitting || isLoading;
-    return (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-xs", className: "fixed inset-0 backdrop-blur-[2px]", style: { zIndex: "calc(var(--appkit-z-modal) + 1)" }, "aria-hidden": "true", onClick: handleClose }), _jsxs("div", { ref: drawerRef, role: "dialog", "aria-modal": "true", "aria-label": title, className: "fixed inset-y-0 right-0 flex flex-col bg-[var(--appkit-color-surface)] shadow-2xl w-full lg:w-[40%]", style: { zIndex: "calc(var(--appkit-z-modal) + 2)" }, children: [_jsxs(Row, { className: "flex-shrink-0 border-b border-[var(--appkit-color-border)]", padding: "md", align: "center", gap: "3", children: [_jsx(Text, { className: "flex-1 text-[var(--appkit-color-text)]", size: "base", weight: "semibold", children: title }), _jsx("button", { type: "button", onClick: handleClose, "aria-label": "Close", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors", children: _jsx(X, { className: "w-5 h-5" }) })] }), _jsxs("form", { className: "flex-1 overflow-y-auto px-4 py-5 space-y-4", onSubmit: handleSubmit, noValidate: true, children: [fields.map((field) => {
+    return (_jsxs(_Fragment, { children: [_jsx(Div, { surface: "overlay-xs", className: "fixed inset-0 backdrop-blur-[2px] [z-index:calc(var(--appkit-z-modal)+1)]", "aria-hidden": "true", onClick: handleClose }), _jsxs("div", { ref: drawerRef, role: "dialog", "aria-modal": "true", "aria-label": title, className: "fixed inset-y-0 right-0 flex flex-col bg-[var(--appkit-color-surface)] shadow-2xl w-full lg:w-[40%] [z-index:calc(var(--appkit-z-modal)+2)]", children: [_jsxs(Row, { className: "flex-shrink-0 border-b border-[var(--appkit-color-border)]", padding: "md", align: "center", gap: "3", children: [_jsx(Text, { className: "flex-1 text-[var(--appkit-color-text)]", size: "base", weight: "semibold", children: title }), _jsx("button", { type: "button", onClick: handleClose, "aria-label": "Close", className: "rounded-lg p-1.5 text-[var(--appkit-color-text-muted)] hover:bg-[var(--appkit-color-border-subtle)] transition-colors", children: _jsx(X, { className: "w-5 h-5" }) })] }), _jsxs("form", { className: "flex-1 overflow-y-auto px-4 py-5 space-y-4", onSubmit: handleSubmit, noValidate: true, children: [fields.map((field) => {
                                 const value = values[field.name];
                                 if (field.type === "toggle") {
                                     return (_jsxs(Stack, { gap: "xs", children: [_jsx(Toggle, { checked: !!value, onChange: (checked) => set(field.name, checked), label: field.label }), field.helperText && (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "xs", children: field.helperText }))] }, field.name));

package/dist/features/site-settings/components/NavPermissionsManager.js

@@ -31,6 +31,6 @@ export function NavPermissionsManager({ initialConfig, navGroups, onUpdate, }) {
                                     return (_jsxs(Tr, { className: [
                                             idx % 2 === 0 ? "bg-white dark:bg-slate-900" : "bg-zinc-50/50 dark:bg-slate-800/50",
                                             !enabled ? "opacity-60" : "",
-                                        ].join(" "), children: [_jsx(Td, { padding: "md", children: _jsxs(Div, { children: [_jsx(Text, { weight: "medium", color: "primary", children: item.label }), item.id && (_jsx(Text, { size: "xs", color: "faint", children: item.id }))] }) }), _jsx(Td, { padding: "md", children: _jsx(Code, { className: "text-zinc-500 dark:text-zinc-400", size: "xs", children: item.href }) }), _jsx(Td, { padding: "md", children: item.requiredPermission ? (_jsx(Code, { className: "bg-zinc-100 px-1.5 py-0.5 text-zinc-700 dark:bg-slate-700 dark:text-zinc-300", size: "xs", rounded: "default", children: item.requiredPermission })) : (_jsx(Text, { size: "xs", color: "faint", children: "\u2014" })) }), _jsx(Td, { className: "text-right", padding: "md", children: hasId ? (_jsx(Toggle, { checked: enabled, onChange: (v) => handleToggle(item.id, item.label, v), "aria-label": `Toggle ${item.label}` })) : (_jsx(Text, { className: "italic", size: "xs", color: "faint", children: "Legacy \u2014 always visible" })) })] }, item.href));
+                                        ].join(" "), children: [_jsx(Td, { padding: "md", children: _jsxs(Div, { children: [_jsx(Text, { weight: "medium", color: "primary", children: item.label }), item.id && (_jsx(Text, { size: "xs", color: "faint", children: item.id }))] }) }), _jsx(Td, { padding: "md", children: _jsx(Code, { color: "muted", size: "xs", children: item.href }) }), _jsx(Td, { padding: "md", children: item.requiredPermission ? (_jsx(Code, { className: "bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text)]", padding: "sm", size: "xs", rounded: "default", children: item.requiredPermission })) : (_jsx(Text, { size: "xs", color: "faint", children: "\u2014" })) }), _jsx(Td, { className: "text-right", padding: "md", children: hasId ? (_jsx(Toggle, { checked: enabled, onChange: (v) => handleToggle(item.id, item.label, v), "aria-label": `Toggle ${item.label}` })) : (_jsx(Text, { className: "italic", size: "xs", color: "faint", children: "Legacy \u2014 always visible" })) })] }, item.href));
                                 }) })] }) })] }, group.groupLabel))) }));
 }

package/dist/features/store-extensions/schemas/firestore.d.ts

@@ -1,4 +1,5 @@
 import type { FirestoreDocument } from "@mohasinac/appkit";
+import type { BaseDocument } from "../../../_internal/shared/types/base-document";
 /**
  * S-STORE Extensions — Firestore Document Types
  *
@@ -20,8 +21,7 @@ import type { FirestoreDocument } from "@mohasinac/appkit";
  *  11. storeGoogleConfig     — per-store Google Business reviews integration
  */
 export type PayoutMethodType = "upi" | "bank" | "card" | "other";
-export interface PayoutMethodDocument {
-    id: string;
+export interface PayoutMethodDocument extends BaseDocument {
     sellerId: string;
     storeId: string;
     type: PayoutMethodType;
@@ -34,15 +34,12 @@ export interface PayoutMethodDocument {
     accountHolderName?: string;
     bankName?: string;
     details?: Record<string, string>;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const PAYOUT_METHODS_COLLECTION: "payoutMethods";
 export declare const PAYOUT_METHOD_INDEXED_FIELDS: readonly ["sellerId", "storeId", "type", "isDefault", "isActive", "createdAt"];
 export declare const DEFAULT_PAYOUT_METHOD_DATA: Partial<PayoutMethodDocument>;
 export type ShippingMethod = "free" | "flat" | "weight" | "express" | "pickup" | "custom";
-export interface ShippingConfigDocument {
-    id: string;
+export interface ShippingConfigDocument extends BaseDocument {
     storeId: string;
     label: string;
     method: ShippingMethod;
@@ -54,16 +51,13 @@ export interface ShippingConfigDocument {
     expressSurchargeInPaise?: number;
     estimatedDays?: number;
     zones?: string[];
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const SHIPPING_CONFIGS_COLLECTION: "shippingConfigs";
 export declare const SHIPPING_CONFIG_INDEXED_FIELDS: readonly ["storeId", "method", "isDefault", "isActive", "createdAt"];
 export declare const DEFAULT_SHIPPING_CONFIG_DATA: Partial<ShippingConfigDocument>;
 export type AnalyticsScope = "seller" | "admin";
 export type AnalyticsCardType = "metric" | "line" | "bar" | "pie" | "table" | "custom";
-export interface AnalyticsCardDocument {
-    id: string;
+export interface AnalyticsCardDocument extends BaseDocument {
     scope: AnalyticsScope;
     ownerId: string;
     title: string;
@@ -73,15 +67,12 @@ export interface AnalyticsCardDocument {
     position: number;
     isBuiltIn: boolean;
     isVisible: boolean;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const ANALYTICS_CARDS_COLLECTION: "analyticsCards";
 export declare const ANALYTICS_CARD_INDEXED_FIELDS: readonly ["scope", "ownerId", "isVisible", "position", "createdAt"];
 export declare const DEFAULT_ANALYTICS_CARD_DATA: Partial<AnalyticsCardDocument>;
 export type AlertOperator = ">" | "<" | ">=" | "<=" | "==" | "!=";
-export interface AnalyticsAlertDocument {
-    id: string;
+export interface AnalyticsAlertDocument extends BaseDocument {
     scope: AnalyticsScope;
     ownerId: string;
     label: string;
@@ -92,14 +83,11 @@ export interface AnalyticsAlertDocument {
     isActive: boolean;
     notifyChannels: Array<"in-app" | "email" | "whatsapp">;
     lastTriggeredAt?: Date;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const ANALYTICS_ALERTS_COLLECTION: "analyticsAlerts";
 export declare const ANALYTICS_ALERT_INDEXED_FIELDS: readonly ["scope", "ownerId", "isActive", "metric", "createdAt"];
 export declare const DEFAULT_ANALYTICS_ALERT_DATA: Partial<AnalyticsAlertDocument>;
-export interface StoreCategoryDocument {
-    id: string;
+export interface StoreCategoryDocument extends BaseDocument {
     storeId: string;
     label: string;
     slug: string;
@@ -108,15 +96,12 @@ export interface StoreCategoryDocument {
     isActive: boolean;
     description?: string;
     coverImageUrl?: string;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const STORE_CATEGORIES_COLLECTION: "storeCategories";
 export declare const STORE_CATEGORY_INDEXED_FIELDS: readonly ["storeId", "slug", "isActive", "displayOrder", "createdAt"];
 export declare const DEFAULT_STORE_CATEGORY_DATA: Partial<StoreCategoryDocument>;
 export type ListingTemplateType = "standard" | "auction" | "pre-order" | "prize-draw" | "bundle" | "classified" | "digital-code" | "live";
-export interface ListingTemplateDocument {
-    id: string;
+export interface ListingTemplateDocument extends BaseDocument {
     storeId: string;
     ownerId: string;
     name: string;
@@ -127,16 +112,13 @@ export interface ListingTemplateDocument {
     isShared: boolean;
     isActive: boolean;
     usageCount: number;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const LISTING_TEMPLATES_COLLECTION: "listingTemplates";
 export declare const LISTING_TEMPLATE_INDEXED_FIELDS: readonly ["storeId", "ownerId", "listingType", "isShared", "isActive", "createdAt"];
 export declare const DEFAULT_LISTING_TEMPLATE_DATA: Partial<ListingTemplateDocument>;
 export type ModerationStatus = "pending" | "approved" | "rejected" | "auto-approved";
 export type ModerationMediaType = "video" | "image" | "rich-text";
-export interface ModerationQueueDocument {
-    id: string;
+export interface ModerationQueueDocument extends BaseDocument {
     mediaType: ModerationMediaType;
     mediaUrl?: string;
     thumbnailUrl?: string;
@@ -149,8 +131,6 @@ export interface ModerationQueueDocument {
     reviewerId?: string;
     reviewedAt?: Date;
     submittedAt: Date;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const MODERATION_QUEUE_COLLECTION: "moderationQueue";
 export declare const MODERATION_QUEUE_INDEXED_FIELDS: readonly ["status", "mediaType", "entityType", "entityId", "storeId", "ownerId", "submittedAt", "createdAt"];
@@ -158,8 +138,7 @@ export declare const DEFAULT_MODERATION_QUEUE_DATA: Partial<ModerationQueueDocum
 export type ReportEntityType = "product" | "store" | "review" | "event" | "user" | "blog" | "comment";
 export type ReportStatus = "pending" | "under-review" | "actioned" | "dismissed";
 export type ReportReason = "scam" | "counterfeit" | "prohibited" | "inappropriate" | "harassment" | "spam" | "ip-violation" | "other";
-export interface ReportDocument {
-    id: string;
+export interface ReportDocument extends BaseDocument {
     entityType: ReportEntityType;
     entityId: string;
     reporterId: string;
@@ -171,8 +150,6 @@ export interface ReportDocument {
     assignedTo?: string;
     resolution?: string;
     resolvedAt?: Date;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const REPORTS_COLLECTION: "reports";
 export declare const REPORT_INDEXED_FIELDS: readonly ["entityType", "entityId", "reporterId", "reason", "status", "createdAt"];
@@ -186,8 +163,7 @@ export interface ItemRequestReply {
     isOpInitiatedThread: boolean;
     createdAt: Date;
 }
-export interface ItemRequestDocument {
-    id: string;
+export interface ItemRequestDocument extends BaseDocument {
     opUserId: string;
     opDisplayName: string;
     title: string;
@@ -203,14 +179,11 @@ export interface ItemRequestDocument {
     approvedAt?: Date;
     approvedBy?: string;
     closedAt?: Date;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const ITEM_REQUESTS_COLLECTION: "itemRequests";
 export declare const ITEM_REQUEST_INDEXED_FIELDS: readonly ["opUserId", "status", "category", "createdAt"];
 export declare const DEFAULT_ITEM_REQUEST_DATA: Partial<ItemRequestDocument>;
-export interface StoreWhatsAppConfigDocument {
-    id: string;
+export interface StoreWhatsAppConfigDocument extends BaseDocument {
     storeId: string;
     isConnected: boolean;
     isPaid: boolean;
@@ -221,14 +194,11 @@ export interface StoreWhatsAppConfigDocument {
     welcomeMessage?: string;
     /** Status of pending WhatsApp Business onboarding (Meta Cloud API). */
     onboardingStatus?: "pending" | "approved" | "rejected";
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const STORE_WHATSAPP_CONFIG_COLLECTION: "storeWhatsAppConfig";
 export declare const STORE_WHATSAPP_CONFIG_INDEXED_FIELDS: readonly ["storeId", "isConnected", "isPaid"];
 export declare const DEFAULT_STORE_WHATSAPP_CONFIG_DATA: Partial<StoreWhatsAppConfigDocument>;
-export interface StoreGoogleConfigDocument {
-    id: string;
+export interface StoreGoogleConfigDocument extends BaseDocument {
     storeId: string;
     isConnected: boolean;
     placeId?: string;
@@ -237,8 +207,6 @@ export interface StoreGoogleConfigDocument {
     totalReviews?: number;
     lastSyncedAt?: Date;
     oauthRefreshToken?: string;
-    createdAt: Date;
-    updatedAt: Date;
 }
 export declare const STORE_GOOGLE_CONFIG_COLLECTION: "storeGoogleConfig";
 export declare const STORE_GOOGLE_CONFIG_INDEXED_FIELDS: readonly ["storeId", "isConnected"];

package/dist/features/stores/components/StoreCapabilitiesGuideView.js

@@ -50,7 +50,7 @@ const CAPABILITY_GROUPS = [
     },
 ];
 function CapabilityTable() {
-    return (_jsx(Stack, { gap: "lg", children: CAPABILITY_GROUPS.map(({ group, items }) => (_jsxs(Div, { children: [_jsx(Text, { className: "tracking-wide text-[var(--appkit-color-text-muted)] mb-2", size: "xs", weight: "semibold", transform: "uppercase", children: group }), _jsx(Div, { className: "overflow-x-auto -mx-6", children: _jsxs(Table, { className: "min-w-full", size: "sm", children: [_jsx(Thead, { children: _jsxs(Tr, { className: "border-b border-[var(--appkit-color-border)]", children: [_jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)]", padding: "lg-tight", children: "Capability" }), _jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)]", padding: "lg-tight", children: "What it unlocks" }), _jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)] w-24", padding: "lg-tight", children: "Default" })] }) }), _jsx(Tbody, { className: "divide-y divide-[var(--appkit-color-border)]", children: items.map(({ cap, unlocks, defaultOn }) => (_jsxs(Tr, { children: [_jsx(Td, { size: "xs", className: "font-mono text-[var(--appkit-color-text)] align-top whitespace-nowrap", padding: "lg-tight", children: cap }), _jsx(Td, { className: "text-[var(--appkit-color-text-muted)] align-top", padding: "lg-tight", children: unlocks }), _jsx(Td, { className: "align-top", padding: "lg-tight", children: defaultOn ? (_jsx(Span, { className: "inline-block bg-[var(--appkit-color-success)]/10 text-[var(--appkit-color-success)]", size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", children: "On" })) : (_jsx(Span, { className: "inline-block bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]", size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", children: "Off" })) })] }, cap))) })] }) })] }, group))) }));
+    return (_jsx(Stack, { gap: "lg", children: CAPABILITY_GROUPS.map(({ group, items }) => (_jsxs(Div, { children: [_jsx(Text, { className: "tracking-wide text-[var(--appkit-color-text-muted)] mb-2", size: "xs", weight: "semibold", transform: "uppercase", children: group }), _jsx(Div, { overflow: "x-auto", className: "-mx-6", children: _jsxs(Table, { className: "min-w-full", size: "sm", children: [_jsx(Thead, { children: _jsxs(Tr, { className: "border-b border-[var(--appkit-color-border)]", children: [_jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)]", padding: "lg-tight", children: "Capability" }), _jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)]", padding: "lg-tight", children: "What it unlocks" }), _jsx(Th, { weight: "semibold", className: "text-left text-[var(--appkit-color-text)] w-24", padding: "lg-tight", children: "Default" })] }) }), _jsx(Tbody, { className: "divide-y divide-[var(--appkit-color-border)]", children: items.map(({ cap, unlocks, defaultOn }) => (_jsxs(Tr, { children: [_jsx(Td, { size: "xs", className: "font-mono text-[var(--appkit-color-text)] align-top whitespace-nowrap", padding: "lg-tight", children: cap }), _jsx(Td, { className: "text-[var(--appkit-color-text-muted)] align-top", padding: "lg-tight", children: unlocks }), _jsx(Td, { className: "align-top", padding: "lg-tight", children: defaultOn ? (_jsx(Span, { className: "inline-block bg-[var(--appkit-color-success)]/10 text-[var(--appkit-color-success)]", size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", children: "On" })) : (_jsx(Span, { className: "inline-block bg-[var(--appkit-color-border)] text-[var(--appkit-color-text-muted)]", size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", children: "Off" })) })] }, cap))) })] }) })] }, group))) }));
 }
 // -- Section 3: Locked feature guide ------------------------------------------
 const LOCKED_FEATURES = [

package/dist/features/stores/components/StoreClassifiedsListing.d.ts

@@ -0,0 +1,5 @@
+export interface StoreClassifiedsListingProps {
+    storeId?: string;
+    initialData?: any;
+}
+export declare function StoreClassifiedsListing({ storeId, initialData }: StoreClassifiedsListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/stores/components/StoreClassifiedsListing.js

@@ -0,0 +1,48 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { usePendingTable } from "../../../react/hooks/usePendingTable";
+import { useProducts } from "../../products/hooks/useProducts";
+import { Div, FilterDrawer, ListingToolbar, Pagination, Row, Text } from "../../../ui";
+import { ClassifiedFilters } from "../../classified/components/ClassifiedFilters";
+import { InteractiveProductCard } from "../../products/components/InteractiveProductCard";
+import { PRODUCT_FIELDS } from "../../../constants/field-names";
+import { TABLE_KEYS } from "../../../constants/table-keys";
+import { sortBy } from "../../../constants/sort";
+import { ROUTES } from "../../../next";
+const DEFAULT_SORT = sortBy(PRODUCT_FIELDS.CREATED_AT);
+const SORT_OPTIONS = [
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT), label: "Newest First" },
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT, "ASC"), label: "Oldest First" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE, "ASC"), label: "Price: Low to High" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE), label: "Price: High to Low" },
+];
+const FILTER_KEYS = [TABLE_KEYS.MIN_PRICE, TABLE_KEYS.MAX_PRICE, TABLE_KEYS.NEGOTIABLE, TABLE_KEYS.ACCEPTS_SHIPPING];
+export function StoreClassifiedsListing({ storeId, initialData }) {
+    const table = useUrlTable({ defaults: { pageSize: "24", sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    const { pendingTable, filterActiveCount, onFilterApply, onFilterClear, onResetAll, onFilterReset } = usePendingTable(table, FILTER_KEYS);
+    const openFilters = useCallback(() => { onFilterReset(); setFilterOpen(true); }, [onFilterReset]);
+    const applyFilters = useCallback(() => { onFilterApply(); setFilterOpen(false); }, [onFilterApply]);
+    const resetAll = useCallback(() => { onResetAll({ q: "", sort: "" }); setSearchInput(""); }, [onResetAll]);
+    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT || filterActiveCount > 0;
+    const params = {
+        q: table.get("q") || undefined,
+        minPrice: table.get(TABLE_KEYS.MIN_PRICE) ? Number(table.get(TABLE_KEYS.MIN_PRICE)) : undefined,
+        maxPrice: table.get(TABLE_KEYS.MAX_PRICE) ? Number(table.get(TABLE_KEYS.MAX_PRICE)) : undefined,
+        sort: table.get("sort") || DEFAULT_SORT,
+        page: table.getNumber("page", 1),
+        perPage: table.getNumber("pageSize", 24),
+        storeId: storeId || undefined,
+        listingType: "classified",
+    };
+    const { products, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const gridClass = "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4";
+    return (_jsxs(Div, { className: "min-h-[200px]", children: [_jsx(ListingToolbar, { filterCount: filterActiveCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search store classifieds\u2026", onSearchChange: setSearchInput, onSearchCommit: () => table.set("q", searchInput.trim()), sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => table.set("sort", v), onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx(Row, { border: "bottom", className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 backdrop-blur-sm", surface: "default", padding: "toolbar", justify: "center", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx(Div, { padding: "y-lg", children: _jsx(Div, { className: gridClass, children: isLoading
+                        ? Array.from({ length: 8 }).map((_, i) => _jsx(Div, { surface: "muted", rounded: "xl", className: "aspect-square animate-pulse" }, i))
+                        : products.length === 0
+                            ? _jsx(Div, { paddingY: "y-4xl", className: "col-span-full text-center", children: _jsx(Text, { color: "muted", children: "No classified listings in this store yet." }) })
+                            : products.map((p) => (_jsx(InteractiveProductCard, { product: p, href: String(ROUTES.PUBLIC.CLASSIFIED_DETAIL(p.slug ?? p.id)) }, p.id))) }) }), _jsx(FilterDrawer, { open: filterOpen, onOpen: openFilters, onClose: () => setFilterOpen(false), onApply: applyFilters, onReset: onFilterClear, activeCount: filterActiveCount, hideTrigger: true, children: _jsx(ClassifiedFilters, { table: pendingTable, currencyPrefix: "\u20B9" }) })] }));
+}

package/dist/features/stores/components/StoreClassifiedsPageView.d.ts

@@ -0,0 +1,4 @@
+export interface StoreClassifiedsPageViewProps {
+    storeSlug: string;
+}
+export declare function StoreClassifiedsPageView({ storeSlug }: StoreClassifiedsPageViewProps): Promise<import("react/jsx-runtime").JSX.Element | null>;

package/dist/features/stores/components/StoreClassifiedsPageView.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { sieveFilter, sieveAnd, SIEVE_OP, sortBy, PRODUCT_FIELDS } from "@mohasinac/appkit";
+import { productRepository } from "../../../repositories";
+import { getStoreBySlug } from "./StoreDetailLayoutView";
+import { StoreClassifiedsListing } from "./StoreClassifiedsListing";
+export async function StoreClassifiedsPageView({ storeSlug }) {
+    const store = await getStoreBySlug(storeSlug);
+    const storeId = store?.id;
+    if (!storeId)
+        return null;
+    const result = await productRepository
+        .list({
+        filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "classified")),
+        sorts: sortBy(PRODUCT_FIELDS.CREATED_AT),
+        page: 1,
+        pageSize: 24,
+    })
+        .catch(() => null);
+    return _jsx(StoreClassifiedsListing, { storeId: storeId, initialData: result ?? undefined });
+}

package/dist/features/stores/components/StoreDetailLayoutView.js

@@ -14,6 +14,9 @@ const STORE_LISTING_HREF = {
     "pre-orders": (slug) => String(ROUTES.PUBLIC.STORE_PRE_ORDERS(slug)),
     "prize-draws": (slug) => String(ROUTES.PUBLIC.STORE_PRIZE_DRAWS(slug)),
     bundles: (slug) => String(ROUTES.PUBLIC.STORE_BUNDLES(slug)),
+    classifieds: (slug) => String(ROUTES.PUBLIC.STORE_CLASSIFIEDS(slug)),
+    "digital-codes": (slug) => String(ROUTES.PUBLIC.STORE_DIGITAL_CODES(slug)),
+    live: (slug) => String(ROUTES.PUBLIC.STORE_LIVE(slug)),
 };
 export const getStoreBySlug = cache((slug) => storeRepository.findBySlug(slug).catch(() => undefined));
 function tabLabel(base, count) {
@@ -28,7 +31,7 @@ export async function StoreDetailLayoutView({ storeSlug, activeTab, children, })
     }
     const storeId = store?.id;
     const settings = await siteSettingsRepository.findById("global").catch(() => null);
-    const [productsCount, auctionsCount, preOrdersCount, prizeDrawsCount, bundlesCount, couponsCount, reviewsCount] = storeId
+    const [productsCount, auctionsCount, preOrdersCount, prizeDrawsCount, bundlesCount, classifiedsCount, digitalCodesCount, liveCount, couponsCount, reviewsCount] = storeId
         ? await Promise.all([
             productRepository
                 .list({ filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "standard")), page: 1, pageSize: 1 })
@@ -52,6 +55,18 @@ export async function StoreDetailLayoutView({ storeSlug, activeTab, children, })
                 .listByType("bundle", { activeOnly: true, limit: 100 })
                 .then((rows) => rows.filter((c) => c.createdByStoreId === storeId).length)
                 .catch(() => 0),
+            productRepository
+                .list({ filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "classified")), page: 1, pageSize: 1 })
+                .then((r) => r.total)
+                .catch(() => 0),
+            productRepository
+                .list({ filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "digital-code")), page: 1, pageSize: 1 })
+                .then((r) => r.total)
+                .catch(() => 0),
+            productRepository
+                .list({ filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "live")), page: 1, pageSize: 1 })
+                .then((r) => r.total)
+                .catch(() => 0),
             couponsRepository
                 .list({ filters: sieveAnd(sieveFilter("sellerId", SIEVE_OP.EQ, storeId), sieveFilter("validity.isActive", SIEVE_OP.EQ, "true")), page: 1, pageSize: 1 })
                 .then((r) => r.total)
@@ -61,19 +76,25 @@ export async function StoreDetailLayoutView({ storeSlug, activeTab, children, })
                 .then((r) => r.total)
                 .catch(() => 0),
         ])
-        : [0, 0, 0, 0, 0, 0, 0];
+        : [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
     const listingCounts = {
         products: productsCount,
         auctions: auctionsCount,
         "pre-orders": preOrdersCount,
         "prize-draws": prizeDrawsCount,
         bundles: bundlesCount,
+        classifieds: classifiedsCount,
+        "digital-codes": digitalCodesCount,
+        live: liveCount,
     };
     const TAB_LISTING_TYPE = {
         products: "standard",
         auctions: "auction",
         "pre-orders": "pre-order",
         "prize-draws": "prize-draw",
+        classifieds: "classified",
+        "digital-codes": "digital-code",
+        live: "live",
     };
     const visibleStoreTabs = STORE_PAGE_TABS.filter((tab) => {
         if (tab.id === "bundles")

package/dist/features/stores/components/StoreDigitalCodesListing.d.ts

@@ -0,0 +1,5 @@
+export interface StoreDigitalCodesListingProps {
+    storeId?: string;
+    initialData?: any;
+}
+export declare function StoreDigitalCodesListing({ storeId, initialData }: StoreDigitalCodesListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/stores/components/StoreDigitalCodesListing.js

@@ -0,0 +1,48 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { usePendingTable } from "../../../react/hooks/usePendingTable";
+import { useProducts } from "../../products/hooks/useProducts";
+import { Div, FilterDrawer, ListingToolbar, Pagination, Row, Text } from "../../../ui";
+import { DigitalCodeFilters } from "../../digital-codes/components/DigitalCodeFilters";
+import { InteractiveProductCard } from "../../products/components/InteractiveProductCard";
+import { PRODUCT_FIELDS } from "../../../constants/field-names";
+import { TABLE_KEYS } from "../../../constants/table-keys";
+import { sortBy } from "../../../constants/sort";
+import { ROUTES } from "../../../next";
+const DEFAULT_SORT = sortBy(PRODUCT_FIELDS.CREATED_AT);
+const SORT_OPTIONS = [
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT), label: "Newest First" },
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT, "ASC"), label: "Oldest First" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE, "ASC"), label: "Price: Low to High" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE), label: "Price: High to Low" },
+];
+const FILTER_KEYS = [TABLE_KEYS.MIN_PRICE, TABLE_KEYS.MAX_PRICE];
+export function StoreDigitalCodesListing({ storeId, initialData }) {
+    const table = useUrlTable({ defaults: { pageSize: "24", sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    const { pendingTable, filterActiveCount, onFilterApply, onFilterClear, onResetAll, onFilterReset } = usePendingTable(table, FILTER_KEYS);
+    const openFilters = useCallback(() => { onFilterReset(); setFilterOpen(true); }, [onFilterReset]);
+    const applyFilters = useCallback(() => { onFilterApply(); setFilterOpen(false); }, [onFilterApply]);
+    const resetAll = useCallback(() => { onResetAll({ q: "", sort: "" }); setSearchInput(""); }, [onResetAll]);
+    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT || filterActiveCount > 0;
+    const params = {
+        q: table.get("q") || undefined,
+        minPrice: table.get(TABLE_KEYS.MIN_PRICE) ? Number(table.get(TABLE_KEYS.MIN_PRICE)) : undefined,
+        maxPrice: table.get(TABLE_KEYS.MAX_PRICE) ? Number(table.get(TABLE_KEYS.MAX_PRICE)) : undefined,
+        sort: table.get("sort") || DEFAULT_SORT,
+        page: table.getNumber("page", 1),
+        perPage: table.getNumber("pageSize", 24),
+        storeId: storeId || undefined,
+        listingType: "digital-code",
+    };
+    const { products, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const gridClass = "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4";
+    return (_jsxs(Div, { className: "min-h-[200px]", children: [_jsx(ListingToolbar, { filterCount: filterActiveCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search digital codes\u2026", onSearchChange: setSearchInput, onSearchCommit: () => table.set("q", searchInput.trim()), sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => table.set("sort", v), onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx(Row, { border: "bottom", className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 backdrop-blur-sm", surface: "default", padding: "toolbar", justify: "center", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx(Div, { padding: "y-lg", children: _jsx(Div, { className: gridClass, children: isLoading
+                        ? Array.from({ length: 8 }).map((_, i) => _jsx(Div, { surface: "muted", rounded: "xl", className: "aspect-square animate-pulse" }, i))
+                        : products.length === 0
+                            ? _jsx(Div, { paddingY: "y-4xl", className: "col-span-full text-center", children: _jsx(Text, { color: "muted", children: "No digital codes in this store yet." }) })
+                            : products.map((p) => (_jsx(InteractiveProductCard, { product: p, href: String(ROUTES.PUBLIC.DIGITAL_CODE_DETAIL(p.slug ?? p.id)) }, p.id))) }) }), _jsx(FilterDrawer, { open: filterOpen, onOpen: openFilters, onClose: () => setFilterOpen(false), onApply: applyFilters, onReset: onFilterClear, activeCount: filterActiveCount, hideTrigger: true, children: _jsx(DigitalCodeFilters, { table: pendingTable, currencyPrefix: "\u20B9" }) })] }));
+}

package/dist/features/stores/components/StoreDigitalCodesPageView.d.ts

@@ -0,0 +1,4 @@
+export interface StoreDigitalCodesPageViewProps {
+    storeSlug: string;
+}
+export declare function StoreDigitalCodesPageView({ storeSlug }: StoreDigitalCodesPageViewProps): Promise<import("react/jsx-runtime").JSX.Element | null>;

package/dist/features/stores/components/StoreDigitalCodesPageView.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { sieveFilter, sieveAnd, SIEVE_OP, sortBy, PRODUCT_FIELDS } from "@mohasinac/appkit";
+import { productRepository } from "../../../repositories";
+import { getStoreBySlug } from "./StoreDetailLayoutView";
+import { StoreDigitalCodesListing } from "./StoreDigitalCodesListing";
+export async function StoreDigitalCodesPageView({ storeSlug }) {
+    const store = await getStoreBySlug(storeSlug);
+    const storeId = store?.id;
+    if (!storeId)
+        return null;
+    const result = await productRepository
+        .list({
+        filters: sieveAnd(sieveFilter("storeId", SIEVE_OP.EQ, storeId), sieveFilter("status", SIEVE_OP.EQ, "published"), sieveFilter("listingType", SIEVE_OP.EQ, "digital-code")),
+        sorts: sortBy(PRODUCT_FIELDS.CREATED_AT),
+        page: 1,
+        pageSize: 24,
+    })
+        .catch(() => null);
+    return _jsx(StoreDigitalCodesListing, { storeId: storeId, initialData: result ?? undefined });
+}