@shoppexio/storefront-react 0.2.1 → 0.3.0

package/dist/index.js

@@ -23,7 +23,7 @@ import {
   resolveAccountView,
   sdkFavoritesTransport,
   useFavorites
-} from "./chunk-ZEFZPUAW.js";
+} from "./chunk-NBOIS53R.js";
 
 // src/account-route-messages.ts
 var ACCOUNT_ROUTE_MESSAGE_KEYS = [
@@ -71,6 +71,125 @@ import {
   useState
 } from "react";
 
+// ../contracts/src/catalog-line-price.ts
+function ruleTypeName(entry) {
+  if (typeof entry.type === "string") return entry.type;
+  if (typeof entry.discount_type === "string") return entry.discount_type;
+  if (typeof entry.discountType === "string") return entry.discountType;
+  return "";
+}
+function parseVolumeDiscountRules(raw) {
+  let parsed = raw;
+  if (typeof raw === "string") {
+    try {
+      parsed = JSON.parse(raw);
+    } catch {
+      return [];
+    }
+  }
+  const container = parsed && typeof parsed === "object" ? parsed : null;
+  const source = Array.isArray(parsed) ? parsed : Array.isArray(container?.volume_discounts) ? container.volume_discounts : Array.isArray(container?.volumeDiscounts) ? container.volumeDiscounts : [];
+  const rules = [];
+  for (const candidate of source) {
+    if (!candidate || typeof candidate !== "object" || Array.isArray(candidate)) continue;
+    const entry = candidate;
+    const quantity = Number(entry.quantity ?? entry.min_quantity ?? entry.minQuantity);
+    const value = Number(entry.value ?? entry.discount ?? entry.amount);
+    const typeNormalized = ruleTypeName(entry).trim().toUpperCase();
+    const type = typeNormalized.includes("PERCENT") ? "PERCENTAGE" : typeNormalized.includes("FIX") || typeNormalized.includes("AMOUNT") ? "FIXED" : null;
+    if (!Number.isFinite(quantity) || quantity < 1) continue;
+    if (!Number.isFinite(value) || value <= 0) continue;
+    if (!type) continue;
+    rules.push({ quantity: Math.floor(quantity), type, value });
+  }
+  return rules.sort((a, b) => a.quantity - b.quantity);
+}
+function resolveVolumeDiscountRule(rules, quantity) {
+  if (!Number.isFinite(quantity) || quantity < 1) return null;
+  let resolved = null;
+  for (const rule of rules) {
+    if (quantity >= rule.quantity) resolved = rule;
+  }
+  return resolved;
+}
+var TEN = BigInt(10);
+var SIGNIFICANT_DIGITS = 20;
+function pow10(n) {
+  return TEN ** BigInt(n);
+}
+function divRoundHalfUp(value, divisor) {
+  const negative = value < BigInt(0);
+  const abs = negative ? -value : value;
+  let quotient = abs / divisor;
+  if (abs % divisor * BigInt(2) >= divisor) quotient += BigInt(1);
+  return negative ? -quotient : quotient;
+}
+function rounded(d) {
+  const digits = (d.c < BigInt(0) ? -d.c : d.c).toString().length;
+  if (digits <= SIGNIFICANT_DIGITS) return d;
+  const drop = digits - SIGNIFICANT_DIGITS;
+  return { c: divRoundHalfUp(d.c, pow10(drop)), e: d.e + drop };
+}
+function dec(value) {
+  const match = /^(-?)(\d+)(?:\.(\d+))?(?:e([+-]?\d+))?$/.exec(String(value));
+  if (!match) throw new RangeError(`Not a finite amount: ${value}`);
+  const fraction = match[3] ?? "";
+  return { c: BigInt(`${match[1]}${match[2]}${fraction}`), e: Number(match[4] ?? 0) - fraction.length };
+}
+function plus(a, b) {
+  const e = Math.min(a.e, b.e);
+  return rounded({ c: a.c * pow10(a.e - e) + b.c * pow10(b.e - e), e });
+}
+function minus(a, b) {
+  return plus(a, { c: -b.c, e: b.e });
+}
+function times(a, b) {
+  return rounded({ c: a.c * b.c, e: a.e + b.e });
+}
+function percentOf(amount, percent) {
+  const product = times(amount, dec(percent));
+  return rounded({ c: product.c, e: product.e - 2 });
+}
+function greaterThan(a, b) {
+  return minus(a, b).c > BigInt(0);
+}
+function toCents(d) {
+  return d.e >= -2 ? d.c * pow10(d.e + 2) : divRoundHalfUp(d.c, pow10(-2 - d.e));
+}
+function centsToAmount(cents) {
+  const negative = cents < BigInt(0);
+  const digits = (negative ? -cents : cents).toString().padStart(3, "0");
+  return Number(`${negative ? "-" : ""}${digits.slice(0, -2)}.${digits.slice(-2)}`);
+}
+function clampPercent(value) {
+  return Math.min(Math.max(value, 0), 100);
+}
+function calculateCatalogLinePrice(input) {
+  const unitPrice = Number.isFinite(input.unitPrice) ? Math.max(input.unitPrice, 0) : 0;
+  const quantity = Number.isFinite(input.quantity) ? Math.max(1, Math.floor(input.quantity ?? 1)) : 1;
+  const addonsTotal = (input.addonPrices ?? []).reduce(
+    (sum, price) => plus(sum, dec(Number.isFinite(price) ? Math.max(price, 0) : 0)),
+    dec(0)
+  );
+  const subtotalCents = toCents(times(plus(dec(unitPrice), addonsTotal), dec(quantity)));
+  const subtotal = { c: subtotalCents, e: -2 };
+  const rawPercent = Number(input.productDiscountPercent ?? 0);
+  const productDiscount = Number.isFinite(rawPercent) && rawPercent > 0 ? percentOf(subtotal, clampPercent(rawPercent)) : dec(0);
+  const afterProduct = minus(subtotal, productDiscount);
+  const rule = resolveVolumeDiscountRule(parseVolumeDiscountRules(input.volumeDiscounts), quantity);
+  const volumeRaw = !rule ? dec(0) : rule.type === "PERCENTAGE" ? percentOf(afterProduct, clampPercent(rule.value)) : dec(rule.value);
+  const volumeDiscount = greaterThan(volumeRaw, afterProduct) ? afterProduct : volumeRaw;
+  const totalCents = toCents(minus(afterProduct, volumeDiscount));
+  const afterProductCents = toCents(afterProduct);
+  return {
+    subtotal: centsToAmount(subtotalCents),
+    productDiscount: centsToAmount(subtotalCents - afterProductCents),
+    subtotalAfterProductDiscount: centsToAmount(afterProductCents),
+    volumeDiscount: centsToAmount(afterProductCents - totalCents),
+    total: centsToAmount(totalCents)
+  };
+}
+
 // src/parse.ts
 function isRecord(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
@@ -434,6 +553,10 @@ function parseDeliverable(value) {
   const normalized = typeof value === "string" ? value.trim().toUpperCase() : "";
   return DELIVERABLES_BY_TYPE[normalized] ?? null;
 }
+var DELIVERY_TYPES = /* @__PURE__ */ new Set(["key", "download", "service", "shipped"]);
+function parseDeliveryType(value) {
+  return typeof value === "string" && DELIVERY_TYPES.has(value) ? value : null;
+}
 function resolveYouReceive(product) {
   if (product.deliverable === "serials") return { kind: "serials", unitLabel: product.unitLabelSingular };
   if (product.deliverable === "file") return { kind: "download" };
@@ -520,7 +643,8 @@ function getProductGroups() {
       categoryId: optionalString(group.category_id),
       productIds,
       productsCount: normalizeOptionalNonNegativeNumber(group.products_count) ?? productIds.length,
-      sortPriority: normalizeOptionalNonNegativeNumber(group.sort_priority) ?? 0
+      sortPriority: normalizeOptionalNonNegativeNumber(group.sort_priority) ?? 0,
+      ...parseGroupFeedback(group.feedback, `${context}.feedback`)
     };
   });
 }
