@mohasinac/appkit 4.57.0 → 4.58.0

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

@@ -0,0 +1,45 @@
+/**
+ * ReferenceRecordEditor — correct one row of a GENERATED reference database.
+ *
+ * ── 🛑 ONE COMPONENT, TWO FIELD LISTS ────────────────────────────────────
+ *
+ * Parts and beys differ only in WHICH fields a human may own. Loading the row,
+ * PATCHing it, surfacing a server error on the right field, and telling the
+ * operator what a correction means for the next reseed are identical — so they
+ * are written once. The Duplication Framework's "same prop surface, same
+ * return shape" test points here, and the alternative was two files whose
+ * error handling would drift.
+ *
+ * ── 🛑 WHAT THIS DELIBERATELY IS NOT ─────────────────────────────────────
+ *
+ * It is not a create form. Both collections are generated, so a row authored
+ * by hand has no source and vanishes on the next regeneration. There is no
+ * code path here that POSTs.
+ *
+ * It also shows no DERIVED field as editable. A bey's summed mass, its ratings
+ * and its coverage records are computed from the composition and each carries a
+ * coverage claim; a hand-typed derived value is a number whose stated
+ * provenance is no longer true.
+ *
+ * @tag domain:admin
+ * @tag layer:feature
+ * @tag access:client
+ */
+import React from "react";
+/** One editable field. `kind` picks the input, nothing more. */
+export interface ReferenceEditorField {
+    name: string;
+    label: string;
+    kind?: "text" | "number";
+    hint?: string;
+}
+export interface ReferenceRecordEditorProps {
+    /** `ADMIN_ENDPOINTS.PART_BY_ID(id)` / `BEY_BY_ID(id)` — already applied. */
+    endpoint: string;
+    /** What the record is called, for copy. "part" / "Beyblade". */
+    noun: string;
+    fields: readonly ReferenceEditorField[];
+    /** Where the reference page for this record lives, so the operator can check their work. */
+    publicHref?: string;
+}
+export declare function ReferenceRecordEditor({ endpoint, noun, fields, publicHref, }: ReferenceRecordEditorProps): React.JSX.Element;

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

