@mohasinac/appkit 4.70.0 → 4.71.2

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

@@ -0,0 +1,156 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { SIEVE_OP, Stack, sieveFilter } from "@mohasinac/appkit/client";
+import { sortBy } from "@mohasinac/appkit/client";
+import React from "react";
+import { Pencil, ListChecks } from "lucide-react";
+import { Badge } from "../../../ui/components/Badge.js";
+import { Button } from "../../../ui/components/Button.js";
+import { FilterChipGroup } from "../../../ui/components/FilterChipGroup.js";
+import { ListingLayout } from "../../../ui/components/ListingLayout.js";
+import { Row } from "../../../ui/components/Layout.js";
+import { Span, Text } from "../../../ui/components/Typography.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints.js";
+import { ADMIN_BULK_ACTIONS, ROW_ACTION_META } from "../../products/constants/action-defs.js";
+import { ADMIN_PRODUCT_STATUS_TABS } from "../constants/filter-tabs.js";
+import { ROUTES } from "../../../constants/index.js";
+import { toRecordArray, toRelativeDate, toCurrency, toStringValue, } from "../hooks/useAdminListingData.js";
+import { DataListingView } from "./DataListingView.js";
+import { useAvailabilityScope } from "../../products/hooks/useAvailabilityScope.js";
+import { PRODUCT_FIELDS } from "../../../constants/field-names.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
+const CLEARANCE_TYPES = ["clearance"];
+const STATUS_VARIANT = {
+    published: "success",
+    active: "success",
+    draft: "default",
+    pending: "warning",
+    archived: "secondary",
+    ended: "secondary",
+    cancelled: "danger",
+};
+const CLEARANCE_COLUMNS = [
+    {
+        key: "primary",
+        header: "Clearance",
+        render: (row) => (_jsxs(Stack, { gap: "xs", children: [_jsx(Text, { className: "text-[var(--appkit-color-text)] line-clamp-1", weight: "semibold", children: row.primary }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "xs", children: row.storeName })] })),
+    },
+    {
+        key: "entryFee",
+        header: "Entry Fee",
+        className: "w-28 text-right",
+        render: (row) => (_jsx(Span, { size: "sm", weight: "medium", className: "text-[var(--appkit-color-text)]", children: row.entryFee })),
+    },
+    {
+        key: "status",
+        header: "Status",
+        sortable: true,
+        className: "w-28",
+        render: (row) => _jsx(Badge, { variant: STATUS_VARIANT[row.status] ?? "default", children: row.status }),
+    },
+    {
+        key: "drawDate",
+        header: "Draw Date",
+        className: "w-32",
+        render: (row) => (_jsx(Span, { size: "sm", className: "text-[var(--appkit-color-text-muted)]", children: row.drawDate })),
+    },
+    {
+        key: "updatedAt",
+        header: "Updated",
+        sortable: true,
+        className: "w-32",
+        render: (row) => (_jsx(Span, { size: "sm", className: "text-[var(--appkit-color-text-muted)]", children: row.updatedAt })),
+    },
+];
+export function AdminClearanceView({ children, pageRegionCards = [], ...props }) {
+    /*
+     * 🛑 Before the early return, not after.
+     *
+     * This hook used to sit BELOW the `React.Children.count` branch, so the
+     * component called a different number of hooks depending on whether it was
+     * given children — a rules-of-hooks violation that React only reports once
+     * the branch actually flips at runtime. The page renders `<AdminClearanceView />`
+     * with no children, so the violating path was the one always taken and the
+     * bug stayed latent. `SellerPreOrdersView` had the identical shape and was
+     * deleted in the same commit for being unreachable.
+     */
+    const scope = useAvailabilityScope(CLEARANCE_TYPES);
+    if (React.Children.count(children) > 0) {
+        return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
+    }
+    const config = {
+        portal: "admin",
+        title: "Clearance",
+        search: {
+            placeholder: "Search clearance by name, brand or tag…",
+            /*
+             * 🛑 "or store" was a promise the corpus cannot keep.
+             * `buildProductSearchTxt` indexes title, description, brand, brandSlug,
+             * category names, tags, features, condition and card/grading details —
+             * and NO store name or id. Typing a seller's name returned an empty list
+             * that reads as "this seller runs no clearance".
+             */
+            fields: ["title", "description", "brand", "categoryNames", "tags", "features"],
+        },
+        emptyLabel: "No clearance found",
+        filterKeys: ["status"],
+        defaultSort: sortBy("createdAt", "DESC"),
+        queryKey: ["admin", "clearance", "listing"],
+        endpoint: ADMIN_ENDPOINTS.PRODUCTS,
+        sortOptions: [
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
+            { value: "title", label: "Title A–Z" },
+            { value: "prizeRevealWindowEnd", label: "Draw Date Soon" },
+        ],
+        columns: CLEARANCE_COLUMNS,
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => {
+            const priceRaw = typeof item.price === "number" ? item.price : 0;
+            return {
+                id: toStringValue(item.id, `clearance-${index}`),
+                primary: toStringValue(item.title ?? item.name, "Untitled clearance"),
+                secondary: toStringValue(item.sellerName, ""),
+                storeName: toStringValue(item.sellerName ?? item.storeId, "Unknown store"),
+                status: toStringValue(item.status, "draft"),
+                updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
+                entryFee: priceRaw ? toCurrency(priceRaw) : "Free",
+                drawDate: item.prizeRevealWindowEnd
+                    ? toRelativeDate(item.prizeRevealWindowEnd)
+                    : "TBA",
+                image: toStringValue(item.mainImage, "") || undefined,
+            };
+        }),
+        getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
+        buildFilters: (state) => {
+            const status = state.status && state.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, state.status) : null;
+            return [sieveFilter(PRODUCT_FIELDS.LISTING_TYPE, SIEVE_OP.EQ, "clearance"), status]
+                .filter(Boolean)
+                .join(",");
+        },
+        buildExtraParams: () => scope.extraParams,
+        renderAboveContent: scope.renderAboveContent,
+        rowHrefTemplate: String(ROUTES.ADMIN.CLEARANCE_EDIT("{id}")),
+        /*
+         * Clearance IS a product (`listingType: "clearance"`), so it is created
+         * in the product editor like every other type — there is deliberately no
+         * `CLEARANCE_NEW` admin route, and inventing one would be a second create
+         * path for the same document. `?listingType=` preselects the type so the
+         * row an admin creates from here actually appears here.
+         */
+        primaryAction: {
+            label: "Add Clearance",
+            href: `${String(ROUTES.ADMIN.PRODUCTS_NEW)}?${PRODUCT_FIELDS.LISTING_TYPE}=clearance`,
+        },
+        // Rule #7: bulk-action array sourced from the ADMIN_BULK_ACTIONS preset.
+        buildBulkActions: (selection) => ADMIN_BULK_ACTIONS.clearance.map((id) => ({
+            id,
+            label: ROW_ACTION_META[id].label,
+            destructive: ROW_ACTION_META[id].destructive,
+            onClick: () => selection.clearSelection(),
+        })),
+        renderRowActions: (row) => (_jsxs(Row, { gap: "xs", children: [_jsx(Button, { variant: "ghost", size: "sm", asChild: true, children: _jsx(TextLink, { href: String(ROUTES.ADMIN.CLEARANCE_EDIT(row.id)), "aria-label": "Edit", children: _jsx(Pencil, { className: "w-4 h-4" }) }) }), _jsx(Button, { variant: "ghost", size: "sm", asChild: true, children: _jsx(TextLink, { href: String(ROUTES.ADMIN.CLEARANCE_ENTRIES(row.id)), "aria-label": "View entries", children: _jsx(ListChecks, { className: "w-4 h-4" }) }) })] })),
+        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_PRODUCT_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) })),
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(AdminComposableRegion, { pageId: "admin-clearance", initialCards: pageRegionCards }), _jsx(DataListingView, { config: config })] }));
+}

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

