@mohasinac/appkit 4.69.1 → 4.70.0

package/dist/.build-stamp.json

@@ -1,8 +1,8 @@
 {
   "stampVersion": 1,
-  "version": "4.69.1",
-  "head": "1a1259a8058e4a957e71fef93fe49c34708f77bb",
+  "version": "4.70.0",
+  "head": "2818ecbd04176961cc2184dc89a3bf319efb92d4",
   "branch": "main",
   "dirty": false,
-  "builtAt": "2026-10-27T13:28:31.858Z"
+  "builtAt": "2026-10-28T02:31:30.990Z"
 }

package/dist/features/about/index.d.ts

@@ -1,5 +1,3 @@
-export { AboutView } from "./components/AboutView";
-export type { AboutViewProps, AboutHowItem, AboutValueItem, AboutMilestone, AboutTeamMember, } from "./components/AboutView";
 export type { AboutContentDocument } from "./schemas/firestore";
 export { TrackOrderView } from "./components/TrackOrderView";
 export type { TrackOrderViewProps } from "./components/TrackOrderView";

package/dist/features/about/index.js

@@ -1,4 +1,3 @@
-export { AboutView } from "./components/AboutView.js";
 export { TrackOrderView } from "./components/TrackOrderView.js";
 /*
  * The shared prose-page banner. Exported because it is the one thing all

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

@@ -442,7 +442,6 @@ export const DEFAULT_SITE_SETTINGS_DATA = {
             String(ROUTES.PUBLIC.ITEM_REQUESTS),
             String(ROUTES.PUBLIC.LOTTERIES),
             String(ROUTES.PUBLIC.PARTS),
-            String(ROUTES.PUBLIC.PROMOTIONS),
             String(ROUTES.PUBLIC.REPORT_ENTITY),
             String(ROUTES.PUBLIC.SCAMS),
             /* No `ROUTES.PUBLIC.SELL` constant exists, so `/sell` — the public

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

@@ -65,7 +65,7 @@ export function FAQSection({ title, subtitle, items, tabs: tabsProp, showCategor
             return items;
         return items.filter((i) => (i.category ?? "general") === activeTab);
     }, [items, showTabs, activeTab]);
-    return (_jsx(Section, { paddingX: "x-md-2xl", className: className, surface: "subtle", paddingY: "y-4xl", children: _jsxs(Div, { className: "w-full max-w-4xl mx-auto", children: [_jsxs(Div, { className: "text-left mb-10", children: [_jsx(Heading, { level: 2, variant: "none", gradient: "brand", className: "mb-3", mdSize: "4xl", size: "3xl", weight: "bold", children: title }), subtitle && (_jsx(Text, { className: `max-w-xl ${themed.textSecondary}`, size: "base", children: subtitle }))] }), showTabs && (_jsx(Tabs, { value: activeTab, onChange: setActiveTab, className: "mb-8", children: _jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "all", children: "All" }), derivedTabs.map((tab) => (_jsx(TabsTrigger, { value: tab.value, children: tab.label }, tab.value)))] }) })), _jsxs(Stack, { gap: "none", rounded: "xl", className: `${themed.bgPrimary} ${__O.hidden} border ${themed.border}`, children: [visibleItems.length === 0 && (_jsx(Text, { paddingY: "3xl", align: "start", className: themed.textSecondary, children: "No FAQs in this category yet." })), visibleItems.map((faq, index) => {
+    return (_jsx(Section, { paddingX: "x-md-2xl", className: className, surface: "subtle", paddingY: "y-4xl", children: _jsxs(Div, { className: "w-full max-w-4xl mx-auto", children: [_jsxs(Div, { className: "text-left mb-10", children: [_jsx(Heading, { level: 2, variant: "none", gradient: "brand", className: "mb-3", mdSize: "4xl", size: "3xl", weight: "bold", children: title }), subtitle && (_jsx(Text, { className: `max-w-xl ${themed.textSecondary}`, size: "base", children: subtitle }))] }), showTabs && (_jsx(Tabs, { value: activeTab, onChange: setActiveTab, className: "mb-8", children: _jsxs(TabsList, { wrap: true, children: [_jsx(TabsTrigger, { value: "all", children: "All" }), derivedTabs.map((tab) => (_jsx(TabsTrigger, { value: tab.value, children: tab.label }, tab.value)))] }) })), _jsxs(Stack, { gap: "none", rounded: "xl", className: `${themed.bgPrimary} ${__O.hidden} border ${themed.border}`, children: [visibleItems.length === 0 && (_jsx(Text, { paddingY: "3xl", align: "start", className: themed.textSecondary, children: "No FAQs in this category yet." })), visibleItems.map((faq, index) => {
                             const isOpen = openIds.has(faq.id);
                             return (_jsxs(Div, { className: `transition-colors duration-200 ${index < visibleItems.length - 1 ? "border-b border-[var(--appkit-color-border)]" : ""} ${isOpen ? "bg-[var(--appkit-color-surface-elevated)]" : ""}`, children: [_jsxs(Button, { variant: "ghost", rounded: "none", className: `w-full text-left px-[1.25rem] py-[1rem] ${flex.between} gap-[1rem] hover:${themed.bgTertiary} transition-colors`, onClick: () => toggle(faq.id), "aria-expanded": isOpen, children: [_jsx(Span, { size: "sm", weight: "medium", className: `flex-1 leading-snug ${isOpen ? "text-primary" : themed.textPrimary}`, children: faq.question }), _jsx(ChevronDown, { className: `w-4 h-4 flex-shrink-0 transition-transform duration-250 ${isOpen ? "rotate-180 text-primary" : themed.textSecondary}` })] }), _jsx(Div, { layout: "grid", className: `transition-all duration-300 ease-out ${isOpen ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"}`, children: _jsx(Div, { className: `${__O.hidden}`, children: _jsx(Div, { paddingY: "b-md-lg", padding: "x-md", children: isHtml(faq.answer) ? (_jsx(RichText, { html: faq.answer, proseClass: "prose prose-sm max-w-none dark:prose-invert" })) : (_jsx(Text, { className: `leading-relaxed ${themed.textSecondary}`, size: "sm", children: faq.answer })) }) }) })] }, faq.id));
                         })] }), viewMoreHref && (_jsx(Div, { className: "text-left mt-10", children: _jsxs(TextLink, { rounded: "full", paddingX: "xl", paddingY: "sm", href: viewMoreHref, layout: "inline-flex", align: "center", className: "gap-[0.5rem] bg-primary/10 text-primary hover:bg-primary/20 dark:bg-primary/15 transition-colors", size: "sm", weight: "medium", children: [viewMoreLabel, hasMore && moreCount > 0 && (_jsxs(Span, { color: "inverse", size: "xs", className: "bg-primary", rounded: "full", padding: "pill-xs", children: ["+", moreCount] }))] }) }))] }) }));

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

@@ -22,6 +22,7 @@ import { gateCarouselSlides } from "../lib/slide-gating.js";
 import { gateHomepageSections } from "../lib/section-gating.js";
 import { closedSurfaceContext, isClosedHref } from "../../../_internal/shared/listing-types/route-gating.js";
 import { getSurfaceCounts } from "../../../_internal/server/features/products/surface-counts.js";
+import { ROUTES } from "../../../next/routing/route-map.js";
 import { SECTION_COPY } from "../constants/section-copy.js";
 import { homepageSectionsRepository } from "../repository/homepage-sections.repository.js";
 import { isListingTypeEnabled, isCategoryTypeEnabled, isBrowsePageEnabled, } from "../../../_internal/shared/listing-types/feature-flags.js";
@@ -75,6 +76,36 @@ const HOMEPAGE_SECTION_BROWSE_PAGE = {
     brands: "brands",
     stores: "stores",
 };
+/**
+ * The FOURTH axis — a section that funnels into a route closed by
+ * `closedPaths` or `disabledRoutes`, neither of which the three maps above
+ * can see.
+ *
+ * 🛑 THIS ONE EXISTS BECAUSE A SEED LOAD RE-ENABLED A SECTION. The blog rail
+ * was switched off per-document, `appkit-seed load` writes `set(merge: true)`
+ * over `enabled`, and the seed still said `true` — so the rail came back and
+ * the homepage shipped FIVE dead links (`/blog` plus four post URLs) into a
+ * section closed via `disabledRoutes`.
+ *
+ * A per-document `enabled: false` is a value a reseed can overwrite. A gate
+ * keyed on whether the destination is OPEN cannot be: the section stays dark
+ * for exactly as long as the route is shut, however the flag got flipped.
+ * That is the difference between fixing this instance and fixing the class.
+ */
+/*
+ * 🛑 `coupons` is NOT here. Its "View all offers" button points at
+ * `/promotions`, which is a real offers page with a live coupon behind it —
+ * so the fix was to REOPEN that route, not to hide a working rail. Closing a
+ * page and then hiding everything that links to it is the wrong direction
+ * when the page is one a shop wants.
+ */
+const HOMEPAGE_SECTION_ROUTE = {
+    "blog-articles": String(ROUTES.BLOG.LIST),
+    events: String(ROUTES.PUBLIC.EVENTS),
+    "event-raffles": String(ROUTES.PUBLIC.EVENTS),
+    reviews: String(ROUTES.PUBLIC.REVIEWS),
+    "featured-bundles": String(ROUTES.PUBLIC.BUNDLES),
+};
 import { getFeaturedProducts, getFeaturedAuctions, getFeaturedPreOrders } from "../../products/actions/product-actions.js";
 import { listTopLevelCategories, listBrandCategories } from "../../categories/actions/category-actions.js";
 import { listFeaturedBundles } from "../../../_internal/server/features/bundles/data.js";
