@mohasinac/appkit 2.8.9 → 3.0.0

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

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { sortBy } from "@mohasinac/appkit";
+import { Badge, sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, RowActionMenu, Text } from "../../../ui";
@@ -10,31 +10,27 @@ import { ROUTES } from "../../..";
 import { toRecordArray, toRelativeDate, toRupees, toStringValue, } from "../../admin/hooks/useAdminListingData";
 import { DataListingView } from "../../admin/components/DataListingView";
 const COLUMNS = [
-    { key: "title", header: "Listing", render: (row) => _jsx(Text, { className: "text-sm font-medium", children: row.title }) },
-    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "text-sm tabular-nums", children: row.price }) },
+    { key: "title", header: "Listing", render: (row) => _jsx(Text, { size: "sm", weight: "medium", children: row.title }) },
+    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "tabular-nums", size: "sm", children: row.price }) },
     {
         key: "city",
         header: "Location",
-        render: (row) => (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.city || "—" })),
+        render: (row) => (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: row.city || "—" })),
     },
     {
         key: "acceptsShipping",
         header: "Shipping",
-        render: (row) => (_jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ${row.acceptsShipping
-                ? "bg-success-surface text-success"
-                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.acceptsShipping ? "Ships" : "Meetup only" })),
+        render: (row) => (_jsx(Badge, { variant: row.acceptsShipping ? "active" : "inactive", size: "xs", children: row.acceptsShipping ? "Ships" : "Meetup only" })),
     },
     {
         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-success-surface text-success"
-                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.status })),
+        render: (row) => (_jsx(Badge, { variant: row.status === "active" ? "active" : "inactive", size: "xs", className: "capitalize", children: row.status })),
     },
     {
         key: "createdAt",
         header: "Created",
-        render: (row) => (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.createdAt })),
+        render: (row) => (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: row.createdAt })),
     },
 ];
 export function SellerClassifiedView({ onCreateClick, onEditClick, onDelete, onBulkDelete, }) {

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

@@ -1,9 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
-import { Badge, Button, Div, Heading, Input, Row, Select, Span, Stack, Text } from "../../../ui";
+import { Badge, Button, Div, Form, Heading, Input, Label, Row, Select, Span, Stack, Text } from "../../../ui";
 import { ProductInlineSelect } from "./ProductInlineSelect";
 import { CategoryInlineSelect } from "./CategoryInlineSelect";
+import { normalizeError } from "../../../errors/normalize";
 const __O = {
     hidden: "overflow-hidden",
 };
@@ -62,6 +63,7 @@ export function SellerCouponEditorView({ couponId, initial, onSave, onCancel, })
             await onSave(draft, couponId);
         }
         catch (err) {
+            void normalizeError(err);
             setError(err.message ?? "Failed to save coupon");
         }
         finally {
@@ -69,13 +71,13 @@ export function SellerCouponEditorView({ couponId, initial, onSave, onCancel, })
         }
     };
     const isEdit = Boolean(couponId);
