@mohasinac/appkit 2.7.26 → 2.7.30

package/dist/client.d.ts

@@ -77,6 +77,8 @@ export type { UserSidebarProps, UserNavItem, UserNavGroup } from "./features/acc
 export { CouponsIndexListing } from "./features/promotions/components/CouponsIndexListing";
 export type { CouponsIndexListingProps } from "./features/promotions/components/CouponsIndexListing";
 export { NotificationBell } from "./features/account/components/NotificationBell";
+export { NotificationPreferencesPanel } from "./features/account/components/NotificationPreferencesPanel";
+export type { NotificationPreferencesPanelProps } from "./features/account/components/NotificationPreferencesPanel";
 export { ProtectedRoute, AuthStatusPanel, ForgotPasswordView, LoginForm, RegisterForm, ResetPasswordView, VerifyEmailView } from "./features/auth/index";
 export type { AuthGuardUser, ForgotPasswordViewProps, LoginFormProps, LoginFormValues, RegisterFormProps, RegisterFormValues, ResetPasswordViewProps, VerifyEmailViewProps, } from "./features/auth/index";
 export { useLogout, useLogin, useGoogleLogin, useRegister, useForgotPassword, useResetPassword, useVerifyEmail, useChangePassword, useChangeEmail } from "./features/auth/index";

package/dist/client.js

@@ -136,6 +136,7 @@ export { ADMIN_ENDPOINTS } from "./constants/index";
 export { UserSidebar } from "./features/account/components/UserSidebar";
 export { CouponsIndexListing } from "./features/promotions/components/CouponsIndexListing";
 export { NotificationBell } from "./features/account/components/NotificationBell";
+export { NotificationPreferencesPanel } from "./features/account/components/NotificationPreferencesPanel";
 export { ProtectedRoute, AuthStatusPanel, ForgotPasswordView, LoginForm, RegisterForm, ResetPasswordView, VerifyEmailView } from "./features/auth/index";
 export { useLogout, useLogin, useGoogleLogin, useRegister, useForgotPassword, useResetPassword, useVerifyEmail, useChangePassword, useChangeEmail } from "./features/auth/index";
 export { CartView, CartItemRow, CartSummary, CartDrawer, CheckoutView, CheckoutSuccessView, CheckoutAddressStep, useGuestCart, useCartCount, useAddToCart, useCart, useGuestCartMerge, useCartQuery } from "./features/cart/index";

package/dist/configs/next.js

