@mohasinac/appkit 2.8.2 → 2.8.4

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

@@ -1,9 +1,9 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
-import { StackedViewShell, Row, Text } from "../../../ui";
+import { StackedViewShell, Label, Row, Text } from "../../../ui";
 function DefaultDateRange({ from, to, onChange, labels, }) {
-    return (_jsxs(Row, { gap: "md", align: "center", wrap: true, className: "flex-wrap", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm text-[var(--appkit-color-text-muted)]", children: [_jsx(Text, { size: "sm", variant: "secondary", children: labels.dateFrom ?? "From" }), _jsx("input", { type: "date", value: from, onChange: (e) => onChange(e.target.value, to), className: "appkit-input text-sm py-1.5 px-3" })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm text-[var(--appkit-color-text-muted)]", children: [_jsx(Text, { size: "sm", variant: "secondary", children: labels.dateTo ?? "To" }), _jsx("input", { type: "date", value: to, onChange: (e) => onChange(from, e.target.value), className: "appkit-input text-sm py-1.5 px-3" })] })] }));
+    return (_jsxs(Row, { gap: "md", align: "center", wrap: true, className: "flex-wrap", children: [_jsxs(Label, { className: "flex items-center gap-2 text-sm text-[var(--appkit-color-text-muted)]", children: [_jsx(Text, { size: "sm", variant: "secondary", children: labels.dateFrom ?? "From" }), _jsx("input", { type: "date", value: from, onChange: (e) => onChange(e.target.value, to), className: "appkit-input text-sm py-1.5 px-3" })] }), _jsxs(Label, { className: "flex items-center gap-2 text-sm text-[var(--appkit-color-text-muted)]", children: [_jsx(Text, { size: "sm", variant: "secondary", children: labels.dateTo ?? "To" }), _jsx("input", { type: "date", value: to, onChange: (e) => onChange(from, e.target.value), className: "appkit-input text-sm py-1.5 px-3" })] })] }));
 }
 export function SellerAnalyticsView({ labels = {}, renderDateRange, renderStats, renderCharts, renderTopProducts, isLoading = false, ...rest }) {
     const [from, setFrom] = React.useState("");

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

@@ -1,5 +1,7 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { sieveFilter, SIEVE_OP } from "@mohasinac/appkit";
+import { sortBy } from "@mohasinac/appkit";
 import React, { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, FilterChipGroup, ListingLayout, RowActionMenu } from "../../../ui";
@@ -36,14 +38,14 @@ export function SellerAuctionsView({ children, onEditClick, onDelete, onBulkDele
         searchPlaceholder: "Search auctions by product name",
         emptyLabel: "No auctions found",
         filterKeys: ["status"],
-        defaultSort: "endsAt",
+        defaultSort: sortBy("endsAt", "ASC"),
         queryKey: ["seller", "auctions", "listing"],
         endpoint: SELLER_ENDPOINTS.AUCTIONS,
         sortOptions: [
             { value: "endsAt", label: "Ending soon" },
-            { value: "-endsAt", label: "Ending latest" },
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("endsAt", "DESC"), label: "Ending latest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
         ],
         mapRows: (response) => toRecordArray(response.auctions).map((item, index) => ({
             id: toStringValue(item.id, `auction-${index}`),
@@ -58,7 +60,7 @@ export function SellerAuctionsView({ children, onEditClick, onDelete, onBulkDele
         getTotal: (response, mappedRows) => typeof response.meta?.total === "number"
             ? response.meta.total
             : mappedRows.length,
-        buildFilters: (state) => state.status && state.status !== "All" ? `status==${state.status}` : undefined,
+        buildFilters: (state) => state.status && state.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, state.status) : undefined,
         buildBulkActions: onBulkDelete
             ? (selection) => [
                 {

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

@@ -1,9 +1,11 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { sieveFilter, SIEVE_OP } from "@mohasinac/appkit";
+import { sortBy } from "@mohasinac/appkit";
 import React, { useState, useCallback } from "react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
-import { Badge, BulkActionBar, Div, FilterChipGroup, ListingFilterDrawer, ListingToolbar, Pagination, Text, useToast } from "../../../ui";
+import { Badge, BulkActionBar, Div, FilterChipGroup, ListingFilterDrawer, ListingToolbar, Pagination, Span, Text, useToast } 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";
@@ -18,9 +20,9 @@ const PAGE_SIZE = 25;
 const FILTER_KEYS = ["status"];
 const DEFAULT_SORT = "-bidDate";
 const SORT_OPTIONS = [
-    { value: "-bidDate", label: "Newest" },
+    { value: sortBy("bidDate", "DESC"), label: "Newest" },
     { value: "bidDate", label: "Oldest" },
-    { value: "-bidAmount", label: "Highest Bid" },
+    { value: sortBy("bidAmount", "DESC"), label: "Highest Bid" },
     { value: "bidAmount", label: "Lowest Bid" },
 ];
 const STATUS_OPTIONS = SELLER_BID_STATUS_TABS;
@@ -67,7 +69,7 @@ export function SellerBidsView({ endpoint = SELLER_ENDPOINTS.BIDS }) {
     const activeFilterCount = FILTER_KEYS.filter((k) => !!table.get(k)).length;
     const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT || activeFilterCount > 0;
     const statusRaw = table.get("status");
-    const filters = statusRaw ? `status==${statusRaw}` : undefined;
+    const filters = statusRaw ? sieveFilter("status", SIEVE_OP.EQ, statusRaw) : undefined;
     const productIdFilter = table.get("productId") || undefined;
     const endpointWithProduct = productIdFilter
         ? `${endpoint}?productId=${encodeURIComponent(productIdFilter)}`
@@ -97,19 +99,19 @@ export function SellerBidsView({ endpoint = SELLER_ENDPOINTS.BIDS }) {
         {
             key: "productTitle",
             header: "Auction",
-            render: (row) => (_jsxs("div", { className: "space-y-0.5", children: [_jsx(Text, { className: "font-medium text-sm text-zinc-900 dark:text-zinc-100 line-clamp-1", children: row.productTitle }), _jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-400 font-mono", children: row.productId })] })),
+            render: (row) => (_jsxs(Div, { className: "space-y-0.5", children: [_jsx(Text, { className: "font-medium text-sm text-zinc-900 dark:text-zinc-100 line-clamp-1", children: row.productTitle }), _jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-400 font-mono", children: row.productId })] })),
         },
         {
             key: "userName",
             header: "Bidder",
             className: "w-36",
-            render: (row) => _jsx("span", { className: "text-sm text-zinc-700 dark:text-zinc-300", children: row.userName }),
+            render: (row) => _jsx(Span, { size: "sm", className: "text-zinc-700 dark:text-zinc-300", children: row.userName }),
         },
         {
             key: "bidAmount",
             header: "Bid",
             className: "w-28 text-right",
-            render: (row) => (_jsx("span", { className: "font-semibold text-sm text-zinc-900 dark:text-zinc-100", children: toRupees(row.bidAmount) })),
+            render: (row) => (_jsx(Span, { size: "sm", weight: "semibold", className: "text-zinc-900 dark:text-zinc-100", children: toRupees(row.bidAmount) })),
         },
         {
             key: "status",
@@ -121,7 +123,7 @@ export function SellerBidsView({ endpoint = SELLER_ENDPOINTS.BIDS }) {
             key: "bidDate",
             header: "Date",
             className: "w-28",
-            render: (row) => _jsx("span", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: row.bidDate }),
+            render: (row) => _jsx(Span, { size: "xs", className: "text-zinc-500 dark:text-zinc-400", children: row.bidDate }),
         },
     ];
     const selection = useBulkSelection({ items: rows ?? [], keyExtractor: (r) => r.id });
@@ -165,8 +167,8 @@ export function SellerBidsView({ endpoint = SELLER_ENDPOINTS.BIDS }) {
         buildBulkAction(ACTIONS.SELLER["cancel-bid"], () => void bulkCancel()),
     ];
     useBottomActions(selection.selectedCount > 0 ? { bulk: { selectedCount: selection.selectedCount, onClearSelection: selection.clearSelection, actions: bulkActions } } : {});
-    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search by bidder name", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), 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.selectedIds.length > 0 && (_jsx("div", { className: "sticky z-20 px-3 sm:px-4 py-2 bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700", style: { top: "calc(var(--header-height, 0px) + 88px)" }, children: _jsx(BulkActionBar, { selectedCount: selection.selectedIds.length, onClearSelection: selection.clearSelection, actions: bulkActions }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx(Div, { className: "mb-4 rounded-xl border border-error/20 bg-error-surface px-4 py-3 text-sm text-error", children: errorMessage })), table.get("grouped") === "0" ? (_jsx(DataTable, { rows: rows, columns: columns, isLoading: isLoading, emptyLabel: "No bids found for your auctions", selectedIds: selection.selectedIdSet, onToggleSelect: selection.toggle, onToggleSelectAll: () => selection.toggleAll() })) : (_jsxs("div", { className: "space-y-3", children: [groupedRows.length === 0 && !isLoading && (_jsx(Text, { className: "text-sm text-zinc-500 dark:text-zinc-400", children: "No bids found for your auctions." })), groupedRows.map((group) => {
+    return (_jsxs(Div, { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search by bidder name", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), 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.selectedIds.length > 0 && (_jsx(Div, { className: "sticky z-20 px-3 sm:px-4 py-2 bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700", style: { top: "calc(var(--header-height, 0px) + 88px)" }, children: _jsx(BulkActionBar, { selectedCount: selection.selectedIds.length, onClearSelection: selection.clearSelection, actions: bulkActions }) })), _jsxs(Div, { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx(Div, { className: "mb-4 rounded-xl border border-error/20 bg-error-surface px-4 py-3 text-sm text-error", children: errorMessage })), table.get("grouped") === "0" ? (_jsx(DataTable, { rows: rows, columns: columns, isLoading: isLoading, emptyLabel: "No bids found for your auctions", selectedIds: selection.selectedIdSet, onToggleSelect: selection.toggle, onToggleSelectAll: () => selection.toggleAll() })) : (_jsxs(Div, { className: "space-y-3", children: [groupedRows.length === 0 && !isLoading && (_jsx(Text, { className: "text-sm text-zinc-500 dark:text-zinc-400", children: "No bids found for your auctions." })), groupedRows.map((group) => {
                                 const collapsed = collapsedGroups.has(group.id);
-                                return (_jsxs(Div, { className: "rounded-lg border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", children: [_jsxs("button", { type: "button", onClick: () => toggleGroup(group.id), className: "w-full flex items-center justify-between px-4 py-2.5 text-sm font-semibold text-[var(--appkit-color-text)] hover:bg-[var(--appkit-color-surface-raised)]", children: [_jsxs("span", { className: "truncate", children: [group.title, " ", _jsxs("span", { className: "text-xs text-[var(--appkit-color-text-muted)] font-normal", children: ["\u00B7 ", group.bids.length, " bid", group.bids.length === 1 ? "" : "s"] })] }), _jsx("span", { "aria-hidden": true, className: "text-[var(--appkit-color-text-muted)]", children: collapsed ? "▸" : "▾" })] }), !collapsed && (_jsx("div", { className: "border-t border-[var(--appkit-color-border)]", children: _jsx(DataTable, { rows: group.bids, columns: columns, isLoading: false, emptyLabel: "", selectedIds: selection.selectedIdSet, onToggleSelect: selection.toggle }) }))] }, group.id));
+                                return (_jsxs(Div, { className: "rounded-lg border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", children: [_jsxs("button", { type: "button", onClick: () => toggleGroup(group.id), className: "w-full flex items-center justify-between px-4 py-2.5 text-sm font-semibold text-[var(--appkit-color-text)] hover:bg-[var(--appkit-color-surface-raised)]", children: [_jsxs(Span, { className: "truncate", children: [group.title, " ", _jsxs(Span, { size: "xs", weight: "normal", className: "text-[var(--appkit-color-text-muted)]", children: ["\u00B7 ", group.bids.length, " bid", group.bids.length === 1 ? "" : "s"] })] }), _jsx(Span, { "aria-hidden": true, className: "text-[var(--appkit-color-text-muted)]", children: collapsed ? "▸" : "▾" })] }), !collapsed && (_jsx(Div, { className: "border-t border-[var(--appkit-color-border)]", children: _jsx(DataTable, { rows: group.bids, columns: columns, isLoading: false, emptyLabel: "", selectedIds: selection.selectedIdSet, onToggleSelect: selection.toggle }) }))] }, group.id));
                             })] }))] }), _jsx(ListingFilterDrawer, { open: filterOpen, onClose: () => setFilterOpen(false), onApply: applyFilters, onClear: clearFilters, activeCount: activeFilterCount, children: _jsx(FilterChipGroup, { label: "Bid Status", tabs: STATUS_OPTIONS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })), allId: "" }) })] }));
 }

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

@@ -1,11 +1,13 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, RowActionMenu, Text } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { ROUTES } from "../../..";
+const CLS_ITEMS_PILL = "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium bg-violet-100 text-violet-700 dark:bg-violet-900/40 dark:text-violet-300 tabular-nums";
 import { toRecordArray, toRelativeDate, toRupees, toStringValue, } from "../../admin/hooks/useAdminListingData";
 import { DataListingView } from "../../admin/components/DataListingView";
 const COLUMNS = [
@@ -14,7 +16,7 @@ const COLUMNS = [
     {
         key: "itemCount",
         header: "Items",
-        render: (row) => (_jsx("span", { className: "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium bg-violet-100 text-violet-700 dark:bg-violet-900/40 dark:text-violet-300 tabular-nums", children: row.itemCount })),
+        render: (row) => (_jsx("span", { className: CLS_ITEMS_PILL, children: row.itemCount })),
     },
     {
         key: "status",
@@ -59,16 +61,16 @@ export function SellerBundlesView({ onCreateClick, onEditClick, onDelete, onBulk
         searchPlaceholder: "Search bundles...",
         emptyLabel: "No bundles yet — create a bundle to group multiple products together",
         filterKeys: [],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "bundles"],
         endpoint: SELLER_ENDPOINTS.PRODUCTS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "productTitle", label: "Name A–Z" },
-            { value: "-productTitle", label: "Name Z–A" },
-            { value: "price", label: "Price: Low–High" },
-            { value: "-price", label: "Price: High–Low" },
+            { value: sortBy("productTitle", "DESC"), label: "Name Z–A" },
+            { value: sortBy("price", "ASC"), label: "Price: Low–High" },
+            { value: sortBy("price", "DESC"), label: "Price: High–Low" },
         ],
         columns: COLUMNS,
         mapRows: (response) => toRecordArray(response.products).map((item, index) => ({

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

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, RowActionMenu, Text } from "../../../ui";
@@ -66,15 +67,15 @@ export function SellerClassifiedView({ onCreateClick, onEditClick, onDelete, onB
         searchPlaceholder: "Search classified listings...",
         emptyLabel: "No classified listings yet — post your first buy/sell/trade ad",
         filterKeys: [],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "classified"],
         endpoint: SELLER_ENDPOINTS.PRODUCTS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "productTitle", label: "Name A–Z" },
-            { value: "price", label: "Price: Low–High" },
-            { value: "-price", label: "Price: High–Low" },
+            { value: sortBy("price", "ASC"), label: "Price: Low–High" },
+            { value: sortBy("price", "DESC"), label: "Price: High–Low" },
         ],
         columns: COLUMNS,
         mapRows: (response) => toRecordArray(response.products).map((item, index) => {

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

@@ -9,6 +9,8 @@ export interface CouponEditorDraft {
     startDate: string;
     endDate: string;
     isActive: boolean;
+    applicableProducts: string[];
+    applicableCategories: string[];
 }
 export interface SellerCouponEditorViewProps {
     couponId?: string;

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

@@ -1,10 +1,16 @@
 "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, Stack, Text } from "../../../ui";
+import { Badge, Button, Div, Heading, Input, Row, Select, Span, Stack, Text } from "../../../ui";
+import { ProductInlineSelect } from "./ProductInlineSelect";
+import { CategoryInlineSelect } from "./CategoryInlineSelect";
+const __O = {
+    hidden: "overflow-hidden",
+};
 // ---------------------------------------------------------------------------
 // Types
 // ---------------------------------------------------------------------------
+const CLS_SECTION_LABEL = "font-medium text-[var(--appkit-color-text-secondary)] mb-3";
 const TYPE_OPTIONS = [
     { value: "percentage", label: "Percentage off (e.g. 10%)" },
     { value: "fixed", label: "Fixed amount off (e.g. ₹50)" },
@@ -21,6 +27,8 @@ const EMPTY_DRAFT = {
     startDate: "",
     endDate: "",
     isActive: true,
+    applicableProducts: [],
+    applicableCategories: [],
 };
 // ---------------------------------------------------------------------------
 // Component
@@ -61,7 +69,11 @@ 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 overflow-hidden", children: [_jsx("div", { className: "h-[3px] w-full", 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"
+    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", 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"
                                 ? "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: "font-medium text-[var(--appkit-color-text-secondary)] mb-3", 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: "font-medium text-[var(--appkit-color-text-secondary)] mb-3", 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 })] })] }), _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" })] }) })] }) }));
