@mohasinac/appkit 4.64.1 → 4.66.0

package/dist/features/price-index/components/PriceIndexToolView.js

@@ -3,7 +3,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React, { useCallback, useState } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { Search, TrendingUp } from "lucide-react";
-import { Container, Div, Heading, Row, Section, Span, Stack, Text } from "../../../ui/index.js";
+import { Container, Row, Stack } from "../../../ui/components/Layout.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Section } from "../../../ui/components/Semantic.js";
 import { Badge } from "../../../ui/components/Badge.js";
 import { Button } from "../../../ui/components/Button.js";
 import { Form } from "../../../ui/components/Form.js";

package/dist/features/pricing/components/AdminPricingView.js

@@ -1,7 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { Badge, Button, Heading, Row, Stack, Text } from "../../../ui/index.js";
+import { Badge } from "../../../ui/components/Badge.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
 import { Modal } from "../../../ui/components/Modal.js";
 import { useToast } from "../../../ui/components/Toast.js";
 import { Form } from "../../../ui/components/Form.js";

package/dist/features/print/components/BoxLabelPrintView.js

@@ -17,7 +17,11 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * trust it over the screen; printing "8 items as of 21 Oct" says what it is.
  */
 import { useMemo, useState } from "react";
-import { Alert, Button, Div, Heading, Row, Stack, Text, } from "../../../ui/index.js";
+import { Alert } from "../../../ui/components/Alert.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
 import { FieldCheckbox } from "../../../ui/forms/FieldCheckbox.js";
 import { BoxContentsSheet, BoxLabel, LabelPageStyle, LabelSheet, PrintScaleWarning, } from "./labels.js";
 import { LabelProfilePicker } from "./LabelProfilePicker.js";

package/dist/features/print/components/LabelProfilePicker.js

@@ -21,7 +21,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * choice. No audit enforces the threshold, so this is a judgement call and not
  * a build failure — one line to reverse if the call is wrong.
  */
-import { Alert, Row, Stack, Text } from "../../../ui/index.js";
+import { Alert } from "../../../ui/components/Alert.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { FieldSelect } from "../../../ui/forms/index.js";
 import { LABEL_PROFILES, LABEL_PROFILE_IDS, MIN_SCANNABLE_MODULE_MM, labelFitsProfile, } from "../../../_internal/shared/features/print/label-profiles.js";
 export function LabelProfilePicker({ value, onChange, longestCodeLength, label = "Label stock", }) {

package/dist/features/print/components/labels.js

@@ -37,7 +37,9 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { useEffect, useMemo, useRef } from "react";
 import JsBarcode from "jsbarcode";
-import { Div, Row, Stack, Text } from "../../../ui/index.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { normalizeError } from "../../../errors/normalize.js";
 import { MM_PER_INCH, SAFE_MODULE_MM, labelFitsProfile, sheetPositionMm, } from "../../../_internal/shared/features/print/label-profiles.js";
 /** CSS px per inch is 96 by definition — not a screen measurement. */

package/dist/features/products/api/route.js

@@ -22,6 +22,7 @@ import { printMetaSchema } from "../schemas/index.js";
 import { sanitizeProductsForPublic } from "../utils/sanitize.js";
 import { listPublicProducts, parsePublicProductParams, } from "../../../_internal/server/features/products/list-public.js";
 import { normalizeError } from "../../../errors/normalize.js";
+import { param } from "../../../utils/search-params.js";
 // --- Mutation schemas ---------------------------------------------------------
 // Minimal schemas for secured mutations — consumer apps can extend as needed.
 const productMutateSchema = z
@@ -72,9 +73,6 @@ const productMutateSchema = z
 })
     .passthrough();
 // --- Helpers ------------------------------------------------------------------