@@ -156,6 +156,10 @@ export function defineNextConfig(override = {}) {
             "./node_modules/string_decoder/**",
             // Crypto / TLS utilities (used by firebase-admin token verification):
             "./node_modules/node-forge/**",
+            // html-entities: required by @google-cloud/storage/nodejs-common/util.js
+            // at cold start; not statically traced by Vercel. Missing this causes
+            // /api/media/sign (and any route using getAdminStorage()) to 500.
+            "./node_modules/html-entities/**",
         ],
     };
     const mergedOutputFileTracingIncludes = {

package/dist/constants/table-keys.d.ts

@@ -41,6 +41,12 @@ export declare const TABLE_KEYS: {
     readonly IS_PART_OF_BUNDLE: "isPartOfBundle";
     readonly SUBLISTING_CATEGORY: "sublistingCategory";
     readonly FEATURES: "features";
+    readonly CITY: "city";
+    readonly ACCEPTS_SHIPPING: "acceptsShipping";
+    readonly NEGOTIABLE: "negotiable";
+    readonly DELIVERY_METHOD: "deliveryMethod";
+    readonly SPECIES: "species";
+    readonly JURISDICTION: "jurisdiction";
 };
 export type TableKey = (typeof TABLE_KEYS)[keyof typeof TABLE_KEYS];
 export declare const VIEW_MODE: {

package/dist/constants/table-keys.js

@@ -41,6 +41,15 @@ export const TABLE_KEYS = {
     IS_PART_OF_BUNDLE: "isPartOfBundle",
     SUBLISTING_CATEGORY: "sublistingCategory",
     FEATURES: "features",
+    // Classified-specific
+    CITY: "city",
+    ACCEPTS_SHIPPING: "acceptsShipping",
+    NEGOTIABLE: "negotiable",
+    // Digital-code-specific
+    DELIVERY_METHOD: "deliveryMethod",
+    // Live-item-specific
+    SPECIES: "species",
+    JURISDICTION: "jurisdiction",
 };
 export const VIEW_MODE = {
     GRID: "grid",

package/dist/core/hooks/useSyncManager.js

@@ -66,6 +66,14 @@ export function useSyncManager(userId) {
     useEffect(() => {
         if (!userId)
             return; // Guest — keep ops in queue, don't sync
+        async function invalidateAfterSync(hadCartOps, hadWishlistOps) {
+            if (hadCartOps) {
+                await queryClient.invalidateQueries({ queryKey: ["cart"] });
+            }
+            if (hadWishlistOps) {
+                await queryClient.invalidateQueries({ queryKey: ["wishlist", userId] });
+            }
+        }
         const sync = async () => {
             if (isSyncing.current)
                 return;
@@ -74,14 +82,7 @@ export function useSyncManager(userId) {
                 const hadCartOps = getCartOps().length > 0;
                 const hadWishlistOps = getWishlistOps().length > 0;
                 await Promise.all([replayCartOps(), replayWishlistOps()]);
-                if (hadCartOps) {
-                    await queryClient.invalidateQueries({ queryKey: ["cart"] });
-                }
-                if (hadWishlistOps) {
-                    await queryClient.invalidateQueries({
-                        queryKey: ["wishlist", userId],
-                    });
-                }
+                await invalidateAfterSync(hadCartOps, hadWishlistOps);
             }
             finally {
                 isSyncing.current = false;

package/dist/features/about/components/FeesView.js

@@ -53,11 +53,14 @@ export async function FeesView({ heroBannerClass = DEFAULT_HERO_CLASS, } = {}) {
         { label: t("netPayoutLabel"), example: "= ₹917.40", highlight: true },
     ];
     void ROUTES; // ROUTES imported for future CTA links if needed
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "feesview-div-100", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.sm} text-center`, "data-section": "feesview-div-101", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.sm} py-10 md:py-12 lg:py-16 space-y-12`, "data-section": "feesview-div-102", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6", children: t("tableTitle") }), _jsx("div", { className: `overflow-x-auto rounded-xl border ${themed.border}`, "data-section": "feesview-div-103", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: themed.bgSecondary, children: _jsxs("tr", { children: [_jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colFeeType") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colRate") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colPaidBy") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold hidden md:table-cell", children: t("colNote") })] }) }), _jsx("tbody", { className: "divide-y divide-neutral-100 dark:divide-neutral-800", children: FEE_ROWS.map((row) => (_jsxs("tr", { className: `${themed.bgPrimary} hover:bg-neutral-50 dark:hover:bg-neutral-800/50`, children: [_jsx("td", { className: "py-3 px-4 font-medium", children: row.category }), _jsx("td", { className: "py-3 px-4 font-semibold text-violet-700 dark:text-violet-400", children: row.rate }), _jsx("td", { className: "py-3 px-4", children: _jsx(Caption, { children: row.who }) }), _jsx("td", { className: "py-3 px-4 text-neutral-500 dark:text-neutral-400 hidden md:table-cell text-xs", children: row.note })] }, row.category))) })] }) }), _jsx(Caption, { className: "mt-3 block text-neutral-500", children: t("tableNote") })] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("payoutExampleTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6", children: t("payoutExampleSubtitle") }), _jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-5 max-w-sm`, "data-section": "feesview-div-104", children: [_jsx(Heading, { level: 3, className: "text-base mb-4", children: t("payoutExampleProduct") }), _jsx("div", { className: "space-y-2", "data-section": "feesview-div-105", children: OFFER_PAYOUT_ROWS.map((row, i) => (_jsxs("div", { className: `flex justify-between text-sm ${row.highlight
-                                                ? "border-t border-neutral-200 dark:border-neutral-700 pt-2 mt-2 font-bold"
-                                                : ""}`, "data-section": "feesview-div-106", children: [_jsx(Text, { className: row.highlight
-                                                        ? "font-bold"
-                                                        : "text-neutral-600 dark:text-neutral-400", children: row.label }), _jsx(Text, { className: row.highlight
-                                                        ? "font-bold text-green-700 dark:text-green-400"
-                                                        : "", children: row.example })] }, i))) })] })] }), _jsxs(Section, { className: `rounded-xl border ${themed.border} p-5 ${themed.bgSecondary}`, children: [_jsx(Heading, { level: 3, className: "text-base mb-2", children: t("disclaimerTitle") }), _jsx(Caption, { className: "leading-relaxed", children: t("disclaimerText") })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "feesview-div-100", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.sm} text-center`, "data-section": "feesview-div-101", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.sm} py-10 md:py-12 lg:py-16 space-y-12`, "data-section": "feesview-div-102", children: [renderFeeTableSection(t, themed, FEE_ROWS), renderPayoutExampleSection(t, themed, OFFER_PAYOUT_ROWS), renderDisclaimerSection(t, themed)] })] }));
+}
+function renderFeeTableSection(t, themed, rows) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6", children: t("tableTitle") }), _jsx("div", { className: `overflow-x-auto rounded-xl border ${themed.border}`, "data-section": "feesview-div-103", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: themed.bgSecondary, children: _jsxs("tr", { children: [_jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colFeeType") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colRate") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold", children: t("colPaidBy") }), _jsx("th", { className: "py-3 px-4 text-left font-semibold hidden md:table-cell", children: t("colNote") })] }) }), _jsx("tbody", { className: "divide-y divide-neutral-100 dark:divide-neutral-800", children: rows.map((row) => (_jsxs("tr", { className: `${themed.bgPrimary} hover:bg-neutral-50 dark:hover:bg-neutral-800/50`, children: [_jsx("td", { className: "py-3 px-4 font-medium", children: row.category }), _jsx("td", { className: "py-3 px-4 font-semibold text-violet-700 dark:text-violet-400", children: row.rate }), _jsx("td", { className: "py-3 px-4", children: _jsx(Caption, { children: row.who }) }), _jsx("td", { className: "py-3 px-4 text-neutral-500 dark:text-neutral-400 hidden md:table-cell text-xs", children: row.note })] }, row.category))) })] }) }), _jsx(Caption, { className: "mt-3 block text-neutral-500", children: t("tableNote") })] }));
+}
+function renderPayoutExampleSection(t, themed, rows) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("payoutExampleTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6", children: t("payoutExampleSubtitle") }), _jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-5 max-w-sm`, "data-section": "feesview-div-104", children: [_jsx(Heading, { level: 3, className: "text-base mb-4", children: t("payoutExampleProduct") }), _jsx("div", { className: "space-y-2", "data-section": "feesview-div-105", children: rows.map((row, i) => (_jsxs("div", { className: `flex justify-between text-sm ${row.highlight ? "border-t border-neutral-200 dark:border-neutral-700 pt-2 mt-2 font-bold" : ""}`, "data-section": "feesview-div-106", children: [_jsx(Text, { className: row.highlight ? "font-bold" : "text-neutral-600 dark:text-neutral-400", children: row.label }), _jsx(Text, { className: row.highlight ? "font-bold text-green-700 dark:text-green-400" : "", children: row.example })] }, i))) })] })] }));
+}
+function renderDisclaimerSection(t, themed) {
+    return (_jsxs(Section, { className: `rounded-xl border ${themed.border} p-5 ${themed.bgSecondary}`, children: [_jsx(Heading, { level: 3, className: "text-base mb-2", children: t("disclaimerTitle") }), _jsx(Caption, { className: "leading-relaxed", children: t("disclaimerText") })] }));
 }

