@mohasinac/appkit 2.3.0 → 2.3.2

package/dist/features/products/components/ProductInfo.js

@@ -0,0 +1,4 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function ProductInfo({ isLoading = false, renderTitle, renderPrice, renderBadges, renderDescription, renderVariants, renderSeller, renderRating, className = "", }) {
+    return (_jsxs("div", { className: `space-y-4 ${className}`, "data-section": "productinfo-div-425", children: [renderTitle?.(isLoading), renderRating?.(), renderPrice?.(isLoading), renderBadges?.(), renderVariants?.(), renderDescription?.(), renderSeller?.()] }));
+}

package/dist/features/products/components/ProductTabs.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+export interface ProductTab {
+    value: string;
+    label: string;
+}
+export interface ProductTabsProps {
+    /** Render the description tab content */
+    renderDescription?: () => React.ReactNode;
+    /** Render the specifications / details tab content */
+    renderSpecs?: () => React.ReactNode;
+    /** Render the reviews tab content */
+    renderReviews?: () => React.ReactNode;
+    /** Render custom extra tabs; provide renderTabContent for each */
+    extraTabs?: ProductTab[];
+    renderExtraTab?: (value: string) => React.ReactNode;
+    /** Render the tab strip itself — when provided, replaces the default tab bar */
+    renderTabBar?: (activeTab: string, onChange: (t: string) => void, tabs: ProductTab[]) => React.ReactNode;
+    defaultTab?: string;
+    className?: string;
+}
+export declare function ProductTabs({ renderDescription, renderSpecs, renderReviews, extraTabs, renderExtraTab, renderTabBar, defaultTab, className, }: ProductTabsProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/products/components/ProductTabs.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+const DEFAULT_TABS = [
+    { value: "description", label: "Description" },
+    { value: "specs", label: "Specifications" },
+    { value: "reviews", label: "Reviews" },
+];
+export function ProductTabs({ renderDescription, renderSpecs, renderReviews, extraTabs = [], renderExtraTab, renderTabBar, defaultTab = "description", className = "", }) {
+    const [activeTab, setActiveTab] = React.useState(defaultTab);
+    const allTabs = [
+        ...(renderDescription
+            ? [{ value: "description", label: "Description" }]
+            : []),
+        ...(renderSpecs ? [{ value: "specs", label: "Specifications" }] : []),
+        ...(renderReviews ? [{ value: "reviews", label: "Reviews" }] : []),
+        ...extraTabs,
+    ];
+    const tabs = allTabs.length > 0 ? allTabs : DEFAULT_TABS;
+    return (_jsxs("div", { className: className, "data-section": "producttabs-div-426", children: [renderTabBar ? (renderTabBar(activeTab, setActiveTab, tabs)) : (_jsx("div", { className: "flex gap-4 border-b mb-4", "data-section": "producttabs-div-427", children: tabs.map((t) => (_jsx("button", { onClick: () => setActiveTab(t.value), className: `pb-2 text-sm font-medium border-b-2 transition-colors ${activeTab === t.value
+                        ? "border-current text-current"
+                        : "border-transparent text-neutral-500"}`, children: t.label }, t.value))) })), activeTab === "description" && renderDescription?.(), activeTab === "specs" && renderSpecs?.(), activeTab === "reviews" && renderReviews?.(), renderExtraTab?.(activeTab)] }));
+}

package/dist/features/products/components/ProductTabsShell.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface ProductTabsShellProps {
+    descriptionContent?: React.ReactNode;
+    specsContent?: React.ReactNode;
+    ingredientsContent?: React.ReactNode;
+    howToUseContent?: React.ReactNode;
+    reviewsContent?: React.ReactNode;
+    className?: string;
+}
+export declare function ProductTabsShell({ descriptionContent, specsContent, ingredientsContent, howToUseContent, reviewsContent, className, }: ProductTabsShellProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/features/products/components/ProductTabsShell.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+const ALL_TABS = [
+    { id: "description", label: "Description" },
+    { id: "specs", label: "Specifications" },
+    { id: "ingredients", label: "Ingredients" },
+    { id: "howToUse", label: "How to Use" },
+    { id: "reviews", label: "Reviews" },
+];
+export function ProductTabsShell({ descriptionContent, specsContent, ingredientsContent, howToUseContent, reviewsContent, className = "", }) {
+    const contentMap = {
+        description: descriptionContent,
+        specs: specsContent,
+        ingredients: ingredientsContent,
+        howToUse: howToUseContent,
+        reviews: reviewsContent,
+    };
+    const visibleTabs = ALL_TABS.filter((t) => contentMap[t.id] != null);
+    const [activeTab, setActiveTab] = useState(visibleTabs[0]?.id ?? "description");
+    if (visibleTabs.length === 0)
+        return null;
+    return (_jsxs("div", { className: `mt-8 ${className}`, children: [_jsx("div", { className: "mb-6 flex gap-1 overflow-x-auto border-b border-zinc-200 dark:border-zinc-700 pb-px", children: visibleTabs.map((t) => (_jsx("button", { type: "button", onClick: () => setActiveTab(t.id), className: `flex-shrink-0 -mb-px pb-3 px-4 text-sm font-medium border-b-2 transition-colors ${activeTab === t.id
+                        ? "border-primary-500 text-primary-600 dark:text-primary-400"
+                        : "border-transparent text-zinc-500 hover:text-zinc-700 dark:hover:text-zinc-300"}`, children: t.label }, t.id))) }), _jsx("div", { children: visibleTabs.map((t) => (_jsx("div", { hidden: activeTab !== t.id, children: contentMap[t.id] }, t.id))) })] }));
+}

package/dist/features/products/components/ProductsIndexListing.d.ts

@@ -0,0 +1,4 @@
+export interface ProductsIndexListingProps {
+    initialData?: any;
+}
+export declare function ProductsIndexListing({ initialData }: ProductsIndexListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/products/components/ProductsIndexListing.js

@@ -0,0 +1,91 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Search, SlidersHorizontal, LayoutGrid, List, X } from "lucide-react";
+import { useRouter } from "next/navigation";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { useProducts } from "../hooks/useProducts";
+import { Pagination, SortDropdown } from "../../../ui";
+import { ROUTES } from "../../../next";
+import { ProductGrid, ProductFilters, PRODUCT_PUBLIC_SORT_OPTIONS } from ".";
+import { useSession } from "../../../react/contexts/SessionContext";
+import { useWishlistWithGuest } from "../../wishlist/hooks/useWishlistWithGuest";
+import { apiClient } from "../../../http";
+import { useCategoryTree, categoriesToFacetOptions } from "../../categories/hooks/useCategoryTree";
+export function ProductsIndexListing({ initialData }) {
+    const router = useRouter();
+    const table = useUrlTable({ defaults: { pageSize: "24", sort: "-createdAt" } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    const [view, setView] = useState(table.get("view") || "card");
+    const { user } = useSession();
+    const wl = useWishlistWithGuest(user?.uid ?? null);
+    const { categories } = useCategoryTree();
+    const categoryOptions = categoriesToFacetOptions(categories);
+    const params = {
+        q: table.get("q") || undefined,
+        category: table.get("category") || undefined,
+        minPrice: table.get("minPrice") ? Number(table.get("minPrice")) : undefined,
+        maxPrice: table.get("maxPrice") ? Number(table.get("maxPrice")) : undefined,
+        condition: table.get("condition") || undefined,
+        brand: table.get("brand") || undefined,
+        storeId: table.get("storeId") || undefined,
+        freeShipping: table.get("freeShipping") === "true" ? true : undefined,
+        sort: table.get("sort") || "-createdAt",
+        page: table.getNumber("page", 1),
+        perPage: table.getNumber("pageSize", 24),
+        isAuction: false,
+    };
+    const { products, total, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+        table.setPage(1);
+    }, [searchInput, table]);
+    const handleSearchKeyDown = (e) => {
+        if (e.key === "Enter")
+            commitSearch();
+    };
+    const handleViewToggle = (next) => {
+        setView(next);
+        table.set("view", next);
+    };
+    const closeFilters = () => setFilterOpen(false);
+    const handleWishlistToggle = useCallback(async (productId) => {
+        const isWishlisted = wl.wishlistedIds?.has(productId) ?? false;
+        if (wl.isGuest) {
+            const guestWl = wl.guestWishlist;
+            if (isWishlisted)
+                guestWl?.remove(productId, "product");
+            else
+                guestWl?.add(productId, "product");
+        }
+        else {
+            if (isWishlisted)
+                await apiClient.delete(`/api/user/wishlist/${productId}`);
+            else
+                await apiClient.post("/api/user/wishlist", { productId });
+        }
+    }, [wl]);
+    const handleAddToCart = useCallback(async (product) => {
+        try {
+            await apiClient.post("/api/cart", { productId: product.id, quantity: 1 });
+        }
+        catch {
+            // silently ignore cart errors on listing page
+        }
+    }, []);
+    const handleBuyNow = useCallback(async (product) => {
+        try {
+            await apiClient.post("/api/cart", { productId: product.id, quantity: 1 });
+        }
+        catch {
+            // silently ignore cart errors; still navigate
+        }
+        router.push("/cart");
+    }, [router]);
+    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: handleSearchKeyDown, placeholder: "Search products...", 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") || "-createdAt", onChange: (v) => { table.set("sort", v); table.setPage(1); }, options: PRODUCT_PUBLIC_SORT_OPTIONS })] }), _jsxs("div", { className: "flex shrink-0 items-center rounded-lg border border-zinc-300 dark:border-slate-600 overflow-hidden", children: [_jsx("button", { type: "button", onClick: () => handleViewToggle("card"), "aria-label": "Grid view", className: `p-2 transition-colors ${view === "card"
+                                        ? "bg-primary text-white"
+                                        : "text-zinc-500 hover:bg-zinc-50 dark:hover:bg-slate-800 dark:text-zinc-400"}`, children: _jsx(LayoutGrid, { className: "h-4 w-4" }) }), _jsx("button", { type: "button", onClick: () => handleViewToggle("list"), "aria-label": "List view", className: `p-2 transition-colors ${view === "list"
+                                        ? "bg-primary text-white"
+                                        : "text-zinc-500 hover:bg-zinc-50 dark:hover:bg-slate-800 dark:text-zinc-400"}`, children: _jsx(List, { className: "h-4 w-4" }) })] })] }) }), _jsxs("div", { className: "py-6", children: [isLoading ? (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: Array.from({ length: 10 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-square bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-3 space-y-2", children: [_jsx("div", { className: "h-3 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-1/2" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" })] })] }, i))) })) : (_jsx(ProductGrid, { products: products, getProductHref: (p) => String(ROUTES.PUBLIC.PRODUCT_DETAIL(p.slug || p.id)), view: view, onWishlistToggle: handleWishlistToggle, wishlistedIds: wl.wishlistedIds, onAddToCart: handleAddToCart, onBuyNow: handleBuyNow })), totalPages > 1 && (_jsx("div", { className: "mt-8 flex justify-center", children: _jsx(Pagination, { currentPage: page, 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(ProductFilters, { table: table, currencyPrefix: "\u20B9", categoryOptions: categoryOptions }) }), _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/products/components/ProductsIndexPageView.d.ts

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

package/dist/features/products/components/ProductsIndexPageView.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { productRepository } from "../../../repositories";
+import { ROUTES } from "../../../constants";
+import { Container, Heading, Main, Section } from "../../../ui";
+import { AdSlot } from "../../homepage/components/AdSlot";
+import { ProductsIndexListing } from "./ProductsIndexListing";
+function sp(params, key) {
+    const v = params[key];
+    return Array.isArray(v) ? v[0] ?? "" : v ?? "";
+}
+function buildProductFilters(params) {
+    const parts = ["status==published", "isAuction==false"];
+    const condition = sp(params, "condition");
+    if (condition) {
+        const values = condition.split("|").filter(Boolean);
+        if (values.length === 1)
+            parts.push(`condition==${values[0]}`);
+        else if (values.length > 1)
+            parts.push(`condition==${values.join("|")}`);
+    }
+    const minPrice = sp(params, "minPrice");
+    const maxPrice = sp(params, "maxPrice");
+    if (minPrice)
+        parts.push(`price>=${minPrice}`);
+    if (maxPrice)
+        parts.push(`price<=${maxPrice}`);
+    const sellerId = sp(params, "seller");
+    if (sellerId)
+        parts.push(`sellerId==${sellerId}`);
+    const freeShipping = sp(params, "freeShipping");
+    if (freeShipping === "true")
+        parts.push("freeShipping==true");
+    return parts.join(",");
+}
+export async function ProductsIndexPageView({ searchParams = {} }) {
+    const sort = sp(searchParams, "sort") || "-createdAt";
+    const page = Number(sp(searchParams, "page")) || 1;
+    const pageSize = Number(sp(searchParams, "pageSize")) || 24;
+    const filters = buildProductFilters(searchParams);
+    const result = await productRepository
+        .list({
+        filters,
+        sorts: sort,
+        page,
+        pageSize,
+    })
+        .catch(() => null);
+    const products = result ?? null;
+    return (_jsxs(Main, { children: [_jsx(Section, { className: "pt-8 pb-4 border-b border-zinc-100 dark:border-slate-800", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 1, className: "text-3xl font-bold text-zinc-900 dark:text-zinc-100", children: "Products" }), _jsx("p", { className: "mt-1 text-sm text-zinc-500 dark:text-zinc-400", children: "Discover amazing products and deals" }), _jsx("div", { className: "mt-3", children: _jsx("a", { href: ROUTES.PUBLIC.AUCTIONS, className: "inline-flex items-center gap-1.5 rounded-full border border-primary/30 bg-primary/10 px-4 py-1.5 text-xs font-medium text-primary-700 dark:text-primary-400 hover:bg-primary/15 transition-colors", children: "\uD83C\uDFF7\uFE0F Looking for unique deals? Browse Auctions \u2192" }) })] }) }), _jsxs(Container, { size: "xl", className: "px-4", children: [_jsx(AdSlot, { id: "listing-sidebar-top", className: "mb-4 mt-4" }), _jsx(ProductsIndexListing, { initialData: products }), _jsx(AdSlot, { id: "listing-sidebar-bottom", className: "mt-8" })] })] }));
+}

package/dist/features/products/components/ProductsView.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import type { SlottedListingViewProps } from "../../../ui";
+export interface ProductsViewProps extends Omit<SlottedListingViewProps, "renderTable"> {
+    renderGrid: (isLoading: boolean) => React.ReactNode;
+}
+export declare function ProductsView({ renderGrid, ...props }: ProductsViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/products/components/ProductsView.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SlottedListingView } from "../../../ui";
+export function ProductsView({ renderGrid, ...props }) {
+    return (_jsx(SlottedListingView, { portal: "public", ...props, manageSearch: true, manageSort: true, inlineToolbar: true, renderTable: () => renderGrid(props.isLoading ?? false) }));
+}

package/dist/features/products/components/RelatedProducts.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+export interface RelatedProductsProps {
+    isLoading?: boolean;
+    isEmpty?: boolean;
+    /** Render the product cards grid */
+    renderGrid?: () => React.ReactNode;
+    /** Render loading skeleton */
+    renderSkeleton?: () => React.ReactNode;
+    /** Section title — rendered above the grid when provided */
+    renderTitle?: () => React.ReactNode;
+    labels?: {
+        title?: string;
+    };
+    className?: string;
+}
+export declare function RelatedProducts({ isLoading, isEmpty, renderGrid, renderSkeleton, renderTitle, labels, className, }: RelatedProductsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/features/products/components/RelatedProducts.js

@@ -0,0 +1,12 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Heading } from "../../../ui";
+export function RelatedProducts({ isLoading = false, isEmpty = false, renderGrid, renderSkeleton, renderTitle, labels = {}, className = "", }) {
+    if (isLoading) {
+        if (renderSkeleton)
+            return _jsx(_Fragment, { children: renderSkeleton() });
+        return (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4 animate-pulse", "data-section": "relatedproducts-div-428", children: Array.from({ length: 4 }).map((_, i) => (_jsx("div", { className: "aspect-square rounded-xl bg-neutral-100" }, i))) }));
+    }
+    if (isEmpty)
+        return null;
+    return (_jsxs("div", { className: `space-y-4 ${className}`, "data-section": "relatedproducts-div-429", children: [renderTitle ? (renderTitle()) : labels.title ? (_jsx(Heading, { level: 2, className: "text-xl font-bold", variant: "none", children: labels.title })) : null, renderGrid?.()] }));
+}

package/dist/features/products/components/RelatedProductsCarousel.d.ts

@@ -0,0 +1,7 @@
+import type { ProductItem } from "../types";
+interface RelatedProductsCarouselProps {
+    items: ProductItem[];
+    title?: string;
+}
+export declare function RelatedProductsCarousel({ items, title, }: RelatedProductsCarouselProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/features/products/components/RelatedProductsCarousel.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ROUTES } from "../../../next";
+import { THEME_CONSTANTS } from "../../../tokens";
+import { SectionCarousel } from "../../homepage/components/SectionCarousel";
+import { ProductCard } from "./ProductGrid";
+export function RelatedProductsCarousel({ items, title = "You might also like", }) {
+    if (items.length === 0)
+        return null;
+    return (_jsx(SectionCarousel, { title: title, pillLabel: "Related Products", headingVariant: "editorial", items: items, isLoading: false, perView: THEME_CONSTANTS.carousel.perView.standard, keyExtractor: (item) => item.id, renderItem: (item) => (_jsx(ProductCard, { product: item, href: String(ROUTES.PUBLIC.PRODUCT_DETAIL(item.slug || item.id)) })) }));
+}

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

@@ -0,0 +1,39 @@
+export { ProductCard, ProductGrid } from "./ProductGrid";
+export { ProductFilters, PRODUCT_FILTER_KEYS, PRODUCT_ADMIN_SORT_OPTIONS, PRODUCT_SELLER_SORT_OPTIONS, PRODUCT_PUBLIC_SORT_OPTIONS, getProductFilterKeys, getProductSortOptions, } from "./ProductFilters";
+export type { ProductFiltersProps, ProductFilterVariant, FacetOption, UrlTable, } from "./ProductFilters";
+export { InteractiveProductCard } from "./InteractiveProductCard";
+export type { InteractiveProductCardProps } from "./InteractiveProductCard";
+export { ProductForm, PRODUCT_STATUS_OPTIONS } from "./ProductForm";
+export type { ProductFormProps, ProductFormValue } from "./ProductForm";
+export { ProductFeatureBadges } from "./ProductFeatureBadges";
+export { BuyBar } from "./BuyBar";
+export type { BuyBarProps } from "./BuyBar";
+export { ProductsView } from "./ProductsView";
+export type { ProductsViewProps } from "./ProductsView";
+export { AuctionsView } from "./AuctionsView";
+export type { AuctionsViewProps } from "./AuctionsView";
+export { ProductDetailView } from "./ProductDetailView";
+export type { ProductDetailViewProps } from "./ProductDetailView";
+export { AuctionDetailView } from "./AuctionDetailView";
+export type { AuctionDetailViewProps } from "./AuctionDetailView";
+export { PreOrdersView } from "./PreOrdersView";
+export type { PreOrdersViewProps } from "./PreOrdersView";
+export { PreOrderDetailView } from "./PreOrderDetailView";
+export type { PreOrderDetailViewProps } from "./PreOrderDetailView";
+export { ProductInfo } from "./ProductInfo";
+export type { ProductInfoProps } from "./ProductInfo";
+export { ProductTabs } from "./ProductTabs";
+export type { ProductTabsProps, ProductTab } from "./ProductTabs";
+export { BidHistory } from "./BidHistory";
+export type { BidHistoryProps, BidHistoryEntry } from "./BidHistory";
+export { PlaceBidForm } from "./PlaceBidForm";
+export type { PlaceBidFormProps } from "./PlaceBidForm";
+export { MakeOfferForm } from "./MakeOfferForm";
+export type { MakeOfferFormProps } from "./MakeOfferForm";
+export { RelatedProducts } from "./RelatedProducts";
+export type { RelatedProductsProps } from "./RelatedProducts";
+export { ProductGalleryClient } from "./ProductGalleryClient";
+export type { ProductGalleryClientProps } from "./ProductGalleryClient";
+export { ProductTabsShell } from "./ProductTabsShell";
+export type { ProductTabsShellProps } from "./ProductTabsShell";
+export { RelatedProductsCarousel } from "./RelatedProductsCarousel";

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

@@ -0,0 +1,21 @@
+export { ProductCard, ProductGrid } from "./ProductGrid";
+export { ProductFilters, PRODUCT_FILTER_KEYS, PRODUCT_ADMIN_SORT_OPTIONS, PRODUCT_SELLER_SORT_OPTIONS, PRODUCT_PUBLIC_SORT_OPTIONS, getProductFilterKeys, getProductSortOptions, } from "./ProductFilters";
+export { InteractiveProductCard } from "./InteractiveProductCard";
+export { ProductForm, PRODUCT_STATUS_OPTIONS } from "./ProductForm";
+export { ProductFeatureBadges } from "./ProductFeatureBadges";
+export { BuyBar } from "./BuyBar";
+export { ProductsView } from "./ProductsView";
+export { AuctionsView } from "./AuctionsView";
+export { ProductDetailView } from "./ProductDetailView";
+export { AuctionDetailView } from "./AuctionDetailView";
+export { PreOrdersView } from "./PreOrdersView";
+export { PreOrderDetailView } from "./PreOrderDetailView";
+export { ProductInfo } from "./ProductInfo";
+export { ProductTabs } from "./ProductTabs";
+export { BidHistory } from "./BidHistory";
+export { PlaceBidForm } from "./PlaceBidForm";
+export { MakeOfferForm } from "./MakeOfferForm";
+export { RelatedProducts } from "./RelatedProducts";
+export { ProductGalleryClient } from "./ProductGalleryClient";
+export { ProductTabsShell } from "./ProductTabsShell";
+export { RelatedProductsCarousel } from "./RelatedProductsCarousel";

package/dist/features/products/hooks/useBrands.d.ts

@@ -0,0 +1,9 @@
+import type { CategoryItem } from "../../categories";
+export declare function useBrands(endpoint?: string): {
+    brands: CategoryItem[];
+    brandOptions: {
+        value: string;
+        label: string;
+    }[];
+    isLoading: boolean;
+};

package/dist/features/products/hooks/useBrands.js

@@ -0,0 +1,15 @@
+"use client";
+import { useMemo } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { apiClient } from "../../../http";
+import { CATEGORY_ENDPOINTS } from "../../../constants/api-endpoints";
+export function useBrands(endpoint = CATEGORY_ENDPOINTS.BRANDS()) {
+    const { data, isLoading } = useQuery({
+        queryKey: ["categories", "brands", endpoint],
+        queryFn: () => apiClient.get(endpoint),
+        staleTime: 15 * 60 * 1000,
+    });
+    const brands = useMemo(() => data ?? [], [data]);
+    const brandOptions = useMemo(() => brands.map((b) => ({ value: b.id, label: b.name })), [brands]);
+    return { brands, brandOptions, isLoading };
+}

package/dist/features/products/hooks/useProductDetail.d.ts

@@ -0,0 +1,15 @@
+import type { ProductItem } from "../types";
+interface UseProductDetailOptions<TProduct = ProductItem> {
+    initialData?: TProduct;
+    enabled?: boolean;
+    endpoint?: string;
+    queryKeyPrefix?: string;
+    transform?: (item: ProductItem) => TProduct;
+}
+export declare function useProductDetail<TProduct = ProductItem>(slug: string, options?: UseProductDetailOptions<TProduct>): {
+    product: TProduct | null;
+    isLoading: boolean;
+    error: Error | null;
+    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<ProductItem | null, Error>>;
+};
+export {};

package/dist/features/products/hooks/useProductDetail.js

@@ -0,0 +1,28 @@
+import { useQuery } from "@tanstack/react-query";
+import { apiClient, ApiClientError } from "../../../http";
+import { PRODUCT_ENDPOINTS } from "../../../constants/api-endpoints";
+export function useProductDetail(slug, options) {
+    const endpoint = options?.endpoint ?? PRODUCT_ENDPOINTS.BY_SLUG(slug);
+    const queryKeyPrefix = options?.queryKeyPrefix ?? "product";
+    const { data, isLoading, error, refetch } = useQuery({
+        queryKey: [queryKeyPrefix, slug],
+        queryFn: async () => {
+            try {
+                return await apiClient.get(endpoint);
+            }
+            catch (e) {
+                if (e instanceof ApiClientError && e.status === 404)
+                    return null;
+                throw e;
+            }
+        },
+        enabled: (options?.enabled ?? true) && Boolean(slug),
+        initialData: options?.initialData ?? undefined,
+    });
+    const product = data
+        ? options?.transform
+            ? options.transform(data)
+            : data
+        : null;
+    return { product, isLoading, error, refetch };
+}

package/dist/features/products/hooks/useProducts.d.ts

@@ -0,0 +1,43 @@
+import type { ProductItem, ProductListResponse, ProductListParams } from "../types";
+interface UseProductsOptions<T extends ProductItem = ProductItem> {
+    initialData?: ProductListResponse;
+    enabled?: boolean;
+    /**
+     * Map each API item to a richer app-level type.
+     * The API always returns `ProductItem`; use this to project it to your own
+     * extended type (e.g. `ProductDocument`) without forking the package.
+     *
+     * @example
+     * const { products } = useProducts<ProductDocument>(params, {
+     *   transform: (raw) => ({ ...raw, brand: raw.attributes?.brand ?? "" }),
+     * });
+     */
+    transform?: (item: ProductItem) => T;
+}
+export declare function useProducts<T extends ProductItem = ProductItem>(params?: ProductListParams, opts?: UseProductsOptions<T>): {
+    products: T[];
+    total: number;
+    totalPages: number;
+    page: number;
+    hasMore: boolean;
+    isLoading: boolean;
+    error: Error | null;
+};
+interface UseProductOptions<T extends ProductItem = ProductItem> {
+    initialData?: ProductItem;
+    enabled?: boolean;
+    /**
+     * Map the API item to a richer app-level type.
+     * @example
+     * const { product } = useProduct<ProductDocument>(slug, {
+     *   transform: (raw) => ({ ...raw, brand: raw.attributes?.brand ?? "" }),
+     * });
+     */
+    transform?: (item: ProductItem) => T;
+}
+export declare function useProduct<T extends ProductItem = ProductItem>(slug: string, opts?: UseProductOptions<T>): {
+    product: T | undefined;
+    isLoading: boolean;
+    error: Error | null;
+};
+export {};

package/dist/features/products/hooks/useProducts.js

@@ -0,0 +1,84 @@
+import { useQuery } from "@tanstack/react-query";
+import { apiClient } from "../../../http";
+import { PRODUCT_ENDPOINTS } from "../../../constants/api-endpoints";
+export function useProducts(params = {}, opts) {
+    const sp = new URLSearchParams();
+    if (params.q)
+        sp.set("q", params.q);
+    if (params.category)
+        sp.set("category", params.category);
+    if (params.categorySlug)
+        sp.set("categorySlug", params.categorySlug);
+    if (params.status)
+        sp.set("status", params.status);
+    if (params.condition)
+        sp.set("condition", params.condition);
+    if (params.minPrice !== undefined)
+        sp.set("minPrice", String(params.minPrice));
+    if (params.maxPrice !== undefined)
+        sp.set("maxPrice", String(params.maxPrice));
+    if (params.inStock !== undefined)
+        sp.set("inStock", String(params.inStock));
+    if (params.isAuction !== undefined)
+        sp.set("isAuction", String(params.isAuction));
+    if (params.isPreOrder !== undefined)
+        sp.set("isPreOrder", String(params.isPreOrder));
+    if (params.sellerId)
+        sp.set("sellerId", params.sellerId);
+    if (params.storeId)
+        sp.set("storeId", params.storeId);
+    if (params.sort)
+        sp.set("sorts", params.sort);
+    if (params.page)
+        sp.set("page", String(params.page));
+    if (params.perPage)
+        sp.set("pageSize", String(params.perPage));
+    if (params.featured !== undefined)
+        sp.set("featured", String(params.featured));
+    if (params.minBid !== undefined)
+        sp.set("minBid", String(params.minBid));
+    if (params.maxBid !== undefined)
+        sp.set("maxBid", String(params.maxBid));
+    if (params.dateFrom)
+        sp.set("dateFrom", params.dateFrom);
+    if (params.dateTo)
+        sp.set("dateTo", params.dateTo);
+    if (params.preOrderStatus)
+        sp.set("preOrderStatus", params.preOrderStatus);
+    if (params.freeShipping !== undefined)
+        sp.set("freeShipping", String(params.freeShipping));
+    const qs = sp.toString();
+    const query = useQuery({
+        queryKey: ["products", qs],
+        queryFn: () => apiClient.get(`${PRODUCT_ENDPOINTS.LIST}${qs ? `?${qs}` : ""}`),
+        initialData: opts?.initialData,
+        enabled: opts?.enabled,
+    });
+    const rawItems = query.data?.items ?? [];
+    const products = (opts?.transform ? rawItems.map(opts.transform) : rawItems);
+    return {
+        products,
+        total: query.data?.total ?? 0,
+        totalPages: query.data?.totalPages ?? 1,
+        page: query.data?.page ?? 1,
+        hasMore: query.data?.hasMore ?? false,
+        isLoading: query.isLoading,
+        error: query.error,
+    };
+}
+export function useProduct(slug, opts) {
+    const query = useQuery({
+        queryKey: ["products", slug],
+        queryFn: () => apiClient.get(PRODUCT_ENDPOINTS.BY_SLUG(slug)),
+        initialData: opts?.initialData,
+        enabled: opts?.enabled !== false && !!slug,
+    });
+    const product = query.data && opts?.transform
+        ? opts.transform(query.data)
+        : query.data;
+    return {
+        product,
+        isLoading: query.isLoading,
+        error: query.error,
+    };
+}

package/dist/features/products/hooks/useRelatedProducts.d.ts

@@ -0,0 +1,2 @@
+import type { ProductListResponse } from "../types";
+export declare function useRelatedProducts(category: string, excludeId: string, limit?: number, isAuction?: boolean): import("@tanstack/react-query").UseQueryResult<ProductListResponse, Error>;

package/dist/features/products/hooks/useRelatedProducts.js

@@ -0,0 +1,16 @@
+import { useQuery } from "@tanstack/react-query";
+import { apiClient } from "../../../http";
+import { PRODUCT_ENDPOINTS } from "../../../constants/api-endpoints";
+export function useRelatedProducts(category, excludeId, limit = 8, isAuction = false) {
+    const params = new URLSearchParams({
+        filters: `status==published,category==${encodeURIComponent(category)},isAuction==${isAuction}`,
+        sorts: "-createdAt",
+        pageSize: String(limit),
+    });
+    return useQuery({
+        queryKey: ["related-products", category, excludeId, String(isAuction)],
+        queryFn: () => apiClient.get(`${PRODUCT_ENDPOINTS.LIST}?${params.toString()}`),
+        enabled: Boolean(category),
+        staleTime: 5 * 60 * 1000,
+    });
+}

package/dist/features/products/index.d.ts

@@ -0,0 +1,10 @@
+export * from "./types";
+export * from "./hooks/useProducts";
+export * from "./hooks/useProductDetail";
+export * from "./hooks/useBrands";
+export * from "./hooks/useRelatedProducts";
+export * from "./components";
+export * from "./schemas";
+export * from "./columns";
+export { manifest } from "./manifest";
+export { normalizeListingType } from "./utils/listing-type";

package/dist/features/products/index.js

@@ -0,0 +1,10 @@
+export * from "./types";
+export * from "./hooks/useProducts";
+export * from "./hooks/useProductDetail";
+export * from "./hooks/useBrands";
+export * from "./hooks/useRelatedProducts";
+export * from "./components";
+export * from "./schemas";
+export * from "./columns";
+export { manifest } from "./manifest";
+export { normalizeListingType } from "./utils/listing-type";