@mohasinac/appkit 2.3.1 → 2.3.2

package/dist/features/homepage/components/MarketplaceHomepageView.js

@@ -85,6 +85,13 @@ const DEFAULT_SECURITY_ITEMS = [
     },
 ];
 // --- Helpers -----------------------------------------------------------------
+/** Strip leading emoji/symbols that admins sometimes prefix onto DB titles. */
+function cleanTitle(raw) {
+    if (!raw)
+        return raw;
+    const cleaned = raw.replace(/^[^\p{L}\p{N}]+/u, "").trim();
+    return cleaned || raw;
+}
 function parseWelcomeDescription(description) {
     if (!description)
         return "";
@@ -105,18 +112,21 @@ function parseWelcomeDescription(description) {
  * Render a single homepage section based on its type and config
  */
 const AD_SLOT_MAP = {
+    carousel: "afterHero",
     products: "afterFeaturedProducts",
     reviews: "afterReviews",
     faq: "afterFAQ",
 };
-function renderSection(section, adSlots, newsletterFormSlot, faqItems) {
+function renderSection(section, adSlots, newsletterFormSlot, faqItems, slides) {
     const { type, config } = section;
     const adSlotKey = AD_SLOT_MAP[type];
     const sectionElement = (() => {
         switch (type) {
+            case "carousel":
+                return _jsx(HeroCarousel, { initialSlides: slides });
             case "welcome": {
                 const cfg = config;
-                const title = cfg?.h1 || "Discover Amazing Products";
+                const title = cleanTitle(cfg?.h1) || "Discover Amazing Products";
                 const subtitle = parseWelcomeDescription(cfg?.description);
                 const ctaText = cfg?.ctaText || "Shop Now";
                 const ctaLink = cfg?.ctaLink || ROUTES.PUBLIC.PRODUCTS;
@@ -129,7 +139,7 @@ function renderSection(section, adSlots, newsletterFormSlot, faqItems) {
             }
             case "categories": {
                 const cfg = config;
-                return (_jsx(ShopByCategorySection, { title: cfg?.title || "Shop by Category", viewMoreHref: ROUTES.PUBLIC.CATEGORIES, viewMoreLabel: "All categories \u2192" }));
+                return (_jsx(ShopByCategorySection, { title: cleanTitle(cfg?.title) || "Shop by Category", viewMoreHref: ROUTES.PUBLIC.CATEGORIES, viewMoreLabel: "All categories \u2192" }));
             }
             case "stats": {
                 const cfg = config;
@@ -154,27 +164,27 @@ function renderSection(section, adSlots, newsletterFormSlot, faqItems) {
             }
             case "products": {
                 const cfg = config;
-                return (_jsx(FeaturedProductsSection, { title: cfg?.title || "Featured Products", viewMoreHref: ROUTES.PUBLIC.PRODUCTS, viewMoreLabel: "View all products \u2192" }));
+                return (_jsx(FeaturedProductsSection, { title: cleanTitle(cfg?.title) || "Featured Products", viewMoreHref: ROUTES.PUBLIC.PRODUCTS, viewMoreLabel: "View all products \u2192" }));
             }
             case "auctions": {
                 const cfg = config;
-                return (_jsx(FeaturedAuctionsSection, { title: cfg?.title || "Live Auctions", viewMoreHref: ROUTES.PUBLIC.AUCTIONS, viewMoreLabel: "View all auctions \u2192" }));
+                return (_jsx(FeaturedAuctionsSection, { title: cleanTitle(cfg?.title) || "Live Auctions", viewMoreHref: ROUTES.PUBLIC.AUCTIONS, viewMoreLabel: "View all auctions \u2192" }));
             }
             case "pre-orders": {
                 const cfg = config;
-                return (_jsx(FeaturedPreOrdersSection, { title: cfg?.title || "Reserve Before It Ships", viewMoreHref: ROUTES.PUBLIC.PRE_ORDERS, viewMoreLabel: "View all pre-orders \u2192" }));
+                return (_jsx(FeaturedPreOrdersSection, { title: cleanTitle(cfg?.title) || "Reserve Before It Ships", viewMoreHref: ROUTES.PUBLIC.PRE_ORDERS, viewMoreLabel: "View all pre-orders \u2192" }));
             }
             case "stores": {
                 const cfg = config;
-                return (_jsx(FeaturedStoresSection, { title: cfg?.title || "Featured Stores", viewMoreHref: ROUTES.PUBLIC.STORES, viewMoreLabel: "View all stores \u2192" }));
+                return (_jsx(FeaturedStoresSection, { title: cleanTitle(cfg?.title) || "Featured Stores", viewMoreHref: ROUTES.PUBLIC.STORES, viewMoreLabel: "View all stores \u2192" }));
             }
             case "events": {
                 const cfg = config;
-                return (_jsx(EventsSection, { title: cfg?.title || "Events & Offers", viewMoreHref: ROUTES.PUBLIC.EVENTS, viewMoreLabel: "View all events \u2192" }));
+                return (_jsx(EventsSection, { title: cleanTitle(cfg?.title) || "Events & Offers", viewMoreHref: ROUTES.PUBLIC.EVENTS, viewMoreLabel: "View all events \u2192" }));
             }
             case "reviews": {
                 const cfg = config;
-                return (_jsx(HomepageCustomerReviewsSection, { title: cfg?.title || "What Our Customers Say", viewMoreHref: ROUTES.PUBLIC.REVIEWS, viewMoreLabel: "See all reviews \u2192" }));
+                return (_jsx(HomepageCustomerReviewsSection, { title: cleanTitle(cfg?.title) || "What Our Customers Say", viewMoreHref: ROUTES.PUBLIC.REVIEWS, viewMoreLabel: "See all reviews \u2192" }));
             }
             case "banner": {
                 const cfg = config;
@@ -182,34 +192,34 @@ function renderSection(section, adSlots, newsletterFormSlot, faqItems) {
             }
             case "trust-indicators": {
                 const cfg = config;
-                return (_jsx(TrustFeaturesSection, { title: cfg?.title || "Why Buyers Trust LetiTrip", items: DEFAULT_TRUST_FEATURES }));
+                return (_jsx(TrustFeaturesSection, { title: cleanTitle(cfg?.title) || "Why Buyers Trust LetiTrip", items: DEFAULT_TRUST_FEATURES }));
             }
             case "features": {
                 const cfg = config;
-                return (_jsx(SecurityHighlightsSection, { title: cfg?.title || "Security You Can Trust", pillLabel: "Built for trust", items: DEFAULT_SECURITY_ITEMS, learnMoreHref: ROUTES.PUBLIC.SECURITY, learnMoreLabel: "Learn about our security \u2192" }));
+                return (_jsx(SecurityHighlightsSection, { title: cleanTitle(cfg?.title) || "Security You Can Trust", pillLabel: "Built for trust", items: DEFAULT_SECURITY_ITEMS, learnMoreHref: ROUTES.PUBLIC.SECURITY, learnMoreLabel: "Learn about our security \u2192" }));
             }
             case "whatsapp-community": {
                 const cfg = config;
-                return (_jsx(WhatsAppCommunitySection, { title: cfg?.title || "Join Our WhatsApp Community", descriptionHtml: cfg?.description || "5,000+ members. Get deal alerts, auction updates, and exclusive drops before anyone else.", memberCount: cfg?.memberCount || 5000, groupLink: cfg?.groupLink || "https://chat.whatsapp.com/" }));
+                return (_jsx(WhatsAppCommunitySection, { title: cleanTitle(cfg?.title) || "Join Our WhatsApp Community", descriptionHtml: cfg?.description || "5,000+ members. Get deal alerts, auction updates, and exclusive drops before anyone else.", memberCount: cfg?.memberCount || 5000, groupLink: cfg?.groupLink || "https://chat.whatsapp.com/" }));
             }
             case "faq": {
                 const cfg = config;
                 if (!cfg?.showOnHomepage) {
                     return null;
                 }
-                return (_jsx(FAQSection, { title: cfg?.title || "Frequently Asked Questions", tabs: [], activeTab: "", items: faqItems, viewMoreHref: ROUTES.PUBLIC.FAQS, viewMoreLabel: "View all FAQs \u2192" }));
+                return (_jsx(FAQSection, { title: cleanTitle(cfg?.title) || "Frequently Asked Questions", tabs: [], activeTab: "", items: faqItems, viewMoreHref: ROUTES.PUBLIC.FAQS, viewMoreLabel: "View all FAQs \u2192" }));
             }
             case "blog-articles": {
                 const cfg = config;
-                return (_jsx(BlogArticlesSection, { title: cfg?.title || "From Our Blog", viewMoreHref: ROUTES.BLOG.LIST, viewMoreLabel: "View all posts \u2192" }));
+                return (_jsx(BlogArticlesSection, { title: cleanTitle(cfg?.title) || "From Our Blog", viewMoreHref: ROUTES.BLOG.LIST, viewMoreLabel: "View all posts \u2192" }));
             }
             case "newsletter": {
                 const cfg = config;
-                return (_jsx(NewsletterSection, { title: cfg?.title || "Stay Updated", subtitle: cfg?.description || "Get the latest drops, auctions, and deals in your inbox.", renderForm: () => newsletterFormSlot ?? null }));
+                return (_jsx(NewsletterSection, { title: cleanTitle(cfg?.title) || "Stay Updated", subtitle: cfg?.description || "Get the latest drops, auctions, and deals in your inbox.", renderForm: () => newsletterFormSlot ?? null }));
             }
             case "brands": {
                 const cfg = config;
-                return (_jsx(BrandsSection, { title: cfg?.title || "Top Brands", subtitle: cfg?.subtitle, limit: cfg?.maxBrands || 12, viewMoreHref: ROUTES.PUBLIC.CATEGORIES, viewMoreLabel: "All brands \u2192" }));
+                return (_jsx(BrandsSection, { title: cleanTitle(cfg?.title) || "Top Brands", subtitle: cfg?.subtitle, limit: cfg?.maxBrands || 12, viewMoreHref: ROUTES.PUBLIC.CATEGORIES, viewMoreLabel: "All brands \u2192" }));
             }
             default:
                 return null;
@@ -248,5 +258,5 @@ export async function MarketplaceHomepageView({ adSlots, newsletterFormSlot, } =
         answer: typeof faq.answer === "string" ? faq.answer : faq.answer.text,
     }));
     // Render with dynamic sections from DB
-    return (_jsxs(Main, { children: [showAnnouncement ? _jsx(AnnouncementBar, { message: announcementMessage }) : null, _jsx(HeroCarousel, { initialSlides: slides }), adSlots?.afterHero, orderedSections.map((section) => renderSection(section, adSlots, newsletterFormSlot ?? null, faqItems))] }));
+    return (_jsxs(Main, { children: [showAnnouncement ? _jsx(AnnouncementBar, { message: announcementMessage }) : null, orderedSections.map((section) => renderSection(section, adSlots, newsletterFormSlot ?? null, faqItems, slides))] }));
 }

package/dist/features/homepage/components/SectionCarousel.js

@@ -8,7 +8,7 @@ function CarouselSkeleton({ count }) {
     return (_jsx("div", { className: "flex gap-4 overflow-hidden px-4", "data-section": "sectioncarousel-div-349", children: Array.from({ length: count }).map((_, i) => (_jsxs("div", { className: "flex-none min-w-[clamp(150px,18vw,260px)] max-w-[clamp(240px,36vw,380px)] h-[clamp(180px,26vh,260px)] space-y-2", "data-section": "sectioncarousel-div-350", children: [_jsx("div", { className: `aspect-square rounded-xl ${skeleton.image}` }), _jsx("div", { className: `${skeleton.text} w-3/4` }), _jsx("div", { className: `${skeleton.text} w-1/2` })] }, i))) }));
 }
 // --- Component ---------------------------------------------------------------
-export function SectionCarousel({ title, description, headingVariant = "default", pillLabel, backgroundImage, viewMoreHref, viewMoreLabel = "View all →", items, renderItem, perView = THEME_CONSTANTS.carousel.perView.default, gap = 16, autoScroll = false, autoScrollInterval = 3500, keyExtractor, rows = 1, className = "", isLoading = false, skeletonCount = 4, lightText, showPeek = false, minItemWidth = 220, }) {
+export function SectionCarousel({ title, description, headingVariant = "editorial", pillLabel, backgroundImage, viewMoreHref, viewMoreLabel = "View all →", items, renderItem, perView = THEME_CONSTANTS.carousel.perView.standard, gap = 16, autoScroll = false, autoScrollInterval = 3500, keyExtractor, rows = 1, className = "", isLoading = false, skeletonCount = 4, lightText, showPeek = false, minItemWidth = 220, }) {
     const hasBg = Boolean(backgroundImage);
     const useLightText = lightText ?? hasBg;
     const { themed, flex } = THEME_CONSTANTS;
@@ -39,7 +39,7 @@ export function SectionCarousel({ title, description, headingVariant = "default"
                            - show fade edges for visual affordance
                            - hide native scrollbar for cleaner appearance
                         */
-                        showArrows: true, snapToItems: true, showFadeEdges: true, showScrollbar: false, pauseOnHover: true })), viewMoreHref && !isLoading && (_jsx("div", { className: "mt-6 text-center", "data-section": "sectioncarousel-div-356", children: _jsx(TextLink, { href: viewMoreHref, className: `inline-flex items-center gap-2 px-6 py-2.5 rounded-full text-sm font-medium transition-colors ${useLightText
-                                ? "bg-white/20 text-white hover:bg-white/30 backdrop-blur-sm"
-                                : "bg-primary/10 text-primary hover:bg-primary/20 dark:bg-primary/15 dark:text-primary-400"}`, children: viewMoreLabel }) }))] })] }));
+                        showArrows: true, snapToItems: true, showFadeEdges: true, showScrollbar: false, pauseOnHover: true })), viewMoreHref && !isLoading && (_jsx("div", { className: "mt-6 flex justify-center", "data-section": "sectioncarousel-div-356", children: _jsx(TextLink, { href: viewMoreHref, className: `inline-flex items-center gap-1.5 rounded-lg border px-6 py-2.5 text-sm font-medium transition-colors ${useLightText
+                                ? "border-white/40 text-white hover:bg-white/10"
+                                : "border-zinc-200 dark:border-zinc-700 text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-800"}`, children: viewMoreLabel }) }))] })] }));
 }

