@mohasinac/appkit 2.3.2 → 2.4.1

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

@@ -1,5 +1,89 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from "react";
+import { Alert, Badge, Button, Div, FormField, Heading, Stack, Text, } from "../../../ui";
 import { StackedViewShell } from "../../../ui";
-export function SellerShippingView({ labels = {}, renderZones, renderForm, isLoading = false, ...rest }) {
-    return (_jsx(StackedViewShell, { portal: "seller", ...rest, title: labels.title, sections: [renderZones?.(isLoading), renderForm?.()] }));
+import { StoreAddressSelectorCreate } from "../../stores/components/StoreAddressSelectorCreate";
+const DEFAULT_DRAFT = {
+    method: "custom",
+    customCarrierName: "",
+    customShippingPrice: "",
+    shiprocketEmail: "",
+    shiprocketPassword: "",
+    pickupAddressId: "",
+};
+export function SellerShippingView({ apiBase = "/api/store/shipping" }) {
+    const [draft, setDraft] = useState(DEFAULT_DRAFT);
+    const [current, setCurrent] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [saving, setSaving] = useState(false);
+    const [error, setError] = useState(null);
+    const [success, setSuccess] = useState(false);
+    useEffect(() => {
+        fetch(apiBase)
+            .then((r) => r.json())
+            .then((res) => {
+            const cfg = res?.data?.shippingConfig ?? { method: "custom", isConfigured: false };
+            setCurrent(cfg);
+            setDraft({
+                method: cfg.method,
+                customCarrierName: cfg.customCarrierName ?? "",
+                customShippingPrice: cfg.customShippingPrice ? String(cfg.customShippingPrice / 100) : "",
+                shiprocketEmail: cfg.shiprocketEmail ?? "",
+                shiprocketPassword: "",
+                pickupAddressId: "",
+            });
+        })
+            .catch(() => { })
+            .finally(() => setLoading(false));
+    }, [apiBase]);
+    const update = useCallback((key, value) => {
+        setDraft((prev) => ({ ...prev, [key]: value }));
+        setSuccess(false);
+    }, []);
+    const handleSave = async () => {
+        setError(null);
+        setSuccess(false);
+        setSaving(true);
+        try {
+            const body = draft.method === "custom"
+                ? {
+                    method: "custom",
+                    customCarrierName: draft.customCarrierName.trim(),
+                    customShippingPrice: Math.round(parseFloat(draft.customShippingPrice || "0") * 100),
+                }
+                : {
+                    method: "shiprocket",
+                    ...(draft.shiprocketPassword
+                        ? { shiprocketCredentials: { email: draft.shiprocketEmail, password: draft.shiprocketPassword } }
+                        : {}),
+                };
+            const res = await fetch(apiBase, {
+                method: "PATCH",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify(body),
+            });
+            const json = await res.json();
+            if (!res.ok)
+                throw new Error(json?.error ?? "Failed to save");
+            setSuccess(true);
+            const cfg = json?.data?.shippingConfig ?? { method: draft.method, isConfigured: false };
+            setCurrent(cfg);
+        }
+        catch (err) {
+            setError(err.message);
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    const isCustom = draft.method === "custom";
+    const busy = loading || saving;
+    return (_jsx(StackedViewShell, { portal: "seller", title: "Shipping Configuration", sections: [
+            _jsxs(Stack, { gap: "lg", children: [current && (_jsxs(Div, { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: current.isConfigured ? "success" : "warning", children: current.isConfigured ? "Configured" : "Not configured" }), current.method === "shiprocket" && (_jsx(Badge, { variant: current.isTokenValid ? "success" : "danger", children: current.isTokenValid ? "Shiprocket connected" : "Shiprocket token expired" }))] })), error && _jsx(Alert, { variant: "error", children: error }), success && _jsx(Alert, { variant: "success", children: "Shipping configuration saved." }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Shipping Method" }), _jsx(Stack, { gap: "sm", children: ["custom", "shiprocket"].map((m) => (_jsxs("label", { className: "flex items-center gap-3 p-3 rounded-lg border border-[var(--appkit-color-border)] cursor-pointer has-[:checked]:border-[var(--appkit-color-primary)] has-[:checked]:bg-[var(--appkit-color-primary)]/5", children: [_jsx("input", { type: "radio", name: "method", value: m, checked: draft.method === m, onChange: () => update("method", m), className: "accent-[var(--appkit-color-primary)]", disabled: busy }), _jsxs(Div, { children: [_jsx(Text, { className: "font-medium capitalize", children: m === "custom" ? "Custom / Manual" : "Shiprocket" }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: m === "custom"
+                                                        ? "Set a fixed shipping fee and carrier name for all orders."
+                                                        : "Automated shipping via Shiprocket — connect your account for label generation and tracking." })] })] }, m))) })] }), isCustom && (_jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Custom Shipping Details" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "customCarrierName", label: "Carrier Name", type: "text", value: draft.customCarrierName, onChange: (v) => update("customCarrierName", v), placeholder: "e.g. India Post, DTDC, Delhivery", disabled: busy }), _jsx(FormField, { name: "customShippingPrice", label: "Shipping Price (\u20B9)", type: "number", value: draft.customShippingPrice, onChange: (v) => update("customShippingPrice", v), placeholder: "0 for free shipping", helpText: "Charged to buyer at checkout. Enter 0 for free shipping.", disabled: busy })] })] })), !isCustom && (_jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Shiprocket Account" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "shiprocketEmail", label: "Shiprocket Email", type: "email", value: draft.shiprocketEmail, onChange: (v) => update("shiprocketEmail", v), placeholder: "your@email.com", disabled: busy }), _jsx(FormField, { name: "shiprocketPassword", label: current?.isTokenValid ? "Password (leave blank to keep existing token)" : "Password", type: "password", value: draft.shiprocketPassword, onChange: (v) => update("shiprocketPassword", v), placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022", helpText: current?.isTokenValid ? "Only fill this to re-authenticate." : "Required to connect your Shiprocket account.", disabled: busy }), _jsxs(Div, { children: [_jsx(StoreAddressSelectorCreate, { value: draft.pickupAddressId, onChange: (id) => update("pickupAddressId", id), label: "Pickup Address (optional)", disabled: busy }), _jsx(Text, { className: "mt-1 text-xs text-[var(--appkit-color-text-muted)]", children: "Registering a pickup address sends an OTP to your phone for verification." })] }), current?.pickupAddress && (_jsxs(Alert, { variant: "info", children: ["Current pickup: ", current.pickupAddress.locationName ?? "", current.pickupAddress.city ? `, ${current.pickupAddress.city}` : "", current.pickupAddress.isVerified
+                                                ? " — ✓ Verified"
+                                                : " — Pending OTP verification"] }))] })] })), _jsx(Div, { className: "flex justify-end pt-2 border-t border-[var(--appkit-color-border)]", children: _jsx(Button, { variant: "primary", onClick: handleSave, disabled: busy, isLoading: saving, children: "Save Configuration" }) })] }, "shipping"),
+        ] }));
 }

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