+                                : "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) => {
+                                                        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" })] }) })] }) }));
 }

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

@@ -1,5 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { sieveFilter, SIEVE_OP } 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";
@@ -48,12 +50,12 @@ export function SellerCouponsView({ onCreateClick, onEditClick, onToggle, onDele
         searchPlaceholder: "Search by coupon code",
         emptyLabel: "No coupons found — create your first coupon",
         filterKeys: ["isActive"],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "coupons", "listing"],
         endpoint: SELLER_ENDPOINTS.COUPONS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "code", label: "Code A–Z" },
         ],
         hideTableView: true,
@@ -63,11 +65,11 @@ export function SellerCouponsView({ onCreateClick, onEditClick, onToggle, onDele
             isActive: getIsActive(item),
         })),
         getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
-        buildFilters: (state) => state.isActive ? `isActive==${state.isActive}` : undefined,
+        buildFilters: (state) => state.isActive ? sieveFilter("isActive", SIEVE_OP.EQ, state.isActive) : undefined,
         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(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: [
                         { label: "All", value: "" },
                         { label: "Active", value: "true" },
                         { label: "Inactive", value: "false" },

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, { 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))) }));
 }
 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, { 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))) }));
 }
 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

@@ -1,8 +1,9 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
-import { ConfirmDeleteModal, RowActionMenu, Text } from "../../../ui";
+import { ConfirmDeleteModal, RowActionMenu, Span, Text } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { ROUTES } from "../../..";
@@ -24,7 +25,7 @@ const COLUMNS = [
     {
         key: "deliveryMethod",
         header: "Delivery",
-        render: (row) => (_jsx("span", { className: "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium bg-zinc-100 text-zinc-600 dark:bg-slate-800 dark:text-slate-400 capitalize", children: row.deliveryMethod.replace(/-/g, " ") })),
+        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, " ") })),
     },
     {
         key: "status",
@@ -69,14 +70,14 @@ export function SellerDigitalCodesView({ onCreateClick, onEditClick, onDelete, o
         searchPlaceholder: "Search digital code listings...",
         emptyLabel: "No digital code listings yet",
         filterKeys: [],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "digital-codes"],
         endpoint: SELLER_ENDPOINTS.PRODUCTS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "productTitle", label: "Name A–Z" },
-            { value: "price", label: "Price: Low–High" },
+            { value: sortBy("price", "ASC"), label: "Price: Low–High" },
         ],
         columns: COLUMNS,
         mapRows: (response) => toRecordArray(response.products).map((item, index) => {

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

@@ -89,7 +89,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(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))) }));
     }
     const formattedLastSync = draft.lastSyncedAt
         ? new Date(draft.lastSyncedAt).toLocaleString("en-IN", {
@@ -97,5 +97,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, { 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 })] })] }) }));
 }

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