-    return (_jsx("form", { onSubmit: handleSubmit, noValidate: true, children: _jsxs(Stack, { gap: "none", className: `max-w-lg mx-auto rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] shadow-sm ${__O.hidden}`, children: [_jsx("div", { className: "h-[3px] w-full", 
+    return (_jsx(Form, { onSubmit: handleSubmit, noValidate: true, children: _jsxs(Stack, { gap: "none", className: `max-w-lg mx-auto border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] ${__O.hidden}`, rounded: "xl", shadow: "sm", children: [_jsx("div", { className: "h-[3px] w-full", 
                     // audit-inline-style-ok: runtime theme gradient
-                    style: { background: "linear-gradient(to right,var(--appkit-color-primary-700,#1343de) 0%,var(--appkit-color-cobalt,#3570fc) 55%,var(--appkit-color-secondary-400,#84e122) 100%)" }, "aria-hidden": "true" }), _jsx(Div, { className: "border-b border-[var(--appkit-color-border)] px-6 py-5", children: _jsxs(Row, { justify: "between", className: "gap-3", children: [_jsx(Heading, { level: 2, className: "text-lg font-semibold text-[var(--appkit-color-text)]", children: isEdit ? "Edit Coupon" : "Create Coupon" }), isEdit && (_jsx(Badge, { variant: draft.isActive ? "success" : "default", children: draft.isActive ? "Active" : "Inactive" }))] }) }), _jsxs(Stack, { gap: "5", className: "px-6 py-6", children: [error && (_jsx(Div, { className: "rounded-lg border border-error/20 bg-error-surface px-4 py-3 text-sm text-error", children: error })), _jsx(Input, { label: "Coupon Code", value: draft.code, onChange: (e) => set("code", e.target.value.toUpperCase().replace(/\s+/g, "")), placeholder: "e.g. WELCOME10", required: true, disabled: isEdit, helperText: isEdit ? "Code cannot be changed after creation" : "Customers enter this at checkout" }), _jsx(Select, { label: "Discount Type", value: draft.type, options: TYPE_OPTIONS, onChange: (e) => set("type", e.target.value) }), draft.type !== "free_shipping" && (_jsx(Input, { label: draft.type === "percentage" ? "Discount Percentage (%)" : "Discount Amount (₹)", type: "number", min: 1, max: draft.type === "percentage" ? 100 : undefined, value: draft.value, onChange: (e) => set("value", e.target.value), placeholder: draft.type === "percentage" ? "e.g. 10" : "e.g. 50", required: true, helperText: draft.type === "percentage"
+                    style: { background: "linear-gradient(to right,var(--appkit-color-primary-700) 0%,var(--appkit-color-cobalt) 55%,var(--appkit-color-secondary-400) 100%)" }, "aria-hidden": "true" }), _jsx(Div, { border: "bottom", paddingY: "y-md-lg", padding: "x-lg", children: _jsxs(Row, { justify: "between", gap: "3", children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)]", size: "lg", weight: "semibold", children: isEdit ? "Edit Coupon" : "Create Coupon" }), isEdit && (_jsx(Badge, { variant: draft.isActive ? "success" : "default", children: draft.isActive ? "Active" : "Inactive" }))] }) }), _jsxs(Stack, { gap: "5", padding: "lg", children: [error && (_jsx(Div, { textSize: "sm", className: "border border-error/20", color: "error", surface: "danger-surface", padding: "inline", rounded: "lg", children: error })), _jsx(Input, { label: "Coupon Code", value: draft.code, onChange: (e) => set("code", e.target.value.toUpperCase().replace(/\s+/g, "")), placeholder: "e.g. WELCOME10", required: true, disabled: isEdit, helperText: isEdit ? "Code cannot be changed after creation" : "Customers enter this at checkout" }), _jsx(Select, { label: "Discount Type", value: draft.type, options: TYPE_OPTIONS, onChange: (e) => set("type", e.target.value) }), draft.type !== "free_shipping" && (_jsx(Input, { label: draft.type === "percentage" ? "Discount Percentage (%)" : "Discount Amount (₹)", type: "number", min: 1, max: draft.type === "percentage" ? 100 : undefined, value: draft.value, onChange: (e) => set("value", e.target.value), placeholder: draft.type === "percentage" ? "e.g. 10" : "e.g. 50", required: true, helperText: draft.type === "percentage"
                                 ? "Enter a value between 1 and 100"
-                                : "Fixed rupee discount applied to the order" })), draft.type === "percentage" && (_jsx(Input, { label: "Max Discount Cap (\u20B9, optional)", type: "number", min: 0, value: draft.maxDiscount, onChange: (e) => set("maxDiscount", e.target.value), placeholder: "Leave blank for no cap", helperText: "Maximum rupee discount regardless of percentage" })), _jsx(Input, { label: "Minimum Order Amount (\u20B9, optional)", type: "number", min: 0, value: draft.minPurchase, onChange: (e) => set("minPurchase", e.target.value), placeholder: "Leave blank for no minimum" }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Usage Limits" }), _jsxs(Div, { className: "grid grid-cols-2 gap-3", children: [_jsx(Input, { label: "Total Uses", type: "number", min: 0, value: draft.totalLimit, onChange: (e) => set("totalLimit", e.target.value), placeholder: "0 = unlimited" }), _jsx(Input, { label: "Per Customer", type: "number", min: 0, value: draft.perUserLimit, onChange: (e) => set("perUserLimit", e.target.value), placeholder: "0 = unlimited" })] })] }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Validity Period" }), _jsxs(Div, { className: "grid grid-cols-2 gap-3", children: [_jsx(Input, { label: "Start Date", type: "date", value: draft.startDate, onChange: (e) => set("startDate", e.target.value), required: true }), _jsx(Input, { label: "End Date", type: "date", value: draft.endDate, onChange: (e) => set("endDate", e.target.value), required: true })] })] }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Applicability (optional)" }), _jsxs(Stack, { gap: "sm", children: [_jsxs(Div, { children: [_jsx(Text, { size: "xs", className: "mb-1 text-[var(--appkit-color-text-secondary)]", children: "Applicable products" }), _jsx(ProductInlineSelect, { scope: "store", multiple: true, value: draft.applicableProducts, onChange: (v) => set("applicableProducts", v), placeholder: "Restrict to specific products\u2026" })] }), _jsxs(Div, { children: [_jsx(Text, { size: "xs", className: "mb-1 text-[var(--appkit-color-text-secondary)]", children: "Applicable categories" }), _jsx(CategoryInlineSelect, { value: "", onChange: (id) => {
+                                : "Fixed rupee discount applied to the order" })), draft.type === "percentage" && (_jsx(Input, { label: "Max Discount Cap (\u20B9, optional)", type: "number", min: 0, value: draft.maxDiscount, onChange: (e) => set("maxDiscount", e.target.value), placeholder: "Leave blank for no cap", helperText: "Maximum rupee discount regardless of percentage" })), _jsx(Input, { label: "Minimum Order Amount (\u20B9, optional)", type: "number", min: 0, value: draft.minPurchase, onChange: (e) => set("minPurchase", e.target.value), placeholder: "Leave blank for no minimum" }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Usage Limits" }), _jsxs(Div, { layout: "grid", gap: "3", className: "grid-cols-2", children: [_jsx(Input, { label: "Total Uses", type: "number", min: 0, value: draft.totalLimit, onChange: (e) => set("totalLimit", e.target.value), placeholder: "0 = unlimited" }), _jsx(Input, { label: "Per Customer", type: "number", min: 0, value: draft.perUserLimit, onChange: (e) => set("perUserLimit", e.target.value), placeholder: "0 = unlimited" })] })] }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Validity Period" }), _jsxs(Div, { layout: "grid", gap: "3", className: "grid-cols-2", children: [_jsx(Input, { label: "Start Date", type: "date", value: draft.startDate, onChange: (e) => set("startDate", e.target.value), required: true }), _jsx(Input, { label: "End Date", type: "date", value: draft.endDate, onChange: (e) => set("endDate", e.target.value), required: true })] })] }), _jsxs(Div, { children: [_jsx(Text, { size: "sm", className: CLS_SECTION_LABEL, children: "Applicability (optional)" }), _jsxs(Stack, { gap: "sm", children: [_jsxs(Div, { children: [_jsx(Text, { size: "xs", className: "mb-1 text-[var(--appkit-color-text-secondary)]", children: "Applicable products" }), _jsx(ProductInlineSelect, { scope: "store", multiple: true, value: draft.applicableProducts, onChange: (v) => set("applicableProducts", v), placeholder: "Restrict to specific products\u2026" })] }), _jsxs(Div, { children: [_jsx(Text, { size: "xs", className: "mb-1 text-[var(--appkit-color-text-secondary)]", children: "Applicable categories" }), _jsx(CategoryInlineSelect, { value: "", onChange: (id) => {
                                                         if (!id || draft.applicableCategories.includes(id))
                                                             return;
                                                         set("applicableCategories", [...draft.applicableCategories, id]);
-                                                    }, placeholder: "Add a category\u2026" }), draft.applicableCategories.length > 0 && (_jsx(Div, { className: "flex flex-wrap gap-2 pt-2", children: draft.applicableCategories.map((cid) => (_jsxs(Span, { className: "inline-flex items-center gap-1 rounded-full border border-zinc-300 bg-zinc-50 px-2.5 py-0.5 text-xs text-zinc-800 dark:border-zinc-600 dark:bg-zinc-800 dark:text-zinc-100", children: [cid, _jsx("button", { type: "button", "aria-label": `Remove ${cid}`, className: "text-zinc-500 hover:text-zinc-800 dark:text-zinc-400 dark:hover:text-zinc-100", onClick: () => set("applicableCategories", draft.applicableCategories.filter((c) => c !== cid)), children: "\u00D7" })] }, cid))) }))] }), _jsx(Text, { size: "xs", className: "text-[var(--appkit-color-text-secondary)]", children: "Leave both empty to apply the coupon to every product in your store." })] })] }), _jsx(Div, { className: "flex items-center gap-3 rounded-lg border border-[var(--appkit-color-border)] dark:border-[var(--appkit-color-border-dark)] px-4 py-3", children: _jsxs("label", { className: "flex items-center gap-3 cursor-pointer w-full", children: [_jsx("input", { type: "checkbox", checked: draft.isActive, onChange: (e) => set("isActive", e.target.checked), className: "h-4 w-4 rounded border-zinc-300 dark:border-slate-600 text-[var(--appkit-color-primary)] focus:ring-[var(--appkit-color-primary)]" }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsx(Text, { size: "sm", className: "font-medium text-[var(--appkit-color-text-primary)]", children: "Active" }), _jsx(Text, { size: "xs", className: "text-[var(--appkit-color-text-secondary)]", children: "Customers can apply this coupon at checkout" })] })] }) })] }), _jsx(Div, { className: "border-t border-[var(--appkit-color-border)] px-6 py-4", children: _jsxs(Row, { justify: "end", className: "gap-3", children: [onCancel && (_jsx(Button, { type: "button", variant: "outline", onClick: onCancel, disabled: saving, children: "Cancel" })), _jsx(Button, { type: "submit", isLoading: saving, disabled: saving, children: isEdit ? "Save Changes" : "Create Coupon" })] }) })] }) }));
+                                                    }, placeholder: "Add a category\u2026" }), draft.applicableCategories.length > 0 && (_jsx(Row, { wrap: true, gap: "sm", padding: "t-xs", children: draft.applicableCategories.map((cid) => (_jsxs(Span, { layout: "inline-flex", gap: "xs", border: "strong", padding: "pill-sm", rounded: "full", surface: "muted", color: "primary", size: "xs", children: [cid, _jsx("button", { type: "button", "aria-label": `Remove ${cid}`, className: "text-zinc-500 hover:text-zinc-800 dark:text-zinc-400 dark:hover:text-zinc-100", onClick: () => set("applicableCategories", draft.applicableCategories.filter((c) => c !== cid)), children: "\u00D7" })] }, cid))) }))] }), _jsx(Text, { size: "xs", className: "text-[var(--appkit-color-text-secondary)]", children: "Leave both empty to apply the coupon to every product in your store." })] })] }), _jsx(Row, { className: "border border-[var(--appkit-color-border)] dark:border-[var(--appkit-color-border-dark)]", padding: "inline", align: "center", gap: "3", rounded: "lg", children: _jsxs(Label, { layout: "flex", gap: "lg", className: "cursor-pointer w-full", children: [_jsx("input", { type: "checkbox", checked: draft.isActive, onChange: (e) => set("isActive", e.target.checked), className: "h-4 w-4 rounded border-zinc-300 dark:border-slate-600 text-[var(--appkit-color-primary)] focus:ring-[var(--appkit-color-primary)]" }), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsx(Text, { size: "sm", className: "text-[var(--appkit-color-text-primary)]", weight: "medium", children: "Active" }), _jsx(Text, { size: "xs", className: "text-[var(--appkit-color-text-secondary)]", children: "Customers can apply this coupon at checkout" })] })] }) })] }), _jsx(Div, { className: "border-t border-[var(--appkit-color-border)]", padding: "inlineLg", children: _jsxs(Row, { justify: "end", gap: "3", children: [onCancel && (_jsx(Button, { type: "button", variant: "outline", onClick: onCancel, disabled: saving, children: "Cancel" })), _jsx(Button, { type: "submit", isLoading: saving, disabled: saving, children: isEdit ? "Save Changes" : "Create Coupon" })] }) })] }) }));
 }

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

