@mohasinac/appkit 4.63.5 → 4.64.0

package/dist/features/stores/components/StoreCreateForm.d.ts

@@ -0,0 +1,46 @@
+/**
+ * The store-creation form — step 2 of becoming a seller.
+ *
+ * 🛑 Why this exists. `createStoreAction` has been in the codebase with **no
+ * caller and no API route**, there was no `/store/create` page, and
+ * `/user/become-seller` collected ZERO fields — it was marketing copy and one
+ * button that flipped `role` to `seller` and set `storeStatus: "pending"`. So a
+ * real applicant became a seller and then could not open a storefront by any
+ * route in the product. Only `role: "tester"` got a store, via the auto-approve
+ * branch in `becomeSeller`. This form is the missing step.
+ *
+ * 🛑 `<SectionForm>`, not a bare `<Form>`. `audit-form-sectionised` is
+ * strict-zero on multi-field forms that skip the section engine, and the engine
+ * is what supplies the pinned mobile action bar, the per-section error badges
+ * and the schema-driven field rendering every other form in the app has. The
+ * sections come from `storeCreateSchema`'s own annotations, so the fields, their
+ * labels and their validation have exactly one definition.
+ *
+ * 🛑 `<SectionForm>` does NOT mount a `FormShellContext` — it consumes whichever
+ * one the owning view provides and tolerates none, which means a view rendering
+ * only `<SectionForm>` gets section badges and no readable message anywhere.
+ * This component mounts the context AND renders `<FormErrorSummary>` itself.
+ *
+ * The submit handler is injected rather than imported: the server action lives
+ * in the consumer (`src/actions/seller.actions.ts`), and appkit must not reach
+ * into it. Same slot shape as `StoreCreateProductShell`'s `onSave`/`onPublish`.
+ */
+import React from "react";
+import { type StoreCreateInput } from "../schemas/store-create";
+export interface StoreCreateFormResult {
+    ok: boolean;
+    /** Stable error CODE, never a server message — see the submit handler. */
+    code?: string;
+    /** Which field the failure belongs to, when the server can say. */
+    field?: keyof StoreCreateInput;
+}
+export interface StoreCreateFormProps {
+    /**
+     * Performs the create. Resolves `{ ok: true }` on success, or
+     * `{ ok: false, code }` with a mapped error code.
+     */
+    onSubmit: (input: StoreCreateInput) => Promise<StoreCreateFormResult>;
+    /** Called after a successful create, for the consumer's redirect/toast. */
+    onCreated?: () => void;
+}
+export declare function StoreCreateForm({ onSubmit, onCreated }: StoreCreateFormProps): React.JSX.Element;

package/dist/features/stores/components/StoreCreateForm.js