-function param(url, key) {
-    return url.searchParams.get(key);
-}
 // --- GET /api/products --------------------------------------------------------
 /**
  * Delegates to `listPublicProducts` — the single implementation shared with

package/dist/features/products/columns/productTableColumns.js

@@ -1,5 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Div, GatedPrice, Row, Span } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice } from "../../../ui/components/GatedPrice.js";
+import { Row } from "../../../ui/components/Layout.js";
+import { Span } from "../../../ui/components/Typography.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { statusLabel } from "../../../ui/columns/cell-renderers.js";
 import { formatCurrency as defaultFormatCurrency } from "../../../utils/number.formatter.js";

package/dist/features/products/components/ArtStickersListView.js

@@ -1,5 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Container, Heading, Main, Section, Text } from "../../../ui/index.js";
+import { Container } from "../../../ui/components/Layout.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Main, Section } from "../../../ui/components/Semantic.js";
 import { AdSlot } from "../../homepage/components/AdSlot.js";
 import { ProductsIndexListing } from "./ProductsIndexListing.js";
 import { PRODUCT_FIELDS } from "../../../constants/field-names.js";

package/dist/features/products/components/AuctionDetailView.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { DetailViewShellProps } from "../../../ui";
+import type { DetailViewShellProps } from "../../../ui/components/DetailViewShell";
 export interface AuctionDetailViewProps extends Omit<DetailViewShellProps, "mainSlots" | "belowFold" | "layout" | "afterMain"> {
     renderGallery?: (isLoading: boolean) => React.ReactNode;
     renderInfo?: (isLoading: boolean) => React.ReactNode;

package/dist/features/products/components/AuctionDetailView.js

@@ -1,5 +1,6 @@
 import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { DetailViewShell, Div } from "../../../ui/index.js";
+import { DetailViewShell } from "../../../ui/components/DetailViewShell.js";
+import { Div } from "../../../ui/components/Div.js";
 export function AuctionDetailView({ renderGallery, renderInfo, renderBidForm, renderMobileBidForm, renderSublistingSection, renderTabs, renderBidHistory, renderRelated, isLoading = false, ...rest }) {
     const mobileBid = renderMobileBidForm?.();
     const sublistingSection = renderSublistingSection?.();

package/dist/features/products/components/AuctionsIndexListing.js

@@ -5,7 +5,15 @@ import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices.js";
 import { useState, useCallback } from "react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable.js";
 import { useProducts } from "../hooks/useProducts.js";
-import { BulkActionBar, Div, FilterDrawer, Grid, ListingToolbar, LoginRequiredModal, Pagination, Row, Stack, useToast, StickyToolbar } from "../../../ui/index.js";
+import { BulkActionBar } from "../../../ui/components/BulkActionBar.js";
+import { Div } from "../../../ui/components/Div.js";
+import { FilterDrawer } from "../../../ui/components/FilterDrawer.js";
+import { Grid, Row, Stack } from "../../../ui/components/Layout.js";
+import { ListingToolbar } from "../../../ui/components/ListingToolbar.js";
+import { LoginRequiredModal } from "../../../ui/components/LoginRequiredModal.js";
+import { Pagination } from "../../../ui/components/Pagination.js";
+import { useToast } from "../../../ui/components/toast-context.js";
+import { StickyToolbar } from "../../../ui/components/StickyToolbar.js";
 import { usePendingTable } from "../../../react/hooks/usePendingTable.js";
 import { useBulkSelection } from "../../../react/hooks/useBulkSelection.js";
 import { MarketplaceAuctionGrid } from "../../auctions/components/MarketplaceAuctionGrid.js";
@@ -18,7 +26,7 @@ import { TABLE_KEYS, VIEW_MODE } from "../../../constants/table-keys.js";
 import { useAuthGate } from "../../../react/hooks/useAuthGate.js";
 import { ACTION_ID } from "../constants/action-defs.js";
 import { AUCTION_PUBLIC_SORT_OPTIONS } from "../constants/sieve.js";
-import { useBottomActions } from "../../layout/index.js";
+import { useBottomActions } from "../../layout/hooks/useBottomActions.js";
 import { AVAILABILITY_VALUES } from "../../../constants/field-names.js";
 import { AvailabilityTabs } from "./AvailabilityTabs.js";
 const __P = {

package/dist/features/products/components/AvailabilityScopeHint.js

@@ -1,6 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Row, Text } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Row } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { useUrlTable } from "../../../react/hooks/useUrlTable.js";
 import { AVAILABILITY_VALUES } from "../../../constants/field-names.js";
 import { TABLE_KEYS } from "../../../constants/table-keys.js";

package/dist/features/products/components/AvailabilityTabs.js

@@ -25,7 +25,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * @tag sideEffects:url-mutation
  */
 import { useMemo } from "react";
