@mohasinac/appkit 4.71.0 → 4.72.0

package/dist/features/admin/components/AdminSectionsView.js

@@ -23,10 +23,11 @@ import { QuickEditMenu } from "./QuickEditMenu.js";
 import { ALL_TAB } from "../constants/filter-tabs.js";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry.js";
 import { templatesForType, templateById, profileById, } from "./sections/sectionTemplates.js";
-import { SECTION_TYPE_OPTIONS, SUPPORTED_TYPED_BUILDERS, RESOURCE_SORT_OPTIONS, FAQ_CATEGORY_OPTIONS, DEFAULT_PRODUCTS_BUILDER, DEFAULT_AUCTIONS_BUILDER, DEFAULT_STATS_BUILDER, DEFAULT_PRE_ORDERS_BUILDER, DEFAULT_STORES_BUILDER, DEFAULT_EVENTS_BUILDER, DEFAULT_SOCIAL_FEED_BUILDER, DEFAULT_WELCOME_BUILDER, DEFAULT_TRUST_INDICATORS_BUILDER, DEFAULT_CATEGORIES_BUILDER, DEFAULT_BRANDS_BUILDER, DEFAULT_BANNER_BUILDER, DEFAULT_FEATURES_BUILDER, DEFAULT_REVIEWS_BUILDER, DEFAULT_WHATSAPP_BUILDER, DEFAULT_FAQ_BUILDER, DEFAULT_BLOG_BUILDER, DEFAULT_NEWSLETTER_BUILDER, DEFAULT_CAROUSEL_BUILDER, DEFAULT_CUSTOM_CARDS_BUILDER, DEFAULT_GOOGLE_REVIEWS_BUILDER, DEFAULT_FEATURED_BUNDLES_BUILDER, DEFAULT_PRIZE_DRAWS_BUILDER, DEFAULT_EVENT_RAFFLES_BUILDER, DEFAULT_COLLECTION_CARDS_BUILDER, } from "./sections/adminSectionsTypes.js";
-import { toStringValue, buildProductsConfig, buildAuctionsConfig, buildStatsConfig, buildPreOrdersConfig, buildStoresConfig, buildEventsConfig, buildSocialFeedConfig, buildWelcomeConfig, buildTrustIndicatorsConfig, buildCategoriesConfig, buildBrandsConfig, buildBannerConfig, buildFeaturesConfig, buildReviewsConfig, buildWhatsAppConfig, buildFAQConfig, buildBlogConfig, buildNewsletterConfig, buildCarouselConfig, buildCustomCardsConfig, buildGoogleReviewsConfig, buildFeaturedBundlesConfig, buildPrizeDrawsConfig, buildEventRafflesConfig, buildCollectionCardsConfig, parseProductsBuilder, parseAuctionsBuilder, parseStatsBuilder, parsePreOrdersBuilder, parseStoresBuilder, parseEventsBuilder, parseSocialFeedBuilder, parseWelcomeBuilder, parseTrustIndicatorsBuilder, parseCategoriesBuilder, parseBrandsBuilder, parseBannerBuilder, parseFeaturesBuilder, parseReviewsBuilder, parseWhatsAppBuilder, parseFAQBuilder, parseBlogBuilder, parseNewsletterBuilder, parseCarouselBuilder, parseCustomCardsBuilder, parseGoogleReviewsBuilder, parseFeaturedBundlesBuilder, parsePrizeDrawsBuilder, parseEventRafflesBuilder, parseCollectionCardsBuilder } from "./sections/adminSectionsBuildParse.js";
+import { SECTION_TYPE_OPTIONS, SUPPORTED_TYPED_BUILDERS, RESOURCE_SORT_OPTIONS, FAQ_CATEGORY_OPTIONS, DEFAULT_PRODUCTS_BUILDER, DEFAULT_COLLECTOR_DROPS_BUILDER, DEFAULT_STATS_BUILDER, DEFAULT_PRE_ORDERS_BUILDER, DEFAULT_STORES_BUILDER, DEFAULT_EVENTS_BUILDER, DEFAULT_SOCIAL_FEED_BUILDER, DEFAULT_WELCOME_BUILDER, DEFAULT_TRUST_INDICATORS_BUILDER, DEFAULT_CATEGORIES_BUILDER, DEFAULT_BRANDS_BUILDER, DEFAULT_BANNER_BUILDER, DEFAULT_FEATURES_BUILDER, DEFAULT_REVIEWS_BUILDER, DEFAULT_WHATSAPP_BUILDER, DEFAULT_FAQ_BUILDER, DEFAULT_BLOG_BUILDER, DEFAULT_NEWSLETTER_BUILDER, DEFAULT_CAROUSEL_BUILDER, DEFAULT_CUSTOM_CARDS_BUILDER, DEFAULT_GOOGLE_REVIEWS_BUILDER, DEFAULT_FEATURED_BUNDLES_BUILDER, DEFAULT_CLEARANCE_BUILDER, DEFAULT_EVENT_RAFFLES_BUILDER, DEFAULT_COLLECTION_CARDS_BUILDER, } from "./sections/adminSectionsTypes.js";
+import { toStringValue, buildProductsConfig, buildCollectorDropsConfig, buildStatsConfig, buildPreOrdersConfig, buildStoresConfig, buildEventsConfig, buildSocialFeedConfig, buildWelcomeConfig, buildTrustIndicatorsConfig, buildCategoriesConfig, buildBrandsConfig, buildBannerConfig, buildFeaturesConfig, buildReviewsConfig, buildWhatsAppConfig, buildFAQConfig, buildBlogConfig, buildNewsletterConfig, buildCarouselConfig, buildCustomCardsConfig, buildGoogleReviewsConfig, buildFeaturedBundlesConfig, buildClearanceConfig, buildEventRafflesConfig, buildCollectionCardsConfig, parseProductsBuilder, parseCollectorDropsBuilder, parseStatsBuilder, parsePreOrdersBuilder, parseStoresBuilder, parseEventsBuilder, parseSocialFeedBuilder, parseWelcomeBuilder, parseTrustIndicatorsBuilder, parseCategoriesBuilder, parseBrandsBuilder, parseBannerBuilder, parseFeaturesBuilder, parseReviewsBuilder, parseWhatsAppBuilder, parseFAQBuilder, parseBlogBuilder, parseNewsletterBuilder, parseCarouselBuilder, parseCustomCardsBuilder, parseGoogleReviewsBuilder, parseFeaturedBundlesBuilder, parseClearanceBuilder, parseEventRafflesBuilder, parseCollectionCardsBuilder } from "./sections/adminSectionsBuildParse.js";
 import { toUserMessage } from "../../../errors/error-display-map.js";
 import { getBrandName } from "../../../core/brand-resolver.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const __P = {
     p3: "p-[var(--appkit-space-3)]",
     p4: "p-[var(--appkit-space-4)]",
