@mohasinac/appkit 4.32.6 → 4.33.0

package/dist/features/admin/components/sections/adminSectionsTypes.js

@@ -47,6 +47,7 @@ const SECTION_TYPE_PRESENCE = {
 export const SECTION_TYPE_OPTIONS = Object.keys(SECTION_TYPE_PRESENCE);
 export const DEFAULT_PRODUCTS_BUILDER = {
     title: "Featured Products",
+    viewMoreLabel: "",
     subtitle: "",
     maxItems: 18,
     status: "published",
@@ -64,6 +65,7 @@ export const DEFAULT_PRODUCTS_BUILDER = {
 };
 export const DEFAULT_AUCTIONS_BUILDER = {
     title: "Live Auctions",
+    viewMoreLabel: "",
     subtitle: "",
     maxItems: 18,
     status: "active",
@@ -96,6 +98,7 @@ export const DEFAULT_STATS_BUILDER = {
 };
 export const DEFAULT_PRE_ORDERS_BUILDER = {
     title: "Reserve Before It Ships",
+    viewMoreLabel: "",
     subtitle: "",
     maxItems: 18,
     status: "active",
@@ -111,6 +114,7 @@ export const DEFAULT_PRE_ORDERS_BUILDER = {
 };
 export const DEFAULT_STORES_BUILDER = {
     title: "Featured Stores",
+    viewMoreLabel: "",
     subtitle: "",
     maxItems: 8,
     status: "active",
@@ -127,6 +131,7 @@ export const DEFAULT_STORES_BUILDER = {
 };
 export const DEFAULT_EVENTS_BUILDER = {
     title: "Events & Offers",
+    viewMoreLabel: "",
     subtitle: "",
     maxItems: 6,
     status: "active",
@@ -171,6 +176,7 @@ export const DEFAULT_TRUST_INDICATORS_BUILDER = {
 };
 export const DEFAULT_CATEGORIES_BUILDER = {
     title: "Shop by Category",
+    viewMoreLabel: "",
     maxCategories: 8,
     autoScroll: false,
     scrollInterval: 5000,
@@ -178,6 +184,7 @@ export const DEFAULT_CATEGORIES_BUILDER = {
 };
 export const DEFAULT_BRANDS_BUILDER = {
     title: "Top Brands",
+    viewMoreLabel: "",
     subtitle: "",
     maxBrands: 13,
     autoScroll: true,
@@ -203,13 +210,12 @@ export const DEFAULT_FEATURES_BUILDER = {
 };
 export const DEFAULT_REVIEWS_BUILDER = {
     title: "What Collectors Say",
+    viewMoreLabel: "",
     maxReviews: 10,
     itemsPerView: 3,
     autoScroll: true,
     scrollInterval: 5000,
     loop: true,
-    source: "platform",
-    placeId: "",
 };
 export const DEFAULT_WHATSAPP_BUILDER = {
     title: "Join Our Collector Community",
@@ -222,6 +228,7 @@ export const DEFAULT_WHATSAPP_BUILDER = {
 };
 export const DEFAULT_FAQ_BUILDER = {
     title: "Frequently Asked Questions",
+    viewMoreLabel: "",
     subtitle: "",
     showOnHomepage: true,
     displayCount: 5,
@@ -231,6 +238,7 @@ export const DEFAULT_FAQ_BUILDER = {
 };
 export const DEFAULT_BLOG_BUILDER = {
     title: "From the Blog",
+    viewMoreLabel: "",
     maxArticles: 3,
     showReadTime: true,
     showAuthor: true,
@@ -239,8 +247,6 @@ export const DEFAULT_BLOG_BUILDER = {
 export const DEFAULT_NEWSLETTER_BUILDER = {
     title: "Stay in the Loop",
     description: "Get the latest drops, auction alerts, and collector news.",
-    placeholder: "Enter your email",
-    buttonText: "Subscribe",
     privacyText: "We respect your privacy. Unsubscribe anytime.",
     privacyLink: String(ROUTES.PUBLIC.PRIVACY),
 };
@@ -273,11 +279,9 @@ export const DEFAULT_GOOGLE_REVIEWS_BUILDER = {
 };
 export const DEFAULT_FEATURED_BUNDLES_BUILDER = {
     title: "Curated Bundles",
+    viewMoreLabel: "",
     subtitle: "Everything you need in one deal",
     maxItems: 8,
-    storeId: "",
-    categorySlug: "",
-    sortBy: "savings-desc",
     showSavingsBadge: true,
 };
 export const DEFAULT_PRIZE_DRAWS_BUILDER = {

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

@@ -62,6 +62,61 @@ function renderAuctionStoreReviews(storeSlug) {
         return null;
     return (_jsxs(Section, { className: "mt-10", children: [_jsx(Heading, { level: 2, className: "mb-2", color: "primary", size: "xl", weight: "semibold", children: "Store Reviews" }), _jsx(ReviewsListingPanel, { source: { kind: "store", storeSlug }, stateMode: "local", context: "store", emptyLabel: "This store has no reviews yet." })] }));
 }
+/**
+ * Related auction docs → card data, at module scope rather than inline in the
+ * view.
+ *
+ * This is a pure doc→card mapper with no component state, and it is the exact
+ * spot Root Cause #48 keeps recurring: a card carries nine correct fields and
+ * routes or renders wrong because of the tenth. Naming it makes the field list
+ * reviewable on its own instead of buried 400 lines into a render prop.
+ */
+function toRelatedAuctionCards(relatedDocs, 
+// The current auction's own id, so it is excluded from its own related list.
+// Typed as the document id it is compared against, not `unknown` — a bare
+// `unknown` here silently permits comparing against anything.
+currentId, now) {
+    return relatedDocs
+        .filter((r) => {
+        if (r.id === currentId || r.listingType !== "auction")
+            return false;
+        const s = r.status;
+        if (s && ["archived", "in_review", "draft"].includes(s))
+            return false;
+        if (r.isSold === true)
+            return false;
+        const end = r.auctionEndDate;
+        if (!end)
+            return true;
+        const endDate = typeof end.toDate === "function"
+            ? end.toDate()
+            : end instanceof Date ? end : new Date(String(end));
+        return endDate > now;
+    })
+        .slice(0, 4)
+        .map((r) => ({
+        id: String(r.id ?? ""),
+        title: String(r.title ?? r.name ?? "Auction Item"),
+        price: typeof r.price === "number" ? r.price : 0,
+        currency: typeof r.currency === "string" ? r.currency : undefined,
+        mainImage: Array.isArray(r.images)
+            ? r.images[0]
+            : typeof r.mainImage === "string"
+                ? r.mainImage
+                : undefined,
+        listingType: "auction",
+        auctionEndDate: r.auctionEndDate,
+        startingBid: typeof r.startingBid === "number" ? r.startingBid : undefined,
+        currentBid: typeof r.currentBid === "number" ? r.currentBid : undefined,
+        bidCount: typeof r.bidCount === "number" ? r.bidCount : undefined,
+        slug: typeof r.slug === "string" ? r.slug : undefined,
+        // The card renders "by <seller>"; dropping these is how a related-auction
+        // card ends up the only one on the page with no seller on it, from data
+        // that was on the doc all along.
+        storeId: typeof r.storeId === "string" ? r.storeId : undefined,
+        storeName: typeof r.storeName === "string" ? r.storeName : undefined,
+    }));
+}
 export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, onBuyNow, productFeatures }) {
     // The auction IS this page's subject. A read failure must surface rather than
     // become the same `undefined` a genuinely missing slug produces — the
@@ -173,42 +228,7 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, on
                                 return null;
                             return (_jsx(CollapsibleBidHistory, { productId: String(product.id), initialData: bidsResult, currency: currency }));
                         }, renderRelated: () => {
-                            const now = new Date();
-                            const related = relatedDocs
-                                .filter((r) => {
-                                if (r.id === product.id || r.listingType !== "auction")
-                                    return false;
-                                const s = r.status;
-                                if (s && ["archived", "in_review", "draft"].includes(s))
-                                    return false;
-                                if (r.isSold === true)
-                                    return false;
-                                const end = r.auctionEndDate;
-                                if (!end)
-                                    return true;
-                                const endDate = typeof end.toDate === "function"
-                                    ? end.toDate()
-                                    : end instanceof Date ? end : new Date(String(end));
-                                return endDate > now;
-                            })
-                                .slice(0, 4)
-                                .map((r) => ({
-                                id: String(r.id ?? ""),
-                                title: String(r.title ?? r.name ?? "Auction Item"),
-                                price: typeof r.price === "number" ? r.price : 0,
-                                currency: typeof r.currency === "string" ? r.currency : undefined,
-                                mainImage: Array.isArray(r.images)
-                                    ? r.images[0]
-                                    : typeof r.mainImage === "string"
-                                        ? r.mainImage
-                                        : undefined,
-                                listingType: "auction",
-                                auctionEndDate: r.auctionEndDate,
-                                startingBid: typeof r.startingBid === "number" ? r.startingBid : undefined,
-                                currentBid: typeof r.currentBid === "number" ? r.currentBid : undefined,
-                                bidCount: typeof r.bidCount === "number" ? r.bidCount : undefined,
-                                slug: typeof r.slug === "string" ? r.slug : undefined,
-                            }));
+                            const related = toRelatedAuctionCards(relatedDocs, product.id, new Date());
                             return (_jsxs(Stack, { gap: "xl", children: [related.length > 0 && (_jsx(RelatedProducts, { labels: { title: "Similar Auctions" }, renderGrid: () => (_jsx(MarketplaceAuctionGrid, { auctions: related })) })), _jsx(GroupedListingsCarousel, { groups: groups }), _jsx(RelatedItemsSection, { relatedItems: relatedItems, relatedByBrand: relatedByBrand, relatedByTags: relatedByTags, relatedByStore: relatedByStore, categoryLabel: categoryName || category || undefined, brandLabel: brand || undefined, storeLabel: storeName || undefined })] }));
                         } }), renderAuctionStoreReviews(storeId), onPlaceBid && (_jsx(AuctionBottomActions, { productId: String(product.id), currentBid: currentBid, startingBid: startingBid, tiers: bidIncrementTiers, minBidIncrementOverride: minBidIncrementOverride, currency: currency, isEnded: isEnded, auctionEndDate: endDate, buyNowPrice: buyNowPrice, bidCount: bidCount, tags: tags, onPlaceBid: onPlaceBid, onBuyNow: onBuyNow }))] })] }));
 }

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

@@ -29,6 +29,15 @@ export interface MarketplaceAuctionCardData {
      * (Root Cause #48).
      */
     isSold?: boolean;
+    /**
+     * The seller. Absent from this hand-rolled type entirely until now, so the
+     * auction card could not show a seller even where every other card did —
+     * the same dropped-field shape the `isSold` note directly above warns about,
+     * one field over. Every doc→card mapper must copy BOTH: `storeId` says the
+     * listing has a seller at all, `storeName` says who.
+     */
+    storeId?: string;
+    storeName?: string;
     /** Display name of the auction winner — shown masked when the auction has ended */
     winnerDisplayName?: string;
 }

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

@@ -14,6 +14,7 @@ import { formatCurrency } from "../../../utils";
 import { getDefaultCurrency } from "../../../core/baseline-resolver";
 import { BaseListingCard, Button, Caption, Div, Row, Span, Stack, Text, TextLink } from "../../../ui";
 import { isBuyNowAvailable } from "../../../_internal/shared/features/auctions/config";
+import { CardStoreLine } from "../../products/components/CardStoreLine";
 const CLS_STAR_ICON = "h-5 w-5 fill-warning text-warning";
 const CLS_LIVE_BADGE = "rounded-full bg-error-solid px-[var(--appkit-space-2)] py-[var(--appkit-space-0-5)] text-error-on-solid";
 const CLS_ENDING_BADGE = "rounded-full bg-warning-solid px-[var(--appkit-space-2)] py-[var(--appkit-space-0-5)] text-warning-on-solid";
@@ -24,11 +25,11 @@ function renderAuctionCardHero(props) {
 }
 function renderAuctionCardInfoList(props) {
     const { product, auctionHref, displayBid, bidCount, isEnded, remaining, inWishlist, wishlistLoading, wishlistActions, countdownClass, mergedLabels, handleWishlist, handleNavigate } = props;
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: `flex-1 leading-snug transition-colors hover:text-primary`, color: "primary", truncate: 2, size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), _jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", className: `items-[center] py-[0.125rem] text-[11px] ${countdownClass}`, padding: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-2.5 w-2.5" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), bidCount > 0 && _jsx(Caption, { className: "text-[11px]", children: mergedLabels.totalBids(bidCount) })] }), !isEnded && (_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", className: "self-start px-[0.625rem] mt-0.5", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }))] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Row, { className: "min-w-0", align: "start", justify: "between", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: `flex-1 leading-snug transition-colors hover:text-primary`, color: "primary", truncate: 2, size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { className: "text-primary", size: "sm", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), _jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", className: `items-[center] py-[0.125rem] text-[11px] ${countdownClass}`, padding: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-2.5 w-2.5" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), bidCount > 0 && _jsx(Caption, { className: "text-[11px]", children: mergedLabels.totalBids(bidCount) })] }), !isEnded && (_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", className: "self-start px-[0.625rem] mt-0.5", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }))] }));
 }
 function renderAuctionCardInfoGrid(props) {
     const { product, auctionHref, displayBid, bidCount, hasCurrentBid, isEnded, remaining, resolvedBuyoutPrice, inWishlist, wishlistLoading, wishlistActions, countdownClass, mergedLabels, handleWishlist, handleNavigate } = props;
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, { align: "start", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: "min-w-0 flex-1 leading-snug transition-colors hover:text-primary", color: "primary", size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsxs(Div, { children: [_jsx(Caption, { children: isEnded && hasCurrentBid ? mergedLabels.winningBid : hasCurrentBid ? mergedLabels.currentBid : mergedLabels.startingBid }), _jsx(Text, { className: "leading-none text-primary", size: "base", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), isEnded && product.winnerDisplayName && (_jsxs(Caption, { className: "mt-0.5", color: "muted", children: [mergedLabels.wonBy, ": ", maskDisplayName(product.winnerDisplayName)] }))] }), _jsxs(Row, { wrap: true, justify: "between", gap: "sm", className: "gap-x-2 gap-y-1", children: [_jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", textSize: "xs", className: `items-[center] ${countdownClass}`, paddingY: "y-2xs", paddingX: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-3 w-3" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), _jsx(Caption, { children: mergedLabels.totalBids(bidCount) })] }), _jsx(Row, { wrap: true, gap: "xs", className: "mt-auto", children: isEnded ? (_jsx(Button, { gap: "xs", type: "button", variant: "ghost", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1 cursor-not-allowed opacity-60", disabled: true, children: _jsx(Span, { children: mergedLabels.ended }) })) : (_jsxs(_Fragment, { children: [_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }), resolvedBuyoutPrice ? (
+    return (_jsxs(_Fragment, { children: [_jsxs(Row, { align: "start", gap: "sm", children: [_jsx(TextLink, { href: auctionHref ?? "#", className: "min-w-0 flex-1 leading-snug transition-colors hover:text-primary", color: "primary", size: "sm", weight: "medium", children: product.title }), wishlistActions ? (_jsx(WishlistHeartButton, { size: "inline", inWishlist: inWishlist, isLoading: wishlistLoading, addLabel: mergedLabels.addToWishlist, removeLabel: mergedLabels.removeFromWishlist, onToggle: handleWishlist })) : null] }), _jsx(CardStoreLine, { storeName: product.storeName, storeId: product.storeId }), _jsxs(Div, { children: [_jsx(Caption, { children: isEnded && hasCurrentBid ? mergedLabels.winningBid : hasCurrentBid ? mergedLabels.currentBid : mergedLabels.startingBid }), _jsx(Text, { className: "leading-none text-primary", size: "base", weight: "bold", children: formatCurrency(displayBid, getDefaultCurrency()) }), isEnded && product.winnerDisplayName && (_jsxs(Caption, { className: "mt-0.5", color: "muted", children: [mergedLabels.wonBy, ": ", maskDisplayName(product.winnerDisplayName)] }))] }), _jsxs(Row, { wrap: true, justify: "between", gap: "sm", className: "gap-x-2 gap-y-1", children: [_jsxs(Div, { layout: "inline-flex", gap: "1", textWeight: "semibold", textSize: "xs", className: `items-[center] ${countdownClass}`, paddingY: "y-2xs", paddingX: "x-xs", rounded: "full", children: [_jsx(Clock, { className: "h-3 w-3" }), _jsx(Span, { children: formatCountdownLabel(remaining, mergedLabels.ended) })] }), _jsx(Caption, { children: mergedLabels.totalBids(bidCount) })] }), _jsx(Row, { wrap: true, gap: "xs", className: "mt-auto", children: isEnded ? (_jsx(Button, { gap: "xs", type: "button", variant: "ghost", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1 cursor-not-allowed opacity-60", disabled: true, children: _jsx(Span, { children: mergedLabels.ended }) })) : (_jsxs(_Fragment, { children: [_jsxs(Button, { gap: "xs", type: "button", variant: "warning", size: "sm", textSize: "xs", paddingX: "xs", className: "flex-1", onClick: handleNavigate, children: [_jsx(Gavel, { className: "h-3 w-3" }), _jsx(Span, { children: mergedLabels.placeBid })] }), resolvedBuyoutPrice ? (
                         /* `secondary`, not `danger` — this button only navigates to the
                            PDP, and `danger` is reserved for destructive actions (Rule #7
                            kinds). ACTIONS.AUCTION["buy-it-now"] is itself `secondary`. */

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

@@ -11,5 +11,11 @@ export interface BlogFeaturedCardProps {
     selectable?: boolean;
     isSelected?: boolean;
     onSelect?: (id: string, selected: boolean) => void;
+    /** Show the "N min read" chip. Defaults to `true`. */
+    showReadTime?: boolean;
+    /** Show the author name. Defaults to `true`. */
+    showAuthor?: boolean;
+    /** Show the cover image. Defaults to `true`. */
+    showThumbnail?: boolean;
 }
-export declare function BlogFeaturedCard({ post, href, labels, className, selectable, isSelected, onSelect, }: BlogFeaturedCardProps): React.JSX.Element;
+export declare function BlogFeaturedCard({ post, href, labels, className, selectable, isSelected, onSelect, showReadTime, showAuthor, showThumbnail, }: BlogFeaturedCardProps): React.JSX.Element;

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

@@ -20,10 +20,10 @@ const CATEGORY_BADGE = {
     community: "bg-warning-surface text-warning dark:bg-warning-surface dark:text-warning",
 };
 const CLS_FEATURED_BADGE = "bg-warning-surface text-warning dark:bg-warning-surface dark:text-warning px-[var(--appkit-space-2)] py-[var(--appkit-space-0-5)] rounded-full";
-export function BlogFeaturedCard({ post, href, labels = {}, className = "", selectable = false, isSelected = false, onSelect, }) {
+export function BlogFeaturedCard({ post, href, labels = {}, className = "", selectable = false, isSelected = false, onSelect, showReadTime = true, showAuthor = true, showThumbnail = true, }) {
     const longPress = useLongPress(() => onSelect?.(post.id, !isSelected));
     const safeTitle = post.title?.trim() || "Untitled post";
-    const coverImageUrl = getMediaUrl(post.coverImage);
+    const coverImageUrl = showThumbnail ? getMediaUrl(post.coverImage) : undefined;
     const date = post.publishedAt
         ? new Date(post.publishedAt).toLocaleDateString(getDefaultLocale(), {
             year: "numeric",
@@ -31,5 +31,5 @@ export function BlogFeaturedCard({ post, href, labels = {}, className = "", sele
             day: "numeric",
         })
         : "";
-    return (_jsxs(Article, { rounded: "xl", shadow: "hover-md", className: `group relative h-full overflow-hidden border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] ${isSelected ? "ring-2 ring-primary outline outline-2 outline-primary" : ""} ${className}`, onMouseDown: onSelect && !isSelected ? longPress.onMouseDown : undefined, onMouseUp: onSelect && !isSelected ? longPress.onMouseUp : undefined, onMouseLeave: onSelect && !isSelected ? longPress.onMouseLeave : undefined, onTouchStart: onSelect && !isSelected ? longPress.onTouchStart : undefined, onTouchEnd: onSelect && !isSelected ? longPress.onTouchEnd : undefined, onTouchCancel: onSelect && !isSelected ? longPress.onTouchCancel : undefined, children: [onSelect && (_jsx(BaseListingCard.Checkbox, { selected: isSelected, onSelect: (e) => { e.preventDefault(); onSelect(post.id, !isSelected); }, label: isSelected ? "Deselect post" : "Select post", position: "top-2 left-2", className: selectable || isSelected ? "opacity-100" : "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto transition-opacity" })), _jsxs(TextLink, { href: href, layout: "flex-col", className: "h-full", children: [_jsx(Div, { className: `relative aspect-video ${__O.hidden} flex-shrink-0`, children: coverImageUrl ? (_jsx(MediaImage, { src: coverImageUrl, alt: safeTitle, size: "card", className: "transition-transform duration-300 group-hover:scale-105" })) : (_jsx(Div, { role: "img", "aria-label": safeTitle, surface: "muted", className: "h-full w-full" })) }), _jsxs(Stack, { className: `flex-1 ${__P.p4}`, children: [_jsxs(Row, { gap: "xs", className: "mb-2", wrap: true, children: [_jsx(Span, { size: "xs", weight: "medium", className: `inline-block capitalize ${CATEGORY_BADGE[post.category] ?? "bg-[var(--appkit-color-bg)] text-[var(--appkit-color-text-muted)]"}`, rounded: "full", padding: "pill-xs", children: post.category }), post.isFeatured && (_jsx(Span, { size: "xs", weight: "medium", className: CLS_FEATURED_BADGE, children: labels.featuredBadge ?? "Featured" }))] }), _jsx(Heading, { level: 3, className: `leading-snug mb-1`, color: "primary", truncate: 2, size: "base", weight: "semibold", children: safeTitle }), post.excerpt && (_jsx(Text, { className: `mb-3`, color: "muted", truncate: 2, size: "sm", children: post.excerpt })), _jsxs(Row, { color: "muted", textSize: "xs", className: "mt-auto", gap: "3", wrap: true, children: [post.authorName && (_jsx(Span, { children: safeDisplayName(post.authorName, "Author") })), post.readTimeMinutes != null && (_jsxs(Span, { children: [post.readTimeMinutes, " ", labels.readTime ?? "min read"] })), date && _jsx(Span, { children: date })] })] })] })] }));
+    return (_jsxs(Article, { rounded: "xl", shadow: "hover-md", className: `group relative h-full overflow-hidden border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] ${isSelected ? "ring-2 ring-primary outline outline-2 outline-primary" : ""} ${className}`, onMouseDown: onSelect && !isSelected ? longPress.onMouseDown : undefined, onMouseUp: onSelect && !isSelected ? longPress.onMouseUp : undefined, onMouseLeave: onSelect && !isSelected ? longPress.onMouseLeave : undefined, onTouchStart: onSelect && !isSelected ? longPress.onTouchStart : undefined, onTouchEnd: onSelect && !isSelected ? longPress.onTouchEnd : undefined, onTouchCancel: onSelect && !isSelected ? longPress.onTouchCancel : undefined, children: [onSelect && (_jsx(BaseListingCard.Checkbox, { selected: isSelected, onSelect: (e) => { e.preventDefault(); onSelect(post.id, !isSelected); }, label: isSelected ? "Deselect post" : "Select post", position: "top-2 left-2", className: selectable || isSelected ? "opacity-100" : "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto transition-opacity" })), _jsxs(TextLink, { href: href, layout: "flex-col", className: "h-full", children: [showThumbnail && (_jsx(Div, { className: `relative aspect-video ${__O.hidden} flex-shrink-0`, children: coverImageUrl ? (_jsx(MediaImage, { src: coverImageUrl, alt: safeTitle, size: "card", className: "transition-transform duration-300 group-hover:scale-105" })) : (_jsx(Div, { role: "img", "aria-label": safeTitle, surface: "muted", className: "h-full w-full" })) })), _jsxs(Stack, { className: `flex-1 ${__P.p4}`, children: [_jsxs(Row, { gap: "xs", className: "mb-2", wrap: true, children: [_jsx(Span, { size: "xs", weight: "medium", className: `inline-block capitalize ${CATEGORY_BADGE[post.category] ?? "bg-[var(--appkit-color-bg)] text-[var(--appkit-color-text-muted)]"}`, rounded: "full", padding: "pill-xs", children: post.category }), post.isFeatured && (_jsx(Span, { size: "xs", weight: "medium", className: CLS_FEATURED_BADGE, children: labels.featuredBadge ?? "Featured" }))] }), _jsx(Heading, { level: 3, className: `leading-snug mb-1`, color: "primary", truncate: 2, size: "base", weight: "semibold", children: safeTitle }), post.excerpt && (_jsx(Text, { className: `mb-3`, color: "muted", truncate: 2, size: "sm", children: post.excerpt })), _jsxs(Row, { color: "muted", textSize: "xs", className: "mt-auto", gap: "3", wrap: true, children: [showAuthor && post.authorName && (_jsx(Span, { children: safeDisplayName(post.authorName, "Author") })), showReadTime && post.readTimeMinutes != null && (_jsxs(Span, { children: [post.readTimeMinutes, " ", labels.readTime ?? "min read"] })), date && _jsx(Span, { children: date })] })] })] })] }));
 }

package/dist/features/cart/repository/cart.repository.d.ts

@@ -58,7 +58,34 @@ export declare class CartRepository extends BaseRepository<CartDocument> {
      */
     updateGroupMembers(userId: string, itemId: string, input: UpdateCartGroupMembersInput): Promise<CartDocument>;
     updateItem(userId: string, itemId: string, input: UpdateCartItemInput): Promise<CartDocument>;
+    /**
+     * Re-derive the three item-dependent fields against the items that survive a
+     * removal.
+     *
+     * `removeItem` and `clearCart` both used to write `{ ...cart, items }`, which
+     * carries `selectedItemIds`, `appliedCoupons` and `storeAddons` through
+     * verbatim — so after a clear the cart still named items that no longer
+     * existed. That is not cosmetic: `previewCheckoutPricing`, `createOrderForGroup`
+     * and `/api/payment/create-order` all build `new Set(cart.selectedItemIds)`
+     * and filter by it, so a stale id set silently narrows a later checkout.
+     *
+     * `selectedItemIds` is intersected rather than cleared — `undefined` means
+     * "all items", so blanking a partial selection would silently re-select
+     * everything the buyer had deliberately unticked. An intersection that empties
+     * becomes `undefined` for the same reason it started that way: no items left
+     * to have a selection about.
+     */
+    private pruneForItems;
+    private pruneAddonsMap;
     removeItem(userId: string, itemId: string): Promise<CartDocument>;
+    /**
+     * Empty the cart, keeping any locked line.
+     *
+     * A locked line is a won auction or an accepted offer — settlement put it
+     * there and the buyer owes payment on it, so "clear" cannot mean "walk away"
+     * (see § Checkout Lanes). Callers must tell the buyer that is what happened;
+     * a silently-surviving row reads as a failed clear.
+     */
     clearCart(userId: string): Promise<CartDocument>;
     getItemCount(cart: CartDocument): number;
     getSubtotal(cart: CartDocument): number;
@@ -102,12 +129,6 @@ export declare class CartRepository extends BaseRepository<CartDocument> {
      * and keeping both shapes around invites readers that handle only one.
      */
     setStoreAddons(userId: string, storeId: string, addons: CartStoreAddons | null): Promise<void>;
-    /**
-     * Drop a store's add-on entry once its last item leaves the cart, so the map
-     * doesn't accumulate orphans. Cosmetic — an orphan is already unreachable,
-     * because a store with no items forms no order group.
-     */
-    pruneStoreAddons(userId: string, keepStoreIds: string[]): Promise<void>;
     /**
      * Cloud Functions: return refs of stale carts not updated within TTL.
      */

package/dist/features/cart/repository/cart.repository.js

@@ -323,6 +323,41 @@ export class CartRepository extends BaseRepository {
             throw new DatabaseError("Failed to update cart item", error);
         }
     }
+    /**
+     * Re-derive the three item-dependent fields against the items that survive a
+     * removal.
+     *
+     * `removeItem` and `clearCart` both used to write `{ ...cart, items }`, which
+     * carries `selectedItemIds`, `appliedCoupons` and `storeAddons` through
+     * verbatim — so after a clear the cart still named items that no longer
+     * existed. That is not cosmetic: `previewCheckoutPricing`, `createOrderForGroup`
+     * and `/api/payment/create-order` all build `new Set(cart.selectedItemIds)`
+     * and filter by it, so a stale id set silently narrows a later checkout.
+     *
+     * `selectedItemIds` is intersected rather than cleared — `undefined` means
+     * "all items", so blanking a partial selection would silently re-select
+     * everything the buyer had deliberately unticked. An intersection that empties
+     * becomes `undefined` for the same reason it started that way: no items left
+     * to have a selection about.
+     */
+    pruneForItems(cart, items) {
+        const survivingItemIds = new Set(items.map((item) => item.itemId));
+        const survivingStoreIds = new Set(items.map((item) => item.storeId));
+        const selected = cart.selectedItemIds?.filter((id) => survivingItemIds.has(id));
+        return {
+            selectedItemIds: selected && selected.length > 0 ? selected : undefined,
+            // A coupon is scoped to a store bucket or to the cart as a whole; with no
+            // items left there is nothing for either kind to discount.
+            appliedCoupons: items.length === 0 ? undefined : cart.appliedCoupons,
+            storeAddons: this.pruneAddonsMap(cart.storeAddons, survivingStoreIds),
+        };
+    }
+    pruneAddonsMap(addons, keepStoreIds) {
+        if (!addons)
+            return undefined;
+        const kept = Object.entries(addons).filter(([storeId]) => keepStoreIds.has(storeId));
+        return kept.length > 0 ? Object.fromEntries(kept) : undefined;
+    }
     async removeItem(userId, itemId) {
         try {
             const cart = await this.findByUserId(userId);
@@ -337,6 +372,7 @@ export class CartRepository extends BaseRepository {
             const updatedCart = {
                 ...cart,
                 items,
+                ...this.pruneForItems(cart, items),
                 updatedAt: new Date(),
             };
             await this.db
@@ -352,6 +388,14 @@ export class CartRepository extends BaseRepository {
             throw new DatabaseError("Failed to remove cart item", error);
         }
     }
+    /**
+     * Empty the cart, keeping any locked line.
+     *
+     * A locked line is a won auction or an accepted offer — settlement put it
+     * there and the buyer owes payment on it, so "clear" cannot mean "walk away"
+     * (see § Checkout Lanes). Callers must tell the buyer that is what happened;
+     * a silently-surviving row reads as a failed clear.
+     */
     async clearCart(userId) {
         try {
             const cart = await this.getOrCreate(userId);
@@ -359,6 +403,7 @@ export class CartRepository extends BaseRepository {
             const clearedCart = {
                 ...cart,
                 items: lockedItems,
+                ...this.pruneForItems(cart, lockedItems),
                 updatedAt: new Date(),
             };
             await this.db
@@ -517,28 +562,14 @@ export class CartRepository extends BaseRepository {
             updatedAt: new Date(),
         }, { merge: true });
     }
-    /**
-     * Drop a store's add-on entry once its last item leaves the cart, so the map
-     * doesn't accumulate orphans. Cosmetic — an orphan is already unreachable,
-     * because a store with no items forms no order group.
+    /*
+     * `pruneStoreAddons(userId, keepStoreIds)` used to live here. It had zero
+     * callers from the day it was written, and `pruneForItems` now does the same
+     * job inside the two write paths that actually remove items — with no extra
+     * read and no second write, since both already `set()` the whole document.
+     * Removed rather than wired up: two ways to prune the same map is the drift
+     * this feature was fixing.
      */
-    async pruneStoreAddons(userId, keepStoreIds) {
-        const cart = await this.findByUserId(userId);
-        const existing = cart?.storeAddons;
-        if (!existing)
-            return;
-        const keep = new Set(keepStoreIds);
-        const stale = Object.keys(existing).filter((storeId) => !keep.has(storeId));
-        if (stale.length === 0)
-            return;
-        await this.db
-            .collection(this.collection)
-            .doc(userId)
-            .set({
-            storeAddons: Object.fromEntries(stale.map((storeId) => [storeId, FieldValue.delete()])),
-            updatedAt: new Date(),
-        }, { merge: true });
-    }
     /**
      * Cloud Functions: return refs of stale carts not updated within TTL.
      */

package/dist/features/cart/utils/guest-cart.js

@@ -87,6 +87,11 @@ export function clearGuestCart(storage = getDefaultStorage(), key = DEFAULT_GUES
     if (!storage)
         return;
     storage.removeItem(key);
+    // Every other write in this file broadcasts through `writeItems`; this one
+    // used to skip it, so after a login-merge cleared the guest cart every other
+    // mounted `useGuestCart()` kept its pre-clear snapshot — a cart that had just
+    // been merged away still showing items, and a header badge still counting them.
+    dispatchGuestCartChange();
 }
 export function getGuestCartCount(storage = getDefaultStorage(), key = DEFAULT_GUEST_CART_KEY) {
     return readItems(storage, key).reduce((sum, i) => sum + i.quantity, 0);

package/dist/features/cart/utils/pending-ops.d.ts

@@ -60,6 +60,21 @@ export interface WishlistOp {
 export declare function getCartOps(): CartOp[];
 export declare function pushCartOp(op: Omit<CartOp, "ts">): void;
 export declare function clearCartOps(): void;
+/**
+ * Drop the queued ops for specific products, after their removal has already
+ * been applied server-side.
+ *
+ * Deliberately NOT `pushCartOp({ op: "remove", … })`. Every call site in the
+ * codebase pushes `op: "add"` only, so the queue's `remove` half is dead —
+ * and `useSyncManager`'s replay of a remove op calls `BY_ITEM_ID(op.productId)`,
+ * handing a productId to a route that looks up by `itemId`. Queueing a remove
+ * to express "this is already gone" would activate that latent 404.
+ *
+ * The op is what makes a cleared row re-appear (the cart page layers the queue
+ * over the server response on every render) and what makes `useSyncManager`
+ * re-POST it 30s later — so dropping it is the whole point, not bookkeeping.
+ */
+export declare function removeCartOpsFor(productIds: readonly string[]): void;
 /** Net quantity of unsynced "add" ops — layered on top of the server's
  *  authoritative itemCount so the header badge updates immediately instead
  *  of waiting for the next useSyncManager interval. Cart never queues

package/dist/features/cart/utils/pending-ops.js

@@ -122,6 +122,30 @@ export function clearCartOps() {
     localStorage.removeItem(CART_OPS_KEY());
     dispatchCartOpsChange();
 }
+/**
+ * Drop the queued ops for specific products, after their removal has already
+ * been applied server-side.
+ *
+ * Deliberately NOT `pushCartOp({ op: "remove", … })`. Every call site in the
+ * codebase pushes `op: "add"` only, so the queue's `remove` half is dead —
+ * and `useSyncManager`'s replay of a remove op calls `BY_ITEM_ID(op.productId)`,
+ * handing a productId to a route that looks up by `itemId`. Queueing a remove
+ * to express "this is already gone" would activate that latent 404.
+ *
+ * The op is what makes a cleared row re-appear (the cart page layers the queue
+ * over the server response on every render) and what makes `useSyncManager`
+ * re-POST it 30s later — so dropping it is the whole point, not bookkeeping.
+ */
+export function removeCartOpsFor(productIds) {
+    if (typeof window === "undefined" || productIds.length === 0)
+        return;
+    const drop = new Set(productIds);
+    const ops = read(CART_OPS_KEY());
+    const kept = ops.filter((op) => !drop.has(op.productId));
+    if (kept.length === ops.length)
+        return;
+    writeCartOps(kept);
+}
 /** Net quantity of unsynced "add" ops — layered on top of the server's
  *  authoritative itemCount so the header badge updates immediately instead
  *  of waiting for the next useSyncManager interval. Cart never queues

package/dist/features/homepage/components/BlogArticlesSection.d.ts

@@ -7,5 +7,11 @@ export interface BlogArticlesSectionProps {
     viewMoreLabel?: string;
     className?: string;
     initialItems?: BlogPost[];
+    /** Cap the rendered posts. */
+    limit?: number;
+    /** Per-card display toggles, forwarded to `BlogFeaturedCard`. */
+    showReadTime?: boolean;
+    showAuthor?: boolean;
+    showThumbnails?: boolean;
 }
-export declare function BlogArticlesSection({ title, description, viewMoreHref, viewMoreLabel, className, initialItems, }: BlogArticlesSectionProps): React.JSX.Element;
+export declare function BlogArticlesSection({ title, description, viewMoreHref, viewMoreLabel, className, initialItems, limit, showReadTime, showAuthor, showThumbnails, }: BlogArticlesSectionProps): React.JSX.Element;

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

@@ -5,8 +5,10 @@ import { useBlogArticles } from "../hooks/useBlogArticles";
 import { BlogFeaturedCard } from "../../blog/components/BlogFeaturedCard";
 import { ROUTES } from "../../../next";
 import { CAROUSEL_PER_VIEW } from "../constants/carousel-per-view";
-export function BlogArticlesSection({ title = "From Our Blog", description, viewMoreHref, viewMoreLabel = "View all posts →", className = "", initialItems, }) {
+import { SECTION_TITLE, VIEW_MORE_LABEL } from "../constants/section-copy";
+export function BlogArticlesSection({ title = SECTION_TITLE.blogArticles, description, viewMoreHref, viewMoreLabel = VIEW_MORE_LABEL.blogArticles, className = "", initialItems, limit, showReadTime = true, showAuthor = true, showThumbnails = true, }) {
     const { data, isLoading } = useBlogArticles({ initialPosts: initialItems });
-    const items = data?.posts ?? [];
-    return (_jsx(SectionCarousel, { title: title, description: description, pillLabel: "From Our Blog", headingVariant: "editorial", viewMoreHref: viewMoreHref, viewMoreLabel: viewMoreLabel, items: items, isLoading: isLoading, skeletonCount: 4, perView: CAROUSEL_PER_VIEW.standard, gap: 16, keyExtractor: (post) => post.id, renderItem: (post) => (_jsx(BlogFeaturedCard, { post: post, href: ROUTES.BLOG.ARTICLE(post.slug) })), className: className }));
+    const fetched = data?.posts ?? [];
+    const items = limit && limit > 0 ? fetched.slice(0, limit) : fetched;
+    return (_jsx(SectionCarousel, { title: title, description: description, pillLabel: SECTION_TITLE.blogArticles, headingVariant: "editorial", viewMoreHref: viewMoreHref, viewMoreLabel: viewMoreLabel, items: items, isLoading: isLoading, skeletonCount: 4, perView: CAROUSEL_PER_VIEW.standard, gap: 16, keyExtractor: (post) => post.id, renderItem: (post) => (_jsx(BlogFeaturedCard, { post: post, href: ROUTES.BLOG.ARTICLE(post.slug), showReadTime: showReadTime, showAuthor: showAuthor, showThumbnail: showThumbnails })), className: className }));
 }

package/dist/features/homepage/components/CTABannerSection.d.ts

@@ -1,11 +1,28 @@
 import React from "react";
+export type CTABannerHeight = "sm" | "md" | "lg" | "xl";
 export interface CTABannerSectionProps {
     title?: string;
     subtitle?: string;
+    /** Longer supporting paragraph below the subtitle. */
+    description?: string;
     primaryLabel?: string;
     primaryHref?: string;
     secondaryLabel?: string;
     secondaryHref?: string;
+    /** Vertical presence of the band. Defaults to `"md"`. */
+    height?: CTABannerHeight;
+    /**
+     * Full-bleed background image behind the copy. Rendered through
+     * `MediaImage` (so it flows through the media proxy and watermark pipeline)
+     * with a scrim, because the copy is fixed-inverse ink and needs a
+     * guaranteed-dark backdrop to stay readable — Root Cause #67.
+     *
+     * There is deliberately no `backgroundColor`/`gradient` equivalent: an
+     * arbitrary admin-chosen fill under fixed white text is a contrast failure
+     * with no safe fallback, and the themed `accent-banner` tone already gives a
+     * brand gradient that follows the active theme.
+     */
+    backgroundImage?: string;
     className?: string;
 }
-export declare function CTABannerSection({ title, subtitle, primaryLabel, primaryHref, secondaryLabel, secondaryHref, className, }: CTABannerSectionProps): React.JSX.Element;
+export declare function CTABannerSection({ title, subtitle, description, primaryLabel, primaryHref, secondaryLabel, secondaryHref, height, backgroundImage, className, }: CTABannerSectionProps): React.JSX.Element;

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

@@ -1,7 +1,25 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import Link from "next/link";
-import { Div, Heading, Row, Section, Span, Text } from "../../../ui";
+import { Div, Heading, Row, Scrim, Section, Span, Text } from "../../../ui";
+import { MediaImage } from "../../media/MediaImage";
 import { ROUTES } from "../../../next/routing/route-map";
-export function CTABannerSection({ title = "Thousands of collectibles. One marketplace.", subtitle, primaryLabel = "Shop All Products →", primaryHref = String(ROUTES.PUBLIC.PRODUCTS), secondaryLabel = "Browse Auctions →", secondaryHref = String(ROUTES.PUBLIC.AUCTIONS), className = "", }) {
-    return (_jsx(Section, { tone: "accent-banner", className: `${className}`, paddingY: "y-4xl", paddingX: "x-md", children: _jsxs(Div, { className: "mx-auto max-w-3xl text-left", children: [_jsx(Span, { className: "mb-4 inline-block", size: "2xl", "aria-hidden": "true", children: "\u2728" }), _jsx(Heading, { color: "inverse", level: 2, mdSize: "3xl", lgSize: "4xl", size: "2xl", weight: "bold", children: title }), subtitle && (_jsx(Text, { color: "inverse", className: "mt-3 /80", size: "base", children: subtitle })), _jsxs(Row, { className: "mt-8", align: "center", justify: "start", gap: "md", wrap: true, children: [_jsx(Link, { href: primaryHref, className: "inline-flex items-center rounded-full bg-white px-[var(--appkit-space-8)] py-[var(--appkit-space-3)] text-[length:var(--appkit-text-sm)] font-semibold text-primary-700 shadow-sm transition-all hover:bg-surface-hover hover:shadow-md focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-primary-600", children: primaryLabel }), secondaryHref && (_jsx(Link, { href: secondaryHref, className: "inline-flex items-center rounded-full border-2 border-white/80 px-[var(--appkit-space-8)] py-[var(--appkit-space-3)] text-[length:var(--appkit-text-sm)] font-semibold text-white transition-all hover:bg-white/10 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-primary-600", children: secondaryLabel }))] })] }) }));
+import { SECTION_TITLE, SECTION_COPY } from "../constants/section-copy";
+/**
+ * `height` maps onto the existing spacing scale rather than emitting a
+ * `min-h-[300px]`-style utility.
+ *
+ * Two reasons. A class generated only inside appkit and absent from the
+ * consumer's `src/**` is purged from the production CSS (Root Cause #3), and
+ * `BANNER_HEIGHTS`' raw px values would be exactly that. And padding keeps the
+ * banner sized by its content, so a long headline grows the box instead of
+ * overflowing a fixed height.
+ */
+const HEIGHT_PADDING_Y = {
+    sm: "y-2xl",
+    md: "y-4xl",
+    lg: "y-5xl",
+    xl: "y-6xl",
+};
+export function CTABannerSection({ title = SECTION_TITLE.banner, subtitle, description, primaryLabel = SECTION_COPY.bannerPrimaryCta, primaryHref = String(ROUTES.PUBLIC.PRODUCTS), secondaryLabel = SECTION_COPY.bannerSecondaryCta, secondaryHref = String(ROUTES.PUBLIC.AUCTIONS), height = "md", backgroundImage, className = "", }) {
+    return (_jsxs(Section, { tone: "accent-banner", className: `relative ${className}`, overflow: "hidden", paddingY: HEIGHT_PADDING_Y[height], paddingX: "x-md", children: [backgroundImage && (_jsxs(_Fragment, { children: [_jsx(Div, { className: "absolute inset-0", children: _jsx(MediaImage, { src: backgroundImage, alt: "", size: "banner", objectFit: "cover" }) }), _jsx(Scrim, { direction: "left-to-right", intensity: "strong", className: "absolute inset-0" })] })), _jsxs(Div, { className: "relative mx-auto max-w-3xl text-left", children: [_jsx(Span, { className: "mb-4 inline-block", size: "2xl", "aria-hidden": "true", children: "\u2728" }), _jsx(Heading, { color: "inverse", level: 2, mdSize: "3xl", lgSize: "4xl", size: "2xl", weight: "bold", children: title }), subtitle && (_jsx(Text, { color: "inverse", className: "mt-3 /80", size: "base", children: subtitle })), description && (_jsx(Text, { color: "inverse", className: "mt-2 /70 max-w-2xl", size: "sm", children: description })), _jsxs(Row, { className: "mt-8", align: "center", justify: "start", gap: "md", wrap: true, children: [_jsx(Link, { href: primaryHref, className: "inline-flex items-center rounded-full bg-white px-[var(--appkit-space-8)] py-[var(--appkit-space-3)] text-[length:var(--appkit-text-sm)] font-semibold text-primary-700 shadow-sm transition-all hover:bg-surface-hover hover:shadow-md focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-primary-600", children: primaryLabel }), secondaryHref && (_jsx(Link, { href: secondaryHref, className: "inline-flex items-center rounded-full border-2 border-white/80 px-[var(--appkit-space-8)] py-[var(--appkit-space-3)] text-[length:var(--appkit-text-sm)] font-semibold text-white transition-all hover:bg-white/10 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-primary-600", children: secondaryLabel }))] })] })] }));
 }