package/dist/features/homepage/components/ShopByCategorySection.js

@@ -10,12 +10,12 @@ function CategoryChip({ category }) {
     const coverImage = category.display?.coverImage;
     const initial = category.name[0]?.toUpperCase() ?? "?";
     const productCount = category.metrics?.productCount ?? 0;
-    return (_jsxs(Link, { href: ROUTES.PUBLIC.CATEGORY_DETAIL(category.slug), className: "group flex min-h-[220px] min-w-[180px] max-w-[220px] flex-col overflow-hidden rounded-xl border border-zinc-200 bg-white shadow-sm transition-all hover:border-primary-300 hover:shadow-md dark:border-slate-700 dark:bg-slate-900 dark:hover:border-primary-600", children: [coverImage ? (_jsx("div", { className: "aspect-video w-full overflow-hidden bg-zinc-100 dark:bg-slate-800", "data-section": "shopbycategorysection-div-362", children: _jsx("img", { src: coverImage, alt: category.name, className: "h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" }) })) : (_jsx("div", { className: "aspect-video w-full bg-gradient-to-br from-zinc-100 to-zinc-200 dark:from-slate-800 dark:to-slate-700" })), _jsxs("div", { className: "flex flex-1 flex-col p-3 text-left", "data-section": "shopbycategorysection-div-363", children: [_jsx("div", { className: "mb-2 flex h-9 w-9 items-center justify-center rounded-lg bg-primary-100 text-sm font-bold text-primary-700 dark:bg-primary-900 dark:text-primary-300", "data-section": "shopbycategorysection-div-364", children: iconSrc ? (_jsx("img", { src: iconSrc, alt: "", className: "h-6 w-6 rounded object-cover", "aria-hidden": "true" })) : (initial) }), _jsx(Text, { className: `${THEME_CONSTANTS.utilities.textClamp2} text-sm font-semibold text-zinc-800 dark:text-zinc-200`, children: category.name }), _jsxs(Text, { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: [productCount.toLocaleString(), " items"] }), _jsx(Text, { className: "mt-auto pt-3 text-xs font-medium text-primary dark:text-primary-400", children: "Browse category \u2192" })] })] }));
+    return (_jsxs(Link, { href: ROUTES.PUBLIC.CATEGORY_DETAIL(category.slug), className: "group flex w-full min-h-[220px] flex-col overflow-hidden rounded-xl border border-zinc-200 bg-white shadow-sm transition-all hover:border-primary-300 hover:shadow-md dark:border-slate-700 dark:bg-slate-900 dark:hover:border-primary-600", children: [coverImage ? (_jsx("div", { className: "aspect-video w-full overflow-hidden bg-zinc-100 dark:bg-slate-800", "data-section": "shopbycategorysection-div-362", children: _jsx("img", { src: coverImage, alt: category.name, className: "h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" }) })) : (_jsx("div", { className: "aspect-video w-full bg-gradient-to-br from-zinc-100 to-zinc-200 dark:from-slate-800 dark:to-slate-700" })), _jsxs("div", { className: "flex flex-1 flex-col p-3 text-left", "data-section": "shopbycategorysection-div-363", children: [_jsx("div", { className: "mb-2 flex h-9 w-9 items-center justify-center rounded-lg bg-primary-100 text-sm font-bold text-primary-700 dark:bg-primary-900 dark:text-primary-300", "data-section": "shopbycategorysection-div-364", children: iconSrc ? (_jsx("img", { src: iconSrc, alt: "", className: "h-6 w-6 rounded object-cover", "aria-hidden": "true" })) : (initial) }), _jsx(Text, { className: `${THEME_CONSTANTS.utilities.textClamp2} text-sm font-semibold text-zinc-800 dark:text-zinc-200`, children: category.name }), _jsxs(Text, { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: [productCount.toLocaleString(), " items"] }), _jsx(Text, { className: "mt-auto pt-3 text-xs font-medium text-primary dark:text-primary-400", children: "Browse category \u2192" })] })] }));
 }
 export function ShopByCategorySection({ title = "Shop by Category", subtitle, limit = 12, viewMoreHref, viewMoreLabel = "View all categories →", className = "", }) {
     const { themed } = THEME_CONSTANTS;
     const { data: categories = [], isLoading } = useTopCategories(limit);
     if (!isLoading && categories.length === 0)
         return null;
-    return (_jsx(Section, { className: `py-12 px-4 ${themed.bgSecondary} ${className}`, children: _jsxs("div", { className: "mx-auto max-w-7xl", "data-section": "shopbycategorysection-div-365", children: [_jsxs("div", { className: "mb-6 text-center", "data-section": "shopbycategorysection-div-366", children: [_jsx(Heading, { level: 2, className: `text-2xl font-bold md:text-3xl ${themed.textPrimary}`, children: title }), subtitle && (_jsx(Text, { variant: "secondary", className: "mt-1 text-sm", children: subtitle }))] }), isLoading ? (_jsx("div", { className: "flex gap-3 overflow-hidden px-1", "data-section": "shopbycategorysection-div-367", children: Array.from({ length: 6 }).map((_, i) => (_jsx("div", { className: "flex-none h-[104px] w-[108px] animate-pulse rounded-xl bg-zinc-200 dark:bg-slate-700" }, i))) })) : (_jsx(HorizontalScroller, { items: categories, renderItem: (cat) => _jsx(CategoryChip, { category: cat }), perView: THEME_CONSTANTS.carousel.perView.compact, gap: 16, keyExtractor: (cat) => cat.id, minItemWidth: 180 })), viewMoreHref && !isLoading && (_jsx("div", { className: "mt-6 text-center", "data-section": "shopbycategorysection-div-368", children: _jsx(Link, { href: viewMoreHref, className: "inline-flex items-center gap-1 text-sm font-medium text-primary hover:text-primary/80", children: viewMoreLabel }) }))] }) }));
+    return (_jsx(Section, { className: `py-12 px-4 ${themed.bgSecondary} ${className}`, children: _jsxs("div", { className: "mx-auto max-w-7xl", "data-section": "shopbycategorysection-div-365", children: [_jsxs("div", { className: "mb-6 text-center", "data-section": "shopbycategorysection-div-366", children: [_jsx(Heading, { level: 2, className: `text-2xl font-bold md:text-3xl ${themed.textPrimary}`, children: title }), subtitle && (_jsx(Text, { variant: "secondary", className: "mt-1 text-sm", children: subtitle }))] }), isLoading ? (_jsx("div", { className: "flex gap-3 overflow-hidden px-1", "data-section": "shopbycategorysection-div-367", children: Array.from({ length: 6 }).map((_, i) => (_jsx("div", { className: "flex-none h-[104px] w-[108px] animate-pulse rounded-xl bg-zinc-200 dark:bg-slate-700" }, i))) })) : (_jsx(HorizontalScroller, { items: categories, renderItem: (cat) => _jsx(CategoryChip, { category: cat }), perView: THEME_CONSTANTS.carousel.perView.standard, gap: 16, keyExtractor: (cat) => cat.id, autoScroll: true, autoScrollInterval: 3500, showArrows: true, snapToItems: true, showFadeEdges: true, showScrollbar: false, pauseOnHover: true })), viewMoreHref && !isLoading && (_jsx("div", { className: "mt-6 text-center", "data-section": "shopbycategorysection-div-368", children: _jsx(Link, { href: viewMoreHref, className: "inline-flex items-center gap-1 text-sm font-medium text-primary hover:text-primary/80", children: viewMoreLabel }) }))] }) }));
 }