@@ -1,8 +1,11 @@
 import React from "react";
 import type { ListingLayoutProps } from "../../../ui/components/ListingLayout";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminContactViewProps extends ListingLayoutProps {
     onBulkMarkRead?: (ids: string[]) => Promise<void>;
     onBulkArchive?: (ids: string[]) => Promise<void>;
     onBulkDelete?: (ids: string[]) => Promise<void>;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
 }
-export declare function AdminContactView({ children, onBulkMarkRead, onBulkArchive, onBulkDelete, ...props }: AdminContactViewProps): React.JSX.Element;
+export declare function AdminContactView({ children, onBulkMarkRead, onBulkArchive, onBulkDelete, pageRegionCards, ...props }: AdminContactViewProps): React.JSX.Element;

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

@@ -19,7 +19,8 @@ import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdmin
 import { DataListingView } from "./DataListingView.js";
 import { AdminContactEditorView } from "./AdminContactEditorView.js";
 import { apiClient } from "../../../http/index.js";
-export function AdminContactView({ children, onBulkMarkRead, onBulkArchive, onBulkDelete, ...props }) {
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
+export function AdminContactView({ children, onBulkMarkRead, onBulkArchive, onBulkDelete, pageRegionCards = [], ...props }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
     const [drawerOpen, setDrawerOpen] = useState(false);
@@ -81,6 +82,7 @@ export function AdminContactView({ children, onBulkMarkRead, onBulkArchive, onBu
             return mappedRows.length;
         },
         buildFilters: (f) => (f.status && f.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, f.status) : undefined),
+        renderAboveContent: () => _jsx(AdminComposableRegion, { pageId: "admin-contact", initialCards: pageRegionCards }),
         // Mirrors the row action's "View" entry so the row itself is clickable,
         // not just the overflow menu.
         onRowClick: (row) => {

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

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

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

@@ -6,8 +6,10 @@ import { Div } from "../../../ui/components/Div.js";
 import { Heading, Span, Text } from "../../../ui/components/Typography.js";
 import { Row, Stack } from "../../../ui/components/Layout.js";
 import { GC } from "../../_guide-cls.js";
-export function AdminContentGuideView() {
-    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(FileText, { 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: "Content & Marketing" }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)]", children: "Blog posts, events, FAQs, carousel, homepage sections, ads, and newsletter on LetItRip." })] }), [
+import { getBrandName } from "../../../core/brand-resolver.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
+export function AdminContentGuideView({ pageRegionCards = [] }) {
+    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(FileText, { 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: "Content & Marketing" }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", children: ["Blog posts, events, FAQs, carousel, homepage sections, ads, and newsletter on ", getBrandName(), "."] })] }), _jsx(AdminComposableRegion, { pageId: "admin-guide-content", initialCards: pageRegionCards }), [
                 {
                     Icon: FileText, title: "Blog Posts",
                     content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Statuses" }), ": ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "draft" }), " (not public), ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "published" }), " (live, indexed)."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "readTimeMinutes" }), ": Auto-calculated from content word count (200 wpm). Override manually if the post has heavy media."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "youtubeId" }), ": Optional embedded YouTube video. Use only the video ID (e.g. ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "dQw4w9WgXcQ" }), "), not the full URL."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Media in body" }), ": All images in rich text must use the ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "/api/media/" }), " proxy URL, not raw Firebase Storage links."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "isFeatured" }), ": Sets the post as featured in the blog listing. Different from the homepage featured section \u2014 that is driven by a separate ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "homepageSections" }), " config."] })] })),