package/dist/features/about/components/HelpPageView.js

@@ -59,5 +59,14 @@ export async function HelpPageView({ heroBannerClass = DEFAULT_HERO_CLASS, } = {
             iconColor: "text-rose-600 dark:text-rose-400",
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "helppageview-div-107", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "helppageview-div-108", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "helppageview-div-109", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6 text-center", children: t("browseTopics") }), _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", "data-section": "helppageview-div-110", children: TOPICS.map(({ icon: Icon, title, desc, href, color, iconColor }) => (_jsxs(TextLink, { href: href, className: `group rounded-xl border p-5 transition-shadow hover:shadow-md ${color} no-underline`, children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "helppageview-div-111", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsxs("div", { className: `${flex.row} justify-between items-start`, "data-section": "helppageview-div-112", children: [_jsxs("div", { "data-section": "helppageview-div-113", children: [_jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: desc })] }), _jsx(ChevronRight, { className: "w-4 h-4 mt-1 flex-shrink-0 opacity-40 group-hover:opacity-80 transition-opacity" })] })] }, href))) })] }), _jsxs(Section, { className: `rounded-2xl p-6 border ${themed.border} ${themed.bgSecondary} flex flex-col sm:flex-row items-center gap-4`, children: [_jsxs("div", { className: "flex-1", "data-section": "helppageview-div-114", children: [_jsx(Heading, { level: 3, className: "mb-1 text-base", children: t("trackOrderTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("trackOrderText") })] }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.TRACK_ORDER), className: "flex-shrink-0", children: t("trackOrderCta") })] }), _jsxs(Section, { className: `rounded-2xl p-8 text-center border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(MessageCircle, { className: "w-10 h-10 mx-auto mb-3 text-primary/70" }), _jsx(Heading, { level: 2, className: "mb-3", children: t("contactTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("contactText") }), _jsxs(Stack, { gap: "sm", className: "flex-row flex-wrap justify-center gap-4", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), children: t("contactCta") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.FAQS), variant: "muted", children: t("faqCta") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "helppageview-div-107", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "helppageview-div-108", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "helppageview-div-109", children: [renderTopicsGrid(t, flex, TOPICS), renderTrackOrderSection(t, themed), renderContactCtaSection(t, themed)] })] }));
+}
+function renderTopicsGrid(t, flex, topics) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6 text-center", children: t("browseTopics") }), _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", "data-section": "helppageview-div-110", children: topics.map(({ icon: Icon, title, desc, href, color, iconColor }) => (_jsxs(TextLink, { href: href, className: `group rounded-xl border p-5 transition-shadow hover:shadow-md ${color} no-underline`, children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "helppageview-div-111", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsxs("div", { className: `${flex.row} justify-between items-start`, "data-section": "helppageview-div-112", children: [_jsxs("div", { "data-section": "helppageview-div-113", children: [_jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: desc })] }), _jsx(ChevronRight, { className: "w-4 h-4 mt-1 flex-shrink-0 opacity-40 group-hover:opacity-80 transition-opacity" })] })] }, href))) })] }));
+}
+function renderTrackOrderSection(t, themed) {
+    return (_jsxs(Section, { className: `rounded-2xl p-6 border ${themed.border} ${themed.bgSecondary} flex flex-col sm:flex-row items-center gap-4`, children: [_jsxs("div", { className: "flex-1", "data-section": "helppageview-div-114", children: [_jsx(Heading, { level: 3, className: "mb-1 text-base", children: t("trackOrderTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("trackOrderText") })] }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.TRACK_ORDER), className: "flex-shrink-0", children: t("trackOrderCta") })] }));
+}
+function renderContactCtaSection(t, themed) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(MessageCircle, { className: "w-10 h-10 mx-auto mb-3 text-primary/70" }), _jsx(Heading, { level: 2, className: "mb-3", children: t("contactTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("contactText") }), _jsxs(Stack, { gap: "sm", className: "flex-row flex-wrap justify-center gap-4", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), children: t("contactCta") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.FAQS), variant: "muted", children: t("faqCta") })] })] }));
 }

package/dist/features/about/components/HowAuctionsWorkView.js

@@ -83,5 +83,14 @@ export async function HowAuctionsWorkView({ heroBannerClass = DEFAULT_HERO_CLASS
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howauctionsworkview-div-115", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howauctionsworkview-div-116", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howauctionsworkview-div-117", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howauctionsworkview-div-118", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howauctionsworkview-div-119", children: icon }), _jsxs("div", { "data-section": "howauctionsworkview-div-120", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🔨 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howauctionsworkview-div-121", children: INFO_CARDS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howauctionsworkview-div-122", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howauctionsworkview-div-123", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howauctionsworkview-div-124", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.AUCTIONS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howauctionsworkview-div-115", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howauctionsworkview-div-116", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howauctionsworkview-div-117", children: [renderAuctionStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🔨 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderAuctionInfoCardsSection(flex, INFO_CARDS), renderAuctionCtaSection(t, themed, flex)] })] }));
+}
+function renderAuctionStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howauctionsworkview-div-118", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howauctionsworkview-div-119", children: icon }), _jsxs("div", { "data-section": "howauctionsworkview-div-120", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderAuctionInfoCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howauctionsworkview-div-121", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howauctionsworkview-div-122", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howauctionsworkview-div-123", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderAuctionCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howauctionsworkview-div-124", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.AUCTIONS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] }));
 }

package/dist/features/about/components/HowCheckoutWorksView.js

@@ -69,5 +69,14 @@ export async function HowCheckoutWorksView({ heroBannerClass = DEFAULT_HERO_CLAS
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howcheckoutworksview-div-125", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howcheckoutworksview-div-126", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howcheckoutworksview-div-127", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howcheckoutworksview-div-128", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howcheckoutworksview-div-129", children: icon }), _jsxs("div", { "data-section": "howcheckoutworksview-div-130", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🗺️ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3 text-center", children: t("paymentMethodsTitle") }), _jsx(Text, { variant: "secondary", className: "text-center mb-8 max-w-xl mx-auto", children: t("paymentMethodsSubtitle") }), _jsx("div", { className: "grid gap-5 md:grid-cols-3", "data-section": "howcheckoutworksview-div-131", children: PAYMENT_METHODS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howcheckoutworksview-div-132", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howcheckoutworksview-div-133", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) })] }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howcheckoutworksview-div-134", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howcheckoutworksview-div-125", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howcheckoutworksview-div-126", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howcheckoutworksview-div-127", children: [renderCheckoutStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🗺️ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderPaymentMethodsSection(t, flex, PAYMENT_METHODS), renderCheckoutCtaSection(t, themed, flex)] })] }));
+}
+function renderCheckoutStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howcheckoutworksview-div-128", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howcheckoutworksview-div-129", children: icon }), _jsxs("div", { "data-section": "howcheckoutworksview-div-130", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderPaymentMethodsSection(t, flex, methods) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3 text-center", children: t("paymentMethodsTitle") }), _jsx(Text, { variant: "secondary", className: "text-center mb-8 max-w-xl mx-auto", children: t("paymentMethodsSubtitle") }), _jsx("div", { className: "grid gap-5 md:grid-cols-3", "data-section": "howcheckoutworksview-div-131", children: methods.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howcheckoutworksview-div-132", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howcheckoutworksview-div-133", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) })] }));
+}
+function renderCheckoutCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howcheckoutworksview-div-134", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] }));
 }