@@ -88,7 +89,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
      */
     const [rawConfigJson, setRawConfigJson] = React.useState("{}");
     const [productsBuilder, setProductsBuilder] = React.useState(DEFAULT_PRODUCTS_BUILDER);
-    const [auctionsBuilder, setAuctionsBuilder] = React.useState(DEFAULT_AUCTIONS_BUILDER);
+    const [collectorDropsBuilder, setCollectorDropsBuilder] = React.useState(DEFAULT_COLLECTOR_DROPS_BUILDER);
     const [statsBuilder, setStatsBuilder] = React.useState(DEFAULT_STATS_BUILDER);
     const [preOrdersBuilder, setPreOrdersBuilder] = React.useState(DEFAULT_PRE_ORDERS_BUILDER);
     const [storesBuilder, setStoresBuilder] = React.useState(DEFAULT_STORES_BUILDER);
@@ -109,7 +110,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
     const [customCardsBuilder, setCustomCardsBuilder] = React.useState(DEFAULT_CUSTOM_CARDS_BUILDER);
     const [googleReviewsBuilder, setGoogleReviewsBuilder] = React.useState(DEFAULT_GOOGLE_REVIEWS_BUILDER);
     const [featuredBundlesBuilder, setFeaturedBundlesBuilder] = React.useState(DEFAULT_FEATURED_BUNDLES_BUILDER);
-    const [prizeDrawsBuilder, setPrizeDrawsBuilder] = React.useState(DEFAULT_PRIZE_DRAWS_BUILDER);
+    const [clearanceBuilder, setClearanceBuilder] = React.useState(DEFAULT_CLEARANCE_BUILDER);
     const [eventRafflesBuilder, setEventRafflesBuilder] = React.useState(DEFAULT_EVENT_RAFFLES_BUILDER);
     const [collectionCardsBuilder, setCollectionCardsBuilder] = React.useState(DEFAULT_COLLECTION_CARDS_BUILDER);
     const toast = useToast();
@@ -139,7 +140,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
     const typedConfig = React.useMemo(() => {
         switch (sectionType) {
             case "products": return buildProductsConfig(productsBuilder);
-            case "auctions": return buildAuctionsConfig(auctionsBuilder);
+            case "collector-drops": return buildCollectorDropsConfig(collectorDropsBuilder);
             case "stats": return buildStatsConfig(statsBuilder);
             case "pre-orders": return buildPreOrdersConfig(preOrdersBuilder);
             case "stores": return buildStoresConfig(storesBuilder);
@@ -160,7 +161,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "custom-cards": return buildCustomCardsConfig(customCardsBuilder);
             case "google-reviews": return buildGoogleReviewsConfig(googleReviewsBuilder);
             case "featured-bundles": return buildFeaturedBundlesConfig(featuredBundlesBuilder);
-            case "prize-draws": return buildPrizeDrawsConfig(prizeDrawsBuilder);
+            case "clearance": return buildClearanceConfig(clearanceBuilder);
             case "event-raffles": return buildEventRafflesConfig(eventRafflesBuilder);
             case "collection-cards": return buildCollectionCardsConfig(collectionCardsBuilder);
             default: return null;
@@ -168,7 +169,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
     }, [
         sectionType,
         productsBuilder,
-        auctionsBuilder,
+        collectorDropsBuilder,
         statsBuilder,
         preOrdersBuilder,
         storesBuilder,
@@ -189,7 +190,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
         customCardsBuilder,
         googleReviewsBuilder,
         featuredBundlesBuilder,
-        prizeDrawsBuilder,
+        clearanceBuilder,
         eventRafflesBuilder,
         collectionCardsBuilder,
     ]);
@@ -276,8 +277,8 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "products":
                 setProductsBuilder(parseProductsBuilder(selectedConfig));
                 break;
-            case "auctions":
-                setAuctionsBuilder(parseAuctionsBuilder(selectedConfig));
+            case "collector-drops":
+                setCollectorDropsBuilder(parseCollectorDropsBuilder(selectedConfig));
                 break;
             case "stats":
                 setStatsBuilder(parseStatsBuilder(selectedConfig));
@@ -339,8 +340,8 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "featured-bundles":
                 setFeaturedBundlesBuilder(parseFeaturedBundlesBuilder(selectedConfig));
                 break;
-            case "prize-draws":
-                setPrizeDrawsBuilder(parsePrizeDrawsBuilder(selectedConfig));
+            case "clearance":
+                setClearanceBuilder(parseClearanceBuilder(selectedConfig));
                 break;
             case "event-raffles":
                 setEventRafflesBuilder(parseEventRafflesBuilder(selectedConfig));
@@ -375,8 +376,8 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "products":
                 setProductsBuilder(pick(DEFAULT_PRODUCTS_BUILDER));
                 break;
-            case "auctions":
-                setAuctionsBuilder(pick(DEFAULT_AUCTIONS_BUILDER));
+            case "collector-drops":
+                setCollectorDropsBuilder(pick(DEFAULT_COLLECTOR_DROPS_BUILDER));
                 break;
             case "stats":
                 setStatsBuilder(pick(DEFAULT_STATS_BUILDER));
@@ -438,8 +439,8 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "featured-bundles":
                 setFeaturedBundlesBuilder(pick(DEFAULT_FEATURED_BUNDLES_BUILDER));
                 break;
-            case "prize-draws":
-                setPrizeDrawsBuilder(pick(DEFAULT_PRIZE_DRAWS_BUILDER));
+            case "clearance":
+                setClearanceBuilder(pick(DEFAULT_CLEARANCE_BUILDER));
                 break;
             case "event-raffles":
                 setEventRafflesBuilder(pick(DEFAULT_EVENT_RAFFLES_BUILDER));
@@ -506,17 +507,17 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
                         scrollInterval: Math.max(1000, Number(event.target.value) || 1000),
                     })) })] }));
     }