@@ -18,7 +20,7 @@ export function AdminContentGuideView() {
                 },
                 {
                     Icon: BookOpen, title: "FAQs",
-                    content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Categories" }), " and where they appear: Shipping (help + footer), Returns (help), Payments (help), Auctions (help), Pre-orders (help). Set ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "showOnHomepage: true" }), " for up to 5 FAQs shown on the public home page."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Search" }), ": handled automatically \u2014 search terms are derived from the question, answer, category and tags when you save. There is nothing to fill in."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "priority + order" }), ": ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "priority" }), " sorts FAQs within their category; ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "order" }), " is the global absolute position. ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "isPinned: true" }), " floats the FAQ above non-pinned items in its category."] })] })),
+                    content: (_jsxs(Ul, { className: GC.listMuted, children: [_jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Categories" }), " and where they appear: Shipping (help + footer), Returns (help), Payments (help), CollectorDrops (help), Pre-orders (help). Set ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "showOnHomepage: true" }), " for up to 5 FAQs shown on the public home page."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "Search" }), ": handled automatically \u2014 search terms are derived from the question, answer, category and tags when you save. There is nothing to fill in."] }), _jsxs(Li, { children: [_jsx(Span, { weight: "bold", children: "priority + order" }), ": ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "priority" }), " sorts FAQs within their category; ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "order" }), " is the global absolute position. ", _jsx(Code, { size: "xs", padding: "xs", rounded: "default", surface: "subtle", children: "isPinned: true" }), " floats the FAQ above non-pinned items in its category."] })] })),
                 },
                 {
                     Icon: Layout, title: "Carousel Slides",

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

@@ -1,8 +1,13 @@
 import { type JsonValue } from "@mohasinac/appkit/client";
 import React from "react";
 import type { StackedViewShellProps } from "../../../ui/components/StackedViewShell";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminCouponEditorViewProps extends Omit<StackedViewShellProps, "sections"> {
     couponId?: string;
+    /** Page-region id for this screen (Phase 12) — required because this View is mounted from two different routes (new vs edit), each with its own id. */
+    pageId: string;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
     onSaved?: (id: string) => void;
     onDeleted?: () => void;
     embedded?: boolean;
@@ -15,4 +20,4 @@ export interface AdminCouponEditorViewProps extends Omit<StackedViewShellProps,
      */
     initialData?: Record<string, JsonValue>;
 }
-export declare function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded, initialData, ...rest }: AdminCouponEditorViewProps): React.JSX.Element;
+export declare function AdminCouponEditorView({ couponId, pageId, pageRegionCards, onSaved, onDeleted, embedded, initialData, ...rest }: AdminCouponEditorViewProps): React.JSX.Element;

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