@@ -189,6 +220,9 @@ export async function MarketplaceHomepageView({ adSlots, newsletterFormSlot, onB
         const gatedBrowse = HOMEPAGE_SECTION_BROWSE_PAGE[type];
         if (gatedBrowse && !isBrowsePageEnabled(gatedBrowse, siteSettings))
             return false;
+        const gatedRoute = HOMEPAGE_SECTION_ROUTE[type];
+        if (gatedRoute && isClosedHref(gatedRoute, closedSurfaces))
+            return false;
         return true;
     });
     /*

package/dist/index.d.ts

@@ -753,7 +753,6 @@ export { validateFileSize } from "./providers/storage-firebase/client";
 export { validateFileType } from "./providers/storage-firebase/client";
 export { validateImage } from "./providers/storage-firebase/client";
 export type { StorageHelpers } from "./providers/storage-firebase/client";
-export { AboutView } from "./features/about/components/AboutView";
 export { FAQPageView } from "./features/about/components/FAQPageView";
 export { FeesView } from "./features/about/components/FeesView";
 export { HelpPageView } from "./features/about/components/HelpPageView";
@@ -774,7 +773,6 @@ export { TrackOrderView } from "./features/about/components/TrackOrderView";
 export type { AboutHowItem } from "./features/about/schemas/firestore";
 export type { AboutMilestone } from "./features/about/schemas/firestore";
 export type { AboutValueItem } from "./features/about/schemas/firestore";
-export type { AboutViewProps } from "./features/about/components/AboutView";
 export type { AboutTeamMember } from "./features/about/schemas/firestore";
 export type { AboutContentDocument } from "./features/about/schemas/firestore";
 export type { FAQPageViewProps } from "./features/about/components/FAQPageView";

package/dist/index.js

@@ -1580,10 +1580,6 @@ export { validateFileType } from "./providers/storage-firebase/client.js";
 // [CLIENT-SSR]-Runs in both SSR and browser â€" React component or hook that does not depend on browser-only APIs.
 // validateImage - Helper for validate image.
 export { validateImage } from "./providers/storage-firebase/client.js";
-// ./features/about/index
-// [CLIENT-SSR]-Runs in both SSR and browser â€" React component or hook that does not depend on browser-only APIs.
-// AboutView - Component for about view.
-export { AboutView } from "./features/about/components/AboutView.js";
 // [CLIENT-SSR]-Runs in both SSR and browser â€" React component or hook that does not depend on browser-only APIs.
 // FAQPageView - Component for faqpage view.
 export { FAQPageView } from "./features/about/components/FAQPageView.js";

package/dist/styles.css

@@ -7444,6 +7444,26 @@
   color: var(--appkit-tabs-ink-active);
 }
 
+/*
+ * Wrapping tab bar — `<TabsList wrap>`.
+ *
+ * 🛑 For CONTENT tabs inside a page section, never for navigation. The
+ * default list scrolls horizontally and collapses into a dropdown once it
+ * overflows, which is right for a nav bar on a phone and wrong in the middle
+ * of a homepage section: there it renders as a stray form control, and the
+ * visitor cannot see what the section contains without opening it.
+ *
+ * Wrapping keeps every tab visible on a second line. `overflow: visible` is
+ * required alongside `flex-wrap` — the base rule's `overflow-x: auto` would
+ * otherwise still clip the wrapped rows and reintroduce a scrollbar.
+ */
+.appkit-tabs-list--wrap {
+  flex-wrap: wrap;
+  overflow-x: visible;
+  overflow-y: visible;
+  scrollbar-width: auto;
+}
+
 /* Radio — toggle and classic radio group variants */
 
 .appkit-radio-group {

package/dist/ui/components/Tabs.d.ts

@@ -7,6 +7,14 @@ export interface TabsProps {
     children?: React.ReactNode;
 }
 export interface TabsListProps {
+    /**
+     * Never collapse into a dropdown; let the tabs wrap onto a second line.
+     *
+     * For CONTENT tabs inside a section, where a dropdown reads as a stray form
+     * control. Navigation tab bars should leave this `false` — see the note in
+     * `TabsList`.
+     */
+    wrap?: boolean;
     className?: string;
     children?: React.ReactNode;
 }
@@ -30,7 +38,7 @@ export interface TabsContentProps {
     children?: React.ReactNode;
 }
 export declare function Tabs({ defaultValue, value, onChange, className, children, }: TabsProps): React.JSX.Element;
-export declare function TabsList({ className, children }: TabsListProps): React.JSX.Element;
+export declare function TabsList({ className, children, wrap }: TabsListProps): React.JSX.Element;
 export declare function TabsTrigger({ value, disabled, className, children, badge, }: TabsTriggerProps): React.JSX.Element;
 export declare function TabsContent({ value, className, children, }: TabsContentProps): React.JSX.Element | null;
 export default Tabs;

package/dist/ui/components/Tabs.js

@@ -27,7 +27,7 @@ export function Tabs({ defaultValue = "", value, onChange, className = "", child
     }), [active, onChange, value]);
     return (_jsx(TabsContext.Provider, { value: contextValue, children: _jsx("div", { className: className, "data-section": "tabs-div-614", children: children }) }));
 }