package/dist/features/about/components/HowOffersWorkView.js

@@ -54,5 +54,14 @@ export async function HowOffersWorkView({ heroBannerClass = DEFAULT_HERO_CLASS,
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howoffersworkview-div-135", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howoffersworkview-div-136", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howoffersworkview-div-137", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howoffersworkview-div-138", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howoffersworkview-div-139", children: icon }), _jsxs("div", { "data-section": "howoffersworkview-div-140", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🤝 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsxs(Section, { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-6`, children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("rulesTitle") }), _jsx("ul", { className: "space-y-2", children: RULES.map((rule) => (_jsxs("li", { className: "flex items-start gap-2 text-sm", children: [_jsx("span", { className: "text-primary mt-0.5", children: "\u2022" }), _jsx(Text, { variant: "secondary", children: rule })] }, rule))) })] }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howoffersworkview-div-141", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howoffersworkview-div-135", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howoffersworkview-div-136", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howoffersworkview-div-137", children: [renderOffersStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🤝 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderOffersRulesSection(t, themed, RULES), renderOffersCtaSection(t, themed, flex)] })] }));
+}
+function renderOffersStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howoffersworkview-div-138", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howoffersworkview-div-139", children: icon }), _jsxs("div", { "data-section": "howoffersworkview-div-140", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderOffersRulesSection(t, themed, rules) {
+    return (_jsxs(Section, { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-6`, children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("rulesTitle") }), _jsx("ul", { className: "space-y-2", children: rules.map((rule) => (_jsxs("li", { className: "flex items-start gap-2 text-sm", children: [_jsx("span", { className: "text-primary mt-0.5", children: "\u2022" }), _jsx(Text, { variant: "secondary", children: rule })] }, rule))) })] }));
+}
+function renderOffersCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howoffersworkview-div-141", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] }));
 }

package/dist/features/about/components/HowOrdersWorkView.js

@@ -127,5 +127,14 @@ export async function HowOrdersWorkView({ heroBannerClass = DEFAULT_HERO_CLASS,
             desc: t("diagramStep6Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howordersworkview-div-142", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howordersworkview-div-143", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howordersworkview-div-144", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6", children: t("statusesTitle") }), _jsx("div", { className: "space-y-3", "data-section": "howordersworkview-div-145", children: ORDER_STATUSES.map(({ status, icon, badge, desc }) => (_jsxs("div", { className: `flex items-start gap-4 p-4 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howordersworkview-div-146", children: [_jsxs(Row, { align: "center", gap: "sm", className: "flex-shrink-0 pt-0.5", children: [_jsx(Span, { className: "text-xl", children: icon }), _jsx(Span, { className: `text-xs font-semibold px-2 py-0.5 rounded-full ${badge}`, children: status })] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: desc })] }, status))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `📦 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howordersworkview-div-147", children: INFO_CARDS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howordersworkview-div-148", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howordersworkview-div-149", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howordersworkview-div-150", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_CHECKOUT_WORKS), variant: "muted", children: t("ctaCheckout") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howordersworkview-div-142", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howordersworkview-div-143", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howordersworkview-div-144", children: [renderOrderStatusesSection(t, themed, ORDER_STATUSES), _jsx(Section, { children: _jsx(FlowDiagram, { title: `📦 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderOrderInfoCardsSection(flex, INFO_CARDS), renderOrdersCtaSection(t, themed, flex)] })] }));
+}
+function renderOrderStatusesSection(t, themed, statuses) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-6", children: t("statusesTitle") }), _jsx("div", { className: "space-y-3", "data-section": "howordersworkview-div-145", children: statuses.map(({ status, icon, badge, desc }) => (_jsxs("div", { className: `flex items-start gap-4 p-4 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howordersworkview-div-146", children: [_jsxs(Row, { align: "center", gap: "sm", className: "flex-shrink-0 pt-0.5", children: [_jsx(Span, { className: "text-xl", children: icon }), _jsx(Span, { className: `text-xs font-semibold px-2 py-0.5 rounded-full ${badge}`, children: status })] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: desc })] }, status))) })] }));
+}
+function renderOrderInfoCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howordersworkview-div-147", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howordersworkview-div-148", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howordersworkview-div-149", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderOrdersCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howordersworkview-div-150", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRODUCTS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_CHECKOUT_WORKS), variant: "muted", children: t("ctaCheckout") })] })] }));
 }