@@ -1,12 +1,13 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { sieveFilter, SIEVE_OP } from "@mohasinac/appkit";
+import { Row, SIEVE_OP, Stack, sieveFilter } from "@mohasinac/appkit";
 import { sortBy } from "@mohasinac/appkit";
 import React, { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { Div, ListingLayout, Text, useToast } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { toRecordArray, toStringValue, } from "../../admin/hooks/useAdminListingData";
+import { normalizeError } from "../../../errors/normalize";
 import { DataListingView } from "../../admin/components/DataListingView";
 import { CouponCard } from "../../promotions/components/CouponCard";
 function getIsActive(item) {
@@ -30,6 +31,7 @@ export function SellerCouponsView({ onCreateClick, onEditClick, onToggle, onDele
             showToast("Coupon updated.", "success");
         }
         catch (err) {
+            void normalizeError(err);
             showToast(err instanceof Error ? err.message : "Failed to update coupon.", "error");
         }
         finally {
@@ -69,14 +71,14 @@ export function SellerCouponsView({ onCreateClick, onEditClick, onToggle, onDele
         primaryAction: onCreateClick
             ? { label: "Add Coupon", onClick: () => onCreateClick() }
             : undefined,
-        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsxs(Div, { className: "space-y-2", children: [_jsx(Text, { className: "text-xs font-semibold uppercase tracking-widest text-zinc-500 dark:text-zinc-400", children: "Status" }), _jsx(Div, { className: "flex flex-wrap gap-2", children: [
+        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsxs(Stack, { gap: "sm", children: [_jsx(Text, { className: "tracking-widest", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Status" }), _jsx(Row, { wrap: true, gap: "sm", children: [
                         { label: "All", value: "" },
                         { label: "Active", value: "true" },
                         { label: "Inactive", value: "false" },
                     ].map((opt) => (_jsx("button", { type: "button", onClick: () => setPendingFilters((p) => ({ ...p, isActive: opt.value })), className: `rounded-full px-3 py-1 text-xs font-medium border transition-colors ${(pendingFilters.isActive || "") === opt.value
                             ? "bg-[var(--appkit-color-primary)] text-white border-[var(--appkit-color-primary)]"
                             : "border-zinc-300 dark:border-slate-600 text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-slate-800"}`, children: opt.label }, opt.label))) })] })),
-        renderCards: (rows, _view, _selection, isLoading) => isLoading ? (_jsx(Div, { className: "fluid-grid-card gap-3", children: Array.from({ length: 6 }).map((_, i) => (_jsxs(Div, { className: "rounded-xl border-2 border-zinc-100 dark:border-slate-700 p-4 animate-pulse space-y-3", children: [_jsx(Div, { className: "h-6 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" }), _jsx(Div, { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx(Div, { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/2" })] }, i))) })) : (_jsx(Div, { className: "fluid-grid-card gap-3", children: rows.map((row) => (_jsx(CouponCard, { coupon: row.raw, onEdit: onEditClick ? handleEdit : undefined, onToggleActive: onToggle ? handleToggle : undefined, onDelete: onDelete ? handleDelete : undefined, className: togglingId === row.id || deletingId === row.id
+        renderCards: (rows, _view, _selection, isLoading) => isLoading ? (_jsx(Div, { gap: "3", className: "fluid-grid-card", children: Array.from({ length: 6 }).map((_, i) => (_jsxs(Stack, { border: "skeleton", className: "animate-pulse", gap: "3", rounded: "xl", padding: "md", children: [_jsx(Div, { className: "h-6 w-2/3", surface: "subtle", rounded: "default" }), _jsx(Div, { className: "h-4 w-full", surface: "subtle", rounded: "default" }), _jsx(Div, { className: "h-3 w-1/2", surface: "subtle", rounded: "default" })] }, i))) })) : (_jsx(Div, { gap: "3", className: "fluid-grid-card", children: rows.map((row) => (_jsx(CouponCard, { coupon: row.raw, onEdit: onEditClick ? handleEdit : undefined, onToggleActive: onToggle ? handleToggle : undefined, onDelete: onDelete ? handleDelete : undefined, className: togglingId === row.id || deletingId === row.id
                     ? "pointer-events-none opacity-60"
                     : undefined }, row.id))) })),
     };

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

@@ -2,10 +2,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { StackedViewShell, Div, Text } from "../../../ui";
 function DefaultStatsPlaceholder({ isLoading }) {
-    return (_jsx(Div, { className: "grid grid-cols-2 gap-4 sm:grid-cols-4", children: [1, 2, 3, 4].map((i) => (_jsx(Div, { className: "rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] p-5", children: isLoading ? (_jsxs(_Fragment, { children: [_jsx(Div, { className: "h-3 w-16 animate-pulse rounded bg-[var(--appkit-color-border)]" }), _jsx(Div, { className: "mt-3 h-6 w-20 animate-pulse rounded bg-[var(--appkit-color-border)]" })] })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { size: "xs", variant: "secondary", className: "uppercase tracking-widest font-semibold", children: ["Stat ", i] }), _jsx(Text, { size: "xl", className: "mt-2 font-bold tabular-nums", children: "\u2014" })] })) }, i))) }));
+    return (_jsx(Div, { layout: "grid", gap: "4", className: "grid-cols-2 sm:grid-cols-4", children: [1, 2, 3, 4].map((i) => (_jsx(Div, { padding: "5", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "xl", children: isLoading ? (_jsxs(_Fragment, { children: [_jsx(Div, { className: "h-3 w-16 animate-pulse bg-[var(--appkit-color-border)]", rounded: "default" }), _jsx(Div, { className: "mt-3 h-6 w-20 animate-pulse bg-[var(--appkit-color-border)]", rounded: "default" })] })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { size: "xs", variant: "secondary", className: "tracking-widest", weight: "semibold", transform: "uppercase", children: ["Stat ", i] }), _jsx(Text, { size: "xl", className: "mt-2 tabular-nums", weight: "bold", children: "\u2014" })] })) }, i))) }));
 }
 function DefaultQuickActionsPlaceholder() {
-    return (_jsx(Div, { className: "grid grid-cols-2 gap-3 sm:grid-cols-4", children: [1, 2, 3, 4].map((i) => (_jsx(Div, { className: "h-12 animate-pulse rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-border)]" }, i))) }));
+    return (_jsx(Div, { layout: "grid", gap: "3", className: "grid-cols-2 sm:grid-cols-4", children: [1, 2, 3, 4].map((i) => (_jsx(Div, { className: "h-12 animate-pulse border border-[var(--appkit-color-border)] bg-[var(--appkit-color-border)]", rounded: "xl" }, i))) }));
 }
 export function SellerDashboardView({ labels = {}, renderStats, renderQuickActions, renderRecentListings, renderRevenueChart, renderTopProducts, isLoading = false, ...rest }) {
     const stats = (renderStats ?? ((busy) => _jsx(DefaultStatsPlaceholder, { isLoading: busy })))(isLoading);

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

@@ -3,41 +3,39 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
-import { ConfirmDeleteModal, RowActionMenu, Span, Text } from "../../../ui";
+import { Badge, ConfirmDeleteModal, RowActionMenu, Span, Text } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { ROUTES } from "../../..";
 import { toRecordArray, toRelativeDate, toRupees, toStringValue, } from "../../admin/hooks/useAdminListingData";
 import { DataListingView } from "../../admin/components/DataListingView";
 const COLUMNS = [
-    { key: "title", header: "Product", render: (row) => _jsx(Text, { className: "text-sm font-medium", children: row.title }) },
-    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "text-sm tabular-nums", children: row.price }) },
+    { key: "title", header: "Product", render: (row) => _jsx(Text, { size: "sm", weight: "medium", children: row.title }) },
+    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "tabular-nums", size: "sm", children: row.price }) },
     {
         key: "codePoolSize",
         header: "Total Codes",
-        render: (row) => (_jsx(Text, { className: "text-sm tabular-nums", children: row.codePoolSize !== null ? row.codePoolSize : "—" })),
+        render: (row) => (_jsx(Text, { className: "tabular-nums", size: "sm", children: row.codePoolSize !== null ? row.codePoolSize : "—" })),
     },
     {
         key: "codesAvailable",
         header: "Available",
-        render: (row) => (_jsx(Text, { className: "text-sm tabular-nums", children: row.codesAvailable !== null ? row.codesAvailable : "—" })),
+        render: (row) => (_jsx(Text, { className: "tabular-nums", size: "sm", children: row.codesAvailable !== null ? row.codesAvailable : "—" })),
     },
     {
         key: "deliveryMethod",
         header: "Delivery",
-        render: (row) => (_jsx(Span, { size: "xs", weight: "medium", className: "inline-flex items-center rounded-full px-2 py-0.5 bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400 capitalize", children: row.deliveryMethod.replace(/-/g, " ") })),
+        render: (row) => (_jsx(Span, { layout: "inline-flex", size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", surface: "subtle", color: "muted", transform: "capitalize", children: row.deliveryMethod.replace(/-/g, " ") })),
     },
     {
         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-success-surface text-success"
-                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.status })),
+        render: (row) => (_jsx(Badge, { variant: row.status === "active" ? "active" : "inactive", size: "xs", className: "capitalize", children: row.status })),
     },
     {
         key: "createdAt",
         header: "Created",
-        render: (row) => (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.createdAt })),
+        render: (row) => (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: row.createdAt })),
     },
 ];
 export function SellerDigitalCodesView({ onCreateClick, onEditClick, onDelete, onBulkDelete, }) {

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

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { normalizeError } from "../../../errors/normalize";
 import React from "react";
 import { Plus } from "lucide-react";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
@@ -15,9 +16,10 @@ const TOAST = {
     DISABLED: "Feature disabled.",
 };
 const ROW_CLASS = "flex items-center justify-between gap-3 px-4 py-3";
-const CAP_BANNER_CLASS = "rounded-xl border border-amber-200 dark:border-amber-900/60 bg-warning-surface px-4 py-2.5 text-xs text-warning";
+const CAP_BANNER_CLASS = "rounded-xl border border-warning dark:border-warning/60 bg-warning-surface px-4 py-2.5 text-xs text-warning";
 const EMPTY_STATE_CLASS = "rounded-xl border border-zinc-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-6 text-center text-sm text-zinc-500 dark:text-zinc-400";
 const LIST_CLASS = "divide-y divide-zinc-200 dark:divide-slate-700 rounded-xl border border-zinc-200 dark:border-slate-700 bg-white dark:bg-slate-900";
+// audit-unknown-ok: callback entry point — accepts arbitrary payload value
 function unwrap(res) {
     return (res?.data ?? res);
 }
@@ -50,11 +52,12 @@ export function SellerFeaturesView() {
             invalidate();
         }
         catch (err) {
+            void normalizeError(err);
             showToast(err?.message ??
                 ERROR_MESSAGES.PRODUCT_FEATURES.UPDATE_FAILED, "error");
         }
     };
-    return (_jsxs(Stack, { gap: "md", className: "min-h-screen px-3 sm:px-4 py-4", children: [_jsxs(Row, { align: "center", justify: "between", children: [_jsxs(Div, { children: [_jsx(Heading, { level: 1, className: "text-lg font-semibold text-zinc-900 dark:text-zinc-50", children: "Custom feature badges" }), _jsxs(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: [features.length, " of ", limit, " used. Platform features are always available on top of your custom ones."] })] }), _jsxs(Button, { size: "sm", onClick: openCreatePanel, disabled: isFull, className: "flex items-center gap-1.5", children: [_jsx(Plus, { className: "h-4 w-4" }), "Add Feature"] })] }), isFull && (_jsxs(Text, { as: "div", className: CAP_BANNER_CLASS, children: ["You have reached the ", limit, "-feature limit for your store. Delete an existing feature before adding a new one."] })), featuresQuery.isLoading ? (_jsxs(Stack, { gap: "sm", children: [_jsx(Skeleton, { variant: "rectangular", height: "48px" }), _jsx(Skeleton, { variant: "rectangular", height: "48px" }), _jsx(Skeleton, { variant: "rectangular", height: "48px" })] })) : features.length === 0 ? (_jsx(Div, { className: EMPTY_STATE_CLASS, children: "You haven't created any custom features yet." })) : (_jsx(Stack, { as: "ul", gap: "none", className: LIST_CLASS, children: features.map((f) => (_jsxs(Row, { as: "li", className: ROW_CLASS, gap: "sm", children: [_jsxs("button", { type: "button", onClick: () => openEditPanel(f.id), className: "flex-1 text-left", children: [_jsx(Text, { as: "div", className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: f.label }), _jsxs(Text, { as: "div", className: "text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: [f.category, " \u00B7 ", f.productTypes.join(" · ")] })] }), _jsx(Toggle, { checked: f.isActive, onChange: (checked) => toggleActive(f, checked), "aria-label": "Active" })] }, f.id))) })), _jsx(SideDrawer, { isOpen: isCreateOpen || isEditOpen, onClose: closePanel, title: isCreateOpen ? "Add Feature" : "Edit Feature", mode: isCreateOpen ? "create" : "edit", children: (isCreateOpen || isEditOpen) && (_jsx(AdminFeatureEditorView, { featureId: editId ?? undefined, fixedScope: "store", embedded: true, endpointOverride: {
+    return (_jsxs(Stack, { gap: "md", paddingX: "x-sm-md", className: "min-h-screen", padding: "y-md", children: [_jsxs(Row, { align: "center", justify: "between", children: [_jsxs(Div, { children: [_jsx(Heading, { level: 1, size: "lg", weight: "semibold", color: "primary", children: "Custom feature badges" }), _jsxs(Text, { className: "mt-0.5", color: "muted", size: "xs", children: [features.length, " of ", limit, " used. Platform features are always available on top of your custom ones."] })] }), _jsxs(Button, { gap: "sm", size: "sm", onClick: openCreatePanel, disabled: isFull, children: [_jsx(Plus, { className: "h-4 w-4" }), "Add Feature"] })] }), isFull && (_jsxs(Text, { as: "div", className: CAP_BANNER_CLASS, children: ["You have reached the ", limit, "-feature limit for your store. Delete an existing feature before adding a new one."] })), featuresQuery.isLoading ? (_jsxs(Stack, { gap: "sm", children: [_jsx(Skeleton, { variant: "rectangular", height: "48px" }), _jsx(Skeleton, { variant: "rectangular", height: "48px" }), _jsx(Skeleton, { variant: "rectangular", height: "48px" })] })) : features.length === 0 ? (_jsx(Div, { className: EMPTY_STATE_CLASS, children: "You haven't created any custom features yet." })) : (_jsx(Stack, { as: "ul", gap: "none", className: LIST_CLASS, children: features.map((f) => (_jsxs(Row, { as: "li", className: ROW_CLASS, gap: "sm", children: [_jsxs("button", { type: "button", onClick: () => openEditPanel(f.id), className: "flex-1 text-left", children: [_jsx(Text, { as: "div", size: "sm", weight: "medium", color: "primary", children: f.label }), _jsxs(Text, { as: "div", className: "mt-0.5", color: "muted", size: "xs", children: [f.category, " \u00B7 ", f.productTypes.join(" · ")] })] }), _jsx(Toggle, { checked: f.isActive, onChange: (checked) => toggleActive(f, checked), "aria-label": "Active" })] }, f.id))) })), _jsx(SideDrawer, { isOpen: isCreateOpen || isEditOpen, onClose: closePanel, title: isCreateOpen ? "Add Feature" : "Edit Feature", mode: isCreateOpen ? "create" : "edit", children: (isCreateOpen || isEditOpen) && (_jsx(AdminFeatureEditorView, { featureId: editId ?? undefined, fixedScope: "store", embedded: true, endpointOverride: {
                         create: SELLER_ENDPOINTS.FEATURES,
                         byId: SELLER_ENDPOINTS.FEATURE_BY_ID,
                     }, onSaved: onSaved, onDeleted: onSaved })) })] }));

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

@@ -1,8 +1,9 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { normalizeError } from "../../../errors/normalize";
 import { useCallback, useEffect, useState } from "react";
 import { RefreshCw } from "lucide-react";
-import { Alert, Button, Div, FormField, Heading, Section, Stack, Text, Toggle, useToast, } from "../../../ui";
+import { Alert, Button, Div, FormField, Heading, Row, Section, Stack, Text, Toggle, useToast } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 const EMPTY_DRAFT = {
@@ -57,6 +58,7 @@ export function SellerGoogleReviewsView({ onSave, onSync, }) {
             showToast("Google Reviews settings saved.", "success");
         }
         catch (err) {
+            void normalizeError(err);
             setSaveMessage({ text: "Save failed. Please try again.", ok: false });
             showToast(err instanceof Error ? err.message : "Failed to save settings.", "error");
         }
@@ -81,6 +83,7 @@ export function SellerGoogleReviewsView({ onSave, onSync, }) {
             showToast("Reviews synced.", "success");
         }
         catch (err) {
+            void normalizeError(err);
             setSaveMessage({ text: "Sync failed. Please try again.", ok: false });
             showToast(err instanceof Error ? err.message : "Failed to sync reviews.", "error");
         }
@@ -89,7 +92,7 @@ export function SellerGoogleReviewsView({ onSave, onSync, }) {
         }
     }, [onSync, showToast]);
     if (loading) {
-        return (_jsx(Div, { className: "space-y-4 py-6 px-4", children: Array.from({ length: 3 }).map((_, i) => (_jsx("div", { className: "h-12 animate-pulse rounded-xl border border-zinc-100 dark:border-slate-700 bg-zinc-50 dark:bg-slate-800" }, i))) }));
+        return (_jsx(Stack, { gap: "md", paddingY: "y-lg", paddingX: "x-md", children: Array.from({ length: 3 }).map((_, i) => (_jsx("div", { className: "h-12 animate-pulse rounded-xl border border-zinc-100 dark:border-slate-700 bg-zinc-50 dark:bg-slate-800" }, i))) }));
     }
     const formattedLastSync = draft.lastSyncedAt
         ? new Date(draft.lastSyncedAt).toLocaleString("en-IN", {
@@ -97,5 +100,5 @@ export function SellerGoogleReviewsView({ onSave, onSync, }) {
             timeStyle: "short",
         })
         : "Never";
-    return (_jsx(Div, { className: "py-4 px-3 sm:px-4 max-w-2xl", children: _jsxs(Stack, { gap: "lg", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-1", children: "Google Business Settings" }), _jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)] mb-4", children: "Connect your Google Business profile to sync reviews to your storefront." }), _jsxs(Stack, { gap: "md", children: [_jsx(Toggle, { checked: draft.isConnected, onChange: (v) => setDraft((d) => ({ ...d, isConnected: v })), label: "Show Google reviews on my store page" }), _jsx(FormField, { name: "placeId", label: "Google Place ID", type: "text", value: draft.placeId, onChange: (v) => setDraft((d) => ({ ...d, placeId: v })), placeholder: "ChIJ\u2026", helpText: "Find your Place ID at developers.google.com/maps/documentation/places/web-service/place-id" }), _jsx(FormField, { name: "businessName", label: "Business name", type: "text", value: draft.businessName, onChange: (v) => setDraft((d) => ({ ...d, businessName: v })), placeholder: "Pok\u00E9mon Palace" })] })] }), (draft.averageRating !== undefined || draft.totalReviews !== undefined) && (_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Review Stats" }), _jsxs(Div, { className: "flex flex-wrap gap-6", children: [draft.averageRating !== undefined && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-[var(--appkit-color-text-muted)] uppercase tracking-wide", children: "Avg rating" }), _jsx(Text, { className: "text-2xl font-bold tabular-nums", children: draft.averageRating.toFixed(1) })] })), draft.totalReviews !== undefined && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-[var(--appkit-color-text-muted)] uppercase tracking-wide", children: "Total reviews" }), _jsx(Text, { className: "text-2xl font-bold tabular-nums", children: draft.totalReviews })] })), _jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-[var(--appkit-color-text-muted)] uppercase tracking-wide", children: "Last synced" }), _jsx(Text, { className: "text-sm", children: formattedLastSync })] })] })] })), saveMessage && (_jsx(Alert, { variant: saveMessage.ok ? "success" : "error", children: saveMessage.text })), _jsxs(Div, { className: "flex items-center justify-between gap-3 border-t border-[var(--appkit-color-border)] pt-4", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: handleSync, isLoading: syncing, disabled: saving || !draft.placeId.trim(), className: "flex items-center gap-1.5", children: [_jsx(RefreshCw, { className: "h-3.5 w-3.5" }), ACTIONS.STORE["google-reviews-sync"].label] }), _jsx(Button, { variant: "primary", size: "sm", onClick: handleSave, isLoading: saving, disabled: syncing, children: ACTIONS.STORE["save-google-settings"].label })] })] }) }));
+    return (_jsx(Div, { paddingX: "x-sm-md", className: "max-w-2xl", padding: "y-md", children: _jsxs(Stack, { gap: "lg", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-1", children: "Google Business Settings" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] mb-4", size: "sm", children: "Connect your Google Business profile to sync reviews to your storefront." }), _jsxs(Stack, { gap: "md", children: [_jsx(Toggle, { checked: draft.isConnected, onChange: (v) => setDraft((d) => ({ ...d, isConnected: v })), label: "Show Google reviews on my store page" }), _jsx(FormField, { name: "placeId", label: "Google Place ID", type: "text", value: draft.placeId, onChange: (v) => setDraft((d) => ({ ...d, placeId: v })), placeholder: "ChIJ\u2026", helpText: "Find your Place ID at developers.google.com/maps/documentation/places/web-service/place-id" }), _jsx(FormField, { name: "businessName", label: "Business name", type: "text", value: draft.businessName, onChange: (v) => setDraft((d) => ({ ...d, businessName: v })), placeholder: "Pok\u00E9mon Palace" })] })] }), (draft.averageRating !== undefined || draft.totalReviews !== undefined) && (_jsxs(Section, { children: [_jsx(Heading, { level: 3, className: "mb-3", children: "Review Stats" }), _jsxs(Row, { wrap: true, gap: "lg", children: [draft.averageRating !== undefined && (_jsxs(Div, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-wide", size: "xs", transform: "uppercase", children: "Avg rating" }), _jsx(Text, { className: "tabular-nums", size: "2xl", weight: "bold", children: draft.averageRating.toFixed(1) })] })), draft.totalReviews !== undefined && (_jsxs(Div, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-wide", size: "xs", transform: "uppercase", children: "Total reviews" }), _jsx(Text, { className: "tabular-nums", size: "2xl", weight: "bold", children: draft.totalReviews })] })), _jsxs(Div, { children: [_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-wide", size: "xs", transform: "uppercase", children: "Last synced" }), _jsx(Text, { size: "sm", children: formattedLastSync })] })] })] })), saveMessage && (_jsx(Alert, { variant: saveMessage.ok ? "success" : "error", children: saveMessage.text })), _jsxs(Row, { className: "border-t border-[var(--appkit-color-border)]", padding: "t-md", align: "center", justify: "between", gap: "3", children: [_jsxs(Button, { gap: "sm", variant: "outline", size: "sm", onClick: handleSync, isLoading: syncing, disabled: saving || !draft.placeId.trim(), children: [_jsx(RefreshCw, { className: "h-3.5 w-3.5" }), ACTIONS.STORE["google-reviews-sync"].label] }), _jsx(Button, { variant: "primary", size: "sm", onClick: handleSave, isLoading: saving, disabled: syncing, children: ACTIONS.STORE["save-google-settings"].label })] })] }) }));
 }

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { sortBy } from "@mohasinac/appkit";
-import { Badge, Button, Div, Span } from "../../../ui";
+import { Row, sortBy } from "@mohasinac/appkit";
+import { Badge, Button, Span } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { buildBulkAction } from "../../../_internal/shared/actions/bulk-helpers";
@@ -22,7 +22,7 @@ const COLUMNS = [
     {
         key: "title",
         header: "Title",
-        render: (r) => _jsx(Span, { weight: "medium", className: "text-zinc-900 dark:text-zinc-100", children: r.title }),
+        render: (r) => _jsx(Span, { weight: "medium", color: "primary", children: r.title }),
     },
     {
         key: "groupTheme",
@@ -32,7 +32,7 @@ const COLUMNS = [
     {
         key: "productCount",
         header: "Products",
-        render: (r) => _jsx(Span, { size: "sm", className: "text-zinc-600 dark:text-zinc-400", children: r.productCount }),
+        render: (r) => _jsx(Span, { size: "sm", color: "muted", children: r.productCount }),
     },
     {
         key: "visibilityStatus",
@@ -47,7 +47,7 @@ const COLUMNS = [
     {
         key: "createdAt",
         header: "Created",
-        render: (r) => _jsx(Span, { size: "xs", className: "text-zinc-500 dark:text-zinc-400", children: r.createdAt }),
+        render: (r) => _jsx(Span, { size: "xs", color: "muted", children: r.createdAt }),
     },
 ];
 export function SellerGroupedListingsView({ onCreateClick, onEditClick, onDeleteClick, }) {
@@ -90,7 +90,7 @@ export function SellerGroupedListingsView({ onCreateClick, onEditClick, onDelete
                 }),
             ]
             : undefined,
-        renderRowActions: (row) => (_jsxs(Div, { className: "flex gap-1", children: [_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onEditClick?.(row.id), children: ACTIONS.STORE["edit-listing"].label }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => onDeleteClick?.(row.id), children: ACTIONS.STORE["delete-listing"].label })] })),
+        renderRowActions: (row) => (_jsxs(Row, { gap: "xs", children: [_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onEditClick?.(row.id), children: ACTIONS.STORE["edit-listing"].label }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => onDeleteClick?.(row.id), children: ACTIONS.STORE["delete-listing"].label })] })),
     };
     return _jsx(DataListingView, { config: config });
 }

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

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { sortBy } from "@mohasinac/appkit";
+import { Badge, Span, sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, Div, RowActionMenu, Text } from "../../../ui";
@@ -13,32 +13,30 @@ 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 }))] })),
+        render: (row) => (_jsxs(Div, { children: [_jsx(Text, { size: "sm", weight: "medium", children: row.title }), row.species && (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)] italic", size: "xs", children: row.species }))] })),
     },
-    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "text-sm tabular-nums", children: row.price }) },
+    { key: "price", header: "Price", render: (row) => _jsx(Text, { className: "tabular-nums", size: "sm", 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` : "—" })),
+        render: (row) => (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", 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-success-surface text-success"
-                : "bg-warning-surface text-warning"}`, children: row.vendorVerified ? "Verified" : "Pending" })),
+        render: (row) => (
+        // audit-variant-ok: vendor status badge — conditional bg-success-surface vs bg-warning-surface
+        _jsx(Span, { layout: "inline-flex", className: `${row.vendorVerified ? "bg-success-surface text-success" : "bg-warning-surface text-warning"}`, size: "xs", weight: "medium", rounded: "full", padding: "pill-xs", 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-success-surface text-success"
-                : "bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400"}`, children: row.status })),
+        render: (row) => (_jsx(Badge, { variant: row.status === "active" ? "active" : "inactive", size: "xs", className: "capitalize", children: row.status })),
     },
     {
         key: "createdAt",
         header: "Listed",
-        render: (row) => (_jsx(Text, { className: "text-sm text-[var(--appkit-color-text-muted)]", children: row.createdAt })),
+        render: (row) => (_jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: row.createdAt })),
     },
 ];
 export function SellerLiveView({ onCreateClick, onEditClick, onDelete, onBulkDelete, }) {

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

@@ -1,9 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState, useTransition } from "react";
-import { Alert, Badge, Button, Div, Heading, Input, LoginRequiredModal, Spinner, Text } from "../../../ui";
+import { Alert, Badge, Button, Div, Heading, Input, LoginRequiredModal, Row, Spinner, Stack, Text } from "../../../ui";
 import { isAuthError } from "../../../utils/auth-error";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
+import { normalizeError } from "../../../errors/normalize";
 function formatRupees(amount) {
     if (amount === undefined || amount === null)
         return "—";
@@ -73,8 +74,10 @@ function OfferCard({ offer, onRespond, onUpdate, onNeedsLogin }) {
                             : "countered",
                 });
                 setUiState("idle");
+                // audit-unknown-ok: error-handler entry point — accepts thrown values of any shape
             }
             catch (err) {
+                void normalizeError(err);
                 if (isAuthError(err)) {
                     onNeedsLogin();
                 }
@@ -106,7 +109,7 @@ function OfferCard({ offer, onRespond, onUpdate, onNeedsLogin }) {
         }
         submit({ action: "counter", offerId: offer.id, counterAmount: amount, sellerNote: sellerNote || undefined });
     }
-    return (_jsxs(Div, { surface: "card", padding: "sm", className: "space-y-3", children: [_jsxs(Div, { className: "flex items-start justify-between gap-2 flex-wrap", children: [_jsxs(Div, { className: "min-w-0", children: [_jsx(Text, { className: "font-semibold text-sm text-zinc-900 dark:text-zinc-100 truncate", children: offer.productTitle ?? "Unknown Product" }), _jsxs(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: [relativeTime(offer.createdAt), " \u00B7 ", isPendingOffer ? expiresIn(offer.expiresAt) : ""] })] }), _jsx(Badge, { variant: statusVariant(offer.status), className: "shrink-0 capitalize text-xs", children: offer.status })] }), _jsxs(Div, { className: "flex gap-4 flex-wrap", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-400 uppercase tracking-wide", children: "Listed" }), _jsx(Text, { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: formatRupees(offer.listedPrice) })] }), _jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-400 uppercase tracking-wide", children: "Offered" }), _jsx(Text, { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-100", children: formatRupees(offer.offerAmount) })] }), offer.counterAmount != null && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-400 uppercase tracking-wide", children: "Your Counter" }), _jsx(Text, { className: "text-sm font-medium text-info", children: formatRupees(offer.counterAmount) })] }))] }), offer.buyerNote && (_jsxs(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400 italic", children: ["\"", offer.buyerNote, "\""] })), isPendingOffer && uiState === "idle" && (_jsxs(Div, { className: "flex gap-2 flex-wrap", children: [_jsx(Button, { size: "sm", variant: "primary", onClick: toAccepting, disabled: isPending, children: "Accept" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toCountering, disabled: isPending, className: "border border-zinc-300 dark:border-zinc-600", children: "Counter" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toDeclining, disabled: isPending, className: "text-error border border-error/20", children: "Decline" })] })), uiState === "accepting" && (_jsxs(Div, { className: "space-y-2", children: [_jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Div, { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: "primary", onClick: handleAccept, disabled: isPending, children: isPending ? "Accepting…" : "Confirm Accept" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), uiState === "declining" && (_jsxs(Div, { className: "space-y-2", children: [_jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Div, { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: "ghost", onClick: handleDecline, disabled: isPending, className: "text-error border border-error/20", children: isPending ? "Declining…" : "Confirm Decline" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), uiState === "countering" && (_jsxs(Div, { className: "space-y-2", children: [_jsxs(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400", children: ["Suggest a price between the buyer's offer (", formatRupees(offer.offerAmount), ") and your listed price (", formatRupees(offer.listedPrice), ")."] }), _jsx(Input, { type: "number", placeholder: "Your counter amount (\u20B9)", value: counterInput, onChange: (e) => setCounterInput(e.target.value), disabled: isPending }), _jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Div, { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: "secondary", onClick: handleCounter, disabled: isPending, children: isPending ? "Sending…" : "Send Counter" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), error && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-xs", children: error }) })] }));
+    return (_jsxs(Stack, { surface: "card", padding: "sm", gap: "3", children: [_jsxs(Row, { align: "start", justify: "between", gap: "sm", wrap: true, children: [_jsxs(Div, { className: "min-w-0", children: [_jsx(Text, { className: "truncate", color: "primary", size: "sm", weight: "semibold", children: offer.productTitle ?? "Unknown Product" }), _jsxs(Text, { className: "mt-0.5", color: "muted", size: "xs", children: [relativeTime(offer.createdAt), " \u00B7 ", isPendingOffer ? expiresIn(offer.expiresAt) : ""] })] }), _jsx(Badge, { variant: statusVariant(offer.status), size: "xs", className: "shrink-0 capitalize", children: offer.status })] }), _jsxs(Row, { wrap: true, gap: "md", children: [_jsxs(Div, { children: [_jsx(Text, { className: "tracking-wide", color: "faint", size: "xs", transform: "uppercase", children: "Listed" }), _jsx(Text, { size: "sm", weight: "medium", color: "muted", children: formatRupees(offer.listedPrice) })] }), _jsxs(Div, { children: [_jsx(Text, { className: "tracking-wide", color: "faint", size: "xs", transform: "uppercase", children: "Offered" }), _jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: formatRupees(offer.offerAmount) })] }), offer.counterAmount != null && (_jsxs(Div, { children: [_jsx(Text, { className: "tracking-wide", color: "faint", size: "xs", transform: "uppercase", children: "Your Counter" }), _jsx(Text, { className: "text-info", size: "sm", weight: "medium", children: formatRupees(offer.counterAmount) })] }))] }), offer.buyerNote && (_jsxs(Text, { className: "italic", color: "muted", size: "xs", children: ["\"", offer.buyerNote, "\""] })), isPendingOffer && uiState === "idle" && (_jsxs(Row, { wrap: true, gap: "sm", children: [_jsx(Button, { size: "sm", variant: "primary", onClick: toAccepting, disabled: isPending, children: "Accept" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toCountering, disabled: isPending, border: "strong", children: "Counter" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toDeclining, disabled: isPending, className: "text-error border border-error/20", children: "Decline" })] })), uiState === "accepting" && (_jsxs(Stack, { gap: "sm", children: [_jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Row, { gap: "sm", children: [_jsx(Button, { size: "sm", variant: "primary", onClick: handleAccept, disabled: isPending, children: isPending ? "Accepting…" : "Confirm Accept" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), uiState === "declining" && (_jsxs(Stack, { gap: "sm", children: [_jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Row, { gap: "sm", children: [_jsx(Button, { size: "sm", variant: "ghost", onClick: handleDecline, disabled: isPending, className: "text-error border border-error/20", children: isPending ? "Declining…" : "Confirm Decline" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), uiState === "countering" && (_jsxs(Stack, { gap: "sm", children: [_jsxs(Text, { size: "xs", color: "muted", children: ["Suggest a price between the buyer's offer (", formatRupees(offer.offerAmount), ") and your listed price (", formatRupees(offer.listedPrice), ")."] }), _jsx(Input, { type: "number", placeholder: "Your counter amount (\u20B9)", value: counterInput, onChange: (e) => setCounterInput(e.target.value), disabled: isPending }), _jsx(Input, { placeholder: PLACEHOLDER_SELLER_NOTE, value: sellerNote, onChange: (e) => setSellerNote(e.target.value), disabled: isPending }), _jsxs(Row, { gap: "sm", children: [_jsx(Button, { size: "sm", variant: "secondary", onClick: handleCounter, disabled: isPending, children: isPending ? "Sending…" : "Send Counter" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: toIdle, disabled: isPending, children: ACTIONS.STORE["cancel-form"].label })] })] })), error && _jsx(Alert, { variant: "error", children: _jsx(Text, { size: "xs", children: error }) })] }));
 }
 export function SellerOffersPanel({ fetchEndpoint = "/api/store/offers", onRespond, className = "", }) {
     const [offers, setOffers] = useState([]);
@@ -134,6 +137,7 @@ export function SellerOffersPanel({ fetchEndpoint = "/api/store/offers", onRespo
             setOffers(json.items ?? json.offers ?? []);
         }
         catch (err) {
+            void normalizeError(err);
             setFetchError(err instanceof Error ? err.message : "Failed to load offers.");
         }
         finally {
@@ -153,5 +157,5 @@ export function SellerOffersPanel({ fetchEndpoint = "/api/store/offers", onRespo
         { value: "expired", label: "Expired" },
     ];
     const pending = offers.filter((o) => o.status === "pending").length;
-    return (_jsxs(Div, { className: `space-y-4 ${className}`, children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to manage offers. Please log in or create an account to continue." }), _jsxs(Div, { className: "flex items-center justify-between flex-wrap gap-2", children: [_jsxs(Div, { children: [_jsx(Heading, { level: 2, className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "Offers Received" }), pending > 0 && (_jsxs(Text, { className: "text-xs text-warning mt-0.5", children: [pending, " pending offer", pending > 1 ? "s" : "", " awaiting your response"] }))] }), _jsx(Button, { size: "sm", variant: "ghost", onClick: loadOffers, disabled: loading, className: "border border-zinc-300 dark:border-zinc-600 text-xs", children: loading ? "Refreshing…" : ACTIONS.STORE["refresh-offers"].label })] }), _jsx(Div, { className: "flex gap-1 flex-wrap", children: STATUS_FILTERS.map((f) => (_jsx(Button, { size: "sm", variant: statusFilter === f.value ? "primary" : "ghost", onClick: () => setStatusFilter(f.value), className: "text-xs px-2 py-1", children: f.label }, f.value))) }), fetchError && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-sm", children: fetchError }) }), loading && (_jsx(Div, { className: "flex justify-center py-12", children: _jsx(Spinner, { size: "lg" }) })), !loading && offers.length === 0 && (_jsx(Div, { className: "text-center py-12", children: _jsx(Text, { className: "text-zinc-400 dark:text-zinc-400 text-sm", children: "No offers found" }) })), !loading && offers.length > 0 && (_jsx(Div, { className: "space-y-3", children: offers.map((offer) => (_jsx(OfferCard, { offer: offer, onRespond: onRespond, onUpdate: handleUpdate, onNeedsLogin: () => setShowLoginModal(true) }, offer.id))) }))] }));
+    return (_jsxs(Stack, { className: `${className}`, gap: "md", children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to manage offers. Please log in or create an account to continue." }), _jsxs(Row, { align: "center", justify: "between", gap: "sm", wrap: true, children: [_jsxs(Div, { children: [_jsx(Heading, { level: 2, size: "lg", weight: "semibold", color: "primary", children: "Offers Received" }), pending > 0 && (_jsxs(Text, { className: "text-warning mt-0.5", size: "xs", children: [pending, " pending offer", pending > 1 ? "s" : "", " awaiting your response"] }))] }), _jsx(Button, { size: "sm", variant: "ghost", onClick: loadOffers, disabled: loading, border: "strong", textSize: "xs", children: loading ? "Refreshing…" : ACTIONS.STORE["refresh-offers"].label })] }), _jsx(Row, { wrap: true, gap: "xs", children: STATUS_FILTERS.map((f) => (_jsx(Button, { size: "sm", variant: statusFilter === f.value ? "primary" : "ghost", onClick: () => setStatusFilter(f.value), className: "text-xs px-2 py-1", children: f.label }, f.value))) }), fetchError && _jsx(Alert, { variant: "error", children: _jsx(Text, { size: "sm", children: fetchError }) }), loading && (_jsx(Row, { justify: "center", padding: "y-3xl", children: _jsx(Spinner, { size: "lg" }) })), !loading && offers.length === 0 && (_jsx(Div, { className: "text-center", padding: "y-3xl", children: _jsx(Text, { size: "sm", color: "faint", children: "No offers found" }) })), !loading && offers.length > 0 && (_jsx(Stack, { gap: "3", children: offers.map((offer) => (_jsx(OfferCard, { offer: offer, onRespond: onRespond, onUpdate: handleUpdate, onNeedsLogin: () => setShowLoginModal(true) }, offer.id))) }))] }));
 }