@@ -585,6 +709,7 @@ function getStorefrontShop(productCount) {
   const termsHtml = store.tos_enabled === true ? optionalString(store.terms_of_service) : null;
   return {
     name: requireString(store, "name", "store"),
+    description: optionalString(store.description),
     logoUrl: firstOptionalString(store, ["logo", "avatar"]),
     avatarUrl: firstOptionalString(store, ["avatar", "logo"]),
     socialLinks: SOCIAL_NETWORKS.flatMap((network) => {
@@ -745,7 +870,8 @@ function parseProduct(value, index) {
   const id = requireString(product, "uniqid", context);
   const productId = optionalString(product.id) ?? id;
   const discountPercent = product.pay_what_you_want === true ? 0 : normalizeDiscountPercent(product.price_discount);
-  const applyDiscount = (amount) => discountPercent > 0 ? roundCurrency(amount * (1 - discountPercent / 100)) : amount;
+  const applyDiscount = (amount) => discountPercent > 0 ? calculateDisplayLineTotal(amount, 1, discountPercent, []) : amount;
+  const images = parseProductImages(product.images);
   const rawVariants = parsePriceVariants(product.price_variants, context);
   const priceVariants = rawVariants.map((variant) => ({
     ...variant,
@@ -768,7 +894,8 @@ function parseProduct(value, index) {
     description: optionalString(product.description),
     slug: optionalString(product.slug),
     imageUrl: resolveProductImage(product),
-    imageUrls: parseProductImageUrls(product.images),
+    imageUrls: images.map((image) => image.url),
+    images,
     stock: applyOrderable(
       normalizeStock(product.stock, `${context}.stock`),
       product.orderable,
@@ -778,7 +905,7 @@ function parseProduct(value, index) {
       normalizeOptionalNonNegativeNumber(product.quantity_warning)
     ),
     hideStockCounter: typeof product.hide_stock_counter === "boolean" ? product.hide_stock_counter : null,
-    volumeDiscounts: parseVolumeDiscounts(product.volume_discounts),
+    volumeDiscounts: parseVolumeDiscountRules(product.volume_discounts),
     payWhatYouWant: product.pay_what_you_want === true,
     discountPercent,
     baseUnitPrice: undiscountedPrice,
@@ -796,6 +923,8 @@ function parseProduct(value, index) {
     automaticDeals: parseAutomaticDeals(product.automatic_deals),
     videoEmbedSrc: resolveProductVideoEmbedSrc(product.video_link),
     addons: parseAddons(product.addons),
+    addonsRequired: optionalBoolean(product.addons_required, false, `${context}.addons_required`),
+    upsellProductIds: parseUpsellProductIds(product.upsell_product_ids, context),
     customFields: parseCustomFields(product.custom_fields, context),
     // Strict on purpose: the serializer always emits `on_hold`, so an absent
     // flag is the only tolerated shape (false) and a present non-boolean is a
@@ -808,8 +937,12 @@ function parseProduct(value, index) {
     ratingTally: rating?.tally ?? null,
     shortDescription: optionalString(product.short_description),
     deliverable: parseDeliverable(product.type),
+    deliveryType: parseDeliveryType(product.delivery_type),
     unitLabelSingular: optionalString(product.label_singular),
     unitLabelPlural: optionalString(product.label_plural),
+    deliveryFormat: optionalString(product.delivery_format),
+    region: optionalString(product.region),
+    restockedAt: optionalString(product.restocked_at),
     serviceStatus: parseServiceStatus(product.service_status, context),
     highlights: parseHighlights(product.product_highlights),
     metadata: parseMetadata(product.metadata),
@@ -962,20 +1095,34 @@ function parseAddons(value) {
     addons.push({
       id,
       title,
+      description: optionalString(entry.description),
       price: Number.isFinite(price) && price > 0 ? price : 0,
       required: entry.required === true
     });
   }
   return addons;
 }
-function parseProductImageUrls(value) {
+function parseUpsellProductIds(value, context) {
+  if (value === void 0) return [];
+  if (!Array.isArray(value) || !value.every((id) => typeof id === "string")) {
+    throw new Error(`Invalid Shoppex ${context}.upsell_product_ids: expected an array of product uniqids.`);
+  }
+  return value;
+}
+function parseProductImages(value) {
   if (!Array.isArray(value)) return [];
-  const urls = [];
+  const images = [];
   for (const entry of value) {
-    const url = typeof entry === "string" ? optionalString(entry) : isRecord(entry) ? optionalString(entry.url) : null;
-    if (url && !urls.includes(url)) urls.push(url);
+    const record = isRecord(entry) ? entry : null;
+    const url = record ? optionalString(record.url) : typeof entry === "string" ? optionalString(entry) : null;
+    if (!url || images.some((image) => image.url === url)) continue;
+    images.push({
+      url,
+      kind: record && (record.kind === "art" || record.kind === "logo") ? record.kind : null,
+      inkColor: record && typeof record.ink_color === "string" && /^#[0-9a-f]{6}$/.test(record.ink_color) ? record.ink_color : null
+    });
   }
-  return urls;
+  return images;
 }
 function parseMetadata(value) {
   if (!isRecord(value)) return {};
@@ -1012,6 +1159,7 @@ function parseCustomFields(value, context) {
     const rawType = typeof entry.type === "string" ? entry.type.trim().toLowerCase() : "";
     const type = rawType || "text";
     if (type === "hidden") continue;
+    if ([entry.collect_after_payment, entry.collectAfterPayment].some((flag) => flag === true || flag === 1 || flag === "1" || flag === "true")) continue;
     const defaultValue = firstOptionalString(entry, ["default_value", "default", "value"]);
     fields.push({
       name,
@@ -1023,7 +1171,8 @@ function parseCustomFields(value, context) {
       required: entry.required === true || entry.required === 1 || entry.required === "1" || entry.required === "true",
       defaultValue: defaultValue ?? "",
       placeholder: typeof entry.placeholder === "string" ? entry.placeholder : "",
-      regex: optionalString(entry.regex)
+      regex: optionalString(entry.regex),
+      ...type === "select" ? { options: Array.isArray(entry.options) ? entry.options.filter((option) => typeof option === "string") : [] } : {}
     });
   }
   return fields;
@@ -1083,41 +1232,32 @@ function parseFaqs(value) {
   }
   return faqs;
 }
-function parseVolumeDiscounts(value) {
-  const source = Array.isArray(value) ? value : isRecord(value) && Array.isArray(value.volume_discounts) ? value.volume_discounts : [];
-  const rules = [];
-  for (const entry of source) {
-    if (!isRecord(entry)) continue;
-    const quantity = Number(entry.quantity ?? entry.min_quantity);
-    const amount = Number(entry.value ?? entry.discount ?? entry.amount);
-    const typeRaw = String(entry.type ?? entry.discount_type ?? "").toUpperCase();
-    const type = typeRaw.includes("PERCENT") ? "PERCENTAGE" : typeRaw.includes("FIX") || typeRaw.includes("AMOUNT") ? "FIXED" : null;
-    if (!Number.isFinite(quantity) || quantity < 1 || !Number.isFinite(amount) || amount <= 0 || !type) {
-      continue;
-    }
-    rules.push({ quantity: Math.floor(quantity), type, value: amount });
-  }
-  return rules.sort((a, b) => a.quantity - b.quantity);
-}
-function toCents(value) {
+function toCents2(value) {
   return Math.round(Number((value * 100).toPrecision(15)));
 }
 function roundCurrency(value) {
-  return toCents(value) / 100;
+  return toCents2(value) / 100;
 }
-function calculateDisplayLineTotal(baseUnitPrice, quantity, discountPercent, rules) {
-  const subtotalCents = toCents(baseUnitPrice) * quantity;
-  const afterPercentCents = discountPercent > 0 ? subtotalCents * (1 - discountPercent / 100) : subtotalCents;
-  return applyVolumeDiscountCents(afterPercentCents, quantity, rules) / 100;
+function calculateDisplayLineTotal(baseUnitPrice, quantity, discountPercent, rules, addonPrices = []) {
+  return calculateCatalogLinePrice({
+    unitPrice: baseUnitPrice,
+    quantity,
+    addonPrices,
+    productDiscountPercent: discountPercent,
+    volumeDiscounts: rules
+  }).total;
 }
-function applyVolumeDiscountCents(subtotalCents, quantity, rules) {
-  let matched = null;
-  for (const rule of rules) {
-    if (quantity >= rule.quantity) matched = rule;
+function parseGroupFeedback(value, context) {
+  const feedback = requireUnknownRecord(value, context);
+  const { total, average } = feedback;
+  if (typeof total !== "number" || !Number.isInteger(total) || total < 0) {
+    throw new Error(`Invalid Shoppex initial data: ${context}.total must be a non-negative integer.`);
+  }
+  if (total === 0 && average === null) return { ratingCount: 0, rating: null };
+  if (total === 0 || typeof average !== "number" || average < 1 || average > 5) {
+    throw new Error(`Invalid Shoppex initial data: ${context}.average must be null without reviews and 1-5 with them.`);
   }
-  if (!matched) return Math.max(0, Math.round(subtotalCents));
-  const discountCents = matched.type === "PERCENTAGE" ? subtotalCents * Math.min(Math.max(matched.value, 0), 100) / 100 : toCents(matched.value);
-  return Math.max(0, Math.round(subtotalCents - Math.min(discountCents, subtotalCents)));
+  return { ratingCount: total, rating: average };
 }
 function deriveProductRating(value) {
   if (!isRecord(value)) return null;
@@ -1265,6 +1405,9 @@ function validateCheckoutFieldValue(field, value) {
   }
   const normalized = value.trim();
   if (field.required && !normalized) return `${field.name} is required.`;
+  if (field.type === "select") {
+    return normalized && !(field.options ?? []).includes(normalized) ? `${field.name} must be one of the listed options.` : null;
+  }
   if (field.regex && normalized) {
     let pattern;
     try {
@@ -1520,21 +1663,11 @@ function isBlankMerchantHtml(html) {
 // src/catalog.ts
 function formatMoney(amount, currency) {
   const code = currency && currency !== "AUTO" ? currency : "USD";
-  let format;
   try {
-    format = new Intl.NumberFormat("en-US", { style: "currency", currency: code });
+    return new Intl.NumberFormat("en-US", { style: "currency", currency: code }).format(amount);
   } catch {
-    const fixed = amount.toFixed(2);
-    return `${code} ${fixed.endsWith(".00") ? fixed.slice(0, -3) : fixed}`;
-  }
-  const decimals = format.resolvedOptions().maximumFractionDigits ?? 2;
-  if (decimals === 0 || !Number.isInteger(Number(amount.toFixed(decimals)))) return format.format(amount);
-  return new Intl.NumberFormat("en-US", {
-    style: "currency",
-    currency: code,
-    minimumFractionDigits: 0,
-    maximumFractionDigits: 0
-  }).format(Math.round(amount));
+    return `${code} ${amount.toFixed(2)}`;
+  }
 }
 function formatCompactCount(value) {
   if (value >= 1e6) return `${(value / 1e6).toFixed(1)}M`;
@@ -1765,10 +1898,10 @@ function buildProductDetail(product, settings, cards) {
   };
 }
 function calculateLinePricing(product, variant, addons, quantity, payWhatYouWantPrice) {
-  const addonsTotal = addons.reduce((sum, addon) => sum + addon.price, 0);
+  const addonPrices = addons.map((addon) => addon.price);
   if (payWhatYouWantPrice !== void 0) {
-    const effectiveUnitPrice = payWhatYouWantPrice + addonsTotal;
-    const total2 = roundCurrency(effectiveUnitPrice * quantity);
+    const total2 = calculateDisplayLineTotal(payWhatYouWantPrice, quantity, 0, [], addonPrices);
+    const effectiveUnitPrice = payWhatYouWantPrice + addonPrices.reduce((sum, price) => sum + price, 0);
     return {
       total: total2,
       originalSubtotal: total2,
@@ -1777,14 +1910,15 @@ function calculateLinePricing(product, variant, addons, quantity, payWhatYouWant
       hasDiscount: false
     };
   }
-  const unitPrice = (variant?.baseUnitPrice ?? product.baseUnitPrice) + addonsTotal;
+  const unitPrice = variant?.baseUnitPrice ?? product.baseUnitPrice;
   const total = calculateDisplayLineTotal(
     unitPrice,
     quantity,
     product.discountPercent,
-    product.volumeDiscounts
+    product.volumeDiscounts,
+    addonPrices
   );
-  const originalSubtotal = calculateDisplayLineTotal(unitPrice, quantity, 0, []);
+  const originalSubtotal = calculateDisplayLineTotal(unitPrice, quantity, 0, [], addonPrices);
   return {
     total,
     originalSubtotal,
@@ -2037,6 +2171,7 @@ function CartProvider({ children }) {
       unsellableLines.current = [];
     }
   }, [rememberCartMaximum, rememberQuotedAffiliate, settleQuotedCart]);
+  const requote = useCallback(() => refreshNow(), [refreshNow]);
   const scheduleRefresh = useCallback(() => new Promise((resolve) => {
     refreshResolvers.current.push(resolve);
     if (refreshTimer.current !== null) {
@@ -2097,6 +2232,9 @@ function CartProvider({ children }) {
     }
     const { min: minimum, max: maximum } = resolveQuantityBounds(product, variant);
     const addons = withRequiredAddons(product, options?.addons ?? []);
+    if (addonChoiceMissing(product, addons)) {
+      throw new Error(`Choose an add-on for ${product.name} to continue.`);
+    }
     const payWhatYouWantPrice = options?.payWhatYouWantPrice ?? (product.payWhatYouWant ? resolvePayWhatYouWantMinimum(product, variant) : void 0);
     const addonsUnitPrice = addons.reduce((sum, addon) => sum + addon.price, 0);
     const unitPriceSnapshot = payWhatYouWantPrice !== void 0 ? payWhatYouWantPrice + addonsUnitPrice : calculateLinePricing(product, variant, addons, quantity).effectiveUnitPrice;
@@ -2132,7 +2270,7 @@ function CartProvider({ children }) {
   }, [mutate]);
   const addBundleMember = useCallback(async (item) => {
     const member = resolveBundleMember(item);
-    if (member === null || member.product.onHold || isSelectionSoldOut(member.product, member.variant)) {
+    if (member === null || member.product.onHold || isSelectionSoldOut(member.product, member.variant) || addonChoiceMissing(member.product, withRequiredAddons(member.product, []))) {
       throw new Error(`${item.title} is not available and was not added to your cart.`);
     }
     const { bounds } = member;
@@ -2375,6 +2513,7 @@ function CartProvider({ children }) {
     count,
     quote,
     quoteError,
+    requote,
     mutationError,
     couponRejected,
     quotedAmbientAffiliate,
@@ -2421,6 +2560,7 @@ function CartProvider({ children }) {
     quotedAmbientAffiliate,
     remove,
     removeCoupon,
+    requote,
     selfReferralBlocked,
     update
   ]);
@@ -2435,6 +2575,10 @@ function withRequiredAddons(product, chosen) {
   const ids = new Set(chosen.map((addon) => addon.id));
   return [...chosen, ...product.addons.filter((addon) => addon.required && !ids.has(addon.id))];
 }
+function addonChoiceMissing(product, chosen) {
+  if (!product.addonsRequired || product.addons.length === 0) return false;
+  return !chosen.some((addon) => product.addons.some((offered) => offered.id === addon.id));
+}
 function startCartMutation(mutation) {
   void mutation.catch(() => void 0);
 }
@@ -2469,7 +2613,7 @@ function buildCartView(lines) {
       subtitle: lineSubtitle(line),
       imageUrl: line.image_url?.trim() || null,
       quantity,
-      lineTotal: roundCurrency((unitPrice ?? 0) * quantity),
+      lineTotal: calculateDisplayLineTotal(unitPrice ?? 0, quantity, 0, []),
       canDecrease: quantity > minimumQuantity,
       canIncrease: quantity < maximumQuantity,
       minimumQuantity
@@ -2945,6 +3089,7 @@ export {
   accountRouteMessage,
   accountTabHref,
   accountTabLabelKey,
+  addonChoiceMissing,
   averageRating,
   badgesForCard,
   badgesForProductPage,