-import { Tabs, TabsList, TabsTrigger } from "../../../ui/index.js";
+import { Tabs, TabsList, TabsTrigger } from "../../../ui/components/Tabs.js";
 import { useUrlTable } from "../../../react/hooks/useUrlTable.js";
 import { TABLE_KEYS } from "../../../constants/table-keys.js";
 import { AVAILABILITY_VALUES } from "../../../constants/field-names.js";

package/dist/features/products/components/BidHistory.js

@@ -1,7 +1,10 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { normalizeError } from "../../../errors/normalize.js";
 import React from "react";
-import { Div, GatedPrice, Heading, Span, Stack, Text } from "../../../ui/index.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice } from "../../../ui/components/GatedPrice.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Stack } from "../../../ui/components/Layout.js";
 import { formatCurrency } from "../../../utils/number.formatter.js";
 function formatBidDate(raw) {
     if (!raw)

package/dist/features/products/components/CityCollectiblesView.js

@@ -4,7 +4,12 @@ import { PAGE_CONTAINER } from "../../../_internal/shared/styles/page.js";
 import { THEMED_BG_PRIMARY } from "../../../_internal/shared/styles/themed.js";
 import { TABLE_KEYS } from "../../../constants/table-keys.js";
 import { safeRead } from "../../../errors/safe-read.js";
-import { Alert, Div, Grid, Heading, Row, Section, Stack, Text, TextLink, } from "../../../ui/index.js";
+import { Alert } from "../../../ui/components/Alert.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Grid, Row, Stack } from "../../../ui/components/Layout.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Section } from "../../../ui/components/Semantic.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
 import { listPublicProducts } from "../../../_internal/server/features/products/list-public.js";
 import { hidePublicTestData } from "../../../_internal/server/features/tester/visibility.js";
 import { MEETUP_CITIES } from "../constants/meetup-cities.js";

package/dist/features/products/components/CompareOverlay.js

@@ -12,7 +12,12 @@ const REL_NOOPENER = "noopener noreferrer";
 const CLS_REMOVE_BTN = "shrink-0 text-zinc-400 hover:text-error hover:bg-surface-hover";
 import Link from "next/link.js";
 import { X } from "lucide-react";
-import { Button, Div, GatedPrice, Heading, IconButton, Row, Span, Stack, Text } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice } from "../../../ui/components/GatedPrice.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { IconButton } from "../../../ui/components/IconButton.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { useSwipe } from "../../../react/hooks/useSwipe.js";
 import { formatCurrency } from "../../../utils/number.formatter.js";

package/dist/features/products/components/CustomFieldsEditor.js

@@ -1,6 +1,11 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Div, Input, Row, Select, Stack, Text } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Input } from "../../../ui/components/Input.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Select } from "../../../ui/components/Select.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { MAX_CUSTOM_FIELDS } from "../schemas/firestore.js";
 const CLS_REMOVE = "text-zinc-400 hover:text-error dark:hover:text-error px-[var(--appkit-space-2)]";
 const TYPE_OPTIONS = [

package/dist/features/products/components/CustomSectionTabContent.js

@@ -1,11 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { RichText, SpecTable, Stack, Text } from "../../../ui/index.js";
+import { RichText } from "../../../ui/rich-text/RichText.js";
+import { SpecTable } from "../../../ui/components/SpecTable.js";
+import { Stack } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { normalizeRichTextHtml } from "../../../utils/string.formatter.js";
-function renderFieldValue(f) {
-    if (f.type === "boolean")
-        return f.value === "true" ? "Yes" : "No";
-    return f.value + (f.unit ? ` ${f.unit}` : "");
-}
 /**
  * `customSections` → `ProductTabsShell`'s `customTabs` prop, in one place.
  *

package/dist/features/products/components/CustomSectionsEditor.js

@@ -1,7 +1,12 @@
 "use client";
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { useId } from "react";
-import { Button, Div, Heading, Input, Row, Span, Stack, Text, Textarea } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Input } from "../../../ui/components/Input.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Textarea } from "../../../ui/components/Textarea.js";
 import { MAX_CUSTOM_SECTIONS } from "../schemas/firestore.js";
 import { CustomFieldsEditor } from "./CustomFieldsEditor.js";
 const CLS_REMOVE = "text-zinc-400 hover:text-error dark:hover:text-error text-[length:var(--appkit-text-xs)]";

package/dist/features/products/components/FeatureBadge.js

@@ -2,7 +2,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef } from "react";
 import { BadgeCheck, CalendarCheck, Megaphone, Package, PackageCheck, RefreshCcw, Sparkles, Star, Tag, Trophy, Truck, } from "lucide-react";
-import { Row, Span } from "../../../ui/index.js";
+import { Row } from "../../../ui/components/Layout.js";
+import { Span } from "../../../ui/components/Typography.js";
 import { isFeatureIconPath, } from "../schemas/product-features.js";
 /**
  * Stable map of icon-set keys → React components.

package/dist/features/products/components/GroupMemberPicker.js

@@ -18,7 +18,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * consumer pages untouched.
  */
 import { useMemo, useState } from "react";
-import { Alert, Button, Div, GatedPrice, PricesOnly, Row, Span, Stack, Table, Tbody, Td, Text, Th, Thead, Tr, } from "../../../ui/index.js";
+import { Alert } from "../../../ui/components/Alert.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice, PricesOnly } from "../../../ui/components/GatedPrice.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Span, Text } from "../../../ui/components/Typography.js";
+import { Table, Tbody, Td, Th, Thead, Tr } from "../../../ui/components/Semantic.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
 import { QuantityStepper } from "../../../ui/components/QuantityStepper.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { formatCurrency } from "../../../utils/number.formatter.js";