@@ -1,6 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Badge, Button } from "../../../ui";
+import { sortBy } from "@mohasinac/appkit";
+import { Badge, Button, Div, 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";
@@ -21,7 +22,7 @@ const COLUMNS = [
     {
         key: "title",
         header: "Title",
-        render: (r) => _jsx("span", { className: "font-medium text-zinc-900 dark:text-zinc-100", children: r.title }),
+        render: (r) => _jsx(Span, { weight: "medium", className: "text-zinc-900 dark:text-zinc-100", children: r.title }),
     },
     {
         key: "groupTheme",
@@ -31,7 +32,7 @@ const COLUMNS = [
     {
         key: "productCount",
         header: "Products",
-        render: (r) => _jsx("span", { className: "text-sm text-zinc-600 dark:text-zinc-400", children: r.productCount }),
+        render: (r) => _jsx(Span, { size: "sm", className: "text-zinc-600 dark:text-zinc-400", children: r.productCount }),
     },
     {
         key: "visibilityStatus",
@@ -46,7 +47,7 @@ const COLUMNS = [
     {
         key: "createdAt",
         header: "Created",
-        render: (r) => _jsx("span", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: r.createdAt }),
+        render: (r) => _jsx(Span, { size: "xs", className: "text-zinc-500 dark:text-zinc-400", children: r.createdAt }),
     },
 ];
 export function SellerGroupedListingsView({ onCreateClick, onEditClick, onDeleteClick, }) {
@@ -56,14 +57,14 @@ export function SellerGroupedListingsView({ onCreateClick, onEditClick, onDelete
         searchPlaceholder: "Search grouped listings",
         emptyLabel: "No grouped listings yet",
         filterKeys: [],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "grouped-listings"],
         endpoint: SELLER_ENDPOINTS.GROUPED_LISTINGS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "title", label: "Title A–Z" },
-            { value: "-title", label: "Title Z–A" },
+            { value: sortBy("title", "DESC"), label: "Title Z–A" },
         ],
         columns: COLUMNS,
         mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
@@ -89,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(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 })] })),
     };
     return _jsx(DataListingView, { config: config });
 }

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

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { sortBy } from "@mohasinac/appkit";
 import { useState, useCallback } from "react";
 import { useEntityDelete } from "../../../react/hooks/useEntityDelete";
 import { ConfirmDeleteModal, Div, RowActionMenu, Text } from "../../../ui";