@@ -20,6 +20,7 @@ import { buildSectionsFromSchema, visibleValues } from "../../shell/build-sectio
 import { SectionForm, useSectionFormNav } from "../../shell/SectionForm.js";
 import { ProductInlineSelect } from "../../seller/components/ProductInlineSelect.js";
 import { CategoryChipPicker } from "../../seller/components/CategoryChipPicker.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const __P = {
     p4: "p-[var(--appkit-space-4)]",
 };
@@ -65,7 +66,7 @@ function toDateInputValue(val) {
     }
 }
 // --- Component ---------------------------------------------------------------
-export function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded, initialData, ...rest }) {
+export function AdminCouponEditorView({ couponId, pageId, pageRegionCards = [], onSaved, onDeleted, embedded, initialData, ...rest }) {
     const isEdit = Boolean(couponId);
     const [form, setForm] = React.useState({
         code: "",
@@ -87,7 +88,7 @@ export function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded,
         endDate: "",
         isActive: true,
         firstTimeUserOnly: false,
-        appliesToAuctions: false,
+        appliesToCollectorDrops: false,
         tiers: [],
         applicableProducts: [],
         applicableCategories: [],
@@ -139,7 +140,7 @@ export function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded,
             applicableCategories: Array.isArray(c.restrictions?.applicableCategories)
                 ? c.restrictions.applicableCategories
                 : [],
-            appliesToAuctions: c.applicableToAuctions ?? false,
+            appliesToCollectorDrops: c.applicableToCollectorDrops ?? false,
             tiers: c.tiers ?? [],
         });
     }, [couponQuery.data]);
@@ -197,7 +198,7 @@ export function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded,
                         applicableCategories: form.applicableCategories,
                     }),
                 },
