@mohasinac/appkit 2.3.1 → 2.3.2

package/dist/features/auctions/components/AuctionDetailPageView.js

@@ -4,68 +4,114 @@ import { productRepository } from "../../../repositories";
 import { listBidsByProduct } from "../../auctions/actions/bid-actions";
 import { ROUTES } from "../../../next";
 import { getDefaultCurrency } from "../../../core/baseline-resolver";
-import { Button, Container, Div, Heading, Input, Main, Row, Section, Span, Stack, Text, } from "../../../ui";
+import { formatCurrency } from "../../../utils/number.formatter";
+import { normalizeRichTextHtml } from "../../../utils/string.formatter";
+import { safeDisplayName } from "../../../security";
+import { Button, Container, Div, Heading, Input, Main, RichText, Row, Section, Span, Stack, Text, } from "../../../ui";
 import { AuctionDetailView } from "../../products/components/AuctionDetailView";
 import { BidHistory } from "../../products/components/BidHistory";
+import { BuyBar } from "../../products/components/BuyBar";
 import { RelatedProducts } from "../../products/components/RelatedProducts";
+import { ProductGalleryClient } from "../../products/components/ProductGalleryClient";
+import { ProductFeatureBadges } from "../../products/components/ProductFeatureBadges";
 import { MarketplaceAuctionGrid } from "./MarketplaceAuctionGrid";