package/dist/features/about/components/HowPayoutsWorkView.js

@@ -83,5 +83,14 @@ export async function HowPayoutsWorkView({ heroBannerClass = DEFAULT_HERO_CLASS,
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howpayoutsworkview-div-151", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howpayoutsworkview-div-152", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howpayoutsworkview-div-153", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howpayoutsworkview-div-154", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howpayoutsworkview-div-155", children: icon }), _jsxs("div", { "data-section": "howpayoutsworkview-div-156", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `💸 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howpayoutsworkview-div-157", children: INFO_CARDS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howpayoutsworkview-div-158", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howpayoutsworkview-div-159", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howpayoutsworkview-div-160", children: [_jsx(TextLink, { href: String(ROUTES.STORE.PAYOUT_SETTINGS), children: t("ctaPayoutSettings") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.FEES), variant: "muted", children: t("ctaFees") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howpayoutsworkview-div-151", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howpayoutsworkview-div-152", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howpayoutsworkview-div-153", children: [renderPayoutsStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `💸 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderPayoutsInfoCardsSection(flex, INFO_CARDS), renderPayoutsCtaSection(t, themed, flex)] })] }));
+}
+function renderPayoutsStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howpayoutsworkview-div-154", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howpayoutsworkview-div-155", children: icon }), _jsxs("div", { "data-section": "howpayoutsworkview-div-156", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderPayoutsInfoCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howpayoutsworkview-div-157", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howpayoutsworkview-div-158", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howpayoutsworkview-div-159", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderPayoutsCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howpayoutsworkview-div-160", children: [_jsx(TextLink, { href: String(ROUTES.STORE.PAYOUT_SETTINGS), children: t("ctaPayoutSettings") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.FEES), variant: "muted", children: t("ctaFees") })] })] }));
 }

package/dist/features/about/components/HowPreOrdersWorkView.js

@@ -83,5 +83,14 @@ export async function HowPreOrdersWorkView({ heroBannerClass = DEFAULT_HERO_CLAS
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howpreordersworkview-div-161", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howpreordersworkview-div-162", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howpreordersworkview-div-163", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howpreordersworkview-div-164", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howpreordersworkview-div-165", children: icon }), _jsxs("div", { "data-section": "howpreordersworkview-div-166", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `📋 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howpreordersworkview-div-167", children: INFO_CARDS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howpreordersworkview-div-168", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howpreordersworkview-div-169", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howpreordersworkview-div-170", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRE_ORDERS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howpreordersworkview-div-161", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howpreordersworkview-div-162", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howpreordersworkview-div-163", children: [renderPreOrdersStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `📋 ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderPreOrdersInfoCardsSection(flex, INFO_CARDS), renderPreOrdersCtaSection(t, themed, flex)] })] }));
+}
+function renderPreOrdersStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howpreordersworkview-div-164", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howpreordersworkview-div-165", children: icon }), _jsxs("div", { "data-section": "howpreordersworkview-div-166", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderPreOrdersInfoCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "howpreordersworkview-div-167", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howpreordersworkview-div-168", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howpreordersworkview-div-169", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderPreOrdersCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howpreordersworkview-div-170", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRE_ORDERS), children: t("ctaBrowse") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaOrders") })] })] }));
 }

package/dist/features/about/components/HowReviewsWorkView.js

@@ -68,5 +68,14 @@ export async function HowReviewsWorkView({ heroBannerClass = DEFAULT_HERO_CLASS,
             desc: t("diagramStep4Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howreviewsworkview-div-171", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howreviewsworkview-div-172", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howreviewsworkview-div-173", children: [_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: STEPS.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howreviewsworkview-div-174", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howreviewsworkview-div-175", children: icon }), _jsxs("div", { "data-section": "howreviewsworkview-div-176", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `⭐ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-3", "data-section": "howreviewsworkview-div-177", children: INFO_CARDS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howreviewsworkview-div-178", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howreviewsworkview-div-179", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howreviewsworkview-div-180", children: [_jsx(TextLink, { href: String(ROUTES.USER.ORDERS), children: t("ctaOrders") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaHowOrders") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "howreviewsworkview-div-171", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "howreviewsworkview-div-172", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "howreviewsworkview-div-173", children: [renderReviewsStepsSection(t, themed, flex, STEPS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `⭐ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), renderReviewsInfoCardsSection(flex, INFO_CARDS), renderReviewsCtaSection(t, themed, flex)] })] }));
+}
+function renderReviewsStepsSection(t, themed, flex, steps) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-8 text-center", children: t("stepsTitle") }), _jsx(Stack, { gap: "md", className: "gap-5", children: steps.map(({ number, icon, title, text }) => (_jsxs("div", { className: `flex items-start gap-4 p-5 rounded-xl border ${themed.border} ${themed.bgPrimary}`, "data-section": "howreviewsworkview-div-174", children: [_jsx("div", { className: `flex-shrink-0 w-10 h-10 rounded-full bg-primary/10 dark:bg-primary/15 ${flex.center} text-xl`, "data-section": "howreviewsworkview-div-175", children: icon }), _jsxs("div", { "data-section": "howreviewsworkview-div-176", children: [_jsxs(Text, { className: "font-semibold mb-0.5", children: [number, ". ", title] }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] })] }, number))) })] }));
+}
+function renderReviewsInfoCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-3", "data-section": "howreviewsworkview-div-177", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "howreviewsworkview-div-178", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "howreviewsworkview-div-179", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderReviewsCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "howreviewsworkview-div-180", children: [_jsx(TextLink, { href: String(ROUTES.USER.ORDERS), children: t("ctaOrders") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.HOW_ORDERS_WORK), variant: "muted", children: t("ctaHowOrders") })] })] }));
 }