-                applicableToAuctions: form.appliesToAuctions,
+                applicableToCollectorDrops: form.appliesToCollectorDrops,
                 /*
                  * 🛑 Sent even when EMPTY so that clearing the last tier persists —
                  * the same reasoning as the brand highlights. A tier with no
@@ -308,5 +309,8 @@ export function AdminCouponEditorView({ couponId, onSaved, onDeleted, embedded,
     if (embedded) {
         return _jsx(Div, { className: `${__O.yAuto} ${__P.p4}`, children: formSection });
     }
-    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: isEdit ? "Edit Coupon" : "Create Coupon", sections: [formSection] }));
+    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: isEdit ? "Edit Coupon" : "Create Coupon", sections: [
+            _jsx(AdminComposableRegion, { pageId: pageId, initialCards: pageRegionCards }, "page-region"),
+            formSection,
+        ] }));
 }

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

@@ -1,7 +1,10 @@
 import React from "react";
 import type { ListingLayoutProps } from "../../../ui/components/ListingLayout";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminCouponsViewProps extends ListingLayoutProps {
     onBulkArchive?: (ids: string[]) => Promise<void>;
     onBulkDelete?: (ids: string[]) => Promise<void>;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
 }
-export declare function AdminCouponsView({ children, onBulkArchive, onBulkDelete, ...props }: AdminCouponsViewProps): React.JSX.Element;
+export declare function AdminCouponsView({ children, onBulkArchive, onBulkDelete, pageRegionCards, ...props }: AdminCouponsViewProps): React.JSX.Element;

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

@@ -19,7 +19,8 @@ import { toRecordArray, toStringValue, } from "../hooks/useAdminListingData.js";
 import { DataListingView } from "./DataListingView.js";
 import { AdminCouponEditorView } from "./AdminCouponEditorView.js";
 import { CouponCard } from "../../promotions/components/CouponCard.js";
-export function AdminCouponsView({ children, onBulkArchive, onBulkDelete, ...props }) {
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
+export function AdminCouponsView({ children, onBulkArchive, onBulkDelete, pageRegionCards = [], ...props }) {
     const { showToast } = useToast();
     const queryClient = useQueryClient();
     // Mirrors the currently-rendered rows so renderEditor can seed
@@ -90,6 +91,7 @@ export function AdminCouponsView({ children, onBulkArchive, onBulkDelete, ...pro
                 parts.push(sieveFilter("validity.isActive", SIEVE_OP.EQ, true));
             return parts.join(",") || undefined;
         },
+        renderAboveContent: () => _jsx(AdminComposableRegion, { pageId: "admin-coupons", initialCards: pageRegionCards }),
         primaryAction: {
             label: "Add Coupon",
             onClick: ({ openCreatePanel }) => openCreatePanel(),
@@ -123,7 +125,7 @@ export function AdminCouponsView({ children, onBulkArchive, onBulkDelete, ...pro
             rowsRef.current = rows;
             return isLoading ? (_jsx(Grid, { cols: "cardsWide", gap: "3", children: Array.from({ length: 6 }).map((_, i) => (_jsxs(Stack, { border: "skeleton", className: "animate-pulse", gap: "3", rounded: "xl", padding: "md", children: [_jsx(Div, { className: "h-6 w-2/3", surface: "subtle", rounded: "default" }), _jsx(Div, { className: "h-4 w-full", surface: "subtle", rounded: "default" }), _jsx(Div, { className: "h-3 w-1/2", surface: "subtle", rounded: "default" })] }, i))) })) : rows.length === 0 ? (_jsx(Div, { className: "text-center", padding: "y-4xl", children: _jsx(Text, { color: "faint", children: "No coupons found" }) })) : (_jsx(Grid, { cols: "cardsWide", gap: "3", children: rows.map((row) => (_jsx(CouponCard, { coupon: row.raw, onEdit: selectionCtx.openEditPanel, onToggleActive: handleToggle, onDelete: handleDelete }, row.id))) }));
         },
-        renderEditor: ({ editId, closePanel }) => (_jsx(AdminCouponEditorView, { couponId: editId ?? undefined, initialData: editId ? rowsRef.current.find((r) => r.id === editId)?.raw : undefined, onSaved: closePanel, onDeleted: closePanel, embedded: true })),
+        renderEditor: ({ editId, closePanel }) => (_jsx(AdminCouponEditorView, { couponId: editId ?? undefined, initialData: editId ? rowsRef.current.find((r) => r.id === editId)?.raw : undefined, pageId: editId ? "admin-coupons-id-edit" : "admin-coupons-new", onSaved: closePanel, onDeleted: closePanel, embedded: true })),
         resolveEditorTitle: ({ isCreate }) => (isCreate ? "Add Coupon" : "Edit Coupon"),
     };
     return _jsx(DataListingView, { config: config });

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

@@ -1,6 +1,7 @@
 import React from "react";
 import type { StackedViewShellProps } from "../../../ui/components/StackedViewShell";
 import type { DashboardStats } from "../types";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminDashboardViewProps extends Omit<StackedViewShellProps, "sections"> {
     labels?: {
         title?: string;
@@ -13,5 +14,7 @@ export interface AdminDashboardViewProps extends Omit<StackedViewShellProps, "se
     renderRecentActivity?: () => React.ReactNode;
     renderAlerts?: () => React.ReactNode;
     renderCharts?: () => React.ReactNode;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
 }
-export declare function AdminDashboardView({ labels, endpoint, stats, isLoading, renderStats, renderQuickActions, renderRecentActivity, renderAlerts, renderCharts, ...rest }: AdminDashboardViewProps): React.JSX.Element;
+export declare function AdminDashboardView({ labels, endpoint, stats, isLoading, renderStats, renderQuickActions, renderRecentActivity, renderAlerts, renderCharts, pageRegionCards, ...rest }: AdminDashboardViewProps): React.JSX.Element;

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

@@ -6,7 +6,8 @@ import { Alert } from "../../../ui/components/Alert.js";
 import { apiClient } from "../../../http/index.js";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints.js";
 import { DashboardStatsGrid } from "./DashboardStats.js";
-export function AdminDashboardView({ labels = {}, endpoint = ADMIN_ENDPOINTS.DASHBOARD, stats = {}, isLoading = false, renderStats, renderQuickActions, renderRecentActivity, renderAlerts, renderCharts, ...rest }) {
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
+export function AdminDashboardView({ labels = {}, endpoint = ADMIN_ENDPOINTS.DASHBOARD, stats = {}, isLoading = false, renderStats, renderQuickActions, renderRecentActivity, renderAlerts, renderCharts, pageRegionCards = [], ...rest }) {
     const shouldFetch = Object.keys(stats).length === 0;
     const query = useQuery({
         queryKey: ["admin-dashboard", endpoint],
@@ -29,6 +30,7 @@ export function AdminDashboardView({ labels = {}, endpoint = ADMIN_ENDPOINTS.DAS
     return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: labels.title ?? "Dashboard", sections: [
             query.error ? (_jsx(Alert, { variant: "error", title: "Could not load dashboard", children: query.error instanceof Error ? query.error.message : "Unknown error" })) : null,
             renderAlerts?.(),
+            _jsx(AdminComposableRegion, { pageId: "admin-dashboard", initialCards: pageRegionCards }, "page-region"),
             renderStats
                 ? renderStats(resolvedStats, busy)
                 : _jsx(DashboardStatsGrid, { stats: resolvedStats, isLoading: busy }),

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

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

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

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * AdminDigitalCodesView — admin browse of digital codes listings.
  *
@@ -14,18 +14,19 @@ import { ListingLayout } from "../../../ui/components/ListingLayout.js";
 import { buildListingTypeListingConfig } from "../../products/config/listing-type-listing-config.js";
 import { DataListingView } from "./DataListingView.js";
 import { useAvailabilityScope } from "../../products/hooks/useAvailabilityScope.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const LISTING_TYPES = ["digital-code"];
 const CONFIG_OPTS = {
     title: "Digital Codes",
     searchPlaceholder: "Search digital code listings",
     emptyLabel: "No digital code listings",
 };
-export function AdminDigitalCodesView({ children, ...props }) {
+export function AdminDigitalCodesView({ children, pageRegionCards = [], ...props }) {
     const scope = useAvailabilityScope(LISTING_TYPES);
     if (React.Children.count(children) > 0) {
         return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
     }
     // Built per-render rather than at module scope: the availability scope
     // reads the URL through a hook, which cannot run outside a component.
-    return (_jsx(DataListingView, { config: buildListingTypeListingConfig("digital-code", { ...CONFIG_OPTS, scope }) }));
+    return (_jsxs(_Fragment, { children: [_jsx(AdminComposableRegion, { pageId: "admin-digital-codes", initialCards: pageRegionCards }), _jsx(DataListingView, { config: buildListingTypeListingConfig("digital-code", { ...CONFIG_OPTS, scope }) })] }));
 }

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

@@ -1,4 +1,5 @@
 import React from "react";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminEmployeeEditorViewProps {
     open: boolean;
     onClose: () => void;
@@ -7,5 +8,39 @@ export interface AdminEmployeeEditorViewProps {
     displayName?: string;
     currentPermissionGroup?: string;
     currentPermissions?: string[];
+    /**
+     * Page-region id for this screen (Phase 12). Optional because this View
+     * also mounts as an INLINE drawer from `AdminTeamView`'s row click — that
+     * usage is not a distinct route and must not get its own page region (the
+     * list page already renders its own `<AdminComposableRegion pageId="admin-team">`).
+     * Pass it only from the two standalone routes (`/admin/team/new`,
+     * `/admin/team/[id]/edit`), each with its own id.
+     */
+    pageId?: string;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
 }