+function toDescriptionHtml(raw) {
+    if (!raw)
+        return "";
+    const s = typeof raw === "string" ? raw : JSON.stringify(raw);
+    return normalizeRichTextHtml(s);
+}
 export async function AuctionDetailPageView({ id }) {
     const [product, bidsResult] = await Promise.all([
         productRepository.findByIdOrSlug(id).catch(() => undefined),
         listBidsByProduct(id, { pageSize: 20 }).catch(() => null),
     ]);
-    const relatedDocs = product
-        ? await productRepository
-            .findByCategory(product.category ?? "")
-            .catch(() => [])
-        : [];
     if (!product) {
         return (_jsx(Main, { children: _jsx(Section, { className: "py-20", children: _jsx(Container, { size: "md", children: _jsxs(Stack, { align: "center", gap: "md", className: "text-center", children: [_jsx(Heading, { level: 1, className: "text-2xl font-semibold text-zinc-900 dark:text-zinc-50", children: "Auction Not Found" }), _jsx(Text, { className: "text-zinc-500", children: "This auction may have ended or the link is incorrect." }), _jsx(Link, { href: String(ROUTES.PUBLIC.AUCTIONS), className: "text-sm font-medium text-primary-600 hover:underline", children: "Browse Auctions" })] }) }) }) }));
     }
     const p = product;
     const currency = p.currency || getDefaultCurrency();
-    const currentBid = typeof p.currentBid === "number" ? p.currentBid : p.startingBid ?? p.price ?? 0;
-    const currentBidFormatted = new Intl.NumberFormat(undefined, {
-        style: "currency",
-        currency,
-    }).format(currentBid);
-    const startingBidFormatted = new Intl.NumberFormat(undefined, {
-        style: "currency",
-        currency,
-    }).format(p.startingBid ?? p.price ?? 0);
-    const images = Array.isArray(p.images) ? p.images : p.imageUrl ? [p.imageUrl] : [];
-    const primaryImage = images[0];
+    const title = String(p.title ?? p.name ?? "Auction Item");
+    const currentBid = typeof p.currentBid === "number"
+        ? p.currentBid
+        : typeof p.startingBid === "number"
+            ? p.startingBid
+            : typeof p.price === "number"
+                ? p.price
+                : 0;
+    const startingBid = typeof p.startingBid === "number"
+        ? p.startingBid
+        : typeof p.price === "number"
+            ? p.price
+            : 0;
+    const minBidIncrement = typeof p.minBidIncrement === "number" ? p.minBidIncrement : 1;
+    const images = Array.isArray(p.images)
+        ? p.images
+        : typeof p.mainImage === "string"
+            ? [p.mainImage]
+            : [];
     const endDate = p.auctionEndDate ? new Date(p.auctionEndDate) : null;
     const isEnded = endDate ? endDate < new Date() : false;
     const bidCount = typeof p.bidCount === "number" ? p.bidCount : 0;
-    return (_jsx(AuctionDetailView, { renderGallery: () => primaryImage ? (_jsx(Div, { className: "overflow-hidden rounded-xl border border-zinc-100 dark:border-zinc-800", children: _jsx(Div, { role: "img", "aria-label": p.title ?? p.name ?? "Auction item", className: "aspect-square w-full bg-cover bg-center", style: { backgroundImage: `url(${primaryImage})` } }) })) : (_jsx(Div, { className: "overflow-hidden rounded-xl border border-zinc-100 bg-zinc-50 dark:border-zinc-800 dark:bg-zinc-900", children: _jsx(Div, { className: "flex aspect-square items-center justify-center text-zinc-300 dark:text-zinc-700", children: _jsxs("svg", { width: "64", height: "64", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", "aria-hidden": "true", children: [_jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }), _jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5" }), _jsx("path", { d: "M21 15l-5-5L5 21" })] }) }) })), renderInfo: () => (_jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 1, className: "text-2xl font-bold text-zinc-900 dark:text-zinc-50", children: p.title ?? p.name ?? "Auction Item" }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Span, { className: "text-2xl font-semibold text-primary-600 dark:text-primary-400", children: currentBidFormatted }), _jsxs(Span, { className: "text-sm text-zinc-500", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids"] }), isEnded && (_jsx(Span, { className: "rounded-full bg-red-100 px-2.5 py-0.5 text-xs font-medium text-red-700 dark:bg-red-900/30 dark:text-red-400", children: "Ended" }))] }), endDate && !isEnded && (_jsxs(Text, { className: "text-sm text-zinc-600 dark:text-zinc-400", children: ["Ends: ", endDate.toLocaleString()] })), p.description && (_jsx(Text, { className: "text-sm leading-relaxed text-zinc-600 dark:text-zinc-400", children: typeof p.description === "string" ? p.description : "" })), p.sellerName && (_jsxs(Row, { align: "center", gap: "xs", children: [_jsx(Span, { className: "text-xs text-zinc-500", children: "Listed by" }), _jsx(Span, { className: "text-xs font-medium text-zinc-700 dark:text-zinc-300", children: p.sellerName })] }))] })), renderBidForm: () => (_jsx(Div, { className: "rounded-xl border border-zinc-100 bg-zinc-50 p-5 dark:border-zinc-800 dark:bg-zinc-900", children: _jsxs(Stack, { gap: "sm", children: [_jsxs(Text, { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: ["Current bid: ", currentBidFormatted] }), _jsxs(Text, { className: "text-xs text-zinc-500", children: ["Starting bid: ", startingBidFormatted] }), _jsx(Input, { type: "number", placeholder: `Minimum bid`, min: currentBid + 1, "aria-label": "Your bid amount", disabled: isEnded }), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded, children: isEnded ? "Auction Ended" : "Place Bid" })] }) })), renderMobileBidForm: () => !isEnded ? (_jsx(Div, { className: "rounded-xl border border-zinc-100 bg-zinc-50 p-4 dark:border-zinc-800 dark:bg-zinc-900 lg:hidden", children: _jsxs(Stack, { gap: "sm", children: [_jsxs(Row, { align: "center", gap: "sm", children: [_jsx(Span, { className: "text-base font-semibold text-primary-600", children: currentBidFormatted }), _jsxs(Span, { className: "text-xs text-zinc-500", children: [bidCount, " bids"] })] }), _jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Place Bid" })] }) })) : null, renderBidHistory: () => {
-            const bids = (bidsResult?.items ?? []).map((b) => ({
-                id: b.id,
-                bidderId: b.userId ?? b.bidderId ?? "",
-                bidderName: b.bidderName ?? b.userName,
-                amount: b.bidAmount ?? b.amount ?? 0,
-                placedAt: b.createdAt ?? b.bidAt ?? "",
-            }));
-            return (_jsx(BidHistory, { bids: bids, isEmpty: bids.length === 0, labels: { title: "Bid History" } }));
-        }, renderRelated: () => {
-            const related = relatedDocs
-                .filter((r) => r.id !== product.id && r.isAuction !== false)
-                .slice(0, 4)
-                .map((r) => ({
-                id: String(r.id ?? ""),
-                title: String(r.name ?? r.title ?? "Auction Item"),
-                price: typeof r.price === "number" ? r.price : 0,
-                currency: typeof r.currency === "string" ? r.currency : undefined,
-                mainImage: Array.isArray(r.images) ? r.images[0] : typeof r.imageUrl === "string" ? r.imageUrl : undefined,
-                isAuction: true,
-                auctionEndDate: r.auctionEndDate,
-                startingBid: typeof r.startingBid === "number" ? r.startingBid : undefined,
-                currentBid: typeof r.currentBid === "number" ? r.currentBid : undefined,
-                bidCount: typeof r.bidCount === "number" ? r.bidCount : undefined,
-                slug: typeof r.slug === "string" ? r.slug : undefined,
-            }));
-            if (related.length === 0)
-                return null;
-            return (_jsx(RelatedProducts, { labels: { title: "Similar Auctions" }, renderGrid: () => (_jsx(MarketplaceAuctionGrid, { auctions: related, gridClassName: "grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4" })) }));
-        } }));
+    const buyNowPrice = typeof p.buyNowPrice === "number" ? p.buyNowPrice : null;
+    const condition = typeof p.condition === "string" ? p.condition : null;
+    const featured = p.featured === true;
+    const shippingPaidBy = p.shippingPaidBy;
+    const freeShipping = shippingPaidBy === "seller";
+    const sellerName = typeof p.sellerName === "string" ? p.sellerName : null;
+    const safeSeller = sellerName ? safeDisplayName(sellerName, "") : null;
+    const tags = Array.isArray(p.tags) ? p.tags : [];
+    const features = Array.isArray(p.features) ? p.features : [];
+    const descriptionHtml = toDescriptionHtml(p.description);
+    const relatedDocs = await productRepository
+        .findByCategory(String(p.category ?? ""))
+        .catch(() => []);
+    return (_jsx(Main, { children: _jsxs(Container, { size: "xl", className: "px-4 py-6", children: [_jsxs("nav", { "aria-label": "Breadcrumb", className: "mb-4 flex items-center gap-1.5 text-xs text-zinc-500 dark:text-zinc-400 flex-wrap", children: [_jsx(Link, { href: String(ROUTES.HOME), className: "hover:text-primary-600 transition-colors", children: "Home" }), _jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.AUCTIONS), className: "hover:text-primary-600 transition-colors", children: "Auctions" }), _jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Span, { className: "text-zinc-700 dark:text-zinc-300 truncate max-w-[200px]", children: title })] }), _jsx(AuctionDetailView, { renderGallery: () => (_jsx(ProductGalleryClient, { images: images, productName: title })), renderInfo: () => (_jsxs(Stack, { gap: "sm", children: [_jsxs(Div, { children: [_jsx(Span, { className: "mb-1.5 inline-block rounded-full bg-amber-100 dark:bg-amber-900/30 px-2.5 py-0.5 text-xs font-semibold text-amber-700 dark:text-amber-300", children: "\uD83C\uDFF7\uFE0F Live Auction" }), _jsx(Heading, { level: 1, className: "text-xl font-bold leading-snug text-zinc-900 dark:text-zinc-50 sm:text-2xl", children: title })] }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-500", children: "Current bid" }), _jsx(Span, { className: "text-2xl font-bold text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) })] }), _jsxs(Span, { className: "rounded-full bg-zinc-100 dark:bg-zinc-800 px-3 py-1 text-sm font-medium text-zinc-600 dark:text-zinc-300", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids"] }), isEnded ? (_jsx(Span, { className: "rounded-full bg-red-100 px-2.5 py-0.5 text-xs font-medium text-red-700 dark:bg-red-900/30 dark:text-red-400", children: "Ended" })) : (_jsx(Span, { className: "rounded-full bg-emerald-100 px-2.5 py-0.5 text-xs font-medium text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400", children: "Active" }))] }), endDate && (_jsxs(Row, { align: "center", gap: "xs", className: "text-sm text-zinc-600 dark:text-zinc-400", children: [_jsxs(Span, { children: [isEnded ? "Ended" : "Ends", ":"] }), _jsx(Span, { className: "font-medium", children: endDate.toLocaleString() })] })), buyNowPrice !== null && !isEnded && (_jsxs(Row, { align: "center", gap: "sm", className: "rounded-lg border border-primary-200 dark:border-primary-800 bg-primary-50 dark:bg-primary-900/20 px-3 py-2", children: [_jsx(Span, { className: "text-xs text-zinc-600 dark:text-zinc-400", children: "Buy Now:" }), _jsx(Span, { className: "text-base font-bold text-primary-700 dark:text-primary-300", children: formatCurrency(buyNowPrice, currency) })] })), _jsx(ProductFeatureBadges, { featured: featured, freeShipping: freeShipping, condition: condition ?? undefined, labels: {
+                                    featured: "Featured",
+                                    fasterDelivery: "Faster Delivery",
+                                    ratedSeller: "Rated Seller",
+                                    condition: "Condition",
+                                    conditionNew: "New",
+                                    conditionUsed: "Used",
+                                    conditionBroken: "For Parts",
+                                    conditionRefurbished: "Refurbished",
+                                    returnable: "Returnable",
+                                    freeShipping: "Free Shipping",
+                                    codAvailable: "Cash on Delivery",
+                                    wishlistCount: (n) => `${n} wishlisted`,
+                                    categoryProductCount: (n, cat) => `${n} in ${cat}`,
+                                } }), features.length > 0 && (_jsxs(Div, { className: "rounded-xl border border-zinc-100 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-900/60 px-4 py-3", children: [_jsx(Text, { className: "mb-2 text-xs font-semibold uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "About this item" }), _jsx("ul", { className: "space-y-1.5", children: features.map((f, i) => (_jsxs("li", { className: "flex items-start gap-2 text-sm text-zinc-700 dark:text-zinc-300", children: [_jsx(Span, { className: "mt-0.5 flex-shrink-0 text-primary-500", children: "\u2022" }), f] }, i))) })] })), descriptionHtml && (_jsx(RichText, { html: descriptionHtml, proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: "text-sm leading-relaxed text-zinc-600 dark:text-zinc-400 line-clamp-4" })), safeSeller && (_jsxs(Row, { align: "center", gap: "xs", className: "border-t border-zinc-100 dark:border-zinc-800 pt-3", children: [_jsx(Span, { className: "text-xs text-zinc-500", children: "Listed by" }), _jsx(Span, { className: "text-xs font-medium text-zinc-700 dark:text-zinc-300", children: safeSeller })] }))] })), renderBidForm: () => (_jsxs(Div, { className: "rounded-xl border border-zinc-100 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-900/60 p-5 space-y-4", children: [_jsxs(Div, { className: "space-y-1", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsx(Text, { className: "text-xs text-zinc-500", children: "Current bid" }), _jsx(Text, { className: "text-xs text-zinc-500", children: "Starting bid" })] }), _jsxs(Row, { justify: "between", align: "baseline", children: [_jsx(Span, { className: "text-xl font-bold text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsx(Span, { className: "text-sm text-zinc-500", children: formatCurrency(startingBid, currency) })] }), _jsxs(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids", " \u00B7 min increment ", formatCurrency(minBidIncrement, currency)] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Input, { type: "number", placeholder: `At least ${formatCurrency(currentBid + minBidIncrement, currency)}`, min: currentBid + minBidIncrement, "aria-label": "Your bid amount", disabled: isEnded }), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded, children: isEnded ? "Auction Ended" : "Place Bid" }), buyNowPrice !== null && !isEnded && (_jsxs(Button, { variant: "secondary", size: "md", className: "w-full", children: ["Buy Now \u2014 ", formatCurrency(buyNowPrice, currency)] }))] }), tags.length > 0 && (_jsx(Div, { className: "border-t border-zinc-200 dark:border-zinc-700 pt-4", children: _jsx(Row, { wrap: true, gap: "xs", children: tags.map((tag) => (_jsx(Span, { className: "rounded-full bg-zinc-100 dark:bg-zinc-800 px-2.5 py-1 text-xs text-zinc-600 dark:text-zinc-300", children: tag }, tag))) }) }))] })), renderMobileBidForm: () => !isEnded ? (_jsxs(Div, { className: "rounded-xl border border-zinc-100 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-900/60 p-4 lg:hidden", children: [_jsxs(Row, { align: "center", gap: "sm", className: "mb-3", children: [_jsx(Span, { className: "text-base font-bold text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsxs(Span, { className: "text-xs text-zinc-500", children: [bidCount, " bids"] })] }), _jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Place Bid" })] })) : null, renderBidHistory: () => {
+                        const bids = (bidsResult?.items ?? []).map((b) => ({
+                            id: String(b.id ?? ""),
+                            bidderId: String(b.userId ?? b.bidderId ?? ""),
+                            bidderName: (b.bidderName ?? b.userName),
+                            amount: (typeof b.bidAmount === "number" ? b.bidAmount : typeof b.amount === "number" ? b.amount : 0),
+                            placedAt: (b.createdAt ?? b.bidAt ?? ""),
+                        }));
+                        return (_jsx(BidHistory, { bids: bids, isEmpty: bids.length === 0, labels: { title: "Bid History" } }));
+                    }, renderRelated: () => {
+                        const related = relatedDocs
+                            .filter((r) => r.id !== product.id && r.isAuction !== false)
+                            .slice(0, 4)
+                            .map((r) => ({
+                            id: String(r.id ?? ""),
+                            title: String(r.title ?? r.name ?? "Auction Item"),
+                            price: typeof r.price === "number" ? r.price : 0,
+                            currency: typeof r.currency === "string" ? r.currency : undefined,
+                            mainImage: Array.isArray(r.images)
+                                ? r.images[0]
+                                : typeof r.mainImage === "string"
+                                    ? r.mainImage
+                                    : undefined,
+                            isAuction: true,
+                            auctionEndDate: r.auctionEndDate,
+                            startingBid: typeof r.startingBid === "number" ? r.startingBid : undefined,
+                            currentBid: typeof r.currentBid === "number" ? r.currentBid : undefined,
+                            bidCount: typeof r.bidCount === "number" ? r.bidCount : undefined,
+                            slug: typeof r.slug === "string" ? r.slug : undefined,
+                        }));
+                        if (related.length === 0)
+                            return null;
+                        return (_jsx(RelatedProducts, { labels: { title: "Similar Auctions" }, renderGrid: () => (_jsx(MarketplaceAuctionGrid, { auctions: related, gridClassName: "grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4" })) }));
+                    } }), !isEnded && (_jsxs(BuyBar, { children: [_jsx(Span, { className: "mr-auto text-sm font-bold text-zinc-900 dark:text-zinc-50", children: formatCurrency(currentBid, currency) }), _jsxs(Span, { className: "text-xs text-zinc-400 dark:text-zinc-500 mr-1", children: [bidCount, " bid", bidCount !== 1 ? "s" : ""] }), _jsx(Button, { variant: "primary", size: "sm", className: "shrink-0", children: "Place Bid" })] }))] }) }));
 }