@@ -70,15 +71,15 @@ export function SellerLiveView({ onCreateClick, onEditClick, onDelete, onBulkDel
         searchPlaceholder: "Search live item listings...",
         emptyLabel: "No live item listings yet",
         filterKeys: [],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "live-items"],
         endpoint: SELLER_ENDPOINTS.PRODUCTS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
             { value: "productTitle", label: "Name A–Z" },
-            { value: "price", label: "Price: Low–High" },
-            { value: "-price", label: "Price: High–Low" },
+            { value: sortBy("price", "ASC"), label: "Price: Low–High" },
+            { value: sortBy("price", "DESC"), label: "Price: High–Low" },
         ],
         columns: COLUMNS,
         mapRows: (response) => toRecordArray(response.products).map((item, index) => {

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

@@ -1,5 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { sieveFilter, SIEVE_OP } from "@mohasinac/appkit";
+import { sortBy } from "@mohasinac/appkit";
 import React from "react";
 import { FilterChipGroup, ListingLayout, RowActionMenu } from "../../../ui";
 import { SELLER_ENDPOINTS } from "../../../constants/api-endpoints";
@@ -17,12 +19,12 @@ export function SellerOffersView({ children, onAcceptOffer, onRejectOffer, onCou
         searchPlaceholder: "Search offers by product or buyer name",
         emptyLabel: "No offers received",
         filterKeys: ["status"],
-        defaultSort: "-createdAt",
+        defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["seller", "offers", "listing"],
         endpoint: SELLER_ENDPOINTS.OFFERS,
         sortOptions: [
-            { value: "-createdAt", label: "Newest" },
-            { value: "createdAt", label: "Oldest" },
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
         ],
         mapRows: (response) => toRecordArray(response.offers).map((item, index) => ({
             id: toStringValue(item.id, `offer-${index}`),
@@ -37,7 +39,7 @@ export function SellerOffersView({ children, onAcceptOffer, onRejectOffer, onCou
         getTotal: (response, mappedRows) => typeof response.meta?.total === "number"
             ? response.meta.total
             : mappedRows.length,
-        buildFilters: (state) => state.status && state.status !== "All" ? `status==${state.status}` : undefined,
+        buildFilters: (state) => state.status && state.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, state.status) : undefined,
         renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [
                 ...(onAcceptOffer
                     ? [{ label: ACTIONS.STORE["accept-offer"].label, onClick: () => void onAcceptOffer(row.id) }]