@@ -5,18 +5,26 @@ export interface StoreNavItem {
     icon?: React.ReactNode;
     badge?: number;
 }
+export interface StoreNavGroup {
+    title: string;
+    items: StoreNavItem[];
+    defaultOpen?: boolean;
+}
 interface StoreSidebarProps {
     items: StoreNavItem[];
+    groups?: StoreNavGroup[];
     activeHref: string;
     storeName?: string;
     storeLogoURL?: string;
-    /** Whether the mobile drawer is open */
     mobileOpen?: boolean;
-    /** Called when the mobile drawer should close */
+    desktopOpen?: boolean;
+    variant?: "sidebar" | "overlay";
     onCloseMobile?: () => void;
+    /** Toggle callback for the desktop sidebar tab (open ↔ close). */
+    onToggle?: () => void;
     className?: string;
 }
-export declare function StoreSidebar({ items, activeHref, storeName, storeLogoURL, mobileOpen, onCloseMobile, className, }: StoreSidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function StoreSidebar({ items, groups, activeHref, storeName, storeLogoURL, mobileOpen, desktopOpen, variant, onCloseMobile, onToggle, }: StoreSidebarProps): import("react/jsx-runtime").JSX.Element;
 /** @deprecated Use StoreSidebar */
 export declare const SellerSidebar: typeof StoreSidebar;
 /** @deprecated Use StoreNavItem */

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

@@ -1,18 +1,62 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState, useCallback } from "react";
+import { createPortal } from "react-dom";
 import Link from "next/link";
-import { Aside, Div, Li, Nav, Row, Span, Text, Ul } from "../../../ui";
+import { Div, Li, Nav, Row, Span, Text, Ul } from "../../../ui";
 import { BottomSheet } from "../../layout/BottomSheet";