package/dist/features/about/components/PublicProfileView.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import Link from "next/link";
 import { getPublicUserProfile, getProfileStoreProducts, getSellerReviews } from "../../auth/actions/profile-actions";
 import { storeRepository } from "../../stores/repository/store.repository";
@@ -78,17 +78,47 @@ export async function PublicProfileView({ userId, heroBannerClass = DEFAULT_HERO
     const storeSlug = profile?.storeSlug;
     const storeName = store?.storeName ?? pub?.storeName ?? displayName;
     const storeDescription = store?.storeDescription ?? pub?.storeDescription;
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "publicprofileview-div-186", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-10 md:py-14`, children: _jsx("div", { className: `${page.container.md}`, children: _jsxs("div", { className: "flex flex-col sm:flex-row items-center sm:items-end gap-5", children: [_jsx("div", { className: `w-20 h-20 rounded-full bg-white/20 ${flex.center} flex-shrink-0 overflow-hidden`, children: photoURL ? (_jsx("img", { src: photoURL, alt: displayName, className: "w-full h-full object-cover" })) : (_jsx(User, { className: "w-10 h-10 text-white/60" })) }), _jsxs("div", { className: "text-center sm:text-left", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap justify-center sm:justify-start", children: [_jsx(Heading, { level: 1, variant: "none", className: "text-white mb-0", children: displayName }), isSeller && (_jsx("span", { className: "rounded-full bg-white/20 px-2.5 py-0.5 text-xs font-semibold text-white/90", children: t("roleSeller") }))] }), _jsx(Text, { variant: "none", className: "text-white/60 text-sm mt-1", children: memberSince })] }), isSeller && storeSlug && (_jsx("div", { className: "sm:ml-auto", children: _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "inline-flex items-center gap-1.5 rounded-full border border-white/30 bg-white/10 hover:bg-white/20 px-4 py-2 text-sm font-medium text-white transition-colors", children: [_jsx(ExternalLink, { className: "w-3.5 h-3.5" }), t("visitStore")] }) }))] }) }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 space-y-10`, children: [_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-4 gap-4", children: [
-                            { icon: ShoppingBag, label: t("statListings"), value: String(listingCount) },
-                            { icon: Star, label: t("statReviews"), value: String(reviewCount) },
-                            ...(isSeller
-                                ? [
-                                    { icon: Package, label: t("statSold"), value: String(itemsSold) },
-                                    { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
-                                ]
-                                : [
-                                    { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
-                                    { icon: Package, label: t("statOrders"), value: String(totalOrders) },
-                                ]),
-                        ].map(({ icon: Icon, label, value }) => (_jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-4 text-center`, children: [_jsx("div", { className: `${flex.center} mb-1`, children: _jsx(Icon, { className: "w-4 h-4 text-neutral-400" }) }), _jsx(Text, { className: "text-lg font-bold", children: value }), _jsx(Text, { variant: "secondary", className: "text-xs", children: label })] }, label))) }), (pub?.bio || pub?.location || pub?.website) && (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgPrimary} p-6 space-y-3`, children: [pub.bio && (_jsx(Text, { className: "text-sm leading-relaxed text-neutral-700 dark:text-zinc-300", children: pub.bio })), _jsxs("div", { className: "flex flex-wrap gap-4", children: [pub.location && (_jsxs("span", { className: "flex items-center gap-1.5 text-sm text-neutral-500 dark:text-zinc-400", children: [_jsx(MapPin, { className: "w-4 h-4" }), pub.location] })), pub.website && (_jsxs("a", { href: pub.website, target: "_blank", rel: "noopener noreferrer", className: "flex items-center gap-1.5 text-sm text-primary hover:underline", children: [_jsx(Globe, { className: "w-4 h-4" }), pub.website.replace(/^https?:\/\//, "")] }))] })] }) })), isSeller && storeSlug && storeDescription && (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-6`, children: [_jsx(Heading, { level: 3, className: "mb-2", children: storeName }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: storeDescription }), _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline", children: [t("visitStore"), " \u2192"] })] }) })), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("listingsTitle") }), products.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(ShoppingBag, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noListings") })] })) : (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: products.slice(0, 8).map((p) => (_jsx(ProductCard, { product: toProductItem(p), href: getProductHref(p) }, p.id))) })), products.length > 8 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_PRODUCTS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllListings", { count: products.length }) }) }))] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("reviewsTitle") }), reviews.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(Star, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noReviews") })] })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: reviews.slice(0, 6).map((review) => (_jsx(ReviewCard, { review: review }, review.id))) })), reviews.length > 6 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_REVIEWS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllReviews", { count: reviews.length }) }) }))] }), _jsx("div", { className: "flex justify-center pt-2", children: _jsxs(Link, { href: String(ROUTES.HOME), className: "text-sm text-neutral-400 dark:text-zinc-500 hover:text-neutral-600 dark:hover:text-zinc-300", children: ["\u2190 ", t("backHome")] }) })] })] }));
+    const profileHeroCtx = { displayName, photoURL, memberSince, isSeller, storeSlug, flex, page, heroBannerClass };
+    const statItems = buildProfileStatItems(t, { listingCount, reviewCount, itemsSold, auctionsWon, totalOrders, isSeller });
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "publicprofileview-div-186", children: [renderProfileHero(t, profileHeroCtx), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 space-y-10`, children: [renderProfileStatsRow(themed, flex, statItems), renderProfileBioSection(themed, pub), renderStoreDescriptionSection(themed, isSeller, storeSlug ?? null, storeDescription ?? null, storeName, t), renderProfileListingsSection(t, themed, products, storeSlug ?? null), renderProfileReviewsSection(t, themed, reviews, storeSlug ?? null), _jsx("div", { className: "flex justify-center pt-2", children: _jsxs(Link, { href: String(ROUTES.HOME), className: "text-sm text-neutral-400 dark:text-zinc-500 hover:text-neutral-600 dark:hover:text-zinc-300", children: ["\u2190 ", t("backHome")] }) })] })] }));
+}
+function buildProfileStatItems(t, ctx) {
+    const { listingCount, reviewCount, itemsSold, auctionsWon, totalOrders, isSeller } = ctx;
+    return [
+        { icon: ShoppingBag, label: t("statListings"), value: String(listingCount) },
+        { icon: Star, label: t("statReviews"), value: String(reviewCount) },
+        ...(isSeller
+            ? [
+                { icon: Package, label: t("statSold"), value: String(itemsSold) },
+                { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
+            ]
+            : [
+                { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
+                { icon: Package, label: t("statOrders"), value: String(totalOrders) },
+            ]),
+    ];
+}
+function renderProfileHero(t, ctx) {
+    const { displayName, photoURL, memberSince, isSeller, storeSlug, flex, page, heroBannerClass } = ctx;
+    return (_jsx(Section, { className: `${heroBannerClass} text-white py-10 md:py-14`, children: _jsx("div", { className: `${page.container.md}`, children: _jsxs("div", { className: "flex flex-col sm:flex-row items-center sm:items-end gap-5", children: [_jsx("div", { className: `w-20 h-20 rounded-full bg-white/20 ${flex.center} flex-shrink-0 overflow-hidden`, children: photoURL ? _jsx("img", { src: photoURL, alt: displayName, className: "w-full h-full object-cover" }) : _jsx(User, { className: "w-10 h-10 text-white/60" }) }), _jsxs("div", { className: "text-center sm:text-left", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap justify-center sm:justify-start", children: [_jsx(Heading, { level: 1, variant: "none", className: "text-white mb-0", children: displayName }), isSeller && _jsx("span", { className: "rounded-full bg-white/20 px-2.5 py-0.5 text-xs font-semibold text-white/90", children: t("roleSeller") })] }), _jsx(Text, { variant: "none", className: "text-white/60 text-sm mt-1", children: memberSince })] }), isSeller && storeSlug && (_jsx("div", { className: "sm:ml-auto", children: _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "inline-flex items-center gap-1.5 rounded-full border border-white/30 bg-white/10 hover:bg-white/20 px-4 py-2 text-sm font-medium text-white transition-colors", children: [_jsx(ExternalLink, { className: "w-3.5 h-3.5" }), t("visitStore")] }) }))] }) }) }));
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function renderProfileStatsRow(themed, flex, statItems) {
+    return (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-4 gap-4", children: statItems.map(({ icon: Icon, label, value }) => (_jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-4 text-center`, children: [_jsx("div", { className: `${flex.center} mb-1`, children: _jsx(Icon, { className: "w-4 h-4 text-neutral-400" }) }), _jsx(Text, { className: "text-lg font-bold", children: value }), _jsx(Text, { variant: "secondary", className: "text-xs", children: label })] }, label))) }));
+}
+function renderProfileBioSection(themed, pub) {
+    if (!pub?.bio && !pub?.location && !pub?.website)
+        return null;
+    return (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgPrimary} p-6 space-y-3`, children: [pub.bio && _jsx(Text, { className: "text-sm leading-relaxed text-neutral-700 dark:text-zinc-300", children: pub.bio }), _jsxs("div", { className: "flex flex-wrap gap-4", children: [pub.location && _jsxs("span", { className: "flex items-center gap-1.5 text-sm text-neutral-500 dark:text-zinc-400", children: [_jsx(MapPin, { className: "w-4 h-4" }), pub.location] }), pub.website && _jsxs("a", { href: pub.website, target: "_blank", rel: "noopener noreferrer", className: "flex items-center gap-1.5 text-sm text-primary hover:underline", children: [_jsx(Globe, { className: "w-4 h-4" }), pub.website.replace(/^https?:\/\//, "")] })] })] }) }));
+}
+function renderStoreDescriptionSection(themed, isSeller, storeSlug, storeDescription, storeName, t) {
+    if (!isSeller || !storeSlug || !storeDescription)
+        return null;
+    return (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-6`, children: [_jsx(Heading, { level: 3, className: "mb-2", children: storeName }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: storeDescription }), _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline", children: [t("visitStore"), " \u2192"] })] }) }));
+}
+function renderProfileListingsSection(t, themed, products, storeSlug) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("listingsTitle") }), products.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(ShoppingBag, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noListings") })] })) : (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: products.slice(0, 8).map((p) => _jsx(ProductCard, { product: toProductItem(p), href: getProductHref(p) }, p.id)) })), products.length > 8 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_PRODUCTS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllListings", { count: products.length }) }) }))] }));
+}
+function renderProfileReviewsSection(t, themed, reviews, storeSlug) {
+    return (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("reviewsTitle") }), reviews.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(Star, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noReviews") })] })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: reviews.slice(0, 6).map((review) => _jsx(ReviewCard, { review: review }, review.id)) })), reviews.length > 6 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_REVIEWS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllReviews", { count: reviews.length }) }) }))] }));
 }