-export declare function AdminEmployeeEditorView({ open, onClose, mode, userId, displayName, currentPermissionGroup, currentPermissions, }: AdminEmployeeEditorViewProps): React.JSX.Element;
+/**
+ * Permission groups, DERIVED from the presets rather than restated.
+ *
+ * The hand-written array this replaces listed eighteen of the nineteen —
+ * `maintenance_employee` was simply absent, so that preset could never be
+ * assigned from this drawer even though `PERMISSION_GROUPS` defines it and the
+ * route accepts it. Root Cause #61, on the permission-group axis.
+ *
+ * Nineteen options is well over the five-option threshold, so the generator
+ * renders it as a `PaginatedSelect`: it was a native `<Select>` with no
+ * `name`, which is both unsearchable and unreachable by `applyZodIssues`.
+ */
+/**
+ * Exported (RS13, 2026-11-04) so `AdminTeamView`'s "Permission Group" filter
+ * can read the same derived list instead of its own hand-written 20-entry
+ * array — which had drifted from this one in cosmetics (raw snake_case
+ * labels, no `GROUP_LABEL_OVERRIDES`) even though both describe the exact
+ * same `PERMISSION_GROUPS` registry. One definition, two consumers.
+ */
+export declare const GROUP_OPTIONS: {
+    label: string;
+    value: string;
+}[];
+export declare function AdminEmployeeEditorView({ open, onClose, mode, userId, displayName, currentPermissionGroup, currentPermissions, pageId, pageRegionCards, }: AdminEmployeeEditorViewProps): React.JSX.Element;

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