-    function renderAuctionsCategorySelectors() {
-        return (_jsxs(Stack, { gap: "sm", children: [_jsx(Text, { className: "tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Category selectors" }), categoriesQuery.isLoading ? (_jsx(Text, { size: "sm", color: "muted", children: "Loading categories..." })) : categoryOptions.length === 0 ? (_jsx(Text, { size: "sm", color: "muted", children: "No categories available." })) : (_jsx(Div, { layout: "grid", gap: "2", className: "grid-cols-1 sm:grid-cols-2", children: categoryOptions.map((category) => (_jsx(Checkbox, { checked: auctionsBuilder.selectedCategoryIds.includes(category.id), label: category.name, onChange: (event) => setAuctionsBuilder((prev) => ({
+    function renderCollectorDropsCategorySelectors() {
+        return (_jsxs(Stack, { gap: "sm", children: [_jsx(Text, { className: "tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Category selectors" }), categoriesQuery.isLoading ? (_jsx(Text, { size: "sm", color: "muted", children: "Loading categories..." })) : categoryOptions.length === 0 ? (_jsx(Text, { size: "sm", color: "muted", children: "No categories available." })) : (_jsx(Div, { layout: "grid", gap: "2", className: "grid-cols-1 sm:grid-cols-2", children: categoryOptions.map((category) => (_jsx(Checkbox, { checked: collectorDropsBuilder.selectedCategoryIds.includes(category.id), label: category.name, onChange: (event) => setCollectorDropsBuilder((prev) => ({
                             ...prev,
                             selectedCategoryIds: toggleCategorySelection(prev.selectedCategoryIds, category.id, event.target.checked),
                         })) }, category.id))) }))] }));
     }
-    function renderAuctionsBuilder() {
-        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Auctions Carousel Builder" }), _jsx(Input, { label: "Section title", value: auctionsBuilder.title, onChange: (event) => setAuctionsBuilder((prev) => ({ ...prev, title: event.target.value })) }), _jsx(Input, { label: LBL_VIEW_MORE, value: auctionsBuilder.viewMoreLabel, onChange: (event) => setAuctionsBuilder((prev) => ({ ...prev, viewMoreLabel: event.target.value })), placeholder: PH_VIEW_MORE, helperText: HELP_VIEW_MORE }), _jsx(Input, { label: "Subtitle", value: auctionsBuilder.subtitle, onChange: (event) => setAuctionsBuilder((prev) => ({ ...prev, subtitle: event.target.value })) }), _jsx(Input, { label: "Max auctions", type: "number", min: 1, max: 50, value: String(auctionsBuilder.maxItems), onChange: (event) => setAuctionsBuilder((prev) => ({
+    function renderCollectorDropsBuilder() {
+        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Collector Drops Carousel Builder" }), _jsx(Input, { label: "Section title", value: collectorDropsBuilder.title, onChange: (event) => setCollectorDropsBuilder((prev) => ({ ...prev, title: event.target.value })) }), _jsx(Input, { label: LBL_VIEW_MORE, value: collectorDropsBuilder.viewMoreLabel, onChange: (event) => setCollectorDropsBuilder((prev) => ({ ...prev, viewMoreLabel: event.target.value })), placeholder: PH_VIEW_MORE, helperText: HELP_VIEW_MORE }), _jsx(Input, { label: "Subtitle", value: collectorDropsBuilder.subtitle, onChange: (event) => setCollectorDropsBuilder((prev) => ({ ...prev, subtitle: event.target.value })) }), _jsx(Input, { label: "Max collector drops", type: "number", min: 1, max: 50, value: String(collectorDropsBuilder.maxItems), onChange: (event) => setCollectorDropsBuilder((prev) => ({
                         ...prev,
                         maxItems: Math.max(1, Number(event.target.value) || 1),
-                    })) }), _jsx(Select, { label: "Status filter", value: auctionsBuilder.status, onValueChange: (value) => setAuctionsBuilder((prev) => ({
+                    })) }), _jsx(Select, { label: "Status filter", value: collectorDropsBuilder.status, onValueChange: (value) => setCollectorDropsBuilder((prev) => ({
                         ...prev,
                         status: value,
                     })), options: [
@@ -524,16 +525,16 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
                         { label: "Active", value: "active" },
                         { label: "Scheduled", value: "scheduled" },
                         { label: "Ended", value: "ended" },
-                    ] }), _jsx(Select, { label: "Sort by", value: auctionsBuilder.sortBy, onValueChange: (value) => setAuctionsBuilder((prev) => ({ ...prev, sortBy: value })), options: [...RESOURCE_SORT_OPTIONS] }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "sm", weight: "medium", children: LBL_FILTER_BY_CATEGORY }), _jsx(CategoryInlineSelect, { value: auctionsBuilder.filterByCategory, onChange: (id) => setAuctionsBuilder((prev) => ({ ...prev, filterByCategory: id })), placeholder: PH_FILTER_BY_CATEGORY })] }), _jsx(Select, { label: LBL_MAX_ITEMS, value: String(auctionsBuilder.maxCount), onValueChange: (v) => setAuctionsBuilder((prev) => ({ ...prev, maxCount: Number(v) })), options: [{ label: "5", value: "5" }, { label: "10", value: "10" }, { label: "20", value: "20" }] }), _jsx(Checkbox, { checked: auctionsBuilder.loop, label: "Loop carousel", onChange: (e) => setAuctionsBuilder((prev) => ({ ...prev, loop: e.target.checked })) }), _jsx(Select, { label: "Resource mode", value: auctionsBuilder.resourceMode, onValueChange: (value) => setAuctionsBuilder((prev) => ({
+                    ] }), _jsx(Select, { label: "Sort by", value: collectorDropsBuilder.sortBy, onValueChange: (value) => setCollectorDropsBuilder((prev) => ({ ...prev, sortBy: value })), options: [...RESOURCE_SORT_OPTIONS] }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "sm", weight: "medium", children: LBL_FILTER_BY_CATEGORY }), _jsx(CategoryInlineSelect, { value: collectorDropsBuilder.filterByCategory, onChange: (id) => setCollectorDropsBuilder((prev) => ({ ...prev, filterByCategory: id })), placeholder: PH_FILTER_BY_CATEGORY })] }), _jsx(Select, { label: LBL_MAX_ITEMS, value: String(collectorDropsBuilder.maxCount), onValueChange: (v) => setCollectorDropsBuilder((prev) => ({ ...prev, maxCount: Number(v) })), options: [{ label: "5", value: "5" }, { label: "10", value: "10" }, { label: "20", value: "20" }] }), _jsx(Checkbox, { checked: collectorDropsBuilder.loop, label: "Loop carousel", onChange: (e) => setCollectorDropsBuilder((prev) => ({ ...prev, loop: e.target.checked })) }), _jsx(Select, { label: "Resource mode", value: collectorDropsBuilder.resourceMode, onValueChange: (value) => setCollectorDropsBuilder((prev) => ({
                         ...prev,
                         resourceMode: value,
                     })), options: [
                         { label: LBL_AUTOMATIC, value: "automatic" },
                         { label: LBL_MANUAL_IDS, value: "manual" },
-                    ] }), renderAuctionsCategorySelectors(), auctionsBuilder.resourceMode === "manual" ? (_jsx(ProductInlineSelect, { scope: "admin", multiple: true, value: auctionsBuilder.manualResourceIds ? auctionsBuilder.manualResourceIds.split(",").map((s) => s.trim()).filter(Boolean) : [], onChange: (ids) => setAuctionsBuilder((prev) => ({ ...prev, manualResourceIds: ids.join(",") })), placeholder: "Search and select auctions\u2026" })) : null, _jsx(Checkbox, { checked: auctionsBuilder.autoScroll, label: "Auto-scroll", onChange: (event) => setAuctionsBuilder((prev) => ({
+                    ] }), renderCollectorDropsCategorySelectors(), collectorDropsBuilder.resourceMode === "manual" ? (_jsx(ProductInlineSelect, { scope: "admin", multiple: true, value: collectorDropsBuilder.manualResourceIds ? collectorDropsBuilder.manualResourceIds.split(",").map((s) => s.trim()).filter(Boolean) : [], onChange: (ids) => setCollectorDropsBuilder((prev) => ({ ...prev, manualResourceIds: ids.join(",") })), placeholder: "Search and select collector drops\u2026" })) : null, _jsx(Checkbox, { checked: collectorDropsBuilder.autoScroll, label: "Auto-scroll", onChange: (event) => setCollectorDropsBuilder((prev) => ({
                         ...prev,
                         autoScroll: event.target.checked,
-                    })) }), _jsx(Input, { label: LBL_SCROLL_INTERVAL, type: "number", min: 1000, step: 500, value: String(auctionsBuilder.scrollInterval), onChange: (event) => setAuctionsBuilder((prev) => ({
+                    })) }), _jsx(Input, { label: LBL_SCROLL_INTERVAL, type: "number", min: 1000, step: 500, value: String(collectorDropsBuilder.scrollInterval), onChange: (event) => setCollectorDropsBuilder((prev) => ({
                         ...prev,
                         scrollInterval: Math.max(1000, Number(event.target.value) || 1000),
                     })) })] }));
@@ -787,29 +788,29 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
                         maxItems: Math.max(1, Math.min(12, Number(e.target.value) || 8)),
                     })) }), _jsx(Checkbox, { checked: featuredBundlesBuilder.showSavingsBadge, label: "Show savings % badge on each bundle", onChange: (e) => setFeaturedBundlesBuilder((prev) => ({ ...prev, showSavingsBadge: e.target.checked })) })] }));
     }