@@ -0,0 +1,107 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The store-creation form — step 2 of becoming a seller.
+ *
+ * 🛑 Why this exists. `createStoreAction` has been in the codebase with **no
+ * caller and no API route**, there was no `/store/create` page, and
+ * `/user/become-seller` collected ZERO fields — it was marketing copy and one
+ * button that flipped `role` to `seller` and set `storeStatus: "pending"`. So a
+ * real applicant became a seller and then could not open a storefront by any
+ * route in the product. Only `role: "tester"` got a store, via the auto-approve
+ * branch in `becomeSeller`. This form is the missing step.
+ *
+ * 🛑 `<SectionForm>`, not a bare `<Form>`. `audit-form-sectionised` is
+ * strict-zero on multi-field forms that skip the section engine, and the engine
+ * is what supplies the pinned mobile action bar, the per-section error badges
+ * and the schema-driven field rendering every other form in the app has. The
+ * sections come from `storeCreateSchema`'s own annotations, so the fields, their
+ * labels and their validation have exactly one definition.
+ *
+ * 🛑 `<SectionForm>` does NOT mount a `FormShellContext` — it consumes whichever
+ * one the owning view provides and tolerates none, which means a view rendering
+ * only `<SectionForm>` gets section badges and no readable message anywhere.
+ * This component mounts the context AND renders `<FormErrorSummary>` itself.
+ *
+ * The submit handler is injected rather than imported: the server action lives
+ * in the consumer (`src/actions/seller.actions.ts`), and appkit must not reach
+ * into it. Same slot shape as `StoreCreateProductShell`'s `onSave`/`onPublish`.
+ */
+import React from "react";
+import { Div, Stack, Text } from "../../../ui/index.js";
+import { FormShellContext, FormErrorSummary, useFormShellState } from "../../../ui/forms/index.js";
+import { SectionForm, buildSectionsFromSchema, useSectionFormNav } from "../../shell/index.js";
+import { PaginatedSelect } from "../../../ui/components/PaginatedSelect.js";
+import { loadCategoryOptions } from "../../categories/utils/load-category-options.js";
+import { storeCreateSchema } from "../schemas/store-create.js";
+import { normalizeError } from "../../../errors/normalize.js";
+import { toUserMessage } from "../../../errors/error-display-map.js";
+import { useTranslations } from "next-intl";
+export function StoreCreateForm({ onSubmit, onCreated }) {
+    const t = useTranslations();
+    const [values, setValues] = React.useState({
+        storeName: "",
+        storeDescription: "",
+        storeCategory: "",
+    });
+    const [isPending, setIsPending] = React.useState(false);
+    const { shellCtx, setFieldError, clearErrors, markSubmitAttempted } = useFormShellState(storeCreateSchema);
+    const handleChange = React.useCallback((partial) => {
+        setValues((prev) => Object.assign({}, prev, partial));
+    }, []);
+    /*
+     * 🛑 `PaginatedSelect`, not the inferred text input: there are over a
+     * thousand categories, so a flat list is unscannable and the >5-options rule
+     * applies. `loadCategoryOptions` passes `listingOnly=true`, without which
+     * this offers brands and bundles as categories.
+     *
+     * 🛑 `value={… || null}` — it renders the placeholder only on `value == null`,
+     * so an empty string paints a BLANK trigger with no prompt and no hint that
+     * it is a control.
+     */
+    const sections = React.useMemo(() => buildSectionsFromSchema(storeCreateSchema, {
+        renderers: {
+            storeCategory: ({ values: v, onChange }) => (_jsx(PaginatedSelect, { name: "storeCategory", value: v.storeCategory || null, onChange: (val) => onChange({ storeCategory: val ?? "" }), loadOptions: loadCategoryOptions, placeholder: "Search categories\u2026 (optional)", searchPlaceholder: "Type a category name\u2026", noResultsText: "No categories found", ariaLabel: "Main category" })),
+        },
+    }), []);
+    // Declared AFTER `sections`, because it takes them — it derives the ordered
+    // open/closed set from the sections that are currently visible.
+    const nav = useSectionFormNav(sections, values);
+    async function submit() {
+        clearErrors();
+        markSubmitAttempted();
+        const parsed = storeCreateSchema.safeParse(values);
+        if (!parsed.success) {
+            for (const issue of parsed.error.issues) {
+                setFieldError(String(issue.path[0]), issue.message);
+            }
+            return;
+        }
+        setIsPending(true);
+        try {
+            const result = await onSubmit(parsed.data);
+            if (result.ok) {
+                onCreated?.();
+                return;
+            }
+            /*
+             * 🛑 `toUserMessage(code, t)`, never the server's own message. A
+             * raw-message fallback is how a Node MODULE_NOT_FOUND with a full
+             * require stack got rendered inside a buyer-facing modal (Root Cause
+             * #86). `toUserMessage` terminates at a generic string and never
+             * returns server text.
+             */
+            setFieldError(result.field ?? "storeName", toUserMessage(result.code ?? "UNKNOWN", t));
+        }
+        catch (err) {
+            // Every `NormalizedError` variant carries a non-optional `code`, so
+            // there is nothing to default here.
+            const e = normalizeError(err);
+            setFieldError("storeName", toUserMessage(e.code, t));
+        }
+        finally {
+            setIsPending(false);
+        }
+    }
+    return (_jsx(FormShellContext.Provider, { value: shellCtx, children: _jsxs(Div, { children: [_jsxs(Stack, { gap: "xs", className: "mb-4", children: [_jsx(Text, { size: "lg", weight: "semibold", children: "Open your storefront" }), _jsx(Text, { size: "sm", color: "muted", children: "You can change all of this later. Your store stays private until we review it." })] }), _jsx(SectionForm, { sections: sections, values: values, onChange: handleChange, onSubmit: submit, schema: storeCreateSchema, openIds: nav.openIds, onOpenChange: nav.setOpenIds, isLoading: isPending, submitLabel: "Create my store" }), _jsx(FormErrorSummary, {})] }) }));
+}

package/dist/features/stores/components/StoreGuideHubView.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Package, ShoppingBag, Wallet, Settings, Shield, Headphones, CheckCircle2, Circle, BookOpen, } from "lucide-react";
 import { Div, Grid, Heading, Progress, Row, Section, Stack, Text, TextLink } from "../../../ui/index.js";
+import { SellerStandingPanel } from "./SellerStandingPanel.js";
 import { ROUTES } from "../../../next/routing/route-map.js";
 const CLS_CHECK_ICON = "w-5 h-5 flex-shrink-0 text-emerald-500";
 const CLS_SUCCESS_BOX = "rounded-xl border border-emerald-200 bg-emerald-50 dark:bg-emerald-950/30 dark:border-emerald-800 px-[var(--appkit-space-5)] py-[var(--appkit-space-4)]";
@@ -65,10 +66,22 @@ function buildChecklist(store) {
             done: (store?.shippingConfig?.providers?.length ?? 0) > 0,
             href: String(ROUTES.STORE.SHIPPING_CONFIGS),
         },
+        /*
+         * 🛑 Was "Request verified badge" → a SUPPORT TICKET, and the cast beside
+         * it (`store as StoreDocument & { isVerified?: boolean }`) was the tell
+         * that `isVerified` was not even on the type. Two things were wrong: the
+         * badge was not something to request (an admin grants it after checking
+         * identity, and no ticket category asked for it), and the step it pointed
+         * at could not complete itself.
+         *
+         * The earned tier is a real step with a real destination — the
+         * capabilities guide, where the criteria and the seller's own figures are
+         * both rendered from `SELLER_STANDING_DEFAULTS`.
+         */
         {
-            label: "Request verified badge",
-            done: Boolean(store?.isVerified),
-            href: String(ROUTES.USER.SUPPORT),
+            label: "Earn Trusted Seller status",
+            done: store?.sellerTier === "trusted",
+            href: String(ROUTES.STORE.GUIDE_CAPABILITIES),
         },
     ];
 }
