@thorprovider/blocks 3.0.1 → 4.0.0

package/README.md

@@ -15,6 +15,7 @@ Reusable storefront UI blocks for Thor Commerce, built from [ShadcnStore](https:
 - **Single source of primitives.** The vendored shadcn primitives under `src/ui/` are the only copy; consumers import them from this package instead of installing their own.
 - **No over-abstraction.** Values are split into props vs internal detail with judgment. A prop is added only when the value is genuinely content or configuration; layout and decoration stay internal.
 - **Shared contracts only when reused.** A type like `CTA` is promoted to `src/lib/types.ts` only once two blocks share it.
+- **Consistent motion.** State transitions use the shared motion scale and honor reduced-motion preferences; see the [block motion standard](docs/standards/motion.md).
 
 ## Structure
 
@@ -62,7 +63,7 @@ Blocks follow `src/blocks/<category>/<section>/<block>.tsx`. Each block co-locat
 | `ProductCategory` | E-commerce | Canonical category block; bounded `presentation` `grid` (image cards) / `icons` (compact icon grid) / `list` (rows with subcategory chips and optional controlled search) |
 | `CategoryListing` | E-commerce | Canonical category listing (results + pagination) with a controlled query and bounded `presentation` `sidebar` (persistent desktop panel + mobile sheet) / `toolbar` (sticky mobile toolbar + drawers); generic facet groups render only from real metadata |
 | `ShoppingCart` | E-commerce | Canonical cart; backend-authoritative `Money` totals and item lines, optional promo entry and recently-viewed suggestions; `presentation` `compact` (collapsible card) or `page` (full-width review) |
-| `Checkout` | E-commerce | Canonical page-level checkout; controlled values, backend-authoritative `Money` totals, `PaymentMethod[]` data with no raw card input; `presentation` `single-page` or `stepper`, optional `showReviewStep` |
+| `Checkout` | E-commerce | Canonical page-level checkout; controlled values, backend-authoritative `Money` totals, `PaymentMethod[]` data with no raw card input; `presentation` `single-page`, `accordion`, or `stepper`, optional `showReviewStep` |
 | `CheckoutConfirmation` | E-commerce | Order confirmation with fulfilment timeline |
 | `OrderHistory` | E-commerce | Canonical order-history collection; `presentation` `cards` or `rows`, order-level `Money` totals rendered verbatim, status as data, host-owned pagination and actions |
 | `OrderLine` | E-commerce | Canonical order-line item cell (`name`, optional image/details, quantity, `Money` line total) used inside `OrderHistory` |
@@ -317,32 +318,51 @@ with Spanish defaults (`Agregar al carrito`, `Precio no disponible`, …).
 
 ## Checkout block (page-level, controlled)
 
-`Checkout` is the single public checkout surface; it replaces the numbered `CheckoutForm1`, `CheckoutForm2`, and `CheckoutForm3` blocks. It is a **controlled component**: field values arrive through `values` and every edit is reported through `onChange`, so the host owns all commercial state. The block owns only the ephemeral step index of the `stepper` presentation.
-
-- `presentation: 'single-page' | 'stepper'` (required) — `single-page` renders every section visible at once (summary first in DOM order on mobile); `stepper` shows one step at a time with an accessible progress indicator. Both accept the same props and emit the same callbacks.
-- `showReviewStep?: boolean` — appends a confirmation step (`stepper`) or section (`single-page`) before submission.
-- `values: CheckoutValues` — `email`, `firstName`, `lastName`, `phone`, `address`, `city`, `state`, `zipCode`, `country`, `paymentMethod`, `saveInfo`, `newsletter`, `promoCode`. There are no card fields.
-- `onChange: (field, value) => void` — reported per edit. The block holds no private copy of the form data and applies no masking.
-- `orderSummary?: { items, totals? }` — line identity, name, quantity, optional variant/image, optional canonical `Money` `lineTotal` and `unitPrice`, plus backend `totals` (`subtotal`, optional `discount`/`tax`/`shipping`, `total`). Amounts render verbatim; required totals that are absent or malformed render as unavailable with the retry action, never as zero. No local arithmetic, tax rate, shipping cost, threshold, or hardcoded currency.
-- `totalsState?: 'idle' | 'pending' | 'error'` and `onRetryTotals?` — controlled reads; pending and failed states render status/alert copy without inventing amounts.
-- `countries?: { value, label }[]`, `shippingOptions?`, `selectedShippingOptionId?`, `onSelectShippingOption?` — host-owned options and selection. With no country list the block renders a text input; with no shipping options it renders no method section; nothing is pre-selected.
-- `paymentMethods?: PaymentMethod[]` — payment methods as data (canonical `@thorprovider/types`). One option per method, the selected method's description, an empty state for an empty list, and a non-selectable rendering for `isEnabled === false`. The block renders **no raw card fields**: card collection belongs to the host payment-provider surface.
-- `labels?: Partial<CheckoutLabels>` and `formatMoney?: (money: Money) => string` — every user-facing string is overridable (neutral English defaults) and amounts format through canonical `Money` with no hardcoded symbol.
-- `fieldErrors?` / `fieldDescriptions?` — per-field messages and helper text, rendered with `role="alert"` and `aria-invalid`/`aria-describedby` wiring.
-- `validateStep?: (step: CheckoutStepId) => boolean` and `onStepChange?` — the block consults `validateStep` before advancing and for every applicable step before submitting; `onStepChange` is a notification only, never a controlled value. Without the callback the block advances and leaves submit protection to the host.
-- `onSubmit?`, `submitting?`, `submitError?`, `onRetrySubmit?` — submission is reported, with a pending guard and a recoverable error state; the block never creates an order, clears a cart, or claims success.
+`Checkout` is the single public checkout surface; it replaces the numbered `CheckoutForm1`, `CheckoutForm2`, and `CheckoutForm3` blocks. It is a **controlled component**: contact, shipping, billing, selections, and totals arrive as props; edits are reported through callbacks. The block owns only ephemeral UI state (step index, gift-card input, saved-address create mode and delete confirmation). It performs no HTTP, reads no session/customer/address book, computes no totals, and never creates an order.
+
+- `presentation: 'single-page' | 'accordion' | 'stepper'` and `showReviewStep?` — all three presentations accept the same data and emit the same callbacks; the summary is first in DOM order on `single-page`.
+  - `single-page` keeps every numbered folio section visible and includes an in-page index that reports the section in view, not completion.
+  - `accordion` keeps every step header visible with one section expanded. Closed headers show supplied-value summaries when available, never a completion check; header navigation is not gated by validation.
+  - `stepper` shows one step at a time with a compact progress indicator and Continue/Back actions.
+- `contact: CheckoutContactValues`, `onContactChange`, `customer?`, `onSignIn?`, `onSignOut?` — guest email or a host-supplied authenticated identity. No password, token, or credential fields are rendered.
+- `shippingAddress`, `billingAddress?`, `sameAsShipping`, `onShippingAddressChange`, `onBillingAddressChange?`, `onSameAsShippingChange` — structured addresses. `billingAddress` may be supplied while `sameAsShipping` is true; it is rendered only when the shopper unchecks it.
+- `savedAddresses?`, `onSelectSavedAddress?`, `onCreateSavedAddress?`, `onUpdateSavedAddress?`, `onDeleteSavedAddress?`, `onStartNewAddress?`, `onCancelNewAddress?`, `savedAddressState?` — saved addresses are host data. The shipping picker reports the selection and shows contextual create/update/delete actions only when the corresponding callbacks are supplied; the host mutates and returns the refreshed list. `savedAddressState` carries `pendingId`, `error`, `lastSavedId`, and `lastAction` so the block can render per-entry pending/error states and politely announce saved/deleted results. `CheckoutSavedAddress` carries both `isDefaultShipping` and `isDefaultBilling`. Billing saved-address management is out of scope.
+- `shippingLocations?`, `billingLocations?`, `onRetryLocations?` — host-supplied country, province/state, and city options with per-level loading/error/unavailable states. The block disables a child until its parent is selected. There is no free-text fallback.
+- `shippingGroups?`, `shippingState?`, `onSelectShippingOption?`, `onRetryShipping?` — opaque delivery groups with one selection per group and explicit unavailable groups. The MVP may supply one group. Each group may carry optional `items: CheckoutShippingGroupItem[]` (`{ lineId, quantity? }`) for the review projection. With two or more groups, the review renders one card per group with the selected method, the host-formatted estimate, the per-group price, and the group items; with one group it keeps the compact delivery row and the flat lines list. Group item lists render only when every group item resolves to an order line and every line's quantity is assigned exactly once; otherwise the review falls back to the flat lines list. Prices and estimates are host-supplied and rendered verbatim; the block never sums group prices, allocates the shipping total, or formats dates.
+- `paymentMethods?`, `paymentState?`, `paymentMethod`, `onSelectPaymentMethod`, `onRetryPayment?` — payment methods as data. No raw card fields.
+- `adjustmentPayments?`, `onApplyGiftCard?`, `giftCardState?`, `giftCardMessage?`, `onRemoveAdjustment?`, `storeCredit?` — optional host-wired gift card and store credit. Applied amounts render verbatim; the block never computes a remaining balance.
+- `orderSummary?`, `totalsState?`, `onRetryTotals?`, `promoCode?`, `onPromoCodeChange?`, `onApplyPromo?`, `promoPending?`, `trustNotes?` — backend-authoritative lines and `Money` totals, rendered verbatim. Required totals that are absent or malformed render unavailable, never zero.
+- `labels?`, `formatMoney?`, `fieldErrors?`, `fieldDescriptions?` — every user-facing string is overridable and amounts format through canonical `Money` with no hardcoded symbol. Errors use structured nested maps for `contact`, `shippingAddress`, `billingAddress`, and `paymentMethod`. Delivery-group copy uses `reviewDeliveryGroupsLabel`, `reviewGroupLabel` (`{n}`/`{total}` placeholders), and `reviewGroupItemsLabel`.
+- `validateStep?`, `onStepChange?`, `availability?`, `interruption?`, `onInterruptionAction?`, `submitting?`, `submitError?`, `onRetrySubmit?`, `onSubmit?` — the block consults injected validation before advancing and submitting, renders host-classified availability/interruption states, reports one submission, and never declares success. `onSubmit` receives a `CheckoutSubmission` snapshot.
+
+In `single-page`, every visible step begins with a numbered folio heading (`01`,
+`02`, …) and a hairline separator. The number sits in a desktop gutter while the
+heading, description, and fields share one aligned content column; the form stays
+one continuous surface rather than nesting a card for each step. All sections
+remain expanded, so the ordinal communicates sequence without implying that a
+section is complete.
+
+The shipping form groups the **recipient** first: `firstName`, `lastName`, `company`, and `phone` sit under `recipientHeading` with `recipientDescription`. These fields identify the person receiving the order, not necessarily the signed-in buyer, and are independent of the `contact` identity. The delivery address follows in this order: `address1` (required, labelled “Address line 1”), `address2` (optional, labelled “Address line 2 (optional)”), `countryCode`, `province`, `city`, and `postalCode`; country therefore sits immediately above state/province. Billing reuses the same fields under its own heading without the recipient legend.
+
+Phone labels follow the same copy convention as other checkout fields: optional phones append `optionalIndicatorLabel` (default “optional”), while required phones have no suffix and set `aria-required`. Buyer/contact and recipient/shipping phone requirements are declared independently with `requireContactPhone` and `requireShippingPhone`; the block does not enforce phone presence.
+
+Prefill is host-owned. The host reads the authenticated customer's profile and default addresses, fills only empty fields, and never overwrites cart or shopper-entered values; guests receive no customer prefill. The block receives the mapped `customer`, `savedAddresses`, and controlled values and does not fetch or choose defaults.
 
 Validation itself is **not** implemented in the block. Declare checks in your store spec's validation configuration (built-in `required`/`email`/`pattern`/`minLength`/`maxLength`/cross-field `requiredIf`/`equalTo`/`lessThan`/`greaterThan`, plus catalog-registered custom functions) and evaluate them with the renderer; the messages live in the spec so they are per-store and per-language.
 
 The order summary is an internal projection of `Checkout`, not a separate block. Order receipt and fulfilment progress remain `CheckoutConfirmation`.
 
-### Migrating from the numbered checkout blocks
+### Migrating to the structured checkout contract
 
-| Retired | Replacement |
-| --- | --- |
-| `CheckoutForm1` | `<Checkout presentation="stepper" />` — same controlled values minus `cardNumber`/`expiryDate`/`cvv`/`cardName`/`sameAsBilling`; `validateStep` now receives a `CheckoutStepId` (`'contact' \| 'shipping' \| 'payment' \| 'review'`) instead of a number |
-| `CheckoutForm2` | `<Checkout presentation="single-page" />` — the host supplies `Money` totals; the block no longer computes tax, shipping, or free-shipping thresholds |
-| `CheckoutForm3` | `<Checkout presentation="stepper" showReviewStep />` — values become controlled; `apartment`, card fields, per-step icons, and internal `isStepComplete` state are gone |
+This is a **breaking major** for `@thorprovider/blocks`. The flat `CheckoutValues` contract is replaced.
+
+- Replace `values` + `onChange` with `contact` + `onContactChange`, `shippingAddress` + `onShippingAddressChange`, `billingAddress` + `onBillingAddressChange`, and `sameAsShipping` + `onSameAsShippingChange`.
+- Replace the flat address fields (`address`, `state`, `zipCode`, `country`) with `CheckoutAddressValues` (`address1`, `address2`, `company`, `city`, `province`, `postalCode`, `countryCode`, `phone`).
+- Replace `countries` with `shippingLocations` / `billingLocations`; country, province/state, and city are selectors, never free-text inputs.
+- Replace `shippingOptions` / `selectedShippingOptionId` / `onSelectShippingOption(id)` with `shippingGroups` / `onSelectShippingOption(groupId, optionId)`.
+- Add `customer`, `savedAddresses`, `paymentState`, `shippingState`, `availability`, `interruption`, `fieldErrors`, and the new labels as needed.
+- `validateStep` still receives a `CheckoutStepId` (`'contact' | 'shipping' | 'payment' | 'review'`); `onSubmit` now receives a `CheckoutSubmission` snapshot instead of the flat values.
+- Update the storefront template, showcase consumers, and every fixture in the same change; publish a major changeset.
 
 
 ## Order history (canonical)
@@ -478,6 +498,26 @@ yarn workspace @thorprovider/blocks build    # dist/ with .d.ts
 
 The `'use client'` banner is injected at build time (tsup `banner`) so the bundled library is consumed correctly by Next.js.
 
+## Block audit
+
+`audit/` renders a public block directly in Chromium through Vitest Browser Mode
+with a typed fixture. No Next.js app, showcase, storefront, or Storybook is
+required.
+
+```bash
+yarn workspace @thorprovider/blocks audit --block ProductCard
+yarn workspace @thorprovider/blocks workflow status ProductCard
+```
+
+Fixtures live in `audit/fixtures/` and are keyed by the public export name. A
+block without a fixture is reported as unauditable, not silently skipped.
+Findings and screenshots are written to `.blocks-audit/<Block>/` (gitignored).
+The repo-level `blocks-audit` skill documents the audit -> propose -> fix ->
+review workflow, its two approval gates, and the coordinator/worker execution
+contract. Screenshots use a deterministic system font stack and are
+illustrative; pixel baselines and the committed accepted-findings baseline are
+deferred. The pilot is report-only.
+
 ## Adding a new block
 
 1. Install the raw block as a seed: `npx shadcn@latest add @shadcnstore/<block> --cwd packages/blocks`

package/dist/blocks/designs/marketplace-product-card/block.d.ts

@@ -0,0 +1,12 @@
+import type { MarketplaceProductCardData } from '../../../lib/contracts/marketplace-product-card';
+import { type CardLabels, type Glyphs, type Product, type ProductVariant } from './variants';
+export type MarketplaceProductCardProps = {
+    data: MarketplaceProductCardData;
+    product?: Product;
+    labels?: CardLabels;
+    glyphs?: Glyphs;
+    onAddToCart?: (variant: ProductVariant, product: Product) => void;
+    onToggleWishlist?: (product: Product, nextState: boolean) => void;
+};
+export default function MarketplaceProductCard(__designProps: MarketplaceProductCardProps): import("react").JSX.Element;
+//# sourceMappingURL=block.d.ts.map

package/dist/blocks/designs/marketplace-product-card/block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"block.d.ts","sourceRoot":"","sources":["../../../../src/blocks/designs/marketplace-product-card/block.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,iDAAiD,CAAA;AAIjG,OAAO,EAUL,KAAK,UAAU,EACf,KAAK,MAAM,EACX,KAAK,OAAO,EACZ,KAAK,cAAc,EAGpB,MAAM,YAAY,CAAA;AAEnB,MAAM,MAAM,2BAA2B,GAAG;IACxC,IAAI,EAAE,0BAA0B,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,UAAU,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;IACjE,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;CAClE,CAAA;AAYD,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,aAAa,EAAE,2BAA2B,+BAyPxF"}

package/dist/blocks/designs/marketplace-product-card/block.js

@@ -0,0 +1,243 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var block_exports = {};
+__export(block_exports, {
+  default: () => MarketplaceProductCard
+});
+module.exports = __toCommonJS(block_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_normalize = require("./normalize.js");
+var import_badge = require("../../../ui/badge.js");
+var import_button = require("../../../ui/button.js");
+var import_card = require("../../../ui/card.js");
+var import_contracts = require("../../../lib/contracts.js");
+var import_utils = require("../../../lib/utils.js");
+var import_react = require("react");
+var import_variants = require("./variants.js");
+const STOCK_TONE_CLASS = {
+  success: "text-success",
+  attention: "text-destructive",
+  destructive: "text-destructive"
+};
+function formatReviewCount(count, locale) {
+  return new Intl.NumberFormat(locale).format(count);
+}
+function MarketplaceProductCard(__designProps) {
+  const data = (0, import_normalize.normalizeData)(__designProps.data);
+  const {
+    product = data.product,
+    labels = data.labels,
+    glyphs = data.glyphs,
+    onAddToCart,
+    onToggleWishlist
+  } = __designProps;
+  const [selection, setSelection] = (0, import_react.useState)(() => (0, import_variants.firstAvailableSelection)(product));
+  const [wishlisted, setWishlisted] = (0, import_react.useState)(false);
+  const [renderedProductId, setRenderedProductId] = (0, import_react.useState)(product.id);
+  const baseId = (0, import_react.useId)();
+  if (product.id !== renderedProductId) {
+    setRenderedProductId(product.id);
+    setSelection((0, import_variants.firstAvailableSelection)(product));
+    setWishlisted(false);
+  }
+  const activeSelection = (0, import_variants.findVariant)(product, selection) ? selection : (0, import_variants.firstAvailableSelection)(product);
+  const variant = (0, import_variants.findVariant)(product, activeSelection) ?? product.variants[0];
+  const image = (0, import_variants.resolveVariantImage)(product, variant, activeSelection);
+  const discount = variant ? (0, import_variants.discountPercent)(variant.price, variant.compareAtPrice) : null;
+  const priceLabel = variant ? (0, import_variants.formatPrice)(variant.price, product.locale, product.currency) : labels.unavailablePrice;
+  const compareLabel = variant?.compareAtPrice !== void 0 && discount !== null ? (0, import_variants.formatPrice)(variant.compareAtPrice, product.locale, product.currency) : null;
+  const discountLabel = discount !== null ? (0, import_variants.formatDiscount)(discount, product.locale) : null;
+  const reviews = formatReviewCount(product.reviewCount, product.locale);
+  const filledStars = Math.round(product.rating);
+  const stars = Array.from(
+    { length: 5 },
+    (_, index) => index < filledStars ? glyphs.fullStar : glyphs.emptyStar
+  );
+  const selectedLabels = product.options.map((option) => option.values.find((value) => value.id === activeSelection[option.id])?.label).filter((label) => Boolean(label)).join(", ");
+  const stockLabel = variant?.stockLabel ?? labels.outOfStock;
+  const liveSummary = [product.title, selectedLabels, priceLabel, stockLabel].filter((part) => Boolean(part)).join(", ");
+  const stockTone = variant ? STOCK_TONE_CLASS[variant.stockTone] : STOCK_TONE_CLASS.destructive;
+  const handleAddToCart = () => {
+    if (variant?.available) onAddToCart?.(variant, product);
+  };
+  const handleWishlist = () => {
+    const next = !wishlisted;
+    setWishlisted(next);
+    onToggleWishlist?.(product, next);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("article", { "aria-label": product.title, className: "w-full sm:mx-auto sm:max-w-xs", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.Card, { className: "group/card gap-0 overflow-hidden py-0 shadow-sm transition-shadow hover:shadow-md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative aspect-square overflow-hidden bg-muted", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "img",
+        {
+          "data-testid": "image",
+          src: image.src ?? import_contracts.PRODUCT_IMAGE_FALLBACK,
+          alt: image.alt,
+          width: 800,
+          height: 800,
+          className: "size-full object-cover transition-transform duration-300 group-hover/card:scale-105"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_badge.Badge, { className: "absolute left-3 top-3 rounded-full bg-accent px-2 text-accent-foreground", children: product.badge }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_button.Button,
+        {
+          type: "button",
+          size: "icon-sm",
+          "data-testid": "wishlist",
+          "aria-label": wishlisted ? labels.wishlistRemove : labels.wishlistAdd,
+          "aria-pressed": wishlisted,
+          onClick: handleWishlist,
+          className: "absolute right-3 top-3 rounded-full border border-border bg-card/90 text-foreground shadow-sm backdrop-blur hover:bg-card",
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: (0, import_utils.cn)("text-base leading-none", wishlisted && "text-accent"),
+              children: wishlisted ? glyphs.heartFilled : glyphs.heart
+            }
+          )
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.CardContent, { className: "flex flex-col gap-2 p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: product.brand }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "line-clamp-2 min-h-10 text-sm font-medium leading-snug", children: product.title }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-1.5 gap-y-0.5 text-xs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-warning", "aria-hidden": "true", children: stars.join("") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-medium", children: product.rating.toFixed(1) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: `(${reviews})` }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: product.soldLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sr-only", children: product.ratingLabel })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            "data-testid": "price",
+            className: (0, import_utils.cn)(
+              "text-xl font-semibold tracking-tight",
+              !variant && "text-sm font-normal text-muted-foreground"
+            ),
+            children: priceLabel
+          }
+        ),
+        compareLabel !== null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "data-testid": "compare", className: "text-xs text-muted-foreground line-through", children: compareLabel }) : null,
+        discountLabel !== null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "data-testid": "discount", className: "text-xs font-semibold text-accent", children: discountLabel }) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-1.5 text-xs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-medium text-success", children: product.shippingLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: product.deliveryLabel })
+      ] }),
+      product.options.map((option, optionIndex) => {
+        const labelId = `${baseId}-${option.id}`;
+        const selectedValue = option.values.find(
+          (value) => value.id === activeSelection[option.id]
+        );
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            role: "group",
+            "aria-labelledby": labelId,
+            className: "flex flex-col gap-1.5",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { id: labelId, className: "text-xs text-muted-foreground", children: `${option.name}${labels.optionSeparator} ${selectedValue?.label ?? ""}` }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap gap-1.5", children: option.values.map((value) => {
+                const disabled = (0, import_variants.isValueDisabled)(
+                  product,
+                  activeSelection,
+                  optionIndex,
+                  value.id
+                );
+                const selected = activeSelection[option.id] === value.id;
+                if (option.kind === "image") {
+                  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "button",
+                    {
+                      type: "button",
+                      "aria-label": value.label,
+                      "aria-pressed": selected,
+                      disabled,
+                      title: disabled ? labels.unavailableOption : void 0,
+                      "data-testid": `option-${option.id}-${value.id}`,
+                      onClick: () => setSelection(
+                        (0, import_variants.selectValue)(product, activeSelection, optionIndex, value.id)
+                      ),
+                      className: (0, import_utils.cn)(
+                        "relative size-9 overflow-hidden rounded-md border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card disabled:cursor-not-allowed disabled:opacity-40",
+                        selected ? "border-ring ring-2 ring-ring ring-offset-2 ring-offset-card" : "border-border"
+                      ),
+                      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        "img",
+                        {
+                          src: (0, import_variants.firstNonEmpty)(value.image) ?? import_contracts.PRODUCT_IMAGE_FALLBACK,
+                          alt: value.label,
+                          "aria-hidden": "true",
+                          width: 36,
+                          height: 36,
+                          className: "size-full object-cover"
+                        }
+                      )
+                    },
+                    value.id
+                  );
+                }
+                return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_button.Button,
+                  {
+                    type: "button",
+                    "aria-pressed": selected,
+                    disabled,
+                    title: disabled ? labels.unavailableOption : void 0,
+                    "data-testid": `option-${option.id}-${value.id}`,
+                    onClick: () => setSelection(
+                      (0, import_variants.selectValue)(product, activeSelection, optionIndex, value.id)
+                    ),
+                    className: (0, import_utils.cn)(
+                      "h-7 min-w-8 rounded-md border px-2 py-0 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card disabled:cursor-not-allowed disabled:opacity-40 disabled:line-through",
+                      selected ? "border-primary bg-primary text-primary-foreground" : "border-border bg-card text-foreground hover:border-foreground hover:bg-card"
+                    ),
+                    children: value.label
+                  },
+                  value.id
+                );
+              }) })
+            ]
+          },
+          option.id
+        );
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_button.Button,
+        {
+          type: "button",
+          "data-testid": "add-to-cart",
+          disabled: !variant?.available,
+          onClick: handleAddToCart,
+          className: "w-full bg-accent text-accent-foreground hover:bg-accent/90",
+          children: labels.addToCart
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { "data-testid": "stock", className: (0, import_utils.cn)("text-xs font-medium", stockTone), children: stockLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "sr-only", "aria-live": "polite", children: liveSummary })
+    ] })
+  ] }) });
+}
+//# sourceMappingURL=block.js.map