@@ -13,6 +13,7 @@ import { FormShellContext, useFormShellState } from "../../../ui/forms/FormShell
 import { applyZodIssues } from "../../../ui/forms/apply-zod-issues.js";
 import { buildSectionsFromSchema, visibleValues } from "../../shell/build-sections.js";
 import { SectionForm, useSectionFormNav } from "../../shell/SectionForm.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const __O = {
     yAuto: "overflow-y-auto",
 };
@@ -34,7 +35,14 @@ const GROUP_LABEL_OVERRIDES = {
  * renders it as a `PaginatedSelect`: it was a native `<Select>` with no
  * `name`, which is both unsearchable and unreachable by `applyZodIssues`.
  */
-const GROUP_OPTIONS = [
+/**
+ * Exported (RS13, 2026-11-04) so `AdminTeamView`'s "Permission Group" filter
+ * can read the same derived list instead of its own hand-written 20-entry
+ * array — which had drifted from this one in cosmetics (raw snake_case
+ * labels, no `GROUP_LABEL_OVERRIDES`) even though both describe the exact
+ * same `PERMISSION_GROUPS` registry. One definition, two consumers.
+ */
+export const GROUP_OPTIONS = [
     ...Object.keys(PERMISSION_GROUPS).map((value) => ({
         value,
         label: GROUP_LABEL_OVERRIDES[value] ??
@@ -71,7 +79,7 @@ function PermissionDomainsPanel({ permissions, togglePerm }) {
                 }) })] }));
 }
 // --- Component ---------------------------------------------------------------