-    function renderPrizeDrawsBuilder() {
-        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Prize Draws Builder" }), _jsx(Input, { label: "Section title", value: prizeDrawsBuilder.title, onChange: (e) => setPrizeDrawsBuilder((prev) => ({ ...prev, title: e.target.value })), placeholder: "Prize Draws" }), _jsx(Input, { label: "Subtitle", value: prizeDrawsBuilder.subtitle, onChange: (e) => setPrizeDrawsBuilder((prev) => ({ ...prev, subtitle: e.target.value })), placeholder: "Enter for a chance to win rare collectibles" }), _jsx(Input, { label: "Max items", type: "number", min: 1, max: 12, value: String(prizeDrawsBuilder.maxItems), onChange: (e) => setPrizeDrawsBuilder((prev) => ({
+    function renderClearanceBuilder() {
+        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Clearance Builder" }), _jsx(Input, { label: "Section title", value: clearanceBuilder.title, onChange: (e) => setClearanceBuilder((prev) => ({ ...prev, title: e.target.value })), placeholder: "Clearance" }), _jsx(Input, { label: "Subtitle", value: clearanceBuilder.subtitle, onChange: (e) => setClearanceBuilder((prev) => ({ ...prev, subtitle: e.target.value })), placeholder: "Enter for a chance to win rare collectibles" }), _jsx(Input, { label: "Max items", type: "number", min: 1, max: 12, value: String(clearanceBuilder.maxItems), onChange: (e) => setClearanceBuilder((prev) => ({
                         ...prev,
                         maxItems: Math.max(1, Math.min(12, Number(e.target.value) || 6)),
-                    })) }), _jsx(Input, { label: "Filter by store (storeId)", value: prizeDrawsBuilder.storeId, onChange: (e) => setPrizeDrawsBuilder((prev) => ({ ...prev, storeId: e.target.value })), placeholder: "Leave blank for all stores" }), _jsx(Select, { label: "Reveal status", value: prizeDrawsBuilder.revealStatus, onValueChange: (value) => setPrizeDrawsBuilder((prev) => ({ ...prev, revealStatus: value })), options: [
+                    })) }), _jsx(Input, { label: "Filter by store (storeId)", value: clearanceBuilder.storeId, onChange: (e) => setClearanceBuilder((prev) => ({ ...prev, storeId: e.target.value })), placeholder: "Leave blank for all stores" }), _jsx(Select, { label: "Reveal status", value: clearanceBuilder.revealStatus, onValueChange: (value) => setClearanceBuilder((prev) => ({ ...prev, revealStatus: value })), options: [
                         { label: "All (pending + open)", value: "all" },
                         { label: "Pending only", value: "pending" },
                         { label: "Open only", value: "open" },
-                    ] }), _jsx(Checkbox, { checked: prizeDrawsBuilder.showCountdown, label: "Show countdown to reveal window", onChange: (e) => setPrizeDrawsBuilder((prev) => ({ ...prev, showCountdown: e.target.checked })) }), _jsx(Checkbox, { checked: prizeDrawsBuilder.showEntriesRemaining, label: "Show entries-remaining bar", onChange: (e) => setPrizeDrawsBuilder((prev) => ({ ...prev, showEntriesRemaining: e.target.checked })) }), _jsx(Text, { size: "xs", color: "muted", children: "Prize-draw listing type is added with the prize-draw feature; until then this section renders an empty state." })] }));
+                    ] }), _jsx(Checkbox, { checked: clearanceBuilder.showCountdown, label: "Show countdown to reveal window", onChange: (e) => setClearanceBuilder((prev) => ({ ...prev, showCountdown: e.target.checked })) }), _jsx(Checkbox, { checked: clearanceBuilder.showEntriesRemaining, label: "Show entries-remaining bar", onChange: (e) => setClearanceBuilder((prev) => ({ ...prev, showEntriesRemaining: e.target.checked })) }), _jsx(Text, { size: "xs", color: "muted", children: "The clearance listing type is added with the clearance feature; until then this section renders an empty state." })] }));
     }
     function renderEventRafflesBuilder() {
-        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Event Raffles Builder" }), _jsx(Input, { label: "Section title", value: eventRafflesBuilder.title, onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, title: e.target.value })), placeholder: "Live Raffles & Spin Wheels" }), _jsx(Input, { label: "Subtitle", value: eventRafflesBuilder.subtitle, onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, subtitle: e.target.value })), placeholder: "Participate in community events and win prizes" }), _jsx(Input, { label: "Max items", type: "number", min: 1, max: 8, value: String(eventRafflesBuilder.maxItems), onChange: (e) => setEventRafflesBuilder((prev) => ({
+        return (_jsxs(Div, { className: CLS_SECTION_PANEL, children: [_jsx(Text, { size: "sm", weight: "semibold", color: "primary", children: "Event Raffles Builder" }), _jsx(Input, { label: "Section title", value: eventRafflesBuilder.title, onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, title: e.target.value })), placeholder: "Live Giveaways & Spin Wheels" }), _jsx(Input, { label: "Subtitle", value: eventRafflesBuilder.subtitle, onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, subtitle: e.target.value })), placeholder: "Participate in community events and win prizes" }), _jsx(Input, { label: "Max items", type: "number", min: 1, max: 8, value: String(eventRafflesBuilder.maxItems), onChange: (e) => setEventRafflesBuilder((prev) => ({
                         ...prev,
                         maxItems: Math.max(1, Math.min(8, Number(e.target.value) || 4)),
-                    })) }), _jsx(Select, { label: "Raffle type", value: eventRafflesBuilder.raffleType, onValueChange: (value) => setEventRafflesBuilder((prev) => ({ ...prev, raffleType: value })), options: [
-                        { label: "All raffles", value: "all" },
-                        { label: "Raffle only", value: "raffle" },
-                        { label: "Spin wheel only", value: "spin_wheel" },
+                    })) }), _jsx(Select, { label: "Event type", value: eventRafflesBuilder.raffleType, onValueChange: (value) => setEventRafflesBuilder((prev) => ({ ...prev, raffleType: value })), options: [
+                        { label: "All", value: "all" },
+                        { label: "Giveaway only", value: "giveaway" },
+                        { label: "Bonus Spin only", value: "bonus-spin" },
                     ] }), _jsx(Checkbox, { checked: eventRafflesBuilder.showEntryCount, label: "Show entry count on each event", onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, showEntryCount: e.target.checked })) }), _jsx(Checkbox, { checked: eventRafflesBuilder.showCountdown, label: "Show countdown to event start/end", onChange: (e) => setEventRafflesBuilder((prev) => ({ ...prev, showCountdown: e.target.checked })) }), _jsx(Text, { size: "xs", color: "muted", children: "The hasRaffle flag on events ships with the raffle feature; until then this section renders an empty state." })] }));
     }
     const COLLECTION_CARD_TYPE_OPTIONS = [
         { label: "Products", value: "products" },
-        { label: "Auctions", value: "auctions" },
+        { label: "Collector Drops", value: "collector-drops" },
         { label: "Pre-orders", value: "pre-orders" },
         { label: "Stores", value: "stores" },
         { label: "Events", value: "events" },
@@ -878,7 +879,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
     function renderTypedBuilder() {
         switch (sectionType) {
             case "products": return renderProductsBuilder();
-            case "auctions": return renderAuctionsBuilder();
+            case "collector-drops": return renderCollectorDropsBuilder();
             case "stats": return renderStatsBuilder();
             case "pre-orders": return renderPreOrdersBuilder();
             case "stores": return renderStoresBuilder();
@@ -899,7 +900,7 @@ function SectionEditorPanel({ sectionId, section, siblingSections, isSectionsLoa
             case "custom-cards": return renderCustomCardsBuilder();
             case "google-reviews": return renderGoogleReviewsBuilder();
             case "featured-bundles": return renderFeaturedBundlesBuilder();
-            case "prize-draws": return renderPrizeDrawsBuilder();
+            case "clearance": return renderClearanceBuilder();
             case "event-raffles": return renderEventRafflesBuilder();
             case "collection-cards": return renderCollectionCardsBuilder();
             default: return null;
@@ -1049,7 +1050,7 @@ function isSameReorder(a, b) {
  * toolbar button, a "Mode" dropdown, and a second dropdown to re-find the row
  * you had just clicked past.
  */
-export function AdminSectionsView({ children }) {
+export function AdminSectionsView({ children, pageRegionCards = [] }) {
     const hasChildren = React.Children.count(children) > 0;
     const queryClient = useQueryClient();
     const toast = useToast();
@@ -1363,7 +1364,7 @@ export function AdminSectionsView({ children }) {
     if (hasChildren) {
         return _jsx(_Fragment, { children: children });
     }
-    return (_jsxs(_Fragment, { children: [_jsx(DataListingView, { config: config }), _jsx(SideDrawer, { isOpen: reorderOpen, onClose: () => setReorderOpen(false), title: "Reorder sections", footer: _jsxs(Row, { align: "center", justify: "end", gap: "sm", wrap: true, children: [_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: reindexDraft, disabled: reorderSections.isPending || reorderDraft.length === 0, children: "Reindex 1..N" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: undoReorderChange, disabled: reorderSections.isPending || !canUndoReorderChanges, children: "Undo unsaved" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: resetToServerOrder, disabled: reorderSections.isPending || !hasReorderChanges, children: "Reset to server" }), _jsx(Button, { type: "button", variant: "primary", size: "sm", onClick: () => reorderSections.mutate(), disabled: !hasReorderChanges || reorderSections.isPending || isReorderTruncated, children: reorderSections.isPending ? "Saving order..." : "Save order" })] }), children: _jsxs(Stack, { gap: "sm", children: [isReorderTruncated && (_jsxs(Div, { textSize: "sm", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: ["Showing ", sections.length, " of ", total, " sections. Saving a partial set would renumber the rest, so Save order is disabled."] })), reorderDraft.length === 0 ? (_jsx(Text, { size: "sm", color: "muted", children: "No sections to reorder." })) : (reorderDraft.map((item, index) => (_jsxs(Div, { layout: "grid", gap: "2", align: "center", className: "grid-cols-[auto_1fr_auto_auto_auto]", rounded: "md", padding: "xs", border: "default", draggable: true, onDragStart: () => setDragIndex(index), onDragOver: (event) => event.preventDefault(), onDrop: () => handleReorderDrop(index), onDragEnd: () => setDragIndex(null), children: [_jsx(Text, { size: "sm", weight: "semibold", color: "muted", children: "\u2261" }), _jsxs(Text, { size: "sm", color: "primary", children: [item.type, " #", item.order] }), _jsx(Input, { type: "number", min: 1, max: reorderDraft.length, value: String(item.order), "aria-label": `Order for ${item.type}`, onChange: (event) => updateReorderItemOrder(index, Number(event.target.value) || 1), className: "w-24" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => moveReorderItem(index, -1), disabled: index === 0, children: "Up" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => moveReorderItem(index, 1), disabled: index === reorderDraft.length - 1, children: "Down" })] }, `reorder-${item.id}`))))] }) }), deleteTargetId && (_jsx(ConfirmDeleteModal, { isOpen: true, title: ACTIONS.ADMIN["delete-section"].confirmation?.title, message: ACTIONS.ADMIN["delete-section"].confirmation?.body, confirmText: ACTIONS.ADMIN["delete-section"].confirmation?.confirmLabel, isDeleting: deleteSection.isPending, onConfirm: () => {
+    return (_jsxs(_Fragment, { children: [_jsx(AdminComposableRegion, { pageId: "admin-sections", initialCards: pageRegionCards }), _jsx(DataListingView, { config: config }), _jsx(SideDrawer, { isOpen: reorderOpen, onClose: () => setReorderOpen(false), title: "Reorder sections", footer: _jsxs(Row, { align: "center", justify: "end", gap: "sm", wrap: true, children: [_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: reindexDraft, disabled: reorderSections.isPending || reorderDraft.length === 0, children: "Reindex 1..N" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: undoReorderChange, disabled: reorderSections.isPending || !canUndoReorderChanges, children: "Undo unsaved" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: resetToServerOrder, disabled: reorderSections.isPending || !hasReorderChanges, children: "Reset to server" }), _jsx(Button, { type: "button", variant: "primary", size: "sm", onClick: () => reorderSections.mutate(), disabled: !hasReorderChanges || reorderSections.isPending || isReorderTruncated, children: reorderSections.isPending ? "Saving order..." : "Save order" })] }), children: _jsxs(Stack, { gap: "sm", children: [isReorderTruncated && (_jsxs(Div, { textSize: "sm", color: "error", surface: "danger-surface", padding: "inline", rounded: "xl", children: ["Showing ", sections.length, " of ", total, " sections. Saving a partial set would renumber the rest, so Save order is disabled."] })), reorderDraft.length === 0 ? (_jsx(Text, { size: "sm", color: "muted", children: "No sections to reorder." })) : (reorderDraft.map((item, index) => (_jsxs(Div, { layout: "grid", gap: "2", align: "center", className: "grid-cols-[auto_1fr_auto_auto_auto]", rounded: "md", padding: "xs", border: "default", draggable: true, onDragStart: () => setDragIndex(index), onDragOver: (event) => event.preventDefault(), onDrop: () => handleReorderDrop(index), onDragEnd: () => setDragIndex(null), children: [_jsx(Text, { size: "sm", weight: "semibold", color: "muted", children: "\u2261" }), _jsxs(Text, { size: "sm", color: "primary", children: [item.type, " #", item.order] }), _jsx(Input, { type: "number", min: 1, max: reorderDraft.length, value: String(item.order), "aria-label": `Order for ${item.type}`, onChange: (event) => updateReorderItemOrder(index, Number(event.target.value) || 1), className: "w-24" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => moveReorderItem(index, -1), disabled: index === 0, children: "Up" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => moveReorderItem(index, 1), disabled: index === reorderDraft.length - 1, children: "Down" })] }, `reorder-${item.id}`))))] }) }), deleteTargetId && (_jsx(ConfirmDeleteModal, { isOpen: true, title: ACTIONS.ADMIN["delete-section"].confirmation?.title, message: ACTIONS.ADMIN["delete-section"].confirmation?.body, confirmText: ACTIONS.ADMIN["delete-section"].confirmation?.confirmLabel, isDeleting: deleteSection.isPending, onConfirm: () => {
                     deleteSection.mutate(deleteTargetId);
                     setDeleteTargetId(null);
                 }, onClose: () => setDeleteTargetId(null) }))] }));

package/dist/features/admin/components/AdminSessionsView.d.ts

@@ -1,4 +1,8 @@
 import React from "react";
 import type { ListingLayoutProps } from "../../../ui/components/ListingLayout";
-export type AdminSessionsViewProps = ListingLayoutProps;
-export declare function AdminSessionsView({ children, ...props }: AdminSessionsViewProps): React.JSX.Element;
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
+export type AdminSessionsViewProps = ListingLayoutProps & {
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
+};
+export declare function AdminSessionsView({ children, pageRegionCards, ...props }: AdminSessionsViewProps): React.JSX.Element;

package/dist/features/admin/components/AdminSessionsView.js

@@ -16,6 +16,7 @@ import { ADMIN_BULK_ACTIONS, ROW_ACTION_META, ROW_ACTION_ID } from "../../produc
 import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdminListingData.js";
 import { DataListingView } from "./DataListingView.js";
 import { apiClient } from "../../../http/index.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 function maskIp(ip) {
     if (!ip)
         return "—";
@@ -24,7 +25,7 @@ function maskIp(ip) {
         return `${parts[0]}.${parts[1]}.${parts[2]}.*`;
     return ip.replace(/:\w+$/, ":*");
 }
-export function AdminSessionsView({ children, ...props }) {
+export function AdminSessionsView({ children, pageRegionCards = [], ...props }) {
     const [detail, setDetail] = useState(null);
     const queryClient = useQueryClient();
     const { showToast } = useToast();
@@ -102,7 +103,7 @@ export function AdminSessionsView({ children, ...props }) {
                 { id: "true", label: "Active only" },
             ], value: pendingFilters.isActive || "", onChange: (v) => setPendingFilters((p) => ({ ...p, isActive: v })) })),
     };
-    return (_jsxs(_Fragment, { children: [_jsx(DataListingView, { config: config }), _jsx(RecordDetailModal, { isOpen: detail !== null, onClose: () => setDetail(null), title: toStringValue(detail?.detail?.userId, "Session"), fields: (() => {
+    return (_jsxs(_Fragment, { children: [_jsx(AdminComposableRegion, { pageId: "admin-sessions", initialCards: pageRegionCards }), _jsx(DataListingView, { config: config }), _jsx(RecordDetailModal, { isOpen: detail !== null, onClose: () => setDetail(null), title: toStringValue(detail?.detail?.userId, "Session"), fields: (() => {
                     const d = (detail?.detail ?? {});
                     return detail ? [
                         { label: "User", value: toStringValue(d.userId, "—") },

package/dist/features/admin/components/AdminSidebar.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useState, useCallback } from "react";
+import { DASHBOARD_ACCENT_CLASSES } from "../../../_internal/shared/features/layout/config.js";
+import { useEffect, useState, useCallback, useRef } from "react";
 import { createPortal } from "react-dom";
 import Link from "next/link.js";
 import { Button } from "../../../ui/components/Button.js";
@@ -16,14 +17,15 @@ import { useSidebarSearch } from "../../../_internal/client/features/layout/useS
 import { findActiveNavGroup, findActiveNavItem } from "../../../_internal/client/features/layout/navActive.js";
 import { getSidebarRailClasses, getSidebarOverlayClasses } from "../../../_internal/client/features/layout/sidebarPositionClasses.js";
 import { useHandMode } from "../../../_internal/client/hand-mode/index.js";
+import { useClickOutside } from "../../../react/hooks/useClickOutside.js";
 const __O = {
     hidden: "overflow-hidden",
     yAuto: "overflow-y-auto",
 };
 function NavLink({ item, isActive, onClick }) {
     return (_jsxs(Link, { href: item.href, onClick: onClick, className: `flex items-center justify-end gap-[var(--appkit-space-2-5)] rounded-lg px-[var(--appkit-space-3)] py-[var(--appkit-space-2)] text-[0.8125rem] font-medium leading-tight transition-colors ${isActive
-            ? "bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text)]"
-            : "text-[var(--appkit-color-text-muted)] hover:bg-surface-hover hover:text-[var(--appkit-color-text)]"}`, children: [item.icon && _jsx(Span, { size: "base", className: "shrink-0 opacity-60", children: item.icon }), _jsx(Span, { className: "truncate", children: item.label })] }));
+            ? `${DASHBOARD_ACCENT_CLASSES.admin.activeBg} ${DASHBOARD_ACCENT_CLASSES.admin.activeText}`
+            : `text-[var(--appkit-color-text-muted)] ${DASHBOARD_ACCENT_CLASSES.admin.hoverBg} hover:text-[var(--appkit-color-text)]`}`, children: [item.icon && _jsx(Span, { size: "base", className: "shrink-0 opacity-60", children: item.icon }), _jsx(Span, { className: "truncate", children: item.label })] }));
 }
 function GroupsContent({ groups, activePath, onItemClick, }) {
     // Accordion — only one group open at a time. Initial pick: the group
@@ -67,16 +69,28 @@ export function AdminSidebar({ renderNavItems, renderHeader, renderFooter, activ
     const { hand } = useHandMode();
     const rail = getSidebarRailClasses(hand);
     const [mounted, setMounted] = useState(false);
+    const desktopPanelRef = useRef(null);
+    const handleToggle = onToggle ?? close;
     useEffect(() => { setMounted(true); }, []);
     useEffect(() => {
         document.body.style.overflow = mobileOpen ? "hidden" : "";
         return () => { document.body.style.overflow = ""; };
     }, [mobileOpen]);
+    // See the "NO DESKTOP BACKDROP, BUT DISMISSIBLE" note below — inert
+    // (no listener attached) outside the desktop "sidebar" variant.
+    useClickOutside(desktopPanelRef, handleToggle, {
+        enabled: variant === "sidebar" && desktopOpen,
+    });
     const navContent = groups ? (_jsx(GroupsContent, { groups: groups, activePath: activePath, onItemClick: close })) : (_jsxs(Nav, { "aria-label": "Admin sidebar", padding: "y-sm", children: [renderHeader?.(), renderNavItems?.(activePath), renderFooter?.()] }));
     const mobileNavContent = groups ? (_jsx(GroupsContent, { groups: groups, activePath: activePath, onItemClick: close })) : (_jsxs(Nav, { "aria-label": "Admin sidebar", padding: "y-sm", children: [renderHeader?.(), renderNavItems?.(activePath), renderFooter?.()] }));
+    // Desktop "sidebar" variant's own nav content — deliberately NOT the
+    // `navContent` above. That one's `onItemClick={close}` closes via
+    // `onCloseMobile`, which this variant's caller doesn't wire (it's
+    // controlled by `desktopOpen`/`onToggle` instead) — reusing it here left
+    // nav-link clicks not collapsing the desktop panel at all.
+    const sidebarNavContent = groups ? (_jsx(GroupsContent, { groups: groups, activePath: activePath, onItemClick: handleToggle })) : (_jsxs(Nav, { "aria-label": "Admin sidebar", padding: "y-sm", children: [renderHeader?.(), renderNavItems?.(activePath), renderFooter?.()] }));
     if (variant === "sidebar") {
-        const handleToggle = onToggle ?? close;
-        return (_jsxs(_Fragment, { children: [_jsxs(Div, { className: `hidden lg:flex fixed ${rail.edgeClass} z-40 transition-transform duration-300 top-[var(--header-height,3.5rem)] h-[calc(100vh-var(--header-height,3.5rem))] w-[18rem] ${desktopOpen ? "translate-x-0" : rail.collapsedTranslateClass}`, children: [_jsxs(Stack, { border: "default", surface: "sidePanel", className: `flex-1 ${rail.borderClass} dark:border-[var(--appkit-color-border)] ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: renderHeader ? renderHeader() : _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "Admin Panel" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: navContent }), renderFooter && _jsx(Div, { border: "top", padding: "inline", children: renderFooter() })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle, edge: hand })] }), _jsx(Div, { className: "lg:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));
+        return (_jsxs(_Fragment, { children: [_jsxs(Div, { ref: desktopPanelRef, className: `hidden lg:flex fixed ${rail.edgeClass} z-40 transition-transform duration-300 top-[var(--header-height,3.5rem)] h-[calc(100vh-var(--header-height,3.5rem))] w-[18rem] ${desktopOpen ? "translate-x-0" : rail.collapsedTranslateClass}`, children: [_jsxs(Stack, { border: "default", surface: "sidePanel", className: `flex-1 ${rail.borderClass} dark:border-[var(--appkit-color-border)] ${__O.hidden}`, shadow: "xl", children: [_jsx(Div, { border: "bottom-subtle", paddingY: "y-sm-tall", className: "shrink-0", padding: "x-md", children: renderHeader ? renderHeader() : _jsx(Span, { size: "xs", weight: "semibold", transform: "uppercase", color: "muted", children: "Admin Panel" }) }), _jsx(Div, { className: `flex-1 ${__O.yAuto}`, children: sidebarNavContent }), renderFooter && _jsx(Div, { border: "top", padding: "inline", children: renderFooter() })] }), _jsx(SidebarCollapseToggle, { expanded: desktopOpen, onToggle: handleToggle, edge: hand })] }), _jsx(Div, { className: "lg:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));
     }
     return (_jsxs(_Fragment, { children: [mounted && mobileOpen &&
                 createPortal(_jsx(DrawerPanel, { title: "Admin Panel", onClose: close, children: navContent }), document.body), _jsx(Div, { className: "lg:hidden", children: _jsx(BottomSheet, { open: mobileOpen, onClose: close, title: "Admin Panel", children: mobileNavContent }) })] }));

package/dist/features/admin/components/AdminSiteConfigGuideView.d.ts

@@ -1,2 +1,7 @@
 import React from "react";
-export declare function AdminSiteConfigGuideView(): React.JSX.Element;
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
+export interface AdminSiteConfigGuideViewProps {
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
+}
+export declare function AdminSiteConfigGuideView({ pageRegionCards }: AdminSiteConfigGuideViewProps): React.JSX.Element;

package/dist/features/admin/components/AdminSiteConfigGuideView.js

@@ -6,8 +6,9 @@ import { Div } from "../../../ui/components/Div.js";
 import { Heading, Text } from "../../../ui/components/Typography.js";
 import { Row, Stack } from "../../../ui/components/Layout.js";
 import { GC } from "../../_guide-cls.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const CLS_HEADER_ICON = "w-5 h-5 text-amber-500";
-export function AdminSiteConfigGuideView() {
+export function AdminSiteConfigGuideView({ pageRegionCards = [] }) {
     const SETTING_GROUPS = [
         { name: "branding", desc: "Site name, tagline, logo URL, favicon. These values override the default SVG wordmark." },
         { name: "appearance", desc: "Theme colour tokens, dark mode default, custom CSS overrides." },
@@ -18,9 +19,9 @@ export function AdminSiteConfigGuideView() {
         { name: "fees", desc: "platformFee (%), Razorpay gateway fee pass-through toggle, GST rate on platform fees." },
         { name: "integrations", desc: "API keys: Razorpay (live/test, disabled by default — manual payment is the default), Resend, WhatsApp Cloud API. Keys are encrypted at rest — never log or export." },
         { name: "shipping", desc: "Default shipping carriers, free shipping threshold (₹), COD availability toggle." },
-        { name: "auctionConfig", desc: "Global bid increment default, auto-extend window (minutes), minimum auction duration." },
+        { name: "collectorDropConfig", desc: "Global bid increment default, auto-extend window (minutes), minimum collector drop duration." },
         { name: "platformLimits", desc: "Cart item cap (50), wishlist cap (20), history cap (50), support ticket limits (2 general + 1 per order)." },
         { name: "legalPages", desc: "Body HTML for Terms of Service, Privacy Policy, Refund Policy, and Shipping Policy. Rendered on their respective static pages." },
     ];
-    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "xl", children: _jsx(Settings, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Site Configuration" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", children: ["All site settings are stored in a single Firestore document at ", _jsx(Code, { size: "xs", children: "siteSettings/global" }), ". Changes take effect on the next page render (ISR or cache revalidation)."] })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Settings Groups" })] }), _jsx(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "md", children: SETTING_GROUPS.map(({ name, desc }) => (_jsxs(Row, { textSize: "sm", gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: name }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: desc })] }, name))) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: CLS_HEADER_ICON }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "API Keys & Integrations" })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: _jsxs(Alert, { variant: "warning", children: ["API keys in ", _jsx(Code, { size: "xs", children: "integrations" }), " are stored encrypted. They are masked in the admin UI \u2014 you see ", _jsx(Code, { size: "xs", children: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), " by design. To rotate a key: paste the new value into the field and save. The old key is immediately invalidated on your payment/shipping provider's side \u2014 test in staging first. Never paste API keys into Slack, email, or any external service."] }) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Feature Flags" })] }), _jsxs(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "3", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: ["Feature flags are boolean toggles under ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "siteSettings" }), ". They control platform-wide features without a code deploy:"] }), _jsxs(Ul, { className: "list-inside text-[var(--appkit-color-text-muted)]", marker: "disc", spacing: "tight", size: "sm", children: [_jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enableAuctions" }), " \u2014 globally enable/disable all auction listings."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enablePreOrders" }), " \u2014 globally enable/disable pre-order creation."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "maintenanceMode" }), " \u2014 shows a maintenance banner and blocks non-admin access."] })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "Flags are evaluated per-request via ISR cache \u2014 a change may take up to the revalidation interval (3600s default) to propagate to all pages." })] })] })] }));
+    return (_jsxs(Stack, { className: "max-w-3xl mx-auto", padding: "b-2xl", gap: "xl", children: [_jsxs(Section, { children: [_jsxs(Row, { className: "mb-2", align: "center", gap: "3", children: [_jsx(Row, { className: `flex-shrink-0 w-10 h-10 ${GC.iconBg}`, align: "center", justify: "center", rounded: "xl", children: _jsx(Settings, { className: GC.iconPrimary }) }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Admin Guide" })] }), _jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)] mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: "Site Configuration" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", children: ["All site settings are stored in a single Firestore document at ", _jsx(Code, { size: "xs", children: "siteSettings/global" }), ". Changes take effect on the next page render (ISR or cache revalidation)."] })] }), _jsx(AdminComposableRegion, { pageId: "admin-guide-site", initialCards: pageRegionCards }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Settings Groups" })] }), _jsx(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "md", children: SETTING_GROUPS.map(({ name, desc }) => (_jsxs(Row, { textSize: "sm", gap: "3", children: [_jsx(Text, { className: "flex-shrink-0 font-mono text-[var(--appkit-color-primary)] w-40", size: "xs", weight: "semibold", children: name }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: desc })] }, name))) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: CLS_HEADER_ICON }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "API Keys & Integrations" })] }), _jsx(Div, { paddingY: "y-md-lg", padding: "x-lg", children: _jsxs(Alert, { variant: "warning", children: ["API keys in ", _jsx(Code, { size: "xs", children: "integrations" }), " are stored encrypted. They are masked in the admin UI \u2014 you see ", _jsx(Code, { size: "xs", children: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), " by design. To rotate a key: paste the new value into the field and save. The old key is immediately invalidated on your payment/shipping provider's side \u2014 test in staging first. Never paste API keys into Slack, email, or any external service."] }) })] }), _jsxs(Section, { className: GC.sectionWrap, children: [_jsxs(Div, { className: GC.sectionHeader, children: [_jsx(Settings, { className: "w-5 h-5 text-[var(--appkit-color-primary)]" }), _jsx(Heading, { level: 2, className: GC.sectionTitle, children: "Feature Flags" })] }), _jsxs(Stack, { paddingY: "y-md-lg", padding: "x-lg", gap: "3", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: ["Feature flags are boolean toggles under ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "siteSettings" }), ". They control platform-wide features without a code deploy:"] }), _jsxs(Ul, { className: "list-inside text-[var(--appkit-color-text-muted)]", marker: "disc", spacing: "tight", size: "sm", children: [_jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enableCollectorDrops" }), " \u2014 globally enable/disable all collector drop listings."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "enablePreOrders" }), " \u2014 globally enable/disable pre-order creation."] }), _jsxs(Li, { children: [_jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "maintenanceMode" }), " \u2014 shows a maintenance banner and blocks non-admin access."] })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "sm", children: "Flags are evaluated per-request via ISR cache \u2014 a change may take up to the revalidation interval (3600s default) to propagate to all pages." })] })] })] }));
 }

package/dist/features/admin/components/AdminSiteSettingsView.d.ts

@@ -1,8 +1,11 @@
 import React from "react";
 import type { StackedViewShellProps } from "../../../ui/components/StackedViewShell";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminSiteSettingsViewProps extends Omit<StackedViewShellProps, "sections"> {
     labels?: {
         title?: string;
     };
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
 }
-export declare function AdminSiteSettingsView({ labels, ...rest }: AdminSiteSettingsViewProps): React.JSX.Element;
+export declare function AdminSiteSettingsView({ labels, pageRegionCards, ...rest }: AdminSiteSettingsViewProps): React.JSX.Element;