-export function TabsList({ className = "", children }) {
+export function TabsList({ className = "", children, wrap = false }) {
     const { active, setActive } = useContext(TabsContext);
     const shellRef = useRef(null);
     const rowRef = useRef(null);
@@ -47,7 +47,24 @@ export function TabsList({ className = "", children }) {
         onSelect: () => setActive(item.props.value),
     }));
     const signature = overflowItems.map((i) => `${i.id}:${i.label}:${i.count ?? ""}`).join("|");
-    const collapsed = useRowCollapse(shellRef, rowRef, signature);
+    const measured = useRowCollapse(shellRef, rowRef, signature);
+    /*
+     * 🛑 `wrap` OPTS OUT OF COLLAPSING ENTIRELY, and it exists because
+     * collapsing is only right for NAVIGATION.
+     *
+     * Owner, 2026-10-27: *"it makes sense for forms or navigations, but no
+     * sense for a homepage section's tabs to be coming down."* That is the
+     * correct distinction. A nav bar that collapses hides destinations behind
+     * one more tap, which is a fair trade on a phone. A content filter inside a
+     * section — the homepage FAQ's category tabs — collapses into a dropdown
+     * that looks like a form control sitting in the middle of a page, and the
+     * visitor cannot see at a glance what the section even contains.
+     *
+     * Wrapping is the right failure mode here: the tabs take a second line and
+     * stay visible. Default stays `false`, so every existing nav tab bar is
+     * untouched.
+     */
+    const collapsed = wrap ? false : measured;
     /*
      * Collapsed renders `OverflowRow` in its already-collapsed state rather than
      * the old `TabsNavSelect`, which was a native `<select>` — so the collapsed
@@ -62,7 +79,7 @@ export function TabsList({ className = "", children }) {
     if (collapsed) {
         return (_jsx("div", { ref: shellRef, className: className, children: _jsx(OverflowRow, { items: overflowItems, ariaLabel: "Tabs", activeId: active, alwaysCollapsed: true, searchPlaceholder: "Search tabs\u2026" }) }));
     }
-    return (_jsx("div", { ref: shellRef, children: _jsx(TabBarShell, { className: className, ariaLabel: "Tabs", activeKey: active, listRef: rowRef, children: children }) }));
+    return (_jsx("div", { ref: shellRef, children: _jsx(TabBarShell, { className: [className, wrap ? "appkit-tabs-list--wrap" : ""].filter(Boolean).join(" "), ariaLabel: "Tabs", activeKey: active, listRef: rowRef, children: children }) }));
 }
 export function TabsTrigger({ value, disabled, className = "", children, badge, }) {
     const { active, setActive } = useContext(TabsContext);

package/dist/ui/components/Tabs.style.css

@@ -290,3 +290,23 @@
   border-color: transparent;
   color: var(--appkit-tabs-ink-active);
 }
+
+/*
+ * Wrapping tab bar — `<TabsList wrap>`.
+ *
+ * 🛑 For CONTENT tabs inside a page section, never for navigation. The
+ * default list scrolls horizontally and collapses into a dropdown once it
+ * overflows, which is right for a nav bar on a phone and wrong in the middle
+ * of a homepage section: there it renders as a stray form control, and the
+ * visitor cannot see what the section contains without opening it.
+ *
+ * Wrapping keeps every tab visible on a second line. `overflow: visible` is
+ * required alongside `flex-wrap` — the base rule's `overflow-x: auto` would
+ * otherwise still clip the wrapped rows and reintroduce a scrollbar.
+ */
+.appkit-tabs-list--wrap {
+  flex-wrap: wrap;
+  overflow-x: visible;
+  overflow-y: visible;
+  scrollbar-width: auto;
+}