package/dist/features/homepage/schemas/firestore.d.ts

@@ -245,7 +245,7 @@ export interface BannerSectionConfig {
     clickable: boolean;
     clickLink?: string;
 }
-export type SectionType = "welcome" | "stats" | "trust-indicators" | "categories" | "brands" | "products" | "pre-orders" | "auctions" | "banner" | "features" | "reviews" | "whatsapp-community" | "faq" | "blog-articles" | "newsletter" | "stores" | "events";
+export type SectionType = "welcome" | "carousel" | "stats" | "trust-indicators" | "categories" | "brands" | "products" | "pre-orders" | "auctions" | "banner" | "features" | "reviews" | "whatsapp-community" | "faq" | "blog-articles" | "newsletter" | "stores" | "events";
 export type SectionConfig = WelcomeSectionConfig | StatsSectionConfig | TrustIndicatorsSectionConfig | CategoriesSectionConfig | BrandsSectionConfig | ProductsSectionConfig | PreOrdersSectionConfig | AuctionsSectionConfig | BannerSectionConfig | FeaturesSectionConfig | ReviewsSectionConfig | WhatsAppCommunitySectionConfig | FAQSectionConfig | BlogArticlesSectionConfig | NewsletterSectionConfig | StoresSectionConfig | EventsSectionConfig;
 export interface HomepageSectionDocument {
     id: string;

package/dist/features/homepage/schemas/firestore.js

@@ -53,7 +53,8 @@ export const HOMEPAGE_SECTIONS_INDEXED_FIELDS = [
 ];
 export const DEFAULT_SECTION_ORDER = {
     welcome: 1,
-    stats: 2,
+    carousel: 2,
+    stats: 3,
     "trust-indicators": 3,
     categories: 2,
     brands: 2,

package/dist/features/layout/AppLayoutShell.d.ts

@@ -51,7 +51,9 @@ export interface AppLayoutShellProps {
     onLogout?: () => void;
     /** Href for the admin dashboard — shown in sidebar Dashboard section when user.role is admin. */
     adminHref?: string;
-    /** Href for the seller dashboard — shown in sidebar Dashboard section when user.role is admin or seller. */
+    /** Href for the store management dashboard — shown in sidebar Dashboard section when user.role is admin or seller. */
+    storeHref?: string;
+    /** @deprecated Use storeHref */
     sellerHref?: string;
     /** Href for the user orders page — auto-generates PROFILE section in sidebar. */
     userOrdersHref?: string;
@@ -72,6 +74,8 @@ export interface AppLayoutShellProps {
         settings?: string;
         dashboardSectionTitle?: string;
         adminDashboard?: string;
+        storeDashboard?: string;
+        /** @deprecated Use storeDashboard */
         sellerDashboard?: string;
         logout?: string;
     };
@@ -95,4 +99,4 @@ export interface AppLayoutShellProps {
         };
     };
 }
-export declare function AppLayoutShell({ children, navItems, sidebarItems, sidebarSections, sidebarPrimaryActions, sidebarTitle, hiddenNavItems, user, brandName, brandShortName, logoHref, promotionsHref, cartHref, profileHref, loginHref, homeHref, shopHref, footer, searchSlot, searchSlotRenderer, titleBarNavSlot, titleBarNotificationSlot, titleBarDevSlot, titleBarPromoStripText, showThemeToggle, suppressDashboardNav, hideSidebarToggle, onLogout, adminHref, sellerHref, userOrdersHref, userWishlistHref, userSettingsHref, sidebarLocaleSlot, showThemeToggleInSidebar, sidebarProfileLabels, eventBannerSlot, lightBackground, darkBackground, }: AppLayoutShellProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppLayoutShell({ children, navItems, sidebarItems, sidebarSections, sidebarPrimaryActions, sidebarTitle, hiddenNavItems, user, brandName, brandShortName, logoHref, promotionsHref, cartHref, profileHref, loginHref, homeHref, shopHref, footer, searchSlot, searchSlotRenderer, titleBarNavSlot, titleBarNotificationSlot, titleBarDevSlot, titleBarPromoStripText, showThemeToggle, suppressDashboardNav, hideSidebarToggle, onLogout, adminHref, storeHref, sellerHref, userOrdersHref, userWishlistHref, userSettingsHref, sidebarLocaleSlot, showThemeToggleInSidebar, sidebarProfileLabels, eventBannerSlot, lightBackground, darkBackground, }: AppLayoutShellProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/layout/AppLayoutShell.js

@@ -33,7 +33,7 @@ function CollapsibleSidebarSection({ section, navItemClass, }) {
     }
     return (_jsxs(Div, { className: "space-y-0.5", children: [_jsxs("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center justify-between px-1 py-1 text-xs font-semibold uppercase tracking-wider text-zinc-500 dark:text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-300 transition-colors", children: [_jsx("span", { children: section.title }), _jsx("svg", { className: `w-3.5 h-3.5 transition-transform duration-200 ${open ? "rotate-180" : ""}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })] }), open && (_jsx(Ul, { className: "space-y-0.5", children: section.items.map((item) => (_jsx(Li, { children: _jsxs(TextLink, { href: item.href, variant: "none", className: navItemClass, children: [item.icon && (_jsx("span", { className: "flex-shrink-0 w-5 text-center", "aria-hidden": "true", children: item.icon })), item.label] }) }, `${item.href}-${item.label}`))) }))] }));
 }
-export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarSections, sidebarPrimaryActions, sidebarTitle = "Navigation", hiddenNavItems, user, brandName, brandShortName, logoHref, promotionsHref, cartHref, profileHref, loginHref, homeHref, shopHref, footer, searchSlot, searchSlotRenderer, titleBarNavSlot, titleBarNotificationSlot, titleBarDevSlot, titleBarPromoStripText, showThemeToggle = false, suppressDashboardNav = false, hideSidebarToggle = false, onLogout, adminHref, sellerHref, userOrdersHref, userWishlistHref, userSettingsHref, sidebarLocaleSlot, showThemeToggleInSidebar = false, sidebarProfileLabels, eventBannerSlot, lightBackground = DEFAULT_LIGHT_BG, darkBackground = DEFAULT_DARK_BG, }) {
+export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarSections, sidebarPrimaryActions, sidebarTitle = "Navigation", hiddenNavItems, user, brandName, brandShortName, logoHref, promotionsHref, cartHref, profileHref, loginHref, homeHref, shopHref, footer, searchSlot, searchSlotRenderer, titleBarNavSlot, titleBarNotificationSlot, titleBarDevSlot, titleBarPromoStripText, showThemeToggle = false, suppressDashboardNav = false, hideSidebarToggle = false, onLogout, adminHref, storeHref, sellerHref, userOrdersHref, userWishlistHref, userSettingsHref, sidebarLocaleSlot, showThemeToggleInSidebar = false, sidebarProfileLabels, eventBannerSlot, lightBackground = DEFAULT_LIGHT_BG, darkBackground = DEFAULT_DARK_BG, }) {
     const [queryClient] = useState(() => new QueryClient());
     const [sidebarOpen, setSidebarOpen] = useState(false);
     const [searchOpen, setSearchOpen] = useState(false);
@@ -60,6 +60,7 @@ export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarS
         const isAuthenticated = !!user;
         const role = user?.role ?? "user";
         const isAdminOrSeller = role === "admin" || role === "seller";
+        const resolvedStoreHref = storeHref ?? sellerHref;
         // Labels with defaults
         const labels = {
             sectionTitle: sidebarProfileLabels?.sectionTitle ?? "Profile",
@@ -69,7 +70,9 @@ export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarS
             settings: sidebarProfileLabels?.settings ?? "Settings",
             dashboardSectionTitle: sidebarProfileLabels?.dashboardSectionTitle ?? "Dashboard",
             adminDashboard: sidebarProfileLabels?.adminDashboard ?? "Admin Dashboard",
-            sellerDashboard: sidebarProfileLabels?.sellerDashboard ?? "Seller Dashboard",
+            storeDashboard: sidebarProfileLabels?.storeDashboard ??
+                sidebarProfileLabels?.sellerDashboard ??
+                "Store Dashboard",
             logout: sidebarProfileLabels?.logout ?? "Logout",
         };
         const sectionLabelClass = "px-1 text-xs font-semibold uppercase tracking-wider text-zinc-500 dark:text-zinc-400";
@@ -86,7 +89,7 @@ export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarS
                             action.variant === "outline"
                                 ? "border border-zinc-300 text-zinc-700 hover:bg-zinc-50 dark:border-slate-700 dark:text-zinc-100 dark:hover:bg-slate-800"
                                 : "bg-primary !text-zinc-900 hover:bg-primary-500 dark:bg-secondary dark:!text-white dark:hover:bg-secondary-600 shadow-lg shadow-primary/20 dark:shadow-secondary/20",
-                        ].join(" "), children: action.label }, `${action.href}-${action.label}`))) })), isAuthenticated && (_jsxs(Div, { className: "space-y-1", children: [_jsx(Text, { className: sectionLabelClass, children: labels.sectionTitle }), _jsxs(Ul, { className: "space-y-0.5", children: [_jsx(Li, { children: _jsx(TextLink, { href: profileHref, variant: "none", className: navItemClass, children: labels.profile }) }), userOrdersHref && (_jsx(Li, { children: _jsx(TextLink, { href: userOrdersHref, variant: "none", className: navItemClass, children: labels.orders }) })), userWishlistHref && (_jsx(Li, { children: _jsx(TextLink, { href: userWishlistHref, variant: "none", className: navItemClass, children: labels.wishlist }) })), userSettingsHref && (_jsx(Li, { children: _jsx(TextLink, { href: userSettingsHref, variant: "none", className: navItemClass, children: labels.settings }) }))] })] })), isAuthenticated && user?.stats && (_jsxs(Div, { className: "grid grid-cols-2 gap-2", children: [user.stats.totalOrders != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.totalOrders }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Orders" })] })), user.stats.reviewsCount != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.reviewsCount }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Reviews" })] })), user.stats.auctionsWon != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.auctionsWon }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Auctions Won" })] })), user.stats.itemsSold != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.itemsSold }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Items Sold" })] }))] })), isAuthenticated && isAdminOrSeller && (adminHref || sellerHref) && (_jsxs(Div, { className: "space-y-1", children: [_jsx(Text, { className: sectionLabelClass, children: labels.dashboardSectionTitle }), _jsxs(Ul, { className: "space-y-0.5", children: [adminHref && role === "admin" && (_jsx(Li, { children: _jsx(TextLink, { href: adminHref, variant: "none", className: navItemClass, children: labels.adminDashboard }) })), sellerHref && isAdminOrSeller && (_jsx(Li, { children: _jsx(TextLink, { href: sellerHref, variant: "none", className: navItemClass, children: labels.sellerDashboard }) }))] })] })), normalizedSections.map((section, sectionIndex) => (_jsx(CollapsibleSidebarSection, { section: section, navItemClass: navItemClass }, `sidebar-section-${sectionIndex}`))), (sidebarLocaleSlot ||
+                        ].join(" "), children: action.label }, `${action.href}-${action.label}`))) })), isAuthenticated && (_jsxs(Div, { className: "space-y-1", children: [_jsx(Text, { className: sectionLabelClass, children: labels.sectionTitle }), _jsxs(Ul, { className: "space-y-0.5", children: [_jsx(Li, { children: _jsx(TextLink, { href: profileHref, variant: "none", className: navItemClass, children: labels.profile }) }), userOrdersHref && (_jsx(Li, { children: _jsx(TextLink, { href: userOrdersHref, variant: "none", className: navItemClass, children: labels.orders }) })), userWishlistHref && (_jsx(Li, { children: _jsx(TextLink, { href: userWishlistHref, variant: "none", className: navItemClass, children: labels.wishlist }) })), userSettingsHref && (_jsx(Li, { children: _jsx(TextLink, { href: userSettingsHref, variant: "none", className: navItemClass, children: labels.settings }) }))] })] })), isAuthenticated && user?.stats && (_jsxs(Div, { className: "grid grid-cols-2 gap-2", children: [user.stats.totalOrders != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.totalOrders }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Orders" })] })), user.stats.reviewsCount != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.reviewsCount }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Reviews" })] })), user.stats.auctionsWon != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.auctionsWon }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Auctions Won" })] })), user.stats.itemsSold != null && (_jsxs(Div, { className: "rounded-lg bg-zinc-100 dark:bg-slate-800 px-3 py-2.5 text-center", children: [_jsx(Text, { className: "text-lg font-bold text-zinc-900 dark:text-zinc-100 leading-none", children: user.stats.itemsSold }), _jsx(Text, { className: "mt-0.5 text-[11px] text-zinc-500 dark:text-zinc-400", children: "Items Sold" })] }))] })), isAuthenticated && isAdminOrSeller && (adminHref || resolvedStoreHref) && (_jsxs(Div, { className: "space-y-1", children: [_jsx(Text, { className: sectionLabelClass, children: labels.dashboardSectionTitle }), _jsxs(Ul, { className: "space-y-0.5", children: [adminHref && role === "admin" && (_jsx(Li, { children: _jsx(TextLink, { href: adminHref, variant: "none", className: navItemClass, children: labels.adminDashboard }) })), resolvedStoreHref && isAdminOrSeller && (_jsx(Li, { children: _jsx(TextLink, { href: resolvedStoreHref, variant: "none", className: navItemClass, children: labels.storeDashboard }) }))] })] })), normalizedSections.map((section, sectionIndex) => (_jsx(CollapsibleSidebarSection, { section: section, navItemClass: navItemClass }, `sidebar-section-${sectionIndex}`))), (sidebarLocaleSlot ||
                     showThemeToggleInSidebar ||
                     (isAuthenticated && onLogout)) && (_jsxs(Div, { className: "border-t border-zinc-200 pt-4 space-y-3 dark:border-slate-800", children: [sidebarLocaleSlot, showThemeToggleInSidebar && (_jsxs("button", { type: "button", onClick: toggleTheme, className: "flex w-full items-center gap-3 rounded-lg px-3 py-2 text-sm text-zinc-700 transition-colors hover:bg-primary-50 hover:text-primary-800 dark:text-zinc-300 dark:hover:bg-slate-800 dark:hover:text-secondary-300", children: [_jsx("span", { "aria-hidden": "true", children: theme === "dark" ? "☀️" : "🌙" }), theme === "dark" ? "Light mode" : "Dark mode"] })), isAuthenticated && onLogout && (_jsx("button", { type: "button", onClick: () => {
                                 onLogout();
@@ -102,6 +105,7 @@ export function AppLayoutShell({ children, navItems, sidebarItems = [], sidebarS
         userWishlistHref,
         userSettingsHref,
         adminHref,
+        storeHref,
         sellerHref,
         sidebarLocaleSlot,
         showThemeToggleInSidebar,

package/dist/features/pre-orders/components/MarketplacePreorderCard.d.ts

@@ -5,6 +5,7 @@ export interface MarketplacePreorderCardLabels {
     preOrderBadge?: string;
     featuredBadge?: string;
     reserveNow?: string;
+    addToCart?: string;
     addToWishlist?: string;
     removeFromWishlist?: string;
 }
@@ -19,7 +20,8 @@ export interface MarketplacePreorderCardProps {
     href?: string;
     hrefBuilder?: (product: MarketplacePreorderCardData) => string;
     onNavigate?: (href: string) => void;
+    onAddToCart?: (product: MarketplacePreorderCardData) => void;
     wishlistActions?: WishlistToggleActions;
     labels?: MarketplacePreorderCardLabels;
 }
-export declare function MarketplacePreorderCard({ product, className, variant, selectable, isSelected, onSelect, inWishlist: initialInWishlist, href, hrefBuilder, onNavigate, wishlistActions, labels, }: MarketplacePreorderCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function MarketplacePreorderCard({ product, className, variant, selectable, isSelected, onSelect, inWishlist: initialInWishlist, href, hrefBuilder, onNavigate, onAddToCart, wishlistActions, labels, }: MarketplacePreorderCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/pre-orders/components/MarketplacePreorderCard.js

@@ -15,6 +15,7 @@ const DEFAULT_LABELS = {
     preOrderBadge: "Pre-order",
     featuredBadge: "Featured",
     reserveNow: "Reserve now",
+    addToCart: "Add to Cart",
     addToWishlist: "Add to wishlist",
     removeFromWishlist: "Remove from wishlist",
 };
@@ -25,7 +26,7 @@ function resolveHref(product, href, hrefBuilder) {
         return hrefBuilder(product);
     return ROUTES.PUBLIC.PRE_ORDER_DETAIL(product.id);
 }
-export function MarketplacePreorderCard({ product, className = "", variant = "grid", selectable = false, isSelected = false, onSelect, inWishlist: initialInWishlist = false, href, hrefBuilder, onNavigate, wishlistActions, labels, }) {
+export function MarketplacePreorderCard({ product, className = "", variant = "grid", selectable = false, isSelected = false, onSelect, inWishlist: initialInWishlist = false, href, hrefBuilder, onNavigate, onAddToCart, wishlistActions, labels, }) {
     const router = useRouter();
     const mergedLabels = { ...DEFAULT_LABELS, ...labels };
     const detailHref = resolveHref(product, href, hrefBuilder);
@@ -51,7 +52,10 @@ export function MarketplacePreorderCard({ product, className = "", variant = "gr
     return (_jsxs(BaseListingCard, { isSelected: isSelected, variant: variant, className: className, children: [_jsxs(BaseListingCard.Hero, { aspect: "square", variant: variant, children: [_jsx(TextLink, { href: detailHref, className: "absolute inset-0 block", children: _jsx(MediaImage, { src: product.mainImage, alt: product.title, size: "card", fallback: "Product image" }) }), _jsxs(Div, { className: "absolute right-2 top-2 flex flex-col items-end gap-1", children: [_jsx(Span, { className: "inline-flex items-center rounded-full bg-cobalt px-2 py-0.5 text-xs font-medium text-white", children: mergedLabels.preOrderBadge }), product.featured && (_jsx(Span, { className: "inline-flex items-center rounded-full bg-amber-500 px-2 py-0.5 text-xs font-medium text-white", children: mergedLabels.featuredBadge }))] }), selectable && (_jsx(BaseListingCard.Checkbox, { selected: isSelected, onSelect: (event) => {
                             event.stopPropagation();
                             onSelect?.(product.id, !isSelected);
-                        } }))] }), _jsxs(BaseListingCard.Info, { variant: variant, children: [_jsx(TextLink, { href: detailHref, children: _jsx(Text, { className: `${THEME_CONSTANTS.utilities.textClamp2} text-sm font-medium text-zinc-900`, children: product.title }) }), product.description ? (_jsx(RichText, { html: normalizeRichTextHtml(product.description), proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: `${THEME_CONSTANTS.utilities.textClamp2} text-xs text-zinc-500` })) : null, _jsxs(Row, { justify: "between", className: "mt-1 gap-2", children: [_jsx(Text, { className: "text-sm font-semibold text-zinc-900", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsxs(Row, { justify: "between", className: "mt-2 gap-2", children: [_jsx(Button, { type: "button", variant: "primary", size: "sm", className: "flex-1 text-xs", onClick: handleNavigate, children: mergedLabels.reserveNow }), wishlistActions ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: `text-base ${inWishlist ? "text-primary" : "text-zinc-500"}`, onClick: handleWishlist, "aria-label": inWishlist
+                        } }))] }), _jsxs(BaseListingCard.Info, { variant: variant, children: [_jsx(TextLink, { href: detailHref, children: _jsx(Text, { className: `${THEME_CONSTANTS.utilities.textClamp2} text-sm font-medium text-zinc-900`, children: product.title }) }), product.description ? (_jsx(RichText, { html: normalizeRichTextHtml(product.description), proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: `${THEME_CONSTANTS.utilities.textClamp2} text-xs text-zinc-500` })) : null, _jsxs(Row, { justify: "between", className: "mt-1 gap-2", children: [_jsx(Text, { className: "text-sm font-semibold text-zinc-900", children: formatCurrency(product.price, getDefaultCurrency()) }), shipDate && _jsx(PreorderBadge, { shipDate: shipDate })] }), _jsxs(Row, { justify: "between", className: "mt-2 gap-2", children: [_jsx(Button, { type: "button", variant: "primary", size: "sm", className: "flex-1 text-xs", onClick: handleNavigate, children: mergedLabels.reserveNow }), onAddToCart ? (_jsx(Button, { type: "button", variant: "outline", size: "sm", className: "flex-1 text-xs", onClick: (e) => {
+                                    e.stopPropagation();
+                                    onAddToCart(product);
+                                }, children: mergedLabels.addToCart })) : null, wishlistActions ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: `text-base ${inWishlist ? "text-primary" : "text-zinc-500"}`, onClick: handleWishlist, "aria-label": inWishlist
                                     ? mergedLabels.removeFromWishlist
                                     : mergedLabels.addToWishlist, children: inWishlist ? "♥" : "♡" })) : null] })] })] }));
 }

package/dist/features/pre-orders/components/PreOrderDetailPageView.js

@@ -3,8 +3,25 @@ import Link from "next/link";
 import { productRepository } from "../../../repositories";
 import { ROUTES } from "../../../next";
 import { getDefaultCurrency } from "../../../core/baseline-resolver";
-import { Button, Container, Div, Heading, 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, Main, RichText, Row, Section, Span, Stack, Text, } from "../../../ui";
 import { PreOrderDetailView } from "../../products/components/PreOrderDetailView";
+import { BuyBar } from "../../products/components/BuyBar";
+import { ProductGalleryClient } from "../../products/components/ProductGalleryClient";
+import { ProductFeatureBadges } from "../../products/components/ProductFeatureBadges";
+function toDescriptionHtml(raw) {
+    if (!raw)
+        return "";
+    const s = typeof raw === "string" ? raw : JSON.stringify(raw);
+    return normalizeRichTextHtml(s);
+}
+const PRODUCTION_STATUS_LABELS = {
+    upcoming: "Coming Soon",
+    in_production: "In Production",
+    ready_to_ship: "Ready to Ship",
+};
 export async function PreOrderDetailPageView({ id }) {
     const product = await productRepository.findByIdOrSlug(id).catch(() => undefined);
     if (!product) {
@@ -12,16 +29,67 @@ export async function PreOrderDetailPageView({ id }) {
     }
     const p = product;
     const currency = p.currency || getDefaultCurrency();
-    const price = typeof p.price === "number"
-        ? new Intl.NumberFormat(undefined, { style: "currency", currency }).format(p.price)
+    const title = String(p.title ?? p.name ?? "Pre-Order Item");
+    const price = typeof p.price === "number" ? p.price : null;
+    const images = Array.isArray(p.images)
+        ? p.images
+        : typeof p.mainImage === "string"
+            ? [p.mainImage]
+            : [];
+    const reservedCount = typeof p.preOrderCurrentCount === "number"
+        ? p.preOrderCurrentCount
+        : typeof p.reservedCount === "number"
+            ? p.reservedCount
+            : 0;
+    const reserveTarget = typeof p.preOrderMaxQuantity === "number"
+        ? p.preOrderMaxQuantity
+        : typeof p.preOrderTarget === "number"
+            ? p.preOrderTarget
+            : typeof p.reserveTarget === "number"
+                ? p.reserveTarget
+                : 0;
+    const progressPct = reserveTarget > 0
+        ? Math.min(100, Math.round((reservedCount / reserveTarget) * 100))
+        : 0;
+    const depositPercent = typeof p.preOrderDepositPercent === "number" ? p.preOrderDepositPercent : null;
+    const depositAmount = typeof p.preOrderDepositAmount === "number"
+        ? p.preOrderDepositAmount
+        : price !== null && depositPercent !== null
+            ? Math.round((price * depositPercent) / 100)
+            : null;
+    const deliveryDate = p.preOrderDeliveryDate
+        ? new Date(p.preOrderDeliveryDate)
+        : null;
+    const productionStatus = typeof p.preOrderProductionStatus === "string"
+        ? p.preOrderProductionStatus
         : null;
-    const images = Array.isArray(p.images) ? p.images : p.imageUrl ? [p.imageUrl] : [];
-    const primaryImage = images[0];
-    const reservedCount = typeof p.reservedCount === "number" ? p.reservedCount
-        : typeof p.preOrderCurrentCount === "number" ? p.preOrderCurrentCount : 0;
-    const reserveTarget = typeof p.reserveTarget === "number" ? p.reserveTarget
-        : typeof p.preOrderTarget === "number" ? p.preOrderTarget
-            : typeof p.preOrderMaxQuantity === "number" ? p.preOrderMaxQuantity : 0;
-    const progressPct = reserveTarget > 0 ? Math.min(100, Math.round((reservedCount / reserveTarget) * 100)) : 0;
-    return (_jsx(PreOrderDetailView, { 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.name ?? "Pre-order image", 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.name ?? "Pre-Order Item" }), price && (_jsx(Text, { className: "text-2xl font-semibold text-primary-600 dark:text-primary-400", children: price })), p.description && (_jsx(Text, { className: "text-sm leading-relaxed text-zinc-600 dark:text-zinc-400", children: typeof p.description === "string" ? p.description : "" }))] })), renderBuyBar: () => (_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: [reserveTarget > 0 && (_jsxs(Stack, { gap: "xs", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Span, { className: "text-xs text-zinc-500", children: [reservedCount, " of ", reserveTarget, " reserved"] }), _jsxs(Span, { className: "text-xs font-medium text-primary-600", children: [progressPct, "%"] })] }), _jsx(Div, { className: "h-2 w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700", children: _jsx(Div, { className: "h-full rounded-full bg-primary", style: { width: `${progressPct}%` } }) })] })), price && (_jsx(Text, { className: "text-xl font-bold text-zinc-900 dark:text-zinc-50", children: price })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Reserve Now" })] }) })) }));
+    const isCancellable = p.preOrderCancellable === true;
+    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 features = Array.isArray(p.features) ? p.features : [];
+    const tags = Array.isArray(p.tags) ? p.tags : [];
+    const descriptionHtml = toDescriptionHtml(p.description);
+    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.PRE_ORDERS), className: "hover:text-primary-600 transition-colors", children: "Pre-Orders" }), _jsx(Span, { "aria-hidden": true, children: "/" }), _jsx(Span, { className: "text-zinc-700 dark:text-zinc-300 truncate max-w-[200px]", children: title })] }), _jsx(PreOrderDetailView, { renderGallery: () => (_jsx(ProductGalleryClient, { images: images, productName: title })), renderInfo: () => (_jsxs(Stack, { gap: "sm", children: [_jsxs(Div, { children: [_jsxs(Row, { gap: "xs", className: "mb-1.5 flex-wrap", children: [_jsx(Span, { className: "inline-block rounded-full bg-indigo-100 dark:bg-indigo-900/30 px-2.5 py-0.5 text-xs font-semibold text-indigo-700 dark:text-indigo-300", children: "Pre-Order" }), productionStatus && (_jsx(Span, { className: "inline-block rounded-full bg-zinc-100 dark:bg-zinc-800 px-2.5 py-0.5 text-xs font-medium text-zinc-600 dark:text-zinc-300", children: PRODUCTION_STATUS_LABELS[productionStatus] ?? productionStatus }))] }), _jsx(Heading, { level: 1, className: "text-xl font-bold leading-snug text-zinc-900 dark:text-zinc-50 sm:text-2xl", children: title })] }), price !== null && (_jsx(Span, { className: "text-2xl font-bold text-zinc-900 dark:text-zinc-50", children: formatCurrency(price, currency) })), deliveryDate && (_jsxs(Row, { align: "center", gap: "xs", className: "text-sm text-zinc-600 dark:text-zinc-400", children: [_jsx(Span, { children: "\uD83D\uDCC5" }), _jsx(Span, { children: "Estimated delivery:" }), _jsx(Span, { className: "font-medium", children: deliveryDate.toLocaleDateString(undefined, { year: "numeric", month: "long" }) })] })), _jsx(ProductFeatureBadges, { featured: featured, freeShipping: freeShipping, condition: condition ?? undefined, returnable: isCancellable, labels: {
+                                    featured: "Featured",
+                                    fasterDelivery: "Faster Delivery",
+                                    ratedSeller: "Rated Seller",
+                                    condition: "Condition",
+                                    conditionNew: "New",
+                                    conditionUsed: "Used",
+                                    conditionBroken: "For Parts",
+                                    conditionRefurbished: "Refurbished",
+                                    returnable: "Cancellable",
+                                    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 product" }), _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: "Sold by" }), _jsx(Span, { className: "text-xs font-medium text-zinc-700 dark:text-zinc-300", children: safeSeller })] }))] })), renderBuyBar: () => (_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: [reserveTarget > 0 && (_jsxs(Div, { className: "space-y-2", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { className: "text-xs text-zinc-500", children: [reservedCount, " of ", reserveTarget, " reserved"] }), _jsxs(Span, { className: "text-xs font-semibold text-primary-600 dark:text-primary-400", children: [progressPct, "%"] })] }), _jsx(Div, { className: "h-2 w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700", children: _jsx(Div, { className: "h-full rounded-full bg-primary transition-all", style: { width: `${progressPct}%` } }) })] })), price !== null && (_jsxs(Div, { children: [_jsx(Text, { className: "text-2xl font-bold text-zinc-900 dark:text-zinc-50", children: formatCurrency(price, currency) }), depositAmount !== null && (_jsxs(Text, { className: "mt-0.5 text-xs text-zinc-500", children: ["Reserve with ", formatCurrency(depositAmount, currency), depositPercent !== null ? ` (${depositPercent}% deposit)` : ""] }))] })), _jsxs(Stack, { gap: "sm", children: [_jsx(Button, { variant: "primary", size: "md", className: "w-full", children: "Reserve Now" }), isCancellable && (_jsx(Text, { className: "text-center text-xs text-zinc-500 dark:text-zinc-400", children: "\u2713 Free cancellation before production" }))] }), 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))) }) })), _jsx(Div, { className: "border-t border-zinc-200 dark:border-zinc-700 pt-4", children: _jsx(Row, { wrap: true, gap: "sm", className: "justify-center text-center", children: [
+                                        { icon: "🔒", label: "Secure\nPayment" },
+                                        { icon: "📅", label: "Guaranteed\nDelivery" },
+                                        { icon: "↩", label: "Free\nCancellation" },
+                                    ].map(({ icon, label }) => (_jsxs(Div, { className: "flex flex-col items-center gap-1 text-xs text-zinc-500 dark:text-zinc-400 min-w-[60px]", children: [_jsx(Span, { className: "text-base", children: icon }), _jsx(Span, { className: "whitespace-pre-line leading-tight", children: label })] }, label))) }) })] })) }), _jsxs(BuyBar, { children: [price !== null && (_jsx(Span, { className: "mr-auto text-sm font-bold text-zinc-900 dark:text-zinc-50", children: formatCurrency(price, currency) })), _jsx(Button, { variant: "primary", size: "sm", className: "flex-1", children: "Reserve Now" })] })] }) }));
 }

package/dist/features/pre-orders/components/PreOrderFilters.d.ts

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

package/dist/features/pre-orders/components/PreOrderFilters.js

@@ -0,0 +1,21 @@
+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 PreOrderFilters({ table, storeOptions = [], currencyPrefix = "", }) {
+    const t = useTranslations("filters");
+    const statusOptions = [
+        { value: "upcoming", label: "Upcoming" },
+        { value: "in_production", label: "In Production" },
+        { value: "ready_to_ship", label: "Ready to Ship" },
+        { value: "shipped", label: "Shipped" },
+    ];
+    const selectedStatuses = table.get("preOrderStatus")
+        ? table.get("preOrderStatus").split("|").filter(Boolean)
+        : [];
+    const selectedStores = table.get("storeId")
+        ? table.get("storeId").split("|").filter(Boolean)
+        : [];
+    return (_jsxs(Div, { children: [_jsx(FilterFacetSection, { title: t("preOrderStatus"), options: statusOptions, selected: selectedStatuses, onChange: (vals) => table.set("preOrderStatus", vals[0] ?? ""), searchable: false, selectionMode: "single", defaultCollapsed: false }), _jsx(RangeFilter, { title: t("priceRange"), minValue: table.get("minPrice"), maxValue: table.get("maxPrice"), onMinChange: (v) => table.set("minPrice", v), onMaxChange: (v) => table.set("maxPrice", v), prefix: currencyPrefix, showSlider: true, minBound: 0, maxBound: 500000, step: 100, minPlaceholder: t("minPrice"), maxPlaceholder: t("maxPrice"), 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, selectionMode: "single", defaultCollapsed: true })), _jsx(RangeFilter, { title: "Delivery Date Range", 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/pre-orders/components/PreOrdersIndexListing.d.ts

@@ -1,4 +1,5 @@
 export interface PreOrdersIndexListingProps {
     initialData?: any;
+    categorySlug?: string;
 }
-export declare function PreOrdersIndexListing({ initialData }: PreOrdersIndexListingProps): import("react/jsx-runtime").JSX.Element;
+export declare function PreOrdersIndexListing({ initialData, categorySlug }: PreOrdersIndexListingProps): import("react/jsx-runtime").JSX.Element;