package/dist/features/about/components/SecurityPrivacyView.js

@@ -118,5 +118,11 @@ export async function SecurityPrivacyView({ heroBannerClass = DEFAULT_HERO_CLASS
             desc: t("diagramStep5Desc"),
         },
     ];
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "securityprivacyview-div-198", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "securityprivacyview-div-199", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "securityprivacyview-div-200", children: [_jsxs(Section, { className: "text-center", children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("overviewTitle") }), _jsx(Text, { variant: "secondary", className: "max-w-2xl mx-auto", children: t("overviewText") })] }), _jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "securityprivacyview-div-201", children: SECTIONS.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "securityprivacyview-div-202", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "securityprivacyview-div-203", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🛡️ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Text, { variant: "secondary", className: "text-center text-sm", children: t("lastUpdated") }), _jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "securityprivacyview-div-204", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRIVACY), children: t("ctaPrivacy") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), variant: "muted", children: t("ctaContact") })] })] })] })] }));
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "securityprivacyview-div-198", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.md} text-center`, "data-section": "securityprivacyview-div-199", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-4 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 max-w-2xl mx-auto", children: t("subtitle") })] }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 lg:py-16 space-y-14`, "data-section": "securityprivacyview-div-200", children: [_jsxs(Section, { className: "text-center", children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("overviewTitle") }), _jsx(Text, { variant: "secondary", className: "max-w-2xl mx-auto", children: t("overviewText") })] }), renderSecurityCardsSection(flex, SECTIONS), _jsx(Section, { children: _jsx(FlowDiagram, { title: `🛡️ ${t("diagramTitle")}`, titleClass: "text-primary", connectorClass: "bg-primary/20 dark:bg-primary/30", steps: DIAGRAM_STEPS, centered: true }) }), _jsx(Text, { variant: "secondary", className: "text-center text-sm", children: t("lastUpdated") }), renderSecurityCtaSection(t, themed, flex)] })] }));
+}
+function renderSecurityCardsSection(flex, cards) {
+    return (_jsx(Section, { children: _jsx("div", { className: "grid gap-5 md:grid-cols-2", "data-section": "securityprivacyview-div-201", children: cards.map(({ icon: Icon, title, text, color, iconColor }) => (_jsxs("div", { className: `rounded-xl border p-5 ${color}`, "data-section": "securityprivacyview-div-202", children: [_jsx("div", { className: `w-10 h-10 rounded-lg bg-white/60 dark:bg-white/10 ${flex.center} mb-3`, "data-section": "securityprivacyview-div-203", children: _jsx(Icon, { className: `w-5 h-5 ${iconColor}` }) }), _jsx(Text, { className: "font-semibold mb-1", children: title }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: text })] }, title))) }) }));
+}
+function renderSecurityCtaSection(t, themed, flex) {
+    return (_jsxs(Section, { className: `rounded-2xl p-8 text-center ${themed.bgSecondary} border ${themed.border}`, children: [_jsx(Heading, { level: 2, className: "mb-3", children: t("ctaTitle") }), _jsx(Text, { variant: "secondary", className: "mb-6 max-w-lg mx-auto", children: t("ctaText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "securityprivacyview-div-204", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.PRIVACY), children: t("ctaPrivacy") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), variant: "muted", children: t("ctaContact") })] })] }));
 }

package/dist/features/account/components/AddressesIndexListing.js

@@ -4,7 +4,7 @@ import { useState, useCallback, useMemo } from "react";
 import { X } from "lucide-react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useAddresses } from "../hooks/useAddresses";
-import { ListingToolbar } from "../../../ui";
+import { ListingToolbar, Text } from "../../../ui";
 import { AddressBook } from "./AddressBook";
 import { AddressFilters } from "./AddressFilters";
 import { TABLE_KEYS, VIEW_MODE } from "../../../constants/table-keys";
@@ -75,5 +75,5 @@ export function AddressesIndexListing({ onAdd, onEdit, onDelete, }) {
         },
     });
     return (_jsxs("div", { className: "space-y-4", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search by address, postcode or label...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, view: view, onViewChange: (v) => { if (v === "table")
-                    return; setView(v); }, onResetAll: resetAll, hasActiveState: hasActiveState }), _jsx("div", { className: "px-3 sm:px-4", children: isLoading ? (_jsx("div", { className: "grid sm:grid-cols-2 gap-4", children: Array.from({ length: 4 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-200 dark:border-slate-700 animate-pulse p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" }), _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" })] }, i))) })) : addresses.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-zinc-500 dark:text-zinc-400", children: table.get(TABLE_KEYS.QUERY) ? `No addresses matching "${table.get(TABLE_KEYS.QUERY)}"` : "No saved addresses." })) : (_jsx(AddressBook, { addresses: addresses, onEdit: onEdit, onDelete: onDelete, onAdd: onAdd })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _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: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "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(AddressFilters, { table: pendingTable }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
+                    return; setView(v); }, onResetAll: resetAll, hasActiveState: hasActiveState }), _jsx("div", { className: "px-3 sm:px-4", children: isLoading ? (_jsx("div", { className: "grid sm:grid-cols-2 gap-4", children: Array.from({ length: 4 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-200 dark:border-slate-700 animate-pulse p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" }), _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" })] }, i))) })) : addresses.length === 0 ? (_jsx(Text, { className: "py-8 text-center text-sm text-zinc-500 dark:text-zinc-400", children: table.get(TABLE_KEYS.QUERY) ? `No addresses matching "${table.get(TABLE_KEYS.QUERY)}"` : "No saved addresses." })) : (_jsx(AddressBook, { addresses: addresses, onEdit: onEdit, onDelete: onDelete, onAdd: onAdd })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _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: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "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(AddressFilters, { table: pendingTable }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
 }