@@ -140,7 +147,7 @@ export function GroupMemberPicker({ groupId, groupSource, members, rules = EMPTY
                                                  * A made-to-order member has no ceiling; the line's
                                                  * own 99-per-line cap still applies at the cart.
                                                  */
-                                                max: m.madeToOrder === true ? undefined : m.availableQuantity, ariaLabel: `Quantity for ${m.title}`, decrementLabel: ACTIONS.CART["decrease-quantity"].ariaLabel, incrementLabel: ACTIONS.CART["increase-quantity"].ariaLabel })) })), _jsx(Td, { padding: "xs-tall", children: _jsx("a", { href: memberHref(m), className: "text-[length:var(--appkit-text-xs)] text-[var(--appkit-color-primary)] hover:underline", children: "View \u2192" }) })] }, m.id));
+                                                max: m.madeToOrder === true ? undefined : m.availableQuantity, ariaLabel: `Quantity for ${m.title}`, decrementLabel: ACTIONS.CART["decrease-quantity"].ariaLabel, incrementLabel: ACTIONS.CART["increase-quantity"].ariaLabel })) })), _jsx(Td, { padding: "xs-tall", children: _jsx(TextLink, { href: memberHref(m), size: "xs", className: "text-[var(--appkit-color-primary)] hover:underline", children: "View \u2192" }) })] }, m.id));
                             }) })] }) }), !isCrossStore && (_jsxs(_Fragment, { children: [ruleNotes.length > 0 && (_jsx(Text, { size: "xs", color: "muted", children: ruleNotes.join(" · ") })), error && _jsx(Alert, { variant: "error", children: error }), selectedUnits > 0 && violations.length > 0 && (_jsx(Alert, { variant: "warning", children: _jsx(Stack, { gap: "dense", children: violations.map((v) => (_jsx(Text, { size: "sm", children: v.message }, v.code + v.message))) }) })), _jsxs(Row, { justify: "between", align: "center", gap: "sm", className: "min-w-0", children: [_jsxs(Text, { size: "sm", color: "muted", children: [selectedUnits > 0
                                         ? `${selectedUnits} item${selectedUnits === 1 ? "" : "s"}`
                                         : "Nothing selected yet", selectedUnits > 0 && (_jsx(PricesOnly, { children: discountPercent > 0

package/dist/features/products/components/GroupSettingsPanel.js

@@ -3,7 +3,18 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { normalizeError } from "../../../errors/normalize.js";
 import React, { useEffect, useState } from "react";
 import { z } from "zod";
-import { Button, Checkbox, Code, ConfirmDeleteModal, Div, Grid, Heading, Input, Modal, Row, SideDrawer, Span, Stack, Tabs, TabsContent, TabsList, TabsTrigger, Text, useToast } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Checkbox } from "../../../ui/components/Checkbox.js";
+import { Code } from "../../../ui/components/Semantic.js";
+import { ConfirmDeleteModal } from "../../../ui/components/ConfirmDeleteModal.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Grid, Row, Stack } from "../../../ui/components/Layout.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Input } from "../../../ui/components/Input.js";
+import { Modal } from "../../../ui/components/Modal.js";
+import { SideDrawer } from "../../../ui/components/SideDrawer.js";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../../ui/components/Tabs.js";
+import { useToast } from "../../../ui/components/toast-context.js";
 import { FormShellContext, useFormShellState, FormErrorSummary } from "../../../ui/forms/index.js";
 import { FieldInput } from "../../../ui/forms/FieldInput.js";
 import { MediaImage } from "../../media/MediaImage.js";
@@ -359,7 +370,7 @@ export function GroupSettingsPanel({ productId, productSlug, groupId, isGroupPar
                 return (groupChildSlugs?.length ?? 0) >= 4 ? (_jsx(SideDrawer, { isOpen: showAddModal, onClose: close, title: "Add child listing", children: content })) : (_jsx(Modal, { open: showAddModal, onClose: close, title: "Add child listing", size: "lg", children: content }));
             })(), confirmAction && (_jsx(ConfirmDeleteModal, { isOpen: true, title: confirmAction.title, message: confirmAction.message, onConfirm: confirmAction.onConfirm, onClose: () => setConfirmAction(null), isDeleting: loading }))] }));
 }
-function AddChildContent({ addTab, setAddTab, createForm, setCreateForm, productSlug, storeProductsEndpoint, linkTargets, setLinkTargets, onAddCreate, onAddLink, loading, }) {
+function AddChildContent({ addTab, setAddTab, createForm, setCreateForm, storeProductsEndpoint, linkTargets, setLinkTargets, onAddCreate, onAddLink, loading, }) {
     const sections = React.useMemo(() => buildSectionsFromSchema(createChildSchema, {
         options: { condition: CONDITION_OPTIONS },
     }), []);

package/dist/features/products/components/MakeOfferButton.js

@@ -3,7 +3,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState, useTransition } from "react";
 import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices.js";
 import { useOptionalSession } from "../../../react/contexts/SessionContext.js";
-import { Button, Div, LoginRequiredModal, Modal, Span, Stack, Text, } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { LoginRequiredModal } from "../../../ui/components/LoginRequiredModal.js";
+import { Modal } from "../../../ui/components/Modal.js";
+import { Span, Text } from "../../../ui/components/Typography.js";
+import { Stack } from "../../../ui/components/Layout.js";
 import { Form } from "../../../ui/components/Form.js";
 import { FieldInput } from "../../../ui/forms/FieldInput.js";
 import { FormErrorSummary } from "../../../ui/forms/FormErrorSummary.js";

package/dist/features/products/components/MarketplaceBundleCard.js

@@ -10,7 +10,12 @@ const CLS_BUNDLE_PILL = "inline-flex items-center rounded-full bg-violet-600 px-
 const CLS_STOCK_OK = "bg-success-solid text-success-on-solid";
 // audit-content-alignment-ok: button label text, not page content — buttons are universally center-labeled
 const CLS_VIEW_BTN = "mt-2 w-full cursor-pointer rounded-md bg-violet-600 py-[var(--appkit-space-1-5)] text-center text-[length:var(--appkit-text-xs)] font-semibold text-white transition-colors hover:bg-violet-700 active:scale-[0.98]";
-import { BaseListingCard, Div, GatedPrice, PricesOnly, Row, Span, Stack, Text, TextLink } from "../../../ui/index.js";
+import { BaseListingCard } from "../../../ui/components/BaseListingCard.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice, PricesOnly } from "../../../ui/components/GatedPrice.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Span, Text } from "../../../ui/components/Typography.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { computeBundleDiscount } from "../../../_internal/shared/features/categories/bundle-pricing.js";
 import { BUNDLE_COPY } from "../../../_internal/shared/features/categories/bundle-copy.js";

package/dist/features/products/components/MarketplacePrizeDrawCard.js

@@ -8,7 +8,13 @@ import { ACTIONS } from "../../../_internal/shared/actions/action-registry.js";
 import { formatCurrency } from "../../../utils/index.js";
 import { getDefaultCurrency } from "../../../core/baseline-resolver.js";
 const CLS_PRIZE_PILL = "inline-flex items-center rounded-full bg-fuchsia-600 px-[var(--appkit-space-2)] py-[var(--appkit-space-0-5)] text-white";
-import { BaseListingCard, Button, Div, GatedPrice, Row, Span, Stack, Text, TextLink } from "../../../ui/index.js";
+import { BaseListingCard } from "../../../ui/components/BaseListingCard.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { GatedPrice } from "../../../ui/components/GatedPrice.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Span, Text } from "../../../ui/components/Typography.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { CardStoreLine } from "./CardStoreLine.js";
 import { RecordOwnerQuickActions } from "../../admin/components/RecordOwnerQuickActions.js";

package/dist/features/products/components/NonRefundableConsentModal.js

@@ -13,7 +13,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * agreed to in S5-doc.
  */
 import { useEffect, useId, useState } from "react";
-import { Button, Checkbox, Li, Modal, Stack, Text, Ul } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Checkbox } from "../../../ui/components/Checkbox.js";
+import { Li, Ul } from "../../../ui/components/Semantic.js";
+import { Modal } from "../../../ui/components/Modal.js";
+import { Stack } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
 const COPY = {
     "prize-draw": {
         heading: "Entry fee is non-refundable",

package/dist/features/products/components/PreOrderDetailView.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { DetailViewShellProps } from "../../../ui";
+import type { DetailViewShellProps } from "../../../ui/components/DetailViewShell";
 /**
  * PreOrderDetailView — shell for pre-order product detail pages.
  * Uses grid-2 layout (gallery | info+buyBar).

package/dist/features/products/components/PreOrderDetailView.js

@@ -1,6 +1,6 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import { DetailViewShell } from "../../../ui/index.js";
+import { DetailViewShell } from "../../../ui/components/DetailViewShell.js";
 export function PreOrderDetailView({ renderGallery, renderInfo, renderBuyBar, renderSublistingSection, renderGroupSection, renderTabs, renderRelated, isLoading = false, ...rest }) {
     const sublistingNode = renderSublistingSection?.();
     const groupNode = renderGroupSection?.();

package/dist/features/products/components/PrizeDrawCollage.js

@@ -16,7 +16,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { Row } from "@mohasinac/appkit/client";
 import { useState } from "react";
-import { Button, Div, Grid, PricesOnly, Scrim, Text } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Grid } from "../../../ui/components/Layout.js";
+import { PricesOnly } from "../../../ui/components/GatedPrice.js";
+import { Scrim } from "../../../ui/components/Scrim.js";
+import { Text } from "../../../ui/components/Typography.js";
 import { useCanSeePrices } from "../../../react/hooks/useCanSeePrices.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { ImageLightbox } from "../../../ui/components/ImageLightbox.js";

package/dist/features/products/components/PrizeDrawDetailPageView.js

@@ -9,9 +9,14 @@ const __P = {
 const CLS_PRIZE_BADGE = "inline-block rounded-full bg-fuchsia-100 dark:bg-fuchsia-900/30 px-[var(--appkit-space-2-5)] py-[var(--appkit-space-0-5)] text-fuchsia-700 dark:text-fuchsia-300";
 import { ROUTES } from "../../../next/routing/route-map.js";
 import { getDefaultCurrency } from "../../../core/baseline-resolver.js";
-import { normalizeRichTextHtml } from "../../../utils/string.formatter.js";
+import { toDescriptionHtml } from "../../../utils/string.formatter.js";
 import { safeDisplayName } from "../../../security/index.js";
-import { Container, Disclaimer, Div, Heading, Main, RichText, Row, Section, Span, Stack, Text, } from "../../../ui/index.js";
+import { Container, Row, Stack } from "../../../ui/components/Layout.js";
+import { Disclaimer } from "../../../ui/components/Disclaimer.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Main, Section } from "../../../ui/components/Semantic.js";
+import { RichText } from "../../../ui/rich-text/RichText.js";
 import { PreOrderDetailView } from "./PreOrderDetailView.js";
 import { PrizeDrawBottomActions } from "./PrizeDrawBottomActions.js";
 import { ProductTabsShell } from "./ProductTabsShell.js";
@@ -24,12 +29,6 @@ import { computeRelatedItems } from "../../../_internal/server/features/products
 import { GroupedListingsCarousel } from "../../grouped/components/GroupedListingsCarousel.js";
 import { getGroupsWithItemsForProduct } from "../../../_internal/server/features/grouped/data.js";
 import { PurchaseReviewAffordance } from "../../reviews/components/PurchaseReviewAffordance.js";
-function toDescriptionHtml(raw) {
-    if (!raw)
-        return "";
-    const s = typeof raw === "string" ? raw : JSON.stringify(raw);
-    return normalizeRichTextHtml(s);
-}
 function statusLabel(s) {
     switch (s) {
         case "open":

package/dist/features/products/components/PrizeDrawEntryActions.d.ts

@@ -29,4 +29,4 @@ export interface PrizeDrawEntryActionsProps {
  * the rule's preflight already checks `prizeMaxEntries`. The whole server half
  * was written and unreachable because the client never sent a quantity.
  */
-export declare function PrizeDrawEntryActions({ productId, productSlug, title, pricePerEntry, currency, remainingEntries, revealStatus, prizeGithubFileUrl, }: PrizeDrawEntryActionsProps): import("react").JSX.Element;
+export declare function PrizeDrawEntryActions({ productId, title, pricePerEntry, currency, remainingEntries, revealStatus, prizeGithubFileUrl, }: PrizeDrawEntryActionsProps): import("react").JSX.Element;

package/dist/features/products/components/PrizeDrawEntryActions.js

@@ -2,7 +2,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from "react";
 import { useRouter } from "next/navigation.js";
-import { Anchor, Button, GatedPrice, QuantityStepper, Row, Stack, Text, LoginRequiredModal, } from "../../../ui/index.js";
+import { Anchor } from "../../../ui/components/Anchor.js";
+import { Button } from "../../../ui/components/Button.js";
+import { GatedPrice } from "../../../ui/components/GatedPrice.js";
+import { QuantityStepper } from "../../../ui/components/QuantityStepper.js";
+import { Row, Stack } from "../../../ui/components/Layout.js";
+import { Text } from "../../../ui/components/Typography.js";
+import { LoginRequiredModal } from "../../../ui/components/LoginRequiredModal.js";
 import { useAddToCart } from "../../cart/hooks/useAddToCart.js";
 import { useToast } from "../../../ui/components/Toast.js";
 import { normalizeError } from "../../../errors/normalize.js";
@@ -34,7 +40,7 @@ import { toUserMessage } from "../../../errors/error-display-map.js";
  * the rule's preflight already checks `prizeMaxEntries`. The whole server half
  * was written and unreachable because the client never sent a quantity.
  */
-export function PrizeDrawEntryActions({ productId, productSlug, title, pricePerEntry, currency, remainingEntries, revealStatus, prizeGithubFileUrl, }) {
+export function PrizeDrawEntryActions({ productId, title, pricePerEntry, currency, remainingEntries, revealStatus, prizeGithubFileUrl, }) {
     const router = useRouter();
     const { requireAuth, isAuthResolving, modalOpen, modalMessage, closeModal } = useAuthGate();
     const [consentOpen, setConsentOpen] = useState(false);

package/dist/features/products/components/PrizeDrawWinnerMappingView.js

@@ -9,7 +9,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * of a small bounded DataTable (≤16 rows per draw) rather than a paginated
  * DataListingView.
  */
-import { Badge, Container, DataTable, Div, Heading, Row, Section, Stack, Text, TextLink } from "../../../ui/index.js";
+import { Badge } from "../../../ui/components/Badge.js";
+import { Container, Row, Stack } from "../../../ui/components/Layout.js";
+import { DataTable } from "../../../ui/DataTable.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Section } from "../../../ui/components/Semantic.js";
+import { TextLink } from "../../../ui/components/TextLink.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { ROUTES } from "../../../next/routing/route-map.js";
 export function PrizeDrawWinnerMappingView({ title = "Prize Draw — Winner Mapping", items, isAdmin, }) {

package/dist/features/products/components/PrizeDrawsIndexListing.js

@@ -6,7 +6,14 @@ import { useState, useCallback } from "react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable.js";
 import { usePendingTable } from "../../../react/hooks/usePendingTable.js";
 import { useProducts } from "../hooks/useProducts.js";
-import { Div, FilterDrawer, Grid, Label, ListingToolbar, Pagination, Row, Select, Stack, Text, StickyToolbar } from "../../../ui/index.js";
+import { Div } from "../../../ui/components/Div.js";
+import { FilterDrawer } from "../../../ui/components/FilterDrawer.js";
+import { Grid, Row, Stack } from "../../../ui/components/Layout.js";
+import { Label, Text } from "../../../ui/components/Typography.js";
+import { ListingToolbar } from "../../../ui/components/ListingToolbar.js";
+import { Pagination } from "../../../ui/components/Pagination.js";
+import { Select } from "../../../ui/components/Select.js";
+import { StickyToolbar } from "../../../ui/components/StickyToolbar.js";
 import { useCategoryTree, categoriesToFacetOptions } from "../../categories/hooks/useCategoryTree.js";
 import { useBrands } from "../hooks/useBrands.js";
 import { MarketplacePrizeDrawCard } from "./MarketplacePrizeDrawCard.js";

package/dist/features/products/components/PrizeDrawsListingView.js

@@ -1,5 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Container, Main, Heading, Section, Text } from "../../../ui/index.js";
+import { Container } from "../../../ui/components/Layout.js";
+import { Main, Section } from "../../../ui/components/Semantic.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
 import { AdSlot } from "../../homepage/components/AdSlot.js";
 import { PRODUCT_FIELDS } from "../../../constants/field-names.js";
 import { sortBy } from "../../../constants/sort.js";

package/dist/features/products/components/PrizeDrawsSection.js

@@ -4,7 +4,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // a client-reference proxy and calling it throws during the server render
 // (Root Cause #18). That is exactly what took `section-prize-draws` down.
 import { sortBy } from "../../../constants/sort.js";
-import { Container, Grid, Heading, Section, Stack, Text } from "../../../ui/index.js";
+import { Container, Grid, Stack } from "../../../ui/components/Layout.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Section } from "../../../ui/components/Semantic.js";
 import { ROUTES } from "../../../next/routing/route-map.js";
 import { listPublicProducts } from "../../../_internal/server/features/products/list-public.js";
 import { AVAILABILITY_VALUES, PRODUCT_FIELDS } from "../../../constants/field-names.js";

package/dist/features/products/components/PrizeRevealModal.js

@@ -9,7 +9,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Firebase Function at draw expiry/sellout ("scheduled" mode). This modal is
  * a pure display: "pending" (no result yet) or "won" (order.prizeWon is set).
  */
-import { Anchor, Div, Heading, Modal, PricesOnly, Span, Stack, Text } from "../../../ui/index.js";
+import { Anchor } from "../../../ui/components/Anchor.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Span, Text } from "../../../ui/components/Typography.js";
+import { Modal } from "../../../ui/components/Modal.js";
+import { PricesOnly } from "../../../ui/components/GatedPrice.js";
+import { Stack } from "../../../ui/components/Layout.js";
 import { MediaImage } from "../../media/MediaImage.js";
 import { PrizeDrawCollage } from "./PrizeDrawCollage.js";
 const __P = {

package/dist/features/products/components/ProductCardMetadataSection.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
-import { Div, Heading, Stack, Text } from "../../../ui/index.js";
+import { Div } from "../../../ui/components/Div.js";
+import { Heading, Text } from "../../../ui/components/Typography.js";
+import { Stack } from "../../../ui/components/Layout.js";
 /**
  * `ProductCardMetadataSection` — W1-34 — renders single-card aftermarket
  * metadata (set name / year / card number / rarity / language). Designed to

package/dist/features/products/components/ProductDetailActions.js

@@ -2,7 +2,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { useRouter } from "next/navigation.js";
-import { Button, Stack, LoginRequiredModal, Icon } from "../../../ui/index.js";
+import { Button } from "../../../ui/components/Button.js";
+import { Stack } from "../../../ui/components/Layout.js";
+import { LoginRequiredModal } from "../../../ui/components/LoginRequiredModal.js";
+import { Icon } from "../../../ui/components/Icon.js";
 import { useToast } from "../../../ui/components/Toast.js";
 import { useAddToCart } from "../../cart/hooks/useAddToCart.js";
 import { apiClient } from "../../../http/index.js";