@mohasinac/appkit 2.7.50 → 2.7.53

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

@@ -0,0 +1,113 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Plus } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
+import { BulkActionBar, Button, DataTable, Div, ListingToolbar, Pagination, Text, } from "../../../ui";
+import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
+import { ROUTES } from "../../..";
+import { toRecordArray, toRelativeDate, toRupees, toStringValue, useSellerListingData, } from "../hooks/useSellerListingData";
+import { TABLE_KEYS } from "../../../constants/table-keys";
+const PAGE_SIZE = 25;
+const DEFAULT_SORT = "-createdAt";
+const SORT_OPTIONS = [
+    { value: "-createdAt", label: "Newest" },
+    { value: "createdAt", label: "Oldest" },
+    { value: "productTitle", label: "Name A–Z" },
+    { value: "price", label: "Price: Low–High" },
+    { value: "-price", label: "Price: High–Low" },
+];
+const COLUMNS = [
+    {
+        key: "title",
+        header: "Item",
+        render: (row) => (_jsxs(Div, { children: [_jsx(Text, { className: "text-sm font-medium", children: row.title }), row.species && (_jsx(Text, { className: "text-xs text-[var(--appkit-color-text-muted)] italic", children: row.species }))] })),
+    },
+    {
+        key: "price",
+        header: "Price",
+        render: (row) => _jsx(Text, { className: "text-sm tabular-nums", children: row.price }),
+    },
+    {
+        key: "ageMonths",
+        header: "Age",
+        render: (row) => (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.ageMonths !== null ? `${row.ageMonths}mo` : "—" })),
+    },
+    {
+        key: "vendorVerified",
+        header: "Verified",
+        render: (row) => (_jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ${row.vendorVerified
+                ? "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300"
+                : "bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-300"}`, children: row.vendorVerified ? "Verified" : "Pending" })),
+    },
+    {
+        key: "status",
+        header: "Status",
+        render: (row) => (_jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium capitalize ${row.status === "active"
+                ? "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300"
+                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.status })),
+    },
+    {
+        key: "createdAt",
+        header: "Listed",
+        render: (row) => _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.createdAt }),
+    },
+];
+export function SellerLiveView({ onCreateClick, onBulkDelete, }) {
+    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get(TABLE_KEYS.QUERY) || "");
+    const [view] = useState("table");
+    const commitSearch = useCallback(() => {
+        table.set(TABLE_KEYS.QUERY, searchInput.trim());
+    }, [searchInput, table]);
+    const resetAll = useCallback(() => {
+        table.setMany({ [TABLE_KEYS.QUERY]: "", [TABLE_KEYS.SORT]: "" });
+        setSearchInput("");
+    }, [table]);
+    const hasActiveState = !!table.get(TABLE_KEYS.QUERY) || table.get(TABLE_KEYS.SORT) !== DEFAULT_SORT;
+    const { rows, total, isLoading, errorMessage } = useSellerListingData({
+        queryKey: ["seller", "live-items"],
+        endpoint: SELLER_ENDPOINTS.PRODUCTS,
+        page: table.getNumber(TABLE_KEYS.PAGE, 1),
+        pageSize: PAGE_SIZE,
+        sorts: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT,
+        filters: "listingType==live",
+        q: table.get(TABLE_KEYS.QUERY) || undefined,
+        mapRows: (response) => toRecordArray(response.products).map((item, index) => {
+            const live = (item.liveItem ?? {});
+            return {
+                id: toStringValue(item.id, `live-${index}`),
+                raw: item,
+                title: toStringValue(item.productTitle ?? item.title, "Untitled"),
+                price: toRupees(item.price),
+                species: toStringValue(live.species, ""),
+                ageMonths: typeof live.ageMonths === "number" ? live.ageMonths : null,
+                vendorVerified: Boolean(live.vendorVerified),
+                status: toStringValue(item.status, "draft"),
+                createdAt: toRelativeDate(item.createdAt),
+            };
+        }),
+        getTotal: (response, mappedRows) => typeof response.meta?.total === "number" ? response.meta.total : mappedRows.length,
+    });
+    const currentPage = table.getNumber(TABLE_KEYS.PAGE, 1);
+    const totalPages = Math.ceil(total / PAGE_SIZE);
+    const selection = useBulkSelection({ items: rows, keyExtractor: (r) => r.id });
+    const bulkActions = onBulkDelete
+        ? [{
+                id: "bulk-delete",
+                label: "Delete selected",
+                variant: "danger",
+                onClick: async () => { await onBulkDelete(selection.selectedIds); selection.clearSelection(); },
+            }]
+        : [];
+    const handleCreate = useCallback(() => {
+        if (onCreateClick) {
+            onCreateClick();
+        }
+        else {
+            window.location.href = String(ROUTES.STORE.LIVE_ITEMS_NEW);
+        }
+    }, [onCreateClick]);
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: 0, searchValue: searchInput, searchPlaceholder: "Search live items by name or species...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set(TABLE_KEYS.SORT, v); }, showTableView: true, view: view, onViewChange: () => { }, onResetAll: resetAll, hasActiveState: hasActiveState, extra: _jsxs(Button, { size: "sm", onClick: handleCreate, className: "flex items-center gap-1.5", children: [_jsx(Plus, { className: "h-4 w-4" }), _jsx("span", { children: "New Live Item" })] }) }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), selection.selectedCount > 0 && bulkActions.length > 0 && (_jsx(BulkActionBar, { selectedCount: selection.selectedCount, actions: bulkActions, onClearSelection: selection.clearSelection })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx(Div, { className: "mb-4 rounded-xl border border-red-200 bg-red-50 dark:bg-red-950/40 dark:border-red-900/60 px-4 py-3 text-sm text-red-700 dark:text-red-200", children: errorMessage })), isLoading ? (_jsx(Div, { className: "space-y-2", children: Array.from({ length: 5 }).map((_, i) => (_jsx(Div, { className: "h-14 animate-pulse rounded-xl border border-zinc-100 dark:border-slate-700 bg-zinc-50 dark:bg-slate-800" }, i))) })) : rows.length === 0 ? (_jsx(Div, { className: "py-16 text-center", children: _jsx(Text, { className: "text-zinc-400 dark:text-zinc-500", children: "No live items yet \u2014 list animals, plants, or other living specimens" }) })) : (_jsx(DataTable, { columns: COLUMNS, data: rows, keyExtractor: (r) => r.id, selectable: bulkActions.length > 0, selectedIds: selection.selectedIds, onSelectionChange: (ids) => selection.setSelectedIds(ids) }))] })] }));
+}

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useState, useCallback } from "react";
-import { X, Eye, Printer, MapPin } from "lucide-react";
+import { X, Eye, Printer, MapPin, Truck } from "lucide-react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
 import { useActionDispatch } from "../../../react/hooks/use-action-dispatch";
@@ -34,8 +34,11 @@ const STATUS_BADGE_VARIANT = {
 };
 const UPDATE_STATUS_OPTIONS = [
     { value: "", label: "— keep current —" },
+    { value: "confirmed", label: "Confirmed" },
     { value: "processing", label: "Processing" },
     { value: "shipped", label: "Shipped" },
+    { value: "delivered", label: "Delivered" },
+    { value: "cancelled", label: "Cancelled" },
 ];
 // ---------------------------------------------------------------------------
 // Order Detail Drawer
@@ -225,7 +228,20 @@ export function SellerOrdersView({ orderDetailApiBase = SELLER_ENDPOINTS.ORDERS,
             render: (row) => _jsx("span", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: row.updatedAt }),
         },
     ];
-    const renderRowActions = useCallback((row) => (_jsx("button", { type: "button", onClick: () => setSelectedOrderId(row.id), title: "View order details", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 hover:text-zinc-700 dark:hover:text-zinc-300 transition-colors", children: _jsx(Eye, { className: "h-4 w-4" }) })), []);
+    const handleQuickShip = useCallback(async (row, e) => {
+        e.stopPropagation();
+        const res = await fetch(`${orderDetailApiBase}/${row.id}`, {
+            method: "PATCH",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ status: "shipped" }),
+        }).catch(() => null);
+        if (res?.ok)
+            setSelectedOrderId(null);
+    }, [orderDetailApiBase]);
+    const renderRowActions = useCallback((row) => {
+        const isShippable = ["PENDING", "PROCESSING", "CONFIRMED"].includes(row.status?.toUpperCase() ?? "");
+        return (_jsxs("div", { className: "flex items-center gap-1", children: [isShippable && (_jsx(Button, { variant: "ghost", size: "sm", onClick: (e) => void handleQuickShip(row, e), "aria-label": "Mark as shipped", title: "Mark shipped", children: _jsx(Truck, { className: "h-4 w-4" }) })), _jsx(Button, { variant: "ghost", size: "sm", onClick: (e) => { e.stopPropagation(); setSelectedOrderId(row.id); }, title: "View order details", "aria-label": "View order details", children: _jsx(Eye, { className: "h-4 w-4" }) })] }));
+    }, [handleQuickShip]);
     const selection = useBulkSelection({ items: rows, keyExtractor: (r) => r.id });
     const handlePrintPackingSlips = useCallback(() => {
         const ids = selection.selectedIds.join(",");

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

@@ -0,0 +1,7 @@
+export interface SellerPayoutMethodsViewProps {
+    onCreateClick?: () => void;
+    onEditClick?: (id: string) => void;
+    onDelete?: (id: string) => Promise<void>;
+    onSetDefault?: (id: string) => Promise<void>;
+}
+export declare function SellerPayoutMethodsView({ onCreateClick, onEditClick, onDelete, onSetDefault, }: SellerPayoutMethodsViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,120 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Plus } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { Button, ConfirmDeleteModal, Div, ListingToolbar, Text, } from "../../../ui";
+import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
+import { ROUTES } from "../../..";
+import { toRecordArray, toStringValue, useSellerListingData, } from "../hooks/useSellerListingData";
+import { TABLE_KEYS } from "../../../constants/table-keys";
+const PAGE_SIZE = 50;
+const DEFAULT_SORT = "-createdAt";
+const SORT_OPTIONS = [
+    { value: "-createdAt", label: "Newest" },
+    { value: "createdAt", label: "Oldest" },
+    { value: "label", label: "Label A–Z" },
+];
+function getMaskedIdentifier(item) {
+    if (item.upiVpa && typeof item.upiVpa === "string") {
+        return item.upiVpa;
+    }
+    if (item.accountNumber && typeof item.accountNumber === "string") {
+        const acc = item.accountNumber;
+        return `••••${acc.slice(-4)}`;
+    }
+    return "—";
+}
+function TypeBadge({ type }) {
+    return (_jsx("span", { className: "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-semibold uppercase tracking-wide bg-violet-100 text-violet-700 dark:bg-violet-900/40 dark:text-violet-300", children: type === "upi" ? "UPI" : type === "bank" ? "Bank" : type.toUpperCase() }));
+}
+export function SellerPayoutMethodsView({ onCreateClick, onEditClick, onDelete, onSetDefault, }) {
+    const table = useUrlTable({ defaults: { sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get(TABLE_KEYS.QUERY) || "");
+    const [deleteTargetId, setDeleteTargetId] = useState(null);
+    const [deletingId, setDeletingId] = useState(null);
+    const [settingDefaultId, setSettingDefaultId] = useState(null);
+    const commitSearch = useCallback(() => {
+        table.set(TABLE_KEYS.QUERY, searchInput.trim());
+    }, [searchInput, table]);
+    const resetAll = useCallback(() => {
+        table.setMany({ [TABLE_KEYS.QUERY]: "", [TABLE_KEYS.SORT]: "" });
+        setSearchInput("");
+    }, [table]);
+    const hasActiveState = !!table.get(TABLE_KEYS.QUERY) || table.get(TABLE_KEYS.SORT) !== DEFAULT_SORT;
+    const { rows, isLoading, errorMessage, refetch } = useSellerListingData({
+        queryKey: ["seller", "payout-methods"],
+        endpoint: SELLER_ENDPOINTS.PAYOUT_METHODS,
+        page: 1,
+        pageSize: PAGE_SIZE,
+        sorts: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT,
+        q: table.get(TABLE_KEYS.QUERY) || undefined,
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
+            id: toStringValue(item.id, `pm-${index}`),
+            raw: item,
+            label: String(item.label ?? ""),
+            type: String(item.type ?? ""),
+            isDefault: Boolean(item.isDefault),
+            isActive: Boolean(item.isActive),
+            maskedIdentifier: getMaskedIdentifier(item),
+        })),
+    });
+    const handleDelete = useCallback(async (id) => {
+        setDeletingId(id);
+        try {
+            if (onDelete) {
+                await onDelete(id);
+            }
+            else {
+                await fetch(SELLER_ENDPOINTS.PAYOUT_METHOD_BY_ID(id), {
+                    method: "DELETE",
+                    credentials: "include",
+                });
+            }
+            refetch?.();
+        }
+        finally {
+            setDeletingId(null);
+            setDeleteTargetId(null);
+        }
+    }, [onDelete, refetch]);
+    const handleSetDefault = useCallback(async (id) => {
+        setSettingDefaultId(id);
+        try {
+            if (onSetDefault) {
+                await onSetDefault(id);
+            }
+            else {
+                await fetch(SELLER_ENDPOINTS.PAYOUT_METHOD_BY_ID(id), {
+                    method: "PATCH",
+                    headers: { "Content-Type": "application/json" },
+                    credentials: "include",
+                    body: JSON.stringify({ isDefault: true }),
+                });
+            }
+            refetch?.();
+        }
+        finally {
+            setSettingDefaultId(null);
+        }
+    }, [onSetDefault, refetch]);
+    const handleCreate = useCallback(() => {
+        if (onCreateClick) {
+            onCreateClick();
+        }
+        else {
+            window.location.href = String(ROUTES.STORE.PAYOUT_METHODS_NEW);
+        }
+    }, [onCreateClick]);
+    const handleEdit = useCallback((id) => {
+        if (onEditClick) {
+            onEditClick(id);
+        }
+        else {
+            window.location.href = String(ROUTES.STORE.PAYOUT_METHODS_EDIT(id));
+        }
+    }, [onEditClick]);
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: 0, searchValue: searchInput, searchPlaceholder: "Search payout methods...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set(TABLE_KEYS.SORT, v); }, onResetAll: resetAll, hasActiveState: hasActiveState, extra: _jsxs(Button, { size: "sm", onClick: handleCreate, className: "flex items-center gap-1.5", children: [_jsx(Plus, { className: "h-4 w-4" }), _jsx("span", { children: "New Method" })] }) }), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx(Div, { className: "mb-4 rounded-xl border border-red-200 bg-red-50 dark:bg-red-950/40 dark:border-red-900/60 px-4 py-3 text-sm text-red-700 dark:text-red-200", children: errorMessage })), isLoading ? (_jsx(Div, { className: "space-y-3", children: Array.from({ length: 3 }).map((_, i) => (_jsx(Div, { className: "h-20 animate-pulse rounded-xl border border-zinc-100 dark:border-slate-700 bg-zinc-50 dark:bg-slate-800" }, i))) })) : rows.length === 0 ? (_jsxs(Div, { className: "py-16 text-center", children: [_jsx(Text, { className: "text-zinc-400 dark:text-zinc-500", children: "No payout methods yet \u2014 add a UPI VPA or bank account to receive payouts" }), _jsx("div", { className: "mt-4", children: _jsx(Button, { size: "sm", onClick: handleCreate, children: "Add payout method" }) })] })) : (_jsx("div", { className: "space-y-3", children: rows.map((row) => (_jsx("div", { className: "rounded-xl border border-zinc-200 dark:border-slate-700 bg-white dark:bg-slate-900 px-4 py-3", children: _jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsx("div", { className: "flex items-start gap-3 min-w-0", children: _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx(Text, { className: "text-sm font-medium", children: row.label }), _jsx(TypeBadge, { type: row.type }), row.isDefault && (_jsx("span", { className: "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300", children: "Default" })), _jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ${row.isActive
+                                                                ? "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300"
+                                                                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.isActive ? "Active" : "Inactive" })] }), _jsx(Text, { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400 font-mono", children: row.maskedIdentifier })] }) }), _jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [!row.isDefault && (_jsx(Button, { size: "sm", variant: "ghost", isLoading: settingDefaultId === row.id, onClick: () => handleSetDefault(row.id), children: "Set Default" })), _jsx(Button, { size: "sm", variant: "outline", onClick: () => handleEdit(row.id), children: "Edit" }), _jsx(Button, { size: "sm", variant: "danger", disabled: deletingId === row.id, onClick: () => setDeleteTargetId(row.id), children: "Delete" })] })] }) }, row.id))) }))] }), deleteTargetId && (_jsx(ConfirmDeleteModal, { isOpen: true, title: "Delete Payout Method", message: "Are you sure you want to delete this payout method? This cannot be undone.", onConfirm: () => handleDelete(deleteTargetId), onClose: () => setDeleteTargetId(null), isDeleting: deletingId === deleteTargetId }))] }));
+}

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

@@ -1,8 +1,9 @@
 "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, FormGroup, Heading, Section, Stack, Text } from "../../../ui";
+import { Alert, Badge, Div, FormField, FormGroup, Heading, Stack, Text, Toggle } from "../../../ui";
 import { StackedViewShell } from "../../../ui";
+import { StepForm } from "../../shell";
 const DEFAULT_DRAFT = {
     method: "upi",
     upiId: "",
@@ -11,6 +12,11 @@ const DEFAULT_DRAFT = {
     ifscCode: "",
     bankName: "",
     accountType: "savings",
+    gstin: "",
+    pan: "",
+    businessType: "",
+    autoPayout: true,
+    minimumThreshold: "",
 };
 export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings" }) {
     const [draft, setDraft] = useState(DEFAULT_DRAFT);
@@ -19,6 +25,7 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
     const [saving, setSaving] = useState(false);
     const [error, setError] = useState(null);
     const [success, setSuccess] = useState(false);
+    const [currentStep, setCurrentStep] = useState(0);
     useEffect(() => {
         fetch(apiBase)
             .then((r) => r.json())
@@ -33,13 +40,20 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
                 ifscCode: details.bankAccount?.ifscCode ?? "",
                 bankName: details.bankAccount?.bankName ?? "",
                 accountType: details.bankAccount?.accountType ?? "savings",
+                gstin: res?.data?.taxInfo?.gstin ?? "",
+                pan: res?.data?.taxInfo?.pan ?? "",
+                businessType: res?.data?.taxInfo?.businessType ?? "",
+                autoPayout: res?.data?.preferences?.autoPayout ?? true,
+                minimumThreshold: res?.data?.preferences?.minimumThreshold
+                    ? String(res.data.preferences.minimumThreshold / 100)
+                    : "",
             });
         })
             .catch(() => { })
             .finally(() => setLoading(false));
     }, [apiBase]);
-    const update = useCallback((key, value) => {
-        setDraft((prev) => ({ ...prev, [key]: value }));
+    const update = useCallback((partial) => {
+        setDraft((prev) => ({ ...prev, ...partial }));
         setSuccess(false);
     }, []);
     const handleSave = async () => {
@@ -47,7 +61,7 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
         setSuccess(false);
         setSaving(true);
         try {
-            const body = draft.method === "upi"
+            const methodFields = draft.method === "upi"
                 ? { method: "upi", upiId: draft.upiId.trim() }
                 : {
                     method: "bank_transfer",
@@ -57,6 +71,18 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
                     bankName: draft.bankName.trim(),
                     accountType: draft.accountType,
                 };
+            const body = {
+                ...methodFields,
+                taxInfo: {
+                    gstin: draft.gstin.trim(),
+                    pan: draft.pan.trim(),
+                    businessType: draft.businessType.trim(),
+                },
+                preferences: {
+                    autoPayout: draft.autoPayout,
+                    minimumThreshold: Math.round(parseFloat(draft.minimumThreshold || "0") * 100),
+                },
+            };
             const res = await fetch(apiBase, {
                 method: "PATCH",
                 headers: { "Content-Type": "application/json" },
@@ -68,7 +94,6 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
             setSuccess(true);
             const updated = json?.data?.payoutDetails ?? { method: draft.method, isConfigured: false };
             setCurrent(updated);
-            // clear sensitive field
             setDraft((prev) => ({ ...prev, accountNumber: "" }));
         }
         catch (err) {
@@ -78,14 +103,27 @@ export function SellerPayoutSettingsView({ apiBase = "/api/store/payout-settings
             setSaving(false);
         }
     };
-    const isUpi = draft.method === "upi";
     const busy = loading || saving;
-    return (_jsx(StackedViewShell, { portal: "seller", title: "Payout Settings", sections: [
-            _jsxs(Stack, { gap: "lg", children: [current && (_jsx(Div, { className: "flex items-center gap-2", children: _jsx(Badge, { variant: current.isConfigured ? "success" : "warning", children: current.isConfigured ? "Payout configured" : "Not configured" }) })), error && _jsx(Alert, { variant: "error", children: error }), success && _jsx(Alert, { variant: "success", children: "Payout details saved." }), current?.isConfigured && (_jsx(Alert, { variant: "info", children: current.method === "upi"
+    const steps = [
+        {
+            label: "Payout Method",
+            render: ({ values, onChange }) => (_jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 3, className: "mb-2", children: "Payout Method" }), current && (_jsx(Div, { className: "flex items-center gap-2 mb-2", children: _jsx(Badge, { variant: current.isConfigured ? "success" : "warning", children: current.isConfigured ? "Payout configured" : "Not configured" }) })), current?.isConfigured && (_jsx(Alert, { variant: "info", children: current.method === "upi"
                             ? `Current UPI: ${current.upiId}`
-                            : `Current bank: ${current.bankAccount?.bankName ?? ""} — ••••${current.bankAccount?.accountNumberMasked?.slice(-4) ?? "••••"} (${current.bankAccount?.accountType})` })), _jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Payout Method" }), _jsx(Stack, { gap: "sm", children: ([
-                                    { value: "upi", label: "UPI", desc: "Instant payouts via UPI VPA (e.g. name@upi)." },
-                                    { value: "bank_transfer", label: "Bank Transfer", desc: "NEFT/RTGS to your bank account within 2–3 business days." },
-                                ]).map(({ value, label, desc }) => (_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: "payoutMethod", value: value, checked: draft.method === value, onChange: () => update("method", value), className: "accent-[var(--appkit-color-primary)]", disabled: busy }), _jsxs(Div, { children: [_jsx(Text, { className: "font-medium", children: label }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: desc })] })] }, value))) })] }), isUpi && (_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "UPI Details" }), _jsx(FormField, { name: "upiId", label: "UPI ID (VPA)", type: "text", value: draft.upiId, onChange: (v) => update("upiId", v), placeholder: "yourname@upi", helpText: "Ensure this VPA is registered and active.", disabled: busy })] })), !isUpi && (_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Bank Account Details" }), _jsxs(Stack, { gap: "md", children: [_jsx(FormField, { name: "accountHolderName", label: "Account Holder Name", type: "text", value: draft.accountHolderName, onChange: (v) => update("accountHolderName", v), placeholder: "Name as on bank account", disabled: busy }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "accountNumber", label: "Account Number", type: "text", value: draft.accountNumber, onChange: (v) => update("accountNumber", v), placeholder: "Enter full account number", helpText: current?.bankAccount ? `Saved: ••••${current.bankAccount.accountNumberMasked?.slice(-4) ?? "••••"}` : "Stored securely, never displayed in full.", disabled: busy }), _jsx(FormField, { name: "ifscCode", label: "IFSC Code", type: "text", value: draft.ifscCode, onChange: (v) => update("ifscCode", v.toUpperCase()), placeholder: "e.g. SBIN0001234", disabled: busy })] }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "bankName", label: "Bank Name", type: "text", value: draft.bankName, onChange: (v) => update("bankName", v), placeholder: "e.g. State Bank of India", disabled: busy }), _jsxs(Div, { children: [_jsx(Text, { className: "text-sm font-medium mb-1.5", children: "Account Type" }), _jsx(Stack, { gap: "xs", className: "flex-row", children: ["savings", "current"].map((t) => (_jsxs("label", { className: "flex items-center gap-2 cursor-pointer", children: [_jsx("input", { type: "radio", name: "accountType", value: t, checked: draft.accountType === t, onChange: () => update("accountType", t), className: "accent-[var(--appkit-color-primary)]", disabled: busy }), _jsx(Text, { className: "capitalize text-sm", children: t })] }, t))) })] })] })] })] })), _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 Payout Details" }) })] }, "payout"),
+                            : `Current bank: ${current.bankAccount?.bankName ?? ""} — ••••${current.bankAccount?.accountNumberMasked?.slice(-4) ?? "••••"} (${current.bankAccount?.accountType})` })), _jsx(Stack, { gap: "sm", children: ([
+                            { value: "upi", label: "UPI", desc: "Instant payouts via UPI VPA (e.g. name@upi)." },
+                            { value: "bank_transfer", label: "Bank Transfer", desc: "NEFT/RTGS to your bank account within 2–3 business days." },
+                        ]).map(({ value, label, desc }) => (_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: "payoutMethod", value: value, checked: values.method === value, onChange: () => onChange({ method: value }), className: "accent-[var(--appkit-color-primary)]", disabled: busy }), _jsxs(Div, { children: [_jsx(Text, { className: "font-medium", children: label }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: desc })] })] }, value))) }), values.method === "upi" && (_jsx(FormField, { name: "upiId", label: "UPI ID (VPA)", type: "text", value: values.upiId, onChange: (v) => onChange({ upiId: v }), placeholder: "yourname@upi", helpText: "Ensure this VPA is registered and active.", disabled: busy })), values.method === "bank_transfer" && (_jsxs(Stack, { gap: "md", className: "mt-2", children: [_jsx(FormField, { name: "accountHolderName", label: "Account Holder Name", type: "text", value: values.accountHolderName, onChange: (v) => onChange({ accountHolderName: v }), placeholder: "Name as on bank account", disabled: busy }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "accountNumber", label: "Account Number", type: "text", value: values.accountNumber, onChange: (v) => onChange({ accountNumber: v }), placeholder: "Enter full account number", helpText: current?.bankAccount ? `Saved: ••••${current.bankAccount.accountNumberMasked?.slice(-4) ?? "••••"}` : "Stored securely, never displayed in full.", disabled: busy }), _jsx(FormField, { name: "ifscCode", label: "IFSC Code", type: "text", value: values.ifscCode, onChange: (v) => onChange({ ifscCode: v.toUpperCase() }), placeholder: "e.g. SBIN0001234", disabled: busy })] }), _jsxs(FormGroup, { columns: 2, children: [_jsx(FormField, { name: "bankName", label: "Bank Name", type: "text", value: values.bankName, onChange: (v) => onChange({ bankName: v }), placeholder: "e.g. State Bank of India", disabled: busy }), _jsxs(Div, { children: [_jsx(Text, { className: "text-sm font-medium mb-1.5", children: "Account Type" }), _jsx(Stack, { gap: "xs", className: "flex-row", children: ["savings", "current"].map((t) => (_jsxs("label", { className: "flex items-center gap-2 cursor-pointer", children: [_jsx("input", { type: "radio", name: "accountType", value: t, checked: values.accountType === t, onChange: () => onChange({ accountType: t }), className: "accent-[var(--appkit-color-primary)]", disabled: busy }), _jsx(Text, { className: "capitalize text-sm", children: t })] }, t))) })] })] })] }))] })),
+        },
+        {
+            label: "Tax Info",
+            render: ({ values, onChange }) => (_jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 3, className: "mb-2", children: "Tax Information" }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: "Optional \u2014 required only for GST invoice generation and TDS compliance." }), _jsx(FormField, { name: "gstin", label: "GSTIN (optional)", type: "text", value: values.gstin, onChange: (v) => onChange({ gstin: v.toUpperCase() }), placeholder: "e.g. 22AAAAA0000A1Z5", helpText: "15-character Goods and Services Tax Identification Number.", disabled: busy }), _jsx(FormField, { name: "pan", label: "PAN (optional)", type: "text", value: values.pan, onChange: (v) => onChange({ pan: v.toUpperCase() }), placeholder: "e.g. ABCDE1234F", helpText: "Required for payouts above \u20B950,000 per year (TDS threshold).", disabled: busy }), _jsx(FormField, { name: "businessType", label: "Business Type (optional)", type: "text", value: values.businessType, onChange: (v) => onChange({ businessType: v }), placeholder: "e.g. Individual, Sole Proprietor, Private Limited", disabled: busy })] })),
+        },
+        {
+            label: "Preferences",
+            render: ({ values, onChange }) => (_jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 3, className: "mb-2", children: "Payout Preferences" }), _jsx(Toggle, { checked: values.autoPayout, onChange: (checked) => onChange({ autoPayout: checked }), label: "Enable auto-payout \u2014 automatically transfer earnings on schedule", disabled: busy }), _jsx(FormField, { name: "minimumThreshold", label: "Minimum Payout Threshold (\u20B9)", type: "number", value: values.minimumThreshold, onChange: (v) => onChange({ minimumThreshold: v }), placeholder: "e.g. 500", helpText: "Payouts are held until your balance exceeds this amount. Leave blank for no minimum.", disabled: busy }), _jsxs(Div, { className: "p-3 rounded-lg bg-[var(--appkit-color-surface-alt)] border border-[var(--appkit-color-border)]", children: [_jsx(Text, { className: "text-sm font-medium mb-1", children: "Payout Schedule" }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: "Auto-payouts run every Monday for the previous week's settled orders. Manual payouts can be requested from the Payouts page at any time." })] })] })),
+        },
+    ];
+    return (_jsx(StackedViewShell, { portal: "seller", title: "Payout Settings", sections: [
+            _jsxs("div", { children: [error && _jsx(Alert, { variant: "error", className: "mb-4", children: error }), success && _jsx(Alert, { variant: "success", className: "mb-4", children: "Payout details saved." }), _jsx(StepForm, { steps: steps, values: draft, onChange: update, onComplete: handleSave, formId: "seller-payout-settings", currentStep: currentStep, onStepChange: setCurrentStep, completeLabel: "Save Payout Details", isLoading: busy })] }, "payout"),
         ] }));
 }

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

@@ -1,5 +1,5 @@
 import React from "react";
-export type ProductListingMode = "standard" | "auction" | "pre-order" | "prize-draw" | "classified" | "digital-code" | "live";
+export type ProductListingMode = "standard" | "auction" | "pre-order" | "prize-draw" | "bundle" | "classified" | "digital-code" | "live";
 export interface SellerProductDraft {
     title?: string;
     slug?: string;

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

@@ -210,13 +210,15 @@ export function SellerProductShell({ mode, listingType = "standard", initialValu
         ? "Auction"
         : listingType === "pre-order"
             ? "Pre-Order"
-            : listingType === "classified"
-                ? "Classified"
-                : listingType === "digital-code"
-                    ? "Digital Code"
-                    : listingType === "live"
-                        ? "Live Item"
-                        : "Product";
+            : listingType === "bundle"
+                ? "Bundle"
+                : listingType === "classified"
+                    ? "Classified"
+                    : listingType === "digital-code"
+                        ? "Digital Code"
+                        : listingType === "live"
+                            ? "Live Item"
+                            : "Product";
     const typeSpecificStep = listingType === "auction"
         ? {
             label: "Auction Settings",

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

@@ -3,6 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { X } from "lucide-react";
 import { Button, Div, FilterChipGroup, Row, Text } from "../../../ui";
 import { INPUT_CLS, FILTER_LABEL_CLS } from "./seller-products-styles";
+import { CategoryInlineSelect } from "./CategoryInlineSelect";
+import { BrandInlineSelect } from "./BrandInlineSelect";
 const HALF_INPUT_CLS = INPUT_CLS.replace("w-full", "w-1/2");
 const CONDITION_OPTIONS = [
     { value: "", label: "Any" },
@@ -16,5 +18,5 @@ export function SellerProductsFilterDrawer({ isOpen, pendingFilters, statusOptio
     if (!isOpen)
         return null;
     const patch = (k, v) => onChange({ ...pendingFilters, [k]: v });
-    return (_jsxs(_Fragment, { children: [_jsx(Div, { role: "presentation", className: "fixed inset-0 z-40 bg-black/40", onClick: onClose }), _jsxs(Div, { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-[var(--appkit-color-surface)] shadow-2xl", children: [_jsxs(Row, { justify: "between", className: "border-b border-[var(--appkit-color-border)] px-4 py-3.5", children: [_jsx(Text, { className: "text-base font-semibold text-[var(--appkit-color-text)]", children: "Filters" }), _jsxs(Row, { className: "gap-2", children: [activeFilterCount > 0 && (_jsx(Button, { variant: "ghost", size: "sm", onClick: onClear, className: "text-xs text-[var(--appkit-color-text-muted)] hover:text-[var(--appkit-color-error)]", children: "Clear all" })), _jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, "aria-label": "Close filters", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsxs(Div, { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5", children: [_jsx(FilterChipGroup, { label: "Status", tabs: statusOptions, value: pendingFilters.status ?? "", onChange: (id) => patch("status", id) }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Category" }), _jsx("input", { type: "text", value: pendingFilters.category ?? "", onChange: (e) => patch("category", e.target.value), placeholder: "category slug", className: INPUT_CLS })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Brand" }), _jsx("input", { type: "text", value: pendingFilters.brand ?? "", onChange: (e) => patch("brand", e.target.value), placeholder: "brand slug", className: INPUT_CLS })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Condition" }), _jsx("select", { value: pendingFilters.condition ?? "", onChange: (e) => patch("condition", e.target.value), className: INPUT_CLS, children: CONDITION_OPTIONS.map((o) => (_jsx("option", { value: o.value, children: o.label }, o.value))) })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Price (paise)" }), _jsxs(Row, { className: "gap-2", children: [_jsx("input", { type: "number", min: 0, value: pendingFilters.minPrice ?? "", onChange: (e) => patch("minPrice", e.target.value), placeholder: "min", className: HALF_INPUT_CLS }), _jsx("input", { type: "number", min: 0, value: pendingFilters.maxPrice ?? "", onChange: (e) => patch("maxPrice", e.target.value), placeholder: "max", className: HALF_INPUT_CLS })] })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Tags (comma-separated)" }), _jsx("input", { type: "text", value: pendingFilters.tags ?? "", onChange: (e) => patch("tags", e.target.value), placeholder: "pokemon, vintage, holo", className: INPUT_CLS })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Badges (feature slugs)" }), _jsx("input", { type: "text", value: pendingFilters.badges ?? "", onChange: (e) => patch("badges", e.target.value), placeholder: "feature-free-shipping, feature-verified", className: INPUT_CLS })] })] }), _jsx(Div, { className: "border-t border-[var(--appkit-color-border)] px-4 py-3.5", children: _jsxs(Button, { variant: "primary", onClick: onApply, className: "w-full rounded-lg py-2.5 active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Div, { role: "presentation", className: "fixed inset-0 z-40 bg-black/40", onClick: onClose }), _jsxs(Div, { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-[var(--appkit-color-surface)] shadow-2xl", children: [_jsxs(Row, { justify: "between", className: "border-b border-[var(--appkit-color-border)] px-4 py-3.5", children: [_jsx(Text, { className: "text-base font-semibold text-[var(--appkit-color-text)]", children: "Filters" }), _jsxs(Row, { className: "gap-2", children: [activeFilterCount > 0 && (_jsx(Button, { variant: "ghost", size: "sm", onClick: onClear, className: "text-xs text-[var(--appkit-color-text-muted)] hover:text-[var(--appkit-color-error)]", children: "Clear all" })), _jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, "aria-label": "Close filters", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsxs(Div, { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5", children: [_jsx(FilterChipGroup, { label: "Status", tabs: statusOptions, value: pendingFilters.status ?? "", onChange: (id) => patch("status", id) }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Category" }), _jsx(CategoryInlineSelect, { value: pendingFilters.category ?? "", onChange: (v) => patch("category", v), placeholder: "Search categories\u2026" })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Brand" }), _jsx(BrandInlineSelect, { value: pendingFilters.brand ?? "", onChange: (v) => patch("brand", v), placeholder: "Search brands\u2026", allowCreate: false })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Condition" }), _jsx("select", { value: pendingFilters.condition ?? "", onChange: (e) => patch("condition", e.target.value), className: INPUT_CLS, children: CONDITION_OPTIONS.map((o) => (_jsx("option", { value: o.value, children: o.label }, o.value))) })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Price (\u20B9 Rupees)" }), _jsxs(Row, { className: "gap-2", children: [_jsx("input", { type: "number", min: 0, value: pendingFilters.minPrice ?? "", onChange: (e) => patch("minPrice", e.target.value), placeholder: "min", className: HALF_INPUT_CLS }), _jsx("input", { type: "number", min: 0, value: pendingFilters.maxPrice ?? "", onChange: (e) => patch("maxPrice", e.target.value), placeholder: "max", className: HALF_INPUT_CLS })] })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Tags (comma-separated)" }), _jsx("input", { type: "text", value: pendingFilters.tags ?? "", onChange: (e) => patch("tags", e.target.value), placeholder: "pokemon, vintage, holo", className: INPUT_CLS })] }), _jsxs(Div, { className: "space-y-1.5", children: [_jsx(Text, { className: FILTER_LABEL_CLS, children: "Badges (feature slugs)" }), _jsx("input", { type: "text", value: pendingFilters.badges ?? "", onChange: (e) => patch("badges", e.target.value), placeholder: "feature-free-shipping, feature-verified", className: INPUT_CLS })] })] }), _jsx(Div, { className: "border-t border-[var(--appkit-color-border)] px-4 py-3.5", children: _jsxs(Button, { variant: "primary", onClick: onApply, className: "w-full rounded-lg py-2.5 active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }));
 }