package/dist/ui/rich-text/RichText.d.ts

@@ -39,16 +39,4 @@ export interface RichTextProps {
      */
     charts?: boolean;
 }
-/**
- * RichText renders sanitised HTML from a CMS / ProseMirror output.
- *
- * Security: client-side DOM-based sanitiser strips disallowed tags/attrs.
- * For defence-in-depth, also sanitise on the server before storing.
- *
- * Usage:
- * ```tsx
- * <RichText html={blogPost.body} className="max-w-2xl" />
- * <RichText html={desc} copyableCode />
- * ```
- */
 export declare function RichText({ html, className, proseClass, copyableCode, highlightCode, charts, }: RichTextProps): import("react").JSX.Element;

package/dist/ui/rich-text/RichText.js

@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { Div } from "../components/Div.js";
 import { normalizeRichTextHtml } from "../../utils/string.formatter.js";
+import { useSiteSettings } from "../../core/hooks/useSiteSettings.js";
 import { splitChartBlocks } from "./chart-blocks.js";
 import { ChartFromJson } from "../components/Chart.js";
 // --- Allowed HTML tags (safe subset — no script/object; iframe allowed for YouTube only) -------
@@ -182,9 +183,59 @@ function attachCopyButtons(container) {
  * <RichText html={desc} copyableCode />
  * ```
  */
+/**
+ * Unwrap every `<a>` whose destination the site has closed, keeping its text.
+ *
+ * 🛑 THIS IS WHERE THE LAST DEAD LINKS WERE, and why six page-level sweeps
+ * kept reporting "clean". Stored rich text is authored content that no page
+ * template owns: a crawl of the live site on 2026-10-27 found `/scams`,
+ * `/tools/authenticity` and `/blog` linked from the HOMEPAGE, and every one
+ * of them was inside an FAQ ANSWER. Grepping a page for marketplace words
+ * cannot see an href, and gating a section cannot see inside its prose.
+ *
+ * `RichText` is the single renderer for every stored HTML field on the site —
+ * FAQ answers, legal pages, blog bodies, product descriptions — so one filter
+ * here covers all of them.
+ *
+ * 🛑 UNWRAPPED, NOT DELETED. The sentence still reads: "the scam registry is
+ * the place to report it" keeps its words and loses its link. Removing the
+ * whole anchor would leave a gap mid-sentence, and removing the paragraph
+ * would silently delete an admin's copy.
+ *
+ * Prefix-matched on a `/`-delimited boundary, the same rule as every other
+ * gate — `/store` must not match `/stores`.
+ */
+function unwrapClosedLinks(html, closed) {
+    if (closed.length === 0 || typeof document === "undefined")
+        return html;
+    const container = document.createElement("div");
+    container.innerHTML = html;
+    let changed = false;
+    for (const a of Array.from(container.querySelectorAll("a[href]"))) {
+        const raw = a.getAttribute("href") ?? "";
+        if (!raw.startsWith("/"))
+            continue;
+        const path = raw.split(/[?#]/)[0].replace(/\/+$/, "") || "/";
+        // `/en/blog` -> `/blog`: an admin pasting out of the address bar stores
+        // the locale-prefixed form, which a raw comparison would miss.
+        const bare = path.replace(/^\/[a-z]{2}(?=\/)/, "");
+        const hit = closed.some((p) => bare === p || bare.startsWith(`${p}/`) || path === p || path.startsWith(`${p}/`));
+        if (!hit)
+            continue;
+        a.replaceWith(...Array.from(a.childNodes));
+        changed = true;
+    }
+    return changed ? container.innerHTML : html;
+}
 export function RichText({ html, className = "", proseClass = "prose max-w-none dark:prose-invert", copyableCode = false, highlightCode, charts = true, }) {
+    /*
+     * Fails OPEN: no settings yet, or a failed fetch, leaves every link intact.
+     * A transient error must not strip working links out of an admin's copy.
+     */
+    const { data: settings } = useSiteSettings();
+    const closedPrefixes = settings?.hiddenSurfacePrefixes ?? [];
     const safe = useMemo(() => {
-        const sanitized = sanitiseHtml(normalizeRichTextHtml(html));
+        const sanitized = unwrapClosedLinks(sanitiseHtml(normalizeRichTextHtml(html)), closedPrefixes);
         if (!highlightCode || typeof document === "undefined")
             return sanitized;
         const container = document.createElement("div");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mohasinac/appkit",
-  "version": "4.69.1",
+  "version": "4.70.0",
   "license": "MIT",
   "publishConfig": {
     "access": "public"

package/dist/features/about/components/AboutView.d.ts

@@ -1,30 +0,0 @@
-import React from "react";
-import type { AboutHowItem, AboutValueItem, AboutMilestone, AboutTeamMember } from "../schemas/firestore";
-export type { AboutHowItem, AboutValueItem, AboutMilestone, AboutTeamMember } from "../schemas/firestore";
-export interface AboutViewProps {
-    labels?: {
-        title?: string;
-        subtitle?: string;
-        missionTitle?: string;
-        missionText?: string;
-        howItWorksTitle?: string;
-        valuesTitle?: string;
-        valuesSubtitle?: string;
-        /** When set, renders a link from the values section through to `/ethics`. */
-        valuesLinkLabel?: string;
-        milestonesTitle?: string;
-        teamTitle?: string;
-        teamSubtitle?: string;
-        ctaTitle?: string;
-        ctaSell?: string;
-        ctaShop?: string;
-    };
-    howItems?: AboutHowItem[];
-    valueItems?: AboutValueItem[];
-    milestones?: AboutMilestone[];
-    teamMembers?: AboutTeamMember[];
-    ctaBannerClass?: string;
-    /** Render the CTA action buttons  */
-    renderCtaButtons?: () => React.ReactNode;
-}
-export declare function AboutView({ labels, howItems, valueItems, milestones, teamMembers, ctaBannerClass, renderCtaButtons, }: AboutViewProps): React.JSX.Element;

package/dist/features/about/components/AboutView.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Anchor } from "../../../ui/components/Anchor.js";
-import { Avatar } from "../../../ui/components/Avatar.js";
-import { Badge } from "../../../ui/components/Badge.js";
-import { Card } from "../../../ui/components/Card.js";
-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 { Section } from "../../../ui/components/Semantic.js";
-import { TextLink } from "../../../ui/components/TextLink.js";
-import { ROUTES } from "../../../constants/index.js";
-export function AboutView({ labels = {}, howItems = [], valueItems = [], milestones = [], teamMembers = [], ctaBannerClass = "", renderCtaButtons, }) {
-    return (_jsxs(Div, { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", children: [_jsx(Section, { color: "inverse", tone: "accent-banner", padding: "y-4xl", children: _jsxs(Div, { paddingX: "x-page", className: "max-w-4xl mx-auto text-center", children: [_jsx(Heading, { color: "inverse", level: 1, variant: "none", className: "mb-6", mdSize: "5xl", size: "4xl", weight: "bold", children: labels.title }), _jsx(Text, { color: "inverse-muted", variant: "none", className: "max-w-2xl mx-auto", size: "xl", children: labels.subtitle })] }) }), _jsxs(Stack, { gap: "section", paddingX: "x-page", className: "max-w-5xl mx-auto", padding: "y-4xl", children: [_jsxs(Section, { className: "text-center max-w-3xl mx-auto", children: [_jsx(Heading, { level: 2, className: "mb-4", children: labels.missionTitle }), _jsx(Text, { size: "lg", variant: "secondary", className: "leading-relaxed", children: labels.missionText })] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-12", align: "center", children: labels.howItWorksTitle }), _jsx(Div, { className: "grid md:grid-cols-3", gap: "6", children: howItems.map(({ title, text, icon, tone }) => (_jsxs(Card, { variant: `gradient-${tone ?? "indigo"}`, padding: "md", spacing: "sm", children: [_jsx(Div, { children: _jsx(Span, { size: "4xl", children: icon }) }), _jsx(Heading, { level: 3, color: "inverse", variant: "none", children: title }), _jsx(Text, { size: "sm", color: "inverse-muted", variant: "none", className: "leading-relaxed", children: text })] }, title))) })] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: labels.valuesSubtitle ? "mb-3" : "mb-12", align: "center", children: labels.valuesTitle }), labels.valuesSubtitle && (_jsx(Text, { size: "base", variant: "secondary", align: "center", className: "mb-12 max-w-2xl mx-auto leading-relaxed", children: labels.valuesSubtitle })), _jsx(Div, { className: "grid md:grid-cols-3", gap: "5", children: valueItems.map(({ title, text, icon, detail }) => (_jsxs(Stack, { gap: "3", surface: "default", padding: "lg", rounded: "xl", border: "default", children: [_jsx(Div, { children: _jsx(Span, { size: "3xl", children: icon }) }), _jsx(Heading, { level: 3, children: title }), _jsx(Text, { size: "sm", variant: "secondary", className: "leading-relaxed", children: text }), detail && (_jsx(Text, { size: "sm", color: "muted", className: "leading-relaxed", children: detail }))] }, title))) }), labels.valuesLinkLabel && (_jsx(Div, { className: "mt-8 text-center", children: _jsx(TextLink, { href: String(ROUTES.PUBLIC.ETHICS), size: "sm", children: labels.valuesLinkLabel }) }))] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-10", align: "center", children: labels.milestonesTitle }), _jsx(Stack, { className: "relative border-l-2 border-primary/30 max-w-2xl mx-auto pl-[2rem]", gap: "xl", children: milestones.map(({ year, text }) => (_jsxs(Div, { className: "relative", children: [_jsx(Div, { className: "absolute -left-10 top-1 w-4 h-4 bg-primary border-2 border-white", rounded: "full" }), _jsx(Span, { size: "xs", weight: "bold", className: "text-primary tracking-wide", transform: "uppercase", children: year }), _jsx(Text, { className: "mt-1", children: text })] }, year))) })] }), teamMembers.length > 0 && (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-2", align: "center", children: labels.teamTitle }), labels.teamSubtitle && (_jsx(Text, { size: "lg", variant: "secondary", align: "center", className: "mb-12 max-w-2xl mx-auto", children: labels.teamSubtitle })), _jsx(Div, { className: "grid md:grid-cols-3", gap: "6", children: teamMembers.map((member) => (_jsxs(Stack, { gap: "3", surface: "default", padding: "lg", rounded: "xl", border: "default", align: "center", className: "text-center", children: [_jsx(Avatar, { src: member.photoUrl, name: member.name, alt: member.name, size: "lg" }), _jsx(Heading, { level: 3, children: member.name }), _jsxs(Row, { gap: "xs", wrap: true, justify: "center", children: [_jsx(Span, { size: "xs", weight: "bold", className: "text-primary tracking-wide", transform: "uppercase", children: member.role }), member.isFounder && _jsx(Badge, { variant: "primary", size: "xs", children: "Founder" }), member.isDeveloper && _jsx(Badge, { variant: "secondary", size: "xs", children: "Developer" })] }), _jsx(Text, { size: "sm", variant: "secondary", className: "leading-relaxed", children: member.bio }), member.githubUrl && (_jsx(Anchor, { href: member.githubUrl, tone: "muted", size: "sm", underline: "hover", children: "GitHub \u2197" }))] }, member.name))) })] })), _jsxs(Section, { color: "inverse", tone: "accent-banner", className: `text-center ${ctaBannerClass}`, padding: "xl", rounded: "2xl", children: [_jsx(Heading, { color: "inverse", level: 2, variant: "none", className: "mb-8", size: "3xl", weight: "bold", children: labels.ctaTitle }), renderCtaButtons ? (renderCtaButtons()) : (_jsx(Row, { justify: "center", gap: "3", wrap: true, children: _jsxs(Span, { color: "inverse-muted", size: "sm", children: [labels.ctaSell, " \u00B7 ", labels.ctaShop] }) }))] })] })] }));
-}