package/dist/blocks/designs/marketplace-product-card/block.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/designs/marketplace-product-card/block.tsx"],"sourcesContent":["'use client'\n\nimport { normalizeData } from './normalize'\nimport { Badge } from '../../../ui/badge'\nimport { Button } from '../../../ui/button'\nimport { Card, CardContent } from '../../../ui/card'\nimport { PRODUCT_IMAGE_FALLBACK } from '../../../lib/contracts'\nimport { cn } from '../../../lib/utils'\nimport type { MarketplaceProductCardData } from '../../../lib/contracts/marketplace-product-card'\n\nimport { useId, useState } from 'react'\n\nimport {\n  discountPercent,\n  findVariant,\n  firstAvailableSelection,\n  firstNonEmpty,\n  formatDiscount,\n  formatPrice,\n  isValueDisabled,\n  resolveVariantImage,\n  selectValue,\n  type CardLabels,\n  type Glyphs,\n  type Product,\n  type ProductVariant,\n  type Selection,\n  type StockTone,\n} from './variants'\n\nexport type MarketplaceProductCardProps = {\n  data: MarketplaceProductCardData;\n  product?: Product\n  labels?: CardLabels\n  glyphs?: Glyphs\n  onAddToCart?: (variant: ProductVariant, product: Product) => void\n  onToggleWishlist?: (product: Product, nextState: boolean) => void\n}\n\nconst STOCK_TONE_CLASS: Record<StockTone, string> = {\n  success: 'text-success',\n  attention: 'text-destructive',\n  destructive: 'text-destructive',\n}\n\nfunction formatReviewCount(count: number, locale: string): string {\n  return new Intl.NumberFormat(locale).format(count)\n}\n\nexport default function MarketplaceProductCard(__designProps: MarketplaceProductCardProps) {\n  const data = normalizeData(__designProps.data)\n  const {\n    product = data.product,\n    labels = data.labels,\n    glyphs = data.glyphs,\n    onAddToCart,\n    onToggleWishlist,\n  } = __designProps\n  const [selection, setSelection] = useState<Selection>(() => firstAvailableSelection(product))\n  const [wishlisted, setWishlisted] = useState(false)\n  const [renderedProductId, setRenderedProductId] = useState(product.id)\n  const baseId = useId()\n\n  if (product.id !== renderedProductId) {\n    setRenderedProductId(product.id)\n    setSelection(firstAvailableSelection(product))\n    setWishlisted(false)\n  }\n\n  const activeSelection = findVariant(product, selection)\n    ? selection\n    : firstAvailableSelection(product)\n  const variant = findVariant(product, activeSelection) ?? product.variants[0]\n  const image = resolveVariantImage(product, variant, activeSelection)\n  const discount = variant ? discountPercent(variant.price, variant.compareAtPrice) : null\n  const priceLabel = variant\n    ? formatPrice(variant.price, product.locale, product.currency)\n    : labels.unavailablePrice\n  const compareLabel =\n    variant?.compareAtPrice !== undefined && discount !== null\n      ? formatPrice(variant.compareAtPrice, product.locale, product.currency)\n      : null\n  const discountLabel = discount !== null ? formatDiscount(discount, product.locale) : null\n\n  const reviews = formatReviewCount(product.reviewCount, product.locale)\n  const filledStars = Math.round(product.rating)\n  const stars = Array.from({ length: 5 }, (_, index) =>\n    index < filledStars ? glyphs.fullStar : glyphs.emptyStar,\n  )\n\n  const selectedLabels = product.options\n    .map((option) => option.values.find((value) => value.id === activeSelection[option.id])?.label)\n    .filter((label): label is string => Boolean(label))\n    .join(', ')\n\n  const stockLabel = variant?.stockLabel ?? labels.outOfStock\n  const liveSummary = [product.title, selectedLabels, priceLabel, stockLabel]\n    .filter((part): part is string => Boolean(part))\n    .join(', ')\n  const stockTone = variant ? STOCK_TONE_CLASS[variant.stockTone] : STOCK_TONE_CLASS.destructive\n\n  const handleAddToCart = () => {\n    if (variant?.available) onAddToCart?.(variant, product)\n  }\n\n  const handleWishlist = () => {\n    const next = !wishlisted\n    setWishlisted(next)\n    onToggleWishlist?.(product, next)\n  }\n\n  return (\n    <article aria-label={product.title} className=\"w-full sm:mx-auto sm:max-w-xs\">\n      <Card className=\"group/card gap-0 overflow-hidden py-0 shadow-sm transition-shadow hover:shadow-md\">\n        <div className=\"relative aspect-square overflow-hidden bg-muted\">\n          <img\n            data-testid=\"image\"\n            src={image.src ?? PRODUCT_IMAGE_FALLBACK}\n            alt={image.alt}\n            width={800}\n            height={800}\n            className=\"size-full object-cover transition-transform duration-300 group-hover/card:scale-105\"\n          />\n          <Badge className=\"absolute left-3 top-3 rounded-full bg-accent px-2 text-accent-foreground\">\n            {product.badge}\n          </Badge>\n          <Button\n            type=\"button\"\n            size=\"icon-sm\"\n            data-testid=\"wishlist\"\n            aria-label={wishlisted ? labels.wishlistRemove : labels.wishlistAdd}\n            aria-pressed={wishlisted}\n            onClick={handleWishlist}\n            className=\"absolute right-3 top-3 rounded-full border border-border bg-card/90 text-foreground shadow-sm backdrop-blur hover:bg-card\"\n          >\n            <span\n              aria-hidden=\"true\"\n              className={cn('text-base leading-none', wishlisted && 'text-accent')}\n            >\n              {wishlisted ? glyphs.heartFilled : glyphs.heart}\n            </span>\n          </Button>\n        </div>\n\n        <CardContent className=\"flex flex-col gap-2 p-3\">\n          <p className=\"text-xs uppercase tracking-wide text-muted-foreground\">{product.brand}</p>\n\n          <h3 className=\"line-clamp-2 min-h-10 text-sm font-medium leading-snug\">\n            {product.title}\n          </h3>\n\n          <div className=\"flex flex-wrap items-center gap-x-1.5 gap-y-0.5 text-xs\">\n            <span className=\"text-warning\" aria-hidden=\"true\">\n              {stars.join('')}\n            </span>\n            <span className=\"font-medium\">{product.rating.toFixed(1)}</span>\n            <span className=\"text-muted-foreground\">{`(${reviews})`}</span>\n            <span className=\"text-muted-foreground\">{product.soldLabel}</span>\n            <span className=\"sr-only\">{product.ratingLabel}</span>\n          </div>\n\n          <div className=\"flex flex-wrap items-baseline gap-x-2\">\n            <span\n              data-testid=\"price\"\n              className={cn(\n                'text-xl font-semibold tracking-tight',\n                !variant && 'text-sm font-normal text-muted-foreground',\n              )}\n            >\n              {priceLabel}\n            </span>\n            {compareLabel !== null ? (\n              <span data-testid=\"compare\" className=\"text-xs text-muted-foreground line-through\">\n                {compareLabel}\n              </span>\n            ) : null}\n            {discountLabel !== null ? (\n              <span data-testid=\"discount\" className=\"text-xs font-semibold text-accent\">\n                {discountLabel}\n              </span>\n            ) : null}\n          </div>\n\n          <div className=\"flex flex-wrap items-center gap-x-1.5 text-xs\">\n            <span className=\"font-medium text-success\">{product.shippingLabel}</span>\n            <span className=\"text-muted-foreground\">{product.deliveryLabel}</span>\n          </div>\n\n          {product.options.map((option, optionIndex) => {\n            const labelId = `${baseId}-${option.id}`\n            const selectedValue = option.values.find(\n              (value) => value.id === activeSelection[option.id],\n            )\n\n            return (\n              <div\n                key={option.id}\n                role=\"group\"\n                aria-labelledby={labelId}\n                className=\"flex flex-col gap-1.5\"\n              >\n                <p id={labelId} className=\"text-xs text-muted-foreground\">\n                  {`${option.name}${labels.optionSeparator} ${selectedValue?.label ?? ''}`}\n                </p>\n                <div className=\"flex flex-wrap gap-1.5\">\n                  {option.values.map((value) => {\n                    const disabled = isValueDisabled(\n                      product,\n                      activeSelection,\n                      optionIndex,\n                      value.id,\n                    )\n                    const selected = activeSelection[option.id] === value.id\n\n                    if (option.kind === 'image') {\n                      return (\n                        <button\n                          key={value.id}\n                          type=\"button\"\n                          aria-label={value.label}\n                          aria-pressed={selected}\n                          disabled={disabled}\n                          title={disabled ? labels.unavailableOption : undefined}\n                          data-testid={`option-${option.id}-${value.id}`}\n                          onClick={() =>\n                            setSelection(\n                              selectValue(product, activeSelection, optionIndex, value.id),\n                            )\n                          }\n                          className={cn(\n                            'relative size-9 overflow-hidden rounded-md border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card disabled:cursor-not-allowed disabled:opacity-40',\n                            selected\n                              ? 'border-ring ring-2 ring-ring ring-offset-2 ring-offset-card'\n                              : 'border-border',\n                          )}\n                        >\n                          <img\n                            src={firstNonEmpty(value.image) ?? PRODUCT_IMAGE_FALLBACK}\n                            alt={value.label}\n                            aria-hidden=\"true\"\n                            width={36}\n                            height={36}\n                            className=\"size-full object-cover\"\n                          />\n                        </button>\n                      )\n                    }\n\n                    return (\n                      <Button\n                        key={value.id}\n                        type=\"button\"\n                        aria-pressed={selected}\n                        disabled={disabled}\n                        title={disabled ? labels.unavailableOption : undefined}\n                        data-testid={`option-${option.id}-${value.id}`}\n                        onClick={() =>\n                          setSelection(\n                            selectValue(product, activeSelection, optionIndex, value.id),\n                          )\n                        }\n                        className={cn(\n                          'h-7 min-w-8 rounded-md border px-2 py-0 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card disabled:cursor-not-allowed disabled:opacity-40 disabled:line-through',\n                          selected\n                            ? 'border-primary bg-primary text-primary-foreground'\n                            : 'border-border bg-card text-foreground hover:border-foreground hover:bg-card',\n                        )}\n                      >\n                        {value.label}\n                      </Button>\n                    )\n                  })}\n                </div>\n              </div>\n            )\n          })}\n\n          <Button\n            type=\"button\"\n            data-testid=\"add-to-cart\"\n            disabled={!variant?.available}\n            onClick={handleAddToCart}\n            className=\"w-full bg-accent text-accent-foreground hover:bg-accent/90\"\n          >\n            {labels.addToCart}\n          </Button>\n\n          <p data-testid=\"stock\" className={cn('text-xs font-medium', stockTone)}>\n            {stockLabel}\n          </p>\n\n          <p className=\"sr-only\" aria-live=\"polite\">\n            {liveSummary}\n          </p>\n        </CardContent>\n      </Card>\n    </article>\n  )\n}\n"],"mappings":"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","names":[]}