-function StoreNavContent({ items, activeHref, storeName, storeLogoURL, onItemClick, }) {
-    return (_jsxs(_Fragment, { children: [storeName && (_jsxs(Row, { gap: "3", className: "px-5 py-4 border-b border-gray-100 dark:border-slate-700", children: [storeLogoURL ? (_jsx(Div, { role: "img", "aria-label": storeName, className: "h-8 w-8 rounded-full bg-center bg-cover", style: { backgroundImage: `url(${storeLogoURL})` } })) : (_jsx(Div, { className: "h-8 w-8 rounded-full bg-orange-100 dark:bg-orange-900/30 flex items-center justify-center text-orange-600 dark:text-orange-400 font-bold text-sm", children: storeName[0]?.toUpperCase() })), _jsx(Text, { className: "font-semibold text-gray-900 dark:text-zinc-100 text-sm truncate", children: storeName })] })), _jsx(Nav, { "aria-label": "Store navigation", className: "flex-1 overflow-y-auto py-3", children: _jsx(Ul, { className: "space-y-0.5 px-2", children: items.map((item) => {
+function NavLink({ item, isActive, onClick }) {
+    return (_jsxs(Link, { href: item.href, onClick: onClick, className: `flex items-center gap-2.5 rounded-lg px-3 py-2 text-[0.8125rem] font-medium leading-tight transition-colors ${isActive
+            ? "bg-orange-50 dark:bg-orange-900/20 text-orange-700 dark:text-orange-300"
+            : "text-zinc-500 dark:text-zinc-400 hover:bg-zinc-50 dark:hover:bg-slate-800/60 hover:text-zinc-800 dark:hover:text-zinc-200"}`, children: [item.icon && _jsx(Span, { className: "shrink-0 text-base opacity-60", children: item.icon }), _jsx(Span, { className: "flex-1 truncate", children: item.label }), item.badge != null && item.badge > 0 && (_jsx(Span, { className: "shrink-0 rounded-full bg-orange-500 px-1.5 py-0.5 text-[10px] font-bold text-white leading-none", children: item.badge }))] }));
+}
+function FlatContent({ items, activeHref, storeName, storeLogoURL, onItemClick, }) {
+    return (_jsxs(_Fragment, { children: [storeName && (_jsxs(Row, { gap: "3", className: "px-4 py-3 border-b border-zinc-100 dark:border-slate-700", children: [storeLogoURL ? (_jsx(Div, { role: "img", "aria-label": storeName, className: "h-7 w-7 rounded-full bg-center bg-cover shrink-0", style: { backgroundImage: `url(${storeLogoURL})` } })) : (_jsx(Div, { className: "h-7 w-7 rounded-full bg-orange-100 dark:bg-orange-900/30 flex items-center justify-center text-orange-600 dark:text-orange-400 font-bold text-xs shrink-0", children: storeName[0]?.toUpperCase() })), _jsx(Text, { className: "font-semibold text-zinc-800 dark:text-zinc-100 text-sm truncate", children: storeName })] })), _jsx(Nav, { "aria-label": "Store navigation", className: "py-3", children: _jsx(Ul, { className: "space-y-0.5 px-3", children: items.map((item) => {
                         const isActive = activeHref === item.href;
-                        return (_jsx(Li, { children: _jsxs(Link, { href: item.href, onClick: onItemClick, className: `flex items-center gap-3 rounded-lg px-3 py-2 text-sm transition-colors ${isActive
-                                    ? "bg-orange-50 dark:bg-orange-900/20 text-orange-600 dark:text-orange-400 font-medium"
-                                    : "text-gray-600 dark:text-zinc-300 hover:bg-gray-50 dark:hover:bg-slate-800 hover:text-gray-900 dark:hover:text-zinc-100"}`, children: [item.icon && (_jsx(Span, { className: "shrink-0 text-[1.1rem]", children: item.icon })), _jsx(Span, { className: "flex-1 truncate", children: item.label }), item.badge != null && item.badge > 0 && (_jsx(Span, { className: "shrink-0 rounded-full bg-orange-500 px-1.5 py-0.5 text-[10px] font-bold text-white", children: item.badge }))] }) }, item.href));
+                        return (_jsx(Li, { children: _jsx(NavLink, { item: item, isActive: isActive, onClick: onItemClick }) }, item.href));
                     }) }) })] }));
 }
-export function StoreSidebar({ items, activeHref, storeName, storeLogoURL, mobileOpen = false, onCloseMobile, className = "", }) {
-    return (_jsxs(_Fragment, { children: [_jsx(Aside, { className: `hidden md:flex w-64 shrink-0 flex-col bg-white dark:bg-slate-900 border-r border-gray-200 dark:border-slate-700 ${className}`, children: _jsx(StoreNavContent, { items: items, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL }) }), _jsx(BottomSheet, { open: mobileOpen, onClose: onCloseMobile ?? (() => { }), title: storeName ?? "Store Panel", children: _jsx(StoreNavContent, { items: items, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: onCloseMobile }) })] }));
+function GroupsContent({ groups, activeHref, storeName, storeLogoURL, onItemClick, }) {
+    const [openGroups, setOpenGroups] = useState(() => Object.fromEntries(groups.map((g) => [
+        g.title,
+        g.defaultOpen ?? g.items.some((i) => activeHref === i.href),
+    ])));
+    const toggle = useCallback((title) => setOpenGroups((p) => ({ ...p, [title]: !p[title] })), []);
+    return (_jsxs(_Fragment, { children: [storeName && (_jsxs(Row, { gap: "3", className: "px-4 py-3 border-b border-zinc-100 dark:border-slate-700", children: [storeLogoURL ? (_jsx(Div, { role: "img", "aria-label": storeName, className: "h-7 w-7 rounded-full bg-center bg-cover shrink-0", style: { backgroundImage: `url(${storeLogoURL})` } })) : (_jsx(Div, { className: "h-7 w-7 rounded-full bg-orange-100 dark:bg-orange-900/30 flex items-center justify-center text-orange-600 dark:text-orange-400 font-bold text-xs shrink-0", children: storeName[0]?.toUpperCase() })), _jsx(Text, { className: "font-semibold text-zinc-800 dark:text-zinc-100 text-sm truncate", children: storeName })] })), _jsx(Nav, { "aria-label": "Store navigation", className: "py-2", children: groups.map((group) => {
+                    const isOpen = openGroups[group.title] ?? false;
+                    const hasActive = group.items.some((i) => activeHref === i.href);
+                    return (_jsxs("div", { className: "mb-0.5", children: [_jsxs("button", { type: "button", onClick: () => toggle(group.title), className: `flex w-full items-center justify-between px-4 py-2 text-[0.6875rem] font-semibold uppercase tracking-widest transition-colors ${hasActive && !isOpen
+                                    ? "text-orange-600 dark:text-orange-400"
+                                    : "text-zinc-400 dark:text-zinc-500 hover:text-zinc-600 dark:hover:text-zinc-300"}`, children: [_jsx("span", { children: group.title }), _jsx("svg", { className: `w-3 h-3 transition-transform duration-150 ${isOpen ? "rotate-180" : ""}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M19 9l-7 7-7-7" }) })] }), isOpen && (_jsx(Ul, { className: "space-y-0.5 px-3 pb-1", children: group.items.map((item) => {
+                                    const isActive = activeHref === item.href;
+                                    return (_jsx(Li, { children: _jsx(NavLink, { item: item, isActive: isActive, onClick: onItemClick }) }, item.href));
+                                }) }))] }, group.title));
+                }) })] }));
+}
+function DrawerPanel({ title, onClose, children }) {
+    return (_jsxs("div", { className: "hidden md:block", children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40 backdrop-blur-sm", onClick: onClose, "aria-hidden": "true" }), _jsxs("div", { role: "dialog", "aria-modal": "true", "aria-label": title, className: "fixed top-0 right-0 z-50 h-full w-64 bg-white dark:bg-slate-900 border-l border-zinc-200 dark:border-slate-700 flex flex-col shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-3.5 border-b border-zinc-100 dark:border-slate-800 shrink-0", children: [_jsx("span", { className: "text-xs font-semibold uppercase tracking-widest text-zinc-400 dark:text-zinc-500", children: title }), _jsx("button", { type: "button", onClick: onClose, "aria-label": "Close", className: "flex items-center justify-center w-7 h-7 rounded-md text-zinc-400 hover:bg-zinc-100 dark:hover:bg-slate-800 hover:text-zinc-700 dark:hover:text-zinc-200 transition-colors", children: _jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })] }), _jsx("div", { className: "flex-1 overflow-y-auto", children: children })] })] }));
+}
+export function StoreSidebar({ items, groups, activeHref, storeName, storeLogoURL, mobileOpen = false, desktopOpen = false, variant = "overlay", onCloseMobile, onToggle, }) {
+    const close = onCloseMobile ?? (() => { });
+    const [mounted, setMounted] = useState(false);
+    useEffect(() => { setMounted(true); }, []);
+    useEffect(() => {
+        document.body.style.overflow = mobileOpen ? "hidden" : "";
+        return () => { document.body.style.overflow = ""; };
+    }, [mobileOpen]);
+    const panelTitle = storeName ?? "Store Panel";
+    const navContent = groups ? (_jsx(GroupsContent, { groups: groups, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close })) : (_jsx(FlatContent, { items: items, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close }));
+    if (variant === "sidebar") {
+        const handleToggle = onToggle ?? close;
+        return (_jsxs(_Fragment, { children: [desktopOpen && (_jsx("div", { className: "hidden md:block fixed inset-0 bg-black/40 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("div", { className: "flex-1 bg-white dark:bg-slate-950 border-r border-zinc-200 dark:border-slate-700 flex flex-col overflow-hidden shadow-xl", children: [_jsx("div", { className: "px-4 py-3.5 border-b border-zinc-100 dark:border-slate-800 shrink-0", children: _jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [storeLogoURL ? (_jsx(Div, { role: "img", "aria-label": storeName, className: "h-7 w-7 rounded-full bg-center bg-cover shrink-0", style: { backgroundImage: `url(${storeLogoURL})` } })) : (_jsx(Div, { className: "h-7 w-7 rounded-full bg-orange-100 dark:bg-orange-900/30 flex items-center justify-center text-orange-600 dark:text-orange-400 font-bold text-xs shrink-0", children: storeName?.[0]?.toUpperCase() })), _jsx(Text, { className: "font-semibold text-zinc-800 dark:text-zinc-100 text-sm truncate", children: storeName || panelTitle })] }) }), _jsx("div", { className: "flex-1 overflow-y-auto", children: navContent })] }), _jsx("button", { type: "button", onClick: handleToggle, "aria-label": desktopOpen ? "Collapse sidebar" : "Expand sidebar", className: "w-5 shrink-0 bg-primary dark:bg-secondary hover:bg-primary-600 dark:hover:bg-secondary-600 flex items-center justify-center transition-colors rounded-r-md shadow-md", children: _jsx("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: desktopOpen ? (_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M11 19l-7-7 7-7m8 14l-7-7 7-7" })) : (_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M13 5l7 7-7 7M5 5l7 7-7 7" })) }) })] }), _jsx("div", { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: panelTitle, children: groups ? (_jsx(GroupsContent, { groups: groups, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close })) : (_jsx(FlatContent, { items: items, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close })) }) })] }));
+    }
+    return (_jsxs(_Fragment, { children: [mounted && mobileOpen &&
+                createPortal(_jsx(DrawerPanel, { title: panelTitle, onClose: close, children: navContent }), document.body), _jsx("div", { className: "md:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: panelTitle, children: groups ? (_jsx(GroupsContent, { groups: groups, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close })) : (_jsx(FlatContent, { items: items, activeHref: activeHref, storeName: storeName, storeLogoURL: storeLogoURL, onItemClick: close })) }) })] }));
 }
 /** @deprecated Use StoreSidebar */
 export const SellerSidebar = StoreSidebar;

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

@@ -1,13 +1,28 @@
-import React from "react";
-import type { StackedViewShellProps } from "../../../ui";
-export interface SellerStorefrontViewProps extends Omit<StackedViewShellProps, "sections"> {
-    labels?: {
-        title?: string;
-        subtitle?: string;
+export interface StorefrontDraft {
+    storeName?: string;
+    storeDescription?: string;
+    storeCategory?: string;
+    storeLogoURL?: string;
+    storeBannerURL?: string;
+    returnPolicy?: string;
+    shippingPolicy?: string;
+    bio?: string;
+    website?: string;
+    location?: string;
+    socialLinks?: {
+        twitter?: string;
+        instagram?: string;
+        facebook?: string;
+        linkedin?: string;
     };
-    renderBanner?: () => React.ReactNode;
-    renderProducts?: () => React.ReactNode;
-    renderReviews?: () => React.ReactNode;
-    renderFooter?: () => React.ReactNode;
+    isVacationMode?: boolean;
+    vacationMessage?: string;
+    isPublic?: boolean;
 }
-export declare function SellerStorefrontView({ labels, renderBanner, renderProducts, renderReviews, renderFooter, ...rest }: SellerStorefrontViewProps): import("react/jsx-runtime").JSX.Element;
+export interface SellerStorefrontViewProps {
+    initialValues?: StorefrontDraft;
+    onSave: (data: StorefrontDraft) => void | Promise<void>;
+    isLoading?: boolean;
+    storeSlug?: string;
+}
+export declare function SellerStorefrontView({ initialValues, onSave, isLoading, storeSlug, }: SellerStorefrontViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,10 +1,48 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from "react";
 import { StackedViewShell } from "../../../ui";
-export function SellerStorefrontView({ labels = {}, renderBanner, renderProducts, renderReviews, renderFooter, ...rest }) {
-    return (_jsx(StackedViewShell, { portal: "seller", ...rest, title: labels.title, sections: [
-            renderBanner?.(),
-            renderProducts?.(),
-            renderReviews?.(),
-            renderFooter?.(),
+import { Alert, Button, FormField, FormGroup, Heading, Stack, Text, Toggle, } from "../../../ui";
+import { ImageUpload, useMediaUpload } from "../../media";
+import { useFormShell } from "../../shell";
+export function SellerStorefrontView({ initialValues, onSave, isLoading = false, storeSlug = "store", }) {
+    const [draft, setDraft] = useState(initialValues ?? {});
+    const [saving, setSaving] = useState(false);
+    const [saved, setSaved] = useState(false);
+    const { isDirty, markDirty, markClean } = useFormShell();
+    const { upload } = useMediaUpload();
+    const update = useCallback((partial) => {
+        setDraft((prev) => ({ ...prev, ...partial }));
+        markDirty();
+        setSaved(false);
+    }, [markDirty]);
+    const updateSocial = (key, value) => {
+        update({ socialLinks: { ...draft.socialLinks, [key]: value } });
+    };
+    const handleSave = async () => {
+        setSaving(true);
+        setSaved(false);
+        try {
+            await onSave(draft);
+            markClean();
+            setSaved(true);
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    const busy = saving || isLoading;
+    return (_jsx(StackedViewShell, { portal: "seller", title: "Storefront Settings", sections: [
+            _jsxs(Stack, { gap: "lg", children: [saved && (_jsx(Alert, { variant: "success", children: "Changes saved successfully." })), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Store Profile" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "storeName", label: "Store Name", type: "text", value: draft.storeName ?? "", onChange: (v) => update({ storeName: v }), placeholder: "e.g. Pok\u00E9mon Palace", disabled: busy }), _jsx(FormField, { name: "bio", label: "Short Bio (shown in search results)", type: "textarea", value: draft.bio ?? "", onChange: (v) => update({ bio: v }), placeholder: "One-liner about your store (max 300 chars)", disabled: busy }), _jsxs(FormGroup, { columns: 2, children: [_jsx(ImageUpload, { label: "Store Logo", currentImage: draft.storeLogoURL, onUpload: (file) => {
+                                                    return upload(file, "stores", true, {
+                                                        type: "store-logo",
+                                                        store: storeSlug,
+                                                    });
+                                                }, onChange: (url) => update({ storeLogoURL: url }), helperText: "Square image, min 200\u00D7200px" }), _jsx(ImageUpload, { label: "Store Banner", currentImage: draft.storeBannerURL, onUpload: (file) => {
+                                                    return upload(file, "stores", true, {
+                                                        type: "store-banner",
+                                                        store: storeSlug,
+                                                    });
+                                                }, onChange: (url) => update({ storeBannerURL: url }), helperText: "Recommended: 1200\u00D7300px" })] })] })] }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Store Details" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "storeCategory", label: "Store Category", type: "text", value: draft.storeCategory ?? "", onChange: (v) => update({ storeCategory: v }), placeholder: "e.g. Trading Cards, Action Figures", disabled: busy }), _jsx(FormField, { name: "storeDescription", label: "Full Description", type: "textarea", value: draft.storeDescription ?? "", onChange: (v) => update({ storeDescription: v }), placeholder: "Detailed store description shown on your public store page\u2026", disabled: busy })] })] }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Policies" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "returnPolicy", label: "Return Policy", type: "textarea", value: draft.returnPolicy ?? "", onChange: (v) => update({ returnPolicy: v }), placeholder: "Describe your return policy\u2026", disabled: busy }), _jsx(FormField, { name: "shippingPolicy", label: "Shipping Policy", type: "textarea", value: draft.shippingPolicy ?? "", onChange: (v) => update({ shippingPolicy: v }), placeholder: "How and when you ship orders\u2026", disabled: busy })] })] }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Contact & Social" }), _jsxs(Stack, { gap: "md", children: [_jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "website", label: "Website", type: "text", value: draft.website ?? "", onChange: (v) => update({ website: v }), placeholder: "https://example.com", disabled: busy }), _jsx(FormField, { name: "location", label: "Location", type: "text", value: draft.location ?? "", onChange: (v) => update({ location: v }), placeholder: "e.g. Mumbai, India", disabled: busy })] }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "twitter", label: "Twitter / X URL", type: "text", value: draft.socialLinks?.twitter ?? "", onChange: (v) => updateSocial("twitter", v), placeholder: "https://twitter.com/...", disabled: busy }), _jsx(FormField, { name: "instagram", label: "Instagram URL", type: "text", value: draft.socialLinks?.instagram ?? "", onChange: (v) => updateSocial("instagram", v), placeholder: "https://instagram.com/...", disabled: busy })] }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "facebook", label: "Facebook URL", type: "text", value: draft.socialLinks?.facebook ?? "", onChange: (v) => updateSocial("facebook", v), placeholder: "https://facebook.com/...", disabled: busy }), _jsx(FormField, { name: "linkedin", label: "LinkedIn URL", type: "text", value: draft.socialLinks?.linkedin ?? "", onChange: (v) => updateSocial("linkedin", v), placeholder: "https://linkedin.com/...", disabled: busy })] })] })] }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Vacation Mode" }), _jsxs(Stack, { gap: "md", children: [_jsx(Toggle, { checked: !!draft.isVacationMode, onChange: (checked) => update({ isVacationMode: checked }), label: "Enable vacation mode \u2014 your store will show a notice to buyers", disabled: busy }), draft.isVacationMode && (_jsx(FormField, { name: "vacationMessage", label: "Vacation Message", type: "textarea", value: draft.vacationMessage ?? "", onChange: (v) => update({ vacationMessage: v }), placeholder: "I'm away until\u2026 Orders placed now will ship when I return.", disabled: busy }))] })] }), _jsxs("section", { children: [_jsx(Heading, { level: 3, className: "mb-4", children: "Visibility" }), _jsx(Toggle, { checked: draft.isPublic !== false, onChange: (checked) => update({ isPublic: checked }), label: "Make store public \u2014 visible to all buyers", disabled: busy }), draft.isPublic === false && (_jsx(Text, { className: "mt-2 text-sm text-[var(--appkit-color-text-muted)]", children: "Your store is hidden. Existing orders are unaffected." }))] }), _jsxs("div", { className: "flex items-center justify-end gap-3 pt-2 border-t border-[var(--appkit-color-border)]", children: [isDirty && !saving && (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: "You have unsaved changes." })), _jsx(Button, { variant: "primary", onClick: handleSave, disabled: busy || !isDirty, isLoading: saving, children: "Save Changes" })] })] }, "profile"),
         ] }));
 }

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

@@ -11,8 +11,14 @@ export { SellerOrdersView } from "./SellerOrdersView";
 export type { SellerOrdersViewProps } from "./SellerOrdersView";
 export { SellerOffersView } from "./SellerOffersView";
 export type { SellerOffersViewProps } from "./SellerOffersView";
+export { SellerOffersPanel } from "./SellerOffersPanel";
+export type { SellerOffersPanelProps, SellerOfferAction } from "./SellerOffersPanel";
 export { SellerCouponsView } from "./SellerCouponsView";
 export type { SellerCouponsViewProps } from "./SellerCouponsView";
+export { SellerCouponEditorView } from "./SellerCouponEditorView";
+export type { SellerCouponEditorViewProps, CouponEditorDraft } from "./SellerCouponEditorView";
+export { SellerBidsView } from "./SellerBidsView";
+export type { SellerBidsViewProps } from "./SellerBidsView";
 export { SellersListView } from "./SellersListView";
 export type { SellersListViewProps } from "./SellersListView";
 export { SellerPayoutsView } from "./SellerPayoutsView";
@@ -29,21 +35,27 @@ export { SellerCreateProductView } from "./SellerCreateProductView";
 export type { SellerCreateProductViewProps } from "./SellerCreateProductView";
 export { SellerEditProductView } from "./SellerEditProductView";
 export type { SellerEditProductViewProps } from "./SellerEditProductView";
+export { SellerProductShell } from "./SellerProductShell";
+export type { SellerProductShellProps, SellerProductDraft, ProductListingMode } from "./SellerProductShell";
 export { SellerStoreSetupView } from "./SellerStoreSetupView";
 export type { SellerStoreSetupViewProps } from "./SellerStoreSetupView";
 export { SellerStoreView } from "./SellerStoreView";
 export type { SellerStoreViewProps } from "./SellerStoreView";
 export { SellerStorefrontView } from "./SellerStorefrontView";
-export type { SellerStorefrontViewProps } from "./SellerStorefrontView";
+export type { SellerStorefrontViewProps, StorefrontDraft } from "./SellerStorefrontView";
 export { SellerShippingView } from "./SellerShippingView";
 export type { SellerShippingViewProps } from "./SellerShippingView";
 export { SellerAddressesView } from "./SellerAddressesView";
 export type { SellerAddressesViewProps } from "./SellerAddressesView";
 export { SellerGuideView } from "./SellerGuideView";
 export type { SellerGuideViewProps } from "./SellerGuideView";
+export { SellerReviewsView } from "./SellerReviewsView";
+export type { SellerReviewsViewProps } from "./SellerReviewsView";
+export { SellerPayoutRequestView } from "./SellerPayoutRequestView";
+export type { SellerPayoutRequestViewProps } from "./SellerPayoutRequestView";
 export * from "./analytics";
 export { StoreSidebar } from "./SellerSidebar";
-export type { StoreNavItem } from "./SellerSidebar";
+export type { StoreNavItem, StoreNavGroup } from "./SellerSidebar";
 export { SellerDashboardView as StoreDashboardView } from "./SellerDashboardView";
 export type { SellerDashboardViewProps as StoreDashboardViewProps } from "./SellerDashboardView";
 export { SellerProductsView as StoreProductListingsView } from "./SellerProductsView";
@@ -72,3 +84,5 @@ export { SellerShippingView as StoreShippingView } from "./SellerShippingView";
 export type { SellerShippingViewProps as StoreShippingViewProps } from "./SellerShippingView";
 export { SellerAddressesView as StoreAddressesView } from "./SellerAddressesView";
 export type { SellerAddressesViewProps as StoreAddressesViewProps } from "./SellerAddressesView";
+export { SellerBidsView as StoreBidsView } from "./SellerBidsView";
+export type { SellerBidsViewProps as StoreBidsViewProps } from "./SellerBidsView";

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

@@ -5,7 +5,10 @@ export { SellerProductsView } from "./SellerProductsView";
 export { SellerAuctionsView } from "./SellerAuctionsView";
 export { SellerOrdersView } from "./SellerOrdersView";
 export { SellerOffersView } from "./SellerOffersView";
+export { SellerOffersPanel } from "./SellerOffersPanel";
 export { SellerCouponsView } from "./SellerCouponsView";
+export { SellerCouponEditorView } from "./SellerCouponEditorView";
+export { SellerBidsView } from "./SellerBidsView";
 export { SellersListView } from "./SellersListView";
 export { SellerPayoutsView } from "./SellerPayoutsView";
 export { SellerPayoutStats } from "./SellerPayoutStats";
@@ -14,12 +17,15 @@ export { SellerPayoutSettingsView } from "./SellerPayoutSettingsView";
 export { SellerAnalyticsView } from "./SellerAnalyticsView";
 export { SellerCreateProductView } from "./SellerCreateProductView";
 export { SellerEditProductView } from "./SellerEditProductView";
+export { SellerProductShell } from "./SellerProductShell";
 export { SellerStoreSetupView } from "./SellerStoreSetupView";
 export { SellerStoreView } from "./SellerStoreView";
 export { SellerStorefrontView } from "./SellerStorefrontView";
 export { SellerShippingView } from "./SellerShippingView";
 export { SellerAddressesView } from "./SellerAddressesView";
 export { SellerGuideView } from "./SellerGuideView";
+export { SellerReviewsView } from "./SellerReviewsView";
+export { SellerPayoutRequestView } from "./SellerPayoutRequestView";
 export * from "./analytics";
 // Store* aliases — same components, renamed for store-centric terminology
 export { StoreSidebar } from "./SellerSidebar";
@@ -38,3 +44,4 @@ export { SellerEditProductView as StoreEditProductView } from "./SellerEditProdu
 export { SellerStoreView as StoreStorefrontView } from "./SellerStoreView";
 export { SellerShippingView as StoreShippingView } from "./SellerShippingView";
 export { SellerAddressesView as StoreAddressesView } from "./SellerAddressesView";
+export { SellerBidsView as StoreBidsView } from "./SellerBidsView";

package/dist/features/seller/hooks/useSellerListingData.d.ts

@@ -8,6 +8,7 @@ interface UseSellerListingDataOptions<TResponse, TRow extends {
     pageSize?: number;
     sorts?: string;
     filters?: string;
+    q?: string;
     mapRows: (response: TResponse) => TRow[];
     getTotal?: (response: TResponse, rows: TRow[]) => number;
 }
@@ -18,10 +19,11 @@ export interface UseSellerListingDataResult<TRow extends {
     total: number;
     isLoading: boolean;
     errorMessage?: string;
+    refetch: () => void;
 }
 export declare function useSellerListingData<TResponse, TRow extends {
     id: string;
-}>({ queryKey, endpoint, page, pageSize, sorts, filters, mapRows, getTotal, }: UseSellerListingDataOptions<TResponse, TRow>): UseSellerListingDataResult<TRow>;
+}>({ queryKey, endpoint, page, pageSize, sorts, filters, q, mapRows, getTotal, }: UseSellerListingDataOptions<TResponse, TRow>): UseSellerListingDataResult<TRow>;
 export declare function toRecordArray(value: unknown): UnknownRecord[];
 export declare function toStringValue(value: unknown, fallback?: string): string;
 export declare function toRupees(value: unknown): string;

package/dist/features/seller/hooks/useSellerListingData.js

@@ -6,17 +6,18 @@ function withQueryParams(endpoint, params) {
     const query = new URLSearchParams(params).toString();
     return `${endpoint}${hasQuery ? "&" : "?"}${query}`;
 }
-export function useSellerListingData({ queryKey, endpoint, page = 1, pageSize = 25, sorts = "-createdAt", filters = "", mapRows, getTotal, }) {
+export function useSellerListingData({ queryKey, endpoint, page = 1, pageSize = 25, sorts = "-createdAt", filters = "", q, mapRows, getTotal, }) {
     const params = {
         page: String(page),
         pageSize: String(pageSize),
         sorts,
     };
-    if (filters) {
+    if (filters)
         params.filters = filters;
-    }
+    if (q)
+        params.q = q;
     const query = useQuery({
-        queryKey: [...queryKey, page, pageSize, sorts, filters],
+        queryKey: [...queryKey, page, pageSize, sorts, filters, q ?? ""],
         queryFn: () => apiClient.get(withQueryParams(endpoint, params)),
         staleTime: 60000,
     });
@@ -33,6 +34,7 @@ export function useSellerListingData({ queryKey, endpoint, page = 1, pageSize =
             : query.error
                 ? "Unable to load records"
                 : undefined,
+        refetch: query.refetch,
     };
 }
 export function toRecordArray(value) {

package/dist/features/seller/repository/offer.repository.d.ts

@@ -24,7 +24,7 @@ declare class OfferRepository extends BaseRepository<OfferDocument> {
             readonly canFilter: true;
             readonly canSort: false;
         };
-        readonly sellerId: {
+        readonly storeId: {
             readonly canFilter: true;
             readonly canSort: false;
         };
@@ -35,8 +35,8 @@ declare class OfferRepository extends BaseRepository<OfferDocument> {
     };
     create(input: OfferCreateInput): Promise<OfferDocument>;
     findByBuyer(buyerUid: string, model?: SieveModel): Promise<FirebaseSieveResult<OfferDocument>>;
-    findBySeller(sellerId: string, model?: SieveModel): Promise<FirebaseSieveResult<OfferDocument>>;
-    findPendingBySeller(sellerId: string): Promise<OfferDocument[]>;
+    findByStore(storeId: string, model?: SieveModel): Promise<FirebaseSieveResult<OfferDocument>>;
+    findPendingByStore(storeId: string): Promise<OfferDocument[]>;
     /** Returns all pending or countered offers past their expiresAt — used by expiry sweep job */
     findExpired(): Promise<OfferDocument[]>;
     /**

package/dist/features/seller/repository/offer.repository.js

@@ -63,14 +63,14 @@ class OfferRepository extends BaseRepository {
             hasMore: false,
         };
     }
-    async findBySeller(sellerId, model) {
+    async findByStore(storeId, model) {
         if (model) {
             return this.sieveQuery(model, OfferRepository.SIEVE_FIELDS, {
-                baseQuery: this.getCollection().where(OFFER_FIELDS.SELLER_ID, "==", sellerId),
+                baseQuery: this.getCollection().where(OFFER_FIELDS.STORE_ID, "==", storeId),
             });
         }
         const snap = await this.getCollection()
-            .where(OFFER_FIELDS.SELLER_ID, "==", sellerId)
+            .where(OFFER_FIELDS.STORE_ID, "==", storeId)
             .orderBy(OFFER_FIELDS.CREATED_AT, "desc")
             .get();
         const items = snap.docs.map((d) => this.mapDoc(d));
@@ -83,9 +83,9 @@ class OfferRepository extends BaseRepository {
             hasMore: false,
         };
     }
-    async findPendingBySeller(sellerId) {
+    async findPendingByStore(storeId) {
         const snap = await this.getCollection()
-            .where(OFFER_FIELDS.SELLER_ID, "==", sellerId)
+            .where(OFFER_FIELDS.STORE_ID, "==", storeId)
             .where(OFFER_FIELDS.STATUS, "==", "pending")
             .orderBy(OFFER_FIELDS.CREATED_AT, "asc")
             .get();
@@ -203,7 +203,7 @@ OfferRepository.SIEVE_FIELDS = {
     status: { canFilter: true, canSort: false },
     productId: { canFilter: true, canSort: false },
     buyerUid: { canFilter: true, canSort: false },
-    sellerId: { canFilter: true, canSort: false },
+    storeId: { canFilter: true, canSort: false },
     createdAt: { canFilter: false, canSort: true },
 };
 export const offerRepository = new OfferRepository();

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

@@ -22,8 +22,8 @@ export interface OfferDocument {
     buyerUid: string;
     buyerName: string;
     buyerEmail: string;
-    sellerId: string;
-    sellerName: string;
+    storeId: string;
+    storeName: string;
     offerAmount: number;
     listedPrice: number;
     counterAmount?: number;
@@ -39,7 +39,7 @@ export interface OfferDocument {
     updatedAt: Date;
 }
 export declare const OFFER_COLLECTION: "offers";
-export declare const OFFER_INDEXED_FIELDS: readonly ["buyerUid", "sellerId", "productId", "status", "createdAt", "expiresAt"];
+export declare const OFFER_INDEXED_FIELDS: readonly ["buyerUid", "storeId", "productId", "status", "createdAt", "expiresAt"];
 export declare const OFFER_FIELDS: {
     readonly ID: "id";
     readonly PRODUCT_ID: "productId";
@@ -47,8 +47,8 @@ export declare const OFFER_FIELDS: {
     readonly BUYER_UID: "buyerUid";
     readonly BUYER_NAME: "buyerName";
     readonly BUYER_EMAIL: "buyerEmail";
-    readonly SELLER_ID: "sellerId";
-    readonly SELLER_NAME: "sellerName";
+    readonly STORE_ID: "storeId";
+    readonly STORE_NAME: "storeName";
     readonly OFFER_AMOUNT: "offerAmount";
     readonly LISTED_PRICE: "listedPrice";
     readonly COUNTER_AMOUNT: "counterAmount";
@@ -63,11 +63,11 @@ export declare const OFFER_FIELDS: {
     readonly CREATED_AT: "createdAt";
     readonly UPDATED_AT: "updatedAt";
 };
-export type OfferCreateInput = Pick<OfferDocument, "productId" | "productTitle" | "productSlug" | "productImageUrl" | "buyerUid" | "buyerName" | "buyerEmail" | "sellerId" | "sellerName" | "offerAmount" | "listedPrice" | "currency" | "buyerNote">;
+export type OfferCreateInput = Pick<OfferDocument, "productId" | "productTitle" | "productSlug" | "productImageUrl" | "buyerUid" | "buyerName" | "buyerEmail" | "storeId" | "storeName" | "offerAmount" | "listedPrice" | "currency" | "buyerNote">;
 export type OfferUpdateInput = Partial<Pick<OfferDocument, "status" | "counterAmount" | "lockedPrice" | "sellerNote" | "acceptedAt" | "respondedAt" | "updatedAt">>;
 export declare const offerQueryHelpers: {
     readonly byBuyer: (buyerUid: string) => readonly ["buyerUid", "==", string];
-    readonly bySeller: (sellerId: string) => readonly ["sellerId", "==", string];
+    readonly byStore: (storeId: string) => readonly ["storeId", "==", string];
     readonly byProduct: (productId: string) => readonly ["productId", "==", string];
     readonly byStatus: (status: OfferStatus) => readonly ["status", "==", OfferStatus];
     readonly pending: () => readonly ["status", "==", "pending"];

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

@@ -15,7 +15,7 @@ export const OfferStatusValues = {
 export const OFFER_COLLECTION = "offers";
 export const OFFER_INDEXED_FIELDS = [
     "buyerUid",
-    "sellerId",
+    "storeId",
     "productId",
     "status",
     "createdAt",
@@ -28,8 +28,8 @@ export const OFFER_FIELDS = {
     BUYER_UID: "buyerUid",
     BUYER_NAME: "buyerName",
     BUYER_EMAIL: "buyerEmail",
-    SELLER_ID: "sellerId",
-    SELLER_NAME: "sellerName",
+    STORE_ID: "storeId",
+    STORE_NAME: "storeName",
     OFFER_AMOUNT: "offerAmount",
     LISTED_PRICE: "listedPrice",
     COUNTER_AMOUNT: "counterAmount",
@@ -46,7 +46,7 @@ export const OFFER_FIELDS = {
 };
 export const offerQueryHelpers = {
     byBuyer: (buyerUid) => ["buyerUid", "==", buyerUid],
-    bySeller: (sellerId) => ["sellerId", "==", sellerId],
+    byStore: (storeId) => ["storeId", "==", storeId],
     byProduct: (productId) => ["productId", "==", productId],
     byStatus: (status) => ["status", "==", status],
     pending: () => ["status", "==", "pending"],