@@ -0,0 +1,153 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ReferenceRecordEditor — correct one row of a GENERATED reference database.
+ *
+ * ── 🛑 ONE COMPONENT, TWO FIELD LISTS ────────────────────────────────────
+ *
+ * Parts and beys differ only in WHICH fields a human may own. Loading the row,
+ * PATCHing it, surfacing a server error on the right field, and telling the
+ * operator what a correction means for the next reseed are identical — so they
+ * are written once. The Duplication Framework's "same prop surface, same
+ * return shape" test points here, and the alternative was two files whose
+ * error handling would drift.
+ *
+ * ── 🛑 WHAT THIS DELIBERATELY IS NOT ─────────────────────────────────────
+ *
+ * It is not a create form. Both collections are generated, so a row authored
+ * by hand has no source and vanishes on the next regeneration. There is no
+ * code path here that POSTs.
+ *
+ * It also shows no DERIVED field as editable. A bey's summed mass, its ratings
+ * and its coverage records are computed from the composition and each carries a
+ * coverage claim; a hand-typed derived value is a number whose stated
+ * provenance is no longer true.
+ *
+ * @tag domain:admin
+ * @tag layer:feature
+ * @tag access:client
+ */
+import React from "react";
+import { Alert, Button, Form, FieldInput, Stack, Text, TextLink } from "../../../ui/index.js";
+import { apiClient } from "../../../http/index.js";
+import { useToast } from "../../../ui/components/toast-context.js";
+import { normalizeError } from "../../../errors/normalize.js";
+import { toUserMessage } from "../../../errors/error-display-map.js";
+export function ReferenceRecordEditor({ endpoint, noun, fields, publicHref, }) {
+    const { showToast } = useToast();
+    const [values, setValues] = React.useState({});
+    const [owned, setOwned] = React.useState([]);
+    const [loading, setLoading] = React.useState(true);
+    const [saving, setSaving] = React.useState(false);
+    const [loadError, setLoadError] = React.useState(null);
+    React.useEffect(() => {
+        let cancelled = false;
+        (async () => {
+            try {
+                const row = await apiClient.get(endpoint);
+                if (cancelled)
+                    return;
+                const next = {};
+                for (const f of fields) {
+                    const v = row?.[f.name];
+                    /*
+                     * 🛑 An ABSENT field becomes an empty string, not "undefined". Both
+                     * render, and only one of them is honest — and on save an empty
+                     * string is dropped rather than written, so an untouched empty field
+                     * cannot blank a value the generator owns.
+                     */
+                    next[f.name] = v === null || v === undefined ? "" : String(v);
+                }
+                setValues(next);
+                setOwned(Array.isArray(row?.adminEditedFields) ? row.adminEditedFields : []);
+            }
+            catch (err) {
+                const e = normalizeError(err);
+                if (!cancelled)
+                    setLoadError(e.message);
+            }
+            finally {
+                if (!cancelled)
+                    setLoading(false);
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [endpoint, fields]);
+    /**
+     * Build the PATCH body.
+     *
+     * 🛑 Only NON-EMPTY values are sent, and numbers are coerced.
+     *
+     * An empty input means "I did not set this", not "write an empty string".
+     * Sending it would both blank a real value AND mark the field as
+     * admin-owned, freezing the blank in place against every future reseed —
+     * a one-click way to permanently delete data from a generated row.
+     */
+    const buildPatch = React.useCallback(() => {
+        const patch = {};
+        for (const f of fields) {
+            const raw = (values[f.name] ?? "").trim();
+            if (!raw)
+                continue;
+            patch[f.name] = f.kind === "number" ? Number(raw) : raw;
+        }
+        return patch;
+    }, [fields, values]);
+    /**
+     * Put a failure where the operator can act on it.
+     *
+     * 🛑 Zod issues go to their OWN FIELD; everything else becomes one toast
+     * built by `toUserMessage`. Never the server's own message: a raw fallback
+     * is what rendered a Node MODULE_NOT_FOUND with a full require stack inside
+     * a bid modal (Root Cause #86), and `mapToHttpError` scrubs 5xx text in
+     * production anyway.
+     */
+    const reportFailure = React.useCallback((err, 
+    /** Already normalized by the caller — see the note at the catch site. */
+    fallbackMessage, setFieldError) => {
+        const issues = err?.issues;
+        if (issues?.length) {
+            for (const issue of issues)
+                setFieldError(String(issue.path?.[0] ?? ""), issue.message);
+            return;
+        }
+        const code = err?.code;
+        const message = code ? toUserMessage(code, undefined) : fallbackMessage;
+        showToast(message, "error");
+    }, [showToast]);
+    const save = React.useCallback(async (setFieldError, clearErrors) => {
+        clearErrors();
+        setSaving(true);
+        try {
+            await apiClient.patch(endpoint, buildPatch());
+            showToast(`${noun[0].toUpperCase()}${noun.slice(1)} updated.`, "success");
+        }
+        catch (err) {
+            const e = normalizeError(err);
+            reportFailure(err, e.message, setFieldError);
+        }
+        finally {
+            setSaving(false);
+        }
+    }, [endpoint, buildPatch, noun, showToast, reportFailure]);
+    if (loading)
+        return _jsx(Text, { color: "muted", children: "Loading\u2026" });
+    if (loadError) {
+        return (_jsx(Alert, { variant: "error", title: `Could not load this ${noun}`, children: _jsx(Text, { size: "sm", children: loadError }) }));
+    }
+    /*
+     * 🛑 No `className` on `<Form>` — the `<Stack gap="md">` inside already owns
+     * the spacing, so `space-y-4` was a second, competing source of it
+     * (audit-variant-prop-coverage: a layout token belongs in a variant prop).
+     *
+     * 🛑 And this is a PLAIN comment, above the `return`, not a `{/* … *␣/}` JSX
+     * one below it. I wrote it as JSX first and it broke the parse: a JSX comment
+     * between `return (` and the root element is a second expression, so the
+     * return has two children and no wrapper. `tsc` caught it — the first
+     * typecheck this session was allowed to run — which is exactly the class of
+     * error the 4 GB no-build cap was hiding.
+     */
+    return (_jsx(Form, { children: ({ setFieldError, clearErrors }) => (_jsxs(Stack, { gap: "md", className: "min-w-0", children: [_jsxs(Alert, { variant: "info", title: "This record is generated", children: [_jsxs(Text, { size: "sm", children: [`This ${noun} is built from a crawled source by a committed generator. A field you `, "change here is marked as yours and will not be overwritten the next time the database is regenerated \u2014 every field you leave alone keeps getting the generator's improvements."] }), owned.length > 0 && (_jsx(Text, { size: "sm", color: "muted", children: `Already corrected by hand: ${owned.join(", ")}` }))] }), fields.map((f) => (_jsx(FieldInput, { name: f.name, label: f.label, type: f.kind === "number" ? "number" : "text", hint: f.hint, value: values[f.name] ?? "", onChange: (v) => setValues((p) => ({ ...p, [f.name]: v })) }, f.name))), _jsx(Button, { type: "button", isLoading: saving, onClick: () => save(setFieldError, clearErrors), children: "Save correction" }), publicHref && (_jsx(Text, { size: "sm", color: "muted", children: _jsx(TextLink, { href: publicHref, children: "View the public reference page" }) }))] })) }));
+}

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

@@ -73,7 +73,7 @@ export type NotificationUpdateInput = Partial<Pick<NotificationDocument, "isRead
 export declare const notificationQueryHelpers: {
     readonly byUser: (userId: string) => readonly ["userId", "==", string];
     readonly unread: (userId: string) => readonly [readonly ["userId", "==", string], readonly ["isRead", "==", false]];
-    readonly byType: (type: NotificationType) => readonly ["type", "==", "welcome" | "promotion" | "order_placed" | "order_confirmed" | "order_shipped" | "order_delivered" | "order_cancelled" | "bid_placed" | "bid_outbid" | "bid_won" | "bid_lost" | "auction_ended" | "review_approved" | "review_replied" | "product_available" | "system" | "account_action" | "support_ticket_update" | "scam_report_update" | "offer_received" | "offer_responded" | "offer_expired" | "offer_counter_accepted" | "refund_initiated" | "prize_won" | "prize_reveal_expired" | "emi_installment_due_soon" | "emi_installment_overdue" | "payment_review" | "catalogue_images_stale" | "message_received"];
+    readonly byType: (type: NotificationType) => readonly ["type", "==", "system" | "welcome" | "promotion" | "order_placed" | "order_confirmed" | "order_shipped" | "order_delivered" | "order_cancelled" | "bid_placed" | "bid_outbid" | "bid_won" | "bid_lost" | "auction_ended" | "review_approved" | "review_replied" | "product_available" | "account_action" | "support_ticket_update" | "scam_report_update" | "offer_received" | "offer_responded" | "offer_expired" | "offer_counter_accepted" | "refund_initiated" | "prize_won" | "prize_reveal_expired" | "emi_installment_due_soon" | "emi_installment_overdue" | "payment_review" | "catalogue_images_stale" | "message_received"];
 };
 export interface TrustBarItem {
     icon: string;

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

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ProductOwnerQuickActions } from "../../products/components/ProductOwnerQuickActions.js";
 import { normalizeError } from "../../../errors/normalize.js";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useRouter } from "next/navigation.js";
@@ -181,11 +182,23 @@ export function MarketplaceAuctionCard({ product, buyoutPrice, className = "", v
         countdownClass, mergedLabels, handleWishlist, handleNavigate,
     };
     const card = (_jsxs(BaseListingCard, { isSelected: isSelected, isDisabled: isEnded, variant: baseVariant, className: className, onMouseDown: !isSelected ? longPress.onMouseDown : undefined, onMouseUp: !isSelected ? longPress.onMouseUp : undefined, onMouseLeave: !isSelected ? longPress.onMouseLeave : undefined, onTouchStart: !isSelected ? longPress.onTouchStart : undefined, onTouchEnd: !isSelected ? longPress.onTouchEnd : undefined, onTouchCancel: !isSelected ? longPress.onTouchCancel : undefined, children: [renderAuctionCardHero({ product, auctionHref, currentSrc, hovered, images, imageIndex, hasVideo, isEnded, isEndingSoon, isSelected, selectable, mergedLabels, onSelect, setHovered, handleSelect }), _jsx(BaseListingCard.Info, { variant: baseVariant, children: baseVariant === "list" ? renderAuctionCardInfoList(cardInfoProps) : renderAuctionCardInfoGrid(cardInfoProps) })] }));
-    if (!renderOwnerActions)
+    /*
+     * 🛑 Default, not opt-in. Nothing in either repo ever passed
+     * `renderOwnerActions`, so this toolbar was unreachable on every grid that
+     * mounts this card (Root Cause #8 — a slot shell rendered with zero render
+     * props). A card is resource-specific by construction, so it names its own
+     * resource rather than being threaded one; the prop stays as an override.
+     */
+    const ownerActions = renderOwnerActions
+        ? renderOwnerActions()
+        : product.id
+            ? (_jsx(ProductOwnerQuickActions, { productId: String(product.id), storeId: product.storeId ? String(product.storeId) : undefined, recordLabel: product.title, placement: "card" }))
+            : null;
+    if (!ownerActions)
         return card;
     /*
      * Sibling of the card, never a child — see the prop's docstring. `z-20`
      * clears this card's own overlays, which all sit at `z-10`.
      */
-    return (_jsxs(Div, { className: "relative h-full", children: [card, _jsx(Div, { className: "absolute right-2 bottom-2 z-20", children: renderOwnerActions() })] }));
+    return (_jsxs(Div, { className: "relative h-full", children: [card, _jsx(Div, { className: "absolute right-2 bottom-2 z-20", children: ownerActions })] }));
 }

package/dist/features/auth/permissions/constants.d.ts

@@ -11,7 +11,7 @@
  * Permission naming: admin:resource:action
  * Ban action naming: plain verb phrase — write_reviews, place_bids, etc.
  */
-export type Permission = "admin:dashboard:view" | "admin:users:read" | "admin:users:write" | "admin:users:delete" | "admin:user-bans:read" | "admin:user-bans:write" | "admin:products:read" | "admin:products:write" | "admin:products:delete" | "admin:orders:read" | "admin:orders:write" | "admin:returns:read" | "admin:returns:write" | "admin:stores:read" | "admin:stores:write" | "admin:store-addresses:read" | "admin:addresses:read" | "admin:addresses:write" | "admin:analytics:view" | "admin:payouts:read" | "admin:payouts:write" | "admin:audit-log:read" | "admin:categories:read" | "admin:categories:write" | "admin:categories:delete" | "admin:brands:read" | "admin:brands:write" | "admin:brands:delete" | "admin:coupons:read" | "admin:coupons:write" | "admin:coupons:delete" | "admin:deals:read" | "admin:deals:write" | "admin:featured:read" | "admin:featured:write" | "admin:reviews:read" | "admin:reviews:write" | "admin:reviews:delete" | "admin:blog:read" | "admin:blog:write" | "admin:blog:delete" | "admin:blog:publish" | "admin:bids:read" | "admin:bids:write" | "admin:offers:read" | "admin:offers:write" | "admin:media:read" | "admin:media:write" | "admin:media:delete" | "admin:site:read" | "admin:site:write" | "admin:settings:write" | "admin:navigation:read" | "admin:navigation:write" | "admin:sections:read" | "admin:sections:write" | "admin:carousel:read" | "admin:carousel:write" | "admin:carousel:delete" | "admin:ads:read" | "admin:ads:write" | "admin:ads:delete" | "admin:faqs:read" | "admin:faqs:write" | "admin:faqs:delete" | "admin:tester-checklist:read" | "admin:tester-checklist:write" | "admin:tester-checklist:delete" | "admin:tester-feedback:read" | "admin:tester-feedback:write" | "admin:newsletter:read" | "admin:newsletter:write" | "admin:contact:read"
+export type Permission = "admin:dashboard:view" | "admin:users:read" | "admin:users:write" | "admin:users:delete" | "admin:user-bans:read" | "admin:user-bans:write" | "admin:products:read" | "admin:products:write" | "admin:products:delete" | "admin:orders:read" | "admin:orders:write" | "admin:returns:read" | "admin:returns:write" | "admin:stores:read" | "admin:stores:write" | "admin:store-addresses:read" | "admin:addresses:read" | "admin:addresses:write" | "admin:analytics:view" | "admin:payouts:read" | "admin:payouts:write" | "admin:audit-log:read" | "admin:categories:read" | "admin:categories:write" | "admin:categories:delete" | "admin:parts:read" | "admin:parts:write" | "admin:parts:delete" | "admin:beys:read" | "admin:beys:write" | "admin:beys:delete" | "admin:brands:read" | "admin:brands:write" | "admin:brands:delete" | "admin:coupons:read" | "admin:coupons:write" | "admin:coupons:delete" | "admin:deals:read" | "admin:deals:write" | "admin:featured:read" | "admin:featured:write" | "admin:reviews:read" | "admin:reviews:write" | "admin:reviews:delete" | "admin:blog:read" | "admin:blog:write" | "admin:blog:delete" | "admin:blog:publish" | "admin:bids:read" | "admin:bids:write" | "admin:offers:read" | "admin:offers:write" | "admin:media:read" | "admin:media:write" | "admin:media:delete" | "admin:site:read" | "admin:site:write" | "admin:settings:write" | "admin:navigation:read" | "admin:navigation:write" | "admin:sections:read" | "admin:sections:write" | "admin:carousel:read" | "admin:carousel:write" | "admin:carousel:delete" | "admin:ads:read" | "admin:ads:write" | "admin:ads:delete" | "admin:faqs:read" | "admin:faqs:write" | "admin:faqs:delete" | "admin:tester-checklist:read" | "admin:tester-checklist:write" | "admin:tester-checklist:delete" | "admin:tester-feedback:read" | "admin:tester-feedback:write" | "admin:newsletter:read" | "admin:newsletter:write" | "admin:contact:read"
 /** Destructive/mutating contact-submission actions. Added 2026-08-29 —
  * `DELETE /api/admin/contact-submissions/[id]` declared `admin:contact:delete`,
  * which is not a member of this union and therefore could never be granted. */

package/dist/features/auth/permissions/constants.js

@@ -131,6 +131,12 @@ export const PERMISSION_GROUPS = {
         "admin:categories:read",
         "admin:categories:write",
         "admin:categories:delete",
+        "admin:parts:read",
+        "admin:parts:write",
+        "admin:parts:delete",
+        "admin:beys:read",
+        "admin:beys:write",
+        "admin:beys:delete",
         "admin:brands:read",
         "admin:brands:write",
         "admin:brands:delete",
@@ -281,6 +287,8 @@ export const ROUTE_PERMISSION_MAP = {
     "/admin/catalogue-approvals": "admin:catalogue:read",
     "/admin/grouped-listings": "admin:grouped-listings:read",
     "/admin/categories": "admin:categories:read",
+    "/admin/parts": "admin:parts:read",
+    "/admin/beys": "admin:beys:read",
     "/admin/brands": "admin:brands:read",
     "/admin/coupons": "admin:coupons:read",
     "/admin/deals": "admin:deals:read",
@@ -437,7 +445,10 @@ export const PERMISSION_DOMAINS = [
     { label: "Orders & Returns", prefix: "admin:orders:|admin:returns:|admin:offers:" },
     { label: "Stores", prefix: "admin:stores:|admin:store-addresses:" },
     { label: "Finance", prefix: "admin:analytics:|admin:payouts:" },
-    { label: "Catalog", prefix: "admin:categories:|admin:brands:|admin:coupons:|admin:deals:|admin:featured:" },
+    {
+        label: "Catalog",
+        prefix: "admin:categories:|admin:parts:|admin:beys:|admin:brands:|admin:coupons:|admin:deals:|admin:featured:",
+    },
     {
         label: "Content",
         prefix: "admin:reviews:|admin:blog:|admin:bids:|admin:media:",

package/dist/features/beys/components/BeyDetailPageView.d.ts

@@ -0,0 +1,50 @@
+/**
+ * One bey's public page — what it is, what it is built from, who used it.
+ *
+ * ── 🛑 NO MONEY ON THIS PAGE, DELIBERATELY ─────────────────────────────────
+ *
+ * Prices are hidden from signed-out visitors, so any amount here would need
+ * `<GatedPrice>` and make this a client component. Listing rows carry a title,
+ * a condition and a link; the price lives one click away on the listing, where
+ * the gate already is. Same rule as `PartDetailPageView` and `/search`: a row
+ * with nothing to gate has nothing to leak, and no `offers.price` is emitted
+ * so no paywall declaration is needed either.
+ *
+ * 🛑 `price` IS on the document and is deliberately not rendered. It is the
+ * source's original retail price (`1404¥`), not our listing price — showing it
+ * beside real listings would read as an offer.
+ *
+ * ── 🛑 THE SOURCE LINK IS NOT OPTIONAL ────────────────────────────────────
+ *
+ * The facts here are extracted from a CC-BY-SA corpus. Taking facts only and
+ * linking back is what keeps us clear of share-alike, and `sourceUrl` was
+ * stored on ~5,500 rows while being rendered on NONE of them. Storing it is
+ * not discharging the obligation.
+ */
+import React from "react";
+import type { BeyDocument, BeyProductDocument } from "../schemas/firestore";
+/** One live listing row. Deliberately money-free — see the header. */
+export interface BeyListingRow {
+    id: string;
+    title: string;
+    slug?: string;
+    condition?: string;
+    href: string;
+}
+export interface BeyDetailPageViewProps {
+    bey: BeyDocument;
+    /** Products whose assortment contains this bey. */
+    products: readonly BeyProductDocument[];
+    /** Live listings, from the shared public product query. */
+    listings: readonly BeyListingRow[];
+    /** `total` is a FLOOR when the bounded fetch saturated. */
+    listingsTruncated?: boolean;
+    allListingsHref: string;
+    /** A part's own page, when the composition entry resolved to a glossary id. */
+    hrefForPart: (partId: string) => string | null;
+    /** This bey's category leaf, when one exists (116 beys have no leaf). */
+    categoryHref?: string | null;
+    /** A character's page, for a resolved owner. */
+    hrefForCharacter?: (slug: string) => string;
+}
+export declare function BeyDetailPageView({ bey, products, listings, listingsTruncated, allListingsHref, hrefForPart, categoryHref, hrefForCharacter, }: BeyDetailPageViewProps): React.JSX.Element;

package/dist/features/beys/components/BeyDetailPageView.js

@@ -0,0 +1,98 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Section, Container, Stack, Row, Div, Heading, Text, Span, TextLink, Anchor, Badge, } from "../../../ui/index.js";
+import { SpecTable } from "../../../ui/components/SpecTable.js";
+import { ROUTES } from "../../../next/routing/route-map.js";
+import { PART_SLOT_LABEL } from "../../parts/schemas/firestore.js";
+import { RecordOwnerQuickActions } from "../../admin/components/RecordOwnerQuickActions.js";
+/**
+ * The rating axes, in a fixed order.
+ *
+ * 🛑 ORDERED EXPLICITLY, never by `Object.keys`. Firestore returns map fields
+ * alphabetically, which would put "burst" and "dash" above "attack" and
+ * reorder the table per bey depending on which axes it happens to carry — so
+ * two beys could not be compared row against row.
+ */
+const RATING_AXES = [
+    { key: "attack", label: "Attack" },
+    { key: "defense", label: "Defense" },
+    { key: "stamina", label: "Stamina" },
+    { key: "weight", label: "Weight" },
+    { key: "speed", label: "Speed" },
+    { key: "burst", label: "Burst" },
+    { key: "burstResistance", label: "Burst resistance" },
+    { key: "dash", label: "Dash" },
+    { key: "power", label: "Power" },
+    { key: "height", label: "Height" },
+    { key: "runTime", label: "Run time" },
+];
+export function BeyDetailPageView({ bey, products, listings, listingsTruncated, allListingsHref, hrefForPart, categoryHref, hrefForCharacter, }) {
+    /*
+     * ── THE SPEC TABLE ────────────────────────────────────────────────────────
+     *
+     * Only what the source states. 🛑 A row is omitted when the fact is absent
+     * rather than rendered with an em-dash: "Element —" would claim we looked it
+     * up and found none, and `element` is on 45 of 1,988 beys precisely because
+     * it is a Beyblade-X-only attribute, not missing data.
+     */
+    const specRows = [
+        ...(bey.type ? [{ name: "Type", value: bey.type }] : []),
+        ...(bey.spinDirection ? [{ name: "Spin", value: bey.spinDirection }] : []),
+        ...(bey.system ? [{ name: "System", value: bey.system }] : []),
+        ...(bey.series ? [{ name: "Series", value: bey.series }] : []),
+        ...(bey.element ? [{ name: "Element", value: bey.element }] : []),
+        /*
+         * 🛑 MASS: the stated figure wins, and a SUMMED one is labelled as summed
+         * and marked approximate when the parts are only partly weighed. Printing
+         * a partial sum as a plain total is the one thing this must not do — the
+         * generator deliberately refuses to scale it up for the same reason.
+         */
+        ...(typeof bey.weightG === "number"
+            ? [{ name: "Weight", value: String(bey.weightG), unit: "g" }]
+            : typeof bey.weightGFromParts === "number"
+                ? [
+                    {
+                        name: "Weight",
+                        value: String(bey.weightGFromParts),
+                        unit: bey.weightGFromPartsCoverage?.complete
+                            ? "g (summed from parts)"
+                            : `g (from ${bey.weightGFromPartsCoverage?.weighed ?? 0} of ` +
+                                `${bey.weightGFromPartsCoverage?.total ?? 0} parts)`,
+                        approximate: !bey.weightGFromPartsCoverage?.complete,
+                    },
+                ]
+                : []),
+        ...(bey.productCodes?.length
+            ? [{ name: bey.productCodes.length > 1 ? "Product codes" : "Product code", value: bey.productCodes.join(" · ") }]
+            : []),
+        ...(bey.releaseJP ? [{ name: "Released (JP)", value: bey.releaseJP }] : []),
+        ...(bey.releaseUS ? [{ name: "Released (US)", value: bey.releaseUS }] : []),
+        ...(bey.jpName ? [{ name: "Japanese name", value: bey.jpName }] : []),
+        ...(bey.romaji ? [{ name: "Romaji", value: bey.romaji }] : []),
+        ...(bey.creator ? [{ name: "Creator", value: bey.creator }] : []),
+    ];
+    const ratings = bey.ratingsFromParts ?? null;
+    const ratingRows = ratings
+        ? RATING_AXES.map((a) => ({ ...a, value: ratings[a.key] })).filter((r) => typeof r.value === "number")
+        : [];
+    const composition = bey.composition ?? [];
+    const aliases = (bey.aka ?? []).filter((a) => a && a !== bey.name);
+    return (_jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "lg", children: _jsxs(Stack, { gap: "lg", className: "min-w-0", children: [_jsxs(Stack, { gap: "xs", className: "min-w-0", children: [categoryHref && (_jsx(Text, { size: "sm", color: "muted", children: _jsx(TextLink, { href: categoryHref, children: "Listings for this model" }) })), _jsx(Heading, { level: 1, children: bey.name }), _jsx(RecordOwnerQuickActions, { resource: "BEY", recordId: bey.id, placement: "detail", recordLabel: bey.name }), _jsxs(Row, { gap: "xs", wrap: true, align: "center", className: "min-w-0", children: [bey.type && _jsx(Badge, { variant: "info", children: bey.type }), bey.spinDirection && _jsx(Badge, { variant: "default", children: bey.spinDirection }), bey.system && _jsx(Badge, { variant: "secondary", children: bey.system })] }), aliases.length > 0 && (_jsxs(Text, { size: "sm", color: "muted", children: ["Also known as: ", aliases.join(" · ")] }))] }), composition.length > 0 && (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "Parts" }), _jsx(Stack, { gap: "xs", className: "min-w-0", children: composition.map((c, i) => {
+                                    const href = c.partId ? hrefForPart(c.partId) : null;
+                                    const label = PART_SLOT_LABEL[c.slot] ?? c.slot;
+                                    return (_jsxs(Row, { gap: "md", align: "center", className: "min-w-0", children: [_jsx(Text, { size: "sm", color: "muted", className: "w-36 flex-shrink-0", children: label }), href ? (_jsx(TextLink, { href: href, children: c.partName })) : (_jsx(Span, { children: c.partName }))] }, `${c.slot}-${c.partName}-${i}`));
+                                }) })] })), ratingRows.length > 0 && (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "Ratings" }), _jsx(SpecTable, { rows: ratingRows.map((r) => ({ name: r.label, value: String(r.value) })) }), _jsxs(Text, { size: "xs", color: "faint", children: ["Averaged from this bey\u2019s parts and rescaled to 0\u2013100 for comparison across generations", bey.ratingsFromPartsCoverage
+                                        ? `; from ${bey.ratingsFromPartsCoverage.rated ?? 0} of ` +
+                                            `${bey.ratingsFromPartsCoverage.total} parts`
+                                        : "", "."] })] })), bey.modes?.length ? (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "Modes" }), _jsx(Stack, { gap: "md", className: "min-w-0", children: bey.modes.map((mode) => (_jsxs(Stack, { gap: "xs", className: "min-w-0", children: [_jsxs(Row, { gap: "sm", align: "center", wrap: true, className: "min-w-0", children: [_jsx(Text, { weight: "semibold", children: mode.name }), _jsx(Text, { size: "xs", color: "muted", children: mode.switchKind === "speed" || mode.switchKind === "impact"
+                                                        ? "changes on its own"
+                                                        : "set before launch" })] }), _jsx(Text, { size: "sm", children: mode.behaviour }), _jsx(Text, { size: "sm", color: "muted", children: mode.trigger })] }, mode.name))) })] })) : null, (bey.ownerNames?.length || bey.specialMoves?.length || bey.appearAnime) && (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "In the anime" }), _jsx(SpecTable, { rows: [
+                                    ...(bey.ownerNames?.length
+                                        ? [{ name: "Used by", value: bey.ownerNames.join(" · ") }]
+                                        : []),
+                                    ...(bey.appearAnime ? [{ name: "First appearance", value: bey.appearAnime }] : []),
+                                    ...(bey.appearManga ? [{ name: "In the manga", value: bey.appearManga }] : []),
+                                    ...(bey.specialMoves?.length
+                                        ? [{ name: "Special moves", value: bey.specialMoves.join(" · ") }]
+                                        : []),
+                                ] }), hrefForCharacter && (bey.ownerCharacters?.length ?? 0) > 0 && (_jsx(Row, { gap: "xs", wrap: true, align: "center", className: "min-w-0", children: bey.ownerCharacters.map((slug) => (_jsx(TextLink, { href: hrefForCharacter(slug), children: slug.replace(/-/g, " ") }, slug))) }))] })), specRows.length > 0 && (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "Specifications" }), _jsx(SpecTable, { rows: specRows })] })), products.length > 0 && (_jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: "Found in" }), _jsx(Stack, { gap: "xs", className: "min-w-0", children: products.map((p) => (_jsxs(Row, { gap: "md", align: "center", className: "min-w-0", children: [_jsx(Span, { children: p.name }), p.productType && (_jsx(Text, { size: "xs", color: "muted", children: p.productType }))] }, p.id))) })] })), _jsxs(Stack, { gap: "sm", className: "min-w-0", children: [_jsx(Heading, { level: 2, size: "lg", children: listings.length > 0 ? "Currently listed" : "Listings" }), listings.length === 0 ? (_jsx(Text, { color: "muted", size: "sm", children: "Nothing matching this model is listed right now." })) : (_jsx(Stack, { gap: "xs", className: "min-w-0", children: listings.map((l) => (_jsxs(Row, { gap: "md", align: "center", className: "min-w-0", children: [_jsx(TextLink, { href: l.href, children: l.title }), l.condition && (_jsx(Text, { size: "xs", color: "muted", children: l.condition }))] }, l.id))) })), _jsx(Text, { size: "sm", children: _jsx(TextLink, { href: allListingsHref, children: listingsTruncated ? "See all listings" : "Search listings for this model" }) })] }), _jsx(Div, { children: _jsxs(Text, { size: "xs", color: "faint", children: ["Facts on this page are drawn from a community wiki under CC\u00A0BY-SA.", " ", _jsx(Anchor, { href: bey.sourceUrl, tone: "muted", underline: "always", children: "Source" }), bey.wboThreadUrl ? (_jsxs(_Fragment, { children: [" · ", _jsx(Anchor, { href: bey.wboThreadUrl, tone: "muted", underline: "always", children: "Community discussion" })] })) : null, " · ", _jsx(TextLink, { href: String(ROUTES.PUBLIC.CREDITS), children: "Credits" })] }) })] }) }) }));
+}