-export function AdminEmployeeEditorView({ open, onClose, mode, userId, displayName, currentPermissionGroup, currentPermissions = [], }) {
+export function AdminEmployeeEditorView({ open, onClose, mode, userId, displayName, currentPermissionGroup, currentPermissions = [], pageId, pageRegionCards = [], }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
     const [form, setForm] = React.useState({
@@ -189,9 +197,9 @@ export function AdminEmployeeEditorView({ open, onClose, mode, userId, displayNa
         else
             updateMutation.mutate();
     };
-    return (_jsxs(_Fragment, { children: [_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: mode === "invite" ? "Invite Employee" : `Edit — ${displayName ?? "Employee"}`, children: _jsx(Div, { padding: "md", children: _jsxs(FormShellContext.Provider, { value: shellCtx, children: [_jsx(FormErrorSummary, {}), _jsx(SectionForm, { sections: sections, values: form, onChange: (partial) => setForm((prev) => ({ ...prev, ...partial })), onSubmit: handleSubmit, schema: schema, openIds: nav.openIds, onOpenChange: nav.setOpenIds, isLoading: isBusy, submitLabel: mode === "invite" ? "Send invite" : "Save", onCancel: onClose, 
-                                /* A drawer owns its own footer — see `useIsInsideOverlay`. */
-                                bottomBar: false, destructiveAction: mode === "edit" && userId
-                                    ? { label: "Revoke access", onClick: () => setRevokeOpen(true), disabled: isBusy }
-                                    : undefined })] }) }) }), mode === "edit" && (_jsx(ConfirmDeleteModal, { isOpen: revokeOpen, onClose: () => setRevokeOpen(false), onConfirm: () => revokeMutation.mutate(), isDeleting: revokeMutation.isPending, title: "Revoke employee access?", message: `${displayName ?? "This employee"} will lose admin panel access immediately. Their user account remains active — only their role is reset to user.`, confirmText: "Revoke Access", variant: "danger" }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: mode === "invite" ? "Invite Employee" : `Edit — ${displayName ?? "Employee"}`, children: _jsxs(Div, { padding: "md", children: [pageId && _jsx(AdminComposableRegion, { pageId: pageId, initialCards: pageRegionCards }), _jsxs(FormShellContext.Provider, { value: shellCtx, children: [_jsx(FormErrorSummary, {}), _jsx(SectionForm, { sections: sections, values: form, onChange: (partial) => setForm((prev) => ({ ...prev, ...partial })), onSubmit: handleSubmit, schema: schema, openIds: nav.openIds, onOpenChange: nav.setOpenIds, isLoading: isBusy, submitLabel: mode === "invite" ? "Send invite" : "Save", onCancel: onClose, 
+                                    /* A drawer owns its own footer — see `useIsInsideOverlay`. */
+                                    bottomBar: false, destructiveAction: mode === "edit" && userId
+                                        ? { label: "Revoke access", onClick: () => setRevokeOpen(true), disabled: isBusy }
+                                        : undefined })] })] }) }), mode === "edit" && (_jsx(ConfirmDeleteModal, { isOpen: revokeOpen, onClose: () => setRevokeOpen(false), onConfirm: () => revokeMutation.mutate(), isDeleting: revokeMutation.isPending, title: "Revoke employee access?", message: `${displayName ?? "This employee"} will lose admin panel access immediately. Their user account remains active — only their role is reset to user.`, confirmText: "Revoke Access", variant: "danger" }))] }));
 }

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

@@ -1,9 +1,14 @@
 import React from "react";
 import type { StackedViewShellProps } from "../../../ui/components/StackedViewShell";
+import type { DashboardCard } from "../../../_internal/shared/features/dashboard/recent-entry";
 export interface AdminFaqEditorViewProps extends Omit<StackedViewShellProps, "sections"> {
     faqId?: string;
+    /** Page-region id for this screen (Phase 12) — required because this View is mounted from two different routes (new vs edit), each with its own id. */
+    pageId: string;
+    /** Admin-curated page-region cards (Phase 12). Omit for no extra content. */
+    pageRegionCards?: DashboardCard[];
     onSaved?: (id: string) => void;
     onDeleted?: () => void;
     embedded?: boolean;
 }
-export declare function AdminFaqEditorView({ faqId, onSaved, onDeleted, embedded, ...rest }: AdminFaqEditorViewProps): React.JSX.Element;
+export declare function AdminFaqEditorView({ faqId, pageId, pageRegionCards, onSaved, onDeleted, embedded, ...rest }: AdminFaqEditorViewProps): React.JSX.Element;