package/dist/features/auctions/components/AuctionFilters.d.ts

@@ -0,0 +1,8 @@
+import type { FacetOption } from "../../filters/FilterFacetSection";
+import type { UrlTable } from "../../filters/FilterPanel";
+export interface AuctionFiltersProps {
+    table: UrlTable;
+    storeOptions?: FacetOption[];
+    currencyPrefix?: string;
+}
+export declare function AuctionFilters({ table, storeOptions, currencyPrefix, }: AuctionFiltersProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/auctions/components/AuctionFilters.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import { FilterFacetSection } from "../../filters/FilterFacetSection";
+import { RangeFilter } from "../../filters/RangeFilter";
+import { Div } from "../../../ui";
+export function AuctionFilters({ table, storeOptions = [], currencyPrefix = "", }) {
+    const t = useTranslations("filters");
+    const selectedStores = table.get("storeId")
+        ? table.get("storeId").split("|").filter(Boolean)
+        : [];
+    return (_jsxs(Div, { children: [_jsx(RangeFilter, { title: t("bidPriceRange"), minValue: table.get("minBid"), maxValue: table.get("maxBid"), onMinChange: (v) => table.set("minBid", v), onMaxChange: (v) => table.set("maxBid", v), prefix: currencyPrefix, showSlider: true, minBound: 0, maxBound: 500000, step: 500, minPlaceholder: t("minBidPrice"), maxPlaceholder: t("maxBidPrice"), defaultCollapsed: false }), storeOptions.length > 0 && (_jsx(FilterFacetSection, { title: t("store"), options: storeOptions, selected: selectedStores, onChange: (vals) => table.set("storeId", vals[0] ?? ""), searchable: storeOptions.length > 6, defaultCollapsed: true })), _jsx(RangeFilter, { title: t("dateRange"), type: "date", minValue: table.get("dateFrom"), maxValue: table.get("dateTo"), onMinChange: (v) => table.set("dateFrom", v), onMaxChange: (v) => table.set("dateTo", v), minPlaceholder: t("minDate"), maxPlaceholder: t("maxDate"), defaultCollapsed: true })] }));
+}

package/dist/features/auctions/components/AuctionsListView.d.ts

@@ -1 +1,6 @@
-export declare function AuctionsListView(): Promise<import("react/jsx-runtime").JSX.Element>;
+type SearchParams = Record<string, string | string[]>;
+export interface AuctionsListViewProps {
+    searchParams?: SearchParams;
+}
+export declare function AuctionsListView({ searchParams }: AuctionsListViewProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/features/auctions/components/AuctionsListView.js

@@ -3,13 +3,45 @@ import { productRepository } from "../../../repositories";
 import { Container, Heading, Main, Section } from "../../../ui";
 import { AdSlot } from "../../homepage/components/AdSlot";
 import { AuctionsIndexListing } from "../../products/components/AuctionsIndexListing";
-export async function AuctionsListView() {
+function sp(params, key) {
+    const v = params[key];
+    return Array.isArray(v) ? v[0] ?? "" : v ?? "";
+}
+function buildAuctionFilters(params) {
+    const parts = ["status==published", "isAuction==true"];
+    const minBid = sp(params, "minBid");
+    const maxBid = sp(params, "maxBid");
+    if (minBid)
+        parts.push(`currentBid>=${minBid}`);
+    if (maxBid)
+        parts.push(`currentBid<=${maxBid}`);
+    const store = sp(params, "store");
+    if (store) {
+        const values = store.split("|").filter(Boolean);
+        if (values.length === 1)
+            parts.push(`sellerId==${values[0]}`);
+        else if (values.length > 1)
+            parts.push(`sellerId==${values.join("|")}`);
+    }
+    const dateFrom = sp(params, "dateFrom");
+    const dateTo = sp(params, "dateTo");
+    if (dateFrom)
+        parts.push(`auctionEndDate>=${dateFrom}`);
+    if (dateTo)
+        parts.push(`auctionEndDate<=${dateTo}`);
+    return parts.join(",");
+}
+export async function AuctionsListView({ searchParams = {} }) {
+    const sort = sp(searchParams, "sort") || "auctionEndDate";
+    const page = Number(sp(searchParams, "page")) || 1;
+    const pageSize = Number(sp(searchParams, "pageSize")) || 24;
+    const filters = buildAuctionFilters(searchParams);
     const result = await productRepository
         .list({
-        filters: "status==published,isAuction==true",
-        sorts: "auctionEndDate",
-        page: 1,
-        pageSize: 24,
+        filters,
+        sorts: sort,
+        page,
+        pageSize,
     })
         .catch(() => null);
     const initial = result ?? null;

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

@@ -64,8 +64,8 @@ export declare const auctionItemSchema: z.ZodObject<{
     price: number;
     isAuction: true;
     startingBid: number;
-    bidCount: number;
     auctionEndDate: string;
+    bidCount: number;
     media?: {
         url: string;
         type: "video" | "image" | "file";
@@ -76,8 +76,8 @@ export declare const auctionItemSchema: z.ZodObject<{
     description?: string | undefined;
     storeSlug?: string | undefined;
     storeId?: string | undefined;
-    mainImage?: string | undefined;
     currentBid?: number | undefined;
+    mainImage?: string | undefined;
 }, {
     id: string;
     title: string;
@@ -91,8 +91,8 @@ export declare const auctionItemSchema: z.ZodObject<{
     price: number;
     isAuction: true;
     startingBid: number;
-    bidCount: number;
     auctionEndDate: string;
+    bidCount: number;
     media?: {
         url: string;
         type: "video" | "image" | "file";
@@ -103,8 +103,8 @@ export declare const auctionItemSchema: z.ZodObject<{
     description?: string | undefined;
     storeSlug?: string | undefined;
     storeId?: string | undefined;
-    mainImage?: string | undefined;
     currentBid?: number | undefined;
+    mainImage?: string | undefined;
 }>;
 export declare const bidRecordSchema: z.ZodObject<{
     id: z.ZodString;

package/dist/features/blog/components/BlogFeaturedCard.d.ts

@@ -1,17 +1,11 @@
-import React from "react";
 import type { BlogPost } from "../types";
 export interface BlogFeaturedCardProps {
     post: BlogPost;
-    /** Full URL/path to the post */
     href: string;
     labels?: {
         featuredBadge?: string;
         readTime?: string;
     };
-    /** Render-prop for wrapping in a link */
-    renderLink?: (href: string, children: React.ReactNode) => React.ReactNode;
-    /** Render-prop for the cover image slot */
-    renderImage?: (post: BlogPost) => React.ReactNode;
     className?: string;
 }
-export declare function BlogFeaturedCard({ post, href, labels, renderLink, renderImage, className, }: BlogFeaturedCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function BlogFeaturedCard({ post, href, labels, className, }: BlogFeaturedCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/blog/components/BlogFeaturedCard.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Article, Div, Heading, Row, Span, Text } from "../../../ui";
-import { THEME_CONSTANTS, LAYOUT } from "../../../tokens";
+import { Article, Div, Heading, Row, Span, Text, TextLink } from "../../../ui";
+import { THEME_CONSTANTS } from "../../../tokens";
 import { getMediaUrl } from "../../media/types/index";
 import { getDefaultLocale } from "../../../core/baseline-resolver";
 import { safeDisplayName } from "../../../security";
@@ -11,7 +11,7 @@ const CATEGORY_BADGE = {
     updates: "bg-purple-100 text-purple-800 dark:bg-purple-900/40 dark:text-purple-300",
     community: "bg-orange-100 text-orange-800 dark:bg-orange-900/40 dark:text-orange-300",
 };
-export function BlogFeaturedCard({ post, href, labels = {}, renderLink, renderImage, className = "", }) {
+export function BlogFeaturedCard({ post, href, labels = {}, className = "", }) {
     const safeTitle = post.title?.trim() || "Untitled post";
     const coverImageUrl = getMediaUrl(post.coverImage);
     const date = post.publishedAt
@@ -21,6 +21,5 @@ export function BlogFeaturedCard({ post, href, labels = {}, renderLink, renderIm
             day: "numeric",
         })
         : "";
-    const inner = (_jsxs(Article, { className: `overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm hover:shadow-lg transition-shadow duration-200 md:flex ${className}`, children: [_jsx(Div, { className: `md:w-1/2 relative ${LAYOUT.cardHeight.blog} overflow-hidden`, children: renderImage ? (renderImage(post)) : (coverImageUrl ? (_jsx(Div, { role: "img", "aria-label": safeTitle, className: "h-full w-full bg-cover bg-center", style: { backgroundImage: `url(${coverImageUrl})` } })) : (_jsx(Div, { role: "img", "aria-label": safeTitle, className: "h-full w-full bg-gradient-to-br from-zinc-200 via-zinc-100 to-zinc-300 dark:from-slate-800 dark:via-slate-700 dark:to-slate-900" }))) }), _jsxs(Div, { className: "p-8 md:w-1/2 flex flex-col justify-center", children: [_jsxs(Row, { className: "gap-2 mb-3", children: [_jsx(Span, { className: `inline-block px-2 py-0.5 rounded-full text-xs font-medium capitalize ${CATEGORY_BADGE[post.category] ?? ""}`, children: post.category }), post.isFeatured && (_jsx(Span, { className: "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/40 dark:text-yellow-300 px-2 py-0.5 rounded-full text-xs font-medium", children: labels.featuredBadge ?? "Featured" }))] }), _jsx(Heading, { level: 2, className: "text-xl font-semibold text-neutral-900 dark:text-zinc-100 mb-3 leading-snug", children: safeTitle }), post.excerpt && (_jsx(Text, { className: `text-neutral-500 dark:text-zinc-400 mb-4 ${THEME_CONSTANTS.utilities.textClamp3} text-sm`, children: post.excerpt })), _jsxs(Row, { className: "gap-4 text-xs text-neutral-400 dark:text-zinc-500", children: [post.authorName && _jsx(Span, { children: safeDisplayName(post.authorName, "Author") }), post.readTimeMinutes != null && (_jsxs(Span, { children: [post.readTimeMinutes, " ", labels.readTime ?? "min read"] })), date && _jsx(Span, { children: date })] })] })] }));
-    return (_jsx(Div, { className: "mb-10", children: renderLink ? renderLink(href, inner) : inner }));
+    return (_jsx(TextLink, { href: href, className: "block h-full", children: _jsxs(Article, { className: `flex h-full flex-col overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm hover:shadow-md transition-shadow duration-200 ${className}`, children: [_jsx(Div, { className: "aspect-video overflow-hidden flex-shrink-0", children: coverImageUrl ? (_jsx(Div, { role: "img", "aria-label": safeTitle, className: "h-full w-full bg-cover bg-center transition-transform duration-300 group-hover:scale-105", style: { backgroundImage: `url(${coverImageUrl})` } })) : (_jsx(Div, { role: "img", "aria-label": safeTitle, className: "h-full w-full bg-gradient-to-br from-zinc-200 via-zinc-100 to-zinc-300 dark:from-slate-800 dark:via-slate-700 dark:to-slate-900" })) }), _jsxs(Div, { className: "flex flex-1 flex-col p-4", children: [_jsxs(Row, { className: "gap-1.5 mb-2 flex-wrap", children: [_jsx(Span, { className: `inline-block px-2 py-0.5 rounded-full text-xs font-medium capitalize ${CATEGORY_BADGE[post.category] ?? "bg-zinc-100 text-zinc-700"}`, children: post.category }), post.isFeatured && (_jsx(Span, { className: "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/40 dark:text-yellow-300 px-2 py-0.5 rounded-full text-xs font-medium", children: labels.featuredBadge ?? "Featured" }))] }), _jsx(Heading, { level: 3, className: `font-semibold text-neutral-900 dark:text-zinc-100 text-base leading-snug mb-1 ${THEME_CONSTANTS.utilities.textClamp2}`, children: safeTitle }), post.excerpt && (_jsx(Text, { className: `text-neutral-500 dark:text-zinc-400 text-sm ${THEME_CONSTANTS.utilities.textClamp2} mb-3`, children: post.excerpt })), _jsxs(Row, { className: "mt-auto gap-3 text-xs text-neutral-400 dark:text-zinc-500 flex-wrap", children: [post.authorName && (_jsx(Span, { children: safeDisplayName(post.authorName, "Author") })), post.readTimeMinutes != null && (_jsxs(Span, { children: [post.readTimeMinutes, " ", labels.readTime ?? "min read"] })), date && _jsx(Span, { children: date })] })] })] }) }));
 }

package/dist/features/blog/components/BlogFilters.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslations } from "next-intl";
 import { FilterFacetSection } from "../../filters/FilterFacetSection";
+import { RangeFilter } from "../../filters/RangeFilter";
 import { SwitchFilter } from "../../filters/SwitchFilter";
 import { Div } from "../../../ui";
 export const BLOG_FILTER_KEYS = {
@@ -62,5 +63,5 @@ export function BlogFilters({ table, variant = "admin" }) {
     const selectedCategory = table.get("category")
         ? table.get("category").split("|").filter(Boolean)
         : [];
-    return (_jsxs(Div, { children: [variant !== "public" && (_jsx(FilterFacetSection, { title: t("status"), options: statusOptions, selected: selectedStatus, onChange: (vals) => table.set("status", vals.join("|")), searchable: false, defaultCollapsed: false })), _jsx(FilterFacetSection, { title: t("category"), options: categoryOptions, selected: selectedCategory, onChange: (vals) => table.set("category", vals.join("|")), searchable: false, defaultCollapsed: variant !== "public" }), variant !== "public" && (_jsx(SwitchFilter, { title: t("isFeatured"), label: t("showFeaturedOnly"), checked: table.get("isFeatured") === "true", onChange: (v) => table.set("isFeatured", v ? "true" : ""), defaultCollapsed: true }))] }));
+    return (_jsxs(Div, { children: [variant !== "public" && (_jsx(FilterFacetSection, { title: t("status"), options: statusOptions, selected: selectedStatus, onChange: (vals) => table.set("status", vals.join("|")), searchable: false, defaultCollapsed: false })), _jsx(FilterFacetSection, { title: t("category"), options: categoryOptions, selected: selectedCategory, onChange: (vals) => table.set("category", vals.join("|")), searchable: false, defaultCollapsed: variant !== "public" }), variant !== "public" && (_jsx(SwitchFilter, { title: t("isFeatured"), label: t("showFeaturedOnly"), checked: table.get("isFeatured") === "true", onChange: (v) => table.set("isFeatured", v ? "true" : ""), defaultCollapsed: true })), _jsx(RangeFilter, { title: t("dateRange"), type: "date", minValue: table.get("dateFrom"), maxValue: table.get("dateTo"), onMinChange: (v) => table.set("dateFrom", v), onMaxChange: (v) => table.set("dateTo", v), minPlaceholder: t("minDate"), maxPlaceholder: t("maxDate"), defaultCollapsed: true }), _jsx(RangeFilter, { title: t("votesRange"), minValue: table.get("minVotes"), maxValue: table.get("maxVotes"), onMinChange: (v) => table.set("minVotes", v), onMaxChange: (v) => table.set("maxVotes", v), minBound: 0, maxBound: 100000, step: 10, minPlaceholder: t("minVotes"), maxPlaceholder: t("maxVotes"), defaultCollapsed: true })] }));
 }

package/dist/features/blog/components/BlogIndexListing.js

@@ -1,14 +1,18 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Search, SlidersHorizontal, X } from "lucide-react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useBlogPosts } from "../hooks/useBlog";
-import { Div, Grid, Input, Pagination, SlottedListingView, SortDropdown, Stack, Text, } from "../../../ui";
+import { Pagination, SortDropdown } from "../../../ui";
 import { ROUTES } from "../../../next";
 import { BlogCard } from "./BlogListView";
-import { BlogFilters, BLOG_PUBLIC_SORT_OPTIONS, } from "./BlogFilters";
+import { BlogFilters, BLOG_PUBLIC_SORT_OPTIONS } from "./BlogFilters";
 const PAGE_SIZE = 24;
 export function BlogIndexListing({ initialData }) {
     const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "-publishedAt" } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
     const params = {
         q: table.get("q") || undefined,
         category: (table.get("category") || undefined),
@@ -16,11 +20,12 @@ export function BlogIndexListing({ initialData }) {
         page: table.getNumber("page", 1),
         perPage: table.getNumber("pageSize", PAGE_SIZE),
     };
-    const { posts, total, totalPages, isLoading } = useBlogPosts(params, {
-        initialData,
-    });
+    const { posts, total, totalPages, isLoading } = useBlogPosts(params, { initialData });
     const currentPage = table.getNumber("page", 1);
-    return (_jsx(Div, { className: "min-h-screen", children: _jsx(SlottedListingView, { portal: "public", manageSearch: true, manageSort: true, inlineToolbar: true, renderSearch: (search, setSearch) => (_jsx(Input, { value: search, onChange: (e) => setSearch(e.target.value), placeholder: "Search posts...", className: "max-w-sm" })), renderSort: (value, onChange) => (_jsx(SortDropdown, { value: value, onChange: onChange, options: BLOG_PUBLIC_SORT_OPTIONS })), renderFilters: () => (_jsx(BlogFilters, { table: table, variant: "public" })), renderTable: () => posts.length === 0 && !isLoading ? (_jsx(Stack, { align: "center", gap: "3", className: "justify-center py-24 text-center", children: _jsx(Text, { className: "text-xl font-medium text-zinc-900 dark:text-zinc-50", children: "No posts found" }) })) : (_jsx(Grid, { cols: 3, gap: "md", children: posts.map((post) => (_jsx(BlogCard, { post: post, onClick: () => {
-                        window.location.href = String(ROUTES.BLOG.ARTICLE(post.slug));
-                    } }, post.id))) })), renderPagination: () => totalPages > 1 ? (_jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) })) : null, total: total, isLoading: isLoading }) }));
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+        table.setPage(1);
+    }, [searchInput, table]);
+    const closeFilters = () => setFilterOpen(false);
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx("div", { className: "sticky top-0 z-20 border-b border-zinc-200 dark:border-slate-700 bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm py-2.5 px-4", children: _jsxs("div", { className: "flex items-center gap-2.5 max-w-full", children: [_jsxs("button", { type: "button", onClick: () => setFilterOpen(true), className: "flex shrink-0 items-center gap-2 rounded-lg border border-zinc-300 dark:border-slate-600 px-3.5 py-2 text-sm font-medium text-zinc-700 dark:text-zinc-200 hover:bg-zinc-50 dark:hover:bg-slate-800 transition-colors", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: "Filters" })] }), _jsxs("div", { className: "flex flex-1 items-center overflow-hidden rounded-lg border border-zinc-300 dark:border-slate-600 bg-white dark:bg-slate-900", children: [_jsx("input", { type: "text", value: searchInput, onChange: (e) => setSearchInput(e.target.value), onKeyDown: (e) => e.key === "Enter" && commitSearch(), placeholder: "Search posts...", className: "min-w-0 flex-1 bg-transparent px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 outline-none" }), _jsx("button", { type: "button", onClick: commitSearch, className: "flex shrink-0 items-center justify-center px-3 py-2 text-zinc-400 hover:text-primary dark:hover:text-primary-400 transition-colors", "aria-label": "Search", children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1.5 text-sm text-zinc-500 dark:text-zinc-400", children: [_jsx("span", { className: "hidden md:inline whitespace-nowrap", children: "Sort by" }), _jsx(SortDropdown, { value: table.get("sort") || "-publishedAt", onChange: (v) => { table.set("sort", v); table.setPage(1); }, options: BLOG_PUBLIC_SORT_OPTIONS })] })] }) }), _jsxs("div", { className: "py-6", children: [isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-video bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-5 space-y-2", children: [_jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/4" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" })] })] }, i))) })) : posts.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No posts found." })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: posts.map((post) => (_jsx(BlogCard, { post: post, href: String(ROUTES.BLOG.ARTICLE(post.slug)) }, post.id))) })), totalPages > 1 && (_jsx("div", { className: "mt-8 flex justify-center", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) }))] }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: closeFilters }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsxs("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4" }), "Filters"] }), _jsx("button", { type: "button", onClick: closeFilters, "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(BlogFilters, { table: table, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsx("button", { type: "button", onClick: closeFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors", children: "Apply filters" }) })] })] }))] }));
 }

package/dist/features/blog/components/BlogIndexPageView.d.ts

@@ -1 +1,6 @@
-export declare function BlogIndexPageView(): Promise<import("react/jsx-runtime").JSX.Element>;
+type SearchParams = Record<string, string | string[]>;
+export interface BlogIndexPageViewProps {
+    searchParams?: SearchParams;
+}
+export declare function BlogIndexPageView({ searchParams }: BlogIndexPageViewProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/features/blog/components/BlogIndexPageView.js

@@ -3,9 +3,17 @@ import { blogRepository } from "../../../repositories";
 import { Container, Heading, Main, Section } from "../../../ui";
 import { AdSlot } from "../../homepage/components/AdSlot";
 import { BlogIndexListing } from "./BlogIndexListing";
-export async function BlogIndexPageView() {
+function sp(params, key) {
+    const v = params[key];
+    return Array.isArray(v) ? v[0] ?? "" : v ?? "";
+}
+export async function BlogIndexPageView({ searchParams = {} }) {
+    const sort = sp(searchParams, "sort") || "-publishedAt";
+    const page = Number(sp(searchParams, "page")) || 1;
+    const pageSize = Number(sp(searchParams, "pageSize")) || 24;
+    const category = sp(searchParams, "category");
     const result = await blogRepository
-        .listPublished({}, { sorts: "-publishedAt", page: 1, pageSize: 24 })
+        .listPublished({ ...(category ? { category } : {}) }, { sorts: sort, page, pageSize })
         .catch(() => null);
     return (_jsx(Main, { children: _jsx(Section, { className: "py-10", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 1, className: "mb-8 text-3xl font-semibold text-zinc-900 dark:text-zinc-50", children: "Blog" }), _jsx(AdSlot, { id: "listing-sidebar-top", className: "mb-6" }), _jsx(BlogIndexListing, { initialData: result }), _jsx(AdSlot, { id: "listing-sidebar-bottom", className: "mt-8" })] }) }) }));
 }

package/dist/features/blog/components/BlogListView.d.ts

@@ -2,10 +2,11 @@ import type { LayoutSlots } from "../../../contracts";
 import type { BlogPost, BlogPostCategory } from "../types";
 interface BlogCardProps {
     post: BlogPost;
+    href?: string;
     onClick?: (post: BlogPost) => void;
     className?: string;
 }
-export declare function BlogCard({ post, onClick, className }: BlogCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function BlogCard({ post, href, onClick, className }: BlogCardProps): import("react/jsx-runtime").JSX.Element;
 interface BlogCategoryTabsProps {
     categories: BlogPostCategory[];
     active?: BlogPostCategory | null;

package/dist/features/blog/components/BlogListView.js

@@ -1,10 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
+import Link from "next/link";
 import { Article, Button, Div, Heading, Pagination, Row, Span, Text, } from "../../../ui";
 import { THEME_CONSTANTS } from "../../../tokens";
 import { getDefaultLocale } from "../../../core/baseline-resolver";
 import { getMediaUrl } from "../../media/types/index";
-export function BlogCard({ post, onClick, className = "" }) {
+import { safeDisplayName } from "../../../security";
+export function BlogCard({ post, href, onClick, className = "" }) {
     const coverImageUrl = getMediaUrl(post.coverImage);
     const date = post.publishedAt
         ? new Date(post.publishedAt).toLocaleDateString(getDefaultLocale(), {
@@ -13,9 +15,14 @@ export function BlogCard({ post, onClick, className = "" }) {
             day: "numeric",
         })
         : "";
-    return (_jsxs(Article, { role: onClick ? "button" : undefined, tabIndex: onClick ? 0 : undefined, onKeyDown: onClick
+    const isInteractive = !!(href || onClick);
+    const card = (_jsxs(Article, { role: onClick && !href ? "button" : undefined, tabIndex: onClick && !href ? 0 : undefined, onKeyDown: onClick && !href
             ? (e) => (e.key === "Enter" || e.key === " ") && onClick(post)
-            : undefined, onClick: onClick ? () => onClick(post) : undefined, className: `group flex flex-col h-full overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm transition hover:shadow-md ${onClick ? "cursor-pointer" : ""} ${className}`, children: [coverImageUrl && (_jsx(Div, { className: "aspect-video w-full overflow-hidden bg-neutral-100 dark:bg-slate-800", children: _jsx(Div, { role: "img", "aria-label": post.title, className: "h-full w-full bg-center bg-cover transition-transform duration-300 group-hover:scale-105", style: { backgroundImage: `url(${coverImageUrl})` } }) })), _jsxs(Div, { className: "flex flex-1 flex-col p-5", children: [_jsxs(Row, { className: "mb-2 gap-2", children: [_jsx(Span, { className: "rounded-full bg-primary/10 px-2 py-0.5 text-xs font-medium capitalize text-primary", children: post.category }), post.readTimeMinutes && (_jsxs(Span, { className: "text-xs text-neutral-400 dark:text-zinc-500", children: [post.readTimeMinutes, " min read"] }))] }), _jsx(Heading, { level: 3, className: `${THEME_CONSTANTS.utilities.textClamp2} text-base font-semibold text-neutral-900 dark:text-zinc-100 group-hover:text-primary`, children: post.title }), post.excerpt && (_jsx(Text, { className: `mt-2 ${THEME_CONSTANTS.utilities.textClamp3} flex-1 text-sm text-neutral-500 dark:text-zinc-400`, children: post.excerpt })), _jsxs(Row, { className: "mt-4 gap-3", children: [post.authorAvatar && (_jsx(Div, { role: "img", "aria-label": post.authorName ?? "author", className: "h-7 w-7 rounded-full bg-center bg-cover", style: { backgroundImage: `url(${post.authorAvatar})` } })), _jsxs(Text, { className: "text-xs text-neutral-500 dark:text-zinc-400", children: [post.authorName && (_jsx(Span, { className: "font-medium text-neutral-700 dark:text-zinc-300", children: post.authorName })), date && _jsxs(Span, { className: "ml-1", children: ["\u00B7 ", date] })] })] })] })] }));
+            : undefined, onClick: onClick && !href ? () => onClick(post) : undefined, className: `group flex flex-col h-full overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm transition hover:shadow-md ${isInteractive ? "cursor-pointer" : ""} ${className}`, children: [_jsx(Div, { className: "aspect-video w-full overflow-hidden bg-neutral-100 dark:bg-slate-800 flex-shrink-0", children: coverImageUrl ? (_jsx(Div, { role: "img", "aria-label": post.title, className: "h-full w-full bg-center bg-cover transition-transform duration-300 group-hover:scale-105", style: { backgroundImage: `url(${coverImageUrl})` } })) : (_jsx(Div, { className: "h-full w-full bg-gradient-to-br from-zinc-200 via-zinc-100 to-zinc-300 dark:from-slate-800 dark:via-slate-700 dark:to-slate-900 flex items-center justify-center", children: _jsx("span", { className: "text-4xl opacity-30", "aria-hidden": "true", children: "\u270D\uFE0F" }) })) }), _jsxs(Div, { className: "flex flex-1 flex-col p-5", children: [_jsxs(Row, { className: "mb-2 gap-2 flex-wrap", children: [_jsx(Span, { className: "rounded-full bg-primary/10 px-2 py-0.5 text-xs font-medium capitalize text-primary", children: post.category }), post.isFeatured && (_jsx(Span, { className: "rounded-full bg-yellow-100 px-2 py-0.5 text-xs font-medium text-yellow-700 dark:bg-yellow-900/40 dark:text-yellow-300", children: "Featured" })), post.readTimeMinutes && (_jsxs(Span, { className: "text-xs text-neutral-400 dark:text-zinc-500", children: [post.readTimeMinutes, " min read"] }))] }), _jsx(Heading, { level: 3, className: `${THEME_CONSTANTS.utilities.textClamp2} text-base font-semibold text-neutral-900 dark:text-zinc-100 group-hover:text-primary`, children: post.title }), post.excerpt && (_jsx(Text, { className: `mt-2 ${THEME_CONSTANTS.utilities.textClamp3} flex-1 text-sm text-neutral-500 dark:text-zinc-400`, children: post.excerpt })), _jsxs(Row, { className: "mt-auto pt-3 gap-3 items-center", children: [post.authorAvatar ? (_jsx(Div, { role: "img", "aria-label": post.authorName ?? "author", className: "h-7 w-7 flex-shrink-0 rounded-full bg-center bg-cover", style: { backgroundImage: `url(${post.authorAvatar})` } })) : post.authorName ? (_jsx(Div, { className: "flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full bg-primary/10 text-xs font-bold text-primary", children: post.authorName.charAt(0).toUpperCase() })) : null, _jsxs(Text, { className: "text-xs text-neutral-500 dark:text-zinc-400 min-w-0", children: [post.authorName && (_jsx(Span, { className: "font-medium text-neutral-700 dark:text-zinc-300", children: safeDisplayName(post.authorName, "Author") })), date && _jsxs(Span, { className: "ml-1 text-neutral-400", children: ["\u00B7 ", date] })] })] })] })] }));
+    if (href) {
+        return (_jsx(Link, { href: href, className: "block h-full", children: card }));
+    }
+    return card;
 }
 export function BlogCategoryTabs({ categories, active, onSelect, labels = {}, }) {
     return (_jsxs(Div, { className: "scrollbar-none flex gap-2 overflow-x-auto pb-1", children: [_jsx(Button, { onClick: () => onSelect(null), variant: !active ? "primary" : "ghost", size: "sm", className: `whitespace-nowrap rounded-full px-4 py-1.5 text-sm font-medium transition ${!active ? "bg-neutral-900 text-white" : "bg-neutral-100 dark:bg-slate-800 text-neutral-600 dark:text-zinc-300 hover:bg-neutral-200 dark:hover:bg-slate-700"}`, children: labels.all ?? "All" }), categories.map((cat) => (_jsx(Button, { onClick: () => onSelect(cat), variant: active === cat ? "primary" : "ghost", size: "sm", className: `whitespace-nowrap rounded-full px-4 py-1.5 text-sm font-medium capitalize transition ${active === cat ? "bg-neutral-900 text-white" : "bg-neutral-100 dark:bg-slate-800 text-neutral-600 dark:text-zinc-300 hover:bg-neutral-200 dark:hover:bg-slate-700"}`, children: labels[cat] ?? cat }, cat)))] }));

package/dist/features/categories/components/CategoriesIndexListing.d.ts

@@ -2,4 +2,4 @@ import type { CategoryItem } from "../types";
 export interface CategoriesIndexListingProps {
     initialData?: CategoryItem[];
 }
-export declare function CategoriesIndexListing({ initialData }: CategoriesIndexListingProps): import("react/jsx-runtime").JSX.Element;
+export declare function CategoriesIndexListing({ initialData: _ }: CategoriesIndexListingProps): import("react/jsx-runtime").JSX.Element;