@@ -77,7 +90,7 @@ export function StoreGuideHubView({ store }) {
     const storeName = store?.storeName ?? "Your Store";
     const steps = buildChecklist(store);
     const completedCount = steps.filter((s) => s.done).length;
-    return (_jsxs(Stack, { gap: "xl", padding: "b-2xl", children: [_jsx(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", shadow: "sm", children: _jsxs(Div, { paddingX: "x-md-xl", paddingY: "y-xl", className: "[background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_60%,var(--appkit-color-secondary-400)_100%)]", children: [_jsxs(Row, { className: "mb-3", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", surface: "default", align: "center", justify: "center", rounded: "xl", children: _jsx(BookOpen, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { color: "inverse-muted", className: "tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Seller Guide" })] }), _jsx(Heading, { color: "inverse", level: 1, className: "mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: storeName }), _jsx(Text, { color: "inverse-muted", size: "base", children: "Everything you need to know about selling on LetItRip." })] }) }), _jsxs(Div, { layout: "grid", gap: "8", className: "grid-cols-1 lg:grid-cols-3", children: [_jsxs(Stack, { className: "lg:col-span-2", gap: "md", children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)]", size: "lg", weight: "semibold", children: "Guides" }), _jsx(Grid, { cols: "cardsWide", gap: "md", children: GUIDE_CARDS.map(({ Icon, title, description, href }) => (_jsxs(TextLink, { variant: "bare", href: href, rounded: "xl", layout: "flex-col", gap: "md", paddingX: "lg", paddingY: "lg", shadow: "hover-md", className: "group border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] hover:border-[var(--appkit-color-primary)] transition-all", children: [_jsxs(Row, { align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-9 h-9 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "lg", children: _jsx(Icon, { className: "w-4 h-4 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text)] group-hover:text-[var(--appkit-color-primary)] transition-colors", weight: "semibold", children: title })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] leading-relaxed", size: "sm", children: description }), _jsx(Text, { className: "text-[var(--appkit-color-primary)] mt-auto", size: "xs", weight: "medium", children: "Read guide \u2192" })] }, title))) })] }), _jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)]", size: "lg", weight: "semibold", children: "Getting started" }), _jsxs(Div, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "xl", children: [_jsxs(Div, { className: "px-[1.25rem] pt-[1.25rem] border-b border-[var(--appkit-color-border)]", padding: "b-md", children: [_jsxs(Row, { className: "mb-2", align: "center", justify: "between", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text)]", size: "sm", weight: "medium", children: [completedCount, " of ", steps.length, " complete"] }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "xs", children: [Math.round((completedCount / steps.length) * 100), "%"] })] }), _jsx(Progress, { value: completedCount, max: steps.length, size: "sm", variant: "gradient" })] }), _jsx(Div, { className: "divide-y divide-[var(--appkit-color-border)]", children: steps.map(({ label, done, href }) => (_jsxs(TextLink, { variant: "bare", href: done ? "#" : href, "aria-disabled": done, layout: "flex", align: "center", gap: "sm", paddingX: "lg", paddingY: "sm-tall", size: "sm", className: `transition-colors ${done
+    return (_jsxs(Stack, { gap: "xl", padding: "b-2xl", children: [_jsx(Section, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "2xl", shadow: "sm", children: _jsxs(Div, { paddingX: "x-md-xl", paddingY: "y-xl", className: "[background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_60%,var(--appkit-color-secondary-400)_100%)]", children: [_jsxs(Row, { className: "mb-3", align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-10 h-10", surface: "default", align: "center", justify: "center", rounded: "xl", children: _jsx(BookOpen, { className: "w-5 h-5 text-white" }) }), _jsx(Text, { color: "inverse-muted", className: "tracking-widest", size: "sm", weight: "semibold", transform: "uppercase", children: "Seller Guide" })] }), _jsx(Heading, { color: "inverse", level: 1, className: "mb-2", mdSize: "3xl", size: "2xl", weight: "bold", children: storeName }), _jsx(Text, { color: "inverse-muted", size: "base", children: "Everything you need to know about selling on LetItRip." })] }) }), _jsxs(Div, { layout: "grid", gap: "8", className: "grid-cols-1 lg:grid-cols-3", children: [_jsxs(Stack, { className: "lg:col-span-2", gap: "md", children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)]", size: "lg", weight: "semibold", children: "Guides" }), _jsx(Grid, { cols: "cardsWide", gap: "md", children: GUIDE_CARDS.map(({ Icon, title, description, href }) => (_jsxs(TextLink, { variant: "bare", href: href, rounded: "xl", layout: "flex-col", gap: "md", paddingX: "lg", paddingY: "lg", shadow: "hover-md", className: "group border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] hover:border-[var(--appkit-color-primary)] transition-all", children: [_jsxs(Row, { align: "center", gap: "3", children: [_jsx(Row, { className: "flex-shrink-0 w-9 h-9 [background:linear-gradient(135deg,var(--appkit-color-primary-700)_0%,var(--appkit-color-cobalt)_100%)]", align: "center", justify: "center", rounded: "lg", children: _jsx(Icon, { className: "w-4 h-4 text-white" }) }), _jsx(Text, { className: "text-[var(--appkit-color-text)] group-hover:text-[var(--appkit-color-primary)] transition-colors", weight: "semibold", children: title })] }), _jsx(Text, { className: "text-[var(--appkit-color-text-muted)] leading-relaxed", size: "sm", children: description }), _jsx(Text, { className: "text-[var(--appkit-color-primary)] mt-auto", size: "xs", weight: "medium", children: "Read guide \u2192" })] }, title))) }), _jsx(SellerStandingPanel, { standing: store?.standing, tier: store?.sellerTier, showProgress: true, heading: "Your Trusted Seller standing" })] }), _jsxs(Stack, { gap: "md", children: [_jsx(Heading, { level: 2, className: "text-[var(--appkit-color-text)]", size: "lg", weight: "semibold", children: "Getting started" }), _jsxs(Div, { overflow: "hidden", className: "border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)]", rounded: "xl", children: [_jsxs(Div, { className: "px-[1.25rem] pt-[1.25rem] border-b border-[var(--appkit-color-border)]", padding: "b-md", children: [_jsxs(Row, { className: "mb-2", align: "center", justify: "between", children: [_jsxs(Text, { className: "text-[var(--appkit-color-text)]", size: "sm", weight: "medium", children: [completedCount, " of ", steps.length, " complete"] }), _jsxs(Text, { className: "text-[var(--appkit-color-text-muted)]", size: "xs", children: [Math.round((completedCount / steps.length) * 100), "%"] })] }), _jsx(Progress, { value: completedCount, max: steps.length, size: "sm", variant: "gradient" })] }), _jsx(Div, { className: "divide-y divide-[var(--appkit-color-border)]", children: steps.map(({ label, done, href }) => (_jsxs(TextLink, { variant: "bare", href: done ? "#" : href, "aria-disabled": done, layout: "flex", align: "center", gap: "sm", paddingX: "lg", paddingY: "sm-tall", size: "sm", className: `transition-colors ${done
                                                 ? "cursor-default"
                                                 : "hover:bg-[var(--appkit-color-border)]/30"}`, children: [done ? (_jsx(CheckCircle2, { className: CLS_CHECK_ICON })) : (_jsx(Circle, { className: "w-5 h-5 flex-shrink-0 text-[var(--appkit-color-text-muted)]" })), _jsx(Text, { className: `leading-snug ${done
                                                         ? "line-through text-[var(--appkit-color-text-muted)]"

package/dist/features/stores/components/StoreHeader.js

@@ -4,6 +4,7 @@ import { MediaImage } from "../../media/MediaImage.js";
 import { normalizeRichTextHtml } from "../../../utils/string.formatter.js";
 import { ShareButton } from "../../products/components/ShareButton.js";
 import { SellerTrustBadge } from "../../scams/components/SellerTrustBadge.js";
+import { SellerTierBadge } from "./SellerTierBadge.js";
 import { OwnerQuickActions } from "../../admin/components/OwnerQuickActions.js";
 import { ROUTES } from "../../../next/routing/route-map.js";
 const __O = {
@@ -14,7 +15,7 @@ const CLS_STARS = "inline-flex items-center gap-[var(--appkit-space-1)] text-war
 const CLS_FOLLOW_BTN = "rounded-lg border border-warning px-[var(--appkit-space-4)] py-[var(--appkit-space-2)] text-[length:var(--appkit-text-sm)] font-medium text-warning hover:bg-warning-surface transition-colors";
 const CLS_WARN_BANNER = "mt-3 rounded-lg bg-warning-surface dark:bg-warning-surface border border-warning dark:border-warning px-[var(--appkit-space-3)] py-[var(--appkit-space-2)] text-[length:var(--appkit-text-sm)] text-warning dark:text-warning";
 export function StoreHeader({ store, labels = {}, onFollow, className = "", trust, }) {
-    return (_jsxs(Section, { surface: "default", border: "bottom", className: className, children: [store.storeBannerURL && (_jsx(Div, { className: `relative h-40 md:h-56 ${__O.hidden} bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-surface-elevated)]`, children: _jsx(MediaImage, { src: store.storeBannerURL, alt: `${store.storeName} banner`, size: "banner" }) })), _jsxs(Div, { paddingX: "x-page", className: "max-w-7xl mx-auto", padding: "y-md", children: [_jsxs(Row, { align: "end", gap: "md", children: [store.storeLogoURL ? (_jsx(Div, { className: "relative -mt-8 h-16 w-16 border-2 border-white", rounded: "xl", shadow: "sm", overflow: "hidden", children: _jsx(MediaImage, { src: store.storeLogoURL, alt: store.storeName, size: "avatar" }) })) : (_jsx(Div, { className: CLS_AVATAR, children: store.storeName[0]?.toUpperCase() })), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Row, { className: "mb-0.5", align: "center", gap: "sm", wrap: true, children: [_jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)]", size: "xl", weight: "bold", children: store.storeName }), store.averageRating != null && store.averageRating > 0 && (_jsxs(Span, { size: "sm", weight: "medium", className: CLS_STARS, children: ["\u2605 ", store.averageRating.toFixed(1)] })), trust && _jsx(SellerTrustBadge, { trust: trust })] }), _jsx(OwnerQuickActions, { resource: "STORE", placement: "detail", editHref: String(ROUTES.ADMIN.STORE_DETAIL(store.storeSlug)), recordLabel: store.storeName }), _jsxs(Row, { textSize: "xs", className: "text-[var(--appkit-color-text-muted)] mb-0.5", gap: "3", children: [store.category && _jsx(Span, { transform: "capitalize", children: store.category }), store.totalProducts != null && store.totalProducts > 0 && (_jsxs(Span, { children: [store.totalProducts, " ", labels.products ?? "products"] })), store.totalReviews != null && store.totalReviews > 0 && (_jsxs(Span, { children: [store.totalReviews, " ", labels.reviews ?? "reviews"] })), store.itemsSold != null && store.itemsSold > 0 && (_jsxs(Span, { children: [store.itemsSold, " ", labels.sold ?? "sold"] }))] }), store.storeDescription && (_jsx(RichText, { html: normalizeRichTextHtml(store.storeDescription), copyableCode: true, className: "mt-0.5" }))] }), _jsxs(Row, { gap: "sm", align: "center", className: "shrink-0", children: [_jsx(ShareButton, { title: store.storeName }), onFollow && (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onFollow(store.storeSlug), className: CLS_FOLLOW_BTN, children: labels.follow ?? "Follow" }))] })] }), store.isVacationMode && (_jsx(Text, { className: CLS_WARN_BANNER, children: store.vacationMessage ??
+    return (_jsxs(Section, { surface: "default", border: "bottom", className: className, children: [store.storeBannerURL && (_jsx(Div, { className: `relative h-40 md:h-56 ${__O.hidden} bg-[var(--appkit-color-surface)] bg-[var(--appkit-color-surface-elevated)]`, children: _jsx(MediaImage, { src: store.storeBannerURL, alt: `${store.storeName} banner`, size: "banner" }) })), _jsxs(Div, { paddingX: "x-page", className: "max-w-7xl mx-auto", padding: "y-md", children: [_jsxs(Row, { align: "end", gap: "md", children: [store.storeLogoURL ? (_jsx(Div, { className: "relative -mt-8 h-16 w-16 border-2 border-white", rounded: "xl", shadow: "sm", overflow: "hidden", children: _jsx(MediaImage, { src: store.storeLogoURL, alt: store.storeName, size: "avatar" }) })) : (_jsx(Div, { className: CLS_AVATAR, children: store.storeName[0]?.toUpperCase() })), _jsxs(Div, { className: "flex-1 min-w-0", children: [_jsxs(Row, { className: "mb-0.5", align: "center", gap: "sm", wrap: true, children: [_jsx(Heading, { level: 1, className: "text-[var(--appkit-color-text)]", size: "xl", weight: "bold", children: store.storeName }), store.averageRating != null && store.averageRating > 0 && (_jsxs(Span, { size: "sm", weight: "medium", className: CLS_STARS, children: ["\u2605 ", store.averageRating.toFixed(1)] })), _jsx(SellerTierBadge, { isVerified: store.isVerified, sellerTier: store.sellerTier, href: String(ROUTES.PUBLIC.HELP_SELLER_BADGES) }), trust && _jsx(SellerTrustBadge, { trust: trust })] }), _jsx(OwnerQuickActions, { resource: "STORE", placement: "detail", editHref: String(ROUTES.ADMIN.STORE_DETAIL(store.storeSlug)), recordLabel: store.storeName }), _jsxs(Row, { textSize: "xs", className: "text-[var(--appkit-color-text-muted)] mb-0.5", gap: "3", children: [store.category && _jsx(Span, { transform: "capitalize", children: store.category }), store.totalProducts != null && store.totalProducts > 0 && (_jsxs(Span, { children: [store.totalProducts, " ", labels.products ?? "products"] })), store.totalReviews != null && store.totalReviews > 0 && (_jsxs(Span, { children: [store.totalReviews, " ", labels.reviews ?? "reviews"] })), store.itemsSold != null && store.itemsSold > 0 && (_jsxs(Span, { children: [store.itemsSold, " ", labels.sold ?? "sold"] }))] }), store.storeDescription && (_jsx(RichText, { html: normalizeRichTextHtml(store.storeDescription), copyableCode: true, className: "mt-0.5" }))] }), _jsxs(Row, { gap: "sm", align: "center", className: "shrink-0", children: [_jsx(ShareButton, { title: store.storeName }), onFollow && (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onFollow(store.storeSlug), className: CLS_FOLLOW_BTN, children: labels.follow ?? "Follow" }))] })] }), store.isVacationMode && (_jsx(Text, { className: CLS_WARN_BANNER, children: store.vacationMessage ??
                             labels.vacationMode ??
                             "Store is on vacation mode" }))] })] }));
 }

package/dist/features/stores/repository/store.repository.js

@@ -149,6 +149,29 @@ export class StoreRepository extends BaseRepository {
             // Auto-set isPublic when approved
             ...(status === StoreStatusValues.ACTIVE && { isPublic: true }),
             ...(status !== StoreStatusValues.ACTIVE && { isPublic: false }),
+            /*
+             * 🛑 LEAVING `active` REVOKES TRUST IMMEDIATELY — and this cannot
+             * wait for the monthly recompute.
+             *
+             * `trustedSeller` means the store is paid at SHIPPING rather than at
+             * delivery, so a suspended store that kept the flag would go on
+             * being paid before parcels land for up to 31 days, on a decision
+             * the suspension has just reversed. `sellerStandingRollup` caches
+             * its verdict monthly; this is the one place that cache must not be
+             * trusted.
+             *
+             * Both fields are tracked, so the clear earns its own timeline
+             * entry alongside the status change. Re-granting is NOT automatic on
+             * re-activation: the next month-end run decides, which is the
+             * correct direction for a flag that moves money.
+             *
+             * `extra` is spread AFTER, so an admin explicitly setting a tier in
+             * the same request still wins — the override stays authoritative.
+             */
+            ...(status !== StoreStatusValues.ACTIVE && {
+                trustedSeller: false,
+                sellerTier: "seller",
+            }),
             ...extra,
             updatedAt: new Date(),
         }, ctx, "setStatus"));

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

@@ -5,6 +5,7 @@
  * and helpers for the stores feature.
  */
 import type { StatusChangeEntry } from "../../../_internal/shared/history/types";
+import type { SellerTier, SellerStandingCriterion } from "../../../_internal/shared/features/seller-standing/config";
 import type { StoreCapability } from "../../auth/permissions/constants";
 import type { BaseDocument } from "../../../_internal/shared/types/base-document";
 export type ShippingProviderType = "self-courier" | "store-pickup" | "custom";
@@ -141,6 +142,61 @@ export interface StoreDocument extends BaseDocument {
      * payout.
      */
     trustedSeller?: boolean;
+    /**
+     * The EARNED, PUBLIC tier.
+     *
+     * 🛑 Deliberately a second field rather than reusing `trustedSeller`, which
+     * means "paid at shipping" and is private by design (see directly above —
+     * "A store does not get to display that we trust it"). The monthly rollup
+     * writes BOTH together on a transition: `sellerTier` is what a buyer sees,
+     * `trustedSeller` is what the payout sweep reads. Collapsing them into one
+     * field would either leak the risk posture into the public projection or
+     * make the badge unrenderable.
+     *
+     * Absent means `"seller"`. There is no `"pending"` — a store that has not
+     * earned the tier simply has the base one.
+     */
+    sellerTier?: SellerTier;
+    /**
+     * The cached standing computation behind `sellerTier`.
+     *
+     * 🛑 This IS the cache. It is recomputed by `sellerStandingRollup` on the
+     * last day of each month and read straight off the store document by the
+     * seller's progress panel, the badge and the admin view — none of which
+     * recompute anything. `computedAt` / `nextComputeAt` are rendered to the
+     * seller, because without them a seller who shipped twenty orders this week
+     * will read an unchanged panel as broken rather than as monthly.
+     *
+     * Metrics only — no buyer uids, no addresses, nothing that could make this
+     * a PII store. The address criterion is counted from HMAC fingerprints and
+     * only the COUNT is kept.
+     */
+    standing?: {
+        computedAt: Date | string;
+        nextComputeAt?: Date | string;
+        windowDays: number;
+        deliveredOrders: number;
+        distinctBuyers: number;
+        distinctAddresses: number;
+        ratedOrders: number;
+        averageRating: number;
+        met: Record<SellerStandingCriterion, boolean>;
+    };
+    /**
+     * An admin set `sellerTier` by hand; the monthly rollup must not move it.
+     *
+     * 🛑 TOP-LEVEL, not a key inside `standing`, and the distinction is the
+     * point: `standing` is a MEASUREMENT — every field in it is recomputed from
+     * scratch each month — while this is a DECISION that must outlive the
+     * measurement. Nesting it meant a store could not be pinned without also
+     * fabricating a metrics block, which is why the platform store's seed could
+     * not express "trusted, don't touch" without inventing figures nobody had
+     * measured.
+     *
+     * PRIVATE. It tells a buyer nothing about the goods or the seller; it is a
+     * note about how we administer this record.
+     */
+    tierLockedByAdmin?: boolean;
     /** Reason recorded when `status` is set to "suspended". */
     suspensionReason?: string;
     stats?: {
@@ -381,7 +437,7 @@ export interface StoreDocument extends BaseDocument {
  * the store owner or the public, and `statusHistory` rides on the store
  * document the owner can read.
  */
-export declare const STORE_TRACKED_FIELDS: readonly ["status", "isPublic", "isVerified", "isFeatured", "suspensionReason", "capabilities"];
+export declare const STORE_TRACKED_FIELDS: readonly ["status", "isPublic", "isVerified", "isFeatured", "suspensionReason", "capabilities", "sellerTier", "trustedSeller"];
 /**
  * PII on this document, for `withHistory`'s scrub. `whatsappConfig.accessToken`
  * is a live Meta credential; `mapDoc` decrypts it on EVERY read, so it is
@@ -418,6 +474,9 @@ export declare const STORE_FIELDS: {
     readonly IS_FEATURED: "isFeatured";
     readonly IS_VERIFIED: "isVerified";
     readonly TRUSTED_SELLER: "trustedSeller";
+    readonly SELLER_TIER: "sellerTier";
+    readonly STANDING: "standing";
+    readonly TIER_LOCKED_BY_ADMIN: "tierLockedByAdmin";
     readonly SUSPENSION_REASON: "suspensionReason";
     readonly CAPABILITIES: "capabilities";
     readonly STATUS_VALUES: {

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

@@ -31,6 +31,21 @@ export const STORE_TRACKED_FIELDS = [
     "isFeatured",
     "suspensionReason",
     "capabilities",
+    /*
+     * Both halves of the trust decision are tracked, and both matter for
+     * different reasons. `sellerTier` is what the seller and every buyer saw, so
+     * "when did I lose the badge" has an answer. `trustedSeller` moves MONEY —
+     * it is the flag that pays this store before delivery — so the timeline is
+     * the record of when the platform started and stopped carrying that risk,
+     * alongside the `STORE_TRUST_CHANGE` audit row that names who decided it.
+     *
+     * 🛑 `standing` is deliberately NOT tracked. It is recomputed in full every
+     * month, so every field inside it changes on every run; tracking it would
+     * write a diff of five numbers monthly and exhaust the 50-entry FIFO cap
+     * within four years while burying the two transitions anyone reads.
+     */
+    "sellerTier",
+    "trustedSeller",
 ];
 /**
  * PII on this document, for `withHistory`'s scrub. `whatsappConfig.accessToken`
@@ -72,6 +87,9 @@ export const STORE_FIELDS = {
     IS_FEATURED: "isFeatured",
     IS_VERIFIED: "isVerified",
     TRUSTED_SELLER: "trustedSeller",
+    SELLER_TIER: "sellerTier",
+    STANDING: "standing",
+    TIER_LOCKED_BY_ADMIN: "tierLockedByAdmin",
     SUSPENSION_REASON: "suspensionReason",
     CAPABILITIES: "capabilities",
     STATUS_VALUES: {

package/dist/features/stores/schemas/index.d.ts

@@ -616,10 +616,10 @@ export declare const storeListItemSchema: z.ZodObject<{
     storeDescription?: string | undefined;
     storeLogoURL?: string | undefined;
     storeBannerURL?: string | undefined;
+    averageRating?: number | undefined;
     totalProducts?: number | undefined;
     itemsSold?: number | undefined;
     totalReviews?: number | undefined;
-    averageRating?: number | undefined;
 }, {
     status: string;
     id: string;
@@ -632,10 +632,10 @@ export declare const storeListItemSchema: z.ZodObject<{
     storeDescription?: string | undefined;
     storeLogoURL?: string | undefined;
     storeBannerURL?: string | undefined;
+    averageRating?: number | undefined;
     totalProducts?: number | undefined;
     itemsSold?: number | undefined;
     totalReviews?: number | undefined;
-    averageRating?: number | undefined;
 }>;
 export declare const storeListParamsSchema: z.ZodObject<{
     category: z.ZodOptional<z.ZodString>;

package/dist/features/stores/schemas/store-create.d.ts

@@ -0,0 +1,47 @@
+/**
+ * The store-creation input contract — ONE definition, shared by the form and
+ * the server action that writes it.
+ *
+ * 🛑 Why this file exists at all. `createStoreAction` carried its own inline
+ * `z.object({ storeName, storeDescription, storeCategory })` while nothing
+ * rendered a form, so there was exactly one copy and no drift. The moment a
+ * form exists there are two places that must agree about "2–80 characters",
+ * and a client that validates more loosely than the server produces a form
+ * that submits and then fails with a message pointing at no field; a client
+ * that validates more strictly refuses input the server would have accepted.
+ * Both are Root Cause #75's shape. The action imports this; it does not
+ * restate it.
+ *
+ * The bounds are not new — they are lifted verbatim from the action's own
+ * schema so this is a move, not a retune.
+ */
+import { z } from "zod";
+/**
+ * 🛑 `.or(z.literal(""))` on both optional fields, matching the action.
+ *
+ * An untouched text input submits `""`, not `undefined`. A bare
+ * `.max(80).optional()` rejects it, so a seller who filled in only the
+ * required name would be refused for leaving an optional field alone — which
+ * reads as a broken form, because the field they are being blocked on is one
+ * they were told was optional.
+ */
+export declare const storeCreateSchema: z.ZodObject<{
+    storeName: z.ZodString;
+    storeDescription: z.ZodUnion<[z.ZodOptional<z.ZodString>, z.ZodLiteral<"">]>;
+    storeCategory: z.ZodUnion<[z.ZodOptional<z.ZodString>, z.ZodLiteral<"">]>;
+}, "strip", z.ZodTypeAny, {
+    storeName: string;
+    storeCategory?: string | undefined;
+    storeDescription?: string | undefined;
+}, {
+    storeName: string;
+    storeCategory?: string | undefined;
+    storeDescription?: string | undefined;
+}>;
+export type StoreCreateInput = z.infer<typeof storeCreateSchema>;
+/** Field names, so a form and an error path cannot disagree by typo. */
+export declare const STORE_CREATE_FIELDS: {
+    readonly STORE_NAME: "storeName";
+    readonly STORE_DESCRIPTION: "storeDescription";
+    readonly STORE_CATEGORY: "storeCategory";
+};

package/dist/features/stores/schemas/store-create.js

@@ -0,0 +1,86 @@
+/**
+ * The store-creation input contract — ONE definition, shared by the form and
+ * the server action that writes it.
+ *
+ * 🛑 Why this file exists at all. `createStoreAction` carried its own inline
+ * `z.object({ storeName, storeDescription, storeCategory })` while nothing
+ * rendered a form, so there was exactly one copy and no drift. The moment a
+ * form exists there are two places that must agree about "2–80 characters",
+ * and a client that validates more loosely than the server produces a form
+ * that submits and then fails with a message pointing at no field; a client
+ * that validates more strictly refuses input the server would have accepted.
+ * Both are Root Cause #75's shape. The action imports this; it does not
+ * restate it.
+ *
+ * The bounds are not new — they are lifted verbatim from the action's own
+ * schema so this is a move, not a retune.
+ */
+import { z } from "zod";
+import { annotate } from "../../shell/field-ui-meta.js";
+/**
+ * 🛑 `.or(z.literal(""))` on both optional fields, matching the action.
+ *
+ * An untouched text input submits `""`, not `undefined`. A bare
+ * `.max(80).optional()` rejects it, so a seller who filled in only the
+ * required name would be refused for leaving an optional field alone — which
+ * reads as a broken form, because the field they are being blocked on is one
+ * they were told was optional.
+ */
+/*
+ * 🛑 ANNOTATED, and the annotations do not change what this parses.
+ *
+ * `annotate()` returns the same schema and registers its UI metadata in a side
+ * registry, so the server action validates exactly what it validated before.
+ * That is what lets ONE schema drive both the form's sections
+ * (`buildSectionsFromSchema`) and the server-side parse — the alternative is a
+ * second form-only schema, which is the drift this file exists to prevent.
+ *
+ * One section, because there is one: a store has a name, what it sells, and a
+ * category. `audit-form-sectionised` requires the fields to live in a section
+ * engine rather than a bare `<Form>`, which is also what gets this step the
+ * pinned mobile action bar every other form in the app has.
+ */
+export const storeCreateSchema = z.object({
+    storeName: annotate(z
+        .string()
+        .min(2, "Store name must be at least 2 characters")
+        .max(80, "Store name must be 80 characters or fewer"), {
+        section: "store",
+        sectionLabel: "Your store",
+        sectionRequired: true,
+        quick: true,
+        order: 1,
+        row: "full",
+        label: "Store name",
+        help: "Buyers see this. It also forms your store's web address.",
+    }),
+    storeDescription: annotate(z
+        .string()
+        .max(10000, "Description must be 10,000 characters or fewer")
+        .optional()
+        .or(z.literal("")), {
+        section: "store",
+        order: 2,
+        row: "full",
+        kind: "textarea",
+        label: "What do you sell?",
+        help: "Optional. A short introduction for your storefront page.",
+    }),
+    storeCategory: annotate(z
+        .string()
+        .max(80, "Category must be 80 characters or fewer")
+        .optional()
+        .or(z.literal("")), {
+        section: "store",
+        order: 3,
+        row: "full",
+        label: "Main category",
+        help: "Optional. Helps buyers browsing that category find your store.",
+    }),
+});
+/** Field names, so a form and an error path cannot disagree by typo. */
+export const STORE_CREATE_FIELDS = {
+    STORE_NAME: "storeName",
+    STORE_DESCRIPTION: "storeDescription",
+    STORE_CATEGORY: "storeCategory",
+};

package/dist/features/stores/types/index.d.ts

@@ -1,4 +1,5 @@
 import type { ListingType } from "../../products/types";
+import type { SellerTier, SellerStandingCriterion } from "../../../_internal/shared/features/seller-standing/config";
 export interface StoreListItem {
     id: string;
     storeSlug: string;
@@ -43,8 +44,49 @@ export interface StoreListItem {
      */
     sharedPurchaseHandlingFee?: number;
     sharedPurchaseExtraShippingPerDestination?: number;
+    /**
+     * Seller trust, as a buyer sees it.
+     *
+     * 🛑 Neither is optional, for the same reason as the flags above: the
+     * projection resolves absence (`?? false` / `?? "seller"`), so no client has
+     * to decide what `undefined` means. A badge component testing `!== "seller"`
+     * on an undefined value would render a TRUSTED badge on a store that has
+     * earned nothing.
+     *
+     * 🛑 There is deliberately no `trustedSeller` here and there must never be.
+     * That field means "we pay this store before delivery" — our risk posture,
+     * not an endorsement — and it is in `PRIVATE_STORE_FIELDS` for that reason.
+     */
+    isVerified: boolean;
+    sellerTier: SellerTier;
+    /**
+     * The cached standing metrics behind `sellerTier`, when they have ever been
+     * computed.
+     *
+     * OPTIONAL, unlike the two above, and that asymmetry is the point: absent
+     * means "never measured", which the seller's panel must render differently
+     * from a measured zero. Defaulting it would turn "we have not looked yet"
+     * into a confident "0 of 25".
+     */
+    standing?: SellerStandingSnapshot;
     createdAt?: string;
 }
+/**
+ * The public half of `StoreDocument.standing` — counts and a mean, nothing
+ * that identifies a buyer. The address criterion is counted from HMAC
+ * fingerprints and only the count is kept.
+ */
+export interface SellerStandingSnapshot {
+    computedAt: Date | string;
+    nextComputeAt?: Date | string;
+    windowDays: number;
+    deliveredOrders: number;
+    distinctBuyers: number;
+    distinctAddresses: number;
+    ratedOrders: number;
+    averageRating: number;
+    met: Record<SellerStandingCriterion, boolean>;
+}
 export interface StoreDetail extends StoreListItem {
     bio?: string;
     location?: string;

package/dist/next/routing/route-map.d.ts

@@ -71,6 +71,7 @@ export declare const DEFAULT_ROUTE_MAP: {
         readonly HELP_AUCTIONS: "/help/auctions";
         readonly HELP_ORDERS: "/help/orders";
         readonly HELP_ACCOUNT: "/help/account";
+        readonly HELP_SELLER_BADGES: "/help/seller-badges";
         readonly CREDITS: "/credits";
         readonly TERMS: "/terms";
         readonly PRIVACY: "/privacy";
@@ -581,6 +582,7 @@ export declare const ROUTES: {
         readonly HELP_AUCTIONS: "/help/auctions";
         readonly HELP_ORDERS: "/help/orders";
         readonly HELP_ACCOUNT: "/help/account";
+        readonly HELP_SELLER_BADGES: "/help/seller-badges";
         readonly CREDITS: "/credits";
         readonly TERMS: "/terms";
         readonly PRIVACY: "/privacy";
@@ -1123,6 +1125,6 @@ export declare const SELLER_ROUTES: {
     readonly GUIDE_CAPABILITIES: "/store/guide/capabilities";
     readonly GUIDE_SETTINGS: "/store/guide/settings";
 };
-export declare const PUBLIC_ROUTES: readonly ["/", string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, "/unauthorized", "/auth/login", "/auth/register", "/auth/forgot-password", "/auth/reset-password", "/auth/verify-email"];
+export declare const PUBLIC_ROUTES: readonly ["/", string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, "/unauthorized", "/auth/login", "/auth/register", "/auth/forgot-password", "/auth/reset-password", "/auth/verify-email"];
 export declare const PROTECTED_ROUTES: readonly [string, string, string, string, string, string, string];
 export declare const AUTH_ROUTES: readonly ["/auth/login", "/auth/register"];